App/app-govern
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

app添加状态

Browse Source
This commit is contained in:
guanj
2025-07-18 13:29:43 +08:00
parent 998d017f5b
commit 032eed6768
7 changed files with 1585 additions and 719 deletions
Download Patch File Download Diff File Expand all files Collapse all files

927
pages/device/APF/detail.vue
View File

@@ -138,483 +138,476 @@ import IO from './comp/IO.vue'
import { queryTopologyDiagram, deleteDevice, cancelDebug, finishDebug } from '@/common/api/device'
import { manualAccess } from '@/common/api/accessBoot'
import { MQTT_IP, MQTT_OPTIONS } from '@/common/js/mqtt.js'
import mqtt from 'mqtt'
import mqtt from 'mqtt/dist/mqtt.js'
import { base64ToPath, pathToBase64 } from 'image-tools'
import hoverMenu from '@/hover-menu/components/hover-menu/hover-menu.vue';
import hoverMenu from '@/hover-menu/components/hover-menu/hover-menu.vue'
export default {
components: {
basic,
xieBo,
power,
oscillogram,
IO,
hoverMenu
},
data() {
return {
dataTime: '',
time: '',
remarkContent: '',
dialogType: '',
domLoading: true,
loading: true,
deviceInfo: {},
navMenuActive: 0,
navHeight: 0,
img: '',
topoImg: '',
navMenuList: [
{
text: '基本',
id: 'fc8c86dbc3f2d9810f5cd8f53c295415'
},
{
text: '谐波',
id: '769f3db0bce070d35acf8fa92c998eb6'
},
{
text: '功率',
id: 'a16aceae7d1565bf9f94dd7410cf9bce'
},
// {
// text: '波形',
// },
{
text: '其他',
components: {
basic,
xieBo,
power,
oscillogram,
IO,
hoverMenu,
},
data() {
return {
dataTime: '',
time: '',
remarkContent: '',
dialogType: '',
domLoading: true,
loading: true,
deviceInfo: {},
navMenuActive: 0,
navHeight: 0,
img: '',
topoImg: '',
navMenuList: [
{
text: '基本',
id: 'fc8c86dbc3f2d9810f5cd8f53c295415',
},
{
text: '谐波',
id: '769f3db0bce070d35acf8fa92c998eb6',
},
{
text: '功率',
id: 'a16aceae7d1565bf9f94dd7410cf9bce',
},
// {
// text: '波形',
// },
{
text: '其他',
},
],
content: [
{
iconPath: '/static/report.png',
text: '告警',
},
// {
// iconPath: '/static/record.png',
// text: '记录',
// },
{
iconPath: '/static/about.png',
text: '关于',
},
{
iconPath: '/static/access.png',
text: '接入',
},
],
client: null,
timer: null,
devId: '',
dictData: [],
isPrimaryUser: 0,
userInfo: {},
topolodyData: [],
basicData: [],
IOData: [],
pageOptions: {},
}
},
methods: {
trigger(e) {
console.log(e)
if (e.text === '分享') {
uni.navigateTo({ url: '/pages/device/share?id=' + this.devId })
} else if (e.text === '删除') {
uni.showModal({
title: '提示',
content: '确定删除该设备吗？',
success: (res) => {
if (res.confirm) {
console.log('用户点击确定')
deleteDevice(this.devId).then((res) => {
uni.showToast({
title: '删除成功',
icon: 'none',
})
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
} else if (e.text === '下载') {
this.$util.toast('下载成功')
} else if (e.text === '记录') {
uni.navigateTo({ url: '/pages/device/APF/record' })
} else if (e.text === '告警') {
uni.navigateTo({ url: '/pages/device/APF/report?id=' + this.devId })
} else if (e.text === '关于') {
uni.navigateTo({ url: '/pages/device/APF/about?id=' + this.devId })
} else if (e.text === '移交') {
uni.navigateTo({ url: '/pages/device/transfer?id=' + this.devId })
} else if (e.text === '反馈') {
uni.navigateTo({ url: '/pages/device/feedback' })
} else if (e.text === '用户') {
uni.navigateTo({ url: '/pages/device/user?id=' + this.devId + '&isPrimaryUser=' + this.isPrimaryUser })
} else if (e.text === '报表') {
this.$util.toast('效果是直接打开报表')
} else if (e.text === '版本') {
this.$util.toast('功能暂未开放')
} else if (e.text === '模版') {
this.$util.toast('效果是功能暂未开放直接打开报表')
} else if (e.text === '编辑') {
let data = JSON.parse(JSON.stringify(this.deviceInfo))
data.appsLineTopologyDiagramPO.forEach((item) => {
delete item.value
})
uni.navigateTo({
url: '/pages/device/edit?deviceInfo=' + encodeURIComponent(JSON.stringify(data)),
})
} else if (e.text === '取消调试') {
this.cancelDebug()
} else if (e.text === '完成调试') {
this.finishDebug()
} else if (e.text === '接入') {
manualAccess({ nDid: this.pageOptions.ndid }).then((res) => {
this.$util.toast(res.message)
})
}
// this.$refs.fab.close()
},
clickItem(item) {
console.log(item)
},
// 取消调试
cancelDebug() {
this.dialogType = '取消调试'
this.$refs.inputDialog.open()
},
// 完成调试
finishDebug() {
this.dialogType = '完成调试'
this.$refs.inputDialog.open()
},
dialogInputClose() {
this.$refs.inputDialog.close()
},
dialogInputConfirm(val) {
if (this.dialogType == '取消调试') {
cancelDebug({
deviceId: this.devId,
remark: this.remarkContent,
type: Number(this.pageOptions.process),
}).then((res) => {
this.$util.toast(res.message)
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
} else {
finishDebug({
deviceId: this.devId,
remark: this.remarkContent,
type: Number(this.pageOptions.process),
}).then((res) => {
console.log(res)
this.$util.toast(res.message)
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
}
},
async navMenuClick(idx) {
// console.log("🚀 ~ navMenuClick ~ idx:", idx)
if (idx != 3) {
await this.client.end()
await setTimeout(() => {
this.initMqtt(this.navMenuList[idx].id)
}, 500)
}
setTimeout(() => {
this.navMenuActive = idx
uni.pageScrollTo({ scrollTop: 0, duration: 0 })
}, 500)
},
downloadImg() {
uni.downloadFile({
url: this.deviceInfo.filePath,
success: (res) => {
pathToBase64(res.tempFilePath).then((res) => {
this.topoImg = res
})
},
})
},
init() {
console.log('init')
this.loading = true
this.domLoading = true
queryTopologyDiagram(this.devId).then((res) => {
res.data.filePath = this.$config.static + res.data.filePath
this.deviceInfo = res.data
this.downloadImg()
uni.setNavigationBarTitle({ title: this.deviceInfo.devName || '设备详情' })
this.topolodyData = this.topolodyData.filter((item) => {
let index = this.deviceInfo.appsLineTopologyDiagramPO.findIndex((element) => {
element.label = element.name
item.label = element.name
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
}
})
console.log(this.topolodyData)
if (this.client) {
this.loading = false
} else {
this.initMqtt(this.navMenuList[0].id)
}
})
},
renderFinish(e) {
this.img = e
},
previewImg() {
if (!this.img) {
uni.showLoading({
title: '图片生成中',
mask: false,
})
setTimeout(() => {
this.previewImg()
}, 500)
} else {
uni.hideLoading()
base64ToPath(this.img).then((res) => {
console.log(res)
uni.previewImage({
urls: [res],
})
})
}
},
initMqtt(id) {
MQTT_OPTIONS.clientId = uni.getStorageSync('devCode')
// #ifdef APP-PLUS
this.client = mqtt.connect('wx://' + MQTT_IP, MQTT_OPTIONS)
// #endif
// #ifdef H5
},
],
content: [
{
iconPath: '/static/report.png',
text: '告警',
},
// {
// iconPath: '/static/record.png',
// text: '记录',
// },
{
iconPath: '/static/about.png',
text: '关于',
},
{
iconPath: '/static/access.png',
text: '接入',
},
this.client = mqtt.connect('ws://' + MQTT_IP, MQTT_OPTIONS)
// #endif
this.client
.on('connect', () => {
console.log('连接成功')
this.client.subscribe(`/zl/TemperData/${this.devId}`, (err) => {
if (!err) {
console.log(`订阅成功:/zl/TemperData/${this.devId}`)
}
})
],
client: null,
timer: null,
devId: '',
dictData: [],
isPrimaryUser: 0,
userInfo: {},
topolodyData: [],
basicData: [],
IOData: [],
pageOptions: {},
this.client.subscribe(`/zl/devData/${this.devId}/${id}`, (err) => {
if (!err) {
console.log(`订阅成功:/zl/devData/${this.devId}/${id}`)
}
},
methods: {
trigger(e) {
console.log(e)
if (e.text === '分享') {
uni.navigateTo({ url: '/pages/device/share?id=' + this.devId })
} else if (e.text === '删除') {
uni.showModal({
title: '提示',
content: '确定删除该设备吗？',
success: (res) => {
if (res.confirm) {
console.log('用户点击确定')
deleteDevice(this.devId).then((res) => {
uni.showToast({
title: '删除成功',
icon: 'none',
})
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
} else if (e.text === '下载') {
this.$util.toast('下载成功')
} else if (e.text === '记录') {
uni.navigateTo({ url: '/pages/device/APF/record' })
} else if (e.text === '告警') {
uni.navigateTo({ url: '/pages/device/APF/report?id=' + this.devId })
} else if (e.text === '关于') {
uni.navigateTo({ url: '/pages/device/APF/about?id=' + this.devId })
} else if (e.text === '移交') {
uni.navigateTo({ url: '/pages/device/transfer?id=' + this.devId })
} else if (e.text === '反馈') {
uni.navigateTo({ url: '/pages/device/feedback' })
} else if (e.text === '用户') {
uni.navigateTo({ url: '/pages/device/user?id=' + this.devId + '&isPrimaryUser=' + this.isPrimaryUser })
} else if (e.text === '报表') {
this.$util.toast('效果是直接打开报表')
} else if (e.text === '版本') {
this.$util.toast('功能暂未开放')
} else if (e.text === '模版') {
this.$util.toast('效果是功能暂未开放直接打开报表')
} else if (e.text === '编辑') {
let data = JSON.parse(JSON.stringify(this.deviceInfo))
data.appsLineTopologyDiagramPO.forEach((item) => {
delete item.value
})
uni.navigateTo({
url: '/pages/device/edit?deviceInfo=' + encodeURIComponent(JSON.stringify(data)),
})
} else if (e.text === '取消调试') {
this.cancelDebug()
} else if (e.text === '完成调试') {
this.finishDebug()
} else if (e.text === '接入') {
manualAccess({ nDid: this.pageOptions.ndid }).then((res) => {
this.$util.toast(res.message)
})
}
// this.$refs.fab.close()
},
clickItem(item) {
console.log(item);
},
// 取消调试
cancelDebug() {
this.dialogType = '取消调试'
this.$refs.inputDialog.open()
},
// 完成调试
finishDebug() {
this.dialogType = '完成调试'
this.$refs.inputDialog.open()
},
dialogInputClose() {
this.$refs.inputDialog.close()
},
dialogInputConfirm(val) {
if (this.dialogType == '取消调试') {
cancelDebug({
deviceId: this.devId,
remark: this.remarkContent,
type: Number(this.pageOptions.process),
}).then((res) => {
this.$util.toast(res.message)
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
} else {
finishDebug({
deviceId: this.devId,
remark: this.remarkContent,
type: Number(this.pageOptions.process),
}).then((res) => {
console.log(res)
this.$util.toast(res.message)
setTimeout(() => {
uni.navigateBack()
}, 1500)
})
}
},
async navMenuClick(idx) {
// console.log("🚀 ~ navMenuClick ~ idx:", idx)
if (idx != 3) {
await this.client.end()
await setTimeout(() => {
this.initMqtt(this.navMenuList[idx].id)
// 默认推送
this.client.publish(`/zl/askDevData/${this.devId}/${id}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
if (this.timer) {
clearInterval(this.timer)
this.timer = null
}
this.timer = setInterval(() => {
console.log('askDevData')
this.client.publish(`/zl/askDevData/${this.devId}/${id}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
}, 1000 * 60)
}
})
})
.on('reconnect', function (error) {
console.log(error)
// console.log('正在重连...', that.topic)
})
.on('error', function (error) {
console.log('连接失败...', error)
})
.on('end', function () {
console.log('连接断开')
})
.on('message', (topic, message) => {
console.log('接收推送信息：', JSON.parse(message.toString()), topic)
console.log('🚀 ~ .on ~ topic:', topic)
},500)
if (topic === `/zl/devData/${this.devId}/${id}`) {
if ((!message.toString() || message.toString().length < 10) && this.loading) {
this.$util.toast('该设备暂无数据')
}
this.loading = false
this.handlerData(JSON.parse(message.toString()))
} else if (topic === `/zl/TemperData/${this.devId}`) {
// this.basicData.forEach((item) => {
// if (item.statisticalName === '温度' && item.phase === 'avg') {
// item.statisticalData = message.toString()
// }
// })
this.IOData = JSON.parse(message.toString())
// this.IOData = this.IOData.filter((item) => item.value !== 0)
this.IOData.forEach((item) => {
if (!item.value) {
item.value = ''
} else {
if (!Number.isInteger(item.value)) {
item.value = item.value.toFixed(2)
}
}
})
}
})
},
}
setTimeout(() => {
this.navMenuActive = idx
uni.pageScrollTo({ scrollTop: 0, duration: 0 })
}, 500)
},
downloadImg() {
uni.downloadFile({
url: this.deviceInfo.filePath,
success: (res) => {
pathToBase64(res.tempFilePath).then((res) => {
this.topoImg = res
})
},
})
},
init() {
console.log('init')
this.loading = true
this.domLoading = true
queryTopologyDiagram(this.devId).then((res) => {
res.data.filePath = this.$config.static + res.data.filePath
this.deviceInfo = res.data
this.downloadImg()
uni.setNavigationBarTitle({ title: this.deviceInfo.devName || '设备详情' })
this.topolodyData = this.topolodyData.filter((item) => {
let index = this.deviceInfo.appsLineTopologyDiagramPO.findIndex((element) => {
element.label = element.name
item.label = element.name
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
}
})
console.log(this.topolodyData)
if (this.client) {
this.loading = false
} else {
this.initMqtt(this.navMenuList[0].id)
}
})
},
renderFinish(e) {
this.img = e
},
previewImg() {
if (!this.img) {
uni.showLoading({
title: '图片生成中',
mask: false,
})
setTimeout(() => {
this.previewImg()
}, 500)
} else {
uni.hideLoading()
base64ToPath(this.img).then((res) => {
console.log(res)
uni.previewImage({
urls: [res],
})
})
}
},
initMqtt(id) {
MQTT_OPTIONS.clientId = uni.getStorageSync('devCode')
// #ifdef APP-PLUS
this.client = mqtt.connect('wx://' + MQTT_IP, MQTT_OPTIONS)
// #endif
// #ifdef H5
handlerData(data) {
this.basicData = data
this.topolodyData.forEach((element) => {
let arr = []
this.client = mqtt.connect('ws://' + MQTT_IP, MQTT_OPTIONS)
// #endif
this.client
.on('connect', () => {
console.log('连接成功')
this.client.subscribe(`/zl/TemperData/${this.devId}`, (err) => {
if (!err) {
console.log(`订阅成功:/zl/TemperData/${this.devId}`)
}
})
element.showKey.forEach((key) => {
data.forEach((item) => {
if (item.statisticalName === key && item.phase === 'avg') {
if (key === 'Apf_RmsI_TolOut(A)') {
arr.push({
label: '总输出电流:',
value: Math.round(item.statisticalData) + 'A',
})
} else {
arr.push({
label: '电流畸变率:',
value: Math.round(item.statisticalData) + '%',
})
// arr.push('电流畸变率:' + item.statisticalData + '%')
}
}
if (item.time) {
this.dataTime = item.time.seconds
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
// console.log(11111111,this.dataTime);
}
})
})
element.value = arr
})
console.log(this.topolodyData)
this.$forceUpdate()
},
},
// 页面销毁
onUnload() {
clearInterval(this.timer)
this.client.end()
},
// 下拉刷新
onPullDownRefresh() {
this.client.publish(`/zl/askDevData/${this.devId}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
setTimeout(() => {
uni.stopPullDownRefresh()
}, 1000)
},
this.client.subscribe(`/zl/devData/${this.devId}/${id}`, (err) => {
if (!err) {
console.log(`订阅成功:/zl/devData/${this.devId}/${id}`)
// 默认推送
this.client.publish(`/zl/askDevData/${this.devId}/${id}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
if (this.timer) {
clearInterval(this.timer)
this.timer = null
}
this.timer = setInterval(() => {
console.log('askDevData')
this.client.publish(`/zl/askDevData/${this.devId}/${id}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
}, 1000 * 60)
}
})
})
.on('reconnect', function (error) {
console.log(error)
// console.log('正在重连...', that.topic)
})
.on('error', function (error) {
console.log('连接失败...', error)
})
.on('end', function () {
console.log('连接断开')
})
.on('message', (topic, message) => {
console.log('接收推送信息：', JSON.parse(message.toString()), topic)
console.log("🚀 ~ .on ~ topic:", topic)
if (topic === `/zl/devData/${this.devId}/${id}`) {
if ((!message.toString() || message.toString().length < 10) && this.loading) {
this.$util.toast('该设备暂无数据')
}
this.loading = false
this.handlerData(JSON.parse(message.toString()))
} else if (topic === `/zl/TemperData/${this.devId}`) {
// this.basicData.forEach((item) => {
// if (item.statisticalName === '温度' && item.phase === 'avg') {
// item.statisticalData = message.toString()
// }
// })
this.IOData = JSON.parse(message.toString())
// this.IOData = this.IOData.filter((item) => item.value !== 0)
this.IOData.forEach((item) => {
if (!item.value) {
item.value = ''
} else {
if (!Number.isInteger(item.value)) {
item.value = item.value.toFixed(2)
}
}
})
}
})
},
handlerData(data) {
this.basicData = data
this.topolodyData.forEach((element) => {
let arr = []
element.showKey.forEach((key) => {
data.forEach((item) => {
if (item.statisticalName === key && item.phase === 'avg') {
if (key === 'Apf_RmsI_TolOut(A)') {
arr.push({
label: '总输出电流:',
value: Math.round(item.statisticalData) + 'A',
})
} else {
arr.push({
label: '电流畸变率:',
value: Math.round(item.statisticalData) + '%',
})
// arr.push('电流畸变率:' + item.statisticalData + '%')
}
}
if (item.time) {
this.dataTime = item.time.seconds
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
// console.log(11111111,this.dataTime);
}
})
})
element.value = arr
})
console.log(this.topolodyData)
this.$forceUpdate()
},
},
// 页面销毁
onUnload() {
clearInterval(this.timer)
this.client.end()
},
// 下拉刷新
onPullDownRefresh() {
this.client.publish(`/zl/askDevData/${this.devId}`)
this.client.publish(`/zl/askTemperData/${this.devId}`)
setTimeout(() => {
uni.stopPullDownRefresh()
}, 1000)
},
onLoad(options) {
this.pageOptions = options
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.devId = options.id
this.isPrimaryUser = options.isPrimaryUser
if (this.pageOptions.process == 2 || this.pageOptions.process == 3) {
this.content.splice(
0,
0,
{
iconPath: '/static/feedback.png',
text: '编辑',
},
{
iconPath: '/static/cancel.png',
text: '取消调试',
},
{
iconPath: '/static/confirm.png',
text: '完成调试',
},
)
} else {
if (this.isPrimaryUser == 1) {
this.content.splice(
0,
0,
{
iconPath: '/static/transfer.png',
text: '移交',
},
{
iconPath: '/static/feedback.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
if (this.userInfo.authorities === 'app_vip_user') {
this.content.splice(3, 0, {
iconPath: '/static/share.png',
text: '分享',
})
}
}
if (this.userInfo.authorities !== 'tourist') {
this.content.splice(0, 0, {
iconPath: '/static/subordinate.png',
text: '用户',
})
}
}
this.$util.getDictData('Line_Position').then((res) => {
this.topolodyData = res.map((item) => {
switch (item.name) {
case '电网侧':
item.showKey = ['Apf_ThdA_Sys(%)']
break
case '负载侧':
item.showKey = ['Apf_ThdA_Load(%)']
break
case '输出侧':
item.showKey = ['Apf_RmsI_TolOut(A)']
break
case 'PCC公共点':
item.showKey = []
break
default:
break
}
return {
label: item.name,
linePostion: item.id,
lat: '',
lng: '',
showKey: item.showKey, //要展示的指标key
value: [],
}
})
})
this.init()
},
onLoad(options) {
this.pageOptions = options
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.devId = options.id
this.isPrimaryUser = options.isPrimaryUser
if (this.pageOptions.process == 2 || this.pageOptions.process == 3) {
this.content.splice(
0,
0,
{
iconPath: '/static/feedback.png',
text: '编辑',
},
{
iconPath: '/static/cancel.png',
text: '取消调试',
},
{
iconPath: '/static/confirm.png',
text: '完成调试',
},
)
} else {
if (this.isPrimaryUser == 1) {
this.content.splice(
0,
0,
{
iconPath: '/static/transfer.png',
text: '移交',
},
{
iconPath: '/static/feedback.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
if (this.userInfo.authorities === 'app_vip_user') {
this.content.splice(3, 0, {
iconPath: '/static/share.png',
text: '分享',
})
}
}
if (this.userInfo.authorities !== 'tourist') {
this.content.splice(0, 0, {
iconPath: '/static/subordinate.png',
text: '用户',
})
}
}
this.$util.getDictData('Line_Position').then((res) => {
this.topolodyData = res.map((item) => {
switch (item.name) {
case '电网侧':
item.showKey = ['Apf_ThdA_Sys(%)']
break
case '负载侧':
item.showKey = ['Apf_ThdA_Load(%)']
break
case '输出侧':
item.showKey = ['Apf_RmsI_TolOut(A)']
break
case 'PCC公共点':
item.showKey = []
break
default:
break
}
return {
label: item.name,
linePostion: item.id,
lat: '',
lng: '',
showKey: item.showKey, //要展示的指标key
value: [],
}
})
})
this.init()
},
}
</script>