From 15669173497dce16b5d0f17bf4bef36c0d87115c Mon Sep 17 00:00:00 2001 From: zhouwenxuan <1175765986@qq.com> Date: 星期三, 30 八月 2023 17:23:44 +0800 Subject: [PATCH] 气体管理/区域管理 --- src/views/system/user/index.vue | 2 src/views/basicDataManage/areaManage/component/areaDialog.vue | 62 ++++++++++ src/views/basicDataManage/areaManage/index.vue | 91 +++++++++----- src/api/basicDataManage/gasManage/index.ts | 24 ++++ src/api/basicDataManage/areaManage/index.ts | 43 +++++++ src/types/areaManage.d.ts | 3 src/router/index.ts | 2 src/types/gasManage.d.ts | 2 src/views/basicDataManage/gasManage/component/gasDialog.vue | 39 +++++ src/views/basicDataManage/gasManage/index.vue | 50 +++++++- 10 files changed, 268 insertions(+), 50 deletions(-) diff --git a/src/api/basicDataManage/areaManage/index.ts b/src/api/basicDataManage/areaManage/index.ts new file mode 100644 index 0000000..3398402 --- /dev/null +++ b/src/api/basicDataManage/areaManage/index.ts @@ -0,0 +1,43 @@ +import request from '/@/utils/request'; + +export function areaManageApi() { + return { + + //区域分页列表 + getAreaPage: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/region/page`, + method: 'post', + data: data + }); + }, + + //区域新增 + addArea: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/region/add`, + method: 'post', + data: data + }); + }, + + //区域删除 + delArea: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/region/del`, + method: 'post', + data: data + }); + }, + + //区域修改 + editArea: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/region/update`, + method: 'post', + data: data + }); + }, + + }; +} \ No newline at end of file diff --git a/src/api/basicDataManage/gasManage/index.ts b/src/api/basicDataManage/gasManage/index.ts new file mode 100644 index 0000000..c37b56e --- /dev/null +++ b/src/api/basicDataManage/gasManage/index.ts @@ -0,0 +1,24 @@ +import request from '/@/utils/request'; + +export function gasManageApi() { + return { + + //气体分页列表 + getGasPage: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/gasCategory/page`, + method: 'post', + data: data + }); + }, + + //气体新增 + addGas: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/gasCategory/add`, + method: 'post', + data: data + }); + }, + }; +} diff --git a/src/router/index.ts b/src/router/index.ts index 38316aa..efe48a5 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -85,7 +85,7 @@ } else { const storesRoutesList = useRoutesList(pinia); const { routesList } = storeToRefs(storesRoutesList); - if (routesList.value.length === 0) { + if ( routesList.value && routesList.value.length === 0) { // 后端控制路由:路由数据初始化,防止刷新时丢失 await initBackEndControlRoutes(); // 动态添加路由:防止非首页刷新时跳转回首页的问题 diff --git a/src/types/areaManage.d.ts b/src/types/areaManage.d.ts index a432465..f4067b1 100644 --- a/src/types/areaManage.d.ts +++ b/src/types/areaManage.d.ts @@ -13,7 +13,7 @@ pageIndex: number; pageSize: number; searchParams:{ - areaName: string + name: string } }; } @@ -24,6 +24,7 @@ title: string; isShowUserDialog: boolean; areaForm: { + id: string; areaName: string; areaLngLat: Array<LngLat>; areaColor: string; diff --git a/src/types/gasManage.d.ts b/src/types/gasManage.d.ts index 94b7f7b..5f4fe45 100644 --- a/src/types/gasManage.d.ts +++ b/src/types/gasManage.d.ts @@ -14,7 +14,7 @@ pageIndex: number; pageSize: number; searchParams:{ - gasName: string + name: string } }; } diff --git a/src/views/basicDataManage/areaManage/component/areaDialog.vue b/src/views/basicDataManage/areaManage/component/areaDialog.vue index 2223cf0..0b5c743 100644 --- a/src/views/basicDataManage/areaManage/component/areaDialog.vue +++ b/src/views/basicDataManage/areaManage/component/areaDialog.vue @@ -5,7 +5,7 @@ v-model="state.isShowUserDialog" width="600px" > - <el-form :model="state.areaForm" size="default" ref="areaRef" :rules="state.areaFormRules" label-width="110px"> + <el-form :model="state.areaForm" size="default" ref="areaRef" :rules="state.title == '查看区域' ? '' :state.areaFormRules" label-width="110px"> <el-form-item label="区域名称:" prop="areaName"> <el-input v-model.trim="state.areaForm.areaName" :disabled="state.disabled" ></el-input> </el-form-item> @@ -65,6 +65,8 @@ import {reactive, ref} from "vue"; import { AreaState } from "/@/types/areaManage"; import lngDialog from "./lngDialog.vue"; +import {areaManageApi} from "/@/api/basicDataManage/areaManage"; +import {ElMessage} from "element-plus/es"; const areaRef = ref(); const lngRef = ref(); @@ -74,6 +76,7 @@ title: '', isShowUserDialog: false, areaForm: { + id: '', areaName: '', areaLngLat: [], areaColor: '', @@ -86,6 +89,7 @@ }); const openDialog = (type: string, value: any) => { state.isShowUserDialog = true; + reset(); if (type === '新增') { state.disabled = false; state.title = '新增区域'; @@ -99,7 +103,60 @@ state.areaForm = JSON.parse(JSON.stringify(value)); } }; -const onSubmit = () => { +const onSubmit = async () => { + if(state.title == '新增区域' || state.title == '修改区域') { + const valid = areaRef.value.validate(); + if(valid){ + if(state.title == '新增区域'){ + const param = { + name: state.areaForm.areaName, + color: state.areaForm.areaColor, + regionLngLats: state.areaForm.areaLngLat.map(item => { + return { + lng: item.lng, + lat: item.lat + } + }) + } + let res = await areaManageApi().addArea(param); + if(res.data.code == 100) { + ElMessage({ + type: 'success', + message: '新增成功' + }); + }else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }else if(state.title == '修改区域'){ + const param = { + id: state.areaForm.id, + name: state.areaForm.areaName, + color: state.areaForm.areaColor, + regionLngLats: state.areaForm.areaLngLat.map(item => { + return { + lng: item.lng, + lat: item.lat + } + }) + } + let res = await areaManageApi().editArea(param); + if(res.data.code == 100) { + ElMessage({ + type: 'success', + message: '修改成功' + }); + }else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } + } + } console.log("form",state.areaForm) areaRef.value.clearValidate(); state.isShowUserDialog = false; @@ -115,6 +172,7 @@ } const reset = () => { state.areaForm = { + id: '', areaName: '', areaLngLat: [], areaColor: '', diff --git a/src/views/basicDataManage/areaManage/index.vue b/src/views/basicDataManage/areaManage/index.vue index 9af8277..3a003a1 100644 --- a/src/views/basicDataManage/areaManage/index.vue +++ b/src/views/basicDataManage/areaManage/index.vue @@ -3,10 +3,10 @@ <el-card shadow="hover"> <div class="system-menu-search mb15"> <el-form :inline="true" > - <el-form-item label="气体名称:"> - <el-input v-model="state.tableData.listQuery.searchParams.areaName" placeholder="区域名称" ></el-input> + <el-form-item label="区域名称:"> + <el-input v-model="state.tableData.listQuery.searchParams.name" placeholder="区域名称" ></el-input> </el-form-item> - <el-button size="default" type="primary" class="ml10"> + <el-button size="default" type="primary" class="ml10" @click="search()"> <el-icon> <ele-Search /> </el-icon> @@ -32,7 +32,7 @@ <el-table-column align="center" label="区域经纬度"> <template #default="scope"> <div v-for="(item, index) in scope.row.areaLngLat" :key="index"> - [{{item.lng}},{{item.lat}}] + [ {{item.lng}} , {{item.lat}} ] </div> </template> </el-table-column> @@ -65,44 +65,57 @@ </template> <script setup lang="ts"> -import {reactive, ref} from "vue"; +import {reactive, ref, onMounted} from "vue"; import { TableDataState } from "/@/types/areaManage"; import areaDialog from "./component/areaDialog.vue"; import {ElMessage, ElMessageBox} from "element-plus"; +import {areaManageApi} from "/@/api/basicDataManage/areaManage"; const areaRef = ref(); const state = reactive<TableDataState>({ tableData: { - data: [ - // { - // id: 'xxx', - // areaName: 'xxx', - // areaLngLat: [ - // { - // lng: '11', - // lat:'22' - // }, - // { - // lng: '11', - // lat:'22' - // } - // ], - // areaColor: "#ffffff" - // } - ], + data: [], total: 0, loading: false, listQuery: { pageIndex: 1, pageSize: 10, searchParams:{ - areaName:'' + name: '' } } } }); -const initAreaData = () => { +//页面加载 +onMounted(() => { + initAreaData(); +}); + +const initAreaData = async () => { + let res = await areaManageApi().getAreaPage(state.tableData.listQuery); + if(res.data.code == 100) { + if(res.data.data && res.data.data.length > 0) { + state.tableData.data = res.data.data.map((item: any) => { + return { + id: item.id, + areaName: item.name, + areaLngLat: item.regionLngLats, + areaColor: item.color + } + }); + }else { + state.tableData.data = []; + } + state.tableData.total = res.data.total; + state.tableData.listQuery.pageIndex = res.data.pageIndex; + state.tableData.listQuery.pageSize = res.data.pageSize; + }else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } console.log("数据列表") }; const onHandleSizeChange = (val: number) => { @@ -125,17 +138,31 @@ confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning', - } - ) - .then(() => { - ElMessage({ - type: 'success', - message: '删除成功', - }) + }) + .then( async() => { + let res = await areaManageApi().delArea({id: val.id}); + if(res.data.code == 100) { + ElMessage({ + type: 'success', + message: '删除成功', + }); + reset(); + }else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } }) }; +const search = () => { + state.tableData.listQuery.pageIndex = 1; + initAreaData(); +} const reset = () => { - state.tableData.listQuery.searchParams.areaName = ''; + state.tableData.listQuery.pageIndex = 1; + state.tableData.listQuery.searchParams.name = ''; + initAreaData(); } </script> <style scoped lang="scss"> diff --git a/src/views/basicDataManage/gasManage/component/gasDialog.vue b/src/views/basicDataManage/gasManage/component/gasDialog.vue index 1878d0a..d4b57cc 100644 --- a/src/views/basicDataManage/gasManage/component/gasDialog.vue +++ b/src/views/basicDataManage/gasManage/component/gasDialog.vue @@ -5,7 +5,7 @@ v-model="state.isShowUserDialog" width="500px" > - <el-form :model="state.gasForm" size="default" ref="gasRef" :rules="state.gasFormRules" label-width="110px"> + <el-form :model="state.gasForm" size="default" ref="gasRef" :rules="state.title == '新增气体' ? state.gasFormRules : ''" label-width="110px"> <el-form-item label="气体名称:" prop="gasName"> <el-input v-model.trim="state.gasForm.gasName" :disabled="state.disabled" ></el-input> </el-form-item> @@ -32,6 +32,8 @@ <script setup lang="ts"> import {reactive, ref} from "vue"; import { GasState } from "/@/types/gasManage"; +import {gasManageApi} from "/@/api/basicDataManage/gasManage"; +import {ElMessage} from "element-plus"; const gasRef = ref(); const emit = defineEmits(["getGasData"]); @@ -69,10 +71,37 @@ state.gasForm = JSON.parse(JSON.stringify(value)); } }; -const onSubmit = () => { - gasRef.value.clearValidate(); - state.isShowUserDialog = false; - emit('getGasData'); +const onSubmit = async () => { + if(state.title == '新增气体'){ + const valid = await gasRef.value.validate(); + if(valid) { + const param = { + molecularFormula: state.gasForm.gasMolecularFormula, + name: state.gasForm.gasName, + unit: state.gasForm.gasUnit, + threshold: state.gasForm.gasThreshold + } + let res = await gasManageApi().addGas(param); + if (res.data.code === 100) { + ElMessage({ + type: 'success', + message: '新增成功' + }); + gasRef.value.clearValidate(); + state.isShowUserDialog = false; + emit('getGasData'); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } + }else { + gasRef.value.clearValidate(); + state.isShowUserDialog = false; + emit('getGasData'); + } }; const handleClose = () => { diff --git a/src/views/basicDataManage/gasManage/index.vue b/src/views/basicDataManage/gasManage/index.vue index d80628e..b803281 100644 --- a/src/views/basicDataManage/gasManage/index.vue +++ b/src/views/basicDataManage/gasManage/index.vue @@ -4,9 +4,9 @@ <div class="system-menu-search mb15"> <el-form :inline="true" > <el-form-item label="气体名称:"> - <el-input v-model="state.tableData.listQuery.searchParams.gasName" placeholder="气体名称" ></el-input> + <el-input v-model="state.tableData.listQuery.searchParams.name" placeholder="气体名称" ></el-input> </el-form-item> - <el-button size="default" type="primary" class="ml10"> + <el-button size="default" type="primary" class="ml10" @click="search()"> <el-icon> <ele-Search /> </el-icon> @@ -60,9 +60,11 @@ </template> <script setup lang="ts"> -import {reactive, ref} from "vue"; +import {onMounted, reactive, ref} from "vue"; import { TableDataState } from "/@/types/gasManage"; import gasDialog from "./component/gasDialog.vue"; +import { gasManageApi } from "/@/api/basicDataManage/gasManage"; +import {ElMessage} from "element-plus"; const gasRef = ref(); const state = reactive<TableDataState>({ @@ -74,14 +76,42 @@ pageIndex: 1, pageSize: 10, searchParams:{ - gasName:'' + name :'' } } } }); +//页面加载 +onMounted(() => { + initGasData(); +}); -const initGasData = () => { - console.log("数据列表") +const initGasData = async () => { + let res = await gasManageApi().getGasPage(state.tableData.listQuery); + console.log("res",res) + if (res.data.code === 100) { + if(res.data.data && res.data.data.length > 0){ + state.tableData.data = res.data.data.map((item: any) => { + return { + id: item.id, + gasName: item.name, + gasMolecularFormula: item.molecularFormula, + gasThreshold: item.threshold, + gasUnit: item.unit + } + }); + }else { + state.tableData.data = []; + } + state.tableData.total = res.data.total; + state.tableData.listQuery.pageIndex = res.data.pageIndex; + state.tableData.listQuery.pageSize = res.data.pageSize; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } }; const onHandleSizeChange = (val: number) => { state.tableData.listQuery.pageSize = val; @@ -95,8 +125,14 @@ const openDialog = (type: string, value: any) => { gasRef.value.openDialog(type, value); }; +const search = () => { + state.tableData.listQuery.pageIndex = 1; + initGasData(); +} const reset = () => { - state.tableData.listQuery.searchParams.gasName = ''; + state.tableData.listQuery.searchParams.name = ''; + state.tableData.listQuery.pageIndex = 1; + initGasData(); } </script> <style scoped lang="scss"> diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue index b662ae7..04ac9fb 100644 --- a/src/views/system/user/index.vue +++ b/src/views/system/user/index.vue @@ -253,7 +253,7 @@ initUserTableData(); initRoleTableData(); getRoleData(); - getExpertsData(); + // getExpertsData(); getDepList() }); return { -- Gitblit v1.9.2