🔨 排序字段.

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 { reactive } from 'vue';
+import type { ColResponsiveValue, CardFieldConfig, CardField } from '@/types/card';
 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 { reactive } from 'vue';
+import type { PaginationProps, TableColumnData, TableExpandable, TableRowSelection } from '@arco-design/web-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,
+    }
+  };
+};