<template>
  <Dialog :title="dialogTitle" v-model="dialogVisible" width="1200px" @closed="handleDialogClosed">
    <el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading">
      <el-row>
        <el-col :span="8">
          <el-form-item :label="t('MoldManagement.MoldRepair.repairCode')" prop="repairCode">
            <el-input
              v-model="formData.repairCode"
              :placeholder="t('MoldManagement.MoldRepair.placeholderRepairCode')"
              :disabled="isRepairMode"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item :label="t('MoldManagement.MoldRepair.repairName')" prop="repairName">
            <el-input
              v-model="formData.repairName"
              :placeholder="t('MoldManagement.MoldRepair.placeholderRepairName')"
              :disabled="isRepairMode"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item :label="t('MoldManagement.MoldRepair.mold')" prop="moldId">
            <el-select
              v-model="formData.moldId" filterable clearable :loading="moldLoading"
              :disabled="isRepairMode"
              :placeholder="t('MoldManagement.MoldRepair.placeholderMold')"
              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="t('MoldManagement.MoldRepair.moldName')" prop="moldName" :required="false">
            <el-input v-model="formData.moldName" :placeholder="t('MoldManagement.MoldRepair.placeholderMoldNameAuto')" disabled />
          </el-form-item>
        </el-col>
         <el-col :span="8">
          <el-form-item :label="t('MoldManagement.MoldRepair.moldCode')" prop="moldCode" :required="false">
            <el-input v-model="formData.moldCode" :placeholder="t('MoldManagement.MoldRepair.placeholderMoldCodeAuto')" 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="t('MoldManagement.MoldRepair.repairUser')" prop="acceptedBy">
            <el-select
              v-model="formData.acceptedBy" filterable clearable
              :placeholder="t('MoldManagement.MoldRepair.placeholderAcceptUser')"
              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="t('MoldManagement.MoldRepair.confirmUser')" prop="confirmBy">
            <el-select
              v-model="formData.confirmBy" filterable clearable
              :placeholder="t('MoldManagement.MoldRepair.placeholderConfirmUser')"
              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="t('MoldManagement.MoldRepair.requireDate')" prop="requireDate">
              <el-date-picker
                v-model="formData.requireDate" type="date" value-format="x"
                :placeholder="t('MoldManagement.MoldRepair.placeholderRequireDate')"
                class="!w-full" :disabled="repairFieldsDisabled"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="t('MoldManagement.MoldRepair.finishDate')" prop="finishDate">
              <el-date-picker
                v-model="formData.finishDate" type="date" value-format="x"
                :placeholder="t('MoldManagement.MoldRepair.placeholderFinishDate')"
                class="!w-full" :disabled="repairFieldsDisabled"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item :label="t('MoldManagement.MoldRepair.confirmDate')" prop="confirmDate">
              <el-date-picker
                v-model="formData.confirmDate" type="date" value-format="x"
                :placeholder="t('MoldManagement.MoldRepair.placeholderConfirmDate')"
                class="!w-full" :disabled="repairFieldsDisabled"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item :label="t('MoldManagement.MoldRepair.repairResult')" 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="t('MoldManagement.MoldRepair.tabMoldRepairLine')" name="moldRepairLine">
        <MoldRepairLineForm ref="moldRepairLineFormRef" :repair-id="formData.id" />
      </el-tab-pane>
    </el-tabs>
    <template #footer>
      <el-button @click="submitForm" type="primary" :disabled="formLoading">{{ t('common.ok') }}</el-button>
      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</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: t('MoldManagement.MoldRepair.validatorRepairCodeRequired'), trigger: 'blur' }],
  repairName: [{ required: true, message: t('MoldManagement.MoldRepair.validatorRepairNameRequired'), trigger: 'blur' }],
  moldId: [{ required: true, message: t('MoldManagement.MoldRepair.validatorMoldRequired'), 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('MoldManagement.MoldRepair.dialogTitleRepair')
      : type === 'create'
        ? t('MoldManagement.MoldRepair.dialogTitleCreate')
        : t('MoldManagement.MoldRepair.dialogTitleUpdate')
  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>
