悬浮窗口

src/page/index/index.vue

@@ -57,6 +57,16 @@
         <!-- </el-row> -->
       </div>
     </el-dialog>
+    <el-dialog
+      title="诊间报警"
+      :visible.sync="dialogWarnVisible"
+      width="1000px"
+      class="warn_dialog"
+      :lock-scroll="true"
+    >
+      <iframe src="http://192.168.131.107:9000/vocalldemo/index.html" frameborder="0" width="1000px" height="600px"></iframe>
+    </el-dialog>
+    <div class="warn_box" @click="showWarn"></div>
   </div>
 </template>
 
@@ -104,7 +114,8 @@
         alarmInfo:'',
         isShowAlarm:false,
         timer:null,
-        isLoop:false
+        isLoop:false,
+        dialogWarnVisible: false
       };
     },
     beforeCreate(){
@@ -166,6 +177,9 @@
       window.removeEventListener('onmessageWS', this.getSocketData);
     },
     methods: {
+      showWarn() {
+        this.dialogWarnVisible = true;
+      },
       getAlarmInfo(){
         getAlarm().then(res =>{
           console.log(res)
@@ -426,6 +440,21 @@
     }
   }
  } 
+ .warn_dialog {
+    .el-dialog__body{
+      padding: 0 !important;
+    }
+  }
+  .warn_box{
+    position: fixed;
+    right: 20px;
+    bottom: 100px;
+    width:100px;
+    height:100px;
+    border-radius:50px;
+    background: red;
+    z-index: 999;
+  }
 </style>
 <style lang="scss">
   .video_diao{

vocalldemo/index.html

@@ -8,6 +8,7 @@
     html,
     body {
       height: 100%;
+      min-height: 800px;
     }
 
     body {