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

马来西亚光伏拓扑图配置

Browse Source
This commit is contained in:
huangjp
2026-02-27 09:13:55 +08:00
parent 4c3039ade7
commit b0a6891bce
4 changed files with 578 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
manifest.json
View File

@ -2,8 +2,8 @@
"name" : "Zeta Cloud", "name" : "Zeta Cloud",
"appid" : "__UNI__86592F3", "appid" : "__UNI__86592F3",
"description" : "Zetatech", "description" : "Zetatech",
"versionName" : "2.0.13", "versionName" : "2.0.14",
"versionCode" : 218, "versionCode" : 219,
"transformPx" : false, "transformPx" : false,
"sassImplementationName" : "node-sass", "sassImplementationName" : "node-sass",
"app-plus" : { "app-plus" : {

28
pages/home-page/device-detail/components/ammeter.vue
View File

@ -903,7 +903,19 @@
} }
}, },
color: ['#009458', '#f0c252', '#0f94da'], color: ['#009458', '#f0c252', '#0f94da'],
legend: {}, legend: {
type: 'scroll',
orient: 'horizontal',
icon: "rect",
bottom: 0,
left: 0,
right: 0,
itemWidth: 10,
itemHeight: 10,
textStyle: {
fontSize: 10,
}
},
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,
@ -1085,7 +1097,19 @@
} }
}, },
color: ['#009458', '#f0c252', '#0f94da'], color: ['#009458', '#f0c252', '#0f94da'],
legend: {}, legend: {
type: 'scroll',
orient: 'horizontal',
icon: "rect",
bottom: 0,
left: 0,
right: 0,
itemWidth: 10,
itemHeight: 10,
textStyle: {
fontSize: 10,
}
},
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, boundaryGap: false,

599
pages/tabbar/components/topology/ceshiS.vue → pages/tabbar/components/topology/pv8FourthTopCenter.vue
View File

@ -1092,9 +1092,12 @@
<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="66" r="14" fill="rgb(0,128,127)">
<animate attributeName="cx" from="280" to="920" dur="800ms" fill="freeze" repeatCount="indefinite" /> <animate attributeName="cx" from="280" to="920" dur="3000ms" fill="freeze" repeatCount="indefinite" />
</circle> </circle> -->
<!-- 新增一个容器来存放动态文本，方便管理 -->
<g ref="svgTextContainer"></g>
</svg> </svg>
</view> </view>
@ -1104,43 +1107,34 @@
export default { export default {
data() { data() {
return { return {
stationId: '', // 新增stationId的初始值
tags: [{ tags: [{
text: '100kW', text:this.$t("homePage.home.grid"),
x: 0, x: 0,
y: 194 y: 194
}, },
{ {
text: '100kW', text: this.$t("homePage.home.load"),
x: 1000, x: 1000,
y: 194 y: 194
}, },
{ {
text: '计量电表功率(kW):100', text: this.$t('homePage.home.operatingPower'),
x: 540,
y: 370
},
{
text: '防逆流电表功率(kW):120',
x: 540,
y: 430
},
{
text: '运行功率',
x: 240, x: 240,
y: 560 y: 560
}, },
{ {
text: '(kW):100', text: '(kW)',
x: 240, x: 240,
y: 620 y: 620
}, },
{ {
text: '累计电量', text: this.$t('homePage.home.accumulatedElectricityConsumption'),
x: 520, x: 520,
y: 560 y: 560
}, },
{ {
text: '(kWh):100', text: '(kWh)',
x: 520, x: 520,
y: 620 y: 620
}, },
@ -1168,52 +1162,541 @@
list: [] list: []
} }
}, },
created() { computed: {
this.list = new Array(12).fill(0).reduce((pre, cur, index) => { currentStation() {
return [...pre, ...[{ return this.vuex_currentStation;
text: '45.12', },
x: 270,
y: 700 + index * 87
},
{
text: '45.12',
x: 540,
y: 700 + index * 87
},
{
text: '--',
x: 870,
y: 700 + index * 87
},
{
text: '--',
x: 1050,
y: 700 + index * 87
},
]]
}, [])
}, },
methods: { watch: {
createSvgText(tags) { stationId(newVal, oldVal) {
let fragment = new DocumentFragment() // 通过文档片段提升性能 if (newVal) {
for (let tag of [...tags,...this.list]) { this.tags
let text = document.createElementNS('http://www.w3.org/2000/svg', 'text') this.getData(newVal);
text.innerHTML = tag.text
text.setAttribute('x', tag.x.toString())
text.setAttribute('y', tag.y.toString())
text.setAttribute('font-size', '48')
text.setAttribute('fill', '#7F7F7F')
fragment.appendChild(text)
} }
return fragment
} }
}, },
mounted() { created() {
this.$refs.svgBoxss?.appendChild(this.createSvgText(this.tags)) // 初始化list的逻辑调整到getData中，避免重复初始化
}, },
beforeDestroy() {
// 原有销毁逻辑保留
},
methods: {
changeEnglish() {
this.tags = [{
text:this.$t("homePage.home.grid"),
x: 0,
y: 194
},
{
text: this.$t("homePage.home.load"),
x: 1000,
y: 194
},
{
text: this.$t('homePage.home.operatingPower'),
x: 240,
y: 560
},
{
text: '(kW)',
x: 240,
y: 620
},
{
text: this.$t('homePage.home.accumulatedElectricityConsumption'),
x: 520,
y: 560
},
{
text: '(kWh)',
x: 520,
y: 620
},
{
text: 'SOC',
x: 850,
y: 560
},
{
text: '%',
x: 850,
y: 620
},
{
text: 'SOH',
x: 1050,
y: 560
},
{
text: '%',
x: 1050,
y: 620
}
]
},
/**
* 重新渲染SVG文本
* @param {Array} tags 静态文本数组
* @param {Array} list 动态数据数组
*/
async renderSvgText(tags, list) {
try {
// 获取文本容器，清空原有内容
const textContainer = this.$refs.svgTextContainer;
if (!textContainer) return;
// 清空旧的文本节点
while (textContainer.firstChild) {
textContainer.removeChild(textContainer.firstChild);
}
// 创建文档片段提升性能
let fragment = new DocumentFragment();
// 合并静态和动态文本
const allText = [...tags, ...list];
// 生成文本节点
for (let tag of allText) {
if (!tag || !tag.hasOwnProperty('x') || !tag.hasOwnProperty('y')) continue;
let text = document.createElementNS('http://www.w3.org/2000/svg', 'text');
text.textContent = tag.text || '--'; // 兜底默认值
text.setAttribute('x', tag.x.toString());
text.setAttribute('y', tag.y.toString());
text.setAttribute('font-size', '48');
text.setAttribute('fill', '#7F7F7F');
fragment.appendChild(text);
}
// 添加到容器中
textContainer.appendChild(fragment);
} catch (error) {
console.error('渲染SVG文本失败:', error);
}
},
/**
* 获取数据并重新渲染
* @param {String} val 站点ID
*/
async getData(val) {
if (!val) return;
this.stationId = val;
this.list = []; // 清空旧数据
try {
const api = [
this.getpv1(), this.getpv2(), this.getpv3(), this.getpv4(),
this.getpv5(), this.getpv6(), this.getpv7(), this.getpv8(),
this.getPcs1(), this.getPcs2(), this.getPcs3(), this.getPcs4(),
this.getacdcCenter(), this.getAmmeter()
];
// 等待所有接口请求完成
await Promise.all(api);
// 所有数据获取完成后，重新渲染SVG文本
this.renderSvgText(this.tags, this.list);
} catch (error) {
console.error('获取数据失败:', error);
// 即使接口失败，也渲染默认值
this.renderSvgText(this.tags, this.list);
}
},
// ========== 以下接口方法保留，仅优化少量细节 ==========
getAmmeter() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-ammeter'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.name + item.value,
x: 540,
y: 370 + index * 60
})
// 这里可以根据实际需求处理交直流中心数据
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getacdcCenter() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-acdc-center'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
// 这里可以根据实际需求处理交直流中心数据
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv1() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-1'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 0 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 0 * 87 },
{ text: '--', x: 1050, y: 700 + 0 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv2() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-2'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 1 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 1 * 87 },
{ text: '--', x: 1050, y: 700 + 1 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getPcs1() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pcs-1'
})
.then((res) => {
if (res.data && res.data.length) {
this.list.push(
{ text: '--', x: 270, y: 700 + 2 * 87 },
{ text: '--', x: 540, y: 700 + 2 * 87 }
)
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: 870 + index * 180,
y: 700 + 2 * 87
})
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv3() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-3'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 3 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 3 * 87 },
{ text: '--', x: 1050, y: 700 + 3 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv4() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-4'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 4 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 4 * 87 },
{ text: '--', x: 1050, y: 700 + 4 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getPcs2() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pcs-2'
})
.then((res) => {
if (res.data && res.data.length) {
this.list.push(
{ text: '--', x: 270, y: 700 + 5 * 87 },
{ text: '--', x: 540, y: 700 + 5 * 87 }
)
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: 870 + index * 180,
y: 700 + 5 * 87
})
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv5() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-5'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 6 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 6 * 87 },
{ text: '--', x: 1050, y: 700 + 6 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv6() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-6'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 7 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 7 * 87 },
{ text: '--', x: 1050, y: 700 + 7 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getPcs3() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pcs-3'
})
.then((res) => {
if (res.data && res.data.length) {
this.list.push(
{ text: '--', x: 270, y: 700 + 8 * 87 },
{ text: '--', x: 540, y: 700 + 8 * 87 }
)
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: 870 + index * 180,
y: 700 + 8 * 87
})
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv7() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-7'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 9 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 9 * 87 },
{ text: '--', x: 1050, y: 700 + 9 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getpv8() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pv-8'
})
.then((res) => {
if (res.data && res.data.length) {
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: (index + 1) * 270,
y: 700 + 10 * 87
})
})
this.list.push(
{ text: '--', x: 870, y: 700 + 10 * 87 },
{ text: '--', x: 1050, y: 700 + 10 * 87 }
)
}
resolve()
})
.catch(reject); // 新增错误捕获
})
},
getPcs4() {
let self = this;
return new Promise((resolve, reject) => {
self.$u.api.homePageData
.GetDynamicConfig({
stationId: this.stationId,
pageLocation: 'triad-pcs-4'
})
.then((res) => {
if (res.data && res.data.length) {
this.list.push(
{ text: '--', x: 270, y: 700 + 11 * 87 },
{ text: '--', x: 540, y: 700 + 11 * 87 }
)
res.data.forEach((item, index) => {
this.list.push({
text: item.value,
x: 870 + index * 180,
y: 700 + 11 * 87
})
})
}
resolve()
})
.catch(reject); // 新增错误捕获
})
}
},
async mounted() {
// 组件挂载时如果有stationId则初始化数据
if (this.stationId) {
await this.getData(this.stationId);
}
}
} }
</script> </script>
<style> <style>
.label_tp01 { .label_tp01 {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;

14
pages/tabbar/dashboard.vue
View File

@ -53,7 +53,7 @@
<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" />
<pv2first v-else-if="topologyType === 1 && inverterFlag === 1 && pvTopologyType === 3" ref="tuopu" /> <pv8FourthTopCenter v-else-if="topologyType === 1 && inverterFlag === 1 && pvTopologyType === 5" ref="tuopu" />
<standard v-else ref="tuopu" /> <standard v-else ref="tuopu" />
</view> </view>
</view> </view>
@ -124,7 +124,7 @@
import cixi from './components/topology/cixi' import cixi from './components/topology/cixi'
import ceshiT from './components/topology/ceshiT.vue' import ceshiT from './components/topology/ceshiT.vue'
import ceshiL from './components/topology/ceshiL.vue' import ceshiL from './components/topology/ceshiL.vue'
import ceshiS from './components/topology/ceshiS.vue' import pv8FourthTopCenter from './components/topology/pv8FourthTopCenter.vue'
import pv2first from './components/topology/pv2first.vue' import pv2first from './components/topology/pv2first.vue'
@ -155,7 +155,7 @@
components: { components: {
ceshiT, ceshiT,
ceshiL, ceshiL,
ceshiS, pv8FourthTopCenter,
pv2first, pv2first,
myGrid, myGrid,
stationDropdow, stationDropdow,
@ -209,7 +209,8 @@
{name:'pv1AndStorage_261',value:1}, {name:'pv1AndStorage_261',value:1},
{name:'pv1AndStorage_sts_261',value:2}, {name:'pv1AndStorage_sts_261',value:2},
{name:'pv2AndStorage_261',value:3}, {name:'pv2AndStorage_261',value:3},
{name:'pv2AndStorage_sts_261',value:4} {name:'pv2AndStorage_sts_261',value:4},
{name:'pv8FourthTopCenter',value:5}
], ],
pvTopologyType:0, pvTopologyType:0,
society: [{ society: [{
@ -300,6 +301,7 @@
if (val && val.id) { if (val && val.id) {
this.stationId = val.id this.stationId = val.id
this.userId = this.userData.userId this.userId = this.userData.userId
console.log('topologyType:',val);
this.topologyType = val.topologyType this.topologyType = val.topologyType
// 重置加载状态，避免复用旧状态 // 重置加载状态，避免复用旧状态
this.componentsLoaded = false this.componentsLoaded = false
@ -397,9 +399,11 @@
try { try {
const { data } = await this.$u.api.homePageData.GetHomePageComponents(this.stationId); const { data } = await this.$u.api.homePageData.GetHomePageComponents(this.stationId);
if (data && data.length > 0) { if (data && data.length > 0) {
console.log(data)
this.rightCenter = data[0]?.rightCenter; this.rightCenter = data[0]?.rightCenter;
const matchedItem = this.topCenterPvArr.find(item => item.name === data[0]?.topCenter); const matchedItem = this.topCenterPvArr.find(item => item.name === data[0]?.topCenter);
this.pvTopologyType = matchedItem ? matchedItem.value : this.pvTopologyType; this.pvTopologyType = matchedItem ? matchedItem.value : this.pvTopologyType;
console.log(this.pvTopologyType)
} }
// 接口完成，标记加载状态为true // 接口完成，标记加载状态为true
this.componentsLoaded = true this.componentsLoaded = true
@ -578,7 +582,7 @@
.loading-tip { .loading-tip {
width: 650rpx; width: 650rpx;
height: 710rpx; // height: 710rpx;
position: relative; position: relative;
} }
.top-right-box { .top-right-box {