影像-增加删除按钮，只能删除有问题的影像

src/api/demo/system.ts

@@ -113,6 +113,8 @@ enum Api {
   GeoTiffManagerLoadPage = '/api/GeoTiffManager/LoadPage',
   // 影像单个获取
   GeoTiffManagerGet = '/api/GeoTiffManager/Get',
+  // 删除tiff影像
+  DeleteTifStore = '/api/GeoTiffManager/DeleteTifStore',
   // 成果管理-航飞图片
   // 添加成果
   AchievementManageAddImageexif = '/api/AchievementManage/AddImageexif',
@@ -485,6 +487,9 @@ export const GeoTiffManagerLoadPage = (params) =>
 // 影像单个获取
 export const GeoTiffManagerGet = (params) =>
   defHttp.get({ url: Api.GeoTiffManagerGet, params });
+// 删除tiff影像
+export const GeoTiffManagerDeleteTifStore = (params) =>
+  defHttp.post({ url: Api.DeleteTifStore + '?stores=' + params.stores });
 
 // 成果管理-航飞图片
 // 添加成果

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="error" @click="deleteGeoTiff">删除影像</a-button>
           </template>
           <template #bodyCell="{ column, record }">
             <template v-if="column.key === 'layerName'">
@@ -71,9 +72,11 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, watch, onMounted } from 'vue';
+  import { ref, watch, onMounted, createVNode } from 'vue';
   // vben
   import { useMessage } from '@/hooks/web/useMessage';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { Modal } from 'ant-design-vue';
   import proj4 from 'proj4';
   import { getAppEnvConfig } from '@/utils/env';
   import { BasicTable, useTable } from '@/components/Table';
@@ -85,6 +88,7 @@
     GeoTiffManagerUpdateGeoTiff,
     GeoTiffManagerLoadPage,
     GeoTiffManagerGet,
+    GeoTiffManagerDeleteTifStore,
   } from '@/api/demo/system';
 
   // 图片路径拼接
@@ -109,6 +113,9 @@
       schemas: searchFormSchema,
     },
     showIndexColumn: true,
+    rowSelection: {
+      type: 'radio',
+    },
     bordered: true,
     showTableSetting: true,
     handleSearchInfoFn(info) {
@@ -129,8 +136,7 @@
   const updateGeoTiff = () => {
     GeoTiffManagerUpdateGeoTiff()
       .then((res) => {
-        // console.log(res);
-        if (res.lenght == 0) {
+        if (res.length == 0) {
           reload();
         } else {
           failYingxiangData.value = getFailYingxiangData(res);
@@ -159,6 +165,55 @@
     return result;
   }
 
+  // 删除tiff影像
+  const deleteGeoTiff = () => {
+    let rows = getSelectRows();
+    if (rows.length == 0) {
+      return createMessage.warn('请勾选一条数据进行删除');
+    }
+    const record = rows[0];
+    isPngImageUrl(getUrl(record))
+      .then((isPng) => {
+        if (isPng) {
+          createMessage.warn('所选影像完好，不能删除！');
+        } else {
+          Modal.confirm({
+            title: '是否确认删除此影像?',
+            icon: createVNode(ExclamationCircleOutlined),
+            onCancel() {},
+            onOk() {
+              // 删除有问题的影像
+              let params = { stores: record.storeName };
+              GeoTiffManagerDeleteTifStore(params).then((res) => {
+                if (res) {
+                  createMessage.success('所选影像删除成功！');
+                  reload();
+                } else {
+                  createMessage.error('所选影像删除失败！');
+                  reload();
+                }
+              });
+            },
+          });
+        }
+      })
+      .catch(console.error);
+  };
+
+  // 判断链接获取到的图片是否是png
+  async function isPngImageUrl(url) {
+    try {
+      const response = await fetch(url, { method: 'HEAD' });
+      if (!response.ok) {
+        throw new Error('请求失败');
+      }
+      const contentType = response.headers.get('content-type');
+      return contentType && contentType.startsWith('image/png');
+    } catch (error) {
+      return false;
+    }
+  }
+
   // 行选中
   const mapboxComponentRef = ref();
   function handRowClick(record) {