From 375b6acbd3a8f9cf51f967b09ecd09eccd1a12f3 Mon Sep 17 00:00:00 2001 From: zhaojiale <631455805@qq.com> Date: 星期四, 18 八月 2022 17:53:29 +0800 Subject: [PATCH] 统计 事故统计 --- src/views/accidentManagementSystem/workInjuryDeclaration/index.vue | 272 +++++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 197 insertions(+), 75 deletions(-) diff --git a/src/views/accidentManagementSystem/workInjuryDeclaration/index.vue b/src/views/accidentManagementSystem/workInjuryDeclaration/index.vue index bfa7cb4..56b9e69 100644 --- a/src/views/accidentManagementSystem/workInjuryDeclaration/index.vue +++ b/src/views/accidentManagementSystem/workInjuryDeclaration/index.vue @@ -2,28 +2,37 @@ <div class="system-user-container"> <el-card shadow="hover"> <div class="system-user-search mb15"> - <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="80px" :inline="true"> + <el-form ref="ruleFormRef" size="default" label-width="80px" :inline="true"> <el-form-item prop="telephone"> - <el-input v-model="ruleForm.searchParams.accidentExpressId" placeholder="请选择应急物资" class="input-with-select"> + <el-input v-model="accidentName" placeholder="请选择事故快报" :disabled="true" class="input-with-select"> <template #append> <el-button :icon="Search" @click="daiInpt" /> </template> </el-input> </el-form-item> - <el-button size="default" type="primary" class="ml10" @click="listApi"> 查询 </el-button> - <el-button size="default" class="ml10" @click="submitReset"> 重置 </el-button> + <el-button size="default" type="primary" class="ml10" @click="listApi"> 查询</el-button> + <el-button size="default" class="ml10" @click="submitReset"> 重置</el-button> </el-form> </div> <div class="button_Line"> <div class="button_Left"> <el-button size="default" type="primary" @click="onOpenAdd"> - <el-icon> <Plus /> </el-icon>新建 + <el-icon> + <Plus /> + </el-icon> + 新建 </el-button> - <el-button size="default" type="warning" plain disabled> - <el-icon> <Edit /> </el-icon>修改 + <el-button size="default" type="warning" plain :disabled="warning" @click="onEdit('修改', deletAll[0])"> + <el-icon> + <Edit /> + </el-icon> + 修改 </el-button> - <el-button size="default" type="danger" plain disabled> - <el-icon> <Delete /> </el-icon>删除 + <el-button size="default" type="danger" plain @click="onDeleteAll" :disabled="danger"> + <el-icon> + <Delete /> + </el-icon> + 删除 </el-button> </div> <div class="button_Right"> @@ -44,42 +53,52 @@ </el-button> </div> </div> - <el-table :data="tableData" style="width: 100%" ref="multipleTableRef"> + <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="declareUserName" 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="accidentName" label="事故名称" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="workInjuryType" label="工商类型" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="declareDate" label="申报日期" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="visitHospital" 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"> <Upload /> </el-icon>上报 + <!--<el-button size="small" text disabled>--> + <!--<el-icon style="margin-right: 5px"> <Upload /> </el-icon>上报--> + <!--</el-button>--> + <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="onEdit(scope.row)"> - <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"> + <EditPen /> + </el-icon> + 修改 </el-button> - <el-button size="small" text type="primary" @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> <div class="pages"> <el-pagination + v-if="tableData.length == 0 ? false : true" 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" + :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> </div> </el-card> - <AccidentName ref="showRef" /> - <OpenAdd ref="addRef" /> - <OpenEdit ref="editRef" /> + <AccidentName ref="showRef" @selectItem="onSelectItem" /> + <OpenAdd ref="addRef" @myAdd="onMyAdd" /> + <!-- <OpenEdit ref="editRef" />--> <upData ref="upShow"></upData> </div> </template> @@ -93,24 +112,13 @@ defineComponent, onMounted, } from 'vue'; -import { ElTable, ElMessage } from 'element-plus'; -import { Plus, Download, Refresh, EditPen, Edit, Delete, Search, Upload } from '@element-plus/icons-vue'; +import { ElMessageBox, ElMessage } from 'element-plus'; +import { Plus, Download, Refresh, View, EditPen, Edit, Delete, Search, Upload } from '@element-plus/icons-vue'; import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue'; import OpenAdd from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue'; import OpenEdit from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/openEdit.vue'; import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; import { accidentManagementSystemApi } from '/@/api/accidentManagementSystem'; -// 定义表格数据类型 -interface User { - teamName: string; - teamLevel: string; - teamDescription: string; - teamPhone: string; - phone: string; - describe: string; - responsibleDepartment: string; - teamLeader: string; -} export default defineComponent({ name: 'index', @@ -122,43 +130,72 @@ Download, Refresh, Edit, + View, Delete, UpData, OpenAdd, AccidentName, }, setup() { - const ruleFormRef = ref(); - //定义表单 - const ruleForm = reactive({ + //列表参数 + const listQuery = reactive({ pageIndex: 1, pageSize: 10, searchParams: { - accidentExpressId: "", + accidentExpressId: '', }, }); + //搜索条件回填 + const onSelectItem = (item: any) => { + console.log('item', item[0].accidentName); + listQuery.searchParams.accidentExpressId = item[0].id; + accidentName.value = item[0].accidentName; + }; // 定义表格数据 const tableData = ref([]); - // 列表请求 - const listApi = () => { - accidentManagementSystemApi() - .workList(ruleForm) - .then((res) => { - if (res.data.code == 200) { - tableData.value=res.data.data - } else { - ElMessage.error(res.data.msg) - } - }); + // 请求列表数据 + const listApi = async () => { + let res = await accidentManagementSystemApi().workList(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 submitReset=()=>{ - ruleForm.searchParams.accidentExpressId="" - listApi(); - } + const accidentName = ref(); + // 重置 + const submitReset = () => { + listQuery.searchParams.accidentExpressId = ''; + accidentName.value = ''; + listApi(); + }; + 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; + 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; + } + }; // 事故名称弹窗 const showRef = ref(); const daiInpt = () => { @@ -167,11 +204,16 @@ // 打开新增弹窗 const addRef = ref(); const onOpenAdd = () => { - addRef.value.openDialog(); + addRef.value.openDialog('新建工伤申报', false); }; - const multipleTableRef = ref<InstanceType<typeof ElTable>>(); - const multipleSelection = ref<User[]>([]); - + // 新增后刷新 + const onMyAdd = (e: boolean) => { + if (e) { + listApi(); + } else { + listApi(); + } + }; // 上传 const upShow = ref(); const upButton = () => { @@ -179,26 +221,90 @@ }; // 打开修改用户弹窗 - const editRef = ref(); - const onEdit = (row: TableDataRow) => { - editRef.value.openDialog(row); + // const editRef = ref(); + const onEdit = (val: string, row: object) => { + if (val == '详情') { + addRef.value.openDialog('查看工伤申报', row, true); + } else { + addRef.value.openDialog('修改工伤申报', row, false); + } + }; + // 删除用户 + const onRowDel = (data: any) => { + ElMessageBox.confirm('确定删除所选项吗?', '提示', { + confirmButtonText: '确认', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + accidentManagementSystemApi() + .workDelete([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 onDeleteAll = () => { + ElMessageBox.confirm('确定删除所选项吗?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + accidentManagementSystemApi() + .workDelete(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 { + accidentName, daiInpt, showRef, - multipleSelection, - multipleTableRef, upButton, upShow, tableData, @@ -209,12 +315,20 @@ onEdit, onOpenAdd, addRef, - editRef, - ruleFormRef, + // editRef, listApi, - ruleForm, Search, - submitReset + submitReset, + onDeleteAll, + handleSelectionChange, + warning, + danger, + listQuery, + onRowDel, + total, + onMyAdd, + onSelectItem, + deletAll }; }, }); @@ -224,21 +338,25 @@ padding: 20px; background-color: #fff; } + .tableForm { margin-top: 10px; } + /*按钮行*/ .button_Line { display: flex; flex-direction: row; justify-content: space-between; } + //分页 .pages { display: flex; justify-content: flex-end; margin-top: 15px; } + ::v-deep .el-pagination .el-pager li { margin: 0 5px; background-color: #f4f4f5; @@ -246,10 +364,12 @@ min-width: 30px; border-radius: 2px; } + ::v-deep .el-pagination .el-pager li.is-active { background-color: #409eff; color: #fff; } + ::v-deep .el-pagination .btn-prev { margin: 0 5px; background-color: #f4f4f5; @@ -257,9 +377,11 @@ min-width: 30px; border-radius: 2px; } + ::v-deep .el-pagination button:disabled { color: #c0c4cc; } + ::v-deep .el-pagination .btn-next { margin: 0 5px; background-color: #f4f4f5; -- Gitblit v1.9.2