影像-跟新周图层组的缩略图

src/api/demo/system.ts

@@ -115,6 +115,8 @@ enum Api {
   GeoTiffManagerGet = '/api/GeoTiffManager/Get',
   // 删除tiff影像
   DeleteTifStore = '/api/GeoTiffManager/DeleteTifStore',
+  // 更新tiff周的影像缩略图
+  UpdateLayerGroupThumb = '/api/GeoTiffManager/UpdateLayerGroupThumb',
   // 成果管理-航飞图片
   // 添加成果
   AchievementManageAddImageexif = '/api/AchievementManage/AddImageexif',
@@ -490,6 +492,9 @@ export const GeoTiffManagerGet = (params) =>
 // 删除tiff影像
 export const GeoTiffManagerDeleteTifStore = (params) =>
   defHttp.post({ url: Api.DeleteTifStore + '?stores=' + params.stores });
+// 删除tiff影像
+export const GeoTiffManagerUpdateLayerGroupThumb = (params) =>
+  defHttp.post({ url: Api.UpdateLayerGroupThumb + '?layerGroups=' + params.layerGroups });
 
 // 成果管理-航飞图片
 // 添加成果

src/views/demo/system/achievement/GeoTiffManager/index.vue

@@ -5,6 +5,7 @@
         <BasicTable @register="registerTable" @row-click="handRowClick">
           <template #toolbar>
             <a-button type="primary" @click="updateGeoTiff">更新最新影像</a-button>
+            <a-button type="success" @click="updateYearWeekThumbnail">更新缩略图</a-button>
             <a-button type="error" @click="deleteGeoTiff">删除影像</a-button>
           </template>
           <template #bodyCell="{ column, record }">
@@ -28,7 +29,7 @@
             </template>
             <template v-if="column.key === 'accessUrl'">
               <a-image
-                :src="getUrl(record)"
+                :src="getUrl(record.accessUrl, record.layerName)"
                 :style="{ marginRight: '10px' }"
                 :width="100"
                 :height="100"
@@ -78,6 +79,7 @@
   import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
   import { Modal } from 'ant-design-vue';
   import proj4 from 'proj4';
+  import dayjs from 'dayjs';
   import { getAppEnvConfig } from '@/utils/env';
   import { BasicTable, useTable } from '@/components/Table';
   import { columns, searchFormSchema } from './util';
@@ -89,6 +91,7 @@
     GeoTiffManagerLoadPage,
     GeoTiffManagerGet,
     GeoTiffManagerDeleteTifStore,
+    GeoTiffManagerUpdateLayerGroupThumb,
   } from '@/api/demo/system';
 
   // 图片路径拼接
@@ -102,7 +105,7 @@
     '+proj=tmerc +lat_0=37.56666666666666 +lon_0=126.93333333333333 +k=1 +x_0=200000 +y_0=500000 +ellps=bessel +towgs84=-119.819,-78.445,-112.283,0,0,0,0 +units=m +no_defs',
   );
 
-  // 影像管理
+  // 影像管理-----------------------------------------------------------------------------------------------
   const [registerTable, { reload, getSelectRows }] = useTable({
     title: '影像管理',
     api: GeoTiffManagerLoadPage,
@@ -124,7 +127,7 @@
     immediate: false,
   });
 
-  // 更新失败的影像
+  // 更新失败的影像-----------------------------------------------------------------------------------------
   const failOpen = ref(false);
   const failYingxiangData: any = ref();
   // 更新失败的影像弹窗关闭
@@ -137,10 +140,11 @@
     GeoTiffManagerUpdateGeoTiff()
       .then((res) => {
         if (res.length == 0) {
+          createMessage.success('影像更新成功');
           reload();
         } else {
           failYingxiangData.value = getFailYingxiangData(res);
-          console.log(failYingxiangData.value);
+          // console.log(failYingxiangData.value);
           failOpen.value = true;
           reload();
         }
@@ -165,14 +169,14 @@
     return result;
   }
 
-  // 删除tiff影像
+  // 删除tiff影像---------------------------------------------------------------------------------------
   const deleteGeoTiff = () => {
     let rows = getSelectRows();
     if (rows.length == 0) {
       return createMessage.warn('请勾选一条数据进行删除');
     }
     const record = rows[0];
-    isPngImageUrl(getUrl(record))
+    isPngImageUrl(getUrl(record.accessUrl, record.layerName))
       .then((isPng) => {
         if (isPng) {
           createMessage.warn('所选影像完好，不能删除！');
@@ -214,7 +218,69 @@
     }
   }
 
-  // 行选中
+  // 在本地路径生成缩略图-------------------------------------------------------------------------------
+  async function updateYearWeekThumbnail() {
+    GeoTiffManagerLoadPage({
+      page: 1,
+      limit: 1000000,
+    }).then((res) => {
+      // 按照时间分类
+      let uniqueKeysArray = [...new Set(res.items.map((item) => item.dateDir))];
+      // 转换时间数组(年份-周数)
+      uniqueKeysArray = [...new Set(uniqueKeysArray.map(convertToYearWeek))];
+      // 生成对应年份-周数的缩略图
+      let layerNames: any = '';
+      uniqueKeysArray.forEach((item, index) => {
+        if (index == 0) {
+          layerNames = item;
+        } else {
+          layerNames = layerNames.concat(',' + item);
+        }
+      });
+      // 更换全部缩略图
+      // res.items.forEach((item, index) => {
+      //   if (layerNames === '') {
+      //     layerNames = item.layerName;
+      //   } else {
+      //     layerNames = layerNames.concat(',' + item.layerName);
+      //   }
+      // });
+      // 生成缩略图
+      generateThumbnail(layerNames);
+    });
+  }
+
+  // 生成缩略图
+  async function generateThumbnail(layerNames) {
+    GeoTiffManagerUpdateLayerGroupThumb({ layerGroups: layerNames }).then((res) => {
+      if (res) {
+        createMessage.success('生成新的缩略图成功！');
+      } else {
+        createMessage.error('生成新的缩略图失败！');
+      }
+    });
+  }
+
+  // 获取年份-周数
+  function convertToYearWeek(dateStr) {
+    const date = dayjs(dateStr, 'YYYYMMDD');
+    // 返回格式化的字符串
+    return `${date.year()}-${getWeekOfYear(date)}`;
+  }
+
+  // 每周从周一开始
+  function getWeekOfYear(date) {
+    const firstDayOfYear = dayjs(date).startOf('year');
+    const firstMondayOfYear =
+      firstDayOfYear.day() === 1
+        ? firstDayOfYear
+        : firstDayOfYear.add(1 - firstDayOfYear.day(), 'day');
+    const diffInDays = date.diff(firstMondayOfYear, 'days');
+    const weekNumber = Math.floor(diffInDays / 7) + 1;
+    return weekNumber;
+  }
+
+  // 行选中-----------------------------------------------------------------------------------------
   const mapboxComponentRef = ref();
   function handRowClick(record) {
     allDataForClearMap.forEach((data) => {
@@ -231,6 +297,7 @@
     let chooseRows: any = [];
     chooseRows.push(record);
     mapboxComponentRef.value.GeoTiffManagerRaster(chooseRows, lngLat, 11, true);
+    return lngLat;
   }
 
   function isProjectedCoordinates(x, y) {
@@ -276,29 +343,24 @@
     return [centerLon, centerLat];
   }
 
-  // 用于去除分页后地图还有前一页的图层
-  let allDataForClearMap: any = [];
-  function forClearMap() {
-    GeoTiffManagerLoadPage({
-      page: 1,
-      limit: 10000,
-    }).then((res) => {
-      allDataForClearMap = res.items;
-    });
-  }
-
-  // 缩略图的预览不使用
+  // 缩略图的预览不使用----------------------------------------------------------------------------
   const visible = ref<boolean>(false);
   const setVisible = (value): void => {
     visible.value = false;
   };
 
   // 从geoserver获取缩略图
-  function getUrl(record) {
-    let bbox: any = getBboxFromUrl(record.accessUrl);
-    const coords = bbox.split(',').map((coord) => parseFloat(coord));
-    let r1 = proj4('EPSG:4326', 'EPSG:3857', [coords[0], coords[1]]);
-    let r2 = proj4('EPSG:4326', 'EPSG:3857', [coords[2], coords[3]]);
+  function getUrl(accessUrl, name) {
+    let r1 = [117.34046403513817, 34.331716698906675];
+    let r2 = [119.27763051149853, 36.263686454243626];
+    let size = 4096;
+    if (accessUrl) {
+      let bbox: any = getBboxFromUrl(accessUrl);
+      const coords = bbox.split(',').map((coord) => parseFloat(coord));
+      r1 = [coords[0], coords[1]];
+      r2 = [coords[2], coords[3]];
+      size = 256;
+    }
     let titeUrl: any = null;
     if (new URL(VITE_GLOB_API_URL).hostname == 'localhost') {
       titeUrl =
@@ -309,7 +371,7 @@
     }
     let url =
       titeUrl +
-      record.layerName +
+      name +
       '&styles=&bbox=' +
       r1[0] +
       ',' +
@@ -318,10 +380,25 @@
       r2[0] +
       ',' +
       r2[1] +
-      '&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE';
+      '&width=' +
+      size +
+      '&height=' +
+      size +
+      '&srs=EPSG:4326&format=image/png&TRANSPARENT=TRUE';
     return url;
   }
 
+  // 用于去除分页后地图还有前一页的图层--------------------------------------------------------------
+  let allDataForClearMap: any = [];
+  function forClearMap() {
+    GeoTiffManagerLoadPage({
+      page: 1,
+      limit: 100000,
+    }).then((res) => {
+      allDataForClearMap = res.items;
+    });
+  }
+
   onMounted(() => {
     reload();
     // 用于去除分页后地图还有前一页的图层

src/views/demo/system/geoservermanagement/clound/mapComponent.vue

@@ -354,7 +354,7 @@
         ];
         map.addSource(chooseRow.layerName + '-image', {
           type: 'image',
-          url: '/geoserver/group/my_workspace-' + chooseRow.layerName + '.png',
+          url: '/geoserver/group/' + chooseRow.layerName + '.png',
           coordinates: fourpoint,
         });
         map.addLayer({