From b6cb51a5e9bc68e6d1a88c9cddb2ce0ff510aa2f Mon Sep 17 00:00:00 2001 From: chabai <14799297+dhasjklhdfjkasfbhfasfj@user.noreply.gitee.com> Date: Tue, 12 Aug 2025 14:18:00 +0800 Subject: [PATCH] =?UTF-8?q?=E5=95=86=E5=8A=A1=E6=95=B0=E6=8D=AE=E5=BA=93?= =?UTF-8?q?=E4=BF=A1=E6=81=AF=E6=A8=A1=E5=9D=97=E6=9B=B4=E5=90=8D=E4=B8=BA?= =?UTF-8?q?=E6=99=BA=E8=83=BD=E5=95=86=E5=8A=A1=EF=BC=8C=E5=88=9D=E6=AD=A5?= =?UTF-8?q?=E5=AE=9E=E7=8E=B0=E6=96=87=E4=BB=B6=E6=8E=92=E5=BA=8F=E5=8A=9F?= =?UTF-8?q?=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/bussiness/index.ts | 6 +- src/apis/bussiness/type.ts | 2 + src/router/route.ts | 4 +- src/types/auto-imports.d.ts | 2 +- src/views/bussiness-data/bussiness.vue | 160 +++++++++++++++++++++++-- 5 files changed, 162 insertions(+), 12 deletions(-) diff --git a/src/apis/bussiness/index.ts b/src/apis/bussiness/index.ts index a28311e..8e9ab09 100644 --- a/src/apis/bussiness/index.ts +++ b/src/apis/bussiness/index.ts @@ -1,4 +1,4 @@ -// @/apis/bussiness/index.ts - 商务数据库信息模块API +// @/apis/bussiness/index.ts - 智能商务API import http from '@/utils/http' import type { FolderInfo, @@ -59,7 +59,9 @@ export function getFilesApi(params?: FileListParams) { page: params?.page || 1, pageSize: params?.pageSize || 10, folderId: params?.folderId || '0', - fileName: params?.fileName + fileName: params?.fileName, + sortField: params?.sortField, + sortOrder: params?.sortOrder } }) } diff --git a/src/apis/bussiness/type.ts b/src/apis/bussiness/type.ts index 6fa269a..8d6f0e7 100644 --- a/src/apis/bussiness/type.ts +++ b/src/apis/bussiness/type.ts @@ -31,6 +31,8 @@ export interface FileListParams { pageSize?: number folderId?: string fileName?: string + sortField?: string + sortOrder?: string } /** 文件夹列表响应 */ diff --git a/src/router/route.ts b/src/router/route.ts index 99cb49e..2f749c1 100644 --- a/src/router/route.ts +++ b/src/router/route.ts @@ -1104,7 +1104,7 @@ export const systemRoutes: RouteRecordRaw[] = [ }, // ], // }, - // 商务数据库信息模块 + // 智能商务模块 { path: '/bussiness-knowledge', name: 'bussinesskonwledge', @@ -1117,7 +1117,7 @@ export const systemRoutes: RouteRecordRaw[] = [ name: 'bussiness-knowledge', component: () => import('@/views/bussiness-data/bussiness.vue'), meta: { - title: '商务数据库信息', + title: '智能商务', icon: 'info-circle', hidden: false, }, diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts index eab6be6..369aad4 100644 --- a/src/types/auto-imports.d.ts +++ b/src/types/auto-imports.d.ts @@ -70,6 +70,6 @@ declare global { // for type re-export declare global { // @ts-ignore - export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue' + export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue' import('vue') } diff --git a/src/views/bussiness-data/bussiness.vue b/src/views/bussiness-data/bussiness.vue index cb61fc2..49f236c 100644 --- a/src/views/bussiness-data/bussiness.vue +++ b/src/views/bussiness-data/bussiness.vue @@ -242,10 +242,42 @@
- 文件名 - 类型 - 大小 - 修改时间 + +
+ 文件名 +
+
+
+
+
+ + +
+ 类型 +
+
+
+
+
+ + +
+ 大小 +
+
+
+
+
+ + +
+ 修改时间 +
+
+
+
+
+ 操作 @@ -613,6 +645,18 @@ const fileCurrentPage = ref(1); const filePageSize = ref(10); const totalFiles = ref(0); +// 排序状态 +const sortField = ref(''); +const sortOrder = ref(''); + +// 排序字段映射（前端显示名 -> 后端字段名） +const sortFieldMap = { + 'fileName': 'file_name', + 'fileType': 'file_type', + 'fileSize': 'file_size', + 'uploadTime': 'upload_time' +}; + // 表单数据 const folderForm = reactive({ id: '', @@ -941,6 +985,9 @@ const handleFileSearch = () => { console.log('文件搜索关键词:', fileSearchKeyword.value); // 重置到第一页并搜索 fileCurrentPage.value = 1; + // 搜索时重置排序状态 + sortField.value = ''; + sortOrder.value = ''; console.log('重置文件页码为:', fileCurrentPage.value); if (currentFolderId.value) { loadFiles(currentFolderId.value); @@ -960,6 +1007,9 @@ const handleFileSearchInput = (value) => { searchTimeout.value = setTimeout(() => { console.log('=== 防抖文件搜索执行 ==='); fileCurrentPage.value = 1; + // 搜索时重置排序状态 + sortField.value = ''; + sortOrder.value = ''; console.log('重置文件页码为:', fileCurrentPage.value); if (currentFolderId.value) { loadFiles(currentFolderId.value); @@ -976,6 +1026,9 @@ const handleFileSearchClear = () => { console.log('清除文件搜索定时器'); } fileCurrentPage.value = 1; + // 清除搜索时重置排序状态 + sortField.value = ''; + sortOrder.value = ''; console.log('重置文件页码为:', fileCurrentPage.value); if (currentFolderId.value) { loadFiles(currentFolderId.value); @@ -985,12 +1038,20 @@ const handleFileSearchClear = () => { const loadFiles = async (folderId) => { try { loading.value = true; - const res = await getFilesApi({ + const apiParams = { folderId: folderId, page: fileCurrentPage.value, pageSize: filePageSize.value, fileName: fileSearchKeyword.value || undefined - }); + }; + + // 添加排序参数 + if (sortField.value && sortOrder.value) { + apiParams.sortField = sortField.value; + apiParams.sortOrder = sortOrder.value; + } + + const res = await getFilesApi(apiParams); // 根据后端返回的数据结构处理 if (res.code === 200 && res.data) { @@ -1012,6 +1073,26 @@ const loadFiles = async (folderId) => { } }; +// 排序处理函数 +const handleSortChange = (field) => { + const backendField = sortFieldMap[field]; + + if (!backendField) return; + + // 切换排序方向 + if (sortField.value === backendField) { + sortOrder.value = sortOrder.value === 'asc' ? 'desc' : 'asc'; + } else { + // 新字段，默认降序 + sortField.value = backendField; + sortOrder.value = 'desc'; + } + + // 重新加载文件列表 + if (currentFolderId.value) { + loadFiles(currentFolderId.value); + } +}; // 文件夹点击事件 // const handleFolderClick = (folderId) => { @@ -1030,8 +1111,10 @@ const handleFolderSelect = (selectedKeys, info) => { const folderId = selectedKeys[0]; if (currentFolderId.value !== folderId) { fileCurrentPage.value = 1; - // 切换文件夹时清空文件搜索关键词 + // 切换文件夹时清空文件搜索关键词和排序状态 fileSearchKeyword.value = ''; + sortField.value = ''; + sortOrder.value = ''; } currentFolderId.value = folderId; loadFiles(folderId); @@ -1136,6 +1219,9 @@ const handleBreadcrumbClick = (index) => { if (index === 0) { // 点击"知识库"，回到根目录 currentFolderId.value = '0'; + // 重置排序状态 + sortField.value = ''; + sortOrder.value = ''; loadFiles('0'); } else { // 点击其他路径项，需要找到对应的文件夹ID @@ -1146,6 +1232,9 @@ const handleBreadcrumbClick = (index) => { const targetFolder = folderList.value.find(folder => folder.name === targetFolderName); if (targetFolder) { currentFolderId.value = targetFolder.id; + // 重置排序状态 + sortField.value = ''; + sortOrder.value = ''; loadFiles(targetFolder.id); } } @@ -1307,6 +1396,9 @@ const refreshData = async () => { // 强制清空搜索关键词，确保显示所有文件夹 searchKeyword.value = ''; currentPage.value = 1; + // 刷新时重置排序状态 + sortField.value = ''; + sortOrder.value = ''; await initData(); if (currentFolderId.value) { @@ -3464,6 +3556,60 @@ onMounted(() => { } } +/* 可排序表头样式 */ +.sortable-header { + display: flex; + align-items: center; + justify-content: center; + gap: 6px; + cursor: pointer; + padding: 4px 8px; + border-radius: 4px; + transition: all 0.2s ease; + user-select: none; +} + +.sortable-header:hover { + background: var(--color-fill-2); + color: var(--color-primary); +} + +.sort-indicator { + display: flex; + flex-direction: column; + gap: 1px; + margin-left: 4px; +} + +.sort-arrow { + width: 0; + height: 0; + border-left: 3px solid transparent; + border-right: 3px solid transparent; + transition: all 0.2s ease; +} + +.sort-arrow.up { + border-bottom: 3px solid var(--color-text-4); +} + +.sort-arrow.down { + border-top: 3px solid var(--color-text-4); +} + +.sort-arrow.active { + border-bottom-color: var(--color-primary); + border-top-color: var(--color-primary); +} + +.sortable-header:hover .sort-arrow.up { + border-bottom-color: var(--color-primary); +} + +.sortable-header:hover .sort-arrow.down { + border-top-color: var(--color-primary); +} + /* 文件分页样式 */ .file-pagination { position: absolute;