perf: 调整

src/components/_base/navbar/components/download-center-modal/constants.ts

@@ -15,7 +15,7 @@ export const TABLE_COLUMNS = [
     title: '文件名称',
     dataIndex: 'file_name',
     width: 180,
-    fixed: 'left',
+    // fixed: 'left',
   },
   {
     title: '所属模块',

src/components/_base/navbar/components/download-center-modal/delete-task-modal.vue

@@ -11,7 +11,9 @@
     </div>
     <template #footer>
       <a-button class="cancel-btn" size="large" @click="onClose">取消</a-button>
-      <a-button type="primary" class="ml-16px danger-btn" status="danger" size="large" @click="onDelete">确定</a-button>
+      <a-button type="primary" class="ml-16px !bg-#f64b31 !border-none" status="danger" size="large" @click="onDelete"
+        >确定</a-button
+      >
     </template>
   </a-modal>
 </template>

src/components/_base/navbar/components/download-center-modal/index.vue

@@ -37,6 +37,7 @@
       ref="tableRef"
       :data="dataSource"
       column-resizable
+      row-key="id"
       :row-selection="{
         type: 'checkbox',
         showCheckedAll: true,
@@ -111,6 +112,8 @@
         @page-size-change="onPageSizeChange"
       />
     </div>
+
+    <DeleteTaskModal ref="deleteTaskModalRef" @batchUpdate="onBatchSuccess" @update="getData" />
   </a-modal>
 </template>
 
@@ -118,6 +121,7 @@
 import { fetchAccountGroups } from '@/api/all/propertyMarketing';
 import { INITIAL_FORM, INITIAL_PAGE_INFO, TABLE_COLUMNS } from './constants';
 import { formatTableField, formatNumberShow, exactFormatTime } from '@/utils/tools';
+import DeleteTaskModal from './delete-task-modal.vue';
 
 import icon1 from '@/assets/img/media-account/icon-delete.png';
 
@@ -127,6 +131,7 @@ const query = ref(cloneDeep(INITIAL_FORM));
 const pageInfo = ref(cloneDeep(INITIAL_PAGE_INFO));
 const selectedItems = ref([]);
 const groups = ref([]);
+const deleteTaskModalRef = ref(null);
 
 const checkedAll = computed(() => selectedItems.value.length === dataSource.value.length);
 const indeterminate = computed(
@@ -147,13 +152,20 @@ const onClose = () => {
 };
 
 const getData = () => {
-  console.log('getData');
   dataSource.value = [
     {
+      id: 1,
       file_name: '投放指南20150701',
       module: '营销资产平台',
       time: 1752130053,
-      name: '张三三',
+      name: '张三三张三三张三三张三三张三三',
+    },
+    {
+      id: 2,
+      file_name: '投放指南20150701',
+      module: '营销资产平台',
+      time: 1752130053,
+      name: '张三三张三三张三三张三三张三三',
     },
   ];
 };
@@ -171,8 +183,12 @@ const handleSorterChange = (column, order) => {
 const handleSearch = () => {
   console.log('handleSearch');
 };
-const openDelete = () => {
-  console.log('openDelete');
+const openDelete = (record) => {
+  const { id, file_name } = record;
+  deleteTaskModalRef.value.open({
+    id,
+    name: `“${file_name || '-'}”`,
+  });
 };
 const getGroups = async () => {
   const { code, data } = await fetchAccountGroups();
@@ -180,13 +196,13 @@ const getGroups = async () => {
     groups.value = data;
   }
 };
-const handleSelect = (selectedRowKeys) => {
+const handleSelect = (selectedRowKeys, selectedRows) => {
   selectedItems.value = selectedRowKeys;
 };
 
 const handleSelectAll = (checked) => {
   if (checked) {
-    selectedItems.value = dataSource.map((item) => item.id);
+    selectedItems.value = dataSource.value.map((item) => item.id);
   } else {
     selectedItems.value = [];
   }
@@ -205,6 +221,11 @@ const onPageSizeChange = (pageSize) => {
   reload();
 };
 
+const onBatchSuccess = () => {
+  selectedItems.value = [];
+  getData();
+};
+
 defineExpose({ open });
 </script>