From a63579a26e93dcd4a4f3ef25f84a90dcf2f665aa Mon Sep 17 00:00:00 2001 From: zhaojiale <631455805@qq.com> Date: 星期一, 01 八月 2022 18:22:04 +0800 Subject: [PATCH] 事故快报中修改事故部门只显示id的问题 --- src/views/accidentManagementSystem/accidentReport/component/openAdd.vue | 4 src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue | 136 ++++++++++++++++------ src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue | 190 ++++++++++++------------------- 3 files changed, 173 insertions(+), 157 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue index 6ed5b58..0bf5e23 100644 --- a/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue @@ -11,7 +11,7 @@ </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" :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"> @@ -21,7 +21,13 @@ </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-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"> @@ -63,7 +69,7 @@ </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-input v-model="ruleForm.fileList" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input> </el-form-item> </el-col> </el-row> @@ -83,7 +89,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'; @@ -93,6 +99,7 @@ import CheckTemplate from '/@/components/checkTemplate/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: { @@ -146,123 +153,64 @@ const fileList = ref<UploadUserFile[]>([]); // 可选择树 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": 1, + "deptName": "总部门", + "children": [] }, { - value: '2', - label: '生产运行部', - children: [ + "value": 3, + "deptName": "根部门2", + "children": [ { - value: '21', - label: '灌装一班', - children: [], - }, - { - value: '22', - label: '工艺四班', - children: [], - }, - ], - }, - { - value: '3', - label: '设备部', - children: [ - { - value: '31', - label: '仪表班', - children: [], - }, - { - value: '32', - label: '机修班', - children: [], - }, - ], - }, + "value": 7, + "deptName": "子部门88", + "children": [] + } + ] + } ]; + //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: [ @@ -356,12 +304,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) => { @@ -456,7 +409,6 @@ ruleForm, value1, treeSelect, - tree, daiInpt, Shows, ruleFormRef, @@ -474,6 +426,10 @@ titles, disabled, emit, + propse, + department, + getTreeList, + newTreeList }; }, }); @@ -496,4 +452,4 @@ .el-select { width: 100%; } -</style> \ No newline at end of file +</style> diff --git a/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue b/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue index ff3487f..039bc5c 100644 --- a/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue +++ b/src/views/accidentManagementSystem/accidentReport/component/openAdd.vue @@ -610,6 +610,9 @@ if (!formEl) return; formEl.resetFields(); }; + const handleChange = (val: number) => { + console.log(val) + }; // 应急队伍弹窗 const Shows=ref() const daiInpt=()=>{ @@ -667,6 +670,7 @@ titles, disabled, emit, + handleChange }; }, }); diff --git a/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue b/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue index 5e9a5a4..b96844b 100644 --- a/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue +++ b/src/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue @@ -33,26 +33,57 @@ </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 :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="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" + 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> @@ -74,12 +105,18 @@ import { defineComponent, reactive, - ref + ref, + onMounted } from 'vue'; import { Delete, FullScreen } from '@element-plus/icons-vue'; +import { + // ElTable, + ElMessage, +} from 'element-plus'; +import {accidentManagementSystemApi} from "/@/api/workInjuryDeclaration"; export default defineComponent({ setup() { const dialogVisible = ref<boolean>(false); @@ -90,32 +127,46 @@ const ruleForm = reactive({ pass: '', }); - // 表格 - const tableData = [ - { - date: '6421cbc6cbb5493eabf9b27e83372d78', - name: '应急救援组', + // 定义表格数据 + const tableData = ref([]); + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + name: '', }, - { - date: '6421cbc6cbb5493eabf9b27e83372d78', - name: '工艺抢险组', - }, - { - date: '6421cbc6cbb5493eabf9b27e83372d78', - name: '后勤保障组', - }, - { - date: '6421cbc6cbb5493eabf9b27e83372d78', - name: '应急救援组', - }, - ]; - const pageSize4 = ref(100); + }); + //单选按钮 + const radio1 = ref(''); + // 分页 + const pageIndex = ref(); + const pageSize = ref(); + const total = ref(); + // 分页改变 const handleSizeChange = (val: number) => { - console.log(`${val} items per page`); + listQuery.pageSize = val; }; + // 分页未改变 const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); + 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) => { @@ -135,7 +186,6 @@ openDailog, ruleForm, tableData, - pageSize4, handleSizeChange, handleCurrentChange, dynamicTags, @@ -144,6 +194,12 @@ toggleFullscreen, FullScreen, full, + pageIndex, + pageSize, + total, + listApi, + listQuery, + radio1 }; }, }); -- Gitblit v1.9.2