| 1 |
- {"remainingRequest":"D:\\test\\ssi-satoken\\ui\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\test\\ssi-satoken\\ui\\src\\views\\largeScreen\\components\\dayIncome.vue?vue&type=style&index=0&id=3da0fc4e&scoped=true&lang=css&","dependencies":[{"path":"D:\\test\\ssi-satoken\\ui\\src\\views\\largeScreen\\components\\dayIncome.vue","mtime":1697162668458},{"path":"D:\\test\\ssi-satoken\\ui\\node_modules\\css-loader\\dist\\cjs.js","mtime":1669864554855},{"path":"D:\\test\\ssi-satoken\\ui\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1697679531049},{"path":"D:\\test\\ssi-satoken\\ui\\node_modules\\postcss-loader\\src\\index.js","mtime":1669864555556},{"path":"D:\\test\\ssi-satoken\\ui\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1669864538178},{"path":"D:\\test\\ssi-satoken\\ui\\node_modules\\vue-loader\\lib\\index.js","mtime":1697679531049}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCi5kYXlJbmNvbWVEaXZ7CiAgbWFyZ2luLXRvcDogMSU7Cn0KI2RheUluY29tZUNoYXJ0ewogIHdpZHRoOiAxMDAlOwogIGhlaWdodDogY2FsYygyNXZoKTsKfQo="},{"version":3,"sources":["dayIncome.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8RA;AACA;AACA;AACA;AACA;AACA;AACA","file":"dayIncome.vue","sourceRoot":"src/views/largeScreen/components","sourcesContent":["<template>\n <div class=\"dayIncomeDiv\">\n <div id=\"dayIncomeChart\"/>\n </div>\n</template>\n\n<script>\nimport * as echarts from 'echarts';\nexport default {\n name: \"dayIncome\",\n data(){\n return{\n dayIncomeChart: null,\n chartsData: [{\n \"dateValue\": \"2023-01-01\",\n \"longTerm\": 150.00,\n \"realtime\": 134.73,\n \"dayAhead\": 90.69\n }, {\n \"dateValue\": \"2023-01-02\",\n \"longTerm\": 150.00,\n \"realtime\": 59.25,\n \"dayAhead\": 121.28\n }, {\n \"dateValue\": \"2023-01-03\",\n \"longTerm\": 220.00,\n \"realtime\": 149.25,\n \"dayAhead\": 100.1\n }, {\n \"dateValue\": \"2023-01-04\",\n \"longTerm\": 220.00,\n \"realtime\": 20.96,\n \"dayAhead\": 66.02\n }, {\n \"dateValue\": \"2023-01-05\",\n \"longTerm\": 220.00,\n \"realtime\": 132.67,\n \"dayAhead\": 151.14\n }, {\n \"dateValue\": \"2023-01-06\",\n \"longTerm\": 220.00,\n \"realtime\": 552.67,\n \"dayAhead\": 316.08\n }, {\n \"dateValue\": \"2023-01-07\",\n \"longTerm\": 150.00,\n \"realtime\": 371.55,\n \"dayAhead\": 113.21\n }, {\n \"dateValue\": \"2023-01-08\",\n \"longTerm\": 150.00,\n \"realtime\": 114.04,\n \"dayAhead\": 100.14\n }, {\n \"dateValue\": \"2023-01-09\",\n \"longTerm\": 150.00,\n \"realtime\": 137,\n \"dayAhead\": 192.39\n }, {\n \"dateValue\": \"2023-01-10\",\n \"longTerm\": 150.00,\n \"realtime\": 313.07,\n \"dayAhead\": 317.92\n }, {\n \"dateValue\": \"2023-01-11\",\n \"longTerm\": 150.00,\n \"realtime\": 445.13,\n \"dayAhead\": 275.32\n }, {\n \"dateValue\": \"2023-01-12\",\n \"longTerm\": 150.00,\n \"realtime\": 261.72,\n \"dayAhead\": 184.14\n }, {\n \"dateValue\": \"2023-01-13\",\n \"longTerm\": 150.00,\n \"realtime\": 321.11,\n \"dayAhead\": 326.11\n }, {\n \"dateValue\": \"2023-01-14\",\n \"longTerm\": 150.00,\n \"realtime\": 432.64,\n \"dayAhead\": 473.03\n }, {\n \"dateValue\": \"2023-01-15\",\n \"longTerm\": 90.00,\n \"realtime\": 375.56,\n \"dayAhead\": 487.25\n }, {\n \"dateValue\": \"2023-01-16\",\n \"longTerm\": 90.00,\n \"realtime\": 358.9,\n \"dayAhead\": 361.38\n }, {\n \"dateValue\": \"2023-01-17\",\n \"longTerm\": 90.00,\n \"realtime\": 376.51,\n \"dayAhead\": 465.54\n }, {\n \"dateValue\": \"2023-01-18\",\n \"longTerm\": 90.00,\n \"realtime\": 325.19,\n \"dayAhead\": 443.73\n }, {\n \"dateValue\": \"2023-01-19\",\n \"longTerm\": 90.00,\n \"realtime\": 114.67,\n \"dayAhead\": 516.83\n }, {\n \"dateValue\": \"2023-01-20\",\n \"longTerm\": 90.00,\n \"realtime\": 275.51,\n \"dayAhead\": 369.04\n }, {\n \"dateValue\": \"2023-01-21\",\n \"longTerm\": 90.00,\n \"realtime\": 84.72,\n \"dayAhead\": 272.89\n }, {\n \"dateValue\": \"2023-01-22\",\n \"longTerm\": 90.00,\n \"realtime\": 222.96,\n \"dayAhead\": 198.42\n }, {\n \"dateValue\": \"2023-01-23\",\n \"longTerm\": 90.00,\n \"realtime\": 69.29,\n \"dayAhead\": 596.15\n }, {\n \"dateValue\": \"2023-01-24\",\n \"longTerm\": 90.00,\n \"realtime\": 139.41,\n \"dayAhead\": 351.34\n }, {\n \"dateValue\": \"2023-01-25\",\n \"longTerm\": 150.00,\n \"realtime\": 209.42,\n \"dayAhead\": 406.07\n }, {\n \"dateValue\": \"2023-01-26\",\n \"longTerm\": 150.00,\n \"realtime\": 436.02,\n \"dayAhead\": 582.7\n }, {\n \"dateValue\": \"2023-01-27\",\n \"longTerm\": 150.00,\n \"realtime\": 166.52,\n \"dayAhead\": 490.01\n }, {\n \"dateValue\": \"2023-01-28\",\n \"longTerm\": 150.00,\n \"realtime\": 187.58,\n \"dayAhead\": 488.05\n }, {\n \"dateValue\": \"2023-01-29\",\n \"longTerm\": 150.00,\n \"realtime\": 44.81,\n \"dayAhead\": 370.14\n }, {\n \"dateValue\": \"2023-01-30\",\n \"longTerm\": 150.00,\n \"realtime\": 121.04,\n \"dayAhead\": 88.29\n }, {\n \"dateValue\": \"2023-01-31\",\n \"longTerm\": 150.00,\n \"realtime\": 122.35,\n \"dayAhead\": 178.89\n }]\n }\n },\n destroyed() {\n this.dayIncomeChart = null\n },\n mounted() {\n this.initChart()\n },\n methods:{\n initChart(){\n if(this.dayIncomeChart === null){\n this.dayIncomeChart= echarts.init(document.getElementById('dayIncomeChart'));\n }\n const option = {\n grid: {\n left: 10,\n right: 10,\n bottom: 20,\n top: 30,\n containLabel: true\n },\n tooltip: {\n trigger: 'axis', // x轴触发\n formatter: function (params) {\n let list = []\n let listItem\n params.forEach((item) => {\n // 柱状图加单位 局，折线图加单位 %\n let unitValue = item.seriesType === 'bar' ? item.value + 'MW' : item.value + '%'\n list.push(item.marker + '' + item.seriesName + ': ' + unitValue)\n })\n listItem = list.join('<br/>')\n return '<div>' + listItem + '</div>'\n }\n },\n xAxis: {\n type: 'category',\n data: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10',\n '11', '12', '13', '14', '15', '16', '17', '18', '19', '20',\n '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],\n nameTextStyle: {\n color: '#fff'\n },\n axisLine:{\n lineStyle:{\n color: '#fff'\n }\n }\n },\n yAxis: {\n type: 'value',\n name: '单位：MW',\n nameTextStyle:{\n color:'#fff'\n },\n axisLine:{\n show:true,\n lineStyle:{\n color: '#fff'\n }\n }\n },\n series: [\n {\n name: \"中长期分解\",\n data: this.chartsData.map(d => {\n return d.longTerm\n }),\n type: 'bar',\n stack: 'total',\n showBackground: true,\n itemStyle: {\n // color: '#FAFE7CFF'\n color: '#FF0087'\n }\n },\n {\n name: \"日前上报\",\n data: this.chartsData.map(d => {\n return d.dayAhead\n }),\n type: 'bar',\n // barGap: \"-100%\",\n stack: 'total',\n // showBackground: true,\n itemStyle: {\n color: '#18d0f0'\n }\n },\n {\n name: \"实时出力\",\n data: this.chartsData.map(d => {\n return d.realtime\n }),\n type: 'bar',\n // barGap: \"-100%\",\n stack: 'total',\n // showBackground: true,\n itemStyle: {\n color: '#FAFE7C'\n }\n }\n ]\n };\n\n option && this.dayIncomeChart.setOption(option);\n window.addEventListener('resize', () => {\n if (this.dayIncomeChart) {\n this.dayIncomeChart.resize()\n }\n })\n }\n }\n}\n</script>\n\n<style scoped>\n.dayIncomeDiv{\n margin-top: 1%;\n}\n#dayIncomeChart{\n width: 100%;\n height: calc(25vh);\n}\n</style>\n"]}]}
|
