优化

src/operation/moduleNormal/controlPanel/model/FW01/index.vue

@@ -51,12 +51,12 @@
         <img class="image" :src="imgUrl" mode="aspectFit" />
         <div class="data-block-box">
           <dataBlock
-            v-if="detail.params.U002"
-            :title="detail.params.U002.paramname"
+            v-if="detail.params.E015"
+            :title="detail.params.E015.paramname"
             :data="[
               {
-                value: detail.params.U002.lastvalue,
-                unit: detail.params.U002.unit,
+                value: detail.params.E015.lastvalue,
+                unit: detail.params.E015.unit,
               },
             ]"
           ></dataBlock>
@@ -75,7 +75,7 @@
       <div class="chart">
         <MyChart
           ref="chart"
-          :options="[{ label: '阀门开度', value: ['U002'], sumShow: true }]"
+          :options="[{ label: '阀门开度', value: ['E015'], sumShow: true }]"
         ></MyChart>
       </div>
       <div class="message-header">
@@ -380,6 +380,7 @@ onUnmounted(() => {
 .control .control-content .map {
   width: 100%;
   height: 100%;
+  max-height: 68%;
   display: flex;
   justify-content: center;
   align-items: center;

src/operation/moduleNormal/controlPanel/modules/MyChart.vue

@@ -1,90 +1,81 @@
-<template> 
-  <div id="myChart" :style="[{height:'100%'},{background:fullscreen ? 'linear-gradient(90deg, #001D6A 0%, #0060B2 82%, #007BD5 100%) !important' : ''}]">
+<template>
+  <div id="myChart"
+    :style="[{ height: '100%' }, { background: fullscreen ? 'linear-gradient(90deg, #001D6A 0%, #0060B2 82%, #007BD5 100%) !important' : '' }]">
     <div style="display: flex;justify-content: space-between;" class="custome_myChart">
       <div style="display: flex;align-items: center;">
         <customBtn style="margin-right: 10px;" :btnOptions="options" @clickBtn="clickBtn"></customBtn>
         <fullScreenE color="#ffffff" domId="myChart"></fullScreenE>
       </div>
-      <div style="display: flex;align-items: center;color: #ffffff;font-size: 12px;flex-shrink: 0;"  :style="[{paddingRight:fullscreen ? '700px' : ''}]">
+      <div style="display: flex;align-items: center;color: #ffffff;font-size: 12px;flex-shrink: 0;"
+        :style="[{ paddingRight: fullscreen ? '700px' : '' }]">
         <span>{{ calcType }}</span>
         <div style="margin: 0 10px;">|</div>
         <span>{{ timeType }}</span>
         <div style="margin: 0 10px;">|</div>
         <span style="margin-right: 10px;">统计区间：{{ step }}</span>
-        <a-popconfirm
-          :getPopupContainer="triggerNode => triggerNode.parentNode"
-          @confirm="listData"
-          @cancel="cancel"
-          ok-text="查询"
-          cancel-text="重置"
-          overlayClassName="custom_select-popover"
-          placement="bottomLeft"
-        >
-        <template #icon>
-        </template>
-        <template #title> 
-          <div class="time-select">
-            <a-select size="middle" :getPopupContainer="triggerNode => triggerNode.parentNode" v-model:value="param.content.function.fn" style="width: 90px;margin-right: 10px;">
-              <a-select-option value="sum" v-if="!currentItem.sumShow">总和值</a-select-option>
-              <a-select-option value="mean">平均值</a-select-option>
-              <a-select-option value="max">最大值</a-select-option>
-              <a-select-option value="min">最小值</a-select-option>
-            </a-select>
-            <!-- <a-radio-group size="small" v-model:value="param.content.function.fn">
+        <a-popconfirm :getPopupContainer="triggerNode => triggerNode.parentNode" @confirm="listData" @cancel="cancel"
+          ok-text="查询" cancel-text="重置" overlayClassName="custom_select-popover" placement="bottomLeft">
+          <template #icon>
+          </template>
+          <template #title>
+            <div class="time-select">
+              <a-select size="middle" :getPopupContainer="triggerNode => triggerNode.parentNode"
+                v-model:value="param.content.function.fn" style="width: 90px;margin-right: 10px;">
+                <a-select-option value="sum" v-if="!currentItem.sumShow">总和值</a-select-option>
+                <a-select-option value="mean">平均值</a-select-option>
+                <a-select-option value="max">最大值</a-select-option>
+                <a-select-option value="min">最小值</a-select-option>
+              </a-select>
+              <!-- <a-radio-group size="small" v-model:value="param.content.function.fn">
               <a-radio value="sum" v-if="!currentItem.sumShow">总和值</a-radio>
               <a-radio value="mean">平均值</a-radio>
               <a-radio value="max">最大值</a-radio>
               <a-radio value="min">最小值</a-radio>
             </a-radio-group> -->
-            <a-select :getPopupContainer="triggerNode => triggerNode.parentNode" size="middle" v-model:value="time" @change="customTimeChange" style="width: 70px;margin-right: 10px;">
-              <a-select-option value="本日">本日</a-select-option>
-              <a-select-option value="本周">本周</a-select-option>
-              <a-select-option value="本年">本月</a-select-option>
-            </a-select>
-            <a-range-picker
-              direction="topRight"
-              :getPopupContainer="triggerNode => triggerNode.parentNode"
-              v-model:value="rangeTime"
-              style="width: 200px"
-              :showNow="false"
-              size="middle"
-              @change="timeRangeChange"
-              format="YYYY/MM/DD"
-              value-format="YYYY-MM-DD"
-            >
-            </a-range-picker>
-          </div>
-          <div style="display: flex;align-items: center;margin-top: 10px;">
-            <span>统计精度：</span>
-            <a-input-group compact size="middle" style="width: 120px">
-              <a-input v-model:value="param.content.function.timespan" style="width: 60px"/>
-              <a-select :getPopupContainer="triggerNode => triggerNode.parentNode" v-model:value="param.content.function.timetype">
-                <a-select-option value="m">分</a-select-option>
-                <a-select-option value="h">时</a-select-option>
-                <a-select-option value="d">天</a-select-option>
+              <a-select :getPopupContainer="triggerNode => triggerNode.parentNode" size="middle" v-model:value="time"
+                @change="customTimeChange" style="width: 70px;margin-right: 10px;">
+                <a-select-option value="本日">本日</a-select-option>
+                <a-select-option value="本周">本周</a-select-option>
+                <a-select-option value="本年">本月</a-select-option>
               </a-select>
-            </a-input-group>
+              <a-range-picker direction="topRight" :getPopupContainer="triggerNode => triggerNode.parentNode"
+                v-model:value="rangeTime" style="width: 200px" :showNow="false" size="middle" @change="timeRangeChange"
+                format="YYYY/MM/DD" value-format="YYYY-MM-DD">
+              </a-range-picker>
+            </div>
+            <div style="display: flex;align-items: center;margin-top: 10px;">
+              <span>统计精度：</span>
+              <a-input-group compact size="middle" style="width: 120px">
+                <a-input v-model:value="param.content.function.timespan" style="width: 60px" />
+                <a-select :getPopupContainer="triggerNode => triggerNode.parentNode"
+                  v-model:value="param.content.function.timetype">
+                  <a-select-option value="m">分</a-select-option>
+                  <a-select-option value="h">时</a-select-option>
+                  <a-select-option value="d">天</a-select-option>
+                </a-select>
+              </a-input-group>
+            </div>
+
+          </template>
+          <div>
+            <customBtn :btnOptions="[{ label: '筛选', icon: true }]" :icon1="false"></customBtn>
           </div>
-          
-        </template>
-        <div>
-          <customBtn :btnOptions="[{label:'筛选',icon:true}]" :icon1="false"></customBtn>
-        </div>
         </a-popconfirm>
       </div>
-      
     </div>
-    <div ref="container" style="width:100%;height:100%;padding: 30px"></div>
+    <div ref="container" style="width:100%;height:100%;padding: 30px">
+
+    </div>
   </div>
-  
+
 </template>
 
 <script setup>
 import { calcSizeFun } from './util.js'
 import dayjs from 'dayjs'
 import customBtn from './customBtn.vue'
-import {ref, defineProps, defineEmits, onMounted, h, onBeforeUnmount} from 'vue'
-import {useRouter} from 'vue-router'
+import { ref, defineProps, defineEmits, onMounted, h, onBeforeUnmount } from 'vue'
+import { useRouter } from 'vue-router'
 import { Line } from '@antv/g2plot'
 import Api from '@/api/api'
 import utils from '@/utils/utils'
@@ -98,8 +89,8 @@ let { fullscreen } = storeToRefs(base)
 let emit = defineEmits([])
 let props = defineProps({
   options: {
-    type:Object,
-    default:() => []
+    type: Object,
+    default: () => []
   }
 })
 let value1 = ref('1111')
@@ -121,41 +112,42 @@ let param = ref({
   "id": "20230707161701",
   "content": {
     "w_deviceid": router.currentRoute.value.query.id,
-    "params":[],
+    "params": [],
     "range": {
-        "timetype": "d",
-        "start": "-30",
-        "stop": ""
+      "timetype": "d",
+      "start": "-30",
+      "stop": ""
     },
     "function": {
-        "fn": "mean",
-        "timetype": "d",
-        "timespan": "1"
+      "fn": "mean",
+      "timetype": "d",
+      "timespan": "1"
     }
   }
 })
 let calcType = ref('')
 let typeList = ref([
-  {value:'sum',label:'总和值'},
-  {value:'mean',label:'平均值'},
-  {value:'max',label:'最大值'},
-  {value:'min',label:'最小值'},
+  { value: 'sum', label: '总和值' },
+  { value: 'mean', label: '平均值' },
+  { value: 'max', label: '最大值' },
+  { value: 'min', label: '最小值' },
 ])
 let timeType = ref('')
 let step = ref('')
 let stepList = [
-  {value:'m',label:'分'},
-  {value:'h',label:'时'},
-  {value:'d',label:'天'},
+  { value: 'm', label: '分' },
+  { value: 'h', label: '时' },
+  { value: 'd', label: '天' },
 ]
 const previewFun = () => {
-  calcType.value = typeList.value.filter(item => item.value == param.value.content.function.fn)[0].label
-  step.value = param.value.content.function.timespan + stepList.filter(item => item.value == param.value.content.function.timetype)[0].label
+  const typeItem = typeList.value.find(item => item.value == param.value.content.function.fn);
+  calcType.value = typeItem ? typeItem.label : '';
+  const stepItem = stepList.find(item => item.value == param.value.content.function.timetype);
+  step.value = param.value.content.function.timespan + (stepItem ? stepItem.label : '');
   if (rangeTime.value.length) {
-    timeType.value = rangeTime.value[0] + '至' + rangeTime.value[1]
+    timeType.value = rangeTime.value[0] + '至' + rangeTime.value[1];
   } else {
-    param.value.content.range.stop
-    timeType.value = time.value
+    timeType.value = time.value;
   }
 }
 
@@ -199,7 +191,7 @@ let typeChange = (data) => {
     param.value.content.range.stop = ''
   }
 }
- 
+
 let timeRangeChange = (data) => {
   console.log(data);
   if (data) {
@@ -208,8 +200,10 @@ let timeRangeChange = (data) => {
     /* 时间差 */
     let baseTime = 3600000 //小时
     let d = (Date.parse(rangeTime.value[1]) - Date.parse(rangeTime.value[0]))
-    //跨度小于12个月
-    if (d < baseTime * 24 * 30 * 12) {
+    let startYear = new Date(rangeTime.value[0]).getFullYear()
+    let endYear = new Date(rangeTime.value[1]).getFullYear()
+    // 跨度小于12个月且未跨年
+    if (d < baseTime * 24 * 30 * 12 && startYear === endYear) {
       param.value.content.range.timetype = 'time'
       param.value.content.range.start = rangeTime.value[0] + ' 00:00:00'
       param.value.content.range.stop = rangeTime.value[1] + ' 23:59:59'
@@ -220,7 +214,7 @@ let timeRangeChange = (data) => {
       param.value.content.range.stop = rangeTime.value[1] + ' 23:59:59'
       param.value.content.function.timetype = 'mo'
     }
-    
+
   } else {
     time.value = '本月'
     rangeTime.value = []
@@ -232,37 +226,37 @@ let timeRangeChange = (data) => {
 }
 
 let initChart = () => {
-  line.value = new Line(container.value,{
-    data:chartData.value,
+  line.value = new Line(container.value, {
+    data: chartData.value,
     xField: 'start',
     yField: 'value',
     seriesField: 'paramname',
     yAxis: {
       label: {
         style: {
-          fill:'#ffffff'
+          fill: '#ffffff'
         },
       },
     },
     xAxis: {
       label: {
-        style:{
-          fill:'#ffffff'
+        style: {
+          fill: '#ffffff'
         },
       },
     },
-    color:['#16FFF6','rgba(255, 164, 6)'],
+    color: ['#16FFF6', 'rgba(255, 164, 6)'],
     legend: {
       position: 'bottom',
       itemName: {
         style: {
-          fill:'#ffffff'
+          fill: '#ffffff'
         }
       }
     },
     tooltip: {
-      formatter:(v) => {
-        return {name:v.paramname,value:v.value + chartData.value.find(item => item.paramname == v.paramname).unit}
+      formatter: (v) => {
+        return { name: v.paramname, value: v.value + chartData.value.find(item => item.paramname == v.paramname).unit }
       }
     },
     area: {
@@ -304,19 +298,19 @@ let listData = async (paramname) => {
 
 const cancel = (e) => {
   param.value = {
-  "id": "20230707161701",
+    "id": "20230707161701",
     "content": {
       "w_deviceid": router.currentRoute.value.query.id,
-      "params":[],
+      "params": [],
       "range": {
-          "timetype": "d",
-          "start": "-30",
-          "stop": ""
+        "timetype": "d",
+        "start": "-30",
+        "stop": ""
       },
       "function": {
-          "fn": "mean",
-          "timetype": "d",
-          "timespan": "1"
+        "fn": "mean",
+        "timetype": "d",
+        "timespan": "1"
       }
     }
   }
@@ -332,7 +326,7 @@ onMounted(() => {
 
   timer.value = setInterval(() => {
     listData()
-  },60000)
+  }, 60000)
 })
 
 onBeforeUnmount(() => {
@@ -345,9 +339,10 @@ defineExpose({
 </script>
 
 <style scoped>
-*{
+* {
   box-sizing: border-box;
 }
+
 .time-select {
   display: flex;
   align-items: center;
@@ -355,16 +350,20 @@ defineExpose({
   flex-shrink: 0;
   margin-top: 5px;
 }
+
 /deep/.custom_select-popover {
   z-index: 1000 !important;
 }
+
 /deep/.custom_select-popover .ant-popover-message {
   padding: 0;
 }
+
 /deep/.custom_select-popover .ant-popover-message-title {
   padding: 0 !important;
 }
-/deep/.custom_select-popover .ant-popover-buttons{
-   margin-top: 10px !important;
+
+/deep/.custom_select-popover .ant-popover-buttons {
+  margin-top: 10px !important;
 }
 </style>

src/operation/moduleNormal/equipmentMag/index.vue

@@ -1,9 +1,10 @@
 <template>
-  <listTemp ref="list" :param="param" :tableName="'equipmentTable'" keyRouteName="devicename" :searchType="searchType" :detailPage="{name:'equipmentDetail',idname:'w_deviceid'}">
+  <listTemp ref="list" :param="param" :tableName="'equipmentTable'" keyRouteName="devicename" :searchType="searchType"
+    :detailPage="{ name: 'equipmentDetail', idname: 'w_deviceid' }">
     <template #operation>
       <Add @onSuccess="$refs.list.tableData()" :disabled="!utils.hasPermission('insert')"></Add>
     </template>
-    <template #tb_cell="{data}">
+    <template #tb_cell="{ data }">
       <template v-if="data.column.dataIndex === 'operation'">
       </template>
       <template v-if="data.column.dataIndex === 'serialnumber'">
@@ -11,10 +12,15 @@
           <span>{{ data.record.serialnumber }}</span>
           <a-tag v-if="data.record.isOffical == 1" style="margin-left: 10px;" color="blue">官方</a-tag>
         </div>
-        
+
       </template>
       <template v-if="data.column.dataIndex === 'isused'">
-        <span :style="{color:utils.statusAndColor(data.record.isused ? '启用' : '停用')}">{{ data.record.isused ? '启用' : '停用' }}</span>
+        <span :style="{ color: utils.statusAndColor(data.record.isused ? '启用' : '停用') }">{{ data.record.isused ? '启用' :
+          '停用' }}</span>
+      </template>
+      <template v-if="data.column.dataIndex === 'status'">
+        <span :style="{ color: utils.statusAndColor(data.record.status == '离线' ? '停用' : '启用') }">{{ data.record.status
+        }}</span>
       </template>
     </template>
   </listTemp>
@@ -25,7 +31,7 @@ import listTemp from '@/components/listTemplate/index.vue'
 import normalTable from '@/template/normalTable/index.vue'
 import customBtn from '@/components/customHandleBtn/index.vue'
 import Add from './modules/Add.vue'
-import {ref, defineProps, defineEmits, onMounted} from 'vue'
+import { ref, defineProps, defineEmits, onMounted, onBeforeUnmount } from 'vue'
 import { useBaseStore } from '@/stores/modules/base'
 import Api from '@/api/api'
 import utils from '@/utils/utils'
@@ -36,32 +42,42 @@ let base = useBaseStore()
 let emit = defineEmits([])
 let props = defineProps({})
 let searchType = ref([
-  {label:'搜索',key:'condition',type:'input'},
-  {label:'状态:',key:'isused',type:'select',dataSource:[
-    {remarks:'全部',value:''},
-    {remarks:'启用',value:1},
-    {remarks:'禁用',value:0}
-  ]},
+  { label: '搜索', key: 'condition', type: 'input' },
+  {
+    label: '状态:', key: 'isused', type: 'select', dataSource: [
+      { remarks: '全部', value: '' },
+      { remarks: '启用', value: 1 },
+      { remarks: '禁用', value: 0 }
+    ]
+  },
 ])
 let param = ref({
   "id": 20230615153202,
   "content": {
     "pageNumber": 1,
-    "pageSize": 25,
+    "pageSize": 20,
     "where": {
-        "condition": "",
-        "status": ""
+      "condition": "",
+      "status": ""
     }
   },
 })
+//定时器
+let timer = null
+let list =ref(null);
 
 onMounted(async () => {
- 
+  timer = setInterval(list.value.tableData, 180000)
+})
+
+// 当页面关闭的时候
+onBeforeUnmount(() => {
+  clearInterval(timer)
 })
 </script>
 
 <style scoped>
-.view{
+.view {
   width: 800px;
   height: 800px;
 }