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

Merge branch 'main' of http://47.92.168.204:3000/VoRDM/vordm-admin

This commit is contained in:
yyhouc 2023-04-19 20:53:44 +08:00
parent e2890a2c8a b531d3ab95
commit be9637e1b1
12 changed files with 1115 additions and 343 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, 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 //review
export function review(data) { export function review(data) {
return request({ return request({

17
src/api/remoteSensingSourceData/remoteSensingSourceData.js
View File

@ -9,9 +9,22 @@ export const getRemoteSensingSourceData = (param) => {
}); });
}; };
export const getSelectionCondition = (param) => { export const getRemoteSensingSourceDataByCondition = (current, size, optionsJson) => {
return request({ return request({
url: '/api/' + moduleName + '/ui/disasterInfo/selectCondition', url: '/api/' + moduleName + '/ui/remoteSensing/Condition',
method: 'get',
contentType: 'application/json',
params: {
optionsJson,
current,
size,
},
});
};
export const getPagesRemoteSensingSourceData = (param) => {
return request({
url: '/api/' + moduleName + '/ui/remoteSensing/PagesData',
method: 'get', method: 'get',
params: param, params: param,
}); });

2
src/views/dataService/pictureInfo/component/editPicture.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<el-dialog title="edit picture" v-model="state.isShowDialog" width="700px" close-on-click-modal="false"> <el-dialog title="edit picture" v-model="state.isShowDialog" width="700px" :close-on-click-modal="false" @close="closeDialog">
<el-form :model="state.ruleForm" size="default" label-width="150px" :rules="rules" ref="adminAddFormRef"> <el-form :model="state.ruleForm" size="default" label-width="150px" :rules="rules" ref="adminAddFormRef">
<el-form-item label="upload picture" prop="img"> <el-form-item label="upload picture" prop="img">
<el-upload <el-upload

432
src/views/dataService/pictureInfo/index.vue
View File

@ -1,44 +1,45 @@
<template> <template>
<div class="system-role-container layout-padding"> <div class="system-role-container layout-padding">
<el-config-provider :locale="en"> <el-config-provider :locale="en">
<el-row :gutter="22"> <el-row :gutter="22">
<el-col :span="10"> <el-col :span="10">
<div class="system-role-padding layout-padding-auto layout-padding-view"> <div class="system-role-padding layout-padding-auto layout-padding-view">
<el-table :data="state.disasterData.data" <el-table :data="state.disasterData.data"
v-loading="state.disasterData.loading" v-loading="state.disasterData.loading"
style="width: 100%" style="width: 100%"
highlight-current-row highlight-current-row
@row-click="tableClick"> @row-click="tableClick">
<el-table-column type="index" <el-table-column type="index"
label="ID" label="ID"
width="50" /> width="50" />
<el-table-column prop="disasterType" <el-table-column prop="disasterType"
label="Disaster type" label="Disaster type"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="disasterCountry" <el-table-column prop="disasterCountry"
label="disaster country" label="disaster country"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="disasterTime" <el-table-column prop="disasterTime"
label="disaster time" label="disaster time"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
</el-table> </el-table>
<el-pagination @size-change="onHandleDisasterSizeChange" <el-pagination @size-change="onHandleDisasterSizeChange"
@current-change="onHandleDisasterCurrentChange" @current-change="onHandleDisasterCurrentChange"
class="mt15" class="mt15"
:pager-count="5" :pager-count="5"
:page-sizes="[10, 20, 30]" :page-sizes="[10, 20, 30]"
v-model:current-page="state.disasterData.param.pageNum" v-model:current-page="state.disasterData.param.pageNum"
background background
v-model:page-size="state.disasterData.param.pageSize" v-model:page-size="state.disasterData.param.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="state.disasterData.total"> :total="state.disasterData.total">
</el-pagination> </el-pagination>
</div> </div>
</el-col> </el-col>
<el-col :span="14"> <el-col :span="14">
<div class="system-role-padding layout-padding-auto layout-padding-view"> <div class="system-role-padding layout-padding-auto layout-padding-view">
<div class="system-user-search mb15" style="display: flex;margin-left: 10px;margin-top: 10px;"> <div class="system-user-search mb15"
<!-- <el-input size="default" placeholder="please enter username" style="max-width: 180px" v-model="state.searchName" style="display: flex;margin-left: 10px;margin-top: 10px;">
<!-- <el-input size="default" placeholder="please enter username" style="max-width: 180px" v-model="state.searchName"
clearable></el-input> clearable></el-input>
<el-button size="default" type="primary" class="ml10" @click="getTableData"> <el-button size="default" type="primary" class="ml10" @click="getTableData">
<el-icon> <el-icon>
@ -46,25 +47,32 @@
</el-icon> </el-icon>
search search
</el-button>--> </el-button>-->
<el-button size="default" type="success" class="ml10" @click="uploadData"> <el-button size="default"
<el-icon> type="success"
<ele-Upload/> class="ml10"
</el-icon> @click="uploadData">
upload <el-icon>
</el-button> <ele-Upload />
<el-button size="default" type="danger" class="ml10" @click="batchDel"> </el-icon>
<el-icon> upload
<ele-Delete/> </el-button>
</el-icon> <el-button size="default"
batch delete type="danger"
</el-button> class="ml10"
</div> @click="batchDel">
<el-icon>
<ele-Delete />
</el-icon>
batch delete
</el-button>
</div>
<el-table :data="state.tableData.data" <el-table :data="state.tableData.data"
v-loading="state.tableData.loading" v-loading="state.tableData.loading"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
style="width: 100%"> style="width: 100%">
<el-table-column type="selection" width="55" /> <el-table-column type="selection"
width="55" />
<el-table-column type="index" <el-table-column type="index"
label="ID" label="ID"
width="50" /> width="50" />
@ -79,17 +87,24 @@
label="image" label="image"
show-overflow-tooltip> show-overflow-tooltip>
<template #default="scope"> <template #default="scope">
<el-popover trigger="hover" placement="right" popper-class="max-h-300px overflow-auto" :width="330"> <el-popover trigger="hover"
placement="right"
popper-class="max-h-300px overflow-auto"
:width="330">
<!-- table中原本显示的图片 --> <!-- table中原本显示的图片 -->
<template #reference> <template #reference>
<img :src="scope.row.link" :alt="scope.row.link" style="max-height: 130px;max-width: 130px"> <img :src="scope.row.link"
:alt="scope.row.link"
style="max-height: 130px;max-width: 130px">
</template> </template>
<!-- 鼠标移入时弹出的图片 --> <!-- 鼠标移入时弹出的图片 -->
<img :src="scope.row.link" alt="" style="height: 150px;width: 300px"> <img :src="scope.row.link"
alt=""
style="height: 150px;width: 300px">
</el-popover> </el-popover>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="size" <!-- <el-table-column prop="size"
label="size" label="size"
show-overflow-tooltip> show-overflow-tooltip>
<template #default="scope"> <template #default="scope">
@ -98,13 +113,19 @@
</el-table-column> </el-table-column>
<el-table-column prop="type" <el-table-column prop="type"
label="type" label="type"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>-->
<el-table-column prop="Operate" <el-table-column prop="Operate"
label="Operate" label="Operate"
show-overflow-tooltip> show-overflow-tooltip>
<template #default="scope"> <template #default="scope">
<el-button size="small" text type="primary" @click="editData(scope.row)">Edit</el-button> <el-button size="small"
<el-button size="small" text type="primary" @click="del(scope.row)">Delete</el-button> text
type="primary"
@click="editData(scope.row)">Edit</el-button>
<el-button size="small"
text
type="primary"
@click="del(scope.row)">Delete</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -119,14 +140,16 @@
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total"> :total="state.tableData.total">
</el-pagination> </el-pagination>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</el-config-provider> </el-config-provider>
<RoleDialog ref="roleDialogRef" <RoleDialog ref="roleDialogRef"
@refresh="getTableData()" /> @refresh="getTableData()" />
<Upload ref="uploadRef" @callback="getTableData"/> <Upload ref="uploadRef"
<EditPicture ref="editUploadRef" @callback="getTableData"/> @callback="getTableData" />
<EditPicture ref="editUploadRef"
@callback="getTableData" />
</div> </div>
</template> </template>
@ -134,8 +157,8 @@
import type { TabsPaneContext } from 'element-plus'; import type { TabsPaneContext } from 'element-plus';
import Upload from './component/upload.vue'; import Upload from './component/upload.vue';
import EditPicture from './component/editPicture.vue'; import EditPicture from './component/editPicture.vue';
import {getPicturePage,getDisasterPage,delPicture} from '/@/api/data/pictureInfo.js'; import { getPicturePage, getDisasterPage, delPicture } from '/@/api/data/pictureInfo.js';
import en from 'element-plus/dist/locale/en.mjs' import en from 'element-plus/dist/locale/en.mjs';
const activeName = ref('first'); const activeName = ref('first');
//复制内容 //复制内容
@ -149,191 +172,198 @@ const editUploadRef = ref();
// 定义变量内容 // 定义变量内容
const roleDialogRef = ref(); const roleDialogRef = ref();
const state = reactive({ const state = reactive({
multipleSelection:[], multipleSelection: [],
tabVal:'first', tabVal: 'first',
disasterId:null, disasterId: null,
disasterData: { disasterData: {
data: [], data: [],
total: 0, total: 0,
loading: false, loading: false,
param: { param: {
search: '', search: '',
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
}, },
}, },
tableData: { tableData: {
data: [], data: [],
total: 0, total: 0,
loading: false, loading: false,
param: { param: {
search: '', search: '',
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
}, },
}, },
}); });
const handleSelectionChange = (val) => { const handleSelectionChange = (val) => {
state.multipleSelection = val state.multipleSelection = val;
} };
//格式化图片名称 //格式化图片名称
const formatName = (name) => { const formatName = (name) => {
if(name){ if (name) {
return name.substr(0,name.indexOf(".")); return name.substr(0, name.indexOf('.'));
} }
return name; return name;
} };
const auditData = (row) => { const auditData = (row) => {
let id = row.id let id = row.id;
auditRef.value.openDialog([{"id":id}]); auditRef.value.openDialog([{ id: id }]);
} };
//格式化字节 //格式化字节
const formatSize = (size) => { const formatSize = (size) => {
var data = ""; var data = '';
if (size < 0.1 * 1024) { //如果小于0.1KB转化成B if (size < 0.1 * 1024) {
data = size.toFixed(2) + "B"; //如果小于0.1KB转化成B
} else if (size < 0.1 * 1024 * 1024) {//如果小于0.1MB转化成KB data = size.toFixed(2) + 'B';
data = (size / 1024).toFixed(2) + "KB"; } else if (size < 0.1 * 1024 * 1024) {
} else if (size < 0.1 * 1024 * 1024 * 1024) { //如果小于0.1GB转化成MB //如果小于0.1MB转化成KB
data = (size / (1024 * 1024)).toFixed(2) + "MB"; data = (size / 1024).toFixed(2) + 'KB';
} else { //其他转化成GB } else if (size < 0.1 * 1024 * 1024 * 1024) {
data = (size / (1024 * 1024 * 1024)).toFixed(2) + "GB"; //如果小于0.1GB转化成MB
} data = (size / (1024 * 1024)).toFixed(2) + 'MB';
var sizestr = data + ""; } else {
var len = sizestr.indexOf("\."); //其他转化成GB
var dec = sizestr.substr(len + 1, 2); data = (size / (1024 * 1024 * 1024)).toFixed(2) + 'GB';
if (dec == "00") {//当小数点后为00时 去掉小数部分 }
return sizestr.substring(0, len) + sizestr.substr(len + 3, 2); var sizestr = data + '';
} var len = sizestr.indexOf('.');
return sizestr; var dec = sizestr.substr(len + 1, 2);
} if (dec == '00') {
//当小数点后为00时 去掉小数部分
return sizestr.substring(0, len) + sizestr.substr(len + 3, 2);
}
return sizestr;
};
const formatSizeUnits = (size) => { const formatSizeUnits = (size) => {
if (size === 0 || size === -1) return '0 B'; if (size === 0 || size === -1) return '0 B';
var k = 1000, // or 1024 var k = 1000, // or 1024
sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'],
i = Math.floor(Math.log(size) / Math.log(k)); i = Math.floor(Math.log(size) / Math.log(k));
return (size / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i]; return (size / Math.pow(k, i)).toPrecision(3) + ' ' + sizes[i];
} };
//灾害表格点击事件 //灾害表格点击事件
const tableClick = (row, column, event) => { const tableClick = (row, column, event) => {
state.disasterId = row.disasterId; state.disasterId = row.disasterId;
getTableData(); getTableData();
} };
// 初始化灾害表格数据 // 初始化灾害表格数据
const getDisasterData = () => { const getDisasterData = () => {
state.disasterData.loading = true; state.disasterData.loading = true;
getDisasterPage(state.disasterData.param.pageNum,state.disasterData.param.pageSize,{}).then(res=>{ getDisasterPage(state.disasterData.param.pageNum, state.disasterData.param.pageSize, {}).then((res) => {
state.disasterData.data = res.records; state.disasterData.data = res.records;
state.disasterData.total = res.total; state.disasterData.total = res.total;
state.disasterData.loading = false; state.disasterData.loading = false;
}) });
} };
// 初始化表格数据 // 初始化表格数据
const getTableData = () => { const getTableData = () => {
state.tableData.loading = true; state.tableData.loading = true;
getPicturePage(state.tableData.param.pageNum,state.tableData.param.pageSize,{"disasterId_equal":state.disasterId,"isDeleted_equal":0}).then(res=>{ getPicturePage(state.tableData.param.pageNum, state.tableData.param.pageSize, { disasterId_equal: state.disasterId, isDeleted_equal: 0 }).then(
state.tableData.data = res.records; (res) => {
state.tableData.total = res.total; state.tableData.data = res.records;
}) state.tableData.total = res.total;
setTimeout(() => { }
state.tableData.loading = false; );
}, 500); setTimeout(() => {
state.tableData.loading = false;
}, 500);
}; };
// 打开上传弹窗 // 打开上传弹窗
const uploadData = () => { const uploadData = () => {
if(state.disasterId == null){ if (state.disasterId == null) {
ElMessage.warning("Please select the disaster first") ElMessage.warning('Please select the disaster first');
return false; return false;
} }
uploadRef.value.openDialog(state.disasterId); uploadRef.value.openDialog(state.disasterId);
}; };
// 打开修改角色弹窗 // 打开修改角色弹窗
const editData = (row) => { const editData = (row) => {
editUploadRef.value.openDialog(row); editUploadRef.value.openDialog(row);
}; };
//批量删除图片数据 //批量删除图片数据
const batchDel = () => { const batchDel = () => {
if(state.multipleSelection.length == 0){ if (state.multipleSelection.length == 0) {
ElMessage.warning("Select the data to be operated first"); ElMessage.warning('Select the data to be operated first');
return false; return false;
} }
ElMessageBox.confirm(`This action batch deletes the picture data，Whether to continue?`, 'tip', { ElMessageBox.confirm(`This action batch deletes the picture data，Whether to continue?`, 'tip', {
confirmButtonText: 'confirm', confirmButtonText: 'confirm',
cancelButtonText: 'cancel', cancelButtonText: 'cancel',
type: 'warning', type: 'warning',
}) })
.then(() => { .then(() => {
let id = state.multipleSelection.map(item=>item.id) let id = state.multipleSelection.map((item) => item.id);
delPicture(id.join()).then(res=>{ delPicture(id.join()).then((res) => {
getTableData(); getTableData();
ElMessage.success('delete successfully'); ElMessage.success('delete successfully');
}) });
}) })
.catch(() => {}); .catch(() => {});
} };
// 删除图片信息 // 删除图片信息
const del = (row) => { const del = (row) => {
ElMessageBox.confirm(`This action will delete the picture：“${row.name}”，，Whether to continue?`, 'tip', { ElMessageBox.confirm(`This action will delete the picture：“${row.name}”，，Whether to continue?`, 'tip', {
confirmButtonText: 'confirm', confirmButtonText: 'confirm',
cancelButtonText: 'cancel', cancelButtonText: 'cancel',
type: 'warning', type: 'warning',
}) })
.then(() => { .then(() => {
delPicture(row.id).then(res=>{ delPicture(row.id).then((res) => {
getTableData(); getTableData();
ElMessage.success('delete successfully'); ElMessage.success('delete successfully');
}) });
}) })
.catch(() => {}); .catch(() => {});
}; };
// 分页改变 // 分页改变
const onHandleDisasterSizeChange = (val) => { const onHandleDisasterSizeChange = (val) => {
state.disasterData.param.pageSize = val; state.disasterData.param.pageSize = val;
getDisasterData(); getDisasterData();
}; };
// 分页改变 // 分页改变
const onHandleDisasterCurrentChange = (val) => { const onHandleDisasterCurrentChange = (val) => {
state.disasterData.param.pageNum = val; state.disasterData.param.pageNum = val;
getDisasterData(); getDisasterData();
}; };
// 分页改变 // 分页改变
const onHandleSizeChange = (val) => { const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val; state.tableData.param.pageSize = val;
getTableData(); getTableData();
}; };
// 分页改变 // 分页改变
const onHandleCurrentChange = (val) => { const onHandleCurrentChange = (val) => {
state.tableData.param.pageNum = val; state.tableData.param.pageNum = val;
getTableData(); getTableData();
}; };
// 页面加载时 // 页面加载时
onMounted(() => { onMounted(() => {
getDisasterData(); getDisasterData();
//getTableData(); //getTableData();
}); });
</script> </script>
<style> <style>
.demo-tabs > .el-tabs__content { .demo-tabs > .el-tabs__content {
padding: 32px; padding: 32px;
color: #6b778c; color: #6b778c;
font-size: 32px; font-size: 32px;
font-weight: 600; font-weight: 600;
} }
.system-role-container { .system-role-container {
.system-role-padding { .system-role-padding {
padding: 15px; padding: 15px;
.el-table { .el-table {
flex: 1; flex: 1;
} }
} }
} }
.demo-tabs > .el-tabs__content { .demo-tabs > .el-tabs__content {
padding: 32px; padding: 32px;
color: #6b778c; color: #6b778c;
font-size: 32px; font-size: 32px;
font-weight: 600; font-weight: 600;
} }
</style> </style>

635
src/views/dataService/remoteSensingData/components/retrievalCondition.vue
View File

@ -1,93 +1,158 @@
<template> <template>
<div> <div>
<div class="system-user-search mb15"> <el-row :gutter="22">
<!-- 选择灾害类型 --> <el-col :span="10">
<el-select v-model="state.value_disasterType" <div class="system-role-padding layout-padding-auto layout-padding-view">
size="default" <span style="margin:2%;font-weight: 600;font-size: 18px;">Disaster Info</span>
clearable <el-table :data="state.disasterData.data"
placeholder="Select disaster type" v-loading="state.disasterData.loading"
@visible-change="searchDisasterType"> style="width: 100%"
<el-option v-for="item in state.options_disasterType" highlight-current-row
:key="item.value" @row-click="tableClick">
:label="item.label" <el-table-column type="index"
:value="item.value" /> label="ID"
</el-select> width="50" />
<!-- 选择灾害时间 --> <el-table-column prop="disasterType"
<el-date-picker v-model="state.value_disasterDate" label="Disaster type"
type="date" show-overflow-tooltip></el-table-column>
placeholder="Select disaster time" <el-table-column prop="disasterCountry"
format="YYYY-MM-DD" label="disaster country"
value-format="YYYY-MM-DD" show-overflow-tooltip></el-table-column>
class="ml10" <el-table-column prop="disasterTime"
size="default" label="disaster time"
@focus="searchDisasterDate" /> show-overflow-tooltip></el-table-column>
<!-- 选择受灾地 --> </el-table>
<el-select v-model="state.value_disasterCountry" <el-pagination @size-change="onHandleDisasterSizeChange"
size="default" @current-change="onHandleDisasterCurrentChange"
clearable class="mt15"
placeholder="Select disaster country" :pager-count="5"
style="margin-left: 0.6%;" :page-sizes="[10, 20, 30]"
@visible-change="searchDisasterCountry"> v-model:current-page="state.disasterData.param.pageNum"
<el-option v-for="item in state.options_disasterCountry" background
:key="item.value" v-model:page-size="state.disasterData.param.pageSize"
:label="item.label" layout="total, sizes, prev, pager, next, jumper"
:value="item.value" /> :total="state.disasterData.total">
</el-select> </el-pagination>
</div>
</el-col>
<el-col :span="14">
<div class="system-role-padding layout-padding-auto layout-padding-view">
<div class="system-user-search mb15"
style="display: flex;margin-left: 10px;margin-top: 10px;">
<!-- 选择灾害类型 -->
<!-- <el-select v-model="state.value_disasterType"
size="default"
clearable
placeholder="Select disaster type"
@visible-change="searchDisasterType">
<el-option v-for="item in state.options_disasterType"
:key="item.value"
:label="item.label"
:value="item.value" />
</el-select> -->
<!-- 选择灾害时间 -->
<!-- <el-date-picker v-model="state.value_disasterDate"
type="date"
placeholder="Select disaster time"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
class="ml10"
size="default"
@focus="searchDisasterDate" /> -->
<!-- 选择受灾地 -->
<!-- <el-select v-model="state.value_disasterCountry"
size="default"
clearable
placeholder="Select disaster country"
style="margin-left: 0.6%;"
@visible-change="searchDisasterCountry">
<el-option v-for="item in state.options_disasterCountry"
:key="item.value"
:label="item.label"
:value="item.value" />
</el-select> -->
<el-button size="default" <el-row>
type="primary" <el-col :span="8">
class="ml10" <el-tree-select v-model="state.value_satelliteType"
@click="searchRemoteSensingSourceData"> :data="state.options_satelliteType"
<el-icon> multiple
<ele-Search /> collapse-tags
</el-icon> collapse-tags-tooltip
Search :render-after-expand="false"
</el-button> show-checkbox
clearable
placeholder="Select satellite type" />
</el-col>
<el-col :span="8"
style="padding-left:1%;">
<el-tree-select v-model="state.value_resolution"
:data="state.options_resolution"
multiple
collapse-tags
collapse-tags-tooltip
:render-after-expand="false"
show-checkbox
clearable
placeholder="Select resolution" />
</el-col>
<el-col :span="5">
<el-button size="default"
type="primary"
class="ml10"
@click="searchRemoteSensingSourceData">
<el-icon>
<ele-Search />
</el-icon>
Search
</el-button>
</el-col>
</el-row>
</div> </div>
<!-- id，卫星类型，生产日期，产品谱段，产品分辨率，云覆盖量，景中心经纬度，元数据下载链接，缩略图 支撑单位 --> <!-- id，卫星类型，生产日期，产品谱段，产品分辨率，云覆盖量，景中心经纬度，元数据下载链接，缩略图 支撑单位 -->
<el-table :data="state.requestData" <el-table :data="state.requestData"
style="width: 100%"> style="width: 100%">
<el-table-column type="index" <el-table-column type="index"
label="Index" label="Index"
align="center" align="center"
width="80"></el-table-column> width="80"></el-table-column>
<el-table-column prop="satelliteCode" <el-table-column prop="satelliteCode"
label="Satellite code" label="Satellite code"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="productTime" <el-table-column prop="productTime"
label="Product time" label="Product time"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="productBandsNum" <el-table-column prop="productBandsNum"
label="Product bands num" label="Product bands num"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="productResolution" <el-table-column prop="productResolution"
label="Product resolution(m)" label="Product resolution(m)"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="cloudCover" <el-table-column prop="cloudCover"
label="Cloud cover(%)" label="Cloud cover(%)"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="sourceOrganization" <el-table-column prop="sourceOrganization"
label="Source organization" label="Source organization"
align="center" align="center"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="downloadUrl" <el-table-column prop="downloadUrl"
label="Download url" label="Download url"
align="center" align="center"
show-overflow-tooltip> </el-table-column> show-overflow-tooltip> </el-table-column>
<!-- <el-table-column prop="Operate" <!-- <el-table-column prop="Operate"
label="Operate" label="Operate"
show-overflow-tooltip></el-table-column> --> show-overflow-tooltip></el-table-column> -->
<!-- <template slot-scope="scope"> <!-- <template slot-scope="scope">
<el-link :href="scope.row.downloadUrl">查看详情</el-link> <el-link :href="scope.row.downloadUrl">查看详情</el-link>
</template> --> </template> -->
<!-- <el-table-column prop="Longitude" <!-- <el-table-column prop="Longitude"
label="Longitude" label="Longitude"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="Latitude" <el-table-column prop="Latitude"
@ -101,9 +166,9 @@
label="Response status" label="Response status"
show-overflow-tooltip></el-table-column> --> show-overflow-tooltip></el-table-column> -->
<!-- <el-table-column prop="describe" label="角色描述" show-overflow-tooltip></el-table-column> <!-- <el-table-column prop="describe" label="角色描述" show-overflow-tooltip></el-table-column>
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> --> <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> -->
<!-- <el-table-column prop="status" label="角色状态" show-overflow-tooltip> <!-- <el-table-column prop="status" label="角色状态" show-overflow-tooltip>
<template #default="scope"> <template #default="scope">
<el-tag type="success" v-if="scope.row.status">启用</el-tag> <el-tag type="success" v-if="scope.row.status">启用</el-tag>
<el-tag type="info" v-else>禁用</el-tag> <el-tag type="info" v-else>禁用</el-tag>
@ -119,27 +184,32 @@
> >
</template> </template>
</el-table-column> --> </el-table-column> -->
</el-table> </el-table>
<el-pagination @size-change="onHandleSizeChange" <el-pagination @size-change="onHandleSizeChange"
@current-change="onHandleCurrentChange" @current-change="onHandleCurrentChange"
class="mt15" class="mt15"
:pager-count="5" :pager-count="5"
:page-sizes="[10, 20, 30]" :page-sizes="[10, 20, 30]"
background background
v-model:current-page="state.tableData.param.pageNum" v-model:current-page="state.tableData.param.pageNum"
v-model:page-size="state.tableData.param.pageSize" v-model:page-size="state.tableData.param.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="state.tableData.total"> :total="state.tableData.total">
</el-pagination> </el-pagination>
</div>
</el-col>
</el-row>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, reactive, onMounted } from 'vue'; import { ref, reactive, onMounted } from 'vue';
import { getRemoteSensingSourceData, getSelectionCondition } from "/@/api/remoteSensingSourceData/remoteSensingSourceData.js"; import { getRemoteSensingSourceData, getRemoteSensingSourceDataByCondition, getPagesRemoteSensingSourceData } from "/@/api/remoteSensingSourceData/remoteSensingSourceData.js";
import { getDisasterPage } from '/@/api/data/otherData.js'
const state = reactive({ const state = reactive({
tableData: { disasterData: {
data: [], data: [],
total: 0, total: 0,
loading: false, loading: false,
@ -149,36 +219,351 @@ const state = reactive({
pageSize: 10, pageSize: 10,
}, },
}, },
tableData: {
data: [],
total: null,
loading: false,
param: {
search: '',
pageNum: 1,
pageSize: 10,
},
},
disasterId: null,
listData: [],
satelliteCodeList: [],
//选择灾害类型下拉框 //选择灾害类型下拉框
options_disasterType: [], // options_disasterType: [],
value_disasterType: '', // value_disasterType: '',
value_disasterDate: '', // value_disasterDate: '',
options_disasterCountry: [], // options_disasterCountry: [],
value_disasterCountry: [], // value_disasterCountry: [],
options_resolution: [{
label: '<0.8m',
value: '<0.8m'
}, {
label: '0.8m-1m',
value: '0.8m-1m'
}, {
label: '1m-10m',
value: '1m-10m'
}, {
label: '10m-30m',
value: '10m-30m'
}, {
label: '30m-50m',
value: '30m-50m'
}, {
label: '>50m',
value: '>50m'
}],
options_satelliteType: [{
label: 'Optical satellite',
value: 'Optical satellite'
}, {
label: 'Hyperspectral satellite',
value: 'Hyperspectral satellite'
}, {
label: 'Radar satellite',
value: 'Radar satellite'
}, {
label: 'Night light satellite',
value: 'Night light satellite'
}],
value_satelliteType: '',
value_resolution: [],
requestData: [], requestData: [],
requestResolution: [],
requestSatellite: []
}) })
// 初始化灾害表格数据
const getDisasterData = () => {
state.disasterData.loading = true;
getDisasterPage(state.disasterData.param.pageNum, state.disasterData.param.pageSize, {}).then(res => {
state.disasterData.data = res.records;
state.disasterData.total = res.total;
state.disasterData.loading = false;
})
}
// 灾害表格点击事件
const tableClick = (row) => {
state.disasterId = row.disasterId;
getData()
}
// 获取遥感影像元数据
const getData = () => {
let data = {
disasterId: state.disasterId,
}
getPagesRemoteSensingSourceData(data).then(
(res) => {
console.log(res.records);
state.requestData = res.records;
state.tableData.total = res.total;
})
// getRemoteSensingSourceDataByCondition(1, 1000, JSON.stringify(data)).then(
// (res) => {
// state.requestData = res.records;
// for (let index = 0; index < res.records.length; index++) {
// state.requestResolution[index] = state.requestData[index].productResolution
// state.requestSatellite[index] = state.requestData[index].satelliteCode
// }
// state.requestResolution = new Set(state.requestResolution)
// state.requestSatellite = new Set(state.requestSatellite)
// })
}
// 查询遥感元数据 // 查询遥感元数据
const searchRemoteSensingSourceData = () => { const searchRemoteSensingSourceData = () => {
const select = { // 获取选择的卫星类型
"disasterType": state.value_disasterType, for (var i = 0; i < state.value_satelliteType.length; i++) {
"disasterDate": state.value_disasterDate, if (state.value_satelliteType[i] == state.options_satelliteType[0].value) {
"disasterCountry": state.value_disasterCountry, state.satelliteCodeList.push('Landset8_OLI_TIRS');
"size": state.tableData.param.pageSize, }
"current": state.tableData.param.pageNum else if (state.value_satelliteType[i] == state.options_satelliteType[1].value) {
let arrData = ['Sentinel -2_Sentinel - 2A', 'Sentinel -2_Sentinel - 2B', 'GF1', 'GF1B', 'GF1C', 'GF1D', 'GF2', 'GF4', 'GF6'];
arrData.forEach(item => {
state.satelliteCodeList.push(item);
})
}
} }
// 请求接口 // 获取选择的分辨率
getRemoteSensingSourceData(select).then( var productResolutionMin = 0
var productResolutionMax = null
for (let index = 0; index < state.value_resolution.length; index++) {
if (state.value_resolution[index] == state.options_resolution[0].value) {
let data = {
productResolutionMin: 0,
productResolutionMax: 0.8
}
state.listData.push(data);
}
if (state.value_resolution[index] == state.options_resolution[1].value) {
let data = {
productResolutionMin: 0.8,
productResolutionMax: 1
}
state.listData.push(data);
}
if (state.value_resolution[index] == state.options_resolution[2].value) {
let data = {
productResolutionMin: 1,
productResolutionMax: 10
}
state.listData.push(data);
}
if (state.value_resolution[index] == state.options_resolution[3].value) {
let data = {
productResolutionMin: 10,
productResolutionMax: 30
}
state.listData.push(data);
}
if (state.value_resolution[index] == state.options_resolution[4].value) {
let data = {
productResolutionMin: 30,
productResolutionMax: 50
}
state.listData.push(data);
}
if (state.value_resolution[index] == state.options_resolution[5].value) {
let data = {
productResolutionMin: 50,
productResolutionMax: 1000
}
state.listData.push(data);
}
}
let dataNew = {};
if (state.satelliteCodeList.length != 0) {
dataNew = {
disasterId: state.disasterId,
satelliteCodeList: state.satelliteCodeList.join(","),
productResolutionVos: state.listData
}
} else {
dataNew = {
disasterId: state.disasterId,
productResolutionVos: state.listData
}
}
getDataByCondition(state.tableData.param.pageNum, state.tableData.param.pageSize, dataNew)
}
// 根据检索条件检索遥感元数据
const getDataByCondition = (current, size, dataNew) => {
console.log('传过来的数据：', state.tableData.param.pageNum);
getRemoteSensingSourceDataByCondition(current, size, JSON.stringify(dataNew)).then(
(res) => { (res) => {
state.requestData = res.records; state.requestData = res.records;
state.tableData.total = res.total; state.tableData.total = res.total;
state.tableData.param.pageNum = res.current;
state.tableData.param.pageSize = res.size;
console.log(state.requestData)
}) })
} }
// 获取分页遥感元数据
const getTableData = (condition) => {
state.tableData.loading = true;
getPagesRemoteSensingSourceData(condition).then(
(res) => {
state.requestData = res.records;
state.tableData.total = res.total;
var requestSatellite = []
var requestResolution = []
for (let index = 0; index < state.requestData.length; index++) {
requestSatellite[index] = state.requestData[index].satelliteCode
requestResolution[index] = state.requestData[index].productResolution
}
// 获取卫星类型
var uniSatellite = unique(requestSatellite);
var lenSatellite = uniSatellite.length
for (let index = 0; index < lenSatellite; index++) {
let A = {}
A['label'] = uniSatellite[index]
A['value'] = uniSatellite[index]
state.options_satelliteType[index] = A
}
// 获取分辨率
var uniResolution = unique(requestResolution);
var lenResolution = uniResolution.length
for (let index = 0; index < lenResolution; index++) {
let A = {}
A['label'] = uniResolution[index]
A['value'] = uniResolution[index]
state.options_resolution[index] = A
}
})
// setTimeout(() => {
// state.tableData.loading = false;
// }, 500);
}
// 获取卫星类型和分辨率
const getSatelliteAndResolution = () => {
var requestSatellite = []
var requestResolution = []
for (let index = 0; index < state.requestData.length; index++) {
requestSatellite[index] = state.requestData[index].satelliteCode
requestResolution[index] = state.requestData[index].productResolution
}
// 获取卫星类型
var uniSatellite = unique(requestSatellite);
var lenSatellite = uniSatellite.length
for (let index = 0; index < lenSatellite; index++) {
let A = {}
A['label'] = uniSatellite[index]
A['value'] = uniSatellite[index]
state.options_satelliteType[index] = A
}
// 获取分辨率
var uniResolution = unique(requestResolution);
var lenResolution = uniResolution.length
for (let index = 0; index < lenResolution; index++) {
let A = {}
A['label'] = uniResolution[index]
A['value'] = uniResolution[index]
state.options_resolution[index] = A
}
}
// 数组列表去重
const unique = (arr) => {
return arr.filter(function (item, index, arr) {
return arr.indexOf(item, 0) === index;
});
}
// 灾害信息表size改变
const onHandleDisasterSizeChange = (val) => {
state.disasterData.param.pageSize = val;
getDisasterData();
};
// 灾害信息表current改变
const onHandleDisasterCurrentChange = (val) => {
state.disasterData.param.pageNum = val;
getDisasterData();
};
// 遥感元数据表size改变
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;
state.tableData.param.pageNum = state.tableData.param.pageNum;
let dataNew = {};
if (state.satelliteCodeList.length != 0) {
dataNew = {
disasterId: state.disasterId,
satelliteCodeList: state.satelliteCodeList.join(","),
productResolutionVos: state.listData
}
} else {
dataNew = {
disasterId: state.disasterId,
productResolutionVos: state.listData
}
}
getDataByCondition(state.tableData.param.pageNum, state.tableData.param.pageSize, dataNew)
// var condition = {
// current: state.tableData.param.pageNum,
// size: 10,
// disasterId: state.disasterId,
// satelliteCode: state.satelliteSelected,
// productResolution: state.resolutionSelected
// }
// // searchRemoteSensingSourceData()
// getTableData(condition)
};
// 遥感元数据表current改变
const onHandleCurrentChange = (val) => {
state.tableData.param.pageSize = state.tableData.param.pageSize;
state.tableData.param.pageNum = val;
console.log('当前页：', state.tableData.param.pageNum);
let dataNew = {};
if (state.satelliteCodeList.length != 0) {
dataNew = {
disasterId: state.disasterId,
satelliteCodeList: state.satelliteCodeList.join(","),
productResolutionVos: state.listData
}
} else {
dataNew = {
disasterId: state.disasterId,
productResolutionVos: state.listData
}
}
getDataByCondition(state.tableData.param.pageNum, state.tableData.param.pageSize, dataNew)
// var condition = {
// current: state.tableData.param.pageNum,
// size: 10,
// disasterId: state.disasterId,
// satelliteCode: state.satelliteSelected,
// productResolution: state.resolutionSelected
// }
// searchRemoteSensingSourceData()
// getTableData(condition)
};
onMounted(() => {
getDisasterData();
})
// 查询受灾国家 // 查询受灾国家
const searchDisasterCountry = () => { const searchDisasterCountry = () => {
const selectCountry = { const selectCountry = {
@ -246,25 +631,13 @@ const searchDisasterDate = () => {
}) })
} }
} }
//每页显示条数改变
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;
state.tableData.param.pageNum = state.tableData.param.pageNum;
searchRemoteSensingSourceData()
};
//当前页变动
const onHandleCurrentChange = (val) => {
state.tableData.param.pageSize = state.tableData.param.pageSize;
state.tableData.param.pageNum = val;
searchRemoteSensingSourceData()
};
onMounted(() => {
})
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.system-role-padding {
padding-bottom: 2%;
}
.el-pagination {
padding-left: 1%;
}
</style> </style>

6
src/views/dataService/remoteSensingData/components/searchCondition.vue
View File

@ -84,6 +84,8 @@
v-model="state.satelliteSelected" v-model="state.satelliteSelected"
:data="sensor" :data="sensor"
multiple multiple
collapse-tags
collapse-tags-tooltip
:render-after-expand="false" :render-after-expand="false"
show-checkbox show-checkbox
placeholder="Select satellite type" /> placeholder="Select satellite type" />
@ -382,6 +384,10 @@ const ClearCondition = () => {
} }
.coordinateBtn { .coordinateBtn {
width: 90%; width: 90%;
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.lowerBtn { .lowerBtn {
width: 90%; width: 90%;

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

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

12
src/views/systemManagement/administrator/index.vue
View File

@ -35,18 +35,18 @@
<el-table-column prop="disasterKeyword" <el-table-column prop="disasterKeyword"
label="DisasterKeyword" label="DisasterKeyword"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="disasterLevel"
label="DisasterLevel"
show-overflow-tooltip></el-table-column>
<el-table-column prop="disasterTime"
label="DisasterTime"
show-overflow-tooltip></el-table-column>
<el-table-column prop="managerName" <el-table-column prop="managerName"
label="ManagerName" label="ManagerName"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="sponsorOrganization" <el-table-column prop="sponsorOrganization"
label="SponsorOrganization" label="SponsorOrganization"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="researchField"
label="ResearchField"
show-overflow-tooltip></el-table-column>
<el-table-column prop="occupation"
label="occupation"
show-overflow-tooltip></el-table-column>
<el-table-column prop="Operate" <el-table-column prop="Operate"
label="Operate" label="Operate"
show-overflow-tooltip> show-overflow-tooltip>

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

@ -0,0 +1,129 @@
<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" ref="tableRef">
<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, ref} from "vue";
import {ElMessage} from "element-plus";
const emit = defineEmits(['callback']);
const tableRef = ref();
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;
state.multipleSelection = [];
tableRef.value.clearSelection();
};
const onCancel = () => {
closeDialog();
}
const onSubmit = () => {
if(state.multipleSelection.length == 0){
ElMessage.warning("Please check the data first");
return false;
}
//将选中的灾害转为{"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"> <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="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="deleteUser(scope.row)">Delete</el-button>
<el-button link type="primary" size="small" @click="manage(scope.row)">Manage</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -71,6 +72,7 @@
</div> </div>
<AddAdministrator ref="administratorRef" @callback="getTableData"/> <AddAdministrator ref="administratorRef" @callback="getTableData"/>
<EditAdministrator ref="editAdministratorRef" @callback="getTableData"/> <EditAdministrator ref="editAdministratorRef" @callback="getTableData"/>
<ManageDisaster ref="manageRef"/>
<RoleDialog ref="roleDialogRef" <RoleDialog ref="roleDialogRef"
@refresh="getTableData()" /> @refresh="getTableData()" />
</div> </div>
@ -79,12 +81,36 @@
<script lang="ts" setup name="systemRole"> <script lang="ts" setup name="systemRole">
import en from 'element-plus/dist/locale/en.mjs' import en from 'element-plus/dist/locale/en.mjs'
import type { TabsPaneContext } from 'element-plus'; import type { TabsPaneContext } from 'element-plus';
import ManageDisaster from './component/manageDisaster.vue';
import AddAdministrator from './component/addAdministrator.vue'; import AddAdministrator from './component/addAdministrator.vue';
import EditAdministrator from './component/editAdministrator.vue'; import EditAdministrator from './component/editAdministrator.vue';
import {getAdminPage,remove} from '/@/api/response/administrator.js'; 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 activeName = ref('first');
const administratorRef = ref(); const administratorRef = ref();
const editAdministratorRef = ref(); const editAdministratorRef = ref();
const manageRef = ref();
const handleClick = (tab: TabsPaneContext, event: Event) => { const handleClick = (tab: TabsPaneContext, event: Event) => {
console.log(tab, event); console.log(tab, event);
}; };
@ -99,6 +125,8 @@ const RoleDialog = defineAsyncComponent(() => import('/@/views/system/role/dialo
// 定义变量内容 // 定义变量内容
const roleDialogRef = ref(); const roleDialogRef = ref();
const state = reactive({ const state = reactive({
table:false,
loading:false,
multipleSelection:[], multipleSelection:[],
searchName:'', searchName:'',
tableData: { tableData: {
@ -170,6 +198,11 @@ const deleteUser = (row) => {
}) })
.catch(() => {}); .catch(() => {});
}; };
//chief管理员管理灾害抽屉
const manage = (row) => {
manageRef.value.openDialog(row.id);
//state.table = true;
}
// 分页改变 // 分页改变
const onHandleSizeChange = (val) => { const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val; state.tableData.param.pageSize = val;

2
vite.config.js
View File

@ -30,7 +30,7 @@ const viteConfig = defineConfig((mode) => {
hmr: true, hmr: true,
proxy: { proxy: {
'/api': { '/api': {
target: 'http://192.168.31.250:9090', target: 'http://192.168.31.14:9090',
ws: true, ws: true,
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''), rewrite: (path) => path.replace(/^\/api/, ''),