详情数据对接

This commit is contained in:
仲么了
2023-08-18 14:41:53 +08:00
parent 9423ad6216
commit cc63cda4e7
12 changed files with 246 additions and 200 deletions

View File

@@ -2,7 +2,7 @@ import request from '../js/request'
/**
* 发送验证码
* @param {*} params.type 0:登录 1:注册 2:修改密码 3:忘记密码 4:更换手机号第二步获取验证码 5:更换手机号第一步获取验证码
* @param {*} params.type 0:登录 1:注册 2:修改密码 6:忘记密码 4:更换手机号第二步获取验证码 5:更换手机号第一步获取验证码
* @returns
*/
export function apiGetYms(params) {

View File

@@ -2,8 +2,8 @@
"name" : "灿能物联",
"appid" : "__UNI__88BC25B",
"description" : "",
"versionName" : "1.0.9",
"versionCode" : 109,
"versionName" : "1.1.0",
"versionCode" : 110,
"transformPx" : false,
/* 5+App */
"app-plus" : {

View File

@@ -1,31 +1,5 @@
<template>
<view class="basic">
<!-- <view class="grid-card">
<view class="grid-card-title">模块</view>
<view class="grid-card-content-4">
<view class="item item-title">名称</view>
<view class="item item-title">实际输出电流A</view>
<view class="item item-title">总谐波电流A</view>
<view class="item item-title">总谐波电压V</view>
<view class="item">模块1</view>
<view class="item">300</view>
<view class="item">200</view>
<view class="item">110</view>
<view class="item">模块2</view>
<view class="item">300</view>
<view class="item">200</view>
<view class="item">110</view>
<view class="item">模块3</view>
<view class="item">300</view>
<view class="item">200</view>
<view class="item">110</view>
<view class="item">模块4</view>
<view class="item">300</view>
<view class="item">200</view>
<view class="item">110</view>
</view>
</view> -->
<view class="grid-card">
<view class="grid-card-title">电网电流</view>
<view class="grid-card-content-3">
@@ -34,8 +8,8 @@
<view class="item item-title">THDI(%)</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['A(A)'] }}</view>
<view class="item">{{ item['ThdPhI(%)'] }}</view>
<view class="item">{{ item['Pq_RmsI(A)'] || '-' }}</view>
<view class="item">{{ item['Pq_ThdI(%)'] || '-'}}</view>
</template>
</view>
</view>
@@ -48,9 +22,9 @@
<view class="item item-title">THDU(%)</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['PhV(V)'] }}</view>
<view class="item">{{ item['Hz(Hz)'] }}</view>
<view class="item">{{ item['ThdPhV(%)'] }}</view>
<view class="item">{{ item['Pq_RmsLU(V)'] || '-' }}</view>
<view class="item">{{ item['Pq_Freq(Hz)'] || '-' }}</view>
<view class="item">{{ item['Pq_ThdU(%)'] || '-' }}</view>
</template>
</view>
</view>
@@ -62,8 +36,8 @@
<view class="item item-title">THDI(%)</view>
<template v-for="(item, index) in renderData.负载侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['A(A)'] }}</view>
<view class="item">{{ item['ThdPhI(%)'] }}</view>
<view class="item">{{ item['Pq_RmsI(A)'] || '-' }}</view>
<view class="item">{{ item['Pq_ThdI(%)'] || '-' }}</view>
</template>
</view>
</view>
@@ -75,7 +49,7 @@
<view class="item item-title">负载率(%)</view>
<template v-for="(item, index) in renderData.输出侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['A(A)'] }}</view>
<view class="item">{{ item['Apf_RmsI_Sys(A)'] || '-' }}</view>
<view class="item"></view>
</template>
</view>
@@ -94,56 +68,49 @@ export default {
}
},
props: {
deviceInfo: {
type: Object,
basicData: {
type: Array,
default: () => {
return {}
return []
},
},
},
watch: {
deviceInfo: {
basicData: {
handler: function (newVal, oldVal) {
let arr = [
{
name: '电网侧',
position: 'cb23b9ede3b652cd6da194fd7b318124',
linePostion: 'cb23b9ede3b652cd6da194fd7b318124',
},
{
name: '负载侧',
position: '32624d4bb3a86f2b9a01bab272e50125',
linePostion: '32624d4bb3a86f2b9a01bab272e50125',
},
{
name: '输出侧',
position: '26eae70fb5ff1c090d2dc7c3a0743948',
linePostion: '26eae70fb5ff1c090d2dc7c3a0743948',
},
]
console.log(this.deviceInfo)
this.deviceInfo.appsLineTopologyDiagramPO.forEach((item1) => {
if (item1.value.length === 0) {
this.basicData.forEach((item) => {
if (item.phase === 'avg') {
return
}
let index = arr.findIndex((item2) => {
return item2.position === item1.linePostion
return item2.linePostion === item.position
})
if(index === -1) {
return
}
item1.value.forEach((item) => {
if(item.phase === 'avg'){
return
}
if (index > -1) {
if (this.renderData[arr[index]['name']][item.phase]) {
this.renderData[arr[index]['name']][item.phase][item.statisticalName] = item.statisticalData
this.renderData[arr[index]['name']][item.phase][item.statisticalName] = item.statisticalData || '-'
} else {
this.renderData[arr[index]['name']][item.phase] = {
phase: item.phase,
[item.statisticalName]: item.statisticalData,
[item.statisticalName]: item.statisticalData || '-',
}
}
}
})
})
console.warn(this.renderData)
console.log(this.renderData)
},
deep: true,
immediate: true,

View File

@@ -10,10 +10,10 @@
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['W(W)'] }}</view>
<view class="item">{{ item['VAr(var)'] }}</view>
<view class="item">{{ item['VA(VA)'] }}</view>
<view class="item">{{ item['ThdPhI(%)'] }}</view>
<view class="item">{{ item['Pq_P(W)'] || '-' }}</view>
<view class="item">{{ item['Pq_Q(var)'] || '-' }}</view>
<view class="item">{{ item['Pq_S(VA)'] || '-' }}</view>
<view class="item">{{ item['Pq_PF(null)'] || '-' }}</view>
</template>
</view>
</view>
@@ -27,10 +27,10 @@
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['W(W)'] }}</view>
<view class="item">{{ item['VAr(var)'] }}</view>
<view class="item">{{ item['VA(VA)'] }}</view>
<view class="item">{{ item['ThdPhI(%)'] }}</view>
<view class="item">{{ item['Pq_P(W)'] || '-' }}</view>
<view class="item">{{ item['Pq_Q(var)'] || '-' }}</view>
<view class="item">{{ item['Pq_S(VA)'] || '-' }}</view>
<view class="item">{{ item['Pq_PF(null)'] || '-' }}</view>
</template>
</view>
</view>
@@ -48,55 +48,49 @@ export default {
}
},
props: {
deviceInfo: {
type: Object,
basicData: {
type: Array,
default: () => {
return {}
return []
},
},
},
watch: {
deviceInfo: {
basicData: {
handler: function (newVal, oldVal) {
let arr = [
{
name: '电网侧',
position: 'cb23b9ede3b652cd6da194fd7b318124',
linePostion: 'cb23b9ede3b652cd6da194fd7b318124',
},
{
name: '负载侧',
position: '32624d4bb3a86f2b9a01bab272e50125',
linePostion: '32624d4bb3a86f2b9a01bab272e50125',
},
{
name: '输出侧',
position: '26eae70fb5ff1c090d2dc7c3a0743948',
linePostion: '26eae70fb5ff1c090d2dc7c3a0743948',
},
]
this.deviceInfo.appsLineTopologyDiagramPO.forEach((item1) => {
if (item1.value.length === 0) {
this.basicData.forEach((item) => {
if (item.phase === 'avg') {
return
}
let index = arr.findIndex((item2) => {
return item2.position === item1.linePostion
return item2.linePostion === item.position
})
if (index === -1) {
return
}
item1.value.forEach((item) => {
if(item.phase === 'avg'){
return
}
if (index > -1) {
if (this.renderData[arr[index]['name']][item.phase]) {
this.renderData[arr[index]['name']][item.phase][item.statisticalName] = item.statisticalData
this.renderData[arr[index]['name']][item.phase][item.statisticalName] = item.statisticalData || '-'
} else {
this.renderData[arr[index]['name']][item.phase] = {
phase: item.phase,
[item.statisticalName]: item.statisticalData,
[item.statisticalName]: item.statisticalData || '-',
}
}
}
})
})
console.warn(this.renderData)
console.log(this.renderData)
},
deep: true,
immediate: true,

View File

@@ -2,32 +2,32 @@
<view>
<uni-data-checkbox v-model="radio" :localdata="sex"></uni-data-checkbox>
<view class="charts-box">
<qiun-data-charts type="bar" :opts="opts" :chartData="chartData" />
<qiun-data-charts type="bar" :opts="opts" :chartData="chartData"/>
</view>
</view>
</template>
<script>
export default {
data () {
props: {
basicData: {
type: Array,
default: () => []
}
},
data() {
return {
radio: 0,
sex: [{
text: 'THDI L1',
value: 0
}, {
text: 'THDI L2',
value: 1
}, {
text: 'THDI L3',
value: 2
}],
renderData: {
电网侧: {},
负载侧: {},
},
chartData: {},
//您可以通过修改 config-ucharts.js 文件中下标为 ['column'] 的节点来配置全局默认参数,如都是默认参数,此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
opts: {
enableScroll: true,
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
padding: [10,0,10,0],
padding: [10, 0, 10, 0],
legend: {},
xAxis: {
disableGrid: true,
@@ -52,11 +52,86 @@ export default {
}
};
},
mounted () {
this.getServerData();
watch: {
basicData: {
handler: function (newVal, oldVal) {
let basicData = JSON.parse(JSON.stringify(this.basicData))
let arr = [
{
name: '电网侧',
linePostion: 'cb23b9ede3b652cd6da194fd7b318124',
},
{
name: '负载侧',
linePostion: '32624d4bb3a86f2b9a01bab272e50125',
},
]
basicData.forEach((item) => {
if (item.statisticalName.indexOf('Pq_HarmI_') === -1) {
return
}
let index = arr.findIndex((item2) => {
return item2.linePostion === item.position
})
if (index > -1) {
if (this.renderData[arr[index]['name']][item.phase]) {
this.renderData[arr[index]['name']][item.phase][item.statisticalName] = item.statisticalData || 0
} else {
this.renderData[arr[index]['name']][item.phase] = {
phase: item.phase,
[item.statisticalName]: item.statisticalData || 0,
}
}
}
})
console.log(this.renderData)
this.sex = Object.keys(this.renderData['电网侧']).map((item, index) => {
return {
text: item,
value: index
}
})
let obj = JSON.parse(JSON.stringify(this.renderData['电网侧'][Object.keys(this.renderData['电网侧'])[0]]))
delete obj['phase']
console.log(Object.keys(obj).map(item => {
return Number(item.match(/Pq_HarmI_(\d+)/)[1])
}))
console.log(Object.values(this.renderData['电网侧'][this.sex[this.radio].text]).filter((item) => {
return typeof item === 'number'
}))
console.log(Object.values(this.renderData['负载侧'][this.sex[this.radio].text]).filter((item) => {
return typeof item === 'number'
}))
this.chartData = {
categories: Object.keys(obj).map(item => {
return item.match(/Pq_HarmI_(\d+)/)[1]
}),
series: [
{
name: "电网侧",
data: Object.values(this.renderData['电网侧'][this.sex[this.radio].text]).filter((item) => {
return typeof item === 'number'
})
},
{
name: "负载侧",
data: Object.values(this.renderData['负载侧'][this.sex[this.radio].text]).filter((item) => {
return typeof item === 'number'
})
}
]
}
},
deep: true,
immediate: true,
}
},
mounted() {
// this.getServerData();
},
methods: {
getServerData () {
getServerData() {
//模拟从服务器获取数据时的延时
setTimeout(() => {
//模拟服务器返回数据,如果数据格式和标准格式不同,需自行按下面的格式拼接
@@ -77,12 +152,12 @@ export default {
}, 500);
},
}
};
}
</script>
<style lang="scss">
.charts-box {
margin-top: 20rpx;
height:600px;
height: 600px;
}
</style>

View File

@@ -14,14 +14,14 @@
<view
class="point"
:style="{ left: item.lat + 'px', top: item.lng + 'px' }"
v-for="(item, index) in showtTarget"
v-for="(item, index) in topolodyData"
:key="index"
>
<view class="grid-card mt10" style="width: fit-content">
<view class="grid-card-content-1">
<view class="item">{{ item.label }}</view>
<view class="item" v-for="(child, childIndex) in item.value" :key="childIndex">
{{ child.showText }}
{{ child }}
</view>
</view>
</view>
@@ -63,13 +63,13 @@
</view>
<view class="content" v-if="deviceInfo">
<view v-if="navMenuActive == 0">
<basic :deviceInfo="deviceInfo"></basic>
<basic :basicData="basicData"></basic>
</view>
<view v-else-if="navMenuActive == 1">
<xieBo></xieBo>
<xieBo :basicData="basicData"></xieBo>
</view>
<view v-else-if="navMenuActive == 2">
<power :deviceInfo="deviceInfo"></power>
<power :basicData="basicData"></power>
</view>
<!-- <view v-else-if="navMenuActive == 3">
<oscillogram></oscillogram>
@@ -159,6 +159,33 @@ export default {
dictData: [],
isPrimaryUser: 0,
userInfo: {},
topolodyData: [
{
label: '电网侧',
linePostion: 'cb23b9ede3b652cd6da194fd7b318124',
lat: '',
lng: '',
showKey: ['Pq_ThdU(%)', 'Pq_ThdI(%)'], //要展示的指标key
value: [],// 展示的指标值
},
{
label: '负载侧',
linePostion: '32624d4bb3a86f2b9a01bab272e50125',
lat: '',
lng: '',
showKey: ['Pq_ThdU(%)', 'Pq_ThdI(%)'], //要展示的指标key
value: [],
},
{
label: '输出侧',
linePostion: '26eae70fb5ff1c090d2dc7c3a0743948',
lat: '',
lng: '',
showKey: ['Apf_ThdA_Load(%)', 'Apf_ThdA_Sys(%)'], //要展示的指标key
value: [],
},
],
basicData: []
}
},
computed: {
@@ -172,7 +199,9 @@ export default {
return item2.showText
})
})
return arr
return arr.filter((item) => {
return item.value.length
})
},
},
methods: {
@@ -317,35 +346,30 @@ export default {
console.log('连接断开')
})
.on('message', (topic, message) => {
console.log('接收推送信息:', message.toString().length)
console.log('接收推送信息:', message.toString())
if (!message.toString()) {
return
}
this.loading = false
let dataList = []
this.deviceInfo.appsLineTopologyDiagramPO.forEach((element) => {
element.value = []
})
JSON.parse(message.toString()).forEach((item) => {
this.deviceInfo.appsLineTopologyDiagramPO.forEach((element) => {
if (element.linePostion === item.position) {
// element.value.push({
// label: item.statisticalName,
// value: item.statisticalData,
// })
element.value.push({
...item,
showText:
item.statisticalName.indexOf('ThdPh') > -1 && item.phase === 'avg'
? item.statisticalName + '' + item.statisticalData
: '',
this.handlerData(JSON.parse(message.toString()))
this.$forceUpdate()
})
},
handlerData(data) {
this.topolodyData.forEach((element) => {
let arr = []
element.showKey.forEach((key) => {
data.forEach((item) => {
if (item.statisticalName === key && item.phase === 'avg' && element.linePostion === item.position) {
arr.push(key + ':' + item.statisticalData)
}
})
})
this.$forceUpdate()
console.log(this.deviceInfo.appsLineTopologyDiagramPO)
element.value = arr
})
this.basicData = data
this.$forceUpdate()
},
},
// 页面销毁
@@ -354,7 +378,6 @@ export default {
this.client.end()
},
onLoad(options) {
this.dictData = uni.getStorageSync(this.$cacheKey.dictData)
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.devId = options.id
@@ -364,15 +387,17 @@ export default {
queryTopologyDiagram(options.id).then((res) => {
this.deviceInfo = res.data
uni.setNavigationBarTitle({title: this.deviceInfo.devName || '设备详情'})
this.dictData.forEach((item) => {
if (item.code == 'Line_Position') {
item.children.forEach((item2) => {
this.deviceInfo.appsLineTopologyDiagramPO.forEach((element) => {
if (element.linePostion === item2.id) {
element.label = item2.name
}
})
this.topolodyData.filter((item) => {
let index = this.deviceInfo.appsLineTopologyDiagramPO.findIndex((element) => {
return element.linePostion === item.linePostion
})
if (index > -1) {
item.lat = this.deviceInfo.appsLineTopologyDiagramPO[index].lat
item.lng = this.deviceInfo.appsLineTopologyDiagramPO[index].lng
return true
} else {
// 把多余的监测点过滤掉
return false
}
})
this.initMqtt()

View File

@@ -30,31 +30,13 @@
:localdata="projectRange"
@change="queryTopologyDiagramPage"
disabled
:clearable="false"
></uni-data-select>
</uni-forms-item>
<!-- <uni-forms-item label="型号">
<uni-data-select v-model="formData.type" :localdata="typeRange"
@change="typeChange(item)"></uni-data-select>
</uni-forms-item> -->
<uni-forms-item label="位置">
<view style="display: flex">
<uni-easyinput
:clearable="false"
type="textarea"
autoHeight
v-model="formData.area"
placeholder="请输入位置信息"
disabled
/>
<!-- <uni-icons
type="location"
color="#007aff"
size="26"
class="ml20"
@click="chooseLocation"
></uni-icons> -->
</view>
</uni-forms-item>
<uni-forms-item label="拓扑图" v-if="formData.projectId">
<view style="display: flex">
<view style="flex: 1">
@@ -162,7 +144,6 @@ export default {
type: 2,
formData: {
nDid: '',
area: '',
projectId: '',
topologyDiagramUrl: '',
topologyDiagram: '',

View File

@@ -45,24 +45,24 @@
<uni-data-select v-model="formData.type" :localdata="typeRange"
@change="typeChange(item)"></uni-data-select>
</uni-forms-item> -->
<uni-forms-item label="位置">
<view style="display: flex;">
<uni-easyinput
:clearable="false"
type="textarea"
autoHeight
v-model="formData.area"
placeholder="请输入位置信息"
/>
<uni-icons
type="location"
color="#007aff"
size="26"
class="ml20"
@click="chooseLocation"
></uni-icons>
</view>
</uni-forms-item>
<!-- <uni-forms-item label="位置">-->
<!-- <view style="display: flex;">-->
<!-- <uni-easyinput-->
<!-- :clearable="false"-->
<!-- type="textarea"-->
<!-- autoHeight-->
<!-- v-model="formData.area"-->
<!-- placeholder="请输入位置信息"-->
<!-- />-->
<!-- <uni-icons-->
<!-- type="location"-->
<!-- color="#007aff"-->
<!-- size="26"-->
<!-- class="ml20"-->
<!-- @click="chooseLocation"-->
<!-- ></uni-icons>-->
<!-- </view>-->
<!-- </uni-forms-item>-->
<uni-forms-item label="拓扑图" v-if="formData.projectId">
<view style="display: flex">
<view style="flex: 1">
@@ -169,10 +169,9 @@ export default {
data() {
return {
loading: false,
type: 2,
type: 1,
formData: {
nDid: '',
area: '',
projectId: '',
topologyDiagramUrl: '',
topologyDiagram: '',

View File

@@ -75,9 +75,11 @@ export default {
uni.navigateBack()
},
add() {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
uni.navigateTo({
url: `/pages/engineering/new`,
})
}
},
upgrade(code) {
console.log(code)

View File

@@ -23,7 +23,7 @@
<view class="header-item-value">{{ devCount.eventCount || 0 }}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item" @click="projectNum">
<view class="header-item">
<view class="header-item-value">{{ devCount.projectCount || 0 }}</view>
<view class="header-item-label">项目个数</view>
</view>

View File

@@ -18,11 +18,11 @@
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>设备个数</view>
<view>{{item.devNum}}</view>
<view>{{ item.devNum }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{item.createTime}}</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card>
@@ -34,6 +34,7 @@
<script>
import list from '../../common/js/list'
export default {
mixins: [list],
data() {
@@ -53,6 +54,7 @@ export default {
uni.navigateBack()
},
add() {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
if (!uni.getStorageSync('engineering')) {
return uni.showToast({
title: '请先创建一个工程',
@@ -62,6 +64,7 @@ export default {
uni.navigateTo({
url: `/pages/project/new`,
})
}
},
upgrade(code) {
console.log(code)

View File

@@ -113,7 +113,7 @@ export default {
})
apiGetYms({
phone: this.formData.phone,
type: 3,
type: 6,
})
.then((res) => {
uni.hideLoading()