From 191e2daab12f365990b24a5f47c2fac8474167dc Mon Sep 17 00:00:00 2001 From: 13937891274 <kxc0822> Date: 星期四, 28 七月 2022 18:04:14 +0800 Subject: [PATCH] 数据对接 --- src/views/accidentManagementSystem/accidentReport/index.vue | 362 ++++++++++++++++++++++++++------------------------- 1 files changed, 185 insertions(+), 177 deletions(-) diff --git a/src/views/accidentManagementSystem/accidentReport/index.vue b/src/views/accidentManagementSystem/accidentReport/index.vue index 484d607..656a024 100644 --- a/src/views/accidentManagementSystem/accidentReport/index.vue +++ b/src/views/accidentManagementSystem/accidentReport/index.vue @@ -10,73 +10,60 @@ <Plus /> </el-icon>新建 </el-button> - <el-button size="default" type="warning" plain disabled> + <el-button size="default" type="warning" plain :disabled="warning"> <el-icon> <Edit /> </el-icon>修改 </el-button> - <el-button size="default" type="danger" plain disabled> + <el-button size="default" type="danger" plain @click="onDeleteAll" :disabled="danger"> <el-icon> <Delete /> </el-icon>删除 </el-button> </div> <div class="button_Right"> - <el-button @click="upButton"> - <el-icon> - <Upload /> - </el-icon> - </el-button> - <el-button> - <el-icon> - <Download /> - </el-icon> - </el-button> - <el-button> - <el-icon> - <Refresh /> - </el-icon> - </el-button> +<!-- <el-button @click="upButton">--> +<!-- <el-icon>--> +<!-- <Upload />--> +<!-- </el-icon>--> +<!-- </el-button>--> +<!-- <el-button>--> +<!-- <el-icon>--> +<!-- <Download />--> +<!-- </el-icon>--> +<!-- </el-button>--> +<!-- <el-button>--> +<!-- <el-icon>--> +<!-- <Refresh />--> +<!-- </el-icon>--> +<!-- </el-button>--> </div> </div> <el-table :data="tableData" style="width: 100%" ref="multipleTableRef" + @selection-change="handleSelectionChange" > <el-table-column type="selection" width="55" /> - <el-table-column prop="teamName" label="事故名称" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="teamLevel" label="事故部门" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="teamDescription" label="事故类别" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="phone" label="事故等级" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="attachments" label="发生地点" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="attachments" label="发生时间" show-overflow-tooltip sortable></el-table-column> + <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="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> + <el-table-column prop="occurrenceTime" label="发生时间" show-overflow-tooltip sortable></el-table-column> <el-table-column label="操作" width="260" align="center" fixed="right"> <template #default="scope"> - <el-button size="small" text disabled> - <el-icon style="margin-right: 5px;"> - <EditPen /> - </el-icon>评价 + <el-button size="small" text type="primary" @click="onEdit('详情',scope.row.id)"> + <el-icon style="margin-right: 5px"> <View /> </el-icon>查看 </el-button> - <el-button size="small" text type="primary" @click="onApprovalProgress(scope.row)"> - 审批进度 + <el-button size="small" text type="primary" @click="onEdit('修改',scope.row.id)"> + <el-icon style="margin-right: 5px"> <EditPen /> </el-icon>修改 </el-button> - <el-button size="small" text type="primary" @click="onApprovalProgress(scope.row)"> - <el-icon style="margin-right: 5px;"> - <EditPen /> - </el-icon>查看评价 - </el-button> - <el-button size="small" text type="primary" @click="onRectificationDialog(scope.row)"> - <el-icon style="margin-right: 5px;"> - <EditPen /> - </el-icon>整改 - </el-button> - <el-button size="small" text disabled @click="onOpenEdit(scope.row)"> - 查看整改 - </el-button> + <el-button size="small" text type="primary" @click="onRowDel(scope.row.id)"> 删除 </el-button> </template> </el-table-column> </el-table> @@ -86,9 +73,6 @@ v-model:page-size="pageSize" :page-sizes="[10, 20, 30]" :pager-count="5" - :small="small" - :disabled="disabled" - :background="background" layout="total, sizes, prev, pager, next, jumper" :total="40" @size-change="handleSizeChange" @@ -99,24 +83,23 @@ <el-tab-pane label="已处理" name="second"></el-tab-pane> </el-tabs> </el-card> - <OpenAdd ref="addRef" /> - <ApprovalProgress ref="approvalRef" /> - <RectificationDialog ref="rectificationRef" /> - <OpenEdit ref="editRef" /> - <upData ref="upShow"></upData> + <OpenAdd ref="addRef" @myAdd="onMyAdd" /> +<!-- <upData ref="upShow"></upData>--> </div> </template> <script lang="ts"> import { // toRefs, - // reactive, - // onMounted, + reactive, + onMounted, ref, defineComponent } from 'vue'; import { - ElTable, + // ElTable, + ElMessageBox, + ElMessage, TabsPaneContext, } from 'element-plus'; import { @@ -125,47 +108,18 @@ Download, Refresh, EditPen, + View, Delete, Edit, } from '@element-plus/icons-vue' import OpenAdd from '/@/views/accidentManagementSystem/accidentReport/component/openAdd.vue' -import ApprovalProgress from '/@/views/contingencyManagement/emergencyDrill/drillImplementationEvaluation/component/approvalProgress.vue'; -import OpenEdit from '/@/views/contingencyManagement/panManagement/component/openEdit.vue'; import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; -import RectificationDialog from '/@/views/contingencyManagement/emergencyDrill/drillImplementationEvaluation/component/rectificationDialog.vue'; +import {accidentManagementSystemApi} from "/@/api/workInjuryDeclaration"; -// 定义表格数据类型 -interface User { - teamName: string - teamLevel: string - teamDescription: string - teamPhone: string - phone: string; - describe: string; - responsibleDepartment: string - teamLeader: string - -} - -// 定义接口来定义对象的类型 -interface TableDataRow { - // userName: string; - // userNickname: string; - // roleSign: string; - // department: string[]; - // phone: string; - // email: string; - // sex: string; - // password: string; - // overdueTime: Date; - // // describe: string; - // createTime: string; -} export default defineComponent({ name: 'systemUser', components: { - OpenEdit, EditPen, Plus, Upload, @@ -175,129 +129,183 @@ Edit, Delete, OpenAdd, - ApprovalProgress, - RectificationDialog + View, }, setup() { - // 打开新建用户弹窗 - const addRef = ref(); - const onOpenAdd = () => { - addRef.value.openDialog(); - }; const activeName = ref('first') - const handleClick = (tab: TabsPaneContext, event: Event) => { console.log(tab, event) } - const multipleTableRef = ref<InstanceType<typeof ElTable>>() - const multipleSelection = ref<User[]>([]) - // 上传 - const upShow=ref() - const upButton=()=>{ - upShow.value.openDialog() - } + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + name: '', + }, + }); // 定义表格数据 - const tableData: User[] = [ - { - teamName: '应急救援组', - teamLevel: '公司', - teamDescription: '实施抢险抢险的应急方案和措施实施 ;', - teamPhone: '051383830321', - phone: '13603812900', - describe: '(1)实施抢险抢险的应急方案和措施实施 ;\n' + - '(2)负责现场被困人员、受伤人员抢救工作;\n' + - '(3)在事故有可能扩大进行抢险抢修或救援时,高度注意避免意外伤害;\n' + - '(4)抢险抢修或救援结束后,对结果进行复查和评估。', - responsibleDepartment: '仪表班', - teamLeader: '王磊', - }, - { - teamName: '应急救援组', - teamLevel: '公司', - teamDescription: '实施抢险抢险的应急方案和措施实施 ;', - teamPhone: '051383830321', - phone: '13603812900', - describe: '(1)实施抢险抢险的应急方案和措施实施 ;\n' + - '(2)负责现场被困人员、受伤人员抢救工作;\n' + - '(3)在事故有可能扩大进行抢险抢修或救援时,高度注意避免意外伤害;\n' + - '(4)抢险抢修或救援结束后,对结果进行复查和评估。', - responsibleDepartment: '仪表班', - teamLeader: '王磊', - }, - { - teamName: '应急救援组', - teamLevel: '公司', - teamDescription: '实施抢险抢险的应急方案和措施实施 ;', - teamPhone: '051383830321', - phone: '13603812900', - describe: '(1)实施抢险抢险的应急方案和措施实施 ;\n' + - '(2)负责现场被困人员、受伤人员抢救工作;\n' + - '(3)在事故有可能扩大进行抢险抢修或救援时,高度注意避免意外伤害;\n' + - '(4)抢险抢修或救援结束后,对结果进行复查和评估。', - responsibleDepartment: '仪表班', - teamLeader: '王磊', - }, - { - teamName: '应急救援组', - teamLevel: '公司', - teamDescription: '实施抢险抢险的应急方案和措施实施 ;', - teamPhone: '051383830321', - phone: '13603812900', - describe: '(1)实施抢险抢险的应急方案和措施实施 ;\n' + - '(2)负责现场被困人员、受伤人员抢救工作;\n' + - '(3)在事故有可能扩大进行抢险抢修或救援时,高度注意避免意外伤害;\n' + - '(4)抢险抢修或救援结束后,对结果进行复查和评估。', - responsibleDepartment: '仪表班', - teamLeader: '王磊', + const tableData = ref([]); + // 请求列表数据 + const listApi = async () => { + let res = await accidentManagementSystemApi().getAccidentReportList(listQuery); + // console.log(res); + 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 warning = ref(true); + const danger = ref(true); + 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(); + // console.log(deletAll.value); + if (val.length == 1) { + warning.value = false; + danger.value = false; + } else if (val.length == 0) { + warning.value = true; + danger.value = true; + } else { + warning.value = true; + danger.value = false; + } + }; + // 页面加载时 + onMounted(() => { + listApi(); + }); + // 打开新建用户弹窗 + const addRef = ref(); + const onOpenAdd = () => { + addRef.value.openDialog('新建事故报告',false); + }; + // 新增后刷新 + const onMyAdd = (e: boolean) => { + if (e) { + listApi(); + } else { + listApi(); + } + }; // 打开修改用户弹窗 - const editRef = ref(); - const onOpenEdit = (row: TableDataRow) => { - editRef.value.openDialog(row); + const onEdit = (val: string, row: object) => { + if (val == '详情') { + addRef.value.openDialog('查看事故报告',row,true); + } else { + addRef.value.openDialog('修改事故报告',row,false); + } }; - // 审批进度弹窗 - const approvalRef = ref(); - const onApprovalProgress = () => { - approvalRef.value.openDialog(); + // 上传 + // const upShow=ref() + // const upButton=()=>{ + // upShow.value.openDialog() + // } + // 删除用户 + const onRowDel = (data: any) => { + ElMessageBox.confirm('确定删除所选项吗?', '提示', { + confirmButtonText: '确认', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + accidentManagementSystemApi() + .deleteAccidentReport(data) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + listApi(); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + listApi(); + } + }); + }) + .catch(() => {}); }; - // 整改弹窗 - const rectificationRef = ref(); - const onRectificationDialog = () => { - rectificationRef.value.openDialog(); + // 多选删除 + const onDeleteAll = () => { + ElMessageBox.confirm('确定删除所选项吗?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + accidentManagementSystemApi() + .deleteAccidentReport(deletAll.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + listApi(); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + listApi(); + } + }); + }) + .catch(() => {}); }; // 分页 - const pageIndex = ref(4); - const pageSize = ref(10); + 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; }; return { onOpenAdd, addRef, activeName, handleClick, - multipleSelection, - multipleTableRef, - upButton, - upShow, + // upButton, + // upShow, tableData, - onOpenEdit, //编辑 pageIndex, pageSize, handleSizeChange, handleCurrentChange, - onApprovalProgress, - approvalRef, - onRectificationDialog, - rectificationRef, + listApi, + handleSelectionChange, + warning, + danger, + listQuery, + onRowDel, + total, + onMyAdd, + onDeleteAll, + onEdit, }; }, }); -- Gitblit v1.9.2