pms-iot-vue/src/views/pms/maintenance/IotMaintenancePlanDetail.vue

<template>
  <ContentWrap v-loading="formLoading">
    <el-form
      ref="formRef"
      :model="formData"
      :rules="formRules"
      v-loading="formLoading"
      style="margin-top: 1em; margin-right: 4em; margin-left: 0.5em"
      label-width="130px">
      <div class="base-expandable-content">
        <el-row>
          <el-col :span="12">
            <el-form-item :label="t('main.planName')" prop="name">
              <el-input type="text" v-model="formData.name" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="t('main.planCode')" prop="serialNumber">
              <el-input type="text" v-model="formData.serialNumber" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item :label="t('form.remark')" prop="remark">
              <el-input
                v-model="formData.remark"
                type="textarea"
                :placeholder="t('deviceForm.remarkHolder')"
                disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </div>
    </el-form>
  </ContentWrap>
  <ContentWrap>
    <!-- 列表 -->
    <ContentWrap>
      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
        <!-- 添加序号列 -->
        <el-table-column type="index" :label="t('monitor.serial')" width="70" align="center" />
        <el-table-column :label="t('monitor.deviceCode')" align="center" prop="deviceCode" />
        <el-table-column :label="t('monitor.deviceName')" align="center" prop="deviceName" />
        <el-table-column
          :label="t('operationFillForm.sumTime')"
          align="center"
          prop="totalRunTime"
          :formatter="erpPriceTableColumnFormatter">
          <template #default="{ row }">
            {{ row.totalRunTime ?? row.tempTotalRunTime }}
          </template>
        </el-table-column>
        <el-table-column
          :label="t('operationFillForm.sumKil')"
          align="center"
          prop="totalMileage"
          :formatter="erpPriceTableColumnFormatter">
          <template #default="{ row }">
            {{ row.totalMileage ?? row.tempTotalMileage }}
          </template>
        </el-table-column>
        <el-table-column
          label="tempTotalRunTime"
          align="center"
          prop="tempTotalRunTime"
          :formatter="erpPriceTableColumnFormatter"
          v-if="false" />
        <el-table-column
          label="tempTotalMileage"
          align="center"
          prop="tempTotalMileage"
          :formatter="erpPriceTableColumnFormatter"
          v-if="false" />
        <el-table-column :label="t('bomList.bomNode')" align="center" prop="name" />
        <el-table-column :label="t('main.mileage')" key="mileageRule" width="80">
          <template #default="scope">
            <el-switch
              v-model="scope.row.mileageRule"
              :active-value="0"
              :inactive-value="1"
              disabled />
          </template>
        </el-table-column>
        <el-table-column :label="t('main.runTime')" key="runningTimeRule" width="90">
          <template #default="scope">
            <el-switch
              v-model="scope.row.runningTimeRule"
              :active-value="0"
              :inactive-value="1"
              disabled />
          </template>
        </el-table-column>
        <el-table-column :label="t('main.date')" key="naturalDateRule" width="80">
          <template #default="scope">
            <el-switch
              v-model="scope.row.naturalDateRule"
              :active-value="0"
              :inactive-value="1"
              disabled />
          </template>
        </el-table-column>
        <el-table-column :label="t('workplace.operation')" align="center" min-width="120px">
          <template #default="scope">
            <div style="display: flex; justify-content: center; align-items: center; width: 100%">
              <div> </div>
              <!-- 新增配置按钮 -->
              <div style="margin-left: 12px">
                <el-button link type="primary" @click="openConfigDialog(scope.row)">
                  {{ t('form.set') }}
                </el-button>
              </div>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </ContentWrap>
  </ContentWrap>
  <ContentWrap>
    <el-form>
      <el-form-item style="float: right">
        <el-button @click="close">{{ t('operationFillForm.cancel') }}</el-button>
      </el-form-item>
    </el-form>
  </ContentWrap>
  <MainPlanDeviceList ref="deviceFormRef" @choose="deviceChoose" />
  <!-- 新增配置对话框 -->
  <el-dialog
    v-model="configDialog.visible"
    :title="`设备 ${configDialog.current?.deviceCode + '-' + configDialog.current?.name} 保养项配置`"
    width="600px">
    <!-- 使用header插槽自定义标题 -->
    <template #header>
      <span
        >设备
        <strong>{{ configDialog.current?.deviceCode }}-{{ configDialog.current?.name }}</strong>
        保养项配置</span
      >
    </template>
    <el-form
      :model="configDialog.form"
      label-width="200px"
      :rules="configFormRules"
      ref="configFormRef">
      <div class="form-group">
        <div class="group-title">{{ t('mainPlan.basicMaintenanceRecords') }}</div>
        <!-- 里程配置 -->
        <el-form-item
          v-if="configDialog.current?.mileageRule === 0"
          :label="t('mainPlan.lastMaintenanceMileage')"
          prop="lastRunningKilometers">
          <el-input-number
            v-model="configDialog.form.lastRunningKilometers"
            :precision="2"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
        <!-- 运行时间配置 -->
        <el-form-item
          v-if="configDialog.current?.runningTimeRule === 0"
          :label="t('mainPlan.lastMaintenanceOperationTime')"
          prop="lastRunningTime">
          <el-input-number
            v-model="configDialog.form.lastRunningTime"
            :precision="1"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
        <!-- 自然日期配置 -->
        <el-form-item
          v-if="configDialog.current?.naturalDateRule === 0"
          :label="t('mainPlan.lastMaintenanceNaturalDate')"
          prop="lastNaturalDate">
          <el-date-picker
            v-model="configDialog.form.lastNaturalDate"
            type="date"
            placeholder="选择日期"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            style="width: 60%"
            disabled />
        </el-form-item>
      </div>

      <div class="form-group" v-if="configDialog.current?.mileageRule === 0">
        <div class="group-title">{{ t('mainPlan.operatingMileageRuleConfiguration') }}</div>
        <!-- 保养规则周期值 + 提前量 -->
        <el-form-item
          v-if="configDialog.current?.mileageRule === 0"
          :label="t('mainPlan.operatingMileageCycle')"
          prop="nextRunningKilometers">
          <el-input-number
            v-model="configDialog.form.nextRunningKilometers"
            :precision="2"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
        <el-form-item
          v-if="configDialog.current?.mileageRule === 0"
          :label="t('mainPlan.OperatingMileageCycle_lead')"
          prop="kiloCycleLead">
          <el-input-number
            v-model="configDialog.form.kiloCycleLead"
            :precision="2"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
      </div>

      <div class="form-group" v-if="configDialog.current?.runningTimeRule === 0">
        <div class="group-title">{{ t('mainPlan.RunTimeRuleConfiguration') }}</div>
        <el-form-item
          v-if="configDialog.current?.runningTimeRule === 0"
          :label="t('mainPlan.RunTimeCycle')"
          prop="nextRunningTime">
          <el-input-number
            v-model="configDialog.form.nextRunningTime"
            :precision="1"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
        <el-form-item
          v-if="configDialog.current?.runningTimeRule === 0"
          :label="t('mainPlan.RunTimeCycle_Lead')"
          prop="timePeriodLead">
          <el-input-number
            v-model="configDialog.form.timePeriodLead"
            :precision="1"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
      </div>

      <div class="form-group" v-if="configDialog.current?.naturalDateRule === 0">
        <div class="group-title">{{ t('mainPlan.NaturalDayRuleConfig') }}</div>
        <el-form-item
          v-if="configDialog.current?.naturalDateRule === 0"
          :label="t('mainPlan.NaturalDailyCycle')"
          prop="nextNaturalDate">
          <el-input-number
            v-model="configDialog.form.nextNaturalDate"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
        <el-form-item
          v-if="configDialog.current?.naturalDateRule === 0"
          :label="t('mainPlan.NaturalDailyCycle_Lead')"
          prop="naturalDatePeriodLead">
          <el-input-number
            v-model="configDialog.form.naturalDatePeriodLead"
            :min="0"
            :controls="false"
            controls-position="right"
            style="width: 60%"
            disabled />
        </el-form-item>
      </div>

      <!-- 运行记录模板中 多个 累计运行时长 累计运行里程 属性匹配-->
      <div
        class="form-group"
        v-if="
          (configDialog.current?.runningTimeRule === 0 ||
            configDialog.current?.mileageRule === 0) &&
          (configDialog.current?.timeAccumulatedAttrs?.length ||
            configDialog.current?.mileageAccumulatedAttrs?.length) &&
          !configDialog.current.totalRunTime &&
          !configDialog.current.totalMileage
        ">
        <div class="group-title">{{ t('mainPlan.accumulatedParams') }}</div>
        <!-- 累计运行时长 -->
        <el-form-item
          v-if="
            configDialog.current?.runningTimeRule === 0 &&
            configDialog.current?.timeAccumulatedAttrs?.length &&
            !configDialog.current.totalRunTime
          "
          :label="t('mainPlan.accumulatedRunTime')"
          prop="accumulatedTimeOption"
          :rules="[
            {
              required:
                configDialog.current?.runningTimeRule === 0 &&
                configDialog.current?.timeAccumulatedAttrs?.length,
              message: '请选择累计运行时长',
              trigger: 'change'
            }
          ]">
          <el-select
            v-model="configDialog.form.accumulatedTimeOption"
            placeholder="请选择累计运行时长"
            style="width: 80%"
            clearable
            @change="handleAccumulatedTimeChange"
            disabled>
            <el-option
              v-for="(item, index) in configDialog.current.timeAccumulatedAttrs"
              :key="`time-${item.pointName}-${index}`"
              :label="item.pointName"
              :value="item.pointName" />
          </el-select>
        </el-form-item>
        <!-- 累计运行公里数 -->
        <el-form-item
          v-if="
            configDialog.current?.mileageRule === 0 &&
            configDialog.current?.mileageAccumulatedAttrs?.length &&
            !configDialog.current.totalMileage
          "
          :label="t('mainPlan.accumulatedMileage')"
          prop="accumulatedMileageOption"
          :rules="[
            {
              required:
                configDialog.current?.mileageRule === 0 &&
                configDialog.current?.mileageAccumulatedAttrs?.length,
              message: '请选择累计运行公里数',
              trigger: 'change'
            }
          ]">
          <el-select
            v-model="configDialog.form.accumulatedMileageOption"
            placeholder="请选择累计运行公里数"
            style="width: 80%"
            clearable
            @change="handleAccumulatedMileageChange"
            disabled>
            <el-option
              v-for="(item, index) in configDialog.current.mileageAccumulatedAttrs"
              :key="`mileage-${item.pointName}-${index}`"
              :label="item.pointName"
              :value="item.pointName" />
          </el-select>
        </el-form-item>
      </div>
    </el-form>
    <template #footer>
      <el-button @click="configDialog.visible = false">{{ t('common.cancel') }}</el-button>
    </template>
  </el-dialog>
</template>
<script setup lang="ts">
import { IotMaintainApi } from '@/api/pms/maintain'
import { IotDeviceApi } from '@/api/pms/device'
import * as UserApi from '@/api/system/user'
import { useUserStore } from '@/store/modules/user'
import { ref } from 'vue'
import { IotMaintenanceBomApi, IotMaintenanceBomVO } from '@/api/pms/iotmaintenancebom'
import { IotMaintenancePlanApi } from '@/api/pms/maintenance'
import { useTagsViewStore } from '@/store/modules/tagsView'
import MainPlanDeviceList from '@/views/pms/maintenance/maintenance-device-list.vue'
import * as DeptApi from '@/api/system/dept'
import { erpPriceTableColumnFormatter } from '@/utils'
import dayjs from 'dayjs'

/** 保养计划 表单 */
defineOptions({ name: 'IotMaintenancePlanDetail' })

const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const { delView } = useTagsViewStore() // 视图操作
const { currentRoute, push } = useRouter()
const deptUsers = ref<UserApi.UserVO[]>([]) // 用户列表
const dept = ref() // 当前登录人所属部门对象
const configFormRef = ref() // 配置弹出框对象
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const deviceLabel = ref('') // 表单的类型：create - 新增；update - 修改
const list = ref<IotMaintenanceBomVO[]>([]) // 设备bom关联列表的数据
const deviceIds = ref<number[]>([]) // 已经选择的设备id数组
const { params, name } = useRoute() // 查询参数
const id = params.id
const formData = ref({
  id: undefined,
  deptId: undefined,
  name: '',
  serialNumber: undefined,
  responsiblePerson: undefined,
  remark: undefined,
  failureName: undefined,
  status: undefined
})
const formRules = reactive({
  name: [{ required: true, message: '计划名称不能为空', trigger: 'blur' }],
  responsiblePerson: [{ required: true, message: '责任人不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref

// 新增配置相关状态
const configDialog = reactive({
  visible: false,
  current: null as IotMaintenanceBomVO | null,
  form: {
    lastRunningKilometers: 0,
    lastRunningTime: 0,
    lastNaturalDate: '',
    // 保养规则 周期
    nextRunningKilometers: 0,
    nextRunningTime: 0,
    nextNaturalDate: 0,
    // 提前量
    kiloCycleLead: 0,
    timePeriodLead: 0,
    naturalDatePeriodLead: 0,
    // 多个累计时长 累计里程 匹配
    accumulatedTimeOption: null, // 累计运行时长选项
    accumulatedMileageOption: null // 累计运行公里数选项
  }
})

// 打开配置对话框
const openConfigDialog = (row: IotMaintenanceBomVO) => {
  configDialog.current = row

  // 处理日期初始化（核心修改）
  let initialDate = ''
  if (row.lastNaturalDate) {
    // 如果已有值：时间戳 -> 日期字符串
    initialDate = dayjs(row.lastNaturalDate).format('YYYY-MM-DD')
  } else {
    // 如果无值：设置默认值避免1970问题
    initialDate = ''
  }

  configDialog.form = {
    lastRunningKilometers: row.lastRunningKilometers || 0,
    lastRunningTime: row.lastRunningTime || 0,
    lastNaturalDate: initialDate,
    // 保养规则 周期值
    nextRunningKilometers: row.nextRunningKilometers || 0,
    nextRunningTime: row.nextRunningTime || 0,
    nextNaturalDate: row.nextNaturalDate || 0,
    // 提前量
    kiloCycleLead: row.kiloCycleLead || 0,
    timePeriodLead: row.timePeriodLead || 0,
    naturalDatePeriodLead: row.naturalDatePeriodLead || 0
  }

  configDialog.form.accumulatedTimeOption = row.code || null
  configDialog.form.accumulatedMileageOption = row.type || null

  configDialog.visible = true
}

// 保存配置
const saveConfig = () => {
  ;(configFormRef.value as any).validate((valid: boolean) => {
    if (!valid) return
    if (!configDialog.current) return

    // 动态校验逻辑
    const requiredFields = []
    if (configDialog.current.mileageRule === 0) {
      requiredFields.push('nextRunningKilometers', 'kiloCycleLead')
    }
    if (configDialog.current.runningTimeRule === 0) {
      requiredFields.push('nextRunningTime', 'timePeriodLead')
    }
    if (configDialog.current.naturalDateRule === 0) {
      requiredFields.push('nextNaturalDate', 'naturalDatePeriodLead')
    }

    const missingFields = requiredFields.filter(
      (field) => !configDialog.form[field as keyof typeof configDialog.form]
    )

    if (missingFields.length > 0) {
      message.error('请填写所有必填项')
      return
    }

    // 强制校验逻辑
    if (configDialog.current.naturalDateRule === 0) {
      if (!configDialog.form.lastNaturalDate) {
        message.error('必须选择自然日期')
        return
      }

      // 验证日期有效性
      const dateValue = dayjs(configDialog.form.lastNaturalDate)
      if (!dateValue.isValid()) {
        message.error('日期格式不正确')
        return
      }
    }

    // 转换逻辑（关键修改）
    const finalDate = configDialog.form.lastNaturalDate
      ? dayjs(configDialog.form.lastNaturalDate).valueOf()
      : null // 改为null而不是0

    // 更新当前行的数据
    Object.assign(configDialog.current, {
      ...configDialog.form,
      lastNaturalDate: finalDate
    })
    configDialog.visible = false
  })
}

const queryParams = reactive({
  planId: id
})

const deviceChoose = async (selectedDevices) => {
  const newIds = selectedDevices.map((device) => device.id)
  deviceIds.value = [...new Set([...deviceIds.value, ...newIds])]
  const params = {
    deviceIds: deviceIds.value.join(',') // 明确传递数组参数
  }
  queryParams.deviceIds = JSON.parse(JSON.stringify(params.deviceIds))
  // 根据选择的设备筛选出设备关系的分类BOM中与保养相关的节点项
  const res = await IotDeviceApi.deviceAssociateBomList(queryParams)
  const rawData = res || []
  if (rawData.length === 0) {
    message.error('选择的设备不存在待保养BOM项')
  }
  if (!Array.isArray(rawData)) {
    console.error('接口返回数据结构异常:', rawData)
    return
  }
  // 转换数据结构（根据你的接口定义调整）
  const newItems = rawData.map((device) => ({
    assetClass: device.assetClass,
    deviceCode: device.deviceCode,
    deviceName: device.deviceName,
    deviceStatus: device.deviceStatus,
    deptName: device.deptName,
    name: device.name,
    code: device.code,
    assetProperty: device.assetProperty,
    remark: null, // 初始化备注
    deviceId: device.id, // 移除操作需要
    bomNodeId: device.bomNodeId,
    totalRunTime: device.totalRunTime,
    totalMileage: device.totalMileage,
    nextRunningKilometers: 0,
    nextRunningTime: 0,
    nextNaturalDate: 0,
    lastNaturalDate: null, // 初始化为null而不是0
    // 保养规则 提前量
    kiloCycleLead: 0,
    timePeriodLead: 0,
    naturalDatePeriodLead: 0
  }))
  // 获取选择的设备相关的id数组
  newItems.forEach((item) => {
    deviceIds.value.push(item.deviceId)
  })
  // 合并到现有列表（去重）
  newItems.forEach((item) => {
    const exists = list.value.some(
      (existing) => existing.deviceId === item.deviceId && existing.bomNodeId === item.bomNodeId
    )
    if (!exists) {
      list.value.push(item)
    }
  })
}

const deviceFormRef = ref<InstanceType<typeof MainPlanDeviceList>>()
const openForm = () => {
  deviceFormRef.value?.open()
}

const close = () => {
  delView(unref(currentRoute))
  push({ name: 'IotMaintenancePlan', params: {} })
}

// 累计运行时长变更
const handleAccumulatedTimeChange = (option) => {}

// 累计运行公里数变更
const handleAccumulatedMileageChange = (option) => {}

/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
  // 校验表单
  await formRef.value.validate()
  // 校验表格数据
  const isValid = validateTableData()
  if (!isValid) return
  // 提交请求
  formLoading.value = true
  try {
    const data = {
      mainPlan: formData.value,
      mainPlanBom: list.value
    }
    if (formType.value === 'create') {
      await IotMaintenancePlanApi.createIotMaintenancePlan(data)
      message.success(t('common.createSuccess'))
      close()
    } else {
      await IotMaintainApi.updateIotMaintain(data)
      message.success(t('common.updateSuccess'))
      close()
    }
    // 发送操作成功的事件
    emit('success')
  } finally {
    formLoading.value = false
  }
}

// 新增表单校验规则
const configFormRules = reactive({
  nextRunningKilometers: [
    {
      required: true,
      message: '里程周期必须填写',
      trigger: 'blur'
    }
  ],
  kiloCycleLead: [
    {
      required: true,
      message: '提前量必须填写',
      trigger: 'blur'
    }
  ],
  nextRunningTime: [
    {
      required: true,
      message: '时间周期必须填写',
      trigger: 'blur'
    }
  ],
  timePeriodLead: [
    {
      required: true,
      message: '提前量必须填写',
      trigger: 'blur'
    }
  ],
  nextNaturalDate: [
    {
      required: true,
      message: '自然日周期必须填写',
      trigger: 'blur'
    }
  ],
  naturalDatePeriodLead: [
    {
      required: true,
      message: '提前量必须填写',
      trigger: 'blur'
    }
  ]
})

/** 校验表格数据 */
const validateTableData = (): boolean => {
  let isValid = true
  const errorMessages: string[] = []
  const noRulesErrorMessages: string[] = [] // 未设置任何保养项规则 的错误提示信息
  const noRules: string[] = [] // 行记录中设置了保养规则的记录数量
  const configErrors: string[] = [] // 保养规则配置弹出框
  let shouldBreak = false

  if (list.value.length === 0) {
    errorMessages.push('请至少添加一条设备保养明细')
    isValid = false
    // 直接返回无需后续校验
    message.error('请至少添加一条设备保养明细')
    return isValid
  }

  list.value.forEach((row, index) => {
    if (shouldBreak) return
    const rowNumber = index + 1 // 用户可见的行号从1开始
    const deviceIdentifier = `${row.deviceCode}-${row.name}` // 设备标识
    // 校验逻辑
    const checkConfig = (ruleName: string, ruleValue: number, configField: keyof typeof row) => {
      if (ruleValue === 0) {
        // 规则开启
        if (!row[configField] || row[configField] <= 0) {
          configErrors.push(
            `第 ${rowNumber} 行（${deviceIdentifier}）：请点击【配置】维护${ruleName}上次保养值`
          )
          isValid = false
        }
      }
    }
    // 里程校验逻辑
    if (row.mileageRule === 0) {
      // 假设 0 表示开启状态
      if (!row.nextRunningKilometers || row.nextRunningKilometers <= 0) {
        errorMessages.push(`第 ${rowNumber} 行：开启里程规则必须填写有效的里程周期`)
        isValid = false
      }
      // 再校验配置值
      checkConfig('里程', row.mileageRule, 'lastRunningKilometers')
    } else {
      noRules.push(`第 ${rowNumber} 行：未设置里程规则`)
    }
    // 运行时间校验逻辑
    if (row.runningTimeRule === 0) {
      if (!row.nextRunningTime || row.nextRunningTime <= 0) {
        errorMessages.push(`第 ${rowNumber} 行：开启运行时间规则必须填写有效的时间周期`)
        isValid = false
      }
      checkConfig('运行时间', row.runningTimeRule, 'lastRunningTime')
    } else {
      noRules.push(`第 ${rowNumber} 行：未设置运行时间规则`)
    }
    // 自然日期校验逻辑
    if (row.naturalDateRule === 0) {
      if (!row.nextNaturalDate) {
        errorMessages.push(`第 ${rowNumber} 行：开启自然日期规则必须填写有效的自然日期周期`)
        isValid = false
      }
      checkConfig('自然日期', row.naturalDateRule, 'lastNaturalDate')
    } else {
      noRules.push(`第 ${rowNumber} 行：未设置自然日期规则`)
    }
    // 如果选中的一行记录未设置任何保养规则 提示 ‘保养项未设置任何保养规则’
    if (noRules.length === 3) {
      isValid = false
      shouldBreak = true // 设置标志变量为true，退出循环
      noRulesErrorMessages.push('保养项至少设置1个保养规则')
    }
    noRules.length = 0
  })
  if (errorMessages.length > 0) {
    message.error('设置保养规则后，请维护对应的周期值')
  } else if (noRulesErrorMessages.length > 0) {
    message.error(noRulesErrorMessages.pop())
  } else if (configErrors.length > 0) {
    message.error(configErrors.pop())
  }
  return isValid
}

/** 重置表单 */
const resetForm = () => {
  formData.value = {
    id: undefined,
    failureName: undefined,
    deviceId: undefined,
    status: undefined,
    ifStop: undefined,
    failureTime: undefined,
    failureInfluence: undefined,
    failureSystem: undefined,
    description: undefined,
    pic: undefined,
    solution: undefined,
    maintainStartTime: undefined,
    maintainEndTime: undefined,
    remark: undefined,
    deviceName: undefined,
    processInstanceId: undefined,
    auditStatus: undefined,
    deptId: undefined
  }
  formRef.value?.resetFields()
}
onMounted(async () => {
  const deptId = useUserStore().getUser.deptId
  // 查询当前登录人所属部门名称
  dept.value = await DeptApi.getDept(deptId)
  // 根据当前登录人部门信息生成生成 保养计划 名称
  formData.value.name = dept.value.name + ' - 保养计划'
  deptUsers.value = await UserApi.getDeptUsersByDeptId(deptId)
  formData.value.deptId = deptId
  // if (id){
  formType.value = 'update'
  const plan = await IotMaintenancePlanApi.getIotMaintenancePlan(id)
  deviceLabel.value = plan.deviceName
  formData.value = plan
  // 查询保养责任人
  const personId = formData.value.responsiblePerson ? Number(formData.value.responsiblePerson) : 0
  UserApi.getUser(personId).then((res) => {
    formData.value.responsiblePerson = res.nickname
  })
  // 查询保养计划明细
  const data = await IotMaintenanceBomApi.getMainPlanBOMs(queryParams)
  list.value = []
  if (Array.isArray(data)) {
    list.value = data.map((item) => ({
      ...item,
      // 这里可以添加必要的字段转换（如果有日期等需要格式化的字段）
      lastNaturalDate: item.lastNaturalDate
        ? dayjs(item.lastNaturalDate).format('YYYY-MM-DD')
        : null
    }))
  }
})
const handleDelete = async (str: string) => {
  try {
    const index = list.value.findIndex((item) => item.id + '-' + item.bomNodeId === str)
    if (index !== -1) {
      // 通过 splice 删除元素
      list.value.splice(index, 1)
      deviceIds.value = []
    }
  } catch {}
}
</script>
<style scoped>
.base-expandable-content {
  overflow: hidden; /* 隐藏溢出的内容 */
  transition: max-height 0.3s ease; /* 平滑过渡效果 */
}

:deep(.el-input-number .el-input__inner) {
  padding-left: 10px; /* 保持左侧间距 */
  text-align: left !important;
}

/* 分组容器样式 */
.form-group {
  position: relative;
  padding: 20px 15px 10px;
  margin-bottom: 18px;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  transition: border-color 0.2s;
}

/* 分组标题样式 */
.group-title {
  position: absolute;
  top: -10px;
  left: 20px;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 500;
  color: #606266;
  background: white;
}
</style>