邓洁 : 大屏左侧接口对接
This commit is contained in:
@@ -9,6 +9,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<item-info
|
<item-info
|
||||||
v-for="item in airList"
|
v-for="item in airList"
|
||||||
|
:key="item.equipmentId"
|
||||||
:wp="item"
|
:wp="item"
|
||||||
:icon="item.icon"
|
:icon="item.icon"
|
||||||
:name="item.name"
|
:name="item.name"
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<div id="bad-gas-info">
|
<div id="bad-gas-info">
|
||||||
<div class="title">有害气体</div>
|
<div class="title">有害气体</div>
|
||||||
<div class="info-list">
|
<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>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -343,8 +343,8 @@ const option2 = {
|
|||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
const fan01_option = reactive(option, {deep: true});
|
const fan01_option = reactive(option);
|
||||||
const fan02_option = reactive(option2, {deep: true});
|
const fan02_option = reactive(option2);
|
||||||
|
|
||||||
function handleOnMounted() {
|
function handleOnMounted() {
|
||||||
Echarts_info1 = echarts.init(info1.value);
|
Echarts_info1 = echarts.init(info1.value);
|
||||||
@@ -382,7 +382,6 @@ const stateIcon2 = computed(() =>
|
|||||||
? "blue-state-icon.png"
|
? "blue-state-icon.png"
|
||||||
: "red-state-icon.png"
|
: "red-state-icon.png"
|
||||||
);
|
);
|
||||||
let is = ref("isInput");
|
|
||||||
// 功率是否自动
|
// 功率是否自动
|
||||||
let isSAuto1 = ref("false");
|
let isSAuto1 = ref("false");
|
||||||
let isSAuto2 = ref("false");
|
let isSAuto2 = ref("false");
|
||||||
|
|||||||
@@ -1,28 +1,28 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="transducer-list">
|
<div id="transducer-list">
|
||||||
<div v-for="(item,index) in socketData" :key="item.equipmentId">
|
<div v-for="item in transducerData" :key="item.equipmentId">
|
||||||
<div class="transducer-item">
|
<!-- <div class="transducer-item">-->
|
||||||
<img src="@/assets/images/transducer/sp_icon_dy.png"/>
|
<!-- <img src="@/assets/images/transducer/sp_icon_dy.png"/>-->
|
||||||
<div class="info">
|
<!-- <div class="info">-->
|
||||||
<div class="name-state">
|
<!-- <div class="name-state">-->
|
||||||
<div class="name">{{index===1?'二':'一'}}号变频器</div>
|
<!-- <div class="name">{{index===1?'二':'一'}}号变频器</div>-->
|
||||||
<div class="state">
|
<!-- <div class="state">-->
|
||||||
<img src="@/assets/images/transducer/greenLight.png"/>
|
<!-- <img src="@/assets/images/transducer/greenLight.png"/>-->
|
||||||
<span>正常</span>
|
<!-- <span>正常</span>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="one-item">
|
<!-- <div class="one-item">-->
|
||||||
<div>A相电压:{{ item.phaseVoltageA }}V</div>
|
<!-- <div>A相电压:{{ item.phaseVoltageA }}V</div>-->
|
||||||
<div>B相电压:{{ item.phaseVoltageB }}V</div>
|
<!-- <div>B相电压:{{ item.phaseVoltageB }}V</div>-->
|
||||||
<div>C相电压:{{ item.phaseVoltageC }}V</div>
|
<!-- <div>C相电压:{{ item.phaseVoltageC }}V</div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="transducer-item">
|
<div class="transducer-item">
|
||||||
<img src="@/assets/images/transducer/sp_icon_dl.png" alt=""/>
|
<img src="@/assets/images/transducer/sp_icon_dl.png" alt=""/>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<div class="name-state">
|
<div class="name-state">
|
||||||
<div class="name">{{index===1?'二':'一'}}号变频器</div>
|
<div class="name">{{item.equipmentName}}</div>
|
||||||
<div class="state" v-if="item.phaseCurrentB>'100'">
|
<div class="state" v-if="item.phaseCurrentB>'100'">
|
||||||
<img src="@/assets/images/transducer/sp_icon_yc.png" alt=""/>
|
<img src="@/assets/images/transducer/sp_icon_yc.png" alt=""/>
|
||||||
<span style="color: red">异常</span>
|
<span style="color: red">异常</span>
|
||||||
@@ -43,7 +43,7 @@
|
|||||||
<img src="@/assets/images/transducer/sp_icon_pbq.png"/>
|
<img src="@/assets/images/transducer/sp_icon_pbq.png"/>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<div class="name-state">
|
<div class="name-state">
|
||||||
<div class="name">{{index===1?'二':'一'}}号变频器</div>
|
<div class="name">{{item.equipmentName}}</div>
|
||||||
<div class="state">
|
<div class="state">
|
||||||
<img src="@/assets/images/transducer/greenLight.png"/>
|
<img src="@/assets/images/transducer/greenLight.png"/>
|
||||||
<span>正常</span>
|
<span>正常</span>
|
||||||
@@ -72,55 +72,48 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
list: Array,
|
list: Array,
|
||||||
feedback: Array,
|
transducerData: Array
|
||||||
});
|
});
|
||||||
const socketData = ref([
|
const transducerData = ref([])
|
||||||
{
|
|
||||||
equipmentId: 23,
|
watch(() => props.transducerData, (now) => {
|
||||||
phaseCurrentA: '124.01',
|
getBasicData(now.frequencyChangerList)
|
||||||
phaseCurrentB: '124.51',
|
}, {deep: true});
|
||||||
phaseCurrentC: '125.01',
|
|
||||||
phaseVoltageA: '404.01',
|
watch(() => props.list, (now) => {
|
||||||
phaseVoltageB: '404.51',
|
transducerData.value.forEach(item => {
|
||||||
phaseVoltageC: '414.01',
|
now.forEach(newItem => {
|
||||||
frequencySetting: '23',
|
if (item.equipmentId === newItem.equipmentId) {
|
||||||
frequencyFeedback: '23'
|
if (newItem.frequencyFeedback) {
|
||||||
},
|
item.frequencySetting = newItem.frequencySetting
|
||||||
{
|
item.frequencyFeedback = newItem.frequencyFeedback
|
||||||
equipmentId: 23,
|
} else if (newItem.phaseCurrentA) {
|
||||||
phaseCurrentA: '124.01',
|
item.phaseCurrentA = newItem.phaseCurrentA
|
||||||
phaseCurrentB: '124.51',
|
item.phaseCurrentB = newItem.phaseCurrentB
|
||||||
phaseCurrentC: '125.01',
|
item.phaseCurrentC = newItem.phaseCurrentC
|
||||||
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
|
|
||||||
}
|
}
|
||||||
arr.push(obj)
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
socketData.value=arr
|
|
||||||
}, {deep: true});
|
|
||||||
watch(() => props.feedback, (now, old) => {
|
|
||||||
console.log('变频器频率',now)
|
|
||||||
contactData.value=now
|
|
||||||
}, {deep: true});
|
}, {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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -2,8 +2,8 @@
|
|||||||
<div id="used-ele">
|
<div id="used-ele">
|
||||||
<div class="title">用电量</div>
|
<div class="title">用电量</div>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="item" v-for="(item,index) in socketData" :key="item.equipmentId">
|
<div class="item" v-for="item in eleData" :key="item.equipmentId">
|
||||||
<div class="name">{{index===1?'二':'一'}}号变频器</div>
|
<div class="name">{{ item.equipmentName }}</div>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<div></div>
|
<div></div>
|
||||||
@@ -25,28 +25,41 @@
|
|||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
oneTransducer: Object,
|
list: Array,
|
||||||
twoTransducer: Object,
|
eleData: Array
|
||||||
list: Array
|
|
||||||
});
|
});
|
||||||
const socketData = ref([
|
const eleData = ref([])
|
||||||
{
|
watch(() => props.eleData, (now) => {
|
||||||
electricityConsumptionDay: 234,
|
getBasicData(now.frequencyChangerList)
|
||||||
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
|
|
||||||
}, {deep: true});
|
}, {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>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<div id="wind-pressure">
|
<div id="wind-pressure">
|
||||||
<div class="name">风压</div>
|
<div class="name">风压</div>
|
||||||
<div class="list">
|
<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>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -20,9 +20,9 @@
|
|||||||
<div class="left">
|
<div class="left">
|
||||||
<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.frequencyState"/>
|
<fan-info v-if="showFan" :list="socketData.leftData" :fan-data="largeScreenData"/>
|
||||||
<transducer-list :list="socketData.currentVoltage" :feedback="socketData.frequencyFeedback"/>
|
<transducer-list :list="socketData.leftData" :transducer-data="largeScreenData"/>
|
||||||
<used-ele :list="socketData.electricityConsumption"/>
|
<used-ele :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>
|
||||||
@@ -115,10 +115,7 @@ let send = {
|
|||||||
}
|
}
|
||||||
const largeScreenData = ref(null)
|
const largeScreenData = ref(null)
|
||||||
const socketData = reactive({
|
const socketData = reactive({
|
||||||
currentVoltage: [],
|
leftData: [],
|
||||||
frequencyState: [],
|
|
||||||
frequencyFeedback: [],
|
|
||||||
electricityConsumption: [],
|
|
||||||
windPressure: [],
|
windPressure: [],
|
||||||
sensor: [],
|
sensor: [],
|
||||||
})
|
})
|
||||||
@@ -140,7 +137,6 @@ const getScreenInfo = async () => {
|
|||||||
const manageSelect = (index) => {
|
const manageSelect = (index) => {
|
||||||
console.log('首页点击-', index)
|
console.log('首页点击-', index)
|
||||||
if (index === 0) {
|
if (index === 0) {
|
||||||
console.log('站点管理=====-----')
|
|
||||||
router.push('/site')
|
router.push('/site')
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -181,23 +177,11 @@ const initWebSocket = () => {
|
|||||||
const data = JSON.parse(event.data).data
|
const data = JSON.parse(event.data).data
|
||||||
if (type === 'equipment') {
|
if (type === 'equipment') {
|
||||||
data.forEach((item) => {
|
data.forEach((item) => {
|
||||||
if (item.typeKey === 'currentVoltage') {
|
if (item.typeKey === 'frequency') {
|
||||||
console.log('电流电压')
|
socketData.leftData = data
|
||||||
socketData.currentVoltage = data
|
|
||||||
} else if (item.typeKey === 'frequencyFeedback') {
|
|
||||||
console.log('变频器频率')
|
|
||||||
socketData.frequencyFeedback = data
|
|
||||||
} else if (item.typeKey === 'frequencyState') {
|
|
||||||
console.log('风机状态')
|
|
||||||
socketData.frequencyState = data
|
|
||||||
} else if (item.typeKey === 'electricityConsumption') {
|
|
||||||
console.log('用电量')
|
|
||||||
socketData.electricityConsumption = data
|
|
||||||
} else if (item.typeKey === 'windPressure') {
|
} else if (item.typeKey === 'windPressure') {
|
||||||
console.log('风压风压')
|
|
||||||
socketData.windPressure = data
|
socketData.windPressure = data
|
||||||
} else if (item.typeKey === 'sensor') {
|
} else if (item.typeKey === 'sensor') {
|
||||||
console.log('传感器==========?')
|
|
||||||
socketData.sensor = data
|
socketData.sensor = data
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user