From d372f82db7bf15ed38f8faf2e6b90080f9343c04 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期三, 06 十二月 2023 09:48:18 +0800 Subject: [PATCH] 显示字数修改 --- src/views/cockpitPage/index.vue | 237 +++++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 180 insertions(+), 57 deletions(-) diff --git a/src/views/cockpitPage/index.vue b/src/views/cockpitPage/index.vue index 715ee71..2c88af8 100644 --- a/src/views/cockpitPage/index.vue +++ b/src/views/cockpitPage/index.vue @@ -4,7 +4,10 @@ <StatisticalBox :all-list="allList"></StatisticalBox> </template> <template #leftBlock2> - <MachineStartupRate></MachineStartupRate> + <MachineStartupRate + ref="leftBlock2" + :startup-rate="startupRateString" + ></MachineStartupRate> </template> <template #leftBlock3> <CountView :total-object="totalObject"></CountView> @@ -15,19 +18,25 @@ ></OrderCompleteRadio> </template> <template #leftBlock5> - <WorkOrderProgress></WorkOrderProgress> + <WorkOrderProgress + :work-order-finish-rate="workOrderFinishRate" + :table-data="workOrderData" + ></WorkOrderProgress> </template> <template #leftBlock6> - <PerSonnelProductivity></PerSonnelProductivity> + <PerSonnelProductivity + ref="leftBlock6" + :chartData="perSonnelChartData" + ></PerSonnelProductivity> </template> <template #rightBlock1> - <DeviceChart></DeviceChart> + <DeviceChart ref="rightBlock1" :chartData="deviceChartData"></DeviceChart> </template> <template #rightBlock2> - <MaterialChart></MaterialChart> + <MaterialChart :chartData="materialChartData"></MaterialChart> </template> <template #rightBlock3> - <BarChart></BarChart> + <BarChart :chartData="barChartData"></BarChart> </template> </BackgroundBoardLayout> </template> @@ -69,6 +78,13 @@ { value: 0, label: "鐗╂枡涓嶈冻" }, { value: 0, label: "璁″垝杈炬垚鐜�" }, ], + // 鏈哄櫒寮�鏈虹巼 + startupRate: { + Total: 0, // 鎬绘満鍣ㄦ暟 + Running: 0, // 寮�鏈哄彴鏁� + Maintenance: 0, // 缁翠慨涓澶囨暟 + }, + startupRateString: "0", // 寮�鏈虹巼 // 宸︿腑鏁版嵁缁熻瀵硅薄 totalObject: {}, // 璁㈠崟瀹屾垚姣旂巼 @@ -76,27 +92,67 @@ startIndex: 0, orderCompleteList: [], }, - dataindex: 0, + // 宸ュ崟杩涘害缁熻 + workOrderData: [], + workOrderFinishRate: "", + // 浜哄憳鐢熶骇鏁堢巼 + perSonnelChartData: { + datax: [], + datay: [], + }, + // 璁惧璐熻嵎瀵规瘮 + deviceChartData: { + datax: [], + datay: [], + }, + // 鐗╂枡闇�姹傜粺璁� + materialChartData: { + datax: [], + datay: [], + }, + // 杞﹂棿姝e搧鐜� + barChartData: { + total: 0, + rate: "0", + datax: [], + datay: [], + datay2: [], + }, }; }, mounted() { this.getDashboard(); - setInterval(() => { - this.getDashboard(); - }, 10000); }, watch: {}, methods: { async getDashboard() { - await getDashboard().then((res) => { - console.log(res); - // 宸︿笂鏁板�肩粺璁℃暟鎹� - this.setLeftBlock1(res.data); - // 宸︿腑鏁版嵁缁熻鍊� - this.setLeftBlock3(res.data); - // 璁㈠崟瀹屾垚姣旂巼 - this.setLeftBlock4(res.data); - }); + await getDashboard() + .then((res) => { + console.log(res); + // 宸︿笂鏁板�肩粺璁℃暟鎹� + this.setLeftBlock1(res.data); + // 鏈哄櫒寮�鏈虹巼鏁版嵁 + this.setleftBlock2(res.data); + // 宸︿腑鏁版嵁缁熻鍊� + this.setLeftBlock3(res.data); + // 璁㈠崟瀹屾垚姣旂巼 + this.setLeftBlock4(res.data); + // 宸ュ崟杩涘害缁熻 + this.setLeftBlock5(res.data); + // 浜哄憳鐢熸晥鏁堢巼姣� 浜哄憳鎶�鑳� + this.setLeftBlock6(res.data); + // 璁惧璐熻嵎瀵规瘮 + this.setRightBlock1(res.data); + // 鐗╂枡闇�姹傜粺璁� + this.setRightBlock2(res.data); + // 杞﹂棿姝e搧鐜� + this.setRightBlock3(res.data); + }) + .finally(() => { + setTimeout(() => { + this.getDashboard(); + }, 300000); + }); }, // 澶勭悊宸︿笂鏁版嵁 setLeftBlock1(data) { @@ -123,6 +179,28 @@ } }); }, + // 鏈哄櫒寮�鏈虹巼鏁版嵁 + setleftBlock2(data) { + this.startupRate = { + Total: data?.TotalDeviceAmount ?? 0, + Running: data?.DeviceRunningAmount ?? 0, + Maintenance: data?.InMaintenanceDeviceAmount ?? 0, + }; + // 寮�鏈虹巼 + let setsInUse = (this.startupRate.Running / this.startupRate.Total) * 100; + this.startupRateString = setsInUse.toFixed(1).toString(); + // 缁翠慨鐜� + let maintenanceRate = + (this.startupRate.Maintenance / this.startupRate.Total) * 100; + // 闂茬疆鐜� + let idle = 100 - setsInUse - maintenanceRate; + let chartData = [ + { value: idle.toFixed(1), name: "闂茬疆" }, + { value: maintenanceRate.toFixed(1), name: "缁翠慨" }, + { value: setsInUse.toFixed(1), name: "宸ヤ綔" }, + ]; + this.$refs.leftBlock2.pieChart("chart", chartData); + }, // 宸︿腑鏁版嵁缁熻鍊� setLeftBlock3(data) { this.totalObject = { @@ -137,44 +215,89 @@ // 璁㈠崟瀹屾垚姣旂巼 setLeftBlock4(data) { this.orderCompleteObject.startIndex = 0; - // 姝ゅ鍚庨潰浼氭浛鎹㈡垚鐪熷疄鍚庣杩斿洖鏁版嵁 - if (this.dataindex == 1) { - this.orderCompleteObject.orderCompleteList = [ - { title: "SSSSDD19070047", radio: 20.6 }, - { title: "SDD19070048", radio: 79 }, - { title: "SDD19070049", radio: 100 }, - { title: "SDD19070050", radio: 30 }, - { title: "DD19070047", radio: 20.6 }, - { title: "DD19070048", radio: 49 }, - { title: "DD19070049", radio: 60 }, - { title: "SSDD19070050", radio: 10 }, - { title: "SDD19070047", radio: 33.6 }, - { title: "DD19070048", radio: 69 }, - { title: "SDD19070049", radio: 70 }, - { title: "DD19070050", radio: 20 }, - { title: "SDD19070047", radio: 66.6 }, - { title: "DD19070048", radio: 46 }, - ]; - this.dataindex = 0; - } else { - this.orderCompleteObject.orderCompleteList = [ - { title: "fffffDD19070047", radio: 50.6 }, - { title: "DD19070043", radio: 89 }, - { title: "DD15566649", radio: 100 }, - { title: "ASD5555550", radio: 30 }, - { title: "DD19070047", radio: 30.6 }, - { title: "DD19070048", radio: 49 }, - { title: "DD19070049", radio: 60 }, - { title: "DD19070050", radio: 10 }, - { title: "DD19070047", radio: 33.6 }, - { title: "DD19070048", radio: 69 }, - { title: "DD19070049", radio: 70 }, - { title: "DD19070050", radio: 20 }, - { title: "DD19070047", radio: 66.6 }, - { title: "DD19070048", radio: 96 }, - ]; - this.dataindex = 1; - } + this.orderCompleteObject.orderCompleteList = []; + let list = data.OrderFinishRate.map((item) => { + return { + title: item.Name, + radio: parseFloat(item.Value), + }; + }); + this.orderCompleteObject.orderCompleteList = list; + }, + // 宸ュ崟杩涘害缁熻 + setLeftBlock5(data) { + this.workOrderFinishRate = data?.WorkOrderFinishRate.toString() ?? "0"; + let list = data.WorkOrderStats.map((item) => { + let completeProgerss = []; + for (let i = 0; i < item.ProcedureNum; i++) { + let status = 0; + if (i < item.FinishProcedureNum) { + status = 1; + } else if ( + i >= item.FinishProcedureNum && + i < item.FinishProcedureNum + item.ProcessingProcedureNum + ) { + status = 2; + } else { + status = 0; + } + completeProgerss.push({ status: status }); + } + return { + ...item, + completeProgerss: completeProgerss, + }; + }); + this.workOrderData = list; + }, + // 浜哄憳鐢熸晥鏁堢巼姣� 浜哄憳鎶�鑳� + setLeftBlock6(data) { + this.perSonnelChartData.datax = []; + this.perSonnelChartData.datay = []; + data.PersonnelProductivity.map((item) => { + this.perSonnelChartData.datax.push(item.Name); + this.perSonnelChartData.datay.push(parseFloat(item.Value)); + }); + // 浜哄憳鎶�鑳介ゼ鍥� + let chartData2 = []; + chartData2 = data.WorkerTypeStats.map((item) => { + return { + name: item.Name, + value: parseFloat(item.Value), + }; + }); + this.$refs.leftBlock6.getChartRight("chart2", chartData2); + }, + // 璁惧璐熻嵎瀵规瘮 + setRightBlock1(data) { + this.deviceChartData.datax = []; + this.deviceChartData.datay = []; + data.DeviceLoad.map((item) => { + this.deviceChartData.datax.push(item.Name); + this.deviceChartData.datay.push(parseFloat(item.Value)); + }); + }, + // 鐗╂枡闇�姹傜粺璁� + setRightBlock2(data) { + this.materialChartData.datax = []; + this.materialChartData.datay = []; + data.MaterialRequirement.map((item) => { + this.materialChartData.datax.push(item.Name); + this.materialChartData.datay.push(parseFloat(item.Value)); + }); + }, + // 杞﹂棿姝e搧鐜� + setRightBlock3(data) { + this.barChartData.total = data.TodayFinishAmount; + this.barChartData.rate = data.TodayQualifiedRate; + this.barChartData.datax = []; + this.barChartData.datay = []; + this.barChartData.datay2 = []; + data.WorkshopStats.map((item) => { + this.barChartData.datax.push(item.Name); + this.barChartData.datay.push(parseFloat(item.Qualified)); + this.barChartData.datay2.push(parseFloat(item.Defective)); + }); }, }, }; -- Gitblit v1.8.0