Forráskód Böngészése

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

hongrunxia 4 hónapja
szülő
commit
5023fb8d76
31 módosított fájl, 1511 hozzáadás és 1285 törlés
  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,
       },
     ];