11 Commits

Author SHA1 Message Date
guanj
7bcc68a9df 绘制电脑治理信息页面 2026-05-27 10:10:19 +08:00
dk
17e47c1f07 fix(APP功能调整): 文档中的第7、8、10没有做;第4点需要再核查下ITIC、F47曲线中的可容忍事件、不可容忍事件的显示是否正确。 2026-05-15 11:16:00 +08:00
guanj
eb72146e0d 提交代码 2026-04-25 15:22:50 +08:00
guanj
ce78b65875 提交代码 2026-04-24 09:13:17 +08:00
guanj
747d3139cf 调整app页面图标样式 2026-04-17 08:50:07 +08:00
guanj
bac0f83f64 提交app 2026-04-13 10:12:04 +08:00
guanj
db097bc64a 调整消息推送 2026-04-03 14:48:45 +08:00
guanj
9f593bd428 1 2026-04-01 10:00:55 +08:00
guanj
966d6d342c 提交app代码 2026-04-01 10:00:04 +08:00
guanj
66cee2922d 联调app 2026-03-30 08:43:13 +08:00
guanj
00e34c168f 提交app 2026-03-17 14:00:55 +08:00
146 changed files with 26798 additions and 10780 deletions

View File

@@ -0,0 +1,7 @@
---
name: New prompt
description: New prompt
invokable: true
---
Please write a thorough suite of unit tests for this code, making sure to cover all relevant edge cases

View File

@@ -0,0 +1,5 @@
---
description: A description of your rule
---
请用中文回答!

27
App.vue
View File

@@ -1,9 +1,11 @@
<script>
import { queryDictDataCache } from './common/api/dictionary.js'
import { getImageUrl } from '@/common/api/basic'
import { checkAppUpdate } from './common/js/update.js'
export default {
onLaunch: function () {
checkAppUpdate()
// uni.onPushMessage((res) => {
// console.log("收到推送消息:",res) //监听推送消息
// })
@@ -22,21 +24,38 @@ export default {
uni.onPushMessage((res) => {
console.log('收到推送消息:', res.data.payload.path) //监听推送消息
if (res.data.payload && res.data.payload.path) {
uni.navigateTo({
uni.setStorageSync('messageParams', {
engineeringName: '',
engineeringId: '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: res.data.payload.path.split('type=')[1],
})
uni.switchTab({
url: res.data.payload.path,
})
// uni.navigateTo({
// url: res.data.payload.path,
// })
}
})
},
onHide: function () {
console.log('App Hide')
},
methods: {},
}
</script>
<style lang="scss">
/*每个页面公共css */
@import './common/css/base.scss';
@import '@/static/iconfont/iconfont.css';
/deep/ uni-tabbar .uni-tabbar__badge {
width: auto;
@@ -47,4 +66,10 @@ export default {
font-size: 20rpx;
padding: 0 8rpx;
}
// .uni-page-refresh__path {
// stroke: #007aff !important; /* 改成你想要的颜色,比如红色 #ff0000 */
// }
// .uni-page-refresh__icon {
// fill: #007aff !important; /* 改成你想要的颜色,比如红色 #ff0000 */
// }
</style>

10
changelog.md Normal file
View File

@@ -0,0 +1,10 @@
# 更新日志
## 1.0.0 (2025-10-15)
- 初始版本发布
- 实现字母索引列表功能
- 支持按拼音首字母分组展示数据
- 集成右侧快速字母导航功能
- 添加滚动监听和高亮显示当前字母
- 支持签到状态显示和补签操作
- 优化空数据状态展示

View File

@@ -1,197 +1,242 @@
import request from '../js/request'
import config from '../js/config'
// 获取设备
export function getDeviceList(params) {
return request({
url: '/cs-device-boot/EquipmentDelivery/queryEquipmentByProject',
method: 'post',
data: params,
})
}
/**
* 设备统计
* @param {*} id 工程id
* @returns
*/
export function getDevCount(id) {
return request({
url: '/cs-device-boot/deviceUser/devCount',
method: 'post',
data: { id },
})
}
// 获取直连设备模板信息
export function getModel(nDid) {
return request({
url: '/access-boot/device/model',
method: 'post',
data: {
nDid,
},
})
}
// 直连设备接入
export function addDevice(params) {
return request({
url: '/access-boot/device/access',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
// 直连设备注册
export function registerDevice(nDid, type) {
return request({
url: '/access-boot/device/register',
method: 'post',
data: {
nDid,
type,
},
})
}
// 查询拓扑图模板
export const getTopoTemplate = () => {
return request({
url: '/cs-device-boot/topologyTemplate/queryImage',
method: 'POST',
})
}
// 查询拓扑图模板监测点
export const queryByTopoId = (id) => {
return request({
url: '/cs-device-boot/lineTemplate/queryByTopoId',
method: 'POST',
data: {
topoId: id,
},
})
}
// 查询设备拓扑图
export const queryTopologyDiagram = (devId) => {
return request({
url: '/cs-device-boot/lineTopologyDiagram/queryTopologyDiagram',
method: 'POST',
data: {
devId,
},
})
}
// 设备扫码移交
export const transferDevice = (id, userId) => {
return request({
url: '/cs-device-boot/deviceUser/transfer',
method: 'POST',
data: {
ids: id,
userId: userId || uni.getStorageSync('userInfo').userIndex,
},
})
}
// 设备扫码分享
export const shareDevice = (id, userId) => {
return request({
url: '/cs-device-boot/deviceUser/share',
method: 'POST',
data: {
ids: id,
},
})
}
// 设备删除
export const deleteDevice = (id) => {
return request({
url: '/cs-device-boot/deviceUser/delete',
method: 'POST',
data: {
eid: id,
},
})
}
// 设备查询通过id获取
export const queryDeivceById = (id) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/queryEquipmentById',
method: 'POST',
data: {
ids: id,
},
})
}
// 字典树接口通过id
export const queryByid = (id) => {
return request({
url: '/system-boot/dictTree/queryByid',
method: 'post',
data: {
id,
},
})
}
//设备修改监测点信息
export const updateDevice = (params) => {
return request({
url: '/cs-device-boot/lineTopologyDiagram/auditList',
method: 'POST',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
// 设备用户列表
export const queryDeviceUser = (devId) => {
return request({
url: '/cs-device-boot/deviceUser/queryUserById',
method: 'POST',
data: {
devId,
},
})
}
// 取消分享
export const cancelShare = (params) => {
return request({
url: '/cs-device-boot/deviceUser/cancelShare',
method: 'POST',
data: params,
})
}
// 取消调试
export const cancelDebug = (params) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/deleteTest',
method: 'POST',
data: params,
})
}
// 完成调试
export const finishDebug = (params) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/testcompletion',
method: 'POST',
data: params,
})
}
import request from '../js/request'
// 获取设备
export function getDeviceList(params) {
return request({
url: '/cs-device-boot/EquipmentDelivery/queryEquipmentByProject',
method: 'post',
data: params,
})
}
/**
* 设备统计
* @param {*} id 工程id
* @returns
*/
const date = new Date()
const year = date.getFullYear() // 年份 4 位
const month = (date.getMonth() + 1).toString().padStart(2, '0') // 月份自动补 0
const currentYearMonth = `${year}-${month}`
export function getDevCount(id) {
return request({
url: '/cs-device-boot/deviceUser/devCount',
method: 'post',
data: { id: id, time: currentYearMonth },
})
}
// 获取直连设备模板信息
export function getModel(nDid) {
return request({
url: '/access-boot/device/model',
method: 'post',
data: {
nDid,
},
})
}
// 直连设备接入
export function addDevice(params) {
return request({
url: '/access-boot/device/access',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
// 直连设备注册
export function registerDevice(nDid, type) {
return request({
url: '/access-boot/device/register',
method: 'post',
data: {
nDid,
type,
},
})
}
// 查询拓扑图模板
export const getTopoTemplate = () => {
return request({
url: '/cs-device-boot/topologyTemplate/queryImage',
method: 'POST',
})
}
// 查询拓扑图模板监测点
export const queryByTopoId = (id) => {
return request({
url: '/cs-device-boot/lineTemplate/queryByTopoId',
method: 'POST',
data: {
topoId: id,
},
})
}
// 查询设备拓扑图
export const queryTopologyDiagram = (devId) => {
return request({
url: '/cs-device-boot/lineTopologyDiagram/queryTopologyDiagram',
method: 'POST',
data: {
devId,
},
})
}
// 设备扫码移交
export const transferDevice = (id, userId) => {
return request({
url: '/cs-device-boot/deviceUser/transfer',
method: 'POST',
data: {
ids: id,
userId: userId || uni.getStorageSync('userInfo').userIndex,
},
})
}
// 设备扫码分享
export const shareDevice = (id, userId) => {
return request({
url: '/cs-device-boot/deviceUser/share',
method: 'POST',
data: {
ids: id,
},
})
}
// 设备删除
export const deleteDevice = (id) => {
return request({
url: '/cs-device-boot/deviceUser/delete',
method: 'POST',
data: {
eid: id,
},
})
}
// 设备查询通过id获取
export const queryDeivceById = (id) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/queryEquipmentById',
method: 'POST',
data: {
ids: id,
},
})
}
// 字典树接口通过id
export const queryByid = (id) => {
return request({
url: '/system-boot/dictTree/queryByid',
method: 'post',
data: {
id,
},
})
}
//设备修改监测点信息
export const updateDevice = (params) => {
return request({
url: '/cs-device-boot/lineTopologyDiagram/auditList',
method: 'POST',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
// 设备用户列表
export const queryDeviceUser = (devId) => {
return request({
url: '/cs-device-boot/deviceUser/queryUserById',
method: 'POST',
data: {
devId,
},
})
}
// 取消分享
export const cancelShare = (params) => {
return request({
url: '/cs-device-boot/deviceUser/cancelShare',
method: 'POST',
data: params,
})
}
// 取消调试
export const cancelDebug = (params) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/deleteTest',
method: 'POST',
data: params,
})
}
// 完成调试
export const finishDebug = (params) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/testcompletion',
method: 'POST',
data: params,
})
}
// 置顶设备、工程
export const engineeringPinToTop = (params) => {
return request({
url: '/cs-device-boot/csUserPins/engineeringPinToTop',
method: 'POST',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 查询工程树
export const lineTree = (params) => {
return request({
url: '/cs-device-boot/csLedger/AppLineTree',
method: 'POST',
// data: {
// type: 'engineering',
// },
// header: {
// 'Content-Type': 'application/json',
// },
})
}
// 查询工程
export const queryEngineeringPage = (params) => {
return request({
url: '/cs-device-boot/engineering/queryEngineeringPage',
method: 'POST',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 通过ndid查询出厂设备
export const queryEquipmentByndid = (params) => {
return request({
url: '/cs-device-boot/EquipmentDelivery/queryEquipmentByndid',
method: 'POST',
data: params,
})
}

View File

@@ -1,71 +1,79 @@
import request from '../js/request'
import config from '../js/config'
export function queryDictData(dictTypeName) {
return request({
url: '/dictData/getDicDataByTypeName',
method: 'get',
data: {
dictTypeName,
},
})
}
export function queryDictDataCache(dictTypeName) {
return request({
url: '/system-boot/dictType/dictDataCache',
method: 'get',
})
}
// 字典树接口通过code
export const queryByCode = (code) => {
return request({
url: '/system-boot/dictTree/queryByCode',
method: 'post',
data: {
code,
},
})
}
// 字典树接口
export const queryCsDictTree = (pid) => {
return request({
url: '/system-boot/dictTree/query',
method: 'post',
data: {
pid,
},
})
}
// 字典树接口通过id
export const queryByid = (id) => {
return request({
url: '/system-boot/dictTree/queryByid',
method: 'post',
data: {
id,
},
})
}
// 程序版本
export const queryEdDataPage = () => {
return request({
url: '/cs-device-boot/edData/queryEdDataPage',
method: 'post',
header: {
'Content-Type': 'application/json;charset=UTF-8',
},
data: {
pageNum: 1,
devName: '',
devType: '',
pageSize: 999,
versionStartDate: '',
versionendDate: '',
},
})
}
import request from '../js/request'
import config from '../js/config'
export function queryDictData(dictTypeName) {
return request({
url: '/dictData/getDicDataByTypeName',
method: 'get',
data: {
dictTypeName,
},
})
}
export function queryDictDataCache(dictTypeName) {
return request({
url: '/system-boot/dictType/dictDataCache',
method: 'get',
})
}
// 字典树接口通过code
export const queryByCode = (code) => {
return request({
url: '/system-boot/dictTree/queryByCode',
method: 'post',
data: {
code,
},
})
}
// 字典树接口
export const queryCsDictTree = (pid) => {
return request({
url: '/system-boot/dictTree/query',
method: 'post',
data: {
pid,
},
})
}
// 字典树接口
export const queryStatistical = (data) => {
return request({
url: '/system-boot/csstatisticalset/queryStatistical',
method: 'post',
data: data,
})
}
// 字典树接口通过id
export const queryByid = (id) => {
return request({
url: '/system-boot/dictTree/queryByid',
method: 'post',
data: {
id,
},
})
}
// 程序版本
export const queryEdDataPage = () => {
return request({
url: '/cs-device-boot/edData/queryEdDataPage',
method: 'post',
header: {
'Content-Type': 'application/json;charset=UTF-8',
},
data: {
pageNum: 1,
devName: '',
devType: '',
pageSize: 999,
versionStartDate: '',
versionendDate: '',
},
})
}

View File

@@ -1,10 +1,49 @@
import request from '../js/request'
// apf-》获取模块状态
export function getModuleState(params) {
return request({
url: '/cs-harmonic-boot/data/getModuleState',
method: 'post',
data: params,
})
import request from '../js/request'
// apf-》获取模块状态
export function getModuleState(params) {
return request({
url: '/cs-harmonic-boot/data/getModuleState',
method: 'post',
data: params,
})
}
export function getBaseRealData(id) {
return request({
url: '/cs-harmonic-boot/realData/getBaseRealData?lineId='+id,
method: 'post',
})
}
// 查询App暂态事件总数
export function queryAppEventCounts(params) {
return request({
url: '/cs-harmonic-boot/eventUser/queryAppEventCounts',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 查询App稳态事件总数
export function queryAppHarmonicCounts(params) {
return request({
url: '/cs-harmonic-boot/csHarmonic/queryAppHarmonicCounts',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 查询App稳态越限监测点
export function queryAppHarmonicLine(params) {
return request({
url: '/cs-harmonic-boot/csHarmonic/queryAppHarmonicLine',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}

View File

@@ -1,17 +1,45 @@
import request from '../js/request';
import config from '../js/config';
/**
* 已读暂态
* @returns {*}
*/
export function updateStatus(params) {
return request({
url: '/cs-harmonic-boot/eventUser/updateStatus',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
import request from '../js/request';
import config from '../js/config';
/**
* 已读暂态
* @returns {*}
*/
export function updateStatus(params) {
return request({
url: '/cs-harmonic-boot/eventUser/updateStatus',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
/**
* 稳态详情
* @returns {*}
*/
export function queryHarmonicDetail(params) {
return request({
url: '/cs-harmonic-boot/csHarmonic/queryHarmonicDetail',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}
/**
* 运行告警事件详
* @returns {*}
*/
export function queryAlarmDetail(params) {
return request({
url: '/cs-harmonic-boot/csAlarm/queryAlarmDetail',
method: 'post',
header: {
'Content-Type': 'application/json',
},
data: params,
})
}

View File

@@ -1,128 +1,128 @@
import request from '../js/request'
import config from '../js/config'
export function addAppProject(params, files) {
if (files.length === 0) {
return request({
url: '/cs-device-boot/project/addAppProject',
method: 'post',
data: params,
})
} else {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/project/addAppProject', //仅为示例,非真实的接口地址
files: files,
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: params,
})
}
}
// 修改项目
export function updateAppProject(params, files) {
if (files.length === 0) {
return request({
url: '/cs-device-boot/project/auditAppProject',
method: 'post',
data: params,
})
} else {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/project/auditAppProject', //仅为示例,非真实的接口地址
files: files,
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: params,
})
}
}
export function getProjectList(params) {
return request({
url: '/cs-device-boot/project/queryProject',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 删除项目
export function deleteProject(id) {
return request({
url: '/cs-device-boot/project/auditAppProject',
method: 'post',
data: {
id,
status: 0,
},
})
}
// 查询拓扑图
export function queryTopologyDiagramPage(params) {
return request({
url: '/cs-device-boot/topologyDiagram/queryTopologyDiagramPage',
method: 'post',
data: Object.assign(
{
pageNum: 1,
pageSize: 999,
projectId: '',
searchValue: '',
},
params,
),
header: {
'Content-Type': 'application/json',
},
})
}
// 删除拓扑图
export function deleteAppTopologyDiagram(id) {
return request({
url: '/cs-device-boot/topologyDiagram/AuditAppTopologyDiagram',
method: 'post',
data: {
id,
status: 0,
},
})
}
// 删除拓扑图
export function checkCanDelete(id) {
return request({
url: '/cs-device-boot/topologyDiagram/checkCanDelete',
method: 'post',
data: {
id,
},
})
}
// 新增拓扑图
export function addAppTopologyDiagram(params, filePath) {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/topologyDiagram/addAppTopologyDiagram', //仅为示例,非真实的接口地址
filePath,
name: 'file',
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: Object.assign(
{
topologyDiagramName: '',
projectId: '',
},
params,
),
})
}
import request from '../js/request'
import config from '../js/config'
export function addAppProject(params, files) {
if (files.length === 0) {
return request({
url: '/cs-device-boot/project/addAppProject',
method: 'post',
data: params,
})
} else {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/project/addAppProject', //仅为示例,非真实的接口地址
files: files,
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: params,
})
}
}
// 修改项目
export function updateAppProject(params, files) {
if (files.length === 0) {
return request({
url: '/cs-device-boot/project/auditAppProject',
method: 'post',
data: params,
})
} else {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/project/auditAppProject', //仅为示例,非真实的接口地址
files: files,
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: params,
})
}
}
export function getProjectList(params) {
return request({
url: '/cs-device-boot/project/queryProject',
method: 'post',
data: params,
header: {
'Content-Type': 'application/json',
},
})
}
// 删除项目
export function deleteProject(id) {
return request({
url: '/cs-device-boot/project/auditAppProject',
method: 'post',
data: {
id,
status: 0,
},
})
}
// 查询拓扑图
export function queryTopologyDiagramPage(params) {
return request({
url: '/cs-device-boot/topologyDiagram/queryTopologyDiagramPage',
method: 'post',
data: Object.assign(
{
pageNum: 1,
pageSize: 999,
projectId: '',
searchValue: '',
},
params,
),
header: {
'Content-Type': 'application/json',
},
})
}
// 删除拓扑图
export function deleteAppTopologyDiagram(id) {
return request({
url: '/cs-device-boot/topologyDiagram/AuditAppTopologyDiagram',
method: 'post',
data: {
id,
status: 0,
},
})
}
// 删除拓扑图
export function checkCanDelete(id) {
return request({
url: '/cs-device-boot/topologyDiagram/checkCanDelete',
method: 'post',
data: {
id,
},
})
}
// 新增拓扑图
export function addAppTopologyDiagram(params, filePath) {
return uni.uploadFile({
url: config.domain + '/cs-device-boot/topologyDiagram/addAppTopologyDiagram', //仅为示例,非真实的接口地址
filePath,
name: 'file',
header: {
Authorization: uni.getStorageSync('access_token'),
},
formData: Object.assign(
{
topologyDiagramName: '',
projectId: '',
},
params,
),
})
}

40
common/api/report.js Normal file
View File

@@ -0,0 +1,40 @@
import request from '../js/request'
// 下载稳态报告
export function downloadHarmonicReport(data) {
return request({
url: '/cs-report-boot/csAppReport/downloadHarmonicReport',
method: 'post',
data,
header: {
'Content-Type': 'application/json',
},
})
}
// 申请暂态报告
export function applicationReport(data) {
return request({
url: '/cs-report-boot/csAppReport/applicationReport',
method: 'post',
data,
header: {
'Content-Type': 'application/json',
},
})
}
// 生成暂态报告
export function createEventReport(params) {
return request({
url: '/cs-report-boot/csAppReport/createEventReport',
method: 'post',
params,
})
}
// 下载暂态报告
export function downloadEventReport(params) {
return request({
url: '/cs-report-boot/csAppReport/downloadEventReport',
method: 'post',
params,
})
}

View File

@@ -1,238 +1,245 @@
import request from '../js/request'
/**
* 发送验证码
* @param {*} params.type 0:登录 1:注册 2:修改密码 6:忘记密码 4:更换手机号第二步获取验证码 5:更换手机号第一步获取验证码
* @returns
*/
export function apiGetYms(params) {
return request({
url: '/user-boot/appUser/authCode',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
type: params.type,
},
method: 'POST',
})
}
/**
* 登录
* @param {*} params.type 0:ysm 1:pwd
* @returns
*/
export function apiLogin(params) {
console.log(uni.getStorageSync('devCode'))
return request({
url: '/shiningCloud/user/login',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
key: params.key.trim(),
type: params.type,
},
method: 'POST',
})
}
/**
* 验证码登录
* @param {*} params.type 0:ysm 1:pwd
* @returns
*/
export function apiYsmLogin(params) {
uni.setStorageSync('access_token', 'Basic bmpjbmFwcDpuamNucHFz')
return request({
url: '/pqs-auth/oauth/token',
data: {
grant_type: 'sms_code',
phone: params.phone,
smsCode: params.smsCode.trim(),
},
method: 'POST',
})
}
/**
* 注册
* @param {*} params
* @returns
*/
export function apiRegister(params) {
return request({
url: '/user-boot/appUser/register',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
code: params.code.trim(),
},
method: 'POST',
})
}
/**
* app用户注册完自动登录
* @param params
* @returns {*}
*/
export function autoLogin(phone) {
return request({
url: '/pqs-auth/oauth/autoLogin',
data: {
phone: phone,
},
method: 'POST',
})
}
// 第一次登录设置密码
export function apiSetPsd(params) {
return request({
url: '/shiningCloud/user/setPsd',
data: {
userId: uni.getStorageSync('userInfo').userIndex,
devCode: uni.getStorageSync('devCode'),
password: params.password.trim(),
},
method: 'POST',
})
}
// 重置密码
export function apiReSetPsd(params) {
return request({
url: '/user-boot/appUser/resetPsd',
data: {
phone: params.phone,
code: params.code.trim(),
devCode: uni.getStorageSync('devCode'),
password: params.password.trim(),
},
method: 'POST',
})
}
// 更换手机号第一步
export function apiComfirmCode(params) {
return request({
url: '/user-boot/appUser/confirmCode',
data: {
devCode: uni.getStorageSync('devCode'),
phone: params.phone,
code: params.code.trim(),
},
method: 'POST',
})
}
// 重新绑定手机号
export function apiRebindPhone(params) {
return request({
url: '/user-boot/appUser/rebindPhone',
data: {
devCode: uni.getStorageSync('devCode'),
userId: uni.getStorageSync('userInfo').userIndex,
phoneNew: params.phone,
code: params.code.trim(),
},
method: 'POST',
})
}
// 角色升级
export function roleUpdate({ userId, referralCode }) {
return request({
url: '/user-boot/appRole/roleUpdate',
method: 'post',
data: {
devCode: uni.getStorageSync('devCode'),
referralCode,
userId,
},
})
}
// 密码登录
export function apiPwdLogin(params) {
return request({
url: '/pqs-auth/oauth/token',
header: {
Authorization: 'Basic bmpjbnRlc3Q6bmpjbnBxcw==', // 客户端信息加密摘要认证
},
params,
method: 'POST',
})
}
//登录获取公钥
export function gongkey(data) {
console.log(data)
return request({
url: '/user-boot/user/generateSm2Key',
method: 'get',
data: data,
})
}
// 修改手机号
export function apiModifyPsd(params) {
return request({
url: '/user-boot/appUser/modifyPsd',
data: {
devCode: uni.getStorageSync('devCode'),
userId: uni.getStorageSync('userInfo').userIndex,
phone: params.phone,
password: params.password.trim(),
code: params.code.trim(),
},
method: 'POST',
})
}
// 更改用户信息
export function apiUpdateUser(params) {
return request({
url: '/user-boot/user/updateAppUser',
data: {
...params,
},
header: {
'Content-Type': 'application/json',
},
method: 'PUT',
})
}
// 更改用户信息
export function apiDeleteUser(params) {
return request({
url: '/user-boot/user/delete',
data: {
id: uni.getStorageSync('userInfo').userIndex,
},
method: 'DELETE',
})
}
// 更新用户推送标识
export function apiUpdatePush(params) {
uni.getPushClientId({
success: (res) => {
console.log('🚀 ~ apiUpdatePush111 ~ res:', res)
let push_clientid = res.cid
console.log(push_clientid, 'push_clientid')
request({
url: '/user-boot/appUser/updateDevCode',
data: {
devCode: push_clientid,
userId: uni.getStorageSync('userInfo').userIndex,
},
method: 'POST',
})
},
fail(err) {
console.log('🚀 ~ apiUpdatePush222 ~ res:', err)
},
})
}
import request from '../js/request'
/**
* 发送验证码
* @param {*} params.type 0:登录 1:注册 2:修改密码 6:忘记密码 4:更换手机号第二步获取验证码 5:更换手机号第一步获取验证码
* @returns
*/
export function apiGetYms(params) {
return request({
url: '/user-boot/appUser/authCode',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
type: params.type,
},
method: 'POST',
})
}
/**
* 登录
* @param {*} params.type 0:ysm 1:pwd
* @returns
*/
export function apiLogin(params) {
console.log(uni.getStorageSync('devCode'))
return request({
url: '/shiningCloud/user/login',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
key: params.key.trim(),
type: params.type,
},
method: 'POST',
})
}
/**
* 验证码登录
* @param {*} params.type 0:ysm 1:pwd
* @returns
*/
export function apiYsmLogin(params) {
uni.setStorageSync('access_token', 'Basic bmpjbmFwcDpuamNucHFz')
return request({
url: '/pqs-auth/oauth/token',
data: {
grant_type: 'sms_code',
phone: params.phone,
smsCode: params.smsCode.trim(),
},
method: 'POST',
})
}
/**
* 注册
* @param {*} params
* @returns
*/
export function apiRegister(params) {
return request({
url: '/user-boot/appUser/register',
data: {
phone: params.phone,
devCode: uni.getStorageSync('devCode'),
code: params.code.trim(),
},
method: 'POST',
})
}
/**
* app用户注册完自动登录
* @param params
* @returns {*}
*/
export function autoLogin(phone) {
return request({
url: '/pqs-auth/oauth/autoLogin',
data: {
phone: phone,
},
method: 'POST',
})
}
// 第一次登录设置密码
export function apiSetPsd(params) {
return request({
url: '/shiningCloud/user/setPsd',
data: {
userId: uni.getStorageSync('userInfo').userIndex,
devCode: uni.getStorageSync('devCode'),
password: params.password.trim(),
},
method: 'POST',
})
}
// 重置密码
export function apiReSetPsd(params) {
return request({
url: '/user-boot/appUser/resetPsd',
data: {
phone: params.phone,
code: params.code.trim(),
devCode: uni.getStorageSync('devCode'),
password: params.password.trim(),
},
method: 'POST',
})
}
// 更换手机号第一步
export function apiComfirmCode(params) {
return request({
url: '/user-boot/appUser/confirmCode',
data: {
devCode: uni.getStorageSync('devCode'),
phone: params.phone,
code: params.code.trim(),
},
method: 'POST',
})
}
// 重新绑定手机号
export function apiRebindPhone(params) {
return request({
url: '/user-boot/appUser/rebindPhone',
data: {
devCode: uni.getStorageSync('devCode'),
userId: uni.getStorageSync('userInfo').userIndex,
phoneNew: params.phone,
code: params.code.trim(),
},
method: 'POST',
})
}
// 角色升级
export function roleUpdate({ userId, referralCode }) {
return request({
url: '/user-boot/appRole/roleUpdate',
method: 'post',
data: {
devCode: uni.getStorageSync('devCode'),
referralCode,
userId,
},
})
}
// 密码登录
export function apiPwdLogin(params) {
return request({
url: '/pqs-auth/oauth/token',
header: {
Authorization: 'Basic bmpjbnRlc3Q6bmpjbnBxcw==', // 客户端信息加密摘要认证
},
params,
method: 'POST',
})
}
//登录获取公钥
export function gongkey(data) {
console.log(data)
return request({
url: '/user-boot/user/generateSm2Key',
method: 'get',
data: data,
})
}
// 修改手机号
export function apiModifyPsd(params) {
return request({
url: '/user-boot/appUser/modifyPsd',
data: {
devCode: uni.getStorageSync('devCode'),
userId: uni.getStorageSync('userInfo').userIndex,
phone: params.phone,
password: params.password.trim(),
code: params.code.trim(),
},
method: 'POST',
})
}
// 更改用户信息
export function apiUpdateUser(params) {
return request({
url: '/user-boot/user/updateAppUser',
data: {
...params,
},
header: {
'Content-Type': 'application/json',
},
method: 'PUT',
})
}
// 更改用户信息
export function apiDeleteUser(params) {
return request({
url: '/user-boot/user/delete',
data: {
id: uni.getStorageSync('userInfo').userIndex,
},
method: 'DELETE',
})
}
// 更新用户推送标识
export function apiUpdatePush(params) {
uni.getPushClientId({
success: (res) => {
console.log('🚀 ~ apiUpdatePush111 ~ res:', res)
let push_clientid = res.cid
console.log(push_clientid, 'push_clientid')
request({
url: '/user-boot/appUser/updateDevCode',
data: {
devCode: push_clientid,
userId: uni.getStorageSync('userInfo').userIndex,
},
method: 'POST',
})
},
fail(err) {
console.log('🚀 ~ apiUpdatePush222 ~ res:', err)
},
})
}
// 获取当前版本号
export function getLastData() {
return request({
url: '/cs-system-boot/appVersion/getLastData?versionType=APP',
method: 'POST',
})
}

View File

@@ -1,287 +1,311 @@
page {
background: #f3f4f5;
}
// mt0,mr0,mb0,ml0 --> mt100,mr100,mb100,ml100
@for $i from 0 through 100 {
.mt#{$i} {
margin-top: #{$i}rpx;
}
.mr#{$i} {
margin-right: #{$i}rpx;
}
.mb#{$i} {
margin-bottom: #{$i}rpx;
}
.ml#{$i} {
margin-left: #{$i}rpx;
}
.pt#{$i} {
padding-top: #{$i}rpx;
}
.pr#{$i} {
padding-right: #{$i}rpx;
}
.pb#{$i} {
padding-bottom: #{$i}rpx;
}
.pl#{$i} {
padding-left: #{$i}rpx;
}
}
.center {
display: flex;
align-items: center;
justify-content: center;
}
.space-between {
display: flex;
justify-content: space-between;
}
.hide-txt {
overflow-x: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
-webkit-line-clamp: 1;
}
.clamp-txt {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
word-break: break-all;
}
.fixed-btn {
position: fixed;
right: 80rpx;
bottom: 200rpx;
width: 126rpx;
height: 126rpx;
background: $uni-theme-white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.2);
image {
height: 66rpx;
width: 66rpx;
}
}
.grid-card {
border-radius: 12rpx;
margin-bottom: 20rpx;
.grid-card-title {
padding: 0 0 20rpx;
font-size: 28rpx;
color: #111;
font-weight: 700;
}
.grid-card-content-4,
.grid-card-content-2,
.grid-card-content-1,
.grid-card-content-3,
.grid-card-content-5,
.grid-card-content-6 {
display: grid;
border-left: 2rpx solid #ccc;
border-top: 2rpx solid #ccc;
font-size: 24rpx;
grid-template-columns: 1fr 1fr 1fr 1fr;
.item {
padding: 0 4rpx;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border-bottom: 2rpx solid #ccc;
border-right: 2rpx solid #ccc;
padding: 4rpx;
background: $uni-theme-white;
}
.item-title {
background: unset;
padding: 8rpx 4rpx;
}
}
.grid-card-content-1 {
grid-template-columns: 1fr;
}
.grid-card-content-2 {
grid-template-columns: 1fr 2fr;
}
.grid-card-content-3 {
grid-template-columns: 1fr 2fr 2fr;
}
.grid-card-content-5 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.grid-card-content-6 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
}
.index {
.header {
margin: 0 20rpx;
display: grid;
grid-gap: 20rpx;
grid-template-columns: 1fr 1fr 1fr ;
.header-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 10rpx 10rpx 20rpx;
color: #fff;
font-size: 28rpx;
background: $uni-theme-color;
border-radius: 12rpx;
.header-item-value {
font-size: 44rpx;
}
.header-item-label {
font-size: 24rpx;
}
}
}
}
.nav {
position: sticky;
top: 0;
left: 0;
padding: 20rpx 20rpx 0;
padding-left: 0;
display: flex;
flex-wrap: wrap;
background: rgb(243, 244, 245);
z-index: 2;
.nav-menu {
padding: 6rpx 20rpx;
margin-left: 20rpx;
margin-bottom: 20rpx;
font-size: 24rpx;
border-radius: 8rpx;
background: #ebeaec;
color: #666;
&-active {
background: #dfe5f7;
color: $uni-theme-color;
}
&-btn {
background: $uni-theme-color;
color: #fff;
}
}
}
.btn {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
background: $uni-theme-color;
color: #fff;
height: 80rpx;
border-radius: 12rpx;
}
.btn-small {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 40rpx;
background: $uni-theme-color;
color: #fff;
height: 60rpx;
font-size: 24rpx;
border-radius: 12rpx;
}
.device {
/deep/ .uni-card:first-of-type {
margin-top: 0 !important;
}
}
.content {
/deep/ .uni-forms-item:last-of-type {
margin-bottom: 0 !important;
}
position: relative;
}
.status-point-success {
display: inline-block;
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background: greenyellow;
overflow: hidden;
}
.status-point-error {
display: inline-block;
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background: red;
overflow: hidden;
}
.popup-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx;
height: 80rpx;
background: #fff;
border-radius: 20rpx 20rpx 0 0;
overflow: hidden;
border-bottom: 1px solid #eee;
.popup-header-title {
font-size: 32rpx;
color: #333;
}
.popup-header-close {
font-size: 32rpx;
color: #666;
}
}
image {
will-change: transform;//解决加载时瞬间拉伸问题
width: auto;//解决加载时瞬间拉伸问题
height: auto;//解决加载时瞬间拉伸问题
image-rendering:-moz-crisp-edges;
image-rendering:-o-crisp-edges;
image-rendering:-webkit-optimize-contrast;
image-rendering: crisp-edges;
-ms-interpolation-mode:nearest-neighbor;
}
page {
background: #f3f4f5;
}
// mt0,mr0,mb0,ml0 --> mt100,mr100,mb100,ml100
@for $i from 0 through 100 {
.mt#{$i} {
margin-top: #{$i}rpx;
}
.mr#{$i} {
margin-right: #{$i}rpx;
}
.mb#{$i} {
margin-bottom: #{$i}rpx;
}
.ml#{$i} {
margin-left: #{$i}rpx;
}
.pt#{$i} {
padding-top: #{$i}rpx;
}
.pr#{$i} {
padding-right: #{$i}rpx;
}
.pb#{$i} {
padding-bottom: #{$i}rpx;
}
.pl#{$i} {
padding-left: #{$i}rpx;
}
.pd#{$i} {
padding: #{$i}rpx;
}
}
.center {
display: flex;
align-items: center;
justify-content: center;
}
.space-between {
display: flex;
justify-content: space-between;
}
.hide-txt {
overflow-x: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: break-all;
-webkit-line-clamp: 1;
}
.clamp-txt {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
word-break: break-all;
}
.fixed-btn {
position: fixed;
right: 80rpx;
bottom: 200rpx;
width: 126rpx;
height: 126rpx;
background: $uni-theme-white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.2);
image {
height: 66rpx;
width: 66rpx;
}
}
.grid-card {
border-radius: 12rpx;
margin-bottom: 20rpx;
.grid-card-title {
padding: 0 0 20rpx;
font-size: 28rpx;
color: #111;
font-weight: 700;
}
.grid-card-content-4,
.grid-card-content-2,
.grid-card-content-1,
.grid-card-content-3,
.grid-card-content-5,
.grid-card-content-6 {
display: grid;
border-left: 2rpx solid #ccc;
border-top: 2rpx solid #ccc;
font-size: 24rpx;
grid-template-columns: 1fr 1fr 1fr 1fr;
.item {
padding: 0 4rpx;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border-bottom: 2rpx solid #ccc;
border-right: 2rpx solid #ccc;
padding: 4rpx;
background: $uni-theme-white;
}
.item-title {
background: unset;
padding: 8rpx 4rpx;
}
}
.grid-card-content-1 {
grid-template-columns: 1fr;
}
.grid-card-content-2 {
grid-template-columns: 1fr 2fr;
}
.grid-card-content-3 {
grid-template-columns: 1fr 2fr 2fr;
}
.grid-card-content-5 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.grid-card-content-6 {
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
}
.index {
.header {
margin: 0 20rpx;
display: grid;
grid-gap: 20rpx;
grid-template-columns: 1fr 1fr 1fr;
.header-item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 10rpx 10rpx 20rpx;
color: #fff;
font-size: 28rpx;
background: $uni-theme-color;
border-radius: 12rpx;
.header-item-value {
font-size: 44rpx;
}
.header-item-label {
font-size: 26rpx;
}
}
}
}
.nav {
position: sticky;
top: 0;
left: 0;
padding: 20rpx 20rpx 0;
padding-left: 0;
display: flex;
flex-wrap: wrap;
background: rgb(243, 244, 245);
z-index: 2;
.nav-menu {
padding: 6rpx 20rpx;
margin-left: 20rpx;
margin-bottom: 20rpx;
font-size: 24rpx;
border-radius: 8rpx;
background: #ebeaec;
color: #666;
&-active {
background: #dfe5f7;
color: $uni-theme-color;
}
&-btn {
background: $uni-theme-color;
color: #fff;
}
}
}
.btn {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
background: $uni-theme-color;
color: #fff;
height: 80rpx;
border-radius: 12rpx;
}
.btn-small {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 40rpx;
background: $uni-theme-color;
color: #fff;
height: 60rpx;
font-size: 24rpx;
border-radius: 12rpx;
}
.device {
/deep/ .uni-card:first-of-type {
margin-top: 0 !important;
}
}
.content {
/deep/ .uni-forms-item:last-of-type {
margin-bottom: 0 !important;
}
position: relative;
}
.status-point-success {
display: inline-block;
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background: greenyellow;
overflow: hidden;
}
.status-point-error {
display: inline-block;
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background: red;
overflow: hidden;
}
.popup-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx;
height: 80rpx;
background: #fff;
border-radius: 20rpx 20rpx 0 0;
overflow: hidden;
border-bottom: 1px solid #eee;
.popup-header-title {
font-size: 32rpx;
color: #333;
}
.popup-header-close {
font-size: 32rpx;
color: #666;
}
}
image {
will-change: transform; //解决加载时瞬间拉伸问题
width: auto; //解决加载时瞬间拉伸问题
height: auto; //解决加载时瞬间拉伸问题
image-rendering: -moz-crisp-edges;
image-rendering: -o-crisp-edges;
image-rendering: -webkit-optimize-contrast;
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor;
}
.canneng-index-title {
font-size: 30rpx;
}
.boxClick:active {
// transform: scale(0.94);
// opacity: 0.8;
animation: elastic-bounce 0.5s;
}
@keyframes elastic-bounce {
0% {
transform: scale(1);
}
50% {
transform: scale(0.96);
}
100% {
transform: scale(1);
}
}

View File

@@ -1,7 +1,7 @@
const debug = false // true 是连地服务端本地false 是连接线上
const debug = true // true 是连地服务端本地false 是连接线上
const development = {
domain: 'http://192.168.1.62:10215',
domain: 'http://192.168.1.103:10215',
}
const production = {

View File

@@ -1,92 +1,98 @@
export default {
onPullDownRefresh() {
this.store && this.store.reload()
},
onReachBottom() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
data() {
return {
store: {},
}
},
methods: {
DataSource(url) {
var me = this
return {
data: [],
status: 'noMore',
empty: false,
total: 0,
header: {
'Content-Type': 'application/json;charset=UTF-8',
},
params: {
pageNum: 1,
pageSize: 20,
},
timer: null,
callBack: null,
firstCallBack: null,
loadedCallback: null,
reload() {
if (this.status == 'loading') return
this.data = []
this.empty = false
this.params.pageNum = 1
this.next()
},
search() {
// 节流搜索
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.reload()
}, 300)
},
next() {
this.status = 'loading'
me.$request({
url: url,
data: this.params,
header: this.header,
method: 'POST',
debounce: false,
}).then((res) => {
console.warn(res)
let resultData = res.data?.list || res.data?.records || res.data || []
if (this.params.pageNum == 1) {
this.data = resultData
if (resultData.length == 0 || resultData == 0) {
this.empty = true
this.status = 'noMore'
} else if (resultData.length < this.params.pageSize) {
this.status = 'noMore'
} else if (res.total == resultData.length) {
this.status = 'noMore'
} else {
this.status = 'more'
}
} else {
this.data.push(...resultData)
if (resultData.length < this.params.pageSize) {
this.status = 'noMore'
} else {
this.status = 'more'
}
}
if (this.params.pageNum == 1) {
this.firstCallBack && this.firstCallBack()
}
this.loadedCallback && this.loadedCallback()
this.params.pageNum++
this.total = res.total
this.loading = false
uni.stopPullDownRefresh()
})
},
}
},
},
}
export default {
onPullDownRefresh() {
if (this.store.isListAtTop) {
this.store && this.store.reload()
}
},
onReachBottom() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
data() {
return {
store: {},
}
},
methods: {
DataSource(url) {
var me = this
return {
data: [],
copyData: {},
status: 'noMore',
empty: false,
isListAtTop: true,
total: 0,
header: {
'Content-Type': 'application/json;charset=UTF-8',
},
params: {
pageNum: 1,
pageSize: 20,
},
timer: null,
callBack: null,
firstCallBack: null,
loadedCallback: null,
reload() {
if (this.status == 'loading') return
this.data = []
this.empty = false
this.params.pageNum = 1
this.next()
},
search() {
// 节流搜索
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.reload()
}, 300)
},
next() {
this.status = 'loading'
me.$request({
url: url,
data: this.params,
header: this.header,
method: 'POST',
debounce: false,
}).then((res) => {
console.warn(res)
let resultData = res.data?.list || res.data?.records || res.data || []
this.copyData = res.data
if (this.params.pageNum == 1) {
this.data = resultData
if (resultData.length == 0 || resultData == 0) {
this.empty = true
this.status = 'noMore'
} else if (resultData.length < this.params.pageSize) {
this.status = 'noMore'
} else if (res.total == resultData.length) {
this.status = 'noMore'
} else {
this.status = 'more'
}
} else {
this.data.push(...resultData)
if (resultData.length < this.params.pageSize) {
this.status = 'noMore'
} else {
this.status = 'more'
}
}
if (this.params.pageNum == 1) {
this.firstCallBack && this.firstCallBack()
}
this.loadedCallback && this.loadedCallback()
this.params.pageNum++
this.total = res.total || res.data?.total
this.loading = false
uni.stopPullDownRefresh()
})
},
}
},
},
}

View File

@@ -1,5 +1,5 @@
export const MQTT_IP = 'pqmcn.com:8085/mqtt'//mqtt地址端口, 使用emqx时一定要加mqtt
// export const MQTT_IP = '192.168.1.24:8085/mqtt'//mqtt地址端口, 使用emqx时一定要加mqtt
// export const MQTT_IP = 'pqmcn.com:8085/mqtt'//mqtt地址端口, 使用emqx时一定要加mqtt
export const MQTT_IP = '192.168.1.103:38083/mqtt'//mqtt地址端口, 使用emqx时一定要加mqtt
const MQTT_USERNAME = 't_user'//mqtt用户名
const MQTT_PASSWORD = 'njcnpqs'//密码

View File

@@ -27,7 +27,7 @@ export default (options = {}) => {
}
uni.request({
url,
timeout: 1000 *30,
timeout: 1000 * 60,
data: {
...options.data,
},
@@ -39,7 +39,7 @@ export default (options = {}) => {
},
method: options.method || 'GET',
success: async (res) => {
console.log(res)
// console.log(res)
if (arr.indexOf(options.url) > -1) {
setTimeout(() => {
arr.splice(arr.indexOf(options.url), 1)

227
common/js/update.js Normal file
View File

@@ -0,0 +1,227 @@
import { getLastData } from '../api/user.js'
export const checkAppUpdate = () => {
// 开发环境跳过检查
const isDev = process.env.NODE_ENV === 'development'
// if (isDev) {
console.log('开发环境,不执行更新检查')
return
// }
// 获取当前应用信息
plus.runtime.getProperty(plus.runtime.appid, (info) => {
const currentVersion = info.version
getLastData()
.then((res) => {
// let res = {
// data: {
// versionName: 'v1.6.83',
// forceUpdate: '1',
// androidPath: 'https://app.liuyingyong.cn/build/download/3c26e400-3a33-11f1-8997-a16e76fa35b3',
// // androidPath: 'http://112.4.144.18:8040/shiningCloud/file/canneng_wulian.apk',
// iosPath: 'xxxx',
// },
// }
if (!res?.data) {
console.log('未获取到版本信息')
return
}
// 适配新的接口返回格式
const { versionName, androidPath, iosPath, forceUpdate = '1' } = res.data
// 版本相同则不需要更新
if (versionName.includes(currentVersion)) {
console.log('已是最新版本')
return
}
const isForce = forceUpdate === '1' // 字符串 '1' 表示强制更新
const iosUrl = iosPath
handleUpdate({ version: versionName, androidPath, iosUrl, isForce })
})
.catch((err) => {
console.error('获取版本接口失败', err)
})
})
}
/**
* 处理更新逻辑
*/
const handleUpdate = ({ version, androidPath, iosUrl, isForce }) => {
const isAndroid = plus.os.name === 'Android'
const isIOS = plus.os.name === 'iOS'
if (isAndroid) {
handleAndroidUpdate({ androidPath, isForce })
} else if (isIOS) {
handleIOSUpdate({ iosUrl, isForce })
} else {
console.warn('未知操作系统')
}
}
/**
* 处理安卓更新
*/
const handleAndroidUpdate = ({ androidPath, isForce }) => {
if (!androidPath?.length) {
console.error('未找到安卓安装包')
uni.showToast({
title: '更新包不存在',
icon: 'error',
})
return
}
const downloadUrl = androidPath
uni.showModal({
title: '更新提示',
content: '发现新版本,是否立即更新?',
showCancel: !isForce, // 强制更新隐藏取消按钮
confirmText: '去更新',
cancelText: '暂不更新',
success: (modalRes) => {
if (modalRes.confirm) {
downloadAndInstallApk(downloadUrl)
} else if (isForce) {
// 强制更新且用户取消,退出应用
plus.runtime.quit()
}
},
})
}
/**
* 处理iOS更新
*/
const handleIOSUpdate = ({ iosUrl, isForce }) => {
if (!iosUrl) {
console.error('未找到iOS下载链接')
uni.showToast({
title: '更新链接不存在',
icon: 'error',
})
return
}
uni.showModal({
title: '更新提示',
content: '发现新版本,请前往 App Store 更新',
showCancel: !isForce,
confirmText: '去更新',
cancelText: '暂不更新',
success: (modalRes) => {
if (modalRes.confirm) {
plus.runtime.openURL(iosUrl)
}
// 强制更新时,无论确认还是取消都退出应用
if (isForce) {
setTimeout(() => {
plus.runtime.quit()
}, 300) // 给跳转留一点时间
}
},
})
}
/**
* 下载并安装APK安卓专用
*/
const downloadAndInstallApk = (url) => {
// 显示原生进度条
let progressWaiting = plus.nativeUI.showWaiting('正在下载中,请稍等...', {
modal: true,
round: true,
close: false, // 不允许用户关闭
padlock: true, // 锁定屏幕
})
const options = {
filename: '_doc/update/canneng_wulian.apk',
timeout: 120,
}
const downloadTask = plus.downloader.createDownload(url, options, (downloadedFile, status) => {
progressWaiting.close()
if (status === 200) {
installApk(downloadedFile.filename, url)
} else {
handleDownloadError(url)
}
})
// // 更新进度
downloadTask.addEventListener('statechanged', (task) => {
if (task.state === 3 && task.totalSize > 0) {
const percent = ((task.downloadedSize / task.totalSize) * 100).toFixed(0)
console.log("🚀 ~ downloadAndInstallApk ~ percent:", percent)
// 直接更新 waiting 的标题,不会闪烁
progressWaiting.setTitle(`正在下载更新 ${percent}%`)
}
})
downloadTask.start()
}
/**
* 安装APK
*/
const installApk = (filePath, downloadUrl) => {
console.log('🚀 ~ installApk ~ filePath:', filePath)
plus.runtime.install(
filePath,
{ force: true },
() => {
// 安装成功
uni.showModal({
title: '安装成功',
content: '是否立即重启应用?',
showCancel: false,
confirmText: '立即重启',
success: () => {
plus.runtime.restart()
},
})
},
(error) => {
console.error('安装失败', error)
uni.showModal({
title: '安装失败',
content: `安装失败:${error.message}\n请检查是否已开启安装权限`,
confirmText: '重试',
cancelText: '取消',
success: (res) => {
if (res.confirm) {
downloadAndInstallApk(downloadUrl)
}
},
})
},
)
}
/**
* 处理下载错误
*/
const handleDownloadError = (downloadUrl) => {
uni.showModal({
title: '下载失败',
content: '网络异常或下载链接失效,是否重试?',
confirmText: '重试',
cancelText: '取消',
success: (res) => {
if (res.confirm) {
downloadAndInstallApk(downloadUrl)
}
},
})
}

View File

@@ -107,39 +107,61 @@ function formatTime(time, option) {
}
// 获取当天日期(年月日)
function getToday() {
const today = new Date();
const year = today.getFullYear();
const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从0开始需+1
const day = String(today.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
const today = new Date()
const year = today.getFullYear()
const month = String(today.getMonth() + 1).padStart(2, '0') // 月份从0开始需+1
const day = String(today.getDate()).padStart(2, '0')
return `${year}-${month}-${day}`
}
// 获取当天日期 往前推30天
function getBeforeDays(days = 30) {
const today = new Date();
// 计算往前推N天的时间戳1天=86400000毫秒
const beforeDate = new Date(today.getTime() - days * 24 * 60 * 60 * 1000);
return formatDate(beforeDate);
const today = new Date()
// 计算往前推N天的时间戳1天=86400000毫秒
const beforeDate = new Date(today.getTime() - days * 24 * 60 * 60 * 1000)
return formatDate(beforeDate)
}
function formatDate(date) {
const year = date.getFullYear();
// 月份从0开始补零到2位
const month = String(date.getMonth() + 1).padStart(2, '0');
// 日期补零到2位
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
const year = date.getFullYear()
// 月份从0开始补零到2位
const month = String(date.getMonth() + 1).padStart(2, '0')
// 日期补零到2位
const day = String(date.getDate()).padStart(2, '0')
return `${year}-${month}-${day}`
}
// 获取3个月前的日期
function getThreeMonthsAgo() {
const threeMonthsAgo = new Date();
threeMonthsAgo.setMonth(threeMonthsAgo.getMonth() - 3); // 月份减3
const year = threeMonthsAgo.getFullYear();
const month = String(threeMonthsAgo.getMonth() + 1).padStart(2, '0');
const day = String(threeMonthsAgo.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
const threeMonthsAgo = new Date()
threeMonthsAgo.setMonth(threeMonthsAgo.getMonth() - 3) // 月份减3
const year = threeMonthsAgo.getFullYear()
const month = String(threeMonthsAgo.getMonth() + 1).padStart(2, '0')
const day = String(threeMonthsAgo.getDate()).padStart(2, '0')
return `${year}-${month}-${day}`
}
//获取月最后一天
function getMonthFirstAndLastDay(monthStr) {
// 1. 校验输入格式正则匹配YYYY-MM
const reg = /^\d{4}-\d{2}$/
if (!reg.test(monthStr)) {
throw new Error('输入格式错误,请传入"YYYY-MM"格式的字符串例如2026-03')
}
// 2. 拆分年、月
const [year, month] = monthStr.split('-').map(Number)
// 3. 生成当月第一天直接拼接01
const firstDay = `${year}-${String(month).padStart(2, '0')}-01`
// 4. 生成当月最后一天核心利用Date的特性下个月0号 = 当月最后一天)
// 注意月份是0开始的0=1月11=12月所以month+1是下一个月
const lastDayDate = new Date(year, month, 0) // 下个月0号 = 当月最后一天
const lastDay = `${year}-${String(month).padStart(2, '0')}-${String(lastDayDate.getDate()).padStart(2, '0')}`
return {
firstDay,
lastDay,
}
}
const h5Helper = {
isAndroid: function () {
@@ -167,7 +189,7 @@ const getUserLocation = (call) => {
success: function (address) {
call(address)
},
fail: (err) => {
fail: (err) => {
uni.showModal({
title: '提示',
content: '定位失败,请打开定位权限',
@@ -309,12 +331,14 @@ const getDictData = (key) => {
resolve(dictData.filter((item) => item.code === key)[0]?.children || [])
} else {
// 查询字典
queryDictDataCache().then((res) => {
uni.setStorageSync(cacheKey.dictData, res.data)
resolve(res.data.filter((item) => item.code === key)[0]?.children || [])
}).catch(err=>{
reject(err)
})
queryDictDataCache()
.then((res) => {
uni.setStorageSync(cacheKey.dictData, res.data)
resolve(res.data.filter((item) => item.code === key)[0]?.children || [])
})
.catch((err) => {
reject(err)
})
}
})
}
@@ -333,5 +357,6 @@ export default {
getDictData,
getToday,
getBeforeDays,
getThreeMonthsAgo
getThreeMonthsAgo,
getMonthFirstAndLastDay,
}

View File

@@ -0,0 +1,533 @@
<template xlang="wxml">
<view class="tki-tree">
<view class="tki-tree-mask" :class="{ show: showTree }" @tap="_cancel"></view>
<view class="tki-tree-cnt" :class="{ show: showTree }">
<view class="tki-tree-bar">
<view class="tki-tree-bar-cancel" :style="{ color: cancelColor }" hover-class="hover-c" @tap="_cancel"
>取消</view
>
<view class="tki-tree-bar-title" :style="{ color: titleColor }">{{ title }}</view>
<view
class="tki-tree-bar-confirm"
:style="{ color: confirmColor }"
hover-class="hover-c"
@tap="_confirm"
>确定</view
>
</view>
<view class="tki-tree-bar1">
<uni-search-bar
class="uni-input"
radius="5"
placeholder="请输入关键字搜索"
clearButton="none"
@input="input"
/>
<!-- <uni-search-bar
v-model="searchValue"
clearButton="none"
bgColor="#fff"
placeholder="请输入关键词"
@input="input"
></uni-search-bar> -->
</view>
<view class="tki-tree-view">
<scroll-view class="tki-tree-view-sc" :scroll-y="true">
<block v-for="(item, index) in treeList" :key="index">
<view
class="tki-tree-item"
:style="[
{
paddingLeft: item.rank * 15 + 'px',
zIndex: item.rank * -1 + 50,
},
]"
:class="{
border: border === true,
show: item.show,
last: item.lastRank,
showchild: item.showChild,
open: item.open,
}"
>
<view class="tki-tree-label" @tap.stop="_treeItemTap(item, index)">
<image
class="tki-tree-icon"
:src="item.lastRank ? lastIcon : item.showChild ? currentIcon : defaultIcon"
></image>
{{ item.name }}
</view>
<view
class="tki-tree-check"
@tap.stop="_treeItemSelect(item, index)"
v-if="selectParent ? true : item.lastRank"
>
<view
class="tki-tree-check-yes"
v-if="item.checked"
:style="{ 'border-color': confirmColor }"
>
<view
class="tki-tree-check-yes-b"
:style="{ 'background-color': confirmColor }"
></view>
</view>
<view
class="tki-tree-check-no"
v-if="!item.checked"
:style="{ 'border-color': confirmColor }"
></view>
</view>
</view>
</block>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'Cn-MultipleTree',
props: {
lazy: {
type: Boolean,
default: false,
},
range: {
type: Array,
default: function () {
return []
},
},
idKey: {
type: String,
default: 'id',
},
rangeKey: {
type: String,
default: 'name',
},
title: {
type: String,
default: '',
},
multiple: {
type: Boolean,
default: true,
},
selectParent: {
//是否可以选父级
type: Boolean,
default: false,
},
foldAll: {
//折叠时关闭所有已经打开的子集,再次打开时需要一级一级打开
type: Boolean,
default: false,
},
confirmColor: {
// 确定按钮颜色
type: String,
default: '#376cf3', // #07bb07
},
cancelColor: {
// 取消按钮颜色
type: String,
default: '', // #757575
},
titleColor: {
// 标题颜色
type: String,
default: '', // #757575
},
currentIcon: {
// 展开时候的ic
type: String,
default:
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAABRCAYAAACqj0o2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEQ0QTM0MzQ1Q0RBMTFFOUE0MjY4NzI1Njc1RjI1ODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEQ0QTM0MzU1Q0RBMTFFOUE0MjY4NzI1Njc1RjI1ODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowRDRBMzQzMjVDREExMUU5QTQyNjg3MjU2NzVGMjU4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowRDRBMzQzMzVDREExMUU5QTQyNjg3MjU2NzVGMjU4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PidwepsAAAK0SURBVHja7JxbTsJAFIYHww7ciStgCeoGvGxAiOsgURegoL5720AXYLiIr0aJviq3Zx3PhIEnKG3ndtr+f3KixrSUj/ZjzjClIqUUiFm2gAAQAREQEUAEREAERAQQAREQAREBREAEREBEEqa67h9RFDWllDv0awWYlqlQHmu1WjMRRMoV1QFttA12y3xRtdNczq8EsE4/f8FumX2q77ROvNXk8UGMEKdUz6tYJHljaZAbuyUH+UR1to5BEohTuqwPCeS4pAA/qY6o/kyHOAMCeRK3owJnj+rH1jjxhqpVsstaebCz6TmnHWyXyY+xHjSBWBY/bvSgadtXBj9u9KCN3rnIfkzkQVsTEEX0Y2IP2oKo/HhMICcFAThUcwVZNGU6FdbX/XURzkbVF4+ybGhjPrFdgP66QdXNurGtSdk6Xdb9nAJ8oDo3OQlsQZzkdPw41ONBo6vI5scDefRjZg+6gpg3Pxp50CXEvPjR2IOuIXL3oxUPuobI3Y9WPOgDIlc/WvOgL4iL/vqFCcD7LH0xB4hj7cfQ/fWH9qCT+FhG0tN+DBk1PzjOM0SVllixcsBT1AvYc/kAPhc0hRg/3uvxoCgKRN9+dOrBUBB9+9GpB0NC9OVH5x4MDdG1H714kANEV3705kEOEBf9dcPi/lQnsuvLg1wgSu3Ha0v7Uh4MMgUXeuG71H407a+VBy9CPQkOdw+MtB+nGbd/D+FBbhBNxo9SjwcngJjNj0E9yBFiFj8G9SBXiGn8GNyDnCEm8SMLD3KHGOdHNh7kDjHOj2w8mAeIi/5arX+c6b/fxHz9oADEdGdjR/fXCw/OOB5oVfCOgnepz8IB14PMw03jCmTE+QBx5z0gAmKSqK9OUF+hcAeIhu/QYr4Qie8rjW83hhMBERARQAREQAREBBABERCLnH8BBgA+TQI7U4t53AAAAABJRU5ErkJggg==',
},
defaultIcon: {
// 折叠时候的ic
type: String,
default:
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAABRCAYAAACqj0o2AAACE0lEQVR4Xu3c200DMRCF4XEltJAOkEugA+ggpUAHoQMqiFMCdEAJUMEiS4mEELlIO7bPOeN9i6K1rG/952myyea1WiCtXmEuYBPR4RBMxInoIOCwhOtJLKVszWyXc/5y2BvNEq6I+/3+kFK6M7OHnPM7jcLKjbZAvD/uaZtzflm5P4rbWyJWgDcze1LPuzVihfxUz7sH4ilJ2bx7Isrm3RtRMu8RiHJ5j0SUyXs0okTeCIj0eSMh0uaNhkiZNyIiXd7IiDR5oyNS5M2ACJ83EyJs3myIkHkzIsLlzYwIkzc7IkTeCojD81ZCHJa3GuKQvBURu+etjNgtb3XELnlHQGyedyTEZnlHQ2ySd0RE97wjI7rlHR3RJe+JeIrbLOecD6ePpZQ6W1kn2epo4MUrPOKyLN8ppYq1+y1VStncOjIdGnFZlo+U0uOtWOeOY2TE12Ouq//pEA7xXL7XfvcufR8K0Svfv6CREN3yDYfYIt9QiK3yjYTYLF95xB75SiP2ylcZsVu+cogj8pVCHJWvEuKwfOkREfKlRkTJlxkRJl86RMR8qRBR82VChM0XHpEhX2hElnyREWnyhUNkzBcKkTVfJETafIcjKuQ7FFEl35GIMvl2R1TMtyuiar49EWXzbY5oZpv/hibXTF2h3+s60FRKeT6+3TjMS3nrA3ZFRD8xrfY3ER1kJ+JEdBBwWGKeRAfEH1wS5WFZSDB/AAAAAElFTkSuQmCC',
},
lastIcon: {
// 没有子集的ic
type: String,
default: '',
},
border: {
// 是否有分割线
type: Boolean,
default: false,
},
},
data() {
return {
showTree: false,
treeList: [],
selectIndex: -1,
returnedItem: [], //定义一个空数组
pids: [],
ancestorsIds: [],
childNums: [],
dataTree: [],
inputTimer: null, // 节流定时器标识
searchValue: '',
}
},
computed: {},
methods: {
_show() {
this.showTree = true
if (this.searchValue != '') {
this.searchValue = ''
this.input('')
}
},
_hide() {
this.showTree = false
},
_cancel() {
this._hide()
this.$emit('cancel', '')
},
_confirm() {
// 处理所选数据
let rt = [],
obj = {}
this.treeList.forEach((v, i) => {
if (this.treeList[i].checked) {
// rt.push(this.treeList[i].id)
rt.push(this.treeList[i])
}
})
this._hide()
console.log('🚀 ~ rt:', rt)
if (rt.length == 0) return
this.$emit('confirm', rt)
},
//扁平化树结构
_renderTreeList(list = [], rank = 0, parentId = [], parents = []) {
list.forEach((item) => {
this.treeList.push({
id: item[this.idKey],
name: item[this.rangeKey],
source: item,
parentId, // 父级id数组
parents, // 父级id数组
rank, // 层级
showChild: false, //子级是否显示
open: false, //是否打开
show: rank === 0, // 自身是否显示
hideArr: [],
orChecked: item.checked ? item.checked : false,
checked: item.checked ? item.checked : false,
childNum: 0,
})
if (Array.isArray(item.children) && item.children.length > 0) {
let parentid = [...parentId],
parentArr = [...parents]
delete parentArr.children
parentid.push(item[this.idKey])
parentArr.push({
[this.idKey]: item[this.idKey],
[this.rangeKey]: item[this.rangeKey],
rank: rank,
})
// lazy
if (!this.lazy) {
this._renderTreeList(item.children, rank + 1, parentid, parentArr)
}
} else {
this.treeList[this.treeList.length - 1].lastRank = true
}
})
},
// 处理默认选择
_defaultSelect() {
this.treeList.forEach((v, i) => {
if (v.checked) {
this.treeList.forEach((v2, i2) => {
if (v.parentId.toString().indexOf(v2.parentId.toString()) >= 0) {
v2.show = true
if (v.parentId.includes(v2.id)) {
v2.showChild = true
v2.open = true
}
}
})
}
})
},
getOwn(id, arr) {
//利用foreach循环遍历
arr.forEach((item) => {
//判断递归结束条件
if (item[this.idKey] == id) {
// 存储数据到空数组
this.returnedItem = item
} else if (item.children != null) //判断chlidren是否有数据
{
//递归调用
this.getOwn(id, item.children)
}
})
return this.returnedItem
},
setShow(id, arr, isShow) {
arr.forEach((item, index) => {
if (item.parentId.includes(id)) {
this.treeList[index].showChild = isShow
this.treeList[index].show = isShow
} else if (item.children !== undefined) {
this.setShow(id, item.children, isShow)
}
})
},
// 点击
_treeItemTap(item, index) {
// console.log(item)
if (item.lastRank === true) {
this.treeList[index].checked = !this.treeList[index].checked
if (!this.multiple) {
this._fixSingle(index)
}
return
}
let id = item.id
item.showChild = !item.showChild
// qingqian
if (item.showChild) {
// const range = this.range
const range = this.dataTree
const parentIdArr = item.parentId
// 找到当前元素
const own = this.getOwn(id, range)
const checkedChildren = own.children
// 子元素插入的索引位置
const nextIndex = this.treeList.findIndex((itemT) => itemT.id === item.id)
console.log(checkedChildren)
if (checkedChildren === undefined || checkedChildren.length < 1) {
return
}
// 子节点数量
this.treeList[index].childNum = checkedChildren.length
const newRank = item.rank + 1
checkedChildren.forEach((itemC) => {
const childObj = {
id: itemC[this.idKey],
name: itemC[this.rangeKey],
source: {},
parentId: [item.id], // 父级id数组
parents: [item], // 父级id数组
rank: newRank, // 层级
showChild: false, //子级是否显示
open: false, //是否打开
show: 1, // 自身是否显示
hideArr: [],
orChecked: this.treeList[index].checked,
checked: this.treeList[index].checked,
}
if (!this.treeList.some((itemT) => itemT.id === itemC[this.idKey])) {
this.treeList.splice(nextIndex + 1, 0, childObj)
}
})
}
// 展开/隐藏子级/孙级
let list = this.treeList
item.open = item.showChild ? true : !item.open
list.forEach((childItem, i) => {
if (item.showChild === false) {
//隐藏所有子级
if (!childItem.parentId.includes(id)) {
return
}
//TODO: 修改
if (!this.foldAll) {
if (childItem.lastRank !== true && !childItem.open) {
childItem.showChild = false
this.setShow(childItem.id, this.treeList, false)
}
// 为隐藏的内容添加一个标记
if (childItem.show) {
childItem.hideArr[item.rank] = id
}
} else {
if (childItem.lastRank !== true) {
childItem.showChild = false
// 继续隐藏子级的的子级
this.setShow(childItem.id, this.treeList, false)
}
}
if (childItem.children !== undefined) {
childItem.children.forEach((childItem1, i1) => {
if (!childItem1.parentId.includes(childItem.id)) {
return
}
childItem.children[i1].showChild = false
childItem.children[i1].show = false
})
}
childItem.show = false
} else {
// 打开子集
if (childItem.parentId[childItem.parentId.length - 1] === id) {
childItem.show = true
}
// 打开被隐藏的子集
if (childItem.parentId.includes(id) && !this.foldAll) {
// console.log(childItem.hideArr)
if (childItem.hideArr[item.rank] === id) {
childItem.show = true
if (childItem.open && childItem.showChild) {
childItem.showChild = true
} else {
childItem.showChild = false
}
childItem.hideArr[item.rank] = null
}
}
}
})
},
// 通过父id处理子级
syncChecked(trees, pid, checked) {
trees.forEach((item, index) => {
if (item.parentId.includes(pid)) {
this.treeList[index].checked = checked
this.syncChecked(trees, item.id, checked)
} else if (item.children !== undefined) {
this.syncChecked(item.children, pid, checked)
}
})
},
// 获取父级往上所有层级的id 并同步状态
setAncestors(pids, checked) {
this.treeList.forEach((item, index) => {
if (pids.includes(item.id)) {
if (checked && this.childNums[item.id] !== undefined && item.childNum === this.childNums[item.id]) {
// 子级全部选中, 父级才选中
this.treeList[index].checked = true
} else {
this.treeList[index].checked = false
}
this.setAncestors(item.parentId, checked)
}
})
},
_treeItemSelect(item, index) {
this.treeList[index].checked = !this.treeList[index].checked
// 选父级, 子级自动全选
this.syncChecked(this.treeList, item.id, this.treeList[index].checked)
if (item.rank > 0) {
item.parentId.forEach((pid, indexP) => {
const parent = this.treeList.filter((i) => i.id === pid)
const childNum = parent.length > 0 ? parent[0].childNum : 0
if (this.childNums[pid] === undefined) {
this.childNums[pid] = 1
} else if (this.childNums[pid] < childNum) {
this.childNums[pid]++
}
})
//子级选择/选满/取消选择, 父级往上同步状态
this.setAncestors(item.parentId, this.treeList[index].checked)
}
if (!this.multiple) {
this._fixSingle(index)
}
},
_fixSingle(index) {
this.treeList.forEach((v, i) => {
this.treeList[i].checked = i === index
})
},
// 重置数据
_reTreeList() {
this.treeList.forEach((v, i) => {
this.treeList[i].checked = v.orChecked
})
},
_initTree(range = this.range) {
this.treeList = []
this.dataTree = JSON.parse(JSON.stringify(range))
this._renderTreeList(range)
this.$nextTick(() => {
this._defaultSelect(range)
})
},
// 筛选
input(val) {
// 清除上一次的定时器,避免频繁执行
if (this.inputTimer) {
clearTimeout(this.inputTimer)
}
// 设置新的定时器,指定延迟后执行过滤逻辑
this.inputTimer = setTimeout(() => {
const keyword = val
// 执行树形过滤和初始化
this._initTree(this.filterNodes(this.range, keyword))
// 清空定时器标识
clearTimeout(this.inputTimer)
this.inputTimer = null
}, 500)
// this._initTree(this.filterNodes(this.range, val.detail.value))
},
filterNodes(node, query) {
const keyword = query.trim() // 获取搜索关键字并转换为小写
const nodes = node
// 使用递归函数过滤树形数据
const filteredNodes = []
for (const node of nodes) {
if (node.name.includes(keyword)) {
// 如果节点的标签包含关键字,将其添加到结果中
filteredNodes.push(node)
} else if (node.children && node.children.length > 0) {
// 如果节点有子节点,则递归过滤子节点
const filteredChildren = this.filterNodes(node.children, keyword)
if (filteredChildren.length > 0) {
// 如果子节点中有匹配的结果,则添加父节点
const clonedNode = { ...node, children: filteredChildren }
filteredNodes.push(clonedNode)
}
}
}
return filteredNodes
},
},
watch: {
range(list) {
this._initTree(list)
},
multiple() {
if (this.range.length) {
this._reTreeList()
}
},
selectParent() {
if (this.range.length) {
this._reTreeList()
}
},
},
mounted() {
this._initTree()
},
}
</script>
<style lang="scss" scoped>
@import './style.css';
/deep/ .uni-searchbar__box {
justify-content: left !important;
}
</style>

View File

@@ -0,0 +1,195 @@
.tki-tree-mask {
position: fixed;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
z-index: 9998;
background-color: rgba(0, 0, 0, 0.6);
opacity: 0;
transition: all 0.3s ease;
visibility: hidden;
}
.tki-tree-mask.show {
visibility: visible;
opacity: 1;
}
.tki-tree-cnt {
position: fixed;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
z-index: 9999;
top: 40%;
transition: all 0.3s ease;
transform: translateY(100%);
}
.tki-tree-cnt.show {
transform: translateY(0);
}
.tki-tree-bar {
background-color: #fff;
height: 72rpx;
padding-left: 20rpx;
padding-right: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
border-bottom-width: 1rpx !important;
border-bottom-style: solid;
border-bottom-color: #f5f5f5;
font-size: 32rpx;
color: #757575;
line-height: 1;
}
.tki-tree-bar1 {
background-color: #fff;
}
.tki-tree-bar-confirm {
color: #07bb07;
}
.tki-tree-view {
position: absolute;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
top: 160rpx;
background-color: #fff;
padding-top: 20rpx;
padding-right: 20rpx;
padding-bottom: 20rpx;
padding-left: 20rpx;
}
.tki-tree-view-sc {
height: 100%;
overflow: hidden;
}
.tki-tree-item {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 26rpx;
/* color: #757575; */
line-height: 1;
height: 0;
opacity: 0;
transition: 0.2s;
position: relative;
overflow: hidden;
}
.tki-tree-item.show {
height: 80rpx;
opacity: 1;
}
.tki-tree-item.showchild:before {
transform: rotate(90deg);
}
.tki-tree-item.last:before {
opacity: 0;
}
.tki-tree-icon {
width: 26rpx;
height: 26rpx;
margin-right: 8rpx;
}
.tki-tree-label {
flex: 1;
display: flex;
align-items: center;
height: 100%;
line-height: 1.2;
}
.tki-tree-check {
width: 40px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.tki-tree-check-yes,
.tki-tree-check-no {
width: 20px;
height: 20px;
border-top-left-radius: 20%;
border-top-right-radius: 20%;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 20%;
border-top-width: 1rpx;
border-left-width: 1rpx;
border-bottom-width: 1rpx;
border-right-width: 1rpx;
border-style: solid;
border-color: #07bb07;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.tki-tree-check-yes-b {
width: 12px;
height: 12px;
border-top-left-radius: 20%;
border-top-right-radius: 20%;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 20%;
background-color: #07bb07;
}
.tki-tree-check .radio {
border-top-left-radius: 50%;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-bottom-left-radius: 50%;
}
.tki-tree-check .radio .tki-tree-check-yes-b {
border-top-left-radius: 50%;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-bottom-left-radius: 50%;
}
.hover-c {
opacity: 0.6;
}
.search {
position: absolute;
left: 35rpx;
}
/* 基础输入框样式 */
.uni-input {
width: 95%;
height: 60rpx;
line-height: 60rpx;
border-radius: 20rpx;
/* font-size: 32rpx;
color: #333;
background: #f5f5f5;
width: 100%;
padding: 0 24rpx 0 60rpx;
box-sizing: border-box;
border: none; */
}
/* 聚焦态样式 */
.uni-input:focus {
background: #fff;
border: 2rpx solid #007aff;
}
/* 占位符样式 */
.uni-input::placeholder {
color: #999;
font-size: 28rpx;
}
/* 兼容微信小程序 */
.uni-input::-webkit-input-placeholder {
color: #999;
font-size: 28rpx;
}

View File

@@ -1,80 +1,290 @@
<template>
<uni-card
:title="device.equipmentName"
:sub-title="device.mac"
:extra="device.isPrimaryUser == 1 ? '主设备' : '分享设备'"
padding="0"
@click="jump(device)"
:thumbnail="deviceIcon(device.runStatus)"
>
<template v-slot:title>
<slot name="title"></slot>
</template>
<view class="device-body">
<view class="device-body-item">
<text>工程名称</text>
<text>{{ device.engineeringName }}</text>
</view>
<view class="device-body-item mt6">
<text>项目名称</text>
<text>{{ device.projectName }}</text>
</view>
<view class="device-body-item mt6" v-if="device.process == 2 || device.process == 3">
<text>调试阶段</text>
<text>{{ device.process == 2 ? '功能调试' : '出厂调试' }}</text>
</view>
</view>
</uni-card>
</template>
<script>
export default {
data() {
return {}
},
props: {
device: {
type: Object,
default: () => {},
},
},
methods: {
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device_success.png'
break
default:
str = '/static/device_success.png'
break
}
return str
},
jump() {
console.log(12321,this.device);
uni.navigateTo({
url:
'/pages/device/APF/detail?id=' +
this.device.equipmentId +
'&isPrimaryUser=' +
this.device.isPrimaryUser +
'&process=' +
this.device.process + '&ndid=' + this.device.ndid,
})
},
},
}
</script>
<style lang="scss">
.device-body {
padding: 20rpx;
.device-body-item {
display: flex;
justify-content: space-between;
}
}
</style>
<template>
<uni-card :title="device.equipmentName" :sub-title="device.mac" :extra="device.isPrimaryUser == 1 ? '主设备' : '分享设备'"
padding="0" @click="jump(device)" class="boxClick" :thumbnail="deviceIcon(device.runStatus)">
<template v-slot:title>
<!-- 卡片标题 -->
<view class="uni-card__header" @click="jump(device)">
<view class="uni-card__header-box">
<view class="uni-card__header-avatar">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
:type="
device.devType == 'Direct_Connected_Device'
? 'icon-zaixianjianceshebei'
: 'icon-shebei1'
"
:color="device.runStatus == 1 ? '#ff3b30' : '#10B981'"
:size="device.devType == 'Direct_Connected_Device' ? '35' : '40'"
></uni-icons> -->
<Cn-icon-device :devType="device.devType" :runStatus="device.runStatus"
:alarmStatus="device.isAlarm ? 1 : 0"></Cn-icon-device>
</view>
</view>
<view class="uni-card__header-content">
<text class="uni-card__header-content-title uni-ellipsis">
{{ device.equipmentName }}
</text>
<!-- <text class="uni-card__header-content-subtitle uni-ellipsis">
{{ device.mac }}
</text> -->
<view class="event-desc mt10 mb8">
<text>
工程名称{{ device.engineeringName }}
</text>
<text>
项目名称{{ device.projectName }}
</text>
</view>
<view class="tagBox">
<text class="event-tag" :class="device.runStatus == 1 ? 'lx-tag' : 'zx-tag'">
{{ device.runStatus == 1 ? '离线' : '在线' }}
</text>
<text class="event-tag"
:class="device.devType == 'Direct_Connected_Device' ? 'zl-tag' : 'jc-tag'">
{{ device.devType == 'Direct_Connected_Device' ? '治理设备' : '监测设备' }}
</text>
<text class="event-tag" :class="device.isPrimaryUser == 1 ? 'z-tag' : 'fx-tag'">
{{ device.isPrimaryUser == 1 ? '我的设备' : '他人设备' }}
</text>
</view>
</view>
</view>
<view class="uni-card__header-extra" style="position: relative" @click.stop>
<text class="uni-card__header-extra-text"></text>
<slot name="title"></slot>
</view>
</view>
<!-- <slot name="title"></slot> -->
</template>
<!-- <view class="device-body">
<view class="device-body-item">
<text>工程名称</text>
<text>{{ device.engineeringName }}</text>
</view>
<view class="device-body-item mt6">
<text>项目名称</text>
<text>{{ device.projectName }}</text>
</view>
<view class="device-body-item mt6" v-if="device.process == 2 || device.process == 3">
<text>调试阶段</text>
<text>{{ device.process == 2 ? '功能调试' : '出厂调试' }}</text>
</view>
</view> -->
<view class="pinToTop" v-if="device.isTop == 1"> 置顶</view>
</uni-card>
</template>
<script>
export default {
data() {
return {}
},
props: {
device: {
type: Object,
default: () => {
},
},
},
methods: {
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device_success.png'
break
default:
str = '/static/device_success.png'
break
}
return str
},
jump() {
if (this.device.devType == 'Direct_Connected_Device') {
uni.navigateTo({
url:
'/pages/device/APF/detail?id=' +
this.device.equipmentId +
'&isPrimaryUser=' +
this.device.isPrimaryUser +
'&process=' +
this.device.process +
'&ndid=' +
this.device.ndid +
'&device=' +
JSON.stringify(this.device),
})
} else {
if (this.device.lineList.length == 0) {
return this.$util.toast('暂无监测点!')
}
uni.navigateTo({
url: '/pages/device/realTime/index?device=' + JSON.stringify(this.device),
})
}
},
getColor(status, type) {
if (status == 1) {
return '#ff3b3020'
} else {
return '#10b98120' //type == 'Direct_Connected_Device' ? '#10b98120' : ''
}
},
},
}
</script>
<style lang="scss">
.device-body {
padding: 10rpx 20rpx 20rpx;
.device-body-item {
display: flex;
justify-content: space-between;
font-size: 28rpx;
color: #666666;
line-height: 1.2;
}
}
.uni-card {
/deep/ .uni-card__header-box {
display: flex;
flex: 1;
flex-direction: row;
align-items: center;
overflow: hidden;
}
/deep/ .uni-card__header {
display: flex;
// border-bottom: 2rpx #ebeef5 solid;
flex-direction: row;
align-items: center;
padding: 20rpx 0;
overflow: hidden;
}
}
.uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title {
font-size: 30rpx;
color: #3a3a3a;
font-weight: 700;
}
.uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-subtitle {
margin-top: 15rpx;
font-size: 24rpx;
// margin-top: 5px;
color: #666666;
}
.uni-card .uni-card__header .uni-card__header-avatar .uni-card__header-avatar-image {
width: 40px;
height: 40px;
overflow: hidden;
border-radius: 5px;
margin-right: 10px;
}
.uni-card .uni-card__header .uni-card__header-content {
display: flex;
flex-direction: column;
justify-content: center;
flex: 1;
overflow: hidden;
}
.tagBox {
display: flex;
gap: 15rpx;
}
.event-icon {
position: relative;
width: 100rpx;
height: 100rpx;
border-radius: 12rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 20rpx;
}
.event-tag {
font-size: 22rpx;
padding: 2rpx 10rpx;
border-radius: 8rpx;
margin-top: 5rpx;
// height: 38rpx;
}
// 在线
.zx-tag {
background-color: #10b98120;
color: #10b981;
}
.lx-tag {
background-color: #ff3b3020;
color: #ff3b30;
}
.z-tag {
background-color: #2563eb20;
color: #2563eb;
}
.fx-tag {
background-color: #90939920;
color: #909399;
}
.zl-tag {
// background-color: #007aff20;
// color: #007aff;
background-color: #007aff20;
color: #007aff;
}
.jc-tag {
background-color: #007aff20;
color: #007aff;
}
.pinToTop {
background-color: $uni-theme-color;
width: 100rpx;
height: 60rpx;
line-height: 90rpx;
text-align: center;
color: #fff;
font-size: 20rpx;
position: absolute;
top: 0rpx;
right: 0rpx;
position: absolute;
top: 0;
right: 0;
/* 核心:旋转成斜三角效果 */
transform: rotate(45deg) translate(50rpx, -10rpx);
transform-origin: top right;
}
.event-desc {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.event-desc text {
font-size: 28rpx;
color: #666666;
line-height: 1.2;
}
</style>

View File

@@ -0,0 +1,346 @@
<template>
<view class="nav choose">
<view class="nav-menu nav-menu1" @click="selectEngineering" v-if="showQianTree">
<view class="nav-text">
{{
select.engineeringName || select.projectName || select.deviceName || select.lineName
? [select.engineeringName, select.projectName, select.deviceName, select.lineName]
.filter((item) => item && item !== '')
.join('>')
: '全部工程'
}}
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
<!-- 弹框组件 -->
<Cn-qianTree
ref="qiantree"
:selectParent="true"
:multiple="false"
:range="list"
:foldAll="true"
:singleChoice="singleChoice"
@confirm="treeConfirm"
@cancel="treeCancel"
></Cn-qianTree>
<picker
mode="date"
:value="select.date"
:start="startDate"
fields="month"
:end="endDate"
@change="bindDateChange"
v-if="showDatetime"
>
<view class="nav-menu nav-menu1"
><view class="nav-text">
{{ select.date }}
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
</picker>
<!-- <uni-datetime-picker v-if="!showDatetime" v-model="select.range" type="daterange" :end="endDate">
<view class="nav-menu"
>{{ select.range[0] + '至' + select.range[1] }}
<uni-icons type="bottom" size="14"></uni-icons>
</view>
</uni-datetime-picker> -->
<picker
mode="date"
:value="select.range"
fields="year"
:end="endDate.slice(0, -6)"
@change="yearChange"
v-if="!showDatetime"
>
<view class="nav-menu nav-menu1"
><view class="nav-text">
{{ select.range }}
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
</picker>
<slot />
</view>
</template>
<script>
import { lineTree } from '@/common/api/device'
export default {
components: {},
props: {
level: { type: Number, default: 3 },
showDatetime: { type: Boolean, default: true },
singleChoice: { type: Boolean, default: false },
showQianTree: { type: Boolean, default: true },
},
data() {
const currentDate = this.getDate({
format: true,
})
const rangeDate = this.getDate({
format: true,
}).slice(0, -3)
console.log('🚀 ~ rangeDate:', rangeDate)
return {
select: {
engineeringName: '',
engineeringId: '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
date: currentDate,
range: rangeDate,
},
list: [],
}
},
created() {},
onShow() {},
mounted() {},
methods: {
getTree() {
this.clear()
lineTree().then((res) => {
let list = {}
if (this.singleChoice) {
let result = this.findFirstLevel(res.data)
console.log('🚀 ~ result:', result)
this.select.engineeringName = result.parents[0].name
this.select.engineeringId = result.parents[0].id //工程ID
this.select.projectName = result.parents[1].name
this.select.projectId = result.parents[1].id //項目ID
this.select.deviceName = result.parents[2].name
this.select.deviceId = result.parents[2].id //设备ID
this.select.lineName = result.node.name
this.select.lineId = result.node.id //测点ID
} else {
list = {
id: '',
pid: '0',
pids: '0',
name: '全部工程',
path: null,
provinceId: null,
cityId: null,
area: null,
remark: null,
sort: 0,
level: 0,
comFlag: null,
type: null,
lineType: null,
conType: null,
process: null,
isTop: 0,
children: [],
ndid: null,
}
}
this.list = this.filterTreeByLevel(this.singleChoice ? res.data : [list, ...res.data])
// this.findFirstLevel( this.list)
})
},
// 递归过滤函数去除level > 2的节点
filterTreeByLevel(tree) {
// 遍历每一个节点
return tree.map((node) => {
// 复制当前节点(避免修改原数据)
const newNode = { ...node }
// 如果当前节点有子节点并且当前节点的level <= 2因为level=2的节点的子节点是level=3需要过滤
if (newNode.children && newNode.children.length > 0) {
// 递归过滤子节点只保留子节点中level <= 2的
newNode.children = this.filterTreeByLevel(
newNode.children.filter((child) => child.level <= this.level),
)
}
return newNode
})
},
getDate(type) {
const date = new Date()
let year = date.getFullYear()
let month = date.getMonth() + 1
let day = date.getDate()
if (type === 'start') {
year = year - 10
} else if (type === 'end') {
year = year
}
month = month > 9 ? month : '0' + month
day = day > 9 ? day : '0' + day
return this.showDatetime ? `${year}-${month}` : `${year}-${month}-${day}`
},
bindDateChange(e) {
this.select.date = e.detail.value
},
yearChange(e) {
this.select.range = e.detail.value
},
selectEngineering() {
this.$refs.qiantree._show()
},
// 确定回调事件
treeConfirm(e) {
this.clear()
this.setSelect(e[0].rank, e[0].name, e[0].id)
e[0].parents.forEach((item) => {
this.setSelect(item.rank, item.name, item.id)
})
},
// 清空
clear() {
this.select.engineeringName = ''
this.select.engineeringId = '' //工程ID
this.select.projectName = ''
this.select.projectId = '' //項目ID
this.select.deviceName = ''
this.select.deviceId = '' //设备ID
this.select.lineName = ''
this.select.lineId = '' //测点ID
},
setSelect(rank, name, id) {
switch (rank) {
case 0:
this.select.engineeringId = id
this.select.engineeringName = name
break
case 1:
this.select.projectId = id
this.select.projectName = name
break
case 2:
this.select.deviceId = id
this.select.deviceName = name
break
case 3:
this.select.lineId = id
this.select.lineName = name
break
}
},
external(params) {
this.getTree()
// this.select.engineeringId = id
// this.select.engineeringName = name
this.select.engineeringName = params.engineeringName
this.select.engineeringId = params.engineeringId //工程ID
this.select.projectName = params.projectName
this.select.projectId = params.projectId //項目ID
this.select.deviceName = params.deviceName
this.select.deviceId = params.deviceId //设备ID
this.select.lineName = params.lineName
this.select.lineId = params.lineId //测点ID
},
// 取消回调事件
treeCancel(e) {
console.log(e)
},
findFirstLevel(list, parents = []) {
for (const item of list) {
// 当前就是 level=3
if (item.level === 3) {
return {
node: item, // 第一个 level=3
parents: parents, // 它的所有上级
}
}
// 递归子节点
if (item.children && item.children.length) {
const res = this.findFirstLevel(item.children, [...parents, item])
if (res) return res // 找到直接返回,不再循环
}
}
return null
},
},
computed: {
startDate() {
return this.getDate('start')
},
endDate() {
return this.getDate('end')
},
},
watch: {
select: {
handler(val, oldVal) {
if (this.loading) return
this.$emit('select', val)
},
deep: true,
immediate: true,
},
level: {
handler(val, oldVal) {
this.getTree()
},
deep: true,
immediate: true,
},
// showDatetime: {
// handler(val, oldVal) {
// if (val == false) {
// console.log("🚀 ~ this.select.range:", this.select.range)
// }
// },
// deep: true,
// },
},
}
</script>
<style lang="scss" scoped>
/deep/ .uni-date-editor {
width: 360rpx;
}
.nav-menu {
display: flex;
align-items: center;
}
// .nav-menu1 {
// max-width: calc(100vw - 150px);
// overflow: hidden !important;
// -webkit-line-clamp: 1;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
// white-space: nowrap;
// }
.nav-menu1 {
display: flex;
align-items: center;
max-width: calc(100vw - 150px);
}
/* 文字容器:单行溢出省略 */
.nav-text {
flex: 1;
overflow: hidden;
white-space: nowrap; /* 强制不换行 */
text-overflow: ellipsis;
// -webkit-line-clamp: 1;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
// white-space: nowrap;
line-height: 1;
}
</style>

View File

@@ -0,0 +1,234 @@
<template>
<view class="nav choose">
<view class="nav-menu nav-menu1" @click="selectEngineering" v-if="showQianTree">
<view class="nav-text">
{{ lineDisplayText }}
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
<view class="nav-menu nav-menu1" @click="selectEngineering" v-if="showQianTree">
<view class="nav-text">
{{
'指标配置'
}}
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
<!-- 弹框组件 -->
<Cn-MultipleTree ref="qiantree" :selectParent="true" :multiple="true" :range="list" :foldAll="true"
@confirm="treeConfirm" @cancel="treeCancel"></Cn-MultipleTree>
<slot />
</view>
</template>
<script>
import { lineTree } from '@/common/api/device'
export default {
components: {},
props: {
level: { type: Number, default: 3 },
singleChoice: { type: Boolean, default: false },
showQianTree: { type: Boolean, default: true },
},
data() {
return {
select: {
lineList: []//监测点id
},
list: [],
}
},
created() { },
onShow() { },
mounted() { },
methods: {
getTree() {
this.clear()
lineTree().then((res) => {
let list = {}
// if (this.singleChoice) {
// let result = this.findFirstLevel(res.data)
// } else {
// list = {
// id: '',
// pid: '0',
// pids: '0',
// name: '全部工程',
// path: null,
// provinceId: null,
// cityId: null,
// area: null,
// remark: null,
// sort: 0,
// level: 0,
// comFlag: null,
// type: null,
// lineType: null,
// conType: null,
// process: null,
// isTop: 0,
// children: [],
// ndid: null,
// }
// }
this.list = this.filterTreeByLevel(this.singleChoice ? res.data : [...res.data])
// this.findFirstLevel( this.list)
})
},
// 递归过滤函数去除level > 2的节点
filterTreeByLevel(tree) {
// 遍历每一个节点
return tree.map((node) => {
// 复制当前节点(避免修改原数据)
const newNode = { ...node }
// 如果当前节点有子节点并且当前节点的level <= 2因为level=2的节点的子节点是level=3需要过滤
if (newNode.children && newNode.children.length > 0) {
// 递归过滤子节点只保留子节点中level <= 2的
newNode.children = this.filterTreeByLevel(
newNode.children.filter((child) => child.level <= this.level),
)
}
return newNode
})
},
selectEngineering() {
this.$refs.qiantree._show()
},
// 确定回调事件
treeConfirm(e) {
this.select.lineList = e.filter(item => item.rank == 3)
},
// 清空
clear() {
this.select.lineList = []//监测点id
},
// 取消回调事件
treeCancel(e) {
console.log(e)
},
findFirstLevel(list, parents = []) {
for (const item of list) {
// 当前就是 level=3
if (item.level === 3) {
return {
node: item, // 第一个 level=3
parents: parents, // 它的所有上级
}
}
// 递归子节点
if (item.children && item.children.length) {
const res = this.findFirstLevel(item.children, [...parents, item])
if (res) return res // 找到直接返回,不再循环
}
}
return null
},
},
computed: {
lineDisplayText() {
const list = this.select.lineList || []
if (!list.length) {
return '全部工程'
}
const text = list
.map((item) => item.name)
.filter(Boolean)
.join('、')
if (text.length > 8) {
return text.slice(0, 8) + '...'
}
return text
},
},
watch: {
select: {
handler(val, oldVal) {
console.log("🚀 ~ val:", val)
if (this.loading) return
this.$emit('select', val)
},
deep: true,
immediate: true,
},
level: {
handler(val, oldVal) {
this.getTree()
},
deep: true,
immediate: true,
},
// showDatetime: {
// handler(val, oldVal) {
// if (val == false) {
// console.log("🚀 ~ this.select.range:", this.select.range)
// }
// },
// deep: true,
// },
},
}
</script>
<style lang="scss" scoped>
/deep/ .uni-date-editor {
width: 360rpx;
}
.nav-menu {
display: flex;
align-items: center;
}
// .nav-menu1 {
// max-width: calc(100vw - 150px);
// overflow: hidden !important;
// -webkit-line-clamp: 1;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
// white-space: nowrap;
// }
.nav-menu1 {
display: flex;
align-items: center;
max-width: calc(100vw - 150px);
}
/* 文字容器:单行溢出省略 */
.nav-text {
flex: 1;
overflow: hidden;
white-space: nowrap;
/* 强制不换行 */
text-overflow: ellipsis;
// -webkit-line-clamp: 1;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
// white-space: nowrap;
line-height: 1;
}
</style>

View File

@@ -0,0 +1,130 @@
<template>
<view v-html="svgHtml" class="svg-container"></view>
</template>
<script>
export default {
props: {
// 父组件传递的参数
devType: {
type: String,
default: 'Direct_Connected_Device',
},
runStatus: {
type: [String, Number],
},
alarmStatus: {
type: [String, Number],
},
},
data() {
return {
// 动态颜色
powerColor: '#10b981',
// alarmStatus==1?'#f59e0b':'#10b981': '#f59e0b', //告警
// commColor: '#10B981', //在线离线
// 动态数据
}
},
computed: {
svgHtml() {
if (this.devType == 'Direct_Connected_Device') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<!-- 设备主体 - 治理设备主题色(绿色) -->
<rect x="2" y="2" width="96" height="96" rx="6" ry="6" fill="#007aff30" stroke="#007aff" stroke-width="2"/>
<!-- 屏幕区域 -->
<rect x="6" y="6" width="88" height="52" rx="3" ry="3" fill="#FFFFFF" stroke="#007aff" stroke-width="1.5"/>
<!-- 屏幕标题栏 - 调整高度以容纳14px文字 -->
<rect x="10" y="9" width="80" height="14" rx="2" ry="2" fill="#007aff30" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="20" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#007aff" text-anchor="middle">治理设备</text>
<!-- 下降趋势折线(从高到低,拉满宽度) -->
<polyline points="14,28 22,34 30,32 38,40 46,38 54,46 62,44 70,50 78,48 86,52"
fill="none" stroke="#007aff" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
<!-- 趋势填充区域(完全覆盖屏幕下方) -->
<polygon points="14,28 22,34 30,32 38,40 46,38 54,46 62,44 70,50 78,48 86,52 86,54 14,54"
fill="#007aff15"/>
<!-- 数据节点圆点(增强数据感) -->
<circle cx="14" cy="28" r="1.5" fill="#007aff"/>
<circle cx="30" cy="32" r="1.5" fill="#007aff"/>
<circle cx="46" cy="38" r="1.5" fill="#007aff"/>
<circle cx="62" cy="44" r="1.5" fill="#007aff"/>
<circle cx="78" cy="48" r="1.5" fill="#007aff"/>
<circle cx="86" cy="52" r="1.5" fill="#007aff"/>
<!-- 下降箭头(增强趋势指向) -->
<polygon points="88,48 86,52 84,48" fill="#007aff" opacity="0.7"/>
<!-- 指示灯区域分隔线 -->
<line x1="6" y1="62" x2="94" y2="62" stroke="#999" stroke-width="1" stroke-dasharray="2,2"/>
<!-- 告警指示灯 -->
<circle cx="28" cy="70" r="6" fill="${this.alarmStatus==1?'#f59e0b':'#10b981'}" stroke="${this.alarmStatus==1?'#f59e0b':'#10b981'}" stroke-width="1"/>
<text x="28" y="92" font-family="Arial, sans-serif" font-size="13" font-weight="bold" fill="#007aff" text-anchor="middle">告警</text>
<!-- 通讯指示灯 -->
<circle cx="70" cy="70" r="6" fill="${this.runStatus == 1 ? '#ff3b30' : '#10b981'}" stroke="${this.runStatus == 1 ? '#ff3b30' : '#10b981'}" stroke-width="1"/>
<text x="70" y="92" font-family="Arial, sans-serif" font-size="13" font-weight="bold" fill="#007aff" text-anchor="middle">通讯</text>
</svg>`
} else {
return `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<style>
text { font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif; }
</style>
<!-- 设备主体 -->
<rect x="2" y="2" width="96" height="96" rx="6" ry="6" fill="#007aff30" stroke="#007aff" stroke-width="2"/>
<!-- 屏幕区域 -->
<rect x="6" y="6" width="88" height="52" rx="3" ry="3" fill="#FFFFFF" stroke="#007aff" stroke-width="1.5"/>
<!-- 屏幕标题栏 - 调整高度 -->
<rect x="10" y="9" width="80" height="14" rx="2" ry="2" fill="#007aff30" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="20" font-size="13" font-weight="bold" fill="#007aff" text-anchor="middle">监测设备</text>
<!-- 左侧电压数据 - 调整Y位置 -->
<text x="10" y="34" font-size="7" fill="#007aff">Ua: 220.5V</text>
<text x="10" y="43" font-size="7" fill="#007aff">Ub: 219.8V</text>
<text x="10" y="52" font-size="7" fill="#007aff">Uc: 220.1V</text>
<!-- 竖向分隔线 -->
<line x1="52" y1="26" x2="52" y2="55" stroke="#CCC" stroke-width="0.8" stroke-dasharray="1.5,1.5"/>
<!-- 右侧电流数据 -->
<text x="58" y="34" font-size="7" fill="#007aff">Ia: 125.3A</text>
<text x="58" y="43" font-size="7" fill="#007aff">Ib: 124.7A</text>
<text x="58" y="52" font-size="7" fill="#007aff">Ic: 125.1A</text>
<!-- 指示灯区域分隔线 -->
<line x1="6" y1="62" x2="94" y2="62" stroke="#999" stroke-width="1" stroke-dasharray="2,2"/>
<!-- 告警指示灯 -->
<circle cx="28" cy="70" r="6" fill="${this.alarmStatus==1?'#f59e0b':'#10b981'}" stroke="${this.alarmStatus==1?'#f59e0b':'#10b981'}" stroke-width="1"/>
<text x="28" y="92" font-size="13" font-weight="bold" fill="#007aff" text-anchor="middle">告警</text>
<!-- 通讯指示灯 -->
<circle cx="70" cy="70" r="6" fill="${this.runStatus == 1 ? '#ff3b30' : '#10b981'}" stroke="${this.runStatus == 1 ? '#ff3b30' : '#10b981'}" stroke-width="1"/>
<text x="70" y="92" font-size="13" font-weight="bold" fill="#007aff" text-anchor="middle">通讯</text>
</svg>
`
}
},
},
methods: {},
}
</script>
<style scoped>
.svg-container {
width: 100rpx;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@@ -0,0 +1,41 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<!-- 设备主体 -->
<rect x="2" y="2" width="96" height="96" rx="6" ry="6" fill="#E8E8E8" stroke="#333" stroke-width="2"/>
<!-- 屏幕区域 -->
<rect x="6" y="6" width="88" height="52" rx="3" ry="3" fill="#FFFFFF" stroke="#333" stroke-width="1.5"/>
<!-- 屏幕标题栏(代替品牌标识) -->
<rect x="10" y="9" width="80" height="10" rx="2" ry="2" fill="#F0F0F0" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="17" font-family="Arial, sans-serif" font-size="7" font-weight="bold" fill="#333" text-anchor="middle">电能质量监测</text>
<!-- 屏幕内容 - 左侧参数 -->
<text x="10" y="28" font-family="Arial, sans-serif" font-size="6" fill="#000">Ua:220.5V</text>
<text x="10" y="36" font-family="Arial, sans-serif" font-size="6" fill="#000">Ub:219.8V</text>
<text x="10" y="44" font-family="Arial, sans-serif" font-size="6" fill="#000">Uc:220.1V</text>
<text x="10" y="52" font-family="Arial, sans-serif" font-size="6" fill="#000">Hz:50.02</text>
<!-- 垂直分隔线 -->
<line x1="52" y1="22" x2="52" y2="55" stroke="#CCC" stroke-width="0.8" stroke-dasharray="1.5,1.5"/>
<!-- 右侧参数 -->
<text x="58" y="28" font-family="Arial, sans-serif" font-size="6" fill="#000">Ia:125.3A</text>
<text x="58" y="36" font-family="Arial, sans-serif" font-size="6" fill="#000">Ib:124.7A</text>
<text x="58" y="44" font-family="Arial, sans-serif" font-size="6" fill="#000">Ic:125.1A</text>
<text x="58" y="52" font-family="Arial, sans-serif" font-size="6" fill="#000">PF:0.98</text>
<!-- 指示灯区域分隔线 -->
<line x1="6" y1="62" x2="94" y2="62" stroke="#999" stroke-width="1" stroke-dasharray="2,2"/>
<!-- 电源灯 -->
<circle cx="20" cy="76" r="5" fill="#10b981" stroke="#10b981" stroke-width="1"/>
<text x="20" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">电源</text>
<!-- 运行灯 -->
<circle cx="50" cy="76" r="5" fill="#999999" stroke="#333" stroke-width="1"/>
<text x="50" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">运行</text>
<!-- 通讯灯(原通信灯,已改名) -->
<circle cx="80" cy="76" r="5" fill="#999999" stroke="#333" stroke-width="1"/>
<text x="80" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">通讯</text>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@@ -0,0 +1,148 @@
<template>
<view v-html="svgHtml" class="svg-container"></view>
</template>
<script>
export default {
props: {
// 父组件传递的参数
name: {
type: String,
default: '',
},
},
data() {
return {}
},
computed: {
svgHtml() {
if (this.name == '电压暂降') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<path d="M8,50 L15,50 L18,38 L21,28 L24,38 L27,50 L30,62 L33,72 L36,62 L39,50 L42,38 L45,28 L48,38 L51,50 L54,56 L56,54 L58,55 L60,54 L63,56 L66,60 L68,62 L70,60 L72,56 L75,54 L77,52 L79,54 L81,56 L84,50 L87,38 L90,28 L93,38 L96,50" fill="none" stroke="#2563eb" stroke-width="4"/>
</svg>`
} else if (this.name == '电压暂升') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<path d="M8,50 L15,50 L18,38 L21,28 L24,38 L27,50 L30,62 L33,72 L36,62 L39,50 L42,38 L45,28 L48,38 L51,50 L54,43 L56,34 L58,26 L60,34 L63,43 L66,54 L68,60 L70,54 L72,43 L75,34 L77,26 L79,34 L81,43 L84,50 L87,38 L90,28 L93,38 L96,50" fill="none" stroke="#e6a23c" stroke-width="4"/>
</svg>`
} else if (this.name == '电压中断') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<path d="M8,50 L15,50 L18,38 L21,28 L24,38 L27,50 L30,62 L33,72 L36,62 L39,50 L42,38 L45,28 L48,38 L51,50 L54,50 L57,50 L60,50 L63,50 L66,50 L69,50 L72,50 L75,50 L78,50 L81,50 L84,50 L87,38 L90,28 L93,38 L96,50" fill="none" stroke="#6b7280" stroke-width="4"/>
</svg>`
} else if (this.name == '瞬态') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<path d="M8,50 L15,50 L18,38 L21,28 L24,38 L27,50 L30,62 L33,72 L36,62 L39,50 L42,38 L45,28 L48,38 L51,50 L53,50 L55,50 L57,20 L59,50 L61,50 L63,50 L66,60 L68,62 L70,60 L72,56 L75,54 L77,52 L79,54 L81,56 L84,50 L87,38 L90,28 L93,38 L96,50" fill="none" stroke="#8b5cf6" stroke-width="4"/>
</svg>`
} else if (this.name == '未知') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<path d="M8,50 L15,50 L18,38 L21,28 L24,38 L27,50 L30,62 L33,72 L36,62 L39,50 L42,38 L45,28 L48,38 L51,50 L54,56 L56,54 L58,55 L60,54 L63,56 L66,60 L68,62 L70,60 L72,56 L75,54 L77,52 L79,54 L81,56 L84,50 L87,38 L90,28 L93,38 L96,50" fill="none" stroke="#6b7280" stroke-width="4"/>
<text x="50" y="82" text-anchor="middle" font-size="18" fill="#6b7280" font-family="Arial, sans-serif" font-weight="bold">?</text>
</svg>`
} else if (this.name == '稳态越限') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<!-- Limit line -->
<line x1="5" y1="40" x2="95" y2="40" stroke="#e6a23c" stroke-width="2" stroke-dasharray="4,4"/>
<polyline points="
5,65 12,65 15,59 18,53 21,59 24,65
27,71 30,77 33,71 36,65
39,59 42,53 45,59 48,65
" fill="none" stroke="#376cf3" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
<polyline points="
51,40 54,20 57,40
" fill="none" stroke="#e6a23c" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
<polyline points="
60,65 63,71 66,77 69,71 72,65
75,59 78,53 81,59 84,65
87,71 90,77 93,71 95,65
" fill="none" stroke="#376cf3" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
<line x1="48" y1="65" x2="51" y2="40" stroke="#376cf3" stroke-width="4" stroke-linecap="round"/>
<line x1="57" y1="40" x2="60" y2="65" stroke="#376cf3" stroke-width="4" stroke-linecap="round"/>
<circle cx="54" cy="18" r="2" fill="#e6a23c"/>
<defs>
<marker id="arrowRed" markerWidth="6" markerHeight="5" refX="5" refY="2.5" orient="auto">
<polygon points="0,0 6,2.5 0,5" fill="#e6a23c"/>
</marker>
</defs>
</svg>`
} else if (this.name == '运行告警') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="40" height="40">
<path d="M78.43 4H20.06C9.48 4 1.16 12.33 1.16 22.9v38.37c0 10.57 8.32 18.9 18.9 18.9h26.49v7.27H25.77v7.41h47.96v-7.41H53.96v-7.27h26.47c10.58 0 18.9-8.33 18.9-18.9V22.9c0-10.57-8.32-18.9-18.9-18.9z m11.49 57.27c0 6.33-5.14 11.49-11.49 11.49H20.06c-6.34 0-11.49-5.15-11.49-11.49V22.9c0-6.33 5.14-11.49 11.49-11.49h59.37c6.34 0 11.49 5.15 11.49 11.49v38.37z" fill="#007aff"/>
<line x1="50" y1="28" x2="50" y2="50" stroke="#007aff" stroke-width="6" stroke-linecap="round"/>
<circle cx="50" cy="62" r="4" fill="#007aff"/>
</svg>`
} else if (this.name == '治理设备') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="38" height="38">
<rect x="0" y="0" width="100" height="100" rx="8" ry="8" fill="#007aff30" stroke="#007aff" stroke-width="2"/>
<rect x="8" y="8" width="84" height="84" rx="4" ry="4" fill="#FFFFFF" stroke="#007aff" stroke-width="1.5"/>
<rect x="10" y="12" width="80" height="16" rx="2" ry="2" fill="#007aff30" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="24" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#007aff" text-anchor="middle">治理设备</text>
<polyline points="14,45 22,51 30,49 38,57 46,55 54,63 62,61 70,67 78,65 86,69"
fill="none" stroke="#007aff" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
<polygon points="14,45 22,51 30,49 38,57 46,55 54,63 62,61 70,67 78,65 86,69 86,80 14,80"
fill="#007aff15"/>
<circle cx="14" cy="45" r="2" fill="#007aff"/>
<circle cx="30" cy="49" r="2" fill="#007aff"/>
<circle cx="46" cy="55" r="2" fill="#007aff"/>
<circle cx="62" cy="61" r="2" fill="#007aff"/>
<circle cx="78" cy="65" r="2" fill="#007aff"/>
<circle cx="86" cy="69" r="2" fill="#007aff"/>
<polygon points="88,65 86,70 84,65" fill="#007aff" opacity="0.7"/>
</svg>`
} else if (this.name == '监测设备') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="38" height="38">
<style>
text { font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif; }
</style>
<rect x="0" y="0" width="100" height="100" rx="6" ry="6" fill="#007aff30" stroke="#007aff" stroke-width="2"/>
<rect x="8" y="8" width="84" height="84" rx="3" ry="3" fill="#FFFFFF" stroke="#007aff" stroke-width="1.5"/>
<rect x="10" y="12" width="80" height="16" rx="2" ry="2" fill="#007aff30" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="24" font-size="14" font-weight="bold" fill="#007aff" text-anchor="middle">监测设备</text>
<text x="16" y="45" font-size="7" fill="#007aff">Ua: 220.5V</text>
<text x="16" y="55" font-size="7" fill="#007aff">Ub: 219.8V</text>
<text x="16" y="65" font-size="7" fill="#007aff">Uc: 220.1V</text>
<line x1="48" y1="38" x2="48" y2="78" stroke="#CCC" stroke-width="0.8" stroke-dasharray="2,2"/>
<text x="54" y="45" font-size="7" fill="#007aff">Ia: 125.3A</text>
<text x="54" y="55" font-size="7" fill="#007aff">Ib: 124.7A</text>
<text x="54" y="65" font-size="7" fill="#007aff">Ic: 125.1A</text>
</svg>`
} else if (this.name == '报告') {
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="47" height="47">
<path d="M12,12 L78,12 L88,22 L88,88 L12,88 Z" fill="none" stroke="#007aff" stroke-width="4" stroke-linejoin="round"/>
<path d="M78,12 L78,22 L88,22" fill="none" stroke="#007aff" stroke-width="4" stroke-linejoin="round"/>
<polyline points="20,50 26,50 28,46 30,42 32,46 34,50 36,54 38,58 40,54 42,50 44,46 46,42 48,46 50,50 56,50" fill="none" stroke="#007aff" stroke-width="4" stroke-linecap="round"/>
<line x1="20" y1="68" x2="52" y2="68" stroke="#007aff" stroke-width="4" opacity="0.4" stroke-linecap="round"/>
<line x1="20" y1="76" x2="42" y2="76" stroke="#007aff" stroke-width="4" opacity="0.4" stroke-linecap="round"/>
<circle cx="70" cy="68" r="9" fill="none" stroke="#007aff" stroke-width="4"/>
<line x1="76" y1="74" x2="86" y2="84" stroke="#007aff" stroke-width="4" stroke-linecap="round"/>
</svg>`
} else if (this.name == '监测点') {
return `<svg t="1779762122379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3577" width="38" height="38"><path d="M875.17148 230.296136c30.706152 56.294611 46.059227 122.824606 46.059227 194.472293 0 107.47153-40.941535 209.825369-107.47153 286.590748 0 0 0 5.117692-5.117692 5.117692l-261.002288 286.590748c0 5.117692-5.117692 10.235384-5.117692 10.235383-15.353076 10.235384-30.706152 15.353076-46.059227 5.117692-5.117692 0-10.235384-5.117692-15.353076-10.235384v-5.117691L209.87153 716.476869s-5.117692-5.117692-5.117692-10.235384c-66.529995-76.765379-102.353838-174.001525-102.353838-281.473056C102.4 189.354601 286.636909 0 511.815354 0c81.883071 0 153.530758 25.58846 220.060752 66.529995 5.117692 0 5.117692 5.117692 10.235384 5.117692h5.117692c46.059227 35.823843 81.883071 81.883071 112.589222 133.05999 10.235384 5.117692 15.353076 15.353076 15.353076 25.588459z m-163.766141-92.118454c-5.117692 0-10.235384-5.117692-15.353076-10.235384-51.176919-35.823843-112.589222-56.294611-179.119217-56.294611-189.354601 0-337.767667 158.64845-337.767667 353.120742 0 92.118455 30.706152 174.001525 87.000762 235.413829l20.470768 20.470767 20.470768 20.470768 143.295374 153.530758L511.815354 931.41993l71.647687-76.765379 143.295373-153.530758 5.117692-5.117692 35.823844-40.941535c0-5.117692 5.117692-5.117692 10.235384-5.117692 51.176919-61.412303 81.883071-143.295374 81.88307-230.296136-5.117692-112.589222-66.529995-214.943061-148.413065-281.473056z m-199.589985 460.592273c-92.118455 0-163.766141-76.765379-163.766142-174.001526C348.049212 332.649975 419.696899 255.884596 511.815354 255.884596c92.118455 0 163.766141 76.765379 163.766141 174.001525 0 92.118455-71.647687 168.883833-163.766141 168.883834z m0-271.237672c-51.176919 0-97.236146 46.059227-97.236147 102.353838s46.059227 102.353838 97.236147 102.353839c51.176919 0 97.236146-46.059227 97.236146-102.353839s-46.059227-102.353838-97.236146-102.353838z" fill="#007aff" p-id="3578"></path></svg>`
}
},
},
methods: {},
}
</script>
<style scoped>
.svg-container {
width: 100rpx;
display: flex;
justify-content: center;
align-items: center;
}
</style>

View File

@@ -0,0 +1,41 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
<!-- 设备主体 -->
<rect x="2" y="2" width="96" height="96" rx="6" ry="6" fill="#E8E8E8" stroke="#333" stroke-width="2"/>
<!-- 屏幕区域 -->
<rect x="6" y="6" width="88" height="52" rx="3" ry="3" fill="#FFFFFF" stroke="#333" stroke-width="1.5"/>
<!-- 屏幕标题栏(代替品牌标识) -->
<rect x="10" y="9" width="80" height="10" rx="2" ry="2" fill="#F0F0F0" stroke="#CCC" stroke-width="0.8"/>
<text x="50" y="17" font-family="Arial, sans-serif" font-size="7" font-weight="bold" fill="#333" text-anchor="middle">电能质量监测</text>
<!-- 屏幕内容 - 左侧参数 -->
<text x="10" y="28" font-family="Arial, sans-serif" font-size="6" fill="#000">Ua:220.5V</text>
<text x="10" y="36" font-family="Arial, sans-serif" font-size="6" fill="#000">Ub:219.8V</text>
<text x="10" y="44" font-family="Arial, sans-serif" font-size="6" fill="#000">Uc:220.1V</text>
<text x="10" y="52" font-family="Arial, sans-serif" font-size="6" fill="#000">Hz:50.02</text>
<!-- 垂直分隔线 -->
<line x1="52" y1="22" x2="52" y2="55" stroke="#CCC" stroke-width="0.8" stroke-dasharray="1.5,1.5"/>
<!-- 右侧参数 -->
<text x="58" y="28" font-family="Arial, sans-serif" font-size="6" fill="#000">Ia:125.3A</text>
<text x="58" y="36" font-family="Arial, sans-serif" font-size="6" fill="#000">Ib:124.7A</text>
<text x="58" y="44" font-family="Arial, sans-serif" font-size="6" fill="#000">Ic:125.1A</text>
<text x="58" y="52" font-family="Arial, sans-serif" font-size="6" fill="#000">PF:0.98</text>
<!-- 指示灯区域分隔线 -->
<line x1="6" y1="62" x2="94" y2="62" stroke="#999" stroke-width="1" stroke-dasharray="2,2"/>
<!-- 电源灯 -->
<circle cx="20" cy="76" r="5" fill="#10b981" stroke="#10b981" stroke-width="1"/>
<text x="20" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">电源</text>
<!-- 运行灯 -->
<circle cx="50" cy="76" r="5" fill="#999999" stroke="#333" stroke-width="1"/>
<text x="50" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">运行</text>
<!-- 通讯灯(原通信灯,已改名) -->
<circle cx="80" cy="76" r="5" fill="#999999" stroke="#333" stroke-width="1"/>
<text x="80" y="90" font-family="Arial, sans-serif" font-size="8" font-weight="bold" fill="#333" text-anchor="middle">通讯</text>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@@ -1,63 +1,63 @@
<template>
<view class="Cn-page" :class="{ 'no-padding': noPadding }">
<template v-if="showLoginMsk && !login">
<navigator url="/pages/user/login" hover-class="none" class="page-login-btn">登录</navigator>
</template>
<template v-else>
<zero-loading v-if="loading" mask></zero-loading>
<slot name="body" v-if="beforeRender|| !loading "></slot>
</template>
</view>
</template>
<script>
export default {
name: 'Cn-page',
props: {
loading: {
type: Boolean,
default: false,
},
beforeRender: {
type: Boolean,
default: false,
},
showLoginMsk: Boolean,
noPadding: Boolean,
},
data() {
return {
login: false,
}
},
created() {
this.login = uni.getStorageSync('Authorization')
},
}
</script>
<style lang="scss">
.Cn-page {
box-sizing: border-box;
padding-bottom: calc(30rpx + env(safe-area-inset-bottom));
}
.no-padding {
padding-bottom: 0;
}
.page-login-btn {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
height: 80rpx;
width: 200rpx;
display: flex;
align-items: center;
justify-content: center;
background: #449dff;
color: #fff;
border-radius: 4rpx;
}
</style>
<template>
<view class="Cn-page" :class="{ 'no-padding': noPadding }">
<template v-if="showLoginMsk && !login">
<navigator url="/pages/user/login" hover-class="none" class="page-login-btn">登录</navigator>
</template>
<template v-else>
<zero-loading v-if="loading" mask></zero-loading>
<slot name="body" v-if="beforeRender|| !loading "></slot>
</template>
</view>
</template>
<script>
export default {
name: 'Cn-page',
props: {
loading: {
type: Boolean,
default: false,
},
beforeRender: {
type: Boolean,
default: false,
},
showLoginMsk: Boolean,
noPadding: Boolean,
},
data() {
return {
login: false,
}
},
created() {
this.login = uni.getStorageSync('Authorization')
},
}
</script>
<style lang="scss">
.Cn-page {
box-sizing: border-box;
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
}
.no-padding {
padding-bottom: 0;
}
.page-login-btn {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
height: 80rpx;
width: 200rpx;
display: flex;
align-items: center;
justify-content: center;
background: #449dff;
color: #fff;
border-radius: 4rpx;
}
</style>

View File

@@ -0,0 +1,550 @@
<template xlang="wxml">
<view class="tki-tree">
<view class="tki-tree-mask" :class="{ show: showTree }" @tap="_cancel"></view>
<view class="tki-tree-cnt" :class="{ show: showTree }">
<view class="tki-tree-bar">
<view class="tki-tree-bar-cancel" :style="{ color: cancelColor }" hover-class="hover-c" @tap="_cancel"
>取消</view
>
<view class="tki-tree-bar-title" :style="{ color: titleColor }">{{ title }}</view>
<view
class="tki-tree-bar-confirm"
:style="{ color: confirmColor }"
hover-class="hover-c"
@tap="_confirm"
>确定</view
>
</view>
<view class="tki-tree-bar1">
<uni-search-bar
class="uni-input"
radius="5"
placeholder="请输入关键字搜索"
clearButton="none"
@input="input"
/>
<!-- <uni-search-bar
v-model="searchValue"
clearButton="none"
bgColor="#fff"
placeholder="请输入关键词"
@input="input"
></uni-search-bar> -->
</view>
<view class="tki-tree-view">
<scroll-view class="tki-tree-view-sc" :scroll-y="true">
<block v-for="(item, index) in treeList" :key="index">
<view
class="tki-tree-item"
:style="[
{
paddingLeft: item.rank * 15 + 'px',
zIndex: item.rank * -1 + 50,
},
]"
:class="{
border: border === true,
show: item.show,
last: item.lastRank,
showchild: item.showChild,
open: item.open,
}"
>
<view class="tki-tree-label" @tap.stop="_treeItemTap(item, index)">
<image
class="tki-tree-icon"
:src="item.lastRank ? lastIcon : item.showChild ? currentIcon : defaultIcon"
></image>
{{ item.name }}
</view>
<view
class="tki-tree-check"
@tap.stop="_treeItemSelect(item, index)"
v-if="selectParent ? true : item.lastRank"
>
<view
class="tki-tree-check-yes"
v-if="item.checked && (singleChoice ? item.rank == 3 : true)"
:class="{ radio: !multiple }"
:style="{ 'border-color': confirmColor }"
>
<view
class="tki-tree-check-yes-b"
:style="{ 'background-color': confirmColor }"
></view>
</view>
<view
class="tki-tree-check-no"
v-if="!item.checked && (singleChoice ? item.rank == 3 : true)"
:class="{ radio: !multiple }"
:style="{ 'border-color': confirmColor }"
></view>
</view>
</view>
</block>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'tki-tree',
props: {
lazy: {
type: Boolean,
default: false,
},
range: {
type: Array,
default: function () {
return []
},
},
idKey: {
type: String,
default: 'id',
},
singleChoice: { type: Boolean, default: false },
rangeKey: {
type: String,
default: 'name',
},
title: {
type: String,
default: '',
},
multiple: {
// 是否可以多选
type: Boolean,
default: false,
// default: true
},
selectParent: {
//是否可以选父级
type: Boolean,
default: false,
},
foldAll: {
//折叠时关闭所有已经打开的子集,再次打开时需要一级一级打开
type: Boolean,
default: false,
},
confirmColor: {
// 确定按钮颜色
type: String,
default: '#376cf3', // #07bb07
},
cancelColor: {
// 取消按钮颜色
type: String,
default: '', // #757575
},
titleColor: {
// 标题颜色
type: String,
default: '', // #757575
},
currentIcon: {
// 展开时候的ic
type: String,
default:
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAABRCAYAAACqj0o2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEQ0QTM0MzQ1Q0RBMTFFOUE0MjY4NzI1Njc1RjI1ODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEQ0QTM0MzU1Q0RBMTFFOUE0MjY4NzI1Njc1RjI1ODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowRDRBMzQzMjVDREExMUU5QTQyNjg3MjU2NzVGMjU4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowRDRBMzQzMzVDREExMUU5QTQyNjg3MjU2NzVGMjU4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PidwepsAAAK0SURBVHja7JxbTsJAFIYHww7ciStgCeoGvGxAiOsgURegoL5720AXYLiIr0aJviq3Zx3PhIEnKG3ndtr+f3KixrSUj/ZjzjClIqUUiFm2gAAQAREQEUAEREAERAQQAREQAREBREAEREBEEqa67h9RFDWllDv0awWYlqlQHmu1WjMRRMoV1QFttA12y3xRtdNczq8EsE4/f8FumX2q77ROvNXk8UGMEKdUz6tYJHljaZAbuyUH+UR1to5BEohTuqwPCeS4pAA/qY6o/kyHOAMCeRK3owJnj+rH1jjxhqpVsstaebCz6TmnHWyXyY+xHjSBWBY/bvSgadtXBj9u9KCN3rnIfkzkQVsTEEX0Y2IP2oKo/HhMICcFAThUcwVZNGU6FdbX/XURzkbVF4+ybGhjPrFdgP66QdXNurGtSdk6Xdb9nAJ8oDo3OQlsQZzkdPw41ONBo6vI5scDefRjZg+6gpg3Pxp50CXEvPjR2IOuIXL3oxUPuobI3Y9WPOgDIlc/WvOgL4iL/vqFCcD7LH0xB4hj7cfQ/fWH9qCT+FhG0tN+DBk1PzjOM0SVllixcsBT1AvYc/kAPhc0hRg/3uvxoCgKRN9+dOrBUBB9+9GpB0NC9OVH5x4MDdG1H714kANEV3705kEOEBf9dcPi/lQnsuvLg1wgSu3Ha0v7Uh4MMgUXeuG71H407a+VBy9CPQkOdw+MtB+nGbd/D+FBbhBNxo9SjwcngJjNj0E9yBFiFj8G9SBXiGn8GNyDnCEm8SMLD3KHGOdHNh7kDjHOj2w8mAeIi/5arX+c6b/fxHz9oADEdGdjR/fXCw/OOB5oVfCOgnepz8IB14PMw03jCmTE+QBx5z0gAmKSqK9OUF+hcAeIhu/QYr4Qie8rjW83hhMBERARQAREQAREBBABERCLnH8BBgA+TQI7U4t53AAAAABJRU5ErkJggg==',
},
defaultIcon: {
// 折叠时候的ic
type: String,
default:
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAABRCAYAAACqj0o2AAACE0lEQVR4Xu3c200DMRCF4XEltJAOkEugA+ggpUAHoQMqiFMCdEAJUMEiS4mEELlIO7bPOeN9i6K1rG/952myyea1WiCtXmEuYBPR4RBMxInoIOCwhOtJLKVszWyXc/5y2BvNEq6I+/3+kFK6M7OHnPM7jcLKjbZAvD/uaZtzflm5P4rbWyJWgDcze1LPuzVihfxUz7sH4ilJ2bx7Isrm3RtRMu8RiHJ5j0SUyXs0okTeCIj0eSMh0uaNhkiZNyIiXd7IiDR5oyNS5M2ACJ83EyJs3myIkHkzIsLlzYwIkzc7IkTeCojD81ZCHJa3GuKQvBURu+etjNgtb3XELnlHQGyedyTEZnlHQ2ySd0RE97wjI7rlHR3RJe+JeIrbLOecD6ePpZQ6W1kn2epo4MUrPOKyLN8ppYq1+y1VStncOjIdGnFZlo+U0uOtWOeOY2TE12Ouq//pEA7xXL7XfvcufR8K0Svfv6CREN3yDYfYIt9QiK3yjYTYLF95xB75SiP2ylcZsVu+cogj8pVCHJWvEuKwfOkREfKlRkTJlxkRJl86RMR8qRBR82VChM0XHpEhX2hElnyREWnyhUNkzBcKkTVfJETafIcjKuQ7FFEl35GIMvl2R1TMtyuiar49EWXzbY5oZpv/hibXTF2h3+s60FRKeT6+3TjMS3nrA3ZFRD8xrfY3ER1kJ+JEdBBwWGKeRAfEH1wS5WFZSDB/AAAAAElFTkSuQmCC',
},
lastIcon: {
// 没有子集的ic
type: String,
default: '',
},
border: {
// 是否有分割线
type: Boolean,
default: false,
},
},
data() {
return {
showTree: false,
treeList: [],
selectIndex: -1,
returnedItem: [], //定义一个空数组
pids: [],
ancestorsIds: [],
childNums: [],
dataTree: [],
inputTimer: null, // 节流定时器标识
searchValue: '',
}
},
computed: {},
methods: {
_show() {
this.showTree = true
if (this.searchValue != '') {
this.searchValue = ''
this.input('')
}
},
_hide() {
this.showTree = false
},
_cancel() {
this._hide()
this.$emit('cancel', '')
},
_confirm() {
// 处理所选数据
let rt = [],
obj = {}
this.treeList.forEach((v, i) => {
if (this.treeList[i].checked) {
// rt.push(this.treeList[i].id)
rt.push(this.treeList[i])
}
})
this._hide()
console.log('🚀 ~ rt:', rt)
if (rt.length == 0) return
if (this.singleChoice) {
if (rt[0].rank != 3) return
}
this.$emit('confirm', rt)
},
//扁平化树结构
_renderTreeList(list = [], rank = 0, parentId = [], parents = []) {
list.forEach((item) => {
this.treeList.push({
id: item[this.idKey],
name: item[this.rangeKey],
source: item,
parentId, // 父级id数组
parents, // 父级id数组
rank, // 层级
showChild: false, //子级是否显示
open: false, //是否打开
show: rank === 0, // 自身是否显示
hideArr: [],
orChecked: item.checked ? item.checked : false,
checked: item.checked ? item.checked : false,
childNum: 0,
})
if (Array.isArray(item.children) && item.children.length > 0) {
let parentid = [...parentId],
parentArr = [...parents]
delete parentArr.children
parentid.push(item[this.idKey])
parentArr.push({
[this.idKey]: item[this.idKey],
[this.rangeKey]: item[this.rangeKey],
rank: rank,
})
// lazy
if (!this.lazy) {
this._renderTreeList(item.children, rank + 1, parentid, parentArr)
}
} else {
this.treeList[this.treeList.length - 1].lastRank = true
}
})
},
// 处理默认选择
_defaultSelect() {
this.treeList.forEach((v, i) => {
if (v.checked) {
this.treeList.forEach((v2, i2) => {
if (v.parentId.toString().indexOf(v2.parentId.toString()) >= 0) {
v2.show = true
if (v.parentId.includes(v2.id)) {
v2.showChild = true
v2.open = true
}
}
})
}
})
},
getOwn(id, arr) {
//利用foreach循环遍历
arr.forEach((item) => {
//判断递归结束条件
if (item[this.idKey] == id) {
// 存储数据到空数组
this.returnedItem = item
} else if (item.children != null) //判断chlidren是否有数据
{
//递归调用
this.getOwn(id, item.children)
}
})
return this.returnedItem
},
setShow(id, arr, isShow) {
arr.forEach((item, index) => {
if (item.parentId.includes(id)) {
this.treeList[index].showChild = isShow
this.treeList[index].show = isShow
} else if (item.children !== undefined) {
this.setShow(id, item.children, isShow)
}
})
},
// 点击
_treeItemTap(item, index) {
// console.log(item)
if (item.lastRank === true) {
//点击最后一级时触发事件
this.treeList[index].checked = !this.treeList[index].checked
this._fixMultiple(index)
return
}
let id = item.id
item.showChild = !item.showChild
// qingqian
if (item.showChild) {
// const range = this.range
const range = this.dataTree
const parentIdArr = item.parentId
// 找到当前元素
const own = this.getOwn(id, range)
const checkedChildren = own.children
// 子元素插入的索引位置
const nextIndex = this.treeList.findIndex((itemT) => itemT.id === item.id)
console.log(checkedChildren)
if (checkedChildren === undefined || checkedChildren.length < 1) {
return
}
// 子节点数量
this.treeList[index].childNum = checkedChildren.length
const newRank = item.rank + 1
checkedChildren.forEach((itemC) => {
const childObj = {
id: itemC[this.idKey],
name: itemC[this.rangeKey],
source: {},
parentId: [item.id], // 父级id数组
parents: [item], // 父级id数组
rank: newRank, // 层级
showChild: false, //子级是否显示
open: false, //是否打开
show: 1, // 自身是否显示
hideArr: [],
orChecked: this.treeList[index].checked,
checked: this.treeList[index].checked,
}
if (!this.treeList.some((itemT) => itemT.id === itemC[this.idKey])) {
this.treeList.splice(nextIndex + 1, 0, childObj)
}
})
}
// 展开/隐藏子级/孙级
let list = this.treeList
item.open = item.showChild ? true : !item.open
list.forEach((childItem, i) => {
if (item.showChild === false) {
//隐藏所有子级
if (!childItem.parentId.includes(id)) {
return
}
//TODO: 修改
if (!this.foldAll) {
if (childItem.lastRank !== true && !childItem.open) {
childItem.showChild = false
this.setShow(childItem.id, this.treeList, false)
}
// 为隐藏的内容添加一个标记
if (childItem.show) {
childItem.hideArr[item.rank] = id
}
} else {
if (childItem.lastRank !== true) {
childItem.showChild = false
// 继续隐藏子级的的子级
this.setShow(childItem.id, this.treeList, false)
}
}
if (childItem.children !== undefined) {
childItem.children.forEach((childItem1, i1) => {
if (!childItem1.parentId.includes(childItem.id)) {
return
}
childItem.children[i1].showChild = false
childItem.children[i1].show = false
})
}
childItem.show = false
} else {
// 打开子集
if (childItem.parentId[childItem.parentId.length - 1] === id) {
childItem.show = true
}
// 打开被隐藏的子集
if (childItem.parentId.includes(id) && !this.foldAll) {
// console.log(childItem.hideArr)
if (childItem.hideArr[item.rank] === id) {
childItem.show = true
if (childItem.open && childItem.showChild) {
childItem.showChild = true
} else {
childItem.showChild = false
}
childItem.hideArr[item.rank] = null
}
}
}
})
},
// 通过父id处理子级
syncChecked(trees, pid, checked) {
trees.forEach((item, index) => {
if (item.parentId.includes(pid)) {
this.treeList[index].checked = checked
this.syncChecked(trees, item.id, checked)
} else if (item.children !== undefined) {
this.syncChecked(item.children, pid, checked)
}
})
},
// 获取父级往上所有层级的id 并同步状态
setAncestors(pids, checked) {
this.treeList.forEach((item, index) => {
if (pids.includes(item.id)) {
if (checked && this.childNums[item.id] !== undefined && item.childNum === this.childNums[item.id]) {
// 子级全部选中, 父级才选中
this.treeList[index].checked = true
} else {
this.treeList[index].checked = false
}
this.setAncestors(item.parentId, checked)
}
})
},
_treeItemSelect(item, index) {
if (item.rank != 3) {
if (this.singleChoice) return
}
// if(this.singleChoice)
this.treeList[index].checked = !this.treeList[index].checked
// 选父级, 子级自动全选
this.syncChecked(this.treeList, item.id, this.treeList[index].checked)
if (item.rank > 0) {
item.parentId.forEach((pid, indexP) => {
const parent = this.treeList.filter((i) => i.id === pid)
const childNum = parent.length > 0 ? parent[0].childNum : 0
if (this.childNums[pid] === undefined) {
this.childNums[pid] = 1
} else if (this.childNums[pid] < childNum) {
this.childNums[pid]++
}
})
//子级选择/选满/取消选择, 父级往上同步状态
this.setAncestors(item.parentId, this.treeList[index].checked)
}
this._fixMultiple(index)
},
// 处理单选多选
_fixMultiple(index) {
if (!this.multiple) {
// 如果是单选
this.treeList.forEach((v, i) => {
if (i != index) {
this.treeList[i].checked = false
} else {
this.treeList[i].checked = true
}
})
}
},
// 重置数据
_reTreeList() {
this.treeList.forEach((v, i) => {
this.treeList[i].checked = v.orChecked
})
},
_initTree(range = this.range) {
this.treeList = []
this.dataTree = JSON.parse(JSON.stringify(range))
this._renderTreeList(range)
this.$nextTick(() => {
this._defaultSelect(range)
})
},
// 筛选
input(val) {
// 清除上一次的定时器,避免频繁执行
if (this.inputTimer) {
clearTimeout(this.inputTimer)
}
// 设置新的定时器,指定延迟后执行过滤逻辑
this.inputTimer = setTimeout(() => {
const keyword = val
// 执行树形过滤和初始化
this._initTree(this.filterNodes(this.range, keyword))
// 清空定时器标识
clearTimeout(this.inputTimer)
this.inputTimer = null
}, 500)
// this._initTree(this.filterNodes(this.range, val.detail.value))
},
filterNodes(node, query) {
const keyword = query.trim() // 获取搜索关键字并转换为小写
const nodes = node
// 使用递归函数过滤树形数据
const filteredNodes = []
for (const node of nodes) {
if (node.name.includes(keyword)) {
// 如果节点的标签包含关键字,将其添加到结果中
filteredNodes.push(node)
} else if (node.children && node.children.length > 0) {
// 如果节点有子节点,则递归过滤子节点
const filteredChildren = this.filterNodes(node.children, keyword)
if (filteredChildren.length > 0) {
// 如果子节点中有匹配的结果,则添加父节点
const clonedNode = { ...node, children: filteredChildren }
filteredNodes.push(clonedNode)
}
}
}
return filteredNodes
},
},
watch: {
range(list) {
this._initTree(list)
},
multiple() {
if (this.range.length) {
this._reTreeList()
}
},
selectParent() {
if (this.range.length) {
this._reTreeList()
}
},
},
mounted() {
this._initTree()
},
}
</script>
<style lang="scss" scoped>
@import './style.css';
/deep/ .uni-searchbar__box {
justify-content: left !important;
}
</style>

View File

@@ -0,0 +1,195 @@
.tki-tree-mask {
position: fixed;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
z-index: 9998;
background-color: rgba(0, 0, 0, 0.6);
opacity: 0;
transition: all 0.3s ease;
visibility: hidden;
}
.tki-tree-mask.show {
visibility: visible;
opacity: 1;
}
.tki-tree-cnt {
position: fixed;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
z-index: 9999;
top: 40%;
transition: all 0.3s ease;
transform: translateY(100%);
}
.tki-tree-cnt.show {
transform: translateY(0);
}
.tki-tree-bar {
background-color: #fff;
height: 72rpx;
padding-left: 20rpx;
padding-right: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
border-bottom-width: 1rpx !important;
border-bottom-style: solid;
border-bottom-color: #f5f5f5;
font-size: 32rpx;
color: #757575;
line-height: 1;
}
.tki-tree-bar1 {
background-color: #fff;
}
.tki-tree-bar-confirm {
color: #07bb07;
}
.tki-tree-view {
position: absolute;
top: 0rpx;
right: 0rpx;
bottom: 0rpx;
left: 0rpx;
top: 160rpx;
background-color: #fff;
padding-top: 20rpx;
padding-right: 20rpx;
padding-bottom: 20rpx;
padding-left: 20rpx;
}
.tki-tree-view-sc {
height: 100%;
overflow: hidden;
}
.tki-tree-item {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 26rpx;
/* color: #757575; */
line-height: 1;
height: 0;
opacity: 0;
transition: 0.2s;
position: relative;
overflow: hidden;
}
.tki-tree-item.show {
height: 80rpx;
opacity: 1;
}
.tki-tree-item.showchild:before {
transform: rotate(90deg);
}
.tki-tree-item.last:before {
opacity: 0;
}
.tki-tree-icon {
width: 26rpx;
height: 26rpx;
margin-right: 8rpx;
}
.tki-tree-label {
flex: 1;
display: flex;
align-items: center;
height: 100%;
line-height: 1.2;
}
.tki-tree-check {
width: 40px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.tki-tree-check-yes,
.tki-tree-check-no {
width: 20px;
height: 20px;
border-top-left-radius: 20%;
border-top-right-radius: 20%;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 20%;
border-top-width: 1rpx;
border-left-width: 1rpx;
border-bottom-width: 1rpx;
border-right-width: 1rpx;
border-style: solid;
border-color: #07bb07;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.tki-tree-check-yes-b {
width: 12px;
height: 12px;
border-top-left-radius: 20%;
border-top-right-radius: 20%;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 20%;
background-color: #07bb07;
}
.tki-tree-check .radio {
border-top-left-radius: 50%;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-bottom-left-radius: 50%;
}
.tki-tree-check .radio .tki-tree-check-yes-b {
border-top-left-radius: 50%;
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
border-bottom-left-radius: 50%;
}
.hover-c {
opacity: 0.6;
}
.search {
position: absolute;
left: 35rpx;
}
/* 基础输入框样式 */
.uni-input {
width: 95%;
height: 60rpx;
line-height: 60rpx;
border-radius: 20rpx;
/* font-size: 32rpx;
color: #333;
background: #f5f5f5;
width: 100%;
padding: 0 24rpx 0 60rpx;
box-sizing: border-box;
border: none; */
}
/* 聚焦态样式 */
.uni-input:focus {
background: #fff;
border: 2rpx solid #007aff;
}
/* 占位符样式 */
.uni-input::placeholder {
color: #999;
font-size: 28rpx;
}
/* 兼容微信小程序 */
.uni-input::-webkit-input-placeholder {
color: #999;
font-size: 28rpx;
}

View File

@@ -0,0 +1,177 @@
<template>
<view class="content">
<picker
mode="multiSelector"
@change="bindPickerChange"
@columnchange="handleColumnChange"
:value="multiIndex"
:range="onlyYear ? yearsArray : multiArray"
>
<view class="time-season">
<text>
<text v-if="showMonth">{{ year + '-' + season }} </text>
<text v-else-if="year">{{ year + (year ? '' : '') + (onlyYear ? '' : season) }} </text>
<text v-else class="prompt">请选择时间 </text>
</text>
</view>
</picker>
</view>
</template>
<script>
export default {
props: {
yearsMin: {
type: Number,
default: 5,
},
yearsMax: {
type: Number,
default: 0,
},
onlyYear: {
type: Boolean,
default: false,
},
showMonth: {
type: Boolean,
default: false,
},
},
data() {
const now = new Date()
this.currentYear = now.getFullYear() // 保存当前年份
this.currentMonth = now.getMonth() + 1 // 保存当前月份1-12
this.currentSeason = Math.ceil(this.currentMonth / 3) // 保存当前季度1-4
const yearArr = this.handleYear()
const seasonArr = ['一季度', '二季度', '三季度', '四季度']
const monthArr = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12']
return {
multiArray: [yearArr, this.showMonth ? monthArr : seasonArr],
multiIndex: [this.handleYear(true), 0],
yearsArray: [yearArr],
year: '',
season: '',
// 原始完整的时间数组(用于恢复)
fullMonthArr: [...monthArr],
fullSeasonArr: [...seasonArr]
}
},
created() {
const now = new Date()
this.year = now.getFullYear().toString()
const month = now.getMonth() + 1
// 初始化时就过滤当前年份的时间范围
this.updateTimeRange(this.currentYear)
if (this.showMonth) {
this.multiIndex = [5, month - 1]
this.season = month < 10 ? `0${month}` : `${month}`
} else {
let key = 0
if (month >= 1 && month <= 3) {
key = 0
this.season = '一季度'
} else if (month >= 4 && month <= 6) {
key = 1
this.season = '二季度'
} else if (month >= 7 && month <= 9) {
key = 2
this.season = '三季度'
} else {
key = 3
this.season = '四季度'
}
this.multiIndex = [5, key]
}
this.$emit('timeSeasonC', {
year: this.year,
season: this.season,
})
},
methods: {
// 处理年份
handleYear(nowYearIndex) {
let optionsArray = []
let years = new Date().getFullYear()
for (let i = years - this.yearsMin; i <= years + this.yearsMax; i++) {
optionsArray.push(i)
}
if (nowYearIndex) {
return optionsArray.indexOf(years)
}
return optionsArray
},
// 列变化事件:切换年份时动态调整时间范围
handleColumnChange(e) {
// 只有切换第一列(年份列)时才处理
if (e.detail.column === 0) {
const selectedYear = this.multiArray[0][e.detail.value]
// 更新时间范围(月份/季度)
this.updateTimeRange(selectedYear)
// 修正索引:如果当前选中的时间超出新范围,重置为最后一个选项
const timeLength = this.multiArray[1].length
if (this.multiIndex[1] >= timeLength) {
this.multiIndex[1] = timeLength - 1
}
}
},
// 核心:根据选中年份更新时间范围
updateTimeRange(selectedYear) {
if (this.onlyYear) return // 只选年份时无需处理
if (selectedYear === this.currentYear) {
// 当前年份:只显示到当前月/当前季度
if (this.showMonth) {
// 过滤月份只保留1到当前月
this.multiArray[1] = this.fullMonthArr.slice(0, this.currentMonth)
} else {
// 过滤季度只保留1到当前季度
this.multiArray[1] = this.fullSeasonArr.slice(0, this.currentSeason)
}
} else {
// 非当前年份:恢复完整的时间数组
this.multiArray[1] = this.showMonth ? [...this.fullMonthArr] : [...this.fullSeasonArr]
}
},
// 确认选择时间
bindPickerChange: function (e) {
this.multiIndex = e.detail.value
this.year = this.multiArray[0][this.multiIndex[0]]
if (this.onlyYear) {
this.$emit('timeSeasonC', { year: this.year })
} else {
this.season = this.multiArray[1][this.multiIndex[1]]
this.$emit('timeSeasonC', {
year: this.year,
season: this.season,
})
}
},
},
}
</script>
<style>
.content {
width: 100%;
height: 62rpx !important;
box-sizing: border-box;
background-color: #fff;
padding: 10rpx 20rpx;
line-height: 38rpx;
border: 1px solid #e5e5e5;
border-radius: 10rpx;
}
.time-season {
font-size: 28rpx;
}
.prompt {
font-size: 24rpx;
color: grey;
}
</style>

File diff suppressed because one or more lines are too long

44
main.js
View File

@@ -1,21 +1,23 @@
import App from './App'
import util from './common/js/util'
import request from './common/js/request'
import config from './common/js/config'
import cacheKey from './common/js/cacheKey'
import Vue from 'vue'
import share from "@/common/js/share.js";
Vue.config.productionTip = false
Vue.prototype.$request = request
Vue.prototype.$util = util
Vue.prototype.$config = config
Vue.prototype.$cacheKey = cacheKey
Vue.mixin(share);
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
import App from './App'
import util from './common/js/util'
import request from './common/js/request'
import config from './common/js/config'
import cacheKey from './common/js/cacheKey'
import Vue from 'vue'
import share from '@/common/js/share.js'
import uView from 'uview-ui'
Vue.config.productionTip = false
Vue.prototype.$request = request
Vue.prototype.$util = util
Vue.prototype.$config = config
Vue.prototype.$cacheKey = cacheKey
Vue.mixin(share)
Vue.use(uView)
uni.$u.config.unit = 'rpx'
App.mpType = 'app'
const app = new Vue({
...App,
})
app.$mount()

View File

@@ -2,8 +2,8 @@
"name" : "灿能物联",
"appid" : "__UNI__88BC25B",
"description" : "",
"versionName" : "1.6.81",
"versionCode" : 169,
"versionName" : "1.6.82",
"versionCode" : 170,
"transformPx" : false,
"sassImplementationName" : "node-sass",
/* 5+App */
@@ -138,8 +138,9 @@
"proxy" : {
"/api" : {
"https" : true,
"target" : "https://pqmcn.com:8092/api",
// "target" : "http://192.168.1.103:10215",
// "target" : "https://pqmcn.com:8092/api",
// "target" : "http://192.168.1.103:10215",
"target" : "http://192.168.1.103:10215",
"changOrigin" : true,
"pathRewrite" : {
"/api" : ""
@@ -153,6 +154,9 @@
},
"unipush" : {
"enable" : false
},
"sdkConfigs" : {
"maps" : {}
}
},
"mp-toutiao" : {

1611
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,30 +1,31 @@
{
"id": "yk-authpup",
"name": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"displayName": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"version": "1.0.5",
"description": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"keywords": [
"uniapp",
"华为上架",
"权限",
"权限申请",
"权限判断"
],
"dcloudext": {
"category": [
"前端组件",
"通用组件"
]
},
"dependencies": {
"crypto-js": "^4.2.0",
"echarts": "^5.6.0",
"html2canvas": "^1.4.1",
"image-tool": "^1.0.2",
"image-tools": "^1.4.0",
"jsrsasign": "^11.1.0",
"mqtt": "^3.0.0",
"pinyin-pro": "^3.26.0"
}
}
{
"id": "yk-authpup",
"name": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"displayName": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"version": "1.0.5",
"description": "解决软件在运行时,未见向用户告知权限申请的目的,华为等上架被拒问题",
"keywords": [
"uniapp",
"华为上架",
"权限",
"权限申请",
"权限判断"
],
"dcloudext": {
"category": [
"前端组件",
"通用组件"
]
},
"dependencies": {
"crypto-js": "^4.2.0",
"echarts": "^5.6.0",
"html2canvas": "^1.4.1",
"image-tool": "^1.0.2",
"image-tools": "^1.4.0",
"jsrsasign": "^11.1.0",
"mqtt": "^3.0.0",
"pinyin-pro": "^3.28.1",
"uview-ui": "^2.0.38"
}
}

View File

@@ -4,6 +4,7 @@
{
"path": "pages/index/index",
"style": {
"enablePullDownRefresh": true, // 开启下拉刷新
"navigationStyle": "custom",
"pullToRefresh": {
"support":true,
@@ -13,11 +14,47 @@
}
},
{
"path": "pages/index/message",
"path": "pages/index/message1",
"style": {
"navigationBarTitleText": "消息"
"navigationBarTitleText": "消息",
"enablePullDownRefresh": true, // 开启下拉刷新
"pullToRefresh": {
"support":true,
"style": "circle",
"color":"#007aff"
},
"app-plus": {
"bounce": "none",
//关闭窗口回弹效果
"titleNView": {
// 窗口的标题
"titleAlign": "center",
"padding-right": "20rpx",
"buttons": [
{
"text": "一键已读",
"fontSize": "28rpx",
"select": false,
"width": "auto"
}
]
}
}
}
},
{
"path": "pages/index/report",
"style": {
"navigationBarTitleText": "报表",
"enablePullDownRefresh": true, // 开启下拉刷新
"pullToRefresh": {
"support":true,
"style": "circle",
"color":"#007aff"
}
}
},
{
"path": "pages/index/mine",
"style": {
@@ -84,6 +121,13 @@
"navigationBarTitleText": "个性化推荐"
}
},
{
"path": "pages/index/comp/monitoringPoint",
"style": {
"navigationBarTitleText": "监测点电能质量信息"
}
},
{
"path": "pages/mine/system",
"style": {
@@ -130,7 +174,19 @@
"path": "pages/device/APF/detail",
"style": {
"navigationBarTitleText": "APF 设备名称 + 型号",
"enablePullDownRefresh": true
"enablePullDownRefresh": true,
"pullToRefresh": {
"support":true,
"style": "circle",
"color":"#007aff"
}
}
},
{
"path": "pages/device/realTime/index",
"style": {
"navigationBarTitleText": "实时数据"
// "enablePullDownRefresh": true
}
},
{
@@ -221,12 +277,36 @@
}
}
},
{
"path": "pages/message1/comp/preview",
"style": {
"navigationBarTitleText": "预览"
}
},
{
"path": "pages/message/messageDetail",
"style": {
"navigationBarTitleText": "暂态事件详情"
}
},
{
"path": "pages/message1/comp/transientDetails",
"style": {
"navigationBarTitleText": "暂态事件详情"
}
},
{
"path": "pages/message1/comp/steadyStateDetails",
"style": {
"navigationBarTitleText": "稳态事件详情"
}
},
{
"path": "pages/message1/comp/alarmDetails",
"style": {
"navigationBarTitleText": "运行告警详情"
}
},
{
"path": "pages/device/transfer",
"style": {
@@ -347,12 +427,19 @@
"navigationBarTitleText": "关注工程配置"
}
},
{
"path": "pages/mine/serverSetting",
"style": {
"navigationBarTitleText": "服务内容配置"
}
},
{
"path": "pages/mine/transientSetting",
"style": {
"navigationBarTitleText": "暂态事件配置"
}
},
{
"path": "pages/user/erweima",
"style": {
@@ -441,10 +528,16 @@
"text": "首页"
},
{
"pagePath": "pages/index/message",
"pagePath": "pages/index/message1",
"iconPath": "static/notice.png",
"selectedIconPath": "static/notice2.png",
"text": "消息"
},
{
"pagePath": "pages/index/report",
"iconPath": "static/reportIco.png",
"selectedIconPath": "static/reportIco1.png",
"text": "报表"
},
{
"pagePath": "pages/index/mine",
@@ -468,7 +561,8 @@
"easycom": {
"autoscan": true,
"custom": {
"^rc-(.*)": "@/components/Cn-$1/Cn-$1.vue"
"^rc-(.*)": "@/components/Cn-$1/Cn-$1.vue",
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
}
},
"condition": {

View File

@@ -1,62 +1,76 @@
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="about">
<view class="about-title">{{ deviceInfo.name }}</view>
<view class="about-text">设备类型{{ deviceInfo.devTypeName }}</view>
<view class="about-text">设备型号{{ deviceInfo.devModelName }}</view>
<view class="about-text"
>设备接入方式{{ deviceInfo.devAccessMethod === 'cloud' ? 'CLD' : 'MQTT' }}</view
>
<!-- <view class="about-text">设备注册时间永久使用</view> -->
<view class="about-text">程序版本{{ deviceInfo.programVersionName }}</view>
<view class="about-text">网络设备ID{{ deviceInfo.ndid }}</view>
</view>
</view>
</Cn-page>
</template>
<script>
import { queryDeivceById } from '@/common/api/device'
import { queryByCode, queryCsDictTree, queryByid, queryEdDataPage } from '@/common/api/dictionary'
export default {
data() {
return {
loading: true,
deviceInfo: {},
}
},
methods: {},
onLoad(options) {
queryDeivceById(options.id).then((res) => {
console.log(res)
this.deviceInfo = res.data[0]
queryByCode('Device_Type').then((res) => {
Promise.all([queryCsDictTree(res.data.id), queryByid(res.data.id), queryEdDataPage()]).then((resp) => {
console.log(resp)
this.deviceInfo.devTypeName = resp[0].data.find((item) => item.id === this.deviceInfo.devType)?.name
this.deviceInfo.devModelName = resp[1].data.find(
(item) => item.id === this.deviceInfo.devModel,
)?.name
this.loading = false
})
})
})
},
}
</script>
<style lang="scss">
.about {
padding: 34rpx;
.about-title {
font-size: 34rpx;
font-weight: bold;
color: #333333;
margin-bottom: 34rpx;
}
.about-text {
font-size: 28rpx;
color: #666666;
margin-bottom: 34rpx;
}
}
</style>
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="about">
<view class="about-title">{{ deviceInfo.name }}</view>
<view class="about-text">设备类型{{ deviceInfo.devTypeName }}</view>
<view class="about-text">设备型号{{ deviceInfo.devModelName }}</view>
<view class="about-text">设备接入方式{{ deviceInfo.devAccessMethod }}</view>
<!-- <view class="about-text">设备注册时间永久使用</view> -->
<view class="about-text">程序版本{{ deviceInfo.programVersionName }}</view>
<view class="about-text">网络设备ID{{ deviceInfo.ndid }}</view>
</view>
</view>
</Cn-page>
</template>
<script>
import { queryDeivceById } from '@/common/api/device'
import { queryByCode, queryCsDictTree, queryByid, queryEdDataPage } from '@/common/api/dictionary'
export default {
data() {
return {
loading: true,
deviceInfo: {},
}
},
methods: {},
onLoad(options) {
queryDeivceById(options.id).then((res) => {
this.deviceInfo = res.data[0]
if (this.deviceInfo.devAccessMethod == 'MQTT') {
queryByCode('Device_Type').then((res) => {
Promise.all([queryCsDictTree(res.data.id), queryByid(res.data.id), queryEdDataPage()]).then(
(resp) => {
this.deviceInfo.devTypeName = resp[0].data.find(
(item) => item.id === this.deviceInfo.devType,
)?.name
this.deviceInfo.devModelName = resp[1].data.find(
(item) => item.id === this.deviceInfo.devModel,
)?.name
this.loading = false
},
)
})
} else {
queryByCode('DEV_CLD').then((res) => {
this.deviceInfo.devTypeName = res.data.name
Promise.all([queryCsDictTree(res.data.id), queryByid(res.data.id), queryEdDataPage()]).then(
(resp) => {
this.deviceInfo.devModelName = resp[1].data.find(
(item) => item.id === this.deviceInfo.devModel,
)?.name
this.loading = false
},
)
})
}
})
},
}
</script>
<style lang="scss">
.about {
padding: 34rpx;
.about-title {
font-size: 34rpx;
font-weight: bold;
color: #333333;
margin-bottom: 34rpx;
}
.about-text {
font-size: 28rpx;
color: #666666;
margin-bottom: 34rpx;
}
}
</style>

View File

@@ -1,151 +1,153 @@
<template>
<view class="basic">
<view class="grid-card">
<view class="grid-card-title">温度</view>
<view class="grid-card-content-4">
<template v-for="item in renderData">
<view class="item item-title">{{ item[0].clDid }}
<template v-if="item[0].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[1].clDid }}
<template v-if="item[1].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[2].clDid }}
<template v-if="item[2].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[3].clDid }}
<template v-if="item[3].clDid"> (°C)</template>
</view>
<view class="item">{{ item[0].clDid ? Math.round(item[0].value) || '-' : '' }}</view>
<view class="item">{{ item[1].clDid ? Math.round(item[1].value) || '-' : '' }}</view>
<view class="item">{{ item[2].clDid ? Math.round(item[2].value) || '-' : '' }}</view>
<view class="item">{{ item[3].clDid ? Math.round(item[3].value) || '-' : '' }}</view>
</template>
</view>
</view>
<!-- 运维管理员工程用户 可看 -->
<view class="grid-card" v-if="userInfo.authorities=='operation_manager'||userInfo.authorities=='engineering_user'">
<view class="grid-card-title">状态</view>
<view class="grid-card-content-4">
<template v-for="(item, index) in moduleData">
<view class="item item-title">{{ item[0].moduleName }}
<template v-if="item[0].moduleName"></template>
</view>
<view class="item item-title">{{ item[1].moduleName }}
<template v-if="item[1].moduleName"></template>
</view>
<view class="item item-title">{{ item[2].moduleName }}
<template v-if="item[2].moduleName"></template>
</view>
<view class="item item-title">{{ item[3].moduleName }}
<template v-if="item[3].moduleName"></template>
</view>
<!-- <uni-tag :text="item[0].moduleState" :type=" item[0].moduleState=='离线'?'error' : 'success'" /> -->
<view class="item">{{ item[0].moduleState }}</view>
<view class="item">{{ item[1].moduleState }}</view>
<view class="item">{{ item[2].moduleState }}</view>
<view class="item">{{ item[3].moduleState }}</view>
</template>
</view>
</view>
<!-- <view class="grid-card">-->
<!-- <view class="grid-card-title">干接点</view>-->
<!-- <view class="grid-card-content-4">-->
<!-- <view class="item item-title">干接点1</view>-->
<!-- <view class="item item-title">干接点2</view>-->
<!-- <view class="item item-title"></view>-->
<!-- <view class="item item-title"></view>-->
<!-- <view class="item">正常</view>-->
<!-- <view class="item">正常</view>-->
<!-- <view class="item"></view>-->
<!-- <view class="item"></view>-->
<!-- </view>-->
<!-- </view>-->
</view>
</template>
<script>
import {
getModuleState
} from '@/common/api/harmonic.js'
export default {
props: {
IOData: {
type: Array,
default: () => {
return []
},
},
ndid: {
type: String,
},
},
data() {
return {
list: [],
userInfo: {},
flag: false
}
},
computed: {
renderData() {
let arr = []
// 把IOData转换成每4个一组的二维数组
for (let i = 0; i < this.IOData.length; i += 4) {
this.IOData.slice(i, i + 4).forEach((item) => {
if (Number.isInteger(item.value) || item.value == '') {} else {
item.value = (item.value - 0).toFixed(2)
}
})
arr.push(this.IOData.slice(i, i + 4))
}
// 把每组的长度补齐到4
arr.forEach((item) => {
if (item.length < 4) {
let length = 4 - item.length
for (let i = 0; i < length; i++) {
item.push({})
}
}
})
console.warn(arr)
return arr
},
moduleData() {
let arr = []
// 把IOData转换成每4个一组的二维数组
for (let i = 0; i < this.list.length; i += 4) {
arr.push(this.list.slice(i, i + 4))
}
// 把每组的长度补齐到4
arr.forEach((item) => {
if (item.length < 4) {
let length = 4 - item.length
for (let i = 0; i < length; i++) {
item.push({})
}
}
})
console.warn(arr)
return arr
},
},
methods: {
info() {
getModuleState({
id: this.ndid
}).then((res) => {
this.list = res.data
})
},
},
mounted() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.info()
},
}
</script>
<style lang="scss">
.basic {}
</style>
<template>
<view>
<uni-load-more status="loading" v-if="IOData.length == 0"></uni-load-more>
<view class="basic" v-else>
<view class="grid-card">
<view class="grid-card-title">温度</view>
<view class="grid-card-content-4">
<template v-for="item in renderData">
<view class="item item-title">{{ item[0].clDid }}
<template v-if="item[0].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[1].clDid }}
<template v-if="item[1].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[2].clDid }}
<template v-if="item[2].clDid"> (°C)</template>
</view>
<view class="item item-title">{{ item[3].clDid }}
<template v-if="item[3].clDid"> (°C)</template>
</view>
<view class="item">{{ item[0].clDid ? Math.round(item[0].value) || '-' : '' }}</view>
<view class="item">{{ item[1].clDid ? Math.round(item[1].value) || '-' : '' }}</view>
<view class="item">{{ item[2].clDid ? Math.round(item[2].value) || '-' : '' }}</view>
<view class="item">{{ item[3].clDid ? Math.round(item[3].value) || '-' : '' }}</view>
</template>
</view>
</view>
<!-- 运维管理员工程用户 可看 -->
<view class="grid-card"
v-if="(userInfo.authorities == 'operation_manager' || userInfo.authorities == 'engineering_user') && moduleData.length > 0">
<view class="grid-card-title">状态</view>
<view class="grid-card-content-4">
<template v-for="(item, index) in moduleData">
<view class="item item-title">{{ item[0].moduleName }}
<template v-if="item[0].moduleName"></template>
</view>
<view class="item item-title">{{ item[1].moduleName }}
<template v-if="item[1].moduleName"></template>
</view>
<view class="item item-title">{{ item[2].moduleName }}
<template v-if="item[2].moduleName"></template>
</view>
<view class="item item-title">{{ item[3].moduleName }}
<template v-if="item[3].moduleName"></template>
</view>
<!-- <uni-tag :text="item[0].moduleState" :type=" item[0].moduleState=='离线'?'error' : 'success'" /> -->
<view class="item">{{ item[0].moduleState }}</view>
<view class="item">{{ item[1].moduleState }}</view>
<view class="item">{{ item[2].moduleState }}</view>
<view class="item">{{ item[3].moduleState }}</view>
</template>
</view>
</view>
<!-- <view class="grid-card">-->
<!-- <view class="grid-card-title">干接点</view>-->
<!-- <view class="grid-card-content-4">-->
<!-- <view class="item item-title">干接点1</view>-->
<!-- <view class="item item-title">干接点2</view>-->
<!-- <view class="item item-title"></view>-->
<!-- <view class="item item-title"></view>-->
<!-- <view class="item">正常</view>-->
<!-- <view class="item">正常</view>-->
<!-- <view class="item"></view>-->
<!-- <view class="item"></view>-->
<!-- </view>-->
<!-- </view>-->
</view>
</view>
</template>
<script>
import { getModuleState } from '@/common/api/harmonic.js'
export default {
props: {
IOData: {
type: Array,
default: () => {
return []
},
},
ndid: {
type: String,
},
},
data() {
return {
list: [],
userInfo: {},
flag: false,
}
},
computed: {
renderData() {
let arr = []
// 把IOData转换成每4个一组的二维数组
for (let i = 0; i < this.IOData.length; i += 4) {
this.IOData.slice(i, i + 4).forEach((item) => {
if (Number.isInteger(item.value) || item.value == '') {
} else {
item.value = (item.value - 0).toFixed(2)
}
})
arr.push(this.IOData.slice(i, i + 4))
}
// 把每组的长度补齐到4
arr.forEach((item) => {
if (item.length < 4) {
let length = 4 - item.length
for (let i = 0; i < length; i++) {
item.push({})
}
}
})
return arr
},
moduleData() {
let arr = []
// 把IOData转换成每4个一组的二维数组
for (let i = 0; i < this.list.length; i += 4) {
arr.push(this.list.slice(i, i + 4))
}
// 把每组的长度补齐到4
arr.forEach((item) => {
if (item.length < 4) {
let length = 4 - item.length
for (let i = 0; i < length; i++) {
item.push({})
}
}
})
console.warn(arr)
return arr
},
},
methods: {
info() {
getModuleState({
id: this.ndid,
}).then((res) => {
this.list = res.data
})
},
},
mounted() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.info()
},
}
</script>
<style lang="scss">
.basic {}
</style>

View File

@@ -1,172 +1,184 @@
<template>
<view class="basic">
<view class="grid-card">
<view class="grid-card-title">电网电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Sys(A)'] > 0 ? item['Apf_RmsI_Sys(A)'].toFixed(2) : item['Apf_RmsI_Sys(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Sys(%)'] > 0 ? item['Apf_ThdA_Sys(%)'].toFixed(2) : item['Apf_ThdA_Sys(%)']
}}</view>
</template>
</view>
</view>
<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">电压(V)</view>
<view class="item item-title">频率(Hz)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电压">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_PhV_Sys(V)'] > 0 ? item['Apf_PhV_Sys(V)'].toFixed(2) : item['Apf_PhV_Sys(V)']
}}</view>
<view class="item">{{
item['Apf_Freq(Hz)'] > 0 ? item['Apf_Freq(Hz)'].toFixed(2) : item['Apf_Freq(Hz)']
}}</view>
<view class="item">{{
item['Apf_ThdU_Sys(%)'] > 0 ? item['Apf_ThdU_Sys(%)'].toFixed(2) : item['Apf_ThdU_Sys(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">负载电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.负载电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Load(A)'] > 0 ? item['Apf_RmsI_Load(A)'].toFixed(2) : item['Apf_RmsI_Load(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Load(%)'] > 0 ? item['Apf_ThdA_Load(%)'].toFixed(2) : item['Apf_ThdA_Load(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">补偿电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">负载率(%)</view>
<template v-for="(item, index) in renderData.补偿电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_TolOut(A)'] == 3.1415926 ? '-' :
item['Apf_RmsI_TolOut(A)'] > 0
? item['Apf_RmsI_TolOut(A)'].toFixed(2)
: item['Apf_RmsI_TolOut(A)']
}}</view>
<view class="item">{{
item['load_Rate'] == 3.1415926 ? '-' : item['load_Rate'] > 0 ? item['load_Rate'].toFixed(2) :
item['load_Rate']
}}</view>
</template>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
renderData: {
电网电流: [],
电网电压: [],
负载电流: [],
补偿电流: [],
未知: [],
},
}
},
props: {
basicData: {
type: Array,
default: () => {
return []
},
},
},
watch: {
basicData: {
handler: function (newVal, oldVal) {
newVal.forEach((item) => {
if (item.phase === 'avg') {
return
}
let key = ''
switch (item.statisticalName) {
case 'Apf_RmsI_Sys(A)':
key = '电网电流'
break
case 'Apf_ThdA_Sys(%)':
key = '电网电流'
break
case 'Apf_PhV_Sys(V)':
key = '电网电压'
break
case 'Apf_Freq(Hz)':
key = '电网电压'
break
case 'Apf_ThdU_Sys(%)':
key = '电网电'
break
case 'Apf_RmsI_Load(A)':
key = '负载电流'
break
case 'Apf_ThdA_Load(%)':
key = '负载电流'
break
case 'Apf_RmsI_TolOut(A)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'load_Rate':
key = '补偿电流'
break
default:
key = '未知'
break
}
let index = this.renderData[key].findIndex((item2) => {
return item2.phase === item.phase
})
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData //
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData, //,
})
}
})
console.log(this.renderData)
},
deep: true,
immediate: true,
},
},
methods: {},
}
</script>
<style lang="scss">
.basic {}
</style>
<template>
<view>
<uni-load-more status="loading"
v-if="renderData.电网电流.length == 0 || renderData.电网电压.length == 0 || renderData.负载电流.length == 0 || renderData.补偿电流.length == 0 "></uni-load-more>
<view class="basic" v-else>
<view class="grid-card">
<view class="grid-card-title">电网电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Sys(A)'] > 0 ? item['Apf_RmsI_Sys(A)'].toFixed(2) : item['Apf_RmsI_Sys(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Sys(%)'] > 0 ? item['Apf_ThdA_Sys(%)'].toFixed(2) : item['Apf_ThdA_Sys(%)']
}}</view>
</template>
</view>
</view>
<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">电压(V)</view>
<view class="item item-title">频率(Hz)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电压">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_PhV_Sys(V)'] > 0 ? item['Apf_PhV_Sys(V)'].toFixed(2) : item['Apf_PhV_Sys(V)']
}}</view>
<view class="item">{{
item['Apf_Freq(Hz)'] > 0 ? item['Apf_Freq(Hz)'].toFixed(2) : item['Apf_Freq(Hz)']
}}</view>
<view class="item">{{
item['Apf_ThdU_Sys(%)'] > 0 ? item['Apf_ThdU_Sys(%)'].toFixed(2) : item['Apf_ThdU_Sys(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">负载电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.负载电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Load(A)'] > 0
? item['Apf_RmsI_Load(A)'].toFixed(2)
: item['Apf_RmsI_Load(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Load(%)'] > 0
? item['Apf_ThdA_Load(%)'].toFixed(2)
: item['Apf_ThdA_Load(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">补偿电流</view>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">负载率(%)</view>
<template v-for="(item, index) in renderData.补偿电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_TolOut(A)'] == 3.1415926
? '-'
: item['Apf_RmsI_TolOut(A)'] > 0
? item['Apf_RmsI_TolOut(A)'].toFixed(2)
: item['Apf_RmsI_TolOut(A)']
}}</view>
<view class="item">{{
item['load_Rate'] == 3.1415926
? '-'
: item['load_Rate'] > 0
? item['load_Rate'].toFixed(2)
: item['load_Rate']
}}</view>
</template>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
renderData: {
电网电流: [],
电网电压: [],
负载电流: [],
补偿电流: [],
未知: [],
},
}
},
props: {
basicData: {
type: Array,
default: () => {
return []
},
},
},
watch: {
basicData: {
handler: function (newVal, oldVal) {
newVal.forEach((item) => {
if (item.phase === 'avg') {
return
}
let key = ''
switch (item.statisticalName) {
case 'Apf_RmsI_Sys(A)':
key = '电网电'
break
case 'Apf_ThdA_Sys(%)':
key = '电网电流'
break
case 'Apf_PhV_Sys(V)':
key = '电网电压'
break
case 'Apf_Freq(Hz)':
key = '电网电压'
break
case 'Apf_ThdU_Sys(%)':
key = '电网电压'
break
case 'Apf_RmsI_Load(A)':
key = '负载电流'
break
case 'Apf_ThdA_Load(%)':
key = '负载电流'
break
case 'Apf_RmsI_TolOut(A)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'load_Rate':
key = '补偿电流'
break
default:
key = '未知'
break
}
let index = this.renderData[key].findIndex((item2) => {
return item2.phase === item.phase
})
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData //
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData, //,
})
}
})
console.log(this.renderData)
},
deep: true,
immediate: true,
},
},
methods: {},
}
</script>
<style lang="scss">
.basic {}
</style>

View File

@@ -1,125 +1,134 @@
<template>
<view class="basic">
<view class="grid-card">
<view class="grid-card-title">电网侧</view>
<view class="grid-card-content-5">
<view class="item item-title">名称</view>
<view class="item item-title">有功功率(kW)</view>
<view class="item item-title">无功功率(kVar)</view>
<view class="item item-title">视在功率(kVA)</view>
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['Apf_P_Sys(W)'] == '-' ? '-' : (item['Apf_P_Sys(W)'] / 1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_Q_Sys(Var)'] == '-' ? '-' : (item['Apf_Q_Sys(Var)'] / 1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_S_Sys(VA)'] == '-' ? '-' : (item['Apf_S_Sys(VA)'] / 1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_PF_Sys(null)'] || '-' }}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">负载侧</view>
<view class="grid-card-content-5">
<view class="item item-title">名称</view>
<view class="item item-title">有功功率(kW)</view>
<view class="item item-title">无功功率(kVar)</view>
<view class="item item-title">视在功率(kVA)</view>
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.负载侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['Apf_P_Load(W)'] == '-' ? '-' : (item['Apf_P_Load(W)'] / 1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_Q_Load(Var)'] == '-' ? '-' : (item['Apf_Q_Load(Var)'] / 1000).toFixed(2)
}}</view>
<view class="item">{{ item['Apf_S_Load(VA)'] == '-' ? '-' : (item['Apf_S_Load(VA)'] / 1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_PF_Load(null)'] || '-' }}</view>
</template>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
renderData: {
电网侧: [],
负载侧: [],
未知: [],
},
}
},
props: {
basicData: {
type: Array,
default: () => {
return []
},
},
},
watch: {
basicData: {
handler: function (newVal, oldVal) {
newVal.forEach((item) => {
if (item.phase === 'avg') {
return
}
let key = ''
switch (item.statisticalName) {
case 'Apf_P_Sys(W)':
key = '电网侧'
break
case 'Apf_Q_Sys(Var)':
key = '电网侧'
break
case 'Apf_S_Sys(VA)':
key = '电网侧'
break
case 'Apf_PF_Sys(null)':
key = '电网侧'
break
case 'Apf_P_Load(W)':
key = '负载侧'
break
case 'Apf_Q_Load(Var)':
key = '负载侧'
break
case 'Apf_S_Load(VA)':
key = '负载侧'
break
case 'Apf_PF_Load(null)':
key = '负载侧'
break
default:
key = '未知'
break
}
let index = this.renderData[key].findIndex((item2) => {
return item2.phase === item.phase
})
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData || '-'
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData || '-',
})
}
})
console.log(this.renderData)
},
deep: true,
immediate: true,
},
},
methods: {},
}
</script>
<style lang="scss">
.basic {}
</style>
<template>
<view>
<uni-load-more status="loading" v-if="renderData.电网侧.length == 0 || renderData.负载侧.length == 0"></uni-load-more>
<view class="basic" v-else>
<view class="grid-card">
<view class="grid-card-title">电网侧</view>
<view class="grid-card-content-5">
<view class="item item-title">名称</view>
<view class="item item-title">有功功率(kW)</view>
<view class="item item-title">无功功率(kVar)</view>
<view class="item item-title">视在功率(kVA)</view>
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.电网侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['Apf_P_Sys(W)'] == '-' ? '-' : (item['Apf_P_Sys(W)'] /
1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_Q_Sys(Var)'] == '-' ? '-' : (item['Apf_Q_Sys(Var)'] /
1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_S_Sys(VA)'] == '-' ? '-' : (item['Apf_S_Sys(VA)'] /
1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_PF_Sys(null)'] || '-' }}</view>
</template>
</view>
</view>
<view class="grid-card">
<view class="grid-card-title">负载侧</view>
<view class="grid-card-content-5">
<view class="item item-title">名称</view>
<view class="item item-title">有功功率(kW)</view>
<view class="item item-title">无功功率(kVar)</view>
<view class="item item-title">视在功率(kVA)</view>
<view class="item item-title">功率因数</view>
<template v-for="(item, index) in renderData.负载侧">
<view class="item">{{ item.phase }}</view>
<view class="item">{{ item['Apf_P_Load(W)'] == '-' ? '-' : (item['Apf_P_Load(W)'] /
1000).toFixed(2) }}
</view>
<view class="item">{{
item['Apf_Q_Load(Var)'] == '-' ? '-' : (item['Apf_Q_Load(Var)'] / 1000).toFixed(2)
}}</view>
<view class="item">{{ item['Apf_S_Load(VA)'] == '-' ? '-' : (item['Apf_S_Load(VA)'] /
1000).toFixed(2) }}
</view>
<view class="item">{{ item['Apf_PF_Load(null)'] || '-' }}</view>
</template>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
renderData: {
电网侧: [],
负载侧: [],
未知: [],
},
}
},
props: {
basicData: {
type: Array,
default: () => {
return []
},
},
},
watch: {
basicData: {
handler: function (newVal, oldVal) {
newVal.forEach((item) => {
if (item.phase === 'avg') {
return
}
let key = ''
switch (item.statisticalName) {
case 'Apf_P_Sys(W)':
key = '电网侧'
break
case 'Apf_Q_Sys(Var)':
key = '电网侧'
break
case 'Apf_S_Sys(VA)':
key = '电网侧'
break
case 'Apf_PF_Sys(null)':
key = '电网侧'
break
case 'Apf_P_Load(W)':
key = '负载侧'
break
case 'Apf_Q_Load(Var)':
key = '负载侧'
break
case 'Apf_S_Load(VA)':
key = '负载侧'
break
case 'Apf_PF_Load(null)':
key = '负载侧'
break
default:
key = '未知'
break
}
let index = this.renderData[key].findIndex((item2) => {
return item2.phase === item.phase
})
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData || '-'
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData || '-',
})
}
})
console.log(this.renderData)
},
deep: true,
immediate: true,
},
},
methods: {},
}
</script>
<style lang="scss">
.basic {}
</style>

View File

@@ -1,375 +1,385 @@
<template>
<view>
<div class="header-form">
<uni-data-select
v-model="parity"
:localdata="parityOption"
@change="initEcharts"
style="flex: 1"
:clear="false"
></uni-data-select>
<!-- <uni-data-checkbox v-model="dataRadio" :localdata="dataOptions" @change="initEcharts"></uni-data-checkbox> -->
<uni-data-select
v-model="dataRadio"
:localdata="dataOptions"
@change="initEcharts"
style="flex: 2; margin-left: 20rpx"
:clear="false"
></uni-data-select>
</div>
<view class="charts-box">
<!-- <view class="data-time">{{ time }}</view> -->
<!-- <qiun-data-charts type="bar" :ontouch="true" :opts="opts" :chartData="chartData" /> -->
<view style="width: 100%; height: 100%"><l-echart ref="chartRef" @finished="init"></l-echart></view>
</view>
</view>
</template>
<script>
import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'
export default {
props: {
basicData: {
type: Array,
default: () => [],
},
dataTime: {
type: [String, Number],
default: '',
},
},
data() {
return {
parityOption: [
{
text: '奇次',
value: 2,
},
{
text: '次',
value: 1,
},
],
parity: 2,
time: '',
dataOptions: [],
dataRadio: 0,
renderData: {
电网侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
负载: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
},
chartData: {},
//您可以通过修改 config-ucharts.js 文件中下标为 ['column'] 的节点来配置全局默认参数,如都是默认参数,此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
option: {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
},
confine: true,
},
color: [
'#1890FF',
'#91CB74',
'#FAC858',
'#EE6666',
'#73C0DE',
'#3CA272',
'#FC8452',
'#9A60B4',
'#ea7ccc',
],
legend: {
data: ['电网侧', '负载侧'],
left: 0,
},
grid: {
left: 10,
right: 10,
bottom: 15,
top: 30,
containLabel: true,
},
xAxis: [
{
type: 'value',
axisLine: {
show: true,
},
minInterval: 0.5,
position: 'top', // 设置 x 轴在顶部
},
],
yAxis: [
{
type: 'category',
axisTick: { show: false },
data: [],
splitLine: { show: true },
axisLine: {
lineStyle: {
color: '#999999',
},
},
axisLabel: {
color: '#666666',
},
},
],
series: [
{
name: '电网侧',
type: 'bar',
label: {
normal: {
color: '#666',
show: true,
position: 'right',
fontSize: '8px',
},
},
barGap: '10%',
data: [],
},
{
name: '负载侧',
type: 'bar',
barCateGoryGap:20,
label: {
normal: {
color: '#666',
show: true,
position: 'right',
fontSize: '8px',
},
},
data: [],
},
],
},
opts: {
// enableScroll: true,
dataLabel: false,
color: [
'#1890FF',
'#91CB74',
'#FAC858',
'#EE6666',
'#73C0DE',
'#3CA272',
'#FC8452',
'#9A60B4',
'#ea7ccc',
],
padding: [0, 20, 0, 0],
legend: {
position: 'top',
float: 'left',
},
xAxis: {
// disableGrid: true,
boundaryGap: 'justify',
itemCount: 8,
// scrollShow: true,
data: [
{
min: 0,
},
],
min: 0,
// max: 10,
position: 'top',
formatter: (value, index, opts) => {
console.log(123, value, index, opts)
},
},
yAxis: {},
extra: {
bar: {
type: 'group',
width: 30,
meterBorde: 1,
meterFillColor: '#FFFFFF',
activeBgColor: '#000000',
activeBgOpacity: 0.08,
barBorderCircle: true,
seriesGap: 2,
categoryGap: 6,
},
},
},
}
},
watch: {
basicData: {
handler(newVal, oldVal) {
console.log(this.basicData)
let basicData = JSON.parse(JSON.stringify(this.basicData))
// this.dataRadio = 0
this.renderData = {
电网侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
负载侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
}
let arr = [
{
name: '电网侧',
key: 'Apf_HarmI_Sys',
},
{
name: '电网侧',
key: 'Apf_HarmUR_Sys',
},
{
name: '负载侧',
key: 'Apf_HarmI_Load',
},
{
name: '负载侧',
key: 'Apf_HarmUR_Load',
},
]
basicData.forEach((item) => {
let have = arr.find((item2) => {
return item.statisticalName.indexOf(item2.key) > -1
})
if (!have) return
let name1 = have['name']
let name2 = have.key.split('_')[0] + '_' + have.key.split('_')[1]
if (this.renderData[name1][name2][item.phase]) {
this.renderData[name1][name2][item.phase][item.statisticalName] = item.statisticalData || 0
} else {
this.renderData[name1][name2][item.phase] = {
[item.statisticalName]: item.statisticalData || 0,
}
}
})
console.log(this.renderData)
let dataOptions = []
let type = [
{
name: '谐波电流幅值',
key: 'Apf_HarmI',
},
{
name: '谐波电压含有率',
key: 'Apf_HarmUR',
},
]
Object.keys(this.renderData['电网侧']['Apf_HarmI']).forEach((item, index) => {
type.forEach((item2) => {
dataOptions.push({
text: item + '相' + item2.name,
pointer: item2.key + '_' + item,
value: dataOptions.length,
})
})
})
this.dataOptions = dataOptions
console.log(dataOptions)
this.initEcharts()
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
},
deep: true,
immediate: true,
},
},
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts)
chart.setOption(this.option)
},
initEcharts() {
setTimeout(() => {
if(this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]] == undefined) return
let obj = JSON.parse(
JSON.stringify(
this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]],
),
)
let key = this.dataOptions[this.dataRadio].pointer.split('_')
console.log(key)
let name1 = key[0] + '_' + key[1]
let name2 = key[2]
this.chartData = {
categories: Object.keys(obj)
.map((item) => {
// Apf_HarmI_Sys_36(A) 匹配36
return Number(item.match(/\d+/)[0])
})
.filter((item) => {
return item % 2 === this.parity - 1
}),
series: [
{
name: '电网侧',
data: Object.values(this.renderData['电网侧'][name1][name2]).filter((item, index) => {
return index % 2 === this.parity - 1
}),
},
{
name: '负载侧',
data: Object.values(this.renderData['负载侧'][name1][name2]).filter((item, index) => {
return index % 2 === this.parity - 1
}),
},
],
}
// /传值到echart
this.option.yAxis[0].data = Object.keys(obj)
.map((item) => {
// Apf_HarmI_Sys_36(A) 匹配36
return Number(item.match(/\d+/)[0])
})
.filter((item) => {
return item % 2 === this.parity - 1
}).reverse()
this.option.series[0].data = Object.values(this.renderData['电网侧'][name1][name2]).filter(
(item, index) => {
return index % 2 === this.parity - 1
},
).reverse().map(item=>item.toFixed(2))
this.option.series[1].data = Object.values(this.renderData['负载侧'][name1][name2]).filter(
(item, index) => {
return index % 2 === this.parity - 1
},
).reverse().map(item=>item.toFixed(2))
this.init()
}, 100)
},
},
}
</script>
<style lang="scss">
.charts-box {
margin-top: 20rpx;
height: 100vh;
.data-time {
position: absolute;
right: 20rpx;
margin-top: 18rpx;
font-size: 24rpx;
}
}
.header-form {
display: flex;
}
</style>
<template>
<view>
<uni-load-more status="loading" v-if="basicData.length == 0"></uni-load-more>
<view v-else>
<div class="header-form">
<uni-data-select
v-model="parity"
:localdata="parityOption"
@change="initEcharts"
style="flex: 1"
:clear="false"
></uni-data-select>
<!-- <uni-data-checkbox v-model="dataRadio" :localdata="dataOptions" @change="initEcharts"></uni-data-checkbox> -->
<uni-data-select
v-model="dataRadio"
:localdata="dataOptions"
@change="initEcharts"
style="flex: 2; margin-left: 20rpx"
:clear="false"
></uni-data-select>
</div>
<view class="charts-box">
<!-- <view class="data-time">{{ time }}</view> -->
<!-- <qiun-data-charts type="bar" :ontouch="true" :opts="opts" :chartData="chartData" /> -->
<view style="width: 100%; height: 100%"><l-echart ref="chartRef" @finished="init"></l-echart></view>
</view>
</view>
</view>
</template>
<script>
import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'
export default {
props: {
basicData: {
type: Array,
default: () => [],
},
dataTime: {
type: [String, Number],
default: '',
},
},
data() {
return {
parityOption: [
{
text: '次',
value: 2,
},
{
text: '偶次',
value: 1,
},
],
parity: 2,
time: '',
dataOptions: [],
dataRadio: 0,
renderData: {
电网: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
负载侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
},
chartData: {},
//您可以通过修改 config-ucharts.js 文件中下标为 ['column'] 的节点来配置全局默认参数,如都是默认参数,此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。
option: {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
},
confine: true,
},
color: [
'#1890FF',
'#91CB74',
'#FAC858',
'#EE6666',
'#73C0DE',
'#3CA272',
'#FC8452',
'#9A60B4',
'#ea7ccc',
],
legend: {
data: ['电网侧', '负载侧'],
left: 0,
},
grid: {
left: 10,
right: 10,
bottom: 15,
top: 30,
containLabel: true,
},
xAxis: [
{
type: 'value',
axisLine: {
show: true,
},
minInterval: 0.5,
position: 'top', // 设置 x 轴在顶部
},
],
yAxis: [
{
type: 'category',
axisTick: { show: false },
data: [],
splitLine: { show: true },
axisLine: {
lineStyle: {
color: '#999999',
},
},
axisLabel: {
color: '#666666',
},
},
],
series: [
{
name: '电网侧',
type: 'bar',
label: {
normal: {
color: '#666',
show: true,
position: 'right',
fontSize: '8px',
},
},
barGap: '10%',
data: [],
},
{
name: '负载侧',
type: 'bar',
barCateGoryGap: 20,
label: {
normal: {
color: '#666',
show: true,
position: 'right',
fontSize: '8px',
},
},
data: [],
},
],
},
opts: {
// enableScroll: true,
dataLabel: false,
color: [
'#1890FF',
'#91CB74',
'#FAC858',
'#EE6666',
'#73C0DE',
'#3CA272',
'#FC8452',
'#9A60B4',
'#ea7ccc',
],
padding: [0, 20, 0, 0],
legend: {
position: 'top',
float: 'left',
},
xAxis: {
// disableGrid: true,
boundaryGap: 'justify',
itemCount: 8,
// scrollShow: true,
data: [
{
min: 0,
},
],
min: 0,
// max: 10,
position: 'top',
formatter: (value, index, opts) => {
console.log(123, value, index, opts)
},
},
yAxis: {},
extra: {
bar: {
type: 'group',
width: 30,
meterBorde: 1,
meterFillColor: '#FFFFFF',
activeBgColor: '#000000',
activeBgOpacity: 0.08,
barBorderCircle: true,
seriesGap: 2,
categoryGap: 6,
},
},
},
}
},
watch: {
basicData: {
handler(newVal, oldVal) {
console.log(this.basicData)
let basicData = JSON.parse(JSON.stringify(this.basicData))
// this.dataRadio = 0
this.renderData = {
电网侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
负载侧: {
Apf_HarmI: {},
Apf_HarmUR: {},
},
}
let arr = [
{
name: '电网侧',
key: 'Apf_HarmI_Sys',
},
{
name: '电网侧',
key: 'Apf_HarmUR_Sys',
},
{
name: '负载侧',
key: 'Apf_HarmI_Load',
},
{
name: '负载侧',
key: 'Apf_HarmUR_Load',
},
]
basicData.forEach((item) => {
let have = arr.find((item2) => {
return item.statisticalName.indexOf(item2.key) > -1
})
if (!have) return
let name1 = have['name']
let name2 = have.key.split('_')[0] + '_' + have.key.split('_')[1]
if (this.renderData[name1][name2][item.phase]) {
this.renderData[name1][name2][item.phase][item.statisticalName] = item.statisticalData || 0
} else {
this.renderData[name1][name2][item.phase] = {
[item.statisticalName]: item.statisticalData || 0,
}
}
})
console.log(this.renderData)
let dataOptions = []
let type = [
{
name: '谐波电流幅值',
key: 'Apf_HarmI',
},
{
name: '谐波电压含有率',
key: 'Apf_HarmUR',
},
]
Object.keys(this.renderData['电网侧']['Apf_HarmI']).forEach((item, index) => {
type.forEach((item2) => {
dataOptions.push({
text: item + '相' + item2.name,
pointer: item2.key + '_' + item,
value: dataOptions.length,
})
})
})
this.dataOptions = dataOptions
console.log(dataOptions)
this.initEcharts()
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
},
deep: true,
immediate: true,
},
},
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts)
chart.setOption(this.option)
},
initEcharts() {
setTimeout(() => {
if (
this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]] ==
undefined
)
return
let obj = JSON.parse(
JSON.stringify(
this.renderData['电网侧']['Apf_HarmI'][Object.keys(this.renderData['电网侧']['Apf_HarmI'])[0]],
),
)
let key = this.dataOptions[this.dataRadio].pointer.split('_')
console.log(key)
let name1 = key[0] + '_' + key[1]
let name2 = key[2]
this.chartData = {
categories: Object.keys(obj)
.map((item) => {
// Apf_HarmI_Sys_36(A) 匹配36
return Number(item.match(/\d+/)[0])
})
.filter((item) => {
return item % 2 === this.parity - 1
}),
series: [
{
name: '电网侧',
data: Object.values(this.renderData['电网侧'][name1][name2]).filter((item, index) => {
return index % 2 === this.parity - 1
}),
},
{
name: '负载侧',
data: Object.values(this.renderData['负载侧'][name1][name2]).filter((item, index) => {
return index % 2 === this.parity - 1
}),
},
],
}
// /传值到echart
this.option.yAxis[0].data = Object.keys(obj)
.map((item) => {
// Apf_HarmI_Sys_36(A) 匹配36
return Number(item.match(/\d+/)[0])
})
.filter((item) => {
return item % 2 === this.parity - 1
})
.reverse()
this.option.series[0].data = Object.values(this.renderData['电网侧'][name1][name2])
.filter((item, index) => {
return index % 2 === this.parity - 1
})
.reverse()
.map((item) => item.toFixed(2))
this.option.series[1].data = Object.values(this.renderData['负载侧'][name1][name2])
.filter((item, index) => {
return index % 2 === this.parity - 1
})
.reverse()
.map((item) => item.toFixed(2))
this.init()
}, 100)
},
},
}
</script>
<style lang="scss">
.charts-box {
margin-top: 20rpx;
height: 100vh;
.data-time {
position: absolute;
right: 20rpx;
margin-top: 18rpx;
font-size: 24rpx;
}
}
.header-form {
display: flex;
}
</style>

View File

@@ -5,18 +5,10 @@
<view class="detail-header">
<Cn-htmlToImg domId="header" @renderFinish="renderFinish">
<view class="header" id="header" ref="header" @click="previewImg">
<img
:src="topoImg"
style="width: 375px; display: block"
mode="widthFix"
@load="domLoading = false"
/>
<view
class="point"
:style="{ left: item.lat + 'px', top: item.lng + 'px' }"
v-for="(item, index) in topolodyData"
:key="index"
>
<img :src="topoImg" style="width: 375px; display: block" mode="widthFix"
@load="domLoading = false" />
<view class="point" :style="{ left: item.lat + 'px', top: item.lng + 'px' }"
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>
@@ -51,13 +43,9 @@
<text class="ml10">设备状态</text>
</view> -->
<view class="nav" style="margin-top: -10rpx">
<view
class="nav-menu"
:class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList"
:key="index"
@click="navMenuClick(index)"
>{{ item.text }}
<view class="nav-menu" :class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text
}}
</view>
</view>
</view>
@@ -107,22 +95,10 @@
</uni-popup> -->
<!-- 输入框示例 -->
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog
ref="inputClose"
type="info"
mode="input"
:title="dialogType"
value="对话框预置提示内容!"
placeholder="请输入内容"
@confirm="dialogInputConfirm"
>
<uni-easyinput
type="textarea"
:maxlength="250"
autoHeight
v-model="remarkContent"
placeholder="请输入备注"
></uni-easyinput>
<uni-popup-dialog ref="inputClose" type="info" mode="input" :title="dialogType" value="对话框预置提示内容!"
placeholder="请输入内容" @confirm="dialogInputConfirm">
<uni-easyinput type="textarea" :maxlength="250" autoHeight v-model="remarkContent"
placeholder="请输入备注"></uni-easyinput>
</uni-popup-dialog>
</uni-popup>
</view>
@@ -140,6 +116,7 @@ import { manualAccess } from '@/common/api/accessBoot'
import { MQTT_IP, MQTT_OPTIONS } from '@/common/js/mqtt.js'
import mqtt from 'mqtt/dist/mqtt.js'
import { base64ToPath, pathToBase64 } from 'image-tools'
import { queryByCode, queryStatistical } from '@/common/api/dictionary'
import hoverMenu from '@/hover-menu/components/hover-menu/hover-menu.vue'
export default {
components: {
@@ -159,10 +136,12 @@ export default {
domLoading: true,
loading: true,
deviceInfo: {},
device: {},
navMenuActive: 0,
navHeight: 0,
img: '',
topoImg: '',
targetLists: [],
navMenuList: [
{
text: '基本',
@@ -176,17 +155,14 @@ export default {
text: '功率',
id: 'a16aceae7d1565bf9f94dd7410cf9bce',
},
// {
// text: '波形',
// },
{
text: '其他',
},
],
content: [
{
iconPath: '/static/report.png',
text: '告警',
iconPath: '/static/tongji.png',
text: '事件',
},
// {
// iconPath: '/static/record.png',
@@ -196,10 +172,10 @@ export default {
iconPath: '/static/about.png',
text: '关于',
},
{
iconPath: '/static/access.png',
text: '接入',
},
// {
// iconPath: '/static/access.png',
// text: '接入',
// },
],
client: null,
timer: null,
@@ -243,8 +219,22 @@ export default {
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/report?id=' + this.devId })
uni.setStorageSync('messageParams', {
engineeringName: this.device.engineeringName,
engineeringId: this.device.engineeringId, //工程ID
projectName: this.device.projectName,
projectId: this.device.projectId, //項目ID
deviceName: this.device.equipmentName,
deviceId: this.device.equipmentId, //设备ID
lineName: '',
lineId: '', //测点ID
type: 0,
})
uni.switchTab({
url: '/pages/index/message1',
})
} else if (e.text === '关于') {
uni.navigateTo({ url: '/pages/device/APF/about?id=' + this.devId })
} else if (e.text === '移交') {
@@ -343,19 +333,30 @@ export default {
},
})
},
init() {
getTarget() {
return queryByCode('app_harmonic_code').then((res) => {
return queryStatistical({ id: res.data.id }).then((resp) => {
this.targetLists = resp.data.selectedList
})
})
},
async init() {
console.log('init')
this.loading = true
this.domLoading = true
queryTopologyDiagram(this.devId).then((res) => {
await 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) => {
let index = this.deviceInfo.appsLineTopologyDiagramPO?.findIndex((element) => {
element.label = element.name
item.label = element.name
item.target = element.target
return element.linePostion === item.linePostion
})
if (index > -1) {
@@ -369,10 +370,14 @@ export default {
})
console.log(this.topolodyData)
if (this.client) {
this.client.publish(`/zl/askDevData/${this.devId}/${this.navMenuList[0].id}`)
this.loading = false
} else {
this.initMqtt(this.navMenuList[0].id)
}
console.log("🚀 ~ this.client:", this.client)
})
},
renderFinish(e) {
@@ -445,22 +450,28 @@ export default {
console.log('连接断开')
})
.on('message', (topic, message) => {
console.log('接收推送信息:', JSON.parse(message.toString()), topic)
console.log('🚀 ~ .on ~ topic:', topic)
// console.log('接收推送信息:', JSON.parse(message.toString()), topic)
// console.log('🚀 ~ .on ~ topic:', topic)
if (topic === `/zl/devData/${this.devId}/${id}`) {
const data = JSON.parse(message.toString())
if (Array.isArray(data) && !data.length) return
if ((!message.toString() || message.toString().length < 10) && this.loading) {
this.$util.toast('该设备暂无数据')
}
this.loading = false
this.handlerData(JSON.parse(message.toString()))
this.handlerData(data)
} else if (topic === `/zl/TemperData/${this.devId}`) {
const data = JSON.parse(message.toString())
if (Array.isArray(data) && !data.length) return
// this.basicData.forEach((item) => {
// if (item.statisticalName === '温度' && item.phase === 'avg') {
// item.statisticalData = message.toString()
// }
// })
this.IOData = JSON.parse(message.toString())
this.IOData = data
// this.IOData = this.IOData.filter((item) => item.value !== 0)
this.IOData.forEach((item) => {
if (!item.value) {
@@ -475,37 +486,60 @@ export default {
})
},
handlerData(data) {
async handlerData(data) {
this.basicData = data
this.topolodyData.forEach((element) => {
let arr = []
let list = this.targetLists.filter(key => key.dataType == element.target)
element.showKey.forEach((key) => {
if (list.length > 0) {
let id = list[0]?.eleEpdPqdVOS.filter(key => key.phase == 'A')[0]?.id || ''
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.statisticalIndex === id && item.phase === 'avg') {
arr.push({
label: list[0].dataTypeName.split('-')[1] + ':',
value: (item.statisticalData) + `${item.unit || ''}`,
})
}
if (item.time) {
this.dataTime = item.time.seconds
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
// console.log(11111111,this.dataTime);
}
})
})
}
else {
element.showKey.forEach((key) => {
data.forEach((item) => {
if (item.statisticalName === key && item.phase === 'avg') {
if (key === 'Apf_RmsI_TolOut(A)') {
arr.push({
label: '总输出电流:',
value: (item.statisticalData) + 'A',
})
} else {
arr.push({
label: '电流畸变率:',
value: (item.statisticalData) + '%',
})
}
}
if (item.time) {
this.dataTime = item.time.seconds
this.time = this.$util.parseTime(this.dataTime - 8 * 60 * 60)
}
})
})
}
element.value = arr
})
console.log("🚀 ~ this.topolodyData:", this.topolodyData)
console.log(this.topolodyData)
this.$forceUpdate()
},
@@ -524,11 +558,16 @@ export default {
}, 1000)
},
onLoad(options) {
async onLoad(options) {
await this.getTarget()
this.pageOptions = options
this.device = JSON.parse(options.device)
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,
@@ -571,12 +610,18 @@ export default {
})
}
}
if (this.userInfo.authorities !== 'tourist') {
if (this.userInfo.authorities !== 'tourist' && this.device.isPrimaryUser === '1') {
this.content.splice(0, 0, {
iconPath: '/static/subordinate.png',
text: '用户',
})
}
if (this.userInfo.authorities === 'operation_manager') {
this.content.push({
iconPath: '/static/access.png',
text: '接入',
})
}
}
this.$util.getDictData('Line_Position').then((res) => {
this.topolodyData = res.map((item) => {
@@ -603,9 +648,11 @@ export default {
lng: '',
showKey: item.showKey, //要展示的指标key
value: [],
target: item.target
}
})
})
this.init()
},
}
@@ -613,6 +660,7 @@ export default {
<style lang="scss">
.detail {
// background: $uni-theme-white;
.header-bg {
position: absolute;
@@ -643,7 +691,7 @@ export default {
z-index: 2;
text-align: center;
color: #111;
width: 110rpx;
width: 150rpx;
font-size: 16rpx;
opacity: 0.8;

View File

@@ -12,37 +12,24 @@
style="margin-top: 30rpx"
>
<view class="content-item-header-icon">
<image mode="aspectFill" :src="staticIcon" style="height: 60rpx; width: 60rpx"></image>
<!-- <image mode="aspectFill" :src="staticIcon" style="height: 60rpx; width: 60rpx"></image> -->
<Cn-icon-transient :name="`运行告警`" />
</view>
</uni-badge>
<view class="content-item-header-right">
<view class="content-item-header-right-title">{{ item.equipmentName }}</view>
<!-- <view class="content-item-header-right-des">{{ item.engineeringName }} {{ item.projectName }}</view> -->
<view class="content-item-header-right-des">工程名称{{ item.engineeringName }}</view>
<view class="content-item-header-right-des">项目名称{{ item.projectName }}</view>
<!-- <view class="content-item-header-right-des">监测点名称{{ item.lineName }}</view> -->
<!-- <view class="content-item-header-right-des">暂态类型{{ item.showName }}</view> -->
<!-- <view class="content-item-header-right-des">{{ item.subTitle }}</view> -->
</view>
<view class="ml10" v-if="type === '0' || item.status != '1'">🔍</view>
<view class="ml10" v-if="type === '0' || item.status != '1'">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons
></view>
</view>
<view class="content-item-footer">{{ item.subTitle }}</view>
</view>
<!-- <uni-card
:title="item.equipmentName"
:extra="item.status == '1' ? '' : '未读'"
:sub-title="item.subTitle"
thumbnail="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png"
@click="jump(item)"
v-for="(item, index) in store.data"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item" v-for="(item2, textIndex) in item.dataSet" :key="textIndex">
{{ item2.showName + ':' + (item2.value == 3.1415926 ? '-' : item2.value) + (item2.unit || '') }}
</view>
</view>
</uni-card> -->
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
@@ -112,8 +99,8 @@ export default {
this.store = this.DataSource('/cs-harmonic-boot/eventUser/queryEventpage')
this.store.params.type = this.type
this.store.params.deviceId = this.deviceId
this.store.params.startTime = this.$util.getBeforeDays()
this.store.params.endTime = this.$util.getToday()
this.store.params.startTime = this.$util.getBeforeDays()
this.store.params.endTime = this.$util.getToday()
this.store.loadedCallback = () => {
this.store.data.forEach((item) => {
if (this.type === '3') {
@@ -141,17 +128,17 @@ export default {
this.store.reload()
},
jump(item) {
if (this.type === '0') {
// if (this.type === '0') {
let str = JSON.stringify(item).replace(/%/g, '百分比')
uni.navigateTo({ url: '/pages/message/messageDetail?detail=' + encodeURIComponent(str) })
} else {
if (item.status != '1') {
item.status = '1'
updateStatus({
eventIds: [item.id],
})
}
}
// } else {
// if (item.status != '1') {
// item.status = '1'
// updateStatus({
// eventIds: [item.id],
// })
// }
// }
},
},
}
@@ -176,10 +163,11 @@ export default {
display: flex;
align-items: center;
justify-content: center;
width: 100rpx;
height: 100rpx;
width: 110rpx;
height: 110rpx;
border-radius: 8rpx;
background: $uni-theme-color;
// background: $uni-theme-color;
background-color: #376cf320;
}
.content-item-header-right {

View File

@@ -1,286 +1,292 @@
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="detail-header">
<view class="header">
<image
src="http://localhost:8088/api/system-boot/file/download?filePath=topology/1aca98ceb22a1fc33b81d9101275ef1.png"
mode="widthFix" style="width: 100%" />
</view>
<!-- <view class="des">
<text>设备基础信息</text>
<text class="ml10">设备状态</text>
</view> -->
<view class="nav">
<view class="nav-menu" :class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text
}}
</view>
</view>
</view>
<view class="content">
<DianWang v-if="navMenuActive == 0"></DianWang>
<NiBian v-else-if="navMenuActive == 1"></NiBian>
<ShuChu v-else-if="navMenuActive == 2"></ShuChu>
<GanJieDian v-else-if="navMenuActive == 3"></GanJieDian>
<ZhuangTaiLiang v-else-if="navMenuActive == 4"> </ZhuangTaiLiang>
<QiTa v-else-if="navMenuActive == 5"></QiTa>
<view style="height: 20rpx"></view>
</view>
<!-- <uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
/> -->
<hover-menu :btnList="content" @trigger='trigger'></hover-menu>
</view>
</view>
</Cn-page>
</template>
<script>
import DianWang from './comp/dianWang.vue'
import NiBian from './comp/niBian.vue'
import ShuChu from './comp/shuChu.vue'
import GanJieDian from './comp/ganJieDian.vue'
import ZhuangTaiLiang from './comp/zhuangTaiLiang.vue'
import QiTa from './comp/qiTa.vue'
import { manualAccess } from '@/common/api/accessBoot'
import hoverMenu from '@/hover-menu/components/hover-menu/hover-menu.vue';
export default {
components: {
DianWang,
NiBian,
ShuChu,
GanJieDian,
ZhuangTaiLiang,
QiTa,
hoverMenu
},
data() {
return {
loading: false,
navMenuActive: 0,
navHeight: 0,
pageOptions: {},
navMenuList: [
{
text: '电网数据',
},
{
text: '逆变数据',
},
{
text: '输出数据',
},
{
text: '干接点',
},
{
text: '状态量',
},
{
text: '其他',
},
],
content: [
{
iconPath: '/static/report.png',
text: '告警',
},
{
iconPath: '/static/record.png',
text: '记录',
},
{
iconPath: '/static/about.png',
text: '关于',
},
{
iconPath: '/static/access.png',
text: '接入',
},
],
}
},
methods: {
trigger(e) {
console.log(e)
if (e.text === '分享') {
this.$refs.share.open()
} else if (e.text === '删除') {
uni.showModal({
title: '提示',
content: '确定删除该设备吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
} else if (e.text === '下载') {
this.$util.toast('下载成功')
} else if (e.text === '记录') {
uni.navigateTo({ url: '/pages/device/DVR/record' })
} else if (e.text === '告警') {
uni.navigateTo({ url: '/pages/device/DVR/report' })
} else if (e.text === '关于') {
uni.navigateTo({ url: '/pages/device/DVR/about' })
} else if (e.text === '移交') {
uni.navigateTo({ url: '/pages/device/transfer' })
} else if (e.text === '反馈') {
uni.navigateTo({ url: '/pages/device/feedback' })
} else if (e.text === '用户') {
uni.navigateTo({ url: '/pages/device/user' })
} else if (e.text === '接入') {
manualAccess({ nDid: this.pageOptions.ndid }).then((res) => {
this.$util.toast(res.message)
})
}
// this.$refs.fab.close()
},
navMenuClick(idx) {
this.navMenuActive = idx
uni.pageScrollTo({ scrollTop: 0, duration: 0 })
},
init() {
let userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
console.log(userInfo.authorities)
switch (userInfo.authorities) {
case 1:
this.content.splice(
0,
0,
{
iconPath: '/static/version.png',
text: '版本',
},
{
iconPath: '/static/template.png',
text: '模版',
},
)
break
case 3:
this.content.splice(1, 0, {
iconPath: '/static/transfer.png',
text: '移交',
})
break
case 4:
this.content.splice(
0,
0,
{
iconPath: '/static/subordinate.png',
text: '用户',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
break
case 5:
this.content.push({
iconPath: '/static/feedback.png',
text: '反馈',
})
break
default:
break
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
},
},
onLoad(options) {
this.pageOptions = options
this.init()
},
}
</script>
<style lang="scss">
.detail {
// background: $uni-theme-white;
.header {}
.des {
padding: 20rpx 20rpx 0;
font-size: 28rpx;
color: #999;
}
// .nav {
// position: sticky;
// top: 0;
// left: 0;
// padding-top: 20rpx;
// display: flex;
// flex-wrap: wrap;
// background: rgb(243, 244, 245);
// .nav-menu {
// padding: 10rpx 20rpx;
// margin-left: 20rpx;
// margin-bottom: 20rpx;
// font-size: 28rpx;
// border-radius: 8rpx;
// background: $uni-theme-white;
// &-active {
// background: $uni-theme-color;
// color: #fff;
// }
// }
// }
.content {
box-sizing: border-box;
padding: 0 20rpx;
}
.detail-header {
position: sticky;
top: 0;
left: 0;
z-index: 2;
background: #f3f4f5;
}
}
/deep/ .uni-fab__circle--rightBottom {
right: 8px !important;
bottom: 8px !important;
}
/deep/ .uni-fab--rightBottom {
right: 8px !important;
bottom: 8px !important;
}
/deep/ .uni-fab__circle {
width: 50px;
height: 54px;
}
/deep/ .uni-fab__content--flexDirectionEnd {
width: 50px !important;
// height: 50px !important;
}
</style>
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="detail-header">
<view class="header">
<image
src="http://localhost:8088/api/system-boot/file/download?filePath=topology/1aca98ceb22a1fc33b81d9101275ef1.png"
mode="widthFix" style="width: 100%" />
</view>
<!-- <view class="des">
<text>设备基础信息</text>
<text class="ml10">设备状态</text>
</view> -->
<view class="nav">
<view class="nav-menu" :class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList" :key="index" @click="navMenuClick(index)">{{ item.text
}}
</view>
</view>
</view>
<view class="content">
<DianWang v-if="navMenuActive == 0"></DianWang>
<NiBian v-else-if="navMenuActive == 1"></NiBian>
<ShuChu v-else-if="navMenuActive == 2"></ShuChu>
<GanJieDian v-else-if="navMenuActive == 3"></GanJieDian>
<ZhuangTaiLiang v-else-if="navMenuActive == 4"> </ZhuangTaiLiang>
<QiTa v-else-if="navMenuActive == 5"></QiTa>
<view style="height: 20rpx"></view>
</view>
<!-- <uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
/> -->
<hover-menu :btnList="content" @trigger='trigger'></hover-menu>
</view>
</view>
</Cn-page>
</template>
<script>
import DianWang from './comp/dianWang.vue'
import NiBian from './comp/niBian.vue'
import ShuChu from './comp/shuChu.vue'
import GanJieDian from './comp/ganJieDian.vue'
import ZhuangTaiLiang from './comp/zhuangTaiLiang.vue'
import QiTa from './comp/qiTa.vue'
import { manualAccess } from '@/common/api/accessBoot'
import hoverMenu from '@/hover-menu/components/hover-menu/hover-menu.vue';
export default {
components: {
DianWang,
NiBian,
ShuChu,
GanJieDian,
ZhuangTaiLiang,
QiTa,
hoverMenu
},
data() {
return {
loading: false,
navMenuActive: 0,
navHeight: 0,
pageOptions: {},
navMenuList: [
{
text: '电网数据',
},
{
text: '逆变数据',
},
{
text: '输出数据',
},
{
text: '干接点',
},
{
text: '状态量',
},
{
text: '其他',
},
],
content: [
{
iconPath: '/static/tongji.png',
text: '事件',
},
// {
// iconPath: '/static/record.png',
// text: '记录',
// },
{
iconPath: '/static/about.png',
text: '关于',
},
// {
// iconPath: '/static/access.png',
// text: '接入',
// },
],
}
},
methods: {
trigger(e) {
console.log(e)
if (e.text === '分享') {
this.$refs.share.open()
} else if (e.text === '删除') {
uni.showModal({
title: '提示',
content: '确定删除该设备吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
} else if (e.text === '下载') {
this.$util.toast('下载成功')
} else if (e.text === '记录') {
uni.navigateTo({ url: '/pages/device/DVR/record' })
} else if (e.text === '事件') {
uni.navigateTo({ url: '/pages/device/DVR/report' })
} else if (e.text === '关于') {
uni.navigateTo({ url: '/pages/device/DVR/about' })
} else if (e.text === '移交') {
uni.navigateTo({ url: '/pages/device/transfer' })
} else if (e.text === '反馈') {
uni.navigateTo({ url: '/pages/device/feedback' })
} else if (e.text === '用户') {
uni.navigateTo({ url: '/pages/device/user' })
} else if (e.text === '接入') {
manualAccess({ nDid: this.pageOptions.ndid }).then((res) => {
this.$util.toast(res.message)
})
}
// this.$refs.fab.close()
},
navMenuClick(idx) {
this.navMenuActive = idx
uni.pageScrollTo({ scrollTop: 0, duration: 0 })
},
init() {
let userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
console.log(userInfo.authorities)
switch (userInfo.authorities) {
case 1:
this.content.splice(
0,
0,
{
iconPath: '/static/version.png',
text: '版本',
},
{
iconPath: '/static/template.png',
text: '模版',
},
)
break
case 3:
this.content.splice(1, 0, {
iconPath: '/static/transfer.png',
text: '移交',
})
break
case 4:
this.content.splice(
0,
0,
{
iconPath: '/static/subordinate.png',
text: '用户',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
break
case 5:
this.content.push({
iconPath: '/static/feedback.png',
text: '反馈',
})
break
default:
break
}
if (this.userInfo.authorities === 'operation_manager') {
this.content.push({
iconPath: '/static/access.png',
text: '接入',
})
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
},
},
onLoad(options) {
this.pageOptions = options
this.init()
},
}
</script>
<style lang="scss">
.detail {
// background: $uni-theme-white;
.header {}
.des {
padding: 20rpx 20rpx 0;
font-size: 28rpx;
color: #999;
}
// .nav {
// position: sticky;
// top: 0;
// left: 0;
// padding-top: 20rpx;
// display: flex;
// flex-wrap: wrap;
// background: rgb(243, 244, 245);
// .nav-menu {
// padding: 10rpx 20rpx;
// margin-left: 20rpx;
// margin-bottom: 20rpx;
// font-size: 28rpx;
// border-radius: 8rpx;
// background: $uni-theme-white;
// &-active {
// background: $uni-theme-color;
// color: #fff;
// }
// }
// }
.content {
box-sizing: border-box;
padding: 0 20rpx;
}
.detail-header {
position: sticky;
top: 0;
left: 0;
z-index: 2;
background: #f3f4f5;
}
}
/deep/ .uni-fab__circle--rightBottom {
right: 8px !important;
bottom: 8px !important;
}
/deep/ .uni-fab--rightBottom {
right: 8px !important;
bottom: 8px !important;
}
/deep/ .uni-fab__circle {
width: 50px;
height: 54px;
}
/deep/ .uni-fab__content--flexDirectionEnd {
width: 50px !important;
// height: 50px !important;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,379 +1,468 @@
<template>
<Cn-page :loading="loading">
<template slot="body">
<view class="device">
<view class="nav" :style="{ top: navTabHeight + 'px' }">
<view
class="nav-menu"
:class="{ 'nav-menu-active': select.engineeringName }"
@click="selectEngineering"
>{{ select.engineeringName || '全部工程' }}
<uni-icons
type="bottom"
size="14"
:color="select.engineeringName ? '#376cf3' : '#666'"
></uni-icons>
</view>
<picker
@change="projectNameChange"
@cancel="select.selectProject = false"
:value="select.projectNameIndex"
:range="filterProjectList"
range-key="text"
v-if="select.engineeringId"
>
<view
class="nav-menu"
:class="{ 'nav-menu-active': select.projectName }"
@click="select.selectProject = true"
>
{{
select.projectName
? select.projectName.length > 6
? select.projectName.substring(0, 6) + '...'
: select.projectName
: '全部项目'
}}
<uni-icons
type="top"
size="14"
:color="select.projectName ? '#376cf3' : '#666'"
v-if="select.selectProject"
></uni-icons>
<uni-icons
type="bottom"
size="14"
:color="select.projectName ? '#376cf3' : '#666'"
v-else
></uni-icons>
</view>
</picker>
<picker
@change="runStatusChange"
@cancel="select.runStatusSelect = false"
:value="select.runStatusIndex"
:range="projectType"
range-key="text"
>
<view
class="nav-menu"
:class="{ 'nav-menu-active': select.runStatusName }"
@click="select.runStatusSelect = true"
>
{{
select.runStatusName
? select.runStatusName.length > 4
? select.runStatusName.substring(0, 4) + '...'
: select.runStatusName
: '全部状态'
}}
<uni-icons
type="top"
size="14"
:color="select.runStatusName ? '#376cf3' : '#666'"
v-if="select.runStatusSelect"
></uni-icons>
<uni-icons
type="bottom"
size="14"
:color="select.runStatusName ? '#376cf3' : '#666'"
v-else
></uni-icons>
</view>
</picker>
<view style="flex: 1"></view>
<!-- <picker @change="runStatusChange" :value="select.projectTypeIndex" :range="projectType" range-key="text">
<view class="nav-menu" :class="{ 'nav-menu-active': select.projectType }"
>{{ select.projectType || '类型' }}
</view>
</picker> -->
</view>
<view class="content device" :style="{ minHeight: minHeight }">
<Cn-device-card v-for="(item, index) in store.data" :device="item" :key="index"> </Cn-device-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else></Cn-empty>
</view>
</view>
</template>
</Cn-page>
</template>
<script>
import { getProjectList } from '@/common/api/project'
import { queryDictData } from '@/common/api/dictionary'
import list from '@/common/js/list'
export default {
mixins: [list],
data() {
return {
loading: true,
transfer: false,
share: false,
checkList: [],
select: {
projectName: '',
projectNameIndex: 0,
projectSelect: false,
engineeringName: '',
engineeringId: '',
runStatusName: '',
runStatusIndex: 0,
runStatusSelect: false,
},
minHeight: 0,
navTabHeight: 0,
engineeringList: [],
projectList: [],
projectType: [
{
text: '全部',
value: '',
},
{
text: '离线',
value: 1,
},
{
text: '在线',
value: 2,
},
],
pageOptions: {},
}
},
watch: {
select: {
handler(val, oldVal) {
if (this.loading) return
this.store.params.projectId =
val.projectNameIndex === 0 ? '' : this.filterProjectList[val.projectNameIndex].value
this.store.params.runStatus = val.runStatusIndex === 0 ? '' : this.projectType[val.runStatusIndex].value
this.store.params.engineerId = val.engineeringId || ''
this.store.reload()
},
deep: true,
},
},
computed: {
filterProjectList() {
return this.projectList.filter(
(item) => item.engineeringId === this.select.engineeringId || item.value === '-1',
)
},
},
onLoad(options) {
let engineering = uni.getStorageSync('engineering')
this.pageOptions = options
switch (options.type) {
case 'onLineDevs':
this.select.runStatusIndex = 2
this.select.runStatusName = '在线'
break
case 'offLineDevs':
this.select.runStatusIndex = 1
this.select.runStatusName = '离线'
break
case 'currentOnLineDevs':
this.select.runStatusIndex = 2
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
this.select.runStatusName = '在线'
break
case 'currentOffLineDevs':
this.select.runStatusIndex = 1
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
this.select.runStatusName = '离线'
break
case 'allEngineering':
this.select.engineeringName = ''
this.select.engineeringId = ''
break
case 'nowEngineering':
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
break
default:
break
}
this.init()
},
onShow() {
let engineering = uni.getStorageSync('onceSelectEngineering')
if (engineering) {
uni.removeStorageSync('onceSelectEngineering')
this.select.engineeringId = engineering.id
this.select.engineeringName = engineering.name
this.select.projectNameIndex = 0
}
},
methods: {
selectEngineering() {
uni.navigateTo({
url: '/pages/home/selectEngineering?from=once',
})
},
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device.png'
break
default:
str = '/static/device.png'
break
}
return str
},
switchChange(e) {
console.log(e)
let index = this.checkList.indexOf(e.equipmentId)
if (index > -1) {
this.checkList.splice(index, 1)
} else {
this.checkList.push(e.equipmentId)
}
},
cancel() {
this.transfer = false
this.share = false
this.checkList = []
},
submit() {
console.log(this.checkList)
if (this.checkList.length === 0) {
this.$util.toast('请选择设备')
return
}
if (this.transfer) {
uni.navigateTo({ url: '/pages/device/transfer?id=' + this.checkList.join(',') })
} else if (this.share) {
uni.navigateTo({ url: '/pages/device/share?id=' + this.checkList.join(',') })
}
this.cancel()
},
async init() {
console.warn('init')
this.getEngineeringList()
this.getProjectList()
this.getDeviceList()
},
getDeviceList() {
this.store = this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
this.store.params.engineerId = this.select.engineeringId
this.store.params.runStatus =
this.select.runStatusIndex === 0 ? '' : this.projectType[this.select.runStatusIndex].value
this.store.params.pageSize = 50
this.store.firstCallBack = (res) => {
this.loading = false
uni.createSelectorQuery()
.select('.uni-navbar')
.boundingClientRect((rect1) => {
if (!rect1) return
this.navTabHeight = rect1.height
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect2) => {
if (!rect2) return
// #ifdef H5
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height + 50) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height) + 'px)'
console.log(this.minHeight)
// #endif
})
.exec()
})
.exec()
}
this.store.reload()
},
getProjectList() {
this.projectList = uni.getStorageSync('projectList')
},
getEngineeringList() {
this.engineeringList = uni.getStorageSync('engineeringList')
},
queryDictData() {
queryDictData('项目类型').then((res) => {
this.projectType = [
{
text: '全部类型',
value: '',
},
...res.data.map((item) => {
return {
text: item.anotherName,
value: item.id,
}
}),
]
})
},
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
runStatusChange(e) {
this.select.runStatusSelect = false
this.select.runStatusIndex = e.detail.value
if (e.detail.value === 0) {
this.select.runStatusName = ''
return
}
this.select.runStatusName = this.projectType[e.detail.value].text
},
projectNameChange(e) {
this.select.selectProject = false
console.log(e)
this.select.projectNameIndex = e.detail.value
if (e.detail.value === 0) {
this.select.projectName = ''
return
}
this.select.projectName = this.projectList[e.detail.value].text
},
registerDevice() {
uni.showModal({
title: '提示',
content: '请选择设备类型',
confirmText: '直连设备',
cancelText: '网关接入',
cancelColor: '#007aff',
success: ({ confirm, cancel }) => {
if (confirm) {
uni.navigateTo({
url: '/pages/device/new',
})
} else if (cancel) {
uni.navigateTo({
url: '/pages/gateway/list',
})
}
},
})
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
navMenuClick(index) {
this.navMenuActive = index
},
jump(item) {
console.log(12321,item);
uni.navigateTo({
url: '/pages/device/APF/detail?id=' + item.equipmentId + '&isPrimaryUser=' + item.isPrimaryUser + '&ndid=' + item.ndid,
})
},
},
}
</script>
<style lang="scss"></style>
<template>
<Cn-page :loading="loading">
<template slot="body">
<view class="device">
<view class="nav" :style="{ top: navTabHeight + 'px' }">
<view class="nav-menu" @click="selectEngineering"
>{{
select.engineeringName
? select.engineeringName.length > 6
? select.engineeringName.substring(0, 6) + '...'
: select.engineeringName
: '全部工程'
}}
<uni-icons type="bottom" size="14"></uni-icons>
</view>
<picker
@change="projectNameChange"
@cancel="select.selectProject = false"
:value="select.projectNameIndex"
:range="filterProjectList"
range-key="text"
v-if="select.engineeringId"
>
<view class="nav-menu" @click="select.selectProject = true">
{{
select.projectName
? select.projectName.length > 6
? select.projectName.substring(0, 6) + '...'
: select.projectName
: '全部项目'
}}
<uni-icons type="top" size="14" v-if="select.selectProject"></uni-icons>
<uni-icons type="bottom" size="14" v-else></uni-icons>
</view>
</picker>
<picker
@change="runStatusChange"
:value="select.runStatusIndex"
:range="projectType"
range-key="text"
>
<view class="nav-menu">
{{
select.runStatusName
? select.runStatusName.length > 12
? select.runStatusName.substring(0, 12) + '...'
: select.runStatusName
: '全部状态'
}}
<uni-icons type="top" size="14" v-if="select.runStatusSelect"></uni-icons>
<uni-icons type="bottom" size="14" v-else></uni-icons>
</view>
</picker>
</view>
<view class="nav" style="padding: 0 10px !important">
<view style="flex: 1"></view>
<template v-if="transfer || share">
<view class="nav-menu nav-menu-btn" @click="cancel">取消</view>
<view class="nav-menu nav-menu-btn" @click="submit">确定</view>
</template>
<template v-else-if="store.data.length">
<view
class="nav-menu nav-menu-btn"
@click="selectDevice('transfer')"
v-if="
userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'
"
>移交
</view>
<view
class="nav-menu nav-menu-btn"
@click="selectDevice('share')"
v-if="userInfo.authorities === 'app_vip_user'"
>分享
</view>
</template>
</view>
<view class="content device" :style="{ minHeight: minHeight }">
<uni-swipe-action>
<uni-swipe-action-item
v-for="(item, index) in store.data"
:threshold="0"
:right-options="item.isTop == 0 ? options1 : options12"
@click="bindClick($event, item)"
>
<Cn-device-card :device="item" :key="index">
<template v-slot:title>
<!-- 卡片标题 -->
<switch
v-if="transfer || share"
:checked="checkList.indexOf(item.equipmentId) > -1"
style="transform: scale(0.8); position: relative; left: 20rpx"
@change="switchChange(item)"
/>
<view class="star-icon" v-else>
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</template>
</Cn-device-card>
</uni-swipe-action-item>
</uni-swipe-action>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else></Cn-empty>
</view>
</view>
</template>
</Cn-page>
</template>
<script>
import { getProjectList } from '@/common/api/project'
import { queryDictData } from '@/common/api/dictionary'
import list from '@/common/js/list'
import { engineeringPinToTop } from '@/common/api/device'
export default {
mixins: [list],
data() {
return {
loading: true,
transfer: false,
share: false,
checkList: [],
select: {
projectName: '',
projectNameIndex: 0,
projectSelect: false,
engineeringName: '',
engineeringId: '',
runStatusName: '',
runStatusIndex: 0,
runStatusSelect: false,
},
userInfo: {},
minHeight: 0,
navTabHeight: 0,
engineeringList: [],
projectList: [],
projectType: [
{
text: '全部',
value: '',
},
{
text: '离线',
value: 1,
},
{
text: '在线',
value: 2,
},
],
pageOptions: {},
options1: [
{
text: '置顶',
style: {
backgroundColor: '#376cf3',
},
},
],
options12: [
{
text: '取消',
style: {
backgroundColor: '#ccc',
},
},
],
}
},
watch: {
select: {
handler(val, oldVal) {
if (this.loading) return
this.store.params.projectId =
val.projectNameIndex === 0 ? '' : this.filterProjectList[val.projectNameIndex].value
this.store.params.runStatus = val.runStatusIndex === 0 ? '' : this.projectType[val.runStatusIndex].value
this.store.params.engineerId = val.engineeringId || ''
this.store.reload()
},
deep: true,
},
},
computed: {
filterProjectList() {
return this.projectList.filter(
(item) => item.engineeringId === this.select.engineeringId || item.value === '-1',
)
},
},
created() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
onLoad(options) {
let engineering = uni.getStorageSync('engineering')
this.pageOptions = options
switch (options.type) {
case 'onLineDevs':
this.select.runStatusIndex = 2
this.select.runStatusName = '在线'
break
case 'offLineDevs':
this.select.runStatusIndex = 1
this.select.runStatusName = '离线'
break
case 'currentOnLineDevs':
this.select.runStatusIndex = 2
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
this.select.runStatusName = '在线'
break
case 'currentOffLineDevs':
this.select.runStatusIndex = 1
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
this.select.runStatusName = '离线'
break
case 'allEngineering':
this.select.engineeringName = ''
this.select.engineeringId = ''
break
case 'nowEngineering':
this.select.engineeringName = engineering.name
this.select.engineeringId = engineering.id
break
default:
break
}
this.init()
},
onShow() {
let engineering = uni.getStorageSync('onceSelectEngineering')
if (engineering) {
uni.removeStorageSync('onceSelectEngineering')
this.select.engineeringId = engineering.id
this.select.engineeringName = engineering.name
this.select.projectNameIndex = 0
this.select.projectName = ''
this.getProjectList()
}
this.store && this.store.reload()
},
methods: {
bindClick(e, item) {
engineeringPinToTop({
targetId: item.equipmentId,
targetType: 1,
userId: uni.getStorageSync(this.$cacheKey.userInfo).userIndex,
}).then((res) => {
if (res.code == 'A0000') {
this.$util.toast('操作成功!')
this.store.search()
} else {
this.$util.toast(res.message)
}
})
},
selectEngineering() {
uni.navigateTo({
url: '/pages/home/selectEngineering?from=once',
})
},
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device.png'
break
default:
str = '/static/device.png'
break
}
return str
},
switchChange(e) {
console.log(e)
let index = this.checkList.indexOf(e.equipmentId)
if (index > -1) {
this.checkList.splice(index, 1)
} else {
this.checkList.push(e.equipmentId)
}
},
cancel() {
this.transfer = false
this.share = false
this.checkList = []
},
submit() {
console.log(this.checkList)
if (this.checkList.length === 0) {
this.$util.toast('请选择设备')
return
}
if (this.transfer) {
uni.navigateTo({ url: '/pages/device/transfer?id=' + this.checkList.join(',') })
} else if (this.share) {
uni.navigateTo({ url: '/pages/device/share?id=' + this.checkList.join(',') })
}
this.cancel()
},
async init() {
console.warn('init')
this.getEngineeringList()
this.getProjectList()
this.getDeviceList()
},
getDeviceList() {
this.store = this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
this.store.params.engineerId = this.select.engineeringId
this.store.params.runStatus =
this.select.runStatusIndex === 0 ? '' : this.projectType[this.select.runStatusIndex].value
this.store.params.pageSize = 50
this.store.firstCallBack = (res) => {
this.loading = false
uni.createSelectorQuery()
.select('.uni-navbar')
.boundingClientRect((rect1) => {
if (!rect1) return
this.navTabHeight = rect1.height
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect2) => {
if (!rect2) return
// #ifdef H5
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height + 50) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height) + 'px)'
console.log(this.minHeight)
// #endif
})
.exec()
})
.exec()
}
this.store.reload()
},
getProjectList() {
getProjectList({
pageNum: 1,
pageSize: 9999,
engineeringId: this.select.engineeringId,
}).then((res) => {
console.log(res)
let arr = [
{
text: '全部项目',
value: '-1',
},
...res.data.records.map((item) => {
return {
text: item.name,
value: item.id,
...item,
}
}),
]
this.projectList = arr
uni.setStorageSync('projectList', arr)
})
},
getEngineeringList() {
this.engineeringList = uni.getStorageSync('engineeringList')
},
queryDictData() {
queryDictData('项目类型').then((res) => {
this.projectType = [
{
text: '全部类型',
value: '',
},
...res.data.map((item) => {
return {
text: item.anotherName,
value: item.id,
}
}),
]
})
},
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
runStatusChange(e) {
this.select.runStatusSelect = false
this.select.runStatusIndex = e.detail.value
if (e.detail.value === 0) {
this.select.runStatusName = ''
return
}
this.select.runStatusName = this.projectType[e.detail.value].text
},
projectNameChange(e) {
this.select.selectProject = false
console.log(e)
this.select.projectNameIndex = e.detail.value
if (e.detail.value === 0) {
this.select.projectName = ''
return
}
this.select.projectName = this.projectList[e.detail.value].text
},
registerDevice() {
uni.showModal({
title: '提示',
content: '请选择设备类型',
confirmText: '直连设备',
cancelText: '网关接入',
cancelColor: '#007aff',
success: ({ confirm, cancel }) => {
if (confirm) {
uni.navigateTo({
url: '/pages/device/new',
})
} else if (cancel) {
uni.navigateTo({
url: '/pages/gateway/list',
})
}
},
})
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
navMenuClick(index) {
this.navMenuActive = index
},
jump(item) {
console.log(12321, item)
uni.navigateTo({
url:
'/pages/device/APF/detail?id=' +
item.equipmentId +
'&isPrimaryUser=' +
item.isPrimaryUser +
'&ndid=' +
item.ndid,
})
},
selectDevice(type) {
if (this.store.data.findIndex((item) => item.isPrimaryUser === '1') === -1) {
this.$util.toast('没有可操作的设备')
} else {
this[type] = true
}
}
},
}
</script>
<style lang="scss">
/deep/ .button-group--right {
padding: 0 0 20rpx;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -1,273 +1,280 @@
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="header">
<view class="header-title"
>{{ engineering.name }}
<!-- <view class="header-title-extra">用能</view> -->
</view>
<view class="header-des-mini mb10"
>{{ engineering.provinceName + engineering.cityName }} {{ engineering.createTime }}</view
>
<view class="header-des">工程描述{{ engineering.description }} </view>
</view>
<view class="nav">
<view
class="nav-menu"
:class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList"
:key="index"
@click="navMenuClick(index)"
>{{ item.text }}
</view>
</view>
<view class="content" :style="{ minHeight: 'calc(100vh - ' + navHeight + 'px)' }">
<view v-show="navMenuActive == 0">
<uni-card
:title="item.name"
extra="🔍"
@click="jumpProject(item)"
v-for="(item, index) in store.data"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>设备个数</view>
<view>{{ item.devNum }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card>
<Cn-empty v-if="store.empty"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
<view style="padding: 0 20rpx" v-show="navMenuActive == 2">
<image
class="gplot gplot-box"
mode="aspectFill"
src="/static/test2.pic.png"
v-for="(item, key) in 3"
:key="key"
/>
</view>
</view>
<uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
v-if="content.length"
/>
<uni-popup ref="share" type="share" background-color="#fff">
<uni-popup-share title="分享到"></uni-popup-share>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import list from '../../common/js/list'
import { deleteEngineering } from '../../common/api/engineering'
export default {
mixins: [list],
data() {
return {
loading: false,
engineering: '',
navMenuList: [
{
text: '项目',
},
// {
// text: '拓扑图',
// },
],
content: [
// {
// iconPath: '/static/share.png',
// text: '编辑',
// },
// {
// iconPath: '/static/delate.png',
// text: '删除',
// },
],
navHeight: 0,
navMenuActive: 0,
}
},
methods: {
trigger(e) {
console.log(this.$refs)
if (e.item.text == '移交') {
uni.navigateTo({
url: '/pages/gc/transfer',
})
} else if (e.item.text == '分享') {
this.$refs.share.open()
} else if (e.item.text == '编辑') {
uni.navigateTo({
url: '/pages/engineering/new?engineering=' + encodeURIComponent(JSON.stringify(this.engineering)),
})
} else if (e.item.text == '删除') {
uni.showModal({
title: '提示',
content: '删除工程后不可恢复,是否继续?',
success: (res) => {
if (res.confirm) {
deleteEngineering(this.engineering.id).then((res) => {
this.$util.toast('删除成功')
this.$util.refreshPrePage()
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
}
},
navMenuClick(index) {
this.navMenuActive = index
},
goUserDetail() {
uni.navigateTo({
url: '/pages/mine/userDetail',
})
},
del() {
console.log('del')
uni.showModal({
title: '提示',
content: '确定要移除该成员吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
},
goDevice() {
uni.navigateTo({
url: '/pages/device/APF/detail',
})
},
jumpProject(item) {
uni.navigateTo({
url: '/pages/project/detail?project=' + encodeURIComponent(JSON.stringify(item)),
})
},
init() {
this.store = this.DataSource('/cs-device-boot/project/queryProject')
this.store.params.engineeringId = this.engineering.id
this.store.reload()
},
},
onLoad(option) {
this.engineering = JSON.parse(decodeURIComponent(option.engineering))
let userInfo = uni.getStorageSync('userInfo')
if (userInfo.authorities == 'engineering_user' || userInfo.authorities == 'app_vip_user') {
this.content.push(
{
iconPath: '/static/share.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
this.init()
// uni.setNavigationBarTitle({ title: this.engineering })
},
}
</script>
<style lang="scss">
.detail {
.content {
box-sizing: border-box;
padding-bottom: 20rpx;
}
.header {
padding: 20rpx 20rpx 0;
.header-title {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 40rpx;
margin-bottom: 10rpx;
.header-title-extra {
font-size: 24rpx;
color: #666;
padding-right: 10rpx;
}
}
.header-des {
font-size: 28rpx;
color: #666;
}
.header-des-mini {
font-size: 24rpx;
color: #999;
}
}
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
.gplot {
position: relative;
width: 100%;
border: 8rpx solid #ccc;
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
</style>
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="header">
<view class="header-title"
>{{ engineering.name }}
<!-- <view class="header-title-extra">用能</view> -->
</view>
<view class="header-des-mini mb10"
>{{ engineering.provinceName + engineering.cityName }} {{ engineering.createTime }}</view
>
<view class="header-des">工程描述{{ engineering.description }} </view>
</view>
<view class="nav">
<view
class="nav-menu"
:class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList"
:key="index"
@click="navMenuClick(index)"
>{{ item.text }}
</view>
</view>
<view class="content" :style="{ minHeight: 'calc(100vh - ' + navHeight + 'px)' }">
<view v-show="navMenuActive == 0">
<!-- extra="🔍" -->
<uni-card
:title="item.name"
@click="jumpProject(item)"
v-for="(item, index) in store.data"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>设备个数</view>
<view>{{ item.devNum }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card>
<Cn-empty v-if="store.empty"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
<view style="padding: 0 20rpx" v-show="navMenuActive == 2">
<image
class="gplot gplot-box"
mode="aspectFill"
src="/static/test2.pic.png"
v-for="(item, key) in 3"
:key="key"
/>
</view>
</view>
<uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
v-if="content.length"
/>
<uni-popup ref="share" type="share" background-color="#fff">
<uni-popup-share title="分享到"></uni-popup-share>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import list from '../../common/js/list'
import { deleteEngineering } from '../../common/api/engineering'
export default {
mixins: [list],
data() {
return {
loading: false,
engineering: '',
navMenuList: [
{
text: '项目',
},
// {
// text: '拓扑图',
// },
],
content: [
// {
// iconPath: '/static/share.png',
// text: '编辑',
// },
// {
// iconPath: '/static/delate.png',
// text: '删除',
// },
],
navHeight: 0,
navMenuActive: 0,
}
},
methods: {
trigger(e) {
console.log(this.$refs)
if (e.item.text == '移交') {
uni.navigateTo({
url: '/pages/gc/transfer',
})
} else if (e.item.text == '分享') {
this.$refs.share.open()
} else if (e.item.text == '编辑') {
uni.navigateTo({
url: '/pages/engineering/new?engineering=' + encodeURIComponent(JSON.stringify(this.engineering)),
})
} else if (e.item.text == '删除') {
uni.showModal({
title: '提示',
content: '删除工程后不可恢复,是否继续?',
success: (res) => {
if (res.confirm) {
deleteEngineering(this.engineering.id).then((res) => {
this.$util.toast('删除成功')
this.$util.refreshPrePage()
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
}
},
navMenuClick(index) {
this.navMenuActive = index
},
goUserDetail() {
uni.navigateTo({
url: '/pages/mine/userDetail',
})
},
del() {
console.log('del')
uni.showModal({
title: '提示',
content: '确定要移除该成员吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
},
goDevice() {
uni.navigateTo({
url: '/pages/device/APF/detail',
})
},
jumpProject(item) {
uni.navigateTo({
url: '/pages/project/detail?project=' + encodeURIComponent(JSON.stringify(item)),
})
},
init() {
this.store = this.DataSource('/cs-device-boot/project/queryProject')
this.store.params.engineeringId = this.engineering.id
this.store.reload()
},
},
onLoad(option) {
this.engineering = JSON.parse(decodeURIComponent(option.engineering))
let userInfo = uni.getStorageSync('userInfo')
if (userInfo.authorities == 'engineering_user' || userInfo.authorities == 'app_vip_user') {
this.content.push(
{
iconPath: '/static/share.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
this.init()
// uni.setNavigationBarTitle({ title: this.engineering })
},
}
</script>
<style lang="scss">
.detail {
.content {
box-sizing: border-box;
padding-bottom: 20rpx;
}
.header {
padding: 20rpx 20rpx 0;
.header-title {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 40rpx;
margin-bottom: 10rpx;
.header-title-extra {
font-size: 24rpx;
color: #666;
padding-right: 10rpx;
}
}
.header-des {
font-size: 28rpx;
color: #666;
}
.header-des-mini {
font-size: 24rpx;
color: #999;
}
}
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
.gplot {
position: relative;
width: 100%;
border: 8rpx solid #ccc;
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
// margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
/deep/ .uni-card__content {
padding: 5px 10px 10px !important;
}
/deep/ .uni-card__header-content-title {
font-weight: 700;
}
</style>

View File

@@ -1,188 +1,245 @@
<template>
<view :loading="loading">
<!-- <uni-nav-bar left-icon="left" right-icon="cart" title="标题" /> -->
<uni-nav-bar
dark
:fixed="true"
status-bar
left-icon="left"
:rightIcon="
userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'
? 'plusempty'
: ''
"
background-color="#fff"
color="#111"
title="工程管理"
@clickLeft="back"
@clickRight="add"
/>
<uni-search-bar
v-model="store.params.name"
clearButton="none"
bgColor="#fff"
placeholder="请输入关键词"
@input="store.search()"
></uni-search-bar>
<view class="message">
<uni-card
:title="item.name"
extra="🔍"
@click="jump(item)"
v-for="(item, index) in store.data"
:style="{ marginTop: index === 0 ? '0' : '' }"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>区域</view>
<view>{{ item.provinceName + item.cityName }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card>
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
export default {
mixins: [list],
data() {
return {
loading: true,
userInfo: {},
}
},
methods: {
init() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.store = this.DataSource('/cs-device-boot/engineering/queryEngineeringPage')
this.store.params.name = ''
this.store.reload()
this.store.firstCallBack = (res) => {
let engineering = uni.getStorageSync('engineering')
if (!engineering) {
uni.setStorageSync('engineering', this.store.data[0])
} else {
this.store.data.forEach((item) => {
if (item.id == engineering.id) {
uni.setStorageSync('engineering', item)
}
})
}
}
},
back() {
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)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(engineering) {
uni.navigateTo({
url: `/pages/engineering/detail?engineering=${encodeURIComponent(JSON.stringify(engineering))}`,
})
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.message {
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
</style>
<template>
<view :loading="loading">
<!-- <uni-nav-bar left-icon="left" right-icon="cart" title="标题" /> -->
<uni-nav-bar dark :fixed="true" status-bar left-icon="left" :rightIcon="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'
? 'plusempty'
: ''
" background-color="#fff" color="#111" title="工程管理" @clickLeft="back" @clickRight="add" />
<uni-search-bar v-model="store.params.name" clearButton="none" bgColor="#fff" placeholder="请输入关键词"
@input="store.search()"></uni-search-bar>
<view class="message">
<uni-swipe-action>
<uni-swipe-action-item v-for="(item, index) in store.data"
:style="{ marginTop: index === 0 ? '0' : '' }" :key="index" :threshold="0"
:right-options="item.isTop == 0 ? options1 : options12" @click="bindClick($event, item)">
<!-- extra="🔍" -->
<uni-card class="boxClick" :title="item.name" @click="jump(item)">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>区域</view>
<view>{{ item.provinceName + item.cityName }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
<view class="pinToTop" v-if="item.isTop == 1"> 置顶 </view>
</uni-card>
</uni-swipe-action-item>
</uni-swipe-action>
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
<uni-load-more v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"></uni-load-more>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
import { engineeringPinToTop } from '@/common/api/device'
export default {
mixins: [list],
data() {
return {
loading: true,
userInfo: {},
options1: [
{
text: '置顶',
style: {
backgroundColor: '#376cf3',
},
},
],
options12: [
{
text: '取消',
style: {
backgroundColor: '#ccc',
},
},
],
}
},
methods: {
bindClick(e, item) {
engineeringPinToTop({
targetId: item.id,
targetType: 2,
userId: uni.getStorageSync(this.$cacheKey.userInfo).userIndex,
}).then((res) => {
if (res.code == 'A0000') {
this.$util.toast('操作成功!')
this.store.search()
} else {
this.$util.toast(res.message)
}
})
},
init() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.store = this.DataSource('/cs-device-boot/engineering/queryEngineeringPage')
this.store.params.name = ''
this.store.reload()
this.store.firstCallBack = (res) => {
let engineering = uni.getStorageSync('engineering')
if (!engineering) {
uni.setStorageSync('engineering', this.store.data[0])
} else {
this.store.data.forEach((item) => {
if (item.id == engineering.id) {
uni.setStorageSync('engineering', item)
}
})
}
}
},
back() {
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)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(engineering) {
uni.navigateTo({
url: `/pages/engineering/detail?engineering=${encodeURIComponent(JSON.stringify(engineering))}`,
})
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.message {
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
// margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
/deep/ .uni-card--border {
margin: 0 10px !important;
padding-bottom: 10px;
}
/deep/ .uni-swipe {
margin-bottom: 10px;
}
.pinToTop {
background-color: $uni-theme-color;
width: 100rpx;
height: 60rpx;
line-height: 90rpx;
text-align: center;
color: #fff;
font-size: 20rpx;
position: absolute;
top: 0rpx;
right: 0rpx;
position: absolute;
top: 0;
right: 0;
/* 核心:旋转成斜三角效果 */
transform: rotate(45deg) translate(50rpx, -10rpx);
transform-origin: top right;
}
/deep/ .uni-card__content {
padding: 5px 10px 10px !important;
}
/deep/ .uni-card__header-content-title {
font-weight: 700;
}
</style>

View File

@@ -1,224 +1,225 @@
<template>
<view :loading="loading">
<uni-search-bar v-model="keyWord" bgColor="#fff" placeholder="请输入关键词"></uni-search-bar>
<view class="message">
<!-- <uni-card
:title="item.engineerName"
:extra="item.mac"
@click="jump(item)"
v-for="(item, index) in list"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>区域</view>
<view>{{ item.provinceName + item.cityName }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card> -->
<uni-list>
<uni-list-item @click="jump(item)" v-for="(item, index) in filterList" :key="index">
<template v-slot:header>
<view class="slot-box">
<view class="slot-box-left hide-txt mr20">{{ item.engineerName }}</view>
<switch
:checked="selectList.indexOf(item.engineerId) > -1"
style="transform: scale(0.8)"
@change="switchChange(item)"
/>
</view>
</template>
</uni-list-item>
</uni-list>
<uni-load-more v-if="list && list.length > 0" status="nomore"></uni-load-more>
<Cn-empty v-else style="padding-top: 300rpx"></Cn-empty>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
import {queryAllEnginner, csMarketDataAdd, queryEngineering} from '@/common/api/engineering'
export default {
data() {
return {
loading: true,
userInfo: {},
list: [],
selectList: [],
keyWord: '',
}
},
computed: {
filterList() {
return this.list.filter((item) => {
return item.engineerName.indexOf(this.keyWord) > -1
})
},
},
methods: {
switchChange(e) {
console.log(e)
let index = this.selectList.indexOf(e.engineerId)
if (index > -1) {
this.selectList.splice(index, 1)
} else {
this.selectList.push(e.engineerId)
}
csMarketDataAdd({
engineerIds: this.selectList,
}).then((res) => {
console.log(res)
})
},
init() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
queryAllEnginner().then((res) => {
this.list = res.data
console.log(this.list)
this.selectList = res.data.filter((item) => item.isSelect === '1').map((item) => item.engineerId)
console.log(this.selectList)
this.loading = false
})
},
back() {
uni.navigateBack()
},
add() {
uni.navigateTo({
url: `/pages/engineering/new`,
})
},
upgrade(code) {
console.log(code)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(engineering) {
uni.navigateTo({
url: `/pages/engineering/detail?engineering=${encodeURIComponent(JSON.stringify(engineering))}`,
})
},
},
onBackPress() {
console.log('onBackPress')
let engineering = uni.getStorageSync('engineering')
queryEngineering().then(res => {
if (res.data.length === 0) {
uni.removeStorage({
key: this.$cacheKey.engineering,
})
} else if (engineering && !res.data.some(item => item.id = engineering.id)) {
uni.removeStorage({
key: this.$cacheKey.engineering,
})
} else {
uni.setStorage({
key: this.$cacheKey.engineering,
data: res.data[0],
})
}
})
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.message {
/deep/ .slot-box {
width: 100%;
display: flex;
align-items: center;
&-left {
flex: 1;
margin-right: 20rpx;
}
}
/deep/ .uni-list-item__content {
padding-right: 0;
}
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
</style>
<template>
<view :loading="loading">
<uni-search-bar v-model="keyWord" bgColor="#fff" placeholder="请输入关键词"></uni-search-bar>
<view class="message">
<!-- <uni-card
:title="item.engineerName"
:extra="item.mac"
@click="jump(item)"
v-for="(item, index) in list"
:key="index"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>区域</view>
<view>{{ item.provinceName + item.cityName }}</view>
</view>
<view class="term-list-bottom-item">
<view>创建时间</view>
<view>{{ item.createTime }}</view>
</view>
</view>
</uni-card> -->
<uni-list>
<uni-list-item @click="jump(item)" v-for="(item, index) in filterList" :key="index">
<template v-slot:header>
<view class="slot-box">
<view class="slot-box-left hide-txt mr20">{{ item.engineerName }}</view>
<switch
:checked="selectList.indexOf(item.engineerId) > -1"
style="transform: scale(0.8)"
@change="switchChange(item)"
/>
</view>
</template>
</uni-list-item>
</uni-list>
<uni-load-more v-if="list && list.length > 0" status="nomore"></uni-load-more>
<Cn-empty v-else style="padding-top: 300rpx"></Cn-empty>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
import { queryAllEnginner, csMarketDataAdd, queryEngineering } from '@/common/api/engineering'
export default {
data() {
return {
loading: true,
userInfo: {},
list: [],
selectList: [],
keyWord: '',
}
},
computed: {
filterList() {
return this.list.filter((item) => {
return item.engineerName.indexOf(this.keyWord) > -1
})
},
},
methods: {
switchChange(e) {
console.log(e)
let index = this.selectList.indexOf(e.engineerId)
if (index > -1) {
this.selectList.splice(index, 1)
} else {
this.selectList.push(e.engineerId)
}
},
init() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
queryAllEnginner().then((res) => {
this.list = res.data
console.log(this.list)
this.selectList = res.data.filter((item) => item.isSelect === '1').map((item) => item.engineerId)
console.log(this.selectList)
this.loading = false
})
},
back() {
uni.navigateBack()
},
add() {
uni.navigateTo({
url: `/pages/engineering/new`,
})
},
upgrade(code) {
console.log(code)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(engineering) {
uni.navigateTo({
url: `/pages/engineering/detail?engineering=${encodeURIComponent(JSON.stringify(engineering))}`,
})
},
},
onUnload() {
csMarketDataAdd({
engineerIds: this.selectList,
}).then((res) => {
console.log(res)
})
},
onBackPress() {
console.log('onBackPress')
let engineering = uni.getStorageSync('engineering')
queryEngineering().then((res) => {
if (res.data.length === 0) {
uni.removeStorage({
key: this.$cacheKey.engineering,
})
} else if (engineering && !res.data.some((item) => (item.id = engineering.id))) {
uni.removeStorage({
key: this.$cacheKey.engineering,
})
} else {
uni.setStorage({
key: this.$cacheKey.engineering,
data: res.data[0],
})
}
})
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.message {
/deep/ .slot-box {
width: 100%;
display: flex;
align-items: center;
&-left {
flex: 1;
margin-right: 20rpx;
}
}
/deep/ .uni-list-item__content {
padding-right: 0;
}
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
</style>

View File

@@ -1,113 +1,113 @@
<template>
<Cn-page :loading='loading' noPadding>
<view slot='body'>
<view class='detail device'>
<view class="header">
<image src="/static/test2.pic.png" mode="widthFix" style="width: 100%;" />
</view>
<view class="title">基本信息</view>
<view class="des">
<text>名称监测网关</text>
<text class="ml20">项目XXX项目1</text>
</view>
<view class="des">
<text>设备型号PQS-882</text>
<text class="ml20">版本号v1.0.0</text>
</view>
<view class="title mb20 m340">设备列表
<view class="footer-btn" v-if="userInfo.authorities != '2' && userInfo.authorities != '5'" @click="newDevice">注册设备
</view>
</view>
<uni-card :title="'设备' + item" :sub-title="'XXX项目1'" extra="用能" v-for="item in 2" :key="item"
@click="goDevice" padding="0" thumbnail="/static/device.png">
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
<view style="height:20rpx"></view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false,
userInfo: {},
deviceList: [
{
name: '设备1',
des: '设备描述1',
type: 'APF',
project: '监测',
},
{
name: '设备2',
des: '设备描述2',
type: 'DVR',
project: '监测'
},
]
}
},
methods: {
newDevice () {
uni.navigateTo({
url: '/pages/gateway/newDevice'
})
},
goDevice (item) {
uni.navigateTo({
url: `/pages/device/${item.type}/detail`
})
}
},
onLoad (options) {
this.userInfo = uni.getStorageSync('userInfo')
},
}
</script>
<style lang='scss'>
.detail {
// background: $uni-theme-white;
.header {
position: relative;
}
.title {
display: flex;
justify-content: space-between;
padding: 20rpx 20rpx 0;
font-size: 36rpx;
color: #111;
font-weight: 700;
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
.des {
padding: 20rpx 20rpx 0;
font-size: 28rpx;
color: #333;
}
.content {
box-sizing: border-box;
}
}
<template>
<Cn-page :loading='loading' noPadding>
<view slot='body'>
<view class='detail device'>
<view class="header">
<image src="/static/test2.pic.png" mode="widthFix" style="width: 100%;" />
</view>
<view class="title">基本信息</view>
<view class="des">
<text>名称监测网关</text>
<text class="ml20">项目XXX项目1</text>
</view>
<view class="des">
<text>设备型号PQS-882</text>
<text class="ml20">版本号v1.0.0</text>
</view>
<view class="title mb20 m340">设备列表
<view class="footer-btn" v-if="userInfo.authorities != '2' && userInfo.authorities != '5'" @click="newDevice">注册设备
</view>
</view>
<uni-card :title="'设备' + item" :sub-title="'XXX项目1'" extra="用能" v-for="item in 2" :key="item"
@click="goDevice" padding="0" thumbnail="/static/device.png">
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
<view style="height:20rpx"></view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false,
userInfo: {},
deviceList: [
{
name: '设备1',
des: '设备描述1',
type: 'APF',
project: '监测',
},
{
name: '设备2',
des: '设备描述2',
type: 'DVR',
project: '监测'
},
]
}
},
methods: {
newDevice () {
uni.navigateTo({
url: '/pages/gateway/newDevice'
})
},
goDevice (item) {
uni.navigateTo({
url: `/pages/device/${item.type}/detail`
})
}
},
onLoad (options) {
this.userInfo = uni.getStorageSync('userInfo')
},
}
</script>
<style lang='scss'>
.detail {
// background: $uni-theme-white;
.header {
position: relative;
}
.title {
display: flex;
justify-content: space-between;
padding: 20rpx 20rpx 0;
font-size: 36rpx;
color: #111;
font-weight: 700;
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
.des {
padding: 20rpx 20rpx 0;
font-size: 28rpx;
color: #333;
}
.content {
box-sizing: border-box;
}
}
</style>

View File

@@ -1,97 +1,160 @@
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="select-enineering">
<uni-indexed-list
:options="engineeringListFilter"
:showSelect="false"
@click="confirm"
></uni-indexed-list>
</view>
</view>
</Cn-page>
</template>
<script>
import { pinyin } from 'pinyin-pro'
import { queryEngineering } from '@/common/api/engineering'
export default {
data() {
return {
loading: false,
engineeringList: [],
options: {},
}
},
computed: {
engineeringListFilter() {
let result = []
this.engineeringList.forEach((item) => {
let arr = pinyin(item.name[0], { toneType: 'none', type: 'array' })
let letter = arr[0][0].toUpperCase()
console.log(letter)
let index = result.findIndex((item) => item.letter === letter)
if (index === -1) {
result.push({
letter,
data: [item.name],
})
} else {
result[index].data.push(item.name)
}
})
return result
},
},
onLoad(options) {
this.options = options
this.engineeringList = uni.getStorageSync('engineeringList')
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
if (!(this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user')) {
// 修改buttons
// #ifdef APP-PLUS
var webView = this.$mp.page.$getAppWebview()
// 修改buttons
webView.setTitleNViewButtonStyle(0, {
width: '0',
})
// #endif
}
},
onShow() {
queryEngineering().then((res) => {
this.engineeringList = res.data
})
},
onNavigationBarButtonTap(e) {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
uni.navigateTo({
url: `/pages/engineering/new`,
})
} else {
uni.showToast({
title: '暂无权限',
icon: 'none',
})
}
},
methods: {
confirm(e) {
console.log(e)
let engineering = this.engineeringList.find((item) => item.name === e.item.name)
if (this.options.from === 'once') {
// 创建项目的时候选择工程 用完即删
uni.setStorageSync('onceSelectEngineering', engineering)
} else {
uni.setStorageSync('engineering', engineering)
}
uni.navigateBack()
},
},
}
</script>
<style lang="scss">
.index {
padding: 34rpx;
}
</style>
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="select-enineering">
<view class="all" @click="all">全部工程</view>
<uni-indexed-list
:style="{ top: showAll ? '110rpx' : '0' }"
:options="engineeringListFilter"
:showSelect="false"
@click="confirm"
>
</uni-indexed-list>
</view>
</view>
</Cn-page>
</template>
<script>
import { pinyin } from 'pinyin-pro'
import { queryEngineering } from '@/common/api/engineering'
export default {
props: {},
data() {
return {
loading: false,
engineeringList: [],
options: {},
showAll: true,
}
},
computed: {
engineeringListFilter() {
let result = []
this.engineeringList.forEach((item) => {
let arr = pinyin(item.name[0], { toneType: 'none', type: 'array' })
let letter = arr[0][0].toUpperCase()
// console.log(letter)
let index = result.findIndex((item) => item.letter === letter)
if (index === -1) {
result.push({
letter,
data: [item.name],
})
} else {
result[index].data.push(item.name)
}
})
return result
},
},
onLoad(options) {
this.options = options
this.showAll = this.options.showAll ? true : false
this.engineeringList = uni.getStorageSync('engineeringList')
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
if (!(this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user')) {
// 修改buttons
// #ifdef APP-PLUS
var webView = this.$mp.page.$getAppWebview()
// 修改buttons
webView.setTitleNViewButtonStyle(0, {
width: '0',
})
// #endif
}
},
onShow() {
queryEngineering().then((res) => {
this.engineeringList = this.sortByFirstLetter(res.data)
})
},
onNavigationBarButtonTap(e) {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
uni.navigateTo({
url: `/pages/engineering/new`,
})
} else {
uni.showToast({
title: '暂无权限',
icon: 'none',
})
}
},
methods: {
// 处理函数
sortByFirstLetter(data) {
// 1. 添加首字母字段
const withLetter = data.map((item) => {
let letter = '#'
const firstChar = item.name?.charAt(0) || ''
if (/[A-Za-z]/.test(firstChar)) {
letter = firstChar.toUpperCase()
} else if (/[0-9]/.test(firstChar)) {
letter = '#'
} else {
const py = pinyin(firstChar, { pattern: 'first', toneType: 'none' })
letter = py ? py.toUpperCase() : '#'
}
return { ...item, letter }
})
// 2. 排序
return withLetter.sort((a, b) => {
if (a.letter === '#') return 1
if (b.letter === '#') return -1
return a.letter.localeCompare(b.letter)
})
},
all() {
uni.setStorageSync('onceSelectEngineering', {
createBy: '',
createTime: '',
updateBy: '',
updateTime: '',
id: '',
name: '',
userId: null,
province: '',
provinceName: '',
city: '',
cityName: '',
description: '',
status: '1',
})
uni.navigateBack()
},
confirm(e) {
console.log(e)
let engineering = this.engineeringList.find((item) => item.name === e.item.name)
if (this.options.from === 'once') {
// 创建项目的时候选择工程 用完即删
uni.setStorageSync('onceSelectEngineering', engineering)
} else {
uni.setStorageSync('engineering', engineering)
}
uni.navigateBack()
},
},
}
</script>
<style lang="scss">
.index {
padding: 34rpx;
}
.all {
padding-left: 30rpx;
display: flex;
align-items: center;
cursor: pointer;
height: 50px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #dedede;
background-color: #ffffff;
}
</style>

View File

@@ -0,0 +1,144 @@
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="select-enineering">
<view class="all" @click="all">全部工程</view>
<uni-indexed-list
:style="{ top: showAll ? '110rpx' : '0' }"
:options="engineeringListFilter"
:showSelect="false"
@click="confirm"
>
</uni-indexed-list>
</view>
</view>
</Cn-page>
</template>
<script>
import { pinyin } from 'pinyin-pro'
import { queryEngineering } from '@/common/api/engineering'
export default {
props: {},
data() {
return {
loading: false,
engineeringList: [],
options: {},
showAll: true,
}
},
computed: {
engineeringListFilter() {
let result = []
this.engineeringList.forEach((item) => {
let arr = pinyin(item.name[0], { toneType: 'none', type: 'array' })
let letter = arr[0][0].toUpperCase()
// console.log(letter)
let index = result.findIndex((item) => item.letter === letter)
if (index === -1) {
result.push({
letter,
data: [item.name],
})
} else {
result[index].data.push(item.name)
}
})
return result
},
},
onLoad(options) {
this.options = options
this.showAll = this.options.showAll ? true : false
this.engineeringList = uni.getStorageSync('engineeringList')
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
if (!(this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user')) {
// 修改buttons
// #ifdef APP-PLUS
var webView = this.$mp.page.$getAppWebview()
// 修改buttons
webView.setTitleNViewButtonStyle(0, {
width: '0',
})
// #endif
}
},
onShow() {
queryEngineering().then((res) => {
this.engineeringList = res.data.sort((a, b) => {
const nameA = a.name
const nameB = b.name
const isANumber = /^\d/.test(nameA)
const isBNumber = /^\d/.test(nameB)
if (isANumber !== isBNumber) {
return isANumber ? 1 : -1
}
return nameA.localeCompare(nameB, 'zh', { sensitivity: 'accent' })
})
})
},
onNavigationBarButtonTap(e) {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
uni.navigateTo({
url: `/pages/engineering/new`,
})
} else {
uni.showToast({
title: '暂无权限',
icon: 'none',
})
}
},
methods: {
all() {
uni.setStorageSync('onceSelectEngineering', {
createBy: '',
createTime: '',
updateBy: '',
updateTime: '',
id: '',
name: '',
userId: null,
province: '',
provinceName: '',
city: '',
cityName: '',
description: '',
status: '1',
})
uni.navigateBack()
},
confirm(e) {
console.log(e)
let engineering = this.engineeringList.find((item) => item.name === e.item.name)
if (this.options.from === 'once') {
// 创建项目的时候选择工程 用完即删
uni.setStorageSync('onceSelectEngineering', engineering)
} else {
uni.setStorageSync('engineering', engineering)
}
uni.navigateBack()
},
},
}
</script>
<style lang="scss">
.index {
padding: 34rpx;
}
.all {
padding-left: 30rpx;
display: flex;
align-items: center;
cursor: pointer;
height: 50px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #dedede;
background-color: #ffffff;
}
</style>

370
pages/index/comp/apply.vue Normal file
View File

@@ -0,0 +1,370 @@
<template>
<view>
<view class="filterCriteria">
<!-- 筛选条件 -->
<Cn-filterCriteria @select="select" :singleChoice="true" :showDatetime="true"> </Cn-filterCriteria>
<!-- <view class="choose1">
<view class="nav-menu nav-menu-btn" @click="selectDevice">申请报告 </view>
</view> -->
</view>
<view class="smallLabel mt20">
<view class="boxCenter">
<view>
<checkbox-group @change="changeBox" class="boxCenter"
><checkbox value="true" :checked="checkedAll" />全选 
</checkbox-group></view
>
已选择 {{ checkedTotal }} 条事件
</view>
<view class="nav-menu nav-menu-btn" @click="selectDevice">申请报告 </view>
<!-- <view style="width: 180rpx">
<picker @change="bindPickerChange" :value="sort" :range="array">
<view class="uni-input"
>{{ array[sort] }}排序
<uni-icons custom-prefix="iconfont" type="icon-paixu1" size="10" color="#2563EB"></uni-icons>
</view>
</picker>
</view> -->
</view>
<!-- 卡片 -->
<scroll-view
scroll-y="true"
@scrolltolower="scrolltolower"
class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }"
>
<!-- 循环渲染事件项 -->
<uni-card
class="event-item"
:class="judgment(item.showName).type"
v-for="(item, index) in store.data"
:key="index"
@click="clackCard(item)"
>
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
:custom-prefix="judgment(item.showName) == 'interrupt' ? 'custom-icon' : 'iconfont'"
:type="judgment(item.showName).icon"
:color="judgment(item.showName).color"
:size="judgment(item.showName).size"
></uni-icons> -->
<Cn-icon-transient :name="item.showName" />
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
<text class="event-tag" :class="`${judgment(item.showName).type}-tag`">{{
item.showName
}}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>设备名称{{ item.equipmentName }}</text>
</view>
</view>
<view class="event-action" @click="handleWrapperClick(item, !item.wavePath)">
<!-- 选择 -->
<checkbox-group @change="changeChild($event, item)"
><checkbox value="true" :disabled="!item.wavePath" :checked="item.checked" />
</checkbox-group>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<text>
{{ item.startTime ? '发生时间:' + item.startTime : '' }}
{{
item.evtParamVVaDepth != null && item.evtParamVVaDepth !== ''
? ',幅值:' + item.evtParamVVaDepth + '%'
: ''
}}
{{
item.evtParamTm != null && item.evtParamTm !== ''
? ',持续时间:' + item.evtParamTm + 's'
: ''
}}
{{
item.evtParamPhase != null && item.evtParamPhase !== ''
? ',相别:' + item.evtParamPhase
: ''
}}
</text>
</view>
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
import { applicationReport } from '@/common/api/report.js'
export default {
components: {},
props: {
navHeight: {
type: Number,
default: 0,
},
},
mixins: [list],
data() {
return {
selectValue: {},
height: 0,
checkedAll: false,
checkedTotal: 0,
sort: 0,
array: ['发生时间', '暂降深度', '持续时间'],
}
},
mounted() {},
methods: {
setHeight() {
uni.createSelectorQuery()
.select('.filterCriteria')
.boundingClientRect((rect) => {
//
// #ifdef H5
this.height = rect?.height + 170 || 0
// #endif
// #ifdef APP-PLUS
this.height = rect?.height + 110 || 0
// #endif
})
.exec()
},
async select(val) {
this.selectValue = val
await this.init()
setTimeout(() => {
this.setHeight()
}, 200)
},
init() {
this.store = this.DataSource('/cs-harmonic-boot/eventUser/queryEventpage')
this.store.params.type = 0
// this.store.params.pageSize = 10000
this.store.params.sortField = this.sort
this.store.params.engineeringid = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.deviceId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
this.store.params.target = ['Evt_Sys_DipStr']
this.store.params.startTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay
this.store.params.endTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay
// this.store.params.startTime = this.selectValue.range[0]
// this.store.params.endTime = this.selectValue.range[1]
this.store.loadedCallback = () => {
this.checkedTotal = 0
this.store.data = this.store.data.map((item) => {
item.checked = false
return item
})
}
this.store.reload()
},
// 全选
changeBox(e) {
this.checkedAll = !this.checkedAll
if (e.target.value.length > 0) {
let total = 0
this.store.data = this.store.data.map((item) => {
if (item.wavePath != null) {
item.checked = true
total += 1
} else {
item.checked = false
}
return item
})
this.checkedTotal = total
} else {
this.store.data = this.store.data.map((item) => {
item.checked = false
return item
})
this.checkedTotal = 0
}
},
changeChild(e, item) {
item.checked = !item.checked
this.checkedAll = this.store.data.every((item) => item.checked === true)
this.checkedTotal = this.store.data.filter((item) => item.checked === true).length
},
handleWrapperClick(e, flag) {
if (flag) {
return uni.showToast({
title: '当前事件没有波形,不支持生成报告!',
icon: 'none',
})
}
},
// 点击卡片
clackCard() {},
// 切换排序
bindPickerChange(e) {
this.sort = e.detail.value
this.init()
},
judgment(val, key) {
switch (val) {
case '电压暂降':
return {
type: 'sag',
icon: 'icon-a-svg4',
color: '#2563eb',
size: '25',
}
case '电压暂升':
return {
type: 'swell',
icon: 'icon-a-svg5',
color: '#e6a23c',
size: '25',
}
case '电压中断':
return {
type: 'interrupt',
icon: 'icon-zhongduan2',
color: '#6b7280',
size: '35',
}
case '瞬态':
return {
type: 'transient',
icon: 'icon-shuntaishijian',
color: '#8b5cf6',
size: '40',
}
case '未知':
return {
type: 'unknown',
icon: 'icon-wenhao',
color: '#6b7280',
size: '45',
}
}
},
// 申请
selectDevice() {
if (this.checkedTotal == 0) {
return uni.showToast({
title: '请选择事件!',
icon: 'none',
})
} else {
uni.showLoading({
title: '申请中,请稍等...',
mask: true,
})
let list = this.store.data.filter((item) => item.checked === true)
applicationReport({
list: list.map((item) => item.id),
lineId: list[0].lineId,
startTime: this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay,
endTime: this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay,
}).then((res) => {
this.checkedAll = false
this.store.reload()
uni.showToast({
icon: 'success',
mask: true,
title: '申请报告,成功!',
})
})
}
},
isAllLineIdSame(data) {
// 获取第一个元素的lineId作为基准
const baseLineId = data[0].lineId
// 遍历数组检查每个元素的lineId是否和基准一致
for (let item of data) {
// 兼容元素可能没有lineId的情况
if (!item || item.lineId !== baseLineId) {
return false
}
}
return true
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
computed: {},
watch: {},
}
</script>
<style lang="scss" scoped>
@import '@/pages/message1/index.scss';
.filterCriteria {
.nav {
background-color: #fff;
}
.choose1 {
background-color: #fff;
padding: 0 20rpx;
display: flex;
justify-content: flex-end;
/deep/ .uni-checkbox-input {
width: 30rpx;
height: 30rpx;
}
font-size: 26rpx;
}
}
.nav-menu {
height: 40rpx;
padding: 6rpx 20rpx;
// margin-left: 20rpx;
// margin-bottom: 20rpx;
line-height: 40rpx;
font-size: 24rpx;
border-radius: 8rpx;
background: #ebeaec;
color: #666;
&-active {
background: #dfe5f7;
color: $uni-theme-color;
}
&-btn {
background: $uni-theme-color;
color: #fff;
}
}
/deep/.uni-card__content {
padding: 20rpx !important;
}
.smallLabel {
justify-content: space-between;
font-size: 26rpx !important;
}
.boxCenter {
display: flex !important;
align-items: center !important;
}
</style>

View File

@@ -44,13 +44,13 @@
class="nav-menu nav-menu-btn"
@click="selectDevice('transfer')"
v-if="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'"
>移交
>移交
</view>
<view
class="nav-menu nav-menu-btn"
@click="selectDevice('share')"
v-if="userInfo.authorities === 'app_vip_user'"
>分享
>分享
</view>
</template>
<!-- <picker @change="projectTypeChange" :value="select.projectTypeIndex" :range="projectType" range-key="text">
@@ -60,37 +60,29 @@
</picker> -->
</view>
<view class="content device" :style="{ minHeight: minHeight }">
<Cn-device-card v-for="(item, index) in deviceListFilter" :device="item" :key="index">
<template v-slot:title v-if="transfer || share">
<!-- 卡片标题 -->
<view class="uni-card__header">
<view class="uni-card__header-box">
<view class="uni-card__header-avatar">
<image
class="uni-card__header-avatar-image"
:src="deviceIcon(item.runStatus)"
mode="aspectFit"
/>
</view>
<view class="uni-card__header-content">
<text class="uni-card__header-content-title uni-ellipsis">
{{ item.equipmentName }}
</text>
<text class="uni-card__header-content-subtitle uni-ellipsis">
{{ item.mac }}
</text>
</view>
</view>
<view class="uni-card__header-extra" style="position: relative">
<uni-swipe-action>
<uni-swipe-action-item
v-for="(item, index) in deviceListFilter"
:threshold="0"
:right-options="item.isTop == 0 ? options1 : options12"
@click="bindClick($event, item)"
>
<Cn-device-card :device="item" :key="index">
<template v-slot:title>
<!-- 卡片标题 -->
<switch
v-if="transfer || share"
:checked="checkList.indexOf(item.equipmentId) > -1"
style="transform: scale(0.8); position: relative; left: 20rpx"
@change="switchChange(item)"
/>
</view>
</view>
</template>
</Cn-device-card>
<view class="star-icon" v-else>
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</template>
</Cn-device-card>
</uni-swipe-action-item>
</uni-swipe-action>
<uni-load-more
v-if="store.status == 'loading' || deviceListFilter.length > 0"
:status="store.status"
@@ -102,6 +94,7 @@
<script>
import { getProjectList } from '@/common/api/project'
import { queryDictData } from '@/common/api/dictionary'
import { engineeringPinToTop } from '@/common/api/device'
export default {
props: {
@@ -129,11 +122,27 @@ export default {
projectType: [],
userInfo: {},
selectProject: false,
options1: [
{
text: '置顶',
style: {
backgroundColor: '#376cf3',
},
},
],
options12: [
{
text: '取消',
style: {
backgroundColor: '#ccc',
},
},
],
}
},
computed: {
deviceListFilter() {
let arr = this.store.data.filter((item) => {
if (this.select.projectName && this.select.projectType) {
return item.project === this.select.projectName && item.type === this.select.projectType
@@ -145,9 +154,8 @@ export default {
return true
}
})
if (this.transfer || this.share) {
return arr.filter((item) => {
return item.isPrimaryUser === '1' //&& item.process == 4
})
@@ -159,8 +167,24 @@ export default {
created() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
mounted() {},
mounted() {
},
methods: {
bindClick(e, item) {
engineeringPinToTop({
targetId: item.equipmentId,
targetType: 1,
userId: uni.getStorageSync(this.$cacheKey.userInfo).userIndex,
}).then((res) => {
if (res.code == 'A0000') {
this.$util.toast('操作成功!')
this.store.search()
} else {
this.$util.toast(res.message)
}
})
},
selectDevice(type) {
if (this.deviceListFilter.findIndex((item) => item.isPrimaryUser === '1') === -1) {
this.$util.toast('没有可操作的设备')
@@ -184,7 +208,6 @@ export default {
return str
},
switchChange(e) {
console.log(e)
let index = this.checkList.indexOf(e.equipmentId)
if (index > -1) {
this.checkList.splice(index, 1)
@@ -333,18 +356,30 @@ export default {
this.navMenuActive = index
},
jump(item) {
uni.navigateTo({
url: '/pages/device/APF/detail?id=' + item.equipmentId + '&isPrimaryUser=' + item.isPrimaryUser+ '&ndid=' + item.ndid,
url:
'/pages/device/APF/detail?id=' +
item.equipmentId +
'&isPrimaryUser=' +
item.isPrimaryUser +
'&ndid=' +
item.ndid,
})
},
},
}
</script>
<style lang="scss">
.index-device{
.index-device {
.nav-menu {
}
}
/deep/ .button-group--right {
padding: 0 0 20rpx;
}
.star-icon {
font-size: 40rpx;
}
</style>

View File

@@ -0,0 +1,285 @@
<template>
<view class="index-device">
<view class="nav" :style="{ top: navTabHeight + 'px' }"> </view>
<view class="content device project-list" :style="{ minHeight: minHeight }">
<uni-swipe-action>
<uni-swipe-action-item
v-for="(item, index) in store.data"
:threshold="0"
:right-options="item.isTop == 0 ? options1 : options12"
@click="bindClick($event, item)"
>
<uni-card :key="index">
<view class="card-header">
<view class="project-icon">
<uni-icons
custom-prefix="iconfont"
type="icon-gongcheng"
color="#2563eb"
size="45"
></uni-icons>
</view>
<view class="project-info">
<view class="project-name">{{ item.engineeringName }}</view>
<view class="project-stats">
<view class="stat-item boxClick" @click="jump('nowEngineering', item)">
<text class="stat-value blue">{{ item.devTotal }}</text>
<text class="stat-label">设备总数</text>
</view>
<view class="stat-item boxClick" @click="jump('currentOnLineDevs', item)">
<text class="stat-value green">{{ item.onlineDevTotal }}</text>
<text class="stat-label">在线设备</text>
</view>
<view class="stat-item boxClick" @click="jump('currentOffLineDevs', item)">
<text class="stat-value red">{{ item.offlineDevTotal }}</text>
<text class="stat-label">离线设备</text>
</view>
<view class="stat-item boxClick" @click="jump('event', item)">
<text class="stat-value red">{{ item.alarmTotal }}</text>
<text class="stat-label">事件数量</text>
</view>
</view>
</view>
</view>
<view class="pinToTop" v-if="item.isTop == 1"> 置顶 </view>
</uni-card>
</uni-swipe-action-item>
</uni-swipe-action>
<uni-load-more
v-if="store.status == 'loading' || deviceListFilter.length > 0"
:status="store.status"
></uni-load-more>
<Cn-empty v-else></Cn-empty>
</view>
</view>
</template>
<script>
import { engineeringPinToTop } from '@/common/api/device'
export default {
props: {
store: {
type: Object,
default: {},
},
},
data() {
return {
loading: false,
minHeight: 0,
navTabHeight: 0,
userInfo: {},
options1: [
{
text: '置顶',
style: {
backgroundColor: '#376cf3',
},
},
],
options12: [
{
text: '取消',
style: {
backgroundColor: '#ccc',
},
},
],
}
},
computed: {
deviceListFilter() {
let arr = this.store.data
return arr
},
},
created() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
mounted() {
console.log(12333, this.store)
},
methods: {
bindClick(e, item) {
engineeringPinToTop({
targetId: item.engineeringId,
targetType: 2,
userId: uni.getStorageSync(this.$cacheKey.userInfo).userIndex,
}).then((res) => {
if (res.code == 'A0000') {
this.$util.toast('操作成功!')
this.store.search()
} else {
this.$util.toast(res.message)
}
})
},
getDeviceList() {
this.store.params.pageSize = 50
this.store.firstCallBack = (res) => {
uni.createSelectorQuery()
.select('.uni-navbar')
.boundingClientRect((rect1) => {
if (!rect1) return
this.navTabHeight = rect1.height
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect2) => {
if (!rect2) return
// #ifdef H5
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height + 50) + 'px)'
// #endif
// #ifdef APP-PLUS
this.minHeight = 'calc(100vh - ' + (this.navTabHeight + rect2.height) + 'px)'
console.log(this.minHeight)
// #endif
})
.exec()
})
.exec()
}
this.store.reload()
},
async init() {
console.warn('init')
this.getDeviceList()
},
jump(type, item) {
if (type == 'event') {
// 存储参数
uni.setStorageSync('messageParams', {
engineeringName: item.engineeringName,
engineeringId: item.engineeringId, //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: '',
})
uni.switchTab({
url: '/pages/index/message1',
})
} else {
uni.setStorageSync('engineering', { name: item.engineeringName, id: item.engineeringId })
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
}
},
},
}
</script>
<style lang="scss" scoped>
.index-device {
/* 列表容器 */
// .project-card {
// background-color: #ffffff;
// border-radius: 16rpx;
// margin-bottom: 16rpx;
// padding: 24rpx;
// box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
// }
.card-header {
display: flex;
align-items: center;
}
.project-icon {
width: 110rpx;
height: 110rpx;
border-radius: 12rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 20rpx;
background-color: #2563eb20;
}
.project-info {
flex: 1;
line-height: 36rpx;
}
.project-name {
font-size: 28rpx;
font-weight: 700;
color: #333333;
margin-bottom: 20rpx;
}
.project-stats {
display: flex;
// justify-content: space-between;
}
.stat-item {
display: flex;
flex-direction: column;
align-items: center;
flex: 1;
border-right: 2rpx solid #ccc;
&:last-child {
border-right: none;
}
}
.stat-value {
font-size: 36rpx;
font-weight: 700;
}
.stat-label {
font-size: 26rpx;
margin-top: 5rpx;
// color: #666666;
}
.blue {
color: #007aff;
}
.green {
color: #34c759;
}
.red {
color: #ff3b30;
}
.icon-star {
color: #cccccc;
}
}
/deep/ .uni-card {
padding: 0 !important;
}
/deep/ .button-group--right {
padding: 0 0 20rpx;
}
.pinToTop {
background-color: $uni-theme-color;
width: 100rpx;
height: 60rpx;
line-height: 90rpx;
text-align: center;
color: #fff;
font-size: 20rpx;
position: absolute;
top: 0rpx;
right: 0rpx;
position: absolute;
top: 0;
right: 0;
/* 核心:旋转成斜三角效果 */
transform: rotate(45deg) translate(50rpx, -10rpx);
transform-origin: top right;
}
</style>

View File

@@ -1,24 +1,36 @@
<template>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 0">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(0)">
<view class="header-item-value">{{ devCount.eventCount || 0 }}</view>
<view class="header-item-label">暂态事件数</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(1)">
<view class="header-item-value">{{ devCount.harmonicCount || 0 }}</view>
<view class="header-item-label">稳态事件数</view>
</view>
<view class="header-item boxClick" @click="eningerNum">
<view class="header-item-value">{{ devCount.eningerCount || 0 }}</view>
<view class="header-item-label">工程个数</view>
</view>
</view>
<!-- <view class="mt20"></view> -->
</template>
<!-- <view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('nowEngineering')">
<view class="header-item-value"
@@ -34,135 +46,163 @@
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="canneng-index-title mt20">常用功能</view>
<view style="padding: 20rpx 20rpx 0">
<Cn-grid title="" :auto-fill="false">
<Cn-grid-item src="/static/device2.png" text="设备注册" @click="registerDevice(4)"></Cn-grid-item>
<Cn-grid-item
src="/static/device2.png"
text="功能调试"
@click="registerDevice(2)"
v-if="config.feature"
></Cn-grid-item>
<Cn-grid-item
src="/static/device2.png"
text="出厂调试"
@click="registerDevice(3)"
v-if="config.factory"
></Cn-grid-item>
<Cn-grid-item background="#fff" v-if="!config.feature"></Cn-grid-item>
<Cn-grid-item background="#fff" v-if="!config.factory"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<!-- <Cn-grid-item src="/static/gateway2.png" text="网关注册" @click="registerGateway"></Cn-grid-item> -->
<!-- <Cn-grid-item src="/static/feedback2.png" text="问题反馈" @click="submitFeedBack"></Cn-grid-item>-->
</Cn-grid>
</view>
<uni-popup ref="popup" type="dialog" @maskClick="maskClick">
<uni-popup-dialog
mode="base"
type="info"
content="请选择设备类型"
:duration="0"
confirmText="直连设备"
cancelText="网关接入"
cancelColor="#007aff"
@close="close"
@confirm="confirm"
></uni-popup-dialog>
</uni-popup>
</view>
</view> -->
<view class="canneng-index-title mt20">常用功能</view>
<view style="padding: 20rpx 20rpx 0">
<Cn-grid title="" :auto-fill="false">
<Cn-grid-item
class="boxClick"
src="/static/device2.png"
text="设备注册"
@click="registerDevice(4)"
></Cn-grid-item>
<!-- <Cn-grid-item
src="/static/device2.png"
text="功能调试"
@click="registerDevice(2)"
v-if="config.feature"
></Cn-grid-item>
<Cn-grid-item
src="/static/device2.png"
text="出厂调试"
@click="registerDevice(3)"
v-if="config.factory"
></Cn-grid-item> -->
<!-- <Cn-grid-item background="#fff" v-if="!config.feature"></Cn-grid-item>
<Cn-grid-item background="#fff" v-if="!config.factory"></Cn-grid-item> -->
<Cn-grid-item background="#fff"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<Cn-grid-item background="#fff"></Cn-grid-item>
<!-- <Cn-grid-item src="/static/gateway2.png" text="网关注册" @click="registerGateway"></Cn-grid-item> -->
<!-- <Cn-grid-item src="/static/feedback2.png" text="问题反馈" @click="submitFeedBack"></Cn-grid-item>-->
</Cn-grid>
</view>
<uni-popup ref="popup" type="dialog" @maskClick="maskClick">
<uni-popup-dialog
mode="base"
type="info"
content="请选择设备类型"
:duration="0"
confirmText="直连设备"
cancelText="网关接入"
cancelColor="#007aff"
@close="close"
@confirm="confirm"
></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
loading: true,
config: {
feature: true,
factory: true,
},
type: 0,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
created() {
this.init()
},
methods: {
init() {
console.log('工程init')
let serverConfig = uni.getStorageSync(this.$cacheKey.serverConfig)
serverConfig && (this.config = serverConfig)
},
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
registerDevice(type) {
this.type = type
this.$refs.popup.open()
// uni.showModal({
// title: '提示',
// content: '请选择设备类型',
// confirmText: '直连设备',
// cancelText: '网关接入',
// cancelColor: '#007aff',
// success: ({ confirm, cancel }) => {
// if (confirm) {
// if (this.devCount.engineeringListLength > 0) {
// uni.navigateTo({
// url: '/pages/device/new?type=' + type,
// })
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index&type=' + type,
// })
// }
// } else if (cancel) {
// // uni.navigateTo({
// // url: '/pages/gateway/list',
// // })
// this.$util.toast('功能正在开发,敬请期待')
// }
// },
// })
},
maskClick() {
this.$refs.popup.close()
},
close() {
this.$util.toast('功能正在开发,敬请期待')
this.$refs.popup.close()
},
confirm(value) {
if (this.devCount.engineeringListLength > 0) {
uni.navigateTo({
url: '/pages/device/new?type=' + this.type,
})
} else {
uni.navigateTo({
url: '/pages/engineering/new?from=index&type=' + this.type,
})
}
data() {
return {
loading: true,
config: {
feature: true,
factory: true,
},
type: 0,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
created() {
this.init()
},
methods: {
init() {
console.log('工程init')
let serverConfig = uni.getStorageSync(this.$cacheKey.serverConfig)
serverConfig && (this.config = serverConfig)
},
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
registerDevice(type) {
this.type = type
this.$refs.popup.open()
// uni.showModal({
// title: '提示',
// content: '请选择设备类型',
// confirmText: '直连设备',
// cancelText: '网关接入',
// cancelColor: '#007aff',
// success: ({ confirm, cancel }) => {
// if (confirm) {
// if (this.devCount.engineeringListLength > 0) {
// uni.navigateTo({
// url: '/pages/device/new?type=' + type,
// })
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index&type=' + type,
// })
// }
// } else if (cancel) {
// // uni.navigateTo({
// // url: '/pages/gateway/list',
// // })
// this.$util.toast('功能正在开发,敬请期待')
// }
// },
// })
},
maskClick() {
this.$refs.popup.close()
},
close() {
this.$util.toast('功能正在开发,敬请期待')
this.$refs.popup.close()
},
confirm(value) {
// if (this.devCount.engineeringListLength > 0) {
uni.navigateTo({
url: '/pages/device/new?type=' + this.type,
})
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index&type=' + this.type,
// })
// }
this.$refs.popup.close()
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
this.$refs.popup.close()
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
jumpMessage(type) {
uni.setStorageSync('messageParams', {
engineeringName: '',
engineeringId: '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: type,
})
uni.switchTab({
url: '/pages/index/message1',
})
},
eningerNum() {
uni.navigateTo({
url: '/pages/engineering/list',
})
},
},
}
</script>
<style lang="scss"></style>

View File

@@ -1,72 +1,71 @@
<template>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('nowEngineering')">
<view class="header-item-value">{{
devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0
}}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view style="padding: 20rpx 20rpx 0">
<Cn-grid title="">
<Cn-grid-item src="/static/device2.png" text="设备注册" @click="registerDevice"></Cn-grid-item>
<!-- <Cn-grid-item src="/static/gateway2.png" text="网关注册" @click="registerGateway"></Cn-grid-item> -->
<Cn-grid-item src="/static/feedback2.png" text="问题反馈" @click="submitFeedBack"></Cn-grid-item>
</Cn-grid>
</view>
</view>
</template>
<script>
export default {
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
jump(type) {
uni.navigateTo({
url:
'/pages/device/list?type=' + type
})
},
submitFeedBack() {
uni.navigateTo({url: '/pages/home/feedback'})
},
registerDevice() {
this.$util.toast('此功能仅对正式用户开放')
},
},
}
</script>
<style lang="scss"></style>
<template>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('nowEngineering')">
<view class="header-item-value">{{
devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0
}}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<!-- <view style="padding: 20rpx 20rpx 0">
<Cn-grid title="">
<Cn-grid-item src="/static/device2.png" text="设备注册" @click="registerDevice"></Cn-grid-item>
<Cn-grid-item src="/static/feedback2.png" text="问题反馈" @click="submitFeedBack"></Cn-grid-item>
</Cn-grid>
</view> -->
</view>
</template>
<script>
export default {
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
jump(type) {
uni.navigateTo({
url:
'/pages/device/list?type=' + type
})
},
submitFeedBack() {
uni.navigateTo({url: '/pages/home/feedback'})
},
registerDevice() {
this.$util.toast('此功能仅对正式用户开放')
},
},
}
</script>
<style lang="scss"></style>

View File

@@ -1,122 +1,135 @@
<template>
<view class="index-zhuanzhi">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{ devCount.alarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{
devCount.eventCount + devCount.runCount + devCount.harmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item" @click="eningerNum">
<view class="header-item-value">{{ devCount.eningerCount || 0 }}</view>
<view class="header-item-label">工程个数</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('nowEngineering')">
<view class="header-item-value">{{
devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0
}}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{ devCount.currentAlarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{
devCount.currentEventCount + devCount.currentRunCount + devCount.currentHarmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item" @click="projectNum(true)">
<view class="header-item-value">{{ devCount.currentProjectCount || 0 }}</view>
<view class="header-item-label">项目个数</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
jumpMessage(){
uni.switchTab({
url: '/pages/index/message',
})
},
eningerNum(){
uni.navigateTo({
url: '/pages/engineering/list',
})
},
projectWarning() {
uni.navigateTo({
url: '/pages/zhuanzhi/warning',
})
},
projectNum() {
console.log(now)
if (now) {
let engineering = uni.getStorageSync('engineering')
uni.navigateTo({
url: '/pages/project/list?engineeringName=' + engineering.name + '&engineeringId=' + engineering.id,
})
} else {
uni.navigateTo({
url: '/pages/project/list',
})
}
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
created() {},
}
</script>
<style lang="scss">
.index-zhuanzhi {
}
</style>
<template>
<view class="index-zhuanzhi">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(2, false)">
<view class="header-item-value">{{ devCount.alarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(0, false)">
<view class="header-item-value">{{
devCount.eventCount + devCount.runCount + devCount.harmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item boxClick" @click="eningerNum">
<view class="header-item-value">{{ devCount.eningerCount || 0 }}</view>
<view class="header-item-label">工程个数</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('nowEngineering')">
<view class="header-item-value">{{
devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0
}}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(2, true)">
<view class="header-item-value">{{ devCount.currentAlarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(0, true)">
<view class="header-item-value">{{
devCount.currentEventCount + devCount.currentRunCount + devCount.currentHarmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item boxClick" @click="projectNum(true)">
<view class="header-item-value">{{ devCount.currentProjectCount || 0 }}</view>
<view class="header-item-label">项目个数</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
jumpMessage(type, flag) {
uni.setStorageSync('messageParams', {
// name: flag ? uni.getStorageSync('engineering').name : '',
// id: flag ? uni.getStorageSync('engineering').id : '',
engineeringName: flag ? uni.getStorageSync('engineering').name : '',
engineeringId: flag ? uni.getStorageSync('engineering').id : '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: type,
})
uni.switchTab({
url: '/pages/index/message1',
})
},
eningerNum() {
uni.navigateTo({
url: '/pages/engineering/list',
})
},
projectWarning() {
uni.navigateTo({
url: '/pages/zhuanzhi/warning',
})
},
projectNum(now) {
console.log(now)
if (now) {
let engineering = uni.getStorageSync('engineering')
uni.navigateTo({
url: '/pages/project/list?engineeringName=' + engineering.name + '&engineeringId=' + engineering.id,
})
} else {
uni.navigateTo({
url: '/pages/project/list',
})
}
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
created() {},
}
</script>
<style lang="scss">
.index-zhuanzhi {
}
</style>

View File

@@ -1,143 +1,174 @@
<template>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('nowEngineering')">
<view class="header-item-value"
>{{ devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0 }}
</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="canneng-index-title mt20">常用功能</view>
<view style="padding: 20rpx 20rpx 0">
<Cn-grid title="">
<Cn-grid-item src="/static/device2.png" text="设备注册" @click="registerDevice"></Cn-grid-item>
<!-- <Cn-grid-item src="/static/gateway2.png" text="网关注册" @click="registerGateway"></Cn-grid-item> -->
<Cn-grid-item src="/static/feedback2.png" text="问题反馈" @click="submitFeedBack"></Cn-grid-item>
</Cn-grid>
</view>
<uni-popup ref="popup" type="dialog" @maskClick='maskClick'>
<uni-popup-dialog
mode="base"
type="info"
content="请选择设备类型"
:duration="0"
confirmText="直连设备"
cancelText="网关接入"
cancelColor= '#007aff'
@close="close"
@confirm="confirm"
></uni-popup-dialog>
</uni-popup>
</view>
<view class="index-zhuyonghu">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('nowEngineering')">
<view class="header-item-value"
>{{ devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0 }}
</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage('0')">
<view class="header-item-value">{{ devCount.currentEventCount || 0 }}</view>
<view class="header-item-label">暂态事件数</view>
</view>
<view class="header-item boxClick" @click="jumpMessage('1')">
<view class="header-item-value">{{ devCount.currentHarmonicCount || 0 }}</view>
<view class="header-item-label">稳态事件数</view>
</view>
</view>
<view class="canneng-index-title mt20">常用功能</view>
<view style="padding: 20rpx 20rpx 0">
<Cn-grid title="">
<Cn-grid-item
src="/static/device2.png"
class="boxClick"
text="设备注册"
@click="registerDevice"
></Cn-grid-item>
<!-- <Cn-grid-item src="/static/gateway2.png" text="网关注册" @click="registerGateway"></Cn-grid-item> -->
<Cn-grid-item
src="/static/feedback2.png"
class="boxClick"
text="问题反馈"
@click="submitFeedBack"
></Cn-grid-item>
</Cn-grid>
</view>
<uni-popup ref="popup" type="dialog" @maskClick="maskClick">
<uni-popup-dialog
mode="base"
type="info"
content="请选择设备类型"
:duration="0"
confirmText="直连设备"
cancelText="网关接入"
cancelColor="#007aff"
@close="close"
@confirm="confirm"
></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
registerDevice() {
this.$refs.popup.open()
// uni.showModal({
// title: '提示',
// content: '请选择设备类型',
// confirmText: '直连设备',
// cancelText: '网关接入',
// cancelColor: '#007aff',
// success: ({confirm, cancel}) => {
// if (confirm) {
// if (this.devCount.engineeringListLength > 0) {
// uni.navigateTo({
// url: '/pages/device/new?type=4',
// })
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index'
// })
// }
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
submitFeedBack() {
uni.navigateTo({ url: '/pages/home/feedback' })
},
registerDevice() {
this.$refs.popup.open()
// uni.showModal({
// title: '提示',
// content: '请选择设备类型',
// confirmText: '直连设备',
// cancelText: '网关接入',
// cancelColor: '#007aff',
// success: ({confirm, cancel}) => {
// if (confirm) {
// if (this.devCount.engineeringListLength > 0) {
// uni.navigateTo({
// url: '/pages/device/new?type=4',
// })
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index'
// })
// }
// } else if (cancel) {
// // uni.navigateTo({
// // url: '/pages/gateway/list',
// // })
// this.$util.toast('功能正在开发,敬请期待')
// }
// },
// })
},
maskClick(){
this.$refs.popup.close()
},
close() {
this.$util.toast('功能正在开发,敬请期待')
this.$refs.popup.close()
},
confirm(value) {
if (this.devCount.engineeringListLength > 0) {
uni.navigateTo({
url: '/pages/device/new?type=4',
})
} else {
uni.navigateTo({
url: '/pages/engineering/new?from=index'
})
}
this.$refs.popup.close()
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
// } else if (cancel) {
// // uni.navigateTo({
// // url: '/pages/gateway/list',
// // })
// this.$util.toast('功能正在开发,敬请期待')
// }
// },
// })
},
maskClick() {
this.$refs.popup.close()
},
close() {
this.$util.toast('功能正在开发,敬请期待')
this.$refs.popup.close()
},
confirm(value) {
// if (this.devCount.engineeringListLength > 0) {
uni.navigateTo({
url: '/pages/device/new?type=4',
})
// } else {
// uni.navigateTo({
// url: '/pages/engineering/new?from=index',
// })
// }
this.$refs.popup.close()
},
registerGateway() {
uni.navigateTo({
url: '/pages/gateway/new',
})
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
jumpMessage(type) {
uni.setStorageSync('messageParams', {
engineeringName: '',
engineeringId: '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: type,
})
uni.switchTab({
url: '/pages/index/message1',
})
},
},
}
</script>
<style lang="scss"></style>

View File

@@ -1,122 +1,131 @@
<template>
<view class="index-zhuanzhi">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{ devCount.alarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{
devCount.eventCount + devCount.runCount + devCount.harmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item" @click="eningerNum">
<view class="header-item-value">{{ devCount.eningerCount || 0 }}</view>
<view class="header-item-label">工程个数</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item" @click="jump('nowEngineering')">
<view class="header-item-value"
>{{ devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0 }}
</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{ devCount.currentAlarmCount || 0 }}</view>
<view class="header-item-label">告警数量</view>
</view>
<view class="header-item" @click="jumpMessage">
<view class="header-item-value">{{
devCount.currentEventCount + devCount.currentRunCount + devCount.currentHarmonicCount || 0
}}</view>
<view class="header-item-label">事件数量</view>
</view>
<view class="header-item" @click="projectNum(true)">
<view class="header-item-value">{{ devCount.currentProjectCount || 0 }}</view>
<view class="header-item-label">项目个数</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
projectWarning() {
uni.navigateTo({
url: '/pages/zhuanzhi/warning',
})
},
eningerNum() {
uni.navigateTo({
url: '/pages/engineering/list',
})
},
jumpMessage(){
uni.switchTab({
url: '/pages/index/message',
})
},
projectNum(now) {
console.log(now)
if (now) {
let engineering = uni.getStorageSync('engineering')
uni.navigateTo({
url: '/pages/project/list?engineeringName=' + engineering.name + '&engineeringId=' + engineering.id,
})
} else {
uni.navigateTo({
url: '/pages/project/list',
})
}
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
created() {},
}
</script>
<style lang="scss">
.index-zhuanzhi {
}
</style>
<template>
<view class="index-zhuanzhi">
<template v-if="devCount.engineeringListLength > 1">
<view class="canneng-index-title mb20">所有工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('allEngineering')">
<view class="header-item-value">{{ devCount.onLineDevCount + devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('onLineDevs')">
<view class="header-item-value">{{ devCount.onLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('offLineDevs')">
<view class="header-item-value">{{ devCount.offLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(0, false)">
<view class="header-item-value">{{ devCount.eventCount || 0 }}</view>
<view class="header-item-label">暂态事件数</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(1, false)">
<view class="header-item-value">{{ devCount.harmonicCount || 0 }}</view>
<view class="header-item-label">稳态事件数</view>
</view>
<view class="header-item boxClick" @click="eningerNum">
<view class="header-item-value">{{ devCount.eningerCount || 0 }}</view>
<view class="header-item-label">工程个数</view>
</view>
</view>
<view class="mt20"></view>
</template>
<view class="canneng-index-title mb20">当前工程设备统计</view>
<view class="header">
<view class="header-item boxClick" @click="jump('nowEngineering')">
<view class="header-item-value"
>{{ devCount.currentOnLineDevCount + devCount.currentOffLineDevCount || 0 }}
</view>
<view class="header-item-label">设备总数</view>
</view>
<view class="header-item boxClick" @click="jump('currentOnLineDevs')">
<view class="header-item-value">{{ devCount.currentOnLineDevCount || 0 }}</view>
<view class="header-item-label">在线设备</view>
</view>
<view class="header-item boxClick" @click="jump('currentOffLineDevs')">
<view class="header-item-value">{{ devCount.currentOffLineDevCount || 0 }}</view>
<view class="header-item-label">离线设备</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(0, true)">
<view class="header-item-value">{{ devCount.currentEventCount || 0 }}</view>
<view class="header-item-label">暂态事件数</view>
</view>
<view class="header-item boxClick" @click="jumpMessage(1, true)">
<view class="header-item-value">{{ devCount.currentHarmonicCount || 0 }}</view>
<view class="header-item-label">稳态事件数</view>
</view>
<view class="header-item boxClick" @click="projectNum(true)">
<view class="header-item-value">{{ devCount.currentProjectCount || 0 }}</view>
<view class="header-item-label">项目个数</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
}
},
props: {
devCount: {
type: Object,
default: {},
},
},
methods: {
projectWarning() {
uni.navigateTo({
url: '/pages/zhuanzhi/warning',
})
},
eningerNum() {
uni.navigateTo({
url: '/pages/engineering/list',
})
},
jumpMessage(type, flag) {
uni.setStorageSync('messageParams', {
// name: flag ? uni.getStorageSync('engineering').name : '',
// id: flag ? uni.getStorageSync('engineering').id : '',
engineeringName: flag ? uni.getStorageSync('engineering').name : '',
engineeringId: flag ? uni.getStorageSync('engineering').id : '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: type,
})
uni.switchTab({
url: '/pages/index/message1',
})
},
projectNum(now) {
console.log(now)
if (now) {
let engineering = uni.getStorageSync('engineering')
uni.navigateTo({
url: '/pages/project/list?engineeringName=' + engineering.name + '&engineeringId=' + engineering.id,
})
} else {
uni.navigateTo({
url: '/pages/project/list',
})
}
},
jump(type) {
uni.navigateTo({
url: '/pages/device/list?type=' + type,
})
},
},
created() {},
}
</script>
<style lang="scss">
.index-zhuanzhi {
}
</style>

View File

@@ -0,0 +1,349 @@
<template>
<view class="dashboard-container">
<!-- 页面头部 -->
<view class="page-header">
<Cn-filterInformation @select="select" />
<view class="legend-row">
<view class="legend-item">
<view class="legend-color" style="background:#DAA520"></view>
<text class="legend-text">A相</text>
</view>
<view class="legend-item">
<view class="legend-color" style="background:#2E8B57"></view>
<text class="legend-text">B相</text>
</view>
<view class="legend-item">
<view class="legend-color" style="background:#A52A2A"></view>
<text class="legend-text">C相</text>
</view>
</view>
</view>
<!-- 监测点列表 - 竖向滚动 -->
<scroll-view class="monitors-scroll" scroll-y :show-scrollbar="true">
<view class="monitors-list">
<view v-for="(point, idx) in monitoringPoints" :key="idx" class="monitor-card">
<!-- 卡片头部 -->
<view class="card-header">
<view class="event-icon">
<Cn-icon-transient :name="`监测点`" />
</view>
<view class="card-header-info">
<view class="point-name">
<text class="point-text ellipsis">{{ point.pointName }}</text>
</view>
<view class="meta-row">
<text class="meta-item ellipsis">工程: {{ point.projectName }}</text>
<text class="meta-item ellipsis">项目: {{ point.siteName }}</text>
<text class="meta-item ellipsis meta-item-full">设备: {{ point.deviceName }}</text>
</view>
</view>
</view>
<!-- 参数区域使用 children 数据循环每两个指标放一行 -->
<view class="params-section">
<view v-for="(rowItems, rowIdx) in chunkedChildren(point.children)" :key="rowIdx"
class="double-row">
<view v-for="(child, childIdx) in rowItems" :key="childIdx" class="param-group">
<view class="param-title">
<text>{{ child.name }}</text>
</view>
<!-- 三相数据颜色区分无文字 -->
<view class="phase-vertical">
<view class="phase-item-vertical">
<text class="phase-value-vertical" style="color:#DAA520">{{ child.A }}</text>
</view>
<view class="phase-divider"></view>
<view class="phase-item-vertical">
<text class="phase-value-vertical" style="color:#2E8B57">{{ child.B }}</text>
</view>
<view class="phase-divider"></view>
<view class="phase-item-vertical">
<text class="phase-value-vertical" style="color:#A52A2A">{{ child.C }}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
// 监测点基础信息 + children 指标数据
monitoringPoints: [
{
pointName: "升压站#1主变测点",
projectName: "华光100MW工程11111",
siteName: "绿色智慧能源11111",
deviceName: "PMC-800终端",
children: [
{ name: '电压有效值(kV)', A: '10.52', B: '10.45', C: '10.39' },
{ name: '电流有效值(A)', A: '408.0', B: '395.0', C: '403.0' },
{ name: '基波电压幅值(kV)', A: '10.48', B: '10.42', C: '10.35' },
{ name: '基波电流幅值(A)', A: '405.5', B: '392.8', C: '400.2' }
]
},
{
pointName: "光伏区#3汇流箱",
projectName: "华光100MW工程",
siteName: "绿色智慧能源示范",
deviceName: "汇流监测单元",
children: [
{ name: '电压有效值(kV)', A: '10.72', B: '10.65', C: '10.59' },
{ name: '电流有效值(A)', A: '426.0', B: '413.0', C: '421.0' },
{ name: '基波电压幅值(kV)', A: '10.68', B: '10.62', C: '10.55' },
{ name: '基波电流幅值(A)', A: '423.5', B: '410.8', C: '418.2' }
]
},
],
// 三相颜色配置
phaseColors: [
{ name: 'A相', color: '#DAA520' },
{ name: 'B相', color: '#2E8B57' },
{ name: 'C相', color: '#A52A2A' }
]
}
},
methods: {
// 将 children 数组每两个一组进行分组,用于一行显示两个指标
chunkedChildren(children) {
const result = []
for (let i = 0; i < children.length; i += 2) {
result.push(children.slice(i, i + 2))
}
return result
},
select(value) {
console.log("🚀 ~ value:", value)
},
}
}
</script>
<style>
* {
box-sizing: border-box;
}
.dashboard-container {
min-height: 100vh;
background: #f5f7fb;
padding: 20rpx 20rpx 0rpx 20rpx;
display: flex;
flex-direction: column;
}
/* 头部样式 */
.page-header {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
flex-shrink: 0;
}
.title-section {
display: flex;
align-items: baseline;
gap: 12rpx;
}
.title-icon {
font-size: 40rpx;
}
.title {
font-size: 34rpx;
font-weight: 700;
color: #2c3e50;
}
/* 图例 */
.legend-row {
display: flex;
gap: 20rpx;
align-items: center;
}
.legend-item {
display: flex;
align-items: center;
gap: 6rpx;
}
.legend-color {
width: 24rpx;
height: 24rpx;
border-radius: 50%;
}
.legend-text {
font-size: 24rpx;
color: #333;
font-weight: 500;
}
/* 竖向滚动区域 */
.monitors-scroll {
flex: 1;
max-height: calc(100vh - 100rpx);
}
.monitors-list {
display: flex;
flex-direction: column;
gap: 20rpx;
padding-bottom: 20rpx;
}
/* 卡片样式 */
.monitor-card {
background: #ffffff;
border-radius: 20rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
overflow: hidden;
display: flex;
flex-direction: column;
border: 1rpx solid #e8ecf0;
}
.card-header {
padding: 20rpx 20rpx 10rpx 20rpx;
border-bottom: 1rpx solid #eef2f6;
display: flex;
align-items: center;
}
.card-header-info {
flex: 1;
min-width: 0;
overflow: hidden;
}
.point-name {
margin-bottom: 4rpx;
}
.point-text {
display: block;
font-size: 30rpx;
font-weight: 700;
color: #333333;
}
/* 工程、项目、设备:两列布局,超出显示省略号 */
.meta-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 6rpx 8rpx;
width: 100%;
}
.meta-item {
display: block;
min-width: 0;
font-size: 24rpx;
color: #666666;
line-height: 1.3;
}
.meta-item-full {
grid-column: 1 / -1;
}
/* 参数区域 */
.params-section {
padding: 20rpx 16rpx 24rpx 16rpx;
flex: 1;
}
.double-row {
display: flex;
gap: 16rpx;
margin-bottom: 16rpx;
flex-wrap: wrap;
}
.double-row:last-child {
margin-bottom: 0;
}
.param-group {
flex: 1;
min-width: 200rpx;
background: transparent;
border-radius: 20rpx;
padding: 12rpx 8rpx 8rpx;
border: 1rpx solid #e8ecf0;
}
.param-title {
font-size: 24rpx;
color: #666666;
font-weight: 650;
margin-bottom: 4rpx;
display: flex;
align-items: center;
gap: 8rpx;
padding-left: 4rpx;
}
/* 三相数据垂直布局 */
.phase-vertical {
display: flex;
align-items: stretch;
justify-content: space-between;
gap: 0;
}
.phase-item-vertical {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 4rpx 4rpx;
}
.phase-value-vertical {
font-size: 28rpx;
font-weight: 700;
display: block;
letter-spacing: -0.5rpx;
}
/* 竖线分割 */
.phase-divider {
width: 1rpx;
background-color: #e0e4e8;
margin: 8rpx 0;
}
/* 文字溢出显示省略号 */
.ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
.event-icon {
position: relative;
width: 110rpx;
height: 110rpx;
border-radius: 12rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 20rpx;
background-color: #376cf320;
}
</style>

View File

@@ -0,0 +1,346 @@
<template>
<view class="dateReport">
<!-- {{ height }} -->
<view class="pd20">
<uni-segmented-control
:current="curSub"
class="subsection"
active-color="#376cf3"
:values="subsectionList"
@clickItem="sectionChange"
/>
</view>
<view class="filterCriteria">
<!-- 筛选条件 -->
<Cn-filterCriteria @select="select" :singleChoice="true" :showDatetime="curSub == 0"> </Cn-filterCriteria>
</view>
<!-- 卡片 -->
<scroll-view
scroll-y="true"
@refresherrefresh="refresherrefresh"
:refresher-triggered="triggered"
refresher-enabled="true"
class="event-list mt20"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }"
>
<!-- 循环渲染事件项 -->
<uni-card class="event-item" :class="item.type" v-for="(item, index) in store.data" :key="index">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-kouanjiancedian"
size="40"
color="#E6A23C"
></uni-icons> -->
<Cn-icon-transient :name="`报告`" />
<view class="badge1" v-if="item.isRead == 0"> </view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
<!-- <view class="event-tags"
>{{ selectValue.report == 0 ? item.startTime : item.startTime + '至' + item.endTime }}
</view> -->
</view>
<view class="event-desc">
<text
>统计时间{{
curSub == 0 ? item.startTime : item.startTime + ' 至 ' + item.endTime
}}</text
>
</view>
</view>
<view class="event-action" v-if="curSub == 0 ? monthFlag : item.endTime != thisMonth01">
<view class="iconText boxClick" @click="download(item)"
><uni-icons type="arrow-down" color="#fff" size="16"></uni-icons>
</view>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail textBox" @touchmove.stop>
<text v-if="curSub == 0 ? monthFlag : item.endTime != thisMonth01">{{
item.overLimitDesc == '' ? '该监测点暂无指标越限' : item.overLimitDesc
}}</text>
<text v-else>数据未生成暂不支持下载</text>
</view>
<!-- <view class="downloadReport" @click="download">
<uni-icons type="download" size="16" color="#376cf3"></uni-icons>下载报告
</view> -->
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
import { downloadHarmonicReport } from '@/common/api/report.js'
export default {
components: {},
props: {
indexList: {
type: Array,
default: () => [],
},
total: {
type: Number,
default: 0,
},
navHeight: {
type: Number,
default: 0,
},
},
mixins: [list],
data() {
return {
status: 'noMore',
curSub: 0,
subsectionList: ['周报', '月报'],
thisSelectValue: {},
triggered: true,
height: 0,
thisMonth01: '',
monthFlag: true,
}
},
created() {},
mounted() {
this.thisMonth01 = this.$util.getToday().slice(0, -3) + '-01'
this.monthFlag = this.$util.getToday() != this.$util.getToday().slice(0, -3) + '-01'
// this.setHeight()
},
methods: {
setHeight() {
uni.createSelectorQuery()
.select('.filterCriteria')
.boundingClientRect((rect) => {
//
// #ifdef H5
this.height = rect?.height + 140 || 0
// #endif
// #ifdef APP-PLUS
this.height = rect?.height + 75 || 0
// #endif
})
.exec()
},
sectionChange(index) {
this.curSub = index.currentIndex
this.init()
},
init() {
if (this.selectValue.lineId == '') return
this.store = this.DataSource('/cs-report-boot/csAppReport/reportList')
// this.store.params.pageSize = 10000
this.store.params.timeType = this.curSub //this.selectValue.report
this.store.params.engineerId = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.devId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
if (this.curSub == 0) {
this.store.params.time = this.selectValue.date
} else {
this.store.params.time = this.selectValue.range + '-01'
}
// this.store.params.startTime = this.selectValue.range[0]
// this.store.params.endTime = this.selectValue.range[1]
this.store.loadedCallback = () => {}
this.store.reload()
},
select(value) {
this.selectValue = value
setTimeout(() => {
this.setHeight()
}, 200)
this.init()
},
// 下载
download(item) {
uni.showLoading({
title: '下载中,请稍等...',
mask: true,
})
downloadHarmonicReport({
devId: this.selectValue.deviceId,
endTime: item.endTime,
engineerId: this.selectValue.engineeringId,
lineId: this.selectValue.lineId,
list: [],
projectId: this.selectValue.projectId,
startTime: item.startTime,
time: '',
timeType: this.selectValue.report,
})
.then((res) => {
// 下载文件资源到本地
uni.downloadFile({
url: res.data, // 后端返回的线上文件路径
success: function (res) {
if (res.statusCode === 200) {
// 文件到本地
uni.saveFile({
tempFilePath: res.tempFilePath, //临时路径
success: function (data) {
var savedFilePath = data.savedFilePath
// 在app端执行
// #ifdef APP-PLUS
let osname = plus.os.name
// 如果是安卓的话弹出提示
uni.showToast({
icon: 'success',
mask: true,
title: '下载成功!',
duration: 1000,
})
// #endif
//ios手机直接打开文件手动存储文件到手机Android手机从根目录创建文件夹保存文件并改名
setTimeout(() => {
//打开文档查看
uni.openDocument({
filePath: data.savedFilePath,
success: function (ress) {
console.log('成功打开文件')
},
fail() {
console.log('打开文件失败')
},
})
}, 500)
},
})
console.log('下载成功')
} else {
uni.showToast({
icon: 'none',
mask: true,
title: '下载失败!',
duration: 1000,
})
}
},
fail: function (res) {},
})
})
.catch((err) => {
uni.showToast({
icon: 'none',
mask: true,
title: err.message,
duration: 1000,
})
})
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
},
computed: {},
watch: {},
}
</script>
<style lang="scss" scoped>
@import '@/pages/message1/index.scss';
.event-title {
justify-content: space-between;
}
.event-tags {
display: flex;
font-size: 27rpx !important ;
line-height: 50rpx;
}
.event-detail {
// font-size: 25rpx !important;
// display: grid;
// grid-template-columns: 1fr 1fr;
}
.downloadReport {
width: 100%;
background: #376cf320;
height: 60rpx;
line-height: 60rpx;
color: #376cf3;
font-weight: 600;
border-radius: 15rpx;
margin-top: 10rpx;
display: flex;
justify-content: center;
}
.filterCriteria {
.nav {
background-color: #fff;
}
.choose1 {
background-color: #fff;
padding: 0 20rpx;
display: flex;
justify-content: space-between;
/deep/ .uni-checkbox-input {
width: 30rpx;
height: 30rpx;
}
font-size: 26rpx;
}
}
/deep/ .uni-scroll-view-refresher {
display: none;
}
.iconText {
width: 45rpx;
height: 45rpx;
border-radius: 50%;
background-color: $uni-theme-color;
text-align: center;
line-height: 40rpx;
}
.segmented-control {
flex: 1;
margin-right: 24rpx;
height: 60rpx;
}
/* 列表容器 */
.event-list {
/* 头部:图标 + 信息 + 操作 */
.event-header {
display: flex;
align-items: center;
margin-bottom: 10rpx;
}
/* 图标区域(按类型区分背景色) */
.event-icon {
background-color: #376cf320;
}
.event-tags {
font-size: 24rpx;
}
}
.textBox {
// @touchmove.stop
max-height: 110rpx;
overflow-y: auto;
}
</style>

View File

@@ -0,0 +1,385 @@
<template>
<view class="dateReport">
<view class="pd20">
<uni-segmented-control :current="curSub" class="subsection" active-color="#376cf3" :values="subsectionList"
@clickItem="sectionChange" />
</view>
<!-- 申请报告 -->
<view v-show="curSub == 0">
<!-- apply -->
<Apply ref="applyRef" :navHeight="navHeight" />
</view>
<!-- 申请记录 -->
<view v-if="curSub == 1">
<view class="filterCriteria">
<!-- 筛选条件 -->
<Cn-filterCriteria @select="select" :showQianTree="false"> </Cn-filterCriteria>
</view>
<scroll-view scroll-y="true" @refresherrefresh="refresherrefresh" @scrolltolower="scrolltolower"
:refresher-triggered="triggered" refresher-enabled="true" class="record event-list mt20"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }">
<uni-card class="event-item" :class="item.type" v-for="(item, index) in store.data" :key="index">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- :style="{ backgroundColor: item.isComplete == 1 ? '#10b98120' : '#FF000020' }" -->
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-baogaoguanli"
size="40"
:color="item.isComplete == 1 ? '#10b981' : '#FF0000'"
></uni-icons> -->
<Cn-icon-transient :name="`报告`" />
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>设备名称{{ item.deviceName }}</text>
<!-- <text>申请时间{{ item.time }}</text>
<text>事件数{{ item.eventNums }}</text> -->
</view>
</view>
<view class="event-action">
<view class="iconText boxClick" v-if="item.isComplete == 1" @click="download(item)">
<uni-icons type="arrow-down" color="#fff" size="16"></uni-icons>
</view>
<view class="nav-menu nav-menu-btn boxClick"
v-else-if="userInfo.authorities === 'operation_manager'" @click="generate(item)">生成报告
</view>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<!-- <view class="device-body"> -->
<view class="device-body-item">
<text>申请人</text>
<text>{{ item.applyUser }}</text>
</view>
<view class="device-body-item">
<text>报告状态</text>
<text :style="{ color: item.isComplete == 1 ? '#10b981' : '#FF0000' }">{{
item.isComplete == 1 ? '已完成' : '未完成'
}}</text>
</view>
<view class="device-body-item">
<text>申请时间</text>
<text>{{ item.time }}</text>
</view>
<view class="device-body-item">
<text>暂降事件</text>
<text>{{ item.eventNums }}</text>
</view>
<!-- <view class="device-body-item">
<text>申请时间</text>
<text>{{ item.time }}</text>
</view> -->
</view>
<!-- </view> -->
</uni-card>
<uni-load-more v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"></uni-load-more>
<Cn-empty v-else style="top: 30%"></Cn-empty>
</scroll-view>
</view>
</view>
</template>
<script>
import Apply from './apply.vue'
import list from '@/common/js/list'
import { createEventReport, downloadEventReport } from '@/common/api/report.js'
export default {
components: { Apply },
props: {
indexList: {
type: Array,
default: () => [],
},
total: {
type: Number,
default: 0,
},
// status: {
// type: String,
// default: 'more',
// },
navHeight: {
type: Number,
default: 0,
},
},
mixins: [list],
data() {
return {
value: ['0'],
content: 123,
curSub: 0,
subsectionList: ['申请报告', '申请记录'],
form: {
type: 0,
lindId: '',
},
triggered: true,
userInfo: {},
height: 0,
selectValue: {},
}
},
created() { },
mounted() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
computed: {},
methods: {
setHeight() {
uni.createSelectorQuery()
.select('.filterCriteria')
.boundingClientRect((rect) => {
//
// #ifdef H5
this.height = rect?.height + 180 || 0
// #endif
// #ifdef APP-PLUS
this.height = rect?.height + 110 || 0
// #endif
})
.exec()
},
init() {
this.store = this.DataSource('/cs-report-boot/csAppReport/getApplicationReport')
this.store.params.startTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay
this.store.params.endTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay
this.store.loadedCallback = () => {
this.setHeight()
}
this.store.reload()
},
async select(val) {
this.selectValue = val
await this.init()
},
sectionChange(index) {
this.curSub = index.currentIndex
},
// 生成报告
generate(item) {
uni.showLoading({
title: '生成中,请稍等...',
mask: true,
})
createEventReport({
id: item.eventId,
}).then((res) => {
uni.showToast({
icon: 'success',
mask: true,
title: '生成事件报告成功!',
duration: 1000,
})
this.store.reload()
})
},
// 下载报告
download(item) {
uni.showLoading({
title: '下载中,请稍等...',
mask: true,
})
downloadEventReport({
id: item.eventId,
})
.then((res) => {
// 下载文件资源到本地
uni.downloadFile({
url: res.data, // 后端返回的线上文件路径
success: function (res) {
if (res.statusCode === 200) {
// 文件到本地
uni.saveFile({
tempFilePath: res.tempFilePath, //临时路径
success: function (data) {
var savedFilePath = data.savedFilePath
// 在app端执行
// #ifdef APP-PLUS
let osname = plus.os.name
// 如果是安卓的话弹出提示
uni.showToast({
icon: 'success',
mask: true,
title: '下载成功!',
duration: 1000,
})
// #endif
//ios手机直接打开文件手动存储文件到手机Android手机从根目录创建文件夹保存文件并改名
setTimeout(() => {
//打开文档查看
uni.openDocument({
filePath: data.savedFilePath,
success: function (ress) {
console.log('成功打开文件')
},
fail() {
console.log('打开文件失败')
},
})
}, 500)
},
})
console.log('下载成功')
} else {
uni.showToast({
icon: 'none',
mask: true,
title: '下载失败!',
duration: 1000,
})
}
},
fail: function (res) { },
})
})
.catch((err) => {
uni.showToast({
icon: 'none',
mask: true,
title: err.message,
duration: 1000,
})
})
},
// 刷新
reload() {
switch (this.curSub) {
case 0:
this.$refs.applyRef.store.reload()
break
case 1:
this.store && this.store.reload()
break
}
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
watch: {},
}
</script>
<style lang="scss" scoped>
@import '@/pages/message1/index.scss';
.event-detail {
display: grid;
grid-template-columns: 1.6fr 1fr;
}
// /deep/ .record {
// .uni-card__content {
// padding: 55rpx 20rpx 20rpx !important;
// }
// }
.filterCriteria {
.nav {
background-color: #fff;
}
.choose1 {
background-color: #fff;
padding: 0 20rpx;
display: flex;
justify-content: space-between;
/deep/ .uni-checkbox-input {
width: 30rpx;
height: 30rpx;
}
font-size: 26rpx;
}
}
// .device-body {
// padding: 10rpx 20rpx 20rpx;
.device-body-item {
display: flex;
// justify-content: space-between;
font-size: 28rpx;
color: #666666;
line-height: 1.5;
}
// }
.iconText {
display: flex;
width: 45rpx;
height: 45rpx;
border-radius: 50%;
background-color: $uni-theme-color;
justify-content: center;
align-items: center;
}
.nav-menu {
height: 40rpx;
padding: 6rpx 20rpx;
font-size: 24rpx;
border-radius: 8rpx;
line-height: 40rpx;
background: #ebeaec;
color: #666;
&-active {
background: #dfe5f7;
color: $uni-theme-color;
}
&-btn {
background: $uni-theme-color;
color: #fff;
}
}
.event-list {
/* 图标区域(按类型区分背景色) */
.event-icon {
background-color: #376cf320;
}
}
.segmented-control {
flex: 1;
margin-right: 24rpx;
height: 60rpx;
}
/deep/ .uni-scroll-view-refresher {
display: none;
}
</style>

View File

@@ -1,39 +1,44 @@
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body" class="canneng-index">
<uni-nav-bar
rightWidth="300rpx"
leftWidth="300rpx"
dark
:fixed="true"
status-bar
background-color="#fff"
color="#111"
@clickRight="selectEngineering"
>
<uni-nav-bar rightWidth="300rpx" leftWidth="300rpx" dark :fixed="true" status-bar background-color="#fff"
color="#111" @clickRight="selectEngineering">
<template slot="left">
<text style="font-size: 32rpx; font-weight: 500">灿能物联</text>
</template>
<template slot="right">
<text class="hide-txt mr5" style="font-size: 28rpx"
>{{ select.engineeringName || emptyEngineeringName }}
<text class="hide-txt mr5" style="font-size: 28rpx">{{
userInfo.authorities === 'engineering_user'
? '创建工程'
: select.engineeringName || emptyEngineeringName
}}
</text>
<uni-icons type="bottom" size="16" color="#111" v-if="select.engineeringName"></uni-icons>
<uni-icons type="bottom" size="16" color="#111"
v-if="select.engineeringName && userInfo.authorities != 'engineering_user'"></uni-icons>
</template>
</uni-nav-bar>
<view class="index">
<!-- 运维 -->
<YunWei :devCount="devCount" v-if="userInfo.authorities === 'operation_manager'" />
<!-- 专职 -->
<!-- 营销 -->
<ZhuanZhi :devCount="devCount" v-if="userInfo.authorities === 'market_user'" />
<!-- 工程 -->
<GongCheng ref="gongCheng" :devCount="devCount" v-if="userInfo.authorities === 'engineering_user'" />
<!-- 主用户 -->
<!-- 正式 -->
<ZhuYongHu :devCount="devCount" v-if="userInfo.authorities === 'app_vip_user'" />
<!-- 游客 -->
<YouKe :devCount="devCount" v-if="userInfo.authorities === 'tourist'"></YouKe>
<template v-show="engineeringList.length">
<view class="canneng-index-title mt20">设备列表</view>
<!-- 工程列表 -->
<template v-show="engineeringList.length" v-if="userInfo.authorities === 'engineering_user'">
<view class="canneng-index-title mt20">工程列表</view>
<Engineering ref="engineering" :store="store" @refresh="store.search()" />
</template>
<!-- 设备列表 -->
<template v-else v-show="engineeringList.length">
<view class="canneng-index-title mt20">
<view>设备列表</view>
<view class="nav-menu nav-menu-btn boxClick" @click="jump">电能质量信息 </view>
</view>
<Device ref="device" :store="store" />
</template>
</view>
@@ -47,6 +52,7 @@ import ZhuYongHu from './comp/indexZhuYongHu.vue'
import ZhuanZhi from './comp/indexZhuanZhi.vue'
import YouKe from './comp/indexYouKe.vue'
import Device from './comp/device.vue'
import Engineering from './comp/engineering.vue'
import list from '../../common/js/list'
import { getDevCount } from '../../common/api/device.js'
import { queryEngineering } from '@/common/api/engineering.js'
@@ -60,6 +66,7 @@ export default {
ZhuanZhi,
YouKe,
Device,
Engineering,
},
data() {
return {
@@ -88,7 +95,11 @@ export default {
},
methods: {
selectEngineering() {
if (this.select.engineeringName) {
if (this.userInfo.authorities === 'engineering_user') {
uni.navigateTo({
url: '/pages/engineering/new',
})
} else if (this.select.engineeringName) {
uni.navigateTo({
url: '/pages/home/selectEngineering',
})
@@ -140,6 +151,7 @@ export default {
console.log(this.$refs.device, 'this.$refs.device')
this.$nextTick(() => {
this.$refs.device && this.$refs.device.init()
this.$refs.engineering && this.$refs.engineering.init()
})
}
this.$refs.gongCheng?.init()
@@ -154,10 +166,10 @@ export default {
// console.log(`12312`,res)
// Object.assign(this.devCount, res.data)
this.devCount = res.data
this.devCount.currentOffLineDevs.forEach((item) => {
this.devCount.currentOffLineDevs?.forEach((item) => {
item.runStatus = 1
})
this.devCount.offLineDevs.forEach((item) => {
this.devCount.offLineDevs?.forEach((item) => {
item.runStatus = 1
})
this.devCount.engineeringListLength = this.engineeringList.length
@@ -165,17 +177,24 @@ export default {
key: this.$cacheKey.messageCount,
data: this.devCount,
})
// let messagePage =
// this.devCount.runCount +
// this.devCount.eventCount +
// this.devCount.alarmCount +
// this.devCount.harmonicCount
let messagePage =
this.devCount.runCount +
this.devCount.eventCount +
this.devCount.alarmCount +
this.devCount.harmonicCount
this.devCount.harmonicCount +
(uni.getStorageSync(this.$cacheKey.userInfo).authorities == 'operation_manager'
? this.devCount.alarmCount + this.devCount.runCount
: 0)
// console.log('🚀 ~ messagePage:', messagePage)
let minePage = this.devCount.feedBackCount
if (messagePage) {
uni.setTabBarBadge({
index: 1,
text:messagePage ? (messagePage > 99 ? '99+' : messagePage + '') : '',
text: messagePage ? (messagePage > 99 ? '99+' : messagePage + '') : '',
})
} else {
uni.removeTabBarBadge({
@@ -197,8 +216,15 @@ export default {
// #endif
})
},
// 动态配置导航栏按钮
jump() {
uni.navigateTo({
url: `/pages/index/comp/monitoringPoint`,
})
}
},
onLoad() {
// 页面加载时,动态配置导航栏按钮
if (!uni.getStorageSync(this.$cacheKey.access_token)) {
uni.reLaunch({
url: '/pages/user/login',
@@ -216,7 +242,11 @@ export default {
}, 1000)
}
this.timer = setInterval(this.getDevCount, 1000 * 60) // 定时请求
this.store = this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
this.store =
uni.getStorageSync(this.$cacheKey.userInfo).authorities === 'engineering_user'
? this.DataSource('/cs-harmonic-boot/homePage/getEngineeringHomePage')
: this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
// #ifdef APP-PLUS
setTimeout(() => {
// 获取nav高度
@@ -243,6 +273,22 @@ export default {
this.init()
}
},
mounted() {
uni.setTabBarItem({
index: 2,
visible: true,
})
if (uni.getStorageSync(this.$cacheKey.userInfo).authorities === 'tourist') {
uni.setTabBarItem({
index: 2,
visible: false,
})
uni.showToast({
title: '已同步设备历史数据',
icon: 'none',
})
}
},
}
</script>
<style lang="scss">
@@ -256,8 +302,8 @@ export default {
.canneng-index-title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
display: flex;
}
/deep/ .uni-card {
@@ -267,4 +313,28 @@ export default {
/deep/ .uni-drawer__content {
width: 100vw !important;
}
.nav-menu {
height: 40rpx;
padding: 4rpx 20rpx;
// margin-left: 20rpx;
// margin-bottom: 20rpx;
line-height: 38rpx;
font-size: 24rpx;
border-radius: 8rpx;
background: #ebeaec;
color: #666;
&-active {
background: #dfe5f7;
color: $uni-theme-color;
}
&-btn {
background: $uni-theme-color;
color: #fff;
}
margin-left: auto;
}
</style>

346
pages/index/message1.vue Normal file
View File

@@ -0,0 +1,346 @@
<template>
<Cn-page :loading="loading" class="messageBox" style="padding-top: 10px">
<view slot="body" class="message">
<view class="tabsBox">
<uni-segmented-control :current="current" :values="items" style-type="text" active-color="#376cf3"
@clickItem="onClickItem" />
<!-- 角标 -->
<view class="badge-container">
<span v-for="(item, index) in items" :key="index" class="badge">
<uni-badge :text="badgeCounts[index] > 99 ? '99+' : badgeCounts[index]" />
<!-- {{ badgeCounts[index] > 99 ? '99+' : badgeCounts[index] }} -->
</span>
</view>
<!-- 筛选条件 -->
<Cn-filterCriteria ref="cnFilterCriteria" :level="current === 0 ? 3 : current === 1 ? 3 : 2"
@select="select">
<picker v-if="current === 0" @change="bindPickerChange" :value="sortIndex" :range="sortOptions">
<view class="nav-menu nav-menu1">
<view class="nav-text">
{{ sortOptions[sortIndex] }}排序
</view>
<uni-icons type="bottom" size="14"></uni-icons>
</view>
</picker>
</Cn-filterCriteria>
</view>
<view class="content">
<Transient ref="TransientRef" v-if="current === 0" :navHeight="navHeight" :selectValue="selectValue"
:sortIndex="sortIndex" @getDevCount="getDevCount" />
<SteadyState ref="SteadyStateRef" v-if="current === 1" :navHeight="navHeight" :selectValue="selectValue"
@getDevCount="getDevCount" />
<Alarm ref="AlarmRef" v-if="current === 2" :navHeight="navHeight" :selectValue="selectValue"
@getDevCount="getDevCount" />
<Run ref="RunRef" v-if="current === 3" :navHeight="navHeight" :selectValue="selectValue"
@getDevCount="getDevCount" />
</view>
</view>
</Cn-page>
</template>
<script>
import Transient from '@/pages/message1/transient.vue'
import SteadyState from '@/pages/message1/steadyState.vue'
import Alarm from '@/pages/message1/alarm.vue'
import Run from '@/pages/message1/run.vue'
import { getDevCount } from '../../common/api/device.js'
import { updateStatus } from '@/common/api/message'
export default {
components: { Transient, SteadyState, Alarm, Run },
props: {},
data() {
return {
items: ['暂态事件', '稳态事件'], //'运行告警', '运行事件'
badgeCounts: [0, 0, 0, 0],
current: 0,
colorIndex: 0,
item: '',
loading: false,
width: 0,
navHeight: 0,
selectValue: {},
devCount: [],
sortIndex: 0,
sortOptions: ['发生时间', '暂降深度', '持续时间'],
}
},
onLoad() { },
mounted() {
this.setHeight()
},
onPullDownRefresh() {
this.refresh()
},
onNavigationBarButtonTap(e) {
uni.showModal({
title: '提示',
content: '确定要全部标记为已读吗?',
success: (res) => {
if (res.confirm) {
updateStatus({
// '暂态事件', 0
// '稳态事件', 1
// '运行告警', 3
// '运行事件' 2
type: this.current == 2 ? 3 : this.current == 3 ? 2 : this.current,
eventIds: [],
}).then(() => {
this.refresh()
this.getDevCount()
})
}
},
})
},
onShow() {
if (uni.getStorageSync(this.$cacheKey.userInfo).authorities === 'operation_manager') {
this.items = ['暂态事件', '稳态事件', '运行告警', '运行事件']
}
const params = uni.getStorageSync('messageParams')
this.getDevCount()
this.$nextTick(() => {
if (params.type !== '') {
this.current = params.type - 0
}
if (params.engineeringName != '') {
this.$refs.cnFilterCriteria && this.$refs.cnFilterCriteria.external(params)
}
})
},
// 页面销毁
onHide() {
uni.setStorageSync('messageParams', {
engineeringName: '',
engineeringId: '', //工程ID
projectName: '',
projectId: '', //項目ID
deviceName: '',
deviceId: '', //设备ID
lineName: '',
lineId: '', //测点ID
type: '',
})
},
methods: {
setHeight() {
uni.createSelectorQuery()
.select('.tabsBox')
.boundingClientRect((rect) => {
this.width = rect.width
//
// #ifdef H5
this.navHeight = rect.height + 75
// #endif
// #ifdef APP-PLUS
this.navHeight = rect.height + 20
// #endif
})
.exec()
},
refresh() {
switch (this.current) {
case 0:
this.$refs.TransientRef.store.reload()
break
case 1:
this.$refs.SteadyStateRef.store.reload()
break
case 2:
this.$refs.AlarmRef.store.reload()
break
case 3:
this.$refs.RunRef.store.reload()
break
}
},
onClickItem(e) {
if (this.current !== e.currentIndex) {
this.current = e.currentIndex
}
},
select(value) {
this.selectValue = value
setTimeout(() => {
this.setHeight()
}, 100)
},
bindPickerChange(e) {
this.sortIndex = e.detail.value
setTimeout(() => {
if (this.$refs.TransientRef) {
this.$refs.TransientRef.init()
}
}, 0)
},
// 设置角标
getDevCount() {
if (uni.getStorageSync('projectList')[1] != undefined) {
getDevCount(uni.getStorageSync('projectList')[1].engineeringId).then((res) => {
this.devCount = res.data
this.badgeCounts = [
this.devCount.eventCount,
this.devCount.harmonicCount,
this.devCount.alarmCount,
this.devCount.runCount,
]
uni.setStorage({
key: this.$cacheKey.messageCount,
data: this.devCount,
})
let messagePage =
this.devCount.eventCount +
this.devCount.harmonicCount +
(uni.getStorageSync(this.$cacheKey.userInfo).authorities == 'operation_manager'
? this.devCount.alarmCount + this.devCount.runCount
: 0)
let minePage = this.devCount.feedBackCount
if (messagePage) {
uni.setTabBarBadge({
index: 1,
text: messagePage ? (messagePage > 99 ? '99+' : messagePage + '') : '',
})
} else {
uni.removeTabBarBadge({
index: 1,
})
}
if (minePage) {
uni.setTabBarBadge({
index: 2,
text: minePage + '',
})
} else {
uni.removeTabBarBadge({
index: 2,
})
}
// #ifdef APP-PLUS
plus.runtime.setBadgeNumber(messagePage + minePage)
// #endif
})
}
},
// 根据索引动态计算右侧偏移位置,使徽章对准每个标签的右上角
getBadgeRightPosition(index) {
if (this.items == 4) {
return (index + 1) * (this.width / 4) + 'px'
} else {
return (index + 0) * (this.width / 2) + 'px'
}
},
},
computed: {},
}
</script>
<style lang="scss">
.messageBox {
overflow: hidden;
/deep/.tabsBox {
position: relative;
background-color: #fff;
.segmented-control {
// height: 40px;
background-color: #fff;
border-bottom: 1px solid #cccccc70;
.segmented-control__item {
align-items: baseline;
margin-top: 5px;
}
}
.segmented-control__text {
font-size: 30rpx !important;
color: rgb(96, 98, 102);
}
.segmented-control__item--text {
font-weight: bold;
padding: 0 0 5rpx;
}
.choose {
// padding: 20rpx;
// display: flex;
// justify-content: space-between;
// align-items: center;
background: #fff;
}
}
.subsection {
width: 90%;
margin: 20rpx auto;
}
.badge-container {
position: absolute;
top: -10rpx;
/* 徽章向上偏移,与控件重叠 */
display: flex;
justify-content: space-around;
right: 0;
width: 100%;
height: 0;
pointer-events: none;
/* 确保徽章不干扰点击事件 */
}
/deep/ .uni-badge--error {
background-color: #ff3b30;
}
.badge {
flex: 1;
text-align: center;
.uni-badge--x {
left: 70rpx;
}
}
.sort-picker {
font-size: 24rpx;
color: #2563eb;
display: flex;
align-items: center;
white-space: nowrap;
}
}
.nav-menu {
display: flex;
align-items: center;
}
.nav-menu1 {
display: flex;
align-items: center;
max-width: calc(100vw - 150px);
}
/* 文字容器:单行溢出省略 */
.nav-text {
flex: 1;
overflow: hidden;
white-space: nowrap;
/* 强制不换行 */
text-overflow: ellipsis;
// -webkit-line-clamp: 1;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
// white-space: nowrap;
line-height: 1;
}
</style>

View File

@@ -1,382 +1,381 @@
<template>
<view :loading="loading">
<view class="mine">
<view class="mine-header" @click="jump('basic')">
<image mode="aspectFill" class="mine-header-head" :src="userInfo.avatar" v-if="userInfo.avatar" />
<image mode="aspectFill" class="mine-header-head" src="/static/head.png" v-else />
<view class="mine-header-name hide-txt">
<view>{{ userInfo.nickname }}</view>
<view></view>
<view class="tag">{{ roleName }}</view>
</view>
<image
src="/static/erweima.png"
style="height: 50rpx; width: 50rpx; border-radius: 12rpx"
mode="scaleToFill"
/>
<uni-icons type="forward" color="#aaa" size="16"></uni-icons>
</view>
<view class="mine-nav" v-if="userInfo.authorities === 'tourist'" @click="jump('upgrade')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
<view class="mine-nav-label">角色升级</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<!-- <view class="mine-nav" @click="jump('audit')" v-if="userInfo.authorities === 'app_vip_user'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
<view class="mine-nav-label">角色审核</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<!-- <view class="mine-nav" @click="jump('user')" v-if="userInfo.authorities === 'app_vip_user'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/subordinate.png" />
<view class="mine-nav-label">分享用户列表</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view
class="mine-nav"
@click="jump('scan')"
v-if="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/scan.png" />
<view class="mine-nav-label">扫一扫</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('engineering')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/gongcheng.png" />
<view class="mine-nav-label">工程管理</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('project')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/project.png" />
<view class="mine-nav-label">项目管理</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('feedback')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/feedback.png" />
<view class="mine-nav-label">反馈列表</view>
<uni-badge :text="messageCount.feedBackCount"></uni-badge>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<!-- <view
class="mine-nav"
@click="jump('gateway')"
style="border-bottom: none; box-shadow: 0 4rpx 8rpx #e7e7e74c"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/gateway.png" />
<view class="mine-nav-label">网关列表</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view class="mine-nav" @click="jump('setupMessage')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/message4.png" />
<view class="mine-nav-label">推送通知设置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view
class="mine-nav"
@click="jump('engineering/setting')"
v-if="userInfo.authorities === 'engineering_user'"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/like.png" />
<view class="mine-nav-label">关注工程配置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('serverSetting')" v-if="userInfo.authorities === 'engineering_user'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/server2.png" />
<view class="mine-nav-label">调试内容配置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('setup')" style="border-bottom: none">
<image mode="aspectFill" class="mine-nav-icon" src="/static/setup.png" />
<view class="mine-nav-label">设置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog
ref="inputClose"
mode="input"
title="角色升级"
placeholder="请输入六位邀请码"
@confirm="upgrade"
></uni-popup-dialog>
</uni-popup>
</view>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog
style="width: 90%; margin: 5%"
type="info"
cancelText="禁止"
confirmText="允许"
title="权限说明"
content='是否允许"灿能物联"使用相机?'
@confirm="handleScon('camera')"
@close="dialogClose"
></uni-popup-dialog>
</uni-popup>
<uni-popup ref="message" type="message">
<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
<view style="color: #6c6c6c; margin-top: 3rpx; "> 用于相机扫描二维码!</view>
</uni-popup-message>
</uni-popup>
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
</view>
</template>
<script>
import { roleUpdate, autoLogin } from '@/common/api/user'
import { transferDevice, shareDevice } from '@/common/api/device'
import ykAuthpup from "@/components/yk-authpup/yk-authpup";
export default {
components: {
ykAuthpup
},
data() {
return {
loading: true,
userInfo: {},
messageCount: {},
timer: null,
}
},
computed: {
roleName() {
let roleName = ''
switch (this.userInfo.authorities) {
case 'tourist':
roleName = '游客'
break
case 'engineering_user':
roleName = '工程用户'
break
case 'app_vip_user':
roleName = '正式用户'
break
case 'market_user':
roleName = '营销用户'
break
case 'operation_manager':
roleName = '运维管理员'
break
}
return roleName
},
},
onLoad(options) {
this.init()
},
methods: {
init() {},
upgrade(code) {
console.log(code)
roleUpdate({
referralCode: code,
userId: this.userInfo.userIndex,
}).then((res) => {
uni.showToast({
title: '升级成功',
icon: 'none',
})
uni.removeStorageSync('access_token')
// 直接登录
autoLogin(this.userInfo.user_name).then((res) => {
this.$util.loginSuccess(res.data).then((userInfo) => {
this.userInfo = userInfo
})
})
})
},
changeAuth(){
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了');
// this.handleScon()
this.handleScon()
},
jump(type) {
switch (type) {
case 'scan':
if (
plus.os.name == 'Android'
// && plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
) {
//未授权
// this.$refs.alertDialog.open('bottom')
this.$refs['authpup'].open()
// this.$refs.message.open()
} else {
console.log(2)
this.handleScon()
}
break
case 'login':
uni.navigateTo({
url: `/pages/user/login`,
})
break
case 'gateway':
uni.navigateTo({
url: `/pages/gateway/list`,
})
break
case 'upgrade':
this.$refs.inputDialog.open()
break
case 'basic':
uni.navigateTo({
url: `/pages/user/basic`,
})
break
case 'project':
uni.navigateTo({
url: `/pages/project/list`,
})
break
case 'engineering':
uni.navigateTo({
url: `/pages/engineering/list`,
})
break
case 'engineering/setting':
uni.navigateTo({
url: `/pages/engineering/setting`,
})
break
case 'feedback':
uni.navigateTo({
url: `/pages/message/feedback`,
})
break
default:
uni.navigateTo({
url: `/pages/mine/${type}`,
})
break
}
},
handleScon(){
this.$refs.message.close()
uni.scanCode({
onlyFromCamera:true,
success: (res) => {
console.log('条码类型:' + res.scanType)
console.log('条码内容:' + res.result)
let content = JSON.parse(res.result)
switch (content.type) {
case 'transferDevice':
this.transferDevice(content.id.split(','))
break
case 'shareDevice':
this.shareDevice(content.id.split(','))
break
default:
this.$util.toast('无效二维码')
break
}
},
})
},
dialogClose(){this.$refs.message.close()},
transferDevice(id) {
transferDevice(id).then((res) => {
uni.navigateTo({ url: '/pages/mine/result?type=transferDevice&id=' + id })
})
},
shareDevice(id) {
shareDevice(id).then((res) => {
uni.navigateTo({ url: '/pages/mine/result?type=shareDevice&id=' + id })
})
},
},
onShow() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.loading = false
this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
this.timer = setInterval(() => {
this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
}, 1000) // 定时请求
},
onHide() {
clearInterval(this.timer)
},
}
</script>
<style lang="scss">
.mine {
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
display: flex;
align-items: center;
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
.engineering-button {
margin-left: 10rpx;
font-size: 24rpx;
padding: 5rpx 12rpx;
color: #fff;
font-weight: 400;
border-radius: 16rpx;
background: $uni-theme-color;
}
}
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
/deep/ .uni-popup-message__box {
border-radius: 10rpx !important;
background-color: #fff;
}
</style>
</style>
<template>
<view :loading="loading">
<view class="mine">
<view class="mine-header" @click="jump('basic')">
<image mode="aspectFill" class="mine-header-head" :src="userInfo.avatar" v-if="userInfo.avatar" />
<image mode="aspectFill" class="mine-header-head" src="/static/head.png" v-else />
<view class="mine-header-name hide-txt">
<view>{{ userInfo.nickname }}</view>
<view></view>
<view class="tag">{{ roleName }}</view>
</view>
<image
src="/static/erweima.png"
style="height: 50rpx; width: 50rpx; border-radius: 12rpx"
mode="scaleToFill"
/>
<uni-icons type="forward" color="#aaa" size="16"></uni-icons>
</view>
<view class="mine-nav" v-if="userInfo.authorities === 'tourist'" @click="jump('upgrade')">
<image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
<view class="mine-nav-label">角色升级</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<!-- <view class="mine-nav" @click="jump('audit')" v-if="userInfo.authorities === 'app_vip_user'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
<view class="mine-nav-label">角色审核</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<!-- <view class="mine-nav" @click="jump('user')" v-if="userInfo.authorities === 'app_vip_user'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/subordinate.png" />
<view class="mine-nav-label">分享用户列表</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view
class="mine-nav"
@click="jump('scan')"
v-if="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/scan.png" />
<view class="mine-nav-label">扫一扫</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('engineering')" v-if="userInfo.authorities !== 'tourist'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/gongcheng.png" />
<view class="mine-nav-label">工程管理</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('project')" v-if="userInfo.authorities !== 'tourist'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/project.png" />
<view class="mine-nav-label">项目管理</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view class="mine-nav" @click="jump('feedback')" v-if="userInfo.authorities !== 'tourist'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/feedback.png" />
<view class="mine-nav-label">反馈列表</view>
<uni-badge :text="messageCount.feedBackCount"></uni-badge>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<!-- <view
class="mine-nav"
@click="jump('gateway')"
style="border-bottom: none; box-shadow: 0 4rpx 8rpx #e7e7e74c"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/gateway.png" />
<view class="mine-nav-label">网关列表</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view class="mine-nav" @click="jump('setupMessage')" v-if="userInfo.authorities !== 'tourist'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/message4.png" />
<view class="mine-nav-label">推送通知配置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<view
class="mine-nav"
@click="jump('engineering/setting')"
v-if="userInfo.authorities === 'engineering_user' || userInfo.authorities !== 'tourist'"
>
<image mode="aspectFill" class="mine-nav-icon" src="/static/like.png" />
<view class="mine-nav-label">关注工程配置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<!-- <view class="mine-nav" @click="jump('transientSetting')" v-if="userInfo.authorities !== 'tourist'">
<image mode="aspectFill" class="mine-nav-icon" src="/static/tongji.png" />
<view class="mine-nav-label">暂态统计配置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view> -->
<view class="mine-nav" @click="jump('setup')" style="border-bottom: none">
<image mode="aspectFill" class="mine-nav-icon" src="/static/setup.png" />
<view class="mine-nav-label">设置</view>
<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
</view>
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog
ref="inputClose"
mode="input"
title="角色升级"
placeholder="请输入六位邀请码"
@confirm="upgrade"
></uni-popup-dialog>
</uni-popup>
</view>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog
style="width: 90%; margin: 5%"
type="info"
cancelText="禁止"
confirmText="允许"
title="权限说明"
content='是否允许"灿能物联"使用相机?'
@confirm="handleScon('camera')"
@close="dialogClose"
></uni-popup-dialog>
</uni-popup>
<uni-popup ref="message" type="message">
<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
<view style="color: #6c6c6c; margin-top: 3rpx"> 用于相机扫描二维码!</view>
</uni-popup-message>
</uni-popup>
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
</view>
</template>
<script>
import { roleUpdate, autoLogin } from '@/common/api/user'
import { transferDevice, shareDevice } from '@/common/api/device'
import ykAuthpup from '@/components/yk-authpup/yk-authpup'
export default {
components: {
ykAuthpup,
},
data() {
return {
loading: true,
userInfo: {},
messageCount: {},
timer: null,
}
},
computed: {
roleName() {
let roleName = ''
switch (this.userInfo.authorities) {
case 'tourist':
roleName = '游客'
break
case 'engineering_user':
roleName = '工程用户'
break
case 'app_vip_user':
roleName = '正式用户'
break
case 'market_user':
roleName = '营销用户'
break
case 'operation_manager':
roleName = '运维管理员'
break
}
return roleName
},
},
onLoad(options) {
this.init()
},
methods: {
init() {},
upgrade(code) {
console.log(code)
roleUpdate({
referralCode: code,
userId: this.userInfo.userIndex,
}).then((res) => {
uni.showToast({
title: '升级成功',
icon: 'none',
})
uni.removeStorageSync('access_token')
// 直接登录
autoLogin(this.userInfo.user_name).then((res) => {
this.$util.loginSuccess(res.data).then((userInfo) => {
this.userInfo = userInfo
})
})
})
},
changeAuth() {
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了')
// this.handleScon()
this.handleScon()
},
jump(type) {
switch (type) {
case 'scan':
if (
plus.os.name == 'Android'
// && plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
) {
//未授权
// this.$refs.alertDialog.open('bottom')
this.$refs['authpup'].open()
// this.$refs.message.open()
} else {
console.log(2)
this.handleScon()
}
break
case 'login':
uni.navigateTo({
url: `/pages/user/login`,
})
break
case 'gateway':
uni.navigateTo({
url: `/pages/gateway/list`,
})
break
case 'upgrade':
this.$refs.inputDialog.open()
break
case 'basic':
uni.navigateTo({
url: `/pages/user/basic`,
})
break
case 'project':
uni.navigateTo({
url: `/pages/project/list`,
})
break
case 'engineering':
uni.navigateTo({
url: `/pages/engineering/list`,
})
break
case 'engineering/setting':
uni.navigateTo({
url: `/pages/engineering/setting`,
})
break
case 'feedback':
uni.navigateTo({
url: `/pages/message/feedback`,
})
break
default:
uni.navigateTo({
url: `/pages/mine/${type}`,
})
break
}
},
handleScon() {
this.$refs.message.close()
uni.scanCode({
onlyFromCamera: true,
success: (res) => {
console.log('条码类型:' + res.scanType)
console.log('条码内容:' + res.result)
let content = JSON.parse(res.result)
switch (content.type) {
case 'transferDevice':
this.transferDevice(content.id.split(','))
break
case 'shareDevice':
this.shareDevice(content.id.split(','))
break
default:
this.$util.toast('无效二维码')
break
}
},
})
},
dialogClose() {
this.$refs.message.close()
},
transferDevice(id) {
transferDevice(id).then((res) => {
uni.navigateTo({ url: '/pages/mine/result?type=transferDevice&id=' + id })
})
},
shareDevice(id) {
shareDevice(id).then((res) => {
uni.navigateTo({ url: '/pages/mine/result?type=shareDevice&id=' + id })
})
},
},
onShow() {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.loading = false
this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
this.timer = setInterval(() => {
this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
}, 1000) // 定时请求
},
onHide() {
clearInterval(this.timer)
},
}
</script>
<style lang="scss">
.mine {
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
display: flex;
align-items: center;
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
.engineering-button {
margin-left: 10rpx;
font-size: 24rpx;
padding: 5rpx 12rpx;
color: #fff;
font-weight: 400;
border-radius: 16rpx;
background: $uni-theme-color;
}
}
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
/deep/ .uni-popup-message__box {
border-radius: 10rpx !important;
background-color: #fff;
}
</style>

154
pages/index/report.vue Normal file
View File

@@ -0,0 +1,154 @@
<template>
<view :loading="loading" class="report" style="padding-top: 10px">
<view class="navReport">
<view class="tabsBox">
<uni-segmented-control
:current="curTabs"
:values="items"
style-type="text"
active-color="#376cf3"
@clickItem="onClickItem"
/>
</view>
</view>
<!-- 稳态报表 -->
<SteadyState
v-if="curTabs == 0"
ref="SteadyStateRef"
:indexList="indexList"
:total="total"
:status="status"
:navHeight="navHeight"
@scrolltolower="scrolltolower"
/>
<!-- 暂态报表 -->
<Transient
v-if="curTabs == 1"
ref="TransientRef"
:indexList="indexList"
:total="total"
:status="status"
:navHeight="navHeight"
@scrolltolower="scrolltolower"
/>
</view>
</template>
<script>
import SteadyState from './comp/steadyState.vue'
import Transient from './comp/transient.vue'
export default {
components: {
SteadyState,
Transient,
},
props: {},
data() {
return {
curTabs: 0,
total: 6,
loading: false,
items: ['稳态报表', '暂降报告'],
status: 'more', //more加载前 loading加载中 noMore加载后
navHeight: 0,
indexList: [],
}
},
created() {},
onPullDownRefresh() {
this.refresh()
},
mounted() {
uni.createSelectorQuery()
.select('.navReport')
.boundingClientRect((rect) => {
//
this.navHeight = rect.height
// // #ifdef H5
// // #endif
// // #ifdef APP-PLUS
// this.navHeight = rect.height
// // #endif
})
.exec()
},
methods: {
onClickItem(e) {
if (this.curTabs !== e.currentIndex) {
this.curTabs = e.currentIndex
}
},
scrolltolower() {
if (this.total != this.indexList.length) {
this.status = 'loading'
this.info()
} else {
this.status = 'noMore'
}
},
info() {
setTimeout(() => {
this.status = 'more'
}, 1000)
},
refresh() {
switch (this.curTabs) {
case 0:
this.$refs.SteadyStateRef.store.reload()
break
case 1:
this.$refs.TransientRef.reload()
break
}
},
},
computed: {},
watch: {},
}
</script>
<style lang="scss">
.report {
overflow: hidden;
/deep/ .u-tabs__wrapper__nav {
background: #fff;
}
/deep/ .u-tabs__wrapper__nav__item {
flex: 1;
}
/deep/ .u-tabs__wrapper__nav__line {
left: 80rpx;
}
/deep/ .u-u-subsection {
width: 80% !important;
}
/deep/.tabsBox {
.segmented-control {
// height: 40px;
background-color: #fff;
border-bottom: 1px solid #cccccc70;
.segmented-control__item {
align-items: baseline;
margin-top: 5px;
}
}
.segmented-control__text {
font-size: 30rpx !important;
color: rgb(96, 98, 102);
}
.segmented-control__item--text {
font-weight: bold;
padding: 0 0 5rpx;
}
}
}
</style>

View File

@@ -1,147 +1,147 @@
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='detail'>
<view class="detail-content ">
<view class="detail-content-title mb20">{{ pageData.title }}</view>
<view> {{ pageData.createTime }}</view>
<view class="mt10 mb10">{{ pageData.description }}</view>
<uni-file-picker readonly v-model="imageValue" mode="grid"/>
</view>
<view class="detail-content " style="margin-bottom:0">
<view class="detail-content-title ">
<view class="title">进度</view>
<!-- <template v-if="pageData.status === '1'">-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('2')">解决</view>-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('0')">关闭</view>-->
<!-- </template>-->
<!-- <template v-if="pageData.status === '2'">-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('0')">关闭</view>-->
<!-- </template>-->
<!-- <view class="title-btn" @click="open">回复</view>-->
</view>
</view>
<uni-list>
<uni-list-item :title="item.userName" :note="item.chatContent" :rightText="item.createTime"
v-for="(item, index) in pageData.csFeedbackChatPOList" :key="index"/>
<Cn-empty
v-if="pageData.csFeedbackChatPOList && pageData.csFeedbackChatPOList.length == 0"></Cn-empty>
</uni-list>
<!-- 输入框示例 -->
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog ref="inputClose" type="info" mode="input" title="输入内容"
value="对话框预置提示内容!"
placeholder="请输入内容" @confirm="dialogInputConfirm">
<uni-easyinput type="textarea" :maxlength="250" autoHeight v-model="chatContent"
placeholder="请输入内容"></uni-easyinput>
</uni-popup-dialog>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import {queryFeedBackDetail, AddFeedbackChat, updateChatStatus, updateFeedBackStatus} from '../../common/api/feedback'
export default {
data() {
return {
loading: false,
chatContent: "",
imageValue: [
{
"name": "file.png",
"extname": "png",
"url": "/static/logo.png",
}
],
pageData: {},
pageOption: {}
}
},
onLoad(o) {
this.pageOption = o
this.init()
updateChatStatus({
id: o.id,
})
},
methods: {
updateFeedBackStatus(status) {
updateFeedBackStatus({
id: this.pageOption.id,
status: status
}).then(res => {
this.init()
})
},
init() {
this.loading = true
queryFeedBackDetail(this.pageOption.id).then(res => {
// 反转数组
res.data.csFeedbackChatPOList.reverse()
this.pageData = res.data
this.imageValue = res.data.imageUrls.map(item => {
return {
"name": item,
"extname": item.split('.')[1],
"url": this.$config.static + item,
}
})
this.loading = false
console.log(res);
})
},
dialogInputConfirm() {
AddFeedbackChat({chatContent: this.chatContent, id: this.pageOption.id}).then(res => {
console.log(res);
this.$util.toast('回复成功')
this.init()
this.chatContent = ''
})
},
open() {
this.$refs.inputDialog.open()
},
over() {
},
close() {
},
}
}
</script>
<style lang='scss'>
.detail {
padding: 0 0 20rpx;
.detail-content {
padding: 20rpx 30rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 26rpx;
.detail-content-title {
font-size: 32rpx;
color: #111;
font-weight: 700;
display: flex;
justify-content: space-between;
.title {
flex: 1;
}
.title-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
}
}
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='detail'>
<view class="detail-content ">
<view class="detail-content-title mb20">{{ pageData.title }}</view>
<view> {{ pageData.createTime }}</view>
<view class="mt10 mb10">{{ pageData.description }}</view>
<uni-file-picker readonly v-model="imageValue" mode="grid"/>
</view>
<view class="detail-content " style="margin-bottom:0">
<view class="detail-content-title ">
<view class="title">进度</view>
<!-- <template v-if="pageData.status === '1'">-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('2')">解决</view>-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('0')">关闭</view>-->
<!-- </template>-->
<!-- <template v-if="pageData.status === '2'">-->
<!-- <view class="title-btn mr10" @click="updateFeedBackStatus('0')">关闭</view>-->
<!-- </template>-->
<!-- <view class="title-btn" @click="open">回复</view>-->
</view>
</view>
<uni-list>
<uni-list-item :title="item.userName" :note="item.chatContent" :rightText="item.createTime"
v-for="(item, index) in pageData.csFeedbackChatPOList" :key="index"/>
<Cn-empty
v-if="pageData.csFeedbackChatPOList && pageData.csFeedbackChatPOList.length == 0"></Cn-empty>
</uni-list>
<!-- 输入框示例 -->
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog ref="inputClose" type="info" mode="input" title="输入内容"
value="对话框预置提示内容!"
placeholder="请输入内容" @confirm="dialogInputConfirm">
<uni-easyinput type="textarea" :maxlength="250" autoHeight v-model="chatContent"
placeholder="请输入内容"></uni-easyinput>
</uni-popup-dialog>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import {queryFeedBackDetail, AddFeedbackChat, updateChatStatus, updateFeedBackStatus} from '../../common/api/feedback'
export default {
data() {
return {
loading: false,
chatContent: "",
imageValue: [
{
"name": "file.png",
"extname": "png",
"url": "/static/logo.png",
}
],
pageData: {},
pageOption: {}
}
},
onLoad(o) {
this.pageOption = o
this.init()
updateChatStatus({
id: o.id,
})
},
methods: {
updateFeedBackStatus(status) {
updateFeedBackStatus({
id: this.pageOption.id,
status: status
}).then(res => {
this.init()
})
},
init() {
this.loading = true
queryFeedBackDetail(this.pageOption.id).then(res => {
// 反转数组
res.data.csFeedbackChatPOList.reverse()
this.pageData = res.data
this.imageValue = res.data.imageUrls.map(item => {
return {
"name": item,
"extname": item.split('.')[1],
"url": this.$config.static + item,
}
})
this.loading = false
console.log(res);
})
},
dialogInputConfirm() {
AddFeedbackChat({chatContent: this.chatContent, id: this.pageOption.id}).then(res => {
console.log(res);
this.$util.toast('回复成功')
this.init()
this.chatContent = ''
})
},
open() {
this.$refs.inputDialog.open()
},
over() {
},
close() {
},
}
}
</script>
<style lang='scss'>
.detail {
padding: 0 0 20rpx;
.detail-content {
padding: 20rpx 30rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 26rpx;
.detail-content-title {
font-size: 28rpx;
color: #111;
font-weight: 700;
display: flex;
justify-content: space-between;
.title {
flex: 1;
}
.title-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
}
}
}
</style>

View File

@@ -21,14 +21,18 @@
<view class="content-item-header-right-des">工程名称{{ item.engineeringName }}</view>
<view class="content-item-header-right-des">项目名称{{ item.projectName }}</view>
<view class="content-item-header-right-des" v-if="type == '0' || type == '1'"
>监测点名称{{ item.lineName }}</view
>监测点名称{{ item.lineName }}
</view
>
<view class="content-item-header-right-des" v-if="type == '0'"
>暂态类型{{ item.showName }}</view
>暂态类型{{ item.showName }}
</view
>
<!-- <view class="content-item-header-right-des">{{ item.subTitle }}</view> -->
</view>
<view class="ml10" v-if="type === '0' || item.status != '1'">🔍</view>
<view class="ml10" v-if="type === '0' || item.status != '1'">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</view>
<view class="content-item-footer">{{ item.subTitle }}</view>
</view>

View File

@@ -1,91 +1,91 @@
<template>
<Cn-page :loading="loading">
<view class="detail" slot="body">
<view class="detail-content" style="font-size: 32rpx">
<!-- <view class="detail-content-title mb20">发生时间</view> -->
<view>{{ detail.startTime }}</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">基础信息</view>
<view class="mb5"> 设备名称{{ detail.equipmentName }}</view>
<view class="mb5"> 项目名称{{ detail.projectName }} </view>
<view class="mb5"> 工程名称{{ detail.engineeringName }} </view>
<view class="mb5"> 事件名称{{ detail.showName }}</view>
<view class="mb5" v-for="(item, textIndex) in detail.dataSet" :key="textIndex">
{{ item.showName + '' + (item.value == 3.1415926 ? '-' : item.value) + (item.unit || '') }}
</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">瞬时波形图</view>
<image
style="width: 100%"
:src="detail.instantPics"
mode="widthFix"
v-if="detail.instantPics"
@click="previewImage(detail.instantPics)"
/>
<text v-else>暂无</text>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">RMS波形图</view>
<image
style="width: 100%"
:src="detail.rmsPics"
mode="widthFix"
v-if="detail.rmsPics"
@click="previewImage(detail.rmsPics)"
/>
<text v-else>暂无</text>
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus } from '@/common/api/message'
export default {
data() {
return {
loading: true,
detail: {},
}
},
onLoad(options) {
console.log(options.detail)
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.detail.rmsPics && (this.detail.rmsPics = this.$config.static + this.detail.rmsPics)
this.detail.instantPics && (this.detail.instantPics = this.$config.static + this.detail.instantPics)
this.loading = false
if (this.detail.status != 1) {
updateStatus({
eventIds: [this.detail.id],
})
}
},
methods: {
previewImage(url) {
uni.previewImage({
urls: [url],
})
},
},
}
</script>
<style lang="scss">
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 26rpx;
.detail-content-title {
font-size: 32rpx;
color: #111;
font-weight: 700;
}
}
}
</style>
<template>
<Cn-page :loading="loading">
<view class="detail" slot="body">
<view class="detail-content" style="font-size: 32rpx">
<!-- <view class="detail-content-title mb20">发生时间</view> -->
<view>{{ detail.startTime }}</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">基础信息</view>
<view class="mb5"> 设备名称{{ detail.equipmentName }}</view>
<view class="mb5"> 项目名称{{ detail.projectName }} </view>
<view class="mb5"> 工程名称{{ detail.engineeringName }} </view>
<view class="mb5"> 事件名称{{ detail.showName }}</view>
<view class="mb5" v-for="(item, textIndex) in detail.dataSet" :key="textIndex">
{{ item.showName + '' + (item.value == 3.1415926 ? '-' : item.value) + (item.unit || '') }}
</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">瞬时波形图</view>
<image
style="width: 100%"
:src="detail.instantPics"
mode="widthFix"
v-if="detail.instantPics"
@click="previewImage(detail.instantPics)"
/>
<text v-else>暂无</text>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">RMS波形图</view>
<image
style="width: 100%"
:src="detail.rmsPics"
mode="widthFix"
v-if="detail.rmsPics"
@click="previewImage(detail.rmsPics)"
/>
<text v-else>暂无</text>
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus } from '@/common/api/message'
export default {
data() {
return {
loading: true,
detail: {},
}
},
onLoad(options) {
console.log(options.detail)
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.detail.rmsPics && (this.detail.rmsPics = this.$config.static + this.detail.rmsPics)
this.detail.instantPics && (this.detail.instantPics = this.$config.static + this.detail.instantPics)
this.loading = false
if (this.detail.status != 1) {
updateStatus({
eventIds: [this.detail.id],
})
}
},
methods: {
previewImage(url) {
uni.previewImage({
urls: [url],
})
},
},
}
</script>
<style lang="scss">
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 26rpx;
.detail-content-title {
font-size: 28rpx;
color: #111;
font-weight: 700;
}
}
}
</style>

158
pages/message1/alarm.vue Normal file
View File

@@ -0,0 +1,158 @@
<template>
<view style="position: relative">
<!-- 运行告警 -->
<!-- 卡片 -->
<scroll-view scroll-y="true" @refresherrefresh="refresherrefresh" @scrolltolower="scrolltolower"
:refresher-triggered="triggered" refresher-enabled="true" class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + 10) + 'px)', overflow: 'auto' }">
<!-- 循环渲染事件项 -->
<uni-card class="event-item boxClick" :class="item.type" v-for="(item, index) in this.store.data"
:key="index" @click="jump(item)">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-terminal-box-fill"
size="30"
color="#376cf3"
></uni-icons> -->
<Cn-icon-transient :name="`运行告警`" />
<view class="badge1" v-if="item.isRead == 0"></view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.date }}</text>
</view>
<view class="event-desc">
<text>告警终端总数{{ item.warnNums }}</text>
<text v-if="item.onlineRateIsWarn ">在线率偏低</text>
<text v-if="item.integrityIsWarn">完整性偏低</text>
<text v-if="item.warnCounts > 0">事件触发终端告警{{ item.warnCounts }}</text>
</view>
</view>
<view class="event-action">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</view>
<!-- <view class="event-detail">
<text> 告警终端总数{{ item.warnNums }} </text>
</view> -->
</uni-card>
<uni-load-more v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
export default {
components: {},
props: {
navHeight: {
type: Number,
default: 0,
},
selectValue: {
type: Object,
// default: () => {},
},
},
mixins: [list],
data() {
return {
triggered: true,
status: 'noMore', //more加载前 loading加载中 noMore加载后
}
},
mounted() {
},
methods: {
init() {
this.store = this.DataSource('/cs-harmonic-boot/csAlarm/queryAlarmList')
// this.store.params.pageSize = 10000
this.store.params.engineerId = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.devId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
this.store.params.time = this.selectValue.date
this.store.loadedCallback = () => {
this.loading = false
}
this.store.reload()
},
jump(item) {
let str = JSON.stringify(item).replace(/%/g, '百分比')
uni.navigateTo({ url: '/pages/message1/comp/alarmDetails?detail=' + encodeURIComponent(str) })
item.isRead = 1
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
computed: {},
watch: {
selectValue: {
handler(val, oldVal) {
if (Object.keys(val).length === 0) return
this.init()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped>
@import './index.scss';
/* 列表容器 */
.event-list {
margin-top: 20rpx;
/* 头部:图标 + 信息 + 操作 */
// .event-header {
// margin-bottom: 0rpx;
// }
// .event-title {
// margin-bottom: 0rpx;
// }
/* 图标区域(按类型区分背景色) */
.event-icon {
// width: 80rpx;
// height: 80rpx;
background-color: #376cf320;
}
/* 信息区域 */
.event-info {
flex: 1;
}
}
/deep/ .uni-scroll-view-refresher {
display: none;
}
</style>

249
pages/message1/comp/F47.vue Normal file
View File

@@ -0,0 +1,249 @@
<template>
<!-- ITIC -->
<view>
<l-echart v-if="status != 'loading'" ref="echartRef" @finished="initChart"></l-echart>
<uni-load-more v-else :status="status"></uni-load-more>
</view>
</template>
<script>
const echarts = require('../../../uni_modules/lime-echart/static/echarts.min')
export default {
components: {},
props: {
store: {
type: [Object],
},
},
data() {
return {
option: {
backgroundColor: '#fff',
grid: {
left: '10px',
right: '40rpx',
bottom: '40rpx',
top: '10px',
containLabel: true,
},
legend: {
data: ['分割线', '可容忍事件', '不可容忍事件'],
right: '10px',
bottom: '10px',
textStyle: {
fontSize: 10,
},
itemWidth: 10,
itemHeight: 10,
itemGap: 8,
padding: [5, 5, 5, 10],
},
yAxis: {
type: 'log',
min: '0.001',
max: '1000',
name: 's',
inverse: true,
axisLabel: {
rotate: -90,
},
splitLine: { show: false },
},
xAxis: {
type: 'value',
splitNumber: 10,
minInterval: 20,
position: 'top',
rotate: 90,
max: 140,
axisLabel: {
rotate: -90,
},
name: '%',
},
series: [
{
name: '分割线',
type: 'line',
data: [
[0, 0.05],
[50, 0.05],
[50, 0.2],
[70, 0.2],
[70, 0.5],
[80, 0.5],
[80, 10],
[80, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#DAA520',
},
{
name: '可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointF,
data: [],
color: 'green',
},
{
name: '不可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointFun,
data: [],
color: 'red',
},
],
},
status: 'loading',
echartRef: null,
pointF: [],
pointFun: [],
data: [],
maxXAxis: 140,
}
},
mounted() {
// this.initChart()
// console.log('🚀 ~ props.data:', this.props.data)
},
methods: {
init() {},
async initChart() {
if (!this.$refs.echartRef) return
try {
this.echartRef = await this.$refs.echartRef.init(echarts)
this.bindChartClickEvent()
this.echartRef.setOption(this.option, true)
} catch (error) {
console.error('图表初始化失败:', error)
}
},
gongfunction() {
var standF = 0
var unstandF = 0
this.pointF = []
this.pointFun = []
var total = 0
let dataList = [0]
total = this.data.length
if (total == 0) {
} else {
for (var i = 0; i < this.data.length; i++) {
var point = []
var xx = this.data[i].evtParamTm.replace(/s/g, '')
var yy = this.data[i].evtParamVVaDepth.replace(/%/g, '')
var time = this.data[i].startTime.replace('T', ' ')
dataList.push(yy)
point = [yy, xx, time, this.data[i]]
if (xx < 0.05) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else if (xx < 0.2) {
if (yy > 50) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
} else if (xx < 0.5) {
if (yy > 70) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
} else {
if (yy > 80) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
}
}
}
this.option.xAxis.max = Math.max(
140,
Math.ceil(
Math.max(
...dataList
.filter((item) => {
return item !== '-' && !isNaN(Number(item))
})
.map((item) => Number(item)),
) / 10,
) * 10,
) //this.maxXAxis
this.option.series[1].data = this.pointF
this.option.series[2].data = this.pointFun
if (this.echartRef) {
this.echartRef.setOption(this.option, true)
} else {
this.initChart()
}
},
bindChartClickEvent() {
if (!this.echartRef) return
this.echartRef.on('click', (params) => {
// 点击查看详情
let item = params.value[3]
let str = JSON.stringify(item).replace(/%/g, '百分比')
// uni.navigateTo({ url: '/pages/message1/comp/transientDetails?detail=' + encodeURIComponent(str) })
})
},
},
computed: {},
watch: {
store: {
handler(val, oldVal) {
this.status = val.status
this.data = (val.data || [])
this.gongfunction()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped></style>

View File

@@ -0,0 +1,241 @@
<template>
<!-- ITIC -->
<view>
<l-echart v-if="status != 'loading'" ref="echartRef" @finished="initChart"></l-echart>
<uni-load-more v-else :status="status"></uni-load-more>
</view>
</template>
<script>
const echarts = require('../../../uni_modules/lime-echart/static/echarts.min')
export default {
components: {},
props: {
store: {
type: [Object],
},
},
data() {
return {
option: {
backgroundColor: '#fff',
grid: {
left: '10px',
right: '40rpx',
bottom: '40rpx',
top: '10px',
containLabel: true,
},
legend: {
data: ['上限', '下限', '可容忍事件', '不可容忍事件'],
right: '10px',
bottom: '10px',
textStyle: {
fontSize: 10,
},
itemWidth: 10,
itemHeight: 10,
itemGap: 8,
padding: [5, 5, 5, 10],
},
color: ['#FF8C00', '#00BFFF', 'green', 'red'],
yAxis: {
type: 'log',
min: '0.001',
max: '1000',
name: 's',
inverse: true,
axisLabel: {
rotate: -90,
},
splitLine: { show: false },
},
xAxis: {
type: 'value',
splitNumber: 10,
minInterval: 3,
position: 'top',
rotate: 90,
axisLabel: {
rotate: 90,
},
name: '%',
},
series: [
{
name: '上限',
type: 'line',
data: [
[200, 0.001],
[140, 0.003],
[120, 0.003],
[120, 0.5],
[110, 0.5],
[110, 10],
[110, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#FF8C00',
},
{
name: '下限',
type: 'line',
data: [
[0, 0.02],
[70, 0.02],
[70, 0.5],
[80, 0.5],
[80, 10],
[90, 10],
[90, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#00BFFF',
},
{
name: '可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointI,
data: [],
color: 'green',
},
{
name: '不可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointIun,
data: [],
color: 'red',
},
],
},
status: 'loading',
echartRef: null,
pointI: [],
pointIun: [],
data: [],
}
},
mounted() {
// this.initChart()
// console.log('🚀 ~ props.data:', this.props.data)
},
methods: {
init() {},
async initChart() {
if (!this.$refs.echartRef) return
try {
this.echartRef = await this.$refs.echartRef.init(echarts)
this.bindChartClickEvent()
this.echartRef.setOption(this.option, true)
} catch (error) {
console.error('图表初始化失败:', error)
}
},
gongfunction() {
// 初始化计数与数据数组
let normalCount = 0
let abnormalCount = 0
this.normalPoints = []
this.abnormalPoints = []
if (!this.data || this.data.length === 0) {
this.updateChartOption()
return
}
// 缓存长度,遍历数据
const len = this.data.length
for (let i = 0; i < len; i++) {
const item = this.data[i]
// 建议确认正则意图,/s/g 仅移除字母 s若去空格应为 /\s/g
const xx = parseFloat(item.evtParamTm.replace(/s/g, ''))
const yy = parseFloat(item.evtParamVVaDepth.replace(/%/g, ''))
const time = item.startTime.replace('T', ' ')
const pointData = [yy, xx, time, item]
const isNormal = this.checkPointStatus(xx, yy)
const pointObj = {
value: pointData,
itemStyle: { normal: { color: isNormal ? 'green' : 'red' } },
}
if (isNormal) {
normalCount++
this.normalPoints.push(pointObj)
} else {
abnormalCount++
this.abnormalPoints.push(pointObj)
}
}
this.updateChartOption()
},
// 提取判断逻辑为独立方法
checkPointStatus(xx, yy) {
if (xx <= 0.003) {
const line = 230 - 30000 * xx
return yy <= line
} else if (xx <= 0.02) {
return yy <= 120
} else if (xx <= 0.5) {
return yy > 70 && yy < 120
} else if (xx <= 10) {
return yy > 80 && yy < 110
} else {
return yy > 90 && yy < 110
}
},
updateChartOption() {
// 建议避免硬编码 series 索引,可通过 seriesName 查找
this.option.series[2].data = this.normalPoints
this.option.series[3].data = this.abnormalPoints
if (this.echartRef) {
this.echartRef.setOption(this.option, true)
} else {
this.initChart()
}
},
bindChartClickEvent() {
if (!this.echartRef) return
this.echartRef.on('click', (params) => {
console.log('🚀 ~ params:', params.value[3])
// 点击查看详情
let item = params.value[3]
let str = JSON.stringify(item).replace(/%/g, '百分比')
// uni.navigateTo({ url: '/pages/message1/comp/transientDetails?detail=' + encodeURIComponent(str) })
})
},
},
computed: {},
watch: {
store: {
handler(val, oldVal) {
this.status = val.status
this.data = (val.data || [])
this.gongfunction()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped></style>

View File

@@ -0,0 +1,244 @@
<template>
<Cn-page :loading="loading">
<view class="detail" slot="body">
<view class="detail-content" style="font-size: 32rpx">
<!-- <view class="detail-content-title mb20">发生时间</view> -->
<view>{{ detail.date }}</view>
</view>
<view class="detail-content" style="padding: 0px">
<view class="detail-content-title pb20 pt20 pl20">终端告警列表</view>
</view>
<view class="event-list">
<uni-card class="event-item" :class="item.type" v-for="(item, index) in list" :key="index">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon"
:class="item.devType == 'Direct_Connected_Device' ? 'zl-bgc' : 'jc-bgc'">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-terminal-box-fill"
size="35"
color="#FF0000"
></uni-icons> -->
<!-- <Cn-icon-transient :name="`运行告警`" /> -->
<Cn-icon-transient :name="item.devType == 'Direct_Connected_Device' ? '治理设备' : '监测设备'" />
<view class="badge1" v-if="item.status == 0"> </view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.devName }}</text>
<text class="event-tag"
:class="item.devType == 'Direct_Connected_Device' ? 'zl-tag' : 'jc-tag'">{{
item.devType == 'Direct_Connected_Device' ? '治理设备' : '监测设备' }}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<!-- <text v-if="item.dataDetails.onlineRate.isAbnormal">在线率{{
item.dataDetails.onlineRate.value }}% 限值{{ item.dataDetails.onlineRate.threshold
}}% </text> -->
<!-- <text>事件时间{{ item.startTime }}</text> -->
</view>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<view v-if="item.dataDetails.onlineRate.isAbnormal">
<text>在线率
{{item.dataDetails.onlineRate.value }}% 
</text>
</view>
<view v-if="hasIntegrityAbnormal(item)" class="mt10">
数据完整性
<view class="data-table">
<view class="table-header">
<text>监测点名称</text>
<text>完整性</text>
</view>
<view class="table-row"
v-for="value in item.dataDetails.integrity.monitorPoints.filter((p) => p.isAbnormal === true)">
<text>{{ value.monitorName }}</text>
<text>{{ value.value }}%</text>
</view>
</view>
</view>
<view v-if="item.warnCounts" class="mt10">
终端告警 {{ item.warnCounts }} 详情如下
<view class="textBox">
<view v-for="val in item.warnDetails" class="textBox mb5">
{{ val.warnEventTime + '发生' + val.warnEventDesc }}
</view>
</view>
</view>
</view>
</uni-card>
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus, queryAlarmDetail } from '@/common/api/message'
export default {
data() {
return {
loading: true,
detail: {},
limit: '',
collapseValue: '0',
list: [],
}
},
onLoad(options) {
this.loading = true
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.init()
if (this.detail.isRead != 1) {
updateStatus({
eventIds: [this.detail.eventId],
})
}
},
methods: {
hasIntegrityAbnormal(item) {
const points = item?.dataDetails?.integrity?.monitorPoints
if (!Array.isArray(points) || !points.length) return false
return points.every((p) => p.isAbnormal === true)
},
init() {
queryAlarmDetail({
devList: this.detail.devIds,
time: this.detail.date,
})
.then((res) => {
this.list = res.data
this.loading = false
})
.catch(() => {
this.loading = false
})
},
},
}
</script>
<style lang="scss" scoped>
@import '../index.scss';
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 28rpx;
.detail-content-title {
font-size: 30rpx;
color: #111;
font-weight: 700;
}
}
.collapseTop {
padding: 10rpx 0;
margin-left: 15px;
.name {
font-size: 28rpx;
font-weight: 700;
color: #333333;
}
}
.frequency {
display: flex;
font-size: 28rpx;
// color: #666666;
}
}
.textBox {
// border-bottom: 1px solid #eee;
font-size: 28rpx;
color: #666666;
text-indent: 2em;
}
.event-list {
// background: #fff;
padding-bottom: 10rpx;
// .event-icon {
// background-color: #376cf320;
// }
.zl-bgc {
background-color: #376cf320;
}
.jc-bgc {
background-color: #376cf320;
}
.zl-tag {
background-color: #007aff20;
color: #007aff;
}
.jc-tag {
background-color: #007aff20;
color: #007aff;
}
}
/deep/ .uni-collapse-item__title-box {
padding: 0 15px 0 0;
height: 56rpx;
line-height: 56rpx;
font-size: 26rpx !important;
color: #666666;
span {
font-size: 26rpx !important;
}
}
.textBox {
max-height: 120rpx;
overflow-y: auto;
}
.data-table {
margin-top: 10rpx;
background-color: #fff;
overflow: hidden;
.table-header,
.table-row {
display: flex;
justify-content: space-between;
padding: 15rpx 0rpx;
border-bottom: 1rpx solid #eee;
height: 20px;
text {
text-align: center;
font-size: 28rpx;
flex: 1;
}
}
.table-header {
padding: 0rpx;
padding-bottom: 10rpx;
}
}
</style>

View File

@@ -0,0 +1,431 @@
<template>
<view class="preview-container">
<!-- 右上角按钮组 -->
<view class="btn-group">
<!-- 缩小按钮 -->
<!-- <view class="btn zoom-out-btn" @click="zoomOut">
<text class="btn-icon"></text>
</view> -->
<!-- 放大按钮 -->
<!-- <view class="btn zoom-in-btn" @click="zoomIn">
<text class="btn-icon">+</text>
</view> -->
<!-- 下载按钮 -->
<view class="btn download-btn" @click="downloadImage">
<text class="btn-icon"></text>
</view>
</view>
<!-- 图片预览区域使用movable-area和movable-view实现缩放移动 -->
<movable-area class="movable-area" :style="{ width: '100vw', height: '100vh' }">
<movable-view
class="movable-view"
direction="all"
:scale="true"
:scale-min="0.2"
:scale-max="0.5"
:scale-value="scaleValue"
@touchstart="onTouchStart"
@touchend="onTouchEnd"
:x="x"
:y="y"
:animation="true"
:animation-duration="300"
:style="{
width: rotatedWidth + 'px',
height: rotatedHeight + 'px',
}"
>
<view
class="image-wrapper"
:style="{
width: imgWidth + 'px',
height: imgHeight + 'px',
transform: 'rotate(90deg)',
transformOrigin: 'center center',
}"
>
<image
:src="imageUrl"
class="preview-img"
mode="aspectFill"
:style="{
width: imgWidth + 'px',
height: imgHeight + 'px',
}"
@load="onImageLoad"
></image>
</view>
</movable-view>
</movable-area>
</view>
</template>
<script>
export default {
onLoad(options) {
this.imageUrl = decodeURIComponent(options.url) // 接收传递的图片URL需要解码
},
data() {
return {
imageUrl: '',
// 缩放相关 - 默认0.5
scaleValue: 0.2,
x: 0,
y: 0,
// 图片原始尺寸
imgWidth: 0,
imgHeight: 0,
// 旋转后的尺寸(交换宽高)
rotatedWidth: 0,
rotatedHeight: 0,
// 提示显示控制
showScaleTip: false,
tipTimer: null,
// 屏幕尺寸
windowWidth: 0,
windowHeight: 0,
// 缩放步长
zoomStep: 0.1,
// 动画控制
isTouching: false,
animationTimer: null
}
},
mounted() {
// 获取屏幕尺寸
const systemInfo = uni.getSystemInfoSync()
this.windowWidth = systemInfo.windowWidth
this.windowHeight = systemInfo.windowHeight
},
methods: {
// 图片加载完成后获取尺寸
onImageLoad(e) {
const { width, height } = e.detail
// 保存原始尺寸
this.imgWidth = width
this.imgHeight = height
// 旋转90度后宽度和高度互换
this.rotatedWidth = height // 旋转后宽度 = 原高度
this.rotatedHeight = width // 旋转后高度 = 原宽度
// 计算初始位置居中考虑0.5缩放)
this.resetPosition()
},
// 重置位置到中心(考虑当前缩放比例)
resetPosition() {
// 计算居中的偏移量,考虑缩放比例
const displayWidth = this.rotatedWidth * this.scaleValue
const displayHeight = this.rotatedHeight * this.scaleValue
this.x = (this.windowWidth - displayWidth) / 2
this.y = (this.windowHeight - displayHeight) / 2
},
// 触摸开始
onTouchStart() {
this.isTouching = true
},
// 触摸结束
onTouchEnd() {
this.isTouching = false
},
// 缩放事件处理
onScale(e) {
this.scaleValue = e.detail.scale
// 显示缩放提示
this.showScaleTip = true
if (this.tipTimer) {
clearTimeout(this.tipTimer)
}
this.tipTimer = setTimeout(() => {
this.showScaleTip = false
}, 1500)
},
// 放大
zoomIn() {
// 计算新的缩放值,不超过最大值
const newScale = Math.min(this.scaleValue + this.zoomStep, 0.5)
this.setScaleWithAnimation(newScale)
},
// 缩小
zoomOut() {
// 计算新的缩放值,不低于最小值
const newScale = Math.max(this.scaleValue - this.zoomStep, 0.2)
this.setScaleWithAnimation(newScale)
},
// 带动画的设置缩放值
setScaleWithAnimation(newScale) {
// 保存旧的缩放值用于动画
const oldScale = this.scaleValue
// 计算缩放中心点(屏幕中心)
const centerX = this.windowWidth / 2
const centerY = this.windowHeight / 2
// 计算当前图片中心点
const oldDisplayWidth = this.rotatedWidth * oldScale
const oldDisplayHeight = this.rotatedHeight * oldScale
const oldCenterX = this.x + oldDisplayWidth / 2
const oldCenterY = this.y + oldDisplayHeight / 2
// 计算偏移量,使缩放后图片中心保持在屏幕中心
const newDisplayWidth = this.rotatedWidth * newScale
const newDisplayHeight = this.rotatedHeight * newScale
const newX = centerX - newDisplayWidth / 2
const newY = centerY - newDisplayHeight / 2
// 更新缩放值和位置
this.scaleValue = newScale
this.x = newX
this.y = newY
// 显示缩放提示
this.showScaleTip = true
if (this.tipTimer) {
clearTimeout(this.tipTimer)
}
this.tipTimer = setTimeout(() => {
this.showScaleTip = false
}, 1500)
console.log('缩放:', {oldScale, newScale, x: this.x, y: this.y})
},
// 下载图片
downloadImage() {
uni.showLoading({
title: '下载中,请稍等...',
mask: true,
})
// 先获取图片信息(如果是网络图片需要先下载)
uni.downloadFile({
url: this.imageUrl,
success: (res) => {
if (res.statusCode === 200) {
// 保存图片到相册
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
uni.hideLoading()
uni.showToast({
title: '保存成功',
icon: 'success',
})
},
fail: (err) => {
uni.hideLoading()
console.error('保存失败', err)
// 处理用户拒绝权限的情况
if (err.errMsg.includes('auth deny')) {
uni.showModal({
title: '提示',
content: '需要您授权保存图片到相册',
success: (res) => {
if (res.confirm) {
uni.openSetting({
success: (settingRes) => {
console.log('打开设置页面', settingRes)
},
})
}
},
})
} else {
uni.showToast({
title: '保存失败',
icon: 'none',
})
}
},
})
} else {
uni.hideLoading()
uni.showToast({
title: '下载失败',
icon: 'none',
})
}
},
fail: (err) => {
uni.hideLoading()
console.error('下载失败', err)
uni.showToast({
title: '下载失败',
icon: 'none',
})
},
})
},
},
// 页面返回前清理定时器
onUnload() {
if (this.tipTimer) {
clearTimeout(this.tipTimer)
}
if (this.animationTimer) {
cancelAnimationFrame(this.animationTimer)
}
},
}
</script>
<style lang="scss" scoped>
.preview-container {
position: relative;
width: 100vw;
height: 100vh;
background: #000;
overflow: hidden;
}
.movable-area {
width: 100vw;
height: 100vh;
background: #000;
}
.movable-view {
display: flex;
align-items: center;
justify-content: center;
// 添加硬件加速
transform: translateZ(0);
will-change: transform;
}
.image-wrapper {
display: flex;
align-items: center;
justify-content: center;
// 添加硬件加速
transform: translateZ(0) rotate(90deg);
will-change: transform;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.preview-img {
display: block;
// 添加硬件加速
transform: translateZ(0);
will-change: transform;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
// 按钮组
.btn-group {
position: fixed;
top: 30rpx;
right: 30rpx;
display: flex;
flex-direction: row;
gap: 20rpx;
z-index: 1000;
}
// 通用按钮样式
.btn {
width: 70rpx;
height: 70rpx;
background: rgba(0, 0, 0, 0.5);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
// 按钮不参与动画
transform: translateZ(0);
transition: background-color 0.2s ease;
&:active {
background: rgba(0, 0, 0, 0.8);
transform: scale(0.95);
}
.btn-icon {
color: #fff;
font-size: 40rpx;
line-height: 1;
font-weight: bold;
}
}
// 缩小按钮
.zoom-out-btn {
.btn-icon {
font-size: 50rpx;
}
}
// 放大按钮
.zoom-in-btn {
.btn-icon {
font-size: 40rpx;
}
}
// 下载按钮
.download-btn {
.btn-icon {
font-size: 35rpx;
}
}
// 缩放提示
.scale-tip {
position: fixed;
bottom: 100rpx;
left: 50%;
transform: translateX(-50%) translateZ(0);
background: rgba(0, 0, 0, 0.6);
color: #fff;
padding: 10rpx 30rpx;
border-radius: 40rpx;
font-size: 28rpx;
z-index: 1000;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
animation: fadeInOut 1.5s ease;
// 提示不参与动画
will-change: opacity;
}
@keyframes fadeInOut {
0% {
opacity: 0;
}
15% {
opacity: 1;
}
85% {
opacity: 1;
}
100% {
opacity: 0;
}
}
</style>

View File

@@ -0,0 +1,170 @@
<template>
<Cn-page :loading="loading">
<view class="detail" slot="body">
<view class="detail-content" style="font-size: 32rpx">
<!-- <view class="detail-content-title mb20">发生时间</view> -->
<view>{{ detail.statisticsDate }}</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">基础信息</view>
<view class="mb5"> 工程名称{{ detail.engineeringName }} </view>
<view class="mb5"> 项目名称{{ detail.projectName }} </view>
<view class="mb5"> 设备名称{{ detail.devName }} </view>
<view class="mb5"> 监测点名称{{ detail.lineName }}</view>
<view class="mb5" style="display: flex">
越限详情
<view style="flex: 1" class="details">{{ detail.overLimitDesc }}</view>
</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">指标越限详情<text class="prompt">仅显示最严重的10组数据</text></view>
<uni-collapse accordion v-model="collapseValue">
<uni-collapse-item :title="item.targetName" v-for="item in list">
<view class="data-table">
<view class="table-header">
<text>时间</text>
<text>数据类型</text>
<text v-if="!item.harmDetailList[0].hasT">A相</text>
<text v-if="!item.harmDetailList[0].hasT">B相</text>
<text v-if="!item.harmDetailList[0].hasT">C相</text>
<text v-if="item.harmDetailList[0].hasT">总相</text>
<text>限值</text>
</view>
<view class="table-row" v-for="value in item.harmDetailList">
<text>{{ value.statisticsTime }}</text>
<text>{{ value.valueType || '/' }}</text>
<text v-if="!value.hasT">{{ value.dataA }}</text>
<text v-if="!value.hasT">{{ value.dataB }}</text>
<text v-if="!value.hasT">{{ value.dataC }}</text>
<text v-if="value.hasT">{{ value.dataT }}</text>
<text>{{ value.overLimitData }}</text>
</view>
</view>
</uni-collapse-item>
</uni-collapse>
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus, queryHarmonicDetail } from '@/common/api/message'
export default {
data() {
return {
loading: true,
detail: {},
list: [],
collapseValue: '0',
}
},
onLoad(options) {
// console.log(options.detail)
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.init()
if (this.detail.isRead != 1) {
updateStatus({
eventIds: [this.detail.eventId],
})
}
},
methods: {
init() {
queryHarmonicDetail({
lineId: this.detail.lineId,
time: this.detail.statisticsDate,
})
.then((res) => {
this.list = res.data
this.loading = false
})
.catch(() => {
this.loading = false
})
// }
},
},
}
</script>
<style lang="scss">
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 28rpx;
.detail-content-title {
font-size: 30rpx;
color: #111;
font-weight: 700;
}
}
.limit {
display: flex;
align-items: center;
justify-content: end;
width: 450rpx;
margin-left: auto;
}
.prompt {
font-size: 24rpx;
color: #111;
font-weight: 500;
}
}
.data-table {
margin-top: 20rpx;
background-color: #fff;
overflow: hidden;
color: #666;
.table-header,
.table-row {
display: flex;
justify-content: space-between;
padding: 15rpx 0rpx;
height: 20px;
border-bottom: 1rpx solid #eee;
text {
width: 100rpx;
text-align: center;
font-size: 28rpx;
// color: #333;
&:nth-child(1) {
flex: 1;
}
&:nth-child(2) {
flex: 1;
}
}
}
.table-header {
padding: 0rpx;
padding-bottom: 10rpx;
}
}
/deep/ .uni-collapse-item__title-text {
font-weight: 700;
span {
font-size: 28rpx;
}
}
.details {
max-height: 70px;
overflow-y: auto;
}
</style>

View File

@@ -0,0 +1,138 @@
<template>
<Cn-page :loading="loading">
<view class="detail" slot="body">
<view class="detail-content" style="font-size: 32rpx">
<view>{{ detail.startTime }}</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">基础信息</view>
<view class="mb5"> 工程名称{{ detail.engineeringName }} </view>
<view class="mb5"> 项目名称{{ detail.projectName }} </view>
<view class="mb5"> 设备名称{{ detail.equipmentName }}</view>
<view class="mb5"> 监测点名称{{ detail.lineName }}</view>
<view class="mb5"> 暂态类型{{ detail.showName }}</view>
<view class="mb5" v-if="detail.evtParamTm"> 持续时间{{ detail.evtParamTm }}s</view>
<view class="mb5" v-if="detail.evtParamVVaDepth"> 幅值{{ detail.evtParamVVaDepth }}%</view>
<view class="mb5" v-if="detail.evtParamPhase"> 相别{{ detail.evtParamPhase }}</view>
</view>
<view class="detail-tabs">
<uni-segmented-control :current="detailTab" active-color="#376cf3" :values="['波形图', 'ITIC', 'F47']"
@clickItem="onDetailTabChange" />
</view>
<view v-if="detailTab == 0">
<view class="detail-content">
<view class="detail-content-title mb20">瞬时波形图</view>
<image style="width: 100%" :src="detail.instantPics" mode="widthFix" v-if="detail.instantPics"
@click="previewImage(detail.instantPics)" />
<text v-else>暂无</text>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">RMS波形图</view>
<image style="width: 100%" :src="detail.rmsPics" mode="widthFix" v-if="detail.rmsPics"
@click="previewImage(detail.rmsPics)" />
<text v-else>暂无</text>
</view>
</view>
<view v-if="detailTab == 1" class="chart-wrapper">
<ITIC :store="eventStore" style="height: calc(100vh - 360px);" />
</view>
<view v-if="detailTab == 2" class="chart-wrapper">
<F47 :store="eventStore" style="height: calc(100vh - 360px);" />
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus } from '@/common/api/message'
import ITIC from './ITIC.vue'
import F47 from './F47.vue'
export default {
components: { ITIC, F47 },
data() {
return {
loading: true,
detail: {},
detailTab: 0,
}
},
computed: {
eventStore() {
const hasData = this.detail && (this.detail.id || this.detail.equipmentId)
if (!hasData) {
return { data: [], status: 'noMore' }
}
const item = {
...this.detail,
evtParamTm: this.detail.evtParamTm || '0s',
evtParamVVaDepth: this.detail.evtParamVVaDepth || '0%',
}
return {
data: [item],
status: 'noMore',
}
},
},
onLoad(options) {
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.detail.rmsPics && (this.detail.rmsPics = this.$config.static + this.detail.rmsPics)
this.detail.instantPics && (this.detail.instantPics = this.$config.static + this.detail.instantPics)
this.loading = false
if (this.detail.status != 1) {
updateStatus({
eventIds: [this.detail.id],
})
}
},
methods: {
onDetailTabChange(e) {
this.detailTab = e.currentIndex
},
previewImage(url) {
uni.navigateTo({
url: `/pages/message1/comp/preview?url=${encodeURIComponent(url)}`,
})
},
},
}
</script>
<style lang="scss">
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 28rpx;
.detail-content-title {
font-size: 30rpx;
color: #111;
font-weight: 700;
}
}
.detail-tabs {
padding: 0 20rpx;
margin-bottom: 20rpx;
}
.chart-container {
min-height: 600rpx;
}
.chart-wrapper {
background: #fff;
margin-bottom: 20rpx;
padding: 20rpx;
}
}
.segmented-control {
flex: 1;
margin-right: 24rpx;
height: 60rpx;
}
</style>

198
pages/message1/index.scss Normal file
View File

@@ -0,0 +1,198 @@
/* 整体容器:横向排列,间距均匀 */
.statistics {
display: flex;
gap: 20rpx; /* 盒子之间的间距 */
/* 通用盒子样式 */
.box {
flex: 1; /* 四个盒子等分宽度 */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 130rpx;
background-color: #ffffff;
border-radius: 16rpx;
}
/* 第一个盒子的特殊样式(蓝色背景) */
.box:first-child {
flex: 1.7;
}
.boxClick1 {
background-color: $uni-theme-color;
color: #ffffff;
}
/* 数字样式 */
.num {
font-size: 38rpx;
font-weight: 600;
line-height: 1.2;
margin-bottom: 8rpx;
}
/* 标签文字样式 */
.label {
font-size: 24rpx;
color: inherit; /* 继承父元素颜色,适配蓝色背景 */
}
}
/* 列表容器 */
.event-list {
background-color: #f5f7fa;
box-sizing: border-box;
/* 通用项样式 */
/deep/ .uni-card:first-of-type {
margin-top: 0 !important;
}
/deep/ .uni-card {
padding: 0 !important;
}
/* 头部:图标 + 信息 + 操作 */
.event-header {
display: flex;
align-items: center;
margin-bottom: 10rpx;
}
/* 图标区域(按类型区分背景色) */
.event-icon {
position: relative;
width: 110rpx;
height: 110rpx;
border-radius: 12rpx;
display: flex;
justify-content: center;
align-items: center;
margin-right: 20rpx;
}
.badge1 {
position: absolute;
top: -10rpx;
right: -10rpx;
width: 20rpx;
height: 20rpx;
background-color: #ff3b30; /* 红色徽章 */
border-radius: 20rpx;
}
/* 电压暂降 - 蓝色系 */
.sag .event-icon {
background-color: #2563eb20;
}
/* 电压暂升 - 橙色系 */
.swell .event-icon {
background-color: #e6a23c20;
}
.interrupt .event-icon {
background-color: #00000020;
}
.transient .event-icon {
background-color: #8b5cf620;
}
.unknown .event-icon {
background-color: #6b728020;
}
.event-icon image {
width: 48rpx;
height: 48rpx;
}
/* 信息区域 */
.event-info {
flex: 1;
}
.event-title {
display: flex;
align-items: center;
margin-bottom: 5rpx;
flex-wrap: wrap; /* 适配小屏,防止文字溢出 */
}
.event-id {
font-size: 30rpx;
font-weight: 700;
color: #333333;
margin-right: 16rpx;
}
/* 标签样式(按类型区分) */
.event-tag {
font-size: 20rpx;
padding: 0rpx 10rpx;
border-radius: 8rpx;
color: #ffffff;
height: 34rpx;
line-height: 38rpx;
}
.sag-tag {
background-color: #2563eb20;
color: #2563eb;
}
.swell-tag {
background-color: #e6a23c20;
color: #e6a23c;
}
.interrupt-tag {
background-color: #6b728020;
color: #6b7280;
}
.transient-tag {
background-color: #8b5cf620;
color: #8b5cf6;
}
.unknown-tag {
background-color: #6b728020;
color: #6b7280;
}
/* 描述文本 */
.event-desc {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.event-desc text {
font-size: 28rpx;
color: #666666;
line-height: 1.2;
}
/* 操作按钮 */
.event-action {
display: flex;
justify-content: center;
align-items: center;
color: #999999;
font-size: 40rpx;
/* 点击反馈 */
touch-action: manipulation;
}
.event-action:active {
color: #376cf3;
transform: scale(0.95);
}
/* 详情文本 */
.event-detail {
font-size: 28rpx;
color: #666666;
line-height: 1.5;
padding-top: 10rpx;
border-top: 1rpx solid #f0f0f0;
word-wrap: break-word; /* 自动换行,防止长文本溢出 */
}
}
.smallLabel {
padding: 0 20rpx 20rpx 20rpx;
display: flex;
align-items: center;
justify-content: flex-end;
.segmented-control {
flex: 1;
margin-right: 20rpx;
height: 58rpx;
}
.uni-input {
font-size: 24rpx;
color: #2563eb;
margin-right: 10rpx;
}
}

158
pages/message1/run.vue Normal file
View File

@@ -0,0 +1,158 @@
<template>
<view style="position: relative">
<!-- 运行事件 -->
<!-- 卡片 -->
<scroll-view scroll-y="true" @refresherrefresh="refresherrefresh" @scrolltolower="scrolltolower"
:refresher-triggered="triggered" refresher-enabled="true" class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + 10) + 'px)', overflow: 'auto' }">
<!-- 循环渲染事件项 -->
<uni-card class="event-item " :class="item.type" v-for="(item, index) in store.data" :key="index"
@click="jump(item)">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon" :class="item.devType == 'Direct_Connected_Device' ? 'zl-bgc' : 'jc-bgc'">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons custom-prefix="iconfont" type="icon-shebei3" size="35" color="#376cf3"></uni-icons> -->
<Cn-icon-transient :name="item.devType == 'Direct_Connected_Device' ? '治理设备' : '监测设备'" />
<view class="badge1" v-if="item.status == 0"> </view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.equipmentName }}</text>
<text class="event-tag"
:class="item.devType == 'Direct_Connected_Device' ? 'zl-tag' : 'jc-tag'">{{ item.devType
== 'Direct_Connected_Device' ? '治理设备' : '监测设备' }}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>事件时间{{ item.startTime2 }}</text>
</view>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<text> {{ item.showName }} </text>
</view>
</uni-card>
<uni-load-more v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
import { updateStatus } from '@/common/api/message'
export default {
components: {},
props: {
navHeight: {
type: Number,
default: 0,
},
selectValue: {
type: Object,
// default: () => {},
},
},
mixins: [list],
data() {
return {
triggered: true,
}
},
mounted() { },
methods: {
// 查詢
init() {
this.store = this.DataSource('/cs-harmonic-boot/eventUser/queryEventpage')
this.store.params.type = 2
// this.store.params.pageSize = 10000
this.store.params.sortField = this.sort
this.store.params.engineeringid = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.deviceId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
this.store.params.startTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay
this.store.params.endTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay
this.store.loadedCallback = () => {
this.loading = false
}
this.store.reload()
},
jump(item) {
if (item.status != '1') {
item.status = '1'
updateStatus({
eventIds: [item.id],
})
this.$emit('getDevCount')
}
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
computed: {},
watch: {
selectValue: {
handler(val, oldVal) {
if (Object.keys(val).length === 0) return
this.init()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped>
@import './index.scss';
/* 列表容器 */
.event-list {
margin-top: 20rpx;
/* 头部:图标 + 信息 + 操作 */
/* 图标区域(按类型区分背景色) */
.zl-bgc {
background-color: #376cf320;
}
.jc-bgc {
background-color: #376cf320;
}
.zl-tag {
background-color: #007aff20;
color: #007aff;
}
.jc-tag {
background-color: #007aff20;
color: #007aff;
}
}
/deep/ .uni-scroll-view-refresher {
display: none;
}
</style>

View File

@@ -0,0 +1,391 @@
<template>
<view style="position: relative">
<!-- 稳态 -->
<view class="transientBox">
<view class="statistics pd20">
<view
class="box boxClick"
:class="{ boxClick1: item.label == filterValue }"
v-for="item in list"
@click="
filterValue = item.label
init()
"
>
<text class="num">{{ item.value }}</text>
<text class="label">{{ item.label }}</text>
</view>
</view>
</view>
<!-- 越限数量 -->
<scroll-view
v-if="filterValue == '越限数量'"
scroll-y="true"
@refresherrefresh="refresherrefresh"
@scrolltolower="scrolltolower"
:refresher-triggered="triggered"
refresher-enabled="true"
class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }"
>
<!-- 循环渲染事件项 -->
<uni-card
class="event-item boxClick"
:class="item.type"
v-for="(item, index) in store.data"
:key="index"
@click="jump(item)"
>
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-kouanjiancedian"
size="40"
color="#E6A23C"
></uni-icons> -->
<Cn-icon-transient :name="`稳态越限`" />
<view class="badge1" v-if="item.isRead == 0"></view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>设备名称{{ item.devName }}</text>
<!-- <text>统计日期{{ item.statisticsDate }}</text> -->
</view>
</view>
<view class="event-action">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail textBox" @touchmove.stop>
<text>{{ item.statisticsDate }}发生 {{ item.overLimitDesc }}</text>
</view>
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
<!-- 越限天数 -->
<view v-if="filterValue == '越限天数'">
<uni-calendar
:insert="true"
:lunar="false"
:date="startData"
:selected="selected"
:start-date="startData"
:end-date="endData"
/>
</view>
<!-- 越限测点数 -->
<scroll-view
v-if="filterValue == '越限测点数'"
scroll-y="true"
@refresherrefresh="refresherrefresh"
@scrolltolower="scrolltolower"
:refresher-triggered="triggered"
refresher-enabled="true"
class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }"
>
<!-- 循环渲染事件项 -->
<uni-card class="event-item" :class="item.type" v-for="(item, index) in store.data" :key="index">
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
custom-prefix="iconfont"
type="icon-kouanjiancedian"
size="40"
color="#E6A23C"
></uni-icons> -->
<Cn-icon-transient :name="`稳态越限`" />
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>设备名称{{ item.devName }}</text>
<!-- <text>统计日期{{ item.statisticsDate }}</text> -->
</view>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<uni-calendar
:insert="true"
:lunar="false"
:date="startData"
:selected="item.timeList.map((date) => ({ date, info: '' }))"
:start-date="startData"
:end-date="endData"
/>
</view>
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
import { queryAppHarmonicCounts, queryAppHarmonicLine } from '../../common/api/harmonic.js'
export default {
components: {},
props: {
navHeight: {
type: Number,
default: 0,
},
selectValue: {
type: Object,
// default: () => {},
},
},
mixins: [list],
data() {
return {
height: 0,
filterValue: '越限数量',
list: [
{ value: 0, label: '越限数量' },
{ value: 0, label: '越限天数' },
{ value: 0, label: '越限测点数' },
],
startData: '',
endData: '',
selected: [
// { date: '2026-04-10', info: '' },
// { date: '2026-04-11', info: '' },
// { date: '2026-04-12', info: '' },
],
triggered: true,
status: 'noMore', //more加载前 loading加载中 noMore加载后
}
},
mounted() {
uni.createSelectorQuery()
.select('.transientBox')
.boundingClientRect((rect) => {
//
// #ifdef H5
this.height = rect.height
// #endif
// #ifdef APP-PLUS
this.height = rect.height
// #endif
})
.exec()
},
methods: {
// "devId": "",
// "engineerId": "",
// "lineId": "",
// "projectId": "",
// "time": ""
// 查詢
init() {
if (this.filterValue == '越限测点数') {
this.store = this.DataSource('/cs-harmonic-boot/csHarmonic/queryAppHarmonicLine')
} else {
this.store = this.DataSource('/cs-harmonic-boot/csHarmonic/queryHarmonicList')
}
// this.store.params.pageSize = 10000
this.store.params.engineerId = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.devId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
this.store.params.time = this.selectValue.date
this.store.loadedCallback = () => {
this.loading = false
this.startData = this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay
this.endData = this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay
// 查询越限日期
queryAppHarmonicCounts(this.store.params).then((res) => {
this.list[0].value = res.data.harmonicNums
this.list[1].value = res.data.overDays
this.list[2].value = res.data.overLineNums
this.selected = res.data.overDaysList.map((date) => ({ date, info: '' }))
})
}
this.store.reload()
},
jump(item) {
let str = JSON.stringify(item).replace(/%/g, '百分比')
item.isRead = '1'
uni.navigateTo({ url: '/pages/message1/comp/steadyStateDetails?detail=' + encodeURIComponent(str) })
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
computed: {},
watch: {
selectValue: {
handler(val, oldVal) {
if (Object.keys(val).length === 0) return
this.init()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped>
@import './index.scss';
.box:first-child {
flex: 1.3 !important;
}
/* 列表容器 */
.event-list {
/* 头部:图标 + 信息 + 操作 */
.event-header {
display: flex;
align-items: center;
margin-bottom: 10rpx;
}
/* 图标区域(按类型区分背景色) */
.event-icon {
background-color: #376cf320;
}
.event-tags {
font-size: 24rpx;
}
}
/deep/ .uni-scroll-view-refresher {
display: none;
}
.textBox {
max-height: 110rpx;
overflow-y: auto;
// overflow: hidden;
/* 下面是溢出显示省略号关键样式 */
// display: -webkit-box;
// -webkit-line-clamp: 3; /* 控制最多显示几行,你可以改 2/3/4 */
// -webkit-box-orient: vertical;
// text-overflow: ellipsis;
// word-break: break-all;
}
/deep/ .uni-calendar-item--checked {
background-color: #ffffff00;
color: #000000e6;
opacity: 1;
}
/deep/ .uni-calendar-item--isDay {
background-color: #ffffff00;
color: #000000e6;
opacity: 1;
.uni-calendar-item__weeks-lunar-text {
background-color: #ffffff00;
color: #000000e6;
opacity: 1;
}
}
/deep/ .uni-calendar-item__weeks-box-text {
z-index: 1;
}
/deep/ .uni-calendar-item--isDay-text {
color: #333 !important; /* 改成你想要的颜色 */
}
/deep/ .uni-calendar-item__weeks-box-circle {
position: absolute;
top: 7px;
right: 6px;
width: 39px;
height: 39px;
border-radius: 50%;
z-index: 0;
background-color: #e6a23c;
}
/* 核心:选中圆圈下的 子元素(日期数字) */
/deep/ .uni-calendar-item__weeks-box-circle + .uni-calendar-item__weeks-box-text {
color: #fff !important; /* 改成你想要的颜色 */
}
/deep/ .uni-calendar__backtoday,
/deep/ .uni-calendar__header-btn-box {
display: none;
}
/deep/ .uni-calendar-item__weeks-lunar-text {
display: none;
}
/deep/ .uni-calendar__header {
pointer-events: none !important;
}
.event-detail {
/deep/ .uni-calendar__header {
display: none !important;
}
/deep/ .uni-calendar__weeks-day {
height: 35px;
}
/deep/ .uni-calendar-item__weeks-box-item {
height: 40px;
}
/deep/ .uni-calendar-item__weeks-box-circle {
position: absolute;
top: 3px;
right: 8px;
width: 35px;
height: 35px;
}
}
</style>

View File

@@ -0,0 +1,272 @@
<template>
<view style="position: relative">
<!-- 暂态 -->
<view class="transientBox">
<view class="statistics pd20">
<view
class="box boxClick"
:class="{ boxClick1: filterValue == index }"
v-for="(item, index) in dataList"
@click="
filterValue = index
init()
"
>
<!-- <text class="num">{{ item.value }}</text> -->
<text class="num">{{ item.value }}</text>
<text class="label">{{ item.label }}</text>
</view>
</view>
<!-- <view class="smallLabel"> </view> -->
</view>
<!-- 卡片 -->
<scroll-view
scroll-y="true"
@refresherrefresh="refresherrefresh"
@scrolltolower="scrolltolower"
:refresher-triggered="triggered"
refresher-enabled="true"
class="event-list"
:style="{ height: 'calc(100vh - ' + (navHeight + height) + 'px)', overflow: 'auto' }"
>
<!-- 循环渲染事件项 -->
<uni-card
class="event-item boxClick"
:class="judgment(item.showName).type"
v-for="(item, index) in store.data || []"
:key="index"
@click="jump(item)"
>
<!-- 头部图标 + 信息 + 操作 -->
<view class="event-header">
<view class="event-icon">
<!-- 动态图标根据类型切换 -->
<!-- <uni-icons
:custom-prefix="'iconfont'"
:type="judgment(item.showName).icon"
:color="judgment(item.showName).color"
:size="judgment(item.showName).size"
></uni-icons> -->
<Cn-icon-transient :name="item.showName" />
<!-- 0未读 1已读 -->
<view class="badge1" v-if="item.status == 0"> </view>
</view>
<view class="event-info">
<view class="event-title">
<text class="event-id">{{ item.lineName }}</text>
<text class="event-tag" :class="`${judgment(item.showName).type}-tag`">{{
item.showName
}}</text>
</view>
<view class="event-desc">
<text>工程名称{{ item.engineeringName }}</text>
<text>项目名称{{ item.projectName }}</text>
<text>设备名称{{ item.equipmentName }}</text>
</view>
</view>
<view class="event-action">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</view>
<!-- 详情区域 -->
<view class="event-detail">
<text>
{{ item.startTime ? '发生时间:' + item.startTime : '' }}
{{
item.evtParamVVaDepth != null && item.evtParamVVaDepth !== ''
? ',幅值:' + item.evtParamVVaDepth + '%'
: ''
}}
{{
item.evtParamTm != null && item.evtParamTm !== ''
? ',持续时间:' + item.evtParamTm + 's'
: ''
}}
{{
item.evtParamPhase != null && item.evtParamPhase !== ''
? ',相别:' + item.evtParamPhase
: ''
}}
</text>
</view>
</uni-card>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
<Cn-empty v-else style="top: 20%"></Cn-empty>
</scroll-view>
</view>
</template>
<script>
import list from '@/common/js/list'
import { queryAppEventCounts } from '../../common/api/harmonic.js'
export default {
props: {
navHeight: {
type: Number,
default: 0,
},
selectValue: {
type: Object,
// default: () => {},
},
sortIndex: {
type: [Number,String],
// default: () => {},
},
},
mixins: [list],
data() {
return {
height: 0,
filterValue: 0,
dataList: [
{ value: 0, label: '暂态数量', key: '' },
{ value: 0, label: '暂降', key: '电压暂降' },
{ value: 0, label: '中断', key: '电压中断' },
{ value: 0, label: '暂升', key: '电压暂升' },
],
status: 'noMore', //more加载前 loading加载中 noMore加载后
sort: 0,
triggered: true,
}
},
methods: {
getHeight() {
uni.createSelectorQuery()
.select('.transientBox')
.boundingClientRect((rect) => {
//
// #ifdef H5
this.height = rect?.height || 0
// #endif
// #ifdef APP-PLUS
this.height = rect?.height || 0
// #endif
})
.exec()
},
// 查詢
init() {
this.store = this.DataSource('/cs-harmonic-boot/eventUser/queryEventpage')
this.store.params.type = 0
// this.store.params.pageSize = 10000
this.store.params.sortField = this.sortIndex
this.store.params.engineeringid = this.selectValue.engineeringId
this.store.params.projectId = this.selectValue.projectId
this.store.params.deviceId = this.selectValue.deviceId
this.store.params.lineId = this.selectValue.lineId
this.store.params.target =
this.filterValue == 0
? []
: this.filterValue == 1
? ['Evt_Sys_DipStr']
: this.filterValue == 2
? ['Evt_Sys_IntrStr']
: ['Evt_Sys_SwlStr']
this.store.params.startTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).firstDay
this.store.params.endTime = this.$util.getMonthFirstAndLastDay(this.selectValue.date).lastDay
this.store.loadedCallback = () => {
this.getHeight()
this.loading = false
queryAppEventCounts(this.store.params).then((res) => {
this.dataList[0].value = res.data.allNum
this.dataList[1].value = res.data.eventDown
this.dataList[2].value = res.data.eventOff
this.dataList[3].value = res.data.eventUp
})
}
this.store.reload()
},
judgment(val, key) {
switch (val) {
case '电压暂降':
return {
type: 'sag',
icon: 'icon-a-svg4',
color: '#2563eb',
size: '25',
}
case '电压暂升':
return {
type: 'swell',
icon: 'icon-a-svg5',
color: '#e6a23c',
size: '25',
}
case '电压中断':
return {
type: 'interrupt',
icon: 'icon-zhongduan2',
color: '#6b7280',
size: '35',
}
case '瞬态':
return {
type: 'transient',
icon: 'icon-shuntaishijian',
color: '#8b5cf6',
size: '40',
}
case '未知':
return {
type: 'unknown',
icon: 'icon-wenhao',
color: '#6b7280',
size: '45',
}
}
},
// 点击查看详情
jump(item) {
let str = JSON.stringify(item).replace(/%/g, '百分比')
item.status = '1'
uni.navigateTo({ url: '/pages/message1/comp/transientDetails?detail=' + encodeURIComponent(str) })
},
setSort(index) {
console.log(123,this.sortIndex);
// this.sort = index
this.init()
},
// 下拉
refresherrefresh() {
this.triggered = true
uni.startPullDownRefresh()
setTimeout(() => {
this.triggered = false
}, 500)
},
// 上拉
scrolltolower() {
if (this.store.status != 'noMore') {
this.store.next && this.store.next()
}
},
},
computed: {},
watch: {
selectValue: {
handler(val, oldVal) {
if (Object.keys(val).length === 0) return
this.init()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped>
@import './index.scss';
/deep/ .uni-scroll-view-refresher {
display: none;
}
</style>

View File

@@ -1,123 +1,123 @@
<template>
<Cn-page :loading="loading">
<view class="mine" slot="body">
<view class="mine-nav" style="margin-top: 20rpx">
<view class="mine-nav-label">功能调试</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('feature')"
:checked="config.feature"
/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">出厂调试</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('factory')"
:checked="config.factory"
/>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data() {
return {
loading: true,
config: {
feature: true,
factory: true,
},
}
},
methods: {
init() {
let serverConfig = uni.getStorageSync(this.$cacheKey.serverConfig)
serverConfig && (this.config = serverConfig)
this.loading = false
},
change(type) {
this.config[type] = !this.config[type]
let str = ''
switch (type) {
case 'feature':
str = '功能调试'
break
case 'factory':
str = '出厂调试'
break
}
this.$util.toast(`${str}首页入口${this.config[type] ? '开启' : '关闭'}`, 2500)
uni.setStorage({
key: this.$cacheKey.serverConfig,
data: this.config,
})
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.mine {
.title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
}
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
</style>
<template>
<Cn-page :loading="loading">
<view class="mine" slot="body">
<view class="mine-nav" style="margin-top: 20rpx">
<view class="mine-nav-label">功能调试</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('feature')"
:checked="config.feature"
/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">出厂调试</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('factory')"
:checked="config.factory"
/>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data() {
return {
loading: true,
config: {
feature: true,
factory: true,
},
}
},
methods: {
init() {
let serverConfig = uni.getStorageSync(this.$cacheKey.serverConfig)
serverConfig && (this.config = serverConfig)
this.loading = false
},
change(type) {
this.config[type] = !this.config[type]
let str = ''
switch (type) {
case 'feature':
str = '功能调试'
break
case 'factory':
str = '出厂调试'
break
}
this.$util.toast(`${str}首页入口${this.config[type] ? '开启' : '关闭'}`, 2500)
uni.setStorage({
key: this.$cacheKey.serverConfig,
data: this.config,
})
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.mine {
.title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
}
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
</style>

View File

@@ -48,7 +48,7 @@
<!-- @click="jump('about')" -->
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">版本信息</view>
<view style="color: #828282; font-size: 14rpx">当前版本V<1.6.7</view>
<view style="color: #828282; font-size: 14rpx">当前版本V{{ version }}</view>
<!-- <uni-icons type="forward" color="#aaa" size="20"></uni-icons> -->
</view>
<view class="mine-nav" @click="jump('layout')" style="margin-top: 20rpx; border-bottom: none">
@@ -64,10 +64,19 @@ export default {
data() {
return {
loading: false,
version: '1.0.0',
}
},
methods: {
async init() {},
async init() {
const isDev = process.env.NODE_ENV === 'development'
if (isDev) {
return console.log('开发环境,不执行更新检查')
}
plus.runtime.getProperty(plus.runtime.appid, (info) => {
this.version = info.version // 当前本地版本号
})
},
jump(type) {
switch (type) {
case 'changePwd':

View File

@@ -1,147 +1,170 @@
<template>
<Cn-page :loading="loading">
<view class="mine" slot="body">
<view class="mine-nav" style="margin-top: 20rpx">
<view class="mine-nav-label">运行事件</view>
<switch style="transform: scale(0.8)" color="#376cf3" @change="change('runInfo')" :checked="config.runInfo === 1"/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">暂态事件</view>
<switch style="transform: scale(0.8)" color="#376cf3" @change="change('eventInfo')" :checked="config.eventInfo === 1"/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">稳态事件</view>
<switch style="transform: scale(0.8)" color="#376cf3" @change="change('harmonicInfo')" :checked="config.harmonicInfo === 1"/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">设备告警</view>
<switch style="transform: scale(0.8)" color="#376cf3" @change="change('alarmInfo')" :checked="config.alarmInfo === 1"/>
</view>
</view>
</Cn-page>
</template>
<script>
import {queryUserPushConfig, updatePushConfig} from '@/common/api/mine'
export default {
data() {
return {
loading: true,
config: {},
}
},
methods: {
init() {
queryUserPushConfig().then(res => {
console.log(123123,res);
this.config = res.data
console.log(this.config)
this.loading = false
})
},
change(type) {
this.config[type] = this.config[type] === 1 ? 0 : 1
updatePushConfig(this.config).then(res => {
let str = ''
switch (type){
case 'runInfo':
str = '运行事件'
break
case 'eventInfo':
str = '暂态事件'
break
case 'harmonicInfo':
str = '稳态事件'
break
case 'alarmInfo':
str = '设备告警'
break
}
this.$util.toast(`${str}推送${this.config[type] === 1 ? '开启' : '关闭'}成功`)
})
},
jump(type) {
switch (type) {
case 'changePwd':
uni.navigateTo({
url: `/pages/user/changePwd`,
})
break
case 'changePhone':
uni.navigateTo({
url: `/pages/user/changePhone`,
})
break
default:
uni.navigateTo({
url: `/pages/mine/${type}`,
})
break
}
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.mine {
.title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
}
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
</style>
<template>
<Cn-page :loading="loading">
<view class="mine" slot="body">
<view class="mine-nav mt20" style="border-bottom: none">
<view class="mine-nav-label">暂态事件</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('eventInfo')"
:checked="config.eventInfo === 1"
/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">稳态事件</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('harmonicInfo')"
:checked="config.harmonicInfo === 1"
/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">运行告警</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('alarmInfo')"
:checked="config.alarmInfo === 1"
/>
</view>
<view class="mine-nav" >
<view class="mine-nav-label">运行事件</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('runInfo')"
:checked="config.runInfo === 1"
/>
</view>
</view>
</Cn-page>
</template>
<script>
import { queryUserPushConfig, updatePushConfig } from '@/common/api/mine'
export default {
data() {
return {
loading: true,
config: {},
}
},
methods: {
init() {
queryUserPushConfig().then((res) => {
this.config = res.data
this.loading = false
})
},
change(type) {
this.config[type] = this.config[type] === 1 ? 0 : 1
// updatePushConfig(this.config).then((res) => {
// let str = ''
// switch (type) {
// case 'runInfo':
// str = '运行事件'
// break
// case 'eventInfo':
// str = '暂态事件'
// break
// case 'harmonicInfo':
// str = '稳态事件'
// break
// case 'alarmInfo':
// str = '设备告警'
// break
// }
// this.$util.toast(`${str}推送${this.config[type] === 1 ? '开启' : '关闭'}成功`)
// })
},
jump(type) {
switch (type) {
case 'changePwd':
uni.navigateTo({
url: `/pages/user/changePwd`,
})
break
case 'changePhone':
uni.navigateTo({
url: `/pages/user/changePhone`,
})
break
default:
uni.navigateTo({
url: `/pages/mine/${type}`,
})
break
}
},
onUnload() {
updatePushConfig(this.config).then((res) => {
// this.$util.toast(`配置修改成功!`)
})
},
},
onLoad() {
this.init()
},
}
</script>
<style lang="scss">
.mine {
.title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
}
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
</style>

View File

@@ -0,0 +1,129 @@
<template>
<Cn-page :loading="loading">
<view class="mine" slot="body">
<view class="mine-nav" style="margin-top: 20rpx">
<view class="mine-nav-label">ITIC</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('iticFunction')"
:checked="config.iticFunction === 1"
/>
</view>
<view class="mine-nav" style="border-bottom: none">
<view class="mine-nav-label">F47</view>
<switch
style="transform: scale(0.8)"
color="#376cf3"
@change="change('f47Function')"
:checked="config.f47Function === 1"
/>
</view>
</view>
</Cn-page>
</template>
<script>
import { queryUserPushConfig, updatePushConfig } from '@/common/api/mine'
export default {
data() {
return {
loading: true,
config: {},
}
},
onLoad() {
this.init()
},
methods: {
init() {
queryUserPushConfig().then((res) => {
this.config = res.data
this.loading = false
})
},
change(type) {
this.config[type] = this.config[type] === 1 ? 0 : 1
// updatePushConfig(this.config).then((res) => {
// let str = ''
// switch (type) {
// case 'iticFunction':
// str = 'ITIC'
// break
// case 'f47Function':
// str = 'F47'
// break
// }
// this.$util.toast(`${str}配置${this.config[type] === 1 ? '开启' : '关闭'}成功`)
// })
},
},
onLoad() {
this.init()
},
onUnload() {
updatePushConfig(this.config).then((res) => {
// this.$util.toast(`配置修改成功!`)
})
},
}
</script>
<style lang="scss">
.mine {
.title {
padding: 0 20rpx;
font-size: 28rpx;
font-weight: 500;
}
.mine-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.mine-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.mine-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
}
}
.mine-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
</style>

View File

@@ -1,361 +1,350 @@
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="header">
<view class="header-title"
>{{ project.name }}
<!-- <view class="header-title-extra">用能</view> -->
</view>
<view class="header-des">项目描述{{ project.description }}</view>
</view>
<view class="nav">
<view
class="nav-menu"
:class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList"
:key="index"
@click="navMenuClick(index)"
>{{ item.text }}
</view>
</view>
<view class="content device" :style="{ minHeight: 'calc(100vh - ' + navHeight + 'px)' }">
<view v-show="navMenuActive == 0">
<!-- <uni-card
:title="item.equipmentName"
:sub-title="'创建时间' + item.createTime"
:extra="item.mac"
v-for="item in store.data"
:key="item.equipmentId"
@click="goDevice(item)"
padding="0"
:thumbnail="deviceIcon(item.runStatus)"
>
</uni-card> -->
<Cn-device-card v-for="(item, index) in store.data" :device="item" :key="index">
</Cn-device-card>
<Cn-empty v-if="store.empty"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
<!-- <view style="padding: 0 20rpx" v-show="navMenuActive == 1">-->
<!-- <uni-list>-->
<!-- <uni-list-item-->
<!-- title="张三"-->
<!-- note="2023-02-10 14:55"-->
<!-- thumb="/static/head.png"-->
<!-- thumb-size="lg"-->
<!-- >-->
<!-- </uni-list-item>-->
<!-- <uni-list-item-->
<!-- title="李四"-->
<!-- note="2023-02-10 14:55"-->
<!-- thumb="/static/head.png"-->
<!-- thumb-size="lg"-->
<!-- >-->
<!-- </uni-list-item>-->
<!-- </uni-list>-->
<!-- </view>-->
<view style="padding: 0 20rpx" v-show="navMenuActive == 1">
<!-- <image
class="gplot gplot-box"
mode="aspectFill"
:src="item.filePath"
v-for="(item, key) in topologyDiagramPage"
:key="key"
/> -->
<uni-file-picker
ref="filePicker"
v-model="topologyDiagramPage"
:sourceType="['album']"
:auto-upload="false"
@select="addAppTopologyDiagram"
@delete="deleteTopologyDiagramPage"
readonly
></uni-file-picker>
</view>
</view>
<uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
v-if="content.length"
/>
<uni-popup ref="share" type="share" background-color="#fff">
<uni-popup-share title="分享到"></uni-popup-share>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import list from '../../common/js/list'
import {
queryTopologyDiagramPage,
deleteAppTopologyDiagram,
addAppTopologyDiagram,
deleteProject,
} from '../../common/api/project'
export default {
mixins: [list],
data() {
return {
loading: false,
project: {},
navMenuList: [
{
text: '设备',
},
// {
// text: '用户',
// },
{
text: '拓扑图',
},
],
content: [],
navHeight: 0,
navMenuActive: 0,
topologyDiagramPage: [],
}
},
methods: {
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device.png'
break
default:
str = '/static/device.png'
break
}
return str
},
addAppTopologyDiagram(e) {
console.log(e)
addAppTopologyDiagram(
{
projectId: this.project.id,
topologyDiagramName: e.tempFiles[0].name,
},
e.tempFiles[0].path,
).then((res) => {
console.log(res)
if (res.length > 1) {
const result = JSON.parse(res[1].data)
console.log(result)
if (result.code === 'A0000') {
this.topologyDiagramPage.push({
name: result.name,
extname: 'img',
url: result.filePath,
...result,
})
} else {
this.$refs.filePicker.clearFiles(this.topologyDiagramPage.length - 1)
uni.showToast({
title: result.message,
icon: 'none',
})
}
} else {
uni.showToast({
title: '上传失败',
icon: 'none',
})
this.$refs.filePicker.clearFiles(this.topologyDiagramPage.length - 1)
}
})
},
deleteTopologyDiagramPage(e) {
console.log(e)
deleteAppTopologyDiagram(e.tempFile.id).then((res) => {
console.log(res)
})
},
trigger(e) {
console.log(this.$refs)
if (e.item.text == '移交') {
uni.navigateTo({
url: '/pages/project/transfer',
})
} else if (e.item.text == '分享') {
this.$refs.share.open()
} else if (e.item.text == '编辑') {
uni.navigateTo({
url: '/pages/project/new?project=' + encodeURIComponent(JSON.stringify(this.project)),
})
} else if (e.item.text == '删除') {
uni.showModal({
title: '提示',
content: '删除项目后不可恢复,是否继续?',
success: (res) => {
if (res.confirm) {
deleteProject(this.project.id).then((res) => {
this.$util.toast('删除成功')
this.$util.refreshPrePage()
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
}
},
navMenuClick(index) {
this.navMenuActive = index
},
goUserDetail() {
uni.navigateTo({
url: '/pages/mine/userDetail',
})
},
del() {
console.log('del')
uni.showModal({
title: '提示',
content: '确定要移除该成员吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
},
goDevice(item) {
uni.navigateTo({
url: '/pages/device/APF/detail?id=' + item.equipmentId,
})
},
init() {
this.store = this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
this.store.params.projectId = this.project.id
this.store.reload()
queryTopologyDiagramPage({
projectId: this.project.id,
}).then((res) => {
console.log(res)
this.topologyDiagramPage = res.data.records.map((item) => {
return {
name: item.name,
extname: 'img',
url: this.$config.static + item.filePath,
...item,
}
})
})
},
},
onLoad(option) {
let userInfo = uni.getStorageSync('userInfo')
// this.content.push({
// iconPath: '/static/share.png',
// text: '编辑',
// })
// this.content.push({
// iconPath: '/static/delate.png',
// text: '删除',
// })
// this.content.push({
// iconPath: '/static/transfer.png',
// text: '移交',
// })
// this.content.push({
// iconPath: '/static/share.png',
// text: '分享',
// })
if (userInfo.authorities == 'engineering_user' || userInfo.authorities == 'app_vip_user') {
this.content.push(
{
iconPath: '/static/share.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
console.log(option.project)
this.project = JSON.parse(decodeURIComponent(option.project))
this.project.topologyDiagramPaths.forEach((item) => {
item.filePath = this.$config.static + item.filePath
})
this.init()
// uni.setNavigationBarTitle({ title: this.project })
},
}
</script>
<style lang="scss">
.detail {
.content {
box-sizing: border-box;
padding-bottom: 20rpx;
}
.header {
padding: 20rpx 20rpx 0;
.header-title {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 40rpx;
margin-bottom: 10rpx;
.header-title-extra {
font-size: 24rpx;
color: #666;
padding-right: 10rpx;
}
}
.header-des {
font-size: 28rpx;
color: #666;
}
}
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
/deep/ .is-add {
background-color: #fff;
}
}
.gplot {
box-sizing: border-box;
position: relative;
width: 100%;
border: 8rpx solid #ccc;
}
</style>
<template>
<Cn-page :loading="loading" noPadding>
<view slot="body">
<view class="detail">
<view class="header">
<view class="header-title"
>{{ project.name }}
<!-- <view class="header-title-extra">用能</view> -->
</view>
<view class="header-des">项目描述{{ project.description }}</view>
</view>
<view class="nav">
<view
class="nav-menu"
:class="{ 'nav-menu-active': navMenuActive == index }"
v-for="(item, index) in navMenuList"
:key="index"
@click="navMenuClick(index)"
>{{ item.text }}
</view>
</view>
<view class="content device" :style="{ minHeight: 'calc(100vh - ' + navHeight + 'px)' }">
<view v-show="navMenuActive == 0">
<!-- <uni-card
:title="item.equipmentName"
:sub-title="'创建时间' + item.createTime"
:extra="item.mac"
v-for="item in store.data"
:key="item.equipmentId"
@click="goDevice(item)"
padding="0"
:thumbnail="deviceIcon(item.runStatus)"
>
</uni-card> -->
<Cn-device-card v-for="(item, index) in store.data" :device="item" :key="index">
<template v-slot:title>
<view class="star-icon">
<uni-icons type="search" size="25" color="#376cf3"></uni-icons>
</view>
</template>
</Cn-device-card>
<Cn-empty v-if="store.empty"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
<view style="padding: 0 20rpx" v-show="navMenuActive == 1">
<!-- <image
class="gplot gplot-box"
mode="aspectFill"
:src="item.filePath"
v-for="(item, key) in topologyDiagramPage"
:key="key"
/> -->
<uni-file-picker
ref="filePicker"
v-model="topologyDiagramPage"
:sourceType="['album']"
:auto-upload="false"
@select="addAppTopologyDiagram"
@delete="deleteTopologyDiagramPage"
readonly
></uni-file-picker>
</view>
</view>
<uni-fab
ref="fab"
direction="vertical"
horizontal="right"
vertical="bottom"
:content="content"
@trigger="trigger"
v-if="content.length"
/>
<uni-popup ref="share" type="share" background-color="#fff">
<uni-popup-share title="分享到"></uni-popup-share>
</uni-popup>
</view>
</view>
</Cn-page>
</template>
<script>
import list from '../../common/js/list'
import {
queryTopologyDiagramPage,
deleteAppTopologyDiagram,
addAppTopologyDiagram,
deleteProject,
} from '../../common/api/project'
export default {
mixins: [list],
data() {
return {
loading: false,
project: {},
navMenuList: [
{
text: '设备',
},
// {
// text: '用户',
// },
{
text: '拓扑图',
},
],
content: [],
navHeight: 0,
navMenuActive: 0,
topologyDiagramPage: [],
}
},
methods: {
deviceIcon(e) {
let str = ''
switch (e) {
case 1:
str = '/static/device_bad.png'
break
case 2:
str = '/static/device.png'
break
default:
str = '/static/device.png'
break
}
return str
},
addAppTopologyDiagram(e) {
console.log(e)
addAppTopologyDiagram(
{
projectId: this.project.id,
topologyDiagramName: e.tempFiles[0].name,
},
e.tempFiles[0].path,
).then((res) => {
console.log(res)
if (res.length > 1) {
const result = JSON.parse(res[1].data)
console.log(result)
if (result.code === 'A0000') {
this.topologyDiagramPage.push({
name: result.name,
extname: 'img',
url: result.filePath,
...result,
})
} else {
this.$refs.filePicker.clearFiles(this.topologyDiagramPage.length - 1)
uni.showToast({
title: result.message,
icon: 'none',
})
}
} else {
uni.showToast({
title: '上传失败',
icon: 'none',
})
this.$refs.filePicker.clearFiles(this.topologyDiagramPage.length - 1)
}
})
},
deleteTopologyDiagramPage(e) {
console.log(e)
deleteAppTopologyDiagram(e.tempFile.id).then((res) => {
console.log(res)
})
},
trigger(e) {
console.log(this.$refs)
if (e.item.text == '移交') {
uni.navigateTo({
url: '/pages/project/transfer',
})
} else if (e.item.text == '分享') {
this.$refs.share.open()
} else if (e.item.text == '编辑') {
uni.navigateTo({
url: '/pages/project/new?project=' + encodeURIComponent(JSON.stringify(this.project)),
})
} else if (e.item.text == '删除') {
uni.showModal({
title: '提示',
content: '删除项目后不可恢复,是否继续?',
success: (res) => {
if (res.confirm) {
deleteProject(this.project.id).then((res) => {
this.$util.toast('删除成功')
this.$util.refreshPrePage()
})
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
}
},
navMenuClick(index) {
this.navMenuActive = index
},
goUserDetail() {
uni.navigateTo({
url: '/pages/mine/userDetail',
})
},
del() {
console.log('del')
uni.showModal({
title: '提示',
content: '确定要移除该成员吗?',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
},
})
},
goDevice(item) {
uni.navigateTo({
url: '/pages/device/APF/detail?id=' + item.equipmentId,
})
},
init() {
this.store = this.DataSource('/cs-device-boot/EquipmentDelivery/queryEquipmentByProject')
this.store.params.projectId = this.project.id
this.store.reload()
queryTopologyDiagramPage({
projectId: this.project.id,
}).then((res) => {
console.log(res)
this.topologyDiagramPage = res.data.records.map((item) => {
return {
name: item.name,
extname: 'img',
url: this.$config.static + item.filePath,
...item,
}
})
})
},
},
onLoad(option) {
let userInfo = uni.getStorageSync('userInfo')
// this.content.push({
// iconPath: '/static/share.png',
// text: '编辑',
// })
// this.content.push({
// iconPath: '/static/delate.png',
// text: '删除',
// })
// this.content.push({
// iconPath: '/static/transfer.png',
// text: '移交',
// })
// this.content.push({
// iconPath: '/static/share.png',
// text: '分享',
// })
if (userInfo.authorities == 'engineering_user' || userInfo.authorities == 'app_vip_user') {
this.content.push(
{
iconPath: '/static/share.png',
text: '编辑',
},
{
iconPath: '/static/delate.png',
text: '删除',
},
)
}
setTimeout(() => {
// 获取nav高度
uni.createSelectorQuery()
.select('.nav')
.boundingClientRect((rect) => {
this.navHeight = rect.height
})
.exec()
}, 1000)
console.log(option.project)
this.project = JSON.parse(decodeURIComponent(option.project))
this.project.topologyDiagramPaths.forEach((item) => {
item.filePath = this.$config.static + item.filePath
})
this.init()
// uni.setNavigationBarTitle({ title: this.project })
},
}
</script>
<style lang="scss">
.detail {
.content {
box-sizing: border-box;
padding-bottom: 20rpx;
}
.header {
padding: 20rpx 20rpx 0;
.header-title {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 40rpx;
margin-bottom: 10rpx;
.header-title-extra {
font-size: 24rpx;
color: #666;
padding-right: 10rpx;
}
}
.header-des {
font-size: 28rpx;
color: #666;
}
}
.footer-btn {
padding: 0 20rpx;
height: 50rpx;
background-color: #007aff;
font-size: 24rpx;
color: #fff;
text-align: center;
line-height: 50rpx;
border-radius: 10rpx;
}
/deep/ .is-add {
background-color: #fff;
}
}
.gplot {
box-sizing: border-box;
position: relative;
width: 100%;
border: 8rpx solid #ccc;
}
</style>

View File

@@ -1,183 +1,167 @@
<template>
<view :loading="loading">
<!-- <uni-nav-bar left-icon="left" right-icon="cart" title="标题" /> -->
<uni-nav-bar
dark
:fixed="true"
status-bar
left-icon="left"
:rightIcon="
userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'
? 'plusempty'
: ''
"
background-color="#fff"
color="#111"
title="项目管理"
@clickLeft="back"
@clickRight="add"
/>
<uni-search-bar
v-model="store.params.searchValue"
clearButton="none"
bgColor="#fff"
placeholder="请输入关键词"
@input="store.search()"
></uni-search-bar>
<view class="message">
<uni-card
:title="item.name"
@click="jump(item)"
extra="🔍"
v-for="(item, index) in store.data"
:key="index"
:style="{ marginTop: index === 0 ? '0' : '' }"
>
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>设备个数</view>
<view>{{ item.devNum }}</view>
</view>
<view class="term-list-bottom-item">
<view>所属工程</view>
<view>{{ item.engineeringName }}</view>
</view>
</view>
</uni-card>
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
<uni-load-more
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"
></uni-load-more>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
export default {
mixins: [list],
data() {
return {
loading: false,
userInfo: {},
}
},
methods: {
init(engineeringId) {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.store = this.DataSource('/cs-device-boot/project/queryProject')
this.store.params.searchValue = ''
this.store.params.engineeringId = engineeringId || ''
this.store.reload()
},
back() {
uni.navigateBack()
},
add() {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
if (!uni.getStorageSync('engineering')) {
return uni.showToast({
title: '请先创建一个工程',
icon: 'none',
})
}
uni.navigateTo({
url: `/pages/project/new`,
})
}
},
upgrade(code) {
console.log(code)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(project) {
console.log(project)
uni.navigateTo({
url: `/pages/project/detail?project=${encodeURIComponent(JSON.stringify(project))}`,
})
},
},
onLoad({ engineeringId }) {
this.init(engineeringId)
},
}
</script>
<style lang="scss">
.message {
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
</style>
<template>
<view :loading="loading">
<!-- <uni-nav-bar left-icon="left" right-icon="cart" title="标题" /> -->
<uni-nav-bar dark :fixed="true" status-bar left-icon="left" :rightIcon="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'
? 'plusempty'
: ''
" background-color="#fff" color="#111" title="项目管理" @clickLeft="back" @clickRight="add" />
<uni-search-bar v-model="store.params.searchValue" clearButton="none" bgColor="#fff" placeholder="请输入关键词"
@input="store.search()"></uni-search-bar>
<view class="message">
<!-- extra="🔍" -->
<uni-card class="boxClick" :title="item.name" @click="jump(item)"
v-for="(item, index) in store.data" :key="index" :style="{ marginTop: index === 0 ? '0' : '' }">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>设备个数</view>
<view>{{ item.devNum }}</view>
</view>
<view class="term-list-bottom-item">
<view>所属工程</view>
<view>{{ item.engineeringName }}</view>
</view>
</view>
</uni-card>
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
<uni-load-more v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
:status="store.status"></uni-load-more>
</view>
</view>
</template>
<script>
import list from '../../common/js/list'
export default {
mixins: [list],
data() {
return {
loading: false,
userInfo: {},
}
},
methods: {
init(engineeringId) {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
this.store = this.DataSource('/cs-device-boot/project/queryProject')
this.store.params.searchValue = ''
this.store.params.engineeringId = engineeringId || ''
this.store.reload()
},
back() {
uni.navigateBack()
},
add() {
if (this.userInfo.authorities === 'app_vip_user' || this.userInfo.authorities === 'engineering_user') {
if (!uni.getStorageSync('engineering')) {
return uni.showToast({
title: '请先创建一个工程',
icon: 'none',
})
}
uni.navigateTo({
url: `/pages/project/new`,
})
}
},
upgrade(code) {
console.log(code)
uni.showToast({
title: '升级成功',
icon: 'none',
})
},
jump(project) {
console.log(project)
uni.navigateTo({
url: `/pages/project/detail?project=${encodeURIComponent(JSON.stringify(project))}`,
})
},
},
onLoad({ engineeringId }) {
this.init(engineeringId)
},
}
</script>
<style lang="scss">
.message {
.message-header {
padding: 200rpx 34rpx 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 8rpx #e7e7e74c;
.message-header-head {
margin-right: 30rpx;
height: 128rpx;
width: 128rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
.message-header-name {
margin-right: 30rpx;
flex: 1;
font-size: 36rpx;
color: #111;
font-weight: 700;
.tag {
margin-top: 10rpx;
font-size: 24rpx;
color: #aaa;
}
}
}
.message-nav {
padding: 34rpx;
display: flex;
align-items: center;
background: $uni-theme-white;
border-bottom: 1rpx solid #e8e8e8;
&-icon {
margin-right: 30rpx;
height: 44rpx;
width: 44rpx;
border-radius: $uni-theme-radius;
overflow: hidden;
}
&-label {
margin-right: 30rpx;
flex: 1;
font-size: 28rpx;
color: #111;
}
}
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
// margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
/deep/ .uni-card__content {
padding: 5px 10px 10px !important;
}
/deep/ .uni-card__header-content-title {
font-weight: 700;
}
</style>

View File

@@ -1,249 +1,250 @@
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="index">
<template v-if="step == 1">
<uni-forms ref="form" :rules="rules" :modelValue="formData">
<uni-forms-item name="phone">
<uni-easyinput
disabled
type="text"
maxlength="11"
v-model="formData.phoneShow"
placeholder="请输入手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="text" v-model="formData.code" placeholder="请输入验证码" maxlength="6" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode(5)" size="mini">
获取验证码
</button>
</view>
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="firstSubmit">下一步</button>
</template>
<template v-else>
<uni-forms ref="form" :rules="rules" :modelValue="formData">
<uni-forms-item name="phone">
<uni-easyinput
maxlength="11"
type="number"
v-model="formData.phone2"
placeholder="请输入新手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="text" v-model="formData.code2" placeholder="请输入验证码" maxlength="6" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode(4)" size="mini">
获取验证码
</button>
</view>
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="secondSubmit">提交</button>
</template>
</view>
</view>
</Cn-page>
</template>
<script>
import { apiGetYms, apiComfirmCode, apiRebindPhone } from '@/common/api/user'
export default {
name: 'jiaban',
data() {
return {
step: 1,
loading: false,
waitTime: 0,
// 表单数据
formData: {
phone: '',
phoneShow: '',
code: '',
phone2: '',
code2: '',
},
rules: {
phone: {
rules: [
{
required: true,
errorMessage: '请填写手机号',
},
],
},
code: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
phone2: {
rules: [
{
required: true,
errorMessage: '请填写新手机号',
},
],
},
code2: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
},
}
},
onLoad() {
this.init()
},
methods: {
getCode(type) {
if (!this.formData.phone) {
return this.$util.toast('请输入手机号!')
}
uni.showLoading({
title: '请稍等',
})
apiGetYms({
phone: type == 5 ? this.formData.phone : this.formData.phone2,
type,
})
.then((res) => {
uni.hideLoading()
console.log(res)
this.waitTime = 60
this.inter = setInterval(() => {
if (this.waitTime == 0) {
clearInterval(this.inter)
} else {
this.waitTime--
}
}, 1000)
})
.catch((err) => {
uni.hideLoading()
console.log(err)
})
},
init() {
// 手机号中间四位隐藏
this.formData.phone = uni.getStorageSync('userInfo').user_name
this.formData.phoneShow = this.formData.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
},
firstSubmit() {
apiComfirmCode({
phone: this.formData.phone,
code: this.formData.code,
})
.then((res) => {
this.step = 2
clearInterval(this.inter)
this.waitTime = 0
})
.catch((err) => {
console.log(err)
})
},
secondSubmit() {
apiRebindPhone({
phone: this.formData.phone2,
code: this.formData.code2,
})
.then((res) => {
this.$util.toast('绑定成功')
uni.clearStorageSync()
setTimeout(() => {
uni.redirectTo({
url: '/pages/user/login',
})
}, 1500)
})
.catch((err) => {
console.log(err)
})
},
},
}
</script>
<style lang="scss">
.index {
padding: 20rpx;
.submit-btn {
background: $uni-theme-color;
color: #fff;
}
.login-box-tips {
margin-top: 60rpx;
display: flex;
justify-content: center;
font-size: 20rpx;
}
.login-box-input {
display: flex;
align-items: center;
border-bottom: 1rpx solid #f0f0f0;
.login-box-input-icon {
width: 40rpx;
margin-right: 40rpx;
}
.login-box-input-main {
font-size: 28rpx;
flex: 1;
height: 100rpx;
line-height: 100rpx;
}
.login-box-input-btn {
padding:0 40rpx;
margin-left: 40rpx;
background: $uni-theme-color;
color: #fff;
}
.login-box-input-img {
margin-left: 40rpx;
background: skyblue;
height: 80rpx;
width: 200rpx;
}
}
}
</style>
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="index">
<template v-if="step == 1">
<uni-forms ref="form" :rules="rules" :modelValue="formData">
<uni-forms-item name="phone">
<uni-easyinput
disabled
type="text"
maxlength="11"
v-model="formData.phoneShow"
placeholder="请输入手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="text" v-model="formData.code" placeholder="请输入验证码" maxlength="6" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode(5)" size="mini">
获取验证码
</button>
</view>
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="firstSubmit">下一步</button>
</template>
<template v-else>
<uni-forms ref="form" :rules="rules" :modelValue="formData">
<uni-forms-item name="phone">
<uni-easyinput
maxlength="11"
type="number"
v-model="formData.phone2"
placeholder="请输入新手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="text" v-model="formData.code2" placeholder="请输入验证码" maxlength="6" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode(4)" size="mini">
获取验证码
</button>
</view>
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="secondSubmit">提交</button>
</template>
</view>
</view>
</Cn-page>
</template>
<script>
import { apiGetYms, apiComfirmCode, apiRebindPhone } from '@/common/api/user'
export default {
name: 'jiaban',
data() {
return {
step: 1,
loading: false,
waitTime: 0,
// 表单数据
formData: {
phone: '',
phoneShow: '',
code: '',
phone2: '',
code2: '',
},
rules: {
phone: {
rules: [
{
required: true,
errorMessage: '请填写手机号',
},
],
},
code: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
phone2: {
rules: [
{
required: true,
errorMessage: '请填写新手机号',
},
],
},
code2: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
},
}
},
onLoad() {
this.init()
},
methods: {
getCode(type) {
if (!this.formData.phone) {
return this.$util.toast('请输入手机号!')
}
uni.showLoading({
title: '请稍等...',
mask: true,
})
apiGetYms({
phone: type == 5 ? this.formData.phone : this.formData.phone2,
type,
})
.then((res) => {
uni.hideLoading()
console.log(res)
this.waitTime = 60
this.inter = setInterval(() => {
if (this.waitTime == 0) {
clearInterval(this.inter)
} else {
this.waitTime--
}
}, 1000)
})
.catch((err) => {
uni.hideLoading()
console.log(err)
})
},
init() {
// 手机号中间四位隐藏
this.formData.phone = uni.getStorageSync('userInfo').user_name
this.formData.phoneShow = this.formData.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
},
firstSubmit() {
apiComfirmCode({
phone: this.formData.phone,
code: this.formData.code,
})
.then((res) => {
this.step = 2
clearInterval(this.inter)
this.waitTime = 0
})
.catch((err) => {
console.log(err)
})
},
secondSubmit() {
apiRebindPhone({
phone: this.formData.phone2,
code: this.formData.code2,
})
.then((res) => {
this.$util.toast('绑定成功')
uni.clearStorageSync()
setTimeout(() => {
uni.redirectTo({
url: '/pages/user/login',
})
}, 1500)
})
.catch((err) => {
console.log(err)
})
},
},
}
</script>
<style lang="scss">
.index {
padding: 20rpx;
.submit-btn {
background: $uni-theme-color;
color: #fff;
}
.login-box-tips {
margin-top: 60rpx;
display: flex;
justify-content: center;
font-size: 20rpx;
}
.login-box-input {
display: flex;
align-items: center;
border-bottom: 1rpx solid #f0f0f0;
.login-box-input-icon {
width: 40rpx;
margin-right: 40rpx;
}
.login-box-input-main {
font-size: 28rpx;
flex: 1;
height: 100rpx;
line-height: 100rpx;
}
.login-box-input-btn {
padding:0 40rpx;
margin-left: 40rpx;
background: $uni-theme-color;
color: #fff;
}
.login-box-input-img {
margin-left: 40rpx;
background: skyblue;
height: 80rpx;
width: 200rpx;
}
}
}
</style>

View File

@@ -1,242 +1,243 @@
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="index">
<uni-forms ref="form" :modelValue="formData" :rules="rules">
<uni-forms-item name="phone">
<uni-easyinput
maxlength="11"
disabled
type="text"
v-model="formData.showPhone"
placeholder="请输入手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="number" v-model="formData.code" placeholder="请输入手机验证码" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode" size="mini">获取验证码</button>
</view>
</uni-forms-item>
<uni-forms-item name="password">
<uni-easyinput type="password" v-model="formData.password" placeholder="请输入新的登录密码" />
</uni-forms-item>
<uni-forms-item name="password2">
<uni-easyinput type="password" v-model="formData.password2" placeholder="请再次确认密码" />
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="submit">提交</button>
<view class="login-box-tips">
<view style="color: #999">说明密码需要长度为8-16</view>
</view>
</view>
</view>
</Cn-page>
</template>
<script>
import { apiGetYms, apiModifyPsd, gongkey } from '@/common/api/user'
import { sm2, encrypt } from '@/common/js/sm2.js'
import { sm3Digest } from '@/common/js/sm3.js'
export default {
name: 'ChangePWd',
data() {
return {
loading: false,
waitTime: 0,
// 表单数据
formData: {
showPhone: '',
phone: '',
code: '',
password: '',
password2: '',
},
rules: {
phone: {
rules: [
{
required: true,
errorMessage: '请填写手机号',
},
],
},
code: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
password: {
rules: [
{
required: true,
errorMessage: '请填写新密码',
},
],
},
password2: {
rules: [
{
required: true,
errorMessage: '请填写确认密码',
},
],
},
},
}
},
onLoad() {
// 手机号中间四位隐藏
this.formData.phone = uni.getStorageSync('userInfo').user_name
this.formData.showPhone = this.formData.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
},
methods: {
getCode() {
uni.showLoading({
title: '请稍等',
})
apiGetYms({
phone: this.formData.phone,
type: 2,
})
.then((res) => {
uni.hideLoading()
console.log(res)
this.waitTime = 60
this.inter = setInterval(() => {
if (this.waitTime == 0) {
clearInterval(this.inter)
} else {
this.waitTime--
}
}, 1000)
})
.catch((err) => {
uni.hideLoading()
console.log(err)
})
},
submit() {
this.$refs.form.validate((valid) => {
console.log(valid)
if (!valid) {
if (this.formData.password != this.formData.password2) {
uni.showToast({
title: '两次密码不一致',
icon: 'none',
})
} else {
// 密码需要长度为8-16
if (this.formData.password.length < 8 || this.formData.password.length > 16) {
uni.showToast({
title: '密码需要长度为8-16',
icon: 'none',
})
return
}
let loginName = encrypt(this.formData.phone)
gongkey({ loginName }).then((response) => {
let publicKey = response.data
let sm3Pwd = sm3Digest(this.formData.password)
let jiamipassword = sm2(sm3Pwd + '|' + this.formData.password, publicKey, 0)
// apiPwdLogin({
// username: loginName,
// password: jiamipassword,
// imageCode: '',
// grant_type: 'captcha',
// verifyCode: 0,
// }).then((res) => {
// this.$util.loginSuccess(res.data)
// })
apiModifyPsd({
phone: this.formData.phone,
code: this.formData.code,
password: jiamipassword,
})
.then((res) => {
console.log(res)
uni.showToast({
title: '修改成功',
icon: 'none',
})
setTimeout(() => {
uni.navigateBack({
delta: 1,
})
}, 1000)
})
.catch((err) => {
console.log(err)
})
})
}
}
})
},
},
}
</script>
<style lang="scss">
.index {
padding: 20rpx;
.submit-btn {
background: $uni-theme-color;
color: #fff;
}
.login-box-tips {
margin-top: 60rpx;
display: flex;
justify-content: center;
font-size: 20rpx;
}
.login-box-input {
display: flex;
align-items: center;
border-bottom: 1rpx solid #f0f0f0;
.login-box-input-icon {
width: 40rpx;
margin-right: 40rpx;
}
.login-box-input-main {
font-size: 28rpx;
flex: 1;
height: 100rpx;
line-height: 100rpx;
}
.login-box-input-btn {
padding:0 40rpx;
margin-left: 40rpx;
background: $uni-theme-color;
color: #fff;
}
.login-box-input-img {
margin-left: 40rpx;
background: skyblue;
height: 80rpx;
width: 200rpx;
}
}
}
</style>
<template>
<Cn-page :loading="loading">
<view slot="body">
<view class="index">
<uni-forms ref="form" :modelValue="formData" :rules="rules">
<uni-forms-item name="phone">
<uni-easyinput
maxlength="11"
disabled
type="text"
v-model="formData.showPhone"
placeholder="请输入手机号"
/>
</uni-forms-item>
<uni-forms-item name="code">
<view class="login-box-input">
<uni-easyinput type="number" v-model="formData.code" placeholder="请输入手机验证码" />
<view
class="ml40"
style="
margin-left: 40rpx;
font-size: 28rpx;
color: #666;
width: 200rpx;
text-align: center;
"
v-if="waitTime > 0"
>{{ waitTime + 's后重新获取' }}</view
>
<button class="login-box-input-btn" v-else @click="getCode" size="mini">获取验证码</button>
</view>
</uni-forms-item>
<uni-forms-item name="password">
<uni-easyinput type="password" v-model="formData.password" placeholder="请输入新的登录密码" />
</uni-forms-item>
<uni-forms-item name="password2">
<uni-easyinput type="password" v-model="formData.password2" placeholder="请再次确认密码" />
</uni-forms-item>
</uni-forms>
<button type="default" class="submit-btn" @click="submit">提交</button>
<view class="login-box-tips">
<view style="color: #999">说明密码需要长度为8-16</view>
</view>
</view>
</view>
</Cn-page>
</template>
<script>
import { apiGetYms, apiModifyPsd, gongkey } from '@/common/api/user'
import { sm2, encrypt } from '@/common/js/sm2.js'
import { sm3Digest } from '@/common/js/sm3.js'
export default {
name: 'ChangePWd',
data() {
return {
loading: false,
waitTime: 0,
// 表单数据
formData: {
showPhone: '',
phone: '',
code: '',
password: '',
password2: '',
},
rules: {
phone: {
rules: [
{
required: true,
errorMessage: '请填写手机号',
},
],
},
code: {
rules: [
{
required: true,
errorMessage: '请填写验证码',
},
],
},
password: {
rules: [
{
required: true,
errorMessage: '请填写新密码',
},
],
},
password2: {
rules: [
{
required: true,
errorMessage: '请填写确认密码',
},
],
},
},
}
},
onLoad() {
// 手机号中间四位隐藏
this.formData.phone = uni.getStorageSync('userInfo').user_name
this.formData.showPhone = this.formData.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
},
methods: {
getCode() {
uni.showLoading({
title: '请稍等...',
mask: true,
})
apiGetYms({
phone: this.formData.phone,
type: 2,
})
.then((res) => {
uni.hideLoading()
console.log(res)
this.waitTime = 60
this.inter = setInterval(() => {
if (this.waitTime == 0) {
clearInterval(this.inter)
} else {
this.waitTime--
}
}, 1000)
})
.catch((err) => {
uni.hideLoading()
console.log(err)
})
},
submit() {
this.$refs.form.validate((valid) => {
console.log(valid)
if (!valid) {
if (this.formData.password != this.formData.password2) {
uni.showToast({
title: '两次密码不一致',
icon: 'none',
})
} else {
// 密码需要长度为8-16
if (this.formData.password.length < 8 || this.formData.password.length > 16) {
uni.showToast({
title: '密码需要长度为8-16',
icon: 'none',
})
return
}
let loginName = encrypt(this.formData.phone)
gongkey({ loginName }).then((response) => {
let publicKey = response.data
let sm3Pwd = sm3Digest(this.formData.password)
let jiamipassword = sm2(sm3Pwd + '|' + this.formData.password, publicKey, 0)
// apiPwdLogin({
// username: loginName,
// password: jiamipassword,
// imageCode: '',
// grant_type: 'captcha',
// verifyCode: 0,
// }).then((res) => {
// this.$util.loginSuccess(res.data)
// })
apiModifyPsd({
phone: this.formData.phone,
code: this.formData.code,
password: jiamipassword,
})
.then((res) => {
console.log(res)
uni.showToast({
title: '修改成功',
icon: 'none',
})
setTimeout(() => {
uni.navigateBack({
delta: 1,
})
}, 1000)
})
.catch((err) => {
console.log(err)
})
})
}
}
})
},
},
}
</script>
<style lang="scss">
.index {
padding: 20rpx;
.submit-btn {
background: $uni-theme-color;
color: #fff;
}
.login-box-tips {
margin-top: 60rpx;
display: flex;
justify-content: center;
font-size: 20rpx;
}
.login-box-input {
display: flex;
align-items: center;
border-bottom: 1rpx solid #f0f0f0;
.login-box-input-icon {
width: 40rpx;
margin-right: 40rpx;
}
.login-box-input-main {
font-size: 28rpx;
flex: 1;
height: 100rpx;
line-height: 100rpx;
}
.login-box-input-btn {
padding: 0 40rpx;
margin-left: 40rpx;
background: $uni-theme-color;
color: #fff;
}
.login-box-input-img {
margin-left: 40rpx;
background: skyblue;
height: 80rpx;
width: 200rpx;
}
}
}
</style>

View File

@@ -114,7 +114,8 @@ export default {
return this.$util.toast('请输入手机号!')
}
uni.showLoading({
title: '请稍等',
title: '请稍等...',
mask: true,
})
apiGetYms({
phone: this.formData.phone,

View File

@@ -1,147 +1,148 @@
<template>
<view>
<Cn-page :loading="loading">
<view slot="body">
<view class="head">
<image class="head-img" :src="userInfo.avatar" v-if="userInfo.avatar"></image>
<image class="head-img" src="/static/head.png" v-else></image>
<view class="head-setup">
<view class="head-setup-item" @click="take('album')">从相册选一张</view>
<view class="head-setup-item" @click="take('camera')">拍一张照片</view>
</view>
</view>
</view>
</Cn-page>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog
style="width: 90%; margin: 5%"
cancelText="禁止"
confirmText="允许"
title="权限说明"
content='是否允许"灿能物联"使用相机?'
@confirm="handleScon('camera')"
@close="dialogClose"
></uni-popup-dialog>
</uni-popup>
<uni-popup ref="message" type="message">
<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
<view style="color: #6c6c6c; margin-top: 3rpx"> 用于拍照上传头像!</view>
</uni-popup-message>
</uni-popup>
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
<yk-authpup
ref="authpup1"
type="top"
@changeAuth="changeAuth"
permissionID="WRITE_EXTERNAL_STORAGE"
></yk-authpup>
</view>
</template>
<script>
import { uploadImage, getImageUrl } from '@/common/api/basic'
import { apiUpdateUser } from '@/common/api/user'
import ykAuthpup from '@/components/yk-authpup/yk-authpup'
export default {
components: {
ykAuthpup,
},
data() {
return {
loading: false,
userInfo: {},
type: '',
}
},
methods: {
take(type) {
this.type = type
if (type == 'camera') {
if (plus.os.name == 'Android') {
this.$refs['authpup'].open()
//未授权
// this.$refs.message.open()
// this.$refs.alertDialog.open('bottom')
} else {
this.handleScon(type)
}
} else {
if (plus.os.name == 'Android') {
this.$refs['authpup1'].open()
//未授权
// this.$refs.message.open()
// this.$refs.alertDialog.open('bottom')
} else {
this.handleScon(type)
}
// this.handleScon(type)、
}
},
changeAuth() {
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了')
// this.handleScon()
this.handleScon(this.type)
},
handleScon(type) {
this.$refs.message.close()
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: [type],
success: (res) => {
uploadImage(res.tempFilePaths[0]).then((res) => {
console.log(res)
let result = JSON.parse(res[1].data)
apiUpdateUser({
headSculpture: result.data.minFileUrl,
}).then((res) => {
console.log(res)
this.userInfo.headSculpture = result.data.minFileUrl
this.userInfo.avatar = this.$config.static + result.data.minFileUrl
uni.setStorageSync(this.$cacheKey.userInfo, this.userInfo)
this.$forceUpdate()
})
})
},
})
},
dialogClose() {
this.$refs.message.close()
},
},
onLoad(options) {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
}
</script>
<style lang="scss">
.head {
.head-img {
height: 750rpx;
width: 750rpx;
}
.head-setup {
position: fixed;
bottom: 0;
left: 0;
width: 750rpx;
padding-bottom: 60rpx;
background-color: #fff;
.head-setup-item {
height: 100rpx;
line-height: 100rpx;
text-align: center;
border-top: 1rpx solid #e8e8e8;
}
}
}
/deep/ .uni-popup-message__box {
border-radius: 10rpx !important;
background-color: #fff;
}
</style>
<template>
<view>
<Cn-page :loading="loading">
<view slot="body">
<view class="head">
<image class="head-img" :src="userInfo.avatar" v-if="userInfo.avatar"></image>
<image class="head-img" src="/static/head.png" v-else></image>
<view class="head-setup">
<view class="head-setup-item" @click="take('album')">从相册选一张</view>
<view class="head-setup-item" @click="take('camera')">拍一张照片</view>
</view>
</view>
</view>
</Cn-page>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog
style="width: 90%; margin: 5%"
cancelText="禁止"
confirmText="允许"
title="权限说明"
content='是否允许"灿能物联"使用相机?'
@confirm="handleScon('camera')"
@close="dialogClose"
></uni-popup-dialog>
</uni-popup>
<uni-popup ref="message" type="message">
<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
<view style="color: #6c6c6c; margin-top: 3rpx"> 用于拍照上传头像!</view>
</uni-popup-message>
</uni-popup>
<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>
<yk-authpup
ref="authpup1"
type="top"
@changeAuth="changeAuth"
permissionID="WRITE_EXTERNAL_STORAGE"
></yk-authpup>
</view>
</template>
<script>
import { uploadImage, getImageUrl } from '@/common/api/basic'
import { apiUpdateUser } from '@/common/api/user'
import ykAuthpup from '@/components/yk-authpup/yk-authpup'
export default {
components: {
ykAuthpup,
},
data() {
return {
loading: false,
userInfo: {},
type: '',
}
},
methods: {
take(type) {
this.type = type
if (type == 'camera') {
if (plus.os.name == 'Android') {
this.$refs['authpup'].open()
//未授权
// this.$refs.message.open()
// this.$refs.alertDialog.open('bottom')
} else {
this.handleScon(type)
}
} else {
if (plus.os.name == 'Android') {
this.$refs['authpup1'].open()
//未授权
// this.$refs.message.open()
// this.$refs.alertDialog.open('bottom')
} else {
this.handleScon(type)
}
// this.handleScon(type)、
}
},
changeAuth() {
//这里是权限通过后执行自己的代码逻辑
console.log('权限已授权,可执行自己的代码逻辑了')
// this.handleScon()
this.handleScon(this.type)
},
handleScon(type) {
this.$refs.message.close()
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: [type],
success: (res) => {
uploadImage(res.tempFilePaths[0]).then((res) => {
console.log(res)
console.log("🚀 ~ res:", res)
let result = JSON.parse(res[1].data)
apiUpdateUser({
headSculpture: result.data.minFileUrl,
}).then((res) => {
console.log(res)
this.userInfo.headSculpture = result.data.minFileUrl
this.userInfo.avatar = this.$config.static + result.data.minFileUrl
uni.setStorageSync(this.$cacheKey.userInfo, this.userInfo)
this.$forceUpdate()
})
})
},
})
},
dialogClose() {
this.$refs.message.close()
},
},
onLoad(options) {
this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
},
}
</script>
<style lang="scss">
.head {
.head-img {
height: 750rpx;
width: 750rpx;
}
.head-setup {
position: fixed;
bottom: 0;
left: 0;
width: 750rpx;
padding-bottom: 60rpx;
background-color: #fff;
.head-setup-item {
height: 100rpx;
line-height: 100rpx;
text-align: center;
border-top: 1rpx solid #e8e8e8;
}
}
}
/deep/ .uni-popup-message__box {
border-radius: 10rpx !important;
background-color: #fff;
}
</style>

View File

@@ -93,7 +93,7 @@ import { sm3Digest } from '@/common/js/sm3.js'
export default {
data() {
return {
checkbox: false,
checkbox: true,
loading: false,
loginType: 'pwd',
phone: '',
@@ -121,7 +121,8 @@ export default {
return this.$util.toast('请输入手机号!')
}
uni.showLoading({
title: '请稍等',
title: '请稍等...',
mask: true,
})
apiGetYms({
phone: this.phone,

View File

@@ -77,7 +77,7 @@ export default {
name: 'jiaban',
data() {
return {
checkbox: false,
checkbox: true,
step: 1,
loading: false,
waitTime: 0,
@@ -135,7 +135,8 @@ export default {
return this.$util.toast('请输入手机号!')
}
uni.showLoading({
title: '请稍等',
title: '请稍等...',
mask: true,
})
apiGetYms({
phone: this.formData.phone,

View File

@@ -1,57 +1,57 @@
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='index'>
<view class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceList" :key="index" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false,
deviceList: [
{
name: '设备APF-1',
des: '设备描述1',
type: '监测',
project: 'XXX项目1',
},
{
name: '设备APF-2',
des: '设备描述1',
type: '监测',
project: 'XXX项目1',
},
{
name: '设备APF-3',
des: '设备描述2',
type: '用能',
project: 'XXX项目2'
},
{
name: '设备DVR-1',
des: '设备描述3',
type: '监测',
project: 'XXX项目3'
}
]
}
},
methods: {
}
}
</script>
<style lang='scss'>
.index {
padding: 20rpx 0;
}
</style>
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='index'>
<view class="content device" :style="{ minHeight: minHeight }">
<uni-card :title="item.name" :sub-title="item.project" :extra="item.type" padding="0"
v-for="(item, index) in deviceList" :key="index" thumbnail="/static/device.png">
<!-- <text>{{ item.project }} {{ item.type }}</text> -->
</uni-card>
<!-- <uni-load-more status="nomore"></uni-load-more> -->
</view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false,
deviceList: [
{
name: '设备APF-1',
des: '设备描述1',
type: '监测',
project: 'XXX项目1',
},
{
name: '设备APF-2',
des: '设备描述1',
type: '监测',
project: 'XXX项目1',
},
{
name: '设备APF-3',
des: '设备描述2',
type: '用能',
project: 'XXX项目2'
},
{
name: '设备DVR-1',
des: '设备描述3',
type: '监测',
project: 'XXX项目3'
}
]
}
},
methods: {
}
}
</script>
<style lang='scss'>
.index {
padding: 20rpx 0;
}
</style>

826
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

111
readme.md Normal file
View File

@@ -0,0 +1,111 @@
# 字母索引列表组件 (yxt-letterIndex)
用于uni-app项目的字母索引列表组件支持按拼音首字母分组展示数据右侧字母快速导航适用于通讯录、学员列表等场景。
## 功能特点
- 支持按拼音首字母自动分组展示数据
- 右侧快速字母导航,点击可快速滚动到对应区域
- 滚动时自动高亮当前字母位置
- 支持签到状态显示和补签操作
- 空数据状态优化展示
- 适配小程序环境
## 安装方式
在uni-app项目中通过uni_modules直接导入使用。
## 使用示例
```vue
<template>
<view class="container">
<yxt-letterIndex
:items="studentList"
name-key="name"
:show-letter-title="true"
current-status="pending"
@help-sign="handleHelpSign"
@letter-click="handleLetterClick"
@scroll-position-change="handleScrollPositionChange"
/>
</view>
</template>
<script>
export default {
data() {
return {
studentList: [
{ name: '张三', id: '1' },
{ name: '李四', id: '2' },
{ name: '王五', id: '3' },
{ name: '赵六', id: '4' },
// 更多数据...
]
};
},
methods: {
// 处理帮TA补签事件
handleHelpSign(item) {
console.log('帮TA补签:', item);
// 执行补签操作
},
// 处理字母点击事件
handleLetterClick(letter) {
console.log('点击字母:', letter);
},
// 处理滚动位置变化事件
handleScrollPositionChange(letter) {
console.log('当前滚动到字母:', letter);
}
}
};
</script>
<style scoped>
.container {
height: 100vh; /* 确保组件有足够的高度显示 */
}
</style>
```
## 属性说明
| 属性名 | 类型 | 默认值 | 必填 | 说明 |
| --- | --- | --- | --- | --- |
| items | Array | [] | 是 | 要展示的数据列表 |
| name-key | String | "name" | 否 | 用于获取姓名的字段名 |
| show-letter-title | Boolean | true | 否 | 是否显示字母标题 |
| current-status | String | "pending" | 否 | 当前状态pending表示未签到signed表示已签到 |
## 事件说明
| 事件名 | 说明 | 回调参数 |
| --- | --- | --- |
| help-sign | 点击帮TA补签按钮时触发 | item: 当前点击的项目对象 |
| letter-click | 点击右侧字母导航时触发 | letter: 点击的字母 |
| scroll-position-change | 滚动位置发生变化时触发 | letter: 当前滚动到的字母 |
## 依赖说明
- 需要引入拼音工具 `pinyinUtil.js` 用于获取汉字的拼音首字母
- 默认使用 `/static/icon-success.png``/static/img_no_content.png` 作为图标资源
## 注意事项
1. 组件需要一个固定高度的容器,建议设置为全屏或适当高度
2. 确保数据格式正确,包含姓名字段
3. 如需要自定义样式可通过覆盖CSS变量或使用深度选择器修改
4. 在小程序环境中使用时,请确保已配置相关的静态资源路径
## 兼容性
- 支持uni-app项目的Vue 2版本
- 支持微信小程序环境
## 更新日志
详情请查看 [changelog.md](./changelog.md)

BIN
static/background.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Some files were not shown because too many files have changed in this diff Show More