zqq:遥感影像数据下载

src/api/remoteSensingSourceData/remoteSensingSourceData.js

@@ -16,3 +16,15 @@ export const getSelectionCondition = (param) => {
 		params: param,
 	});
 };
+
+export const getPagesRemoteSensingSourceData = (current, size, params) => {
+	return request({
+		url: '/api/' + moduleName + '/ui/remoteSensing/PagesData',
+		method: 'get',
+		params: {
+			current,
+			size,
+			...params,
+		},
+	});
+};

src/views/dataService/remoteSensingData/components/retrievalCondition.vue

@@ -1,6 +1,43 @@
 <template>
   <div>
-    <div class="system-user-search mb15">
+    <el-row :gutter="22">
+      <el-col :span="10">
+        <div class="system-role-padding layout-padding-auto layout-padding-view">
+          <el-table :data="state.disasterData.data"
+                    v-loading="state.disasterData.loading"
+                    style="width: 100%"
+                    highlight-current-row
+                    @row-click="tableClick">
+            <el-table-column type="index"
+                             label="ID"
+                             width="50" />
+            <el-table-column prop="disasterType"
+                             label="Disaster type"
+                             show-overflow-tooltip></el-table-column>
+            <el-table-column prop="disasterCountry"
+                             label="disaster country"
+                             show-overflow-tooltip></el-table-column>
+            <el-table-column prop="disasterTime"
+                             label="disaster time"
+                             show-overflow-tooltip></el-table-column>
+          </el-table>
+          <el-pagination @size-change="onHandleDisasterSizeChange"
+                         @current-change="onHandleDisasterCurrentChange"
+                         class="mt15"
+                         :pager-count="5"
+                         :page-sizes="[10, 20, 30]"
+                         v-model:current-page="state.disasterData.param.pageNum"
+                         background
+                         v-model:page-size="state.disasterData.param.pageSize"
+                         layout="total, sizes, prev, pager, next, jumper"
+                         :total="state.disasterData.total">
+          </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"
@@ -132,13 +169,28 @@
                          :total="state.tableData.total">
           </el-pagination>
         </div>
+      </el-col>
+    </el-row>
+  </div>
 </template>
 
 <script setup>
 import { ref, reactive, onMounted } from 'vue';
-import { getRemoteSensingSourceData, getSelectionCondition } from "/@/api/remoteSensingSourceData/remoteSensingSourceData.js";
+import { getRemoteSensingSourceData, getSelectionCondition, getPagesRemoteSensingSourceData } from "/@/api/remoteSensingSourceData/remoteSensingSourceData.js";
+import { getDisasterPage } from '/@/api/data/otherData.js'
+
 
 const state = reactive({
+  disasterData: {
+    data: [],
+    total: 0,
+    loading: false,
+    param: {
+      search: '',
+      pageNum: 1,
+      pageSize: 10,
+    },
+  },
   tableData: {
     data: [],
     total: 0,
@@ -149,6 +201,7 @@ const state = reactive({
       pageSize: 10,
     },
   },
+  disasterId: null,
   //选择灾害类型下拉框
   options_disasterType: [],
   value_disasterType: '',
@@ -158,6 +211,22 @@ const state = reactive({
   requestData: [],
 })
 
+// 初始化灾害表格数据
+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, column, event) => {
+  state.disasterId = row.disasterId;
+  getTableData()
+}
+
 // 查询遥感元数据
 const searchRemoteSensingSourceData = () => {
   const select = {
@@ -179,6 +248,18 @@ const searchRemoteSensingSourceData = () => {
     })
 }
 
+// 获取分页遥感元数据
+const getTableData = () => {
+  state.tableData.loading = true;
+  getPagesRemoteSensingSourceData(state.tableData.param.pageNum, state.tableData.param.pageSize, { "disasterId": state.disasterId }).then(
+    (res) => {
+      state.requestData = res.records;
+    })
+  setTimeout(() => {
+    state.tableData.loading = false;
+  }, 500);
+}
+
 // 查询受灾国家
 const searchDisasterCountry = () => {
   const selectCountry = {
@@ -247,22 +328,35 @@ const searchDisasterDate = () => {
   }
 }
 
+// 分页改变
+const onHandleDisasterSizeChange = (val) => {
+  state.disasterData.param.pageSize = val;
+  getDisasterData();
+};
+// 分页改变
+const onHandleDisasterCurrentChange = (val) => {
+  state.disasterData.param.pageNum = val;
+  getDisasterData();
+};
+
 //每页显示条数改变
 const onHandleSizeChange = (val) => {
   state.tableData.param.pageSize = val;
   state.tableData.param.pageNum = state.tableData.param.pageNum;
-  searchRemoteSensingSourceData()
+  //   searchRemoteSensingSourceData()
+  getTableData()
 };
 
 //当前页变动
 const onHandleCurrentChange = (val) => {
   state.tableData.param.pageSize = state.tableData.param.pageSize;
   state.tableData.param.pageNum = val;
-  searchRemoteSensingSourceData()
+  //   searchRemoteSensingSourceData()
+  getTableData()
 };
 
 onMounted(() => {
-
+  getDisasterData();
 })
 </script>
 

src/views/dataService/remoteSensingData/components/searchCondition.vue

@@ -382,6 +382,10 @@ const ClearCondition = () => {
 	}
 	.coordinateBtn {
 		width: 90%;
+		word-break: keep-all;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
 	}
 	.lowerBtn {
 		width: 90%;

vite.config.js

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