| | |
| | | :close-on-press-escape="false" |
| | | :close-on-click-modal="false" |
| | | > |
| | | <el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="120px" > |
| | | <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules" label-width="120px" > |
| | | <el-row :gutter="24"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin"> |
| | | <el-select v-model="state.form.companyId" placeholder="请选择" clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom"> |
| | | <el-option |
| | | v-for="item in state.companyList" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="24"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="年份:" prop="creditCode" > |
| | | <el-form-item label="年份:" prop="year" > |
| | | <!-- <el-input v-model="state.form.year" placeholder="请输入年份"></el-input>--> |
| | | <el-select |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.year" |
| | | filterable |
| | | allow-create |
| | | default-first-option |
| | | :reserve-keyword="false" |
| | | placeholder="请选择年份" |
| | | @change="handleChangeNum" |
| | | style="width: 100%" |
| | | > |
| | | <el-option |
| | | v-for="item in state.yearList" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | :value="item.label" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="序号:" prop="creditCode" > |
| | | <el-input v-model="state.form.code" placeholder="请输入序号" style="width: 100%"></el-input> |
| | | <el-form-item label="序号:" prop="num" > |
| | | <el-input :disabled="title === '查看'" v-model="state.form.num" placeholder="请输入序号" style="width: 100%"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="24"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="质量目标级别:" prop="creditCode" > |
| | | <el-form-item label="质量目标级别:" prop="type" > |
| | | <el-select |
| | | v-model="state.form.level" |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.type" |
| | | placeholder="请选择质量目标级别" |
| | | style="width: 100%" |
| | | @change="changeLevel" |
| | | > |
| | | <el-option |
| | | v-for="item in state.levelList" |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="公司名称:" prop="creditCode" v-if="state.form.level == 1"> |
| | | <el-input v-model="state.form.companyName" disabled></el-input> |
| | | <el-form-item label="公司名称:" prop="creditCode" v-if="state.form.type == 1"> |
| | | <el-input v-model="state.form.companyName" disabled></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="部门名称:" prop="creditCode" v-else-if="state.form.level == 2"> |
| | | <el-form-item label="部门名称:" prop="departId" v-else-if="state.form.type == 2"> |
| | | <!-- <el-cascader v-model="state.form.departId" :options="state.deptList" />--> |
| | | <el-select |
| | | v-model="state.form.dept" |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.departId" |
| | | placeholder="请选择部门" |
| | | style="width: 240px" |
| | | > |
| | | <el-option |
| | | v-for="item in state.deptList" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | :key="item.deptId" |
| | | :label="item.deptName" |
| | | :value="item.deptId" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | </el-row> |
| | | <el-row :gutter="24"> |
| | | <el-col :span="24"> |
| | | <el-form-item :label= "state.form.level==1 ? '公司质量目标' :state.form.level==2 ?'部门质量目标':'质量目标'" > |
| | | <div style="display: flex;width: 100%"> |
| | | <el-table :data="state.form.objectList" :border="true"> |
| | | <el-form-item required :label= "state.form.type==1 ? '公司质量目标' :state.form.type==2 ?'部门质量目标':'质量目标'" > |
| | | <div style="display: flex;width: 100%;margin-top: 5px"> |
| | | <el-table :data="state.form.qualityTargets" :border="true"> |
| | | <el-table-column type="index" label="序号" width="80" align="center"></el-table-column> |
| | | <el-table-column label="目标" align="center" > |
| | | <template #default="{row,$index}"> |
| | | <el-form-item :prop="'objectList.' + '[' + $index + ']' + '.objName'" :rules="state.rules.objName"> |
| | | <el-input v-model.number="row.objName" placeholder="请输入质量目标"></el-input> |
| | | <el-form-item :prop="'qualityTargets.' + '[' + $index + ']' + '.message'" :rules="state.rules.message"> |
| | | <el-input :disabled="title === '查看'" type="textarea" v-model="row.message" placeholder="请输入质量目标"></el-input> |
| | | </el-form-item> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width" > |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width" v-if="title !== '查看'" > |
| | | <template #default="scope" > |
| | | <el-button link type="danger" @click="handleDelete(scope.row)" >删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-button |
| | | :disabled="title === '查看'" |
| | | style="margin-left: 20px" |
| | | type="primary" |
| | | @click="addObject" |
| | |
| | | <el-row :gutter="24"> |
| | | <el-col :span="24"> |
| | | <el-form-item label="目标测量方法:" prop="method" > |
| | | <el-input v-model="state.form.method" :rows="4" type="textarea" placeholder="请输入目标测量方法"/> |
| | | <el-input :disabled="title === '查看'" v-model="state.form.method" :rows="4" type="textarea" placeholder="请输入目标测量方法"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="24" v-if="state.form.level == 2"> |
| | | <el-row :gutter="24" v-if="state.form.type == 2"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="编制:" prop="creditCode" > |
| | | <el-select |
| | | v-model="state.form.peopleName" |
| | | filterable |
| | | remote |
| | | @change="selectValue" |
| | | reserve-keyword |
| | | placeholder="请输入人员名称" |
| | | remote-show-suffix |
| | | :remote-method="getPeopleList" |
| | | style="width: 240px" |
| | | > |
| | | <el-form-item label="编制:" prop="compilationId" > |
| | | <el-select clearable v-model="state.form.compilationId" :disabled="title =='查看'" filterable style="width: 100%"> |
| | | <el-option |
| | | v-for="item in state.peopleList" |
| | | v-for="item in state.userList" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.name" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="日期:" prop="creditCode" > |
| | | <el-form-item label="日期:" prop="compilationTime" > |
| | | <el-date-picker |
| | | v-model="value1" |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.compilationTime" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | /> |
| | |
| | | </el-row> |
| | | <el-row :gutter="24" > |
| | | <el-col :span="12"> |
| | | <el-form-item label="质量管理部:" prop="creditCode" > |
| | | <el-select |
| | | v-model="state.form.peopleName2" |
| | | filterable |
| | | remote |
| | | @change="selectValue" |
| | | reserve-keyword |
| | | placeholder="请输入人员名称" |
| | | remote-show-suffix |
| | | :remote-method="getPeopleList" |
| | | style="width: 240px" |
| | | > |
| | | <el-form-item label="质量管理部:" prop="qualityId" > |
| | | <el-select clearable v-model="state.form.qualityId" :disabled="title =='查看'" filterable style="width: 100%"> |
| | | <el-option |
| | | v-for="item in state.peopleList" |
| | | v-for="item in state.userList" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.name" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="日期:" prop="creditCode" > |
| | | <el-form-item label="日期:" prop="qualityTime" > |
| | | <el-date-picker |
| | | v-model="value1" |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.qualityTime" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | /> |
| | |
| | | </el-row> |
| | | <el-row :gutter="24"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="公司分管领导:" prop="creditCode" > |
| | | <el-select |
| | | v-model="state.form.peopleName3" |
| | | filterable |
| | | remote |
| | | @change="selectValue" |
| | | reserve-keyword |
| | | placeholder="请输入人员名称" |
| | | remote-show-suffix |
| | | :remote-method="getPeopleList" |
| | | style="width: 240px" |
| | | > |
| | | <el-form-item label="公司分管领导:" prop="leadId" > |
| | | <el-select clearable v-model="state.form.leadId" :disabled="title =='查看'" filterable style="width: 100%"> |
| | | <el-option |
| | | v-for="item in state.peopleList" |
| | | v-for="item in state.userList" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.name" |
| | | :value="item.id" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="日期:" prop="creditCode" > |
| | | <el-form-item label="日期:" prop="leadTime" > |
| | | <el-date-picker |
| | | v-model="value1" |
| | | :disabled="title === '查看'" |
| | | v-model="state.form.leadTime" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | /> |
| | |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <template #footer v-if="title !== '查看'"> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="handleClose" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button> |
| | |
| | | import {getCompany} from "@/api/onlineEducation/company"; |
| | | import {ElMessage} from "element-plus"; |
| | | import {getUser} from "@/api/onlineEducation/user"; |
| | | import {addObjective, editObject, getDept} from "@/api/qualityObjectives/object"; |
| | | import {listUser} from "@/api/system/user"; |
| | | |
| | | const dialogVisible = ref(false); |
| | | const title = ref(""); |
| | |
| | | const state = reactive({ |
| | | form: { |
| | | id: '', |
| | | objectList:[], |
| | | year: '', |
| | | num: '', |
| | | type: '', |
| | | departId: '', |
| | | method: '', |
| | | compilationId:'', |
| | | compilationTime:'', |
| | | qualityId: '', |
| | | qualityTime:'', |
| | | leadId:'', |
| | | leadTime: '', |
| | | qualityTargets:[], |
| | | |
| | | }, |
| | | rules: { |
| | | objName: [ |
| | | {required: true, message: "质量目标不能为空", trigger: "blur"} |
| | | ], |
| | | companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }], |
| | | year: [{ required: true, message: '请输入年份', trigger: 'blur' }], |
| | | num: [{ required: true, message: '请输入序号', trigger: 'blur' }], |
| | | type: [{ required: true, message: '请选择级别', trigger: 'blur' }], |
| | | method: [{ required: true, message: '请输入目标测量方法', trigger: 'blur' }], |
| | | compilationId: [{ required: true, message: '请选择编制人员', trigger: 'blur' }], |
| | | compilationTime: [{ required: true, message: '请选择日期', trigger: 'blur' }], |
| | | qualityId: [{ required: true, message: '请选择质量管理部人员', trigger: 'blur' }], |
| | | qualityTime: [{ required: true, message: '请选择日期', trigger: 'blur' }], |
| | | leadId: [{ required: true, message: '请选择公司分管领导', trigger: 'blur' }], |
| | | leadTime: [{ required: true, message: '请选择日期', trigger: 'blur' }], |
| | | departId: [{ required: true, message: '请选择部门', trigger: 'blur' }], |
| | | objName: [{required: true, message: "质量目标不能为空", trigger: "blur"}], |
| | | }, |
| | | isAdmin: false, |
| | | companyList: [], |
| | | deptList: [], |
| | | peopleList: [], |
| | | yearList: [ |
| | | { |
| | | value: 1, |
| | | label: '2025年' |
| | | label: '2025' |
| | | }, |
| | | { |
| | | value: 2, |
| | | label: '2024年' |
| | | label: '2024' |
| | | }, |
| | | { |
| | | value: 3, |
| | | label: '2023年' |
| | | label: '2023' |
| | | }, |
| | | { |
| | | value: 4, |
| | | label: '2022' |
| | | }, |
| | | { |
| | | value: 5, |
| | | label: '2021' |
| | | }, |
| | | ], |
| | | levelList: [ |
| | |
| | | ] |
| | | }) |
| | | |
| | | onMounted(() => { |
| | | const openDialog = async (type, value,companyList) => { |
| | | const userInfo = JSON.parse(Cookies.get('userInfo')) |
| | | state.isAdmin = userInfo.userType === 0; |
| | | state.form.companyName = userInfo.companyName |
| | | state.form.companyId = userInfo.companyId |
| | | |
| | | }); |
| | | const openDialog = async (type, value) => { |
| | | title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ; |
| | | if(type === 'edit' || type === 'view') { |
| | | state.form = JSON.parse(JSON.stringify(value)); |
| | | if(state.isAdmin){ |
| | | state.companyList = companyList |
| | | state.form.companyId = null |
| | | } |
| | | title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ; |
| | | if(type === 'edit' || type === 'review') { |
| | | state.form = JSON.parse(JSON.stringify(value)); |
| | | state.form.compilationBy = state.form.compilationId |
| | | state.form.leadBy = state.form.leadId |
| | | state.form.qualityBy = state.form.qualityId |
| | | |
| | | if(state.isAdmin){ |
| | | state.form.companyId = value.companyId |
| | | state.form.companyName = value.companyName |
| | | } |
| | | } |
| | | await getDeptList() |
| | | await getPeopleList() |
| | | dialogVisible.value = true; |
| | | } |
| | | const addObject = () => { |
| | | state.form.objectList.push({}) |
| | | state.form.qualityTargets.push({}) |
| | | } |
| | | const getDeptList = async () => { |
| | | const param = { |
| | | pageNum: 1, |
| | | pageSize: 999, |
| | | companyId: state.form.companyId |
| | | } |
| | | const res = await getDept(param) |
| | | if(res.code === 200){ |
| | | state.deptList = res.data |
| | | } |
| | | } |
| | | const onSubmit = async () => { |
| | | const valid = await busRef.value.validate(); |
| | | if(valid){ |
| | | if(title.value === '新增'){ |
| | | console.log('sta',state.form) |
| | | // const {id, ...data} = JSON.parse(JSON.stringify(state.form)) |
| | | // const res = await addCompany(data) |
| | | // if(res.code === 200){ |
| | | // ElMessage({ |
| | | // type: 'success', |
| | | // message: '新增成功' |
| | | // }); |
| | | // }else{ |
| | | // ElMessage.warning(res.message) |
| | | // } |
| | | const {id, ...data} = JSON.parse(JSON.stringify(state.form)) |
| | | if(data.qualityTargets && data.qualityTargets.length == 0){ |
| | | ElMessage.warning('请填写质量目标') |
| | | return |
| | | } |
| | | const res = await addObjective(data) |
| | | if(res.code === 200){ |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '新增成功' |
| | | }); |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | emit("getList") |
| | | busRef.value.clearValidate(); |
| | | reset(); |
| | | dialogVisible.value = false; |
| | | }else if(title.value === '编辑'){ |
| | | // const {...data} = JSON.parse(JSON.stringify(state.form)) |
| | | // const res = await editCompany(data) |
| | | // if(res.code === 200){ |
| | | // ElMessage({ |
| | | // type: 'success', |
| | | // message: '编辑成功' |
| | | // }); |
| | | // }else{ |
| | | // ElMessage.warning(res.message) |
| | | // } |
| | | const {...data} = JSON.parse(JSON.stringify(state.form)) |
| | | if(data.qualityTargets && data.qualityTargets.length == 0){ |
| | | ElMessage.warning('请填写质量目标') |
| | | return |
| | | } |
| | | const res = await editObject(data) |
| | | if(res.code === 200){ |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '编辑成功' |
| | | }); |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | emit("getList") |
| | | busRef.value.clearValidate(); |
| | | reset(); |
| | |
| | | const reset = () => { |
| | | state.form = { |
| | | id: '', |
| | | |
| | | year: '', |
| | | num: '', |
| | | type: '', |
| | | departId: '', |
| | | method: '', |
| | | compilationBy:'', |
| | | compilationTime:'', |
| | | qualityBy: '', |
| | | qualityTime:'', |
| | | leadBy:'', |
| | | leadTime: '', |
| | | qualityTargets:[], |
| | | } |
| | | state.form.objectList=[] |
| | | state.peopleList = [] |
| | | state.companyList = [] |
| | | |
| | | } |
| | | const handleDelete = (val) => { |
| | | state.form.objectList = state.form.objectList.filter(item=> item != val) |
| | | state.form.qualityTargets = state.form.qualityTargets.filter(item=> item != val) |
| | | } |
| | | const getPeopleList = async (val)=>{ |
| | | if(val != ""){ |
| | | |
| | | const getPeopleList = async ()=> { |
| | | const queryParams = { |
| | | pageNum: 1, |
| | | pageSize: 9999, |
| | | companyId: state.form.companyId |
| | | } |
| | | const res = await getUser(queryParams) |
| | | if(res.code == 200){ |
| | | state.userList = res.data.list?res.data.list:[] |
| | | }else{ |
| | | ElMessage.warning(res.message) |
| | | } |
| | | }; |
| | | // const getPeopleList = async (val)=>{ |
| | | // if(val){ |
| | | // const queryParams = { |
| | | // name: val, |
| | | // companyId: state.form.companyId == 0 ? null : state.form.companyId |
| | | // } |
| | | // const res = await getUser(queryParams) |
| | | // if (res.code == 200) { |
| | | // state.peopleList = res.data.list |
| | | // |
| | | // } else { |
| | | // ElMessage.warning(res.message) |
| | | // } |
| | | // }else { |
| | | // const queryParams = { |
| | | // pageNum: 1, |
| | | // pageSize: 10, |
| | | // companyId: state.form.companyId == 0 ? null : state.form.companyId |
| | | // } |
| | | // const res = await getUser(queryParams) |
| | | // if (res.code == 200) { |
| | | // state.peopleList = res.data.list |
| | | // |
| | | // } else { |
| | | // ElMessage.warning(res.message) |
| | | // } |
| | | // |
| | | // } |
| | | // } |
| | | const selectValue = (val) => { |
| | | state.peopleList.forEach(item => { |
| | | if(item.name === val){ |
| | | state.form.compilationBy = item.id |
| | | } |
| | | }) |
| | | } |
| | | const selectValue1 = (val) => { |
| | | state.peopleList.forEach(item => { |
| | | if(item.name === val){ |
| | | state.form.qualityBy = item.id |
| | | } |
| | | }) |
| | | } |
| | | const selectValue2 = (val) => { |
| | | state.peopleList.forEach(item => { |
| | | if(item.name === val){ |
| | | state.form.leadBy = item.id |
| | | } |
| | | }) |
| | | } |
| | | const handleChangeNum = (value) => { |
| | | if (!/^\d+$/.test(value)) { // 验证是否为数字 |
| | | ElMessage.warning('只能输入数字') |
| | | state.form.year = '' // 重置选择,避免非法值被添加到options中 |
| | | } else if (!state.yearList.some(option => option.label === value)) { // 确保不是已存在的选项 |
| | | state.yearList.push({ value, label: value }); // 添加新选项(这里简单地将值和标签设为相同) |
| | | } |
| | | } |
| | | const selectValueCom = (val) => { |
| | | state.form.leadId = null |
| | | state.form.qualityId = null |
| | | state.form.compilationId = null |
| | | state.form.leadName = null |
| | | state.form.qualityName = null |
| | | state.form.compilationName = null |
| | | state.form.departId = null |
| | | state.companyList.forEach(item => { |
| | | if(item.id === val){ |
| | | state.form.companyName = item.name |
| | | } |
| | | }) |
| | | getDeptList() |
| | | getPeopleList() |
| | | } |
| | | const changeLevel = () => { |
| | | // state.form.companyName = '' |
| | | state.form.departId = null |
| | | } |
| | | const getCompanyList = async (val)=>{ |
| | | if(val){ |
| | | const queryParams = { |
| | | name: val |
| | | } |
| | | const res = await getUser(queryParams) |
| | | const res = await getCompany(queryParams) |
| | | if (res.code == 200) { |
| | | state.peopleList = res.data.list |
| | | state.companyList = res.data.list |
| | | |
| | | } else { |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | } |
| | | const selectValue = (val) => { |
| | | state.peopleList.forEach(item => { |
| | | if(item.name === val){ |
| | | state.form.peopleId = item.id |
| | | }else { |
| | | const queryParams = { |
| | | pageSize: 999, |
| | | pageNum: 1, |
| | | } |
| | | }) |
| | | const res = await getCompany(queryParams) |
| | | if (res.code == 200) { |
| | | state.companyList = res.data.list |
| | | } else { |
| | | ElMessage.warning(res.message) |
| | | } |
| | | } |
| | | } |
| | | |
| | | defineExpose({ |