点位详情页面还原
This commit is contained in:
parent
fd4dc74849
commit
ed7e524b4c
20
src/App.vue
20
src/App.vue
@ -2,7 +2,7 @@
|
||||
* @Author: XHC
|
||||
* @Date: 2025-05-19 10:21:48
|
||||
* @LastEditors: XHC
|
||||
* @LastEditTime: 2025-06-06 17:37:54
|
||||
* @LastEditTime: 2025-06-09 16:31:54
|
||||
* @Description:
|
||||
-->
|
||||
<script>
|
||||
@ -137,10 +137,26 @@ export default {
|
||||
|
||||
// 点位卡片
|
||||
.info-card {
|
||||
padding: 30rpx 0;
|
||||
padding-bottom: 30rpx;
|
||||
margin: 0 30rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #fff;
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
// :deep(.uni-section) {
|
||||
// flex: 1;
|
||||
// margin-right: 20rpx;
|
||||
// .title {
|
||||
// font-size: 32rpx;
|
||||
// color: #0A61B9;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
.info-box {
|
||||
border: 10rpx solid #0A61B9;
|
||||
border-top: none;
|
||||
|
||||
@ -56,6 +56,12 @@
|
||||
"style": {
|
||||
"navigationBarTitleText": "巡检点位"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/pointsDetail/pointsDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "巡检点位详情"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* @Author: XHC
|
||||
* @Date: 2025-05-19 15:18:26
|
||||
* @LastEditors: XHC
|
||||
* @LastEditTime: 2025-06-05 17:18:03
|
||||
* @LastEditTime: 2025-06-09 17:25:08
|
||||
* @Description: 知识库
|
||||
-->
|
||||
<template>
|
||||
@ -179,6 +179,8 @@ const screening = () => {
|
||||
width: 100%;
|
||||
}
|
||||
.info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
213
src/pages/pointsDetail/pointsDetail.vue
Normal file
213
src/pages/pointsDetail/pointsDetail.vue
Normal file
@ -0,0 +1,213 @@
|
||||
<!--
|
||||
* @Author: XHC
|
||||
* @Date: 2025-06-09 16:05:15
|
||||
* @LastEditors: XHC
|
||||
* @LastEditTime: 2025-06-10 09:41:43
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="pointsDetail">
|
||||
<view class="info-card">
|
||||
<view class="title">
|
||||
<uni-section :title="infoData.pointName" type="line"></uni-section>
|
||||
<uni-tag :inverted="true" :text="infoData.delFlag == 0 ? '正常' : '异常'" :type="infoData.delFlag == '0' ? 'success' : 'warning'" />
|
||||
</view>
|
||||
<view class="info-box">
|
||||
<view class="info-item">
|
||||
<view><text class="grey">设备编码：</text>{{ infoData.pointNumber }}</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view><text class="grey">巡检时间：</text>{{ infoData.modifyTime }}</view>
|
||||
</view>
|
||||
<view class="info-item">
|
||||
<view><text class="grey">巡检人员：</text>{{ infoData.modifier }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view
|
||||
scroll-x="true"
|
||||
class="content-scroll"
|
||||
:show-scrollbar="false"
|
||||
enable-flex
|
||||
>
|
||||
<view
|
||||
v-for="(item, index) in positionData"
|
||||
:key="index"
|
||||
:class="navCurIndex == index ? 'active' : ''"
|
||||
class="control-item"
|
||||
@click="changeTitle(index)"
|
||||
>
|
||||
{{ item.title }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="collapse-box">
|
||||
<uni-collapse ref="collapseRef" v-model="collapseValue" accordion @change="changeCollapse">
|
||||
<uni-collapse-item v-for="(val, collapseIndex) in collapseData" :key="collapseIndex">
|
||||
<template v-slot:title>
|
||||
<uni-section class="section" :title="val.title" type="line"></uni-section>
|
||||
</template>
|
||||
<view class="content">
|
||||
<view class="content-item" v-for="(item, itemIndex) in val.children" :key="itemIndex">
|
||||
<view class="title">
|
||||
<view>{{ item.title }}</view>
|
||||
<uni-tag :inverted="true" :text="item.tag" :type="item.tag == '正常' ? 'success' : 'warning'" />
|
||||
</view>
|
||||
<view class="list">
|
||||
<uni-row :gutter="10">
|
||||
<uni-col :span="5">
|
||||
<text class="grey">标准</text>：
|
||||
</uni-col>
|
||||
<uni-col :span="19">
|
||||
<text>{{ item.standard }}</text>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
<view class="list" v-if="item.tag !== '正常'">
|
||||
<uni-row :gutter="10">
|
||||
<uni-col :span="5">
|
||||
<text class="grey">问题</text>：
|
||||
</uni-col>
|
||||
<uni-col :span="19">
|
||||
<text>{{ item.problem }}</text>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
<view class="list" v-if="item.tag !== '正常'">
|
||||
<uni-row :gutter="10">
|
||||
<uni-col :span="5">
|
||||
<text class="grey">图片</text>：
|
||||
</uni-col>
|
||||
<uni-col :span="19">
|
||||
<uni-file-picker
|
||||
v-model="item.imageValue"
|
||||
file-mediatype="image"
|
||||
mode="grid"
|
||||
:readonly="true"
|
||||
/>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-collapse-item>
|
||||
</uni-collapse>
|
||||
</view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
import { ref, reactive } from "vue";
|
||||
|
||||
let navCurIndex = ref(0)
|
||||
|
||||
// 详情信息
|
||||
let infoData = ref([])
|
||||
// 标题信息
|
||||
let positionData = reactive([
|
||||
{ id: 1, title: "励磁盘柜" },
|
||||
{ id: 2, title: "母线洞设备" },
|
||||
{ id: 3, title: "机组LCU现" }
|
||||
])
|
||||
|
||||
let collapseValue = ref('0')
|
||||
|
||||
let collapseData = ref([
|
||||
{ title: '励磁调节器', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [{ "name":"logo.png", "extname":"logo", "url":"/static/image/index/logo.png", }] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
] },
|
||||
{ title: '励磁辅助控制柜', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [{ "name":"logo.png", "extname":"logo", "url":"/static/image/index/logo.png", }] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
] },
|
||||
{ title: '整流功率柜', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [{ "name":"logo.png", "extname":"logo", "url":"/static/image/index/logo.png", }] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
] },
|
||||
{ title: '直流开关柜', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [{ "name":"logo.png", "extname":"logo", "url":"/static/image/index/logo.png", }] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
]
|
||||
},
|
||||
{ title: '灭磁电阻柜', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
]
|
||||
},
|
||||
{ title: '测量附件柜', children: [
|
||||
{ title: '工控机触摸屏', tag: '异常', standard: '触摸屏发电机有功、无功、励磁电压、电流、控制角度、定子电压、电流在正常范围，无异常报警。', problem: '存在异常报警', imageValue: [] },
|
||||
{ title: '发电机出口断路器', tag: '正常', standard: '指示灯显示正常。' },
|
||||
{ title: '切换把手', tag: '正常', standard: '远方现地把手方式在“中位”' }
|
||||
] },
|
||||
])
|
||||
|
||||
onLoad((options) => {
|
||||
infoData.value = JSON.parse(options.data) || '{}'
|
||||
})
|
||||
|
||||
// 切换标题
|
||||
const changeTitle = (index) => {
|
||||
navCurIndex.value = index
|
||||
}
|
||||
|
||||
// 切换手风琴面板
|
||||
const changeCollapse = () => {
|
||||
// alertDialog.value.open()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pointsDetail {
|
||||
.content-scroll {
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
white-space: nowrap;
|
||||
.control-item {
|
||||
width: 160rpx;
|
||||
height: 35rpx;
|
||||
line-height: 35rpx;
|
||||
display: inline-block;
|
||||
padding: 0 20rpx;
|
||||
margin-left: 30rpx;
|
||||
position: relative;
|
||||
&.active {
|
||||
padding: 15rpx 20rpx!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-item {
|
||||
padding: 20rpx 30rpx;
|
||||
margin: 0 20rpx 20rpx;
|
||||
background: #F1F7FD;
|
||||
border-radius: 10rpx;
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: #004895;
|
||||
}
|
||||
.grey {
|
||||
width: 70%;
|
||||
text-align-last: justify;
|
||||
display: inline-block;
|
||||
|
||||
}
|
||||
|
||||
.list {
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #FFFFFF;
|
||||
&:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -81,7 +81,7 @@
|
||||
<uni-icons type="scan" size="26" @click="scanQRCode" v-if="infoData.state != '已巡检'"></uni-icons>
|
||||
</view>
|
||||
<view class="list-box">
|
||||
<view class="list-item" v-for="(item, index) in listData" :key="index" @click="scanQRCode">
|
||||
<view class="list-item" v-for="(item, index) in listData" :key="index" @click="isInspected(item)">
|
||||
<view class="line">
|
||||
<uni-icons fontFamily="iconfont" color="#1469BC">{{''}}</uni-icons>
|
||||
<view class="dashed-line"></view>
|
||||
@ -107,7 +107,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad, onReady } from "@dcloudio/uni-app";
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
import { reactive } from "vue";
|
||||
import { getPointList } from '@/api/api.js'
|
||||
|
||||
@ -129,10 +129,6 @@ let listData = ref([
|
||||
// { title: '发电机出口断路器', state: '异常', time: '2025-02-20 8:40', name: '张三' },
|
||||
])
|
||||
|
||||
onReady(() => {
|
||||
|
||||
|
||||
})
|
||||
onLoad((options) => {
|
||||
infoData = { ...infoData, ...JSON.parse(options.data) }
|
||||
if (infoData.state == 0) {
|
||||
@ -151,6 +147,19 @@ const queryPointList = () => {
|
||||
})
|
||||
}
|
||||
|
||||
// 判断是否已巡检
|
||||
const isInspected = (item) => {
|
||||
if (infoData.state == '已巡检') {
|
||||
// 跳转到点位详情页面
|
||||
uni.navigateTo({
|
||||
url: `/pages/pointsDetail/pointsDetail?data=${JSON.stringify(item)}`
|
||||
});
|
||||
} else {
|
||||
// 跳转扫描二维码
|
||||
scanQRCode()
|
||||
}
|
||||
}
|
||||
|
||||
// 扫描二维码
|
||||
const scanQRCode = () => {
|
||||
if (infoData.state == '已巡检') return
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user