From da4d9e70d2c37f59a365b0fb88ad70e8c1ba79b4 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期一, 11 十二月 2023 10:25:01 +0800 Subject: [PATCH] 机器开机率优化 --- src/views/cockpitPage/index.vue | 324 ++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 313 insertions(+), 11 deletions(-) diff --git a/src/views/cockpitPage/index.vue b/src/views/cockpitPage/index.vue index ca65da2..ab3dd35 100644 --- a/src/views/cockpitPage/index.vue +++ b/src/views/cockpitPage/index.vue @@ -1,30 +1,42 @@ <template> <BackgroundBoardLayout> <template #leftBlock1> - <StatisticalBox></StatisticalBox> + <StatisticalBox :all-list="allList"></StatisticalBox> </template> <template #leftBlock2> - <MachineStartupRate></MachineStartupRate> + <MachineStartupRate + ref="leftBlock2" + :startup-rate="startupRateString" + ></MachineStartupRate> </template> <template #leftBlock3> - <CountView></CountView> + <CountView :total-object="totalObject"></CountView> </template> <template #leftBlock4> - <OrderCompleteRadio></OrderCompleteRadio> + <OrderCompleteRadio + :order-complete-object="orderCompleteObject" + ></OrderCompleteRadio> + </template> + <template #leftBlock5> + <WorkOrderProgress + :work-order-finish-rate="workOrderFinishRate" + :table-data="workOrderData" + ></WorkOrderProgress> </template> <template #leftBlock6> <PerSonnelProductivity - @should-reload="reloadAllData" + ref="leftBlock6" + :chartData="perSonnelChartData" ></PerSonnelProductivity> </template> <template #rightBlock1> - <DeviceChart @should-reload="reloadAllData"></DeviceChart> + <DeviceChart ref="rightBlock1" :chartData="deviceChartData"></DeviceChart> </template> <template #rightBlock2> - <MaterialChart @should-reload="reloadAllData"></MaterialChart> + <MaterialChart :chartData="materialChartData"></MaterialChart> </template> <template #rightBlock3> - <BarChart @should-reload="reloadAllData"></BarChart> + <BarChart :chartData="barChartData"></BarChart> </template> </BackgroundBoardLayout> </template> @@ -39,6 +51,8 @@ import MaterialChart from "@/views/cockpitPage/components/MaterialChart.vue"; import BarChart from "@/views/cockpitPage/components/BarChart.vue"; import OrderCompleteRadio from "@/views/cockpitPage/components/OrderCompleteRadio"; +import WorkOrderProgress from "@/views/cockpitPage/components/WorkOrderProgress"; +import { getDashboard } from "@/api/cockpitPage/index"; export default { components: { StatisticalBox, @@ -50,14 +64,302 @@ MachineStartupRate, CountView, OrderCompleteRadio, + WorkOrderProgress, }, props: {}, data() { - return {}; + return { + // 宸︿笂鏁版嵁缁熻鏁版嵁 + allList: [ + { value: 0, label: "寮�鏈哄彴鏁�" }, + { value: 0, label: "鎬讳骇閲�" }, + { value: 0, label: "鐢熶骇宸ュ崟鏁�" }, + { value: 0, label: "寤舵湡浜や粯" }, + { value: 0, label: "鐗╂枡涓嶈冻/寰呮帓绋�" }, + { value: 0, label: "璁″垝杈炬垚鐜�" }, + ], + // 鏈哄櫒寮�鏈虹巼 + startupRate: { + Total: 0, // 鎬绘満鍣ㄦ暟 + Running: 0, // 寮�鏈哄彴鏁� + Maintenance: 0, // 缁翠慨涓澶囨暟 + }, + startupRateString: "0", // 寮�鏈虹巼 + // 宸︿腑鏁版嵁缁熻瀵硅薄 + totalObject: {}, + // 璁㈠崟瀹屾垚姣旂巼 + orderCompleteObject: { + startIndex: 0, + orderCompleteList: [], + }, + // 宸ュ崟杩涘害缁熻 + workOrderData: [], + workOrderFinishRate: "", + // 浜哄憳鐢熶骇鏁堢巼 + perSonnelChartData: { + datax: [], + datay: [], + }, + // 璁惧璐熻嵎瀵规瘮 + deviceChartData: { + datax: [], + datay: [], + }, + // 鐗╂枡闇�姹傜粺璁� + materialChartData: { + datax: [], + datay: [], + }, + // 杞﹂棿姝e搧鐜� + barChartData: { + total: 0, + rate: "0", + datax: [], + datay: [], + datay2: [], + }, + }; }, - mounted() {}, + mounted() { + this.getDashboard(); + }, watch: {}, - methods: {}, + methods: { + async getDashboard() { + 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) { + this.allList.map((item) => { + if (item.label === "寮�鏈哄彴鏁�") { + item.value = data?.DeviceRunningAmount ?? 0; + } else if (item.label === "鎬讳骇閲�") { + item.value = data?.TotalProductionAmount ?? 0; + } else if (item.label === "鐢熶骇宸ュ崟鏁�") { + item.value = data?.WorkOrderAmount ?? 0; + } else if (item.label === "寤舵湡浜や粯") { + item.value = data?.DelayWorkOrderAmount ?? 0; + } else if (item.label === "鐗╂枡涓嶈冻/寰呮帓绋�") { + item.value = data?.MaterialMissWorkOrderAmount ?? 0; + item.value1 = data?.WaitSchedulingWorkOrderAmount ?? 0; + } else if (item.label === "璁″垝杈炬垚鐜�") { + let value = + typeof data?.PlanOrderFinishRate === "string" + ? parseFloat( + data?.PlanOrderFinishRate.length > 0 + ? data?.PlanOrderFinishRate + : "0" + ) + : data?.PlanOrderFinishRate ?? 0; + item.value = value.toString() + "%"; + } + }); + }, + // 鏈哄櫒寮�鏈虹巼鏁版嵁 + 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) { + console.log(this.setNumbers(data?.OutPlanProductionAmount ?? 0)); + this.totalObject = { + InternalDeviceRunningAmount: ( + data?.InternalDeviceRunningAmount ?? 0 + ).toString(), + ExternalDeviceRunningAmount: data?.ExternalDeviceRunningAmount ?? 0, + OutPlanProductionAmount: this.setNumbers( + data?.OutPlanProductionAmount ?? 0 + ), + PlanProductionAmount: this.setNumbers(data?.PlanProductionAmount ?? 0), + RealExternalProductionAmount: this.setNumbers( + data?.RealExternalProductionAmount ?? 0 + ), + RealProductionAmount: this.setNumbers(data?.RealProductionAmount ?? 0), + }; + }, + // 璁㈠崟瀹屾垚姣旂巼 + setLeftBlock4(data) { + this.orderCompleteObject.startIndex = 0; + this.orderCompleteObject.orderCompleteList = []; + if (data.OrderFinishRate && data.OrderFinishRate.length > 0) { + 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"; + if (data.WorkOrderStats && data.WorkOrderStats.length > 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 = []; + if (data.PersonnelProductivity && data.PersonnelProductivity.length > 0) { + data.PersonnelProductivity.map((item) => { + this.perSonnelChartData.datax.push(item.Name); + this.perSonnelChartData.datay.push(parseFloat(item.Value)); + }); + } + // 浜哄憳鎶�鑳介ゼ鍥� + let chartData2 = []; + if (data.WorkerTypeStats && data.WorkerTypeStats.length > 0) { + 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 = []; + if (data.DeviceLoad && data.DeviceLoad.length > 0) { + 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 = []; + if (data.MaterialRequirement && data.MaterialRequirement.length > 0) { + 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 = []; + if (data.WorkshopStats && data.WorkshopStats.length > 0) { + data.WorkshopStats.map((item) => { + this.barChartData.datax.push(item.Name); + this.barChartData.datay.push(parseFloat(item.Qualified)); + this.barChartData.datay2.push(parseFloat(item.Defective)); + }); + } + }, + + // 璁$畻鍔犲伐鏁� 鐢熶骇鏁� + setNumbers(val) { + if (val > 1000 && val < 10000) { + let count = (val / 1000).toFixed(2); + return count.toString() + "鍗�"; + } else if (val >= 10000 && val < 100000) { + let count1 = (val / 10000).toFixed(2); + return count1.toString() + "涓�"; + } else if (val >= 100000 && val < 1000000) { + let count1 = (val / 100000).toFixed(0); + return count1.toString() + "鍗佷竾"; + } else if (val >= 1000000 && val < 10000000) { + let count1 = (val / 1000000).toFixed(0); + return count1.toString() + "鐧句竾"; + } else if (val >= 10000000 && val < 100000000) { + let count1 = (val / 10000000).toFixed(0); + return count1.toString() + "鍗冧竾"; + } else if (val >= 100000000 && val < 1000000000) { + let count1 = (val / 100000000).toFixed(2); + return count1 + "浜�"; + } else if (val >= 1000000000 && val < 10000000000) { + let count1 = (val / 1000000000).toFixed(0); + return count1.toString() + "鍗佷嚎"; + } else if (val >= 10000000000 && val < 100000000000) { + let count1 = (val / 10000000000).toFixed(0); + return count1.toString() + "鐧句嚎"; + } else if (val >= 100000000000 && val < 1000000000000) { + let count1 = (val / 100000000000).toFixed(0); + return count1.toString() + "鍗冧嚎"; + } else if (val >= 1000000000000) { + let count1 = (val / 1000000000000).toFixed(0); + return count1.toString() + "涓囦嚎"; + } else { + return val.toString(); + } + }, + }, }; </script> -- Gitblit v1.8.0