| 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 { getLabCategoryStats } from '@/api';\nexport default {\n name: 'CategoryPie',\n data() {\n return {\n chart: null,\n summaryList: []\n };\n },\n async mounted() {\n const res = await getLabCategoryStats();\n const s = res.data.summary;\n this.summaryList = [{\n label: '设备总数',\n value: s.totalEquipment,\n color: '#2196f3'\n }, {\n label: '人员总数',\n value: s.totalPeople,\n color: '#00e5ff'\n }, {\n label: '面积(㎡)',\n value: s.totalArea,\n color: '#4caf50'\n }, {\n label: '安全评分',\n value: s.safetyScore,\n color: '#ff9800'\n }, {\n label: '事故次数',\n value: s.incidents,\n color: '#f44336'\n }, {\n label: '培训次数',\n value: s.trainings,\n color: '#9c27b0'\n }];\n this.$nextTick(() => this.initChart(res.data.categories));\n },\n beforeDestroy() {\n if (this.chart) this.chart.dispose();\n },\n methods: {\n initChart(categories) {\n this.chart = echarts.init(this.$refs.chart);\n const option = {\n tooltip: {\n trigger: 'item',\n backgroundColor: 'rgba(13,34,71,0.9)',\n borderColor: '#1a3a6a',\n textStyle: {\n color: '#fff',\n fontSize: 12\n }\n },\n legend: {\n orient: 'vertical',\n right: 16,\n top: 'center',\n textStyle: {\n color: '#8cb8e6',\n fontSize: 12\n },\n itemWidth: 10,\n itemHeight: 10,\n itemGap: 12,\n icon: 'circle'\n },\n series: [{\n type: 'pie',\n radius: ['38%', '62%'],\n center: ['35%', '50%'],\n avoidLabelOverlap: false,\n label: {\n show: false\n },\n emphasis: {\n label: {\n show: true,\n color: '#fff',\n fontSize: 13\n },\n scaleSize: 6\n },\n data: categories.map(c => ({\n name: c.name,\n value: c.value,\n itemStyle: {\n color: c.color\n }\n }))\n }]\n };\n this.chart.setOption(option);\n }\n }\n};","map":{"version":3,"names":["echarts","getLabCategoryStats","name","data","chart","summaryList","mounted","res","s","summary","label","value","totalEquipment","color","totalPeople","totalArea","safetyScore","incidents","trainings","$nextTick","initChart","categories","beforeDestroy","dispose","methods","init","$refs","option","tooltip","trigger","backgroundColor","borderColor","textStyle","fontSize","legend","orient","right","top","itemWidth","itemHeight","itemGap","icon","series","type","radius","center","avoidLabelOverlap","show","emphasis","scaleSize","map","c","itemStyle","setOption"],"sources":["src/components/LabStats/CategoryPie.vue"],"sourcesContent":["<template>\n <div class=\"panel-box category-pie\">\n <div class=\"panel-title\">实验室分类及数据统计</div>\n <div class=\"panel-content\">\n <div ref=\"chart\" class=\"chart-area\"></div>\n <div class=\"divider\"></div>\n <div class=\"summary-grid\">\n <div class=\"summary-item\" v-for=\"item in summaryList\" :key=\"item.label\">\n <div class=\"summary-value\" :style=\"{ color: item.color || '#00e5ff' }\">{{ item.value }}</div>\n <div class=\"summary-label\">{{ item.label }}</div>\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<script>\nimport * as echarts from 'echarts'\nimport { getLabCategoryStats } from '@/api'\n\nexport default {\n name: 'CategoryPie',\n data() {\n return {\n chart: null,\n summaryList: []\n }\n },\n async mounted() {\n const res = await getLabCategoryStats()\n const s = res.data.summary\n this.summaryList = [\n { label: '设备总数', value: s.totalEquipment, color: '#2196f3' },\n { label: '人员总数', value: s.totalPeople, color: '#00e5ff' },\n { label: '面积(㎡)', value: s.totalArea, color: '#4caf50' },\n { label: '安全评分', value: s.safetyScore, color: '#ff9800' },\n { label: '事故次数', value: s.incidents, color: '#f44336' },\n { label: '培训次数', value: s.trainings, color: '#9c27b0' }\n ]\n this.$nextTick(() => this.initChart(res.data.categories))\n },\n beforeDestroy() {\n if (this.chart) this.chart.dispose()\n },\n methods: {\n initChart(categories) {\n this.chart = echarts.init(this.$refs.chart)\n const option = {\n tooltip: {\n trigger: 'item',\n backgroundColor: 'rgba(13,34,71,0.9)',\n borderColor: '#1a3a6a',\n textStyle: { color: '#fff', fontSize: 12 }\n },\n legend: {\n orient: 'vertical',\n right: 16,\n top: 'center',\n textStyle: { color: '#8cb8e6', fontSize: 12 },\n itemWidth: 10,\n itemHeight: 10,\n itemGap: 12,\n icon: 'circle'\n },\n series: [{\n type: 'pie',\n radius: ['38%', '62%'],\n center: ['35%', '50%'],\n avoidLabelOverlap: false,\n label: { show: false },\n emphasis: {\n label: { show: true, color: '#fff', fontSize: 13 },\n scaleSize: 6\n },\n data: categories.map(c => ({\n name: c.name,\n value: c.value,\n itemStyle: { color: c.color }\n }))\n }]\n }\n this.chart.setOption(option)\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.category-pie {\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.chart-area {\n flex: 1;\n min-height: 0;\n width: 100%;\n}\n\n.divider {\n height: 1px;\n background: linear-gradient(90deg, transparent, rgba(30,144,255,0.25), transparent);\n margin: 4px 0;\n flex-shrink: 0;\n}\n\n.summary-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 6px;\n flex-shrink: 0;\n padding-top: 4px;\n}\n\n.summary-item {\n text-align: center;\n padding: 8px 4px;\n background: rgba(255, 255, 255, 0.02);\n border: 1px solid rgba(255, 255, 255, 0.04);\n border-radius: 4px;\n}\n\n.summary-value {\n font-size: 22px;\n font-weight: bold;\n font-family: 'Courier New', monospace;\n line-height: 1.2;\n}\n\n.summary-label {\n font-size: 11px;\n color: $text-muted;\n margin-top: 3px;\n}\n</style>\n"],"mappings":";;AAiBA,YAAAA,OAAA;AACA,SAAAC,mBAAA;AAEA;EACAC,IAAA;EACAC,KAAA;IACA;MACAC,KAAA;MACAC,WAAA;IACA;EACA;EACA,MAAAC,QAAA;IACA,MAAAC,GAAA,SAAAN,mBAAA;IACA,MAAAO,CAAA,GAAAD,GAAA,CAAAJ,IAAA,CAAAM,OAAA;IACA,KAAAJ,WAAA,IACA;MAAAK,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAI,cAAA;MAAAC,KAAA;IAAA,GACA;MAAAH,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAM,WAAA;MAAAD,KAAA;IAAA,GACA;MAAAH,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAO,SAAA;MAAAF,KAAA;IAAA,GACA;MAAAH,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAQ,WAAA;MAAAH,KAAA;IAAA,GACA;MAAAH,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAS,SAAA;MAAAJ,KAAA;IAAA,GACA;MAAAH,KAAA;MAAAC,KAAA,EAAAH,CAAA,CAAAU,SAAA;MAAAL,KAAA;IAAA,EACA;IACA,KAAAM,SAAA,YAAAC,SAAA,CAAAb,GAAA,CAAAJ,IAAA,CAAAkB,UAAA;EACA;EACAC,cAAA;IACA,SAAAlB,KAAA,OAAAA,KAAA,CAAAmB,OAAA;EACA;EACAC,OAAA;IACAJ,UAAAC,UAAA;MACA,KAAAjB,KAAA,GAAAJ,OAAA,CAAAyB,IAAA,MAAAC,KAAA,CAAAtB,KAAA;MACA,MAAAuB,MAAA;QACAC,OAAA;UACAC,OAAA;UACAC,eAAA;UACAC,WAAA;UACAC,SAAA;YAAAnB,KAAA;YAAAoB,QAAA;UAAA;QACA;QACAC,MAAA;UACAC,MAAA;UACAC,KAAA;UACAC,GAAA;UACAL,SAAA;YAAAnB,KAAA;YAAAoB,QAAA;UAAA;UACAK,SAAA;UACAC,UAAA;UACAC,OAAA;UACAC,IAAA;QACA;QACAC,MAAA;UACAC,IAAA;UACAC,MAAA;UACAC,MAAA;UACAC,iBAAA;UACApC,KAAA;YAAAqC,IAAA;UAAA;UACAC,QAAA;YACAtC,KAAA;cAAAqC,IAAA;cAAAlC,KAAA;cAAAoB,QAAA;YAAA;YACAgB,SAAA;UACA;UACA9C,IAAA,EAAAkB,UAAA,CAAA6B,GAAA,CAAAC,CAAA;YACAjD,IAAA,EAAAiD,CAAA,CAAAjD,IAAA;YACAS,KAAA,EAAAwC,CAAA,CAAAxC,KAAA;YACAyC,SAAA;cAAAvC,KAAA,EAAAsC,CAAA,CAAAtC;YAAA;UACA;QACA;MACA;MACA,KAAAT,KAAA,CAAAiD,SAAA,CAAA1B,MAAA;IACA;EACA;AACA","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|
