You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

387 lines
14 KiB
Vue

<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-row>
<el-col :span="8">
<el-form-item label="模具" prop="moldId">
<el-select
v-model="formData.moldId" filterable clearable :loading="moldLoading"
:disabled="isRepairMode" placeholder="请选择模具" class="!w-full">
<el-option v-for="opt in moldOptions" :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="moldName" :required="false">
<el-input v-model="formData.moldName" placeholder="自动带出" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="模具编码" prop="moldCode" :required="false">
<el-input v-model="formData.moldCode" 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="moldRepairLine">
<MoldRepairLineForm ref="moldRepairLineFormRef" :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 { MoldRepairApi, MoldRepairVO } from '@/api/mold/moldrepair'
import { MoldRepairItemsApi } from '@/api/mold/moldRepairItems'
import MoldRepairLineForm from './components/MoldRepairLineForm.vue'
import { MoldBrandApi, MoldVO } from '@/api/erp/mold'
import { getSimpleUserList, UserVO } from '@/api/system/user'
defineOptions({ name: 'MoldRepairForm' })
const { t } = useI18n()
const message = useMessage()
const dialogVisible = ref(false)
const dialogTitle = ref('')
const formLoading = ref(false)
const formType = ref('')
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'])
const formData = ref({
id: undefined,
repairCode: undefined,
repairName: undefined,
moldId: undefined as number | undefined,
moldCode: undefined,
moldName: undefined,
machineryBrand: undefined,
machinerySpec: undefined,
requireDate: undefined,
finishDate: undefined,
confirmDate: undefined,
repairResult: '',
acceptedBy: undefined,
confirmBy: undefined,
status: undefined,
remark: undefined,
})
const moldLoading = ref(false)
const moldOptions = ref<{ label: string; value: number; raw?: MoldVO }[]>([])
const moldOptionsLoaded = ref(false)
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 upsertMoldOption = (
options: { label: string; value: number; raw?: MoldVO }[],
option: { label: string; value: number; raw?: MoldVO }
) => {
const existed = options.some((o) => o.value === option.value)
return existed ? options : [option, ...options]
}
const toMoldOption = (item: any) => {
const id = typeof item?.id === 'number' ? item.id : Number(item?.id)
if (Number.isNaN(id)) return undefined
const code = item?.code ?? item?.moldCode
const name = item?.name ?? item?.moldName
const label = `${code ?? ''} ${name ?? ''}`.trim() || String(id)
return { label, value: id, raw: item as MoldVO }
}
const ensureMoldOptionsLoaded = async () => {
if (moldOptionsLoaded.value) return
moldLoading.value = true
try {
const data = await MoldBrandApi.getMoldPageWithoutPaging()
const rows = (Array.isArray(data) ? data : data?.list ?? data?.data ?? []) as any[]
moldOptions.value = rows.map(toMoldOption).filter(Boolean) as { label: string; value: number; raw?: MoldVO }[]
moldOptionsLoaded.value = true
} finally {
moldLoading.value = false
}
}
watch(
() => formData.value.moldId,
async (moldId) => {
if (isHydrating.value) return
if (typeof moldId !== 'number') {
formData.value.moldCode = undefined
formData.value.moldName = undefined
formData.value.machinerySpec = undefined
formData.value.machineryBrand = undefined
if (formType.value === 'create') setLineRows([])
return
}
const option = moldOptions.value.find((o) => o.value === moldId)
if (option?.raw) {
const raw: any = option.raw
const code = raw?.code ?? raw?.moldCode
const name = raw?.name ?? raw?.moldName
formData.value.moldCode = code
formData.value.moldName = name
formData.value.machinerySpec = raw?.moldType ?? raw?.spec ?? raw?.moldSpec
formData.value.machineryBrand = raw?.brandName ?? raw?.brand ?? raw?.moldBrand
}
await prefillLinesByMold(moldId as number)
}
)
const formRules = reactive({
repairCode: [{ required: true, message: '维修单编号不能为空', trigger: 'blur' }],
moldId: [{ required: true, message: '模具不能为空', trigger: 'change' }],
})
const formRef = ref()
const subTabsName = ref('moldRepairLine')
const moldRepairLineFormRef = ref()
const setLineRows = (rows: any[]) => {
moldRepairLineFormRef.value?.setData(rows)
}
const normalizeMoldRepairItemList = (data: any) => {
const rows = (Array.isArray(data) ? data : data?.list ?? data?.data ?? []) as any[]
return rows
}
const toMoldRepairLineRow = (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 prefillLinesByMold = async (moldId: number | undefined) => {
if (formType.value !== 'create') return
if (typeof moldId !== 'number') {
setLineRows([])
return
}
const data = await MoldRepairItemsApi.getRepairItemsPage({ pageNo: 1, pageSize: 100, moldId })
const list = normalizeMoldRepairItemList(data)
setLineRows(list.map(toMoldRepairLineRow))
}
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 ensureMoldOptionsLoaded()
if (currentOpenId !== openRequestId) return
if (id) {
formLoading.value = true
try {
isHydrating.value = true
formData.value = await MoldRepairApi.getMoldRepair(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)
;(formData.value as any).moldCode = (formData.value as any).moldCode ?? (formData.value as any).machineryCode
;(formData.value as any).moldName = (formData.value as any).moldName ?? (formData.value as any).machineryName
const rawMoldId = (formData.value as any).moldId
const rawMachineryId = (formData.value as any).machineryId
const resolvedMoldId =
typeof rawMoldId === 'number'
? rawMoldId
: typeof rawMachineryId === 'number'
? rawMachineryId
: Number(rawMachineryId)
delete (formData.value as any).machineryId
delete (formData.value as any).machineryCode
delete (formData.value as any).machineryName
if (typeof resolvedMoldId === 'number' && !Number.isNaN(resolvedMoldId)) {
formData.value.moldId = resolvedMoldId
const label = `${formData.value.moldCode ?? ''} ${formData.value.moldName ?? ''}`.trim() || `ID:${resolvedMoldId}`
moldOptions.value = upsertMoldOption(moldOptions.value, { label, value: resolvedMoldId })
}
} finally {
isHydrating.value = false
formLoading.value = false
}
}
}
defineExpose({ open })
const handleDialogClosed = () => {
openRequestId++
emit('closed')
}
onBeforeUnmount(() => {
openRequestId++
})
const submitForm = async () => {
await formRef.value.validate()
try {
await moldRepairLineFormRef.value.validate()
} catch {
subTabsName.value = 'moldRepairLine'
return
}
formLoading.value = true
try {
const data = { ...(formData.value as any) } as MoldRepairVO & { moldId?: number; componentId?: number }
;(data as any).acceptedBy = normalizeUserId((data as any).acceptedBy)
;(data as any).confirmBy = normalizeUserId((data as any).confirmBy)
;(data as any).moldCode = (data as any).moldCode ?? (data as any).machineryCode
;(data as any).moldName = (data as any).moldName ?? (data as any).machineryName
delete (data as any).machineryId
delete (data as any).machineryCode
delete (data as any).machineryName
if (formType.value === 'repair') {
;(data as any).status = 1
}
;(data as any).moldId = formData.value.moldId
;(data as any).moldRepairLines = moldRepairLineFormRef.value.getData()
if (formType.value === 'create') {
await MoldRepairApi.createMoldRepair(data)
message.success(t('common.createSuccess'))
} else {
await MoldRepairApi.updateMoldRepair(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,
moldId: undefined,
moldCode: undefined,
moldName: undefined,
machineryBrand: undefined,
machinerySpec: undefined,
requireDate: undefined,
finishDate: undefined,
confirmDate: undefined,
repairResult: '',
acceptedBy: undefined,
confirmBy: undefined,
status: undefined,
remark: undefined,
}
moldOptionsLoaded.value = false
formRef.value?.resetFields()
}
</script>