From 7df64634d3d7b292713eebfa008c40b3f5f9f65f Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期二, 20 九月 2022 15:57:03 +0800 Subject: [PATCH] 修改 --- src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 284 +++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 179 insertions(+), 105 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 913ac7f..1a7aeaa 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -1,6 +1,7 @@ <template> <div class="system-edit-user-container"> - <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full" @close="closeDialog(ruleFormRef)"> + <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" :model="ruleForm" :rules="rules" size="default" label-width="140px"> <el-row :gutter="35"> @@ -11,8 +12,14 @@ </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" :disabled="disabled" - :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"> @@ -36,8 +43,8 @@ <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" :disabled="disabled" class="w100" placeholder="请选择"> - <el-option label="人的不安全行为" value="1"></el-option> - <el-option label="物的不安全状态" value="2"></el-option> + <el-option label="人的不安全行为" :value="1"></el-option> + <el-option label="物的不安全状态" :value="2"></el-option> </el-select> </el-form-item> </el-col> @@ -47,14 +54,19 @@ <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" :disabled="disabled" - 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"> @@ -70,15 +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" :disabled="disabled" - 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="事故照片" prop="fileList"> <!--<el-input v-model="ruleForm.fileList" :disabled="disabled"--> - <!--type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input>--> - <uploaderImg :fileList="fileListDemo"></uploaderImg> + <!--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> @@ -86,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> @@ -98,10 +117,10 @@ </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'; @@ -117,7 +136,7 @@ UserSelections, RegionsDialog, NumberOfCasualties, - uploaderImg + uploaderImg, }, setup(props, { emit }) { const isShowDialog = ref(false); @@ -135,12 +154,12 @@ accidentDepartmentId: '', accidentName: '', fileList: [], - id:'' + 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; @@ -150,67 +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 fileListDemo = ref<UploadUserFile[]>([ - { - name: 'food.jpeg', - url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100', - }, - { - name: 'food.jpeg', - url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100', - }, - ]) + 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 = [ - ]; + 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>({ @@ -276,32 +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; - 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(); + 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); } @@ -311,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) => { @@ -327,6 +367,7 @@ type: 'success', }); emit('myAdd', true); + formEl.resetFields(); } else { ElMessage({ showClose: true, @@ -335,27 +376,12 @@ }); emit('myAdd', true); } - formEl.resetFields(); }); } else { console.log('error submit!', fields); } }); - formEl.resetFields(); } - ruleForm.value = { - accidentExpressId:'', - emergencyPrecautions: '', - accidentCausesPreliminaryAnalysis: '', - accidentBriefProcess: '', - casualties: '', - accidentCause: '', - occurrenceTime: '', - occurrencePlace: '', - accidentDepartmentId: '', - accidentName: '', - fileList: [], - }; }; const resetForm = (formEl: FormInstance | undefined) => { isShowDialog.value = false; @@ -364,16 +390,64 @@ }; const closeDialog = (formEl: FormInstance | undefined) => { formEl.resetFields(); - console.log(ruleForm) - isShowDialog.value = false - } + fileList.value = [] + console.log(ruleForm); + isShowDialog.value = false; + }; // 是否有伤亡弹窗 const typeChang = () => { console.log('tag', ruleForm); }; const ShowUser = ref(); - const openDai = () => { - ShowUser.value.openDialog(ruleForm.value.id,disabled.value); + 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(); @@ -434,7 +508,7 @@ getTreeList, newTreeList, closeDialog, - fileListDemo + successUploader }; }, }); -- Gitblit v1.9.2