<template>
|
<el-dialog
|
v-model="visible"
|
title="设备报修详情"
|
width="800px"
|
destroy-on-close
|
:close-on-click-modal="false"
|
@close="handleClose"
|
>
|
<el-descriptions border :column="2" class="repair-detail">
|
<el-descriptions-item label="设备名称">{{ form.deviceName }}</el-descriptions-item>
|
<el-descriptions-item label="规格型号">{{ form.deviceModel }}</el-descriptions-item>
|
|
<el-descriptions-item label="报修日期">{{ form.repairTime }}</el-descriptions-item>
|
<el-descriptions-item label="报修人">{{ form.repairName }}</el-descriptions-item>
|
|
<el-descriptions-item label="报修项目">{{ form.machineryCategory }}</el-descriptions-item>
|
<el-descriptions-item label="维修人">{{ form.maintenanceName }}</el-descriptions-item>
|
|
<el-descriptions-item label="报修状态">
|
<el-tag v-if="form.status === 2" type="danger">失败</el-tag>
|
<el-tag v-else-if="form.status === 1" type="success">已验收</el-tag>
|
<el-tag v-else-if="form.status === 3" type="info">待验收</el-tag>
|
<el-tag v-else-if="form.status === 0" type="warning">待维修</el-tag>
|
</el-descriptions-item>
|
<el-descriptions-item label="故障现象">{{ form.remark }}</el-descriptions-item>
|
|
<!-- 验收信息 -->
|
<template v-if="form.status === 1 || form.status === 3">
|
<el-descriptions-item label="验收人">{{ form.acceptanceName }}</el-descriptions-item>
|
<el-descriptions-item label="验收时间">{{ form.acceptanceTime }}</el-descriptions-item>
|
<el-descriptions-item label="验收备注" :span="2">{{ form.acceptanceRemark }}</el-descriptions-item>
|
</template>
|
|
<!-- 附件 -->
|
<el-descriptions-item label="附件" :span="2">
|
<ImageUpload
|
v-if="form.storageBlobDTOs && form.storageBlobDTOs.length > 0"
|
v-model:file-list="form.storageBlobDTOs"
|
:disabled="true"
|
/>
|
<span v-else style="color: #999;">无附件</span>
|
</el-descriptions-item>
|
</el-descriptions>
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="handleClose">关闭</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup>
|
import { ref, nextTick } from "vue";
|
import { getRepairById } from "@/api/equipmentManagement/repair";
|
import ImageUpload from "@/components/AttachmentUpload/image/index.vue";
|
|
const visible = ref(false);
|
const form = ref({});
|
|
const openView = async (id) => {
|
visible.value = true;
|
await nextTick();
|
try {
|
const { data } = await getRepairById(id);
|
// 确保附件字段名称匹配组件需要
|
data.storageBlobDTOs = data.storageBlobVOs || [];
|
form.value = data || {};
|
} catch (error) {
|
console.error("Failed to load repair details:", error);
|
}
|
};
|
|
const handleClose = () => {
|
visible.value = false;
|
form.value = {};
|
};
|
|
defineExpose({
|
openView,
|
});
|
</script>
|
|
<style scoped>
|
.repair-detail :deep(.el-descriptions__label) {
|
width: 120px;
|
justify-content: flex-end;
|
}
|
.repair-detail :deep(.el-upload) {
|
display: none !important;
|
}
|
</style>
|
