From 59a02383b283037bc809631de4287d80b79b0eb9 Mon Sep 17 00:00:00 2001 From: 13937891274 <kxc0822> Date: 星期二, 26 七月 2022 14:24:22 +0800 Subject: [PATCH] 演练计划发布对接 --- src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/index.vue | 280 +++++++++++++++++++++++++++++++------------------------ 1 files changed, 158 insertions(+), 122 deletions(-) diff --git a/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/index.vue b/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/index.vue index f468732..d7f0a15 100644 --- a/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/index.vue +++ b/src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/index.vue @@ -3,12 +3,12 @@ <el-card shadow="hover"> <div class="button_Line"> <div class="button_Left"> - <el-button size="default" type="primary" @click="onOpenAdd('新建')"> + <el-button size="default" type="primary" @click="onOpenAdd"> <el-icon> <Plus /> </el-icon>新建 </el-button> - <el-button size="default" type="danger" plain disabled> + <el-button size="default" type="danger" plain :disabled="danger" @click="onDeleteAll"> <el-icon> <Delete /> </el-icon>删除 @@ -36,17 +36,18 @@ :data="tableData" style="width: 100%" ref="multipleTableRef" + @selection-change="handleSelectionChange" > <el-table-column type="selection" width="55" /> - <el-table-column prop="name" label="演练名称" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="place" label="演练地点" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="mode" label="演练方式" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="level" label="演练级别" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="date" label="计划演练日期" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="editDate" label="修改时间" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="drillName" label="演练名称" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="drillAddress" label="演练地点" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="drillWay" label="演练方式" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="drillLevel" label="演练级别" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="drillPlanDate" label="计划演练日期" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="gmtModitify" label="修改时间" show-overflow-tooltip sortable></el-table-column> <el-table-column label="操作" width="260" align="center"> <template #default="scope"> <el-button size="small" text type="primary" @click="releaseOfDrillPlan(0)"> @@ -54,17 +55,17 @@ <VideoPlay /> </el-icon>启动 </el-button> - <el-button size="small" text type="primary" @click="onOpenSee(scope.row)"> + <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="onflowChart(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="onRowDel(scope.row)"> + <el-button size="small" text type="primary" @click="onRowDel(scope.row.id)"> <el-icon> <Delete /> </el-icon>删除 @@ -74,23 +75,20 @@ </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" - :small="small" - :disabled="disabled" - :background="background" layout="total, sizes, prev, pager, next, jumper" - :total="40" + :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> </div> </el-card> - <OpenAdd ref="addRef" /> - <OpenSee ref="seeRef" /> - <FlowChart ref="flowRef"></FlowChart> + <OpenAdd ref="addRef" @myAdd="onMyAdd"/> +<!-- <FlowChart ref="flowRef"></FlowChart>--> <upData ref="upShow"></upData> </div> </template> @@ -98,8 +96,8 @@ <script lang="ts"> import { // toRefs, - // reactive, - // onMounted, + reactive, + onMounted, ref, defineComponent } from 'vue'; @@ -120,41 +118,14 @@ } from '@element-plus/icons-vue' import {useRouter} from "vue-router" import OpenAdd from '/@/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue'; -import OpenSee from '/@/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openSee.vue'; -import FlowChart from '/@/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/flowChart.vue'; +// import FlowChart from '/@/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/flowChart.vue'; import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; - -// 定义表格数据类型 -interface User { - name: string - place: string - mode: string - level: string - phone: string; - date: string; - editDate: 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; -} +import { releaseDrillPlanApi } from '/@/api/releaseDrillPlan'; export default defineComponent({ name: 'systemUser', components: { OpenAdd, - OpenSee, EditPen, Plus, View, @@ -164,101 +135,161 @@ Refresh, VideoPlay, UpData, - FlowChart, + // FlowChart, }, setup() { - // 选择框 - // const value = ref(''); - // const options = - // { - // value: 'Option1', - // label: 'Option1', - // }; - const multipleTableRef = ref<InstanceType<typeof ElTable>>() - const multipleSelection = ref<User[]>([]) - + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + }, + }); + // 定义表格数据 + const tableData = ref([]); + // 列表数据请求 + const listApi = async () => { + let res = await releaseDrillPlanApi().getReleaseDrillPlanList(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', + }); + } + }; + onMounted(() => { + listApi(); + }); // 上传 const upShow=ref() const upButton=()=>{ upShow.value.openDialog() } - // 定义表格数据 - const tableData: User[] = [ - { - name: '应急救援组', - place: '公司', - mode: '实施抢险抢险的应急方案和措施实施 ;', - level: '051383830321', - phone: '13603812900', - date: '2022-06-22 16:31:59', - editDate: '2022-06-22 16:31:59' - }, - { - name: '应急救援组', - place: '公司', - mode: '实施抢险抢险的应急方案和措施实施 ;', - level: '051383830321', - phone: '13603812900', - date: '2022-06-22 16:31:59', - editDate: '2022-06-22 16:31:59' - }, - { - name: '应急救援组', - place: '公司', - mode: '实施抢险抢险的应急方案和措施实施 ;', - level: '051383830321', - phone: '13603812900', - date: '2022-06-22 16:31:59', - editDate: '2022-06-22 16:31:59' - }, - { - name: '应急救援组', - place: '公司', - mode: '实施抢险抢险的应急方案和措施实施 ;', - level: '051383830321', - phone: '13603812900', - date: '2022-06-22 16:31:59', - editDate: '2022-06-22 16:31:59' - } - ] - // 打开新增用户弹窗 + + // 打开新增弹窗 const addRef = ref(); const onOpenAdd = () => { - addRef.value.openDialog(); + addRef.value.openDialog('新建应急演练计划发布',false); }; - // 打开查看用户弹窗 - const seeRef = ref(); - const onOpenSee = (row: TableDataRow) => { - seeRef.value.openDialog(row); + // 新增后刷新 + const onMyAdd = (e: boolean) => { + if (e) { + listApi(); + } else { + listApi(); + } }; // 打开修改用户弹窗 - const flowRef = ref(); - const onflowChart = (row: TableDataRow) => { - flowRef.value.openDialog(row); + const onEdit = (val: string, row: object) => { + if (val == '详情') { + addRef.value.openDialog('查看应急演练计划发布',row,true); + } else { + addRef.value.openDialog('修改应急演练计划发布',row,false); + } }; - // 删除用户 - const onRowDel = (row: TableDataRow) => { - ElMessageBox.confirm(`此操作将永久删除账户名称:“${row}”,是否继续?`, '提示', { + // 打开修改用户弹窗 + // const flowRef = ref(); + // const onflowChart = (row: TableDataRow) => { + // flowRef.value.openDialog(row); + // }; + // 删除 + const onRowDel = (data: any) => { + ElMessageBox.confirm('确定删除所选项吗?', '提示',{ confirmButtonText: '确认', + cancelButtonText: '取消', + type: 'warning', + }).then(() => { + releaseDrillPlanApi() + .deleteReleaseDrillPlan(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(() => { - ElMessage.success('删除成功'); + releaseDrillPlanApi() + .deleteReleaseDrillPlan(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; + listApi(); }; // 分页未改变 const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); + listQuery.pageIndex = val; + listApi(); }; + 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) { + danger.value = false; + } else if (val.length == 0) { + danger.value = true; + } else { + danger.value = false; + } + }; + // 启动跳转 const router=useRouter() const releaseOfDrillPlan=(data:string)=>{ @@ -270,25 +301,30 @@ }) } return { - multipleSelection, - multipleTableRef, upButton, upShow, tableData, - onOpenSee, //查看 - onflowChart, - flowRef, - seeRef, + // onflowChart, + // flowRef, onOpenAdd, //新增 addRef, onRowDel, View , pageIndex, + listQuery, pageSize, handleSizeChange, handleCurrentChange, router, releaseOfDrillPlan, + listApi, + danger, + deletAll, + handleSelectionChange, + onMyAdd, + onDeleteAll, + onEdit, + total, }; }, }); -- Gitblit v1.9.2