邓洁: 切换隧道,数据渲染

This commit is contained in:
邓洁
2023-12-18 12:07:36 +08:00
parent c9c0c88b3e
commit 8304eaa726
7 changed files with 60 additions and 40 deletions

View File

@@ -7,6 +7,7 @@
<div class="output-fan"><span>出风{{windSpeed}}m/s</span></div> <div class="output-fan"><span>出风{{windSpeed}}m/s</span></div>
</div> </div>
</div> </div>
<div v-if="airList.length!==0">
<item-info <item-info
v-for="item in airList" v-for="item in airList"
:key="item.equipmentId" :key="item.equipmentId"
@@ -16,6 +17,7 @@
:unit="item.unit" :unit="item.unit"
@click="handleOpenAirChart(item)" @click="handleOpenAirChart(item)"
/> />
</div>
<div class="digital-tunnel"> <div class="digital-tunnel">
<el-dialog v-model="isWindSpeedVisited" :title="'风速监控数据'" width="2175px" :modal="false"> <el-dialog v-model="isWindSpeedVisited" :title="'风速监控数据'" width="2175px" :modal="false">
<div class="left-top-icon"></div> <div class="left-top-icon"></div>
@@ -136,7 +138,7 @@ const changeIcon = (type) => {
const getAirInfo = (now) => { const getAirInfo = (now) => {
let airObj = {} let airObj = {}
let airArr = [] let airArr = []
now.map(item => { now?.map(item => {
if (item.equipmentType === "dust" || item.equipmentType === "oxygen" || item.equipmentType === "temperature" || item.equipmentType === "humidness") { if (item.equipmentType === "dust" || item.equipmentType === "oxygen" || item.equipmentType === "temperature" || item.equipmentType === "humidness") {
airObj = changeData(item) airObj = changeData(item)
airArr.push(airObj) airArr.push(airObj)

View File

@@ -89,7 +89,7 @@ const timeSelect = (index) => {
const getBadGasInfo = (now) => { const getBadGasInfo = (now) => {
let windPressureObj = {}; let windPressureObj = {};
let windPressureArr = []; let windPressureArr = [];
now.map((item) => { now?.map((item) => {
if ( if (
item.equipmentType === "carbonDioxide" || item.equipmentType === "carbonDioxide" ||
item.equipmentType === "carbonMonoxide" || item.equipmentType === "carbonMonoxide" ||

View File

@@ -110,7 +110,7 @@ const changeNum = (index) => {
const getBasicData = (data) => { const getBasicData = (data) => {
let tranObj = {} let tranObj = {}
let tranArr = [] let tranArr = []
data.map(item => { data?.map(item => {
tranObj = { tranObj = {
equipmentId: item.equipmentId, equipmentId: item.equipmentId,
autoMode: item.autoMode,//自动模式 autoMode: item.autoMode,//自动模式

View File

@@ -85,7 +85,7 @@ const stateC = ref(false)
const getBasicData = (data) => { const getBasicData = (data) => {
let tranObj = {} let tranObj = {}
let tranArr = [] let tranArr = []
data.map(item => { data?.map(item => {
tranObj = { tranObj = {
equipmentId: item.equipmentId, equipmentId: item.equipmentId,
equipmentName: item.equipmentName, equipmentName: item.equipmentName,

View File

@@ -76,7 +76,7 @@ watch(() => props.list, (now) => {
const getBasicData = (data) => { const getBasicData = (data) => {
let tranObj = {} let tranObj = {}
let tranArr = [] let tranArr = []
data.map(item => { data?.map(item => {
electricityConsumptionMonthly.value = item.electricityConsumptionMonthly, electricityConsumptionMonthly.value = item.electricityConsumptionMonthly,
tranObj = { tranObj = {
equipmentId: item.equipmentId, equipmentId: item.equipmentId,

View File

@@ -87,7 +87,7 @@ const timeSelect = (index) => {
const getScreenInfo = (now) => { const getScreenInfo = (now) => {
let windPressureObj = {} let windPressureObj = {}
let windPressureArr = [] let windPressureArr = []
now.map(item => { now?.map(item => {
windPressureObj = { windPressureObj = {
equipmentId: item.equipmentId, equipmentId: item.equipmentId,
max: 120, max: 120,

View File

@@ -21,8 +21,8 @@
<el-drawer v-model="drawerLeft" direction="ltr" modal-class="modal-box" :modal="false" :show-close="false" <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"> :close-on-click-modal="false" :close-on-press-escape="false">
<fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"/> <fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"/>
<transducer-list :list="socketData.leftData" :transducer-data="largeScreenData" /> <transducer-list v-if="showFan" :list="socketData.leftData" :transducer-data="largeScreenData"/>
<used-ele :list="socketData.leftData" :ele-data="largeScreenData" /> <used-ele v-if="showFan" :list="socketData.leftData" :ele-data="largeScreenData"/>
</el-drawer> </el-drawer>
<div v-if="drawerLeft" class="left-arrow" @click="closeLeft"></div> <div v-if="drawerLeft" class="left-arrow" @click="closeLeft"></div>
<div v-else class="shrink-left" @click="closeLeft"></div> <div v-else class="shrink-left" @click="closeLeft"></div>
@@ -39,7 +39,7 @@
</div> </div>
<div class="switch-btn"> <div class="switch-btn">
<div class="arrow" @click="previousBtn"></div> <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"> <div class="btn">
<el-carousel-item v-for="item in tunnelList" :key="item.value"> <el-carousel-item v-for="item in tunnelList" :key="item.value">
{{ item.label }} {{ item.label }}
@@ -68,6 +68,7 @@ import { useAuthStore } from "@/store/userstore.js";
import {getLargeScreen, getLargeScreenInfo} from "@/api/largeScreen"; import {getLargeScreen, getLargeScreenInfo} from "@/api/largeScreen";
import {ElMessageBox} from "element-plus"; import {ElMessageBox} from "element-plus";
import {getUserInfo} from "@/api/login"; import {getUserInfo} from "@/api/login";
const authStore = useAuthStore(); const authStore = useAuthStore();
const router = useRouter(); const router = useRouter();
const selectIndex = ref(-1); const selectIndex = ref(-1);
@@ -79,6 +80,7 @@ const currentUser = ref("");
const currentDate = ref(dateFormat()); const currentDate = ref(dateFormat());
const tunnelBtn = ref(); const tunnelBtn = ref();
const tunnelList = ref([]); const tunnelList = ref([]);
const tunnelId = ref(0);
const routeList = ref([]); const routeList = ref([]);
let socket = reactive(""); let socket = reactive("");
const serialNumber = ref("SC00DY00GH00ELBT"); const serialNumber = ref("SC00DY00GH00ELBT");
@@ -99,7 +101,7 @@ onMounted(() => {
}); });
getUser() getUser()
getOtherInfo() getOtherInfo()
getScreenInfo();
}); });
const getUser = () => { const getUser = () => {
@@ -107,22 +109,38 @@ const getUser=()=>{
currentUser.value = res.data.user.userName currentUser.value = res.data.user.userName
}) })
} }
const getOtherInfo = async () => { const getOtherInfo = () => {
await getLargeScreenInfo().then((res) => { getLargeScreenInfo().then((res) => {
if (res?.code === 1000) { if (res?.code === 1000) {
routeList.value = res.data.routeList routeList.value = res.data.routeList
currentSite.value = res.data.siteOption[0].label currentSite.value = res.data.siteOption[0].label
tunnelList.value = res.data.tunnelOption tunnelList.value = res.data.tunnelOption
tunnelId.value = res.data.tunnelOption[0].value
getScreenInfo(tunnelId.value);
} }
}); });
}; };
const getScreenInfo = async () => { const getScreenInfo = async (id) => {
await getLargeScreen(1).then((res) => { await getLargeScreen(id).then((res) => {
if (res?.code === 1000) { if (res?.code === 1000) {
largeScreenData.value = res.data; 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) => { const manageSelect = (index) => {
console.log("首页点击-", index); console.log("首页点击-", index);
if (index === 0) { if (index === 0) {