1071 lines
19 KiB
Vue
1071 lines
19 KiB
Vue
<template>
|
||
<view class="warp">
|
||
<topoCanvas cId="canvasCixi" :width="'100%'" :height="'100%'" :canvas-data="canvasData"
|
||
:noloading="noloading" />
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import topoCanvas from '@/components/new-canvas/index.vue'
|
||
export default {
|
||
components: {
|
||
topoCanvas
|
||
},
|
||
data() {
|
||
return {
|
||
noloading: false,
|
||
canvasData: [],
|
||
stationId: null,
|
||
formModel: {},
|
||
partList: [],
|
||
// 文字
|
||
textCanvasData: [{
|
||
type: "text",
|
||
coord: [
|
||
[285, 65]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.load"),
|
||
size: 12,
|
||
color: "#333333",
|
||
}, ],
|
||
},
|
||
|
||
// 并网柜 1
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 100]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.gridCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}]
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 75]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.gridCabSwitch"),
|
||
size: 12,
|
||
color: "#666666",
|
||
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 65
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 115]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
|
||
//1# 直流舱 5
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 130]
|
||
],
|
||
font: [{
|
||
text: '1#' + this.$t("homePage.home.dCCabin"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 145]
|
||
],
|
||
font: [{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 160]
|
||
],
|
||
font: [{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
|
||
//2# 直流舱 8
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 130]
|
||
],
|
||
font: [{
|
||
text: '2#' + this.$t("homePage.home.dCCabin"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 145]
|
||
],
|
||
font: [{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 160]
|
||
],
|
||
font: [{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
|
||
//1#PCS升压一体舱
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[60, 260]
|
||
],
|
||
font: [{
|
||
text: '1#' + this.$t("homePage.home.PCSCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[50, 275]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 55
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[50, 290]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
|
||
//2#PCS升压一体舱
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 260]
|
||
],
|
||
font: [{
|
||
text: '2#' + this.$t("homePage.home.PCSCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 275]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 55
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 290]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[70, 95]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.ammeter"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[30, 110]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
}
|
||
|
||
],
|
||
// 图片
|
||
imageCanvasData: [{
|
||
//电网
|
||
type: "image",
|
||
url: "/static/topology/dianwang.png",
|
||
coord: [
|
||
[10, 10],
|
||
[40, 50],
|
||
],
|
||
},
|
||
{
|
||
//负载
|
||
type: "image",
|
||
url: "/static/topology/fuzai.png",
|
||
coord: [
|
||
[280, 10],
|
||
[40, 40],
|
||
],
|
||
},
|
||
{
|
||
//一体柜
|
||
type: "image",
|
||
url: "/static/topology/yitigui.png",
|
||
coord: [
|
||
[145, 75],
|
||
[40, 60],
|
||
],
|
||
},
|
||
{
|
||
//直流舱
|
||
type: "image",
|
||
url: "/static/topology/cang.png",
|
||
coord: [
|
||
[10, 180],
|
||
[60, 50],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[100, 180],
|
||
[40, 50],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[190, 180],
|
||
[40, 50],
|
||
],
|
||
},
|
||
//直流舱
|
||
{
|
||
type: "image",
|
||
url: "/static/topology/cang.png",
|
||
coord: [
|
||
[260, 180],
|
||
[60, 50],
|
||
],
|
||
},
|
||
{
|
||
type: "image",
|
||
url: "/static/topology/byq.png",
|
||
coord: [
|
||
[155, 145],
|
||
[20, 20],
|
||
],
|
||
},
|
||
{
|
||
type: "image",
|
||
url: "/static/topology/ammeter.png",
|
||
coord: [
|
||
[90, 60],
|
||
[20, 20],
|
||
],
|
||
},
|
||
|
||
],
|
||
// 线
|
||
lineCanvasData: [{
|
||
type: "line",
|
||
coord: [
|
||
[60, 30],
|
||
[165, 30],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 30],
|
||
[165, 50],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
// 负载---并网柜
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[270, 30],
|
||
[165, 30],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
// {
|
||
// type: "line",
|
||
// coord: [
|
||
// [170, 30],
|
||
// [170, 70],
|
||
// ],
|
||
// color: "#19875c",
|
||
// width: 2,
|
||
// dash: [10, 5],
|
||
// },
|
||
// 1直流舱--并网柜
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[30, 170],
|
||
[165, 170],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 135],
|
||
[165, 145],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 165],
|
||
[165, 170],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[300, 170],
|
||
[165, 170],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 50],
|
||
[175, 70],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [0],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 70],
|
||
[165, 75],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[100, 30],
|
||
[100, 60],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
],
|
||
// 点
|
||
circleCanvasData: [
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[60, 30]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[270, 30]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[30, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[115, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[215, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[300, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
|
||
],
|
||
// 点
|
||
circleCanvasData: [{
|
||
type: "circle",
|
||
coord: [
|
||
[60, 30]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[270, 30]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[30, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[115, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[215, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [
|
||
[300, 170]
|
||
],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
}
|
||
]
|
||
}
|
||
},
|
||
created() {
|
||
|
||
},
|
||
computed: {
|
||
currentStation() {
|
||
return this.vuex_currentStation;
|
||
},
|
||
},
|
||
watch: {},
|
||
methods: {
|
||
changeEnglish() {
|
||
this.textCanvasData = [{
|
||
type: "text",
|
||
coord: [
|
||
[285, 65]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.load"),
|
||
size: 12,
|
||
color: "#333333",
|
||
}, ],
|
||
},
|
||
|
||
// 并网柜 1
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 100]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.gridCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}]
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 75]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.gridCabSwitch"),
|
||
size: 12,
|
||
color: "#666666",
|
||
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 65
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[190, 115]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
|
||
//1# 直流舱 5
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 130]
|
||
],
|
||
font: [{
|
||
text: '1#' + this.$t("homePage.home.dCCabin"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 145]
|
||
],
|
||
font: [{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[5, 160]
|
||
],
|
||
font: [{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
|
||
//2# 直流舱 8
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 130]
|
||
],
|
||
font: [{
|
||
text: '2#' + this.$t("homePage.home.dCCabin"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 145]
|
||
],
|
||
font: [{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[245, 160]
|
||
],
|
||
font: [{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 50
|
||
},
|
||
],
|
||
},
|
||
|
||
//1#PCS升压一体舱
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[60, 260]
|
||
],
|
||
font: [{
|
||
text: '1#' + this.$t("homePage.home.PCSCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[50, 275]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 55
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[50, 290]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
|
||
//2#PCS升压一体舱
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 260]
|
||
],
|
||
font: [{
|
||
text: '2#' + this.$t("homePage.home.PCSCab"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
}, ],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 275]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 55
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[180, 290]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[70, 95]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.ammeter"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [
|
||
[30, 110]
|
||
],
|
||
font: [{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left: 80
|
||
},
|
||
],
|
||
}
|
||
]
|
||
},
|
||
getData(val) {
|
||
this.stationId = val
|
||
this.clearData()
|
||
const api = [
|
||
this.getOpenStationMiddle(),
|
||
this.getMiddleData()
|
||
];
|
||
Promise.all(api).finally((result) => {
|
||
this.canvasData = [...this.textCanvasData, ...this.imageCanvasData, ...this
|
||
.lineCanvasData, ...this.circleCanvasData
|
||
]
|
||
this.noloading = true
|
||
});
|
||
|
||
},
|
||
clearData() {
|
||
this.textCanvasData[2].font[1].text = "";
|
||
this.textCanvasData[3].font[1].text = "";
|
||
this.textCanvasData[5].font[1].text = "";
|
||
this.textCanvasData[8].font[1].text = "";
|
||
this.textCanvasData[6].font[1].text = "";
|
||
this.textCanvasData[9].font[1].text = "";
|
||
this.textCanvasData[11].font[1].text = "";
|
||
this.textCanvasData[12].font[1].text = "";
|
||
this.textCanvasData[14].font[1].text = "";
|
||
this.textCanvasData[15].font[1].text = "";
|
||
this.textCanvasData[17].font[1].text = "";
|
||
},
|
||
getOpenStationMiddle() {
|
||
this.$u.api.homePageData
|
||
.GetOpenStationMiddle({
|
||
stationId: this.stationId,
|
||
})
|
||
.then((res) => {
|
||
this.textCanvasData[2].font[1].text = res.data.cabinSwitch ? this.$t("homePage.home.on") : this
|
||
.$t("homePage.home.off");
|
||
this.textCanvasData[2].font[1].text === this.$t("homePage.home.on") ? this.lineCanvasData[7].coord = [[165, 50],
|
||
[165, 70]] : [165, 50],
|
||
[175, 70]
|
||
|
||
this.textCanvasData[3].font[1].text = res.data.activePowerEMU ? res.data.activePowerEMU : "";
|
||
|
||
})
|
||
|
||
},
|
||
getMiddleData() {
|
||
this.$u.api.homePageData
|
||
.GetOpenStationMiddlePart({
|
||
stationId: this.stationId,
|
||
})
|
||
.then((res) => {
|
||
// console.log(this.textCanvasData);
|
||
this.partList = res.data
|
||
this.textCanvasData[5].font[1].text = this.partList.length ? this.partList[0].soc + '' : "";
|
||
this.textCanvasData[6].font[1].text = this.partList.length ? this.partList[0].soh + '' : "";
|
||
this.textCanvasData[8].font[1].text = this.partList.length > 1 ? this.partList[1].soc + '' :
|
||
"";
|
||
this.textCanvasData[9].font[1].text = this.partList.length > 1 ? this.partList[1].soh + '' :
|
||
"";
|
||
this.textCanvasData[11].font[1].text = this.partList.length ? this.workStatus(this.partList[0]
|
||
.activePowerPCS, 0) : "";
|
||
this.textCanvasData[12].font[1].text = this.partList.length ? this.partList[0].activePowerPCS +
|
||
'' : "";
|
||
this.textCanvasData[14].font[1].text = this.partList.length ? this.workStatus(this.partList[1]
|
||
.activePowerPCS, 1) : "";
|
||
this.textCanvasData[15].font[1].text = this.partList.length ? this.partList[1].activePowerPCS +
|
||
'' : "";
|
||
this.textCanvasData[17].font[1].text = this.partList.length ? this.partList[2].activePowerFNL + '' : "";
|
||
})
|
||
},
|
||
workStatus(val, index) {
|
||
if (this.partList[index].flowDirection === 2) {
|
||
if (+val > +1) {
|
||
return this.$t("homePage.home.disCharge")
|
||
}
|
||
if (+val < -1) {
|
||
return this.$t("homePage.home.charge")
|
||
}
|
||
if (val < 1 || +val.abs < 1 || !val) {
|
||
return this.$t("homePage.home.standing")
|
||
}
|
||
} else {
|
||
if (+val > +1) {
|
||
return this.$t("homePage.home.charge")
|
||
}
|
||
if (+val < -1) {
|
||
return this.$t("homePage.home.disCharge")
|
||
}
|
||
if (val < 1 || +val.abs < 1 || !val) {
|
||
return this.$t("homePage.home.standing")
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.warp {
|
||
width: 650rpx;
|
||
height: 640rpx;
|
||
position: relative;
|
||
}
|
||
</style> |