| | |
| | | <template> |
| | | <el-dialog v-model="dialogVisible" @close="resetForm" :fullscreen="full" :title="titles" width="50%" draggable> |
| | | <el-dialog v-model="dialogVisible" @close="resetForm(ruleFormRef)" :fullscreen="full" :title="titles" width="50%" draggable> |
| | | <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> |
| | | <el-form :model="form" :disabled="disabled" label-width="120px"> |
| | | <el-form :model="form" ref="ruleFormRef" :rules="rules" :disabled="disabled" label-width="120px"> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="检测人" size="default"> |
| | | <el-input v-model="form.testPersonName"> |
| | | <el-form-item label="检测人" size="default" prop="testPersonName"> |
| | | <el-input v-model="form.testPersonName"> |
| | | <template #append> <el-button :icon="Search" @click="openUser" /> </template |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2"> |
| | | <el-form-item label="检测日期" size="default"> |
| | | <el-date-picker v-model="form.testDate" format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 100%" /> |
| | | <el-form-item label="检测日期" size="default" prop="testDate"> |
| | | <el-date-picker v-model="form.testDate" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 100%" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="检测人单位" size="default"> |
| | | <el-tree-select v-model="form.testPersonDepartmentId" :data="data" check-strictly="true" class="w100" :props="propse" placeholder="请选择" /> |
| | | <el-form-item label="检测人单位" size="default" prop="testPersonDepartmentId"> |
| | | <el-tree-select |
| | | v-model="form.testPersonDepartmentId" |
| | | :data="data" |
| | | check-strictly="true" |
| | | class="w100" |
| | | :props="propse" |
| | | placeholder="请选择" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2"> |
| | | <el-form-item label="检测内容" size="default"> |
| | | <el-form-item label="检测内容" size="default" prop="testMemo"> |
| | | <el-input v-model="form.testMemo" placeholder="请填写检测内容" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="11"> |
| | | <el-form-item label="检测结果" size="default"> |
| | | <el-form-item label="检测结果" size="default" prop="testResult"> |
| | | <el-select v-model="form.testResult" placeholder="请选择" style="width: 100%"> |
| | | <el-option label="成功" value="1" /> |
| | | <el-option label="失败" value="2" /> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="11" :offset="2"> |
| | | <el-form-item label="检测状态" size="default"> |
| | | <el-form-item label="检测状态" size="default" prop="testStatus"> |
| | | <el-input v-model="form.testStatus" placeholder="请填写检测状态" /> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <!-- <el-button type="primary" @click="dialogVisible = false" size="default">继续添加</el-button> --> |
| | | <el-button @click="resetForm" size="default">关闭</el-button> |
| | | <el-button type="primary" @click="submitForm" size="default">确定</el-button> |
| | | <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button> |
| | | <el-button type="primary" @click="submitForm(ruleFormRef)" :disabled="disabled" size="default">确定</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | <script lang="ts"> |
| | | import { defineComponent, ref, reactive } from 'vue'; |
| | | import { ElMessage, ElMessageBox} from 'element-plus'; |
| | | import { ElMessage, ElMessageBox } from 'element-plus'; |
| | | import type { FormInstance, FormRules } from 'element-plus'; |
| | | import { Search, FullScreen } from '@element-plus/icons-vue'; |
| | | import DailogSearchUser from '/@/components/DailogSearchUser/index.vue'; |
| | | import { goalManagementApi } from '/@/api/goalManagement'; |
| | | export default defineComponent({ |
| | | components: { DailogSearchUser }, |
| | | setup(props, { emit }) { |
| | | const ruleFormRef = ref<FormInstance>(); |
| | | const form = ref({ |
| | | testPersonId: '', |
| | | testPersonName:'', |
| | | testPersonName: '', |
| | | testDate: '', |
| | | testPersonDepartmentId: '', |
| | | testMemo: '', |
| | |
| | | const disabled = ref(false); |
| | | const dialogVisible = ref(false); |
| | | const openDailog = (title: string, data: any) => { |
| | | department() |
| | | department(); |
| | | dialogVisible.value = true; |
| | | titles.value = `${title}设备检测`; |
| | | if (title == '查看') { |
| | | disabled.value = true; |
| | | form.value = data; |
| | | } else if(title == '修改'){ |
| | | } else if (title == '修改') { |
| | | disabled.value = false; |
| | | form.value = data; |
| | | } |
| | |
| | | }; |
| | | const User = (val: any) => { |
| | | form.value.testPersonId = val.uid; |
| | | form.value.testPersonName=val.realName; |
| | | form.value.testPersonName = val.realName; |
| | | }; |
| | | const rules = reactive<FormRules>({ |
| | | testPersonName: [{ required: true, message: '检测人不能为空', trigger: 'blur' }], |
| | | testDate:[{ required: true, message: '检测日期不能为空', trigger: 'blur' }], |
| | | testPersonDepartmentId:[], |
| | | testMemo:[{ required: true, message: '检测内容不能为空', trigger: 'blur' }], |
| | | testResult:[{ required: true, message: '检测结果不能为空', trigger: 'blur' }], |
| | | testStatus:[{ required: true, message: '检测状态不能为空', trigger: 'blur' }], |
| | | }); |
| | | // 提交 |
| | | const submitForm = () => { |
| | | dialogVisible.value = false; |
| | | emit('onDelect', form.value); |
| | | form.value = { |
| | | testPersonId: '', |
| | | testPersonName:'', |
| | | testDate: '', |
| | | testPersonDepartmentId: '', |
| | | testMemo: '', |
| | | testResult: '', |
| | | testStatus: '', |
| | | }; |
| | | const submitForm = async (formEl: FormInstance | undefined) => { |
| | | if (!formEl) return; |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | emit('onDelect', form.value); |
| | | dialogVisible.value = false; |
| | | } else { |
| | | console.log('error submit!', fields); |
| | | } |
| | | }); |
| | | |
| | | disabled.value = false; |
| | | }; |
| | | // 取消 |
| | | const resetForm = () => { |
| | | const resetForm = (formEl: FormInstance | undefined) => { |
| | | if (!formEl) return; |
| | | formEl.clearValidate(); |
| | | dialogVisible.value = false; |
| | | form.value = { |
| | | testPersonId: '', |
| | | testPersonName:'', |
| | | testDate: '', |
| | | testPersonDepartmentId: '', |
| | | testMemo: '', |
| | | testResult: '', |
| | | testStatus: '', |
| | | }; |
| | | disabled.value = false; |
| | | form.value={} |
| | | }; |
| | | //全屏 |
| | | const full = ref(false); |
| | |
| | | full.value = false; |
| | | } |
| | | }; |
| | | //部门树 |
| | | //部门树 |
| | | const department = () => { |
| | | goalManagementApi() |
| | | .getTreedepartment() |
| | |
| | | }; |
| | | const data = ref(); |
| | | return { |
| | | ruleFormRef, |
| | | rules, |
| | | department, |
| | | propse, |
| | | data, |