邓洁 : 大屏左侧接口对接

2023-12-13 15:28:58 +08:00
parent 0b0c5f22a1
commit 0dadb58f16
7 changed files with 102 additions and 112 deletions
--- a/src/components/content/airInfo/AirInfo.vue
+++ b/src/components/content/airInfo/AirInfo.vue
@@ -9,6 +9,7 @@
    </div>
    <item-info
        v-for="item in airList"
+        :key="item.equipmentId"
        :wp="item"
        :icon="item.icon"
        :name="item.name"
--- a/src/components/content/badGasInfo/BadGasInfo.vue
+++ b/src/components/content/badGasInfo/BadGasInfo.vue
@@ -2,7 +2,7 @@
  <div id="bad-gas-info">
    <div class="title">有害气体</div>
    <div class="info-list">
-      <gas-info-item v-for="item in badGasList" :gasInfo="item" />
+      <gas-info-item v-for="item in badGasList" :key="item.equipmentId" :gasInfo="item" />
    </div>
  </div>
 </template>
--- a/src/components/content/fanInfo/FanInfo.vue
+++ b/src/components/content/fanInfo/FanInfo.vue
@@ -343,8 +343,8 @@ const option2 = {
  ],
 };

-const fan01_option = reactive(option, {deep: true});
-const fan02_option = reactive(option2, {deep: true});
+const fan01_option = reactive(option);
+const fan02_option = reactive(option2);

 function handleOnMounted() {
  Echarts_info1 = echarts.init(info1.value);
@@ -382,7 +382,6 @@ const stateIcon2 = computed(() =>
        ? "blue-state-icon.png"
        : "red-state-icon.png"
 );
-let is = ref("isInput");
 // 功率是否自动
 let isSAuto1 = ref("false");
 let isSAuto2 = ref("false");
--- a/src/components/content/transducerList/TransducerList.vue
+++ b/src/components/content/transducerList/TransducerList.vue
@@ -1,28 +1,28 @@
 <template>
  <div id="transducer-list">
-    <div v-for="(item,index) in socketData" :key="item.equipmentId">
-      <div class="transducer-item">
-        <img src="@/assets/images/transducer/sp_icon_dy.png"/>
-        <div class="info">
-          <div class="name-state">
-            <div class="name">{{index===1?'二':'一'}}号变频器</div>
-            <div class="state">
-              <img src="@/assets/images/transducer/greenLight.png"/>
-              <span>正常</span>
-            </div>
-          </div>
-          <div class="one-item">
-            <div>A相电压:{{ item.phaseVoltageA }}V</div>
-            <div>B相电压:{{ item.phaseVoltageB }}V</div>
-            <div>C相电压:{{ item.phaseVoltageC }}V</div>
-          </div>
-        </div>
-      </div>
+    <div v-for="item in transducerData" :key="item.equipmentId">
+      <!--      <div class="transducer-item">-->
+      <!--        <img src="@/assets/images/transducer/sp_icon_dy.png"/>-->
+      <!--        <div class="info">-->
+      <!--          <div class="name-state">-->
+      <!--            <div class="name">{{index===1?'二':'一'}}号变频器</div>-->
+      <!--            <div class="state">-->
+      <!--              <img src="@/assets/images/transducer/greenLight.png"/>-->
+      <!--              <span>正常</span>-->
+      <!--            </div>-->
+      <!--          </div>-->
+      <!--          <div class="one-item">-->
+      <!--            <div>A相电压:{{ item.phaseVoltageA }}V</div>-->
+      <!--            <div>B相电压:{{ item.phaseVoltageB }}V</div>-->
+      <!--            <div>C相电压:{{ item.phaseVoltageC }}V</div>-->
+      <!--          </div>-->
+      <!--        </div>-->
+      <!--      </div>-->
      <div class="transducer-item">
        <img src="@/assets/images/transducer/sp_icon_dl.png" alt=""/>
        <div class="info">
          <div class="name-state">
-            <div class="name">{{index===1?'二':'一'}}号变频器</div>
+            <div class="name">{{item.equipmentName}}</div>
            <div class="state" v-if="item.phaseCurrentB>'100'">
              <img src="@/assets/images/transducer/sp_icon_yc.png" alt=""/>
              <span style="color: red">异常</span>
@@ -43,7 +43,7 @@
        <img src="@/assets/images/transducer/sp_icon_pbq.png"/>
        <div class="info">
          <div class="name-state">
-            <div class="name">{{index===1?'二':'一'}}号变频器</div>
+            <div class="name">{{item.equipmentName}}</div>
            <div class="state">
              <img src="@/assets/images/transducer/greenLight.png"/>
              <span>正常</span>
@@ -72,55 +72,48 @@
 <script setup>
 const props = defineProps({
  list: Array,
-  feedback: Array,
+  transducerData: Array
 });
-const socketData = ref([
-  {
-    equipmentId: 23,
-    phaseCurrentA: '124.01',
-    phaseCurrentB: '124.51',
-    phaseCurrentC: '125.01',
-    phaseVoltageA: '404.01',
-    phaseVoltageB: '404.51',
-    phaseVoltageC: '414.01',
-    frequencySetting: '23',
-    frequencyFeedback: '23'
-  },
-  {
-    equipmentId: 23,
-    phaseCurrentA: '124.01',
-    phaseCurrentB: '124.51',
-    phaseCurrentC: '125.01',
-    phaseVoltageA: '404.01',
-    phaseVoltageB: '404.51',
-    phaseVoltageC: '414.01',
-    frequencySetting: '23',
-    frequencyFeedback: '23'
-  }
-])
-const contactData=ref([])
-watch(() => props.list, (now, old) => {
-  console.log('电流电压',now,contactData.value)
-  let obj={}
-  let arr=[]
-  contactData.value.forEach(contactItem=>{
-    now.forEach(item=>{
-      if(contactItem.equipmentId===item.equipmentId){
-        obj={
-          ...item,
-          frequencySetting: contactItem.frequencySetting,
-          frequencyFeedback: contactItem.frequencyFeedback
+const transducerData = ref([])
+
+watch(() => props.transducerData, (now) => {
+  getBasicData(now.frequencyChangerList)
+}, {deep: true});
+
+watch(() => props.list, (now) => {
+  transducerData.value.forEach(item => {
+    now.forEach(newItem => {
+      if (item.equipmentId === newItem.equipmentId) {
+        if (newItem.frequencyFeedback) {
+          item.frequencySetting = newItem.frequencySetting
+          item.frequencyFeedback = newItem.frequencyFeedback
+        } else if (newItem.phaseCurrentA) {
+          item.phaseCurrentA = newItem.phaseCurrentA
+          item.phaseCurrentB = newItem.phaseCurrentB
+          item.phaseCurrentC = newItem.phaseCurrentC
        }
-        arr.push(obj)
      }
    })
  })
-  socketData.value=arr
-}, {deep: true});
-watch(() => props.feedback, (now, old) => {
-  console.log('变频器频率',now)
-  contactData.value=now
 }, {deep: true});
+
+const getBasicData = (data) => {
+  let tranObj = {}
+  let tranArr = []
+  data.map(item => {
+    tranObj = {
+      equipmentId: item.equipmentId,
+      equipmentName:item.equipmentName,
+      phaseCurrentA: item.phaseCurrentA,
+      phaseCurrentB: item.phaseCurrentB,
+      phaseCurrentC: item.phaseCurrentC,
+      frequencySetting: item.frequencySetting,
+      frequencyFeedback: item.frequencyFeedback,
+    }
+    tranArr.push(tranObj)
+  })
+  transducerData.value = tranArr
+}
 </script>

 <style lang="scss" scoped>
--- a/src/components/content/usedEle/UsedEle.vue
+++ b/src/components/content/usedEle/UsedEle.vue
@@ -2,8 +2,8 @@
  <div id="used-ele">
    <div class="title">用电量</div>
    <div class="content">
-      <div class="item" v-for="(item,index) in socketData" :key="item.equipmentId">
-        <div class="name">{{index===1?'二':'一'}}号变频器</div>
+      <div class="item" v-for="item in eleData" :key="item.equipmentId">
+        <div class="name">{{ item.equipmentName }}</div>
        <ul>
          <li>
            <div></div>
@@ -25,28 +25,41 @@

 <script setup>
 const props = defineProps({
-  oneTransducer: Object,
-  twoTransducer: Object,
-  list: Array
+  list: Array,
+  eleData: Array
 });
-const socketData = ref([
-  {
-    electricityConsumptionDay: 234,
-    electricityConsumptionMonthly: 345,
-    electricityConsumptionTotal: 235,
-    equipmentId: 22,
-  },
-  {
-    electricityConsumptionDay: 234,
-    electricityConsumptionMonthly: 345,
-    electricityConsumptionTotal: 235,
-    equipmentId:23,
-  }
-])
-watch(() => props.list, (now, old) => {
-  console.log('用电量',now,old)
-  socketData.value = now
+const eleData = ref([])
+watch(() => props.eleData, (now) => {
+  getBasicData(now.frequencyChangerList)
 }, {deep: true});
+watch(() => props.list, (now) => {
+  eleData.value.forEach(item => {
+    now.forEach(newItem => {
+      if (item.equipmentId === newItem.equipmentId) {
+        if (newItem.electricityConsumptionDay) {
+          item.electricityConsumptionDay = newItem.electricityConsumptionDay
+          item.electricityConsumptionMonthly = newItem.electricityConsumptionMonthly
+          item.electricityConsumptionTotal = newItem.electricityConsumptionTotal
+        }
+      }
+    })
+  })
+}, {deep: true});
+const getBasicData = (data) => {
+  let tranObj = {}
+  let tranArr = []
+  data.map(item => {
+    tranObj = {
+      equipmentId: item.equipmentId,
+      equipmentName: item.equipmentName,
+      electricityConsumptionDay: item.electricityConsumptionDay,
+      electricityConsumptionMonthly: item.electricityConsumptionMonthly,
+      electricityConsumptionTotal: item.electricityConsumptionTotal,
+    }
+    tranArr.push(tranObj)
+  })
+  eleData.value = tranArr
+}
 </script>

 <style lang="scss" scoped>
--- a/src/components/content/windPressure/WindPressureList.vue
+++ b/src/components/content/windPressure/WindPressureList.vue
@@ -2,7 +2,7 @@
  <div id="wind-pressure">
    <div class="name">风压</div>
    <div class="list">
-      <wind-pressure-item v-for="(item,index) in wpList" :wp="item" :index="index+1"/>
+      <wind-pressure-item v-for="(item,index) in wpList" :key="item.equipmentId" :wp="item" :index="index+1"/>
    </div>
  </div>
 </template>