zzkj/smart_storage_app
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

svg拓扑图修改为canvas拓扑图

Browse Source
This commit is contained in:
huangjp
2026-03-09 14:50:40 +08:00
parent b0a6891bce
commit ad1d898e7d
30 changed files with 5463 additions and 3395 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
pages/home-page/device-detail/components/mppt.vue
View File

@ -20,71 +20,6 @@
<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.pvActivePower | kWFormat }}
</view>
<view class="item-title">{{$t('homePage.home.batVoltage')}}(V)</view>
</view>
</view>
<view class="group-item border-right"
@click="showHistory($t('homePage.home.batCurrent'), 'reactivePowerPCS', '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/zjrl.png"></image>
</view>
<view class="item-con">
<view class="item-num">{{ panelData.lowV }}
</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.lowI | isNull }}
</view>
<view class="item-title">{{$t('homePage.home.busVoltage')}}(V)</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.highV | isNull }}
</view>
<view class="item-title">{{$t('homePage.home.busCurrent')}}(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>
@ -234,8 +169,6 @@
},
],
}
],
imageCanvasData: [
{
@ -331,7 +264,7 @@
const xAxis = [];
val.forEach((v) => {
xAxis.push(v.data);
gonglv.push(v.planCurve);
gonglv.push(v.inCoreDataCurve);
// soc.push(v.inCoreDataCurve);
});
this.curve_option = {
@ -512,13 +445,11 @@
this.textCanvasData[1].font[1].text = res.data.highV?.value ? res.data.highV.value + " V" : 0 + " V";
this.textCanvasData[2].font[1].text = res.data.lowV?.value ? res.data.lowV.value + " V" : 0 + " V";
this.textCanvasData[3].font[1].text = res.data.lowI?.value ? res.data.lowI.value + " A" : 0 + " A";
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.textCanvasData[4].font[1].text = res.data.onGrid?.value ? this.$t('homePage.device.grid') : this.$t('homePage.device.offGrid');
if(res.data.pvActivePower?.value){
this.textCanvasData[5].font[1].text = this.getFlowDirection(res.data.pvActivePower?.value, res
.data.runState?.value)
}
this.canvasData = [...this.textCanvasData, ...this.imageCanvasData, ...this.lineCanvasData]
})
.finally((res) => {