From d79c179fce51154bf8151a9717981456dd2f55e7 Mon Sep 17 00:00:00 2001 From: 15133876896-BGG25 <2233720980@qq.com> Date: Fri, 9 Jun 2023 17:23:05 +0800 Subject: [PATCH] =?UTF-8?q?1.=E6=9C=BA=E6=A2=B0=E5=88=86=E5=8E=82=E8=83=BD?= =?UTF-8?q?=E8=80=97=E5=A2=9E=E5=8A=A0=E7=94=A8=E6=B0=B4=E9=87=8F=202.?= =?UTF-8?q?=E7=B2=BE=E9=A5=B0=E8=BD=A6=E9=97=B4=E7=8E=AF=E5=A2=83=E5=A2=9E?= =?UTF-8?q?=E5=8A=A0=E7=94=A8=E6=B0=94=E3=80=81=E7=94=A8=E6=B0=B4=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/PaintShopView/View1/bottom.vue | 64 +++++++++++------- src/views/PaintShopView/View1/index.vue | 11 ++++ .../content/chart/water.vue | 65 ++++++++++--------- .../content/top.vue | 36 ++++++++-- 4 files changed, 113 insertions(+), 63 deletions(-) diff --git a/src/views/PaintShopView/View1/bottom.vue b/src/views/PaintShopView/View1/bottom.vue index 3c3f404..dc201fa 100644 --- a/src/views/PaintShopView/View1/bottom.vue +++ b/src/views/PaintShopView/View1/bottom.vue @@ -1,5 +1,5 @@ +
+ + @@ -37,6 +44,8 @@ import border3 from "@/components/borderBox/border3.vue"; import pm from "./../components/pm.vue"; import power from "./chart/power2023.vue"; import chart from "@/components/assembly/chart2.vue"; +import gas from "./chart/gas.vue"; +import water from "./chart/water.vue"; import { useRoute, useRouter } from "vue-router"; import { useEnergyConsumeStore } from "@/store/module/energyConsume"; import { useI18n } from 'vue-i18n' @@ -49,6 +58,9 @@ let Productionref = ref(); let borderref = ref() let pmref = ref() let pm_timer = null + +let gasref = ref(); +let waterref = ref(); let props = defineProps<{ width: number; height: number; @@ -72,12 +84,13 @@ function reset(val: any) { } const powerBox = (width: any, height: any) => { - let a = calcWH(height, width, 1, 3, 0); + let a = calcWH(height, width, 1, 24, 0); //修改高度 - powerref.value.setchartWH(a.oWidth - 20, a.oHeight - 20); - Productionref.value.setchartWH(a.oWidth - 20, a.oHeight - 20); - pmref.value.setchartWH(a.oWidth - 40, a.oHeight - 40) - // yields.value.setchartWH(a.oWidth, a.oHeight - 30); + powerref.value.setchartWH(a.oWidth*7 - 20, a.oHeight - 20); + Productionref.value.setchartWH(a.oWidth*7 - 20, a.oHeight - 20); + pmref.value.setchartWH(a.oWidth*7 - 40, a.oHeight - 40) + gasref.value.setchartWH(a.oWidth*3-20, a.oHeight/2 - 20); + waterref.value.setchartWH(a.oWidth*3-20, a.oHeight/2 - 20); }; let powerOption = reactive({ title: "", @@ -103,9 +116,9 @@ let powerOption = reactive({ right: 20, }, grid: { - top: "8%", + top: "13%", left: "3%", - right: "0%", + right: "5%", bottom: "3%", containLabel: true, }, @@ -146,9 +159,9 @@ let ProductionOption = reactive({ right: 20, }, grid: { - top: "8%", + top: "13%", left: "3%", - right: "0%", + right: "5%", bottom: "3%", containLabel: true, }, @@ -166,20 +179,6 @@ let ProductionOption = reactive({ }, }); let Data = { power: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 }, Production: { "1月": 11, "2月": 22, "3月": 11, "4月": 22 } } -// async function getpower() { -// let result: any = await getPowerData({ time: 1 }); - -// if (result.code == 200) { -// result.data.name = result.data.name.reverse(); -// result.data.listData.forEach((res) => { -// for (let key in res.month) { -// res.month[key] = res.month[key].reverse(); -// } -// }); -// power1.value.setData(result.data); -// // yields.value.setData(result.data); -// } -// } let pm_index = 0 function setcontentData(val) { clearInterval(pm_timer) @@ -279,6 +278,20 @@ function setcontentData(val) { } }, 3000) } + + +} + // 用水量用气量 +function setWaterGas(val:any){ +console.log(val); +val.forEach(res=>{ + if(res.deptName=='喷漆车间' && res.type=='GasDetail'){ + gasref.value.setData(res.usageNum); + } + if(res.deptName=='生产区' && res.type=='WaterDetail'){ + waterref.value.setData(res.usageNum); + } +}) } onMounted(() => { }); @@ -287,6 +300,7 @@ onUnmounted(() => { }); defineExpose({ setcontentData, + setWaterGas }); diff --git a/src/views/PaintShopView/View1/index.vue b/src/views/PaintShopView/View1/index.vue index 08edab6..3b9d4e6 100644 --- a/src/views/PaintShopView/View1/index.vue +++ b/src/views/PaintShopView/View1/index.vue @@ -36,6 +36,7 @@ import { calcWH } from '@/components/ts/selfAdaption' import { Offsite } from "@/store/module/offsite"; import { connectWebsocket, closeWebsocket } from "@/utils/websocket"; import { getSensorByDept } from "@/http/PaintShopView/index"; +import {getconsumeDetail} from '@/http/energyConsume' import bottom from "./bottom.vue" import top from "./top.vue" import { useI18n } from 'vue-i18n' @@ -77,6 +78,15 @@ async function getSensorByDeptfun() { bottomref.value.setcontentData(result.data) } } + +async function getconsumeDetailfun(){ + let result:any = await getconsumeDetail() + + if(result.code==200){ + bottomref.value.setWaterGas(result.data) + } +} + function getWebsocket(val) { // headerref.value.HeadergetWebsocket(val) try { @@ -108,6 +118,7 @@ onMounted(() => { }, 1000); }) getSensorByDeptfun() + getconsumeDetailfun() connectWebsocket(null, null, getWebsocket, errWebsocket); }) onUnmounted(() => { diff --git a/src/views/energyConsumeJixiefenchang/content/chart/water.vue b/src/views/energyConsumeJixiefenchang/content/chart/water.vue index 7046975..ee400c6 100644 --- a/src/views/energyConsumeJixiefenchang/content/chart/water.vue +++ b/src/views/energyConsumeJixiefenchang/content/chart/water.vue @@ -1,5 +1,5 @@ @@ -23,19 +23,17 @@ import {getCurrentInstance, onMounted, reactive, ref} from "vue" import {EDataPerson,EDataPersonItem} from '@/type/energyConsume' import 'echarts-liquidfill' - -import border4 from "@/components/borderBox/border4.vue" +import border6 from "@/components/borderBox/border6.vue"; const { proxy } = getCurrentInstance() as any; let props=defineProps<{ title:string, - data:any }>() -let water=ref() +let gas=ref() let refborder4=ref() const echartsData = reactive({ - water:{ + gas:{ div:null, data:null, title:'', @@ -43,22 +41,24 @@ const echartsData = reactive({ }, }) -const setData=()=>{ - - echartsData.water!.div=water.value - echartsData.water!.title=props.title - echartsData.water!.data=({ +const setData=(value:any)=>{ + + echartsData.gas!.div=gas.value + echartsData.gas!.title=props.title + echartsData.gas!.data=({ title: { // 标题 - text: echartsData.water!.title, + text: echartsData.gas!.title, textStyle:{ color:'#fff', fontSize:20 - } + }, + top:'2%' }, series: [{ type: 'liquidFill', radius: '80%', //水球大小 + shape:'rect', center: ['50%', '50%'], waveAnimation: true, color: [ @@ -95,7 +95,9 @@ const setData=()=>{ fontWeight: 'bold', color: '#fff', }, - formatter:props.data + formatter:function(params){ + return value + } }, }, @@ -109,8 +111,7 @@ const setData=()=>{ }], }) - -change(echartsData.water) +change(echartsData.gas) } const change = (item:EDataPersonItem) => { @@ -123,32 +124,32 @@ item.box = Ebox }; function setchartWH(width:any,height:any){ - echartsData.water!.div=water.value - water.value.style.height=height+'px' - water.value.style.width=width+'px' + // echartsData.water!.div=water.value + gas.value.style.height=height-20+'px' + gas.value.style.width=width+'px' refborder4.value.resetWH() -if(echartsData.water.box){ - echartsData.water.box.resize() +if(echartsData.gas.box){ + echartsData.gas.box.resize() } } onMounted(() => { - setData() + // setData() }) // return{setchartWH} defineExpose({ setchartWH, -// setData + setData })