@cloudbase/weda-ui 3.4.1 → 3.4.3

package/dist/web/components/table/FieldRender.js

@@ -0,0 +1,622 @@
+import React, { useMemo } from 'react';
+import { useMediaQuery } from '@react-hookz/web';
+import { Text, Tooltip, Modal, Table, Form } from 'tea-component';
+import { formatTimeByType } from '../../utils/date';
+import { safeJsonParse, isValueEmpty } from '../../utils/tool';
+import Location, { locationProperties } from './Form/Location';
+import { EnumView, formatEnum } from './Form/Enum';
+import { ErrorBoundary } from 'react-error-boundary';
+import UploaderView from '../uploaderView';
+import RichTextView from '../richTextView';
+import UploaderFileView from '../uploaderFileView';
+import { ViewCell } from './UserDepartment/ViewCell';
+import { QuoteModal } from './QuoteModal';
+import { TABLE_SLOT_PREFIX } from '../../utils/constant';
+const MODAL_SIZE = 'auto';
+/**
+ * 根据类型获取展示字段组件的 render 方法，用于表格/详情中的值转换
+ * extra: { modelType: 'list' | 'detail' | 'update' | 'create', showTip: boolean }
+ * 表格中的字符串/枚举数组，详情中的字符串数组会截断并showTip
+ */
+export function getFieldRender(field = {}, extra = {}) {
+    var _a;
+    const { type, format, items, properties, title } = field;
+    const { modelType, showTip = true } = extra;
+    const width = getFieldWidth(field);
+    // 文字提示框包裹组件
+    const TextWrap = showTip
+        ? ({ children }) => (React.createElement(Tooltip, { title: children },
+            React.createElement(Text, { overflow: true, style: { width } }, children)))
+        : ({ children }) => React.createElement("div", null, children);
+    // 枚举-旧，新版 TODO
+    if ((_a = field['x-enumObj']) === null || _a === void 0 ? void 0 : _a.length) {
+        const XEnumObj = (val) => {
+            if (!val)
+                return '-';
+            const item = field['x-enumObj'].find((item) => (item === null || item === void 0 ? void 0 : item.value) === val);
+            return React.createElement(TextWrap, null, (item === null || item === void 0 ? void 0 : item.label) || '-');
+        };
+        return XEnumObj;
+    }
+    // render 方法
+    const FieldRender = (val) => {
+        if (isValueEmpty(val) || (type === 'array' && !(val === null || val === void 0 ? void 0 : val.length))) {
+            return '-';
+        }
+        // fieldValue 值转换，如布尔/时间/枚举等
+        let fieldValue = val;
+        // 图片 render 方法
+        const xImageRender = (val) => (React.createElement("div", { className: `${modelType === 'table' ? 'table-data-item-value' : ''}` },
+            React.createElement(UploaderView, { isEmptyPlace: false, srcList: val, height: 60, width: 60, gutter: 6 })));
+        // 地理位置 Render方法
+        const xLocationRender = (val, modelType, isInArray = false) => {
+            var _a;
+            if (isInArray) {
+                const value = val === null || val === void 0 ? void 0 : val.reduce((prev, curr) => {
+                    const { address, longitude, latitude } = formatLocationData(curr).meta;
+                    prev.push({
+                        address,
+                        longitude,
+                        latitude,
+                    });
+                    return prev;
+                }, []);
+                const locationField = {
+                    ...field,
+                    items: {
+                        ...items,
+                        properties: locationProperties,
+                    },
+                };
+                return (React.createElement(ArrayComponent, { value: value, modelType: modelType, field: locationField, items: items }));
+            }
+            if (modelType === 'table') {
+                const content = (_a = formatLocationData(val)) === null || _a === void 0 ? void 0 : _a.flatContent;
+                return React.createElement(TextWrap, null, content);
+            }
+            else {
+                return React.createElement(Location, { readonly: true, value: val });
+            }
+        };
+        if (type === 'string') {
+            if (format === 'x-rtf') {
+                // 富文本
+                const showRichText = (val) => {
+                    const modal = Modal.show({
+                        className: 'e-rich-text-view-modal',
+                        caption: '内容展示',
+                        size: MODAL_SIZE,
+                        onClose: () => modal.destroy(),
+                        children: React.createElement(RichTextView, { value: val }),
+                    });
+                };
+                fieldValue = JSON.stringify(val);
+                return modelType === 'detail' ? (React.createElement(RichTextView, { value: fieldValue })) : (React.createElement("a", { onClick: () => showRichText(fieldValue) }, "\u8BE6\u60C5"));
+            }
+            else if (format === 'x-image') {
+                // 图片
+                return xImageRender(fieldValue);
+            }
+            else if (format === 'x-file') {
+                // 文件
+                return (React.createElement(UploaderFileView, { value: fieldValue, single: (extra === null || extra === void 0 ? void 0 : extra.modelType) !== 'detail' }));
+            }
+            else if (isShowOrgsView(field, modelType)) {
+                return (React.createElement(ViewCell, { data: fieldValue, showType: modelType, 
+                    // type={field['x-parent']?.parentDataSourceName === 'sys_department' ? 'org' : 'user'}
+                    relation: extra === null || extra === void 0 ? void 0 : extra.relation }));
+            }
+            else if (format === 'x-enum') {
+                // 枚举（新）
+                return (React.createElement(TextWrap, null,
+                    React.createElement(EnumView, { field: field, values: val })));
+            }
+            else if (format === 'url') {
+                // 网址
+                return (React.createElement("a", { target: "_blank", href: fieldValue, rel: "noreferrer" },
+                    React.createElement(TextWrap, null, fieldValue)));
+            }
+            else {
+                return React.createElement(TextWrap, null, fieldValue);
+            }
+        }
+        else if (type === 'number') {
+            fieldValue = formatNumber(val, field);
+            return React.createElement(Text, null, fieldValue);
+        }
+        else if (type === 'boolean') {
+            fieldValue = formatBoolean(val);
+            return React.createElement(Text, null, fieldValue);
+        }
+        else if (type === 'object') {
+            const objectRender = ({ value, modelType, fields }) => {
+                if (typeof val === 'object') {
+                    return (React.createElement(DataItemView, { value: value, modelType: modelType, fields: fields }));
+                }
+                return React.createElement(TextWrap, null, value);
+            };
+            fieldValue = safeJsonParse(val);
+            if ((field === null || field === void 0 ? void 0 : field.format) === 'x-location') {
+                return xLocationRender(fieldValue, modelType);
+            }
+            else if (modelType === 'detail') {
+                return objectRender({
+                    value: fieldValue,
+                    modelType: 'detail',
+                    fields: properties,
+                });
+            }
+            else {
+                return (React.createElement(QuoteModal, { className: "e-object-view-modal", caption: title, size: "90%" }, objectRender({
+                    value: val,
+                    modelType: { modelType },
+                    fields: properties,
+                })));
+            }
+        }
+        else if (type === 'array') {
+            if (field.name === '_departmentList' &&
+                ['table', 'detail'].includes(modelType)) {
+                return React.createElement(TextWrap, null, val || '-');
+            }
+            if (format === 'x-enum') {
+                // 枚举（新）
+                return (React.createElement(TextWrap, null,
+                    React.createElement(EnumView, { field: field, values: val })));
+            }
+            else if ((items === null || items === void 0 ? void 0 : items.format) === 'x-location') {
+                // 地理位置
+                return xLocationRender(fieldValue, modelType, true);
+            }
+            else if ((items === null || items === void 0 ? void 0 : items.format) === 'x-image') {
+                // 图片数组
+                return xImageRender(fieldValue);
+            }
+            else if ((items === null || items === void 0 ? void 0 : items.format) === 'x-file' && (extra === null || extra === void 0 ? void 0 : extra.modelType) === 'detail') {
+                // 文件数组，在详情页和表格页展示不同
+                return React.createElement(UploaderFileView, { value: fieldValue, single: false });
+            }
+            else {
+                fieldValue = safeJsonParse(val);
+                return (React.createElement(ArrayComponent, { value: fieldValue, field: field, modelType: modelType, items: items }));
+            }
+        }
+        return React.createElement("span", null, JSON.stringify(fieldValue));
+    };
+    return FieldRender;
+}
+/**
+ * object类型，展示表单组件
+ */
+export const DataItemView = ({ fields, modelType, value }) => {
+    const isH5 = useMediaQuery('(max-width: 1024px)');
+    return (React.createElement(Form, { readonly: true, className: isH5 ? 'tea-form--vertical' : '' }, Object.entries(fields).map(([key, field]) => {
+        const fieldRender = getFieldRender(field, {
+            showTip: false,
+            modelType,
+        });
+        return (React.createElement(Form.Item, { label: field.title, key: key },
+            React.createElement(Form.Text, null, fieldRender(value === null || value === void 0 ? void 0 : value[(field === null || field === void 0 ? void 0 : field.name) || key]))));
+    })));
+};
+/**
+ * object，展示表格组件
+ */
+export const DataTableView = ({ fields, value }) => {
+    const columns = useMemo(() => {
+        const rawFields = Object.entries(fields.properties).map(([name, field]) => Object.assign({}, field, { name }));
+        const rawFieldsSort = rawFields.sort((a, b) => a['x-index'] - b['x-index']);
+        const baseColumns = getColumns(rawFieldsSort);
+        return baseColumns;
+    }, [fields]);
+    return (React.createElement(Table, { bordered: "all", recordKey: "_id", records: [].concat(value), columns: columns }));
+};
+/**
+ * array类型，展示组件
+ */
+const ArrayComponent = ({ items, modelType, value, field }) => {
+    const isH5 = useMediaQuery('(max-width: 1024px)');
+    // PC端 数组嵌套子对象时，显示为表格
+    if (items.type === 'object' && !isH5) {
+        if (modelType === 'detail') {
+            return React.createElement(DataTableView, { value: value, fields: field.items });
+        }
+        return (React.createElement(QuoteModal, { className: "e-array-view-modal", caption: field.title, size: MODAL_SIZE },
+            React.createElement(DataTableView, { value: value, fields: field.items })));
+    }
+    // H5端或不为嵌套对象时，循环渲染字段
+    return (React.createElement("div", null, Array.isArray(value) &&
+        (value === null || value === void 0 ? void 0 : value.map((item, index) => {
+            const itemRender = getFieldRender(items, { modelType });
+            return (React.createElement("div", { className: "field-array-item", key: index }, itemRender(item)));
+        }))));
+};
+/**
+ * 转换数字类型
+ */
+export const formatNumber = (value, field) => {
+    let newValue = value;
+    try {
+        if (['date', 'time', 'datetime'].includes(field === null || field === void 0 ? void 0 : field.format) &&
+            typeof value === 'number') {
+            newValue = formatTimeByType(field === null || field === void 0 ? void 0 : field.format, value, field);
+        }
+        else {
+            newValue = formatNumberFix(value, field, true);
+        }
+    }
+    catch (e) { }
+    return newValue;
+};
+/**
+ * 转换布尔值类型
+ */
+export const formatBoolean = (value) => {
+    let newValue = value;
+    try {
+        if (typeof value === 'boolean') {
+            newValue = value ? '是' : '否';
+        }
+        else {
+            newValue = value;
+        }
+    }
+    catch (e) { }
+    return newValue;
+};
+/**
+ * 地理位置格式服务端数据转换
+ * @param {*} location
+ * @returns
+ */
+export const formatLocationData = (location) => {
+    const { address, geopoint } = location || {};
+    const [longitude, latitude] = (geopoint === null || geopoint === void 0 ? void 0 : geopoint.coordinates) || [];
+    const content = address ? `${address}（${latitude},${longitude}）` : '-';
+    return {
+        meta: { address, longitude, latitude },
+        flatContent: content,
+    };
+};
+/**
+ * 数字类型-有小数点时补齐0
+ * 值不为数字时原值返回，补齐 0 时返回 string，否则返回 number
+ */
+export const formatNumberFix = (val, field, setZero = false) => {
+    const num = parseFloat(`${val}`);
+    if (isNaN(num)) {
+        return val;
+    }
+    if (typeof (field === null || field === void 0 ? void 0 : field.numberCount) === 'number') {
+        const numFix = num.toFixed(field === null || field === void 0 ? void 0 : field.numberCount);
+        return setZero ? numFix : parseFloat(numFix);
+    }
+    return num;
+};
+/**
+ * 根据 fields 信息生成 column
+ * h5 和 pc 部分参数不同
+ */
+export const getColumns = (fields, isH5) => fields.map((item) => formatFieldToColumn(item, isH5));
+/**
+ * 根据 field 属性，生成 column 配置
+ * https://git.woa.com/QBase/lcap/common-application-specs/blob/master/types/platform/datasource.ts
+ */
+export const formatFieldToColumn = (field, isH5) => {
+    const { name, title } = field;
+    // 计算列宽度，略大于计算宽度
+    const width = getFieldWidth(field) + 10;
+    // 处理渲染错误
+    const render = (record) => {
+        const extra = isH5
+            ? { modelType: 'table-h5', showTip: false, relation: record[`@${name}`] }
+            : { modelType: 'table', relation: record[`@${name}`] };
+        const value = getFieldValue(name, record);
+        const component = getFieldRender(field, extra)(value);
+        return (React.createElement(ErrorBoundary, { FallbackComponent: () => React.createElement("span", { className: "" }, "\u274C \u6570\u636E\u5F02\u5E38") }, component));
+    };
+    return { width, render, key: name, header: title, align: 'left', fixed: '' };
+};
+// 计算 field 占据的宽度
+export const getFieldWidth = (field) => {
+    var _a;
+    const TypeFormatWidthMap = {
+        string: {
+            default: 150,
+            'x-image': 100,
+            'x-file': 150,
+        },
+        number: {
+            datetime: 200,
+            date: 150,
+            default: 150,
+        },
+        boolean: {
+            default: 100,
+        },
+        object: {
+            default: 60,
+        },
+        array: {
+            default: 120,
+            'x-image': 230,
+            'x-file': 150,
+        },
+    };
+    const { title = '', type = '', format = '', items } = field;
+    // 按名称列宽度
+    const nameWidth = title.length * 25;
+    // 按类型列宽度
+    const typeWidth = ((_a = TypeFormatWidthMap === null || TypeFormatWidthMap === void 0 ? void 0 : TypeFormatWidthMap[type]) === null || _a === void 0 ? void 0 : _a[format || (items === null || items === void 0 ? void 0 : items.format) || 'default']) || 0;
+    // 最终宽度
+    const width = typeWidth
+        ? Math.max(nameWidth, typeWidth)
+        : Math.max(nameWidth, 120);
+    return width;
+};
+/**
+ * https://tcloud-dev.oa.com/document/product/1505/58791?!preview&!document=1
+ * @param  {[String]} processHold [占有： object， 存在， 被有一个流程拥有， 置灰]
+ * @param  {[String]} lock [锁定： 没有那个字段 空字符串， 有值就锁定， 置灰]
+ */
+export const isProcessHoldOrLocked = (processHold, lock) => {
+    let isProcessHold = false;
+    if (processHold && typeof processHold === 'object') {
+        const keys = Object.keys(processHold);
+        if (keys === null || keys === void 0 ? void 0 : keys.length) {
+            isProcessHold = true;
+        }
+    }
+    return isProcessHold || !!lock;
+};
+export const isShowOrgsView = (field, modelType) => {
+    var _a;
+    const { format } = field;
+    return (format === 'father-son' &&
+        !field['x-system'] &&
+        ['sys_department', 'sys_user'].includes((_a = field['x-parent']) === null || _a === void 0 ? void 0 : _a.parentDataSourceName) &&
+        ['table', 'detail', 'table-h5'].includes(modelType));
+};
+/**
+ * 导出数据格式转换
+ * 目前 number/boolean/x-enum/x-location 会被转换
+ */
+export const formatDataToExport = (datas, fields, enumOptions = {}) => {
+    var _a, _b, _c, _d, _e, _f;
+    if (isValueEmpty(datas) || isValueEmpty(fields)) {
+        return datas;
+    }
+    // 数组
+    if (Array.isArray(datas)) {
+        return datas.map((item) => formatDataToExport(item, fields));
+    }
+    // 对象
+    if (typeof datas === 'object') {
+        const newDatas = {};
+        for (const field of fields) {
+            const key = field === null || field === void 0 ? void 0 : field.name;
+            const zhTitle = (field === null || field === void 0 ? void 0 : field.title) || key;
+            const data = datas[key];
+            if ((_a = field['x-enumObj']) === null || _a === void 0 ? void 0 : _a.length) {
+                // 枚举-旧
+                const item = field['x-enumObj'].find((item) => (item === null || item === void 0 ? void 0 : item.value) === data);
+                newDatas[zhTitle] = (item === null || item === void 0 ? void 0 : item.label) || (item === null || item === void 0 ? void 0 : item.value);
+            }
+            else {
+                switch (field === null || field === void 0 ? void 0 : field.type) {
+                    case 'string':
+                        newDatas[zhTitle] = data;
+                        if ((field === null || field === void 0 ? void 0 : field.format) === 'x-enum') {
+                            newDatas[zhTitle] = formatEnum(data, field, enumOptions);
+                        }
+                        break;
+                    case 'number':
+                        newDatas[zhTitle] = formatNumber(data, field);
+                        break;
+                    case 'boolean':
+                        newDatas[zhTitle] = formatBoolean(data);
+                        break;
+                    case 'object':
+                        if ((field === null || field === void 0 ? void 0 : field.format) === 'x-location') {
+                            newDatas[zhTitle] = (_b = formatLocationData(data)) === null || _b === void 0 ? void 0 : _b.flatContent;
+                        }
+                        else {
+                            newDatas[zhTitle] = formatDataToExport(data, Object.values((field === null || field === void 0 ? void 0 : field.properties) || {}));
+                        }
+                        break;
+                    case 'array':
+                        if (((_c = field === null || field === void 0 ? void 0 : field.items) === null || _c === void 0 ? void 0 : _c.type) === 'object') {
+                            newDatas[zhTitle] = formatDataToExport([].concat(data), Object.values(((_d = field === null || field === void 0 ? void 0 : field.items) === null || _d === void 0 ? void 0 : _d.properties) || {}));
+                        }
+                        else if (((_e = field === null || field === void 0 ? void 0 : field.items) === null || _e === void 0 ? void 0 : _e.type) === 'number') {
+                            newDatas[zhTitle] = []
+                                .concat(data)
+                                .map((d) => formatNumber(d, field === null || field === void 0 ? void 0 : field.items));
+                        }
+                        else if (((_f = field === null || field === void 0 ? void 0 : field.items) === null || _f === void 0 ? void 0 : _f.type) === 'boolean') {
+                            newDatas[zhTitle] = [].concat(data).map((d) => formatBoolean(d));
+                        }
+                        else if ((field === null || field === void 0 ? void 0 : field.format) === 'x-enum') {
+                            newDatas[zhTitle] = formatEnum(data, field, enumOptions);
+                        }
+                        else if (field.name === '_departmentList') {
+                            newDatas[zhTitle] = getFieldValue('_departmentList', datas);
+                        }
+                        else {
+                            newDatas[zhTitle] = data;
+                        }
+                        break;
+                    default:
+                        newDatas[zhTitle] = data;
+                }
+            }
+        }
+        return newDatas;
+    }
+    return datas;
+};
+/**
+ * 导出数据为xlsx库接受的格式
+ * [[title1, title2], [value1, value2], [value1, value2]]
+ */
+export const formatDataToXlsx = (datas, fields, enumOptions = {}) => {
+    const getCellValue = (data, field) => {
+        const key = field === null || field === void 0 ? void 0 : field.name;
+        const value = data === null || data === void 0 ? void 0 : data[key];
+        if (value === undefined)
+            return value;
+        const dataProcessed = formatDataToExport(data, [{ ...field, title: key }], enumOptions);
+        let valueProcessed = dataProcessed[key];
+        if (field.type === 'object') {
+            // 对象字段，展示成 json 格式
+            valueProcessed = JSON.stringify(valueProcessed);
+            valueProcessed = valueProcessed === '{}' ? undefined : valueProcessed;
+        }
+        else if (field.type === 'array') {
+            // 数组字段，以;隔开，元素展示成 json 格式
+            valueProcessed = []
+                .concat(valueProcessed)
+                .map((d) => (typeof d === 'object' ? JSON.stringify(d) : d))
+                .join(';');
+            valueProcessed = valueProcessed === '' ? undefined : valueProcessed;
+        }
+        // 值数字格式转为字符串
+        if (typeof valueProcessed === 'number') {
+            valueProcessed = `${valueProcessed}`;
+        }
+        return valueProcessed;
+    };
+    if (isValueEmpty(datas) || isValueEmpty(fields))
+        return [[]];
+    const head = fields.map((field) => field === null || field === void 0 ? void 0 : field.title);
+    const rows = datas.map((data) => {
+        const row = fields.map((field) => getCellValue(data, field));
+        return row;
+    });
+    return [].concat([head], rows);
+};
+/**
+ * 生成搜索配置
+ * 1、过滤不支持搜索的字段，时间字段不支持
+ * 2、生成配置
+ * 3、枚举/数字需要特殊处理
+ */
+export const getSearchAttributes = (fields) => fields
+    .filter((field) => {
+    // 不支持搜索的类型
+    if (field.type === 'array' || field.type === 'object')
+        return false;
+    if (['time', 'date', 'datetime'].includes(field.format))
+        return false;
+    if (field['x-parent'])
+        return false;
+    return true;
+})
+    .map((field) => {
+    var _a;
+    const inputTypes = ['string', 'number'];
+    const config = {
+        fieldType: field.type,
+        format: field.format,
+        type: (inputTypes === null || inputTypes === void 0 ? void 0 : inputTypes.includes(field.type)) ? 'input' : 'single',
+        key: field.name,
+        name: field.title,
+    };
+    if (field.type === 'boolean') {
+        config.type = 'single';
+        config.values = [
+            { key: true, name: '是' },
+            { key: false, name: '否' },
+        ];
+    }
+    // 枚举-旧，新版TODO
+    if ((_a = field['x-enumObj']) === null || _a === void 0 ? void 0 : _a.length) {
+        config.values = field['x-enumObj'].map((enumItem) => ({
+            key: enumItem === null || enumItem === void 0 ? void 0 : enumItem.value,
+            name: enumItem === null || enumItem === void 0 ? void 0 : enumItem.label,
+        }));
+        config.type = 'single';
+        config.format = 'x-enum';
+    }
+    return config;
+});
+export const getFieldValue = (name, record) => {
+    var _a;
+    if (name === '_departmentList')
+        return (((_a = record === null || record === void 0 ? void 0 : record['##SHOW']) === null || _a === void 0 ? void 0 : _a._departmentList) || []).join(',');
+    return record[name];
+};
+export const slotRender = (slot, props = {}) => typeof slot === 'function' ? slot(props) : slot;
+/**
+ * 根据列管理，过滤表格列信息
+ * columns: { key, header, width, align, render,fixed }[] Tea Table 的列
+ * columnSets: { key, header, width, align, genre,fixed }[] 模型表格列管理属性，过滤 key 为空
+ * slots: object 模型表格作用域插槽
+ * isH5: 判断自定义插槽列能否展示，目前是正常展示
+ */
+export const filterCustomColumns = ({ columns, columnSets, slots }) => {
+    if (!Array.isArray(columnSets))
+        return columns;
+    const columnsMap = columns.reduce((acc, item) => {
+        acc[item.key] = item;
+        return acc;
+    }, {});
+    return columnSets
+        .filter((item1) => (item1 === null || item1 === void 0 ? void 0 : item1.key) && columnsMap[item1.key])
+        .map((item2) => {
+        const { key, header, genre, fixed } = item2;
+        // 拿到自定义列属性值
+        const customColumn = { ...columnsMap[key], key, header, fixed };
+        if (genre === 'slot') {
+            // 拿到列对应的插槽
+            const slot = slots[`${TABLE_SLOT_PREFIX}${key}`];
+            customColumn.render = (record, rowKey, recordIndex, column, columnIndex) => slotRender(slot, {
+                record,
+                rowKey,
+                recordIndex,
+                column,
+                columnIndex,
+            });
+        }
+        return customColumn;
+    });
+};
+/**
+ * 过滤字段列表
+ * 导出/搜索框，不展示自定义列
+ */
+export const filterCustomFields = ({ fields, columnSets }) => {
+    if (!Array.isArray(fields))
+        return [];
+    if (!Array.isArray(columnSets))
+        return fields;
+    const fieldsMap = Object.fromEntries(fields.map((item) => [item.name, item]));
+    return columnSets
+        .filter((item1) => (item1 === null || item1 === void 0 ? void 0 : item1.key) && fieldsMap[item1.key] && (item1 === null || item1 === void 0 ? void 0 : item1.genre) !== 'slot')
+        .map((item2) => ({ ...fieldsMap[item2.key], title: item2.header }));
+};
+/**
+ * 列管理加入冻结属性
+ */
+export const getFixedColumnSets = ({ fixedFront = '', fixedEnd = '', columnSets, }) => {
+    if (!Array.isArray(columnSets))
+        return columnSets;
+    const fixedFrontIndex = columnSets.findIndex((item) => (item === null || item === void 0 ? void 0 : item.key) && item.key.length > 0 && item.key === fixedFront);
+    const fixedEndIndex = columnSets.findIndex((item) => (item === null || item === void 0 ? void 0 : item.key) && item.key.length > 0 && item.key === fixedEnd);
+    return Array.isArray(columnSets)
+        ? columnSets.map((item, index) => {
+            // 当冻结尾列在冻结前列之后时，冻结尾列属性才生效
+            if (fixedEndIndex >= 0 &&
+                fixedEndIndex > fixedFrontIndex &&
+                index >= fixedEndIndex) {
+                return { ...item, fixed: 'right' };
+            }
+            else if (fixedFrontIndex >= 0 && index <= fixedFrontIndex) {
+                return { ...item, fixed: 'left' };
+            }
+            else {
+                return { ...item, fixed: '' };
+            }
+        })
+        : [];
+};