87 lines
2.0 KiB
Vue
87 lines
2.0 KiB
Vue
<!--
|
|
filename: Bipv.vue
|
|
author: liubin
|
|
date: 2024-04-10 15:39:54
|
|
description:
|
|
-->
|
|
|
|
<template>
|
|
<right-chart-base
|
|
:legend="legend"
|
|
:series="series"
|
|
:xAxis="xAxis"
|
|
:vHeight="20.5"
|
|
class="std-chart"
|
|
/>
|
|
</template>
|
|
|
|
<script>
|
|
import RightChartBase from "./RightChartBase.vue";
|
|
|
|
export default {
|
|
name: "StdChart",
|
|
components: { RightChartBase },
|
|
|
|
data() {
|
|
const year = new Date().getFullYear();
|
|
// 城市数组的顺序必须是固定的
|
|
const cities = ["瑞昌", "邯郸",
|
|
// "株洲", "佳木斯", "成都", "凯盛", "蚌埠"
|
|
];
|
|
return {
|
|
legend: [
|
|
{ label: `${year}年目标值`, color: "#f3c000" },
|
|
{ label: `${year - 1}年`, color: "#12f7f1" },
|
|
{ label: `${year}年`, color: "#58adfa" },
|
|
],
|
|
xAxis: cities,
|
|
};
|
|
},
|
|
computed: {
|
|
series() {
|
|
const stdOutput = this.$store.getters.home.stdOutput;
|
|
|
|
if (!stdOutput || !stdOutput.current || !stdOutput.previous) {
|
|
return [
|
|
{
|
|
name: "样例数据--2024年目标值",
|
|
data: Array.from({ length: 7 }, () =>
|
|
Math.floor(Math.random() * 1000)
|
|
),
|
|
},
|
|
{
|
|
name: "样例数据--2023年",
|
|
data: Array.from({ length: 7 }, () =>
|
|
Math.floor(Math.random() * 1000)
|
|
),
|
|
},
|
|
{
|
|
name: "样例数据--2024年",
|
|
data: Array.from({ length: 7 }, () =>
|
|
Math.floor(Math.random() * 1000)
|
|
),
|
|
},
|
|
];
|
|
}
|
|
|
|
return [
|
|
{
|
|
name: `${new Date().getFullYear()}年目标值`,
|
|
data: stdOutput.target.splice(0,2),
|
|
},
|
|
{
|
|
name: `${new Date().getFullYear() - 1}年`,
|
|
data: stdOutput.previous.splice(0, 2),
|
|
},
|
|
{
|
|
name: `${new Date().getFullYear()}年`,
|
|
data: stdOutput.current.splice(0, 2),
|
|
},
|
|
];
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|