光伏功能
This commit is contained in:
huangjp
@ -22,6 +22,6 @@ const config = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 设置后台接口服务的基础地址
|
// 设置后台接口服务的基础地址
|
||||||
// config.baseUrl = "https://zzkj-cloud.com/api"
|
config.baseUrl = "https://zzkj-cloud.com/api"
|
||||||
config.baseUrl = 'http://1.95.170.86:8002/api'
|
// config.baseUrl = 'http://1.95.170.86:8002/api'
|
||||||
export default config
|
export default config
|
||||||
@ -31,6 +31,36 @@ export default {
|
|||||||
}, {
|
}, {
|
||||||
name: 'Overseas Station'
|
name: 'Overseas Station'
|
||||||
}],
|
}],
|
||||||
useElecPrice: 'Electricity prices'
|
useElecPrice: 'Electricity prices',
|
||||||
|
workStatus: 'Working Status：',
|
||||||
|
standing:'standing',
|
||||||
|
activePower:'Active Power(kW):',
|
||||||
|
operatingPower:'Operating Power',
|
||||||
|
accumulatedElectricityConsumption:'Total power',
|
||||||
|
pvKpi: 'PV KPI',
|
||||||
|
saveStandardCoal: 'Save standard coal (ton)',
|
||||||
|
equivalentCo2Reduction: "CO2 emission reduction (kg)",
|
||||||
|
equivalentTreePlantings: "Equivalent tree plantings (Trees)",
|
||||||
|
dailyPowerGeneration: 'Daily Power Generation',
|
||||||
|
cumulativePowerGeneration: 'Cumulative Power Generation',
|
||||||
|
socialContribution: 'Social Contribution',
|
||||||
|
energyStorageRevenueReport:'Energy Storage Revenue Report',
|
||||||
|
pvStorageRevenueReport:'PV Revenue Report',
|
||||||
|
projectMonthlyPower:'Monthly power generation of the project',
|
||||||
|
powerGeneration:'power generation',
|
||||||
|
mpptTopu:'MPPT topology diagram',
|
||||||
|
powerGenerationCapacity: 'Output power',
|
||||||
|
batVoltage: 'BAT voltage',
|
||||||
|
batCurrent: 'BAT current',
|
||||||
|
busVoltage: 'BUS voltage',
|
||||||
|
busCurrent: 'BUS current',
|
||||||
|
dc: 'DC',
|
||||||
|
dcVoltage: 'DC voltage',
|
||||||
|
operatingPower: 'operating power',
|
||||||
|
pvPower:'power',
|
||||||
|
enmonthTotalChargePrice: 'Total Charging Price Monthly(EUR)',
|
||||||
|
enmonthTotalDisChargePrice: 'Total Discharging Price Monthly(EUR)',
|
||||||
|
enearnings: 'Revenue(EUR)',
|
||||||
|
pvSwitch:'PV switch'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -31,6 +31,37 @@ export default {
|
|||||||
}, {
|
}, {
|
||||||
name: '海外站'
|
name: '海外站'
|
||||||
}],
|
}],
|
||||||
useElecPrice: '用电价格'
|
useElecPrice: '用电价格',
|
||||||
|
workStatus: '工作状态：',
|
||||||
|
standing:'静置',
|
||||||
|
activePower:'有功功率(kW):',
|
||||||
|
operatingPower:'运行功率',
|
||||||
|
accumulatedElectricityConsumption:'累计电量',
|
||||||
|
pvKpi: '光伏KPI',
|
||||||
|
saveStandardCoal: '节约标准煤(吨)',
|
||||||
|
equivalentCo2Reduction: 'CO2减排(吨)',
|
||||||
|
equivalentTreePlantings: '等效植树(棵)',
|
||||||
|
dailyPowerGeneration: '日发电量',
|
||||||
|
cumulativePowerGeneration: '累计发电量',
|
||||||
|
socialContribution: '社会贡献',
|
||||||
|
energyStorageRevenueReport:'储能收益报表',
|
||||||
|
pvStorageRevenueReport:'光伏收益报表',
|
||||||
|
projectMonthlyPower:'项目月发电量',
|
||||||
|
powerGeneration:'发电量',
|
||||||
|
mpptTopu:'MPPT拓扑图',
|
||||||
|
powerGenerationCapacity: '发电功率',
|
||||||
|
batVoltage: 'BAT电压',
|
||||||
|
batCurrent: 'BAT电流',
|
||||||
|
busVoltage: 'BAT电压',
|
||||||
|
busCurrent: 'BAT电流',
|
||||||
|
dc: '直流电流',
|
||||||
|
dcVoltage: '直流电压',
|
||||||
|
operatingPower: '运行功率',
|
||||||
|
pvPower:'功率',
|
||||||
|
enmonthTotalChargePrice: '本月总充电量总价(元)',
|
||||||
|
enmonthTotalDisChargePrice: '本月总放电量总价(元)',
|
||||||
|
enearnings: '收益(元)',
|
||||||
|
pvSwitch:'PV开关'
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -353,9 +353,9 @@ export default {
|
|||||||
dischargeVol: 'Cumulative Discharging Volume',
|
dischargeVol: 'Cumulative Discharging Volume',
|
||||||
totalEff: 'Cumulative Conversion Efficiency',
|
totalEff: 'Cumulative Conversion Efficiency',
|
||||||
projectRevenue: 'Project Revenue',
|
projectRevenue: 'Project Revenue',
|
||||||
monthTotalChargePrice: 'Total Charging Price Monthly(RMB)',
|
monthTotalChargePrice: 'Total Charging Price Monthly(EUR)',
|
||||||
monthTotalDisChargePrice: 'Total Discharging Price Monthly(RMB)',
|
monthTotalDisChargePrice: 'Total Discharging Price Monthly(EUR)',
|
||||||
earnings: 'Revenue(RMB)',
|
earnings: 'Revenue(EUR)',
|
||||||
earningsDetail: 'Revenue Detail',
|
earningsDetail: 'Revenue Detail',
|
||||||
charge: 'Charge',
|
charge: 'Charge',
|
||||||
ele: 'Electricity(kWh)',
|
ele: 'Electricity(kWh)',
|
||||||
|
|||||||
@ -2,8 +2,8 @@
|
|||||||
"name" : "StoraSmart",
|
"name" : "StoraSmart",
|
||||||
"appid" : "__UNI__86592F3",
|
"appid" : "__UNI__86592F3",
|
||||||
"description" : "Zetatech",
|
"description" : "Zetatech",
|
||||||
"versionName" : "2.0.2",
|
"versionName" : "2.0.8",
|
||||||
"versionCode" : 207,
|
"versionCode" : 213,
|
||||||
"transformPx" : false,
|
"transformPx" : false,
|
||||||
"sassImplementationName" : "node-sass",
|
"sassImplementationName" : "node-sass",
|
||||||
"app-plus" : {
|
"app-plus" : {
|
||||||
@ -32,10 +32,15 @@
|
|||||||
"modules" : {},
|
"modules" : {},
|
||||||
"distribute" : {
|
"distribute" : {
|
||||||
"android" : {
|
"android" : {
|
||||||
|
"permissions" : [],
|
||||||
|
"useAutoPermissions" : false,
|
||||||
"minSdkVersion" : 32,
|
"minSdkVersion" : 32,
|
||||||
"targetSdkVersion" : 36,
|
"targetSdkVersion" : 36,
|
||||||
"permissions" : [],
|
"abiFilters" : [ "armeabi-v7a", "arm64-v8a" ],
|
||||||
"abiFilters" : [ "armeabi-v7a", "arm64-v8a" ]
|
"excludePermissions" : [
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_MEDIA_IMAGES\" />",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_MEDIA_VIDEO\" />"
|
||||||
|
]
|
||||||
},
|
},
|
||||||
"ios" : {
|
"ios" : {
|
||||||
"dSYMs" : false
|
"dSYMs" : false
|
||||||
@ -155,5 +160,6 @@
|
|||||||
"disableHostCheck" : true
|
"disableHostCheck" : true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"locale" : "en"
|
"locale" : "en",
|
||||||
|
"fallbackLocale" : "en"
|
||||||
}
|
}
|
||||||
|
|||||||
875
pages/home-page/device-detail/components/mppt.vue
Normal file
875
pages/home-page/device-detail/components/mppt.vue
Normal file
@ -0,0 +1,875 @@
|
|||||||
|
<template>
|
||||||
|
<view class="pcs-warp">
|
||||||
|
<view class="box">
|
||||||
|
<view class="topology-box">
|
||||||
|
<Section :title="$t('homePage.home.mpptTopu')" />
|
||||||
|
<topoCanvas cId="canvas" :width="'100%'" :height="'100%'" :canvas-data="canvasData" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="box">
|
||||||
|
<Section :title="$t('homePage.home.powerGenerationCapacity')">
|
||||||
|
<view slot="right" style="flex: 1">
|
||||||
|
<view class="top-right-box">
|
||||||
|
<span class="time">{{$t('homePage.device.timeGranularity')}}:</span>
|
||||||
|
<span @click="openTimeAction" class="value">{{sampleTime}}</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</Section>
|
||||||
|
<view class="chart-box">
|
||||||
|
<zero-loading v-if="chartLoading" position="absolute"></zero-loading>
|
||||||
|
<charts v-else id="pcsChart" :options="curve_option"></charts>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="box" style="margin-bottom: 0;">
|
||||||
|
<Section :title="$t('homePage.device.deviceData')" />
|
||||||
|
<zero-loading v-if="stationLoading" position="absolute"></zero-loading>
|
||||||
|
<view v-else class="group-box">
|
||||||
|
<view class="group-item" @click="showHistory($t('homePage.home.batVoltage'), 'outputPower', 'pcs', 'kW', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zjrl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.outputPower | kWFormat }}
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.batVoltage')}}(kVar)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="group-item border-right"
|
||||||
|
@click="showHistory($t('homePage.home.batCurrent'), 'reactivePowerPCS', 'pcs', 'kVar', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zjrl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.reactivePowerPCS }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.batCurrent')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item" @click="showHistory($t('homePage.home.busVoltage'), 'grid', 'pcs', 'Hz', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/dqgl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.grid | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.busVoltage')}}(kVar)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item border-right" @click="showHistory($t('homePage.home.busCurrent'), 'volA', 'pcs', 'V', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.volA | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.busCurrent')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item border-right" @click="showHistory($t('homePage.home.dc'), 'volB', 'pcs', 'V', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.volB | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.dc')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item" @click="showHistory($t('homePage.home.dcVoltage'), 'volC', 'pcs', 'V', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.volC | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.home.dcVoltage')}}(kVar)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- <view class="group-item border-right" @click="showHistory($t('homePage.device.acur'), 'currentA', 'pcs', 'A', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/rfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.currentA | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.acur')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
<!-- <view class="group-item border-right" @click="showHistory($t('homePage.device.bcur'), 'currentB', 'pcs', 'A', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/rfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.currentB | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.bcur')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item" @click="showHistory($t('homePage.device.ccur'), 'currentC', 'pcs', 'A', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/rfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.currentC | isNull }}
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.ccur')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item border-right" @click="showHistory($t('homePage.device.DCPower'), 'dcPower', 'pcs', 'kW', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/dqgl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.dcPower | kWFormat }}</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.DCPower')}}({{ panelData.dcPower | kwUnitFormat}})</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item border-right" @click="showHistory($t('homePage.device.DCVol'), 'dcInputVol', 'pcs', 'V', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/zfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.dcInputVol | isNull }}
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.DCVol')}}(V)</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="group-item" @click="showHistory($t('homePage.device.DCCurrent'), 'dcCurrent', 'pcs', 'A', '')">
|
||||||
|
<view class="history-icon">
|
||||||
|
<image src="/static/aidex/images/history-icon.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-icon">
|
||||||
|
<image src="/static/aidex/images/rfdl.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item-con">
|
||||||
|
<view class="item-num">{{ panelData.dcCurrent | isNull }}
|
||||||
|
</view>
|
||||||
|
<view class="item-title">{{$t('homePage.device.DCCurrent')}}(A)</view>
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<historyModal :is-show.sync="histroyShow" :title="chartTitle" :params="hisParams" />
|
||||||
|
<u-action-sheet :list="actionSheetList" v-model="timeShow" @click="actionSheetCallback" @close="closeTimeAction"
|
||||||
|
:mask-close-able="false"></u-action-sheet>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import topoCanvas from '@/components/new-canvas/index.vue'
|
||||||
|
import historyModal from '@/components/history-modal/index.vue'
|
||||||
|
import Section from '@/components/section/index.vue'
|
||||||
|
import charts from "@/components/charts/index";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
historyModal,
|
||||||
|
Section,
|
||||||
|
charts,
|
||||||
|
topoCanvas
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
curve_option: {},
|
||||||
|
panelData: {},
|
||||||
|
histroyShow: false,
|
||||||
|
chartTitle: null,
|
||||||
|
chartLoading: false,
|
||||||
|
stationLoading: false,
|
||||||
|
hisParams: {},
|
||||||
|
timeShow: false,
|
||||||
|
time: "1",
|
||||||
|
stationId: null,
|
||||||
|
srcId: null,
|
||||||
|
hnStationId: [417, 398, 416, 415, 405, 485],
|
||||||
|
actionSheetList: this.$t('homePage.device.timesArr'),
|
||||||
|
sampleTime:this.$t('homePage.device.timesArr')[0].label,
|
||||||
|
canvasData: [],
|
||||||
|
textCanvasData: [
|
||||||
|
//2
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
coord: [
|
||||||
|
[200, 200]
|
||||||
|
],
|
||||||
|
font: [{
|
||||||
|
text:this.$t('homePage.device.vol') + "：",
|
||||||
|
size: 12,
|
||||||
|
color: "#999",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "3.265 kVar",
|
||||||
|
size: 12,
|
||||||
|
color: "#000",
|
||||||
|
left: 35
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
coord: [
|
||||||
|
[200, 220]
|
||||||
|
],
|
||||||
|
font: [{
|
||||||
|
text:this.$t('homePage.device.current') + "：",
|
||||||
|
size: 12,
|
||||||
|
color: "#999",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "3.98 A",
|
||||||
|
size: 12,
|
||||||
|
color: "#000",
|
||||||
|
left: 35
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
coord: [
|
||||||
|
[200, 180]
|
||||||
|
],
|
||||||
|
font: [{
|
||||||
|
text:this.$t('homePage.home.pvPower') + "：",
|
||||||
|
size: 12,
|
||||||
|
color: "#999",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "12.9 kW",
|
||||||
|
size: 12,
|
||||||
|
color: "#000",
|
||||||
|
left: 50
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
//5
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
coord: [
|
||||||
|
[3, 120]
|
||||||
|
],
|
||||||
|
font: [{
|
||||||
|
text: this.$t('homePage.device.runState') + ':',
|
||||||
|
size: 14,
|
||||||
|
color: "#999999",
|
||||||
|
width: 50,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: this.$t('homePage.device.offGrid'),
|
||||||
|
size: 14,
|
||||||
|
color: "#000",
|
||||||
|
left: 80
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
],
|
||||||
|
imageCanvasData: [
|
||||||
|
{
|
||||||
|
//AC/DC
|
||||||
|
type: "image",
|
||||||
|
url: "/static/topology/DCDC.png",
|
||||||
|
coord: [
|
||||||
|
[155, 80],
|
||||||
|
[30, 30],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
//电池
|
||||||
|
type: "image",
|
||||||
|
url: "/static/topology/pv.png",
|
||||||
|
coord: [
|
||||||
|
[144, 180],
|
||||||
|
[50, 50],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
lineCanvasData: [{
|
||||||
|
type: "line",
|
||||||
|
coord: [
|
||||||
|
[60, 30],
|
||||||
|
[280, 30],
|
||||||
|
],
|
||||||
|
color: "#19875c",
|
||||||
|
width: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "line",
|
||||||
|
coord: [
|
||||||
|
[170, 30],
|
||||||
|
[170, 180],
|
||||||
|
],
|
||||||
|
color: "#19875c",
|
||||||
|
width: 2,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
currentStation() {
|
||||||
|
return this.vuex_currentStation;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
currentStation: {
|
||||||
|
handler(val) {
|
||||||
|
this.stationId = val.id;
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
getData(srcId) {
|
||||||
|
this.srcId = srcId
|
||||||
|
this.getChart()
|
||||||
|
this.getStatus()
|
||||||
|
},
|
||||||
|
getChart() {
|
||||||
|
const self = this
|
||||||
|
self.chartLoading = true;
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
self.$u.api.deviceList
|
||||||
|
.GetPCSCurve({
|
||||||
|
stationId: this.stationId,
|
||||||
|
sampleTime: this.time,
|
||||||
|
srcId: this.srcId,
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
self.chartLoading = false;
|
||||||
|
self.initChargeChart(res.data);
|
||||||
|
// this.getStatus();
|
||||||
|
resolve(res);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
reject("错误");
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
self.chartLoading = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
initChargeChart(val) {
|
||||||
|
const gonglv = [];
|
||||||
|
const soc = [];
|
||||||
|
const xAxis = [];
|
||||||
|
val.forEach((v) => {
|
||||||
|
xAxis.push(v.data);
|
||||||
|
gonglv.push(v.pcsRealTimeCurve);
|
||||||
|
soc.push(v.inCoreDataCurve);
|
||||||
|
});
|
||||||
|
this.curve_option = {
|
||||||
|
color: ["#BFE49F"],
|
||||||
|
animationDuration: 500,
|
||||||
|
animationEasing: "cubicInOut",
|
||||||
|
tooltip: {
|
||||||
|
trigger: "axis",
|
||||||
|
axisPointer: {},
|
||||||
|
confine: true,
|
||||||
|
textStyle: {
|
||||||
|
textShadowBlur: 10, // 重点
|
||||||
|
textShadowColor: 'transparent', // 重点
|
||||||
|
},
|
||||||
|
position: function(point, params, dom, rect, size) {
|
||||||
|
// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
|
||||||
|
// 提示框位置
|
||||||
|
var x = 0; // x坐标位置
|
||||||
|
var y = 0; // y坐标位置
|
||||||
|
|
||||||
|
// 当前鼠标位置
|
||||||
|
var pointX = point[0];
|
||||||
|
var pointY = point[1];
|
||||||
|
|
||||||
|
// 外层div大小
|
||||||
|
// var viewWidth = size.viewSize[0];
|
||||||
|
// var viewHeight = size.viewSize[1];
|
||||||
|
|
||||||
|
// 提示框大小
|
||||||
|
var boxWidth = size.contentSize[0];
|
||||||
|
var boxHeight = size.contentSize[1];
|
||||||
|
|
||||||
|
// boxWidth > pointX 说明鼠标左边放不下提示框
|
||||||
|
if (boxWidth > pointX) {
|
||||||
|
x = 5; // 自己定个x坐标值，以防出屏
|
||||||
|
y -= 15; // 防止点被覆盖住，可根据情况自行调节
|
||||||
|
} else {
|
||||||
|
// 左边放的下
|
||||||
|
x = pointX - boxWidth - 15;
|
||||||
|
}
|
||||||
|
|
||||||
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
||||||
|
if (boxHeight + 20 > pointY) {
|
||||||
|
y = pointY + 15;
|
||||||
|
} else if (boxHeight > pointY) {
|
||||||
|
y = 5;
|
||||||
|
} else {
|
||||||
|
// 上边放得下
|
||||||
|
y += pointY - boxHeight;
|
||||||
|
}
|
||||||
|
return [x, y];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
top: "15%",
|
||||||
|
left: "5%",
|
||||||
|
right: "3%",
|
||||||
|
bottom: "10%",
|
||||||
|
containLabel: true,
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: "category",
|
||||||
|
data: xAxis,
|
||||||
|
splitLine: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
show: true,
|
||||||
|
color: "#A3A3A3",
|
||||||
|
formatter: function(params) {
|
||||||
|
let newParamsName = "";
|
||||||
|
const paramsNameNumber = params.length; // 文字总长度
|
||||||
|
const provideNumber = 11; //一行显示几个字
|
||||||
|
const rowNumber = Math.ceil(paramsNameNumber / provideNumber);
|
||||||
|
if (paramsNameNumber > provideNumber) {
|
||||||
|
for (let p = 0; p < rowNumber; p++) {
|
||||||
|
const start = p * provideNumber;
|
||||||
|
const end = start + provideNumber;
|
||||||
|
const tempStr =
|
||||||
|
p === rowNumber - 1 ?
|
||||||
|
params.substring(start, paramsNameNumber) :
|
||||||
|
params.substring(start, end) + "\n";
|
||||||
|
newParamsName += tempStr;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
newParamsName = params;
|
||||||
|
}
|
||||||
|
return newParamsName;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yAxis: [{
|
||||||
|
type: "value",
|
||||||
|
name: this.$t('homePage.home.powerGenerationCapacity') + "(kW)",
|
||||||
|
axisLabel: {
|
||||||
|
color: "#A3A3A3",
|
||||||
|
},
|
||||||
|
nameTextStyle: {
|
||||||
|
color: "#A3A3A3",
|
||||||
|
},
|
||||||
|
min: function(value) {
|
||||||
|
return Math.floor(
|
||||||
|
(Math.abs(value.min) < value.max ?
|
||||||
|
-value.max * 1.05 :
|
||||||
|
value.min * 1.05
|
||||||
|
).toFixed(2)
|
||||||
|
);
|
||||||
|
},
|
||||||
|
max: function(value) {
|
||||||
|
return Math.ceil(
|
||||||
|
(Math.abs(value.min) < value.max ?
|
||||||
|
value.max * 1.05 :
|
||||||
|
-value.min * 1.05
|
||||||
|
).toFixed(2)
|
||||||
|
);
|
||||||
|
},
|
||||||
|
nameTextStyle: {
|
||||||
|
fontSize: 12,
|
||||||
|
padding: [0, 0, 0, 30],
|
||||||
|
},
|
||||||
|
}
|
||||||
|
],
|
||||||
|
dataZoom: {
|
||||||
|
type: "inside",
|
||||||
|
},
|
||||||
|
series: [{
|
||||||
|
name: this.$t('homePage.home.powerGenerationCapacity'),
|
||||||
|
type: "line",
|
||||||
|
smooth: true,
|
||||||
|
symbol: "none",
|
||||||
|
areaStyle: {
|
||||||
|
opacity: 0,
|
||||||
|
},
|
||||||
|
data: gonglv,
|
||||||
|
}
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
},
|
||||||
|
openTimeAction() {
|
||||||
|
this.timeShow = true;
|
||||||
|
},
|
||||||
|
getStatus() {
|
||||||
|
this.stationLoading = true
|
||||||
|
const self = this;
|
||||||
|
|
||||||
|
this.$u.api.deviceList
|
||||||
|
.GetNewValue({
|
||||||
|
stationId: this.stationId,
|
||||||
|
srcId: this.srcId,
|
||||||
|
colList: [
|
||||||
|
"runState",
|
||||||
|
"remoteInPlace",
|
||||||
|
"onGrid",
|
||||||
|
"offGrid",
|
||||||
|
"stateCharging",
|
||||||
|
"stateDischarging",
|
||||||
|
"deviceStateStand",
|
||||||
|
"deviceStateFault",
|
||||||
|
"deviceStateFull",
|
||||||
|
"deviceStateEmpty",
|
||||||
|
"acBreaker",
|
||||||
|
"dcBreaker",
|
||||||
|
"soc",
|
||||||
|
"outputPower",
|
||||||
|
"reactivePowerPCS",
|
||||||
|
"grid",
|
||||||
|
"volA",
|
||||||
|
"volB",
|
||||||
|
"volC",
|
||||||
|
"currentA",
|
||||||
|
"currentB",
|
||||||
|
"currentC",
|
||||||
|
"dcPower",
|
||||||
|
"dcInputVol",
|
||||||
|
"dcCurrent",
|
||||||
|
],
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
const battery = self.updateBattery(res.data.soc?.value ? res.data.soc.value : 0);
|
||||||
|
this.panelData = {
|
||||||
|
outputPower: res.data.outputPower?.value ? res.data.outputPower?.value : 0,
|
||||||
|
reactivePowerPCS: res.data.reactivePowerPCS?.value ? res.data.reactivePowerPCS?.value :
|
||||||
|
0,
|
||||||
|
grid: res.data.grid?.value ? res.data.grid?.value : 0,
|
||||||
|
volA: res.data.volA?.value ? res.data.volA?.value : 0,
|
||||||
|
volB: res.data.volB?.value ? res.data.volB?.value : 0,
|
||||||
|
volC: res.data.volC?.value ? res.data.volC?.value : 0,
|
||||||
|
currentA: res.data.currentA?.value ? res.data.currentA?.value : 0,
|
||||||
|
currentB: res.data.currentB?.value ? res.data.currentB?.value : 0,
|
||||||
|
currentC: res.data.currentC?.value ? res.data.currentC?.value : 0,
|
||||||
|
dcPower: res.data.dcPower?.value ? res.data.dcPower?.value : 0,
|
||||||
|
dcInputVol: res.data.dcInputVol?.value ? res.data.dcInputVol?.value : 0,
|
||||||
|
dcCurrent: res.data.dcCurrent?.value ? res.data.dcCurrent?.value : 0,
|
||||||
|
};
|
||||||
|
// this.textCanvasData[2].font[1].text = res.data.soc?.value ? res.data.soc.value + "%" : 0 + "%";
|
||||||
|
// this.textCanvasData[3].font[1].text = this.workStatus(res.data.runState?.value);
|
||||||
|
// if (this.stationId === 349 || this.stationId === 362 || this.stationId === 363) {
|
||||||
|
// if (res.data.remoteInPlace?.value === 0) {
|
||||||
|
// this.textCanvasData[4].font[1].text = this.$t('homePage.device.localAutomatic')
|
||||||
|
// }
|
||||||
|
// if (res.data.remoteInPlace?.value === 1) {
|
||||||
|
// this.textCanvasData[4].font[1].text = this.$t('homePage.device.localManual')
|
||||||
|
// }
|
||||||
|
// if (res.data.remoteInPlace?.value === 2) {
|
||||||
|
// this.textCanvasData[4].font[1].text = this.$t('homePage.device.distance')
|
||||||
|
// }
|
||||||
|
|
||||||
|
// } else {
|
||||||
|
// if (res.data.remoteInPlace?.value === 0) {
|
||||||
|
// this.textCanvasData[4].font[1].text = this.$t('homePage.device.local')
|
||||||
|
// }
|
||||||
|
// if (res.data.remoteInPlace?.value === 1) {
|
||||||
|
// this.textCanvasData[4].font[1].text = this.$t('homePage.device.distance')
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// this.textCanvasData[5].font[1].text = res.data.onGrid?.value ?
|
||||||
|
// this.$t('homePage.device.grid') :
|
||||||
|
// this.$t('homePage.device.offGrid');
|
||||||
|
// if(res.data.outputPower?.value){
|
||||||
|
// this.textCanvasData[6].font[1].text = this.getFlowDirection(res.data.outputPower?.value, res
|
||||||
|
// .data.flowDirection)
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
this.canvasData = [...this.textCanvasData, ...this.imageCanvasData, ...this
|
||||||
|
.lineCanvasData
|
||||||
|
]
|
||||||
|
})
|
||||||
|
.finally((res) => {
|
||||||
|
this.stationLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
updateBattery(value) {
|
||||||
|
//电池电量 value 为0~100
|
||||||
|
const batteryHeight = 0.35 * value;
|
||||||
|
const battery = {
|
||||||
|
type: "rect",
|
||||||
|
background: "#19875c",
|
||||||
|
coord: [
|
||||||
|
[156, 285 - batteryHeight],
|
||||||
|
[25.5, batteryHeight],
|
||||||
|
],
|
||||||
|
};
|
||||||
|
return battery;
|
||||||
|
},
|
||||||
|
getRunState(value, value2) {
|
||||||
|
if (value) {
|
||||||
|
return this.$t('homePage.device.standby');
|
||||||
|
} else if (value2) {
|
||||||
|
return this.$t('homePage.device.fault');
|
||||||
|
} else {
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 设备工作状态
|
||||||
|
workStatus(val) {
|
||||||
|
if (val === 0) {
|
||||||
|
return this.$t('homePage.device.shutdown')
|
||||||
|
} else if (val === 1) {
|
||||||
|
return this.$t('homePage.device.run')
|
||||||
|
} else if (val === 2) {
|
||||||
|
return this.$t('homePage.device.standby')
|
||||||
|
} else {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 充放电状态
|
||||||
|
getFlowDirection(val, flowDirection) {
|
||||||
|
if (flowDirection === 2) {
|
||||||
|
if (+val > +1) {
|
||||||
|
return this.$t('homePage.device.discharge')
|
||||||
|
}
|
||||||
|
if (+val < -1) {
|
||||||
|
return this.$t('homePage.device.charge')
|
||||||
|
}
|
||||||
|
if (val < 1 || +val.abs < 1 || !val) {
|
||||||
|
return this.$t('homePage.device.standing')
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (+val > +1) {
|
||||||
|
return this.$t('homePage.device.charge')
|
||||||
|
}
|
||||||
|
if (+val < -1) {
|
||||||
|
return this.$t('homePage.device.discharge')
|
||||||
|
}
|
||||||
|
if (val < 1 || +val.abs < 1 || !val) {
|
||||||
|
return this.$t('homePage.device.standing')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// 电池信息
|
||||||
|
updateBattery(value) {
|
||||||
|
//电池电量 value 为0~100
|
||||||
|
const batteryHeight = 0.35 * value;
|
||||||
|
const battery = {
|
||||||
|
type: "rect",
|
||||||
|
background: "#19875c",
|
||||||
|
coord: [
|
||||||
|
[156, 285 - batteryHeight],
|
||||||
|
[25.5, batteryHeight],
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
return battery;
|
||||||
|
},
|
||||||
|
// 历史曲线
|
||||||
|
showHistory(name, modelCol, modelType, unit) {
|
||||||
|
this.hisParams = {
|
||||||
|
modelCol: modelCol,
|
||||||
|
modelType: modelType,
|
||||||
|
unit: unit
|
||||||
|
}
|
||||||
|
this.chartTitle = name
|
||||||
|
this.histroyShow = true
|
||||||
|
},
|
||||||
|
actionSheetCallback(index) {
|
||||||
|
this.sampleTime = this.actionSheetList[index].text;
|
||||||
|
this.time = this.actionSheetList[index].value;
|
||||||
|
this.getChart()
|
||||||
|
},
|
||||||
|
closeTimeAction() {
|
||||||
|
this.timeShow = false;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.pcs-warp {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.box {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
width: 100%;
|
||||||
|
border: 16rpx;
|
||||||
|
box-shadow: 0px 4rpx 16rpx rgba(0, 0, 0, 0.08);
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.topology-box {
|
||||||
|
width: 100%;
|
||||||
|
height: 640rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-right-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
|
.time {
|
||||||
|
padding-right: 10rpx;
|
||||||
|
display: inline-block;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.value {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
padding: 10rpx 20rpx 10rpx 20rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-right-item {
|
||||||
|
padding: 5rpx 10rpx;
|
||||||
|
border: 1rpx solid #4c9ee6;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #4c9ee6;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background: #4c9ee6;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.chart-box {
|
||||||
|
width: 650rpx;
|
||||||
|
height: 460rpx;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group-box {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.group-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
width: 199rpx;
|
||||||
|
|
||||||
|
justify-content: center;
|
||||||
|
background: #d7e9e548;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
margin: 10rpx 10rpx;
|
||||||
|
position: relative;
|
||||||
|
padding: 10rpx 0;
|
||||||
|
|
||||||
|
.history-icon {
|
||||||
|
position: absolute;
|
||||||
|
right: 0rpx;
|
||||||
|
top: 0rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-con {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
// margin-left: 15rpx;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.item-title {
|
||||||
|
width: 100%;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #2a2a2a;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-num {
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: #282828;
|
||||||
|
font-weight: bold;
|
||||||
|
max-width: 90%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-unit {
|
||||||
|
color: #cccccc;
|
||||||
|
font-size: 16rpx;
|
||||||
|
padding-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -23,6 +23,7 @@
|
|||||||
<view class="components-box" :style="{height:`calc(100% - ${safeHeight}rpx)`}">
|
<view class="components-box" :style="{height:`calc(100% - ${safeHeight}rpx)`}">
|
||||||
<JKPCS ref="PCS" v-if="type === 0 && Devicetype === 'pcs' && stationId === 484" />
|
<JKPCS ref="PCS" v-if="type === 0 && Devicetype === 'pcs' && stationId === 484" />
|
||||||
<PCS ref="PCS" v-if="type === 0 && Devicetype === 'pcs' && stationId !== 484" />
|
<PCS ref="PCS" v-if="type === 0 && Devicetype === 'pcs' && stationId !== 484" />
|
||||||
|
<MPPT ref="MPPT" v-if="type === 0 && Devicetype === 'mttp' && stationId !== 484" />
|
||||||
<Cluster ref="Cluster" v-if="type === 0 && Devicetype === 'cluster'" />
|
<Cluster ref="Cluster" v-if="type === 0 && Devicetype === 'cluster'" />
|
||||||
<Pack ref="Pack" v-if="type === 0 && Devicetype === 'pack'" />
|
<Pack ref="Pack" v-if="type === 0 && Devicetype === 'pack'" />
|
||||||
<Stack ref="Stack" v-if="type === 0 && Devicetype === 'stack' && stationId !== 484 " />
|
<Stack ref="Stack" v-if="type === 0 && Devicetype === 'stack' && stationId !== 484 " />
|
||||||
@ -44,6 +45,7 @@
|
|||||||
import JKPCS from './components/jingke-pcs.vue'
|
import JKPCS from './components/jingke-pcs.vue'
|
||||||
import JKStack from './components/jingke-stack.vue'
|
import JKStack from './components/jingke-stack.vue'
|
||||||
import PCS from './components/pcs.vue'
|
import PCS from './components/pcs.vue'
|
||||||
|
import MPPT from './components/mppt.vue'
|
||||||
import Cluster from './components/cluster.vue'
|
import Cluster from './components/cluster.vue'
|
||||||
import Stack from './components/stack.vue'
|
import Stack from './components/stack.vue'
|
||||||
import Pack from './components/pack.vue'
|
import Pack from './components/pack.vue'
|
||||||
@ -108,6 +110,10 @@
|
|||||||
if (this.$refs.PCS) {
|
if (this.$refs.PCS) {
|
||||||
this.$refs.PCS.getData(this.srcId)
|
this.$refs.PCS.getData(this.srcId)
|
||||||
}
|
}
|
||||||
|
// 新增mppt
|
||||||
|
if (this.$refs.MPPT) {
|
||||||
|
this.$refs.MPPT.getData(this.srcId)
|
||||||
|
}
|
||||||
if (this.$refs.Stack) {
|
if (this.$refs.Stack) {
|
||||||
this.$refs.Stack.getData(this.srcId)
|
this.$refs.Stack.getData(this.srcId)
|
||||||
}
|
}
|
||||||
@ -137,6 +143,7 @@
|
|||||||
components: {
|
components: {
|
||||||
JKPCS,
|
JKPCS,
|
||||||
PCS,
|
PCS,
|
||||||
|
MPPT,
|
||||||
DeviceYC,
|
DeviceYC,
|
||||||
DeviceYX,
|
DeviceYX,
|
||||||
Cluster,
|
Cluster,
|
||||||
@ -202,6 +209,9 @@
|
|||||||
if (this.$refs.PCS) {
|
if (this.$refs.PCS) {
|
||||||
this.$refs.PCS.getData(this.srcId)
|
this.$refs.PCS.getData(this.srcId)
|
||||||
}
|
}
|
||||||
|
if (this.$refs.MPPT) {
|
||||||
|
this.$refs.MPPT.getData(this.srcId)
|
||||||
|
}
|
||||||
if (this.$refs.Stack) {
|
if (this.$refs.Stack) {
|
||||||
this.$refs.Stack.getData(this.srcId)
|
this.$refs.Stack.getData(this.srcId)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -84,8 +84,8 @@
|
|||||||
type = "storage";
|
type = "storage";
|
||||||
} else if (item.deviceType?.includes("basic") ) {
|
} else if (item.deviceType?.includes("basic") ) {
|
||||||
type = "anything"
|
type = "anything"
|
||||||
} else {
|
} else if (item.deviceType?.includes("mttp") ) {
|
||||||
type = "pcs";
|
type = "mttp"
|
||||||
}
|
}
|
||||||
|
|
||||||
if (type) {
|
if (type) {
|
||||||
|
|||||||
@ -8,10 +8,10 @@
|
|||||||
<zero-loading v-if="loading"></zero-loading>
|
<zero-loading v-if="loading"></zero-loading>
|
||||||
|
|
||||||
<view v-else style="height: calc(100% - 100rpx);">
|
<view v-else style="height: calc(100% - 100rpx);">
|
||||||
<view class="search">
|
<!-- <view class="search">
|
||||||
<luyj-tree-search>
|
<luyj-tree-search :placeholder="$t('homePage.home.revenue')">
|
||||||
</luyj-tree-search>
|
</luyj-tree-search>
|
||||||
</view>
|
</view> -->
|
||||||
<view class="p_content">
|
<view class="p_content">
|
||||||
<view class="selectContent">
|
<view class="selectContent">
|
||||||
<view class="p_box selectItem" v-for="(item,index) in labeArr" :key="index" @click="toUrl(item)">
|
<view class="p_box selectItem" v-for="(item,index) in labeArr" :key="index" @click="toUrl(item)">
|
||||||
@ -43,12 +43,12 @@
|
|||||||
},
|
},
|
||||||
labeArr: [
|
labeArr: [
|
||||||
{
|
{
|
||||||
label: '储能收益报表',
|
label: this.$t("homePage.home.energyStorageRevenueReport"),
|
||||||
icon: require('@/static/aidex/images/earningSelect.png'),
|
icon: require('@/static/aidex/images/earningSelect.png'),
|
||||||
url: '/pages/home-page/earnings/index'
|
url: '/pages/home-page/earnings/index'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '光伏收益报表',
|
label: this.$t("homePage.home.pvStorageRevenueReport"),
|
||||||
icon: require('@/static/aidex/images/earningSelect.png'),
|
icon: require('@/static/aidex/images/earningSelect.png'),
|
||||||
url: '/pages/home-page/lights/index'
|
url: '/pages/home-page/lights/index'
|
||||||
},
|
},
|
||||||
|
|||||||
@ -149,7 +149,7 @@
|
|||||||
{{ totalData.totalChargePrice | isNull }}
|
{{ totalData.totalChargePrice | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t('homePage.earning.monthTotalChargePrice') }}
|
{{ $t('homePage.home.enmonthTotalChargePrice') }}
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
@ -164,7 +164,7 @@
|
|||||||
{{ totalData.totalDisChargePrice | isNull }}
|
{{ totalData.totalDisChargePrice | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t('homePage.earning.monthTotalDisChargePrice') }}
|
{{ $t('homePage.home.enmonthTotalDisChargePrice') }}
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
@ -179,7 +179,7 @@
|
|||||||
{{ totalData.income | isNull }}
|
{{ totalData.income | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t('homePage.earning.earnings') }}
|
{{ $t('homePage.home.enearnings') }}
|
||||||
</view>
|
</view>
|
||||||
<view class="bg">
|
<view class="bg">
|
||||||
|
|
||||||
|
|||||||
@ -39,7 +39,7 @@
|
|||||||
column: {
|
column: {
|
||||||
width: '10',
|
width: '10',
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@ -49,17 +49,18 @@
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getServerData() {
|
getServerData() {
|
||||||
|
let _this = this;
|
||||||
//模拟从服务器获取数据时的延时
|
//模拟从服务器获取数据时的延时
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
|
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
|
||||||
let res = {
|
let res = {
|
||||||
categories: ["2018-10-17", "2018-10-17", "2018-10-17", "2018-10-17", "2018-10-17",
|
categories: ["2025-10-17", "2025-10-18", "2025-10-19", "2025-10-20", "2025-10-21",
|
||||||
"2018-10-17"
|
"2025-10-22"
|
||||||
],
|
],
|
||||||
series: [
|
series: [
|
||||||
|
|
||||||
{
|
{
|
||||||
|
name:this.$t('homePage.home.powerGeneration'),
|
||||||
textColor: "#FFFFFF",
|
textColor: "#FFFFFF",
|
||||||
data: [18, 27, 21, 24, 6, 28]
|
data: [18, 27, 21, 24, 6, 28]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -105,7 +105,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="month-power">
|
<view class="month-power">
|
||||||
<Section title="项目月发电量" />
|
<Section :title="$t('homePage.home.projectMonthlyPower')" />
|
||||||
<view class="power-generation-detail">
|
<view class="power-generation-detail">
|
||||||
<run-chart />
|
<run-chart />
|
||||||
</view>
|
</view>
|
||||||
@ -123,7 +123,7 @@
|
|||||||
{{ totalData.totalChargePrice | isNull }}
|
{{ totalData.totalChargePrice | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t("homePage.earning.monthTotalChargePrice") }}
|
{{ $t("homePage.home.enmonthTotalChargePrice") }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="right-value t-fdzl"> </view>
|
<view class="right-value t-fdzl"> </view>
|
||||||
@ -138,7 +138,7 @@
|
|||||||
{{ totalData.totalDisChargePrice | isNull }}
|
{{ totalData.totalDisChargePrice | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t("homePage.earning.monthTotalDisChargePrice") }}
|
{{ $t("homePage.home.enmonthTotalDisChargePrice") }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="right-value t-swdl"> </view>
|
<view class="right-value t-swdl"> </view>
|
||||||
@ -150,7 +150,7 @@
|
|||||||
{{ totalData.income | isNull }}
|
{{ totalData.income | isNull }}
|
||||||
</view>
|
</view>
|
||||||
<view class="title">
|
<view class="title">
|
||||||
{{ $t("homePage.earning.earnings") }}
|
{{ $t("homePage.home.enearnings") }}
|
||||||
</view>
|
</view>
|
||||||
<view class="bg"> </view>
|
<view class="bg"> </view>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
@ -54,17 +54,22 @@
|
|||||||
|
|
||||||
</u-form>
|
</u-form>
|
||||||
|
|
||||||
<view style="display: flex;">
|
<view style="display: flex;flex-wrap:wrap;justify-content: space-between;">
|
||||||
<button type="success" size="mini" @click="handleIssue" style="background-color: #009458;color: #fff"
|
<button type="success" size="mini" @click="handleIssue" style="background-color: #009458;color: #fff;width: 40%;"
|
||||||
:loading="isMoreLoading" :disabled="deliveryLoading"
|
:loading="isMoreLoading" :disabled="deliveryLoading"
|
||||||
v-show="vuex_permissions.includes('strategy:planCurveDis:commandIssuance')">
|
v-show="vuex_permissions.includes('strategy:planCurveDis:commandIssuance')">
|
||||||
{{ $t('homePage.policy.commandDistribution') }}
|
{{ $t('homePage.policy.commandDistribution') }}
|
||||||
</button>
|
</button>
|
||||||
<button type="success" size="mini" @click="handleControlDelivery"
|
<button type="success" size="mini" @click="handleControlDelivery"
|
||||||
style="background-color: #009458; color: #fff" :loading="deliveryLoading" :disabled="isMoreLoading"
|
style="background-color: #009458; color: #fff;width: 40%;" :loading="deliveryLoading" :disabled="isMoreLoading"
|
||||||
v-show="vuex_permissions.includes('strategy:planCurveDis:commandIssuanceData')">
|
v-show="vuex_permissions.includes('strategy:planCurveDis:commandIssuanceData')">
|
||||||
{{ $t('homePage.policy.controlDistribution') }}
|
{{ $t('homePage.policy.controlDistribution') }}
|
||||||
</button>
|
</button>
|
||||||
|
<button type="success" size="mini"
|
||||||
|
style="background-color: #009458; color: #fff;margin-top: 10px;width: 90%;" :disabled="isMoreLoading"
|
||||||
|
v-show="vuex_permissions.includes('strategy:planCurveDis:commandIssuanceData')">
|
||||||
|
{{ $t('homePage.home.pvSwitch') }}
|
||||||
|
</button>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
@ -189,13 +189,13 @@ export default {
|
|||||||
// this.$u.vuex("vuex_stationValue", val);
|
// this.$u.vuex("vuex_stationValue", val);
|
||||||
if (val === '海外站' || val === 'Overseas Station') {
|
if (val === '海外站' || val === 'Overseas Station') {
|
||||||
this.$u.http.setConfig({
|
this.$u.http.setConfig({
|
||||||
baseUrl: 'http://1.95.170.86:8002/api',
|
// baseUrl: 'http://1.95.170.86:8002/api',
|
||||||
// baseUrl: 'https://zetatech.zzkj-cloud.com/api'
|
baseUrl: 'https://zetatech.zzkj-cloud.com/api'
|
||||||
});
|
});
|
||||||
} else if (val === '中国站' || val === 'China Station') {
|
} else if (val === '中国站' || val === 'China Station') {
|
||||||
this.$u.http.setConfig({
|
this.$u.http.setConfig({
|
||||||
baseUrl: 'http://1.95.170.86:8002/api'
|
// baseUrl: 'http://1.95.170.86:8002/api'
|
||||||
// baseUrl: 'https://zzkj-cloud.com/api'
|
baseUrl: 'https://zzkj-cloud.com/api'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const res = await this.$u.api.GetLanguageConfig('zh')
|
const res = await this.$u.api.GetLanguageConfig('zh')
|
||||||
|
|||||||
@ -61,6 +61,8 @@
|
|||||||
.label {
|
.label {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
color: #5A5A5A;
|
color: #5A5A5A;
|
||||||
|
text-align: center;
|
||||||
|
white-space: pre-wrap;
|
||||||
}
|
}
|
||||||
.rightMark {
|
.rightMark {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@ -1652,9 +1652,32 @@
|
|||||||
<circle id="myCircle" cx="220" cy="64" r="16" fill="#0DA17D"></circle>
|
<circle id="myCircle" cx="220" cy="64" r="16" fill="#0DA17D"></circle>
|
||||||
<circle id="myCircle" cx="960" cy="64" r="16" fill="#FB4444"></circle>
|
<circle id="myCircle" cx="960" cy="64" r="16" fill="#FB4444"></circle>
|
||||||
<!-- 动画元素 -->
|
<!-- 动画元素 -->
|
||||||
<circle id="myCircle" cx="280" cy="64" r="10" fill="#FFFFFF">
|
<circle id="myCircle" cx="280" cy="64" r="15" fill="#0DA17D">
|
||||||
<animate attributeName="cx" from="280" to="940" dur="800ms" fill="freeze" repeatCount="indefinite" />
|
<animate attributeName="cx" from="280" to="940" dur="3000ms" fill="freeze" repeatCount="indefinite" />
|
||||||
</circle>
|
</circle>
|
||||||
|
<!-- pv1 -->
|
||||||
|
<circle cx="160" cy="680" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv1" cx="160" cy="680" r="15" fill="#338EFE" />
|
||||||
|
<!-- pv2 -->
|
||||||
|
<circle cx="560" cy="680" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv2" cx="560" cy="680" r="15" fill="#338EFE" />
|
||||||
|
<!-- pcs1 -->
|
||||||
|
<circle cx="925" cy="680" r="16" fill="#58D86B" />
|
||||||
|
<circle class="anim-elebox1" cx="925" cy="680" r="15" fill="#58D86B" />
|
||||||
|
<!-- pv3 -->
|
||||||
|
<circle cx="160" cy="1230" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv3" cx="160" cy="1230" r="15" fill="#338EFE" />
|
||||||
|
<!-- pv4 -->
|
||||||
|
<circle cx="560" cy="1230" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv4" cx="560" cy="1230" r="15" fill="#338EFE" />
|
||||||
|
<!-- pcs2 -->
|
||||||
|
<circle cx="925" cy="1230" r="16" fill="#58D86B" />
|
||||||
|
<circle class="anim-elebox2" cx="925" cy="1230" r="15" fill="#58D86B" />
|
||||||
|
<!-- 往负载方向 -->
|
||||||
|
<!-- <circle cx="573" cy="500" r="16" fill="#338EFE" /> -->
|
||||||
|
<circle class="animation anim-pvele" cx="300" cy="400" r="15" fill="#338EFE" />
|
||||||
|
<!-- <circle cx="573" cy="500" r="16" fill="#58D86B" /> -->
|
||||||
|
<circle class="animation anim-boxele" cx="300" cy="400" r="15" fill="#58D86B" />
|
||||||
</svg>
|
</svg>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
@ -1675,17 +1698,17 @@
|
|||||||
y: 194
|
y: 194
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '计量电表功率(kW):100',
|
text: this.$t('homePage.home.workStatus') + this.$t('homePage.home.standing'),
|
||||||
x: 535,
|
x: 535,
|
||||||
y: 370
|
y: 370
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '计量电表功率(kW):120',
|
text: this.$t('homePage.home.activePower') + '120',
|
||||||
x: 535,
|
x: 535,
|
||||||
y: 420
|
y: 420
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '运行功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 58,
|
x: 58,
|
||||||
y: 860
|
y: 860
|
||||||
},
|
},
|
||||||
@ -1695,7 +1718,7 @@
|
|||||||
y: 920
|
y: 920
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 58,
|
x: 58,
|
||||||
y: 990
|
y: 990
|
||||||
},
|
},
|
||||||
@ -1705,7 +1728,7 @@
|
|||||||
y: 1050
|
y: 1050
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '运行功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 460,
|
x: 460,
|
||||||
y: 860
|
y: 860
|
||||||
},
|
},
|
||||||
@ -1715,7 +1738,7 @@
|
|||||||
y: 920
|
y: 920
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 460,
|
x: 460,
|
||||||
y: 990
|
y: 990
|
||||||
},
|
},
|
||||||
@ -1727,28 +1750,15 @@
|
|||||||
{
|
{
|
||||||
text: 'SOC(%):100',
|
text: 'SOC(%):100',
|
||||||
x: 810,
|
x: 810,
|
||||||
y: 860
|
y: 910
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: 'SOH(%):100',
|
text: 'SOH(%):100',
|
||||||
x: 810,
|
x: 810,
|
||||||
y: 920
|
y: 960
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '有机功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 840,
|
|
||||||
y: 990
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: '(kWh):100',
|
|
||||||
x: 810,
|
|
||||||
y: 1050
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{
|
|
||||||
text: '运行功率',
|
|
||||||
x: 58,
|
x: 58,
|
||||||
y: 1420
|
y: 1420
|
||||||
},
|
},
|
||||||
@ -1758,7 +1768,7 @@
|
|||||||
y: 1480
|
y: 1480
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 58,
|
x: 58,
|
||||||
y: 1550
|
y: 1550
|
||||||
},
|
},
|
||||||
@ -1768,7 +1778,7 @@
|
|||||||
y: 1610
|
y: 1610
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '运行功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 460,
|
x: 460,
|
||||||
y: 1420
|
y: 1420
|
||||||
},
|
},
|
||||||
@ -1778,7 +1788,7 @@
|
|||||||
y: 1480
|
y: 1480
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 460,
|
x: 460,
|
||||||
y: 1550
|
y: 1550
|
||||||
},
|
},
|
||||||
@ -1790,23 +1800,13 @@
|
|||||||
{
|
{
|
||||||
text: 'SOC(%):100',
|
text: 'SOC(%):100',
|
||||||
x: 810,
|
x: 810,
|
||||||
y: 1420
|
y: 1470
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: 'SOH(%):100',
|
text: 'SOH(%):100',
|
||||||
x: 810,
|
x: 810,
|
||||||
y: 1480
|
y: 1530
|
||||||
},
|
}
|
||||||
{
|
|
||||||
text: '有机功率',
|
|
||||||
x: 840,
|
|
||||||
y: 1550
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: '(kWh):100',
|
|
||||||
x: 810,
|
|
||||||
y: 1610
|
|
||||||
},
|
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -1837,4 +1837,86 @@
|
|||||||
font-size: 40px;
|
font-size: 40px;
|
||||||
fill: #7F7F7F;
|
fill: #7F7F7F;
|
||||||
}
|
}
|
||||||
|
.anim-pv1{
|
||||||
|
animation: moveToplfetpv1 3s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetpv1 {
|
||||||
|
0% { cx: 160; cy: 680; }
|
||||||
|
10% { cx: 160; cy: 600; }
|
||||||
|
37.5% { cx: 10; cy: 600; }
|
||||||
|
67.5% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 160; cy: 680; }
|
||||||
|
}
|
||||||
|
.anim-pv2{
|
||||||
|
animation: moveToplfetpv2 3.8s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetpv2 {
|
||||||
|
0% { cx: 560; cy: 680; }
|
||||||
|
10% { cx: 560; cy: 600; }
|
||||||
|
57.5% { cx: 10; cy: 600; }
|
||||||
|
77.5% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 560; cy: 680; }
|
||||||
|
}
|
||||||
|
.anim-pv3{
|
||||||
|
animation: moveToplfetpv3 5s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetpv3 {
|
||||||
|
0% { cx: 160; cy: 1230; }
|
||||||
|
7% { cx: 160; cy: 1160; }
|
||||||
|
21% { cx: 10; cy: 1160; }
|
||||||
|
70% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 160; cy: 1230; }
|
||||||
|
}
|
||||||
|
.anim-pv4{
|
||||||
|
animation: moveToplfetpv4 6.5s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetpv4 {
|
||||||
|
0% { cx: 560; cy: 1230; }
|
||||||
|
5% { cx: 560; cy: 1160; }
|
||||||
|
45% { cx: 10; cy: 1160; }
|
||||||
|
85% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 560; cy: 1230; }
|
||||||
|
}
|
||||||
|
.anim-elebox1{
|
||||||
|
animation: moveToplfetbox1 5s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetbox1 {
|
||||||
|
0% { cx: 925; cy: 680; }
|
||||||
|
10% { cx: 925; cy: 600; }
|
||||||
|
67.5% { cx: 10; cy: 600; }
|
||||||
|
82.5% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 925; cy: 680; }
|
||||||
|
}
|
||||||
|
.anim-elebox2{
|
||||||
|
animation: moveToplfetbox2 8s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
@keyframes moveToplfetbox2 {
|
||||||
|
0% { cx: 925; cy: 1230; }
|
||||||
|
5% { cx: 925; cy: 1160; }
|
||||||
|
55% { cx: 10; cy: 1160; }
|
||||||
|
90% { cx: 10; cy: 405; }
|
||||||
|
99.9999% { cx: 180; cy: 405; }
|
||||||
|
100% { cx: 925; cy: 1230; }
|
||||||
|
}
|
||||||
|
.animation{
|
||||||
|
animation: moveRightTopRight 5s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
.anim-pvele{
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
@keyframes moveRightTopRight {
|
||||||
|
0% { cx: 300; cy: 400; }
|
||||||
|
15% { cx: 435; cy: 400; }
|
||||||
|
50% { cx: 435; cy: 64; }
|
||||||
|
99.9999% { cx: 940; cy: 64; }
|
||||||
|
100% { cx: 300; cy: 400; }
|
||||||
|
}
|
||||||
|
.anim-boxele{
|
||||||
|
animation-delay: 1s;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -550,10 +550,20 @@
|
|||||||
<path d="M 1020,964L 1018,964L 1018,990L 1020,990L 1020,989L 1019,989L 1019,965L 1020,965Z"
|
<path d="M 1020,964L 1018,964L 1018,990L 1020,990L 1020,989L 1019,989L 1019,965L 1020,965Z"
|
||||||
style="fill:rgb(144,188,174);" />
|
style="fill:rgb(144,188,174);" />
|
||||||
<path d="M 1035,982L 1034,982L 1034,989L 1032,989L 1032,990L 1035,990Z" style="fill:rgb(144,188,174);" />
|
<path d="M 1035,982L 1034,982L 1034,989L 1032,989L 1032,990L 1035,990Z" style="fill:rgb(144,188,174);" />
|
||||||
|
<circle cx="155" cy="920" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv1" cx="155" cy="920" r="16" fill="#338EFE" />
|
||||||
|
<circle cx="570" cy="920" r="16" fill="#338EFE" />
|
||||||
|
<circle class="anim-pv2" cx="570" cy="920" r="16" fill="#338EFE" />
|
||||||
|
<circle cx="1000" cy="920" r="16" fill="#58D86B" />
|
||||||
|
<circle class="anim-elebox1" cx="1000" cy="920" r="16" fill="#58D86B" />
|
||||||
|
|
||||||
|
<!-- <circle cx="573" cy="500" r="16" fill="#338EFE" /> -->
|
||||||
|
<circle class="anim-topright anim-pvele" cx="573" cy="500" r="16" fill="#338EFE" />
|
||||||
|
<!-- <circle cx="573" cy="500" r="16" fill="#58D86B" /> -->
|
||||||
|
<circle class="anim-topright anim-boxele" cx="573" cy="500" r="16" fill="#58D86B" />
|
||||||
<!-- 动画元素 -->
|
<!-- 动画元素 -->
|
||||||
<circle id="myCircle" cx="280" cy="64" r="10" fill="#FFFFFF">
|
<circle id="myCircle" cx="280" cy="67" r="15" fill="#0DA17D">
|
||||||
<animate attributeName="cx" from="280" to="1000" dur="800ms" fill="freeze" repeatCount="indefinite" />
|
<animate attributeName="cx" from="280" to="1000" dur="3000ms" fill="freeze" repeatCount="indefinite" />
|
||||||
</circle>
|
</circle>
|
||||||
</svg>
|
</svg>
|
||||||
</view>
|
</view>
|
||||||
@ -566,57 +576,57 @@
|
|||||||
return {
|
return {
|
||||||
tags: [
|
tags: [
|
||||||
{
|
{
|
||||||
text: '100kW',
|
text: '',
|
||||||
x: 68,
|
x: 68,
|
||||||
y: 194
|
y: 194
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '100kW',
|
text: '',
|
||||||
x: 1060,
|
x: 1060,
|
||||||
y: 194
|
y: 194
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '计量电表功率(kW):100',
|
text: this.$t('homePage.home.workStatus') + this.$t('homePage.home.standing'),
|
||||||
x: 655,
|
x: 655,
|
||||||
y: 400
|
y: 400
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '计量电表功率(kW):120',
|
text: this.$t('homePage.home.activePower') + '120',
|
||||||
x: 655,
|
x: 655,
|
||||||
y: 460
|
y: 460
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '运行功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 48,
|
x: 48,
|
||||||
y: 1110
|
y: 1110
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '(kW):100',
|
text: '(kW):50',
|
||||||
x: 48,
|
x: 48,
|
||||||
y: 1170
|
y: 1170
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 48,
|
x: 48,
|
||||||
y: 1240
|
y: 1240
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '(kWh):100',
|
text: '(kWh):220',
|
||||||
x: 48,
|
x: 48,
|
||||||
y: 1300
|
y: 1300
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '运行功率',
|
text: this.$t('homePage.home.operatingPower'),
|
||||||
x: 470,
|
x: 470,
|
||||||
y: 1110
|
y: 1110
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '(kW):100',
|
text: '(kW):50',
|
||||||
x: 470,
|
x: 470,
|
||||||
y: 1170
|
y: 1170
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: '累计电量',
|
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
|
||||||
x: 470,
|
x: 470,
|
||||||
y: 1240
|
y: 1240
|
||||||
},
|
},
|
||||||
@ -626,25 +636,15 @@
|
|||||||
y: 1300
|
y: 1300
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: 'SOC(%):100',
|
text: 'SOC(%):73',
|
||||||
x: 880,
|
x: 880,
|
||||||
y: 1110
|
y: 1160
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: 'SOH(%):100',
|
text: 'SOH(%):99',
|
||||||
x: 880,
|
x: 880,
|
||||||
y: 1170
|
y: 1220
|
||||||
},
|
}
|
||||||
{
|
|
||||||
text: '有机功率',
|
|
||||||
x: 920,
|
|
||||||
y: 1230
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: '(kWh):100',
|
|
||||||
x: 900,
|
|
||||||
y: 1300
|
|
||||||
},
|
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -675,4 +675,86 @@
|
|||||||
font-size: 40px;
|
font-size: 40px;
|
||||||
fill: #7F7F7F;
|
fill: #7F7F7F;
|
||||||
}
|
}
|
||||||
|
/* 通用动画点样式 */
|
||||||
|
.anim-pv1 {
|
||||||
|
r: 15; /* 半径 */
|
||||||
|
fill: #338EFE; /* 颜色 */
|
||||||
|
/* CSS 动画核心配置：动画名称 时长 时间函数 延迟 循环次数 填充模式 */
|
||||||
|
animation: moveTopRightTop 3s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
.anim-pv2 {
|
||||||
|
r: 15;
|
||||||
|
fill: #338EFE;
|
||||||
|
animation: moveTop 2s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
.anim-elebox1 {
|
||||||
|
r: 15;
|
||||||
|
fill: #58D86B;
|
||||||
|
animation: moveTopleftTop 3s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
/* 关键帧：定义运动轨迹（向右→向下→复位） */
|
||||||
|
@keyframes moveTopRightTop {
|
||||||
|
/* 0%：初始位置（cx=280, cy=67） */
|
||||||
|
0% {
|
||||||
|
cx: 155;
|
||||||
|
cy: 920;
|
||||||
|
}
|
||||||
|
|
||||||
|
10% {
|
||||||
|
cx: 155;
|
||||||
|
cy: 845;
|
||||||
|
}
|
||||||
|
/* 65%：向右移动（2s 完成，对应总时长 3.1s 的 65%） */
|
||||||
|
65% {
|
||||||
|
cx: 570; /* 横向终点 */
|
||||||
|
cy: 845; /* 纵向保持初始 */
|
||||||
|
}
|
||||||
|
/* 97%：向下移动（1s 完成，对应总时长 3.1s 的 97%） */
|
||||||
|
99.99% {
|
||||||
|
cx: 570; /* 横向保持终点 */
|
||||||
|
cy: 680; /* 纵向终点 */
|
||||||
|
}
|
||||||
|
/* 100%：瞬间复位（避免卡顿） */
|
||||||
|
100% {
|
||||||
|
cx: 155;
|
||||||
|
cy: 920;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes moveTop {
|
||||||
|
0% {
|
||||||
|
cx: 570;
|
||||||
|
cy: 920;
|
||||||
|
}
|
||||||
|
99.99% {
|
||||||
|
cx: 570;
|
||||||
|
cy: 680;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
cx: 570;
|
||||||
|
cy: 920;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes moveTopleftTop {
|
||||||
|
0% { cx: 1000; cy: 920; }
|
||||||
|
10% { cx: 1000; cy: 845; }
|
||||||
|
65% { cx: 570; cy: 845; }
|
||||||
|
99.99% { cx: 570; cy: 680; }
|
||||||
|
100% { cx: 1000; cy: 920; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.anim-topright{
|
||||||
|
animation: moveTopRight 4s linear 0s infinite both;
|
||||||
|
}
|
||||||
|
.anim-pvele{
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
.anim-boxele{
|
||||||
|
animation-delay: 1s;
|
||||||
|
}
|
||||||
|
@keyframes moveTopRight {
|
||||||
|
0% { cx: 573; cy: 500; }
|
||||||
|
50% { cx: 573; cy: 67; }
|
||||||
|
99.99% { cx: 1000; cy: 67; }
|
||||||
|
100% { cx: 573; cy: 500; }
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -48,10 +48,10 @@
|
|||||||
<runda215 v-else-if="topologyType === 12" ref="tuopu" />
|
<runda215 v-else-if="topologyType === 12" ref="tuopu" />
|
||||||
<third v-else-if="topologyType === 13" ref="tuopu" />
|
<third v-else-if="topologyType === 13" ref="tuopu" />
|
||||||
<mdPviese v-else-if="topologyType === 14" ref="tuopu" />
|
<mdPviese v-else-if="topologyType === 14" ref="tuopu" />
|
||||||
|
<ceshi-t v-else-if="topologyType === 1" />
|
||||||
<standard v-else ref="tuopu" />
|
<standard v-else ref="tuopu" />
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="box">
|
<!-- <view class="box">
|
||||||
<Section title="测试01" />
|
<Section title="测试01" />
|
||||||
<view class="marginT20">
|
<view class="marginT20">
|
||||||
<ceshi-t />
|
<ceshi-t />
|
||||||
@ -65,11 +65,11 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="box">
|
<view class="box">
|
||||||
<Section title="测试03" />
|
<Section title="测试03" />
|
||||||
<!-- 当前组件有数据处理示例 -->
|
当前组件有数据处理示例
|
||||||
<view class="marginT20">
|
<view class="marginT20">
|
||||||
<ceshi-s />
|
<ceshi-s />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view> -->
|
||||||
<view v-if="topologyType === 9" class="box">
|
<view v-if="topologyType === 9" class="box">
|
||||||
<Section :title="$t('homePage.home.deviceMonitor')" />
|
<Section :title="$t('homePage.home.deviceMonitor')" />
|
||||||
<devicemonitoring ref="deviceFire" />
|
<devicemonitoring ref="deviceFire" />
|
||||||
@ -105,19 +105,19 @@
|
|||||||
<zzhbStationData v-else-if="topologyType === 6" />
|
<zzhbStationData v-else-if="topologyType === 6" />
|
||||||
<commonStationData v-else />
|
<commonStationData v-else />
|
||||||
</view>
|
</view>
|
||||||
<view class="box">
|
<view class="box" v-if="topologyType === 1">
|
||||||
<Section title="光伏KPI" />
|
<Section :title="$t('homePage.home.pvKpi')" />
|
||||||
<view class="">
|
<view class="">
|
||||||
<my-grid imgHeight="40rpx" imgWidth="40rpx" :list="lightArr" />
|
<my-grid imgHeight="40rpx" imgWidth="40rpx" :list="lightArr" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="box" v-if="topologyType !== 9">
|
<view class="box" v-if="topologyType === 1">
|
||||||
<Section :title="$t('homePage.home.environmentalData')" />
|
<Section :title="$t('homePage.home.environmentalData')" />
|
||||||
<environmentalControlPosition v-if="rightCenter === 'dispositionRightCenter'" />
|
<environmentalControlPosition v-if="rightCenter === 'dispositionRightCenter'" />
|
||||||
<environmentalControl v-else />
|
<environmentalControl v-else />
|
||||||
</view>
|
</view>
|
||||||
<view class="box">
|
<view class="box">
|
||||||
<Section title="社会贡献" />
|
<Section :title="$t('homePage.home.socialContribution')" />
|
||||||
<view class="">
|
<view class="">
|
||||||
<my-grid :col="3" imgHeight="72rpx" imgWidth="82rpx" :list="society" />
|
<my-grid :col="3" imgHeight="72rpx" imgWidth="82rpx" :list="society" />
|
||||||
</view>
|
</view>
|
||||||
@ -207,40 +207,40 @@
|
|||||||
tuopuTimer: null,
|
tuopuTimer: null,
|
||||||
rightCenter: null,
|
rightCenter: null,
|
||||||
society: [{
|
society: [{
|
||||||
label: '充放电数据',
|
label: this.$t('homePage.home.saveStandardCoal'),
|
||||||
value: '85.00',
|
value: '15.00',
|
||||||
image: require('@/static/aidex/images/ll01.png'),
|
image: require('@/static/aidex/images/ll01.png'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'CO2减排(吨)',
|
label: this.$t('homePage.home.equivalentCo2Reduction'),
|
||||||
value: '85.00',
|
value: '20.50',
|
||||||
image: require('@/static/aidex/images/ll02.png'),
|
image: require('@/static/aidex/images/ll02.png'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '等效植树(万棵)',
|
label: this.$t('homePage.home.equivalentTreePlantings'),
|
||||||
value: '85.00',
|
value: '1.50',
|
||||||
image: require('@/static/aidex/images/ll03.png'),
|
image: require('@/static/aidex/images/ll03.png'),
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
lightArr: [{
|
lightArr: [{
|
||||||
label: '装机总容量(kWh)',
|
label: this.$t('homePage.home.totalCapacity') + '(kW)',
|
||||||
value: '85.00',
|
value: '100.00',
|
||||||
image: require('@/static/aidex/images/ll05.png'),
|
image: require('@/static/aidex/images/ll05.png'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '当前功率(kW)',
|
label: this.$t('homePage.home.currentPower') + '(kW)',
|
||||||
value: '85.00',
|
value: '47.00',
|
||||||
image: require('@/static/aidex/images/ll06.png'),
|
image: require('@/static/aidex/images/ll06.png'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '日发电量(kWh)',
|
label: this.$t('homePage.home.dailyPowerGeneration') + '(kWh)',
|
||||||
value: '85.00',
|
value: '85.00',
|
||||||
image: require('@/static/aidex/images/ll07.png'),
|
image: require('@/static/aidex/images/ll07.png'),
|
||||||
showMark: true
|
showMark: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '总发电量(MWh)',
|
label: this.$t('homePage.home.cumulativePowerGeneration') + '(kWh)',
|
||||||
value: '85.00',
|
value: '496.00',
|
||||||
image: require('@/static/aidex/images/ll07.png'),
|
image: require('@/static/aidex/images/ll07.png'),
|
||||||
showMark: true
|
showMark: true
|
||||||
},
|
},
|
||||||
@ -273,7 +273,7 @@
|
|||||||
|
|
||||||
this.stationId = val.id
|
this.stationId = val.id
|
||||||
this.userId = this.userData.userId
|
this.userId = this.userData.userId
|
||||||
console.log(val.topologyType)
|
console.log('拓扑图',val)
|
||||||
this.topologyType = val.topologyType
|
this.topologyType = val.topologyType
|
||||||
this.getComponents()
|
this.getComponents()
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user