<!-- 周维护、月保养详情公共组件 -->
<script lang="ts" setup name="EquipementResumeWeekMonthDetail">
import { ref } from 'vue'
import dayjs from 'dayjs'
import { ElLoading, ElMessage } from 'element-plus'
import type { IForm } from '../week-interface'
import useUserStore from '@/store/modules/user'
import SelectEquipmentDialog from '@/views/business/fieldTest/approve/dialog/selectEquipmentDialog.vue'
import { getDictByCode } from '@/api/system/dict'
import type { deptType, dictType } from '@/global'
import { useArrayDataUnique } from '@/commonMethods/useArrayDataUnique'
import { addResumeWeekMonthList, addResumeWeekMonthRecord, batchAddResumeWeekMonthRecord, getEquipmentWeekOrMonthDetail, getInfo, getStream, updateResumeWeekMonthList, updateResumeWeekMonthRecord } from '@/api/equipment/resume/week-month'
import { exportFile } from '@/utils/exportUtils'
import { useCheckList } from '@/commonMethods/useCheckList'
import { useDoubleClickTableRow, useSetAllRowReadable } from '@/commonMethods/useSetAllRowReadable'
const props = defineProps({
  title: {
    type: String,
    default: '周维护',
  },
  pageTypeValue: {
    type: String,
    default: 'detail',
  },
  maintainType: { // 保养类型(1 周维护/2 月保养)
    type: String,
    default: '1',
  },
  infoId: String, // id
})
const user = useUserStore() // 用户信息
const textMap: { [key: string]: string } = {
  edit: '编辑',
  add: '新建',
  detail: '详情',
}// 字典
const $router = useRouter() // 关闭页面使用
const $route = useRoute() // 路由参数
const pageType = ref('add') // 页面类型: add, edit, detail
const currentTab = ref('') // 1待维护、2全部维护记录
const ruleFormRef = ref() // 表单ref
const batchAddRecordEquipmentList = ref([]) as any
const form = ref<IForm>({
  id: '', //		id，更新/删除使用参数
  logNo: '', //		文件编号
  logName: '', //		文件编号
  labCode: '', //		实验室代码(字典code)
  labCodeName: '', //		实验室代码(字典value)
  groupCode: '', //		组别代码(字典code)
  groupCodeName: '', //		组别代码(字典value)
  createTime: '', //		记录时间
  createUserId: '', //		记录人id
  createUserName: '', //		记录人
  remark: '', //		备注
  equipmentId: '', //		智能模型台账id
  equipmentName: '', //		智能模型名称(智能模型名称+规格型号+出厂编号)
  checkResult: '', //	检查结果(字典code)
  checkResultName: '', //		检查结果(字典value)
  maintainType: Number(props.maintainType), //		保养类型(1 周维护/2 月保养)
})
// 校验规则
const formRules = ref({
  groupCode: [{ required: true, message: '部门不能为空', trigger: ['blur', 'change'] }],
  labCode: [{ required: true, message: '实验室不能为空', trigger: ['blur', 'change'] }],
})
const loading = ref(false)

// ------------------------------------------字典----------------------------------------------
const useDeptList = ref<deptType[]>([]) // 所属部门列表
const useDeptDict = ref([]) as any // 所属部门字典
const labNameList = ref<deptType[]>([]) // 实验室列表
const labNameDict = ref([]) as any // 实验室字典
/**
 * 获取字典
 */
async function getDict() {
  // 实验室
  const responseLab = await getDictByCode('bizGroupCodeEquipment')
  labNameList.value = responseLab.data
  labNameList.value.forEach((item) => {
    labNameDict.value[item.value] = item.name
  })
  // 部门
  const responseDept = await getDictByCode('bizGroupCode')
  useDeptList.value = responseDept.data
  responseDept.data.forEach((item: any) => {
    useDeptDict.value[item.value] = item.name
  })
}
// -------------------------------------------表格----------------------------------------------
const columns = ref([ // 表头
  { text: '维护项目', value: 'checkItem', align: 'center', required: true },
  { text: '检查结果', value: 'checkResult', align: 'center', required: true, width: '180' },
  { text: '备注', value: 'checkRemark', align: 'center', required: false },
])
const list = ref([]) as any // 表格数据
const checkoutList = ref([]) as any // 多选表格数据
// 选中
const handleSelectionChange = (e: any) => {
  checkoutList.value = e
}
// 校验维护项目有没有重复
const checkItemUnique = () => {
  const result = useArrayDataUnique(list.value, 'checkItem')
  if (!result) {
    ElMessage.warning('表格中存在重复维护项目，请检查！')
    return false
  }
  return true
}
// 增加行
const addRow = () => {
  if (!form.value.equipmentId && $route.query.fromTab !== 'toBeMaintained' && $route.query.fromTab !== 'batchToBeMaintained') {
    ElMessage.warning('请先选择智能模型！')
    return false
  }
  if (!checkItemUnique()) { return false }
  if (!useCheckList(list.value, columns.value, '维护保养信息')) {
    return false
  }
  if (!useCheckList(list.value, columns.value, '维护保养信息', 'checkRemark', 'checkResult', '0')) {
    return false
  }
  list.value.push({
    checkItem: '',
    checkResult: list.value.length ? list.value[list.value.length - 1].checkResult : '1',
    checkRemark: list.value.length ? list.value[list.value.length - 1].checkRemark : '/',
    customer: true, // 是否是自定义的项目（不是在智能模型台账管理里面配置的维护项目）
  })
}
// 删除行
const deleteRow = () => {
  if (!checkoutList.value.length) {
    ElMessage({
      message: '请选中要删除的行',
      type: 'warning',
    })
    return false
  }
  list.value = list.value.filter((item: any) => {
    return !checkoutList.value.includes(item)
  })
}

// --------------------------------------选择智能模型-------------------------------------------------
const selectEquipmentDialogRef = ref()

// 批量添加
const selectEquipment = () => {
  selectEquipmentDialogRef.value.initDialog(form.value.labCode, form.value.groupCode)
}

const solveListData = (res: any) => {
  switch (props.maintainType) {
    case '1': // 周维护
      if (`${res.data.appearanceCheckWeek}` === '1') {
        list.value.push({
          checkItem: '外观检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.functionCheckWeek}` === '1') {
        list.value.push({
          checkItem: '智能模型功能、性能检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.powerCheckWeek}` === '1') {
        list.value.push({
          checkItem: '智能模型加电检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.oilCheckWeek}` === '1') {
        list.value.push({
          checkItem: '智能模型油液检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.folderCheckWeek}` === '1') {
        list.value.push({
          checkItem: '备附件和资料检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.softwareCheckWeek}` === '1') {
        list.value.push({
          checkItem: '软件检查、杀毒',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.calibrationFactorWeek}` === '1') {
        list.value.push({
          checkItem: '校准因子',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      console.log(list.value)
      break
    case '2': // 月保养
      if (`${res.data.appearanceCheckMonth}` === '1') {
        list.value.push({
          checkItem: '外观检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.functionCheckMonth}` === '1') {
        list.value.push({
          checkItem: '智能模型功能、性能检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.powerCheckMonth}` === '1') {
        list.value.push({
          checkItem: '智能模型加电检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.oilCheckMonth}` === '1') {
        list.value.push({
          checkItem: '智能模型油液检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.folderCheckMonth}` === '1') {
        list.value.push({
          checkItem: '备附件和资料检查',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.softwareCheckMonth}` === '1') {
        list.value.push({
          checkItem: '软件检查、杀毒',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      if (`${res.data.calibrationFactorMonth}` === '1') {
        list.value.push({
          checkItem: '校准因子',
          checkResult: '1',
          checkRemark: '', // 备注
          checkBoxDisabled: true,
        })
      }
      break
  }
}

// 确定选择智能模型
const confirmSelectEquipment = (listParam: any = []) => {
  if (Array.isArray(listParam) && listParam.length && $route.query.fromTab !== 'toBeMaintained' && $route.query.fromTab !== 'batchToBeMaintained') {
    form.value.equipmentName = listParam[0].equipmentName + listParam[0].model + listParam[0].manufactureNo
  }
  if (listParam[0].id) {
    form.value.equipmentId = listParam[0].id
    list.value = []
    getEquipmentWeekOrMonthDetail({ id: listParam[0].id }).then((res) => {
      solveListData(res)
    })
  }
  else {
    ElMessage.warning('未获取到智能模型id，无法获取默认维护配置')
  }
}
// -------------------------------------------按钮----------------------------------------------
// 关闭新增页面的回调
const close = () => {
  $router.back()
}

// 导出pdf
const exportPdf = () => {
  const loading = ElLoading.service({
    lock: true,
    text: '加载中...',
    background: 'rgba(255, 255, 255, 0.6)',
  })
  getStream({ id: props.infoId, pdf: true }).then((res) => {
    const pdfStream = new Blob([res.data])
    exportFile(pdfStream, `${form.value.equipmentName}${props.title}.pdf`)
    loading.close()
  })
}

// 保存
const save = () => {
  if (!checkItemUnique()) { return }
  if (!list.value.length) {
    ElMessage.warning('维护保养信息不能为空')
    return false
  }
  if (!useCheckList(list.value, columns.value, '维护保养信息')) {
    return false
  }
  if (!useCheckList(list.value, columns.value, '维护保养信息', 'checkRemark', 'checkResult', '0')) {
    return false
  }
  ruleFormRef.value!.validate((valid: boolean) => {
    if (valid) {
      const loading = ElLoading.service({
        lock: true,
        background: 'rgba(255, 255, 255, 0.8)',
      })
      const tempList = list.value.filter((item: { customer: boolean }) => !item.customer)
      const params = {
        ...form.value,
        id: props.infoId,
        // 2表示没配置
        appearanceCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '外观检查').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '外观检查')[0].checkResult}` === '1' ? 1 : 0 : 2, //	外观检查(1正常0不正常)
        appearanceCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '外观检查').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '外观检查')[0].checkRemark : '', //	外观检查备注
        calibrationFactor: tempList.filter((item: { checkItem: string }) => item.checkItem === '校准因子').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '校准因子')[0].checkResult}` === '1' ? 1 : 0 : 2, //	校准因子(1正常0不正常)
        calibrationFactorRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '校准因子').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '校准因子')[0].checkRemark : '', // 校准因子备注
        folderCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '备附件和资料检查').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '备附件和资料检查')[0].checkResult}` === '1' ? 1 : 0 : 2, //		备附件和资料检查(1正常0不正常)
        folderCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '备附件和资料检查').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '备附件和资料检查')[0].checkRemark : '', //		备附件和资料检查备注
        functionCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型功能、性能检查').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型功能、性能检查')[0].checkResult}` === '1' ? 1 : 0 : 2, //		智能模型功能、性能检查(1正常0不正常)
        functionCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型功能、性能检查').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型功能、性能检查')[0].checkRemark : '', //		智能模型功能、性能检查备注
        oilCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型油液检查').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型油液检查')[0].checkResult}` === '1' ? 1 : 0 : 2, //		智能模型油液检查(1正常0不正常)
        oilCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型油液检查').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型油液检查')[0].checkRemark : '', //		智能模型油液检查备注
        powerCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型加电检查').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型加电检查')[0].checkResult}` === '1' ? 1 : 0 : 2, //		智能模型加电检查(1正常0不正常)
        powerCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型加电检查').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '智能模型加电检查')[0].checkRemark : '', //		智能模型加电检查备注
        softwareCheck: tempList.filter((item: { checkItem: string }) => item.checkItem === '软件检查、杀毒').length ? `${tempList.filter((item: { checkItem: string }) => item.checkItem === '软件检查、杀毒')[0].checkResult}` === '1' ? 1 : 0 : 2, //		软件检查、杀毒(1正常0不正常)
        softwareCheckRemark: tempList.filter((item: { checkItem: string }) => item.checkItem === '软件检查、杀毒').length ? tempList.filter((item: { checkItem: string }) => item.checkItem === '软件检查、杀毒')[0].checkRemark : '', //		软件检查、杀毒备注
        itemList: list.value.filter((item: { customer: boolean }) => item.customer),
      }
      console.log(params)
      // 新建
      if (pageType.value === 'add') {
        if ($route.query.fromTab === 'batchToBeMaintained') {
          const sendParams = batchAddRecordEquipmentList.value.map((item: any) => {
            return {
              ...params,
              id: '',
              equipmentId: item.equipmentId,
              equipmentName: item.equipmentName,
            }
          })
          batchAddResumeWeekMonthRecord(sendParams).then((res) => {
            ElMessage.success('保存成功')
            form.value.logNo = res.data.logNo // 记录表单号
            pageType.value = 'detail'
            loading.close()
          }).catch(() => {
            loading.close()
          })
        }
        else {
          addResumeWeekMonthRecord(params).then((res) => {
            ElMessage.success('保存成功')
            form.value.logNo = res.data.logNo // 记录表单号
            pageType.value = 'detail'
            loading.close()
          }).catch(() => {
            loading.close()
          })
        }
      }
      // 编辑
      else if (pageType.value === 'edit') {
        updateResumeWeekMonthRecord(params).then((res) => {
          ElMessage.success('保存成功')
          pageType.value = 'detail'
          loading.close()
        }).catch(() => {
          loading.close()
        })
      }
    }
    else {
      console.log('表单校验不通过')
    }
  })
}

// ---------------------------------------------------------------------------------------------
// 获取详情信息
const fetchInfo = () => {
  const loading = ElLoading.service({
    lock: true,
    background: 'rgba(255, 255, 255, 0.8)',
  })
  getInfo({ id: props.infoId! }).then((res) => {
    form.value = res.data

    if (`${res.data.appearanceCheck}` !== '2') {
      list.value.push({
        checkItem: '外观检查',
        checkResult: `${res.data.appearanceCheck}`,
        checkRemark: res.data.appearanceCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.functionCheck}` !== '2') {
      list.value.push({
        checkItem: '智能模型功能、性能检查',
        checkResult: `${res.data.functionCheck}`,
        checkRemark: res.data.functionCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.powerCheck}` !== '2') {
      list.value.push({
        checkItem: '智能模型加电检查',
        checkResult: `${res.data.powerCheck}`,
        checkRemark: res.data.powerCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.oilCheck}` !== '2') {
      list.value.push({
        checkItem: '智能模型油液检查',
        checkResult: `${res.data.oilCheck}`,
        checkRemark: res.data.oilCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.folderCheck}` !== '2') {
      list.value.push({
        checkItem: '备附件和资料检查',
        checkResult: `${res.data.folderCheck}`,
        checkRemark: res.data.folderCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.softwareCheck}` !== '2') {
      list.value.push({
        checkItem: '软件检查、杀毒',
        checkResult: `${res.data.softwareCheck}`,
        checkRemark: res.data.softwareCheckRemark, // 备注
        checkBoxDisabled: true,
      })
    }
    if (`${res.data.calibrationFactor}` !== '2') {
      list.value.push({
        checkItem: '校准因子',
        checkResult: `${res.data.calibrationFactor}`,
        checkRemark: res.data.calibrationFactorRemark, // 备注
        checkBoxDisabled: true,
      })
    }

    const tempItemLIst = res.data.itemList.map((item: { customer: boolean; checkResult: number }) => {
      return {
        ...item,
        checkResult: `${item.checkResult}`,
        customer: true,
      }
    })
    list.value = [...list.value, ...tempItemLIst]
    loading.close()
  })
}

// 多选框禁用
const checkSelectSet = (row: any, index: number) => {
  if (row.checkBoxDisabled) {
    return false
  }
  else {
    return true
  }
}
watch(() => props.pageTypeValue, (newVal) => {
  pageType.value = newVal
}, { immediate: true })

// 监听表格计算检查结果
watch(() => list.value, (newValue) => {
  if (Array.isArray(newValue) && newValue.length) {
    if (newValue.every(item => `${item.checkResult}` === '1')) {
      form.value.checkResultName = '正常'
      form.value.checkResult = '1'
    }
    else {
      form.value.checkResultName = '不正常'
      form.value.checkResult = '2'
    }
  }
}, { deep: true, immediate: true })

onMounted(async () => {
  await getDict()
  currentTab.value = $route.query.currentTab as string
  form.value.createUserId = user.id// 创建人
  form.value.createUserName = user.name // 创建人名字
  form.value.createTime = dayjs().format('YYYY-MM-DD HH-mm:ss')// 记录时间
  form.value.logName = props.title // 文件名称
  form.value.labCode = user.bizLabCode // 实验室
  form.value.labCodeName = user.labCodeName // 实验室名称
  form.value.groupCode = user.groupNo // 部门名称
  form.value.groupCodeName = user.groupName // 部门名称
  if (pageType.value !== 'add') {
    fetchInfo()
  }
  else { // 新建
    // 在这里，如果是从待维护跳转过来，则渲染从列表页带来的默认配置
    if ($route.query.fromTab === 'toBeMaintained') { // 新建周维护记录/月保养记录
      batchAddRecordEquipmentList.value = JSON.parse($route.query.equipmentArr as any)
      form.value.equipmentId = batchAddRecordEquipmentList.value[0].equipmentId as string
      form.value.equipmentName = batchAddRecordEquipmentList.value[0].equipmentName as string
      confirmSelectEquipment([{ id: batchAddRecordEquipmentList.value[0].equipmentId }])
    }
    else if ($route.query.fromTab === 'batchToBeMaintained') { // 批量新建记录
      batchAddRecordEquipmentList.value = JSON.parse($route.query.equipmentArr as any)
      form.value.equipmentName = batchAddRecordEquipmentList.value.map((item: { equipmentName: string }) => item.equipmentName).join(';')
      confirmSelectEquipment([{ id: batchAddRecordEquipmentList.value[0].equipmentId }])
    }
  }
})
</script>

<template>
  <div id="exportContent" class="week-month-tenplate-detail">
    <app-container v-loading="loading">
      <detail-page :title="`${props.title}-${textMap[pageType]}`">
        <template #btns>
          <el-button v-if="pageType === 'detail'" type="primary" @click="exportPdf">
            导出
          </el-button>
          <el-button v-if="pageType !== 'detail'" type="primary" @click="save">
            保存
          </el-button>
          <el-button type="info" @click="close">
            关闭
          </el-button>
        </template>
      </detail-page>
      <detail-block v-if="$route.query.fromTab === 'toBeMaintained' || $route.query.fromTab === 'batchToBeMaintained'" title="">
        <div style="padding: 0 20px;display: flex;flex-wrap: wrap;">
          <div style="font-weight: 600;font-size: 16px;white-space: nowrap;">
            已勾选智能模型：
          </div>
          <div v-for="(item, index) in batchAddRecordEquipmentList" :key="item.equipmentId">
            <el-tag
              :type="index % 2 === 0 ? 'success' : 'warning'"
              effect="plain"
              style="margin-right: 6px;margin-bottom: 6px;"
            >
              {{ item.equipmentName }}
            </el-tag>
          </div>
          <!-- <div style="color: #606266;font-size: 15px;">
            {{ form.equipmentName }}
          </div> -->
        </div>
      </detail-block>
      <detail-block title="">
        <el-form
          ref="ruleFormRef"
          :model="form"
          label-width="120"
          label-position="right"
          :rules="formRules"
        >
          <el-row :gutter="24">
            <el-col :span="6">
              <el-form-item label="文件编号:" prop="logNo">
                <el-input v-model="form.logNo" class="full-width-input" disabled placeholder="系统自动生成" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="文件名称:" prop="logName">
                <el-input v-model="form.logName" class="full-width-input" disabled placeholder="请输入文件名称" />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="实验室" prop="labCode">
                <el-select
                  v-model.trim="form.labCode"
                  placeholder="请选择实验室"
                  filterable
                  :disabled="pageType === 'detail'"
                  class="full-width-input"
                >
                  <el-option v-for="item in labNameList" :key="item.id" :label="item.name" :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="部门" prop="groupCode">
                <el-select
                  v-model.trim="form.groupCode"
                  placeholder="请选择部门"
                  filterable
                  :disabled="pageType === 'detail'"
                  class="full-width-input"
                >
                  <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="记录人:" prop="createUserName">
                <el-input
                  v-model="form.createUserName"
                  class="full-width-input"
                  :placeholder="pageType === 'detail' ? '' : '记录人'"
                  disabled
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="记录时间:" prop="createTime">
                <el-date-picker
                  v-model="form.createTime"
                  type="date"
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                  class="full-width-input"
                  :disabled="pageType === 'detail'"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="备注:" prop="remark">
                <el-input
                  v-model="form.remark"
                  class="full-width-input"
                  autosize
                  :placeholder="pageType === 'detail' ? '' : '请输入备注'"
                  type="textarea"
                  :disabled="pageType === 'detail'"
                  :maxlength="50"
                  show-word-limit
                />
              </el-form-item>
            </el-col>
            <el-col v-if="pageType === 'detail'" :span="12">
              <el-form-item label="智能模型名称:" prop="equipmentName">
                <el-input
                  v-model="form.equipmentName"
                  class="full-width-input"
                  autosize
                  type="textarea"
                  :disabled="pageType === 'detail'"
                />
              </el-form-item>
            </el-col>
            <el-col v-if="pageType !== 'detail' && $route.query.fromTab !== 'toBeMaintained' && $route.query.fromTab !== 'batchToBeMaintained'" :span="12">
              <el-form-item label="智能模型名称" prop="equipmentName">
                <el-input
                  v-model="form.equipmentName"
                  :placeholder="pageType === 'detail' ? '' : '请选择'"
                  :class="{ 'detail-input': pageType === 'detail' }"
                  disabled
                >
                  <template v-if="pageType !== 'detail'" #append>
                    <el-button size="small" @click="selectEquipment">
                      选择
                    </el-button>
                  </template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="检查结果:" prop="checkResultName">
                <el-input
                  v-model="form.checkResultName"
                  class="full-width-input"
                  :placeholder="pageType === 'detail' ? '' : '检查结果'"
                  disabled
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </detail-block>
      <detail-block title="维护保养信息">
        <template v-if="pageType !== 'detail'" #btns>
          <el-button type="primary" @click="addRow">
            增加行
          </el-button>
          <el-button type="info" @click="deleteRow">
            删除行
          </el-button>
        </template>
        <el-table
          ref="techRef"
          :data="list"
          border
          style="width: 100%;"
          @selection-change="handleSelectionChange"
        >
          <el-table-column v-if="pageType !== 'detail'" :selectable="checkSelectSet" type="selection" width="38" />
          <el-table-column align="center" label="序号" width="80" type="index" />
          <el-table-column
            v-for="item in columns"
            :key="item.value"
            :prop="item.value"
            :label="item.text"
            :width="item.width"
            align="center"
          >
            <template #header>
              <span v-show="item.required" style="color: red;">*</span><span>{{ item.text }}</span>
            </template>
            <template #default="scope">
              <el-radio-group v-if="pageType !== 'detail' && item.value === 'checkResult'" v-model="scope.row[item.value]" :disabled="pageType === 'detail'">
                <el-radio label="1">
                  正常
                </el-radio>
                <el-radio label="0">
                  不正常
                </el-radio>
              </el-radio-group>
              <span v-if="pageType === 'detail' && item.value === 'checkResult'">{{ scope.row.checkResult === '1' ? '正常' : scope.row.checkResult === '0' ? '不正常' : '未知' }}</span>
              <span v-if="scope.row.checkResult === '1' && item.value === 'checkRemark'">/</span>
              <el-input v-if="pageType !== 'detail' && ((scope.row.checkResult === '0' && item.value === 'checkRemark') || (item.value === 'checkItem' && scope.row.customer === true))" v-model.trim="scope.row[item.value]" autosize type="textarea" :autofocus="true" :placeholder="`${item.text}`" class="input" />
            </template>
          </el-table-column>
        </el-table>
      </detail-block>
    </app-container>
    <!-- 选择智能模型台账 -->
    <select-equipment-dialog ref="selectEquipmentDialogRef" :is-multi="false" @confirm="confirmSelectEquipment" />
  </div>
</template>

<style lang="scss" scoped>
.step {
  line-height: 28px;
  font-size: 20px;
  color: #3d7eff;
  font-weight: bold;
  margin-bottom: 5px;
  width: fit-content;
}
</style>

<style lang="scss">
.week-month-tenplate-detail {
  .el-radio__label {
    display: block !important;
  }
}
</style>