Merge pull request '邓洁: 切换隧道,数据渲染' (#162) from dengjie into dev

Reviewed-on: http://git.feashow.cn/clay/tunnel-cloud-web/pulls/162
2023-12-18 04:07:59 +00:00
parent 02bfcc068b 8304eaa726
commit 39e33b1de3
7 changed files with 60 additions and 40 deletions
--- a/src/components/content/airInfo/AirInfo.vue
+++ b/src/components/content/airInfo/AirInfo.vue
@@ -7,15 +7,17 @@
        <div class="output-fan"><span>出风：{{windSpeed}}m/s</span></div>
      </div>
    </div>
-    <item-info
-        v-for="item in airList"
-        :key="item.equipmentId"
-        :wp="item"
-        :icon="item.icon"
-        :name="item.name"
-        :unit="item.unit"
-        @click="handleOpenAirChart(item)"
-    />
+    <div v-if="airList.length!==0">
+      <item-info
+          v-for="item in airList"
+          :key="item.equipmentId"
+          :wp="item"
+          :icon="item.icon"
+          :name="item.name"
+          :unit="item.unit"
+          @click="handleOpenAirChart(item)"
+      />
+    </div>
    <div class="digital-tunnel">
      <el-dialog v-model="isWindSpeedVisited" :title="'风速监控数据'" width="2175px" :modal="false">
        <div class="left-top-icon"></div>
@@ -136,7 +138,7 @@ const changeIcon = (type) => {
 const getAirInfo = (now) => {
  let airObj = {}
  let airArr = []
-  now.map(item => {
+  now?.map(item => {
    if (item.equipmentType === "dust" || item.equipmentType === "oxygen" || item.equipmentType === "temperature" || item.equipmentType === "humidness") {
      airObj = changeData(item)
      airArr.push(airObj)
--- a/src/components/content/badGasInfo/BadGasInfo.vue
+++ b/src/components/content/badGasInfo/BadGasInfo.vue
@@ -89,7 +89,7 @@ const timeSelect = (index) => {
 const getBadGasInfo = (now) => {
  let windPressureObj = {};
  let windPressureArr = [];
-  now.map((item) => {
+  now?.map((item) => {
    if (
      item.equipmentType === "carbonDioxide" ||
      item.equipmentType === "carbonMonoxide" ||
--- a/src/components/content/fanInfo/FanInfo.vue
+++ b/src/components/content/fanInfo/FanInfo.vue
@@ -110,7 +110,7 @@ const changeNum = (index) => {
 const getBasicData = (data) => {
  let tranObj = {}
  let tranArr = []
-  data.map(item => {
+  data?.map(item => {
    tranObj = {
      equipmentId: item.equipmentId,
      autoMode: item.autoMode,//自动模式
--- a/src/components/content/transducerList/TransducerList.vue
+++ b/src/components/content/transducerList/TransducerList.vue
@@ -85,7 +85,7 @@ const stateC = ref(false)
 const getBasicData = (data) => {
  let tranObj = {}
  let tranArr = []
-  data.map(item => {
+  data?.map(item => {
    tranObj = {
      equipmentId: item.equipmentId,
      equipmentName: item.equipmentName,
--- a/src/components/content/usedEle/UsedEle.vue
+++ b/src/components/content/usedEle/UsedEle.vue
@@ -76,7 +76,7 @@ watch(() => props.list, (now) => {
 const getBasicData = (data) => {
  let tranObj = {}
  let tranArr = []
-  data.map(item => {
+  data?.map(item => {
    electricityConsumptionMonthly.value = item.electricityConsumptionMonthly,
        tranObj = {
          equipmentId: item.equipmentId,
--- a/src/components/content/windPressure/WindPressureList.vue
+++ b/src/components/content/windPressure/WindPressureList.vue
@@ -87,7 +87,7 @@ const timeSelect = (index) => {
 const getScreenInfo = (now) => {
  let windPressureObj = {}
  let windPressureArr = []
-  now.map(item => {
+  now?.map(item => {
    windPressureObj = {
      equipmentId: item.equipmentId,
      max: 120,
--- a/src/views/tunnel/index.vue
+++ b/src/views/tunnel/index.vue
@@ -1,7 +1,7 @@
 <template>
  <div id="main">
    <div class="box-top">
-      <manage-btn v-model="selectIndex" @select="manageSelect" :list="routeList" />
+      <manage-btn v-model="selectIndex" @select="manageSelect" :list="routeList"/>
      <div class="tunnel-title"></div>
      <manage-length class="tunnel-length"></manage-length>
      <div class="top-right">
@@ -16,30 +16,30 @@
        </div>
      </div>
    </div>
-    <tunnel-scene id="tunnel-box" />
+    <tunnel-scene id="tunnel-box"/>
    <div class="left">
      <el-drawer v-model="drawerLeft" direction="ltr" modal-class="modal-box" :modal="false" :show-close="false"
-        :close-on-click-modal="false" :close-on-press-escape="false">
-        <fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData" />
-        <transducer-list :list="socketData.leftData" :transducer-data="largeScreenData" />
-        <used-ele :list="socketData.leftData" :ele-data="largeScreenData" />
+                 :close-on-click-modal="false" :close-on-press-escape="false">
+        <fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"/>
+        <transducer-list v-if="showFan" :list="socketData.leftData" :transducer-data="largeScreenData"/>
+        <used-ele v-if="showFan" :list="socketData.leftData" :ele-data="largeScreenData"/>
      </el-drawer>
      <div v-if="drawerLeft" class="left-arrow" @click="closeLeft"></div>
      <div v-else class="shrink-left" @click="closeLeft"></div>
    </div>
    <div class="right">
      <el-drawer v-model="drawerRight" direction="rtl" modal-class="modal-box" :modal="false" :show-close="false"
-        :close-on-click-modal="false" :close-on-press-escape="false">
-        <wind-pressure-list v-if="showFan" :list="socketData.windPressure" :win-data="largeScreenData" />
-        <air-info v-if="showFan" :list="socketData.sensor" :air-data="largeScreenData" />
-        <bad-gas-info v-if="showFan" :list="socketData.sensor" :bad-gas-data="largeScreenData" />
+                 :close-on-click-modal="false" :close-on-press-escape="false">
+        <wind-pressure-list v-if="showFan" :list="socketData.windPressure" :win-data="largeScreenData"/>
+        <air-info v-if="showFan" :list="socketData.sensor" :air-data="largeScreenData"/>
+        <bad-gas-info v-if="showFan" :list="socketData.sensor" :bad-gas-data="largeScreenData"/>
      </el-drawer>
      <div v-if="drawerRight" class="right-arrow" @click="closeRight"></div>
      <div v-else class="shrink-right" @click="closeRight"></div>
    </div>
    <div class="switch-btn">
      <div class="arrow" @click="previousBtn"></div>
-      <el-carousel height="150px" type="card" ref="tunnelBtn" :autoplay="false">
+      <el-carousel height="150px" type="card" ref="tunnelBtn" :autoplay="false" @change="changeTunnel">
        <div class="btn">
          <el-carousel-item v-for="item in tunnelList" :key="item.value">
            {{ item.label }}
@@ -61,13 +61,14 @@ import AirInfo from "@/components/content/airInfo/AirInfo.vue";
 import BadGasInfo from "@/components/content/badGasInfo/BadGasInfo.vue";
 import ManageBtn from "@/components/manageBtn/index.vue";
 import ManageLength from "@/components/manageLength/index.vue";
-import { dateFormat } from "@/utils/date.js";
-import { onMounted } from "vue";
-import { getToken } from "@/utils/auth";
-import { useAuthStore } from "@/store/userstore.js";
-import { getLargeScreen, getLargeScreenInfo } from "@/api/largeScreen";
-import { ElMessageBox } from "element-plus";
+import {dateFormat} from "@/utils/date.js";
+import {onMounted} from "vue";
+import {getToken} from "@/utils/auth";
+import {useAuthStore} from "@/store/userstore.js";
+import {getLargeScreen, getLargeScreenInfo} from "@/api/largeScreen";
+import {ElMessageBox} from "element-plus";
 import {getUserInfo} from "@/api/login";
+
 const authStore = useAuthStore();
 const router = useRouter();
 const selectIndex = ref(-1);
@@ -79,6 +80,7 @@ const currentUser = ref("");
 const currentDate = ref(dateFormat());
 const tunnelBtn = ref();
 const tunnelList = ref([]);
+const tunnelId = ref(0);
 const routeList = ref([]);
 let socket = reactive("");
 const serialNumber = ref("SC00DY00GH00ELBT");
@@ -99,30 +101,46 @@ onMounted(() => {
  });
  getUser()
  getOtherInfo()
-  getScreenInfo();
+
 });

-const getUser=()=>{
-  getUserInfo().then(res=>{
-    currentUser.value=res.data.user.userName
+const getUser = () => {
+  getUserInfo().then(res => {
+    currentUser.value = res.data.user.userName
  })
 }
-const getOtherInfo = async () => {
-  await getLargeScreenInfo().then((res) => {
+const getOtherInfo = () => {
+  getLargeScreenInfo().then((res) => {
    if (res?.code === 1000) {
      routeList.value = res.data.routeList
      currentSite.value = res.data.siteOption[0].label
      tunnelList.value = res.data.tunnelOption
+      tunnelId.value = res.data.tunnelOption[0].value
+      getScreenInfo(tunnelId.value);
    }
  });
 };
-const getScreenInfo = async () => {
-  await getLargeScreen(1).then((res) => {
+const getScreenInfo = async (id) => {
+  await getLargeScreen(id).then((res) => {
    if (res?.code === 1000) {
      largeScreenData.value = res.data;
    }
  });
 };
+const changeTunnel = (e) => {
+  console.log('e', e,tunnelList.value)
+  let newObj = {}
+  tunnelList.value.forEach((item, index) => {
+    if (index === e) {
+      newObj = item
+    }
+  })
+  getScreenInfo(newObj.value)
+  nextTick(() => {
+    showFan.value = true;
+  });
+  console.log('newObj', newObj)
+}
 const manageSelect = (index) => {
  console.log("首页点击-", index);
  if (index === 0) {