From be05be920877735f7f76be9b72b2843784d68792 Mon Sep 17 00:00:00 2001
From: hanwenlu2016 <370389480@qq.com>
Date: Sun, 8 Jun 2025 01:04:23 +0800
Subject: [PATCH 1/4] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=20api=20=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E8=AF=B7=E6=B1=82=E6=96=B9=E5=BC=8F=20=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E/=E4=BF=AE=E6=94=B9=E6=9E=9A=E4=B8=BE=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9/=E5=A2=9E=E5=8A=A0=E6=9F=A5=E8=AF=A2=E9=80=89?=
 =?UTF-8?q?=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

优化 审计日记排序体验
---
 app/api/v1/apis/apis.py                 |  3 ++
 app/api/v1/auditlog/auditlog.py         | 29 ++++++++-----
 web/src/components/table/CrudTable.vue  | 58 +++++++++++++++++++------
 web/src/views/system/api/index.vue      | 18 +++++++-
 web/src/views/system/auditlog/index.vue | 28 +++++++++++-
 5 files changed, 107 insertions(+), 29 deletions(-)

diff --git a/app/api/v1/apis/apis.py b/app/api/v1/apis/apis.py
index 9cdca28b..ef26f1d6 100644
--- a/app/api/v1/apis/apis.py
+++ b/app/api/v1/apis/apis.py
@@ -15,6 +15,7 @@ async def list_api(
     path: str = Query(None, description="API路径"),
     summary: str = Query(None, description="API简介"),
     tags: str = Query(None, description="API模块"),
+    method: str = Query(None, description="请求方式"),
 ):
     q = Q()
     if path:
@@ -23,6 +24,8 @@ async def list_api(
         q &= Q(summary__contains=summary)
     if tags:
         q &= Q(tags__contains=tags)
+    if method:
+        q &= Q(method=method)
     total, api_objs = await api_controller.list(page=page, page_size=page_size, search=q, order=["tags", "id"])
     data = [await obj.to_dict() for obj in api_objs]
     return SuccessExtra(data=data, total=total, page=page, page_size=page_size)
diff --git a/app/api/v1/auditlog/auditlog.py b/app/api/v1/auditlog/auditlog.py
index 7dbff092..2f32b04e 100644
--- a/app/api/v1/auditlog/auditlog.py
+++ b/app/api/v1/auditlog/auditlog.py
@@ -4,22 +4,22 @@
 
 from app.models.admin import AuditLog
 from app.schemas import SuccessExtra
-from app.schemas.apis import *
 
 router = APIRouter()
 
 
 @router.get("/list", summary="查看操作日志")
 async def get_audit_log_list(
-    page: int = Query(1, description="页码"),
-    page_size: int = Query(10, description="每页数量"),
-    username: str = Query("", description="操作人名称"),
-    module: str = Query("", description="功能模块"),
-    method: str = Query("", description="请求方法"),
-    summary: str = Query("", description="接口描述"),
-    status: int = Query(None, description="状态码"),
-    start_time: datetime = Query("", description="开始时间"),
-    end_time: datetime = Query("", description="结束时间"),
+        page: int = Query(1, description="页码"),
+        page_size: int = Query(10, description="每页数量"),
+        username: str = Query("", description="操作人名称"),
+        module: str = Query("", description="功能模块"),
+        method: str = Query("", description="请求方法"),
+        summary: str = Query("", description="接口描述"),
+        status: int = Query(None, description="状态码"),
+        start_time: datetime = Query("", description="开始时间"),
+        end_time: datetime = Query("", description="结束时间"),
+        created_at_order: str = Query("desc", description="创建时间排序方式 asc/desc")
 ):
     q = Q()
     if username:
@@ -39,7 +39,14 @@ async def get_audit_log_list(
     elif end_time:
         q &= Q(created_at__lte=end_time)
 
-    audit_log_objs = await AuditLog.filter(q).offset((page - 1) * page_size).limit(page_size).order_by("-created_at")
+    order_by_field = "-created_at"
+    if created_at_order and created_at_order.lower() == "asc":
+        order_by_field = "created_at"
+
+    # Apply ordering before pagination
+    query = AuditLog.filter(q).order_by(order_by_field)
+
+    audit_log_objs = await query.offset((page - 1) * page_size).limit(page_size)
     total = await AuditLog.filter(q).count()
     data = [await audit_log.to_dict() for audit_log in audit_log_objs]
     return SuccessExtra(data=data, total=total, page=page, page_size=page_size)
diff --git a/web/src/components/table/CrudTable.vue b/web/src/components/table/CrudTable.vue
index e8ca0369..f796c631 100644
--- a/web/src/components/table/CrudTable.vue
+++ b/web/src/components/table/CrudTable.vue
@@ -12,13 +12,17 @@
       :scroll-x="scrollX"
       :row-key="(row) => row[rowKey]"
       :pagination="isPagination ? pagination : false"
+      :default-sort="props.defaultSort"
+      :sorter="sorterState"
       @update:checked-row-keys="onChecked"
       @update:page="onPageChange"
+      @update:sorter="onSorterChange"
     />
   </div>
 </template>
 
 <script setup>
+import { onMounted, nextTick } from 'vue'
 const props = defineProps({
   /**
    * @remote true: 后端分页  false： 前端分页
@@ -49,30 +53,26 @@ const props = defineProps({
   /** queryBar中的参数 */
   queryItems: {
     type: Object,
-    default() {
-      return {}
-    },
+    default: () => ({}),
   },
-  /** 补充参数（可选） */
+  /** 额外的参数 */
   extraParams: {
     type: Object,
-    default() {
-      return {}
-    },
+    default: () => ({}),
   },
-  /**
-   * ! 约定接口入参出参
-   * * 分页模式需约定分页接口入参
-   *    @page_size 分页参数：一页展示多少条，默认10
-   *    @page   分页参数：页码，默认1
-   */
+  /** 获取数据的方法 */
   getData: {
     type: Function,
     required: true,
   },
+  /** 默认排序 */
+  defaultSort: {
+    type: Object,
+    default: () => ({ columnKey: 'created_at', order: 'descend' }),
+  },
 })
 
-const emit = defineEmits(['update:queryItems', 'onChecked', 'onDataChange'])
+const emit = defineEmits(['update:queryItems', 'onChecked', 'onDataChange', 'update:sorter'])
 const loading = ref(false)
 const initQuery = { ...props.queryItems }
 const tableData = ref([])
@@ -126,9 +126,13 @@ async function handleReset() {
   for (const key in queryItems) {
     queryItems[key] = null
   }
+  // 强制重置排序状态为默认倒序
+  sorterState.value = { ...props.defaultSort };
   emit('update:queryItems', { ...queryItems, ...initQuery })
+  emit('update:sorter', sorterState.value);
   await nextTick()
   pagination.page = 1
+  // 强制触发搜索以应用排序状态
   handleQuery()
 }
 function onPageChange(currentPage) {
@@ -143,9 +147,35 @@ function onChecked(rowKeys) {
   }
 }
 
+const sorterState = ref(props.defaultSort)
+
+// 处理排序变化
+function onSorterChange(sorter) {
+  // 如果 sorter.order 为 null (清除排序) 并且是当前默认的排序列
+  if (!sorter.order && sorter.columnKey === props.defaultSort.columnKey) {
+    // 将 sorterState 恢复为默认排序状态
+    sorterState.value = { ...props.defaultSort };
+  } else {
+    sorterState.value = sorter;
+  }
+  // 发送更新后的 sorterState 给父组件
+  emit('update:sorter', sorterState.value);
+}
+
+// 组件挂载时触发初始排序
+onMounted(async () => {
+  if (props.defaultSort) {
+    emit('update:sorter', props.defaultSort);
+  }
+  // Ensure parent onMounted (which sets initial queryItems) runs before initial search
+  await nextTick(); 
+  handleQuery();
+});
+
 defineExpose({
   handleSearch,
   handleReset,
   tableData,
+  sorterState,
 })
 </script>
diff --git a/web/src/views/system/api/index.vue b/web/src/views/system/api/index.vue
index 3f3f48e4..5246033e 100644
--- a/web/src/views/system/api/index.vue
+++ b/web/src/views/system/api/index.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { h, onMounted, ref, resolveDirective, withDirectives } from 'vue'
-import { NButton, NForm, NFormItem, NInput, NPopconfirm } from 'naive-ui'
+import { NButton, NForm, NFormItem, NInput, NPopconfirm, NSelect } from 'naive-ui'
 
 import CommonPage from '@/components/page/CommonPage.vue'
 import QueryBarItem from '@/components/query-bar/QueryBarItem.vue'
@@ -9,6 +9,7 @@ import CrudTable from '@/components/table/CrudTable.vue'
 import TheIcon from '@/components/icon/TheIcon.vue'
 
 import { renderIcon } from '@/utils'
+import { HTTP_METHOD_OPTIONS } from '@/utils/constants'
 import { useCRUD } from '@/composables'
 // import { loginTypeMap, loginTypeOptions } from '@/constant/data'
 import api from '@/api'
@@ -232,6 +233,15 @@ const columns = [
             @keypress.enter="$table?.handleSearch()"
           />
         </QueryBarItem>
+        <QueryBarItem label="请求方式" :label-width="80">
+          <NSelect
+            v-model:value="queryItems.method"
+            :options="HTTP_METHOD_OPTIONS"
+            clearable
+            placeholder="请选择请求方式"
+            style="width: 180px;"
+          />
+        </QueryBarItem>
       </template>
     </CrudTable>
 
@@ -254,7 +264,11 @@ const columns = [
           <NInput v-model:value="modalForm.path" clearable placeholder="请输入API路径" />
         </NFormItem>
         <NFormItem label="请求方式" path="method">
-          <NInput v-model:value="modalForm.method" clearable placeholder="请输入请求方式" />
+          <NSelect 
+  v-model:value="modalForm.method" 
+  :options="HTTP_METHOD_OPTIONS"
+  placeholder="请选择请求方式"
+/>
         </NFormItem>
         <NFormItem label="API简介" path="summary">
           <NInput v-model:value="modalForm.summary" clearable placeholder="请输入API简介" />
diff --git a/web/src/views/system/auditlog/index.vue b/web/src/views/system/auditlog/index.vue
index 7ac02780..4a4168ae 100644
--- a/web/src/views/system/auditlog/index.vue
+++ b/web/src/views/system/auditlog/index.vue
@@ -15,8 +15,9 @@ const $table = ref(null)
 const queryItems = ref({})
 
 onMounted(() => {
-  $table.value?.handleSearch()
-})
+  // 设置默认倒序排序
+  queryItems.value.created_at_order = 'desc';
+});
 
 function formatTimestamp(timestamp) {
   const date = new Date(timestamp)
@@ -201,8 +202,29 @@ const columns = [
     align: 'center',
     width: 'auto',
     ellipsis: { tooltip: true },
+    sorter: true, // 允许排序
   },
 ]
+
+// 处理排序变化
+const handleSortChange = (sorter) => {
+  if (sorter && sorter.columnKey === 'created_at') {
+    // 三态循环：descend → ascend → descend
+// 强制两态循环（descend ↔ ascend）
+if (sorter.order === 'ascend') {
+  queryItems.value.created_at_order = 'desc';
+  sorter.order = 'descend';  // 强制保持排序状态
+} else {
+  queryItems.value.created_at_order = 'asc';
+  sorter.order = 'ascend';   // 强制保持排序状态
+}
+// 同步更新CrudTable的排序状态
+$table.value.sorterState = { ...sorter };
+    // 立即强制刷新表格
+    $table.value?.handleSearch();
+  }
+};
+
 </script>
 
 <template>
@@ -214,6 +236,8 @@ const columns = [
       v-model:query-items="queryItems"
       :columns="columns"
       :get-data="api.getAuditLogList"
+      :default-sort="{ columnKey: 'created_at', order: 'descend' }"
+      @update:sorter="handleSortChange" 
     >
       <template #queryBar>
         <QueryBarItem label="用户名称" :label-width="70">

From c7bdc6739d24876a764478f0e6a4d205fa9ac705 Mon Sep 17 00:00:00 2001
From: hanwenlu2016 <370389480@qq.com>
Date: Sun, 8 Jun 2025 10:17:11 +0800
Subject: [PATCH 2/4] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/utils/constants.js | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
 create mode 100644 web/src/utils/constants.js

diff --git a/web/src/utils/constants.js b/web/src/utils/constants.js
new file mode 100644
index 00000000..b703c728
--- /dev/null
+++ b/web/src/utils/constants.js
@@ -0,0 +1,16 @@
+// HTTP请求方法枚举
+export const HTTP_METHODS = {
+  GET: 'GET',
+  POST: 'POST',
+  PUT: 'PUT',
+  DELETE: 'DELETE',
+  PATCH: 'PATCH'
+}
+
+export const HTTP_METHOD_OPTIONS = [
+  { label: 'GET', value: 'GET' },
+  { label: 'POST', value: 'POST' },
+  { label: 'PUT', value: 'PUT' },
+  { label: 'DELETE', value: 'DELETE' },
+  { label: 'PATCH', value: 'PATCH' }
+]
\ No newline at end of file

From fe83ee965e8d432ccdf9b5647335c4540795fe94 Mon Sep 17 00:00:00 2001
From: hanwenlu2016 <370389480@qq.com>
Date: Tue, 17 Jun 2025 19:31:43 +0800
Subject: [PATCH 3/4] =?UTF-8?q?=E5=8E=BB=E6=8E=89=E6=8E=92=E5=BA=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/api/v1/auditlog/auditlog.py         | 11 +++--------
 web/src/views/system/auditlog/index.vue | 25 ++-----------------------
 2 files changed, 5 insertions(+), 31 deletions(-)

diff --git a/app/api/v1/auditlog/auditlog.py b/app/api/v1/auditlog/auditlog.py
index 2f32b04e..0e261bac 100644
--- a/app/api/v1/auditlog/auditlog.py
+++ b/app/api/v1/auditlog/auditlog.py
@@ -18,8 +18,7 @@ async def get_audit_log_list(
         summary: str = Query("", description="接口描述"),
         status: int = Query(None, description="状态码"),
         start_time: datetime = Query("", description="开始时间"),
-        end_time: datetime = Query("", description="结束时间"),
-        created_at_order: str = Query("desc", description="创建时间排序方式 asc/desc")
+        end_time: datetime = Query("", description="结束时间")
 ):
     q = Q()
     if username:
@@ -39,12 +38,8 @@ async def get_audit_log_list(
     elif end_time:
         q &= Q(created_at__lte=end_time)
 
-    order_by_field = "-created_at"
-    if created_at_order and created_at_order.lower() == "asc":
-        order_by_field = "created_at"
-
-    # Apply ordering before pagination
-    query = AuditLog.filter(q).order_by(order_by_field)
+    # Apply pagination without ordering
+    query = AuditLog.filter(q)
 
     audit_log_objs = await query.offset((page - 1) * page_size).limit(page_size)
     total = await AuditLog.filter(q).count()
diff --git a/web/src/views/system/auditlog/index.vue b/web/src/views/system/auditlog/index.vue
index 4a4168ae..0de839df 100644
--- a/web/src/views/system/auditlog/index.vue
+++ b/web/src/views/system/auditlog/index.vue
@@ -15,8 +15,7 @@ const $table = ref(null)
 const queryItems = ref({})
 
 onMounted(() => {
-  // 设置默认倒序排序
-  queryItems.value.created_at_order = 'desc';
+  // 初始化
 });
 
 function formatTimestamp(timestamp) {
@@ -202,28 +201,10 @@ const columns = [
     align: 'center',
     width: 'auto',
     ellipsis: { tooltip: true },
-    sorter: true, // 允许排序
   },
 ]
 
-// 处理排序变化
-const handleSortChange = (sorter) => {
-  if (sorter && sorter.columnKey === 'created_at') {
-    // 三态循环：descend → ascend → descend
-// 强制两态循环（descend ↔ ascend）
-if (sorter.order === 'ascend') {
-  queryItems.value.created_at_order = 'desc';
-  sorter.order = 'descend';  // 强制保持排序状态
-} else {
-  queryItems.value.created_at_order = 'asc';
-  sorter.order = 'ascend';   // 强制保持排序状态
-}
-// 同步更新CrudTable的排序状态
-$table.value.sorterState = { ...sorter };
-    // 立即强制刷新表格
-    $table.value?.handleSearch();
-  }
-};
+
 
 </script>
 
@@ -236,8 +217,6 @@ $table.value.sorterState = { ...sorter };
       v-model:query-items="queryItems"
       :columns="columns"
       :get-data="api.getAuditLogList"
-      :default-sort="{ columnKey: 'created_at', order: 'descend' }"
-      @update:sorter="handleSortChange" 
     >
       <template #queryBar>
         <QueryBarItem label="用户名称" :label-width="70">

From 6b4e6829a1e0592b8d2e0a492470af20943a7ec6 Mon Sep 17 00:00:00 2001
From: HanWenLu <38583116+hanwenlu2016@users.noreply.github.com>
Date: Sat, 5 Jul 2025 08:25:22 +0800
Subject: [PATCH 4/4] Update auditlog.py

---
 app/api/v1/auditlog/auditlog.py | 27 ++++++++++++++-------------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/app/api/v1/auditlog/auditlog.py b/app/api/v1/auditlog/auditlog.py
index 0e261bac..36fe1529 100644
--- a/app/api/v1/auditlog/auditlog.py
+++ b/app/api/v1/auditlog/auditlog.py
@@ -4,21 +4,23 @@
 
 from app.models.admin import AuditLog
 from app.schemas import SuccessExtra
+from app.schemas.apis import *
 
 router = APIRouter()
 
 
 @router.get("/list", summary="查看操作日志")
 async def get_audit_log_list(
-        page: int = Query(1, description="页码"),
-        page_size: int = Query(10, description="每页数量"),
-        username: str = Query("", description="操作人名称"),
-        module: str = Query("", description="功能模块"),
-        method: str = Query("", description="请求方法"),
-        summary: str = Query("", description="接口描述"),
-        status: int = Query(None, description="状态码"),
-        start_time: datetime = Query("", description="开始时间"),
-        end_time: datetime = Query("", description="结束时间")
+    page: int = Query(1, description="页码"),
+    page_size: int = Query(10, description="每页数量"),
+    username: str = Query("", description="操作人名称"),
+    module: str = Query("", description="功能模块"),
+    method: str = Query("", description="请求方法"),
+    summary: str = Query("", description="接口描述"),
+    path: str = Query("", description="请求路径"),
+    status: int = Query(None, description="状态码"),
+    start_time: datetime = Query("", description="开始时间"),
+    end_time: datetime = Query("", description="结束时间"),
 ):
     q = Q()
     if username:
@@ -29,6 +31,8 @@ async def get_audit_log_list(
         q &= Q(method__icontains=method)
     if summary:
         q &= Q(summary__icontains=summary)
+    if path:
+        q &= Q(path__icontains=path)
     if status:
         q &= Q(status=status)
     if start_time and end_time:
@@ -38,10 +42,7 @@ async def get_audit_log_list(
     elif end_time:
         q &= Q(created_at__lte=end_time)
 
-    # Apply pagination without ordering
-    query = AuditLog.filter(q)
-
-    audit_log_objs = await query.offset((page - 1) * page_size).limit(page_size)
+    audit_log_objs = await AuditLog.filter(q).offset((page - 1) * page_size).limit(page_size).order_by("-created_at")
     total = await AuditLog.filter(q).count()
     data = [await audit_log.to_dict() for audit_log in audit_log_objs]
     return SuccessExtra(data=data, total=total, page=page, page_size=page_size)