<!-- 配置周维护月保养 --> <script lang="ts" setup name="ConfigWeekAndMonthDialog"> import type { FormInstance, FormRules } from 'element-plus' import { ElMessage } from 'element-plus' import { reactive, ref } from 'vue' import SelectStaffDialog from '@/views/business/fieldTest/approve/dialog/selectStaffDialog.vue' import { SCHEDULE } from '@/utils/scheduleDict' import { submit } from '@/api/equipment/info/book' import { batchConfigEquipmentWeekOrMonth, getEquipmentWeekOrMonthDetail } from '@/api/equipment/resume/week-month' const emit = defineEmits(['onSuccess']) // 对外暴露的方法 const dialogVisible = ref(false) // 弹窗显示状态 const form = ref({ openWeek: 1, // 是否配置周维护 openMonth: 1, // 是否配置月保养 staffNamesWeek: '', // 周维护责任人名字 staffIdsWeek: '', // 周维护责任id staffNamesMonth: '', // 月保养责任人名字 staffIdsMonth: '', // 月保养责任人id remindDateWeek: '', // 提醒时间-周维护 remindDateMonth: 1, // 提醒时间-月保养 remindItemWeek: ['1', '2', '3', '4', '5', '6', '7'], // 默认提醒项目周维护 remindItemMonth: ['1', '2', '3', '4', '5', '6', '7'], // 默认提醒项目月保养 }) const remindTimeList = [ // 提醒时间列表 { value: '1', name: '周一', }, { value: '2', name: '周二', }, { value: '3', name: '周三', }, { value: '4', name: '周四', }, { value: '5', name: '周五', }, { value: '6', name: '周六', }, { value: '7', name: '周日', }, ] const remindItemList = [ // 提醒项目 { value: '1', name: '外观检查', }, { value: '2', name: '智能模型功能、性能检查', }, { value: '3', name: '智能模型加电检查', }, { value: '4', name: '智能模型油液检查', }, { value: '5', name: '备附件和资料检查', }, { value: '6', name: '软件检查、杀毒', }, { value: '7', name: '校准因子', }, ] // 保存按钮加载状态 const btnLoading = ref(false) const equipmentIds = ref<string[]>([]) // ---------------表单提交-------------------------------- // 表单对象 const dataFormRef = ref<FormInstance>() // 校验规则 const rules = reactive<FormRules>({ staffNamesWeek: [{ required: true, message: '责任人必填', trigger: ['blur', 'change'] }], staffNamesMonth: [{ required: true, message: '责任人必填', trigger: ['blur', 'change'] }], remindDateWeek: [{ required: true, message: '提醒时间必填', trigger: ['blur', 'change'] }], remindItemWeek: [{ required: true, message: '默认提醒项目必填', trigger: ['blur', 'change'] }], remindItemMonth: [{ required: true, message: '默认提醒项目必填', trigger: ['blur', 'change'] }], remindDateMonth: [{ required: true, message: '提醒时间必填', trigger: ['blur', 'change'] }], }) /** * 初始化审批弹窗 */ function initDialog(checkoutList: string[]) { equipmentIds.value = checkoutList dialogVisible.value = true } // 提交表单 function submitForm(formEl: FormInstance | undefined) { if (!formEl) { return } if (!form.value.openWeek && !form.value.openMonth) { ElMessage.warning('未配置不可提交') return } formEl.validate((valid) => { if (valid) { const tempParams = { equipmentId: '', // 智能模型台账id appearanceCheckMonth: form.value.remindItemMonth.includes('1') ? 1 : 0, // 提醒项目-外观检查(月)(传1/0) appearanceCheckWeek: form.value.remindItemWeek.includes('1') ? 1 : 0, // 提醒项目-外观检查(周)(传1/0) calibrationFactorMonth: form.value.remindItemMonth.includes('7') ? 1 : 0, // 提醒项目-校准因子(月)(传1/0) calibrationFactorWeek: form.value.remindItemWeek.includes('7') ? 1 : 0, // 提醒项目-校准因子(周)(传1/0) folderCheckMonth: form.value.remindItemMonth.includes('5') ? 1 : 0, // 提醒项目-备附件和资料检查(月)(传1/0) folderCheckWeek: form.value.remindItemWeek.includes('5') ? 1 : 0, // 提醒项目-备附件和资料检查(周)(传1/0) functionCheckMonth: form.value.remindItemMonth.includes('2') ? 1 : 0, // 提醒项目-智能模型功能、性能检查(月)(传1/0) functionCheckWeek: form.value.remindItemWeek.includes('2') ? 1 : 0, // 提醒项目-智能模型功能、性能检查(周)(传1/0) id: '', // 更新/删除使用参数 oilCheckMonth: form.value.remindItemMonth.includes('4') ? 1 : 0, // 提醒项目-智能模型油液检查(月)(传1/0) oilCheckWeek: form.value.remindItemWeek.includes('4') ? 1 : 0, // 提醒项目-智能模型油液检查(周)(传1/0) openMonth: form.value.openMonth, // 是否开启月保养(传1/0) openWeek: form.value.openWeek, // 是否开启周维护(传1/0) powerCheckMonth: form.value.remindItemMonth.includes('3') ? 1 : 0, // 提醒项目-智能模型加电检查(月)(传1/0) powerCheckWeek: form.value.remindItemWeek.includes('3') ? 1 : 0, // 提醒项目-智能模型加电检查(周)(传1/0) remindDateMonth: form.value.remindItemMonth.includes('4') ? 1 : 0, // 提醒时间(每月x日,1-31的数字)(传1/0) remindDateWeek: form.value.remindDateWeek, // 提醒时间(多个逗号拼接,如1,2表示周一周二) softwareCheckMonth: form.value.remindItemMonth.includes('6') ? 1 : 0, // 提醒项目-软件检查、杀毒(月)(传1/0) softwareCheckWeek: form.value.remindItemWeek.includes('6') ? 1 : 0, // 提醒项目-软件检查、杀毒(周)(传1/0) staffIdsMonth: form.value.staffIdsMonth, // 责任人id(多个逗号拼接) staffIdsWeek: form.value.staffIdsWeek, // 责任人id(多个逗号拼接) staffNamesMonth: form.value.staffNamesMonth, // 责任人名字(多个逗号拼接) staffNamesWeek: form.value.staffNamesWeek, // 责任人名字(多个逗号拼接) } const params = equipmentIds.value.map((item) => { return { ...tempParams, equipmentId: item, } }) console.log(params) btnLoading.value = true batchConfigEquipmentWeekOrMonth(params).then((res) => { ElMessage.success('智能模型维护保养配置成功') btnLoading.value = false dialogVisible.value = false emit('onSuccess') }).catch((_) => { btnLoading.value = false }) } }) } // 关闭弹窗 function handleClose() { dataFormRef.value?.resetFields() dialogVisible.value = false } // ---------------------------------------------选择计量人员-------------------------------------- const selectStaffDialogRef = ref() // 选择计量人员组件ref const selectType = ref('') // 选择类型 const selectStaffWeek = ref([]) // 周维护选择的加量人员列表 const selectStaffMonth = ref([]) // 月保养选择的加量人员列表 // 点击选择责任人 const selectStaff = (type: 'week' | 'month') => { selectType.value = type selectStaffDialogRef.value.initDialog() } // 确定选择计量人员 const confirmSelectStaff = (list = []) => { if (Array.isArray(list) && list.length) { switch (selectType.value) { case 'week': selectStaffWeek.value = list form.value.staffIdsWeek = list.map((item: { id: string }) => item.id).join(',') // 周维护责任人 form.value.staffNamesWeek = list.map((item: { staffName: string }) => item.staffName).join(',') // 周维护责任人 break case 'month': selectStaffMonth.value = list form.value.staffIdsMonth = list.map((item: { id: string }) => item.id).join(',') // 月保养责任人 form.value.staffNamesMonth = list.map((item: { staffName: string }) => item.staffName).join(',') // 月保养责任人 break } } } // ----------------------- 以下是暴露的方法内容 ---------------------------- defineExpose({ initDialog }) </script> <template> <el-dialog v-model="dialogVisible" title="维护保养配置" width="65%" :before-close="handleClose" class="config-week-month-dialog" > <el-form ref="dataFormRef" v-loading="btnLoading" label-position="left" label-width="130px" :model="form" :rules="rules" > <el-row :gutter="24"> <el-col :span="24" style="margin-bottom: 20px;"> <el-checkbox v-model="form.openWeek" :true-label="1" :false-label="0"> 是否开启周维护 </el-checkbox> </el-col> <el-col v-if="form.openWeek" :span="24" style="display: flex;align-items: center;justify-content: space-between;"> <el-form-item label="责任人:" prop="staffNamesWeek" style="flex: 1;"> <el-input v-model="form.staffNamesWeek" placeholder="请选择责任人" type="textarea" auto-size disabled style="width: 100%;margin-right: 20px;" /> </el-form-item> <el-button size="small" type="primary" @click="selectStaff('week')"> 选择 </el-button> </el-col> <el-col v-if="form.openWeek" :span="24"> <el-form-item label="提醒时间:" prop="remindDateWeek"> <el-radio-group v-model="form.remindDateWeek" class="radio-group"> <el-radio v-for="row of remindTimeList" :key="row.value" :label="row.value" class="radio-line"> {{ row.name }} </el-radio> </el-radio-group> </el-form-item> </el-col> <el-col v-if="form.openWeek" :span="24"> <el-form-item label="默认提醒项目:" prop="remindItemWeek"> <el-checkbox-group v-for="item in remindItemList" :key="item.value" v-model="form.remindItemWeek"> <el-checkbox :label="item.value" style="margin-right: 32px;"> {{ item.name }} </el-checkbox> </el-checkbox-group> </el-form-item> </el-col> </el-row> <el-row :gutter="24"> <el-col :span="24" style="margin-bottom: 20px;"> <el-checkbox v-model="form.openMonth" :true-label="1" :false-label="0"> 是否开启月保养 </el-checkbox> </el-col> <el-col v-if="form.openMonth" :span="24" style="display: flex;align-items: center;justify-content: space-between;"> <el-form-item label="责任人:" prop="staffNamesMonth" style="flex: 1;"> <el-input v-model="form.staffNamesMonth" placeholder="请选择责任人" type="textarea" auto-size disabled style="width: 100%;margin-right: 20px;" /> </el-form-item> <el-button size="small" type="primary" @click="selectStaff('month')"> 选择 </el-button> </el-col> <el-col v-if="form.openMonth" :span="24"> <el-form-item label="提醒时间:" prop="remindDateMonth"> <span>每月: </span> <el-input-number v-model="form.remindDateMonth" :precision="0" :step="1" :min="1" :max="31" /> <span style="margin-left: 10px;"> 日</span> </el-form-item> </el-col> <el-col v-if="form.openMonth" :span="24"> <el-form-item label="默认提醒项目:" prop="remindItemMonth"> <el-checkbox-group v-for="item in remindItemList" :key="item.value" v-model="form.remindItemMonth"> <el-checkbox :label="item.value" style="margin-right: 32px;"> {{ item.name }} </el-checkbox> </el-checkbox-group> </el-form-item> </el-col> </el-row> </el-form> <template #footer> <el-button type="primary" :loading="btnLoading" @click="submitForm(dataFormRef)"> 提交 </el-button> <el-button type="info" @click="handleClose"> 取消 </el-button> </template> </el-dialog> <!-- 选择计量人员 --> <select-staff-dialog ref="selectStaffDialogRef" @confirm="confirmSelectStaff" /> </template> <style lang="scss"> .config-week-month-dialog { .el-radio__label { display: block !important; } } </style>