@juzhenfe/page-model 3.22.3 → 3.22.6

package/dist/main.d.ts

@@ -1,3 +1,4 @@
+/// <reference path="./types/common.d.ts" />
 import { InstallOptions } from './components/page-model/type';
 import { default as defineConfig } from './utils/define-config';
 import { App } from 'vue';
@@ -11,16 +12,16 @@ import { EditableTable, defineEditableTable } from './components/editable-table'
 import { default as DraggableList } from './components/draggable-list/index.vue';
 import { default as SimplePopover } from './components/simple-popover/index.vue';
 import { FilterItemTypeEnum, FilterMatchModeEnum, updateCompareOptions, updateCompareNoValueOptions } from './components/table/components/table-column/components/filter-zone/utils';
-
-export * from './components/form';
-declare const columnTools: {
-    saveTableColumns: any;
-    genSaveColumnName: any;
-};
-export { defineConfig, ButtonsRenderer, TableCellRenderer, FormDialog, FormDrawer, EditableTable, defineEditableTable, columnTools, TableColumnSetting, DraggableList, SimplePopover, FilterItemTypeEnum, updateCompareOptions, updateCompareNoValueOptions, FilterMatchModeEnum, Sortable };
-declare const ModelComponent: {
-    install: (app: App, options: InstallOptions) => App<any>;
-    version: string;
-    updateTableColumns(content: any): void;
-};
-export default ModelComponent;
+export type { Config, InstallOptions } from './components/page-model/type';
+export * from './components/form';
+declare const columnTools: {
+    saveTableColumns: any;
+    genSaveColumnName: any;
+};
+export { defineConfig, ButtonsRenderer, TableCellRenderer, FormDialog, FormDrawer, EditableTable, defineEditableTable, columnTools, TableColumnSetting, DraggableList, SimplePopover, FilterItemTypeEnum, updateCompareOptions, updateCompareNoValueOptions, FilterMatchModeEnum, Sortable };
+declare const ModelComponent: {
+    install: (app: App, options: InstallOptions) => App<any>;
+    version: string;
+    updateTableColumns(content: any): void;
+};
+export default ModelComponent;

package/dist/types/common.d.ts

@@ -0,0 +1,485 @@
+/// <reference path="../components/page-model/type.d.ts" />
+/// <reference path="./form-item-types/cascader.d.ts" />
+/// <reference path="./form-item-types/checkbox-group.d.ts" />
+/// <reference path="./form-item-types/input-number.d.ts" />
+/// <reference path="./form-item-types/input.d.ts" />
+/// <reference path="./form-item-types/no-e-type.d.ts" />
+/// <reference path="./form-item-types/select.d.ts" />
+/// <reference path="./form-item-types/color-picker.d.ts" />
+/// <reference path="./form-item-types/date-picker.d.ts" />
+/// <reference path="./form-item-types/radio-group.d.ts" />
+/// <reference path="./form-item-types/rate.d.ts" />
+/// <reference path="./form-item-types/select-v2.d.ts" />
+/// <reference path="./form-item-types/slider.d.ts" />
+/// <reference path="./form-item-types/switch.d.ts" />
+/// <reference path="./form-item-types/time-picker.d.ts" />
+/// <reference path="./form-item-types/time-select.d.ts" />
+/// <reference path="./form-item-types/jz-a-map.d.ts" />
+/// <reference path="./form-item-types/jz-td-map.d.ts" />
+/// <reference path="./form-item-types/jz-city-picker.d.ts" />
+/// <reference path="./form-item-types/jz-editor.d.ts" />
+/// <reference path="./form-item-types/jz-ck-editor.d.ts" />
+/// <reference path="./form-item-types/jz-img-upload.d.ts" />
+/// <reference path="./form-item-types/jz-file-upload.d.ts" />
+/// <reference path="./form-item-types/jz-cascader.d.ts" />
+
+import { ButtonProps } from 'element-plus';
+import { StyleValue, VNode } from 'vue';
+import { JSX } from 'vue/jsx-runtime';
+
+
+declare global {
+  type AnyObject = {
+    [key: string]: any
+  }
+
+  type ExtendKeys<T> = T & AnyObject
+
+  type AnyFunction = (...args: any[]) => any
+
+  type CreateDeType<T, CTX = any> = T | ((this: CTX, ...rest: any[]) => T)
+
+  type CreateDePromiseResult<FN extends (...rest: any[]) => any> =
+    | FN
+    | ((
+        this: ThisParameterType<FN>,
+        ...rest: Parameters<FN>
+      ) => Promise<ReturnType<FN>>)
+
+  type FilterType = 'string' | 'number' | 'date' | 'boolean' | 'select' | 'list'
+
+  namespace PageModel {
+    type _ButtonProps = Omit<ButtonProps, 'icon'> & {
+      icon: any
+      title: string
+    }
+
+    type LinkedFormItem<MODEL = any, CTX = any> =
+      | ElInput<MODEL, CTX>
+      | ElInputNumber<MODEL, CTX>
+      | ElCascader<MODEL, CTX>
+      | ElCheckboxGroup<MODEL, CTX>
+      | ElSelect<MODEL, CTX>
+      | ElColorPicker<MODEL, CTX>
+      | ElDatePicker<MODEL, CTX>
+      | ElRadioboxGroup<MODEL, CTX>
+      | ElRate<MODEL, CTX>
+      | ElSelectV2<MODEL, CTX>
+      | ElSlider<MODEL, CTX>
+      | ElSwitch<MODEL, CTX>
+      | ElTimePicker<MODEL, CTX>
+      | ElTimeSelect<MODEL, CTX>
+      | JuzhenAMap<MODEL, CTX>
+      | JuzhenTdMap<MODEL, CTX>
+      | JuzhenCascader<MODEL, CTX>
+      | JuzhenCityPicker<MODEL, CTX>
+      | JuzhenEditor<MODEL, CTX>
+      | JuzhenCkEditor<MODEL, CTX>
+      | JuzhenImgUpload<MODEL, CTX>
+      | JuzhenFileUpload<MODEL, CTX>
+      | NoEType<MODEL, CTX>
+
+    type _Badge = {
+      count?: number
+      maxCount?: number
+    }
+
+    type _Button<MODEL = AnyObject, CTX = any> = {
+      /**
+       * 按钮的名称
+       */
+      text?: string
+      /**
+       * 自定义事件
+       */
+      event?: string
+      /**
+       * 按钮权限值(作为权限判断的依据)
+       */
+      authValue?: string
+      isAdd?: boolean
+      isEdit?: boolean
+      isDel?: boolean
+      isCopy?: boolean
+      isImport?: boolean
+      isShow?:
+        | boolean
+        | ((this: CTX, self: _Button, data: MODEL, index: number) => boolean)
+      isDisabled?: (
+        this: CTX,
+        self: _Button,
+        data: MODEL,
+        index: number
+      ) => boolean
+      copyText?: CreateDeType<string>
+      props?: Partial<_ButtonProps>
+      customProps?: AnyObject
+      renderFn?: (this: CTX, data: MODEL, index: number) => JSX.Element
+    } & _Badge
+
+    type Button<MODEL = AnyObject, CTX = any> = _Button<MODEL, CTX> & {
+      children?: Omit<_Button, 'props' | 'isCopy' | 'copyText'>[]
+    }
+
+    // 表格表单元素
+    type BaseElItem<MODEL = AnyObject> = {
+      label?: string
+      prop?: keyof MODEL extends string ? keyof MODEL : string
+      _key?: string
+    }
+
+    interface ElFormItemProps {
+      required?: boolean
+      rules?: AnyObject
+      error?: string
+      inlineMessage?: boolean
+      showMessage?: boolean
+      size?: Size
+      labelWidth?: string
+      class?: string
+      labelPosition?: 'left' | 'top'
+    }
+
+    // 表单的元素
+    interface FormElBaseItem<MODEL = AnyObject, CTX = any>
+      extends BaseElItem<MODEL> {
+      /**
+       * 当前组件的名称
+       */
+      name?: string
+      /**
+       * 标签宽度
+       */
+      labelWidth?: string
+      /**
+       * 前置文字
+       */
+      prefix?: CreateDeType<string, CTX>
+      /**
+       * 后置文字
+       */
+      suffix?: CreateDeType<string, CTX>
+      /**
+       * 提示文字
+       */
+      helpText?: CreateDeType<string, CTX>
+      /**
+       * 提示文字是否作为弹窗
+       */
+      helpTextAsTooltip?: boolean
+      /**
+       * 是否显示
+       */
+      isShow?:
+        | boolean
+        | ((
+            this: CTX,
+            self: FormElBaseItem<MODEL, CTX>,
+            data: MODEL
+          ) => boolean)
+      /**
+       * 值改变时触发
+       */
+      change?: (this: CTX, value: any, label: string) => void
+      /**
+       * 是否禁用
+       */
+      isDisabled?: (this: CTX, data: MODEL) => boolean
+      /**
+       * 自定义渲染
+       */
+      renderFn?: (this: CTX, data: MODEL) => JSX.Element
+      /**
+       * 表单项属性
+       */
+      formItemProps?: ElFormItemProps
+      /**
+       * 模块名称
+       */
+      moduleName?: string
+      /**
+       * 区块名称
+       */
+      sectionName?: string
+      /**
+       * 用户section配置
+       */
+      userSectionName?: string
+      /**
+       * 用户module配置
+       */
+      userModuleName?: string
+      /**
+       * 用户表格配置
+       */
+      userConfigShow?: boolean
+      /**
+       * 用户表头
+       */
+      userLabel?: string
+      /**
+       * 内部更新的propslist
+       */
+      _updateProps?: string[]
+    }
+
+    // 表格元素
+    type TableColumnType = 'selection' | 'index' | 'expand'
+
+    type SortOrders = 'ascending' | 'descending' | null
+
+    type SortableType = 'custom'
+
+    type Align = 'left' | 'center' | 'right'
+
+    type DateFormat =
+      | 'YYYY-MM'
+      | 'MM-DD'
+      | 'YYYY-MM-DD'
+      | 'YYYY-MM-DD HH:mm'
+      | 'YYYY-MM-DD HH:mm:ss'
+      | 'YYYY/MM'
+      | 'MM/DD'
+      | 'YYYY/MM/DD'
+      | 'YYYY/MM/DD HH:mm'
+      | 'YYYY/MM/DD HH:mm:ss'
+
+    interface TableBaseItemProps {
+      type?: TableColumnType
+      prop?: string
+      className?: string
+      labelClassName?: string
+      width?: number | string
+      minWidth?: number | string
+      renderHeader?: ({
+        column,
+        $index,
+      }: {
+        column: any
+        $index: number
+      }) => any
+      sortable?: boolean | SortableType
+      sortMethod?: (a: any, b: any) => any
+      sortBy?: string | ((row: any, index: number) => any) | string[]
+      resizable?: boolean
+      columnKey?: string
+      align?: Align
+      headerAlign?: Align
+      showTooltipWhenOverflow?: boolean
+      showOverflowTooltip?: boolean
+      fixed?: true | 'left' | 'right'
+      formatter?: (row: any, column: any, cellValue: any, index: number) => any
+      selectable?: (row: any, index: number) => any
+      reserveSelection?: boolean
+      filterMethod?: (value: any, row: any, column: any) => any
+      filteredValue?: any[]
+      filters?: any[]
+      filterPlacement?: string
+      filterMultiple?: boolean
+      index?: number | ((index: number) => any)
+      sortOrders?: SortOrders[]
+    }
+
+    interface AscParams extends AnyObject {}
+    interface DescParams extends AnyObject {}
+    interface NoParams extends AnyObject {}
+
+    interface TableBaseItem<MODEL = any, CTX = any> extends BaseElItem<MODEL> {
+      /**
+       * 表头小组件渲染
+       */
+      headerToolRenderFn?: (el: TableBaseItem<MODEL>, index: number) => VNode
+      /**
+       * 列渲染的唯一key
+       */
+      _columnKey?: string
+      /**
+       * 宽度
+       */
+      width?: string | number
+      /**
+       * 最小宽度
+       */
+      minWidth?: string | number
+      /**
+       * 定位
+       */
+      fixed?: 'left' | 'right' | boolean
+      /**
+       * 是否显示
+       */
+      isShow?:
+        | boolean
+        | ((this: CTX, self: TableBaseItem<MODEL, CTX>) => boolean)
+      /**
+       * 用户表格配置
+       */
+      userConfigShow?: boolean
+      /**
+       * 用户表头
+       */
+      userLabel?: string
+      /**
+       * 表格排序
+       */
+      sortValues?: [AscParams, DescParams] | [AscParams, DescParams, NoParams]
+      /**
+       * 列属性
+       */
+      props?: ConvertFunctionContext<TableBaseItemProps, CTX>
+      /**
+       * 自定义输入渲染
+       */
+      renderFn?: (this: CTX, data: MODEL, index: number) => JSX.Element
+      /**
+       * 自定义文本渲染
+       */
+      textRenderFn?: (this: CTX, data: MODEL, index: number) => JSX.Element
+      /**
+       * 是否启用过滤
+       */
+      filterable?: boolean
+
+      /**
+       * 过滤的选项
+       */
+      filters?: ExtendReflect<{
+        /**
+         * 过滤类型
+         */
+        filterType: FilterType
+        /**
+         * 复数过滤
+         */
+        filterMultiple?: boolean
+        /**
+         * 过滤表单文本
+         */
+        filterLabel?: string
+        /**
+         * 过滤选项
+         */
+        filterOptions?: Array<{
+          label: string
+          value: string | number | boolean
+        }>
+        /**
+         * 获取过滤选项
+         */
+        getFilterOptions?: (this: CTX) => Promise<{
+          label: string
+          value: string | number | boolean
+        }[]>
+      }>
+
+      /**
+       * 是否必填
+       */
+      required?: boolean
+      /**
+       * 是否直接显示编辑组件
+       */
+      showEdit?: boolean
+      /**
+       * 内置编辑组件
+       */
+      editData?: FormItem<MODEL, CTX> & {
+        api?: string | ((this: CTX, data: MODEL) => string)
+        method?: PageModel.AjaxMethod
+        beforeSubmit?: CreateDePromiseResult<
+          (this: CTX, data: MODEL) => AnyObject | false
+        >
+        isDisabled?: (this: CTX, data: MODEL) => boolean
+        /**
+         * 自定义更新请求
+         * @param this table
+         * @param data 请求的数据
+         * @returns 是否成功
+         */
+        customUpdate?: (this: CTX, data: MODEL) => Promise<boolean | void>
+        /**
+         * 触发的弹窗名称
+         */
+        triggerPoperClassName?: string
+      }
+      // 子元素
+      children?: Omit<TableBaseItem<MODEL, CTX>, 'children'>[]
+      // 自定义属性
+      customProps?: AnyObject
+      // 帮助文本
+      helpText?: string
+      // 显示合计
+      showSummary?: number | string
+      /**
+       * 显示的行数
+       */
+      showRowNumbers?: number
+      /**
+       * 图标
+       */
+      icon?: any
+    }
+
+    interface TableVirtualBaseItem<MODEL = any, CTX = any>
+      extends TableBaseItem<MODEL, CTX> {
+      title?: string
+      dataKey: string
+      key?: string
+      cellRenderer?: (opt: { rowData: MODEL; rowIndex: number }) => JSX.Element
+      headerCellRenderer?: (opt: {
+        rowData: MODEL
+        rowIndex: number
+      }) => JSX.Element
+      children?: TableVirtualBaseItem<MODEL, CTX>[]
+    }
+
+    // 创建eType组件类型
+    interface CreateFormItemComponent<
+      NAME,
+      MODEL,
+      CTX,
+      PROPS = any,
+      EVENTS = any
+    > extends FormElBaseItem<MODEL, CTX> {
+      eType: NAME
+      props?: PROPS
+      events?: EVENTS
+      style?: StyleValue
+    }
+
+    // 为对象中的函数添加this指向
+    type ConvertFunctionContext<T, CTX> = {
+      [K in keyof T]: T[K] extends (...rest: any[]) => any
+        ? (this: CTX, ...rest: Parameters<T[K]>) => any
+        : T[K]
+    }
+
+    type CreatePropsFromElement<
+      P,
+      O extends undefined | keyof P = undefined,
+      CTX = any
+    > = Partial<
+      ConvertFunctionContext<
+        O extends string | number | symbol ? Omit<P, O> : P,
+        CTX
+      >
+    >
+
+    // 扩展对象的reflect提示
+    type ExtendReflect<T> = T & {
+      _reflect?: string
+      _reflectChangeKey?: string
+    }
+
+    type OptionsData = ExtendReflect<{
+      list?: any[]
+      label?: string
+      value?: string
+      [key: string]: any
+    }>
+
+    type ExtendOptionsData<T> = T & {
+      optionsData: OptionsData
+    }
+  }
+}

package/dist/types/form-item-types/cascader.d.ts

@@ -0,0 +1,39 @@
+/// <reference path="../common.d.ts" />
+
+import { CascaderProps, CascaderOption } from 'element-plus';
+
+
+declare global {
+  namespace PageModel {
+
+    type CascaderComponentProps = {
+      options: CascaderOption[];
+      props: CascaderProps;
+      size: Size;
+      placeholder: string;
+      disabled: boolean;
+      clearable: boolean;
+      showAllLevels: boolean;
+      collapseTags: boolean;
+      separator: string;
+      filterable: boolean;
+      filterMethod: (node: any, keyword: string)	=> any;
+      debounce: number;
+      beforeFilter: boolean | Promise<any>;
+      popperClass: string;
+    }
+
+    type ElCascaderProps<CTX> = CreatePropsFromElement<ExtendReflect<CascaderComponentProps>, undefined, CTX>
+
+    type ElCascaderEvents<CTX> = CreatePropsFromElement<{
+      change: (value: any[]) => any;
+      expandChange: (value: any[]) => any;
+      blur: (event: Event) => any;
+      focus:	(event: Event) => any;
+      visibleChange: (value: boolean) => any;
+      removeTag: (value: any) => any;
+    }, undefined, CTX>
+  
+    type ElCascader<MODEL = any, CTX = any> = CreateFormItemComponent<'el-cascader', MODEL, CTX, ElCascaderProps<CTX>, ElCascaderEvents<CTX>>
+  }
+}

package/dist/types/form-item-types/checkbox-group.d.ts

@@ -0,0 +1,19 @@
+/// <reference path="../common.d.ts" />
+
+declare namespace PageModel {
+
+  type ElCheckboxGroupProps<CTX> = CreatePropsFromElement<{
+    size: Size;
+    disabled: false;
+    min: number;
+    max: number;
+    textColor: string;
+    fill: string;
+  }, undefined, CTX>
+
+  type ElCheckboxGroupEvents<CTX> = CreatePropsFromElement<{
+    change: (value: any[]) => void;
+  }, undefined, CTX>
+
+  type ElCheckboxGroup<MODEL = any, CTX = any> = ExtendOptionsData<CreateFormItemComponent<'el-checkbox-group', MODEL, CTX, ElCheckboxGroupProps<CTX>, ElCheckboxGroupEvents<CTX>>>
+}

package/dist/types/form-item-types/color-picker.d.ts

@@ -0,0 +1,21 @@
+
+/// <reference path="../common.d.ts" />
+
+declare namespace PageModel {
+  type ElColorPickerProps<CTX> = CreatePropsFromElement<{
+    size: Size;
+    disabled: false;
+    showAlpha: boolean;
+    colorFormat: 'hsl' | 'hsv' | 'hex' | 'rgb';
+    popperClass: string;
+    predefine: any[];
+  }, undefined, CTX>
+
+  type ElColorPickerEvents<CTX> = CreatePropsFromElement<{
+    change: (value: any[]) => any;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onActive-change"?: ((...args: any[]) => any) | undefined;
+  }, undefined, CTX>
+
+  type ElColorPicker<MODEL = any, CTX = any> = CreateFormItemComponent<'el-color-picker', MODEL, CTX, ElColorPickerProps<CTX>, ElColorPickerEvents<CTX>>
+}

package/dist/types/form-item-types/date-picker.d.ts

@@ -0,0 +1,46 @@
+/// <reference path="../common.d.ts" />
+
+import { Component } from 'vue';
+
+
+declare global {
+  namespace PageModel {
+    type ElDatePickerProps<CTX> = CreatePropsFromElement<{
+      readonly: boolean;
+      disabled: boolean;
+      size: Size;
+      editable: boolean;
+      clearable: boolean;
+      placeholder: string;
+      startPlaceholder: string;
+      endPlaceholder: string;
+      type: 'year' | 'month' | 'date' | 'dates' | 'week' | 'datetime' | 'datetimerange' | 'daterange' | 'monthrange';
+      format: DateFormat;
+      popperClass: string;
+      rangeSeparator: string;
+      defaultValue: Date;
+      defaultTime: Date[];
+      valueFormat: DateFormat;
+      id: string | string[];
+      name: string;
+      unlinkPanels: boolean;
+      prefixIcon: string | Component;
+      clearIcon: string | Component;
+      validateEvent: boolean;
+      disabledDate: (date: Date) => boolean;
+      shortcuts: { text: string, value: Date | Function }[];
+      cellClassName: (date: Date) => string;
+    }, undefined, CTX>
+  
+    type ElDatePickerEvents<CTX> = CreatePropsFromElement<{
+      change: (value: Date | string) => void;
+      blur: AnyFunction;
+      focus: AnyFunction;
+      panelChange: (date: Date | string, mode: string, view: any) => any;
+      visibleChange: AnyFunction;
+    }, undefined, CTX>
+  
+    type ElDatePicker<MODEL = any, CTX = any> = CreateFormItemComponent<'el-date-picker', MODEL, CTX, ElDatePickerProps<CTX>, ElDatePickerEvents<CTX>>
+  }
+}
+

package/dist/types/form-item-types/input-number.d.ts

@@ -0,0 +1,16 @@
+/// <reference path="../common.d.ts" />
+
+import { inputNumberProps, inputNumberEmits } from 'element-plus';
+import { ExtractPropTypes } from 'vue';
+
+
+declare global {
+  namespace PageModel {
+
+    type ElInputNumberProps<CTX> = CreatePropsFromElement<ExtractPropTypes<typeof inputNumberProps>, 'modelValue', CTX>
+  
+    type ElInputNumberEvents<CTX> = CreatePropsFromElement<ExtractPropTypes<typeof inputNumberEmits>, undefined, CTX>
+  
+    type ElInputNumber<MODEL = any, CTX = any> = CreateFormItemComponent<'el-input-number', MODEL, CTX, ElInputNumberProps<CTX>, ElInputEvents<CTX>>
+  }
+}

package/dist/types/form-item-types/input.d.ts

@@ -0,0 +1,18 @@
+/// <reference path="../common.d.ts" />
+
+import { InputProps, InputEmits } from 'element-plus';
+
+
+declare global {
+  namespace PageModel {
+
+    type ElInputProps<CTX> = CreatePropsFromElement<InputProps, 'modelValue', CTX> & {
+      rows?: number;
+    }
+  
+    type ElInputEvents<CTX> = CreatePropsFromElement<InputEmits, undefined, CTX>
+  
+    type ElInput<MODEL = any, CTX = any> = CreateFormItemComponent<'el-input', MODEL, CTX, ElInputProps<CTX>, ElInputEvents<CTX>>
+  }
+  
+}

package/dist/types/form-item-types/jz-a-map.d.ts

@@ -0,0 +1,14 @@
+/// <reference path="../common.d.ts" />
+
+declare namespace PageModel {
+  type JuzhenAMapProps<CTX> = CreatePropsFromElement<{
+    options: AnyObject;
+    height: number | string;
+    width: number | string;
+    markers: any[];
+    search: boolean;
+    useCenter: boolean;
+  }, undefined, CTX>
+
+  type JuzhenAMap<MODEL = any, CTX = any> = CreateFormItemComponent<'a-map', MODEL, CTX, JuzhenAMapProps<CTX>>
+}