Browse Source

1. 保德基金添加iframe组件
2. 所有模型电子屏底部文字改为配置

hongrunxia 10 tháng trước cách đây
mục cha
commit
5023fb8d76
31 tập tin đã thay đổi với 1511 bổ sung1285 xóa
  1. 44 33
      src/store/modules/permission.ts
  2. 26 28
      src/views/super/drag/page/components/DragPageModal.vue
  3. 2 2
      src/views/vent/home/clique/dustComponents/billboard.vue
  4. 2 1
      src/views/vent/home/clique/dustComponents/measure-detail.vue
  5. 547 527
      src/views/vent/home/clique/dustComponents/mine-wind.vue
  6. 2 1
      src/views/vent/home/clique/dustComponents/risk-warn.vue
  7. 11 3
      src/views/vent/home/configurable/dustBD.vue
  8. 15 4
      src/views/vent/home/configurable/fireBD.vue
  9. 597 578
      src/views/vent/home/dustInfoTj/index.vue
  10. 9 2
      src/views/vent/monitorManager/fanLocalMonitor/fanLocal.three.ts
  11. 4 2
      src/views/vent/monitorManager/fanLocalMonitor1/components/fanlocal-operate-history.vue
  12. 9 2
      src/views/vent/monitorManager/fanLocalMonitor1/fanLocal.three.ts
  13. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.noStation.ts
  14. 10 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.qd.ts
  15. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.three.ts
  16. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.two.ss.ts
  17. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.two.yj.ts
  18. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.xc.ts
  19. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.xr.ts
  20. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.yj.ts
  21. 9 2
      src/views/vent/monitorManager/gateMonitor/gate.threejs.yy.ts
  22. 80 66
      src/views/vent/monitorManager/gateMonitor/index.vue
  23. 9 2
      src/views/vent/monitorManager/windowMonitor/dandaoFc.threejs.ts
  24. 9 2
      src/views/vent/monitorManager/windowMonitor/dandaoFcBet.threejs.ts
  25. 9 2
      src/views/vent/monitorManager/windowMonitor/shuangdaoFc.threejs.ts
  26. 9 2
      src/views/vent/monitorManager/windowMonitorBet/dandaoFc.threejs.ts
  27. 9 2
      src/views/vent/monitorManager/windowMonitorBet/dandaoFcBet.threejs.ts
  28. 9 2
      src/views/vent/monitorManager/windowMonitorBet/dandaoFcBetZh.threejs.ts
  29. 9 2
      src/views/vent/monitorManager/windowMonitorBet/shuangdaoFc.threejs.ts
  30. 9 2
      src/views/vent/monitorManager/windrectMonitor/dantou.threejs.ts
  31. 9 2
      src/views/vent/monitorManager/windrectMonitor/duisheFixed.threejs.ts

+ 44 - 33
src/store/modules/permission.ts

@@ -225,42 +225,53 @@ export const usePermissionStore = defineStore({
           try {
             this.changePermissionCode();
             routeList = (await getMenuList()) as AppRouteRecordRaw[];
-            // update-begin----author:sunjianlei---date:20220315------for: 判断是否是 vue3 版本的菜单 ---
-            let hasIndex = false;
-            let hasIcon = false;
-            for (const menuItem of routeList) {
-              // 条件1:判断组件是否是 layouts/default/index
-              if (!hasIndex) {
-                hasIndex =
-                  menuItem.component === 'layouts/default/index' ||
-                  menuItem.component === 'layouts/RouteView' ||
-                  menuItem.path === '/dashboard/analysis';
-              }
-              // 条件2:判断图标是否带有 冒号
-              if (!hasIcon) {
-                hasIcon = !!menuItem.meta?.icon?.includes(':');
+
+            if (routeList.length < 1) {
+              createWarningModal({
+                title: '检测提示',
+                content: '当前用户未分配菜单权限',
+                onOk: function () {
+                  userStore.logout();
+                },
+              });
+            } else {
+              // update-begin----author:sunjianlei---date:20220315------for: 判断是否是 vue3 版本的菜单 ---
+              let hasIndex = false;
+              let hasIcon = false;
+              for (const menuItem of routeList) {
+                // 条件1:判断组件是否是 layouts/default/index
+                if (!hasIndex) {
+                  hasIndex =
+                    menuItem.component === 'layouts/default/index' ||
+                    menuItem.component === 'layouts/RouteView' ||
+                    menuItem.path === '/dashboard/analysis';
+                }
+                // 条件2:判断图标是否带有 冒号
+                if (!hasIcon) {
+                  hasIcon = !!menuItem.meta?.icon?.includes(':');
+                }
+                // 满足任何一个条件都直接跳出循环
+                if (hasIcon || hasIndex) {
+                  break;
+                }
               }
-              // 满足任何一个条件都直接跳出循环
-              if (hasIcon || hasIndex) {
-                break;
+              // 两个条件都不满足,就弹出提示框
+              if (!hasIcon && !hasIndex) {
+                // 延迟1.5秒之后再出现提示,否则提示框出不来
+                setTimeout(
+                  () =>
+                    createWarningModal({
+                      title: '检测提示',
+                      content: '当前菜单表是 <b>Vue2版本</b>,导致菜单加载异常!<br>点击确认,切换到Vue3版菜单!',
+                      onOk: function () {
+                        switchVue3Menu();
+                        location.reload();
+                      },
+                    }),
+                  1000
+                );
               }
             }
-            // 两个条件都不满足,就弹出提示框
-            if (!hasIcon && !hasIndex) {
-              // 延迟1.5秒之后再出现提示,否则提示框出不来
-              setTimeout(
-                () =>
-                  createWarningModal({
-                    title: '检测提示',
-                    content: '当前菜单表是 <b>Vue2版本</b>,导致菜单加载异常!<br>点击确认,切换到Vue3版菜单!',
-                    onOk: function () {
-                      switchVue3Menu();
-                      location.reload();
-                    },
-                  }),
-                1000
-              );
-            }
             // update-end----author:sunjianlei---date:20220315------for: 判断是否是 vue3 版本的菜单 ---
           } catch (error) {
             console.error(error);

+ 26 - 28
src/views/super/drag/page/components/DragPageModal.vue

@@ -11,29 +11,28 @@
     defaultFullscreen
     destroyOnClose
   >
-    <div id="dragEngineBox" style="height:100vh;overflow-y: auto">
+    <div id="dragEngineBox" style="height: 100vh; overflow-y: auto">
       <DragEngine
-          v-if="refresh"
-          :dragData="dragData"
-          :pageId="pageId"
-          :token="getToken()"
-          :tenantId="getTenantId()"
-          :lowAppId="lowAppId"
-          :isLowApp="false"
-          @save="handleSave"
-          @close="handleClose"
-          @scroll="handleScroll"
-          @openWindow="openWindow"
-      >
-      </DragEngine>
+        v-if="refresh"
+        :dragData="dragData"
+        :pageId="pageId"
+        :token="getToken()"
+        :tenantId="getTenantId()"
+        :lowAppId="lowAppId"
+        :isLowApp="false"
+        @save="handleSave"
+        @close="handleClose"
+        @scroll="handleScroll"
+        @openWindow="openWindow"
+      />
     </div>
   </BasicModal>
-  <PasswordModal ref="passwordRef" @closed="closeModal"></PasswordModal>
+  <PasswordModal ref="passwordRef" @closed="closeModal" />
 </template>
 
 <script lang="ts" setup>
-  import { ref, unref, reactive, nextTick,computed } from 'vue';
-  import { getToken,getTenantId } from '/@/utils/auth';
+  import { ref, unref, reactive, nextTick, computed } from 'vue';
+  import { getToken, getTenantId } from '/@/utils/auth';
   import { queryById } from '../page.api';
   import { BasicModal, useModalInner } from '/src/components/Modal';
   import { getCacheByDynKey } from '/@/utils/auth';
@@ -50,9 +49,8 @@
   const props = defineProps({
     lowAppId: { type: String },
     // 是否低代码模式(简化使用难度)
-    isLowApp: { type: Boolean, default: true }
+    isLowApp: { type: Boolean, default: true },
   });
-  
 
   //页面Id
   const pageId = ref('');
@@ -117,7 +115,7 @@
   function handleClose() {
     closeModal();
     emit('success');
-    emit('close')
+    emit('close');
   }
   /**
    * 保存布局后的回调事件
@@ -133,20 +131,20 @@
    * @param data
    */
   function handleScroll(scrollHeight) {
-    let dom = document.getElementById("dragEngineBox");
-    scrollIntoView(dom,scrollHeight)
+    let dom = document.getElementById('dragEngineBox');
+    scrollIntoView(dom, scrollHeight);
   }
-  
+
   /**
    * 模拟滚动效果
    * @param element 滚动元素
    * @param scrollHeight 滚动高度
    */
-  function scrollIntoView(element,scrollHeight) {
+  function scrollIntoView(element, scrollHeight) {
     // 当前滚动高度
     let scrollTop = element.scrollTop;
     // 滚动step方法
-    const step = () =>{
+    const step = () => {
       // 距离目标滚动距离
       let distance = scrollHeight - scrollTop;
       // 目标需要滚动的距离,也就是只走全部距离的十分之一
@@ -165,13 +163,13 @@
    * 打开分享
    * @param url
    */
-  function openWindow(url){
+  function openWindow(url) {
     window.open(url, '_blank');
   }
 </script>
 <style lang="less">
   @import '@qiaoqiaoyun/drag-free/lib/index.css';
-  
+
   .drag-design-process-modal {
     .ant-modal-header {
       padding: 0 !important;
@@ -179,7 +177,7 @@
     .ant-modal-body > .scrollbar {
       padding-top: 0;
     }
-    
+
     .jeecg-modal-content > .scroll-container {
       padding: 0 !important;
     }

+ 2 - 2
src/views/vent/home/clique/dustComponents/billboard.vue

@@ -2,7 +2,7 @@
   <div class="billboard-box">
     <div class="title">{{ title }}</div>
     <div class="billboard-content">
-      <div class="bg">
+      <div class="dust-bg">
         <div class="dust-item" @click="goDetail('dust')">粉尘看板</div>
         <div class="file-item" @click="goDetail('file')">文件看板</div>
       </div>
@@ -102,7 +102,7 @@
       flex-wrap: wrap;
       justify-content: space-between;
       align-items: center;
-      .bg {
+      .dust-bg {
         width: 391px;
         height: 189px;
         background: url('../../../../../assets/images//company/dust/dust-home-file-icon.png');

+ 2 - 1
src/views/vent/home/clique/dustComponents/measure-detail.vue

@@ -2,7 +2,7 @@
   <div class="content-box">
     <div class="title">{{ title }}</div>
     <div class="risk-select">
-      <a-select style="width: 358px; font-size: 16px" v-model:value="selectVal" allowClear class="code-mode-select" @change="changeSelect">
+      <a-select style="width: 308px; font-size: 16px" v-model:value="selectVal" allowClear class="code-mode-select" @change="changeSelect">
         <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{ item.orgname }} </a-select-option>
       </a-select>
       <ArrowRightOutlined class="go-icon" @click="goDetail()" />
@@ -152,6 +152,7 @@
         top: 8px;
         color: #fff;
         cursor: pointer;
+        font-size: 20px;
         &:hover {
           color: #00d8ff;
         }

+ 547 - 527
src/views/vent/home/clique/dustComponents/mine-wind.vue

@@ -6,6 +6,7 @@
         <div :class="activeIndex == '1' ? 'tabs-item1' : 'tabs-item'" @click="getChange('1')">信息列表</div>
         <div :class="activeIndex == '2' ? 'tabs-item1' : 'tabs-item'" @click="getChange('2')">信息统计</div>
       </div>
+      <ArrowRightOutlined class="go-icon" @click="goDetail()" />
       <!-- 信息列表 -->
       <!-- <div class="content-search" v-if="activeIndex == '1'">
         <div class="risk-select">
@@ -47,522 +48,484 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { ref, reactive, watch, defineProps, nextTick } from 'vue';
-import * as echarts from 'echarts';
-
-let props = defineProps({
-  airKjStatus: {
-    type: Array,
-    default: () => {
-      return [];
+  import { ref, reactive, watch, defineProps, nextTick } from 'vue';
+  import * as echarts from 'echarts';
+  import { useGo } from '/@/hooks/web/usePage';
+  import { ArrowRightOutlined } from '@ant-design/icons-vue';
+
+  let props = defineProps({
+    airKjStatus: {
+      type: Array,
+      default: () => {
+        return [];
+      },
     },
-  },
-});
-
-let activeIndex = ref('1');
-//获取dom元素节点
-let piebox = ref<any>();
-let pieboxall = ref<any>();
-let mineTitle = ref('矿井通风状态监测');
-// let selectVal = ref('');
-// let selectList = ref<any>([]);
-let contList = reactive<any[]>([
-  { id: '1', name: '柳塔矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '2', name: '寸草塔二矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '3', name: '布尔台矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '4', name: '乌兰木伦矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '5', name: '寸草塔矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '6', name: '石圪台矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '7', name: '补连塔矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '8', name: '哈拉沟矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '9', name: '上湾矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '10', name: '活鸡兔井', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '11', name: '大柳塔井', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '12', name: '锦界矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '13', name: '榆家梁矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-  { id: '14', name: '保德矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-]);
-let headList = reactive<any>([
-  { label: '序号' },
-  { label: '矿井名称' },
-  { label: '所属地区市/县' },
-  { label: '原煤产量/百万吨' },
-  { label: '从业人数/人' },
-  { label: '尘肺病累计病例/人' },
-  { label: '本年度尘肺病病例/人' },
-]);
-
-//tabs选项切换
-function getChange(active) {
-  activeIndex.value = active;
-  switch (activeIndex.value) {
-    case '1':
-      break;
-    case '2':
-      getOption();
-      getOptionAll();
-      break;
+  });
+  const go = useGo();
+  let activeIndex = ref('1');
+  //获取dom元素节点
+  let piebox = ref<any>();
+  let pieboxall = ref<any>();
+  let mineTitle = ref('单位管理');
+  // let selectVal = ref('');
+  // let selectList = ref<any>([]);
+  let contList = reactive<any[]>([
+    { id: '1', name: '柳塔矿', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '2', name: '寸草塔二矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '3', name: '布尔台矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '4', name: '乌兰木伦矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '5', name: '寸草塔矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '6', name: '石圪台矿', address: '陕西省榆林区', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '7', name: '补连塔矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '8', name: '哈拉沟矿', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '9', name: '上湾矿', address: '内蒙古伊金霍洛旗', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '10', name: '活鸡兔井', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '11', name: '大柳塔井', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '12', name: '锦界矿', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '13', name: '榆家梁矿', address: '陕西省神木县', production: 800, person: 1435, br: 1, brz: 1 },
+    { id: '14', name: '保德矿', address: '山西省保德县', production: 800, person: 1435, br: 1, brz: 1 },
+  ]);
+  let headList = reactive<any>([
+    { label: '序号' },
+    { label: '矿井名称' },
+    { label: '所属地区市/县' },
+    { label: '原煤产量/百万吨' },
+    { label: '从业人数/人' },
+    { label: '尘肺病累计病例/人' },
+    { label: '本年度尘肺病病例/人' },
+  ]);
+
+  //tabs选项切换
+  function getChange(active) {
+    activeIndex.value = active;
+    switch (activeIndex.value) {
+      case '1':
+        break;
+      case '2':
+        getOption();
+        getOptionAll();
+        break;
+    }
   }
-}
-//下拉框选项切换
-function changeSelect(val) { }
-function getOption() {
-  nextTick(() => {
-    let myChart = echarts.init(piebox.value);
-    let option = {
-      tooltip: {
-        trigger: 'item',
-        formatter: '{a} <br/>{b} : {c} ({d}%)',
-      },
-      color: ['#faa526', '#d5eb0f', '#afec07', '#f3f720', '#0ee93d', '#17d1b2', '#2ae271', '#11bce7', '#c127f0', '#ee125b'],
-      title: {
-        text: '陕西省尘肺病地区比例分析',
-        left: 'center',
-        top: 5,
-        textStyle: {
-          color: '#00d8ff',
-          fontSize: 14,
+
+  function goDetail() {
+    //本地模拟跳转
+    go('/dustHome/infoTj/home');
+  }
+
+  //下拉框选项切换
+  function changeSelect(val) {}
+  function getOption() {
+    nextTick(() => {
+      let myChart = echarts.init(piebox.value);
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b} : {c} ({d}%)',
         },
-      },
-      legend: {
-        orient: 'vertical',
-        right: 10,
-        align: 'auto',
-        top: 'middle',
-        itemGap: 0.5,
-        textStyle: {
-          color: '#fff',
-          fontSize: 10,
+        color: ['#faa526', '#d5eb0f', '#afec07', '#f3f720', '#0ee93d', '#17d1b2', '#2ae271', '#11bce7', '#c127f0', '#ee125b'],
+        title: {
+          text: '陕西省尘肺病地区比例分析',
+          left: 'center',
+          top: 5,
+          textStyle: {
+            color: '#00d8ff',
+            fontSize: 14,
+          },
         },
-        icon: 'circle',
-        data: ['西安市', '宝鸡市', '咸阳市', '铜川市', '渭南市', '延安市', '榆林市', '汉中市', '安康市', '商洛市'],
-        // formatter: function (name) {
-        //     var oa = option.series[0].data;
-        //     var num = oa[0].value + oa[1].value + oa[2].value + oa[3].value;
-        //     for (var i = 0; i < option.series[0].data.length; i++) {
-        //         if (name == oa[i].name) {
-        //             return name + '     ' + oa[i].value + '     ' + (oa[i].value / num * 100).toFixed(2) + '%';
-        //         }
-        //     }
-        // }
-      },
-      series: [
-        {
-          name: '比例分析',
-          type: 'pie',
-          radius: '55%',
-          center: ['48%', '50%'],
-          data: [
-            { value: 335, name: '西安市' },
-            { value: 310, name: '宝鸡市' },
-            { value: 234, name: '咸阳市' },
-            { value: 135, name: '铜川市' },
-            { value: 335, name: '渭南市' },
-            { value: 310, name: '延安市' },
-            { value: 234, name: '榆林市' },
-            { value: 135, name: '汉中市' },
-            { value: 335, name: '安康市' },
-            { value: 310, name: '商洛市' },
-          ],
-
-          itemStyle: {
-            normal: {
-              label: {
-                show: true,
-                fontSize: 10,
-                color: '#fff',
-                formatter: '{b} : {d}%',
-              },
-            },
-            labelLine: {
+        legend: {
+          orient: 'vertical',
+          right: 10,
+          align: 'auto',
+          top: 'middle',
+          itemGap: 0.5,
+          textStyle: {
+            color: '#fff',
+            fontSize: 10,
+          },
+          icon: 'circle',
+          data: ['西安市', '宝鸡市', '咸阳市', '铜川市', '渭南市', '延安市', '榆林市', '汉中市', '安康市', '商洛市'],
+          // formatter: function (name) {
+          //     var oa = option.series[0].data;
+          //     var num = oa[0].value + oa[1].value + oa[2].value + oa[3].value;
+          //     for (var i = 0; i < option.series[0].data.length; i++) {
+          //         if (name == oa[i].name) {
+          //             return name + '     ' + oa[i].value + '     ' + (oa[i].value / num * 100).toFixed(2) + '%';
+          //         }
+          //     }
+          // }
+        },
+        series: [
+          {
+            name: '比例分析',
+            type: 'pie',
+            radius: '55%',
+            center: ['48%', '50%'],
+            data: [
+              { value: 335, name: '西安市' },
+              { value: 310, name: '宝鸡市' },
+              { value: 234, name: '咸阳市' },
+              { value: 135, name: '铜川市' },
+              { value: 335, name: '渭南市' },
+              { value: 310, name: '延安市' },
+              { value: 234, name: '榆林市' },
+              { value: 135, name: '汉中市' },
+              { value: 335, name: '安康市' },
+              { value: 310, name: '商洛市' },
+            ],
+
+            itemStyle: {
               normal: {
-                show: true,
-                length: 50,
-                length2: 50,
-                lineStyle: {
+                label: {
+                  show: true,
+                  fontSize: 10,
                   color: '#fff',
-                  width: 2,
+                  formatter: '{b} : {d}%',
+                },
+              },
+              labelLine: {
+                normal: {
+                  show: true,
+                  length: 50,
+                  length2: 50,
+                  lineStyle: {
+                    color: '#fff',
+                    width: 2,
+                  },
                 },
               },
             },
           },
+        ],
+      };
+      myChart.setOption(option);
+      window.onresize = function () {
+        myChart.resize();
+      };
+    });
+  }
+  function getOptionAll() {
+    nextTick(() => {
+      let scaleData = [
+        {
+          name: '横山区',
+          value: 10,
         },
-      ],
-    };
-    myChart.setOption(option);
-    window.onresize = function () {
-      myChart.resize();
-    };
-  });
-}
-function getOptionAll() {
-  nextTick(() => {
-    let scaleData = [
-      {
-        name: '横山区',
-        value: 10,
-      },
-      {
-        name: '神木市',
-        value: 10,
-      },
-      {
-        name: '府谷县',
-        value: 10,
-      },
-      {
-        name: '靖边县',
-        value: 10,
-      },
-      {
-        name: '定边县',
-        value: 10,
-      },
-      {
-        name: '绥德县',
-        value: 10,
-      },
-      {
-        name: '米脂县',
-        value: 10,
-      },
-      {
-        name: '佳县',
-        value: 10,
-      },
-      {
-        name: '吴堡县',
-        value: 10,
-      },
-      {
-        name: '清涧县',
-        value: 10,
-      },
-    ];
-    let rich = {
-      white: {
-        color: '#fff',
-        align: 'center',
-        fontSize: 12,
-        padding: [3, 0],
-      },
-    };
-    let placeHolderStyle = {
-      normal: {
-        label: {
-          show: false,
+        {
+          name: '神木市',
+          value: 10,
         },
-        labelLine: {
-          show: false,
+        {
+          name: '府谷县',
+          value: 10,
         },
-        color: 'rgba(0, 0, 0, 0)',
-        borderColor: 'rgba(0, 0, 0, 0)',
-        borderWidth: 0,
-      },
-    };
-    let data: any[] = [];
-    let color1 = [
-      'rgb(255, 153, 153)',
-      'rgb(255, 176, 63)',
-      'rgb(61, 186, 45)',
-      'rgb(43, 166, 254)',
-      'rgb(255,222,0)',
-      'rgb(255,0,0)',
-      '#faa526',
-      '#d5eb0f',
-      '#afec07',
-      '#f3f720',
-      '#0ee93d',
-      '#17d1b2',
-      '#2ae271',
-      '#11bce7',
-      '#c127f0',
-      '#ee125b',
-    ];
-
-    for (let i = 0; i < scaleData.length; i++) {
-      data.push(
         {
-          value: scaleData[i].value,
-          name: scaleData[i].name,
-          itemStyle: {
-            normal: {
-              borderWidth: 2,
-              shadowBlur: 0,
-              borderColor: color1[i],
-              shadowColor: color1[i],
-              color: color1[i],
-              opacity: 1,
-            },
+          name: '靖边县',
+          value: 10,
+        },
+        {
+          name: '定边县',
+          value: 10,
+        },
+        {
+          name: '绥德县',
+          value: 10,
+        },
+        {
+          name: '米脂县',
+          value: 10,
+        },
+        {
+          name: '佳县',
+          value: 10,
+        },
+        {
+          name: '吴堡县',
+          value: 10,
+        },
+        {
+          name: '清涧县',
+          value: 10,
+        },
+      ];
+      let rich = {
+        white: {
+          color: '#fff',
+          align: 'center',
+          fontSize: 12,
+          padding: [3, 0],
+        },
+      };
+      let placeHolderStyle = {
+        normal: {
+          label: {
+            show: false,
           },
+          labelLine: {
+            show: false,
+          },
+          color: 'rgba(0, 0, 0, 0)',
+          borderColor: 'rgba(0, 0, 0, 0)',
+          borderWidth: 0,
         },
+      };
+      let data: any[] = [];
+      let color1 = [
+        'rgb(255, 153, 153)',
+        'rgb(255, 176, 63)',
+        'rgb(61, 186, 45)',
+        'rgb(43, 166, 254)',
+        'rgb(255,222,0)',
+        'rgb(255,0,0)',
+        '#faa526',
+        '#d5eb0f',
+        '#afec07',
+        '#f3f720',
+        '#0ee93d',
+        '#17d1b2',
+        '#2ae271',
+        '#11bce7',
+        '#c127f0',
+        '#ee125b',
+      ];
+
+      for (let i = 0; i < scaleData.length; i++) {
+        data.push(
+          {
+            value: scaleData[i].value,
+            name: scaleData[i].name,
+            itemStyle: {
+              normal: {
+                borderWidth: 2,
+                shadowBlur: 0,
+                borderColor: color1[i],
+                shadowColor: color1[i],
+                color: color1[i],
+                opacity: 1,
+              },
+            },
+          },
+          {
+            value: 2,
+            name: '',
+            itemStyle: placeHolderStyle,
+          }
+        );
+      }
+      let seriesObj = [
         {
-          value: 2,
           name: '',
-          itemStyle: placeHolderStyle,
-        }
-      );
-    }
-    let seriesObj = [
-      {
-        name: '',
-        type: 'pie',
-        clockWise: false,
-        radius: [40, 75],
-        center: ['48%', '56%'],
-        hoverAnimation: false,
-        itemStyle: {
-          normal: {
-            label: {
-              show: true,
-              position: 'inner',
-              fontSize: 10,
-              color: '#fff',
-              formatter: function (params) {
-                let percent: any = 0;
-                let total = 0;
-                for (var i = 0; i < scaleData.length; i++) {
-                  total += scaleData[i].value;
-                }
-                percent = ((params.value / total) * 100).toFixed(0);
-                if (params.name !== '') {
-                  return params.name;
-                } else {
-                  return '';
-                }
+          type: 'pie',
+          clockWise: false,
+          radius: [40, 75],
+          center: ['48%', '56%'],
+          hoverAnimation: false,
+          itemStyle: {
+            normal: {
+              label: {
+                show: true,
+                position: 'inner',
+                fontSize: 10,
+                color: '#fff',
+                formatter: function (params) {
+                  let percent: any = 0;
+                  let total = 0;
+                  for (var i = 0; i < scaleData.length; i++) {
+                    total += scaleData[i].value;
+                  }
+                  percent = ((params.value / total) * 100).toFixed(0);
+                  if (params.name !== '') {
+                    return params.name;
+                  } else {
+                    return '';
+                  }
+                },
+                rich: rich,
+              },
+              labelLine: {
+                show: false,
               },
-              rich: rich,
-            },
-            labelLine: {
-              show: false,
             },
           },
+          data: data,
         },
-        data: data,
-      },
-    ];
-    let myChart = echarts.init(pieboxall.value);
-    let option = {
-      tooltip: {
-        trigger: 'item',
-        formatter: '{b} : {c} ({d}%)',
-      },
-      title: {
-        text: '榆林市尘肺病比例分析',
-        left: 'center',
-        top: 0,
-        textStyle: {
-          color: '#00d8ff',
-          fontSize: 14,
+      ];
+      let myChart = echarts.init(pieboxall.value);
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} : {c} ({d}%)',
         },
-      },
-      legend: {
-        orient: 'vertical',
-        right: 10,
-        align: 'auto',
-        top: 'middle',
-        itemGap: 0.5,
-        textStyle: {
-          color: '#fff',
-          fontSize: 10,
+        title: {
+          text: '榆林市尘肺病比例分析',
+          left: 'center',
+          top: 0,
+          textStyle: {
+            color: '#00d8ff',
+            fontSize: 14,
+          },
         },
-        icon: 'circle',
-        data: ['横山区', '神木市', '府谷县', '靖边县', '定边县', '绥德县', '米脂县', '佳县', '吴堡县', '清涧县'],
-      },
-      toolbox: {
-        show: false,
-      },
-      series: seriesObj,
-    };
-    myChart.setOption(option);
-    window.onresize = function () {
-      myChart.resize();
-    };
-  });
-}
-
-watch(
-  () => props.airKjStatus,
-  (newA, oldA) => {
-    console.log(newA, 'airKjStatus-----------');
-  },
-  {
-    immediate: true,
-    deep: true,
+        legend: {
+          orient: 'vertical',
+          right: 10,
+          align: 'auto',
+          top: 'middle',
+          itemGap: 0.5,
+          textStyle: {
+            color: '#fff',
+            fontSize: 10,
+          },
+          icon: 'circle',
+          data: ['横山区', '神木市', '府谷县', '靖边县', '定边县', '绥德县', '米脂县', '佳县', '吴堡县', '清涧县'],
+        },
+        toolbox: {
+          show: false,
+        },
+        series: seriesObj,
+      };
+      myChart.setOption(option);
+      window.onresize = function () {
+        myChart.resize();
+      };
+    });
   }
-);
+
+  watch(
+    () => props.airKjStatus,
+    (newA, oldA) => {
+      console.log(newA, 'airKjStatus-----------');
+    },
+    {
+      immediate: true,
+      deep: true,
+    }
+  );
 </script>
 <style lang="less" scoped>
-@font-face {
-  font-family: 'douyuFont';
-  src: url('../../../../assets/font/douyuFont.otf');
-}
-
-.mineWind {
-  position: relative;
-  width: 100%;
-  height: 100%;
-
-  .mine-title {
-    position: absolute;
-    left: 50px;
-    top: 12px;
-    color: #fff;
+  @font-face {
     font-family: 'douyuFont';
-    font-size: 14px;
+    src: url('../../../../assets/font/douyuFont.otf');
   }
 
-  .mine-content {
+  .mineWind {
+    position: relative;
+    width: 100%;
     height: 100%;
-    padding: 40px 0px 28px 0px;
-    box-sizing: border-box;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-
-    .content-tabs {
-      width: 100%;
-      height: 45px;
-      padding: 0px 30px;
-      display: flex;
-      align-items: center;
-
-      .tabs-item {
-        color: #fff;
-        cursor: pointer;
 
-        &:nth-child(1) {
-          margin-right: 10px;
-        }
-      }
-
-      .tabs-item1 {
-        color: rgba(0, 216, 255);
-        cursor: pointer;
-        border-bottom: 2px solid;
-        border-image: linear-gradient(to right, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
-        margin-right: 10px;
-      }
+    .mine-title {
+      position: absolute;
+      left: 50px;
+      top: 12px;
+      color: #fff;
+      font-family: 'douyuFont';
+      font-size: 14px;
     }
 
-    // .content-search {
-    //   position: relative;
-    //   width: 100%;
-    //   height: 35px;
-    //   margin-bottom: 10px;
-    //   // padding: 0px 30px;
-    //   display: flex;
-    //   align-items: center;
-
-    //   .risk-select {
-    //     position: absolute;
-    //     width: 90%;
-    //     height: 30px;
-    //     left: 50%;
-    //     transform: translate(-50%, 0);
-    //     top: 0px;
-    //     background: url('../../../../../assets/images/company/content-label.png') no-repeat center;
-    //     background-size: 100% 100%;
-    //     z-index: 9999;
-
-    //     .zxm-select {
-    //       position: absolute;
-    //       top: 50%;
-    //       transform: translate(0, -50%);
-
-    //       &:nth-child(1) {
-    //         left: 10px;
-    //       }
-
-    //       &:nth-child(2) {
-    //         left: 135px;
-    //       }
-
-    //       &:nth-child(3) {
-    //         left: 260px;
-    //       }
-    //     }
-    //   }
-    // }
-
-    .content-table {
-      position: relative;
-      width: 90%;
-      height: calc(100% - 45px);
-      margin: 0px 30px;
-      border: 1px solid rgba(0, 216, 255, 0.3);
-
-      .table-head {
+    .mine-content {
+      height: 100%;
+      padding: 40px 0px 28px 0px;
+      box-sizing: border-box;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+
+      .content-tabs {
+        width: 100%;
+        height: 45px;
+        padding: 0px 30px;
         display: flex;
-        justify-content: space-between;
-        height: 50px;
-        border-bottom: 1px solid rgba(0, 216, 255, 0.3);
+        align-items: center;
 
-        .head-item {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          height: 100%;
-          color: rgba(0, 216, 255);
-          font-size: 12px;
-          border-right: 1px solid rgba(0, 216, 255, 0.1);
+        .tabs-item {
+          color: #fff;
+          cursor: pointer;
 
           &:nth-child(1) {
-            width: 20px;
-            text-align: center;
-          }
-
-          &:nth-child(2) {
-            width: 38px;
-            text-align: center;
-          }
-
-          &:nth-child(3) {
-            width: 57px;
-            text-align: center;
-          }
-
-          &:nth-child(4) {
-            width: 57px;
-            text-align: center;
-          }
-
-          &:nth-child(5) {
-            width: 57px;
-            text-align: center;
-          }
-
-          &:nth-child(6) {
-            width: 77px;
-            text-align: center;
+            margin-right: 10px;
           }
+        }
 
-          &:nth-child(7) {
-            width: 77px;
-            text-align: center;
-          }
+        .tabs-item1 {
+          color: rgba(0, 216, 255);
+          cursor: pointer;
+          border-bottom: 2px solid;
+          border-image: linear-gradient(to right, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
+          margin-right: 10px;
+        }
+      }
+      .go-icon {
+        position: absolute;
+        right: 22px;
+        top: 55px;
+        color: #fff;
+        cursor: pointer;
+        font-size: 20px;
+        &:hover {
+          color: #00d8ff;
         }
       }
 
-      .table-cont {
-        height: calc(100% - 51px);
-
-        overflow-y: auto;
-
-        .cont-item {
+      // .content-search {
+      //   position: relative;
+      //   width: 100%;
+      //   height: 35px;
+      //   margin-bottom: 10px;
+      //   // padding: 0px 30px;
+      //   display: flex;
+      //   align-items: center;
+
+      //   .risk-select {
+      //     position: absolute;
+      //     width: 90%;
+      //     height: 30px;
+      //     left: 50%;
+      //     transform: translate(-50%, 0);
+      //     top: 0px;
+      //     background: url('../../../../../assets/images/company/content-label.png') no-repeat center;
+      //     background-size: 100% 100%;
+      //     z-index: 9999;
+
+      //     .zxm-select {
+      //       position: absolute;
+      //       top: 50%;
+      //       transform: translate(0, -50%);
+
+      //       &:nth-child(1) {
+      //         left: 10px;
+      //       }
+
+      //       &:nth-child(2) {
+      //         left: 135px;
+      //       }
+
+      //       &:nth-child(3) {
+      //         left: 260px;
+      //       }
+      //     }
+      //   }
+      // }
+
+      .content-table {
+        position: relative;
+        width: 90%;
+        height: calc(100% - 45px);
+        margin: 0px 30px;
+        border: 1px solid rgba(0, 216, 255, 0.3);
+
+        .table-head {
           display: flex;
           justify-content: space-between;
-          height: 32.5px;
-          border-bottom: 1px solid rgba(0, 216, 255, 0.1);
+          height: 50px;
+          border-bottom: 1px solid rgba(0, 216, 255, 0.3);
 
-          .item-val {
+          .head-item {
             display: flex;
             align-items: center;
             justify-content: center;
             height: 100%;
+            color: rgba(0, 216, 255);
             font-size: 12px;
             border-right: 1px solid rgba(0, 216, 255, 0.1);
-            color: #fff;
 
             &:nth-child(1) {
               width: 20px;
@@ -597,82 +560,139 @@ watch(
             &:nth-child(7) {
               width: 77px;
               text-align: center;
-              border-right: none;
             }
           }
+        }
 
-          .item-val1 {
+        .table-cont {
+          height: calc(100% - 51px);
+
+          overflow-y: auto;
+
+          .cont-item {
             display: flex;
-            align-items: center;
-            justify-content: center;
-            height: 100%;
-            font-size: 12px;
-            color: #fff;
-            width: 67px;
-            text-align: center;
-            border-right: none;
+            justify-content: space-between;
+            height: 32.5px;
+            border-bottom: 1px solid rgba(0, 216, 255, 0.1);
+
+            .item-val {
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              height: 100%;
+              font-size: 12px;
+              border-right: 1px solid rgba(0, 216, 255, 0.1);
+              color: #fff;
+
+              &:nth-child(1) {
+                width: 20px;
+                text-align: center;
+              }
+
+              &:nth-child(2) {
+                width: 38px;
+                text-align: center;
+              }
+
+              &:nth-child(3) {
+                width: 57px;
+                text-align: center;
+              }
+
+              &:nth-child(4) {
+                width: 57px;
+                text-align: center;
+              }
+
+              &:nth-child(5) {
+                width: 57px;
+                text-align: center;
+              }
+
+              &:nth-child(6) {
+                width: 77px;
+                text-align: center;
+              }
+
+              &:nth-child(7) {
+                width: 77px;
+                text-align: center;
+                border-right: none;
+              }
+            }
+
+            .item-val1 {
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              height: 100%;
+              font-size: 12px;
+              color: #fff;
+              width: 67px;
+              text-align: center;
+              border-right: none;
+            }
           }
         }
       }
-    }
-
-    .echart-box {
-      width: 100%;
-      height: 205px;
 
-      .piebox {
+      .echart-box {
         width: 100%;
-        height: 100%;
-      }
-    }
+        height: 205px;
 
-    .echart-all-box {
-      width: 100%;
-      height: calc(100% - 250px);
+        .piebox {
+          width: 100%;
+          height: 100%;
+        }
+      }
 
-      .pieboxall {
+      .echart-all-box {
         width: 100%;
-        height: 100%;
+        height: calc(100% - 250px);
+
+        .pieboxall {
+          width: 100%;
+          height: 100%;
+        }
       }
     }
   }
-}
-
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector {
-  height: 24px;
-}
-
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector .zxm-select-selection-search-input {
-  height: 24px;
-}
-
-::v-deep .zxm-select-selection-placeholder {
-  color: #fff !important;
-  line-height: 22px !important;
-}
-
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector::after {
-  line-height: 24px;
-}
-
-::v-deep .zxm-select:not(.zxm-select-customize-input) .zxm-select-selector {
-  background-color: transparent;
-  border-top: 0px;
-  border-bottom: 0px;
-  border-left: 2px solid;
-  border-right: 2px solid;
-  border-image: linear-gradient(to bottom, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
-}
-
-::v-deep .zxm-select-arrow {
-  color: #fff !important;
-}
-
-::v-deep .zxm-select-selection-item {
-  color: #fff !important;
-}
-
-::v-deep .zxm-select-single .zxm-select-selector .zxm-select-selection-item {
-  line-height: 24px !important;
-}
+
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector {
+    height: 24px;
+  }
+
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector .zxm-select-selection-search-input {
+    height: 24px;
+  }
+
+  ::v-deep .zxm-select-selection-placeholder {
+    color: #fff !important;
+    line-height: 22px !important;
+  }
+
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector::after {
+    line-height: 24px;
+  }
+
+  ::v-deep .zxm-select:not(.zxm-select-customize-input) .zxm-select-selector {
+    background-color: transparent;
+    border-top: 0px;
+    border-bottom: 0px;
+    border-left: 2px solid;
+    border-right: 2px solid;
+    border-image: linear-gradient(to bottom, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
+  }
+
+  ::v-deep .zxm-select-arrow {
+    color: #fff !important;
+  }
+
+  ::v-deep .zxm-select-selection-item {
+    color: #fff !important;
+  }
+
+  ::v-deep .zxm-select-single .zxm-select-selector .zxm-select-selection-item {
+    line-height: 24px !important;
+  }
 </style>

+ 2 - 1
src/views/vent/home/clique/dustComponents/risk-warn.vue

@@ -2,7 +2,7 @@
   <div class="riskWarn">
     <div class="risk-title">{{ riskTitle }}</div>
     <div class="risk-select">
-      <a-select style="width: 358px" v-model:value="selectVal" allowClear class="code-mode-select" @change="changeSelect">
+      <a-select style="width: 308px" v-model:value="selectVal" allowClear class="code-mode-select" @change="changeSelect">
         <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{ item.orgname }} </a-select-option>
       </a-select>
       <ArrowRightOutlined class="go-icon" @click="goDetail()" />
@@ -206,6 +206,7 @@
         top: 8px;
         color: #fff;
         cursor: pointer;
+        font-size: 20px;
         &:hover {
           color: #00d8ff;
         }

+ 11 - 3
src/views/vent/home/configurable/dustBD.vue

@@ -54,7 +54,8 @@
       :page-type="pageType"
     />
     <div style="width: 1000px; height: 570px; position: absolute; left: calc(50% - 500px); top: 60px">
-      <VentModal />
+      <!-- <VentModal /> -->
+      <iframe style="width: 1000px; height: 570px" :src="iframeUrl" ref="frameRef" @load="hideLoading"></iframe>
     </div>
   </div>
 </template>
@@ -65,9 +66,14 @@
   // import { useInitConfigs } from './hooks/useInit';
   import ModuleBD from './components/ModuleBD.vue';
   import { testConfigBDDust } from './configurable.data';
-  import VentModal from '/@/components/vent/micro/ventModal.vue';
+  // import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getBDDustData } from './configurable.api';
+  import { getToken } from '/@/utils/auth';
 
+  const iframeUrl = ref(
+    `${location.protocol}//${location.hostname}:8091/dashboard/analysis?type=empty&deviceType=empty&showid=1&token=${getToken()}`
+  );
+  const loading = ref(true);
   const mainTitle = ref('保德煤矿粉尘灾害预警系统');
   const pageType = 'BD_dust';
 
@@ -76,7 +82,9 @@
   const configs = ref(testConfigBDDust);
   // const { configs, fetchConfigs } = useInitConfigs();
   const homedata = ref<any>({});
-
+  function hideLoading() {
+    loading.value = false;
+  }
   onMounted(() => {
     // configs.value = testConfigB;
     getBDDustData({}).then((r) => {

+ 15 - 4
src/views/vent/home/configurable/fireBD.vue

@@ -65,7 +65,8 @@
       :page-type="pageType"
     />
     <div style="width: 1000px; height: 570px; position: absolute; left: calc(50% - 500px); top: 60px">
-      <VentModal />
+      <!-- <VentModal /> -->
+      <iframe style="width: 1000px; height: 570px" :src="iframeUrl" ref="frameRef" @load="hideLoading"></iframe>
     </div>
   </div>
 </template>
@@ -77,12 +78,19 @@
   import ModuleBD from './components/ModuleBD.vue';
   import ModuleBDDual from './components/ModuleBDDual.vue';
   import { testConfigBDFire } from './configurable.data';
-  import VentModal from '/@/components/vent/micro/ventModal.vue';
+  // import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getBDFireData } from './configurable.api';
+  import { getToken } from '/@/utils/auth';
 
+  // import FramePage from '/@/views/sys/iframe/index.vue';
+  const frameRef = ref();
   const mainTitle = ref('保德煤矿火灾预警系统');
   const pageType = 'BD_fire';
-
+  const loading = ref(true);
+  const iframeUrl = ref(
+    `${location.protocol}//${location.hostname}:8091/dashboard/analysis?type=empty&deviceType=empty&showid=1&token=${getToken()}`
+  ); //正式时用 `${location.protocol}//${location.hostname}:8091/url`
+  // const url = ref('http://localhost:8088/');
   // const moduleCodes = ['fanlocal', 'fanmain' /** 'vc', 'ar', 'va', 'ws', 'dw' */];
 
   const configs = ref(
@@ -101,11 +109,14 @@
     })
   );
   // const { configs, fetchConfigs } = useInitConfigs();
-
+  function hideLoading() {
+    loading.value = false;
+  }
   const homedata = ref<any>({});
 
   onMounted(() => {
     // configs.value = testConfigB;
+
     getBDFireData({}).then((r) => {
       homedata.value = r;
     });

+ 597 - 578
src/views/vent/home/dustInfoTj/index.vue

@@ -1,92 +1,131 @@
 <template>
-    <div class="dustInfoTj">
-        <customHeader>安全监控新增列表</customHeader>
-        <div class="tj-content">
-            <div class="mine-content">
-                <div class="content-tabs">
-                    <div :class="activeIndex == '1' ? 'tabs-item1' : 'tabs-item'" @click="getChange('1')">信息列表</div>
-                    <div :class="activeIndex == '2' ? 'tabs-item1' : 'tabs-item'" @click="getChange('2')">信息统计</div>
-                </div>
-                <!-- 信息列表 -->
-                <div class="content-search" v-if="activeIndex == '1'">
-                    <div class="risk-select">
-                        <a-select style="width: 220px" v-model:value="selectVal" allowClear class="code-mode-select"
-                            @change="changeSelect">
-                            <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{
-                                item.orgname }} </a-select-option>
-                        </a-select>
-                        <a-select style="width: 220px" v-model:value="selectVal" allowClear class="code-mode-select"
-                            @change="changeSelect">
-                            <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{
-                                item.orgname }} </a-select-option>
-                        </a-select>
-                        <a-select style="width: 220px" v-model:value="selectVal" allowClear class="code-mode-select"
-                            @change="changeSelect">
-                            <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{
-                                item.orgname }} </a-select-option>
-                        </a-select>
-                        <a-select style="width: 220px" v-model:value="selectVal" allowClear class="code-mode-select"
-                            @change="changeSelect">
-                            <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{
-                                item.orgname }} </a-select-option>
-                        </a-select>
-                        <a-select style="width: 220px" v-model:value="selectVal" allowClear class="code-mode-select"
-                            @change="changeSelect">
-                            <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode">{{
-                                item.orgname }} </a-select-option>
-                        </a-select>
-                    </div>
-                </div>
-                <div class="content-table" v-if="activeIndex == '1'">
-                    <div class="table-head">
-                        <div class="head-item" v-for="(ite, ind) in headList" :key="ind">{{ ite.label }}</div>
-                    </div>
-                    <div class="table-cont">
-                        <div class="cont-item" v-for="(item, index) in contList" :key="index">
-                            <div class="item-val">{{ item.id }}</div>
-                            <div class="item-val">{{ item.name }}</div>
-                            <div class="item-val">{{ item.address }}</div>
-                            <div class="item-val">{{ item.production }}</div>
-                            <div class="item-val">{{ item.person }}</div>
-                            <div class="item-val">{{ item.br }}</div>
-                            <div :class="contList.length > 18 ? 'item-val1' : 'item-val'">{{ item.brz }}</div>
-                        </div>
-                    </div>
-                </div>
-                <!-- 统计信息 -->
-                <div class="echart-box" v-if="activeIndex == '2'">
-                    <div class="piebox" ref="piebox"></div>
-                </div>
-                <div class="echart-all-box" v-if="activeIndex == '2'">
-                    <div class="pieboxall" ref="pieboxall"></div>
-                </div>
+  <div class="dustInfoTj">
+    <customHeader>安全监控新增列表</customHeader>
+    <div class="tj-content">
+      <div class="mine-content">
+        <div class="content-tabs">
+          <div :class="activeIndex == '1' ? 'tabs-item1' : 'tabs-item'" @click="getChange('1')">信息列表</div>
+          <div :class="activeIndex == '2' ? 'tabs-item1' : 'tabs-item'" @click="getChange('2')">信息统计</div>
+        </div>
+        <!-- 信息列表 -->
+        <div class="content-search" v-if="activeIndex == '1'">
+          <div class="risk-select">
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="查询类别"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="地区分布"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="原煤产量"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="发病等级"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="时间起点"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+            <a-select
+              style="width: 220px"
+              v-model:value="selectVal"
+              allowClear
+              placeholder="时间终点"
+              class="code-mode-select"
+              @change="changeSelect"
+            >
+              <a-select-option v-for="item in selectList" :key="item.orgname" :value="item.orgcode" />
+            </a-select>
+          </div>
+        </div>
+        <div class="content-table" v-if="activeIndex == '1'">
+          <div class="table-head">
+            <div class="head-item" v-for="(ite, ind) in headList" :key="ind">{{ ite.label }}</div>
+          </div>
+          <div class="table-cont">
+            <div class="cont-item" v-for="(item, index) in contList" :key="index">
+              <div class="item-val">{{ item.id }}</div>
+              <div class="item-val">{{ item.name }}</div>
+              <div class="item-val">{{ item.address }}</div>
+              <div class="item-val">{{ item.production }}</div>
+              <div class="item-val">{{ item.person }}</div>
+              <div class="item-val">{{ item.br }}</div>
+              <div :class="contList.length > 18 ? 'item-val1' : 'item-val'">{{ item.brz }}</div>
             </div>
+          </div>
         </div>
-
+        <!-- 统计信息 -->
+        <div class="echart-box" v-if="activeIndex == '2'">
+          <div class="piebox" ref="piebox"></div>
+        </div>
+        <div class="echart-all-box" v-if="activeIndex == '2'">
+          <div class="pieboxall" ref="pieboxall"></div>
+        </div>
+      </div>
     </div>
+  </div>
 </template>
 <script lang="ts" setup>
-import { ref, reactive, watch, defineProps, nextTick } from 'vue';
-import customHeader from '/@/components/vent/customHeader.vue';
-import * as echarts from 'echarts';
+  import { ref, reactive, watch, defineProps, nextTick } from 'vue';
+  import customHeader from '/@/components/vent/customHeader.vue';
+  import * as echarts from 'echarts';
+  import type { SelectProps } from 'ant-design-vue';
 
-let props = defineProps({
+  let props = defineProps({
     airKjStatus: {
-        type: Array,
-        default: () => {
-            return [];
-        },
+      type: Array,
+      default: () => {
+        return [];
+      },
     },
-});
-
-let activeIndex = ref('1');
-//获取dom元素节点
-let piebox = ref<any>();
-let pieboxall = ref<any>();
-let mineTitle = ref('矿井通风状态监测');
-let selectVal = ref('');
-let selectList = ref<any>([]);
-let contList = reactive<any[]>([
+  });
+
+  let activeIndex = ref('1');
+  //获取dom元素节点
+  let piebox = ref<any>();
+  let pieboxall = ref<any>();
+  let mineTitle = ref('矿井通风状态监测');
+  let selectVal = ref<string | undefined>(undefined);
+  let selectList = ref<SelectProps['options']>([
+    { value: 'jack', label: 'Jack' },
+    { value: 'lucy', label: 'Lucy' },
+    { value: 'tom', label: 'Tom' },
+  ]);
+  let contList = reactive<any[]>([
     { id: '1', name: '柳塔矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
     { id: '2', name: '寸草塔二矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
     { id: '3', name: '布尔台矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
@@ -107,8 +146,8 @@ let contList = reactive<any[]>([
     { id: '18', name: '锦界矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
     { id: '19', name: '榆家梁矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
     { id: '20', name: '保德矿', address: '陕西省榆林市', production: 800, person: 1435, br: 1, brz: 1 },
-]);
-let headList = reactive<any>([
+  ]);
+  let headList = reactive<any>([
     { label: '序号' },
     { label: '矿井名称' },
     { label: '所属地区市/县' },
@@ -116,579 +155,559 @@ let headList = reactive<any>([
     { label: '从业人数/人' },
     { label: '尘肺病累计病例/人' },
     { label: '本年度尘肺病病例/人' },
-]);
+  ]);
 
-//tabs选项切换
-function getChange(active) {
+  //tabs选项切换
+  function getChange(active) {
     activeIndex.value = active;
     switch (activeIndex.value) {
-        case '1':
-            break;
-        case '2':
-            getOption();
-            getOptionAll();
-            break;
+      case '1':
+        break;
+      case '2':
+        getOption();
+        getOptionAll();
+        break;
     }
-}
-//下拉框选项切换
-function changeSelect(val) { }
-function getOption() {
+  }
+  //下拉框选项切换
+  function changeSelect(val) {}
+  function getOption() {
     nextTick(() => {
-        let myChart = echarts.init(piebox.value);
-        let option = {
-            tooltip: {
-                trigger: 'item',
-                formatter: '{a} <br/>{b} : {c} ({d}%)',
-            },
-            color: ['#faa526', '#d5eb0f', '#afec07', '#f3f720', '#0ee93d', '#17d1b2', '#2ae271', '#11bce7', '#c127f0', '#ee125b'],
-            title: {
-                text: '陕西省尘肺病地区比例分析',
-                left: 'center',
-                top: 10,
-                textStyle: {
-                    color: '#00d8ff',
-                    fontSize: 14,
+      let myChart = echarts.init(piebox.value);
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b} : {c} ({d}%)',
+        },
+        color: ['#faa526', '#d5eb0f', '#afec07', '#f3f720', '#0ee93d', '#17d1b2', '#2ae271', '#11bce7', '#c127f0', '#ee125b'],
+        title: {
+          text: '陕西省尘肺病地区比例分析',
+          left: 'center',
+          top: 10,
+          textStyle: {
+            color: '#00d8ff',
+            fontSize: 14,
+          },
+        },
+        legend: {
+          orient: 'vertical',
+          right: 30,
+          align: 'auto',
+          top: 'middle',
+          itemGap: 10,
+          textStyle: {
+            color: '#fff',
+            fontSize: 12,
+          },
+          icon: 'circle',
+          data: ['西安市', '宝鸡市', '咸阳市', '铜川市', '渭南市', '延安市', '榆林市', '汉中市', '安康市', '商洛市'],
+        },
+        series: [
+          {
+            name: '比例分析',
+            type: 'pie',
+            radius: '55%',
+            center: ['50%', '50%'],
+            data: [
+              { value: 335, name: '西安市' },
+              { value: 310, name: '宝鸡市' },
+              { value: 234, name: '咸阳市' },
+              { value: 135, name: '铜川市' },
+              { value: 335, name: '渭南市' },
+              { value: 310, name: '延安市' },
+              { value: 234, name: '榆林市' },
+              { value: 135, name: '汉中市' },
+              { value: 335, name: '安康市' },
+              { value: 310, name: '商洛市' },
+            ],
+
+            itemStyle: {
+              normal: {
+                label: {
+                  show: true,
+                  fontSize: 12,
+                  color: '#fff',
+                  formatter: '{b} : {d}%',
                 },
-            },
-            legend: {
-                orient: 'vertical',
-                right: 30,
-                align: 'auto',
-                top: 'middle',
-                itemGap: 10,
-                textStyle: {
+              },
+              labelLine: {
+                normal: {
+                  show: true,
+                  length: 50,
+                  length2: 50,
+                  lineStyle: {
                     color: '#fff',
-                    fontSize: 12,
+                    width: 2,
+                  },
                 },
-                icon: 'circle',
-                data: ['西安市', '宝鸡市', '咸阳市', '铜川市', '渭南市', '延安市', '榆林市', '汉中市', '安康市', '商洛市'],
+              },
             },
-            series: [
-                {
-                    name: '比例分析',
-                    type: 'pie',
-                    radius: '55%',
-                    center: ['50%', '50%'],
-                    data: [
-                        { value: 335, name: '西安市' },
-                        { value: 310, name: '宝鸡市' },
-                        { value: 234, name: '咸阳市' },
-                        { value: 135, name: '铜川市' },
-                        { value: 335, name: '渭南市' },
-                        { value: 310, name: '延安市' },
-                        { value: 234, name: '榆林市' },
-                        { value: 135, name: '汉中市' },
-                        { value: 335, name: '安康市' },
-                        { value: 310, name: '商洛市' },
-                    ],
-
-                    itemStyle: {
-                        normal: {
-                            label: {
-                                show: true,
-                                fontSize: 12,
-                                color: '#fff',
-                                formatter: '{b} : {d}%',
-                            },
-                        },
-                        labelLine: {
-                            normal: {
-                                show: true,
-                                length: 50,
-                                length2: 50,
-                                lineStyle: {
-                                    color: '#fff',
-                                    width: 2,
-                                },
-                            },
-                        },
-                    },
-                },
-            ],
-        };
-        myChart.setOption(option);
-        window.onresize = function () {
-            myChart.resize();
-        };
+          },
+        ],
+      };
+      myChart.setOption(option);
+      window.onresize = function () {
+        myChart.resize();
+      };
     });
-}
-function getOptionAll() {
+  }
+  function getOptionAll() {
     nextTick(() => {
-        let scaleData = [
-            {
-                name: '横山区',
-                value: 10,
-            },
-            {
-                name: '神木市',
-                value: 10,
-            },
-            {
-                name: '府谷县',
-                value: 10,
-            },
-            {
-                name: '靖边县',
-                value: 10,
-            },
-            {
-                name: '定边县',
-                value: 10,
-            },
-            {
-                name: '绥德县',
-                value: 10,
-            },
-            {
-                name: '米脂县',
-                value: 10,
-            },
-            {
-                name: '佳县',
-                value: 10,
-            },
-            {
-                name: '吴堡县',
-                value: 10,
-            },
-            {
-                name: '清涧县',
-                value: 10,
-            },
-        ];
-        let rich = {
-            white: {
-                color: '#fff',
-                align: 'center',
-                fontSize: 12,
-                padding: [3, 0],
+      let scaleData = [
+        {
+          name: '横山区',
+          value: 10,
+        },
+        {
+          name: '神木市',
+          value: 10,
+        },
+        {
+          name: '府谷县',
+          value: 10,
+        },
+        {
+          name: '靖边县',
+          value: 10,
+        },
+        {
+          name: '定边县',
+          value: 10,
+        },
+        {
+          name: '绥德县',
+          value: 10,
+        },
+        {
+          name: '米脂县',
+          value: 10,
+        },
+        {
+          name: '佳县',
+          value: 10,
+        },
+        {
+          name: '吴堡县',
+          value: 10,
+        },
+        {
+          name: '清涧县',
+          value: 10,
+        },
+      ];
+      let rich = {
+        white: {
+          color: '#fff',
+          align: 'center',
+          fontSize: 12,
+          padding: [3, 0],
+        },
+      };
+      let placeHolderStyle = {
+        normal: {
+          label: {
+            show: false,
+          },
+          labelLine: {
+            show: false,
+          },
+          color: 'rgba(0, 0, 0, 0)',
+          borderColor: 'rgba(0, 0, 0, 0)',
+          borderWidth: 0,
+        },
+      };
+      let data: any[] = [];
+      let color1 = [
+        'rgb(255, 153, 153)',
+        'rgb(255, 176, 63)',
+        'rgb(61, 186, 45)',
+        'rgb(43, 166, 254)',
+        'rgb(255,222,0)',
+        'rgb(255,0,0)',
+        '#faa526',
+        '#d5eb0f',
+        '#afec07',
+        '#f3f720',
+        '#0ee93d',
+        '#17d1b2',
+        '#2ae271',
+        '#11bce7',
+        '#c127f0',
+        '#ee125b',
+      ];
+
+      for (let i = 0; i < scaleData.length; i++) {
+        data.push(
+          {
+            value: scaleData[i].value,
+            name: scaleData[i].name,
+            itemStyle: {
+              normal: {
+                borderWidth: 2,
+                shadowBlur: 0,
+                borderColor: color1[i],
+                shadowColor: color1[i],
+                color: color1[i],
+                opacity: 1,
+              },
             },
-        };
-        let placeHolderStyle = {
+          },
+          {
+            value: 2,
+            name: '',
+            itemStyle: placeHolderStyle,
+          }
+        );
+      }
+      let seriesObj = [
+        {
+          name: '',
+          type: 'pie',
+          clockWise: false,
+          radius: [80, 120],
+          center: ['50%', '56%'],
+          hoverAnimation: false,
+          itemStyle: {
             normal: {
-                label: {
-                    show: false,
-                },
-                labelLine: {
-                    show: false,
-                },
-                color: 'rgba(0, 0, 0, 0)',
-                borderColor: 'rgba(0, 0, 0, 0)',
-                borderWidth: 0,
-            },
-        };
-        let data: any[] = [];
-        let color1 = [
-            'rgb(255, 153, 153)',
-            'rgb(255, 176, 63)',
-            'rgb(61, 186, 45)',
-            'rgb(43, 166, 254)',
-            'rgb(255,222,0)',
-            'rgb(255,0,0)',
-            '#faa526',
-            '#d5eb0f',
-            '#afec07',
-            '#f3f720',
-            '#0ee93d',
-            '#17d1b2',
-            '#2ae271',
-            '#11bce7',
-            '#c127f0',
-            '#ee125b',
-        ];
-
-        for (let i = 0; i < scaleData.length; i++) {
-            data.push(
-                {
-                    value: scaleData[i].value,
-                    name: scaleData[i].name,
-                    itemStyle: {
-                        normal: {
-                            borderWidth: 2,
-                            shadowBlur: 0,
-                            borderColor: color1[i],
-                            shadowColor: color1[i],
-                            color: color1[i],
-                            opacity: 1,
-                        },
-                    },
-                },
-                {
-                    value: 2,
-                    name: '',
-                    itemStyle: placeHolderStyle,
-                }
-            );
-        }
-        let seriesObj = [
-            {
-                name: '',
-                type: 'pie',
-                clockWise: false,
-                radius: [80, 120],
-                center: ['50%', '56%'],
-                hoverAnimation: false,
-                itemStyle: {
-                    normal: {
-                        label: {
-                            show: true,
-                            position: 'inner',
-                            fontSize: 12,
-                            color: '#fff',
-                            formatter: function (params) {
-                                let percent: any = 0;
-                                let total = 0;
-                                for (var i = 0; i < scaleData.length; i++) {
-                                    total += scaleData[i].value;
-                                }
-                                percent = ((params.value / total) * 100).toFixed(0);
-                                if (params.name !== '') {
-                                    return params.name;
-                                } else {
-                                    return '';
-                                }
-                            },
-                            rich: rich,
-                        },
-                        labelLine: {
-                            show: false,
-                        },
-                    },
-                },
-                data: data,
-            },
-        ];
-        let myChart = echarts.init(pieboxall.value);
-        let option = {
-            tooltip: {
-                trigger: 'item',
-                formatter: '{b} : {c} ({d}%)',
-            },
-            title: {
-                text: '榆林市尘肺病比例分析',
-                left: 'center',
-                top: 10,
-                textStyle: {
-                    color: '#00d8ff',
-                    fontSize: 14,
-                },
-            },
-            legend: {
-                orient: 'vertical',
-                right: 30,
-                align: 'auto',
-                top: 'middle',
-                itemGap: 10,
-                textStyle: {
-                    color: '#fff',
-                    fontSize: 12,
+              label: {
+                show: true,
+                position: 'inner',
+                fontSize: 12,
+                color: '#fff',
+                formatter: function (params) {
+                  let percent: any = 0;
+                  let total = 0;
+                  for (var i = 0; i < scaleData.length; i++) {
+                    total += scaleData[i].value;
+                  }
+                  percent = ((params.value / total) * 100).toFixed(0);
+                  if (params.name !== '') {
+                    return params.name;
+                  } else {
+                    return '';
+                  }
                 },
-                icon: 'circle',
-                data: ['横山区', '神木市', '府谷县', '靖边县', '定边县', '绥德县', '米脂县', '佳县', '吴堡县', '清涧县'],
-            },
-            toolbox: {
+                rich: rich,
+              },
+              labelLine: {
                 show: false,
+              },
             },
-            series: seriesObj,
-        };
-        myChart.setOption(option);
-        window.onresize = function () {
-            myChart.resize();
-        };
+          },
+          data: data,
+        },
+      ];
+      let myChart = echarts.init(pieboxall.value);
+      let option = {
+        tooltip: {
+          trigger: 'item',
+          formatter: '{b} : {c} ({d}%)',
+        },
+        title: {
+          text: '榆林市尘肺病比例分析',
+          left: 'center',
+          top: 10,
+          textStyle: {
+            color: '#00d8ff',
+            fontSize: 14,
+          },
+        },
+        legend: {
+          orient: 'vertical',
+          right: 30,
+          align: 'auto',
+          top: 'middle',
+          itemGap: 10,
+          textStyle: {
+            color: '#fff',
+            fontSize: 12,
+          },
+          icon: 'circle',
+          data: ['横山区', '神木市', '府谷县', '靖边县', '定边县', '绥德县', '米脂县', '佳县', '吴堡县', '清涧县'],
+        },
+        toolbox: {
+          show: false,
+        },
+        series: seriesObj,
+      };
+      myChart.setOption(option);
+      window.onresize = function () {
+        myChart.resize();
+      };
     });
-}
+  }
 
-watch(
+  watch(
     () => props.airKjStatus,
     (newA, oldA) => {
-        console.log(newA, 'airKjStatus-----------');
+      console.log(newA, 'airKjStatus-----------');
     },
     {
-        immediate: true,
-        deep: true,
+      immediate: true,
+      deep: true,
     }
-);
+  );
 </script>
 <style lang="less" scoped>
-@font-face {
+  @font-face {
     font-family: 'douyuFont';
     src: url('../../../../assets/font/douyuFont.otf');
-}
+  }
 
-.dustInfoTj {
+  .dustInfoTj {
     width: calc(100% - 20px);
     height: calc(100% - 90px);
     position: relative;
     margin: 80px 10px 10px 10px;
 
     .tj-content {
-        position: relative;
-        width: 100%;
+      position: relative;
+      width: 100%;
+      height: 100%;
+      .mine-content {
         height: 100%;
-        .mine-content {
-            height: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        .content-tabs {
+          width: 100%;
+          height: 45px;
+          padding: 0px 20px;
+          display: flex;
+          align-items: center;
+
+          .tabs-item {
+            color: #fff;
+            cursor: pointer;
+
+            &:nth-child(1) {
+              margin-right: 20px;
+            }
+          }
+
+          .tabs-item1 {
+            color: rgba(0, 216, 255);
+            cursor: pointer;
+            border-bottom: 2px solid;
+            border-image: linear-gradient(to right, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
+            margin-right: 20px;
+          }
+        }
+
+        .content-search {
+          position: relative;
+          width: 100%;
+          height: 45px;
+          margin-bottom: 15px;
+          display: flex;
+          align-items: center;
+
+          .risk-select {
+            position: absolute;
+            width: 90%;
+            height: 40px;
+            left: 50%;
+            transform: translate(-50%, 0);
+            top: 0px;
+            background: url('@/assets/images/company/content-label.png') no-repeat center;
+            background-size: 100% 100%;
+            z-index: 9999;
             display: flex;
-            flex-direction: column;
             align-items: center;
 
-            .content-tabs {
-                width: 100%;
-                height: 45px;
-                padding: 0px 20px;
-                display: flex;
-                align-items: center;
-
-                .tabs-item {
-                    color: #fff;
-                    cursor: pointer;
+            .zxm-select {
+              margin: 0 10px;
+            }
+          }
+        }
 
-                    &:nth-child(1) {
-                        margin-right: 20px;
-                    }
-                }
+        .content-table {
+          position: relative;
+          width: 90%;
+          height: calc(100% - 105px);
+          border: 1px solid rgba(0, 216, 255, 0.3);
 
-                .tabs-item1 {
-                    color: rgba(0, 216, 255);
-                    cursor: pointer;
-                    border-bottom: 2px solid;
-                    border-image: linear-gradient(to right, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
-                    margin-right: 20px;
-                }
+          .table-head {
+            display: flex;
+            justify-content: space-between;
+            height: 60px;
+            border-bottom: 1px solid rgba(0, 216, 255, 0.3);
+
+            .head-item {
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              height: 100%;
+              color: rgba(0, 216, 255);
+              font-size: 14px;
+              border-right: 1px solid rgba(0, 216, 255, 0.1);
+
+              &:nth-child(1) {
+                width: 5%;
+                text-align: center;
+              }
+
+              &:nth-child(2) {
+                width: 18%;
+                text-align: center;
+              }
+
+              &:nth-child(3) {
+                width: 18%;
+                text-align: center;
+              }
+
+              &:nth-child(4) {
+                width: 18%;
+                text-align: center;
+              }
+
+              &:nth-child(5) {
+                width: 5%;
+                text-align: center;
+              }
+
+              &:nth-child(6) {
+                width: 18%;
+                text-align: center;
+              }
+
+              &:nth-child(7) {
+                width: 18%;
+                text-align: center;
+              }
             }
+          }
+
+          .table-cont {
+            height: calc(100% - 61px);
+
+            overflow-y: auto;
 
-            .content-search {
-                position: relative;
-                width: 100%;
-                height: 45px;
-                margin-bottom: 15px;
+            .cont-item {
+              display: flex;
+              justify-content: space-between;
+              height: 36px;
+              border-bottom: 1px solid rgba(0, 216, 255, 0.1);
+
+              .item-val {
                 display: flex;
                 align-items: center;
+                justify-content: center;
+                height: 100%;
+                font-size: 14px;
+                border-right: 1px solid rgba(0, 216, 255, 0.1);
+                color: #fff;
+
+                &:nth-child(1) {
+                  width: 5%;
+                  text-align: center;
+                }
 
-                .risk-select {
-                    position: absolute;
-                    width: 90%;
-                    height: 40px;
-                    left: 50%;
-                    transform: translate(-50%, 0);
-                    top: 0px;
-                    background: url('@/assets/images/company/content-label.png') no-repeat center;
-                    background-size: 100% 100%;
-                    z-index: 9999;
-
-                    .zxm-select {
-                        position: absolute;
-                        top: 50%;
-                        transform: translate(0, -50%);
-
-                        &:nth-child(1) {
-                            left: 20px;
-                        }
-
-                        &:nth-child(2) {
-                            left: 260px;
-                        }
-
-                        &:nth-child(3) {
-                            left: 500px;
-                        }
-                        &:nth-child(4) {
-                            left: 740px;
-                        }
-                        &:nth-child(5) {
-                            left: 980px;
-                        }
-                    }
+                &:nth-child(2) {
+                  width: 18%;
+                  text-align: center;
                 }
-            }
 
-            .content-table {
-                position: relative;
-                width: 90%;
-                height: calc(100% - 105px);
-                border: 1px solid rgba(0, 216, 255, 0.3);
-
-                .table-head {
-                    display: flex;
-                    justify-content: space-between;
-                    height: 60px;
-                    border-bottom: 1px solid rgba(0, 216, 255, 0.3);
-
-                    .head-item {
-                        display: flex;
-                        align-items: center;
-                        justify-content: center;
-                        height: 100%;
-                        color: rgba(0, 216, 255);
-                        font-size: 14px;
-                        border-right: 1px solid rgba(0, 216, 255, 0.1);
-
-                        &:nth-child(1) {
-                            width: 5%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(2) {
-                            width: 18%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(3) {
-                            width:18%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(4) {
-                            width: 18%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(5) {
-                            width: 5%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(6) {
-                            width: 18%;
-                            text-align: center;
-                        }
-
-                        &:nth-child(7) {
-                            width: 18%;
-                            text-align: center;
-                        }
-                    }
+                &:nth-child(3) {
+                  width: 18%;
+                  text-align: center;
                 }
 
-                .table-cont {
-                    height: calc(100% - 61px);
-
-                    overflow-y: auto;
-
-                    .cont-item {
-                        display: flex;
-                        justify-content: space-between;
-                        height: 36px;
-                        border-bottom: 1px solid rgba(0, 216, 255, 0.1);
-
-                        .item-val {
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-                            height: 100%;
-                            font-size: 14px;
-                            border-right: 1px solid rgba(0, 216, 255, 0.1);
-                            color: #fff;
-
-                            &:nth-child(1) {
-                                width:5%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(2) {
-                                width: 18%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(3) {
-                                width: 18%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(4) {
-                                width: 18%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(5) {
-                                width: 5%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(6) {
-                                width: 18%;
-                                text-align: center;
-                            }
-
-                            &:nth-child(7) {
-                                width: 18%;
-                                text-align: center;
-                                border-right: none;
-                            }
-                        }
-
-                        .item-val1 {
-                            display: flex;
-                            align-items: center;
-                            justify-content: center;
-                            height: 100%;
-                            font-size: 14px;
-                            color: #fff;
-                            width: 295px;
-                            text-align: center;
-                            border-right: none;
-                        }
-                    }
+                &:nth-child(4) {
+                  width: 18%;
+                  text-align: center;
                 }
-            }
 
-            .echart-box {
-                width: 100%;
-                height: calc((100% - 45px) / 2) ;
-                .piebox {
-                    width: 100%;
-                    height: 100%;
+                &:nth-child(5) {
+                  width: 5%;
+                  text-align: center;
                 }
-            }
 
-            .echart-all-box {
-                width: 100%;
-                height: calc((100% - 45px) / 2) ;
-                .pieboxall {
-                    width: 100%;
-                    height: 100%;
+                &:nth-child(6) {
+                  width: 18%;
+                  text-align: center;
                 }
+
+                &:nth-child(7) {
+                  width: 18%;
+                  text-align: center;
+                  border-right: none;
+                }
+              }
+
+              .item-val1 {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                height: 100%;
+                font-size: 14px;
+                color: #fff;
+                width: 295px;
+                text-align: center;
+                border-right: none;
+              }
             }
+          }
         }
-    }
 
+        .echart-box {
+          width: 100%;
+          height: calc((100% - 45px) / 2);
+          .piebox {
+            width: 100%;
+            height: 100%;
+          }
+        }
 
-}
+        .echart-all-box {
+          width: 100%;
+          height: calc((100% - 45px) / 2);
+          .pieboxall {
+            width: 100%;
+            height: 100%;
+          }
+        }
+      }
+    }
+  }
 
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector {
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector {
     height: 24px;
-}
+  }
 
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector .zxm-select-selection-search-input {
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector .zxm-select-selection-search-input {
     height: 24px;
-}
+  }
 
-::v-deep .zxm-select-selection-placeholder {
+  ::v-deep .zxm-select-selection-placeholder {
     color: #fff !important;
     line-height: 22px !important;
-}
+  }
 
-::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector::after {
+  ::v-deep .zxm-select-single:not(.zxm-select-customize-input) .zxm-select-selector::after {
     line-height: 24px;
-}
+  }
 
-::v-deep .zxm-select:not(.zxm-select-customize-input) .zxm-select-selector {
+  ::v-deep .zxm-select:not(.zxm-select-customize-input) .zxm-select-selector {
     background-color: transparent;
     border-top: 0px;
     border-bottom: 0px;
     border-left: 2px solid;
     border-right: 2px solid;
     border-image: linear-gradient(to bottom, transparent, rgba(49, 184, 255, 1), transparent) 1 1 1;
-}
+  }
 
-::v-deep .zxm-select-arrow {
+  ::v-deep .zxm-select-arrow {
     color: #fff !important;
-}
+  }
 
-::v-deep .zxm-select-selection-item {
+  ::v-deep .zxm-select-selection-item {
     color: #fff !important;
-}
+  }
 
-::v-deep .zxm-select-single .zxm-select-selector .zxm-select-selection-item {
+  ::v-deep .zxm-select-single .zxm-select-selector .zxm-select-selection-item {
     line-height: 24px !important;
-}
-</style>
+  }
+</style>

+ 9 - 2
src/views/vent/monitorManager/fanLocalMonitor/fanLocal.three.ts

@@ -140,6 +140,13 @@ export const addText = (selectData) => {
   if (!group) {
     return;
   }
+  const screenDownText = VENT_PARAM['modalText']
+    ? VENT_PARAM['modalText']
+    : History_Type['type'] == 'remote'
+    ? `国能神东煤炭集团监制`
+    : '煤炭科学技术研究院有限公司研制';
+
+  const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
   const textArr = [
     {
       text: `智能局部通风机监测与控制系统`,
@@ -216,11 +223,11 @@ export const addText = (selectData) => {
       y: 285,
     },
     {
-      text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+      text: screenDownText,
       font: 'normal 28px Arial',
       color: '#009900',
       strokeStyle: '#002200',
-      x: History_Type['type'] == 'remote' ? 80 : 20, //20  煤炭科学技术研究院有限公司研制
+      x: screenDownTextX,
       y: 325,
     },
   ];

+ 4 - 2
src/views/vent/monitorManager/fanLocalMonitor1/components/fanlocal-operate-history.vue

@@ -6,11 +6,12 @@
       :device-list-api="baseList"
       designScope="alarm-history"
       :scroll="scroll"
-    />
+      :deviceId="deviceId"
+    />s
   </div>
 </template>
 <script setup lang="ts">
-  import { onBeforeMount, ref, watch, onMounted, nextTick, defineAsyncComponent, reactive, onUnmounted, inject, unref } from 'vue';
+  import { onBeforeMount, ref, watch, onMounted, nextTick, defineAsyncComponent, reactive, onUnmounted, inject, unref, computed } from 'vue';
   import HandlerHistoryTable from '../../comment/HandlerHistoryTable.vue';
   import { list as baseList } from '../../../deviceManager/fanTabel/fan.api';
 
@@ -24,6 +25,7 @@
       default: '',
     },
   });
+  const deviceId = computed(() => props.deviceId);
   let scroll = reactive({
     y: 580,
   });

+ 9 - 2
src/views/vent/monitorManager/fanLocalMonitor1/fanLocal.three.ts

@@ -140,6 +140,13 @@ export const addText = (selectData) => {
   if (!group) {
     return;
   }
+  const screenDownText = VENT_PARAM['modalText']
+    ? VENT_PARAM['modalText']
+    : History_Type['type'] == 'remote'
+    ? `国能神东煤炭集团监制`
+    : '煤炭科学技术研究院有限公司研制';
+
+  const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
   const textArr = [
     {
       text: `智能局部通风机监测与控制系统`,
@@ -216,11 +223,11 @@ export const addText = (selectData) => {
       y: 285,
     },
     {
-      text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+      text: screenDownText,
       font: 'normal 28px Arial',
       color: '#009900',
       strokeStyle: '#002200',
-      x: History_Type['type'] == 'remote' ? 80 : 20, //20  煤炭科学技术研究院有限公司研制
+      x: screenDownTextX, //20  煤炭科学技术研究院有限公司研制
       y: 325,
     },
   ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.noStation.ts

@@ -71,6 +71,13 @@ class FmNoStation {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 90 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -129,11 +136,11 @@ class FmNoStation {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 10 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.qd.ts

@@ -99,6 +99,14 @@ class Fm3 {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
+
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -157,11 +165,11 @@ class Fm3 {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.three.ts

@@ -79,6 +79,13 @@ class Fm2 {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -137,11 +144,11 @@ class Fm2 {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.two.ss.ts

@@ -98,6 +98,13 @@ class FmTwoSs {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -156,11 +163,11 @@ class FmTwoSs {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.two.yj.ts

@@ -98,6 +98,13 @@ class FmTwoYj {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 90 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -156,11 +163,11 @@ class FmTwoYj {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.xc.ts

@@ -99,6 +99,13 @@ class FmXR {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -157,11 +164,11 @@ class FmXR {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.xr.ts

@@ -71,6 +71,13 @@ class FmXR {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -129,11 +136,11 @@ class FmXR {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 330,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.yj.ts

@@ -98,6 +98,13 @@ class FmYj {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -156,11 +163,11 @@ class FmYj {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/gateMonitor/gate.threejs.yy.ts

@@ -99,6 +99,13 @@ class Fm1 {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 80 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程控制自动风门`,
@@ -157,11 +164,11 @@ class Fm1 {
         y: 275,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#00FF00',
         strokeStyle: '#007400',
-        x: History_Type['type'] == 'remote' ? 80 : 20,
+        x: screenDownTextX,
         y: 325,
       },
     ];

+ 80 - 66
src/views/vent/monitorManager/gateMonitor/index.vue

@@ -473,7 +473,7 @@
   }
 
   // 播放动画
-  function playAnimation1(handlerState, data: any = null) {
+  function playAnimation(handlerState, data: any = null) {
     const value = data;
     switch (handlerState) {
       case 1: // 打开前门
@@ -482,7 +482,8 @@
           modalType.value = '1';
           modalIsShow.value = true;
         } else {
-          message.warning('前门已经打开或正在打开,请勿重新操作');
+          // message.warning('前门已经打开或正在打开,请勿重新操作');
+          message.warning('没有监测到前门关到位,无法进行指令下发操作');
         }
         break;
       case 2: // 关闭前门
@@ -491,7 +492,8 @@
           modalType.value = '2';
           modalIsShow.value = true;
         } else {
-          message.warning('前门已经关闭或正在关闭,请勿重新操作');
+          // message.warning('前门已经关闭或正在关闭,请勿重新操作');
+          message.warning('没有监测到前门开到位,无法进行指令下发操作');
         }
         break;
       case 3: // 打开后门
@@ -500,7 +502,8 @@
           modalType.value = '3';
           modalIsShow.value = true;
         } else {
-          message.warning('后门已经打开或正在打开,请勿重新操作');
+          // message.warning('后门已经打开或正在打开,请勿重新操作');
+          message.warning('没有监测到后门关到位,无法进行指令下发操作');
         }
         break;
       case 4: // 关闭后门
@@ -509,7 +512,8 @@
           modalType.value = '4';
           modalIsShow.value = true;
         } else {
-          message.warning('后门已经关闭或正在关闭,请勿重新操作');
+          // message.warning('后门已经关闭或正在关闭,请勿重新操作');
+          message.warning('没有监测到后门开到位,无法进行指令下发操作');
         }
         break;
       case 8: // 打开中间门
@@ -518,7 +522,8 @@
           modalType.value = '8';
           modalIsShow.value = true;
         } else {
-          message.warning('后门已经打开或正在打开,请勿重新操作');
+          // message.warning('后门已经打开或正在打开,请勿重新操作');
+          message.warning('没有监测到中间门关到位,无法进行指令下发操作');
         }
         break;
       case 9: // 关闭中间门
@@ -527,7 +532,8 @@
           modalType.value = '9';
           modalIsShow.value = true;
         } else {
-          message.warning('后门已经关闭或正在关闭,请勿重新操作');
+          // message.warning('后门已经关闭或正在关闭,请勿重新操作');
+          message.warning('没有监测到中间门开到位,无法进行指令下发操作');
         }
         break;
       case 5: // 打开前后门
@@ -541,7 +547,8 @@
           modalType.value = '5';
           modalIsShow.value = true;
         } else {
-          message.warning('前后门已经打开或正在打开,请勿重新操作');
+          // message.warning('前后门已经打开或正在打开,请勿重新操作');
+          message.warning('没有监测到前门、后门关到位,无法进行指令下发操作');
         }
         break;
       case 6: // 关闭前后门
@@ -555,7 +562,8 @@
           modalType.value = '6';
           modalIsShow.value = true;
         } else {
-          message.warning('前后门已经关闭或正在关闭,请勿重新操作');
+          // message.warning('前后门已经关闭或正在关闭,请勿重新操作');
+          message.warning('没有监测到前门、后门开到位,无法进行指令下发操作');
         }
         break;
 
@@ -564,64 +572,7 @@
         modalType.value = '7';
         modalIsShow.value = true;
         break;
-    }
-
-    if (globalConfig?.simulatedPassword) {
-      handleOK('', handlerState + '');
-    }
-    contrlValue = value;
-  }
-  // 保德缺打开状态
 
-  function playAnimation(handlerState, data: any = null) {
-    const value = data;
-    switch (handlerState) {
-      case 1: // 打开前门
-        modalTitle.value = '打开前门';
-        modalType.value = '1';
-        modalIsShow.value = true;
-        break;
-      case 2: // 关闭前门
-        modalTitle.value = '关闭前门';
-        modalType.value = '2';
-        modalIsShow.value = true;
-        break;
-      case 3: // 打开后门
-        modalTitle.value = '打开后门';
-        modalType.value = '3';
-        modalIsShow.value = true;
-        break;
-      case 4: // 关闭后门
-        modalTitle.value = '关闭后门';
-        modalType.value = '4';
-        modalIsShow.value = true;
-        break;
-      case 8: // 打开中间门
-        modalTitle.value = '打开中间门';
-        modalType.value = '8';
-        modalIsShow.value = true;
-        break;
-      case 9: // 关闭中间门
-        modalTitle.value = '关闭中间门';
-        modalType.value = '9';
-        modalIsShow.value = true;
-        break;
-      case 5: // 打开前后门
-        modalTitle.value = '打开前后门';
-        modalType.value = '5';
-        modalIsShow.value = true;
-        break;
-      case 6: // 关闭前后门
-        modalTitle.value = '关闭前后门';
-        modalType.value = '6';
-        modalIsShow.value = true;
-        break;
-
-      case 7: // 控制模式切换
-        modalTitle.value = '控制模式切换';
-        modalType.value = '7';
-        modalIsShow.value = true;
-        break;
       case 10: // 风窗控制
         modalTitle.value = '风窗控制';
         modalType.value = '10';
@@ -634,6 +585,69 @@
     }
     contrlValue = value;
   }
+  // 保德缺打开状态
+
+  // function playAnimation(handlerState, data: any = null) {
+  //   const value = data;
+  //   switch (handlerState) {
+  //     case 1: // 打开前门
+  //       modalTitle.value = '打开前门';
+  //       modalType.value = '1';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 2: // 关闭前门
+  //       modalTitle.value = '关闭前门';
+  //       modalType.value = '2';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 3: // 打开后门
+  //       modalTitle.value = '打开后门';
+  //       modalType.value = '3';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 4: // 关闭后门
+  //       modalTitle.value = '关闭后门';
+  //       modalType.value = '4';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 8: // 打开中间门
+  //       modalTitle.value = '打开中间门';
+  //       modalType.value = '8';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 9: // 关闭中间门
+  //       modalTitle.value = '关闭中间门';
+  //       modalType.value = '9';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 5: // 打开前后门
+  //       modalTitle.value = '打开前后门';
+  //       modalType.value = '5';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 6: // 关闭前后门
+  //       modalTitle.value = '关闭前后门';
+  //       modalType.value = '6';
+  //       modalIsShow.value = true;
+  //       break;
+
+  //     case 7: // 控制模式切换
+  //       modalTitle.value = '控制模式切换';
+  //       modalType.value = '7';
+  //       modalIsShow.value = true;
+  //       break;
+  //     case 10: // 风窗控制
+  //       modalTitle.value = '风窗控制';
+  //       modalType.value = '10';
+  //       modalIsShow.value = true;
+  //       break;
+  //   }
+
+  //   if (globalConfig?.simulatedPassword) {
+  //     handleOK('', handlerState + '');
+  //   }
+  //   contrlValue = value;
+  // }
 
   function handleOK(passWord, handlerState, value?) {
     if (!passWord && !globalConfig?.simulatedPassword) {

+ 9 - 2
src/views/vent/monitorManager/windowMonitor/dandaoFc.threejs.ts

@@ -37,6 +37,13 @@ class singleWindow {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 120 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -107,11 +114,11 @@ class singleWindow {
         y: 256,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 120 : 60,
+        x: screenDownTextX,
         y: 302,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitor/dandaoFcBet.threejs.ts

@@ -37,6 +37,13 @@ class singleWindowBet {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 90 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -107,11 +114,11 @@ class singleWindowBet {
         y: 250,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 300,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitor/shuangdaoFc.threejs.ts

@@ -32,6 +32,13 @@ class doubleWindow {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 120 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -103,11 +110,11 @@ class doubleWindow {
       },
 
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 120 : 60,
+        x: screenDownTextX,
         y: 322,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitorBet/dandaoFc.threejs.ts

@@ -37,6 +37,13 @@ class singleWindow {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 120 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -107,11 +114,11 @@ class singleWindow {
         y: 256,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 120 : 60,
+        x: screenDownTextX,
         y: 302,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitorBet/dandaoFcBet.threejs.ts

@@ -37,6 +37,13 @@ class singleWindowBet {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 90 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -107,11 +114,11 @@ class singleWindowBet {
         y: 250,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 300,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitorBet/dandaoFcBetZh.threejs.ts

@@ -38,6 +38,13 @@ class singleWindowBetZh {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 90 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -108,11 +115,11 @@ class singleWindowBetZh {
         y: 250,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 90 : 30,
+        x: screenDownTextX,
         y: 300,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windowMonitorBet/shuangdaoFc.threejs.ts

@@ -32,6 +32,13 @@ class doubleWindow {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 120 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `远程定量调节自动风窗`,
@@ -103,11 +110,11 @@ class doubleWindow {
       },
 
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 120 : 60,
+        x: screenDownTextX,
         y: 322,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windrectMonitor/dantou.threejs.ts

@@ -50,6 +50,13 @@ class ddWindRect {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 110 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `测风实时数据`,
@@ -108,11 +115,11 @@ class ddWindRect {
         y: 252,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 110 : 50,
+        x: screenDownTextX,
         y: 302,
       },
     ];

+ 9 - 2
src/views/vent/monitorManager/windrectMonitor/duisheFixed.threejs.ts

@@ -51,6 +51,13 @@ class fixedWindRect {
     if (!this.group) {
       return;
     }
+    const screenDownText = VENT_PARAM['modalText']
+      ? VENT_PARAM['modalText']
+      : History_Type['type'] == 'remote'
+      ? `国能神东煤炭集团监制`
+      : '煤炭科学技术研究院有限公司研制';
+
+    const screenDownTextX = 110 - (screenDownText.length - 10) * 6;
     const textArr = [
       {
         text: `测风实时数据`,
@@ -109,11 +116,11 @@ class fixedWindRect {
         y: 272,
       },
       {
-        text: History_Type['type'] == 'remote' ? `国能神东煤炭集团监制` : '煤炭科学技术研究院有限公司研制',
+        text: screenDownText,
         font: 'normal 28px Arial',
         color: '#009900',
         strokeStyle: '#002200',
-        x: History_Type['type'] == 'remote' ? 110 : 50,
+        x: screenDownTextX,
         y: 328,
       },
     ];