🔨 排序字段.

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-server-module-entity-do.java.vm

@@ -26,6 +26,7 @@ import com.baomidou.mybatisplus.annotation.*;
 import io.swagger.v3.oas.annotations.media.Schema;
 import org.dromara.visor.framework.mybatis.core.domain.BaseDO;
 import lombok.*;
+import lombok.experimental.SuperBuilder;
 
 import java.util.*;
 import java.math.*;
@@ -38,7 +39,7 @@ import java.math.*;
  * @since ${date}
  */
 @Data
-@Builder
+@SuperBuilder
 @NoArgsConstructor
 @AllArgsConstructor
 @EqualsAndHashCode(callSuper = true)
@@ -66,17 +67,8 @@ public class ${entity} {
 #if("$!field.comment" != "")
     @Schema(description = "${field.comment}")
 #end
-#if(${field.keyFlag})
-## 主键
-  #if(${field.keyIdentityFlag})
-    @TableId(value = "${field.annotationColumnName}", type = IdType.AUTO)
-  #elseif(!$null.isNull(${idType}) && "$!idType" != "")
-    @TableId(value = "${field.annotationColumnName}", type = IdType.${idType})
-  #elseif(${field.convert})
-    @TableId("${field.annotationColumnName}")
-  #end
 ## 普通字段
-#elseif(${field.fill})
+#if(${field.fill})
 ## -----   存在字段填充设置   -----
   #if(${field.convert})
     @TableField(value = "${field.annotationColumnName}", fill = FieldFill.${field.fill})

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-server-module-entity-request-query.java.vm

@@ -25,11 +25,9 @@ package ${currentPackage};
 import com.fasterxml.jackson.annotation.JsonFormat;
 import io.swagger.v3.oas.annotations.media.Schema;
 import lombok.*;
-import org.dromara.visor.common.entity.PageRequest;
+import org.dromara.visor.common.entity.BaseQueryRequest;
 
 import javax.validation.constraints.Size;
-import java.util.*;
-import java.math.*;
 
 /**
  * $!{table.comment} 查询请求对象
@@ -44,7 +42,7 @@ import java.math.*;
 @AllArgsConstructor
 @EqualsAndHashCode(callSuper = true)
 @Schema(name = "${type}QueryRequest", description = "$!{table.comment} 查询请求对象")
-public class ${type}QueryRequest extends PageRequest {
+public class ${type}QueryRequest extends BaseQueryRequest {
 
     @Schema(description = "搜索")
     private String searchValue;

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-server-module-service-impl.java.vm

@@ -144,10 +144,11 @@ public class ${table.serviceImplName} implements ${table.serviceName} {
     @Override
     public List<${type}VO> get${type}List(${type}QueryRequest request) {
         // 条件
-        LambdaQueryWrapper<${type}DO> wrapper = this.buildQueryWrapper(request)
+        LambdaQueryWrapper<${type}DO> wrapper = this.buildQueryWrapper(request);
-                .orderByDesc(${type}DO::getId);
         // 查询
-        return ${typeLower}DAO.of(wrapper).list(${type}Convert.MAPPER::to);
+        return ${typeLower}DAO.of(wrapper)
+                .order(request, ${type}DO::getId)
+                .list(${type}Convert.MAPPER::to);
     }
     #if($meta.enableCache)
 
@@ -176,12 +177,12 @@ public class ${table.serviceImplName} implements ${table.serviceName} {
     @Override
     public DataGrid<${type}VO> get${type}Page(${type}QueryRequest request) {
         // 条件
-        LambdaQueryWrapper<${type}DO> wrapper = this.buildQueryWrapper(request)
+        LambdaQueryWrapper<${type}DO> wrapper = this.buildQueryWrapper(request);
-                .orderByDesc(${type}DO::getId);
         // 查询
         return ${typeLower}DAO.of()
-                .page(request)
                 .wrapper(wrapper)
+                .page(request)
+                .order(request, ${type}DO::getId)
                 .dataGrid(${type}Convert.MAPPER::to);
     }
 

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-vue-api.ts.vm

@@ -1,5 +1,5 @@
-import type { DataGrid, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import axios from 'axios';
 import qs from 'query-string';
 
@@ -32,7 +32,7 @@ export interface ${vue.featureEntity}UpdateRequest extends ${vue.featureEntity}C
 /**
  * ${table.comment}查询请求
  */
-export interface ${vue.featureEntity}QueryRequest extends Pagination {
+export interface ${vue.featureEntity}QueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   #foreach($field in ${table.fields})
   #if("$field.propertyType" == "String" || "$field.propertyType" == "Date")

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-vue-views-types-card.fields.ts.vm

@@ -10,6 +10,7 @@ const fieldConfig = {
       label: 'id',
       dataIndex: 'id',
       slotName: 'id',
+      default: true,
     }, #foreach($field in ${table.fields})#if("$!field.propertyName" != "id"){
       label: '${field.comment}',
       dataIndex: '${field.propertyName}',
@@ -21,6 +22,7 @@ const fieldConfig = {
         return record.${field.propertyName} && dateFormat(new Date(record.${field.propertyName}));
       },
       #end
+      default: true,
     }, #end#end{
       label: '创建时间',
       dataIndex: 'createTime',

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-vue-views-types-const.ts.vm

@@ -1,3 +1,5 @@
+export const TABLE_NAME = '$table.name';
+
 #if($dictMap.entrySet().size() > 0)
 #foreach($enumEntity in $dictMap.entrySet())
 // $enumEntity.value.comment

orion-visor-framework/orion-visor-spring-boot-starter-mybatis/src/main/resources/templates/orion-vue-views-types-table.columns.ts.vm

@@ -9,6 +9,7 @@ const columns = [
     width: 68,
     align: 'left',
     fixed: 'left',
+    default: true,
   }, #foreach($field in ${table.fields})#if("$!field.propertyName" != "id"){
     title: '${field.comment}',
     dataIndex: '${field.propertyName}',
@@ -24,6 +25,7 @@ const columns = [
       return record.${field.propertyName} && dateFormat(new Date(record.${field.propertyName}));
     },
     #end
+    default: true,
   }, #end#end{
     title: '创建时间',
     dataIndex: 'createTime',

orion-visor-ui/src/api/asset/host-identity.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -26,7 +26,7 @@ export interface HostIdentityUpdateRequest extends HostIdentityCreateRequest {
 /**
  * 主机身份查询请求
  */
-export interface HostIdentityQueryRequest extends Pagination {
+export interface HostIdentityQueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   id?: number;
   name?: string;

orion-visor-ui/src/api/asset/host-key.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -25,7 +25,7 @@ export interface HostKeyUpdateRequest extends HostKeyCreateRequest {
 /**
  * 主机密钥查询请求
  */
-export interface HostKeyQueryRequest extends Pagination {
+export interface HostKeyQueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   id?: number;
   name?: string;

orion-visor-ui/src/api/asset/host.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -47,7 +47,7 @@ export interface HostUpdateConfigRequest {
 /**
  * 主机查询请求
  */
-export interface HostQueryRequest extends Pagination {
+export interface HostQueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   id?: number;
   type?: string;

orion-visor-ui/src/api/asset/terminal-connect-log.ts

@@ -1,4 +1,4 @@
-import type { ClearRequest, DataGrid, Pagination } from '@/types/global';
+import type { ClearRequest, DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -6,7 +6,7 @@ import qs from 'query-string';
 /**
  * 终端连接日志查询请求
  */
-export interface TerminalConnectLogQueryRequest extends Pagination {
+export interface TerminalConnectLogQueryRequest extends Pagination, OrderDirection {
   id?: number;
   userId?: number;
   hostId?: number;

orion-visor-ui/src/api/asset/terminal-sftp.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import { httpBaseUrl } from '@/utils/env';
 import axios from 'axios';
@@ -7,7 +7,7 @@ import qs from 'query-string';
 /**
  * SFTP 操作日志 查询请求
  */
-export interface TerminalSftpLogQueryRequest extends Pagination {
+export interface TerminalSftpLogQueryRequest extends Pagination, OrderDirection {
   userId?: number;
   hostId?: number;
   type?: string;

orion-visor-ui/src/api/exec/exec-job.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import type { HostQueryResponse } from '@/api/asset/host';
 import axios from 'axios';
@@ -43,7 +43,7 @@ export interface ExecJobUpdateExecUserRequest {
 /**
  * 计划任务查询请求
  */
-export interface ExecJobQueryRequest extends Pagination {
+export interface ExecJobQueryRequest extends Pagination, OrderDirection {
   id?: number;
   name?: string;
   command?: string;

orion-visor-ui/src/api/exec/exec-log.ts

@@ -1,11 +1,11 @@
-import type { ClearRequest, Pagination } from '@/types/global';
+import type { ClearRequest, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import { createAppWebSocket } from '@/utils/http';
 
 /**
  * 执行日志查询请求
  */
-export interface ExecLogQueryRequest extends Pagination {
+export interface ExecLogQueryRequest extends Pagination, OrderDirection {
   id?: number;
   userId?: number;
   sourceId?: number;

orion-visor-ui/src/api/exec/exec-template.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -25,7 +25,7 @@ export interface ExecTemplateUpdateRequest extends ExecTemplateCreateRequest {
 /**
  * 执行模板查询请求
  */
-export interface ExecTemplateQueryRequest extends Pagination {
+export interface ExecTemplateQueryRequest extends Pagination, OrderDirection {
   id?: number;
   name?: string;
   command?: string;

orion-visor-ui/src/api/exec/upload-task.ts

@@ -1,4 +1,4 @@
-import type { ClearRequest, DataGrid, Pagination } from '@/types/global';
+import type { ClearRequest, DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -33,7 +33,7 @@ export interface UploadTaskCreateResponse {
 /**
  * 上传任务查询请求
  */
-export interface UploadTaskQueryRequest extends Pagination {
+export interface UploadTaskQueryRequest extends Pagination, OrderDirection {
   id?: number;
   userId?: number;
   remotePath?: string;

orion-visor-ui/src/api/meta/history-value.ts

@@ -1,11 +1,11 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 
 /**
  * 历史归档查询请求
  */
-export interface HistoryValueQueryRequest extends Pagination {
+export interface HistoryValueQueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   relId?: number;
   type?: string;

orion-visor-ui/src/api/system/dict-key.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -23,7 +23,7 @@ export interface DictKeyUpdateRequest extends DictKeyCreateRequest {
 /**
  * 字典配置项查询请求
  */
-export interface DictKeyQueryRequest extends Pagination {
+export interface DictKeyQueryRequest extends Pagination, OrderDirection {
   searchValue?: string;
   id?: number;
   keyName?: string;

orion-visor-ui/src/api/system/dict-value.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Options, Pagination } from '@/types/global';
+import type { DataGrid, Options, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 import qs from 'query-string';
@@ -33,7 +33,7 @@ export interface DictValueRollbackRequest {
 /**
  * 字典配置值查询请求
  */
-export interface DictValueQueryRequest extends Pagination {
+export interface DictValueQueryRequest extends Pagination, OrderDirection {
   keyId?: number;
   keyName?: string;
   value?: string;

orion-visor-ui/src/api/system/message.ts

@@ -1,10 +1,10 @@
-import type { Pagination } from '@/types/global';
+import type { OrderDirection, Pagination } from '@/types/global';
 import axios from 'axios';
 
 /**
  * 系统消息查询请求
  */
-export interface MessageQueryRequest extends Pagination {
+export interface MessageQueryRequest extends Pagination, OrderDirection {
   maxId?: number;
   classify?: string;
   queryUnread?: boolean;

orion-visor-ui/src/api/user/operator-log.ts

@@ -1,11 +1,11 @@
-import type { ClearRequest, DataGrid, Pagination } from '@/types/global';
+import type { ClearRequest, DataGrid, OrderDirection, Pagination } from '@/types/global';
 import axios from 'axios';
 import qs from 'query-string';
 
 /**
  * 操作日志查询参数
  */
-export interface OperatorLogQueryRequest extends Pagination {
+export interface OperatorLogQueryRequest extends Pagination, OrderDirection {
   userId?: number;
   username?: string;
   module?: string;

orion-visor-ui/src/api/user/role.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import axios from 'axios';
 
@@ -30,7 +30,7 @@ export interface RoleGrantMenuRequest extends RoleCreateRequest {
 /**
  * 角色查询请求
  */
-export interface RoleQueryRequest extends Pagination {
+export interface RoleQueryRequest extends Pagination, OrderDirection {
   id?: number;
   name?: string;
   code?: string;

orion-visor-ui/src/api/user/user.ts

@@ -1,4 +1,4 @@
-import type { DataGrid, Pagination } from '@/types/global';
+import type { DataGrid, OrderDirection, Pagination } from '@/types/global';
 import type { TableData } from '@arco-design/web-vue';
 import type { RoleQueryResponse } from '@/api/user/role';
 import axios from 'axios';
@@ -29,7 +29,7 @@ export interface UserUpdateRequest extends UserCreateRequest {
 /**
  * 用户查询请求
  */
-export interface UserQueryRequest extends Pagination {
+export interface UserQueryRequest extends Pagination, OrderDirection {
   id?: number;
   username?: string;
   password?: string;

orion-visor-ui/src/assets/style/layout.less

@@ -66,6 +66,43 @@
   }
 }
 
+.table-adjust-popover {
+  user-select: none;
+
+  &-header {
+    padding: 4px 4px 4px 6px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .table-adjust-title {
+      margin-left: 4px;
+      color: var(--color-text-1);
+    }
+  }
+
+  .arco-checkbox-group {
+    min-width: 168px;
+  }
+
+  .arco-radio-group {
+    min-width: 148px;
+  }
+
+  .arco-checkbox-group, .arco-radio-group {
+    padding: 0 4px 4px 4px;
+
+    .arco-checkbox, .radio-checkbox {
+      border-radius: 4px;
+      padding: 0 6px;
+
+      &:hover {
+        background: var(--color-fill-2);
+      }
+    }
+  }
+}
+
 // -- drawer
 .drawer-form-small {
   padding: 20px 20px 2px 20px;
@@ -196,7 +233,7 @@
 .more-doption {
   min-width: 42px;
   padding: 0 4px;
-  font-size: 12px;
+  font-size: 13px;
   display: inline-block;
 
   svg {

orion-visor-ui/src/components/app/table-adjust/index.vue

@@ -0,0 +1,142 @@
+<template>
+  <a-button-group v-if="columnsHook || queryOrder">
+    <!-- 调整列 -->
+    <a-popover v-if="columnsHook && columns"
+               class="table-adjust-popover"
+               position="br"
+               trigger="click"
+               :content-style="{ padding: 0 }"
+               @popup-visible-change="columnsVisibleChanged">
+      <!-- 触发按钮 -->
+      <a-button title="调整列">
+        <template #icon>
+          <icon-list />
+        </template>
+      </a-button>
+      <!-- 调整内容 -->
+      <template #content>
+        <!-- 顶部按钮 -->
+        <div class="table-adjust-popover-header">
+          <span class="table-adjust-title">
+            表格展示列
+          </span>
+          <a-button type="text"
+                    size="mini"
+                    @click="resetColumns">
+            重置
+          </a-button>
+        </div>
+        <!-- 分隔符 -->
+        <a-divider :margin="4" />
+        <!-- 列信息 -->
+        <a-checkbox-group v-model="columnsValue"
+                          direction="vertical"
+                          @change="columnsChanged">
+          <a-checkbox v-for="column in columns"
+                      :key="column.dataIndex || column.slotName"
+                      :value="column.dataIndex || column.slotName">
+            {{ column.title }}
+          </a-checkbox>
+        </a-checkbox-group>
+      </template>
+    </a-popover>
+    <!-- 调整排序 -->
+    <a-popover v-if="queryOrder"
+               class="table-adjust-popover"
+               position="br"
+               trigger="click"
+               :content-style="{ padding: 0 }"
+               @popup-visible-change="sortVisibleChanged">
+      <!-- 触发按钮 -->
+      <a-button title="调整排序">
+        <template #icon>
+          <icon-sort-ascending />
+        </template>
+      </a-button>
+      <!-- 调整内容 -->
+      <template #content>
+        <!-- 顶部按钮 -->
+        <div class="table-adjust-popover-header">
+          <span class="table-adjust-title">
+            表格查询排序
+          </span>
+        </div>
+        <!-- 分隔符 -->
+        <a-divider :margin="4" />
+        <!-- 列信息 -->
+        <a-radio-group v-model="orderValue"
+                       direction="vertical"
+                       @change="sortChanged">
+          <a-radio :value="ASC">
+            升序排序
+          </a-radio>
+          <a-radio :value="DESC">
+            降序排序
+          </a-radio>
+        </a-radio-group>
+      </template>
+    </a-popover>
+  </a-button-group>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'tableAdjust'
+  };
+</script>
+
+<script lang="ts" setup>
+  import type { TableColumnData } from '@arco-design/web-vue';
+  import type { TableColumnsHook } from '@/hooks/table';
+  import type { QueryOrderData } from '@/hooks/query-order';
+  import { ref } from 'vue';
+  import { ASC, DESC } from '@/hooks/query-order';
+
+  const emits = defineEmits(['query']);
+
+  const props = defineProps<Partial<{
+    columns: Array<TableColumnData>;
+    columnsHook: TableColumnsHook;
+    queryOrder: QueryOrderData;
+  }>>();
+
+  const columnsValue = ref<Array<string>>([]);
+  const orderValue = ref<number>(ASC);
+
+  // 列显示切换
+  const columnsVisibleChanged = (show: boolean) => {
+    if (show && props.columnsHook) {
+      columnsValue.value = props.columnsHook.getConfig();
+    }
+  };
+
+  // 排序显示切换
+  const sortVisibleChanged = (show: boolean) => {
+    if (show && props.queryOrder) {
+      orderValue.value = props.queryOrder.order.value;
+    }
+  };
+
+  // 重置列
+  const resetColumns = () => {
+    if (props.columnsHook) {
+      props.columnsHook.saveConfig(undefined);
+      columnsValue.value = props.columnsHook.getConfig();
+    }
+  };
+
+  // 修改列
+  const columnsChanged = () => {
+    props.columnsHook?.saveConfig(columnsValue.value);
+  };
+
+  // 修改排序
+  const sortChanged = () => {
+    props.queryOrder?.saveConfig(orderValue.value);
+    emits('query');
+  };
+
+</script>
+
+<style lang="less" scoped>
+</style>

orion-visor-ui/src/components/view/card-list/components/card-field-adjust.vue

@@ -0,0 +1,78 @@
+<template>
+  <!-- 调整字段 -->
+  <a-popover class="table-adjust-popover"
+             position="br"
+             trigger="click"
+             :content-style="{ padding: 0 }"
+             @popup-visible-change="visibleChanged">
+    <!-- 触发按钮 -->
+    <a-button class="icon-button card-header-icon-button" title="调整字段">
+      <icon-list />
+    </a-button>
+    <!-- 调整内容 -->
+    <template #content>
+      <!-- 顶部按钮 -->
+      <div class="table-adjust-popover-header">
+        <span class="table-adjust-title">
+          表格展示字段
+        </span>
+        <a-button type="text"
+                  size="mini"
+                  @click="resetFields">
+          重置
+        </a-button>
+      </div>
+      <!-- 分隔符 -->
+      <a-divider :margin="4" />
+      <!-- 列信息 -->
+      <a-checkbox-group v-model="fieldsValue"
+                        direction="vertical"
+                        @change="fieldsChanged">
+        <a-checkbox v-for="field in fieldsHook.originFields"
+                    :key="field.dataIndex || field.slotName"
+                    :value="field.dataIndex || field.slotName">
+          {{ field.label }}
+        </a-checkbox>
+      </a-checkbox-group>
+    </template>
+  </a-popover>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'cardFieldAdjust'
+  };
+</script>
+
+<script lang="ts" setup>
+  import type { CardFieldsHook } from '@/hooks/card';
+  import { ref } from 'vue';
+
+  const props = defineProps<{
+    fieldsHook: CardFieldsHook;
+  }>();
+
+  const fieldsValue = ref<Array<string>>([]);
+
+  // 列显示切换
+  const visibleChanged = (show: boolean) => {
+    if (show) {
+      fieldsValue.value = props.fieldsHook.getConfig();
+    }
+  };
+
+  // 重置字段
+  const resetFields = () => {
+    props.fieldsHook.saveConfig(undefined);
+    fieldsValue.value = props.fieldsHook.getConfig();
+  };
+
+  // 修改字段
+  const fieldsChanged = () => {
+    props.fieldsHook.saveConfig(fieldsValue.value);
+  };
+
+</script>
+
+<style lang="less" scoped>
+</style>

orion-visor-ui/src/components/view/card-list/components/card-header.vue

@@ -90,6 +90,13 @@
                       @click="bubblesEmitter(HeaderEmitter.RESET)">
               <icon-refresh />
             </a-button>
+            <!-- 调整字段 -->
+            <card-field-adjust v-if="fieldsHook"
+                               :fields-hook="fieldsHook" />
+            <!-- 调整排序 -->
+            <card-sort-adjust v-if="queryOrder"
+                              :query-order="queryOrder"
+                              @query="bubblesEmitter(HeaderEmitter.SEARCH)" />
           </a-space>
         </div>
       </div>
@@ -110,13 +117,14 @@
   import { triggerMouseEvent } from '@/utils/event';
   import { HeaderEmitter } from '../types/emits';
   import useEmitter from '@/hooks/emitter';
+  import CardFieldAdjust from './card-field-adjust.vue';
+  import CardSortAdjust from './card-sort-adjust.vue';
 
   const props = defineProps<CardProps>();
   const emits = defineEmits(['emitter']);
 
-  const { bubblesEmitter } = useEmitter(emits);
-
   const appStore = useAppStore();
+  const { bubblesEmitter } = useEmitter(emits);
 
   const filterRef = ref();
 

orion-visor-ui/src/components/view/card-list/components/card-sort-adjust.vue

@@ -0,0 +1,72 @@
+<template>
+  <!-- 调整排序 -->
+  <a-popover class="table-adjust-popover"
+             position="br"
+             trigger="click"
+             :content-style="{ padding: 0 }"
+             @popup-visible-change="visibleChanged">
+    <!-- 触发按钮 -->
+    <a-button class="icon-button card-header-icon-button" title="调整排序">
+      <icon-sort-ascending />
+    </a-button>
+    <!-- 调整内容 -->
+    <template #content>
+      <!-- 顶部按钮 -->
+      <div class="table-adjust-popover-header">
+        <span class="table-adjust-title">
+          表格查询排序
+        </span>
+      </div>
+      <!-- 分隔符 -->
+      <a-divider :margin="4" />
+      <!-- 排序信息 -->
+      <a-radio-group v-model="orderValue"
+                     direction="vertical"
+                     @change="sortChanged">
+        <a-radio :value="ASC">
+          升序排序
+        </a-radio>
+        <a-radio :value="DESC">
+          降序排序
+        </a-radio>
+      </a-radio-group>
+    </template>
+  </a-popover>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'cardSortAdjust'
+  };
+</script>
+
+<script lang="ts" setup>
+  import type { QueryOrderData } from '@/hooks/query-order';
+  import { ref } from 'vue';
+  import { ASC, DESC } from '@/hooks/query-order';
+
+  const emits = defineEmits(['query']);
+
+  const props = defineProps<{
+    queryOrder: QueryOrderData;
+  }>();
+
+  const orderValue = ref<number>(ASC);
+
+  // 排序显示切换
+  const visibleChanged = (show: boolean) => {
+    if (show) {
+      orderValue.value = props.queryOrder.order.value;
+    }
+  };
+
+  // 修改排序
+  const sortChanged = () => {
+    props.queryOrder.saveConfig(orderValue.value);
+    emits('query');
+  };
+
+</script>
+
+<style lang="less" scoped>
+</style>

orion-visor-ui/src/components/view/card-list/index.vue

@@ -80,12 +80,12 @@
 </script>
 
 <script lang="ts" setup>
+  import type { CardProps } from './types/props';
+  import { Emitter } from './types/emits';
+  import useEmitter from '@/hooks/emitter';
   import CreateCard from './components/create-card.vue';
   import CardHeader from './components/card-header.vue';
   import CardItem from './components/card-item.vue';
-  import { Emitter } from './types/emits';
-  import { CardProps } from './types/props';
-  import useEmitter from '@/hooks/emitter';
 
   const props = withDefaults(defineProps<CardProps>(), {
     rowKey: 'id',

orion-visor-ui/src/components/view/card-list/types/props.ts

@@ -1,5 +1,7 @@
 import type { CSSProperties } from 'vue';
 import type { PaginationProps, ResponsiveValue } from '@arco-design/web-vue';
+import type { CardFieldsHook } from '@/hooks/card';
+import type { QueryOrderData } from '@/hooks/query-order';
 import type { CardFieldConfig, CardPosition, CardRecord, ColResponsiveValue, HandleVisible } from '@/types/card';
 
 // 卡片属性
@@ -19,7 +21,9 @@ export interface CardProps {
   createCardDescription?: string;
   createCardPosition?: CardPosition;
   addPermission?: Array<string>;
-  cardLayoutGutter?: Number | ResponsiveValue | Array<Number> | Array<ResponsiveValue>;
+  fieldsHook?: CardFieldsHook;
+  queryOrder?: QueryOrderData;
+  cardLayoutGutter?: number | ResponsiveValue | Array<number> | Array<ResponsiveValue>;
   cardLayoutCols?: ColResponsiveValue;
   handleVisible?: HandleVisible;
   list?: Array<CardRecord>;

orion-visor-ui/src/hooks/card.ts

@@ -1,10 +1,31 @@
+import type { Ref } from 'vue';
+import { reactive, ref } from 'vue';
 import type { PaginationProps } from '@arco-design/web-vue';
-import type { ColResponsiveValue } from '@/types/card';
+import type { ColResponsiveValue, CardFieldConfig, CardField } from '@/types/card';
-import { reactive } from 'vue';
 import { isNumber } from '@/utils/is';
 import { useAppStore } from '@/store';
 import { CardPageSizeOptions } from '@/types/const';
 
+// 卡片显示字段 key
+const CardFieldsKey = 'card-fields';
+
+/**
+ * 卡片字段配置数据
+ */
+export interface CardFieldConfigData {
+  cardFieldConfig: Ref<CardFieldConfig>;
+  fieldsHook: CardFieldsHook;
+}
+
+/**
+ * 卡片字段配置操作
+ */
+export interface CardFieldsHook {
+  originFields: Array<CardField>;
+  getConfig: () => Array<string>;
+  saveConfig: (config: Array<string> | undefined) => void;
+}
+
 /**
  * 创建卡片列表列布局
  */
@@ -33,3 +54,71 @@ export const useCardPagination = (): PaginationProps => {
     pageSizeOptions: CardPageSizeOptions
   });
 };
+
+/**
+ * 使用卡片字段配置
+ */
+export const useCardFieldConfig = (table: string, originFieldConfig: CardFieldConfig): CardFieldConfigData => {
+  const cardFieldConfig = ref(originFieldConfig);
+
+  // 获取配置
+  const getConfig = () => {
+    // 查询缓存
+    let preferConfig: Record<string, string[]> = {};
+    const localConfig = localStorage.getItem(CardFieldsKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 解析配置
+    const preferValue = preferConfig[table];
+    if (preferValue?.length) {
+      // 配置值
+      return preferValue;
+    } else {
+      // 默认值
+      return originFieldConfig.fields.filter(s => s.default).map(s => (s.dataIndex || s.slotName) as string);
+    }
+  };
+
+  // 保存配置
+  const saveConfig = (config: Array<string> | undefined) => {
+    // 查询缓存
+    let preferConfig: Record<string, string[] | undefined> = {};
+    const localConfig = localStorage.getItem(CardFieldsKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 设置缓存
+    preferConfig[table] = config;
+    localStorage.setItem(CardFieldsKey, JSON.stringify(preferConfig));
+    // 刷新
+    refresh();
+  };
+
+  // 刷新
+  const refresh = () => {
+    const preferConfig = getConfig();
+    cardFieldConfig.value = {
+      ...originFieldConfig,
+      fields: originFieldConfig.fields.filter(s => preferConfig.includes((s.dataIndex || s.slotName) as string)),
+    };
+  };
+
+  // 初始化
+  refresh();
+
+  return {
+    cardFieldConfig,
+    fieldsHook: {
+      originFields: originFieldConfig.fields,
+      getConfig,
+      saveConfig,
+    }
+  };
+};

orion-visor-ui/src/hooks/query-order.ts

@@ -0,0 +1,75 @@
+import type { Ref } from 'vue';
+import { ref } from 'vue';
+import type { OrderDirection } from '@/types/global';
+
+// 查询排序 key
+const QueryOrderKey = 'query-order';
+
+// 排序
+export const DESC = 0;
+export const ASC = 1;
+
+/**
+ * 查询排序数据
+ */
+export interface QueryOrderData {
+  order: Ref<number>;
+  markOrderly: <T extends OrderDirection>(request: T) => T;
+  saveConfig: (sort: number) => void;
+}
+
+/**
+ * 使用查询排序
+ */
+export const useQueryOrder = (table: string, defaultSort: number = ASC): QueryOrderData => {
+  const order = ref(defaultSort);
+
+  // 刷新配置
+  const refresh = () => {
+    // 查询缓存
+    let preferConfig: Record<string, string> = {};
+    const localConfig = localStorage.getItem(QueryOrderKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 解析配置
+    const preferValue = Number.parseInt(preferConfig[table]);
+    if (preferValue) {
+      order.value = preferValue;
+    }
+  };
+
+  const markOrderly = <T extends OrderDirection>(request: T) => {
+    request.order = order.value;
+    return request;
+  };
+
+  // 保存配置
+  const saveConfig = (s: number) => {
+    order.value = s;
+    // 查询缓存
+    let preferConfig: Record<string, any> = {};
+    const localConfig = localStorage.getItem(QueryOrderKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 设置缓存
+    preferConfig[table] = s;
+    localStorage.setItem(QueryOrderKey, JSON.stringify(preferConfig));
+  };
+
+  // 初始化
+  refresh();
+
+  return {
+    order,
+    markOrderly,
+    saveConfig,
+  };
+};

orion-visor-ui/src/hooks/table.ts

@@ -1,9 +1,29 @@
-import type { PaginationProps, TableExpandable, TableRowSelection } from '@arco-design/web-vue';
+import type { PaginationProps, TableColumnData, TableExpandable, TableRowSelection } from '@arco-design/web-vue';
-import { reactive } from 'vue';
+import type { Ref } from 'vue';
+import { reactive, ref } from 'vue';
 import { useAppStore } from '@/store';
 import { isNumber } from '@/utils/is';
 import { TablePageSizeOptions } from '@/types/const';
 
+// 表格显示列 key
+const TableColumnsKey = 'table-columns';
+
+/**
+ * 表格列数据
+ */
+export interface TableColumnsData {
+  tableColumns: Ref<TableColumnData[]>;
+  columnsHook: TableColumnsHook;
+}
+
+/**
+ * 表格列操作
+ */
+export interface TableColumnsHook {
+  getConfig: () => Array<string>;
+  saveConfig: (config: Array<string> | undefined) => void;
+}
+
 /**
  * 创建列表分页
  */
@@ -42,3 +62,67 @@ export const useExpandable = (ext?: TableExpandable): TableExpandable => {
     ...ext
   });
 };
+
+/**
+ * 使用表格列
+ */
+export const useTableColumns = (table: string, originColumns: Array<TableColumnData>): TableColumnsData => {
+  const tableColumns = ref(originColumns);
+
+  // 获取配置
+  const getConfig = () => {
+    // 查询缓存
+    let preferConfig: Record<string, string[]> = {};
+    const localConfig = localStorage.getItem(TableColumnsKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 解析配置
+    const preferValue = preferConfig[table];
+    if (preferValue?.length) {
+      // 配置值
+      return preferValue;
+    } else {
+      // 默认值
+      return originColumns.filter(s => s.default).map(s => (s.dataIndex || s.slotName) as string);
+    }
+  };
+
+  // 保存配置
+  const saveConfig = (config: Array<string> | undefined) => {
+    // 查询缓存
+    let preferConfig: Record<string, string[] | undefined> = {};
+    const localConfig = localStorage.getItem(TableColumnsKey);
+    if (localConfig) {
+      try {
+        preferConfig = JSON.parse(localConfig as string);
+      } catch (e) {
+      }
+    }
+    // 设置缓存
+    preferConfig[table] = config;
+    localStorage.setItem(TableColumnsKey, JSON.stringify(preferConfig));
+    // 刷新
+    refresh();
+  };
+
+  // 刷新
+  const refresh = () => {
+    const preferConfig = getConfig();
+    tableColumns.value = originColumns.filter(s => preferConfig.includes((s.dataIndex || s.slotName) as string));
+  };
+
+  // 初始化
+  refresh();
+
+  return {
+    tableColumns,
+    columnsHook: {
+      getConfig,
+      saveConfig,
+    }
+  };
+};

orion-visor-ui/src/types/arco.d.ts

@@ -1,7 +1,11 @@
-import type { TreeNodeData } from '@arco-design/web-vue';
+import type { TableColumnData, TreeNodeData } from '@arco-design/web-vue';
 import type { NodeData } from './global';
 
 declare module '@arco-design/web-vue' {
   export interface TreeNodeData extends TreeNodeData, NodeData {
   }
+
+  export interface TableColumnData extends TableColumnData {
+    default?: boolean;
+  }
 }

orion-visor-ui/src/types/card.ts

@@ -50,6 +50,7 @@ export interface CardField {
   valueClass?: string;
   ellipsis?: boolean;
   tooltip?: boolean;
+  default: boolean;
   render?: (data: {
     record: CardRecord;
     index: number;

orion-visor-ui/src/types/global.ts

@@ -31,6 +31,10 @@ export interface PostData {
   url: string;
 }
 
+export interface OrderDirection {
+  order?: number;
+}
+
 export interface Pagination {
   page?: number;
   limit?: number;

orion-visor-ui/src/views/user/info/components/user-operator-log.vue

@@ -35,12 +35,12 @@
 
 <script lang="ts" setup>
   import type { UserQueryResponse } from '@/api/user/user';
+  import type { OperatorLogQueryRequest } from '@/api/user/operator-log';
   import { ref, reactive, onBeforeMount } from 'vue';
   import { useCacheStore, useDictStore } from '@/store';
   import { dictKeys } from '@/views/user/operator-log/types/const';
   import OperatorLogQueryHeader from '@/views/user/operator-log/components/operator-log-query-header.vue';
   import OperatorLogSimpleTable from '@/views/user/operator-log/components/operator-log-simple-table.vue';
-  import { OperatorLogQueryRequest } from '@/api/user/operator-log';
 
   const props = defineProps<{
     user?: UserQueryResponse;