@wx-design/components 0.1.4 → 0.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wx-design/components",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "",
   "type": "module",
   "main": "./lib/index.js",
@@ -8,7 +8,7 @@
   "files": [
     "es",
     "lib",
-    "*.d.ts"
+    "types"
   ],
   "scripts": {
     "build:lib": "vite build",
@@ -18,7 +18,7 @@
   },
   "keywords": [],
   "author": "",
-  "typings": "index.d.ts",
+  "typings": "types/index.d.ts",
   "license": "ISC",
   "devDependencies": {
     "@types/lodash": "^4.14.196",

package/types/index.d.ts

@@ -0,0 +1,8 @@
+export * from './table'
+import { SabTable } from './table'
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    SabTable: typeof SabTable
+  }
+}

package/types/table/column.d.ts

@@ -0,0 +1,98 @@
+import { VxeTableDataRow, VxeColumnProps, VxeColumnSlotTypes } from "vxe-table";
+import type {
+  InputProps,
+  InputNumberProps,
+  DatePickerProps,
+} from "element-plus";
+
+export interface SabColumnSlots<D = VxeTableDataRow> {
+  /**
+   * 自定义显示内容模板
+   */
+  default: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
+  /**
+   * 自定义表头内容的模板
+   */
+  header: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
+  /**
+   * 自定义表尾内容的模板
+   */
+  footer: ((params: VxeColumnSlotTypes.FooterSlotParams<D>) => any) | string;
+  /**
+   * 只对 type=checkbox,radio 有效，自定义标题模板
+   */
+  title: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
+  /**
+   * 只对 type=checkbox 有效，自定义复选框模板
+   */
+  checkbox: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
+  /**
+   * 只对 type=radio 有效，自定义单选框模板
+   */
+  radio: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
+  /**
+   * 只对 type=expand 有效，自定义展开后的内容模板
+   */
+  content: ((params: VxeColumnSlotTypes.ContentSlotParams<D>) => any) | string;
+  /**
+   * 只对 filter-render 启用时有效，自定义筛选模板
+   */
+  filter: ((params: VxeColumnSlotTypes.FilterSlotParams<D>) => any) | string;
+  /**
+   * 只对 edit-render 启用时有效，自定义可编辑组件模板
+   */
+  edit:
+    | ((
+        params: VxeColumnSlotTypes.EditSlotParams<D>,
+        editorProps: SabCellEditorParams
+      ) => any)
+    | string;
+  /**
+   * 已废弃
+   * @deprecated
+   */
+  icon: (params: VxeColumnSlotTypes.IconSlotParams<D>) => any;
+}
+
+// 单选框属性
+export type SabCellSelectProps = {
+  // 禁用状态
+  disabled?: boolean;
+  // 只读模式
+  readonly?: boolean;
+  // 是否多选
+  multiple?: boolean;
+  // 选项列表
+  options: any[];
+  // 用于展示的字段名，默认 label
+  labelKey?: string;
+  // 用于取值的字段名，默认 value
+  valueKey?: string;
+  // 用于禁用状态的字段名，默认 disabled
+  disabledKey?: string;
+};
+// 单元格编辑器参数
+export type SabCellEditorParams =
+  | Partial<InputProps>
+  | Partial<InputNumberProps>
+  | Partial<DatePickerProps>
+  | Partial<SabCellSelectProps>
+
+// 表格列设置
+export type SabColumnProps<D = VxeTableDataRow> = VxeColumnProps<D> & {
+  // 单元格类型
+  sabCellType?: SabCellType;
+  // 附加的单元格编辑器参数
+  editorProps?: Partial<SabCellEditorParams>;
+  // 单元格是否可编辑
+  editable?: boolean;
+  // 自定义插槽
+  slots?: Partial<SabColumnSlots<D>>;
+  // 是否隐藏列
+  hidden?: boolean;
+  // 筛选控制
+  sabFilter?: {
+    // 是否自动收集筛选条件
+    autoCollectFilterOptions?: boolean;
+  };
+};

package/types/table/index.d.ts

@@ -0,0 +1,10 @@
+
+import { VXEComponent, VxeTableEventProps } from 'vxe-table'
+import { SabTableProps } from './table'
+import { SabColumnSlots } from './column'
+
+export const SabTable: VXEComponent<SabTableProps<any>, VxeTableEventProps<any>, SabColumnSlots<any>>
+
+export * from './column'
+export * from './table'
+export * from './toolbar'

package/types/table/table.d.ts

@@ -0,0 +1,19 @@
+import { VxeTableProps, VxeTableDataRow } from "vxe-table";
+import { SabColumnProps } from "./";
+
+export type SabTableProps<D = VxeTableDataRow> = VxeTableProps<D> & {
+  // 表格 css 类名
+  class?: any;
+  // 列配置
+  columns?: Partial<SabColumnProps<D>>[];
+  // 表格可编辑
+  editable?: boolean;
+  // 默认带上序号列
+  withSeq?: boolean;
+  // 带上选项框
+  withCheckbox?: boolean;
+  // 展示工具栏
+  showToolbar?: boolean;
+  // 点击未选中行的单元格自动取消选择选中行
+  autoClearSelected?: boolean;
+}

package/types/table/toolbar.d.ts

@@ -0,0 +1,22 @@
+import { VxeTableInstance, VxeTableDataRow } from "vxe-table";
+
+import { SabColumnProps } from "./";
+
+// 支持的能力
+// clearSelect - 清空选择行
+// saveSelect - 保存选择行
+type ToolbarFeatures = 'clearSelect' | 'saveSelect'
+
+export interface ToolbarProps<D = VxeTableDataRow> {
+  // css 类名
+  class?: any;
+  // vxe-table 实例
+  tableRef?: VxeTableInstance;
+  // 功能列表
+  features?: ToolbarFeatures[];
+  // 列配置项
+  columns?: SabColumnProps[];
+
+  // 保存选择行回调
+  saveSelectRecords?: (rows: D[]) => void;
+}

package/es/core/Table/types/column.d.ts

@@ -1,74 +0,0 @@
-import { VxeTableDataRow, VxeColumnProps, VxeColumnSlotTypes } from "vxe-table";
-import type { InputNumberProps, DatePickerProps } from "element-plus";
-export interface SabColumnSlots<D = VxeTableDataRow> {
-    /**
-     * 自定义显示内容模板
-     */
-    default: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 自定义表头内容的模板
-     */
-    header: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
-    /**
-     * 自定义表尾内容的模板
-     */
-    footer: ((params: VxeColumnSlotTypes.FooterSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=checkbox,radio 有效，自定义标题模板
-     */
-    title: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=checkbox 有效，自定义复选框模板
-     */
-    checkbox: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=radio 有效，自定义单选框模板
-     */
-    radio: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=expand 有效，自定义展开后的内容模板
-     */
-    content: ((params: VxeColumnSlotTypes.ContentSlotParams<D>) => any) | string;
-    /**
-     * 只对 filter-render 启用时有效，自定义筛选模板
-     */
-    filter: ((params: VxeColumnSlotTypes.FilterSlotParams<D>) => any) | string;
-    /**
-     * 只对 edit-render 启用时有效，自定义可编辑组件模板
-     */
-    edit: ((params: VxeColumnSlotTypes.EditSlotParams<D>, editorProps: SabCellEditorParams) => any) | string;
-    /**
-     * 已废弃
-     * @deprecated
-     */
-    icon: (params: VxeColumnSlotTypes.IconSlotParams<D>) => any;
-}
-export declare enum SabCellType {
-    Input = "input",
-    InputNumber = "input-number",
-    Select = "select",
-    DatePciker = "date-picker",
-    Image = "image",
-    Color = "color",
-    Boolean = "boolean"
-}
-export type SabCellSelectProps = {
-    disabled?: boolean;
-    readonly?: boolean;
-    multiple?: boolean;
-    options: any[];
-    labelKey?: string;
-    valueKey?: string;
-    disabledKey?: string;
-};
-export type SabCellEditorParams = Partial<InputNumberProps> | Partial<DatePickerProps> | Partial<SabCellSelectProps>;
-export type SabColumnProps<D = VxeTableDataRow> = VxeColumnProps<D> & {
-    sabCellType?: SabCellType;
-    editorProps?: Partial<SabCellEditorParams>;
-    editable?: boolean;
-    slots?: Partial<SabColumnSlots<D>>;
-    hidden?: boolean;
-    sabFilter?: {
-        autoCollectFilterOptions?: boolean;
-    };
-};

package/es/core/Table/types/index.d.ts

@@ -1,3 +0,0 @@
-export * from './column';
-export * from './table';
-export * from './toolbar';

package/es/core/Table/types/table.d.ts

@@ -1,11 +0,0 @@
-import { VxeTableProps, VxeTableDataRow } from "vxe-table";
-import { SabColumnProps } from "./";
-export type SabTableProps<D = VxeTableDataRow> = VxeTableProps<D> & {
-    class?: any;
-    columns?: Partial<SabColumnProps<D>>[];
-    editable?: boolean;
-    withSeq?: boolean;
-    withCheckbox?: boolean;
-    showToolbar?: boolean;
-    autoClearSelected?: boolean;
-};

package/es/core/Table/types/toolbar.d.ts

@@ -1,11 +0,0 @@
-import { VxeTableInstance, VxeTableDataRow } from "vxe-table";
-import { SabColumnProps } from "./";
-type ToolbarFeatures = 'clearSelect' | 'saveSelect';
-export interface ToolbarProps<D = VxeTableDataRow> {
-    class?: any;
-    tableRef?: VxeTableInstance;
-    features?: ToolbarFeatures[];
-    columns?: SabColumnProps[];
-    saveSelectRecords?: (rows: D[]) => void;
-}
-export {};

package/index.d.ts

@@ -1 +0,0 @@
-export * from './core/Table/types/index.d'

package/lib/core/Table/types/column.d.ts

@@ -1,74 +0,0 @@
-import { VxeTableDataRow, VxeColumnProps, VxeColumnSlotTypes } from "vxe-table";
-import type { InputNumberProps, DatePickerProps } from "element-plus";
-export interface SabColumnSlots<D = VxeTableDataRow> {
-    /**
-     * 自定义显示内容模板
-     */
-    default: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 自定义表头内容的模板
-     */
-    header: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
-    /**
-     * 自定义表尾内容的模板
-     */
-    footer: ((params: VxeColumnSlotTypes.FooterSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=checkbox,radio 有效，自定义标题模板
-     */
-    title: ((params: VxeColumnSlotTypes.HeaderSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=checkbox 有效，自定义复选框模板
-     */
-    checkbox: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=radio 有效，自定义单选框模板
-     */
-    radio: ((params: VxeColumnSlotTypes.DefaultSlotParams<D>) => any) | string;
-    /**
-     * 只对 type=expand 有效，自定义展开后的内容模板
-     */
-    content: ((params: VxeColumnSlotTypes.ContentSlotParams<D>) => any) | string;
-    /**
-     * 只对 filter-render 启用时有效，自定义筛选模板
-     */
-    filter: ((params: VxeColumnSlotTypes.FilterSlotParams<D>) => any) | string;
-    /**
-     * 只对 edit-render 启用时有效，自定义可编辑组件模板
-     */
-    edit: ((params: VxeColumnSlotTypes.EditSlotParams<D>, editorProps: SabCellEditorParams) => any) | string;
-    /**
-     * 已废弃
-     * @deprecated
-     */
-    icon: (params: VxeColumnSlotTypes.IconSlotParams<D>) => any;
-}
-export declare enum SabCellType {
-    Input = "input",
-    InputNumber = "input-number",
-    Select = "select",
-    DatePciker = "date-picker",
-    Image = "image",
-    Color = "color",
-    Boolean = "boolean"
-}
-export type SabCellSelectProps = {
-    disabled?: boolean;
-    readonly?: boolean;
-    multiple?: boolean;
-    options: any[];
-    labelKey?: string;
-    valueKey?: string;
-    disabledKey?: string;
-};
-export type SabCellEditorParams = Partial<InputNumberProps> | Partial<DatePickerProps> | Partial<SabCellSelectProps>;
-export type SabColumnProps<D = VxeTableDataRow> = VxeColumnProps<D> & {
-    sabCellType?: SabCellType;
-    editorProps?: Partial<SabCellEditorParams>;
-    editable?: boolean;
-    slots?: Partial<SabColumnSlots<D>>;
-    hidden?: boolean;
-    sabFilter?: {
-        autoCollectFilterOptions?: boolean;
-    };
-};

package/lib/core/Table/types/index.d.ts

@@ -1,3 +0,0 @@
-export * from './column';
-export * from './table';
-export * from './toolbar';

package/lib/core/Table/types/table.d.ts

@@ -1,11 +0,0 @@
-import { VxeTableProps, VxeTableDataRow } from "vxe-table";
-import { SabColumnProps } from "./";
-export type SabTableProps<D = VxeTableDataRow> = VxeTableProps<D> & {
-    class?: any;
-    columns?: Partial<SabColumnProps<D>>[];
-    editable?: boolean;
-    withSeq?: boolean;
-    withCheckbox?: boolean;
-    showToolbar?: boolean;
-    autoClearSelected?: boolean;
-};

package/lib/core/Table/types/toolbar.d.ts

@@ -1,11 +0,0 @@
-import { VxeTableInstance, VxeTableDataRow } from "vxe-table";
-import { SabColumnProps } from "./";
-type ToolbarFeatures = 'clearSelect' | 'saveSelect';
-export interface ToolbarProps<D = VxeTableDataRow> {
-    class?: any;
-    tableRef?: VxeTableInstance;
-    features?: ToolbarFeatures[];
-    columns?: SabColumnProps[];
-    saveSelectRecords?: (rows: D[]) => void;
-}
-export {};