Files
zgty-mas-m/pages/device/deviceBusUseRecord/detail.vue
2026-03-11 16:32:45 +08:00

119 lines
3.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<up-popup :show="visible" mode="right" closeable @close="handleClose" @open="handleOpen">
<uni-section titleFontSize="20px" type="line" title="设备使用记录"> </uni-section>
<scroll-view scroll-y="true" class="content">
<up-row>
<up-col span="4"
>开始使用人
<text class="value">{{ detailInfo.userName }}</text>
</up-col>
<up-col span="4"
>开始时间
<text class="value">{{ nx.$helper.formateToDateTime(detailInfo.useTimeStart) }}</text>
</up-col>
<up-col span="4"
>结束时间
<text class="value">{{ nx.$helper.formateToDateTime(detailInfo.useTimeEnd) }}</text>
</up-col>
</up-row>
<up-row>
<up-col span="4"
>使用前状态
<text class="value">{{ detailInfo.stateBefore }}</text>
</up-col>
<up-col span="4"
>使用中状态
<text class="value">{{ detailInfo.stateRun }}</text>
</up-col>
<up-col span="4"
>使用后状态
<text class="value">{{ detailInfo.stateAfter }}</text>
</up-col>
</up-row>
<up-row>
<up-col span="4"
>温度()
<text class="value">{{ detailInfo.temperature }}</text>
</up-col>
<up-col span="4"
>湿度(%RH)
<text class="value">{{ detailInfo.humidity }}</text>
</up-col>
<up-col span="4"
>检测项目
<text class="value">{{ detailInfo.useItem }}</text>
</up-col>
</up-row>
<u-table2 class="mt8" height="300px" :data="tableData" :columns="columns" stripe border> </u-table2>
</scroll-view>
</up-popup>
</template>
<script setup>
import { ref, reactive, onMounted, watch, computed } from 'vue'
import nx from '@/nx'
import { getDetailList } from './useRecord.api'
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 emit = defineEmits(['close', 'open'])
function handleClose() {
emit('close')
}
const columns = ref([
{ title: '样品名称', key: 'sampleName', align: 'center' },
{ title: '样品编号', key: 'sampleCode', align: 'center' }
])
const tableData = ref([])
async function getUseRecordDetailList(id) {
const res = await getDetailList({ parentId: id })
tableData.value = res
}
function handleOpen() {
detailInfo.value = props.checkInfo
getUseRecordDetailList(props.checkInfo.id)
}
</script>
<style lang="scss" scoped>
.content {
font-size: 18px;
height: 80vh;
width: 80vw;
padding: 10px 20px;
.u-row {
border-bottom: 1px solid #eee;
padding: 10px 0;
}
.value {
color: #666;
font-size: 16px;
}
}
:deep(.uicon-close) {
font-size: 22px !important;
}
:deep(.u-popup__content__close--top-right) {
top: 30px;
}
</style>