139 lines
4.1 KiB
Vue
139 lines
4.1 KiB
Vue
<template>
|
||
<up-popup :show="visible" mode="right" closeable @close="handleClose" @open="handleOpen">
|
||
<uni-section titleFontSize="18px" type="line" title="设备点检信息"> </uni-section>
|
||
<scroll-view scroll-y="true" style="height: 85vh; width: 90vw">
|
||
<view class="content">
|
||
<up-row class="flex-wrap p10" style="background-color: #f5f7fa">
|
||
<up-col class="mb10" :span="gridCol" v-for="(item, index) in detailSchema">
|
||
<view style="color: #666"
|
||
><span style="color: #333">{{ item.label }}:</span>{{ detailInfo[item.value] }}</view
|
||
>
|
||
</up-col>
|
||
</up-row>
|
||
|
||
<view class="p5">
|
||
<view class="pt5"
|
||
>备注:
|
||
<text style="color: #666">
|
||
{{ detailInfo.content }}
|
||
</text>
|
||
</view>
|
||
<up-row>
|
||
<up-col span="6">
|
||
<view class="pt5"
|
||
>点检人:
|
||
<text style="color: #666">
|
||
{{ detailInfo.checkUserName }}
|
||
</text>
|
||
</view>
|
||
<view class="pt5"
|
||
>点检日期:
|
||
<text style="color: #666">
|
||
{{ detailInfo.checkDate }}
|
||
</text>
|
||
</view>
|
||
</up-col>
|
||
<up-col span="6">
|
||
<up-album multiple-size="70" single-size="70" :urls="attachment" row-count="4"> </up-album>
|
||
</up-col>
|
||
</up-row>
|
||
</view>
|
||
<view>
|
||
<up-row class="font-bold" style="background-color: #f5f5f5">
|
||
<up-col span="5">点检项目</up-col>
|
||
<up-col span="3">检查标准</up-col>
|
||
<up-col span="2"> 频次</up-col>
|
||
<up-col span="2">是否正常</up-col>
|
||
</up-row>
|
||
<view class="pt10">
|
||
<up-row class="pb10" v-for="(item, index) in detailInfo.maintainItemList" :key="index">
|
||
<up-col span="5">
|
||
<view class="x-f">
|
||
<text class="pl10">
|
||
{{ item.itemName }}
|
||
</text>
|
||
</view>
|
||
</up-col>
|
||
|
||
<up-col span="3">{{ item.standard }}</up-col>
|
||
<up-col span="2">{{ item.frequencyRemark }}</up-col>
|
||
<up-col span="2">
|
||
<u-tag v-if="item.checkResult == '正常'" text="正常" size="mini" type="success" plain plainFill></u-tag>
|
||
<u-tag v-else text="不正常" type="error" size="mini" plain plainFill></u-tag>
|
||
</up-col>
|
||
</up-row>
|
||
</view>
|
||
<view class="p10"></view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</up-popup>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive, onMounted, watch, computed } from 'vue'
|
||
import { detailSchema } from './dailyCheck.data'
|
||
import dailyCheckApi from '@/nx/api/dailyCheck'
|
||
import { getImgBaseUrl } from '@/defaultBaseUrl'
|
||
import { useGridCol } from '@/nx/hooks/useGridCol'
|
||
|
||
const { gridCol } = useGridCol([700], [6, 4])
|
||
const props = defineProps({
|
||
show: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
checkInfo: {
|
||
type: Object
|
||
}
|
||
})
|
||
const visible = ref(props.show)
|
||
// 监听外部传入的show属性变化
|
||
watch(
|
||
() => props.show,
|
||
newVal => {
|
||
visible.value = newVal
|
||
}
|
||
)
|
||
let detailInfo = ref({})
|
||
const attachment = ref([])
|
||
async function getDetailInfo(id) {
|
||
const res = await dailyCheckApi.queryById(id)
|
||
res.maintainItemList.forEach(item => {
|
||
if (item.checkResult == 'false' || !item.checkResult) {
|
||
item.checkResult = false
|
||
}
|
||
if (item.checkResult == 'true') {
|
||
item.checkResult = true
|
||
}
|
||
})
|
||
|
||
detailInfo.value = res
|
||
attachment.value = []
|
||
let files = res?.attachment?.split(',') || []
|
||
if (files.length > 0) {
|
||
attachment.value = files.map(item => getImgBaseUrl() + item)
|
||
}
|
||
}
|
||
const emit = defineEmits(['close', 'open'])
|
||
function handleClose() {
|
||
emit('close')
|
||
}
|
||
function handleOpen() {
|
||
getDetailInfo(props.checkInfo.id)
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.content {
|
||
background-color: #fff;
|
||
height: 100%;
|
||
padding: 16px;
|
||
padding-top: 10px;
|
||
font-size: 16px;
|
||
}
|
||
:deep(.uicon-close) {
|
||
font-size: 22px !important;
|
||
}
|
||
</style>
|