update 产量驾驶舱
Tento commit je obsažen v:
DESKTOP-FUDKNA8\znjsz
rodič
08c9cf8dd6
revize
622a8b4a31
@ -12,9 +12,7 @@
|
||||
<div class="double-ring-chart__legend">
|
||||
<div v-for="item in legendItems" :key="item.label" class="legend-item">
|
||||
<span class="legend-item__label">{{ item.label }}</span>
|
||||
<span class="legend-item__value">{{
|
||||
item.value.toLocaleString()
|
||||
}}</span>
|
||||
<span class="legend-item__value">{{ item.value | numberFilter }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -33,6 +31,10 @@ export default {
|
||||
type: Number,
|
||||
default: 24,
|
||||
},
|
||||
factoryId: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
period: {
|
||||
type: String,
|
||||
default: "日",
|
||||
@ -45,26 +47,69 @@ export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
computed: {
|
||||
legendItems() {
|
||||
return calculateItems(this.period);
|
||||
filters: {
|
||||
numberFilter(val) {
|
||||
if (!isNaN(val)) {
|
||||
return (+val).toLocaleString();
|
||||
}
|
||||
return 0;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
dataSourceField() {
|
||||
switch (this.dataSource) {
|
||||
case "标准组件产出":
|
||||
return "stdOutput";
|
||||
case "芯片产出":
|
||||
return "chipOutput";
|
||||
case "BIPV产出":
|
||||
return "bipvOutput";
|
||||
}
|
||||
},
|
||||
valueTuple() {
|
||||
// [previousValue, currentValue, sumValue?]
|
||||
const getter = this.$store.getters.copilot.yield[this.dataSourceField];
|
||||
if (this.period === "日" || this.period === "周") {
|
||||
return [
|
||||
getter.previous[this.factoryId],
|
||||
getter.current[this.factoryId],
|
||||
];
|
||||
}
|
||||
return [
|
||||
getter.previous[this.factoryId],
|
||||
getter.current[this.factoryId],
|
||||
getter.target[this.factoryId],
|
||||
];
|
||||
},
|
||||
|
||||
options() {
|
||||
// TODO: 此处更新数据
|
||||
let titleValue = "10%",
|
||||
subtitle = "测试子标题",
|
||||
previousSum = 10,
|
||||
currentSum = 0,
|
||||
targetSum = 100;
|
||||
const year = new Date().getFullYear();
|
||||
const month = new Date().getMonth() + 1;
|
||||
const vt = this.valueTuple;
|
||||
let titleValue =
|
||||
vt[0] != null && vt[2] != null && vt[2] !== 0
|
||||
? `${vt[1] / vt[2]}%`
|
||||
: "0%",
|
||||
subtitle =
|
||||
this.period == "月" ? `${month}月累计产出` : `${year}年累计产出`;
|
||||
|
||||
return getOptions({
|
||||
titleValue,
|
||||
subtitle,
|
||||
previousSum,
|
||||
currentSum,
|
||||
targetSum,
|
||||
previousSum: this.valueTuple[0],
|
||||
currentSum: this.valueTuple[1],
|
||||
targetSum: this.valueTuple[2],
|
||||
});
|
||||
},
|
||||
|
||||
legendItems() {
|
||||
return calculateItems(this.period, this.valueTuple);
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
legendItems() {
|
||||
this.initOptions(this.options);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.initOptions(this.options);
|
||||
@ -77,7 +122,7 @@ export default {
|
||||
},
|
||||
};
|
||||
|
||||
function calculateItems(period) {
|
||||
function calculateItems(period, valueTuple) {
|
||||
let items = [];
|
||||
const today = new Date().getDate();
|
||||
const month = new Date().getMonth() + 1;
|
||||
@ -85,28 +130,28 @@ function calculateItems(period) {
|
||||
switch (period) {
|
||||
case "日":
|
||||
items = [
|
||||
{ label: `${month}月${today}日累计`, value: 24 },
|
||||
{ label: `去年${month}月${today}日累计`, value: 33 },
|
||||
{ label: `${month}月${today}日累计`, value: valueTuple[1] },
|
||||
{ label: `去年${month}月${today}日累计`, value: valueTuple[0] },
|
||||
];
|
||||
break;
|
||||
case "周":
|
||||
items = [
|
||||
{ label: `本周累计`, value: 32 },
|
||||
{ label: `去年本周累计`, value: 12 },
|
||||
{ label: `本周累计`, value: valueTuple[1] },
|
||||
{ label: `去年本周累计`, value: valueTuple[0] },
|
||||
];
|
||||
break;
|
||||
case "月":
|
||||
items = [
|
||||
{ label: `${month}月累计`, value: 24 },
|
||||
{ label: `去年${month}月累计`, value: 33 },
|
||||
{ label: `${month}月目标`, value: 12334 },
|
||||
{ label: `${month}月累计`, value: valueTuple[1] },
|
||||
{ label: `去年${month}月累计`, value: valueTuple[0] },
|
||||
{ label: `${month}月目标`, value: valueTuple[2] },
|
||||
];
|
||||
break;
|
||||
case "年":
|
||||
items = [
|
||||
{ label: `${year - 1}年累计`, value: 23234 },
|
||||
{ label: `${year}年累计`, value: 4324 },
|
||||
{ label: `${year}年目标`, value: 12334 },
|
||||
{ label: `${year}年累计`, value: valueTuple[1] },
|
||||
{ label: `${year - 1}年累计`, value: valueTuple[0] },
|
||||
{ label: `${year}年目标`, value: valueTuple[2] },
|
||||
];
|
||||
break;
|
||||
}
|
||||
|
||||
@ -13,7 +13,11 @@
|
||||
:options="cityOptions"
|
||||
/>
|
||||
<div class="flex-1 stretch">
|
||||
<DoubleRingChartVue :data-source="dataSource" :period="period" />
|
||||
<DoubleRingChartVue
|
||||
:data-source="dataSource"
|
||||
:period="period"
|
||||
:factoryId="factoryId"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
@ -42,6 +46,7 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
factoryId: 4, // 默认成都
|
||||
cityOptions: [
|
||||
"成都",
|
||||
"邯郸",
|
||||
@ -55,7 +60,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
handleActiveUpdate(index) {
|
||||
console.log("handleActiveUpdate--->", index);
|
||||
this.factoryId = index;
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@ -81,11 +81,12 @@ export default ({
|
||||
value:
|
||||
targetSum > currentSum
|
||||
? targetSum - currentSum
|
||||
: targetSum == currentSum
|
||||
: targetSum == 0
|
||||
? currentSum == 0
|
||||
? 1
|
||||
: 0
|
||||
: 0,
|
||||
|
||||
name: "未达成累计",
|
||||
itemStyle: { color: "transparent" },
|
||||
label: { show: false },
|
||||
@ -128,7 +129,12 @@ export default ({
|
||||
},
|
||||
},
|
||||
{
|
||||
value: targetSum > previousSum ? targetSum - previousSum : 0,
|
||||
value:
|
||||
targetSum > previousSum
|
||||
? targetSum - previousSum
|
||||
: previousSum == 0
|
||||
? 1
|
||||
: 0,
|
||||
name: "-",
|
||||
itemStyle: { color: "transparent" },
|
||||
label: { show: false },
|
||||
|
||||
Načítá se…
Odkázat v novém úkolu
Zablokovat Uživatele