统计明细导出样式修改

src/views/demo/caseoffence/index.vue

@@ -2,11 +2,6 @@
   <div>
     <BasicTable @register="registerTable">
       <template #toolbar>
-        <a-select v-model:value="exportType_mingxi" style="width: 300px">
-          <a-select-option value="1">无人机发现违法行为情况统计明细表</a-select-option>
-          <a-select-option value="2">土地卫片新增违法占用耕地情况统计表</a-select-option>
-          <a-select-option value="3">无人机发现违法行为情况统计表</a-select-option>
-        </a-select>
         <PermissionBtn @btnEvent="buttonClick"></PermissionBtn>
       </template>
       <template #bodyCell="{ column, record }">
@@ -119,6 +114,27 @@
       </template>
     </BasicTable>
 
+    <a-modal v-model:open="open" title="导出表格类型" :footer="null">
+      <div v-if="showRecordList">
+        <a-button class="exportbutton" @click="handleExport('chuantou_execl')">
+          案件信息（execl）
+        </a-button>
+        <a-button class="exportbutton" @click="handleExport('chuantou_shp')">
+          图斑信息（shp）
+        </a-button>
+      </div>
+      <div v-else>
+        <a-button class="exportbutton" @click="handleExport('mingxi_1')">
+          无人机发现违法行为情况统计明细表
+        </a-button>
+        <a-button class="exportbutton" @click="handleExport('mingxi_2')">
+          土地卫片新增违法占用耕地情况统计表
+        </a-button>
+        <a-button class="exportbutton" @click="handleExport('mingxi_3')">
+          无人机发现违法行为情况统计表
+        </a-button>
+      </div>
+    </a-modal>
     <a-modal
       v-model:open="showRecordList"
       width="1710px"
@@ -126,15 +142,10 @@
       @ok="handleOk"
     >
       <template #closeIcon>
-        <CloseOutlined id="closeIconButton" @click="handleCloseAllRecordList()" />
-        <MinusOutlined id="closeIconButton" @click="handleCloseRecordList()" />
-        <!-- <CloudDownloadOutlined id="closeIconButton" @click="exportList()" /> -->
+        <CloseOutlined id="closeIconButton" @click="handleCloseAllRecordList" />
+        <MinusOutlined id="closeIconButton" @click="handleCloseRecordList" />
       </template>
       <template #footer>
-        <a-select v-model:value="exportType_chuantou" style="width: 120px">
-          <a-select-option value="1">案件信息</a-select-option>
-          <a-select-option value="2">图斑信息</a-select-option>
-        </a-select>
         <a-button type="primary" @click="exportList">
           <template #icon>
             <CloudDownloadOutlined />
@@ -216,7 +227,6 @@
     afterFetch: (res) => {},
   });
 
-  const printOpen = ref<boolean>(false);
   const showRecordList = ref<boolean>(false);
 
   // 标签页面数据
@@ -318,62 +328,67 @@
   }
   // 穿透显示的明细表导出
   function exportList() {
-    handleExport(currentListQuery.listQuery, 'chuantou');
+    open.value = true;
   }
 
   // 导出种类
-  const exportType_mingxi = ref('1');
-  const exportType_chuantou = ref('1');
+  const open = ref<boolean>(false);
 
   // 直接下载接口返回的二进制流
-  function handleExport(params, exportType) {
-    delete params.limit;
-    delete params.page;
-
+  function handleExport(exportType) {
     let url = '';
     let fileName = '';
-    if (exportType == 'mingxi') {
-      switch (exportType_mingxi.value) {
-        case '1':
-          // 无人机发现违法行为情况统计明细表
-          url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceToExcel';
-          fileName = '无人机发现违法行为情况统计明细表' + new Date().getTime() + '.xls';
-          break;
-        case '2':
-          // 土地卫片新增违法占用耕地情况统计表
-          url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceSimpleToExcel';
-          fileName = '土地卫片新增违法占用耕地情况统计表' + new Date().getTime() + '.xls';
-          break;
-        case '3':
-          // 无人机发现违法行为情况统计表
-          url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceToExcel2';
-          fileName = '无人机发现违法行为情况统计表' + new Date().getTime() + '.xls';
-          break;
-      }
+    let params: any = {};
+
+    switch (exportType) {
+      case 'chuantou_execl':
+        // 穿透-导出案件明细execl
+        url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExprotCaseListByType';
+        fileName =
+          '案件信息 ' +
+          tablist[activeKey.value].countyname +
+          '_' +
+          tablist[activeKey.value].label +
+          '.xls';
+        break;
+      case 'chuantou_shp':
+        // 穿透-导出案件明细shp
+        url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportShapefile';
+        fileName =
+          '图斑信息 ' +
+          tablist[activeKey.value].countyname +
+          '_' +
+          tablist[activeKey.value].label +
+          '.shp';
+        break;
+      case 'mingxi_1':
+        // 无人机发现违法行为情况统计明细表
+        url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceToExcel';
+        fileName = '无人机发现违法行为情况统计明细表' + new Date().getTime() + '.xls';
+        break;
+      case 'mingxi_2':
+        // 土地卫片新增违法占用耕地情况统计表
+        url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceSimpleToExcel';
+        fileName = '土地卫片新增违法占用耕地情况统计表' + new Date().getTime() + '.xls';
+        break;
+      case 'mingxi_3':
+        // 无人机发现违法行为情况统计表
+        url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/CaseOffenceSimpleToExcel2';
+        fileName = '无人机发现违法行为情况统计表' + new Date().getTime() + '.xls';
+        break;
+      default:
+        break;
     }
-    if (exportType == 'chuantou') {
-      switch (exportType_chuantou.value) {
-        case '1':
-          // 穿透-导出案件明细execl
-          url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExprotCaseListByType';
-          fileName =
-            '案件信息 ' +
-            tablist[activeKey.value].countyname +
-            '_' +
-            tablist[activeKey.value].label +
-            '.xls';
-          break;
-        case '2':
-          // 穿透-导出案件明细shp
-          url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportShapefile';
-          fileName =
-            '图斑信息 ' +
-            tablist[activeKey.value].countyname +
-            '_' +
-            tablist[activeKey.value].label +
-            '.shp';
-          break;
-      }
+
+    if (['chuantou_execl', 'chuantou_shp'].includes(exportType)) {
+      params = currentListQuery.listQuery;
+      delete params.limit;
+      delete params.page;
+    } else {
+      params = {
+        startTime: dayjs(searchParams.value?.startTime).startOf('month').format('YYYY-MM-DD'),
+        endTime: dayjs(searchParams.value?.endTime).endOf('month').format('YYYY-MM-DD'),
+      };
     }
 
     axios({
@@ -399,22 +414,26 @@
   const buttonClick = async (type) => {
     switch (type) {
       case 'btnExport':
-        let params = {
-          startTime: dayjs(searchParams.value?.startTime).startOf('month').format('YYYY-MM-DD'),
-          endTime: dayjs(searchParams.value?.endTime).endOf('month').format('YYYY-MM-DD'),
-        };
-        handleExport(params, 'mingxi');
+        open.value = true;
+        break;
+      default:
         break;
     }
   };
 </script>
 <style lang="less" scoped>
   #closeIconButton {
-    width: 30px;
-    height: 40px;
-    line-height: 40px;
+    width: 40px;
+    height: 50px;
+    line-height: 50px;
     float: right;
     text-align: center;
     cursor: pointer;
   }
+
+  .exportbutton {
+    width: 510px;
+    height: 60px;
+    margin: 5px;
+  }
 </style>

src/views/demo/statistical/patchsummary/index.vue

@@ -19,6 +19,16 @@
         </template>
       </template>
     </BasicTable>
+    <a-modal v-model:open="open" title="导出文件类型" :footer="null">
+      <div>
+        <a-button class="exportbutton" @click="handleExport('excel')">
+          图斑汇总统计报表（execl）
+        </a-button>
+        <a-button class="exportbutton" @click="handleExport('shp')">
+          图斑汇总统计信息（shp）
+        </a-button>
+      </div>
+    </a-modal>
     <a-modal
       style="width: 100vw; top: 0px; left: 0px; margin: 0px; padding: 0px"
       wrap-class-name="full-modal"
@@ -84,19 +94,27 @@
   });
 
   // 直接下载接口返回的二进制流
-  function handleExport() {
+  function handleExport(exportType) {
     let params = { ...searchParams.value };
+    let url = '';
+    let fileName = '';
+    if (exportType == 'excel') {
+      url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportCaseInfoTuBanList';
+      fileName = '图斑汇总统计报表' + new Date().getTime() + '.xls';
+    } else if (exportType == 'shp') {
+      url = VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportCaseInfoTuBanList';
+      fileName = '图斑汇总统计信息' + new Date().getTime() + '.shp';
+      return;
+    }
     axios({
       method: 'post',
-      url: VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportCaseInfoTuBanList',
+      url: url,
       params: params,
       headers: {
         'X-Token': localStorage.getItem('X-Token'),
       },
       responseType: 'blob',
     }).then((res) => {
-      console.log('excel', res);
-      let fileName = '图斑汇总统计报表' + new Date().getTime() + '.xls';
       const elink = document.createElement('a');
       elink.download = fileName;
       elink.style.display = 'none';
@@ -108,10 +126,11 @@
     });
   }
 
+  const open = ref<boolean>(false);
   function onBtnClicked(domId) {
     switch (domId) {
       case 'btnExport':
-        handleExport();
+        open.value = true;
         break;
       default:
         break;
@@ -165,4 +184,9 @@
       flex: 1;
     }
   }
+  .exportbutton {
+    width: 510px;
+    height: 60px;
+    margin: 5px;
+  }
 </style>

src/views/demo/statistical/patchsummary/patchsummary.data.ts

@@ -164,8 +164,8 @@ export const searchFormSchema: FormSchema[] = [
     colProps: { span: 4 },
     componentProps: {
       options: [
-        { label: '拆除复耕', value: '拆除复耕' },
-        { label: '补办手续', value: '补办手续' },
+        { label: '拆除复耕', value: '0' },
+        { label: '补办手续', value: '1' },
       ],
     },
   },