From 2e52dcb4fb8766d7d9c0034b7bba3e1d02e24906 Mon Sep 17 00:00:00 2001 From: zhaojiale <631455805@qq.com> Date: 星期四, 04 八月 2022 10:43:29 +0800 Subject: [PATCH] 事故报告除图片外完成 --- src/views/accidentManagementSystem/accidentReport/component/openAdd.vue | 1279 ++++++++++++------------- src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue | 442 ++++---- src/api/workInjuryDeclaration/index.ts | 5 src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 110 + src/views/accidentManagementSystem/accidentReport/index.vue | 17 src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue | 1031 ++++++++++---------- src/components/DailogSearchUser/index.vue | 3 7 files changed, 1,400 insertions(+), 1,487 deletions(-) diff --git a/src/api/workInjuryDeclaration/index.ts b/src/api/workInjuryDeclaration/index.ts index f61f5f4..e8edf72 100644 --- a/src/api/workInjuryDeclaration/index.ts +++ b/src/api/workInjuryDeclaration/index.ts @@ -75,8 +75,9 @@ // 事故报告删除 deleteAccidentReport: (params:object) => { return request({ - url: `/accidentReport/batchDelete/${params}`, - method: 'get', + url: `/accidentReport/batchDelete`, + method: 'post', + data:params }); }, diff --git a/src/components/DailogSearchUser/index.vue b/src/components/DailogSearchUser/index.vue index 0db0657..1632e6a 100644 --- a/src/components/DailogSearchUser/index.vue +++ b/src/components/DailogSearchUser/index.vue @@ -175,8 +175,7 @@ } }; const submitForm = () => { - let obj = JSON.parse(JSON.stringify(dynamicTags.value)); - emit('SearchUser', obj[0],types.value); + emit('SearchUser', dynamicTags.value); dialogVisible.value = false; }; return { diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 913ac7f..50a59d7 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -11,8 +11,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"> @@ -47,14 +53,18 @@ <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" :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,14 +80,19 @@ </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>--> + <!--type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input>--> <uploaderImg :fileList="fileListDemo"></uploaderImg> </el-form-item> </el-col> @@ -98,7 +113,7 @@ </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'; @@ -117,7 +132,7 @@ UserSelections, RegionsDialog, NumberOfCasualties, - uploaderImg + uploaderImg, }, setup(props, { emit }) { const isShowDialog = ref(false); @@ -135,7 +150,7 @@ accidentDepartmentId: '', accidentName: '', fileList: [], - id:'' + id: '', }); const titles = ref(); const disabled = ref(); @@ -167,50 +182,49 @@ 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 = [ - ]; + 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>({ @@ -281,7 +295,7 @@ await formEl.validate((valid, fields) => { if (valid) { isShowDialog.value = false; - ruleForm.value.id = null + ruleForm.value.id = null; accidentManagementSystemApi() .accidentAdd(ruleForm.value) .then((res) => { @@ -344,7 +358,7 @@ formEl.resetFields(); } ruleForm.value = { - accidentExpressId:'', + accidentExpressId: '', emergencyPrecautions: '', accidentCausesPreliminaryAnalysis: '', accidentBriefProcess: '', @@ -364,16 +378,16 @@ }; const closeDialog = (formEl: FormInstance | undefined) => { formEl.resetFields(); - console.log(ruleForm) - isShowDialog.value = false - } + 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); + ShowUser.value.openDialog(ruleForm.value.id, disabled.value); }; // 应急队伍弹窗 const Shows = ref(); @@ -434,7 +448,7 @@ getTreeList, newTreeList, closeDialog, - fileListDemo + fileListDemo, }; }, }); diff --git a/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue b/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue index 039bc5c..5500b16 100644 --- a/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue @@ -1,700 +1,625 @@ <template> - <div class="system-edit-user-container"> - <el-dialog - :title="titles" - v-model="isShowDialog" - width="800px" - draggable - :fullscreen="full" - > - <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> - <el-form - ref="ruleFormRef" - :model="ruleForm" - size="default" - :rules="rules" - label-width="130px" - :disabled="disabled" - > - <el-row :gutter="35"> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="事故快报" prop="accidentExpressId"> - <el-input - v-model="ruleForm.accidentExpressId" - placeholder="请选择" - class="input-with-select" - > - <template #append> - <el-button :icon="Search" @click="daiInpt"/> - </template> - </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-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-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-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="事故类别" prop="accidentType"> - <el-select v-model="ruleForm.accidentType" class="w100" placeholder="请选择"> - <el-option label="人员伤亡事故" value="人员伤亡事故"></el-option> - <el-option label="火灾爆炸事故" value="火灾爆炸事故"></el-option> - <el-option label="危险品泄露事故" value="危险品泄露事故"></el-option> - <el-option label="设备事故" value="设备事故"></el-option> - <el-option label="工艺事故" value="工艺事故"></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="accidentGrade"> - <el-select v-model="ruleForm.accidentGrade" class="w100" placeholder="请选择"> - <el-option label="特别重大" value="人员伤亡事故"></el-option> - <el-option label="重大" value="重大"></el-option> - <el-option label="较大" value="较大"></el-option> - <el-option label="一般" value="一般"></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="economicLoss"> - <el-input v-model="ruleForm.economicLoss" 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="minorInjuryNum"> - <el-input v-model="ruleForm.minorInjuryNum" 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="seriousInjuryNum"> - <el-input v-model="ruleForm.seriousInjuryNum" 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="deathNum"> - <el-input v-model="ruleForm.deathNum" 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="accidentCause"> - <el-input v-model="ruleForm.accidentCause" 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="reportDeadline"> - <el-date-picker - v-model="ruleForm.reportDeadline" - type="datetime" - class="w100" - placeholder="选择日期时间" - value-format="YYYY-MM-DD HH:mm:ss" - /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="事故级别" prop="accidentLevel"> - <el-select v-model="ruleForm.accidentLevel" class="w100" placeholder="请选择"> - <el-option label="特大事故" value="特大事故"></el-option> - <el-option label="重大事故" value="重大事故"></el-option> - <el-option label="较大事故" value="较大事故"></el-option> - <el-option label="一般事故" value="一般事故"></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="accidentDelayApply"> - <el-input v-model="ruleForm.accidentDelayApply" 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="comprehensiveAnalysisDirect"> - <el-input v-model="ruleForm.comprehensiveAnalysisDirect" 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="comprehensiveAnalysisIndirect"> - <el-input v-model="ruleForm.comprehensiveAnalysisIndirect" 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="rectificationMeasures"> - <el-input v-model="ruleForm.rectificationMeasures" 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="accidentHandling"> - <el-input v-model="ruleForm.accidentHandling" 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="fillInUserUid"> - <el-input - v-model="ruleForm.fillInUserUid" - placeholder="请选择" - class="input-with-select" - > - <template #append> - <el-button :icon="Search" @click="openUser"/> - </template> - </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="fillInTime"> - <el-date-picker - v-model="ruleForm.fillInTime" - type="datetime" - class="w100" - placeholder="选择日期时间" - value-format="YYYY-MM-DD HH:mm:ss" - /> - </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>--> -<!-- </el-col>--> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="相关人员笔录"> - <el-input v-model="ruleForm.relevantPersonnelRecords" 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-upload - v-model:file-list="fileList" - class="upload-demo" - action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" - :on-change="handleChange" - > - <el-button type="primary" - >点击上传</el-button> - <template #tip> - <div class="el-upload__tip"> - 添加相关附件 - </div> - </template> - </el-upload> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="其他材料"> - <el-input v-model="ruleForm.otherMaterials" type="textarea" placeholder="请填写其他材料" maxlength="150"></el-input> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> + <div class="system-edit-user-container"> + <el-dialog :title="titles" v-model="isShowDialog" width="800px" draggable :fullscreen="full" @close="closeDialog(ruleFormRef)"> + <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> + <el-form ref="ruleFormRef" :model="ruleForm" size="default" :rules="rules" label-width="140px" :disabled="disabled"> + <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="请选择" class="input-with-select"> + <template #append> + <el-button :icon="Search" @click="daiInpt" /> + </template> + </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-input v-model="ruleForm.accidentDepartmentName" class="input-with-select" />--> + <el-tree-select v-model="ruleForm.accidentDepartmentId" :data="newTreeList" :props="propse" 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-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-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="事故类别" prop="accidentType"> + <el-select v-model="ruleForm.accidentType" class="w100" placeholder="请选择"> + <el-option label="人员伤亡事故" value="人员伤亡事故"></el-option> + <el-option label="火灾爆炸事故" value="火灾爆炸事故"></el-option> + <el-option label="危险品泄露事故" value="危险品泄露事故"></el-option> + <el-option label="设备事故" value="设备事故"></el-option> + <el-option label="工艺事故" value="工艺事故"></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="accidentGrade"> + <el-select v-model="ruleForm.accidentGrade" class="w100" placeholder="请选择"> + <el-option label="特别重大" value="人员伤亡事故"></el-option> + <el-option label="重大" value="重大"></el-option> + <el-option label="较大" value="较大"></el-option> + <el-option label="一般" value="一般"></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="economicLoss"> + <el-input v-model="ruleForm.economicLoss" 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="minorInjuryNum"> + <el-input v-model="ruleForm.minorInjuryNum" 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="seriousInjuryNum"> + <el-input v-model="ruleForm.seriousInjuryNum" 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="deathNum"> + <el-input v-model="ruleForm.deathNum" 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="accidentCause"> + <el-input v-model="ruleForm.accidentCause" 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="reportDeadline"> + <el-date-picker + v-model="ruleForm.reportDeadline" + type="datetime" + class="w100" + placeholder="选择日期时间" + value-format="YYYY-MM-DD HH:mm:ss" + /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="事故级别" prop="accidentLevel"> + <el-select v-model="ruleForm.accidentLevel" class="w100" placeholder="请选择"> + <el-option label="特大事故" value="特大事故"></el-option> + <el-option label="重大事故" value="重大事故"></el-option> + <el-option label="较大事故" value="较大事故"></el-option> + <el-option label="一般事故" value="一般事故"></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="accidentDelayApply"> + <el-input v-model="ruleForm.accidentDelayApply" 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="comprehensiveAnalysisDirect"> + <el-input + v-model="ruleForm.comprehensiveAnalysisDirect" + 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="comprehensiveAnalysisIndirect"> + <el-input + v-model="ruleForm.comprehensiveAnalysisIndirect" + 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="rectificationMeasures"> + <el-input v-model="ruleForm.rectificationMeasures" 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="accidentHandling"> + <el-input v-model="ruleForm.accidentHandling" 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="fillInUserName"> + <el-input v-model="ruleForm.fillInUserName" placeholder="请选择" class="input-with-select"> + <template #append> + <el-button :icon="Search" @click="openUser" /> + </template> + </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="fillInTime"> + <el-date-picker + v-model="ruleForm.fillInTime" + type="datetime" + class="w100" + placeholder="选择日期时间" + value-format="YYYY-MM-DD HH:mm:ss" + /> + </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>--> + <!-- </el-col>--> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="相关人员笔录" prop="relevantPersonnelRecords"> + <el-input v-model="ruleForm.relevantPersonnelRecords" 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"> + <uploaderImg :fileList="fileList"></uploaderImg> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="其他材料" prop="otherMaterials"> + <el-input v-model="ruleForm.otherMaterials" type="textarea" placeholder="请填写其他材料" maxlength="150"></el-input> + </el-form-item> + </el-col> + </el-row> + </el-form> + <template #footer> <span class="dialog-footer"> <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button> - <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button> + <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button> </span> - </template> - </el-dialog> - <AccidentName ref="Shows"/> - <DailogSearchUser ref="userRef" @SearchUser="onUser"/> - <RegionsDialog ref="openRef"/> - </div> + </template> + </el-dialog> + <AccidentName @selectItem="onSelectItem" ref="Shows" /> + <DailogSearchUser @SearchUser="onUser" ref="userRef" /> + <RegionsDialog ref="openRef" /> + </div> </template> <script lang="ts"> -import { - reactive, - ref, - defineComponent -} from 'vue'; +import { reactive, ref, defineComponent,onMounted } from 'vue'; -import type { - UploadUserFile, - FormInstance, - FormRules, -} from 'element-plus' +import type { UploadUserFile, FormInstance, FormRules } from 'element-plus'; import { ElMessage } from 'element-plus'; -import { - Search, - FullScreen -} from '@element-plus/icons-vue' -import DailogSearchUser from "/@/components/DailogSearchUser/index.vue" -import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue' -import RegionsDialog from '/@/components/regionsDialog/index.vue' -import {emergencySuppliesApi} from "/@/api/emergencyResources"; -import {accidentManagementSystemApi} from "/@/api/workInjuryDeclaration"; +import { Search, FullScreen } from '@element-plus/icons-vue'; +import DailogSearchUser from '/@/components/DailogSearchUser/index.vue'; +import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue'; +import RegionsDialog from '/@/components/regionsDialog/index.vue'; +import uploaderImg from '/@/components/uploaderImg/index.vue'; +import { emergencySuppliesApi } from '/@/api/emergencyResources'; +import { accidentManagementSystemApi } from '/@/api/workInjuryDeclaration'; +import { goalManagementApi } from '/@/api/goalManagement'; export default defineComponent({ - name: 'openAdd', - components: { - AccidentName, - DailogSearchUser, - RegionsDialog, - }, - setup(props, { emit }) { - const isShowDialog = ref(false) + name: 'openAdd', + components: { + AccidentName, + DailogSearchUser, + RegionsDialog, + uploaderImg + }, + setup(props, { emit }) { + const isShowDialog = ref(false); - const ruleFormRef = ref<FormInstance>() - //定义表单 - const ruleForm = ref ({ - accidentExpressId: '', - accidentType: '', - accidentGrade: '', - economicLoss: '', - minorInjuryNum: '', - seriousInjuryNum: '', - deathNum: '', - accidentCause: '', - reportDeadline: '', - accidentLevel: '', - accidentDelayApply: '', - comprehensiveAnalysisDirect: '', - comprehensiveAnalysisIndirect: '', - rectificationMeasures: '', - accidentHandling: '', - fillInUserUid: '', - fillInTime: '', - relevantPersonnelRecords: '', - otherMaterials: '', - fileList: [ - { - fileUrl: '', - fileName: '', - } - ], - }); - const titles = ref(); - const disabled = ref(); - // 打开弹窗 - const openDialog = (title: string, id: number, type: boolean) => { - isShowDialog.value = true; - titles.value = title; - disabled.value = type; - if (title == '查看事故报告' || title == '修改事故报告') { - accidentManagementSystemApi() - .seeAccidentReport(id) - .then((res) => { - if (res.data.code == 200) { - ruleForm.value = res.data.data; - } - }); - } - }; - // 关闭弹窗 - const closeDialog = () => { - isShowDialog.value = false; - }; - // 取消 - const onCancel = () => { - closeDialog(); - }; - //日期选择器 - const value1 = ref('') - // 上传附件 - const fileList = ref<UploadUserFile[]>([]) - // 可选择树 - const treeSelect = ref() - const tree = [ - { - value: '1', - label: 'Level one 1', - children: [ - { - value: '11', - label: 'Level two 1-1', - children: [ - { - value: '111', - label: 'Level three 1-1-1', - }, - ], - }, - ], - }, - { - value: '2', - label: 'Level one 2', - children: [ - { - value: '21', - label: 'Level two 2-1', - children: [ - { - value: '211', - label: 'Level three 2-1-1', - }, - ], - }, - { - value: '22', - label: 'Level two 2-2', - children: [ - { - value: '221', - label: 'Level three 2-2-1', - }, - ], - }, - ], - }, - { - value: '3', - label: 'Level one 3', - children: [ - { - value: '31', - label: 'Level two 3-1', - children: [ - { - value: '311', - label: 'Level three 3-1-1', - }, - ], - }, - { - value: '32', - label: 'Level two 3-2', - children: [ - { - value: '321', - 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 rules = reactive<FormRules>({ - accidentDepartmentId: [ - { - required: true, - message: '事故部门不能为空', - trigger: 'change', - }, - ], - occurrenceTime: [ - { - required: true, - message: '发生时间不能为空', - trigger: 'change', - }, - ], - accidentType: [ - { - required: true, - message: '事故类别不能为空', - trigger: 'change', - }, - ], - accidentGrade: [ - { - required: true, - message: '事故等级不能为空', - trigger: 'change', - }, - ], - economicLoss: [ - { - required: true, - message: '经济损失不能为空', - trigger: 'change', - }, - ], - reportDeadline: [ - { - required: true, - message: '要求报告完成期限不能为空', - trigger: 'change', - }, - ], - accidentLevel: [ - { - required: true, - message: '事故级别不能为空', - trigger: 'change', - }, - ], - comprehensiveAnalysisDirect: [ - { - required: true, - message: '原因综合分析(直接分析)不能为空', - trigger: 'blur', - }, - ], - comprehensiveAnalysisIndirect: [ - { - required: true, - message: '原因综合分析(间接分析)不能为空', - trigger: 'blur', - }, - ], - rectificationMeasures: [ - { - required: true, - message: '整改措施不能为空', - trigger: 'blur', - }, - ], - accidentHandling: [ - { - required: true, - message: '事故处理不能为空', - trigger: 'change', - }, - ], - fillInUserUid: [ - { - required: true, - message: '填写人不能为空', - trigger: 'change', - }, - ], - fillInTime: [ - { - type: 'date', - required: true, - message: '填写日期不能为空', - trigger: 'change', - }, - ], - }) - // 表单提交验证必填项 - const submitForm = async (title: string, formEl: FormInstance | undefined) => { - if (title == '新建事故报告') { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - isShowDialog.value = false; - accidentManagementSystemApi() - .addAccidentReport(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 { - console.log('error submit!', fields); - } - }); - } - else if (title == '修改事故报告') { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - isShowDialog.value = false; - accidentManagementSystemApi() - .editAccidentReport(ruleForm.value) - .then((res) => { - if (res.data.code == 200) { - ElMessage({ - showClose: true, - message: '修改成功', - type: 'success', - }); - emit('myAdd', true); - } else { - ElMessage({ - showClose: true, - message: res.data.msg, - type: 'error', - }); - emit('myAdd', true); - } - formEl.resetFields(); - }); - } else { - console.log('error submit!', fields); - } - }); - formEl.resetFields(); - ruleForm.value = { - accidentExpressId: '', - accidentType: '', - accidentGrade: '', - economicLoss: '', - minorInjuryNum: '', - seriousInjuryNum: '', - deathNum: '', - accidentCause: '', - reportDeadline: '', - accidentLevel: '', - accidentDelayApply: '', - comprehensiveAnalysisDirect: '', - comprehensiveAnalysisIndirect: '', - rectificationMeasures: '', - accidentHandling: '', - fillInUserUid: '', - fillInTime: '', - relevantPersonnelRecords: '', - otherMaterials: '', - fileList: [ - { - fileUrl: '', - fileName: '', - } - ], - } - } - } - const resetForm = (formEl: FormInstance | undefined) => { - isShowDialog.value = false; - if (!formEl) return; - formEl.resetFields(); - }; - const handleChange = (val: number) => { - console.log(val) - }; - // 应急队伍弹窗 - const Shows=ref() - const daiInpt=()=>{ - Shows.value.openDailog() - } - // 选择区域弹窗 - const openRef=ref() - const regionsDialog=()=>{ - openRef.value.openDailog() - } - // 打开用户选择弹窗 - const userRef = ref(); - const openUser = () => { - userRef.value.openDailog(); - }; - const onUser = (e:any) => { - ruleForm.value.fillInUserUid=e.id - }; - //全屏 - const full = ref(false); - const toggleFullscreen = () => { - if (full.value == false) { - full.value = true; - } else { - full.value = false; - } - }; - return { - openDialog, - closeDialog, - isShowDialog, - onCancel, - fileList, - responsibleDepartment, - data, - Search, - ruleForm, - value1, - treeSelect, - tree, - daiInpt, - Shows, - ruleFormRef, - submitForm, - rules, - openUser, - userRef, - regionsDialog, - openRef, - toggleFullscreen, - FullScreen, - full, - onUser, - resetForm, - titles, - disabled, - emit, - handleChange - }; - }, + const ruleFormRef = ref<FormInstance>(); + //定义表单 + const ruleForm = ref({ + accidentExpressId:'', + accidentExpressName:'', + accidentDepartmentId:'', + accidentDepartmentName:'', + occurrencePlace:'', + occurrenceTime:'', + + + + accidentType: '', + accidentGrade: '', + economicLoss: '', + minorInjuryNum: '', + seriousInjuryNum: '', + deathNum: '', + accidentCause: '', + reportDeadline: '', + accidentLevel: '', + accidentDelayApply: '', + comprehensiveAnalysisDirect: '', + comprehensiveAnalysisIndirect: '', + rectificationMeasures: '', + accidentHandling: '', + fillInUserUid: '', + fillInUserName:'', + fillInTime: '', + relevantPersonnelRecords: '', + otherMaterials: '', + fileList: [], + }); + const titles = ref(); + const disabled = ref(); + // 打开弹窗 + const openDialog = (title: string, id: number, type: boolean) => { + isShowDialog.value = true; + titles.value = title; + disabled.value = type; + if (title == '查看事故报告' || title == '修改事故报告') { + accidentManagementSystemApi() + .seeAccidentReport(id) + .then((res) => { + if (res.data.code == 200) { + ruleForm.value = res.data.data; + } + }); + } + }; + // 关闭弹窗 + const closeDialog = (formEl: FormInstance | undefined) => { + formEl.resetFields(); + console.log(ruleForm) + isShowDialog.value = false; + }; + // 取消 + const onCancel = (formEl: FormInstance | undefined) => { + closeDialog(formEl); + }; + //日期选择器 + const value1 = ref(''); + // 上传附件 + const fileList = ref<UploadUserFile[]>([]); + // 可选择树 + const treeSelect = ref(); + //定义树形下拉框 + const responsibleDepartment = ref(); + const data = [ + ]; + // 必填项提示 + const rules = reactive<FormRules>({ + accidentDepartmentId: [ + { + required: true, + message: '事故部门不能为空', + trigger: 'change', + }, + ], + occurrenceTime: [ + { + required: true, + message: '发生时间不能为空', + trigger: 'blur', + }, + ], + accidentType: [ + { + required: true, + message: '事故类别不能为空', + trigger: 'change', + }, + ], + accidentGrade: [ + { + required: true, + message: '事故等级不能为空', + trigger: 'change', + }, + ], + economicLoss: [ + { + required: true, + message: '经济损失不能为空', + trigger: 'change', + }, + ], + reportDeadline: [ + { + required: true, + message: '要求报告完成期限不能为空', + trigger: 'blur', + }, + ], + accidentLevel: [ + { + required: true, + message: '事故级别不能为空', + trigger: 'change', + }, + ], + comprehensiveAnalysisDirect: [ + { + required: true, + message: '原因综合分析(直接分析)不能为空', + trigger: 'blur', + }, + ], + comprehensiveAnalysisIndirect: [ + { + required: true, + message: '原因综合分析(间接分析)不能为空', + trigger: 'blur', + }, + ], + rectificationMeasures: [ + { + required: true, + message: '整改措施不能为空', + trigger: 'blur', + }, + ], + accidentHandling: [ + { + required: true, + message: '事故处理不能为空', + trigger: 'change', + }, + ], + fillInUserUid: [ + { + required: true, + message: '填写人不能为空', + trigger: 'change', + }, + ], + fillInTime: [ + { + type: 'date', + required: true, + message: '填写日期不能为空', + trigger: 'blur', + }, + ], + }); + //事故快报回填 + const onSelectItem = (item: any) => { + console.log('item', item[0]); + ruleForm.value.accidentExpressId = item[0].id + ruleForm.value.accidentName = item[0].accidentName + ruleForm.value.accidentDepartmentId = item[0].accidentDepartmentId + ruleForm.value.accidentDepartmentName = item[0].deptName + ruleForm.value.occurrencePlace = item[0].occurrencePlace + ruleForm.value.occurrenceTime = item[0].occurrenceTime + }; + // 表单提交验证必填项 + const submitForm = async (title: string, formEl: FormInstance | undefined) => { + if (title == '新建事故报告') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + accidentManagementSystemApi() + .addAccidentReport(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 { + console.log('error submit!', fields); + } + }); + } else if (title == '修改事故报告') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + //TODO 上传组件待定 + ruleForm.value.fileList = [] + isShowDialog.value = false; + accidentManagementSystemApi() + .editAccidentReport(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: '修改成功', + type: 'success', + }); + emit('myAdd', true); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + emit('myAdd', true); + } + formEl.resetFields(); + }); + } else { + console.log('error submit!', fields); + } + }); + formEl.resetFields(); + ruleForm.value = { + accidentExpressId:'', + accidentExpressName:'', + accidentDepartmentId:'', + accidentDepartmentName:'', + occurrencePlace:'', + occurrenceTime:'', + + + + accidentType: '', + accidentGrade: '', + economicLoss: '', + minorInjuryNum: '', + seriousInjuryNum: '', + deathNum: '', + accidentCause: '', + reportDeadline: '', + accidentLevel: '', + accidentDelayApply: '', + comprehensiveAnalysisDirect: '', + comprehensiveAnalysisIndirect: '', + rectificationMeasures: '', + accidentHandling: '', + fillInUserUid: '', + fillInUserName:'', + fillInTime: '', + relevantPersonnelRecords: '', + otherMaterials: '', + fileList: [], + }; + } + }; + const resetForm = (formEl: FormInstance | undefined) => { + isShowDialog.value = false; + if (!formEl) return; + formEl.resetFields(); + }; + const handleChange = (val: number) => { + console.log(val); + }; + // 应急队伍弹窗 + const Shows = ref(); + const daiInpt = () => { + Shows.value.openDailog(); + }; + // 选择区域弹窗 + const openRef = ref(); + const regionsDialog = () => { + openRef.value.openDailog(); + }; + // 打开用户选择弹窗 + const userRef = ref(); + const openUser = () => { + userRef.value.openDailog(); + }; + const onUser = (userItem: any) => { + ruleForm.value.fillInUserUid = userItem[0].uid; + ruleForm.value.fillInUserName = userItem[0].realName; + }; + //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 full = ref(false); + const toggleFullscreen = () => { + if (full.value == false) { + full.value = true; + } else { + full.value = false; + } + }; + return { + openDialog, + closeDialog, + isShowDialog, + onCancel, + fileList, + responsibleDepartment, + data, + Search, + ruleForm, + value1, + treeSelect, + daiInpt, + Shows, + ruleFormRef, + submitForm, + rules, + openUser, + userRef, + regionsDialog, + openRef, + toggleFullscreen, + FullScreen, + full, + onUser, + resetForm, + titles, + disabled, + emit, + handleChange, + onSelectItem, + newTreeList, + department, + getTreeList, + propse + }; + }, }); </script> <style scoped lang="scss"> -.textarea{ - height: 168px!important; +.textarea { + height: 168px !important; } -.textarea ::v-deep .el-textarea__inner{ - height: 168px!important; +.textarea ::v-deep .el-textarea__inner { + height: 168px !important; } ::v-deep .el-table__cell { - font-weight: 400; + font-weight: 400; } -.el-divider--horizontal{ - height: 0; - margin: 0; - border-top: transparent; +.el-divider--horizontal { + height: 0; + margin: 0; + border-top: transparent; } -.el-select{ - width: 100%; +.el-select { + width: 100%; } ::v-deep .el-form-item--default .el-form-item__label { - height: 100%; - text-align: right; + height: 100%; + text-align: right; } -</style> \ No newline at end of file +</style> diff --git a/src/views/accidentManagementSystem/accidentReport/index.vue b/src/views/accidentManagementSystem/accidentReport/index.vue index 656a024..72c766d 100644 --- a/src/views/accidentManagementSystem/accidentReport/index.vue +++ b/src/views/accidentManagementSystem/accidentReport/index.vue @@ -49,8 +49,8 @@ type="selection" width="55" /> - <el-table-column prop="accidentExpressId" label="事故名称" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="accidentDepartmentId" label="事故部门" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="accidentName" label="事故名称" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="deptName" label="事故部门" show-overflow-tooltip sortable></el-table-column> <el-table-column prop="accidentType" label="事故类别" show-overflow-tooltip sortable></el-table-column> <el-table-column prop="accidentGrade" label="事故等级" show-overflow-tooltip sortable></el-table-column> <el-table-column prop="occurrencePlace" label="发生地点" show-overflow-tooltip sortable></el-table-column> @@ -165,11 +165,11 @@ const deletAll = ref(); const handleSelectionChange = (val: any) => { let valId = JSON.parse(JSON.stringify(val)); - let arr = []; - for (let i = 0; i < valId.length; i++) { - arr.push(valId[i].id); - } - deletAll.value = arr.toString(); + let arr = []; + for (let i = 0; i < valId.length; i++) { + arr.push(valId[i].id); + } + deletAll.value = arr; // console.log(deletAll.value); if (val.length == 1) { warning.value = false; @@ -214,6 +214,7 @@ // } // 删除用户 const onRowDel = (data: any) => { + var deleteList = [data] ElMessageBox.confirm('确定删除所选项吗?', '提示', { confirmButtonText: '确认', cancelButtonText: '取消', @@ -221,7 +222,7 @@ }) .then(() => { accidentManagementSystemApi() - .deleteAccidentReport(data) + .deleteAccidentReport(deleteList) .then((res) => { if (res.data.code == 200) { ElMessage({ diff --git a/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue b/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue index b96844b..d349645 100644 --- a/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue +++ b/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue @@ -1,244 +1,240 @@ <template> - <el-dialog - v-model="dialogVisible" - title="选择事故名称" - width="900px" - draggable - :fullscreen="full" - > - <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> - <el-row> - <el-col :span="18"> - <el-row> - <el-form ref="ruleFormRef" :model="ruleForm" :inline="true" status-icon> - <el-form-item> - <el-input size="default" v-model="ruleForm.pass" placeholder="id" style="min-width: 215px;"/> - </el-form-item> - <el-form-item> - <el-input size="default" v-model="ruleForm.pass" placeholder="事故名称" style="min-width: 215px;"/> - </el-form-item> - <el-form-item> - <el-input size="default" v-model="ruleForm.pass" placeholder="事故部门" style="min-width: 215px;"/> - </el-form-item> - <el-form-item> - <el-input size="default" v-model="ruleForm.pass" placeholder="发生地点" style="min-width: 215px;"/> - </el-form-item> - <el-form-item> - <el-input size="default" v-model="ruleForm.pass" placeholder="发生时间" style="min-width: 215px;"/> - </el-form-item> - <el-form-item> - <el-button size="default" type="primary" @click="submitForm(ruleFormRef)">查询</el-button> - <el-button size="default" @click="resetForm(ruleFormRef)">重置</el-button> - <el-button size="default" :icon="Delete">清除选择</el-button> - </el-form-item> - </el-form> - </el-row> - <!--<el-table :data="tableData" style="width: 100%;margin-top:20px">--> - <!--<el-table-column type="selection" width="55" />--> - <!--<el-table-column align="center" prop="date" label="id" />--> - <!--<el-table-column align="center" prop="name" label="事故名称"/>--> - <!--<el-table-column align="center" prop="date" label="事故部门" />--> - <!--<el-table-column align="center" prop="name" label="发生地点"/>--> - <!--<el-table-column align="center" prop="name" label="发生时间"/>--> - <!--</el-table>--> - <!--<div class="pages">--> - <!--<el-pagination--> - <!--v-model:currentPage="currentPage4"--> - <!--v-model:page-size="pageSize4"--> - <!--:page-sizes="[100, 200, 300, 400]"--> - <!--:small="small"--> - <!--:disabled="disabled"--> - <!--:background="background"--> - <!--layout="total, sizes, prev, pager, next, jumper"--> - <!--:total="400"--> - <!--@size-change="handleSizeChange"--> - <!--@current-change="handleCurrentChange"--> - <!--/>--> - <!--</div>--> - <el-table - :data="tableData" - style="width: 100%" - ref="multipleTableRef" - > - <el-table-column align="center"> - <template #default="scope"> - <el-radio-group v-model="radio1"> - <el-radio :label="scope.row.id" size="large">{{ null }}</el-radio> - </el-radio-group> - </template> - </el-table-column> - <el-table-column prop="accidentExpressId" label="事故名称" show-overflow-tooltip></el-table-column> - <el-table-column prop="accidentDepartmentId" label="事故部门" show-overflow-tooltip></el-table-column> - <el-table-column prop="accidentType" label="事故类别" show-overflow-tooltip></el-table-column> - <el-table-column prop="accidentGrade" label="事故等级" show-overflow-tooltip></el-table-column> - <el-table-column prop="occurrencePlace" label="发生地点" show-overflow-tooltip></el-table-column> - <el-table-column prop="occurrenceTime" label="发生时间" show-overflow-tooltip></el-table-column> - </el-table> - <div class="pages"> - <el-pagination - v-model:currentPage="pageIndex" - v-model:page-size="pageSize" - :page-sizes="[10, 20, 30]" - :pager-count="5" - layout="total, sizes, prev, pager, next, jumper" - :total="40" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> - </div> - </el-col> - <el-col :span="6"> - <el-tag v-for="tag in dynamicTags" :key="tag" class="mx-1" style="margin:5px" closable :disable-transitions="false" @close="handleClose(tag)"> - {{ tag }} - </el-tag> - </el-col> - </el-row> - <template #footer> - <span class="dialog-footer"> - <el-button @click="dialogVisible = false" size="default">关闭</el-button> - <el-button type="primary" @click="dialogVisible = false" size="default">确定</el-button> - </span> - </template> - </el-dialog> + <div> + <el-dialog v-model="dialogVisible" title="选择事故名称" width="900px" draggable :fullscreen="full"> + <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> + <el-row> + <el-col :span="18"> + <el-row> + <el-form ref="ruleFormRef" :model="ruleForm" :inline="true" status-icon> + <!--<el-form-item>--> + <!--<el-input size="default" v-model="listQuery.searchParams.id" placeholder="id" style="min-width: 215px;"/>--> + <!--</el-form-item>--> + <el-form-item> + <el-input size="default" v-model="listQuery.searchParams.accidentName" placeholder="事故名称" style="min-width: 215px" /> + </el-form-item> + <!--<el-form-item>--> + <!--<el-input size="default" v-model="listQuery.searchParams.deptName" placeholder="事故部门" style="min-width: 215px;"/>--> + <!--</el-form-item>--> + <!--<el-form-item>--> + <!--<el-input size="default" v-model="listQuery.searchParams.occurrencePlace" placeholder="发生地点" style="min-width: 215px;"/>--> + <!--</el-form-item>--> + <!--<el-form-item>--> + <!--<el-input size="default" v-model="listQuery.searchParams.occurrenceTime" placeholder="发生时间" style="min-width: 215px;"/>--> + <!--</el-form-item>--> + <el-form-item> + <el-button size="default" type="primary" @click="listApi">查询</el-button> + <el-button size="default" @click="submitReset">重置</el-button> + <el-button size="default" :icon="Delete" @click="handleClose">清除选择</el-button> + </el-form-item> + </el-form> + </el-row> + <!--<el-table :data="tableData" style="width: 100%;margin-top:20px">--> + <!--<el-table-column type="selection" width="55" />--> + <!--<el-table-column align="center" prop="date" label="id" />--> + <!--<el-table-column align="center" prop="name" label="事故名称"/>--> + <!--<el-table-column align="center" prop="date" label="事故部门" />--> + <!--<el-table-column align="center" prop="name" label="发生地点"/>--> + <!--<el-table-column align="center" prop="name" label="发生时间"/>--> + <!--</el-table>--> + <!--<div class="pages">--> + <!--<el-pagination--> + <!--v-model:currentPage="currentPage4"--> + <!--v-model:page-size="pageSize4"--> + <!--:page-sizes="[100, 200, 300, 400]"--> + <!--:small="small"--> + <!--:disabled="disabled"--> + <!--:background="background"--> + <!--layout="total, sizes, prev, pager, next, jumper"--> + <!--:total="400"--> + <!--@size-change="handleSizeChange"--> + <!--@current-change="handleCurrentChange"--> + <!--/>--> + <!--</div>--> + <el-table :data="tableData" style="width: 100%" ref="multipleTableRef"> + <el-table-column align="center"> + <template #default="scope"> + <el-radio-group v-model="radio1"> + <el-radio :label="scope.row.id" size="large" @click="checkedItem(scope.row)">{{ null }}</el-radio> + </el-radio-group> + </template> + </el-table-column> + <!--<el-table-column prop="id" label="id" show-overflow-tooltip></el-table-column>--> + <el-table-column prop="accidentName" label="事故名称" show-overflow-tooltip></el-table-column> + <el-table-column prop="deptName" label="事故部门" show-overflow-tooltip></el-table-column> + <el-table-column prop="occurrencePlace" label="发生地点" show-overflow-tooltip></el-table-column> + <el-table-column prop="occurrenceTime" label="发生时间" show-overflow-tooltip></el-table-column> + </el-table> + <div class="pages"> + <el-pagination + v-model:currentPage="pageIndex" + v-model:page-size="pageSize" + :page-sizes="[10, 20, 30]" + :pager-count="5" + layout="total, sizes, prev, pager, next, jumper" + :total="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> + </el-col> + <el-col :span="6"> + <el-tag v-for="tag in dynamicTags" :key="tag" class="mx-1" style="margin: 5px" closable :disable-transitions="false" @close="handleClose()"> + {{ tag.accidentName }} + </el-tag> + </el-col> + </el-row> + <template #footer> + <span class="dialog-footer"> + <el-button @click="dialogVisible = false" size="default">关闭</el-button> + <el-button type="primary" @click="submitForm" size="default">确定</el-button> + </span> + </template> + </el-dialog> + </div> </template> <script lang="ts"> +import { defineComponent, reactive, ref } from 'vue'; +import { Delete, FullScreen } from '@element-plus/icons-vue'; import { - defineComponent, - reactive, - ref, - onMounted -} from 'vue'; -import { - Delete, - FullScreen -} from '@element-plus/icons-vue'; -import { - // ElTable, - ElMessage, + // ElTable, + ElMessage, } from 'element-plus'; -import {accidentManagementSystemApi} from "/@/api/workInjuryDeclaration"; +import { accidentManagementSystemApi } from '/@/api/workInjuryDeclaration'; export default defineComponent({ - setup() { - const dialogVisible = ref<boolean>(false); - const openDailog = () => { - dialogVisible.value = true; - }; - // 搜索条件 - const ruleForm = reactive({ - pass: '', - }); - // 定义表格数据 - const tableData = ref([]); - // 列表参数 - const listQuery = reactive({ - pageIndex: 1, - pageSize: 10, - searchParams: { - name: '', - }, - }); - //单选按钮 - const radio1 = ref(''); - // 分页 - const pageIndex = ref(); - const pageSize = ref(); - const total = ref(); - // 分页改变 - const handleSizeChange = (val: number) => { - listQuery.pageSize = val; - }; - // 分页未改变 - const handleCurrentChange = (val: number) => { - listQuery.pageIndex = val; - }; - //查询list数据 - const listApi = async () => { - let res = await accidentManagementSystemApi().getAccidentReportList(listQuery); - if (res.data.code == 200) { - tableData.value = res.data.data; - pageIndex.value = res.data.pageIndex; - pageSize.value = res.data.pageSize; - total.value = res.data.total; - } else { - ElMessage.error(res.data.msg); - } - }; - // 页面加载时 - onMounted(() => { - listApi(); - }); - // 右方点击添加后显示标签 - const dynamicTags = ref(['应急救援组', '工艺抢险组', '后勤保障组']); - const handleClose = (tag: string) => { - dynamicTags.value.splice(dynamicTags.value.indexOf(tag), 1); - }; - //全屏 - const full = ref(false); - const toggleFullscreen = () => { - if (full.value == false) { - full.value = true; - } else { - full.value = false; - } - }; - return { - dialogVisible, - openDailog, - ruleForm, - tableData, - handleSizeChange, - handleCurrentChange, - dynamicTags, - handleClose, - Delete, - toggleFullscreen, - FullScreen, - full, - pageIndex, - pageSize, - total, - listApi, - listQuery, - radio1 - }; - }, + setup(props, { emit }) { + const dialogVisible = ref<boolean>(false); + const openDailog = () => { + dialogVisible.value = true; + listApi(); + }; + // 搜索条件 + const ruleForm = reactive({ + pass: '', + }); + // 定义表格数据 + const tableData = ref([]); + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + accidentName: '', + }, + }); + //单选按钮 + const radio1 = ref(''); + // 分页 + const pageIndex = ref(); + const pageSize = ref(); + const total = ref(); + // 分页改变 + const handleSizeChange = (val: number) => { + listQuery.pageSize = val; + }; + // 分页未改变 + const handleCurrentChange = (val: number) => { + listQuery.pageIndex = val; + }; + const checkedItem = (row: object) => { + dynamicTags.value = [row]; + }; + // 重置 + const submitReset = () => { + listQuery.searchParams = {}; + listApi(); + }; + const submitForm = () => { + emit('selectItem', dynamicTags.value); + dialogVisible.value = false; + }; + //查询list数据 + const listApi = async () => { + let res = await accidentManagementSystemApi().accidentList(listQuery); + if (res.data.code == 200) { + tableData.value = res.data.data; + pageIndex.value = res.data.pageIndex; + pageSize.value = res.data.pageSize; + total.value = res.data.total; + } else { + ElMessage.error(res.data.msg); + } + }; + // 右方点击添加后显示标签 + const dynamicTags = ref([]); + const handleClose = () => { + dynamicTags.value = []; + radio1.value = ''; + }; + //全屏 + const full = ref(false); + const toggleFullscreen = () => { + if (full.value == false) { + full.value = true; + } else { + full.value = false; + } + }; + return { + dialogVisible, + openDailog, + ruleForm, + tableData, + handleSizeChange, + handleCurrentChange, + dynamicTags, + handleClose, + Delete, + toggleFullscreen, + FullScreen, + full, + pageIndex, + pageSize, + total, + listApi, + listQuery, + radio1, + checkedItem, + submitReset, + submitForm, + }; + }, }); </script> <style scoped> -.el-form--inline .el-form-item{ - margin-bottom: 18px!important; - margin-right: 12px; +.el-form--inline .el-form-item { + margin-bottom: 18px !important; + margin-right: 12px; } /*分页*/ -.pages{ - margin-top: 15px; +.pages { + margin-top: 15px; } ::v-deep .el-pagination .el-pager li { - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } ::v-deep .el-pagination .el-pager li.is-active { - background-color: #409eff; - color: #fff; + background-color: #409eff; + color: #fff; } ::v-deep .el-pagination .btn-prev { - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } -::v-deep .el-pagination button:disabled{ - color: #c0c4cc; +::v-deep .el-pagination button:disabled { + color: #c0c4cc; } -::v-deep .el-pagination .btn-next{ - margin: 0 5px; - background-color: #f4f4f5; - color: #606266; - min-width: 30px; - border-radius: 2px; +::v-deep .el-pagination .btn-next { + margin: 0 5px; + background-color: #f4f4f5; + color: #606266; + min-width: 30px; + border-radius: 2px; } </style> diff --git a/src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue b/src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue index 98551ff..6a9b467 100644 --- a/src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue +++ b/src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue @@ -1,552 +1,529 @@ <template> - <div class="system-edit-user-container"> - <el-dialog - :title="titles" - v-model="isShowDialog" - width="769px" - draggable - :fullscreen="full" - > - <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> - <el-form - ref="ruleFormRef" - :model="ruleForm" - size="default" - label-width="120px" - :disabled="disabled" - > - <el-row :gutter="35"> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="申报人姓名" prop="declareUserName"> - <el-input v-model="ruleForm.declareUserName" 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="申报人性别"> - <el-radio-group v-model="ruleForm.declareUserGender"> - <el-radio :label="false">男</el-radio> - <el-radio :label="true">女</el-radio> - </el-radio-group> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="申报人部门" placeholder="请选择"> - <el-tree-select - v-model="ruleForm.declareDepartmentId" - :data="data" 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="accidentExpressId"> - <el-input - v-model="ruleForm.accidentExpressId" - placeholder="请选择" - class="input-with-select" - > - <template #append> - <el-button :icon="Search" @click="daiInpt"/> - </template> - </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" - type="datetime" - class="w100" - placeholder="选择日期时间" - value-format="YYYY-MM-DD HH:mm:ss" - /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="工伤类型" prop="workInjuryType"> - <el-select v-model="ruleForm.workInjuryType" class="w100" placeholder="请选择"> - <el-option label="轻微伤" value="轻微伤"></el-option> - <el-option label="轻伤" value="轻伤"></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="申报日期"> - <el-date-picker - v-model="ruleForm.declareDate" - type="datetime" - class="w100" - placeholder="选择日期时间" - value-format="YYYY-MM-DD HH:mm:ss" - /> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="损失工时" prop="lostTime"> - <el-input v-model="ruleForm.lostTime" 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="visitHospital"> - <el-input v-model="ruleForm.visitHospital" 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="visitResult"> - <el-input v-model="ruleForm.visitResult" placeholder="请填写就诊结果"></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-upload - v-model:file-list="ruleForm.fileList" - class="upload-demo" - action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" - :on-change="handleChange" - > - <el-button type="primary" - >点击上传</el-button> - <template #tip> - <div class="el-upload__tip"> - 添加相关附件 - </div> - </template> - </el-upload> - </el-form-item> - </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="注意事项" prop="mattersNeedingAttention"> - <el-input v-model="ruleForm.mattersNeedingAttention" 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="材料是否齐全"> - <el-radio-group v-model="ruleForm.completeMaterials"> - <el-radio :label="false">否</el-radio> - <el-radio :label="true">是</el-radio> - </el-radio-group> - </el-form-item> - </el-col> + <div class="system-edit-user-container"> + <el-dialog :title="titles" v-model="isShowDialog" width="769px" draggable :fullscreen="full"> + <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> + <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="120px" :disabled="disabled"> + <el-row :gutter="35"> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="申报人姓名" prop="declareUserName"> + <el-input v-model="ruleForm.declareUserName" 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="申报人性别"> + <el-radio-group v-model="ruleForm.declareUserGender"> + <el-radio :label="false">男</el-radio> + <el-radio :label="true">女</el-radio> + </el-radio-group> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="申报人部门" placeholder="请选择"> + <el-tree-select v-model="ruleForm.declareDepartmentId" :data="data" 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="accidentExpressId"> + <el-input v-model="ruleForm.accidentExpressId" placeholder="请选择" class="input-with-select"> + <template #append> + <el-button :icon="Search" @click="daiInpt" /> + </template> + </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" + type="datetime" + class="w100" + placeholder="选择日期时间" + value-format="YYYY-MM-DD HH:mm:ss" + /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="工伤类型" prop="workInjuryType"> + <el-select v-model="ruleForm.workInjuryType" class="w100" placeholder="请选择"> + <el-option label="轻微伤" value="轻微伤"></el-option> + <el-option label="轻伤" value="轻伤"></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="申报日期"> + <el-date-picker + v-model="ruleForm.declareDate" + type="datetime" + class="w100" + placeholder="选择日期时间" + value-format="YYYY-MM-DD HH:mm:ss" + /> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="损失工时" prop="lostTime"> + <el-input v-model="ruleForm.lostTime" 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="visitHospital"> + <el-input v-model="ruleForm.visitHospital" 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="visitResult"> + <el-input v-model="ruleForm.visitResult" placeholder="请填写就诊结果"></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-upload + v-model:file-list="ruleForm.fileList" + class="upload-demo" + action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15" + :on-change="handleChange" + > + <el-button type="primary">点击上传</el-button> + <template #tip> + <div class="el-upload__tip">添加相关附件</div> + </template> + </el-upload> + </el-form-item> + </el-col> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="注意事项" prop="mattersNeedingAttention"> + <el-input v-model="ruleForm.mattersNeedingAttention" 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="材料是否齐全"> + <el-radio-group v-model="ruleForm.completeMaterials"> + <el-radio :label="false">否</el-radio> + <el-radio :label="true">是</el-radio> + </el-radio-group> + </el-form-item> + </el-col> - <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> - <el-form-item label="备注"> - <el-input v-model="ruleForm.remark" type="textarea" placeholder="请填写备注" maxlength="150"></el-input> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> + <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> + <el-form-item label="备注"> + <el-input v-model="ruleForm.remark" type="textarea" placeholder="请填写备注" maxlength="150"></el-input> + </el-form-item> + </el-col> + </el-row> + </el-form> + <template #footer> <span class="dialog-footer"> <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button> - <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button> + <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button> </span> - </template> - </el-dialog> - <AccidentName ref="showRef"/> - <userSelections ref="userRef"/> - <RegionsDialog ref="openRef"/> - </div> + </template> + </el-dialog> + <AccidentName @selectItem="onSelectItem" ref="showRef" /> + <userSelections ref="userRef" /> + <RegionsDialog ref="openRef" /> + </div> </template> <script lang="ts"> import { - // reactive, - ref, - defineComponent + // reactive, + ref, + defineComponent, } from 'vue'; -import type { - UploadUserFile, - FormInstance, -} from 'element-plus' +import type { UploadUserFile, FormInstance } from 'element-plus'; import { ElMessage } from 'element-plus'; -import { - Search, - FullScreen -} from '@element-plus/icons-vue' -import UserSelections from "/@/components/userSelections/index.vue" -import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue' -import RegionsDialog from '/@/components/regionsDialog/index.vue' -import {emergencySuppliesApi} from "/@/api/emergencyResources"; -import {accidentManagementSystemApi} from "/@/api/workInjuryDeclaration"; +import { Search, FullScreen } from '@element-plus/icons-vue'; +import UserSelections from '/@/components/userSelections/index.vue'; +import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue'; +import RegionsDialog from '/@/components/regionsDialog/index.vue'; +import { emergencySuppliesApi } from '/@/api/emergencyResources'; +import { accidentManagementSystemApi } from '/@/api/workInjuryDeclaration'; export default defineComponent({ - name: 'openAdd', - components: { - AccidentName, - UserSelections, - RegionsDialog, - }, - setup(props, { emit }) { - const isShowDialog = ref(false) + name: 'openAdd', + components: { + AccidentName, + UserSelections, + RegionsDialog, + }, + setup(props, { emit }) { + const isShowDialog = ref(false); - const ruleFormRef = ref<FormInstance>() - //定义表单 - const ruleForm = ref ({ - declareUserName: '', - declareUserGender: '', - declareDepartmentId: '', - accidentExpressId: '', - workInjuryType: '', - declareDate: '', - lostTime: '', - visitHospital: '', - visitResult: '', - mattersNeedingAttention: '', - completeMaterials: '', - remark: '', - fileList: [ - { - fileName: '', - fileUrl: '', - } - ], - }); - const titles = ref(); - const disabled = ref(); - // 打开弹窗 - const openDialog = (title: string, id: number, type: boolean) => { - isShowDialog.value = true; - titles.value = title; - disabled.value = type; - if (title == '查看工伤申报' || title == '修改工伤申报') { - accidentManagementSystemApi() - .seeAccidentManagementSystem(id) - .then((res) => { - if (res.data.code == 200) { - ruleForm.value = res.data.data; - } - }); - } - }; - //日期选择器 - const value1 = ref('') - // 上传附件 - const fileList = ref<UploadUserFile[]>([]) - // 可选择树 - const treeSelect = ref() - const tree = [ - { - value: '1', - label: 'Level one 1', - children: [ - { - value: '11', - label: 'Level two 1-1', - children: [ - { - value: '111', - label: 'Level three 1-1-1', - }, - ], - }, - ], - }, - { - value: '2', - label: 'Level one 2', - children: [ - { - value: '21', - label: 'Level two 2-1', - children: [ - { - value: '211', - label: 'Level three 2-1-1', - }, - ], - }, - { - value: '22', - label: 'Level two 2-2', - children: [ - { - value: '221', - label: 'Level three 2-2-1', - }, - ], - }, - ], - }, - { - value: '3', - label: 'Level one 3', - children: [ - { - value: '31', - label: 'Level two 3-1', - children: [ - { - value: '311', - label: 'Level three 3-1-1', - }, - ], - }, - { - value: '32', - label: 'Level two 3-2', - children: [ - { - value: '321', - 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 rules = reactive<FormRules>({ - // teamName: [ - // { - // required: true, - // message: '队伍名称不能为空', - // trigger: 'change', - // }, - // ], - // teamLevel: [ - // { - // required: true, - // message: '队伍级别不能为空', - // trigger: 'change', - // }, - // ], - // teamLeader: [ - // { - // required: true, - // message: '队伍负责人不能为空', - // trigger: 'change', - // }, - // ], - // responsibleDepartment: [ - // { - // required: true, - // message: '负责人部门不能为空', - // trigger: 'change', - // }, - // ], - // teamPhone: [ - // { - // required: true, - // message: '负责人手机不能为空', - // trigger: 'change', - // }, - // ], - // telephone: [ - // { - // required: true, - // message: '固定电话不能为空', - // trigger: 'change', - // }, - // ], - // }) + const ruleFormRef = ref<FormInstance>(); + //定义表单 + const ruleForm = ref({ + declareUserName: '', + declareUserGender: '', + declareDepartmentId: '', + accidentExpressId: '', + workInjuryType: '', + declareDate: '', + lostTime: '', + visitHospital: '', + visitResult: '', + mattersNeedingAttention: '', + completeMaterials: '', + remark: '', + fileList: [ + { + fileName: '', + fileUrl: '', + }, + ], + }); + const titles = ref(); + const disabled = ref(); + // 打开弹窗 + const openDialog = (title: string, id: number, type: boolean) => { + isShowDialog.value = true; + titles.value = title; + disabled.value = type; + if (title == '查看工伤申报' || title == '修改工伤申报') { + accidentManagementSystemApi() + .seeAccidentManagementSystem(id) + .then((res) => { + if (res.data.code == 200) { + ruleForm.value = res.data.data; + } + }); + } + }; + //日期选择器 + const value1 = ref(''); + // 上传附件 + const fileList = ref<UploadUserFile[]>([]); + // 可选择树 + const treeSelect = ref(); + const tree = [ + { + value: '1', + label: 'Level one 1', + children: [ + { + value: '11', + label: 'Level two 1-1', + children: [ + { + value: '111', + label: 'Level three 1-1-1', + }, + ], + }, + ], + }, + { + value: '2', + label: 'Level one 2', + children: [ + { + value: '21', + label: 'Level two 2-1', + children: [ + { + value: '211', + label: 'Level three 2-1-1', + }, + ], + }, + { + value: '22', + label: 'Level two 2-2', + children: [ + { + value: '221', + label: 'Level three 2-2-1', + }, + ], + }, + ], + }, + { + value: '3', + label: 'Level one 3', + children: [ + { + value: '31', + label: 'Level two 3-1', + children: [ + { + value: '311', + label: 'Level three 3-1-1', + }, + ], + }, + { + value: '32', + label: 'Level two 3-2', + children: [ + { + value: '321', + 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 rules = reactive<FormRules>({ + // teamName: [ + // { + // required: true, + // message: '队伍名称不能为空', + // trigger: 'change', + // }, + // ], + // teamLevel: [ + // { + // required: true, + // message: '队伍级别不能为空', + // trigger: 'change', + // }, + // ], + // teamLeader: [ + // { + // required: true, + // message: '队伍负责人不能为空', + // trigger: 'change', + // }, + // ], + // responsibleDepartment: [ + // { + // required: true, + // message: '负责人部门不能为空', + // trigger: 'change', + // }, + // ], + // teamPhone: [ + // { + // required: true, + // message: '负责人手机不能为空', + // trigger: 'change', + // }, + // ], + // telephone: [ + // { + // required: true, + // message: '固定电话不能为空', + // trigger: 'change', + // }, + // ], + // }) - // 事故名称弹窗 - const showRef=ref() - const daiInpt=()=>{ - showRef.value.openDailog() - } - // 表单提交验证必填项 - const submitForm = async (title: string, formEl: FormInstance | undefined) => { - if (title == '新建工伤申报') { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - isShowDialog.value = false; - accidentManagementSystemApi() - .workAdd(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 { - console.log('error submit!', fields); - } - }); - } - else if (title == '修改工伤申报') { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - isShowDialog.value = false; - accidentManagementSystemApi() - .workView(ruleForm.value) - .then((res) => { - if (res.data.code == 200) { - ElMessage({ - showClose: true, - message: '修改成功', - type: 'success', - }); - emit('myAdd', true); - } else { - ElMessage({ - showClose: true, - message: res.data.msg, - type: 'error', - }); - emit('myAdd', true); - } - formEl.resetFields(); - }); - } else { - console.log('error submit!', fields); - } - }); - formEl.resetFields(); - ruleForm.value = { - declareUserName: '', - declareUserGender: '', - declareDepartmentId: '', - accidentExpressId: '', - workInjuryType: '', - declareDate: '', - lostTime: '', - visitHospital: '', - visitResult: '', - mattersNeedingAttention: '', - completeMaterials: '', - remark: '', - fileList: [ - { - fileName: '', - fileUrl: '', - } - ], - } - } - } - const resetForm = (formEl: FormInstance | undefined) => { - isShowDialog.value = false; - if (!formEl) return; - formEl.resetFields(); - }; - // 选择区域弹窗 - const openRef=ref() - const regionsDialog=()=>{ - openRef.value.openDailog() - } - // 打开用户选择弹窗 - const userRef = ref(); - const openUser = () => { - userRef.value.openDialog(); - }; - //全屏 - const full = ref(false); - const toggleFullscreen = () => { - if (full.value == false) { - full.value = true; - } else { - full.value = false; - } - }; - return { - daiInpt, - openDialog, - isShowDialog, - fileList, - responsibleDepartment, - data, - Search, - ruleForm, - value1, - treeSelect, - tree, - showRef, - ruleFormRef, - submitForm, - // rules, - openUser, - userRef, - regionsDialog, - openRef, - toggleFullscreen, - FullScreen, - full, - resetForm, - titles, - disabled, - emit, - }; - }, + // 事故名称弹窗 + const showRef = ref(); + const daiInpt = () => { + showRef.value.openDailog(); + }; + //事故快报回填 + const onSelectItem = (item: any) => { + alert(1); + console.log('item', item); + }; + // 表单提交验证必填项 + const submitForm = async (title: string, formEl: FormInstance | undefined) => { + if (title == '新建工伤申报') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + accidentManagementSystemApi() + .workAdd(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 { + console.log('error submit!', fields); + } + }); + } else if (title == '修改工伤申报') { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + isShowDialog.value = false; + accidentManagementSystemApi() + .workView(ruleForm.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: '修改成功', + type: 'success', + }); + emit('myAdd', true); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + emit('myAdd', true); + } + formEl.resetFields(); + }); + } else { + console.log('error submit!', fields); + } + }); + formEl.resetFields(); + ruleForm.value = { + declareUserName: '', + declareUserGender: '', + declareDepartmentId: '', + accidentExpressId: '', + workInjuryType: '', + declareDate: '', + lostTime: '', + visitHospital: '', + visitResult: '', + mattersNeedingAttention: '', + completeMaterials: '', + remark: '', + fileList: [ + { + fileName: '', + fileUrl: '', + }, + ], + }; + } + }; + const resetForm = (formEl: FormInstance | undefined) => { + isShowDialog.value = false; + if (!formEl) return; + formEl.resetFields(); + }; + // 选择区域弹窗 + const openRef = ref(); + const regionsDialog = () => { + openRef.value.openDailog(); + }; + // 打开用户选择弹窗 + const userRef = ref(); + const openUser = () => { + userRef.value.openDialog(); + }; + //全屏 + const full = ref(false); + const toggleFullscreen = () => { + if (full.value == false) { + full.value = true; + } else { + full.value = false; + } + }; + return { + daiInpt, + openDialog, + isShowDialog, + fileList, + responsibleDepartment, + data, + Search, + ruleForm, + value1, + treeSelect, + tree, + showRef, + ruleFormRef, + submitForm, + // rules, + openUser, + userRef, + regionsDialog, + openRef, + toggleFullscreen, + FullScreen, + full, + resetForm, + titles, + disabled, + emit, + onSelectItem, + }; + }, }); </script> <style scoped lang="scss"> -.textarea{ - height: 168px!important; +.textarea { + height: 168px !important; } -.textarea ::v-deep .el-textarea__inner{ - height: 168px!important; +.textarea ::v-deep .el-textarea__inner { + height: 168px !important; } ::v-deep .el-table__cell { - font-weight: 400; + font-weight: 400; } -.el-divider--horizontal{ - height: 0; - margin: 0; - border-top: transparent; +.el-divider--horizontal { + height: 0; + margin: 0; + border-top: transparent; } -.el-select{ - width: 100%; +.el-select { + width: 100%; } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.2