yaowang
/
vordm-admin
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交管理员管理灾害代码-liyuchen

This commit is contained in:
李宇辰 2023-04-17 17:17:32 +08:00
parent 7baef94d3c
commit 7ef200e879
5 changed files with 344 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/api/disasterInfo/index.js
View File

@ -8,6 +8,36 @@ export function getList(params) {
params,
});
}
export function getPage(current,size,params) {
return request({
url: '/api/'+moduleName+'/ui/disasterInfo/list',
method: 'get',
params:{
current,
size,
...params
},
});
}
export function updateDisasterManage(data){
return request({
url: '/api/'+moduleName+'/ui/disasterInfo/updateBatch',
method: 'put',
data: data,
});
}
export function removeManage(data){
return request({
url: '/api/'+moduleName+'/ui/disasterInfo/removeManage',
method: 'put',
data: data,
});
}
//review
export function review(data) {
return request({

2
src/views/home/index.vue
View File

@ -558,7 +558,7 @@ const setApplyDisaster = (data) => {
})
setTimeout(() => {
initBarChart(xData,yData);
}, 1000);
}, 700);
}
/**
* 设置灾种数量占比

122
src/views/systemManagement/chiefAdministrator/component/disasterInfo.vue Normal file
View File

@ -0,0 +1,122 @@
<template>
<el-dialog title="management disaster" v-model="state.isShowDialog" width="900px" @close="closeDialog">
<el-config-provider :locale="en">
<div class="system-user-search mb15" style="display: flex;margin-left: 10px;margin-top: 10px;">
<el-input size="default" placeholder="please enter disaster type" style="max-width: 190px" v-model="state.searchName"
clearable></el-input>
<el-button size="default" type="primary" class="ml10" @click="getDisaterInfo">
<el-icon>
<ele-Search/>
</el-icon>
search
</el-button>
</div>
<el-table :data="state.tableData.data" :row-key="getRowKeys" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column property="dictValue" label="DisasterType" width="150" />
<el-table-column property="disasterCountry" label="DisasterCountry" width="200" />
<el-table-column property="disasterKeyword" label="DisasterKeyword" width="200" />d
<el-table-column property="disasterTime" label="DisasterTime" />
<el-table-column property="disasterLevel" label="DisasterLevel" />
</el-table>
<el-pagination @size-change="onHandleSizeChange"
@current-change="onHandleCurrentChange"
class="mt15"
:pager-count="5"
:page-sizes="[10, 20, 30]"
v-model:current-page="state.tableData.param.pageNum"
background
v-model:page-size="state.tableData.param.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total">
</el-pagination>
</el-config-provider>
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default">cancel</el-button>
<el-button type="primary" @click="onSubmit" size="default" :loading="state.isLoading">confirm</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import en from 'element-plus/dist/locale/en.mjs'
import {getPage,updateDisasterManage} from '/@/api/disasterInfo/index.js';
import {reactive} from "vue";
import {ElMessage} from "element-plus";
const emit = defineEmits(['callback']);
const state = reactive({
isShowDialog:false,
table:false,
loading:false,
chiefId:null,
multipleSelection:[],
searchName:'',
tableData: {
data: [],
total: 0,
loading: false,
param: {
search: '',
pageNum: 1,
pageSize: 5,
},
},
});
const getRowKeys = (row) => {
return row.id
}
const handleSelectionChange = (val) => {
state.multipleSelection = val
}
// 打开弹窗
const openDialog = (chiefId) => {
state.isShowDialog = true;
state.chiefId = chiefId;
getDisaterInfo();
};
//获取灾害列表
const getDisaterInfo = () => {
getPage(state.tableData.param.pageNum,state.tableData.param.pageSize,{"respondStatus":3,"chiefId":state.chiefId,"disasterType":state.searchName}).then(res=>{
state.tableData.data = res.records;
state.tableData.total = res.total;
})
}
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
const onCancel = () => {
closeDialog();
}
const onSubmit = () => {
//将选中的灾害转为{"id":"","chiefId":""}格式
const saveRes = state.multipleSelection.map(item=> ({id:item.id,chiefId:state.chiefId}))
updateDisasterManage(saveRes).then(res=>{
ElMessage.success("Management success")
emit('callback');
closeDialog();
}).catch(err=>{
})
}
// 分页改变
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;
getDisaterInfo();
};
// 分页改变
const onHandleCurrentChange = (val) => {
state.tableData.param.pageNum = val;
getDisaterInfo();
};
// 暴露变量
defineExpose({
openDialog,
});
</script>
<style scoped>
</style>

158
src/views/systemManagement/chiefAdministrator/component/manageDisaster.vue Normal file
View File

@ -0,0 +1,158 @@
<template>
<el-config-provider :locale="en">
<el-drawer
v-model="state.table"
title="Management Disaster"
direction="rtl"
size="50%"
>
<div class="system-user-search mb15" style="display: flex;margin-left: 10px;margin-top: 10px;">
<el-input size="default" placeholder="please enter disaster type" style="max-width: 190px" v-model="state.searchName"
clearable></el-input>
<el-button size="default" type="primary" class="ml10" @click="getTableData">
<el-icon>
<ele-Search/>
</el-icon>
search
</el-button>
<el-button size="default" type="success" class="ml10" @click="addDisaster">
<el-icon>
<ele-FolderAdd/>
</el-icon>
add
</el-button>
<el-button size="default" type="danger" class="ml10" @click="batchDelete">
<el-icon>
<ele-Delete/>
</el-icon>
batch delete
</el-button>
</div>
<el-table :data="state.tableData.data" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column property="dictValue" label="DisasterType" width="150" />
<el-table-column property="disasterCountry" label="DisasterCountry" width="200" />
<el-table-column property="disasterTime" label="DisasterTime" />
<el-table-column prop="Operate"
label="Operate"
show-overflow-tooltip>
<template #default="scope">
<el-button link type="primary" size="small" @click="deleteDisaster(scope.row)">Delete</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="onHandleSizeChange"
@current-change="onHandleCurrentChange"
class="mt15"
:pager-count="5"
:page-sizes="[10, 20, 30]"
v-model:current-page="state.tableData.param.pageNum"
background
v-model:page-size="state.tableData.param.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total">
</el-pagination>
<DisasterInfo ref="disasterInfoRef" @callback="getTableData"/>
</el-drawer>
</el-config-provider>
</template>
<script setup>
import en from 'element-plus/dist/locale/en.mjs'
import {reactive, ref} from "vue";
import DisasterInfo from './disasterInfo.vue';
import {getPage,removeManage} from '/@/api/disasterInfo/index.js';
import {ElMessage, ElMessageBox} from "element-plus";
const disasterInfoRef = ref();
const state = reactive({
table:false,
loading:false,
userId:null,
multipleSelection:[],
searchName:'',
tableData: {
data: [],
total: 0,
loading: false,
param: {
search: '',
pageNum: 1,
pageSize: 10,
},
},
});
const handleSelectionChange = (val) => {
state.multipleSelection = val
}
const addDisaster = () => {
disasterInfoRef.value.openDialog(state.userId);
}
//批量删除chief管理员管理灾害数据
const batchDelete = () => {
if(state.multipleSelection.length == 0){
ElMessage.warning("Select the data to be operated first");
return false;
}
ElMessageBox.confirm(`This action batch deletes the disaster data，Whether to continue?`, 'tip', {
confirmButtonText: 'confirm',
cancelButtonText: 'cancel',
type: 'warning',
})
.then(() => {
let id = state.multipleSelection.map(item=>({id:item.id,chiefId:null}))
removeManage(id).then(res=>{
getTableData();
ElMessage.success('delete successfully');
})
})
.catch(() => {});
}
const deleteDisaster = (row) => {
ElMessageBox.confirm(`This operation will delete the disaster：“${row.dictValue}”，Whether to continue?`, 'tip', {
confirmButtonText: 'confirm',
cancelButtonText: 'cancel',
type: 'warning',
})
.then(() => {
let delData = [{"id":row.id,"cheif":null}]
removeManage(delData).then(res=>{
getTableData();
ElMessage.success('Deleted successfully');
})
})
.catch(() => {});
}
// 打开弹窗
const openDialog = (userId) => {
state.table = true;
state.userId = userId;
getTableData();
};
//分页查询已经管理的灾害数据
const getTableData = () => {
getPage(state.tableData.param.pageNum,state.tableData.param.pageSize,{"chiefIdEquals":state.userId,"disasterType":state.searchName}).then(res=>{
state.tableData.data = res.records;
state.tableData.total = res.total;
})
}
// 分页改变
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;
getTableData();
};
// 分页改变
const onHandleCurrentChange = (val) => {
state.tableData.param.pageNum = val;
getTableData();
};
// 暴露变量
defineExpose({
openDialog,
});
</script>
<style scoped>
</style>

33
src/views/systemManagement/chiefAdministrator/index.vue
View File

@ -53,6 +53,7 @@
<template #default="scope">
<el-button link type="primary" size="small" @click="editUser(scope.row)">Edit</el-button>
<el-button link type="primary" size="small" @click="deleteUser(scope.row)">Delete</el-button>
<el-button link type="primary" size="small" @click="manage(scope.row)">Manage</el-button>
</template>
</el-table-column>
</el-table>
@ -71,6 +72,7 @@
</div>
<AddAdministrator ref="administratorRef" @callback="getTableData"/>
<EditAdministrator ref="editAdministratorRef" @callback="getTableData"/>
<ManageDisaster ref="manageRef"/>
<RoleDialog ref="roleDialogRef"
@refresh="getTableData()" />
</div>
@ -79,12 +81,36 @@
<script lang="ts" setup name="systemRole">
import en from 'element-plus/dist/locale/en.mjs'
import type { TabsPaneContext } from 'element-plus';
import ManageDisaster from './component/manageDisaster.vue';
import AddAdministrator from './component/addAdministrator.vue';
import EditAdministrator from './component/editAdministrator.vue';
import {getAdminPage,remove} from '/@/api/response/administrator.js';
const gridData = [
{
date: '2016-05-02',
name: 'Peter Parker',
address: 'Queens, New York City',
},
{
date: '2016-05-04',
name: 'Peter Parker',
address: 'Queens, New York City',
},
{
date: '2016-05-01',
name: 'Peter Parker',
address: 'Queens, New York City',
},
{
date: '2016-05-03',
name: 'Peter Parker',
address: 'Queens, New York City',
},
]
const activeName = ref('first');
const administratorRef = ref();
const editAdministratorRef = ref();
const manageRef = ref();
const handleClick = (tab: TabsPaneContext, event: Event) => {
console.log(tab, event);
};
@ -99,6 +125,8 @@ const RoleDialog = defineAsyncComponent(() => import('/@/views/system/role/dialo
// 定义变量内容
const roleDialogRef = ref();
const state = reactive({
table:false,
loading:false,
multipleSelection:[],
searchName:'',
tableData: {
@ -170,6 +198,11 @@ const deleteUser = (row) => {
})
.catch(() => {});
};
//chief管理员管理灾害抽屉
const manage = (row) => {
manageRef.value.openDialog(row.id);
//state.table = true;
}
// 分页改变
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;