| 1 |
- {"ast":null,"code":"import \"core-js/modules/es.iterator.constructor.js\";\nimport \"core-js/modules/es.iterator.map.js\";\nimport * as echarts from 'echarts';\nimport { getSafetyLevelStats } from '@/api';\nexport default {\n name: 'SafetyLevel',\n data() {\n return {\n chart: null,\n legendItems: [{\n name: 'I级',\n color: '#f44336'\n }, {\n name: 'II级',\n color: '#ff9800'\n }, {\n name: 'III级',\n color: '#ffc107'\n }, {\n name: 'IV级',\n color: '#2196f3'\n }]\n };\n },\n async mounted() {\n const res = await getSafetyLevelStats();\n this.$nextTick(() => this.initChart(res.data));\n },\n beforeDestroy() {\n if (this.chart) this.chart.dispose();\n },\n methods: {\n initChart(data) {\n this.chart = echarts.init(this.$refs.chart);\n const depts = data.departments;\n const option = {\n tooltip: {\n trigger: 'axis',\n backgroundColor: 'rgba(13,34,71,0.9)',\n borderColor: '#1a3a6a',\n textStyle: {\n color: '#fff',\n fontSize: 12\n }\n },\n legend: {\n show: false\n },\n grid: {\n left: 12,\n right: 12,\n top: 16,\n bottom: 50\n },\n xAxis: {\n type: 'category',\n data: depts.map(d => d.name + '\\n(' + d.total + ')'),\n axisLine: {\n lineStyle: {\n color: '#1a3a6a'\n }\n },\n axisLabel: {\n color: '#5a7da8',\n fontSize: 10,\n interval: 0,\n lineHeight: 14\n },\n axisTick: {\n show: false\n }\n },\n yAxis: {\n type: 'value',\n max: 15,\n interval: 3,\n splitLine: {\n lineStyle: {\n color: 'rgba(26,58,106,0.3)',\n type: 'dashed'\n }\n },\n axisLine: {\n show: false\n },\n axisLabel: {\n color: '#5a7da8',\n fontSize: 11\n },\n axisTick: {\n show: false\n }\n },\n series: [{\n name: 'I级',\n type: 'bar',\n stack: 'total',\n barWidth: 24,\n data: depts.map(d => d.level1),\n itemStyle: {\n color: '#f44336'\n }\n }, {\n name: 'II级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level2),\n itemStyle: {\n color: '#ff9800'\n }\n }, {\n name: 'III级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level3),\n itemStyle: {\n color: '#ffc107'\n }\n }, {\n name: 'IV级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level4),\n itemStyle: {\n color: '#2196f3',\n borderRadius: [3, 3, 0, 0]\n }\n }]\n };\n this.chart.setOption(option);\n }\n }\n};","map":{"version":3,"names":["echarts","getSafetyLevelStats","name","data","chart","legendItems","color","mounted","res","$nextTick","initChart","beforeDestroy","dispose","methods","init","$refs","depts","departments","option","tooltip","trigger","backgroundColor","borderColor","textStyle","fontSize","legend","show","grid","left","right","top","bottom","xAxis","type","map","d","total","axisLine","lineStyle","axisLabel","interval","lineHeight","axisTick","yAxis","max","splitLine","series","stack","barWidth","level1","itemStyle","level2","level3","level4","borderRadius","setOption"],"sources":["src/components/LabStats/SafetyLevel.vue"],"sourcesContent":["<template>\n <div class=\"panel-box safety-level\">\n <div class=\"panel-title\">实验室安全分级统计</div>\n <div class=\"panel-content\">\n <div class=\"level-legend\">\n <div class=\"legend-item\" v-for=\"item in legendItems\" :key=\"item.name\">\n <span class=\"legend-dot\" :style=\"{ background: item.color }\"></span>\n <span class=\"legend-text\">{{ item.name }}</span>\n </div>\n </div>\n <div ref=\"chart\" class=\"chart-area\"></div>\n </div>\n </div>\n</template>\n\n<script>\nimport * as echarts from 'echarts'\nimport { getSafetyLevelStats } from '@/api'\n\nexport default {\n name: 'SafetyLevel',\n data() {\n return {\n chart: null,\n legendItems: [\n { name: 'I级', color: '#f44336' },\n { name: 'II级', color: '#ff9800' },\n { name: 'III级', color: '#ffc107' },\n { name: 'IV级', color: '#2196f3' }\n ]\n }\n },\n async mounted() {\n const res = await getSafetyLevelStats()\n this.$nextTick(() => this.initChart(res.data))\n },\n beforeDestroy() {\n if (this.chart) this.chart.dispose()\n },\n methods: {\n initChart(data) {\n this.chart = echarts.init(this.$refs.chart)\n const depts = data.departments\n const option = {\n tooltip: {\n trigger: 'axis',\n backgroundColor: 'rgba(13,34,71,0.9)',\n borderColor: '#1a3a6a',\n textStyle: { color: '#fff', fontSize: 12 }\n },\n legend: { show: false },\n grid: { left: 12, right: 12, top: 16, bottom: 50 },\n xAxis: {\n type: 'category',\n data: depts.map(d => d.name + '\\n(' + d.total + ')'),\n axisLine: { lineStyle: { color: '#1a3a6a' } },\n axisLabel: { color: '#5a7da8', fontSize: 10, interval: 0, lineHeight: 14 },\n axisTick: { show: false }\n },\n yAxis: {\n type: 'value',\n max: 15,\n interval: 3,\n splitLine: { lineStyle: { color: 'rgba(26,58,106,0.3)', type: 'dashed' } },\n axisLine: { show: false },\n axisLabel: { color: '#5a7da8', fontSize: 11 },\n axisTick: { show: false }\n },\n series: [\n {\n name: 'I级',\n type: 'bar',\n stack: 'total',\n barWidth: 24,\n data: depts.map(d => d.level1),\n itemStyle: { color: '#f44336' }\n },\n {\n name: 'II级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level2),\n itemStyle: { color: '#ff9800' }\n },\n {\n name: 'III级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level3),\n itemStyle: { color: '#ffc107' }\n },\n {\n name: 'IV级',\n type: 'bar',\n stack: 'total',\n data: depts.map(d => d.level4),\n itemStyle: { color: '#2196f3', borderRadius: [3, 3, 0, 0] }\n }\n ]\n }\n this.chart.setOption(option)\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.safety-level {\n height: 100%;\n display: flex;\n flex-direction: column;\n\n .panel-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n}\n\n.level-legend {\n display: flex;\n justify-content: center;\n gap: 16px;\n flex-shrink: 0;\n margin-bottom: 4px;\n}\n\n.legend-item {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n\n.legend-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n}\n\n.legend-text {\n font-size: 11px;\n color: $text-secondary;\n}\n\n.chart-area {\n flex: 1;\n min-height: 0;\n width: 100%;\n}\n</style>\n"],"mappings":";;AAgBA,YAAAA,OAAA;AACA,SAAAC,mBAAA;AAEA;EACAC,IAAA;EACAC,KAAA;IACA;MACAC,KAAA;MACAC,WAAA,GACA;QAAAH,IAAA;QAAAI,KAAA;MAAA,GACA;QAAAJ,IAAA;QAAAI,KAAA;MAAA,GACA;QAAAJ,IAAA;QAAAI,KAAA;MAAA,GACA;QAAAJ,IAAA;QAAAI,KAAA;MAAA;IAEA;EACA;EACA,MAAAC,QAAA;IACA,MAAAC,GAAA,SAAAP,mBAAA;IACA,KAAAQ,SAAA,YAAAC,SAAA,CAAAF,GAAA,CAAAL,IAAA;EACA;EACAQ,cAAA;IACA,SAAAP,KAAA,OAAAA,KAAA,CAAAQ,OAAA;EACA;EACAC,OAAA;IACAH,UAAAP,IAAA;MACA,KAAAC,KAAA,GAAAJ,OAAA,CAAAc,IAAA,MAAAC,KAAA,CAAAX,KAAA;MACA,MAAAY,KAAA,GAAAb,IAAA,CAAAc,WAAA;MACA,MAAAC,MAAA;QACAC,OAAA;UACAC,OAAA;UACAC,eAAA;UACAC,WAAA;UACAC,SAAA;YAAAjB,KAAA;YAAAkB,QAAA;UAAA;QACA;QACAC,MAAA;UAAAC,IAAA;QAAA;QACAC,IAAA;UAAAC,IAAA;UAAAC,KAAA;UAAAC,GAAA;UAAAC,MAAA;QAAA;QACAC,KAAA;UACAC,IAAA;UACA9B,IAAA,EAAAa,KAAA,CAAAkB,GAAA,CAAAC,CAAA,IAAAA,CAAA,CAAAjC,IAAA,WAAAiC,CAAA,CAAAC,KAAA;UACAC,QAAA;YAAAC,SAAA;cAAAhC,KAAA;YAAA;UAAA;UACAiC,SAAA;YAAAjC,KAAA;YAAAkB,QAAA;YAAAgB,QAAA;YAAAC,UAAA;UAAA;UACAC,QAAA;YAAAhB,IAAA;UAAA;QACA;QACAiB,KAAA;UACAV,IAAA;UACAW,GAAA;UACAJ,QAAA;UACAK,SAAA;YAAAP,SAAA;cAAAhC,KAAA;cAAA2B,IAAA;YAAA;UAAA;UACAI,QAAA;YAAAX,IAAA;UAAA;UACAa,SAAA;YAAAjC,KAAA;YAAAkB,QAAA;UAAA;UACAkB,QAAA;YAAAhB,IAAA;UAAA;QACA;QACAoB,MAAA,GACA;UACA5C,IAAA;UACA+B,IAAA;UACAc,KAAA;UACAC,QAAA;UACA7C,IAAA,EAAAa,KAAA,CAAAkB,GAAA,CAAAC,CAAA,IAAAA,CAAA,CAAAc,MAAA;UACAC,SAAA;YAAA5C,KAAA;UAAA;QACA,GACA;UACAJ,IAAA;UACA+B,IAAA;UACAc,KAAA;UACA5C,IAAA,EAAAa,KAAA,CAAAkB,GAAA,CAAAC,CAAA,IAAAA,CAAA,CAAAgB,MAAA;UACAD,SAAA;YAAA5C,KAAA;UAAA;QACA,GACA;UACAJ,IAAA;UACA+B,IAAA;UACAc,KAAA;UACA5C,IAAA,EAAAa,KAAA,CAAAkB,GAAA,CAAAC,CAAA,IAAAA,CAAA,CAAAiB,MAAA;UACAF,SAAA;YAAA5C,KAAA;UAAA;QACA,GACA;UACAJ,IAAA;UACA+B,IAAA;UACAc,KAAA;UACA5C,IAAA,EAAAa,KAAA,CAAAkB,GAAA,CAAAC,CAAA,IAAAA,CAAA,CAAAkB,MAAA;UACAH,SAAA;YAAA5C,KAAA;YAAAgD,YAAA;UAAA;QACA;MAEA;MACA,KAAAlD,KAAA,CAAAmD,SAAA,CAAArC,MAAA;IACA;EACA;AACA","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|
