巡检信息
This commit is contained in:
Zy
230
wuye-manager-uniapp/pageSubPack/inspection/inspection_main.vue
Normal file
230
wuye-manager-uniapp/pageSubPack/inspection/inspection_main.vue
Normal file
@@ -0,0 +1,230 @@
|
||||
<template>
|
||||
<view class="page_container inspection_main_box">
|
||||
<view class="info_box">
|
||||
<view class="title_box flex items-center justify-between">
|
||||
<view class="title flex items-center">
|
||||
<view class="line"> </view>
|
||||
<text>{{ info.taskName }}</text>
|
||||
</view>
|
||||
<view class="inspection_status" v-if="info.status === 0"> <text>已巡检</text> </view>
|
||||
<view class="inspection_status todo" v-else>
|
||||
<text>未巡检</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view class="item">
|
||||
<text>巡检项目：</text>
|
||||
<text>{{ info.items.join('； ') }}</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>巡检时间：</text>
|
||||
<text>{{ info.time }}</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>巡检小区：</text>
|
||||
<text>{{ info.villageName }}</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>巡检路线：</text>
|
||||
<text>{{ info.planName }}</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>巡检点：</text>
|
||||
<text>{{ info.point.join('; ') }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="result_box">
|
||||
<view class="inspecton_result_title">
|
||||
<text>巡检结果</text>
|
||||
</view>
|
||||
<view class="inspection_body" v-for="(item, index) in result" :key="index">
|
||||
<view class="inspection_items">
|
||||
<text class="label">巡检点：</text>
|
||||
<text>{{ item.pointName }}</text>
|
||||
</view>
|
||||
<view class="inspection_items">
|
||||
<text class="label">巡检人：</text>
|
||||
<text>{{ item.user }}</text>
|
||||
</view>
|
||||
<view class="inspection_items">
|
||||
<text class="label">手机号码：</text>
|
||||
<text>{{ item.phone }}</text>
|
||||
</view>
|
||||
<view class="inspection_items">
|
||||
<text class="label">巡检时间：</text>
|
||||
<text>{{ item.time }}</text>
|
||||
</view>
|
||||
<view class="inspection_items">
|
||||
<view class="label">巡检结果：</view>
|
||||
<view class="desction_value">{{ item.descrtion }}</view>
|
||||
</view>
|
||||
<view class="inspection_items">
|
||||
<view class="label">巡检照片：</view>
|
||||
<image
|
||||
class="inspection_photo"
|
||||
v-for="(ite, ind) in item.photos"
|
||||
:key="index"
|
||||
:src="ite"
|
||||
mode="scaleToFill"
|
||||
></image>
|
||||
</view>
|
||||
<view class="linedash" v-show="index + 1 !== result.length"> </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
|
||||
const info = ref({
|
||||
items: ['设备巡检', '电力检查'],
|
||||
time: '07:00:00-12:00:00',
|
||||
villageName: '幸福苑小区',
|
||||
taskName: '幸福苑小区-B1层地下车区',
|
||||
status: 0, // 0 已巡检 1未巡检
|
||||
planName: '常规巡检路线1',
|
||||
point: ['安全出口1号', '巡检点2号', '巡检点3号']
|
||||
})
|
||||
const result = ref([
|
||||
{
|
||||
pointName: '安全出口1号',
|
||||
user: '李相龙',
|
||||
phone: '1502360831',
|
||||
time: '2026-10-25 08:10:01',
|
||||
descrtion: '设备正常运转，电力系统正常，设备使用正常',
|
||||
photos: [
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80'
|
||||
]
|
||||
},
|
||||
{
|
||||
pointName: '巡检点2号',
|
||||
user: '李相龙',
|
||||
phone: '1502360831',
|
||||
time: '2026-10-25 10:10:01',
|
||||
descrtion: '部分墙体漏水',
|
||||
photos: [
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80'
|
||||
]
|
||||
},
|
||||
{
|
||||
pointName: '巡检点3号',
|
||||
user: '李相龙',
|
||||
phone: '1502360831',
|
||||
time: '2026-10-25 12:10:01',
|
||||
descrtion: '正常',
|
||||
photos: [
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80',
|
||||
'https://picsum.photos/80'
|
||||
]
|
||||
}
|
||||
])
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inspection_main_box {
|
||||
background: #f9f9f9;
|
||||
.info_box {
|
||||
padding: 40rpx 30rpx;
|
||||
border-radius: 16rpx;
|
||||
background-color: #fff;
|
||||
.title_box {
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
.title {
|
||||
font-weight: 550;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
line-height: 40rpx;
|
||||
.line {
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #4d5dfa;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
.inspection_status {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
line-height: 36rpx;
|
||||
|
||||
&.todo {
|
||||
color: #4d5dfa;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info {
|
||||
margin-top: 20rpx;
|
||||
.item {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 20rpx;
|
||||
color: #333333;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 巡检结果
|
||||
.result_box {
|
||||
padding: 28rpx 40rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 20rpx;
|
||||
.inspecton_result_title {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
line-height: 40rpx;
|
||||
font-weight: 550;
|
||||
}
|
||||
.inspection_body {
|
||||
margin-top: 20rpx;
|
||||
padding-left: 15rpx;
|
||||
margin-bottom: 20rpx;
|
||||
.inspection_items {
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
line-height: 36rpx;
|
||||
.inspection_photo {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-weight: 450;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.desction_value {
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
.linedash {
|
||||
width: 100%;
|
||||
border: 2rpx dashed #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user