feat: Support sorting feat for knowledge base documents

--story=1017634 --user=刘瑞斌 知识库文档列表排序功能，可以根据各列属性排序 https://www.tapd.cn/57709429/s/1654419

Author: liuruibin

apps/dataset/serializers/document_serializers.py

@@ -411,6 +411,7 @@ class Query(ApiMixin, serializers.Serializer):
         is_active = serializers.BooleanField(required=False, error_messages=ErrMessage.boolean(_('document is active')))
         task_type = serializers.IntegerField(required=False, error_messages=ErrMessage.integer(_('task type')))
         status = serializers.CharField(required=False, error_messages=ErrMessage.char(_('status')))
+        order_by = serializers.CharField(required=False, error_messages=ErrMessage.char(_('order by')))
 
         def get_query_set(self):
             query_set = QuerySet(model=Document)
@@ -437,7 +438,11 @@ def get_query_set(self):
                         query_set = query_set.filter(status__icontains=status)
                     else:
                         query_set = query_set.filter(status__iregex='^[2n]*$')
-            query_set = query_set.order_by('-create_time', 'id')
+            order_by = self.data.get('order_by', '')
+            if order_by:
+                query_set = query_set.order_by(order_by)
+            else:
+                query_set = query_set.order_by('-create_time', 'id')
             return query_set
 
         def list(self, with_valid=False):

ui/src/views/document/index.vue

@@ -58,12 +58,18 @@
           @creatQuick="creatQuickHandle"
           @row-click="rowClickHandle"
           @selection-change="handleSelectionChange"
+          @sort-change="handleSortChange"
           v-loading="loading"
           :row-key="(row: any) => row.id"
           :storeKey="storeKey"
         >
           <el-table-column type="selection" width="55" :reserve-selection="true" />
-          <el-table-column prop="name" :label="$t('views.document.table.name')" min-width="280">
+          <el-table-column
+            prop="name"
+            :label="$t('views.document.table.name')"
+            min-width="280"
+            sortable
+          >
             <template #default="{ row }">
               <ReadWrite
                 @change="editName($event, row.id)"
@@ -77,6 +83,7 @@
             :label="$t('views.document.table.char_length')"
             align="right"
             min-width="90"
+            sortable
           >
             <template #default="{ row }">
               {{ numberFormat(row.char_length) }}
@@ -87,6 +94,7 @@
             :label="$t('views.document.table.paragraph')"
             align="right"
             min-width="90"
+            sortable
           />
           <el-table-column prop="status" :label="$t('views.document.fileStatus.label')" width="130">
             <template #header>
@@ -242,7 +250,12 @@
               {{ $t(hitHandlingMethod[row.hit_handling_method as keyof typeof hitHandlingMethod]) }}
             </template>
           </el-table-column>
-          <el-table-column prop="create_time" :label="$t('common.createTime')" width="175">
+          <el-table-column
+            prop="create_time"
+            :label="$t('common.createTime')"
+            width="175"
+            sortable
+          >
             <template #default="{ row }">
               {{ datetimeFormat(row.create_time) }}
             </template>
@@ -251,6 +264,7 @@
             prop="update_time"
             :label="$t('views.document.table.updateTime')"
             width="175"
+            sortable
           >
             <template #default="{ row }">
               {{ datetimeFormat(row.update_time) }}
@@ -509,6 +523,7 @@ const loading = ref(false)
 let interval: any
 const filterText = ref('')
 const filterMethod = ref<any>({})
+const orderBy = ref<string>('')
 const documentData = ref<any[]>([])
 const currentMouseId = ref(null)
 const datasetDetail = ref<any>({})
@@ -805,10 +820,16 @@ function handleSizeChange() {
   getList()
 }
 
+function handleSortChange({ prop, order }: { prop: string; order: string }) {
+  orderBy.value = order === 'ascending' ? prop : `-${prop}`
+  getList()
+}
+
 function getList(bool?: boolean) {
   const param = {
     ...(filterText.value && { name: filterText.value }),
-    ...filterMethod.value
+    ...filterMethod.value,
+    order_by: orderBy.value,
   }
   documentApi
     .getDocument(id as string, paginationConfig.value, param, bool ? undefined : loading)