From f21e45e00e579c9f319b13a19698bb9c4046d69d Mon Sep 17 00:00:00 2001 From: williamet Date: Thu, 10 Mar 2022 00:38:50 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=89=E5=85=A8=E5=A4=A7=E5=B1=8F=E5=AE=89?= =?UTF-8?q?=E5=85=A8=E9=9A=90=E6=82=A3=E5=88=97=E8=A1=A8-=E9=83=A8?= =?UTF-8?q?=E9=97=A8=E5=B1=95=E7=A4=BA=E5=88=97=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/bigScreen/securityManage/left2.vue | 299 ++++++++++++++++--- src/views/chartList/page5/left4.vue | 1 - 2 files changed, 261 insertions(+), 39 deletions(-) diff --git a/src/views/bigScreen/securityManage/left2.vue b/src/views/bigScreen/securityManage/left2.vue index 3477a74..3febf91 100644 --- a/src/views/bigScreen/securityManage/left2.vue +++ b/src/views/bigScreen/securityManage/left2.vue @@ -23,6 +23,7 @@ + - 序号 - 序号 + 车间名 + 安全隐患内容 措施 责任人 + 类别 --> + {{ item.name }} + + +
    +
  • - + + {{ + item.id + }} + + + {{ item.value }} + + + + + +
    • +
@@ -110,6 +220,7 @@ import vueSeamlessScroll from "vue-seamless-scroll"; import echarts from "echarts"; require("echarts/theme/macarons"); // echarts theme import resize from "../../dashboard/mixins/resize"; +import { mapList } from "@/api/vehicleMent/map"; export default { mixins: [resize], name: "left2", @@ -123,6 +234,7 @@ export default { }, data() { return { + troubleItem: {}, index: 0, colorList, @@ -133,6 +245,8 @@ export default { chart1: null, chart2: null, chart3: null, + + troubleTitleList: [], }; }, watch: { @@ -155,6 +269,7 @@ export default { }, }, mounted() { + this.getTroubleItem(); this.$nextTick(() => { this.initChart(); // this.initChart3() @@ -168,16 +283,30 @@ export default { this.chart = null; }, methods: { + // 隐患内容列宽 + getToubleContentSpan(arr) { + var sum = 0; + for (var i = 0; i < arr.length; i++) { + if (arr[i].name.indexOf("隐患内容") > -1) { + sum += 0; + } else { + sum += arr[i].span; + } + } + return 24 - sum; + }, + // 总厂安全隐患柱图 initChart() { this.request({ - url: "/hx/securityManagement/hiddenDanger/1", + url: "/hx/securityManagement/hiddenDanger", method: "get", // type=1车间/=2总厂 params: { type: 2 }, }).then((res) => { if (200 == res.code) { let { monthList, mapList, category } = res.data; - this.initChart2(category); + // 饼图 + this.initChart2(mapList); this.chart1 = echarts.init(this.$refs.chart1); this.chart1.setOption({ // legend: { @@ -186,6 +315,10 @@ export default { // color: '#fff', // }, // }, + tooltip: { + trigger: "item", + // formatter: "{a}
{b}", + }, grid: { left: "3%", right: "6%", @@ -195,7 +328,7 @@ export default { xAxis: [ { type: "category", - data: monthList, + data: monthList.map((e) => e.month), axisPointer: { type: "shadow", }, @@ -261,8 +394,8 @@ export default { textStyle: { color: "#fff", }, - startValue: this.dataZoomStart(mapList.length, 4, "start"), - endValue: this.dataZoomStart(mapList.length, 4, "end"), + startValue: this.dataZoomStart(monthList.length, 4, "start"), + endValue: this.dataZoomStart(monthList.length, 4, "end"), }, { type: "inside", @@ -270,11 +403,14 @@ export default { ], series: [ { - name: "利润", + name: "安全隐患柱状图", type: "bar", barWidth: 20, - data: mapList.map((e) => e.total), - // data: [56.0, 14.9, 7.0, 53.2, 50.6, 76.7, 135.6, 162.2, 72.6, 30.0, 12.4, 23.3], + data: monthList.map((e) => e.count), + // data: [ + // 56.0, 14.9, 7.0, 53.2, 50.6, 76.7, 135.6, 162.2, 72.6, 30.0, + // 12.4, 23.3, + // ], itemStyle: { color: "rgb(118,196,166)", }, @@ -298,7 +434,8 @@ export default { } }); }, - initChart2(category) { + // 总厂安全隐患按类型分类饼图 + initChart2(mapList) { this.chart2 = echarts.init(this.$refs.chart2); this.chart2.setOption({ tooltip: { @@ -321,7 +458,7 @@ export default { }, series: [ { - name: "型号", + name: "类型", type: "pie", radius: ["40%", "60%"], center: ["45%", "45%"], @@ -342,33 +479,105 @@ export default { labelLine: { show: false, }, - data: category.map((e) => { + data: mapList.map((e) => { + console.log(e); return { - value: e.NUMBERCOUNT, + value: e.count, name: e.category, }; }), // data: [ - // { value: 154, name: '型号一' }, - // { value: 775, name: '型号二' }, - // { value: 679, name: '型号三' }, - // { value: 679, name: '型号四' }, + // { value: 154, name: "型号一" }, + // { value: 775, name: "型号二" }, + // { value: 679, name: "型号三" }, + // { value: 679, name: "型号四" }, // ], }, ], }); }, + // 车间安全隐患列表 initChart3() { this.request({ - url: "/hx/securityManagement/hiddenDanger/1", + url: "/hx/securityManagement/hiddenDanger", method: "get", // type=1车间/=2总厂 params: { type: 1 }, }).then((res) => { if (200 == res.code) { this.chart3 = echarts.init(this.$refs.chart3); - let { list, allWorkshop, mapList } = res.data; - this.scrollList = list; + // list 列表数据, mapList柱状图数据 + let { list, mapList } = res.data; + // 根据troubleItem处理list + // {"a1": true, "a2": true} + let troubleList = this.troubleItem; + + // 最终想要的数据 + let troubleTitleList = []; + let troubleDataList = []; + + // troubleTitleList.push({ name: "id", span: 2 }); + // troubleTitleList.push({ name: "车间名称", span: 4 }); + // troubleTitleList.push({ name: "隐患内容", span: 8 }); + // troubleTitleList.push({ name: "措施", span: 5 }); + // troubleTitleList.push({ name: "责任人", span: 3 }); + // troubleTitleList.push({ name: "类别", span: 2 }); + + if (troubleList.responsibleUnit) { + troubleTitleList.push({ name: "车间名称", span: 3 }); + } + + if (troubleList.address && troubleList.existProblem) { + troubleTitleList.push({ name: "隐患内容", span: 10 }); + } + + if (troubleList.updateSuggest && troubleList.tempUpdateMethod) { + troubleTitleList.push({ name: "措施", span: 4 }); + } + + if (troubleList.responsiblePerson) { + troubleTitleList.push({ name: "责任人", span: 3 }); + } + + if (troubleList.category) { + troubleTitleList.push({ name: "类别", span: 2 }); + } + this.troubleTitleList = troubleTitleList; + + // 处理list得到troubleDataList + let tmpObj = {}; + list.map((e) => { + if (troubleList.responsibleUnit) { + tmpObj.name = "车间名称"; + tmpObj.value = e.responsibleUnit; + tmpObj.span = 3; + } + if (troubleList.address && troubleList.existProblem) { + tmpObj.name = "隐患内容"; + tmpObj.value = e.address + "" + e.existProblem; + tmpObj.span = 10; + } + if (troubleList.updateSuggest && troubleList.tempUpdateMethod) { + tmpObj.name = "措施"; + tmpObj.value = e.updateSuggest + "" + e.tempUpdateMethod; + tmpObj.span = 4; + } + if (troubleList.responsiblePerson) { + tmpObj.name = "责任人"; + tmpObj.value = e.responsibleUnit; + tmpObj.span = 3; + } + if (troubleList.category) { + tmpObj.name = "类别"; + tmpObj.value = e.category; + tmpObj.span = 2; + } + console.log(tmpObj); + + troubleDataList.push(tmpObj); + }); + + this.scrollList = troubleDataList; this.listData2 = Array(this.scrollList.length).fill(0); this.$refs.seamlessScroll.reset(); this.chart3.setOption({ @@ -387,7 +596,7 @@ export default { xAxis: [ { type: "category", - data: allWorkshop, + data: mapList.map((e) => e.unit), // data: ['车间', '车间', '车间', '车间', '车间', '车间', '车间', '车间', '车间', '车间', '车间', '车间'], axisPointer: { type: "shadow", @@ -463,33 +672,47 @@ export default { ], series: [ { - name: "利润", + name: "安全隐患数量", type: "bar", barWidth: 20, - data: mapList.map((e) => e.total), + data: mapList.map((e) => e.count), // data: [56.0, 14.9, 7.0, 53.2, 50.6, 76.7, 135.6, 162.2, 72.6, 30.0, 12.4, 23.3], itemStyle: { color: "rgb(118,196,166)", }, barGap: "0", }, - { - name: "利润目标完成率", - type: "line", - yAxisIndex: 1, - smooth: false, - data: mapList.map((e) => e.rate), - // data: [10, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2], - itemStyle: { - color: "#7EA7FC ", - }, - symbol: "none", - }, + // { + // name: "利润目标完成率", + // type: "line", + // yAxisIndex: 1, + // smooth: false, + // data: mapList.map((e) => e.rate), + // // data: [10, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2], + // itemStyle: { + // color: "#7EA7FC ", + // }, + // symbol: "none", + // }, ], }); } }); }, + // 获取安全隐患展示配置 + getTroubleItem() { + this.request({ + url: "/business/hxTableConfig", + method: "get", + params: { tableName: "hx_hidden_danger" }, + }).then((res) => { + if (200 == res.code) { + // 如何处理列表数据 + this.troubleItem = JSON.parse(res.data); + console.log(this.troubleItem); + } + }); + }, }, }; diff --git a/src/views/chartList/page5/left4.vue b/src/views/chartList/page5/left4.vue index 2d2e039..3c9760b 100644 --- a/src/views/chartList/page5/left4.vue +++ b/src/views/chartList/page5/left4.vue @@ -31,7 +31,6 @@ icon="el-icon-s-tools" >展示列配置 - test