From c64c8f43ec1a3d88feb1f915fd488040b6358e7d Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期二, 09 八月 2022 19:04:12 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqtOut --- src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 293 ++++++++++++++++++++++++++------------------------------- 1 files changed, 134 insertions(+), 159 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 6ed5b58..50a59d7 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -1,40 +1,55 @@ <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" :data="data" 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-date-picker v-model="ruleForm.occurrenceTime" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" class="w100" placeholder="选择日期时间" /> + <!--<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" + 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="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> @@ -43,13 +58,20 @@ </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" @@ -58,12 +80,20 @@ </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.describe" 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> @@ -83,7 +113,7 @@ </template> <script lang="ts"> -import { reactive, ref, defineComponent, defineEmits } from 'vue'; +import { reactive, ref, defineComponent, defineEmits, onMounted } from 'vue'; import type { UploadUserFile, FormInstance, FormRules } from 'element-plus'; import { ElMessage } from 'element-plus'; @@ -91,8 +121,10 @@ 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'; export default defineComponent({ name: 'openAdd', components: { @@ -100,6 +132,7 @@ UserSelections, RegionsDialog, NumberOfCasualties, + uploaderImg, }, setup(props, { emit }) { const isShowDialog = ref(false); @@ -116,12 +149,8 @@ occurrencePlace: '', accidentDepartmentId: '', accidentName: '', - fileList: [ - { - fileUrl: 'url', - fileName: 'name', - }, - ], + fileList: [], + id: '', }); const titles = ref(); const disabled = ref(); @@ -144,125 +173,59 @@ 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 tree = [ - { - value: '1', - label: 'Level one 1', - children: [ - { - value: '1-1', - label: 'Level two 1-1', - children: [ - { - value: '1-1-1', - label: 'Level three 1-1-1', - }, - ], - }, - ], - }, - { - value: '2', - label: 'Level one 2', - children: [ - { - value: '2-1', - label: 'Level two 2-1', - children: [ - { - value: '2-1-1', - label: 'Level three 2-1-1', - }, - ], - }, - { - value: '2-2', - label: 'Level two 2-2', - children: [ - { - value: '2-2-1', - label: 'Level three 2-2-1', - }, - ], - }, - ], - }, - { - value: '3', - label: 'Level one 3', - children: [ - { - value: '3-1', - label: 'Level two 3-1', - children: [ - { - value: '3-1-1', - label: 'Level three 3-1-1', - }, - ], - }, - { - value: '3-2', - label: 'Level two 3-2', - children: [ - { - value: '3-2-1', - label: 'Level three 3-2-1', - }, - ], - }, - ], - }, - ]; + //定义树形下拉框 const responsibleDepartment = ref(); - const data = [ - { - value: '1', - label: '广汇能源综合物流发展有限责任公司', - children: [ - { - value: '11', - label: '经营班子', - children: [], - }, - ], - }, - { - value: '2', - label: '生产运行部', - children: [ - { - value: '21', - label: '灌装一班', - children: [], - }, - { - value: '22', - label: '工艺四班', - children: [], - }, - ], - }, - { - value: '3', - label: '设备部', - children: [ - { - value: '31', - label: '仪表班', - children: [], - }, - { - value: '32', - label: '机修班', - children: [], - }, - ], - }, - ]; + const data = []; + //el-tree-select回显 + const propse = { + label: 'depName', + children: 'children', + }; + const newTreeList = []; + //得到部门树 + 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); + } + }); + }; + // 递归树状数据且修改字段名 + 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); + } + newTreeList.push(tempData); + }); + }; + onMounted(() => { + department(); + }); // 必填项提示 const rules = reactive<FormRules>({ accidentName: [ @@ -286,7 +249,7 @@ trigger: 'change', }, ], - occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'change' }], + occurrenceTime: [{ type: 'date', required: true, message: '发生时间不能为空', trigger: 'blur' }], accidentCause: [ { required: true, @@ -332,6 +295,7 @@ await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; + ruleForm.value.id = null; accidentManagementSystemApi() .accidentAdd(ruleForm.value) .then((res) => { @@ -356,12 +320,17 @@ console.log('error submit!', fields); } }); - } - else if (title == '修改事故快报') { + } else if (title == '修改事故快报') { if (!formEl) return; await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; + ruleForm.value.fileList = [ + // { + // fileUrl: 'url', + // fileName: 'name', + // }, + ]; accidentManagementSystemApi() .accidentView(ruleForm.value) .then((res) => { @@ -387,29 +356,30 @@ } }); 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 = () => { @@ -417,7 +387,7 @@ }; const ShowUser = ref(); const openDai = () => { - ShowUser.value.openDialog(); + ShowUser.value.openDialog(ruleForm.value.id, disabled.value); }; // 应急队伍弹窗 const Shows = ref(); @@ -456,7 +426,6 @@ ruleForm, value1, treeSelect, - tree, daiInpt, Shows, ruleFormRef, @@ -474,6 +443,12 @@ titles, disabled, emit, + propse, + department, + getTreeList, + newTreeList, + closeDialog, + fileListDemo, }; }, }); @@ -496,4 +471,4 @@ .el-select { width: 100%; } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.2