新功能

src/pages/modules/warn-modal.vue

@@ -0,0 +1,67 @@
+<template>
+  <el-dialog
+    class="warn_modal"
+    :title="$t('Configuration')"
+    :visible.sync="dialogVisible"
+    width="70%"
+    :before-close="handleClose">
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="图文说明" name="1">
+        <p class="tip">障碍物告警</p>
+        <p class="p1">处理方法</p>
+        <p class="p2">1.查看避障传感器</p>
+        <img src="../../images/new/bg1.png" alt="">
+      </el-tab-pane>
+      <el-tab-pane label="视频说明" name="2">
+        <video src=""></video>
+      </el-tab-pane>
+    </el-tabs>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      dialogVisible: false,
+      activeName: '1'
+    }
+  },
+  methods: {
+    init () {
+      this.dialogVisible = true
+    },
+    handleClick (tab, event) {
+      console.log(tab, event)
+    },
+    handleClose (done) {
+      this.visible = false
+      done()
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.el-dialog__header
+  padding 0.2rem 0.2rem 0.3rem
+.tip
+  font-size .2rem
+  font-weight 700
+  font-family 'SourceHanSansCN-Bold'
+  line-height .2rem
+  color #E54F29
+  text-align center
+  border-bottom 1px dashed #85DFFF
+  padding .2rem
+  margin-bottom .2rem
+.p1
+  font-size .18rem
+  line-height .2rem
+  color #fff
+  margin-bottom .2rem
+.p2
+  font-size .16rem
+  line-height .2rem
+  color #fff
+</style>