mt-fe-group/yudao-init
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

驾驶舱

Browse Source
This commit is contained in:
‘937886381’
2024-05-20 10:20:37 +08:00
parent 5a9ce24451
commit 83ad88858b
15 changed files with 130 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/copilot/energy/components/StockMonitor.vue
View File

@@ -1,7 +1,7 @@
<!--
* @Author: zhp
* @Date: 2024-05-07 10:25:10
* @LastEditTime: 2024-05-16 10:42:25
* @LastEditTime: 2024-05-17 10:34:51
* @LastEditors: zhp
* @Description:
-->

54
src/views/copilot/energy/components/sub/monitor/MonitorItem.vue
View File

@@ -10,16 +10,16 @@
<div class="cities">
<CopilotButtons :options="cities" @update:active="handleCityUpdate" />
</div>
<div style="padding: 0 40px;width: 90%;">
<!-- <div style="width: 90%;"> -->
<div class="chart" ref="chart"></div>
</div>
<!-- </div> -->
<div class="legend" v-if="1">
<div class="legend-item" v-for="(lgd,index) in legendList" :key="lgd.name">
<div class="legend-item" v-for="(lgd, index) in legendList" :key="lgd.name">
<div>
<span :style="'backgroundColor:' + colors[index%5]" class="legend-item__chart"></span>
<span :style="'color:' + colors[index%5]" class="legend-item__label">{{ lgd.name }}</span>
<span :style="'backgroundColor:' + colors[index % 5]" class="legend-item__chart"></span>
<span :style="'color:' + colors[index % 5]" class="legend-item__label">{{ lgd.name }}</span>
</div>
<div :style="'color:' + colors[index%5]" class="legend-item__value">{{ lgd.value }}</div>
<div :style="'color:' + colors[index % 5]" class="legend-item__value">{{ lgd.value }}</div>
</div>
</div>
</div>
@@ -54,7 +54,7 @@ export default {
period: "月",
factoryId: 0,
// legendList:[],
colors:['#2760FF', '#5996F7', '#8BC566', '#11FAF0', '#F3C000'],
colors: ['#2760FF', '#5996F7', '#8BC566', '#11FAF0', '#F3C000'],
// valueTuple: [100, 100, 200],
};
},
@@ -69,13 +69,13 @@ export default {
legendList() {
// if (this.valueTuple) {
// if (this.valueTuple.length == 0) {
return this.valueTuple
return this.valueTuple
// } else {
// return []
// }
// return []
// }
// console.log(this.valueTuple)
// } else {
// return []
// return []
// }
},
options() {
@@ -88,7 +88,7 @@ export default {
arr.push(ele.value)
});
let vt = arr
titleValue = vt.reduce(function (prev, cur, index, arr) {
titleValue = vt.reduce(function (prev, cur, index, arr) {
return prev + cur
})
} else {
@@ -119,13 +119,13 @@ export default {
factoryId(newVal, oldVal) {
console.log(newVal);
// if (newVal) {
// this.legendList = this.data[newVal]
// if ( == 0) {
// this.initOptions(this.options)
// }
// console.log(this.valueTuple.length)
// console.log(this.options)
this.initOptions(this.options)
// this.legendList = this.data[newVal]
// if ( == 0) {
// this.initOptions(this.options)
// }
// console.log(this.valueTuple.length)
// console.log(this.options)
this.initOptions(this.options)
// }
},
// chipRate() {
@@ -164,9 +164,13 @@ export default {
.chart {
// margin-left: 5%;
width: 290px;
// width: 290px;
align-self: stretch;
height: 150px;
flex: 1 1 auto;
// padding: 0 10%;
/* margin: 10%; */
/* min-width: 300px; */
height: 0;
}
.legend {
@@ -185,7 +189,8 @@ export default {
align-items: center;
flex-wrap: wrap;
gap: 3px;
.legend-item__chart{
.legend-item__chart {
display: inline-block;
width: 14px;
height: 14px;
@@ -193,9 +198,11 @@ export default {
border-radius: 2px;
// margin-right: 8px;
}
.legend-item__label {
.legend-item__label {
margin-left: 8px;
}
// }
}
@@ -205,4 +212,3 @@ export default {
}
}
</style>
l