From 444aeabb015bb0a101b80233e65939b35e8e622c Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期五, 19 八月 2022 17:12:22 +0800 Subject: [PATCH] 对接 --- src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 323 ++++++++++++++++++++++++++++++++++------------------- 1 files changed, 208 insertions(+), 115 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 0bf5e23..51af58b 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -1,27 +1,37 @@ <template> <div class="system-edit-user-container"> - <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full"> + <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full" + destroy-on-close @close="closeDialog(ruleFormRef)"> <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> - <el-form ref="ruleFormRef" :disabled="disabled" :model="ruleForm" :rules="rules" size="default" label-width="140px"> + <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" size="default" label-width="140px"> <el-row :gutter="35"> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="事故名称" prop="accidentName"> - <el-input v-model="ruleForm.accidentName" placeholder="请填写事故名称"></el-input> + <el-input v-model="ruleForm.accidentName" :disabled="disabled" placeholder="请填写事故名称"></el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="事故部门" placeholder="请选择" prop="accidentDepartmentId"> - <el-tree-select v-model="ruleForm.accidentDepartmentId" :props="propse" :data="newTreeList" class="w100" placeholder="请选择" /> + <el-tree-select + v-model="ruleForm.accidentDepartmentId" + :disabled="disabled" + :props="propse" + :data="newTreeList" + class="w100" + placeholder="请选择" + /> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="发生地点" prop="occurrencePlace"> - <el-input v-model="ruleForm.occurrencePlace" placeholder="请填写发生地点"></el-input> + <el-input v-model="ruleForm.occurrencePlace" :disabled="disabled" placeholder="请填写发生地点"></el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="发生时间" prop="occurrenceTime"> + <!--<el-input v-model="ruleForm.occurrenceTime" :disabled="disabled" placeholder="请填写发生时间"></el-input>--> <el-date-picker + :disabled="disabled" v-model="ruleForm.occurrenceTime" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" @@ -32,30 +42,38 @@ </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="事故原因" prop="accidentCause"> - <el-select v-model="ruleForm.accidentCause" class="w100" placeholder="请选择"> - <el-option label="人的不安全行为" value="admin"></el-option> - <el-option label="物的不安全状态" value="common"></el-option> + <el-select v-model="ruleForm.accidentCause" :disabled="disabled" class="w100" placeholder="请选择"> + <el-option label="人的不安全行为" value="1"></el-option> + <el-option label="物的不安全状态" value="2"></el-option> </el-select> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="是否有伤亡" prop="casualties"> - <el-radio-group v-model="ruleForm.casualties" @change="typeChang"> + <el-radio-group v-model="ruleForm.casualties" :disabled="disabled" @change="typeChang"> <el-radio :label="true">是</el-radio> <el-radio :label="false">否</el-radio> </el-radio-group> - <el-button v-if="ruleForm.casualties" type="primary" style="margin-left: 20px" :icon="Edit" @click="openDai" round plain /> + <el-button v-if="ruleForm.casualties" type="primary" style="margin-left: 20px" + :icon="Edit" @click="openDai(ruleFormRef)" round plain /> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="事故简要经过" prop="accidentBriefProcess"> - <el-input v-model="ruleForm.accidentBriefProcess" type="textarea" placeholder="请填写事故简要经过" maxlength="150"></el-input> + <el-input + v-model="ruleForm.accidentBriefProcess" + :disabled="disabled" + type="textarea" + placeholder="请填写事故简要经过" + maxlength="150" + ></el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="事故原因初步分析" prop="accidentCausesPreliminaryAnalysis"> <el-input v-model="ruleForm.accidentCausesPreliminaryAnalysis" + :disabled="disabled" type="textarea" placeholder="请填写事故原因初步分析" maxlength="150" @@ -64,12 +82,21 @@ </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="应急防范措施" prop="emergencyPrecautions"> - <el-input v-model="ruleForm.emergencyPrecautions" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input> + <el-input + v-model="ruleForm.emergencyPrecautions" + :disabled="disabled" + type="textarea" + placeholder="请填写应急防范措施" + maxlength="150" + ></el-input> </el-form-item> </el-col> <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> - <el-form-item label="事故照片"> - <el-input v-model="ruleForm.fileList" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input> + <el-form-item label="事故照片" prop="fileList"> + <!--<el-input v-model="ruleForm.fileList" :disabled="disabled"--> + <!--type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input>--> + <uploaderImg :fileList="fileList" :disabled="disabled" + :systemName="'INCIDENT_MANAGE'" @successUploader="successUploader"></uploaderImg> </el-form-item> </el-col> </el-row> @@ -77,7 +104,8 @@ <template #footer> <span class="dialog-footer"> <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button> - <el-button size="default" v-if="disabled == true ? false : true" type="primary" @click="submitForm(titles, ruleFormRef)">确定</el-button> + <el-button size="default" v-if="disabled == true ? false : true" type="primary" + @click="submitForm(titles, ruleFormRef)">确定</el-button> </span> </template> </el-dialog> @@ -89,14 +117,15 @@ </template> <script lang="ts"> -import { reactive, ref, defineComponent, defineEmits,onMounted} from 'vue'; +import { reactive, ref, defineComponent, defineEmits, onMounted } from 'vue'; import type { UploadUserFile, FormInstance, FormRules } from 'element-plus'; -import { ElMessage } from 'element-plus'; +import { ElMessage,ElMessageBox, } from 'element-plus'; import { Search, FullScreen, Edit } from '@element-plus/icons-vue'; import NumberOfCasualties from '/@/views/accidentManagementSystem/accidentExpress/component/numberOfCasualties.vue'; import UserSelections from '/@/components/userSelections/index.vue'; import CheckTemplate from '/@/components/checkTemplate/index.vue'; +import uploaderImg from '/@/components/uploaderImg/index.vue'; import RegionsDialog from '/@/components/regionsDialog/index.vue'; import { accidentManagementSystemApi } from '/@/api/accidentManagementSystem'; import { goalManagementApi } from '/@/api/goalManagement'; @@ -107,6 +136,7 @@ UserSelections, RegionsDialog, NumberOfCasualties, + uploaderImg, }, setup(props, { emit }) { const isShowDialog = ref(false); @@ -123,17 +153,13 @@ occurrencePlace: '', accidentDepartmentId: '', accidentName: '', - fileList: [ - { - fileUrl: 'url', - fileName: 'name', - }, - ], + fileList: [], + id: '', }); const titles = ref(); const disabled = ref(); // 打开弹窗 - const openDialog = (title: string, id: number, type: boolean) => { + const openDialog = async (title: string, id: number, type: boolean) => { isShowDialog.value = true; titles.value = title; disabled.value = type; @@ -143,73 +169,81 @@ .then((res) => { if (res.data.code == 200) { ruleForm.value = res.data.data; + fileList.value = (res.data.data.fileList?res.data.data.fileList:[]) + initFileListData() } }); } }; + const initFileListData = async () => { + for(var a = 0;a<fileList.value.length;a++){ + await goalManagementApi() + .searchFile(fileList.value[a].fileName) + .then((res) => { + fileList.value[a].url = res.data + }) + } + } //日期选择器 const value1 = ref(''); // 上传附件 - const fileList = ref<UploadUserFile[]>([]); + const fileList = ref([]); + // 上传成功组装数据 + const successUploader = (list) =>{ + fileList.value = list + const formFileList = [] + for(var a = 0;a<fileList.value.length;a++){ + formFileList.push( + { + fileName:fileList.value[a].fileName, + fileUrl:'' + } + ) + } + ruleForm.value.fileList = formFileList + } // 可选择树 const treeSelect = ref(); //定义树形下拉框 const responsibleDepartment = ref(); - const data = [ - { - "value": 1, - "deptName": "总部门", - "children": [] - }, - { - "value": 3, - "deptName": "根部门2", - "children": [ - { - "value": 7, - "deptName": "子部门88", - "children": [] - } - ] - } - ]; + const data = []; //el-tree-select回显 const propse = { label: 'depName', - children: 'children' + children: 'children', }; - const newTreeList = [] + const newTreeList = []; //得到部门树 - const department = async() => { + const department = async () => { await goalManagementApi() - .getTreedepartment() - .then((res) => { - if (res.data.code == 200) { - data.value = res.data.data; - getTreeList(res.data.data,newTreeList) - } else { - ElMessage.error(res.data.msg); - } - }); + .getTreedepartment() + .then((res) => { + if (res.data.code == 200) { + data.value = res.data.data; + getTreeList(res.data.data, newTreeList); + } else { + ElMessage.error(res.data.msg); + } + }); }; // 递归树状数据且修改字段名 - const getTreeList = (treeList,newTreeList) => { - treeList.map(c=>{ - let tempData={ - depName:c.depName, - value:c.depId, - children:[] + const getTreeList = (treeList, newTreeList) => { + treeList.map((c) => { + let tempData = { + depName: c.depName, + value: c.depId, + children: [], + }; + if (c.children && c.children.length > 0) { + tempData.children = []; + getTreeList(c.children, tempData.children); } - if(c.children && c.children.length>0){ - tempData.children=[] - getTreeList(c.children,tempData.children) - } - newTreeList.push(tempData) - }) - } + newTreeList.push(tempData); + }); + }; onMounted(() => { - department() + department(); }); // 必填项提示 const rules = reactive<FormRules>({ @@ -234,7 +268,7 @@ trigger: 'change', }, ], - occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'change' }], + occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'blur' }], accidentCause: [ { required: true, @@ -275,31 +309,45 @@ // const emit=defineEmits(['myAdd']) // 表单提交验证必填项 const submitForm = async (title: string, formEl: FormInstance | undefined) => { + if(!ruleForm.value.fileList){ + ruleForm.value.fileList = [] + } if (title == '新建事故快报') { if (!formEl) return; await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; - accidentManagementSystemApi() - .accidentAdd(ruleForm.value) - .then((res) => { - if (res.data.code == 200) { - ElMessage({ - showClose: true, - message: res.data.msg, - type: 'success', - }); - emit('myAdd', true); - } else { - ElMessage({ - showClose: true, - message: res.data.msg, - type: 'error', - }); - emit('myAdd', true); - } - formEl.resetFields(); + if(ruleForm.value.id==null||ruleForm.value.id==''){ + ruleForm.value.id = null; + accidentManagementSystemApi() + .accidentAdd(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + emit('myAdd', true); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + emit('myAdd', true); + } + formEl.resetFields(); + }); + }else { + ElMessage({ + showClose: true, + message: '添加成功', + type: 'success', }); + emit('myAdd', true); + } + } else { console.log('error submit!', fields); } @@ -309,12 +357,6 @@ await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; - ruleForm.value.fileList = [ - { - fileUrl: 'url', - fileName: 'name', - }, - ]; accidentManagementSystemApi() .accidentView(ruleForm.value) .then((res) => { @@ -340,37 +382,86 @@ } }); formEl.resetFields(); - ruleForm.value = { - emergencyPrecautions: '', - accidentCausesPreliminaryAnalysis: '', - accidentBriefProcess: '', - casualties: '', - accidentCause: '', - occurrenceTime: '', - occurrencePlace: '', - accidentDepartmentId: '', - accidentName: '', - fileList: [ - { - fileUrl: 'url', - fileName: 'name', - }, - ], - }; } + ruleForm.value = { + accidentExpressId: '', + emergencyPrecautions: '', + accidentCausesPreliminaryAnalysis: '', + accidentBriefProcess: '', + casualties: '', + accidentCause: '', + occurrenceTime: '', + occurrencePlace: '', + accidentDepartmentId: '', + accidentName: '', + fileList: [], + }; }; const resetForm = (formEl: FormInstance | undefined) => { isShowDialog.value = false; if (!formEl) return; formEl.resetFields(); }; + const closeDialog = (formEl: FormInstance | undefined) => { + formEl.resetFields(); + fileList.value = [] + console.log(ruleForm); + isShowDialog.value = false; + }; // 是否有伤亡弹窗 const typeChang = () => { console.log('tag', ruleForm); }; const ShowUser = ref(); - const openDai = () => { - ShowUser.value.openDialog(); + const openDai = async (formEl: FormInstance | undefined) => { + if(ruleForm.value.id==null||ruleForm.value.id==''){ + if(!ruleForm.value.fileList){ + ruleForm.value.fileList = [] + } + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + // isShowDialog.value = false; + ElMessageBox.confirm('确认添加此事故快报?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + accidentManagementSystemApi() + .accidentAdd(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + ruleForm.value.id = res.data.data.id + ShowUser.value.openDialog(ruleForm.value.id, disabled.value); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + } + }); + }) + .catch(() => {}); + } else { + console.log('error submit!', fields); + } + }); + // ElMessage({ + // showClose: true, + // message: '请先添加事故快报', + // type: 'info', + // }); + }else { + ShowUser.value.openDialog(ruleForm.value.id, disabled.value); + } + }; // 应急队伍弹窗 const Shows = ref(); @@ -429,7 +520,9 @@ propse, department, getTreeList, - newTreeList + newTreeList, + closeDialog, + successUploader }; }, }); -- Gitblit v1.9.2