单独构建大屏ui库,避免引入混乱

ui/dv/AiMonitor/AiMonitor.vue

@@ -0,0 +1,67 @@
+<template>
+  <section class="AiMonitor">
+    <template v-if="type=='cmcc'">
+      <iframe v-if="cmccUrl" :src="cmccUrl" allow="autoplay *; microphone *; fullscreen *" allowfullscreen
+              allowtransparency allowusermedia frameBorder="no"/>
+    </template>
+    <hikversion-monitor v-else-if="type=='hik'" :src="src"/>
+    <dhVideo v-else-if="type=='dahua'" :src="src"/>
+    <slwVideo v-else-if="type=='slw'" :src="src"/>
+  </section>
+</template>
+
+<script>
+import HikversionMonitor from "./hikversionMonitor";
+import dhVideo from "./dhVideo";
+import slwVideo from "./slwVideo";
+import request from "dui/lib/js/request";
+
+export default {
+  name: "AiMonitor",
+  components: {HikversionMonitor, dhVideo, slwVideo},
+  props: {
+    /**
+     * 视频源
+     */
+    src: {default: ""},
+    /**
+     * 组件类型
+     * cmcc 中移物联,hik 海康威视
+     * @values cmcc,hik
+     */
+    type: {default: "cmcc"},
+  },
+  data() {
+    return {
+      cmccUrl: ""
+    }
+  },
+  methods: {
+    getCmccURL() {
+      const {did} = this.$attrs
+      request.post(`/app/appzyvideoequipment/getWebSdkUrl?deviceId=${did}`).then(res => {
+        if (res.code == 0) {
+          this.cmccUrl = JSON.parse(res.data).url
+        }
+      }).finally(() => this.cmccUrl = this.cmccUrl || this.src)
+    }
+  },
+  created() {
+    this.getCmccURL()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiMonitor {
+  width: 100%;
+  height: 100%;
+  min-width: 100px;
+  min-height: 60px;
+
+  iframe {
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>