| 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 { getLabBasicStats } from '@/api';\nexport default {\n name: 'BasicStats',\n data() {\n return {\n statItems: [],\n chart: null\n };\n },\n async mounted() {\n const res = await getLabBasicStats();\n this.statItems = [{\n label: '实验室总数',\n value: res.data.totalLabs + '+',\n color: '#2196f3'\n }, {\n label: '重点实验室',\n value: res.data.keyLabs,\n color: '#ff9800'\n }, {\n label: '特种实验室',\n value: res.data.specialLabs,\n color: '#f44336'\n }];\n this.$nextTick(() => this.initChart(res.data.yearlyData));\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 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 top: 0,\n right: 0,\n textStyle: {\n color: '#8cb8e6',\n fontSize: 11\n },\n itemWidth: 12,\n itemHeight: 8,\n itemGap: 14\n },\n grid: {\n left: 36,\n right: 12,\n top: 32,\n bottom: 22\n },\n xAxis: {\n type: 'category',\n data: data.map(d => d.year),\n axisLine: {\n lineStyle: {\n color: '#1a3a6a'\n }\n },\n axisLabel: {\n color: '#5a7da8',\n fontSize: 11\n },\n axisTick: {\n show: false\n }\n },\n yAxis: {\n type: 'value',\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: '实验室总数',\n type: 'bar',\n barWidth: 12,\n barGap: '30%',\n data: data.map(d => d.total),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{\n offset: 0,\n color: '#2196f3'\n }, {\n offset: 1,\n color: 'rgba(33,150,243,0.2)'\n }]),\n borderRadius: [2, 2, 0, 0]\n }\n }, {\n name: '重点实验室',\n type: 'bar',\n barWidth: 12,\n data: data.map(d => d.key),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{\n offset: 0,\n color: '#ff9800'\n }, {\n offset: 1,\n color: 'rgba(255,152,0,0.2)'\n }]),\n borderRadius: [2, 2, 0, 0]\n }\n }, {\n name: '特种实验室',\n type: 'bar',\n barWidth: 12,\n data: data.map(d => d.special),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{\n offset: 0,\n color: '#f44336'\n }, {\n offset: 1,\n color: 'rgba(244,67,54,0.2)'\n }]),\n borderRadius: [2, 2, 0, 0]\n }\n }]\n };\n this.chart.setOption(option);\n }\n }\n};","map":{"version":3,"names":["echarts","getLabBasicStats","name","data","statItems","chart","mounted","res","label","value","totalLabs","color","keyLabs","specialLabs","$nextTick","initChart","yearlyData","beforeDestroy","dispose","methods","init","$refs","option","tooltip","trigger","backgroundColor","borderColor","textStyle","fontSize","legend","top","right","itemWidth","itemHeight","itemGap","grid","left","bottom","xAxis","type","map","d","year","axisLine","lineStyle","axisLabel","axisTick","show","yAxis","splitLine","series","barWidth","barGap","total","itemStyle","graphic","LinearGradient","offset","borderRadius","key","special","setOption"],"sources":["src/components/LabStats/BasicStats.vue"],"sourcesContent":["<template>\n <div class=\"panel-box basic-stats\">\n <div class=\"panel-title\">实验室基本情况统计</div>\n <div class=\"panel-content\">\n <div class=\"stat-indicators\">\n <div class=\"stat-item\" v-for=\"item in statItems\" :key=\"item.label\">\n <span class=\"stat-dot\" :style=\"{ background: item.color }\"></span>\n <span class=\"stat-label\">{{ item.label }}</span>\n <span class=\"stat-num\" :style=\"{ color: item.color }\">{{ item.value }}</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 { getLabBasicStats } from '@/api'\n\nexport default {\n name: 'BasicStats',\n data() {\n return {\n statItems: [],\n chart: null\n }\n },\n async mounted() {\n const res = await getLabBasicStats()\n this.statItems = [\n { label: '实验室总数', value: res.data.totalLabs + '+', color: '#2196f3' },\n { label: '重点实验室', value: res.data.keyLabs, color: '#ff9800' },\n { label: '特种实验室', value: res.data.specialLabs, color: '#f44336' }\n ]\n this.$nextTick(() => this.initChart(res.data.yearlyData))\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 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: {\n top: 0,\n right: 0,\n textStyle: { color: '#8cb8e6', fontSize: 11 },\n itemWidth: 12,\n itemHeight: 8,\n itemGap: 14\n },\n grid: { left: 36, right: 12, top: 32, bottom: 22 },\n xAxis: {\n type: 'category',\n data: data.map(d => d.year),\n axisLine: { lineStyle: { color: '#1a3a6a' } },\n axisLabel: { color: '#5a7da8', fontSize: 11 },\n axisTick: { show: false }\n },\n yAxis: {\n type: 'value',\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: '实验室总数',\n type: 'bar',\n barWidth: 12,\n barGap: '30%',\n data: data.map(d => d.total),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [\n { offset: 0, color: '#2196f3' },\n { offset: 1, color: 'rgba(33,150,243,0.2)' }\n ]),\n borderRadius: [2, 2, 0, 0]\n }\n },\n {\n name: '重点实验室',\n type: 'bar',\n barWidth: 12,\n data: data.map(d => d.key),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [\n { offset: 0, color: '#ff9800' },\n { offset: 1, color: 'rgba(255,152,0,0.2)' }\n ]),\n borderRadius: [2, 2, 0, 0]\n }\n },\n {\n name: '特种实验室',\n type: 'bar',\n barWidth: 12,\n data: data.map(d => d.special),\n itemStyle: {\n color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [\n { offset: 0, color: '#f44336' },\n { offset: 1, color: 'rgba(244,67,54,0.2)' }\n ]),\n borderRadius: [2, 2, 0, 0]\n }\n }\n ]\n }\n this.chart.setOption(option)\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.basic-stats {\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.stat-indicators {\n display: flex;\n gap: 20px;\n margin-bottom: 10px;\n flex-shrink: 0;\n}\n\n.stat-item {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.stat-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n flex-shrink: 0;\n}\n\n.stat-label {\n font-size: 12px;\n color: $text-secondary;\n white-space: nowrap;\n}\n\n.stat-num {\n font-size: 22px;\n font-weight: bold;\n font-family: 'Courier New', monospace;\n line-height: 1;\n}\n\n.chart-area {\n flex: 1;\n min-height: 0;\n width: 100%;\n}\n</style>\n"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}
|
