From bbf935c44b77eb0997f9332cd0e7f820f2bd2804 Mon Sep 17 00:00:00 2001 From: zhaojiale <631455805@qq.com> Date: 星期三, 03 八月 2022 15:41:37 +0800 Subject: [PATCH] 事故快报除图片外完成 --- src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 125 +++++++++++++++++++++-------------------- 1 files changed, 65 insertions(+), 60 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 0bf5e23..913ac7f 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -1,27 +1,30 @@ <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" @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 +35,33 @@ </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" 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 +70,15 @@ </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="fileListDemo"></uploaderImg> </el-form-item> </el-col> </el-row> @@ -97,6 +106,7 @@ 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 +117,7 @@ UserSelections, RegionsDialog, NumberOfCasualties, + uploaderImg }, setup(props, { emit }) { const isShowDialog = ref(false); @@ -123,12 +134,8 @@ occurrencePlace: '', accidentDepartmentId: '', accidentName: '', - fileList: [ - { - fileUrl: 'url', - fileName: 'name', - }, - ], + fileList: [], + id:'' }); const titles = ref(); const disabled = ref(); @@ -151,28 +158,22 @@ 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 treeSelect = ref(); //定义树形下拉框 const responsibleDepartment = ref(); const data = [ - { - "value": 1, - "deptName": "总部门", - "children": [] - }, - { - "value": 3, - "deptName": "根部门2", - "children": [ - { - "value": 7, - "deptName": "子部门88", - "children": [] - } - ] - } ]; //el-tree-select回显 const propse = { @@ -234,7 +235,7 @@ trigger: 'change', }, ], - occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'change' }], + occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'blur' }], accidentCause: [ { required: true, @@ -280,6 +281,7 @@ await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; + ruleForm.value.id = null accidentManagementSystemApi() .accidentAdd(ruleForm.value) .then((res) => { @@ -310,10 +312,10 @@ if (valid) { isShowDialog.value = false; ruleForm.value.fileList = [ - { - fileUrl: 'url', - fileName: 'name', - }, + // { + // fileUrl: 'url', + // fileName: 'name', + // }, ]; accidentManagementSystemApi() .accidentView(ruleForm.value) @@ -340,37 +342,38 @@ } }); 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(); + console.log(ruleForm) + isShowDialog.value = false + } // 是否有伤亡弹窗 const typeChang = () => { console.log('tag', ruleForm); }; const ShowUser = ref(); const openDai = () => { - ShowUser.value.openDialog(); + ShowUser.value.openDialog(ruleForm.value.id,disabled.value); }; // 应急队伍弹窗 const Shows = ref(); @@ -429,7 +432,9 @@ propse, department, getTreeList, - newTreeList + newTreeList, + closeDialog, + fileListDemo }; }, }); -- Gitblit v1.9.2