1094 lines
22 KiB
Vue
1094 lines
22 KiB
Vue
<template>
|
||
<view class="warp">
|
||
<topoCanvas cId="canvas" :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 {
|
||
canvasData:[],
|
||
partList:[],
|
||
stationId:null,
|
||
noloading:false,
|
||
// 文字
|
||
textCanvasData: [
|
||
{
|
||
type: "text",
|
||
coord: [[185, 115]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.allActivePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:90
|
||
},
|
||
],
|
||
},
|
||
{
|
||
//1# 直流舱--1
|
||
type: "text",
|
||
coord: [[10, 75]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.grid"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
},
|
||
],
|
||
},
|
||
//1#PCS升压一体舱--2
|
||
{
|
||
type: "text",
|
||
coord: [[285, 65]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.load"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 305]],
|
||
font: [
|
||
{
|
||
text: "1#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 175]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 190]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
|
||
{
|
||
type: "text",
|
||
coord: [[10, 205]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 220]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[95, 305]],
|
||
font: [
|
||
{
|
||
text: "2#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 320]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 335]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 350]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 365]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[183, 305]],
|
||
font: [
|
||
{
|
||
text: "3#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 320]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 335]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 350]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 365]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[272, 305]],
|
||
font: [
|
||
{
|
||
text: "4#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[214, 175]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[240, 190]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
|
||
{
|
||
type: "text",
|
||
coord: [[245, 205]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[245, 220]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
],
|
||
// 图片
|
||
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, 135],
|
||
[40, 60],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[10, 240],
|
||
[40, 50],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[98, 240],
|
||
[40, 50],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[186, 240],
|
||
[40, 50],
|
||
],
|
||
},
|
||
{
|
||
//一体舱
|
||
type: "image",
|
||
url: "/static/topology/yiticang.png",
|
||
coord: [
|
||
[274, 240],
|
||
[40, 50],
|
||
],
|
||
},
|
||
|
||
{
|
||
//电表
|
||
type: "image",
|
||
url: "/static/topology/ammeter.png",
|
||
coord: [
|
||
[205, 60],
|
||
[40, 40],
|
||
],
|
||
},
|
||
],
|
||
// 线
|
||
lineCanvasData: [
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[55, 40],
|
||
[275, 40],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
|
||
|
||
//center
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 40],
|
||
[165, 135],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 80],
|
||
[200, 80],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[165, 195],
|
||
[165, 230],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
|
||
//bottom
|
||
{
|
||
type: "line",
|
||
coord: [
|
||
[35, 230],
|
||
[295, 230],
|
||
],
|
||
color: "#19875c",
|
||
width: 2,
|
||
dash: [10, 5],
|
||
},
|
||
|
||
],
|
||
// 点
|
||
circleCanvasData: [
|
||
{
|
||
type: "circle",
|
||
coord: [[55,40]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [[275, 40]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [[35, 230]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [[123, 230]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [[211, 230]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
{
|
||
type: "circle",
|
||
coord: [[295, 230]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
|
||
{
|
||
type: "circle",
|
||
coord: [[200, 80]],
|
||
color: "#3AECA1",
|
||
isMove: false,
|
||
r: 3,
|
||
},
|
||
|
||
]
|
||
}
|
||
},
|
||
computed: {
|
||
currentStation() {
|
||
return this.vuex_currentStation;
|
||
},
|
||
},
|
||
methods:{
|
||
changeEnglish() {
|
||
this.textCanvasData = [
|
||
{
|
||
type: "text",
|
||
coord: [[185, 115]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.allActivePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:90
|
||
},
|
||
],
|
||
},
|
||
{
|
||
//1# 直流舱--1
|
||
type: "text",
|
||
coord: [[10, 75]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.grid"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
},
|
||
],
|
||
},
|
||
//1#PCS升压一体舱--2
|
||
{
|
||
type: "text",
|
||
coord: [[285, 65]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.load"),
|
||
size: 12,
|
||
color: "#333333",
|
||
width: 50,
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 305]],
|
||
font: [
|
||
{
|
||
text: "1#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 175]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 190]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
|
||
{
|
||
type: "text",
|
||
coord: [[10, 205]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[10, 220]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[95, 305]],
|
||
font: [
|
||
{
|
||
text: "2#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 320]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 335]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 350]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[65, 365]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[183, 305]],
|
||
font: [
|
||
{
|
||
text: "3#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 320]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 335]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 350]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[180, 365]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[272, 305]],
|
||
font: [
|
||
{
|
||
text: "4#" + this.$t("homePage.home.cabinet"),
|
||
size: 12,
|
||
color: "#333333",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[214, 175]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.activePower"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:85
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[240, 190]],
|
||
font: [
|
||
{
|
||
text: this.$t("homePage.home.workStatus"),
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:60
|
||
},
|
||
],
|
||
},
|
||
|
||
{
|
||
type: "text",
|
||
coord: [[245, 205]],
|
||
font: [
|
||
{
|
||
text: "SOH(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
{
|
||
type: "text",
|
||
coord: [[245, 220]],
|
||
font: [
|
||
{
|
||
text: "SOC(%)：",
|
||
size: 12,
|
||
color: "#666666",
|
||
width: 50,
|
||
},
|
||
{
|
||
text: "",
|
||
size: 12,
|
||
color: "#333333",
|
||
left:50
|
||
},
|
||
],
|
||
},
|
||
]
|
||
},
|
||
getData(val){
|
||
this.stationId = val
|
||
this.clearData()
|
||
const api = [this.getMiddleData(), this.getDianBiaoStatus()]
|
||
Promise.all(api).finally((result) => {
|
||
this.canvasData = [...this.textCanvasData, ...this.imageCanvasData, ...this
|
||
.lineCanvasData, ...this.circleCanvasData
|
||
]
|
||
this.noloading = true
|
||
});
|
||
},
|
||
clearData(){
|
||
this.textCanvasData[4].font[1].text = ''
|
||
this.textCanvasData[5].font[1].text = ''
|
||
this.textCanvasData[6].font[1].text = ''
|
||
this.textCanvasData[7].font[1].text = ''
|
||
|
||
this.textCanvasData[12].font[1].text =''
|
||
this.textCanvasData[11].font[1].text =''
|
||
this.textCanvasData[10].font[1].text =''
|
||
this.textCanvasData[9].font[1].text =''
|
||
|
||
this.textCanvasData[17].font[1].text =''
|
||
this.textCanvasData[16].font[1].text =''
|
||
this.textCanvasData[15].font[1].text =''
|
||
this.textCanvasData[14].font[1].text =''
|
||
|
||
this.textCanvasData[19].font[1].text =''
|
||
this.textCanvasData[20].font[1].text =''
|
||
this.textCanvasData[21].font[1].text =''
|
||
this.textCanvasData[22].font[1].text = ''
|
||
},
|
||
getMiddleData(){
|
||
let self = this;
|
||
return new Promise((resolve, reject) => {
|
||
self.$u.api.homePageData
|
||
.GetOpenStationMiddlePart({
|
||
stationId: this.stationId,
|
||
|
||
})
|
||
.then((res) => {
|
||
this.partList = res.data
|
||
this.textCanvasData[4].font[1].text = this.partList.length ? this.partList[0].activePowerPCS + '' : ''
|
||
this.textCanvasData[5].font[1].text = this.partList.length ? this.workStatus(this.partList[0].activePowerPCS, 0) : ''
|
||
this.textCanvasData[6].font[1].text = this.partList.length ? this.partList[0].soc + '' : ''
|
||
this.textCanvasData[7].font[1].text = this.partList.length ? this.partList[0].soh + '' : ''
|
||
|
||
this.textCanvasData[12].font[1].text = this.partList.length ? this.partList[1].activePowerPCS + '' : ''
|
||
this.textCanvasData[11].font[1].text = this.partList.length ? this.workStatus(this.partList[1].activePowerPCS, 1) : ''
|
||
this.textCanvasData[10].font[1].text = this.partList.length ? this.partList[1].soc + '' : ''
|
||
this.textCanvasData[9].font[1].text = this.partList.length ? this.partList[1].soh + '' : ''
|
||
|
||
this.textCanvasData[17].font[1].text = this.partList.length ? this.partList[1].activePowerPCS + '' : ''
|
||
this.textCanvasData[16].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].soc + '' : ''
|
||
this.textCanvasData[14].font[1].text = this.partList.length ? this.partList[1].soh + '' : ''
|
||
|
||
this.textCanvasData[19].font[1].text = this.partList.length ? this.partList[1].activePowerPCS + '' : ''
|
||
this.textCanvasData[20].font[1].text = this.partList.length ? this.workStatus(this.partList[1].activePowerPCS, 1) : ''
|
||
this.textCanvasData[21].font[1].text = this.partList.length ? this.partList[1].soc + '' : ''
|
||
this.textCanvasData[22].font[1].text = this.partList.length ? this.partList[1].soh + '' : ''
|
||
resolve()
|
||
})
|
||
})
|
||
},
|
||
getDianBiaoStatus(){
|
||
let self = this;
|
||
return new Promise((resolve, reject) => {
|
||
self.$u.api.homePageData
|
||
.GetMiddlePart({
|
||
stationId: this.stationId,
|
||
})
|
||
.then((res) => {
|
||
this.textCanvasData[0].font[1].text = res.data.activePower !== null ? res.data.activePower + '' : ''
|
||
// this.rightDianBiao[3].font[1].text = res.data.activePower !== null ? res.data.activePower : ''
|
||
resolve()
|
||
})
|
||
.catch((err) => {
|
||
reject("错误");
|
||
});
|
||
});
|
||
},
|
||
workStatus(val, index) {
|
||
if (this.partList[index].flowDirection === 1) {
|
||
if (+val > +0.1) {
|
||
return this.$t("homePage.home.charge")
|
||
}
|
||
if (+val < -0.1) {
|
||
return this.$t("homePage.home.disCharge")
|
||
}
|
||
if (val < 0.1 || +val.abs < 0.1) {
|
||
return this.$t("homePage.home.standing")
|
||
}
|
||
} else {
|
||
if (+val > +0.1) {
|
||
return this.$t("homePage.home.disCharge")
|
||
}
|
||
if (+val < -0.1) {
|
||
return this.$t("homePage.home.charge")
|
||
}
|
||
if (val < 0.1 || +val.abs < 0.1) {
|
||
return this.$t("homePage.home.standing")
|
||
}
|
||
}
|
||
},
|
||
}
|
||
|
||
}
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.warp {
|
||
width: 650rpx;
|
||
height: 750rpx;
|
||
position: relative;
|
||
}
|
||
</style> |