|
|
<template>
|
|
|
<Dialog :title="dialogTitle" v-model="dialogVisible" width="1200px" @closed="handleDialogClosed">
|
|
|
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px" v-loading="formLoading">
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="维修单编号" prop="repairCode">
|
|
|
<el-input v-model="formData.repairCode" placeholder="请输入维修单编号" :disabled="isRepairMode" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="维修单" prop="repairName">
|
|
|
<el-input v-model="formData.repairName" placeholder="请输入维修单名称" :disabled="isRepairMode" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-form-item label="设备类型" prop="machineryTypeId">
|
|
|
<el-radio-group v-model="formData.machineryTypeId" :disabled="isRepairMode">
|
|
|
<el-radio :label="1">设备</el-radio>
|
|
|
<el-radio :label="2">关键件</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="设备" prop="deviceId">
|
|
|
<el-select
|
|
|
v-model="formData.deviceId" filterable clearable :loading="deviceLoading"
|
|
|
:disabled="isRepairMode" placeholder="请选择设备" class="!w-full">
|
|
|
<el-option v-for="opt in deviceOptions" :key="String(opt.value)" :label="opt.label" :value="opt.value" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item v-if="showComponentSelect" label="关键件" prop="componentId">
|
|
|
<el-select
|
|
|
v-model="formData.componentId" clearable :loading="componentLoading" :disabled="isRepairMode"
|
|
|
placeholder="请选择关键件" class="!w-full">
|
|
|
<el-option
|
|
|
v-for="opt in componentOptions" :key="String(opt.value)" :label="opt.label"
|
|
|
:value="opt.value" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="设备名称" prop="machineryName" :required="false">
|
|
|
<el-input v-model="formData.machineryName" placeholder="自动带出" disabled />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="设备编码" prop="machineryCode" :required="false">
|
|
|
<el-input v-model="formData.machineryCode" placeholder="自动带出" disabled />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="规格型号" prop="machinerySpec" :required="false">
|
|
|
<el-input v-model="formData.machinerySpec" placeholder="自动带出" disabled />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="品牌" prop="machineryBrand" :required="false">
|
|
|
<el-input v-model="formData.machineryBrand" placeholder="自动带出" disabled />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="维修人员" prop="acceptedBy">
|
|
|
<el-select
|
|
|
v-model="formData.acceptedBy" filterable clearable placeholder="请选择维修人员" class="!w-full"
|
|
|
:disabled="isRepairMode">
|
|
|
<el-option v-for="item in users" :key="String(item.id)" :label="item.nickname" :value="String(item.id)" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="验收人员" prop="confirmBy">
|
|
|
<el-select
|
|
|
v-model="formData.confirmBy" filterable clearable placeholder="请选择验收人员" class="!w-full"
|
|
|
:disabled="isRepairMode">
|
|
|
<el-option v-for="item in users" :key="String(item.id)" :label="item.nickname" :value="String(item.id)" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
|
|
|
<template v-if="showRepairFields">
|
|
|
<el-row>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="报修日期" prop="requireDate">
|
|
|
<el-date-picker v-model="formData.requireDate" type="date" value-format="x" placeholder="选择报修日期" class="!w-full" :disabled="repairFieldsDisabled" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="完成日期" prop="finishDate">
|
|
|
<el-date-picker v-model="formData.finishDate" type="date" value-format="x" placeholder="选择完成日期" class="!w-full" :disabled="repairFieldsDisabled" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="验收日期" prop="confirmDate">
|
|
|
<el-date-picker v-model="formData.confirmDate" type="date" value-format="x" placeholder="选择验收日期" class="!w-full" :disabled="repairFieldsDisabled" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-form-item label="维修结果" prop="repairResult">
|
|
|
<Editor v-model="formData.repairResult" height="150px" :readonly="repairFieldsDisabled" />
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
</el-form>
|
|
|
<!-- 子表的表单 -->
|
|
|
<el-tabs v-model="subTabsName">
|
|
|
<el-tab-pane label="设备维修记录行" name="dvRepairLine">
|
|
|
<DvRepairLineForm ref="dvRepairLineFormRef" :repair-id="formData.id" />
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
<template #footer>
|
|
|
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
|
|
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
</template>
|
|
|
</Dialog>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
import { DvRepairApi, DvRepairVO } from '@/api/mes/dvrepair'
|
|
|
import DvRepairLineForm from './components/DvRepairLineForm.vue'
|
|
|
import { DeviceLedgerApi, DeviceLedgerVO } from '@/api/mes/deviceledger'
|
|
|
import { RepairItemsApi } from '@/api/mes/repairItems'
|
|
|
import { getSimpleUserList, UserVO } from '@/api/system/user'
|
|
|
|
|
|
/** 设备维修记录 表单 */
|
|
|
defineOptions({ name: 'DvRepairForm' })
|
|
|
|
|
|
const { t } = useI18n() // 国际化
|
|
|
const message = useMessage() // 消息弹窗
|
|
|
|
|
|
const dialogVisible = ref(false) // 弹窗的是否展示
|
|
|
const dialogTitle = ref('') // 弹窗的标题
|
|
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
|
|
const formType = ref('') // 表单的类型：create - 新增；update - 修改
|
|
|
const isRepairMode = computed(() => formType.value === 'update' || formType.value === 'repair')
|
|
|
const showRepairFields = computed(() => formType.value === 'update' || formType.value === 'repair')
|
|
|
const repairFieldsDisabled = computed(() => formType.value !== 'repair')
|
|
|
const isHydrating = ref(false)
|
|
|
const emit = defineEmits(['success', 'closed']) // 定义 success 事件，用于操作成功后的回调
|
|
|
const formData = ref({
|
|
|
id: undefined,
|
|
|
repairCode: undefined,
|
|
|
repairName: undefined,
|
|
|
deviceId: undefined as number | undefined,
|
|
|
componentId: undefined as number | undefined,
|
|
|
machineryId: undefined,
|
|
|
machineryCode: undefined,
|
|
|
machineryName: undefined,
|
|
|
machineryBrand: undefined,
|
|
|
machinerySpec: undefined,
|
|
|
machineryTypeId: undefined,
|
|
|
requireDate: undefined,
|
|
|
finishDate: undefined,
|
|
|
confirmDate: undefined,
|
|
|
repairResult: undefined,
|
|
|
acceptedBy: undefined,
|
|
|
confirmBy: undefined,
|
|
|
status: undefined,
|
|
|
remark: undefined,
|
|
|
})
|
|
|
|
|
|
const showComponentSelect = computed(() => formData.value.machineryTypeId === 2)
|
|
|
|
|
|
const deviceLoading = ref(false)
|
|
|
const deviceOptions = ref<{ label: string; value: number; raw?: DeviceLedgerVO }[]>([])
|
|
|
const deviceOptionsLoaded = ref(false)
|
|
|
|
|
|
const componentLoading = ref(false)
|
|
|
const componentOptions = ref<{ label: string; value: number }[]>([])
|
|
|
|
|
|
const users = ref<UserVO[]>([])
|
|
|
|
|
|
const ensureUsersLoaded = async () => {
|
|
|
if (users.value.length) return
|
|
|
users.value = (await getSimpleUserList()) ?? []
|
|
|
}
|
|
|
|
|
|
const normalizeUserId = (value: any) => {
|
|
|
if (value === undefined || value === null || value === '') return undefined
|
|
|
const str = String(value)
|
|
|
if (/^\d+$/.test(str)) return str
|
|
|
const matched = users.value.find((u) => u.nickname === str)
|
|
|
return matched ? String(matched.id) : str
|
|
|
}
|
|
|
|
|
|
const upsertDeviceOption = (
|
|
|
options: { label: string; value: number; raw?: DeviceLedgerVO }[],
|
|
|
option: { label: string; value: number; raw?: DeviceLedgerVO }
|
|
|
) => {
|
|
|
const existed = options.some((o) => o.value === option.value)
|
|
|
return existed ? options : [option, ...options]
|
|
|
}
|
|
|
|
|
|
const toComponentOption = (item: any) => {
|
|
|
const id = typeof item?.id === 'number' ? item.id : Number(item?.id)
|
|
|
if (Number.isNaN(id)) return undefined
|
|
|
const code = item?.code ?? item?.componentCode ?? item?.subjectCode
|
|
|
const name = item?.name ?? item?.componentName ?? item?.subjectName
|
|
|
const label = `${code ?? ''} ${name ?? ''}`.trim() || String(id)
|
|
|
return { label, value: id }
|
|
|
}
|
|
|
|
|
|
const loadComponentOptionsByDeviceId = async (deviceId: number) => {
|
|
|
componentLoading.value = true
|
|
|
try {
|
|
|
const data = await RepairItemsApi.getComponentList(deviceId)
|
|
|
const rows = (Array.isArray(data) ? data : data?.list ?? data?.data ?? []) as any[]
|
|
|
componentOptions.value = rows.map(toComponentOption).filter(Boolean) as { label: string; value: number }[]
|
|
|
} finally {
|
|
|
componentLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const ensureDeviceOptionsLoaded = async () => {
|
|
|
if (deviceOptionsLoaded.value) return
|
|
|
deviceLoading.value = true
|
|
|
try {
|
|
|
const data = await DeviceLedgerApi.getDeviceLedgerPage({})
|
|
|
const rows = (data?.list ?? []) as DeviceLedgerVO[]
|
|
|
deviceOptions.value = rows
|
|
|
.filter((r) => typeof r?.id === 'number')
|
|
|
.map((r) => ({ label: `${r.deviceCode ?? ''} ${r.deviceName ?? ''}`.trim(), value: r.id, raw: r }))
|
|
|
deviceOptionsLoaded.value = true
|
|
|
} finally {
|
|
|
deviceLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
watch(
|
|
|
() => formData.value.machineryTypeId,
|
|
|
(val) => {
|
|
|
if (isHydrating.value) return
|
|
|
formData.value.deviceId = undefined
|
|
|
formData.value.componentId = undefined
|
|
|
formData.value.machineryId = undefined
|
|
|
formData.value.machineryCode = undefined
|
|
|
formData.value.machineryName = undefined
|
|
|
formData.value.machineryBrand = undefined
|
|
|
formData.value.machinerySpec = undefined
|
|
|
componentOptions.value = []
|
|
|
setLineRows([])
|
|
|
}
|
|
|
)
|
|
|
|
|
|
watch(
|
|
|
() => formData.value.deviceId,
|
|
|
async (deviceId) => {
|
|
|
if (isHydrating.value) return
|
|
|
formData.value.componentId = undefined
|
|
|
componentOptions.value = []
|
|
|
if (typeof deviceId !== 'number') {
|
|
|
setLineRows([])
|
|
|
}
|
|
|
|
|
|
const option = deviceOptions.value.find((o) => o.value === deviceId)
|
|
|
if (option?.raw) {
|
|
|
formData.value.machineryCode = option.raw.deviceCode
|
|
|
formData.value.machineryName = option.raw.deviceName
|
|
|
formData.value.machinerySpec = option.raw.deviceSpec
|
|
|
formData.value.machineryBrand = option.raw.deviceBrand
|
|
|
}
|
|
|
|
|
|
if (formData.value.machineryTypeId === 2 && typeof deviceId === 'number') {
|
|
|
await loadComponentOptionsByDeviceId(deviceId)
|
|
|
}
|
|
|
|
|
|
if (formData.value.machineryTypeId === 1 && typeof deviceId === 'number') {
|
|
|
await prefillLinesByDeviceOrComponent({ deviceId, deviceType: 1 })
|
|
|
}
|
|
|
}
|
|
|
)
|
|
|
|
|
|
watch(
|
|
|
() => formData.value.componentId,
|
|
|
async (componentId) => {
|
|
|
if (isHydrating.value) return
|
|
|
if (formData.value.machineryTypeId !== 2) return
|
|
|
const deviceId = formData.value.deviceId
|
|
|
if (typeof deviceId !== 'number' || typeof componentId !== 'number') {
|
|
|
setLineRows([])
|
|
|
return
|
|
|
}
|
|
|
await prefillLinesByDeviceOrComponent({ deviceId, componentId, deviceType: 2 })
|
|
|
}
|
|
|
)
|
|
|
const formRules = reactive({
|
|
|
repairCode: [{ required: true, message: '维修单编号不能为空', trigger: 'blur' }],
|
|
|
machineryId: [{ required: true, message: '设备ID不能为空', trigger: 'blur' }],
|
|
|
machineryCode: [{ required: true, message: '设备编码不能为空', trigger: 'blur' }],
|
|
|
machineryName: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
|
|
|
machineryTypeId: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
|
|
|
})
|
|
|
const formRef = ref() // 表单 Ref
|
|
|
|
|
|
/** 子表的表单 */
|
|
|
const subTabsName = ref('dvRepairLine')
|
|
|
const dvRepairLineFormRef = ref()
|
|
|
|
|
|
const normalizeDeviceOrComponentList = (data: any) => {
|
|
|
const rows = (Array.isArray(data) ? data : data?.list ?? data?.data ?? []) as any[]
|
|
|
return rows
|
|
|
}
|
|
|
|
|
|
const toDvRepairLineRow = (item: any) => {
|
|
|
const subjectId = item?.subjectId ?? item?.id
|
|
|
return {
|
|
|
id: undefined,
|
|
|
repairId: formData.value.id,
|
|
|
subjectId,
|
|
|
subjectCode: item?.subjectCode ?? item?.subject_code ?? item?.code,
|
|
|
subjectName: item?.subjectName ?? item?.subject_name ?? item?.name,
|
|
|
subjectType: item?.subjectType ?? item?.subject_type ?? item?.type,
|
|
|
subjectContent: item?.subjectContent ?? item?.projectContent ?? item?.subject_content,
|
|
|
subjectStandard: item?.subjectStandard ?? item?.judgmentCriteria ?? item?.subject_standard,
|
|
|
malfunction: undefined,
|
|
|
malfunctionUrl: undefined,
|
|
|
repairDes: undefined,
|
|
|
remark: undefined
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const setLineRows = (rows: any[]) => {
|
|
|
dvRepairLineFormRef.value?.setData(rows)
|
|
|
}
|
|
|
|
|
|
const prefillLinesByDeviceOrComponent = async (params: { deviceId: number; componentId?: number; deviceType: number }) => {
|
|
|
if (formType.value !== 'create') return
|
|
|
const data = await RepairItemsApi.getDeviceOrComponentList(params)
|
|
|
const list = normalizeDeviceOrComponentList(data)
|
|
|
setLineRows(list.map(toDvRepairLineRow))
|
|
|
}
|
|
|
|
|
|
let openRequestId = 0
|
|
|
|
|
|
/** 打开弹窗 */
|
|
|
const open = async (type: string, id?: number) => {
|
|
|
const currentOpenId = ++openRequestId
|
|
|
dialogVisible.value = true
|
|
|
dialogTitle.value = type === 'repair' ? '维修' : t('action.' + type)
|
|
|
formType.value = type
|
|
|
resetForm()
|
|
|
await ensureUsersLoaded()
|
|
|
await ensureDeviceOptionsLoaded()
|
|
|
if (currentOpenId !== openRequestId) return
|
|
|
// 修改时，设置数据
|
|
|
if (id) {
|
|
|
formLoading.value = true
|
|
|
try {
|
|
|
isHydrating.value = true
|
|
|
formData.value = await DvRepairApi.getDvRepair(id)
|
|
|
|
|
|
if (currentOpenId !== openRequestId) return
|
|
|
|
|
|
;(formData.value as any).requireDate = (formData.value as any).requireDate ?? undefined
|
|
|
;(formData.value as any).finishDate = (formData.value as any).finishDate ?? undefined
|
|
|
;(formData.value as any).confirmDate = (formData.value as any).confirmDate ?? undefined
|
|
|
;(formData.value as any).repairResult = (formData.value as any).repairResult ?? ''
|
|
|
|
|
|
;(formData.value as any).acceptedBy = normalizeUserId((formData.value as any).acceptedBy)
|
|
|
;(formData.value as any).confirmBy = normalizeUserId((formData.value as any).confirmBy)
|
|
|
|
|
|
const typeId = typeof formData.value.machineryTypeId === 'number' ? formData.value.machineryTypeId : Number(formData.value.machineryTypeId)
|
|
|
formData.value.machineryTypeId = Number.isNaN(typeId) ? formData.value.machineryTypeId : typeId
|
|
|
|
|
|
const deviceId = (formData.value as any).deviceId
|
|
|
const resolvedDeviceId = typeof deviceId === 'number' ? deviceId : formData.value.machineryId
|
|
|
if (typeof resolvedDeviceId === 'number') {
|
|
|
formData.value.deviceId = resolvedDeviceId
|
|
|
const label = `${formData.value.machineryCode ?? ''} ${formData.value.machineryName ?? ''}`.trim() || `ID:${resolvedDeviceId}`
|
|
|
deviceOptions.value = upsertDeviceOption(deviceOptions.value, { label, value: resolvedDeviceId })
|
|
|
}
|
|
|
|
|
|
if (formData.value.machineryTypeId === 2 && typeof formData.value.deviceId === 'number') {
|
|
|
await loadComponentOptionsByDeviceId(formData.value.deviceId)
|
|
|
const componentId = (formData.value as any).componentId
|
|
|
const resolvedComponentId = typeof componentId === 'number' ? componentId : Number(componentId)
|
|
|
if (!Number.isNaN(resolvedComponentId)) {
|
|
|
formData.value.componentId = resolvedComponentId
|
|
|
}
|
|
|
}
|
|
|
} finally {
|
|
|
isHydrating.value = false
|
|
|
formLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
|
|
|
|
|
const handleDialogClosed = () => {
|
|
|
openRequestId++
|
|
|
emit('closed')
|
|
|
}
|
|
|
|
|
|
onBeforeUnmount(() => {
|
|
|
openRequestId++
|
|
|
})
|
|
|
|
|
|
/** 提交表单 */
|
|
|
const submitForm = async () => {
|
|
|
// 校验表单
|
|
|
await formRef.value.validate()
|
|
|
// 校验子表单
|
|
|
try {
|
|
|
await dvRepairLineFormRef.value.validate()
|
|
|
} catch (e) {
|
|
|
subTabsName.value = 'dvRepairLine'
|
|
|
return
|
|
|
}
|
|
|
// 提交请求
|
|
|
formLoading.value = true
|
|
|
try {
|
|
|
const data = { ...(formData.value as any) } as DvRepairVO & { deviceId?: number; componentId?: number }
|
|
|
; (data as any).acceptedBy = normalizeUserId((data as any).acceptedBy)
|
|
|
; (data as any).confirmBy = normalizeUserId((data as any).confirmBy)
|
|
|
if (formType.value === 'repair') {
|
|
|
;(data as any).status = 1
|
|
|
}
|
|
|
if (typeof formData.value.deviceId === 'number') {
|
|
|
data.machineryId = formData.value.deviceId as any
|
|
|
}
|
|
|
; (data as any).deviceId = formData.value.deviceId
|
|
|
; (data as any).componentId = formData.value.machineryTypeId === 2 ? formData.value.componentId : undefined
|
|
|
// 拼接子表的数据
|
|
|
data.dvRepairLines = dvRepairLineFormRef.value.getData()
|
|
|
if (formType.value === 'create') {
|
|
|
await DvRepairApi.createDvRepair(data)
|
|
|
message.success(t('common.createSuccess'))
|
|
|
} else {
|
|
|
await DvRepairApi.updateDvRepair(data)
|
|
|
message.success(t('common.updateSuccess'))
|
|
|
}
|
|
|
dialogVisible.value = false
|
|
|
// 发送操作成功的事件
|
|
|
emit('success')
|
|
|
} finally {
|
|
|
formLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/** 重置表单 */
|
|
|
const resetForm = () => {
|
|
|
formData.value = {
|
|
|
id: undefined,
|
|
|
repairCode: undefined,
|
|
|
repairName: undefined,
|
|
|
deviceId: undefined,
|
|
|
componentId: undefined,
|
|
|
machineryId: undefined,
|
|
|
machineryCode: undefined,
|
|
|
machineryName: undefined,
|
|
|
machineryBrand: undefined,
|
|
|
machinerySpec: undefined,
|
|
|
machineryTypeId: 1,
|
|
|
requireDate: undefined,
|
|
|
finishDate: undefined,
|
|
|
confirmDate: undefined,
|
|
|
repairResult: '',
|
|
|
acceptedBy: undefined,
|
|
|
confirmBy: undefined,
|
|
|
status: undefined,
|
|
|
remark: undefined,
|
|
|
}
|
|
|
deviceOptionsLoaded.value = false
|
|
|
componentOptions.value = []
|
|
|
formRef.value?.resetFields()
|
|
|
}
|
|
|
</script>
|