pro-design-vue 1.3.21 → 1.3.22

package/lib/index.d.ts

@@ -803,7 +803,12 @@ declare type __VLS_WithSlots_7<T, S> = T & {
         $slots: S;
     };
 };
+declare type AddLineOptions = {
+    position?: "top" | "bottom";
+    newRecordType?: "dataSource" | "cache";
+};
 declare type AlignType = "left" | "center" | "right";
+declare type AllValidateResult = CustomValidateObj | ValidateResultType;
 declare interface AppendCellRange {
     columnsKey?: ProTableKey[];
     columnStartKey?: ProTableKey;
@@ -964,7 +969,6 @@ declare interface CellEditorArgs {
     recordIndexs: number[];
     record: any;
 }
-declare type CellEditorSlot = "cellEditorSlot";
 declare type CellEllipsisType = {
     showTitle?: boolean;
     line?: number;
@@ -1137,9 +1141,15 @@ declare interface ColumnType<RecordType = DefaultRecordType> extends ColumnShare
         record: RecordType;
         index: number;
         column: ColumnType<RecordType>;
+        cancelEditable: (recordKey: ProTableKey) => boolean;
+        startEditable: (recordKey: ProTableKey, recordValue?: any) => boolean;
+        saveEditable: (recordKey: ProTableKey) => Promise<boolean>;
+        isEditable: (recordKey: ProTableKey) => boolean;
     }) => any | RenderedCell;
-    editable?: boolean | CellEditorSlot | ((params: EditableValueParams<RecordType>) => boolean | CellEditorSlot);
-    editableTrigger?: EditableTrigger | EditableTrigger[];
+    /**
+     * 可编辑单元格配置项，具体属性参考文档 `EditableCellConfig` 描述
+     */
+    edit?: EditableCellConfig<RecordType>;
     valueParser?: ValueParserFunc<RecordType>;
     valueGetter?: ValueGetterFunc<RecordType>;
     valueSetter?: (params: ValueParserParams<RecordType>) => boolean | Promise<any>;
@@ -1157,7 +1167,7 @@ declare interface ColumnType<RecordType = DefaultRecordType> extends ColumnShare
         title?: string;
     };
     valueEnum?: ((row: RecordType) => Record<string, ProTableValueEnumType>) | Record<string, ProTableValueEnumType>;
-    valueStatus?: ((value: any, row: RecordType) => ValueStatus) | ValueStatus;
+    valueStatus?: ((value: any, row: RecordType, valueEnum?: ProTableValueEnumType) => ValueStatus) | ValueStatus;
     renderText?: (text: any, record: RecordType, rowIndex: number) => string | number;
     /** @name 列设置的 disabled */
     disable?: boolean | {
@@ -1312,6 +1322,13 @@ export declare const CSS_VARIABLE_LAYOUT_FOOTER_HEIGHT = "--pro-footer-height";
 /** layout header 组件的高度 */
 export declare const CSS_VARIABLE_LAYOUT_HEADER_HEIGHT = "--pro-header-height";
 declare type CustomSlotsType<T extends Record<string, any>> = SlotsType<T>;
+declare interface CustomValidateObj {
+    result: boolean;
+    message: string;
+    type?: "error" | "warning" | "success";
+}
+declare type CustomValidateResolveType = boolean | CustomValidateObj;
+declare type CustomValidator = (val: any) => CustomValidateResolveType | Promise<CustomValidateResolveType>;
 declare type DataIndex = string | number | readonly (string | number)[];
 export { dayjs };
 export declare const deDEIntl: IntlType;
@@ -1950,6 +1967,10 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    selectRowByClick: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     expandIcon: {
         type: PropType<RenderExpandIcon<DefaultRecordType>>;
         default: undefined;
@@ -2023,6 +2044,14 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         }) => Record<string, any>>;
         default: () => {};
     };
+    editableKeys: {
+        type: PropType<ProTableKey[]>;
+        default: undefined;
+    };
+    rowEditable: {
+        type: PropType<RowEditableConfig<DefaultRecordType>>;
+        default: undefined;
+    };
     showHeader: {
         type: BooleanConstructor;
         default: boolean;
@@ -2195,6 +2224,9 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    editableCellState: {
+        type: PropType<EditableCellType<DefaultRecordType>>;
+    };
     paginationSticky: {
         type: PropType<boolean | BottomSticky>;
         default: boolean;
@@ -2248,6 +2280,15 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: PropType<(opt: CellRenderArgs) => void>;
         default: undefined;
     };
+    onDataChange: {
+        type: PropType<(dataSource: DefaultRecordType[]) => void>;
+    };
+    onRowValidate: {
+        type: PropType<(TablePromiseErrorData: any) => void>;
+    };
+    onValidate: {
+        type: PropType<(TablePromiseErrorData: any) => void>;
+    };
     "onUpdate:pagination": {
         type: PropType<(info: ProTablePaginationConfig) => void>;
     };
@@ -2449,6 +2490,10 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    selectRowByClick: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
     expandIcon: {
         type: PropType<RenderExpandIcon<DefaultRecordType>>;
         default: undefined;
@@ -2522,6 +2567,14 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         }) => Record<string, any>>;
         default: () => {};
     };
+    editableKeys: {
+        type: PropType<ProTableKey[]>;
+        default: undefined;
+    };
+    rowEditable: {
+        type: PropType<RowEditableConfig<DefaultRecordType>>;
+        default: undefined;
+    };
     showHeader: {
         type: BooleanConstructor;
         default: boolean;
@@ -2694,6 +2747,9 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: BooleanConstructor;
         default: undefined;
     };
+    editableCellState: {
+        type: PropType<EditableCellType<DefaultRecordType>>;
+    };
     paginationSticky: {
         type: PropType<boolean | BottomSticky>;
         default: boolean;
@@ -2747,6 +2803,15 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         type: PropType<(opt: CellRenderArgs) => void>;
         default: undefined;
     };
+    onDataChange: {
+        type: PropType<(dataSource: DefaultRecordType[]) => void>;
+    };
+    onRowValidate: {
+        type: PropType<(TablePromiseErrorData: any) => void>;
+    };
+    onValidate: {
+        type: PropType<(TablePromiseErrorData: any) => void>;
+    };
     "onUpdate:pagination": {
         type: PropType<(info: ProTablePaginationConfig) => void>;
     };
@@ -2857,6 +2922,7 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
     defaultExpandedRowKeys: ProTableKey[];
     expandedRowRender: ExpandedRowRender<DefaultRecordType>;
     expandRowByClick: boolean;
+    selectRowByClick: boolean;
     expandIcon: RenderExpandIcon<DefaultRecordType>;
     expandIconType: ExpandIconType;
     onExpand: (expanded: boolean, record: DefaultRecordType) => void;
@@ -2882,6 +2948,8 @@ declare const _default_17: DefineComponent<ExtractPropTypes<{
         column: ColumnType<DefaultRecordType>;
         columnIndex: number;
     }) => Record<string, any>;
+    editableKeys: ProTableKey[];
+    rowEditable: RowEditableConfig<DefaultRecordType>;
     showHeader: boolean;
     showSorterTooltip: boolean | Partial<ExtractPropTypes<{
         title: VueTypeValidableDef_2<any>;
@@ -5126,6 +5194,64 @@ declare const drawerOrModalFormProps: () => {
     };
     name: StringConstructor;
 };
+declare interface EditableCellConfig<T = DefaultRecordType> {
+    /**
+     * 除了点击非自身元素退出编辑态之外，还有哪些事件退出编辑态。示例：`abortEditOnEvent: ['onChange']`
+     */
+    abortEditOnEvent?: string[];
+    editableTrigger?: EditableTrigger | EditableTrigger[];
+    /**
+     * 组件定义，如：`Input` `Select`。对于完全自定义的组件（非组件库内的组件），组件需要支持 `value` 和 `onChange` ；如果还需要支持校验规则，则组件还需实现 `tips` 和 `status` 两个 API，实现规则可参考 `Input` 组件
+     */
+    component?: any;
+    /**
+     * 单元格默认状态是否为编辑态
+     * @default false
+     */
+    defaultEditable?: boolean;
+    /**
+     * 设置当前列的单元格始终保持为编辑态
+     * @default false
+     */
+    keepEditMode?: boolean;
+    /**
+     * 是否可以编辑
+     */
+    editable?: (context: EditableValueParams<T>) => boolean;
+    valueParser?: ValueParserFunc<T>;
+    valueGetter?: ValueGetterFunc<T>;
+    valueSetter?: (params: EditableValueParams<T>) => boolean | Promise<any>;
+    /**
+     * 透传给编辑组件的事件，参数有({ row, rowIndex, col, colIndex, editedRow, updateEditedCellValue })。可以使用参数 `updateEditedCellValue` 更新当前单元格（或当前行任意编辑状态单元格）的值。<br/>更新当前单元格数据示例：`updateEditedCellValue(value)`；<br/>更新当前行编辑态数据示例：`updateEditedCellValue({ isUpdateCurrentRow: true, column_key: 'test'  })`；<br/>更新其他行编辑态数据示例：`updateEditedCellValue({ rowValue: '124', column_key: 'test' })`
+     */
+    on?: (context: EditableValueParams<T>) => {
+        [eventName: string]: Function;
+    };
+    /**
+     * 编辑完成后，退出编辑模式时触发
+     */
+    onEdited?: (context: EditableValueParams<T>) => void;
+    /**
+     * 透传给组件 `edit.component` 的属性，可以使用 `updateEditedCellValue` 更新当前行任意编辑状态单元格的值
+     */
+    props?: EditableCellProps<T>;
+    /**
+     * 校验规则
+     */
+    rules?: EditableCellRules<T>;
+    /**
+     * 是否显示编辑图标
+     * @default true
+     */
+    /**
+     * 触发校验的时机，有 2 种：退出编辑时和数据变化时
+     * @default 'exit'
+     */
+    validateTrigger?: "exit" | "change";
+}
+declare type EditableCellProps<T> = PlainObject | ((params: EditableValueParams<T>) => PlainObject);
+declare type EditableCellRules<T> = EditRule[] | ((params: EditableValueParams<T>) => EditRule[]);
+declare type EditableCellType<T> = (params: EditableValueParams<T>) => boolean;
 declare type EditableTrigger = "click" | "dblClick" | "contextmenu";
 declare interface EditableValueParams<RecordType = DefaultRecordType, TValue = any> {
     value: TValue;
@@ -5133,11 +5259,74 @@ declare interface EditableValueParams<RecordType = DefaultRecordType, TValue = a
     recordIndexs: number[];
     column: ColumnType<RecordType>;
 }
+declare interface EditRule {
+    /**
+     * 内置校验方法，校验值类型是否为布尔类型，示例：`{ boolean: true, message: '数据类型必须是布尔类型' }`
+     */
+    boolean?: boolean;
+    /**
+     * 内置校验方法，校验值是否属于枚举值中的值。示例：`{ enum: ['primary', 'info', 'warning'], message: '值只能是 primary/info/warning 中的一种' }`
+     */
+    enum?: Array<string>;
+    /**
+     * 内置校验方法，校验值是否为身份证号码，组件校验正则为 `/^(\\d{18,18}|\\d{15,15}|\\d{17,17}x)$/i`，示例：`{ idcard: true, message: '请输入正确的身份证号码' }`
+     */
+    idcard?: boolean;
+    /**
+     * 内置校验方法，校验值固定长度，如：len: 10 表示值的字符长度只能等于 10 ，中文表示 2 个字符，英文为 1 个字符。示例：`{ len: 10, message: '内容长度不对' }`。<br />如果希望字母和中文都是同样的长度，示例：`{ validator: (val) => val.length === 10, message: '内容文本长度只能是 10 个字' }`
+     */
+    len?: number | boolean;
+    /**
+     * 内置校验方法，校验值最大长度，如：max: 100 表示值最多不能超过 100 个字符，中文表示 2 个字符，英文为 1 个字符。示例：`{ max: 10, message: '内容超出' }`。<br />如果希望字母和中文都是同样的长度，示例：`{ validator: (val) => val.length <= 10, message: '内容文本长度不能超过 10 个字' }`<br />如果数据类型数字（Number），则自动变为数字大小的比对
+     */
+    max?: number | boolean;
+    /**
+     * 校验未通过时呈现的错误信息，值为空则不显示
+     * @default ''
+     */
+    message?: string;
+    /**
+     * 内置校验方法，校验值最小长度，如：min: 10 表示值最多不能少于 10 个字符，中文表示 2 个字符，英文为 1 个字符。示例：`{ min: 10, message: '内容长度不够' }`。<br />如果希望字母和中文都是同样的长度，示例：`{ validator: (val) => val.length >= 10, message: '内容文本长度至少为 10 个字' }`。<br />如果数据类型数字（Number），则自动变为数字大小的比对
+     */
+    min?: number | boolean;
+    /**
+     * 内置校验方法，校验值是否为数字（1.2 、 1e5  都算数字），示例：`{ number: true, message: '请输入数字' }`
+     */
+    number?: boolean;
+    /**
+     * 内置校验方法，校验值是否符合正则表达式匹配结果，示例：`{ pattern: /@qq.com/, message: '请输入 QQ 邮箱' }`
+     */
+    pattern?: RegExp;
+    /**
+     * 内置校验方法，校验值是否已经填写。该值为 true，默认显示必填标记，可通过设置 `requiredMark: false` 隐藏必填标记
+     */
+    required?: boolean;
+    /**
+     * 内置校验方法，校验值是否为手机号码，校验正则为 `/^1[3-9]\d{9}$/`，示例：`{ telnumber: true, message: '请输入正确的手机号码' }`
+     */
+    telnumber?: boolean;
+    /**
+     * 校验未通过时呈现的错误信息类型，有 告警信息提示 和 错误信息提示 等两种
+     * @default error
+     */
+    type?: "error" | "warning";
+    /**
+     * 自定义校验规则，示例：`{ validator: (val) => val.length > 0, message: '请输入内容'}`
+     */
+    validator?: CustomValidator;
+    /**
+     * 内置校验方法，校验值是否为空格。示例：`{ whitespace: true, message: '值不能为空' }`
+     */
+    whitespace?: boolean;
+}
 /** 内容区域的组件ID */
 export declare const ELEMENT_ID_MAIN_CONTENT = "__pro_main_content";
 export declare const enGBIntl: IntlType;
 export declare type Entity = Record<string, any>;
 export declare const enUSIntl: IntlType;
+declare type ErrorListObjectType = TableEditingCell & {
+    errorList: AllValidateResult[];
+};
 export declare const esESIntl: IntlType;
 export declare type EventHandler = (...args: any[]) => void;
 declare type ExpandedRowRender<ValueType> = (opt: {
@@ -5650,6 +5839,10 @@ declare class Helper<T extends DefaultRecordType> {
             type: BooleanConstructor;
             default: undefined;
         };
+        selectRowByClick: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
         expandIcon: {
             type: PropType<RenderExpandIcon<T>>;
             default: undefined;
@@ -5721,6 +5914,14 @@ declare class Helper<T extends DefaultRecordType> {
             }) => Record<string, any>>;
             default: () => {};
         };
+        editableKeys: {
+            type: PropType<ProTableKey[]>;
+            default: undefined;
+        };
+        rowEditable: {
+            type: PropType<RowEditableConfig<T>>;
+            default: undefined;
+        };
         showHeader: {
             type: BooleanConstructor;
             default: boolean;
@@ -5891,6 +6092,9 @@ declare class Helper<T extends DefaultRecordType> {
             type: BooleanConstructor;
             default: undefined;
         };
+        editableCellState: {
+            type: PropType<EditableCellType<T>>;
+        };
         paginationSticky: {
             type: PropType<boolean | BottomSticky>;
             default: boolean;
@@ -5944,6 +6148,15 @@ declare class Helper<T extends DefaultRecordType> {
             type: PropType<(opt: CellRenderArgs) => void>;
             default: undefined;
         };
+        onDataChange: {
+            type: PropType<(dataSource: T[]) => void>;
+        };
+        onRowValidate: {
+            type: PropType<(TablePromiseErrorData: any) => void>;
+        };
+        onValidate: {
+            type: PropType<(TablePromiseErrorData: any) => void>;
+        };
         "onUpdate:pagination": {
             type: PropType<(info: ProTablePaginationConfig) => void>;
         };
@@ -6124,6 +6337,9 @@ declare interface PaginationProps {
     role?: string;
     showLessItems?: boolean;
 }
+declare interface PlainObject {
+    [key: string]: any;
+}
 export declare const plPLIntl: IntlType;
 export declare const ProButton: SFCWithInstall<DefineComponent<ExtractPropTypes<{
     type: PropType<ButtonProps["type"]>;
@@ -6388,6 +6604,7 @@ export declare interface ProConfigProviderProps extends Omit<ConfigProviderProps
         cardBordered?: Bordered;
         childrenColumnName?: string;
         expandRowByClick?: boolean;
+        selectRowByClick?: boolean;
         rowKey?: string;
         size?: ProTableDensitySize;
         expandIconType?: ExpandIconType;
@@ -7075,6 +7292,12 @@ export declare interface ProTableExposeType {
     calcTableHeight: () => Promise<void>;
     formSearchSubmit: () => void;
     getSearchParams: () => Record<string, any>;
+    validateRowData: (rowValue: any) => Promise<TablePromiseErrorData>;
+    validateTableData: () => Promise<TablePromiseErrorData>;
+    addEditRecord: (recordValue?: any, options?: AddLineOptions) => false | undefined;
+    startEditable: (recordKey: ProTableKey, recordValue?: any) => boolean;
+    cancelEditable: (recordKey: ProTableKey) => boolean;
+    saveEditable: (recordKey: ProTableKey) => Promise<boolean>;
 }
 export declare type ProTableInstance = InstanceType<typeof _default_17> & ProTableExposeType;
 export declare type ProTableKey = string | number;
@@ -10517,6 +10740,34 @@ declare interface RowDragGhostArg<RecordT, ColumnT> {
     preTargetInfo: DragRowsHandleInfo | null;
     nextTargetInfo: DragRowsHandleInfo | null;
 }
+declare type RowEditableConfig<DataType> = {
+    /**
+     * @type single | multiple
+     * @name 编辑的类型，支持单选和多选
+     */
+    type?: RowEditableType;
+    /** @name 正在编辑的列 */
+    editableKeys?: ProTableKey[];
+    /** 只能编辑一行的的提示 */
+    onlyOneLineEditorAlertMessage?: string;
+    /** 同时只能新增一行的提示 */
+    onlyAddOneLineAlertMessage?: string | false;
+    /** 正在编辑的列修改的时候 */
+    onChange?: (editableKeys: ProTableKey[], editableRows: DataType[] | DataType) => void;
+    /** 行保存的时候 */
+    onSave?: (
+    /** 行 id，一般是唯一id */
+    key: ProTableKey, 
+    /** 当前修改的行的值 */
+    record: DataType & {
+        index?: number;
+    }, 
+    /** 原始值，可以用于判断是否修改 */
+    originRow: DataType & {
+        index?: number;
+    }) => Promise<any | void> | any | void;
+};
+declare type RowEditableType = "single" | "multiple";
 export declare type RowHeight = ((p: Record<any, any>, isExpandRow: boolean, baseHeight: number) => number | undefined) | number;
 declare type RowSelectionType = "checkbox" | "radio";
 export declare const ruRUIntl: IntlType;
@@ -10809,6 +11060,18 @@ declare interface TableCurrentDataSource<RecordType = DefaultRecordType> {
     currentDataSource: RecordType[];
     action: TableAction;
 }
+declare type TableEditingCell<RecordType = DefaultRecordType> = {
+    recordIndexs: number[];
+    column: ColumnType<RecordType>;
+    rowKey: ProTableKey;
+    originRecord: RecordType;
+    rowIndex: number;
+    columnKey: ProTableKey;
+    validateEdit: () => Promise<true | AllValidateResult[]>;
+};
+declare type TableErrorListMap = {
+    [key: string]: AllValidateResult[];
+};
 declare interface TableLocale {
     filterTitle?: string;
     filterConfirm?: any;
@@ -10827,6 +11090,11 @@ declare interface TableLocale {
     cancelSort?: string;
 }
 declare type TablePaginationPosition = "topLeft" | "topCenter" | "topRight" | "bottomLeft" | "bottomCenter" | "bottomRight";
+declare interface TablePromiseErrorData {
+    errors: ErrorListObjectType[];
+    errorMap: TableErrorListMap;
+    data?: DefaultRecordType[];
+}
 export declare type Theme = "default" | "custom";
 export declare type ThemeModeType = "auto" | "dark" | "light";
 declare type ThemeType = "light" | "dark";
@@ -10906,11 +11174,14 @@ export declare function useState<T, R = Ref<T>>(defaultStateValue?: T | (() => T
     (val: T) => void
 ];
 export declare const uzUZIntl: IntlType;
+declare interface ValidateResultType extends EditRule {
+    result: boolean;
+}
 declare interface ValueGetterFunc<T = any, TValue = any> {
     (params: EditableValueParams<T, TValue>): string | null | undefined;
 }
 declare interface ValueParserFunc<T = any, TValue = any> {
-    (params: ValueParserParams<T, TValue>): TValue | null | undefined;
+    (params: EditableValueParams<T, TValue>): TValue | null | undefined;
 }
 declare interface ValueParserParams<RecordType = DefaultRecordType, TValue = any> {
     newValue: TValue;

package/lib/packages/components/table/src/components/Body/BodyCell.vue.js

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var BodyCell_vue_vue_type_script_lang = require('./BodyCell.vue2.js');
+var vue = require('vue');
+var _pluginVue_exportHelper = require('../../../../../../_virtual/_plugin-vue_export-helper.js');
+
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_BodyEditCell = vue.resolveComponent("BodyEditCell");
+  const _component_BodyTextCell = vue.resolveComponent("BodyTextCell");
+  return _ctx.isEditing ? (vue.openBlock(), vue.createBlock(_component_BodyEditCell, {
+    key: _ctx.key,
+    prefixCls: _ctx.prefixCls,
+    rowIndex: _ctx.rowIndex,
+    flattenRowIndex: _ctx.flattenRowIndex,
+    rowKey: _ctx.rowKey,
+    column: _ctx.column,
+    item: _ctx.item,
+    "edit-row": _ctx.editRow,
+    "editable-keys": _ctx.editableKeys,
+    "is-row-edit": _ctx.isRowEdit
+  }, null, 8, ["prefixCls", "rowIndex", "flattenRowIndex", "rowKey", "column", "item", "edit-row", "editable-keys", "is-row-edit"])) : (vue.openBlock(), vue.createBlock(_component_BodyTextCell, vue.mergeProps({ key: 1 }, _ctx.props, {
+    style: { cursor: _ctx.editable ? "poiner" : "" },
+    onClick: _cache[0] || (_cache[0] = ($event) => _ctx.onCellEvent($event, "click")),
+    onDblClick: _cache[1] || (_cache[1] = ($event) => _ctx.onCellEvent($event, "dblClick")),
+    onContextmenu: _cache[2] || (_cache[2] = ($event) => _ctx.onCellEvent($event, "contextmenu"))
+  }), {
+    appendNode: vue.withCtx(() => [
+      vue.renderSlot(_ctx.$slots, "appendNode")
+    ]),
+    _: 3
+    /* FORWARDED */
+  }, 16, ["style"]));
+}
+var BodyCell = /* @__PURE__ */ _pluginVue_exportHelper.default(BodyCell_vue_vue_type_script_lang.default, [["render", _sfc_render]]);
+
+exports.default = BodyCell;
+//# sourceMappingURL=BodyCell.vue.js.map

package/lib/packages/components/table/src/components/Body/BodyCell.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BodyCell.vue.js","sources":["../../../../../../../../../packages/components/table/src/components/Body/BodyCell.vue"],"sourcesContent":["<!--\n * @Author: shen\n * @Date: 2023-11-09 22:29:52\n * @LastEditors: shen\n * @LastEditTime: 2025-12-02 17:16:19\n * @Description:\n-->\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport type { EditableTrigger, FinallyColumnType, Key, RowType } from '../interface'\nimport { defineComponent, computed, watch, onMounted } from 'vue'\nimport { get } from '@pro-design-vue/utils'\nimport { useInjectTable } from '../context/TableContext'\nimport { getCellKey } from '../../utils/util'\nimport BodyTextCell from './BodyTextCell'\nimport BodyEditCell from './BodyEditCell'\nexport default defineComponent({\n  inheritAttrs: false,\n  props: {\n    prefixCls: String as PropType<string>,\n    rowIndex: { type: Number as PropType<number>, required: true },\n    flattenRowIndex: { type: Number, required: true },\n    rowKey: { type: [Number, String] },\n    column: { type: Object as PropType<FinallyColumnType>, default: () => ({}) },\n    item: { type: Object as PropType<any>, default: () => ({}) },\n    wrapText: { type: Boolean as PropType<boolean>, default: false },\n    type: { type: String as PropType<RowType> },\n    height: Number as PropType<number>,\n    hasAppendNode: Boolean as PropType<boolean>,\n    resizeObserver: { type: Object as PropType<ResizeObserver> },\n    editRow: { type: Object as PropType<any> },\n    calMaxHeight: Function,\n    editCellKeys: Array as PropType<string[]>,\n    editableKeys: Array as PropType<Key[]>,\n    isRowEdit: Boolean as PropType<boolean>,\n    tooltipOpen: Boolean as PropType<boolean>,\n    getPopupContainer: Function as PropType<() => HTMLElement>,\n    onOpenEditor: Function,\n    onCloseEditor: Function,\n    onCellLeave: Function,\n    onMouseenter: Function,\n  },\n  emits: ['mouseenter', 'cellLeave'],\n  components: { BodyTextCell, BodyEditCell },\n  setup(props) {\n    const tableContext = useInjectTable()\n    const isKeepEditMode = computed(() => props.column.edit?.keepEditMode)\n    const cellValue = computed(() =>\n      props.column!.dataIndex ? get(props.item, props.column!.dataIndex) : undefined,\n    )\n\n    const key = computed(() => getCellKey(props.rowKey!, props.column.columnKey))\n\n    const cellParams = computed(() => ({\n      column: props.column,\n      record: props.isRowEdit ? props.editRow : props.item,\n      recordIndexs: tableContext.getIndexsByKey(props.rowKey!),\n      value: cellValue.value,\n    }))\n\n    const editable = computed(() => {\n      if (!props.column.edit?.component) {\n        return false\n      }\n      if (props.isRowEdit && !props.editableKeys?.includes(props.rowKey!)) {\n        return false\n      }\n      if (!props.column.edit?.editable) {\n        return true\n      }\n      const cellEditable = props.column.edit?.editable(cellParams.value)\n      return cellEditable\n    })\n\n    const isEditing = computed(() => {\n      if (props.isRowEdit) {\n        return editable.value && props.editableKeys?.includes(props.rowKey!)\n      }\n      if (!editable.value) {\n        return false\n      }\n      if (isKeepEditMode.value) {\n        return true\n      }\n      if (props.editCellKeys?.includes(key.value)) {\n        return true\n      }\n      return false\n    })\n\n    const editableTrigger = computed(() => {\n      let { editableTrigger = ['click'] } = props.column!.edit ?? {}\n      editableTrigger = Array.isArray(editableTrigger) ? editableTrigger : [editableTrigger]\n      return editableTrigger\n    })\n\n    const onCellEvent = (e: MouseEvent, trigger: EditableTrigger) => {\n      if (editable.value && editableTrigger.value?.includes(trigger) && !props.isRowEdit) {\n        openEditor()\n        closeEditor()\n        e.stopPropagation()\n        e.preventDefault()\n      }\n    }\n\n    const openEditor = () => {\n      const oldValue = props.column.edit?.valueGetter?.(cellParams.value) ?? cellValue.value\n      props.onOpenEditor?.(key.value, { [key.value]: oldValue })\n    }\n\n    const closeEditor = () => {\n      props.onCloseEditor?.(key.value)\n    }\n\n    watch(key, () => {\n      if (props.column.edit?.defaultEditable && !props.isRowEdit) {\n        openEditor()\n      }\n    })\n\n    onMounted(() => {\n      if (props.column.edit?.defaultEditable && !props.isRowEdit) {\n        openEditor()\n      }\n    })\n\n    return {\n      props,\n      key,\n      isEditing,\n      editable,\n      onCellEvent,\n    }\n  },\n})\n</script>\n\n<template>\n  <template v-if=\"isEditing\">\n    <BodyEditCell\n      :key=\"key\"\n      :prefixCls=\"prefixCls\"\n      :rowIndex=\"rowIndex\"\n      :flattenRowIndex=\"flattenRowIndex\"\n      :rowKey=\"rowKey\"\n      :column=\"column\"\n      :item=\"item\"\n      :edit-row=\"editRow\"\n      :editable-keys=\"editableKeys\"\n      :is-row-edit=\"isRowEdit\"\n    />\n  </template>\n  <template v-else>\n    <BodyTextCell\n      v-bind=\"props\"\n      :style=\"{ cursor: editable ? 'poiner' : '' }\"\n      @click=\"onCellEvent($event, 'click')\"\n      @dblClick=\"onCellEvent($event, 'dblClick')\"\n      @contextmenu=\"onCellEvent($event, 'contextmenu')\"\n    >\n      <template #appendNode>\n        <slot name=\"appendNode\" />\n      </template>\n    </BodyTextCell>\n  </template>\n</template>\n"],"names":["_openBlock","_createBlock","_mergeProps","_withCtx","_renderSlot"],"mappings":";;;;;;;;;;;AA0IkB,EAAA,OAAA,IAAA,CAAA,SAAA,IAAAA,aAAA,EAAA,EACdC,gBAWE,uBAAA,EAAA;AAAA,IAVC,KAAK,IAAA,CAAA,GAAA;AAAA,IACL,WAAW,IAAA,CAAA,SAAA;AAAA,IACX,UAAU,IAAA,CAAA,QAAA;AAAA,IACV,iBAAiB,IAAA,CAAA,eAAA;AAAA,IACjB,QAAQ,IAAA,CAAA,MAAA;AAAA,IACR,QAAQ,IAAA,CAAA,MAAA;AAAA,IACR,MAAM,IAAA,CAAA,IAAA;AAAA,IACN,YAAU,IAAA,CAAA,OAAA;AAAA,IACV,iBAAe,IAAA,CAAA,YAAA;AAAA,IACf,eAAa,IAAA,CAAA;AAAA,GAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,WAAA,EAAA,YAAA,iBAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,UAAA,EAAA,eAAA,EAAA,aAAA,CAAA,CAAA,KAAAD,aAAA,EAAA,EAIhBC,eAAA,CAUe,uBAAA,EAVfC,cAAA,CAUe,EAAA,GAAA,EAAA,CAAA,EAAA,EATL,IAAA,CAAA,KAAA,EAAK;AAAA,IACZ,OAAK,UAAY,IAAA,CAAA,QAAA,GAAQ,WAAA,EAAA,EAAA;AAAA,IACzB,OAAA,EAAK,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,MAAA,KAAE,IAAA,CAAA,WAAA,CAAY,MAAA,EAAM,OAAA,CAAA,CAAA;AAAA,IACzB,UAAA,EAAQ,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,MAAA,KAAE,IAAA,CAAA,WAAA,CAAY,MAAA,EAAM,UAAA,CAAA,CAAA;AAAA,IAC5B,aAAA,EAAW,MAAA,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,MAAA,KAAE,IAAA,CAAA,WAAA,CAAY,MAAA,EAAM,aAAA,CAAA;AAAA,GAAA,CAAA,EAAA;AAAA,IAErB,UAAA,EAAUC,YACnB,MAA0B;AAAA,MAA1BC,cAAA,CAA0B,IAAA,CAAA,MAAA,EAAA,YAAA;AAAA,KAAA,CAAA;AAAA;;;;;;;;"}

package/lib/packages/components/table/src/components/Body/BodyCell.vue2.js

@@ -0,0 +1,133 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var TableContext = require('../context/TableContext.js');
+var util = require('../../utils/util.js');
+var BodyTextCell = require('./BodyTextCell.js');
+var BodyEditCell = require('./BodyEditCell.js');
+var lodashUnified = require('lodash-unified');
+
+var _sfc_main = vue.defineComponent({
+  inheritAttrs: false,
+  props: {
+    prefixCls: String,
+    rowIndex: { type: Number, required: true },
+    flattenRowIndex: { type: Number, required: true },
+    rowKey: { type: [Number, String] },
+    column: { type: Object, default: () => ({}) },
+    item: { type: Object, default: () => ({}) },
+    wrapText: { type: Boolean, default: false },
+    type: { type: String },
+    height: Number,
+    hasAppendNode: Boolean,
+    resizeObserver: { type: Object },
+    editRow: { type: Object },
+    calMaxHeight: Function,
+    editCellKeys: Array,
+    editableKeys: Array,
+    isRowEdit: Boolean,
+    tooltipOpen: Boolean,
+    getPopupContainer: Function,
+    onOpenEditor: Function,
+    onCloseEditor: Function,
+    onCellLeave: Function,
+    onMouseenter: Function
+  },
+  emits: ["mouseenter", "cellLeave"],
+  components: { BodyTextCell: BodyTextCell.default, BodyEditCell: BodyEditCell.default },
+  setup(props) {
+    const tableContext = TableContext.useInjectTable();
+    const isKeepEditMode = vue.computed(() => {
+      var _a;
+      return (_a = props.column.edit) == null ? void 0 : _a.keepEditMode;
+    });
+    const cellValue = vue.computed(
+      () => props.column.dataIndex ? lodashUnified.get(props.item, props.column.dataIndex) : void 0
+    );
+    const key = vue.computed(() => util.getCellKey(props.rowKey, props.column.columnKey));
+    const cellParams = vue.computed(() => ({
+      column: props.column,
+      record: props.isRowEdit ? props.editRow : props.item,
+      recordIndexs: tableContext.getIndexsByKey(props.rowKey),
+      value: cellValue.value
+    }));
+    const editable = vue.computed(() => {
+      var _a, _b, _c, _d;
+      if (!((_a = props.column.edit) == null ? void 0 : _a.component)) {
+        return false;
+      }
+      if (props.isRowEdit && !((_b = props.editableKeys) == null ? void 0 : _b.includes(props.rowKey))) {
+        return false;
+      }
+      if (!((_c = props.column.edit) == null ? void 0 : _c.editable)) {
+        return true;
+      }
+      const cellEditable = (_d = props.column.edit) == null ? void 0 : _d.editable(cellParams.value);
+      return cellEditable;
+    });
+    const isEditing = vue.computed(() => {
+      var _a, _b;
+      if (props.isRowEdit) {
+        return editable.value && ((_a = props.editableKeys) == null ? void 0 : _a.includes(props.rowKey));
+      }
+      if (!editable.value) {
+        return false;
+      }
+      if (isKeepEditMode.value) {
+        return true;
+      }
+      if ((_b = props.editCellKeys) == null ? void 0 : _b.includes(key.value)) {
+        return true;
+      }
+      return false;
+    });
+    const editableTrigger = vue.computed(() => {
+      var _a;
+      let { editableTrigger: editableTrigger2 = ["click"] } = (_a = props.column.edit) != null ? _a : {};
+      editableTrigger2 = Array.isArray(editableTrigger2) ? editableTrigger2 : [editableTrigger2];
+      return editableTrigger2;
+    });
+    const onCellEvent = (e, trigger) => {
+      var _a;
+      if (editable.value && ((_a = editableTrigger.value) == null ? void 0 : _a.includes(trigger)) && !props.isRowEdit) {
+        openEditor();
+        closeEditor();
+        e.stopPropagation();
+        e.preventDefault();
+      }
+    };
+    const openEditor = () => {
+      var _a, _b, _c, _d;
+      const oldValue = (_c = (_b = (_a = props.column.edit) == null ? void 0 : _a.valueGetter) == null ? void 0 : _b.call(_a, cellParams.value)) != null ? _c : cellValue.value;
+      (_d = props.onOpenEditor) == null ? void 0 : _d.call(props, key.value, { [key.value]: oldValue });
+    };
+    const closeEditor = () => {
+      var _a;
+      (_a = props.onCloseEditor) == null ? void 0 : _a.call(props, key.value);
+    };
+    vue.watch(key, () => {
+      var _a;
+      if (((_a = props.column.edit) == null ? void 0 : _a.defaultEditable) && !props.isRowEdit) {
+        openEditor();
+      }
+    });
+    vue.onMounted(() => {
+      var _a;
+      if (((_a = props.column.edit) == null ? void 0 : _a.defaultEditable) && !props.isRowEdit) {
+        openEditor();
+      }
+    });
+    return {
+      props,
+      key,
+      isEditing,
+      editable,
+      onCellEvent
+    };
+  }
+});
+
+exports.default = _sfc_main;
+//# sourceMappingURL=BodyCell.vue2.js.map