复刻冀北地图

src/components/table/index.vue

@@ -2,7 +2,7 @@
     <div :style="{ height: tableStore.table.height }">
         <vxe-table ref="tableRef" height="auto" :data="tableStore.table.data" v-loading="tableStore.table.loading"
             v-bind="Object.assign({}, defaultAttribute, $attrs)" @checkbox-all="selectChangeEvent"
-            @checkbox-change="selectChangeEvent" :showOverflow="showOverflow">
+            @checkbox-change="selectChangeEvent" :showOverflow="showOverflow" @sort-change="handleSortChange">
             <!-- Column 组件内部是 el-table-column -->
             <template v-if="isGroup">
                 <GroupColumn :column="tableStore.table.column" />
@@ -94,6 +94,21 @@ const selectChangeEvent: VxeTableEvents.CheckboxChange<any> = ({ checked }) => {
 const getRef = () => {
     return tableRef.value
 }
+// 排序
+const handleSortChange = ({ column, order }: { column: TableColumn; order: 'asc' | 'desc' | null }) => {
+    // console.log('排序列:', column?.property);
+    // console.log('排序顺序:', order);
+    // tableStore.onTableAction('sortable', { column, order })
+    tableStore.table.params.sortBy = column?.property
+    tableStore.table.params.orderBy = order
+    tableStore.table.params.pageNum = 1
+
+    tableStore.index()
+    // // 在这里可以根据 column 和 order 进行相应的数据排序操作
+    // if (order === 'asc') {
+    // } else if (order === 'desc') {
+    // }
+}
 watch(
     () => tableStore.table.allFlag,
     newVal => {