@yidun/antd-super-table 0.0.1

package/dist/components/VNodes.d.ts

@@ -0,0 +1,12 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    vnodes: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    vnodes: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/config.d.ts

@@ -0,0 +1,37 @@
+import { SuperTableColumnType, SuperTableFormItemType } from './typings';
+/** antd 主题配置 */
+export declare const antdSeedToken: import("ant-design-vue/es/theme/interface").MapToken;
+/** 查询项内置的一些字段 */
+export declare enum ReadonlyFormItemKeysEnum {
+    /** 排序 */
+    order = "_order",
+    /** 在查询条件中的排序 */
+    orderInScene = "_orderInScene",
+    /** 默认值 */
+    defaultValue = "_defaultValue",
+    /** 是否选中 */
+    selected = "_selected"
+}
+export declare const ReadonlyFormItemKeys: string[];
+/** 表格列对应的类型 */
+export declare const SuperTableColumnTypeEnum: Record<string, SuperTableColumnType>;
+/** 查询条件类型 */
+export declare const SuperTableFormItemTypeEnum: Record<string, SuperTableFormItemType>;
+/** 场景弹窗操作类型 */
+export declare const SceneModalActionTypeEnum: {
+    /** 新增 */
+    create: string;
+    /** 更新 */
+    update: string;
+    /** 设置查询条件 */
+    search: string;
+};
+/** 本地缓存需要保存的列配置字段 */
+export declare const cacheColumnKeys: string[];
+/** 场景管理接口地址 */
+export declare const sceneApiUrls: {
+    query: string;
+    create: string;
+    update: string;
+    delete: string;
+};

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+import SuperTable from './SuperTable.vue';
+export default SuperTable;
+export { SuperTableColumnTypeEnum, SuperTableFormItemTypeEnum } from './config';
+declare module 'vue' {
+    interface GlobalComponents {
+        SuperTable: typeof SuperTable;
+    }
+}

package/dist/typings.d.ts

@@ -0,0 +1,253 @@
+import type { SelectProps, TableProps, PaginationProps } from 'ant-design-vue'
+import type { Component, Reactive, Ref } from 'vue'
+
+/** 表格列对应的type类型 */
+export type SuperTableColumnType =
+  | 'text'
+  | 'link'
+  | 'button'
+  | 'tag'
+  | 'image'
+  | 'component'
+  | 'sort'
+
+/** 查询表单项对应的type类型 */
+export type SuperTableFormItemType =
+  | 'input'
+  | 'inputGroup'
+  | 'inputNumber'
+  | 'inputNumberRange'
+  | 'select'
+  | 'treeSelect'
+  | 'cascader'
+  | 'datePicker'
+  | 'rangePicker'
+  | 'component'
+
+/* 查询条件配置 */
+export interface SuperTableFormItem {
+  /** 查询详类型 */
+  type: SuperTableFormItemType
+
+  /** 查询项对应的字段名称 */
+  name: string
+
+  /** 绑定数据时v-model对应的name，默认value */
+  modelPropName?: string
+
+  /** 查询项label */
+  label: string
+
+  /** 传递给查询详的props */
+  props?: Record<string, any>
+
+  /** 选项值 */
+  value?: any
+
+  /** 自定义组件 */
+  component?: Component
+
+  /** 查询项宽度系数 */
+  span?: number
+
+  /** 是否显示 */
+  visible?: boolean
+
+  /** 带select前缀的组合输入框配置 */
+  addonBeforeProps?: SelectProps
+
+  /** 改变时保持静默，不要触发搜索*/
+  quiet?: boolean
+
+  /** 是否展示label，默认展示 */
+  showLabel?: boolean
+
+  /** 固定选项，不允许删除，高级搜索时一定会默认展示 */
+  fixed?: boolean
+
+  /**
+   * 默认选中，开启后表现为
+   * 1. 高级搜索弹窗打开时会默认选中对应的搜索项
+   * 2. 没有配置默认场景时，会根据选中的项目生成一个默认场景 */
+  selected?: boolean
+
+  // 以下为内置属性，不允许修改
+
+  /** 默认值 */
+  _defaultValue?: any
+
+  /** 排序 */
+  _order?: number
+
+  /** 是否选中 */
+  _selected?: boolean
+
+  /** 在选中场景中的排序 */
+  _orderInScene?: number
+
+  [key: string]: any
+}
+
+/** 表格单条数据 */
+export type TableDataItem = Record<string, any>
+
+/** 表格列吸附方式 */
+export type TableColumnFixedType = 'left' | 'right'
+
+/** 排序方式 */
+export type SortOrders = 'ascending' | 'descending' | null
+
+/** 表格表头配置 */
+export interface SuperTableColumn {
+  /** 列对应key */
+  key: string
+
+  /** 展示类型 text: 文本 button: 按钮 link: 链接 tag: 标签 component：自定义组件 */
+  type?: SuperTableColumnType | ((row: TableDataItem, index: number) => SuperTableColumnType)
+
+  /** 标题 */
+  title: string
+
+  /** 标题对应的提示信息 */
+  titleTooltip?: string | ((row: TableDataItem, index: number) => string)
+
+  /** 表格内容 */
+  content?: string | ((row: TableDataItem, index: number) => any)
+
+  /** 表格内容对应的提示信息 */
+  tooltip?: string | boolean | ((row: TableDataItem, index: number) => string)
+
+  /** 表格内容解析自定义组件 */
+  component?: Component
+
+  /** 表格内容解析用到的组件组件对应的props */
+  props?: Record<string, any> | ((row: TableDataItem, index: number) => Record<string, any>)
+
+  /** 是否可复制 */
+  copyable?: boolean
+
+  /** 是否超出显示省略号 */
+  ellipsis?: boolean
+
+  /** 是否可见 */
+  visible?: boolean
+
+  /** 宽度 */
+  width?: number
+
+  [key: string]: any
+}
+
+/**
+ * 查询场景 https://docs.popo.netease.com/lingxi/1f2fdcb62291477f8056457f63fa3fcd?appVersion=4.15.0&deviceType=4&popo_hidenativebar=1&popo_noindicator=1&disposable_login_token=1
+ * */
+export interface SuperTableQueryScene {
+  /** 场景唯一标识 */
+  code: string
+
+  /** 场景名称 */
+  name: string
+
+  /** 配置类型 */
+  type?: string
+
+  /** 配置详情 */
+  value?: string
+
+  /** 查询项列表 */
+  items: SuperTableQuerySceneItem[]
+
+  /** 是否是私有配置 */
+  asPrivate?: boolean
+
+  /** 是否是自定义场景 */
+  isCustom?: boolean
+}
+
+/** 场景中保存的查询条件配置 */
+export interface SuperTableQuerySceneItem {
+  /** 字段名称 */
+  name: string
+
+  /** 字段类型 */
+  type: string
+
+  /** 字段值 */
+  value: any
+}
+
+/** 默认场景配置 */
+export interface DefaultSceneConfig {
+  /** 场景名称 */
+  name?: string
+
+  /** 场景唯一表示，多个自定义场景时必填 */
+  code?: string
+
+  /** 查询项列表 */
+  items: {
+    /** 字段名称 */
+    name: string
+    /** 字段值 */
+    value: any
+  }[]
+}
+
+/** 场景状态 */
+export interface SuperTableSceneState {
+  /** 查询场景列表 */
+  list: SuperTableQueryScene[]
+
+  /** 是否正在加载场景 */
+  loading: boolean
+
+  /** 是否正在保存场景 */
+  submiting: boolean
+
+  /** 是否已经加载过场景 */
+  loaded: boolean
+}
+
+/** 提供给弹窗使用的表格全局状态 */
+export interface SuperTableContext {
+  /** 场景类型 */
+  sceneType: string
+
+  /** 场景状态 */
+  sceneState: Reactive<SuperTableSceneState>
+
+  /** 查询场景 */
+  queryScene(): void
+
+  /** 新增/更新场景 */
+  updateScene(scene: SuperTableQueryScene | SuperTableQueryScene[]): void
+
+  /** 删除场景 */
+  deleteScene(sceneCode: string): void
+
+  /** 当前生效中的查询参数 */
+  selectedFormItems: SuperTableQuerySceneItem[]
+
+  /** 禁用添加场景功能 */
+  allowCreateScene: Ref<boolean>
+}
+
+/** 数据请求方法 */
+export type PropTableRequestFunction = (options: {
+  /** 查询参数 */
+  params: Record<string, any>
+
+  /** 分页大小 */
+  pageSize?: number
+
+  /** 当前页码 */
+  pageNum?: number
+
+  [key: string]: any
+}) => Promise<{ total: number; data: Record<string, any>[] }>
+
+export interface AntdTableProps extends TableProps {
+  pagination: PaginationProps
+  columns: SuperTableColumn[]
+  dataSource: Record<string, any>[]
+}

package/dist/utils/dialogManager.d.ts

@@ -0,0 +1,17 @@
+import { ComponentOptions } from 'vue';
+import 'dayjs/locale/zh-cn';
+declare class DialogManager {
+    currents: any[];
+    dialogs: any;
+    staticDialogs: any;
+    rootVm: any;
+    constructor(staticDialogs?: {});
+    setRootVm(rootVm: any): void;
+    register(name: string, componentOptions: ComponentOptions): void;
+    unregister(name: string): void;
+    open(name: string, options: any): import("vue").App<Element> | undefined;
+    close(): void;
+    destroy(): void;
+}
+declare const dialogManager: DialogManager;
+export default dialogManager;

package/dist/utils/index.d.ts

@@ -0,0 +1,113 @@
+import type { SuperTableColumn, SuperTableFormItem, SuperTableQueryScene } from '../typings';
+/**
+ * 获取数据类型
+ * @param value - 需要获取类型的值
+ * @returns 类型名称（小写）
+ */
+export declare const getDataType: (value: any) => string;
+/**
+ * @description 初始化表单项配置项列表
+ * @param { SuperTableFormItem [] } formItems 表单项配置
+ * @returns SuperTableFormItem []
+ * */
+export declare const initFormItems: (formItems: SuperTableFormItem[]) => {
+    props: Record<string, any>;
+    visible: boolean;
+    _order: number;
+    _defaultValue: any;
+    type: import("../typings").SuperTableFormItemType;
+    name: string;
+    modelPropName?: string;
+    label: string;
+    value?: any;
+    component?: import("vue").Component;
+    span?: number;
+    addonBeforeProps?: import("ant-design-vue").SelectProps;
+    quiet?: boolean;
+    showLabel?: boolean;
+    fixed?: boolean;
+    selected?: boolean;
+    _selected?: boolean;
+    _orderInScene?: number;
+}[];
+/**
+ * 初始化表格列配置项列表
+ * @param columns - 表格列配置
+ * @returns 初始化后的表格列列表
+ */
+export declare const initTableColumns: (columns: SuperTableColumn[]) => {
+    dataIndex: string | undefined;
+    width: number;
+    visible: boolean;
+    resizable: any;
+    ellipsis: boolean;
+    component: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | undefined;
+    index: number;
+    key: string;
+    type?: import("../typings").SuperTableColumnType | ((row: import("../typings").TableDataItem, index: number) => import("../typings").SuperTableColumnType);
+    title: string;
+    titleTooltip?: string | ((row: import("../typings").TableDataItem, index: number) => string);
+    content?: string | ((row: import("../typings").TableDataItem, index: number) => any);
+    tooltip?: string | boolean | ((row: import("../typings").TableDataItem, index: number) => string);
+    props?: Record<string, any> | ((row: import("../typings").TableDataItem, index: number) => Record<string, any>);
+    copyable?: boolean;
+}[];
+/**
+ * 格式化场景配置项数据
+ * @param sceneList - 场景配置项
+ * @param formConfigMap - 表单项配置列表
+ * @param sortCodes - 排序码数组
+ * @returns 格式化后的场景数据
+ */
+export declare const formatSceneData: (sceneList: SuperTableQueryScene[], formConfigMap: Record<string, SuperTableFormItem>, sortCodes: string[]) => SuperTableQueryScene[];
+/**
+ * 错误提示信息
+ * @param args - 需要打印的参数
+ */
+export declare function logError(...args: any[]): void;
+/**
+ * 校验表单项配置
+ * @param formItems - 表单项配置
+ */
+export declare const validateFormItems: (formItems: SuperTableFormItem[]) => void;
+/**
+ * 校验表格列配置
+ * @param columns - 表格列配置
+ */
+export declare const validateTableColumns: (columns: SuperTableColumn[]) => void;
+/**
+ * 获取文本的宽度
+ * @param text - 文本内容
+ * @param font - 字体设置（包含字号、字体等信息）
+ * @returns 文本宽度（像素）
+ */
+export declare const getTextWidth: (text: string, font?: {
+    fontSize?: number;
+    fontFamily?: string;
+    fontWeight?: number;
+}) => number;
+/**
+ * 安全解析 JSON 字符串
+ * @param jsonString - 需要解析的 JSON 字符串
+ * @param defaultVal - 解析失败时的默认值
+ * @returns 解析后的值或默认值
+ */
+export declare const parseJsonSafe: <T = Record<string, any>>(jsonString: string, defaultVal: T) => T;
+/**
+ * @description 生成固定输出的32位字符串ID
+ * @param {string} input - 需要生成唯一id的值
+ * @returns {string} 唯一id
+ * */
+export declare const generateID: (input: string) => string;
+/**
+ * 获取指定名称的 cookie 值
+ * @param {string} sKey - cookie 的键名
+ * @returns {string} cookie 的值，如果不存在则返回空字符串
+ * @example
+ * ```ts
+ * const token = getCookie('token');
+ * ```
+ */
+export declare const getCookie: (sKey: string) => string;

package/dist/utils/service.d.ts

@@ -0,0 +1,63 @@
+import type { SuperTableQueryScene } from '../typings';
+/**
+ * 接口响应数据结构
+ */
+interface IResponse {
+    /** 状态码 */
+    code: number;
+    /** 响应数据 */
+    data: any;
+    /** 响应消息 */
+    msg: string;
+}
+/**
+ * 本地存储策略配置选项
+ */
+interface LocalStorageConfig {
+    /** 获取场景列表 */
+    getScenes: () => SuperTableQueryScene[];
+    /** 设置场景列表 */
+    setScenes: (newScenes: SuperTableQueryScene[]) => void;
+}
+/**
+ * API存储策略配置选项
+ */
+interface ApiStorageConfig {
+    /** API地址配置 */
+    sceneRequestUrls?: {
+        query: string;
+        create: string;
+        update: string;
+        delete: string;
+    };
+}
+/**
+ * 本地存储场景服务
+ */
+export declare const localStorageSceneService: (config: LocalStorageConfig) => {
+    querySceneList: (params: {
+        type: string;
+    }) => Promise<IResponse>;
+    createScene: (params: any) => Promise<IResponse>;
+    updateScene: (params: any) => Promise<IResponse>;
+    deleteScene: (params: string[]) => Promise<IResponse>;
+};
+/**
+ * API存储场景服务
+ */
+export declare const apiSceneService: (config?: ApiStorageConfig) => {
+    querySceneList: (params: {
+        type: string;
+    }) => Promise<IResponse>;
+    createScene: (params: any) => Promise<IResponse>;
+    updateScene: (params: any) => Promise<IResponse>;
+    deleteScene: (params: string[]) => Promise<IResponse>;
+};
+/** 不启用场景时，返回的场景服务 */
+export declare const disabledSceneService: () => {
+    querySceneList: () => Promise<IResponse>;
+    createScene: () => Promise<IResponse>;
+    updateScene: () => Promise<IResponse>;
+    deleteScene: () => Promise<IResponse>;
+};
+export {};

package/dist/utils/useDialog.d.ts

@@ -0,0 +1,15 @@
+import { defineComponent } from 'vue';
+/**
+ * 用于管理对话框组件的组合式函数
+ * @param {ReturnType<typeof defineComponent>} vm - Vue 组件实例
+ * @param {any} [config] - 对话框的可选配置对象
+ * @returns {Object} 包含对话框控制方法的对象
+ */
+export default function useDialog(vm: ReturnType<typeof defineComponent>, config?: any): {
+    open: () => void;
+    close: () => void;
+    openByConfig: (dialogConfig: {
+        props?: any;
+        [key: string]: any;
+    }) => void;
+};

package/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "@yidun/antd-super-table",
+  "version": "0.0.1",
+  "description": "基于 Ant Design Vue 的高级表格组件，提供丰富的查询条件配置、表格列配置和场景管理功能",
+  "keywords": ["vue", "ant-design-vue", "table", "super-table", "typescript"],
+  "author": "Yidun",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/antd-super-table.es.js",
+  "module": "./dist/antd-super-table.es.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build --mode lib && tsc --emitDeclarationOnly && cp src/typings.d.ts dist/",
+    "preview": "vite preview",
+    "tsc": "tsc --noEmit --project tsconfig.json",
+    "lint": "eslint src --fix",
+    "format": "prettier --write src/"
+  },
+  "dependencies": {
+    "@ant-design/icons-vue": "^7.0.1",
+    "@vueuse/core": "^13.1.0",
+    "ant-design-vue": "^4.2.6",
+    "dayjs": "^1.11.13",
+    "jsonpath-plus": "^10.3.0",
+    "lodash-es": "^4.17.21",
+    "sortablejs": "^1.15.6",
+    "uuid": "^11.1.0",
+    "vue": "^3.5.13",
+    "vuedraggable": "^4.0.1"
+  },
+  "devDependencies": {
+    "@tsconfig/node22": "^22.0.1",
+    "@types/lodash-es": "^4.17.12",
+    "@types/node": "^22.14.0",
+    "@types/sortablejs": "^1.15.8",
+    "@types/spark-md5": "^3.0.5",
+    "@vitejs/plugin-vue": "^5.2.3",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/eslint-config-typescript": "^14.5.0",
+    "@vue/tsconfig": "^0.7.0",
+    "eslint": "^9.22.0",
+    "eslint-plugin-prettier": "^5.2.6",
+    "eslint-plugin-vue": "~10.0.0",
+    "jiti": "^2.4.2",
+    "mockjs": "^1.1.0",
+    "npm-run-all2": "^7.0.2",
+    "prettier": "^3.5.3",
+    "sass": "^1.87.0",
+    "typescript": "~5.8.0",
+    "vite": "^6.2.4",
+    "vite-plugin-vue-devtools": "^7.7.2",
+    "vue-tsc": "^2.2.8"
+  }
+}