From 17c7c68a17e6502d09299ea385e01413595c17d4 Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期五, 29 七月 2022 09:28:20 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqtOut --- src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/index.vue | 630 ++++++++++++++++++++++++++++++-------------------------- 1 files changed, 340 insertions(+), 290 deletions(-) diff --git a/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/index.vue b/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/index.vue index a970373..7493625 100644 --- a/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/index.vue +++ b/src/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/index.vue @@ -1,346 +1,396 @@ <template> - <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-item prop="telephone" > - <el-input - v-model="ruleForm.teamLeader" - placeholder="请选择应急物资" - 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"> - 查询 - </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-button> - <el-button size="default" type="warning" plain disabled> - <el-icon> - <Edit /> - </el-icon>修改 - </el-button> - <el-button size="default" type="danger" plain disabled> - <el-icon> - <Delete /> - </el-icon>删除 - </el-button> - </div> - <div class="button_Right"> - <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" - > - <el-table-column - type="selection" - width="55" - /> - <el-table-column prop="teamName" label="应急物资" min-width="120" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="teamLevel" label="保养结果" min-width="120" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="teamDescription" label="保养日期" min-width="120" show-overflow-tooltip sortable></el-table-column> - <el-table-column label="操作" width="200" align="center" fixed="right"> - <template #default="scope"> - <el-button size="small" text type="primary" @click="OnOpenSee(scope.row)"> - <el-icon style="margin-right: 5px;"> - <View /> - </el-icon>查看 + <div class="system-user-container"> + <el-card shadow="hover"> + <div class="system-user-search mb15"> + <el-form size="default" label-width="80px" :inline="true"> + <el-form-item prop="telephone"> + <el-input v-model="listQuery.searchParams.suppliesId" placeholder="请选择应急物资" 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="onSubmit"> 查询 </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-button> + <el-button size="default" type="warning" plain :disabled="warning"> + <el-icon> + <Edit /> </el-icon + >修改 + </el-button> + <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> + <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="suppliesId" label="应急物资" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="maintainResult" label="保养结果" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="maintainTime" label="保养日期" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column label="操作" width="200" align="center" fixed="right"> + <template #default="scope"> + <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.id)"> + <el-icon style="margin-right: 5px"> + <EditPen /> </el-icon + >修改 </el-button> - <el-button size="small" text type="primary" @click="onRowDel(scope.row)"> - <el-icon> - <Delete /> - </el-icon>删除 - </el-button> - </template> - </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" - :small="small" - :disabled="disabled" - :background="background" - layout="total, sizes, prev, pager, next, jumper" - :total="40" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> - </div> - </el-card> - <EmergencySupplies ref="showRef"/> - <OpenSee ref="editRef" /> - <upData ref="upShow"></upData> - <OpenAdd ref="addRef" /> - </div> + <el-button size="small" text type="primary" @click="onRowDel(scope.row.id)"> + <el-icon> + <Delete /> </el-icon + >删除 + </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="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> + </el-card> + <EmergencySupplies ref="showRef" /> + <OpenSee ref="editRef"/> + <upData ref="upShow"></upData> + <OpenAdd ref="addRef" @myAdd="onMyAdd" /> + </div> </template> <script lang="ts"> import { - // toRefs, reactive, - // onMounted, + onMounted, ref, defineComponent } from 'vue'; import { - ElMessageBox, - ElMessage, - ElTable, - FormInstance, + ElMessageBox, + ElMessage, + // ElTable, + // FormInstance, } from 'element-plus'; -import { - Plus, - Search, - Delete, - Edit, - Download, - Refresh, - View, - EditPen, -} from '@element-plus/icons-vue' -import OpenSee from '/@/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue'; -import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; -import EmergencySupplies from '/@/components/emergencySupplies/index.vue' -import OpenAdd from '/@/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue'; -// 定义表格数据类型 -interface User { - teamName: string - teamLevel: string - teamDescription: string -} +import { Plus, Search, Delete, Edit, Download, Refresh, View, EditPen } from '@element-plus/icons-vue'; +// import OpenSee from '/@/views/contingencyManagement/emergencyPlanStartRecord/component/openSee.vue'; +// import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; +// import EmergencySupplies from '/@/components/emergencySupplies/index.vue'; +// import OpenAdd from '/@/views/contingencyManagement/emergencyResources/maintenanceOfEmergencyMaterials/component/openAdd.vue'; +// import { contingencyApi } from '/@/api/contingency'; +// import { emergencySuppliesMaintainApi } from '/@/api/emergencySuppliesMaintain'; -// 定义接口来定义对象的类型 -interface TableDataRow { -} +import OpenSee from '../../emergencyPlanStartRecord/component/openSee.vue' +import UpData from '../../panManagement/component/upData.vue' +import EmergencySupplies from '../../../../components/emergencySupplies/index.vue' +import OpenAdd from '../maintenanceOfEmergencyMaterials/component/openAdd.vue' +import {maintenanceEmergencyMaterialsApi} from "/@/api/maintenanceEmergencyMaterials"; export default defineComponent({ - name: 'systemUser', - components: { - OpenSee, - View, - OpenAdd, - EditPen, - Plus, - Edit, - Delete, - EmergencySupplies, - Download, - Refresh, - UpData - }, - setup() { - const ruleFormRef = ref<FormInstance>() - //定义表单 - const ruleForm = reactive({ - teamName: '', // 队伍名称 - teamLeader: '', //队伍负责人 - department: [], // 负责人部门 - phone: '', // 负责人手机 - telephone: '', // 固定电话 - }); - - const editRef = ref(); - // 打开新建用户弹窗 - const addRef = ref(); - const onOpenAdd = () => { - addRef.value.openDialog(); - }; - const multipleTableRef = ref<InstanceType<typeof ElTable>>() - const multipleSelection = ref<User[]>([]) - - // 上传 - const upShow=ref() - const upButton=()=>{ - upShow.value.openDialog() - } + name: 'systemUser', + components: { + OpenSee, + View, + OpenAdd, + EditPen, + Plus, + Edit, + Delete, + EmergencySupplies, + Download, + Refresh, + UpData, + }, + setup() { + //定义表单 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + suppliesId: '', + }, + }); // 定义表格数据 - const tableData: User[] = [ - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部' - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', + const tableData = ref([]); + // 请求列表数据 + const onSubmit = async () => { + let res = await maintenanceEmergencyMaterialsApi().getMaintenanceEmergencyMaterialsList(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({ + showClose: true, + message: res.data.msg, + type: 'error', + }); } - ] - // // 打开新增用户弹窗 - // const addRef = ref(); - // const onOpenAdd = () => { - // addRef.value.openDialog(); - // }; - // // 打开修改用户弹窗 - const OnOpenSee = (row: TableDataRow) => { - editRef.value.openDialog(row); + }; + // 重置 + const submitReset = () => { + listQuery.searchParams.suppliesId = ''; + onSubmit(); }; - // 应急物资弹窗 - const showRef=ref() - const daiInpt=()=>{ - showRef.value.openDailog() - } - // 删除用户 - const onRowDel = (row: TableDataRow) => { - ElMessageBox.confirm(`此操作将永久删除账户名称:“${row}”,是否继续?`, '提示', { - confirmButtonText: '确认', + 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(); + 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 addRef = ref(); + const onOpenAdd = () => { + addRef.value.openDialog('新建应急物资保养',false); + }; + // 新增后刷新 + const onMyAdd = (e: boolean) => { + if (e) { + onSubmit(); + } else { + onSubmit(); + } + }; + // 打开修改用户弹窗 + 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(() => { - ElMessage.success('删除成功'); + maintenanceEmergencyMaterialsApi() + .deleteMaintenanceEmergencyMaterials(data) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + onSubmit(); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + onSubmit(); + } + }); }) .catch(() => {}); }; - // 分页 - const pageIndex = ref(4); - const pageSize = ref(10); - // 分页改变 - const handleSizeChange = (val: number) => { - console.log(`${val} items per page`); + // 多选删除 + const onDeleteAll = () => { + ElMessageBox.confirm('确定删除所选项吗?', '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + maintenanceEmergencyMaterialsApi() + .deleteMaintenanceEmergencyMaterials(deletAll.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'success', + }); + onSubmit(); + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + onSubmit(); + } + }); + }) + .catch(() => {}); }; - // 分页未改变 - const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); - }; - return { - // value, - // options, - multipleSelection, - multipleTableRef, - upButton, - upShow, + // 上传 + const upShow = ref(); + const upButton = () => { + upShow.value.openDialog(); + }; + // 应急物资弹窗 + const showRef = ref(); + const daiInpt = () => { + showRef.value.openDailog(); + }; + // 分页 + const pageIndex = ref(); + const pageSize = ref(); + const total = ref(); + // 分页改变 + const handleSizeChange = (val: number) => { + listQuery.pageSize = val; + onSubmit(); + }; + // 分页未改变 + const handleCurrentChange = (val: number) => { + listQuery.pageIndex = val; + onSubmit(); + }; + // 页面加载时 + onMounted(() => { + onSubmit(); + }); + return { + upButton, + upShow, + Edit, + onRowDel, + handleSizeChange, + handleCurrentChange, + Search, + daiInpt, + showRef, + onOpenAdd, //新增 + addRef, + onSubmit, + submitReset, + onMyAdd, + listQuery, + warning, + danger, tableData, - OnOpenSee, //编辑 - editRef, - Edit, - onRowDel, pageIndex, pageSize, - handleSizeChange, - handleCurrentChange, - ruleFormRef, - ruleForm, - Search, - daiInpt, - showRef, - onOpenAdd, //新增 - addRef, - }; - }, + total, + handleSelectionChange, + onDeleteAll, + onEdit, + }; + }, }); </script> <style scoped lang="scss"> -.table_Box{ - padding: 20px; - background-color: #fff; +.table_Box { + padding: 20px; + background-color: #fff; } -.tableForm{ - margin-top: 10px; +.tableForm { + margin-top: 10px; } /*按钮行*/ -.button_Line{ - display: flex; - flex-direction: row; - justify-content: space-between; +.button_Line { + display: flex; + flex-direction: row; + justify-content: space-between; } //弹窗底部边框线 -::v-deep .el-dialog__footer{ - border-top: 1px solid #e8e8e8; - border-radius: 0 0 4px 4px; +::v-deep .el-dialog__footer { + border-top: 1px solid #e8e8e8; + border-radius: 0 0 4px 4px; } //弹窗顶部边框线 ::v-deep .el-dialog__header { - border-bottom: 1px solid #e8e8e8; - margin-right: 0; - border-radius: 4px 4px 0 0; + border-bottom: 1px solid #e8e8e8; + margin-right: 0; + border-radius: 4px 4px 0 0; } //表头 ::v-deep .el-table th.el-table__cell { - background-color: #f6f7fa; - font-weight: 400; - color: #909399; + background-color: #f6f7fa; + font-weight: 400; + color: #909399; } -.el-table .sort-caret.ascending{ - border-bottom-color: #c0c4cc; +.el-table .sort-caret.ascending { + border-bottom-color: #c0c4cc; } //分页 -.pages{ - display: flex; - justify-content: flex-end; - margin-top: 15px; +.pages { + display: flex; + justify-content: flex-end; + 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> \ No newline at end of file -- Gitblit v1.9.2