思山岭铁矿-更新

src/assets/icons/close-door.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="17.902" height="17.996" viewBox="0 0 17.902 17.996">
+  <g id="组_16329" data-name="组 16329" transform="translate(-2.666)">
+    <path id="路径_57370" data-name="路径 57370" d="M10.777,14.76H4.725l-.07,0a.6.6,0,0,1-.529-.595V2.058l0-.07a.6.6,0,0,1,.595-.529h12.1l.07,0a.6.6,0,0,1,.529.595V8.11l0,.08a.73.73,0,0,0,1.455-.08V2.058l0-.117A2.058,2.058,0,0,0,16.828,0H4.725L4.608,0A2.058,2.058,0,0,0,2.666,2.058v12.1l0,.117A2.058,2.058,0,0,0,4.725,16.22h6.052l.08,0a.73.73,0,0,0-.08-1.455Z" transform="translate(0)" fill="#fff"/>
+    <path id="路径_57371" data-name="路径 57371" d="M214.126,189.419a.195.195,0,0,0-.308.158v.806h-4.4l-.115,0a2.027,2.027,0,0,0-1.912,2.024v1.581l0,.08a.73.73,0,0,0,1.455-.08V192.41l0-.071a.568.568,0,0,1,.563-.5h4.4v.806a.195.195,0,0,0,.309.157l2.108-1.536a.195.195,0,0,0,0-.315Zm2.293,6.5v-1.581l0-.08a.73.73,0,0,0-1.455.08v1.581l0,.071a.568.568,0,0,1-.563.5h-4.4v-.806a.195.195,0,0,0-.309-.157l-2.107,1.536a.195.195,0,0,0,0,.315l2.107,1.535a.195.195,0,0,0,.309-.157v-.806h4.4l.115,0A2.027,2.027,0,0,0,216.418,195.919Zm1.771,1.114a3.509,3.509,0,1,0,3.509,3.509A3.509,3.509,0,0,0,218.189,197.033Zm0,1.3a2.2,2.2,0,0,1,.892.187l-2.915,2.915a2.212,2.212,0,0,1,2.023-3.1Zm0,4.422a2.2,2.2,0,0,1-1.046-.262l2.995-2.994a2.212,2.212,0,0,1-1.948,3.257Z" transform="translate(-201.129 -186.054)" fill="#fff"/>
+  </g>
+</svg>

src/assets/icons/open-door.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="17.902" height="17.996" viewBox="0 0 17.902 17.996">
+  <path id="路径_57369" data-name="路径 57369" d="M12.894,3.328a.2.2,0,0,1,.115.037L15.116,4.9a.195.195,0,0,1,0,.315L13.007,6.752a.195.195,0,0,1-.309-.157V5.788H8.3a.568.568,0,0,0-.563.5l0,.071V7.937a.73.73,0,0,1-1.455.08l0-.08V6.356A2.027,2.027,0,0,1,8.187,4.332l.115,0h4.4V3.523a.195.195,0,0,1,.2-.2ZM14.57,7.553a.73.73,0,0,1,.726.65l0,.08V9.864a2.027,2.027,0,0,1-1.912,2.024l-.115,0h-4.4V12.7a.195.195,0,0,1-.309.156L6.46,11.319a.195.195,0,0,1,0-.315L8.567,9.468a.195.195,0,0,1,.309.157v.806h4.4a.568.568,0,0,0,.563-.5l0-.071V8.283A.73.73,0,0,1,14.57,7.553Zm4.049,5.96a.649.649,0,0,1,.06.856l-.054.062L17.2,15.874a.649.649,0,0,1-.9.024l-.056-.058-.759-.887a.649.649,0,0,1,.929-.9l.057.059.3.351.929-.941a.649.649,0,0,1,.918-.006ZM4.736,0h12.1a2.058,2.058,0,0,1,2.055,1.942l0,.117V8.11a.73.73,0,0,1-1.455.08l0-.08V2.058a.6.6,0,0,0-.529-.594l-.07,0H4.736a.6.6,0,0,0-.595.529l0,.07v12.1a.6.6,0,0,0,.529.595l.07,0h6.052a.73.73,0,0,1,.08,1.455l-.08,0H4.736a2.058,2.058,0,0,1-2.055-1.942l0-.117V2.058A2.058,2.058,0,0,1,4.619,0ZM17.071,12.276a2.211,2.211,0,1,0,2.211,2.211,2.211,2.211,0,0,0-2.211-2.211Zm0-1.3a3.509,3.509,0,1,1-3.509,3.509,3.509,3.509,0,0,1,3.509-3.509Z" transform="translate(-2.678)" fill="#fff"/>
+</svg>

src/assets/icons/time-setting-door.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16.548" height="18.569" viewBox="0 0 16.548 18.569">
+  <path id="路径_57372" data-name="路径 57372" d="M111.245,46.542a.746.746,0,0,1,.015,1.492H108.48v.874a7.62,7.62,0,0,1,6.7,6.07.747.747,0,0,1-1.459.309l0-.014a6.124,6.124,0,1,0-6.1,7.343h.1a.747.747,0,1,1,0,1.494,7.621,7.621,0,0,1-.725-15.207v-.868h-2.766a.747.747,0,1,1-.014-1.494h7.037Zm1.243,9.575a.789.789,0,0,1,.889-.087l.014.007.64.37a.79.79,0,0,1,.383.822l-.081.461.009.013a3.232,3.232,0,0,1,.337.586l.006.013.441.16a.79.79,0,0,1,.52.727v.756a.79.79,0,0,1-.52.743l-.441.159,0,.01q-.06.137-.133.269l-.021.037a3.2,3.2,0,0,1-.186.287l-.007.01.082.461a.79.79,0,0,1-.367.814l-.015.01-.64.369a.789.789,0,0,1-.9-.08l-.358-.3-.014,0a3.168,3.168,0,0,1-.675,0l-.015,0-.358.3a.789.789,0,0,1-.889.087l-.014-.007-.64-.37a.79.79,0,0,1-.383-.822l.081-.461-.009-.013a3.172,3.172,0,0,1-.337-.586l-.006-.014-.441-.159a.79.79,0,0,1-.52-.727V59.2a.791.791,0,0,1,.52-.743l.441-.16,0-.01c.041-.091.085-.181.134-.268l.021-.037a2.977,2.977,0,0,1,.186-.287l.006-.01-.081-.461a.79.79,0,0,1,.367-.814l.015-.01.64-.369a.789.789,0,0,1,.9.08l.358.3.015,0a3.155,3.155,0,0,1,.675,0h.014Zm.546,1.032-.58.488-.271-.056a2.027,2.027,0,0,0-.813,0l-.271.055-.58-.488-.213.124.131.745-.184.207a2.045,2.045,0,0,0-.406.706l-.088.261-.712.259V59.7l.713.259.087.261a2.042,2.042,0,0,0,.406.705l.184.207-.132.746.213.124.58-.488.271.056a2.041,2.041,0,0,0,.814,0l.271-.055.58.488.213-.124-.131-.745.183-.207a2.045,2.045,0,0,0,.408-.706l.087-.261.711-.259V59.45l-.712-.259-.087-.261a2.03,2.03,0,0,0-.406-.705l-.184-.207.132-.746-.213-.124Zm-1.261.988a1.449,1.449,0,1,1-1.45,1.449,1.449,1.449,0,0,1,1.45-1.449Zm0,.966a.483.483,0,1,0,.483.483A.483.483,0,0,0,111.772,59.1Zm-4-7.911a.747.747,0,0,1,.747.746v4.436a.966.966,0,0,1-.283.664l-2.189,2.19-.012.012a.746.746,0,0,1-1.044-.012l-.012-.012a.747.747,0,0,1,.011-1.045l2.034-2.035V51.924a.747.747,0,0,1,.746-.732Z" transform="translate(-99.596 -46.041)" fill="#fff" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1"/>
+</svg>

src/views/vent/gas/components/modal/confirmModal.vue

@@ -12,13 +12,13 @@
 <script setup lang="ts">
   import { Modal, Button, ModalProps } from 'ant-design-vue';
 
-  const props = withDefaults(defineProps<ModalProps>(), {
-    context: '确认操作？',
-    cancelText: '取消',
-    okText: '确认',
-    centered: true,
-    wrapClassName: 'gas-confirm-modal',
-  });
+  // const props = withDefaults(defineProps<ModalProps>(), {
+  //   context: '确认操作？',
+  //   cancelText: '取消',
+  //   okText: '确认',
+  //   centered: true,
+  //   wrapClassName: 'gas-confirm-modal',
+  // });
 
   const emit = defineEmits(['ok', 'cancel', 'update:visible', 'change']);
   function cancelHandler() {

src/views/vent/monitorManager/airDoor/airdoor.data.ts

@@ -1,6 +1,6 @@
 import { defineAsyncComponent } from 'vue';
 
-export const hourOption:any[] = [
+export const hourOption: any[] = [
   { label: '00', value: 0 },
   { label: '01', value: 1 },
   { label: '02', value: 2 },
@@ -27,7 +27,7 @@ export const hourOption:any[] = [
   { label: '23', value: 23 },
 ]
 
-export const minuteOption:any[] = [
+export const minuteOption: any[] = [
   { label: '00', value: 0 },
   { label: '01', value: 1 },
   { label: '02', value: 2 },
@@ -91,3 +91,21 @@ export const minuteOption:any[] = [
 
 ]
 
+const componentsCaches = new Map<string, any>();
+export function getModelComponent(is2DModel: boolean = false, type: string = '') {
+  if (!is2DModel) return '';
+  return defineAsyncComponent(() => {
+    // 为了支持SVG组件切换时不闪烁，先行下载并缓存
+    if (!componentsCaches.has('gate_qd')) componentsCaches.set('gate_qd', import('./components/gateDualSVG.vue'));
+    if (!componentsCaches.has('gate_ss')) componentsCaches.set('gate_ss', import('./components/gateSVG.vue'));
+    console.log(type, 'types---')
+    switch (type) {
+      case 'gate_qd':
+        return componentsCaches.get('gate_qd');
+      case 'gate_ss':
+        return componentsCaches.get('gate_ss');
+    }
+  });
+}
+
+

src/views/vent/monitorManager/airDoor/components/door-content-r.vue

@@ -1,11 +1,22 @@
 <template>
   <div class="door-content-r">
     <div class="content-r-btn">
-      <a-button preIcon="ant-design:pause-circle-outlined" type="primary"
-        @click="handlerOpenOrClose('open')">同步开启</a-button>
-      <a-button preIcon="ant-design:play-circle-outlined" type="primary" style="margin: 0px 10px"
-        @click="handlerOpenOrClose('close')">同步关闭</a-button>
-      <a-button preIcon="ant-design:clock-circle-outlined" type="primary" @click="handlerTimeSet">定时设置</a-button>
+       <a-button type="primary" @click="handlerOpenOrClose('open')">
+        同步开启
+      </a-button>
+      <!-- <a-button type="primary" @click="handlerOpenOrClose('open')">
+        <SvgIcon class="icon-style" size="14" color="#30b3fc" name="open-door" />
+        同步开启
+      </a-button> -->
+      <a-button type="primary" style="margin: 0px 10px" @click="handlerOpenOrClose('close')">
+        <SvgIcon class="icon-style" size="14" color="#30b3fc" name="close-door" />
+        同步关闭
+      </a-button>
+      <a-button type="primary" @click="handlerTimeSet">
+        <SvgIcon class="icon-style" size="14" color="#30b3fc" name="time-setting-door" />
+        定时设置
+      </a-button>
+      <a-button style="margin: 0px 10px" type="primary">操作日志</a-button>
     </div>
     <div class="content-r-container">
       <div class="content-r-box" v-for="(item, index) in infoDatas" :key="index">
@@ -15,15 +26,9 @@
         </div>
         <div class="box-content">
           <!-- 二三维信息 -->
-          <gateDualSVG v-if="index == 0" ref="modelRef0"></gateDualSVG>
-          <gateDualSVG1 v-if="index == 1" ref="modelRef1"></gateDualSVG1>
-          <gateDualSVG2 v-if="index == 2" ref="modelRef2"></gateDualSVG2>
-          <gateDualSVG3 v-if="index == 3" ref="modelRef3"></gateDualSVG3>
-          <gateDualSVG4 v-if="index == 4" ref="modelRef4"></gateDualSVG4>
-          <gateDualSVG5 v-if="index == 5" ref="modelRef5"></gateDualSVG5>
-          <gateDualSVG6 v-if="index == 6" ref="modelRef6"></gateDualSVG6>
-          <gateDualSVG7 v-if="index == 7" ref="modelRef7"></gateDualSVG7>
-          <gateDualSVG8 v-if="index == 8" ref="modelRef8"></gateDualSVG8>
+          <!-- <gateDualSVG :ref="`modelRef${index}`" :indexCode="index"></gateDualSVG> -->
+          <component :ref="`modelRef${index}`" :indexCode="index"
+            :is="getModelComponent(globalConfig.is2DModel, item.deviceType)" />
         </div>
         <img src="@/assets/images/camera.png" alt="" @click="handlerCamera(item, index)" />
       </div>
@@ -34,33 +39,27 @@
     <timeSetModal :visibleTime="visibleTime" @handleCancelTime="handleCancelTime" @handleOk="handleOkTime">
     </timeSetModal>
     <!--30s延时提示弹窗-->
-    <tipModal :visible="visibletip" @handleCancel="handleCancelTip"></tipModal>
+    <tipModal></tipModal>
     <!-- 摄像头信息 -->
-    <Modals :visible="modalVisible" :destroyOnClose="true" @cancel="handleCancelCamera">
+    <Modal :visible="modalVisible" :centered="true" :destroyOnClose="true" @cancel="handleCancelCamera">
       <CameraModal :cameraData="cameraData"></CameraModal>
-    </Modals>
+    </Modal>
   </div>
 </template>
 
 <script setup lang="ts">
-import { reactive, ref, inject, watch, onMounted, h } from 'vue';
+import { reactive, ref, inject, watch, onMounted, h, shallowRef } from 'vue';
 import syncModal from './syncModal.vue';
 import timeSetModal from './timeSetModal.vue';
 import CameraModal from './cameraModal.vue';
-import Modals from './Modal.vue';
+import Modal from './Modal.vue';
 import tipModal from './tipModal.vue'
-import gateDualSVG from './gateDualSVG.vue'
-import gateDualSVG1 from './gateDualSVG1.vue'
-import gateDualSVG2 from './gateDualSVG2.vue'
-import gateDualSVG3 from './gateDualSVG3.vue'
-import gateDualSVG4 from './gateDualSVG4.vue'
-import gateDualSVG5 from './gateDualSVG5.vue'
-import gateDualSVG6 from './gateDualSVG6.vue'
-import gateDualSVG7 from './gateDualSVG7.vue'
-import gateDualSVG8 from './gateDualSVG8.vue'
+// import gateDualSVG from './gateDualSVG.vue'
 import { useRouter } from 'vue-router';
 import { devicecontrol, insertSyncRule, GetSyncRule } from '../airdoor.api'
+import { getModelComponent } from '../airdoor.data'
 import { useMessage } from '/@/hooks/web/useMessage';
+import { SvgIcon } from '/@/components/Icon';
 
 let props = defineProps({
   infoData: {
@@ -69,10 +68,6 @@ let props = defineProps({
       return [];
     },
   },
-  visibleTs30: {
-    type: Boolean,
-    default: false
-  }
 });
 
 const { createMessage } = useMessage();
@@ -98,11 +93,12 @@ const modelRef5 = ref(null);
 const modelRef6 = ref(null);
 const modelRef7 = ref(null);
 const modelRef8 = ref(null);
-const visibletip = ref(false)
+// const modelComponent = shallowRef(getModelComponent(globalConfig.is2DModel));
 
 
 //同步开启/关闭--弹窗
 function handlerOpenOrClose(data) {
+  console.log('111kaiqi')
   visible.value = true;
   visibleStatus.value = data
 }
@@ -148,20 +144,18 @@ async function handleOkTime(param) {
 function handleCancelTime(param) {
   visibleTime.value = param;
 }
-//关闭定时弹窗
-function handleCancelTip(param) {
-  visibletip.value = param
-}
 //详情跳转
 function handlerDetail(id) {
   router.push(`/monitorChannel/monitor-gate?id=${id}&deviceType=gate`);
 }
 //摄像头切换
 function handlerCamera(item, index) {
+  console.log(item,'cemarea')
   modalVisible.value = true;
   cameraData = Object.assign({}, item)
 }
 function handleCancelCamera(param) {
+  console.log(param,'990099')
   modalVisible.value = param;
 }
 
@@ -169,43 +163,42 @@ function handleCancelCamera(param) {
 function monitorAnimation(selectData, index) {
   if (index == 0) {
     modelRef0.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  } else if (index == 1) {
-    modelRef1.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  } else if (index == 2) {
-    modelRef2.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  } else if (index == 3) {
-    modelRef3.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  } else if (index == 4) {
-    modelRef4.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  } else if (index == 5) {
-    modelRef5.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  }else if (index == 6) {
-    modelRef6.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  }else if (index == 7) {
-    modelRef7.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
-  }else if (index == 8) {
-    modelRef8.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
   }
+  //  else if (index == 1) {
+  //   modelRef1.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 2) {
+  //   modelRef2.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 3) {
+  //   modelRef3.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 4) {
+  //   modelRef4.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 5) {
+  //   modelRef5.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 6) {
+  //   modelRef6.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 7) {
+  //   modelRef7.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // } else if (index == 8) {
+  //   modelRef8.value[0]?.animate?.(selectData.frontGateOpen == '1', selectData.midGateOpen == '1', selectData.rearGateOpen == '1');
+  // }
 }
 
 
 watch(() => props.infoData, (newV, oldV) => {
   console.log(newV, 'new---')
   infoDatas.value = newV
-  if (newV.length) {
-    setTimeout(() => {
-      newV.forEach((el: any, index: number) => {
-        el = Object.assign(el, el.readData)
-        monitorAnimation(el, index);
-      })
-    }, 1000)
+  // if (newV.length) {
+  //   setTimeout(() => {
+  //     newV.forEach((el: any, index: number) => {
+  //       el = Object.assign(el, el.readData)
+  //       monitorAnimation(el, index);
+  //     })
+  //   }, 1000)
 
-  }
-})
-watch(() => props.visibleTs30, (newV, oldV) => {
-  console.log(newV,'gaunbi')
-  visibletip.value = newV
+  // }
 })
+
+
 </script>
 
 <style lang="less" scoped>
@@ -214,17 +207,24 @@ watch(() => props.visibleTs30, (newV, oldV) => {
 @{theme-deepblue} {
   .door-content-r {
     --image-camera_bg: url('/@/assets/images/themify/deepblue/vent/camera_bg.png');
+    --image-btn: url(/@/assets/images/themify/deepblue/files/details/btn.png);
   }
 }
 
 .door-content-r {
   --image-camera_bg: url('/@/assets/images/vent/camera_bg.png');
+  --image-btn: url(/@/assets/images/files/details/btn.png);
   width: 100%;
   height: 100%;
 
+  .icon-style {
+    margin-right: 5px;
+  }
+
   .content-r-btn {
     width: 100%;
     height: 40px;
+    padding: 0px 10px;
     display: flex;
     // align-items: center;
   }
@@ -238,9 +238,9 @@ watch(() => props.visibleTs30, (newV, oldV) => {
 
     .content-r-box {
       position: relative;
-      width: 514px;
-      height: 300px;
-      margin: 10px;
+      width: 376px;
+      height: 270px;
+      margin: 10px 5px;
       background: var(--image-camera_bg);
       background-size: 100% 100%;
 
@@ -286,4 +286,11 @@ watch(() => props.visibleTs30, (newV, oldV) => {
     }
   }
 }
+
+::v-deep .zxm-btn-primary {
+  background-color: transparent;
+  border: none;
+  background: var(--image-btn) no-repeat !important;
+  background-size: 100% 100% !important;
+}
 </style>

src/views/vent/monitorManager/airDoor/components/door-menu-l.vue

@@ -8,26 +8,26 @@
 </template>
 
 <script setup lang="ts">
-import { ref,watch } from 'vue'
+import { ref, watch } from 'vue'
 
-let props=defineProps({
-  menuData:{
-    type:Array,
-    default:()=>{
+let props = defineProps({
+  menuData: {
+    type: Array,
+    default: () => {
       return []
     }
   }
 })
 
-let menuDatas=ref<any[]>([])
+let menuDatas = ref<any[]>([])
 
-watch(()=>props.menuData,(newV,oldV)=>{
-  console.log(newV,'menuData')
-  if(newV.length){
-    menuDatas.value=newV.map((el:any)=>{
+watch(() => props.menuData, (newV, oldV) => {
+  console.log(newV, 'menuData')
+  if (newV.length) {
+    menuDatas.value = newV.map((el: any) => {
       return {
         ...el,
-        statusC:el.readData.midGateOpen ? el.readData.frontGateOpen	=='1' && el.readData.midGateOpen=='1' && el.readData.rearGateOpen	=='1' ? '正常' : '异常' : el.readData.frontGateOpen=='1' && el.readData.rearGateOpen=='1' ? '正常' : '异常'
+        statusC: el.readData.midGateOpen ? el.readData.frontGateOpen == '1' && el.readData.midGateOpen == '1' && el.readData.rearGateOpen == '1' ? '正常' : '异常' : el.readData.frontGateOpen == '1' && el.readData.rearGateOpen == '1' ? '正常' : '异常'
       }
     })
   }
@@ -36,7 +36,18 @@ watch(()=>props.menuData,(newV,oldV)=>{
 </script>
 
 <style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .door-status-list {
+    --image-wind-door: url('@/assets/images/themify/deepblue/home-container/configurable/wind-door/wind-door.png');
+    --image-right-bd: url(/@/assets/images/themify/deepblue/home-container/configurable/wind-door/right-bd.png);
+  }
+}
+
 .door-status-list {
+  --image-wind-door: url('@/assets/images/home-container/configurable/wind-door/wind-door.png');
+  --image-right-bd: url(/@/assets/images/home-container/configurable/wind-door/right-bd.png);
   position: relative;
   width: 100%;
   height: 100%;
@@ -46,15 +57,29 @@ watch(()=>props.menuData,(newV,oldV)=>{
     justify-content: space-between;
     align-items: center;
     width: 100%;
-    height: 38px;
+    height: 48px;
     color: #fff;
     margin-bottom: 10px;
+    padding: 0px 15px 0px 40px;
+    background-image: var(--image-wind-door);
+    background-size: 100% 100%;
+    box-sizing: border-box;
+
+    .item-label {
+      width: calc(100% - 50px);
+    }
 
     .item-status {
+      width: 40px;
+      text-align: right;
+      margin-left: 10px;
       color: #16e65c;
     }
 
     .item-status-warn {
+      width: 40px;
+      text-align: right;
+      margin-left: 10px;
       color: #f00808;
     }
   }

src/views/vent/monitorManager/airDoor/components/tipModal.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="sync-modal">
-    <a-modal v-model:visible="Visible" width="450px" :title="Title" centered destroyOnClose
+    <a-modal v-model:visible="anc" width="450px" :title="Title" centered destroyOnClose
       @ok="$emit('handleCancel', false)" @cancel="$emit('handleCancel', false)">
 
       <p>
@@ -12,21 +12,19 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, watchEffect, onMounted } from 'vue'
+import { ref, reactive, watchEffect, onMounted,inject } from 'vue'
 import {
   ExclamationCircleOutlined
 } from '@ant-design/icons-vue';
 let props = defineProps({
-  visible: {
-    type: Boolean,
-    default: false
-  },
+ 
   Title: {
     type: String,
     default: '操作确认'
   }
 })
 
+let anc=inject( 'visibleTs30')
 let timeout = ref(30)
 let Visible = ref(false)
 let $emit = defineEmits(['handleCancel'])
@@ -43,10 +41,6 @@ function timeInit() {
     }
   }, 1000)
 }
-
-watchEffect(() => {
-  Visible.value = props.visible
-})
 onMounted(() => {
   timeInit()
 })

src/views/vent/monitorManager/airDoor/index.vue

@@ -6,14 +6,14 @@
         <doorMenuL :menuData="menuData"></doorMenuL>
       </div>
       <div class="container-right">
-        <doorContentR :infoData="menuData" :visibleTs30="visibleTs30"></doorContentR>
+        <doorContentR :infoData="menuData"></doorContentR>
       </div>
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, provide, onUnmounted } from 'vue'
 import customHeader from '/@/components/vent/customHeader.vue';
 import doorMenuL from './components/door-menu-l.vue'
 import doorContentR from './components/door-content-r.vue'
@@ -29,12 +29,12 @@ let timer: null | NodeJS.Timeout = null;
 function getMonitor(flag?) {
   timer = setTimeout(
     async () => {
+      await upcomingList()
       //获取左侧菜单数据
       await getMenuList()
-      await upcomingList()
       getMonitor(false);
     },
-    flag ? 0 : 5000
+    flag ? 0 : 10000
   );
 }
 //左侧数据
@@ -42,27 +42,51 @@ async function getMenuList() {
   let res = await getDevice({ devicetype: "gate", pagetype: "normal" })
   console.log(res, 'menuList')
   menuData.value = res.msgTxt[0].datalist || []
+  // menuData.value = [
+  //   { readData: { frontGateOpen: '1', midGateOpen: '0', rearGateOpen: '1' }, strinstallpos: '1020中段2#穿脉入口' },
+  //   { readData: { frontGateOpen: '1', midGateOpen: '0', rearGateOpen: '1' }, strinstallpos: '1020中段上盘沿脉巷' },
+  //   { readData: { frontGateOpen: '1', midGateOpen: '0', rearGateOpen: '1' }, strinstallpos: '1020中段上盘沿脉巷与0#穿交叉口中段上盘沿脉巷与0#穿交叉口' },
+  //   { readData: { frontGateOpen: '1', midGateOpen: '0', rearGateOpen: '1' }, strinstallpos: '1060到1020回风巷斜坡道入口' },
+  // ]
 }
 async function upcomingList() {
-   visibleTs30.value = true
-  // let res = await upcoming({})
-  // console.log(res, '定时30秒')
-  // if (res.length) {
-  //   visibleTs30.value = true
-  // } else {
-  //   visibleTs30.value = false
-  // }
+  let res = await upcoming({})
+  console.log(res, '定时30秒')
+  if (res.length) {
+    visibleTs30.value = true
+  } else {
+    visibleTs30.value = false
+  }
 }
 
 onMounted(() => {
   getMenuList()
   getMonitor()
 })
+onUnmounted(() => {
+  if (timer) {
+    clearTimeout(timer);
+    timer = undefined;
+  }
 
+});
+provide('visibleTs30', visibleTs30)
 </script>
 
 <style lang="less" scoped>
+@import '/@/design/theme.less';
+
+@{theme-deepblue} {
+  .air-door {
+    --image-left-bd: url('@/assets/images/themify/deepblue/home-container/configurable/wind-door/left-bd.png');
+    --image-right-bd: url(/@/assets/images/themify/deepblue/home-container/configurable/wind-door/right-bd.png);
+
+  }
+}
+
 .air-door {
+  --image-left-bd: url('@/assets/images/home-container/configurable/wind-door/left-bd.png');
+  --image-right-bd: url(/@/assets/images/home-container/configurable/wind-door/right-bd.png);
   position: relative;
   width: 100%;
   height: 100%;
@@ -77,23 +101,27 @@ onMounted(() => {
   }
 
   .container-left {
-    width: 260px;
+    width: 320px;
     height: 100%;
-    padding: 10px 15px;
+    padding: 20px 10px;
     margin-right: 10px;
-    border: 1px solid #99e8ff66;
-    background: #27546e1a;
+    // border: 1px solid #99e8ff66;
+    // background: #27546e1a;
+    background-image: var(--image-left-bd);
+    background-size: 100% 100%;
     overflow-y: auto;
-    box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
-    -moz-box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
-    -webkit-box-shadow: 0px 0px 50px 1px rgb(149 235 255 / 5%) inset;
+    // box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
+    // -moz-box-shadow: 0px 0px 20px 7px rgba(145, 233, 254, 0.7) inset;
+    // -webkit-box-shadow: 0px 0px 50px 1px rgb(149 235 255 / 5%) inset;
   }
 
   .container-right {
-    width: calc(100% - 275px);
+    width: calc(100% - 335px);
     height: 100%;
-    // padding: 10px;
-    // box-sizing: border-box;
+    background-image: var(--image-right-bd);
+    background-size: 100% 100%;
+    padding: 20px 10px;
+    box-sizing: border-box;
   }
 }
 </style>

src/views/vent/monitorManager/footageMonitor/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="footage-box">
-    <customHeader :fieldNames="{ label: 'systemname', value: 'id', options: 'children' }" :options='options'
+    <customHeader :fieldNames="{ label: 'label', value: 'value', options: 'children' }" :options='options'
       @change="getSelectRow" :optionValue="optionValue">进尺与瓦斯涌出分析</customHeader>
     <div class="box-container">
       <ModuleCommon></ModuleCommon>
@@ -14,7 +14,7 @@ import customHeader from '/@/components/vent/customHeader.vue';
 import ModuleCommon from './components/moduleCommon.vue';
 import { getTableList, list } from './footage.api'
 
-let options = ref()
+let options = ref<any[]>([])
 let optionValue = ref('')
 let menuList = ref<any[]>([])
 let devID = ref('')
@@ -29,9 +29,9 @@ async function getSysDataSource() {
       value: el.id,
     }
   }) || []
-   if (!optionValue.value) {
-      optionValue.value = options.value[0]['value']
-    }
+  if (!optionValue.value) {
+    optionValue.value = options.value[0]['value']
+  }
   // devID.value = menuList.value[0].value
   // devLabel.value = menuList.value[0].label