优化产品列表组件并添加新功能

- 调整了 DataTable 组件中的导入路径，从绝对路径改为相对路径
- 在 auto-imports.d.ts 中添加了新的 utils 函数的自动导入
- 在 Vite 配置中加入了新的依赖声明
- 优化了 DataTable 组件中的代码结构和部分功能
- 在主文件 index.vue 中移除了不必要的代码

src/auto-imports.d.ts

@@ -72,9 +72,12 @@ declare global {
   const useId: typeof import('vue')['useId']
   const useLink: typeof import('vue-router')['useLink']
   const useModel: typeof import('vue')['useModel']
+  const usePagination: typeof import('../../../../../../../@/utils/usePagination')['usePagination']
+  const useResponse: typeof import('../../../../../../../@/utils/useResponse')['useResponse']
   const useRoute: typeof import('vue-router')['useRoute']
   const useRouter: typeof import('vue-router')['useRouter']
   const useSlots: typeof import('vue')['useSlots']
+  const useTableData: typeof import('../../../../../../../@/utils/useTableData')['useTableData']
   const useTemplateRef: typeof import('vue')['useTemplateRef']
   const watch: typeof import('vue')['watch']
   const watchEffect: typeof import('vue')['watchEffect']

src/views/product-list/component/DataTable.vue

@@ -1,17 +1,14 @@
 <script lang="ts" setup>
 /**
  * @Name: Table.vue
- * @Description:
+ * @Description: 商品列表表格
  * @Author: Cheney
  */
 
 import { Download, Message, Money, Open, Operation, Refresh } from '@element-plus/icons-vue';
-import { usePagination } from '/@/utils/usePagination';
-import { useTableData } from '/@/utils/useTableData';
 import * as api from '/@/views/product-list/api';
 import PermissionButton from '/@/components/PermissionButton/index.vue';
 import { productColumns } from '/@/views/product-list/ColumnsTsx';
-import { useResponse } from '/@/utils/useResponse';
 import EditDrawer from '/@/views/product-list/component/EditDrawer.vue';
 import NoticeDialog from '/@/views/product-list/component/NoticeDialog.vue';
 import ImportButton from '/@/components/ImportButton/index.vue';
@@ -61,6 +58,8 @@ const rowData = ref({});
 
 const dialogVisible = ref(false);
 
+const templateType = ref();
+
 onBeforeMount(() => {
   fetchList();
 });
@@ -82,6 +81,7 @@ function handleRefresh() {
 async function batchOpen() {
   const ids = Array.from(checkedList.value);
   await useResponse(api.updateShopDetail, { ids, status: 1 });
+  checkedList.value.clear();
   await fetchList();
 }
 
@@ -117,10 +117,8 @@ function handleNotice(row: any) {
   rowData.value = row;
 }
 
-const value = ref();
-
 function downloadTemplate() {
-  console.log('111=> ');
+  // console.log('111=> ');
 }
 </script>
 
@@ -135,13 +133,14 @@ function downloadTemplate() {
         </PermissionButton>
         <VerticalDivider class="px-1" style="margin-left: 7px;" />
         <div class="custom-el-input">
-          <el-select v-model="value" placeholder="Select" style="width: 190px">
+          <el-select v-model="templateType" placeholder="Select" style="width: 190px">
             <template #prefix>
               <div class="flex items-center">
-                <el-button link style="margin-left: 0px; font-size: 14px" type="success"
+                <el-button bg size="small" style="margin-left: -7px; font-size: 14px; border-radius: 20px;" text
+                           type="success"
                            @click.stop="downloadTemplate">下载
                 </el-button>
-                <VerticalDivider />
+                <VerticalDivider style="margin-left: 7px" />
               </div>
             </template>
             <el-option label="商品通知模板" value="item1" />

src/views/product-list/index.vue

@@ -7,15 +7,15 @@
 
 import VerticalDivider from '/@/components/VerticalDivider/index.vue';
 import { RefreshRight, Search } from '@element-plus/icons-vue';
-import DataTable from './component/DataTable.vue';
 import { useTableHeight } from '/@/utils/useTableHeight';
-import { useTemplateRef } from 'vue';
+import DataTable from '/@/views/product-list/component/DataTable.vue';
 
 
 const titleContainer: Ref<HTMLElement | null> = useTemplateRef('titleContainer');
 const queryContainer: Ref<HTMLElement | null> = useTemplateRef('queryContainer');
 
 const { tableHeight } = useTableHeight(titleContainer, queryContainer);
+
 const loading = ref(false);
 
 const formInline = reactive({
@@ -26,9 +26,7 @@ const formInline = reactive({
 
 function onClick() {
   loading.value = true;
-  setTimeout(() => {
-    loading.value = false;
-  }, 2000);
+  
 }
 
 </script>

vite.config.ts

@@ -36,6 +36,15 @@ const viteConfig = defineConfig((mode: ConfigEnv) => {
             'dayjs': [
               // 默认导入
               ['default', 'dayjs']
+            ],
+            '/@/utils/useTableData': [
+              'useTableData'
+            ],
+            '/@/utils/usePagination': [
+              'usePagination'
+            ],
+            '/@/utils/useResponse': [
+              'useResponse'
             ]
           },
         ],