@yidun/antd-super-table 0.0.7 → 0.0.8

package/dist/typings.ts

@@ -1,10 +1,16 @@
 import type { SelectProps, TableProps, PaginationProps } from 'ant-design-vue'
 import type { Component, Reactive, Ref } from 'vue'
 
-/** 表格列对应的type类型 */
+/**
+ * 表格列对应的类型枚举
+ * @public
+ */
 export type SuperTableColumnType = 'text' | 'link' | 'button' | 'tag' | 'image' | 'component' | 'sort'
 
-/** 查询表单项对应的type类型 */
+/**
+ * 查询表单项对应的类型枚举
+ * @public
+ */
 export type SuperTableFormItemType =
   | 'input'
   | 'inputGroup'
@@ -17,21 +23,48 @@ export type SuperTableFormItemType =
   | 'rangePicker'
   | 'component'
 
-/* 查询条件配置 */
+/**
+ * 表格列吸附方式类型
+ * @public
+ */
+export type SuperTableColumnFixedType = 'left' | 'right' | false
+
+/**
+ * 排序方式类型
+ * @public
+ */
+export type SuperTableSortOrders = 'ascend' | 'descend' | null
+
+/**
+ * 场景存储类型
+ * @public
+ */
+export type SuperTableSceneStorageType = 'local' | 'api'
+
+/**
+ * 表格数据项类型
+ * @public
+ */
+export type SuperTableDataItem = Record<string, any>
+
+/**
+ * 查询条件配置接口
+ * @public
+ */
 export interface SuperTableFormItem {
-  /** 查询详类型 */
+  /** 查询项类型 */
   type: SuperTableFormItemType
 
   /** 查询项对应的字段名称 */
   name: string
 
-  /** 绑定数据时v-model对应的name，默认value */
+  /** 绑定数据时v-model对应的name，默认为value */
   modelPropName?: string
 
-  /** 查询项label */
+  /** 查询项标签 */
   label: string
 
-  /** 传递给查询详的props */
+  /** 传递给查询项的props */
   props?: Record<string, any>
 
   /** 选项值 */
@@ -49,7 +82,7 @@ export interface SuperTableFormItem {
   /** 带select前缀的组合输入框配置 */
   addonBeforeProps?: SelectProps
 
-  /** 改变时保持静默，不要触发搜索*/
+  /** 改变时保持静默，不要触发搜索 */
   quiet?: boolean
 
   /** 是否展示label，默认展示 */
@@ -59,12 +92,13 @@ export interface SuperTableFormItem {
   fixed?: boolean
 
   /**
-   * 默认选中，开启后表现为
+   * 默认选中，开启后表现为：
    * 1. 高级搜索弹窗打开时会默认选中对应的搜索项
-   * 2. 没有配置默认场景时，会根据选中的项目生成一个默认场景 */
+   * 2. 没有配置默认场景时，会根据选中的项目生成一个默认场景
+   */
   selected?: boolean
 
-  // 以下为内置属性，不允许修改
+  /** @internal 以下为内置属性，不允许修改 */
 
   /** 默认值 */
   _defaultValue?: any
@@ -81,40 +115,34 @@ export interface SuperTableFormItem {
   [key: string]: any
 }
 
-/** 表格单条数据 */
-export type TableDataItem = Record<string, any>
-
-/** 表格列吸附方式 */
-export type TableColumnFixedType = 'left' | 'right'
-
-/** 排序方式 */
-export type SortOrders = 'ascending' | 'descending' | null
-
-/** 表格表头配置 */
+/**
+ * 表格列配置接口
+ * @public
+ */
 export interface SuperTableColumn {
-  /** 列对应key */
+  /** 列对应的key */
   key: string
 
-  /** 展示类型 text: 文本 button: 按钮 link: 链接 tag: 标签 component：自定义组件 */
-  type?: SuperTableColumnType | ((row: TableDataItem, index: number) => SuperTableColumnType)
+  /** 展示类型：text-文本，button-按钮，link-链接，tag-标签，component-自定义组件 */
+  type?: SuperTableColumnType | ((row: SuperTableDataItem, index: number) => SuperTableColumnType)
 
   /** 标题 */
   title: string
 
   /** 标题对应的提示信息 */
-  titleTooltip?: string | ((row: TableDataItem, index: number) => string)
+  titleTooltip?: string | ((row: SuperTableDataItem, index: number) => string)
 
   /** 表格内容 */
-  content?: string | ((row: TableDataItem, index: number) => any)
+  content?: string | ((row: SuperTableDataItem, index: number) => any)
 
   /** 表格内容对应的提示信息 */
-  tooltip?: string | boolean | ((row: TableDataItem, index: number) => string)
+  tooltip?: string | boolean | ((row: SuperTableDataItem, index: number) => string)
 
   /** 表格内容解析自定义组件 */
   component?: Component
 
-  /** 表格内容解析用到的组件组件对应的props */
-  props?: Record<string, any> | ((row: TableDataItem, index: number) => Record<string, any>)
+  /** 表格内容解析用到的组件对应的props */
+  props?: Record<string, any> | ((row: SuperTableDataItem, index: number) => Record<string, any>)
 
   /** 是否可复制 */
   copyable?: boolean
@@ -128,12 +156,40 @@ export interface SuperTableColumn {
   /** 宽度 */
   width?: number
 
+  /** 固定列位置 */
+  fixed?: SuperTableColumnFixedType
+
+  /** 排序 */
+  sorter?: boolean | ((a: SuperTableDataItem, b: SuperTableDataItem) => number)
+
+  /** 默认排序 */
+  defaultSortOrder?: SuperTableSortOrders
+
+  /** 列索引 */
+  index?: 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
- * */
+ * 场景中保存的查询条件配置接口
+ * @public
+ */
+export interface SuperTableQuerySceneItem {
+  /** 字段名称 */
+  name: string
+
+  /** 字段类型 */
+  type: SuperTableFormItemType
+
+  /** 字段值 */
+  value: any
+}
+
+/**
+ * 查询场景接口
+ * @public
+ */
 export interface SuperTableQueryScene {
   /** 场景唯一标识 */
   code: string
@@ -157,24 +213,15 @@ export interface SuperTableQueryScene {
   isCustom?: boolean
 }
 
-/** 场景中保存的查询条件配置 */
-export interface SuperTableQuerySceneItem {
-  /** 字段名称 */
-  name: string
-
-  /** 字段类型 */
-  type: string
-
-  /** 字段值 */
-  value: any
-}
-
-/** 默认场景配置 */
-export interface DefaultSceneConfig {
+/**
+ * 默认场景配置接口
+ * @public
+ */
+export interface SuperTableDefaultSceneConfig {
   /** 场景名称 */
   name?: string
 
-  /** 场景唯一表示，多个自定义场景时必填 */
+  /** 场景唯一标识，多个自定义场景时必填 */
   code?: string
 
   /** 查询项列表 */
@@ -186,7 +233,10 @@ export interface DefaultSceneConfig {
   }[]
 }
 
-/** 场景状态 */
+/**
+ * 场景状态接口
+ * @public
+ */
 export interface SuperTableSceneState {
   /** 查询场景列表 */
   list: SuperTableQueryScene[]
@@ -201,7 +251,10 @@ export interface SuperTableSceneState {
   loaded: boolean
 }
 
-/** 提供给弹窗使用的表格全局状态 */
+/**
+ * 提供给弹窗使用的表格全局状态接口
+ * @public
+ */
 export interface SuperTableContext {
   /** 场景类型 */
   sceneType: string
@@ -225,8 +278,35 @@ export interface SuperTableContext {
   allowCreateScene: Ref<boolean>
 }
 
-/** 数据请求方法 */
-export type PropTableRequestFunction = (options: {
+/**
+ * 场景请求配置接口
+ * @public
+ */
+export interface SuperTableSceneRequestConfig {
+  /** 查询场景列表 */
+  querySceneList: (params: { type: string }) => Promise<{ code: number; data: SuperTableQueryScene[]; msg: string }>
+  /** 创建场景 */
+  createScene: (params: {
+    type: string
+    name: string
+    value: string
+    asPrivate?: boolean
+  }) => Promise<{ code: number; data: string; msg: string }>
+  /** 更新场景 */
+  updateScene: (params: {
+    code: string
+    name: string
+    value: string
+  }) => Promise<{ code: number; msg: string }>
+  /** 删除场景 */
+  deleteScene: (params: string[]) => Promise<{ code: number; msg: string }>
+}
+
+/**
+ * 数据请求方法类型
+ * @public
+ */
+export type SuperTableRequestFunction = (options: {
   /** 查询参数 */
   params: Record<string, any>
 
@@ -239,80 +319,113 @@ export type PropTableRequestFunction = (options: {
   [key: string]: any
 }) => Promise<{ total: number; data: Record<string, any>[] }>
 
-export interface AntdTableProps extends TableProps {
+/**
+ * Antd表格属性扩展接口
+ * @public
+ */
+export interface SuperTableAntdProps extends Omit<TableProps, 'columns' | 'dataSource' | 'pagination'> {
   pagination: PaginationProps
   columns: SuperTableColumn[]
-  dataSource: Record<string, any>[]
+  dataSource: SuperTableDataItem[]
 }
 
-/** 表单操作方法接口 */
-export interface FormOperations {
+/**
+ * 表单操作方法接口
+ * @public
+ */
+export interface SuperTableFormOperations {
   /**
    * 获取表单项配置
-   * @param {string} name - 表单项名称
-   * @returns {SuperTableFormItem | undefined} 表单项配置
+   * @param name - 表单项名称
+   * @returns 表单项配置
    */
   getFormItem(name: string): SuperTableFormItem | undefined
 
   /**
    * 设置表单项配置
-   * @param {string} name - 表单项名称
-   * @param {string} keyPath - 配置路径
-   * @param {any} newConfig - 新的配置值
-   * @returns {void}
+   * @param name - 表单项名称
+   * @param keyPath - 配置路径
+   * @param newConfig - 新的配置值
    */
   setFormItem(name: string, keyPath: string, newConfig: any): void
 
   /**
    * 获取表单值
-   * @param {string | string[]} [name] - 表单项名称或名称数组，不传则获取所有值
-   * @returns {Record<string, any>} 表单值对象
+   * @param name - 表单项名称或名称数组，不传则获取所有值
+   * @returns 表单值对象
    */
   getFormValues(name?: string | string[]): Record<string, any>
 
   /**
    * 设置表单值
-   * @param {Record<string, any>} values - 要设置的表单值对象
-   * @returns {void}
+   * @param values - 要设置的表单值对象
    */
   setFormValues(values: Record<string, any>): void
 
   /**
    * 获取单个表单项值
-   * @param {string} name - 表单项名称
-   * @returns {any} 表单项值
+   * @param name - 表单项名称
+   * @returns 表单项值
    */
   getFormValue(name: string): any
 
   /**
    * 设置单个表单项值
-   * @param {string} name - 表单项名称
-   * @param {any} value - 要设置的值
-   * @returns {void}
+   * @param name - 表单项名称
+   * @param value - 要设置的值
    */
   setFormValue(name: string, value: any): void
 }
 
-/** 表格操作方法接口 */
-export interface TableOperations {
+/**
+ * 表格操作方法接口
+ * @public
+ */
+export interface SuperTableTableOperations {
   /**
    * 获取表格数据
-   * @returns {any[]} 表格数据数组
+   * @returns 表格数据数组
    */
-  getTableData(): any[]
+  getTableData(): SuperTableDataItem[]
 
   /**
    * 设置表格数据
-   * @param {any[]} data - 要设置的表格数据
-   * @returns {void}
+   * @param data - 要设置的表格数据
    */
-  setTableData(data: any[]): void
+  setTableData(data: SuperTableDataItem[]): void
 
   /**
    * 设置表格数据项
-   * @param {number} index - 数据项索引
-   * @param {Record<string, any>} data - 要设置的数据项
-   * @returns {void}
+   * @param index - 数据项索引
+   * @param data - 要设置的数据项
+   */
+  setTableDataItem(index: number, data: Partial<SuperTableDataItem>): void
+
+  /**
+   * 刷新表格数据
    */
-  setTableDataItem(index: number, data: Record<string, any>): void
+  onRefresh(): void
+}
+
+/**
+ * 组件实例类型
+ * @public
+ */
+export interface SuperTableSlots {
+  /** 场景选择器前面的插槽 */
+  sceneAddonBefore?: () => any
+  /** 场景选择器后面的插槽 */
+  sceneAddonAfter?: () => any
+  /** 额外内容插槽 */
+  extra?: () => any
+  /** 表格头部插槽 */
+  tableHead?: () => any
+  /** 工具栏额外按钮插槽 */
+  toolBarExtra?: () => any
+  /** 展开列标题插槽 */
+  expandColumnTitle?: () => any
+  /** 表格底部插槽 */
+  tableFoot?: () => any
+  /** 展开行内容插槽 */
+  expandedRowRender?: (props: { record: any }) => any
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yidun/antd-super-table",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "type": "module",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -14,7 +14,8 @@
     "build": "vite build --mode lib && tsc --emitDeclarationOnly && cp src/typings.ts dist/",
     "preview": "vite preview",
     "tsc": "tsc --noEmit --project tsconfig.json",
-    "lint": "eslint src --fix",
+    "lint": "eslint src --ext .js,.ts,.vue",
+    "lint:fix": "eslint src --fix",
     "format": "prettier --write src/"
   },
   "optionalDependencies": {

package/dist/typings.d.ts

@@ -1,233 +0,0 @@
-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>[];
-}
-/** 表单操作方法接口 */
-export interface FormOperations {
-    /**
-     * 获取表单项配置
-     * @param {string} name - 表单项名称
-     * @returns {SuperTableFormItem | undefined} 表单项配置
-     */
-    getFormItem(name: string): SuperTableFormItem | undefined;
-    /**
-     * 设置表单项配置
-     * @param {string} name - 表单项名称
-     * @param {string} keyPath - 配置路径
-     * @param {any} newConfig - 新的配置值
-     * @returns {void}
-     */
-    setFormItem(name: string, keyPath: string, newConfig: any): void;
-    /**
-     * 获取表单值
-     * @param {string | string[]} [name] - 表单项名称或名称数组，不传则获取所有值
-     * @returns {Record<string, any>} 表单值对象
-     */
-    getFormValues(name?: string | string[]): Record<string, any>;
-    /**
-     * 设置表单值
-     * @param {Record<string, any>} values - 要设置的表单值对象
-     * @returns {void}
-     */
-    setFormValues(values: Record<string, any>): void;
-    /**
-     * 获取单个表单项值
-     * @param {string} name - 表单项名称
-     * @returns {any} 表单项值
-     */
-    getFormValue(name: string): any;
-    /**
-     * 设置单个表单项值
-     * @param {string} name - 表单项名称
-     * @param {any} value - 要设置的值
-     * @returns {void}
-     */
-    setFormValue(name: string, value: any): void;
-}
-/** 表格操作方法接口 */
-export interface TableOperations {
-    /**
-     * 获取表格数据
-     * @returns {any[]} 表格数据数组
-     */
-    getTableData(): any[];
-    /**
-     * 设置表格数据
-     * @param {any[]} data - 要设置的表格数据
-     * @returns {void}
-     */
-    setTableData(data: any[]): void;
-    /**
-     * 设置表格数据项
-     * @param {number} index - 数据项索引
-     * @param {Record<string, any>} data - 要设置的数据项
-     * @returns {void}
-     */
-    setTableDataItem(index: number, data: Record<string, any>): void;
-}