<!-- 到期提醒详情 --> <script lang="ts" setup name="RemingDetailDialog"> import { ElMessage } from 'element-plus' import type { Ref } from 'vue' import { ref } from 'vue' import dayjs from 'dayjs' import type { DateModelType } from 'element-plus' import { getStandardList } from '@/api/equipment/standard/book' import type { TableColumn } from '@/components/NormalTable/table_interface' import { SCHEDULE } from '@/utils/scheduleDict' import { getDeptTreeList } from '@/api/system/dept' import { getStaffList } from '@/api/resource/register' import { toTreeList } from '@/utils/structure' import type { deptType, dictType } from '@/global' import { getDictByCode } from '@/api/system/dict' import useUserStore from '@/store/modules/user' import { addRemind } from '@/api/system/baseInfoRemindManage' // 用户信息 const emits = defineEmits(['confirm']) const user = useUserStore() const dialogFormVisible = ref(false) const loading = ref(false) const textMap: { [key: string]: string } = { edit: '编辑', add: '新建', detail: '详情', }// 字典 const form = ref({ id: '', labCode: '', // 实验室代码(字典code) labCodeName: '', // 实验室名称(字典value) remindDays: undefined, // 提醒时间 remindName: '', // 提醒名称 remindScope: [], // 提醒范围 remindTimes: undefined, // 提醒频次(每隔多少天提醒一次) taskType: '', // 任务类型(0 任务单 1 设备台账 2 标准装置 3 证书管理) }) const pageType = ref('detail') // 页面类型 const rules = { remindDays: [{ required: true, message: '提醒时间不能为空', trigger: ['blur', 'change'] }], remindScope: [{ required: true, message: '提醒范围不能为空', trigger: ['blur', 'change'] }], } const dataFormRef = ref() // -------------------------------------------字典------------------------------------------ const labCodeList = ref<dictType[]>([]) // 实验室代码 const remindNameList = ref<dictType[]>([]) // 提醒名称 // 获取字典值 async function getDict() { // 实验室代码 getDictByCode('bizLabCode').then((response) => { labCodeList.value = response.data }) // 提醒名称 getDictByCode('systemRemindManage').then((response) => { remindNameList.value = response.data }) } getDict() // ----------------------------------------------------------------------------------------- // 点击确定 const confirmSelect = () => { dataFormRef.value.validate((valid: any) => { if (valid) { loading.value = true addRemind({ ...form.value }).then(() => { ElMessage.success('新增成功') loading.value = false }).catch(() => { loading.value = false }) dialogFormVisible.value = false } }) } // 取消 const resetForm = () => { dialogFormVisible.value = false } // 初始化 const initDialog = async (type: string, row: any) => { pageType.value = type // 页面类型 form.value = { id: type === 'add' ? '' : row.id, labCode: row.labCode, // 实验室代码(字典code) labCodeName: row.labCodeName, // 实验室名称(字典value) remindDays: row.remindDays, // 提醒时间 remindName: row.remindName, // 提醒名称 remindScope: [], // 提醒范围 remindTimes: row.remindTimes, // 提醒频次(每隔多少天提醒一次) taskType: row.taskType, // 任务类型(0 任务单 1 设备台账 2 标准装置 3 证书管理) } dialogFormVisible.value = true } // 修改实验室 const changeLab = (value: string) => { const index = labCodeList.value.findIndex(item => item.value === value) if (index !== -1) { form.value.labCodeName = labCodeList.value[index].name } } // 修改提醒名称 const changeRemindName = (value: string) => { const index = remindNameList.value.findIndex(item => item.value === value) if (index !== -1) { form.value.taskType = remindNameList.value[index].value } } defineExpose({ initDialog }) </script> <template> <el-dialog v-if="dialogFormVisible" v-model="dialogFormVisible" :title="`${textMap[pageType]}到期提醒`"> <el-form ref="dataFormRef" v-loading="loading" :rules="rules" :model="form" label-well-code="right" label-width="200px"> <el-form-item label="实验室代码" prop="labCode"> <el-select v-model="form.labCode" :placeholder="pageType === 'detail' ? ' ' : '请选择实验室代码'" :disabled="pageType !== 'add'" class="full-width-input" @change="changeLab"> <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" /> </el-select> </el-form-item> <el-form-item label="提醒名称" prop="name"> <el-select v-model="form.remindName" :placeholder="pageType === 'detail' ? ' ' : '请选择实验室代码'" :disabled="pageType !== 'add'" class="full-width-input" @change="changeRemindName"> <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.name" /> </el-select> </el-form-item> <el-form-item label="提醒时间(按到期前提示)" prop="remindDays"> <el-input-number v-model="form.remindDays" :placeholder="pageType === 'detail' ? '' : '到期前XX天'" :disabled="pageType === 'detail'" :precision="0" :min="1" :max="730" style="width: 180px;" /> <span class="message">(最大不超过2年)</span> </el-form-item> <el-form-item label="提醒范围" prop="remindScope"> <el-checkbox-group v-model="form.remindScope"> <el-checkbox label="综合管理组" /> <el-checkbox label="所在部门全部人员" /> </el-checkbox-group> </el-form-item> <el-form-item label="提醒频次" prop="remindTimes"> <span style="margin-right: 6px;">每隔</span> <el-input-number v-model="form.remindTimes" :placeholder="pageType === 'detail' ? '' : '提醒频次'" :disabled="pageType === 'detail' || !form.remindDays" :precision="0" :min="0" :max="form.remindDays" style="width: 180px;" /> <span style="margin-left: 6px;">天提醒一次</span> <span class="message">(频次不能超过提醒时间)</span> </el-form-item> </el-form> <template #footer> <span class="dialog-footer"> <el-button type="primary" @click="confirmSelect">确认</el-button> <el-button @click="resetForm"> 取消 </el-button> </span> </template> </el-dialog> </template> <style lang="scss" scoped> .message { font-size: 12px; color: #7f7f7f; margin-left: 10px; } </style>