From 70c0bc7a7da9630ec94944d5ec7ebcc80c5a59c3 Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期四, 21 七月 2022 11:00:50 +0800 Subject: [PATCH] 应急 --- src/views/contingencyManagement/emergencyResources/emergencySupplies/index.vue | 163 ++++++++++++++++++++++++++---------------------------- 1 files changed, 78 insertions(+), 85 deletions(-) diff --git a/src/views/contingencyManagement/emergencyResources/emergencySupplies/index.vue b/src/views/contingencyManagement/emergencyResources/emergencySupplies/index.vue index 0e79970..e405aae 100644 --- a/src/views/contingencyManagement/emergencyResources/emergencySupplies/index.vue +++ b/src/views/contingencyManagement/emergencyResources/emergencySupplies/index.vue @@ -1,35 +1,29 @@ <template> <div class="system-user-container"> <el-card shadow="hover"> - <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> + <!-- <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> <el-tab-pane label="待评价" name="first"></el-tab-pane> <el-tab-pane label="已评价" name="second"></el-tab-pane> - </el-tabs> + </el-tabs> --> <div class="system-user-search mb15"> - <el-input size="default" placeholder="物资名称" style="max-width: 215px"> </el-input> - <el-button size="default" type="primary" class="ml10"> 查询 </el-button> + <el-input size="default" v-model="listQuery.searchParams.name" placeholder="物资名称" style="max-width: 215px" /> + <el-button size="default" type="primary" class="ml10" @click="listApi"> 查询 </el-button> <el-button size="default" class="ml10" @click="submitReset"> 重置 </el-button> </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-icon> <Edit /> </el-icon>修改 </el-button> <el-button size="default" type="danger" plain disabled> - <el-icon> - <Delete /> </el-icon - >删除 + <el-icon> <Delete /> </el-icon>删除 </el-button> </div> <div class="button_Right"> - <el-button @click="upButton"> + <!-- <el-button @click="upButton"> <el-icon> <Upload /> </el-icon> @@ -38,33 +32,27 @@ <el-icon> <Refresh /> </el-icon> - </el-button> + </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 prop="materialClassification" label="物资分类" min-width="120" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="location" label="存放位置" min-width="120" show-overflow-tooltip sortable></el-table-column> - <el-table-column prop="number" label="存储数量" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="name" label="物资名称" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="number" label="物资编号" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="departmentId" label="负责部门" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="classification" label="物资分类" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="place" label="存放位置" min-width="120" show-overflow-tooltip sortable></el-table-column> + <el-table-column prop="count" 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="onMaintain(scope.row)"> - <el-icon style="margin-right: 5px"> - <EditPen /> </el-icon - >保养 + <el-icon style="margin-right: 5px"> <EditPen /> </el-icon>保养 </el-button> <el-button size="small" text type="primary" @click="onMaintain(scope.row)"> - <el-icon style="margin-right: 5px"> - <EditPen /> </el-icon - >检查 + <el-icon style="margin-right: 5px"> <EditPen /> </el-icon>检查 </el-button> <el-button size="small" text type="primary" @click="onOpenEdit(scope.row)"> - <el-icon style="margin-right: 5px"> - <View /> </el-icon - >查看 + <el-icon style="margin-right: 5px"> <View /> </el-icon>查看 </el-button> <el-button size="small" text type="primary" @click="onOpenEdit(scope.row)"> <el-icon style="margin-right: 5px"> @@ -73,24 +61,22 @@ 修改 </el-button> <el-button size="small" text type="primary" @click="onRowDel(scope.row)"> - <el-icon> - <Delete /> </el-icon - >删除 + <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" - :small="small" - :disabled="disabled" - :background="background" + + layout="total, sizes, prev, pager, next, jumper" - :total="40" + :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> @@ -110,6 +96,8 @@ // onMounted, ref, defineComponent, + reactive, + onMounted, } from 'vue'; import { ElMessageBox, ElMessage, ElTable } from 'element-plus'; import { @@ -126,15 +114,16 @@ import OpenEdit from '/@/views/contingencyManagement/emergencyResources/emergencySupplies/component/openEdit.vue'; import Maintain from '/@/views/contingencyManagement/emergencyResources/emergencySupplies/component/maintain.vue'; import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue'; - +import { emergencyResourcesApi } from '/@/api/emergencyResources'; // 定义表格数据类型 interface User { - teamName: string; - teamLevel: string; - teamDescription: string; - location: string; - materialClassification: string; + id: number; + name: string; number: string; + departmentId: number; + classification: string; + place: string; + count: number; } // 定义接口来定义对象的类型 @@ -171,47 +160,43 @@ setup() { const multipleTableRef = ref<InstanceType<typeof ElTable>>(); const multipleSelection = ref<User[]>([]); - + // 列表参数 + const listQuery = reactive({ + pageIndex: 1, + pageSize: 10, + searchParams: { + name: '', + }, + }); + // 定义表格数据 + const tableData = ref([]); + // 请求列表数据 + const listApi = async () => { + let res = await emergencyResourcesApi().emergencySuppliesList(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 submitReset = () => { + listQuery.searchParams.name = ''; + listApi(); + }; + onMounted(() => { + listApi(); + }); // 上传 const upShow = ref(); const upButton = () => { upShow.value.openDialog(); }; - // 定义表格数据 - const tableData: User[] = [ - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - materialClassification: '事故气体吸收装置', - location: '3#岗微型消防站', - number: '5', - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - materialClassification: '事故气体吸收装置', - location: '3#岗微型消防站', - number: '5', - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - materialClassification: '事故气体吸收装置', - location: '3#岗微型消防站', - number: '5', - }, - { - teamName: '消防安全绳', - teamLevel: 'YJWZ20210208104332', - teamDescription: '安全管理部', - materialClassification: '事故气体吸收装置', - location: '3#岗微型消防站', - number: '5', - }, - ]; + //查看用户弹窗 const seeRef = ref(); const onMaintain = (row: TableDataRow) => { @@ -240,15 +225,18 @@ .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`); + // console.log(`${val} items per page`); + listQuery.pageSize = val; }; - // 分页未改变 + // 分页数 const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); + // console.log(`current page: ${val}`); + listQuery.pageIndex = val; }; return { multipleSelection, @@ -265,8 +253,13 @@ onRowDel, pageIndex, pageSize, + total, handleSizeChange, handleCurrentChange, + listQuery, + listApi, + onMounted, + submitReset, // ...toRefs(state), }; }, -- Gitblit v1.9.2