@blueking/vxe-table/lib/table/render/index.js

一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...

"use strict";

var _vue = require("vue");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _util = require("../../table/src/util");
var _utils = require("../../ui/src/utils");
var _vn = require("../../ui/src/vn");
var _log = require("../../ui/src/log");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const {
  getConfig,
  renderer,
  getI18n
} = _ui.VxeUI;
const componentDefaultModelProp = 'modelValue';
const defaultCompProps = {};
function handleDefaultValue(value, defaultVal, initVal) {
  return _xeUtils.default.eqNull(value) ? _xeUtils.default.eqNull(defaultVal) ? initVal : defaultVal : value;
}
function parseDate(value, props) {
  return value && props.valueFormat ? _xeUtils.default.toStringDate(value, props.valueFormat) : value;
}
function getFormatDate(value, props, defaultFormat) {
  const {
    dateConfig = {}
  } = props;
  return _xeUtils.default.toDateString(parseDate(value, props), dateConfig.labelFormat || defaultFormat);
}
function getLabelFormatDate(value, props) {
  return getFormatDate(value, props, getI18n(`vxe.input.date.labelFormat.${props.type || 'date'}`));
}
/**
 * 已废弃
 * @deprecated
 */
function getOldComponentName(name) {
  return `vxe-${name.replace('$', '')}`;
}
function getDefaultComponent({
  name
}) {
  return (0, _vue.resolveComponent)(name);
}
/**
 * 已废弃
 * @deprecated
 */
function getOldComponent({
  name
}) {
  return (0, _vue.resolveComponent)(getOldComponentName(name));
}
function handleConfirmFilter(params, checked, option) {
  const {
    $panel
  } = params;
  $panel.changeOption({}, checked, option);
}
function getNativeAttrs(renderOpts) {
  let {
    name,
    attrs
  } = renderOpts;
  if (name === 'input') {
    attrs = Object.assign({
      type: 'text'
    }, attrs);
  }
  return attrs;
}
function getInputImmediateModel(renderOpts) {
  const {
    name,
    immediate,
    props
  } = renderOpts;
  if (!immediate) {
    if (name === 'VxeInput' || name === '$input') {
      const {
        type
      } = props || {};
      return !(!type || type === 'text' || type === 'number' || type === 'integer' || type === 'float');
    }
    if (name === 'input' || name === 'textarea' || name === '$textarea') {
      return false;
    }
    return true;
  }
  return immediate;
}
function getCellEditProps(renderOpts, params, value, defaultProps) {
  return _xeUtils.default.assign({
    immediate: getInputImmediateModel(renderOpts)
  }, defaultCompProps, defaultProps, renderOpts.props, {
    [componentDefaultModelProp]: value
  });
}
function getCellEditFilterProps(renderOpts, params, value, defaultProps) {
  return _xeUtils.default.assign({}, defaultCompProps, defaultProps, renderOpts.props, {
    [componentDefaultModelProp]: value
  });
}
function isImmediateCell(renderOpts, params) {
  return params.$type === 'cell' || getInputImmediateModel(renderOpts);
}
function getCellLabelVNs(renderOpts, params, cellLabel) {
  const {
    placeholder
  } = renderOpts;
  return [(0, _vue.h)('span', {
    class: 'vxe-cell--label'
  }, placeholder && (0, _utils.isEmptyValue)(cellLabel) ? [(0, _vue.h)('span', {
    class: 'vxe-cell--placeholder'
  }, (0, _utils.formatText)((0, _utils.getFuncText)(placeholder), 1))] : (0, _utils.formatText)(cellLabel, 1))];
}
/**
 * 原生事件处理
 * @param renderOpts
 * @param params
 * @param modelFunc
 * @param changeFunc
 */
function getNativeElementOns(renderOpts, params, modelFunc, changeFunc) {
  const {
    events
  } = renderOpts;
  const modelEvent = (0, _vn.getModelEvent)(renderOpts);
  const changeEvent = (0, _vn.getChangeEvent)(renderOpts);
  const isSameEvent = changeEvent === modelEvent;
  const ons = {};
  if (events) {
    _xeUtils.default.objectEach(events, (func, key) => {
      ons[(0, _vn.getOnName)(key)] = function (...args) {
        func(params, ...args);
      };
    });
  }
  if (modelFunc) {
    ons[(0, _vn.getOnName)(modelEvent)] = function (targetEvnt) {
      modelFunc(targetEvnt);
      if (isSameEvent && changeFunc) {
        changeFunc(targetEvnt);
      }
      if (events && events[modelEvent]) {
        events[modelEvent](params, targetEvnt);
      }
    };
  }
  if (!isSameEvent && changeFunc) {
    ons[(0, _vn.getOnName)(changeEvent)] = function (...args) {
      changeFunc(...args);
      if (events && events[changeEvent]) {
        events[changeEvent](params, ...args);
      }
    };
  }
  return ons;
}
/**
 * 组件事件处理
 * @param renderOpts
 * @param params
 * @param modelFunc
 * @param changeFunc
 */
function getComponentOns(renderOpts, params, modelFunc, changeFunc) {
  const {
    events
  } = renderOpts;
  const modelEvent = (0, _vn.getModelEvent)(renderOpts);
  const changeEvent = (0, _vn.getChangeEvent)(renderOpts);
  const ons = {};
  _xeUtils.default.objectEach(events, (func, key) => {
    ons[(0, _vn.getOnName)(key)] = function (...args) {
      if (process.env.NODE_ENV === 'development') {
        if (!_xeUtils.default.isFunction(func)) {
          (0, _log.errLog)('vxe.error.errFunc', [func]);
        }
      }
      func(params, ...args);
    };
  });
  if (modelFunc) {
    ons[(0, _vn.getOnName)(modelEvent)] = function (targetEvnt) {
      modelFunc(targetEvnt);
      if (events && events[modelEvent]) {
        events[modelEvent](params, targetEvnt);
      }
    };
  }
  if (changeFunc) {
    ons[(0, _vn.getOnName)(changeEvent)] = function (...args) {
      changeFunc(...args);
      if (events && events[changeEvent]) {
        events[changeEvent](params, ...args);
      }
    };
  }
  return ons;
}
function getEditOns(renderOpts, params) {
  const {
    $table,
    row,
    column
  } = params;
  const {
    name
  } = renderOpts;
  const {
    model
  } = column;
  const isImmediate = isImmediateCell(renderOpts, params);
  return getComponentOns(renderOpts, params, cellValue => {
    // 处理 model 值双向绑定
    model.update = true;
    model.value = cellValue;
    if (isImmediate) {
      (0, _util.setCellValue)(row, column, cellValue);
    }
  }, eventParams => {
    // 处理 change 事件相关逻辑
    if (!isImmediate && ['VxeInput', 'VxeNumberInput', 'VxeTextarea', '$input', '$textarea'].includes(name)) {
      const cellValue = eventParams.value;
      model.update = true;
      model.value = cellValue;
      $table.updateStatus(params, cellValue);
    } else {
      $table.updateStatus(params);
    }
  });
}
function getFilterOns(renderOpts, params, option) {
  return getComponentOns(renderOpts, params, value => {
    // 处理 model 值双向绑定
    option.data = value;
  }, () => {
    handleConfirmFilter(params, !_xeUtils.default.eqNull(option.data), option);
  });
}
function getNativeEditOns(renderOpts, params) {
  const {
    $table,
    row,
    column
  } = params;
  const {
    model
  } = column;
  return getNativeElementOns(renderOpts, params, evnt => {
    // 处理 model 值双向绑定
    const cellValue = evnt.target.value;
    if (isImmediateCell(renderOpts, params)) {
      (0, _util.setCellValue)(row, column, cellValue);
    } else {
      model.update = true;
      model.value = cellValue;
    }
  }, evnt => {
    // 处理 change 事件相关逻辑
    const cellValue = evnt.target.value;
    $table.updateStatus(params, cellValue);
  });
}
function getNativeFilterOns(renderOpts, params, option) {
  return getNativeElementOns(renderOpts, params, evnt => {
    // 处理 model 值双向绑定
    option.data = evnt.target.value;
  }, () => {
    handleConfirmFilter(params, !_xeUtils.default.eqNull(option.data), option);
  });
}
/**
 * 单元格可编辑渲染-原生的标签
 * input、textarea、select
 */
function nativeEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const {
    name
  } = renderOpts;
  const cellValue = isImmediateCell(renderOpts, params) ? (0, _util.getCellValue)(row, column) : column.model.value;
  return [(0, _vue.h)(name, Object.assign(Object.assign(Object.assign({
    class: `vxe-default-${name}`
  }, getNativeAttrs(renderOpts)), {
    value: cellValue
  }), getNativeEditOns(renderOpts, params)))];
}
function buttonCellRender(renderOpts, params) {
  return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))];
}
function defaultEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))];
}
function radioAndCheckboxEditRender(renderOpts, params) {
  const {
    options
  } = renderOpts;
  const {
    row,
    column
  } = params;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({
    options
  }, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))];
}
/**
 * 已废弃
 * @deprecated
 */
function oldEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getOldComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue)), getEditOns(renderOpts, params)))];
}
/**
 * 已废弃
 * @deprecated
 */
function oldButtonEditRender(renderOpts, params) {
  return [(0, _vue.h)((0, _vue.resolveComponent)('vxe-button'), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))];
}
/**
 * 已废弃
 * @deprecated
 */
function oldButtonsEditRender(renderOpts, params) {
  return renderOpts.children.map(childRenderOpts => oldButtonEditRender(childRenderOpts, params)[0]);
}
function renderNativeOptgroups(renderOpts, params, renderOptionsMethods) {
  const {
    optionGroups,
    optionGroupProps = {}
  } = renderOpts;
  const groupOptions = optionGroupProps.options || 'options';
  const groupLabel = optionGroupProps.label || 'label';
  return optionGroups.map((group, gIndex) => {
    return (0, _vue.h)('optgroup', {
      key: gIndex,
      label: group[groupLabel]
    }, renderOptionsMethods(group[groupOptions], renderOpts, params));
  });
}
/**
 * 渲染原生的 option 标签
 */
function renderNativeOptions(options, renderOpts, params) {
  const {
    optionProps = {}
  } = renderOpts;
  const {
    row,
    column
  } = params;
  const labelProp = optionProps.label || 'label';
  const valueProp = optionProps.value || 'value';
  const disabledProp = optionProps.disabled || 'disabled';
  const cellValue = isImmediateCell(renderOpts, params) ? (0, _util.getCellValue)(row, column) : column.model.value;
  return options.map((option, oIndex) => {
    return (0, _vue.h)('option', {
      key: oIndex,
      value: option[valueProp],
      disabled: option[disabledProp],
      /* eslint-disable eqeqeq */
      selected: option[valueProp] == cellValue
    }, option[labelProp]);
  });
}
function nativeFilterRender(renderOpts, params) {
  const {
    column
  } = params;
  const {
    name
  } = renderOpts;
  const attrs = getNativeAttrs(renderOpts);
  return column.filters.map((option, oIndex) => {
    return (0, _vue.h)(name, Object.assign(Object.assign(Object.assign({
      key: oIndex,
      class: `vxe-default-${name}`
    }, attrs), {
      value: option.data
    }), getNativeFilterOns(renderOpts, params, option)));
  });
}
function defaultFilterRender(renderOpts, params) {
  const {
    column
  } = params;
  return column.filters.map((option, oIndex) => {
    const optionValue = option.data;
    return (0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({
      key: oIndex
    }, getCellEditFilterProps(renderOpts, renderOpts, optionValue)), getFilterOns(renderOpts, params, option)));
  });
}
/**
 * 已废弃
 * @deprecated
 */
function oldFilterRender(renderOpts, params) {
  const {
    column
  } = params;
  return column.filters.map((option, oIndex) => {
    const optionValue = option.data;
    return (0, _vue.h)(getOldComponent(renderOpts), Object.assign(Object.assign({
      key: oIndex
    }, getCellEditFilterProps(renderOpts, renderOpts, optionValue)), getFilterOns(renderOpts, params, option)));
  });
}
function handleFilterMethod({
  option,
  row,
  column
}) {
  const {
    data
  } = option;
  const cellValue = _xeUtils.default.get(row, column.field);
  /* eslint-disable eqeqeq */
  return cellValue == data;
}
function handleInputFilterMethod({
  option,
  row,
  column
}) {
  const {
    data
  } = option;
  const cellValue = _xeUtils.default.get(row, column.field);
  /* eslint-disable eqeqeq */
  return _xeUtils.default.toValueString(cellValue).indexOf(data) > -1;
}
function nativeSelectEditRender(renderOpts, params) {
  return [(0, _vue.h)('select', Object.assign(Object.assign({
    class: 'vxe-default-select'
  }, getNativeAttrs(renderOpts)), getNativeEditOns(renderOpts, params)), renderOpts.optionGroups ? renderNativeOptgroups(renderOpts, params, renderNativeOptions) : renderNativeOptions(renderOpts.options, renderOpts, params))];
}
function defaultSelectEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const {
    options,
    optionProps,
    optionGroups,
    optionGroupProps
  } = renderOpts;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, {
    options,
    optionProps,
    optionGroups,
    optionGroupProps
  })), getEditOns(renderOpts, params)))];
}
function defaultTableOrTreeSelectEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const {
    options,
    optionProps
  } = renderOpts;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, {
    options,
    optionProps
  })), getEditOns(renderOpts, params)))];
}
/**
 * 已废弃
 * @deprecated
 */
function oldSelectEditRender(renderOpts, params) {
  const {
    row,
    column
  } = params;
  const {
    options,
    optionProps,
    optionGroups,
    optionGroupProps
  } = renderOpts;
  const cellValue = (0, _util.getCellValue)(row, column);
  return [(0, _vue.h)(getOldComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, {
    options,
    optionProps,
    optionGroups,
    optionGroupProps
  })), getEditOns(renderOpts, params)))];
}
function getSelectCellValue(renderOpts, {
  row,
  column
}) {
  const {
    options,
    optionGroups,
    optionProps = {},
    optionGroupProps = {}
  } = renderOpts;
  const cellValue = _xeUtils.default.get(row, column.field);
  let selectItem;
  const labelProp = optionProps.label || 'label';
  const valueProp = optionProps.value || 'value';
  if (!(cellValue === null || cellValue === undefined)) {
    return _xeUtils.default.map(_xeUtils.default.isArray(cellValue) ? cellValue : [cellValue], optionGroups ? value => {
      const groupOptions = optionGroupProps.options || 'options';
      for (let index = 0; index < optionGroups.length; index++) {
        /* eslint-disable eqeqeq */
        selectItem = _xeUtils.default.find(optionGroups[index][groupOptions], item => item[valueProp] == value);
        if (selectItem) {
          break;
        }
      }
      return selectItem ? selectItem[labelProp] : value;
    } : value => {
      /* eslint-disable eqeqeq */
      selectItem = _xeUtils.default.find(options, item => item[valueProp] == value);
      return selectItem ? selectItem[labelProp] : value;
    }).join(', ');
  }
  return '';
}
function handleExportSelectMethod(params) {
  const {
    row,
    column,
    options
  } = params;
  return options.original ? (0, _util.getCellValue)(row, column) : getSelectCellValue(column.editRender || column.cellRender, params);
}
function getTreeSelectCellValue(renderOpts, {
  row,
  column
}) {
  const {
    options,
    optionProps = {}
  } = renderOpts;
  const cellValue = _xeUtils.default.get(row, column.field);
  const labelProp = optionProps.label || 'label';
  const valueProp = optionProps.value || 'value';
  const childrenProp = optionProps.children || 'children';
  if (!(cellValue === null || cellValue === undefined)) {
    const keyMaps = {};
    _xeUtils.default.eachTree(options, item => {
      keyMaps[_xeUtils.default.get(item, valueProp)] = item;
    }, {
      children: childrenProp
    });
    return _xeUtils.default.map(_xeUtils.default.isArray(cellValue) ? cellValue : [cellValue], value => {
      const item = keyMaps[value];
      return item ? _xeUtils.default.get(item, labelProp) : item;
    }).join(', ');
  }
  return '';
}
function handleExportTreeSelectMethod(params) {
  const {
    row,
    column,
    options
  } = params;
  return options.original ? (0, _util.getCellValue)(row, column) : getTreeSelectCellValue(column.editRender || column.cellRender, params);
}
/**
 * 表格 - 渲染器
 */
renderer.mixin({
  input: {
    tableAutoFocus: 'input',
    renderTableEdit: nativeEditRender,
    renderTableDefault: nativeEditRender,
    renderTableFilter: nativeFilterRender,
    tableFilterDefaultMethod: handleInputFilterMethod
  },
  textarea: {
    tableAutoFocus: 'textarea',
    renderTableEdit: nativeEditRender
  },
  select: {
    renderTableEdit: nativeSelectEditRender,
    renderTableDefault: nativeSelectEditRender,
    renderTableCell(renderOpts, params) {
      return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
    },
    renderTableFilter(renderOpts, params) {
      const {
        column
      } = params;
      return column.filters.map((option, oIndex) => {
        return (0, _vue.h)('select', Object.assign(Object.assign({
          key: oIndex,
          class: 'vxe-default-select'
        }, getNativeAttrs(renderOpts)), getNativeFilterOns(renderOpts, params, option)), renderOpts.optionGroups ? renderNativeOptgroups(renderOpts, params, renderNativeOptions) : renderNativeOptions(renderOpts.options, renderOpts, params));
      });
    },
    tableFilterDefaultMethod: handleFilterMethod,
    tableExportMethod: handleExportSelectMethod
  },
  VxeInput: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultEditRender,
    renderTableCell(renderOpts, params) {
      const {
        props = {}
      } = renderOpts;
      const {
        row,
        column
      } = params;
      const inputConfig = getConfig().input || {};
      const digits = props.digits || inputConfig.digits || 2;
      let cellValue = _xeUtils.default.get(row, column.field);
      if (cellValue) {
        switch (props.type) {
          case 'date':
          case 'week':
          case 'month':
          case 'quarter':
          case 'year':
            cellValue = getLabelFormatDate(cellValue, props);
            break;
          case 'float':
            cellValue = _xeUtils.default.toFixed(_xeUtils.default.floor(cellValue, digits), digits);
            break;
        }
      }
      return getCellLabelVNs(renderOpts, params, cellValue);
    },
    renderTableDefault: defaultEditRender,
    renderTableFilter: defaultFilterRender,
    tableFilterDefaultMethod: handleInputFilterMethod
  },
  VxeNumberInput: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultEditRender,
    renderTableCell(renderOpts, params) {
      const {
        props = {}
      } = renderOpts;
      const {
        row,
        column
      } = params;
      const {
        type
      } = props;
      let cellValue = _xeUtils.default.get(row, column.field);
      if (cellValue) {
        const numberInputConfig = getConfig().numberInput || {};
        if (type === 'float') {
          const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
          const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 1);
          cellValue = _xeUtils.default.toFixed(_xeUtils.default.floor(cellValue, digits), digits);
          if (!autoFill) {
            cellValue = _xeUtils.default.toNumber(cellValue);
          }
        } else if (type === 'amount') {
          const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
          const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 2);
          const showCurrency = handleDefaultValue(props.showCurrency, numberInputConfig.showCurrency, false);
          cellValue = _xeUtils.default.commafy(_xeUtils.default.toNumber(cellValue), {
            digits
          });
          if (!autoFill) {
            const [iStr, dStr] = cellValue.split('.');
            if (dStr) {
              const dRest = dStr.replace(/0+$/, '');
              cellValue = dRest ? [iStr, '.', dRest].join('') : iStr;
            }
          }
          if (showCurrency) {
            cellValue = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n('vxe.numberInput.currencySymbol') || ''}${cellValue}`;
          }
        }
      }
      return getCellLabelVNs(renderOpts, params, cellValue);
    },
    renderTableFooter(renderOpts, params) {
      const {
        props = {}
      } = renderOpts;
      const {
        row,
        column,
        _columnIndex
      } = params;
      const {
        type
      } = props;
      // 兼容老模式
      const itemValue = _xeUtils.default.isArray(row) ? row[_columnIndex] : _xeUtils.default.get(row, column.field);
      if (_xeUtils.default.isNumber(itemValue)) {
        const numberInputConfig = getConfig().numberInput || {};
        if (type === 'float') {
          const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
          const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 1);
          let amountLabel = _xeUtils.default.toFixed(_xeUtils.default.floor(itemValue, digits), digits);
          if (!autoFill) {
            amountLabel = _xeUtils.default.toNumber(amountLabel);
          }
          return amountLabel;
        } else if (type === 'amount') {
          const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
          const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 2);
          const showCurrency = handleDefaultValue(props.showCurrency, numberInputConfig.showCurrency, false);
          let amountLabel = _xeUtils.default.commafy(_xeUtils.default.toNumber(itemValue), {
            digits
          });
          if (!autoFill) {
            const [iStr, dStr] = amountLabel.split('.');
            if (dStr) {
              const dRest = dStr.replace(/0+$/, '');
              amountLabel = dRest ? [iStr, '.', dRest].join('') : iStr;
            }
          }
          if (showCurrency) {
            amountLabel = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n('vxe.numberInput.currencySymbol') || ''}${amountLabel}`;
          }
          return amountLabel;
        }
      }
      return (0, _utils.getFuncText)(itemValue, 1);
    },
    renderTableDefault: defaultEditRender,
    renderTableFilter: defaultFilterRender,
    tableFilterDefaultMethod: handleInputFilterMethod,
    tableExportMethod(params) {
      const {
        row,
        column
      } = params;
      const cellValue = _xeUtils.default.get(row, column.field);
      return cellValue;
    }
  },
  VxeDatePicker: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultEditRender,
    renderTableCell(renderOpts, params) {
      const {
        props = {}
      } = renderOpts;
      const {
        row,
        column
      } = params;
      let cellValue = _xeUtils.default.get(row, column.field);
      if (cellValue) {
        if (props.type !== 'time') {
          cellValue = getLabelFormatDate(cellValue, props);
        }
      }
      return getCellLabelVNs(renderOpts, params, cellValue);
    },
    renderTableDefault: defaultEditRender,
    renderTableFilter: defaultFilterRender,
    tableFilterDefaultMethod: handleFilterMethod
  },
  VxeTextarea: {
    tableAutoFocus: 'textarea',
    renderTableEdit: defaultEditRender,
    renderTableCell(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const cellValue = _xeUtils.default.get(row, column.field);
      return getCellLabelVNs(renderOpts, params, cellValue);
    }
  },
  VxeButton: {
    renderTableDefault: buttonCellRender
  },
  VxeButtonGroup: {
    renderTableDefault(renderOpts, params) {
      const {
        options
      } = renderOpts;
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({
        options
      }, getCellEditProps(renderOpts, params, null)), getComponentOns(renderOpts, params)))];
    }
  },
  VxeSelect: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultSelectEditRender,
    renderTableDefault: defaultSelectEditRender,
    renderTableCell(renderOpts, params) {
      return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
    },
    renderTableFilter(renderOpts, params) {
      const {
        column
      } = params;
      const {
        options,
        optionProps,
        optionGroups,
        optionGroupProps
      } = renderOpts;
      return column.filters.map((option, oIndex) => {
        const optionValue = option.data;
        return (0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({
          key: oIndex
        }, getCellEditFilterProps(renderOpts, params, optionValue, {
          options,
          optionProps,
          optionGroups,
          optionGroupProps
        })), getFilterOns(renderOpts, params, option)));
      });
    },
    tableFilterDefaultMethod: handleFilterMethod,
    tableExportMethod: handleExportSelectMethod
  },
  VxeTreeSelect: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultTableOrTreeSelectEditRender,
    renderTableCell(renderOpts, params) {
      return getCellLabelVNs(renderOpts, params, getTreeSelectCellValue(renderOpts, params));
    },
    tableExportMethod: handleExportTreeSelectMethod
  },
  VxeTableSelect: {
    tableAutoFocus: 'input',
    renderTableEdit: defaultTableOrTreeSelectEditRender,
    renderTableCell(renderOpts, params) {
      return getCellLabelVNs(renderOpts, params, getTreeSelectCellValue(renderOpts, params));
    },
    tableExportMethod: handleExportTreeSelectMethod
  },
  VxeColorPicker: {
    tableAutoFocus: 'input',
    renderTableEdit(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const {
        options
      } = renderOpts;
      const cellValue = (0, _util.getCellValue)(row, column);
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, {
        colors: options
      })), getEditOns(renderOpts, params)))];
    },
    renderTableCell(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const cellValue = _xeUtils.default.get(row, column.field);
      return (0, _vue.h)('span', {
        class: 'vxe-color-picker--readonly'
      }, [(0, _vue.h)('div', {
        class: 'vxe-color-picker--readonly-color',
        style: {
          backgroundColor: cellValue
        }
      })]);
    }
  },
  VxeIconPicker: {
    tableAutoFocus: 'input',
    renderTableEdit(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const {
        options
      } = renderOpts;
      const cellValue = (0, _util.getCellValue)(row, column);
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, {
        icons: options
      })), getEditOns(renderOpts, params)))];
    },
    renderTableCell(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const cellValue = _xeUtils.default.get(row, column.field);
      return (0, _vue.h)('i', {
        class: cellValue
      });
    }
  },
  VxeRadioGroup: {
    renderTableDefault: radioAndCheckboxEditRender
  },
  VxeCheckboxGroup: {
    renderTableDefault: radioAndCheckboxEditRender
  },
  VxeSwitch: {
    tableAutoFocus: 'button',
    renderTableEdit: defaultEditRender,
    renderTableDefault: defaultEditRender
  },
  VxeUpload: {
    renderTableEdit: defaultEditRender,
    renderTableCell: defaultEditRender,
    renderTableDefault: defaultEditRender
  },
  VxeImage: {
    renderTableDefault(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const {
        props
      } = renderOpts;
      const cellValue = (0, _util.getCellValue)(row, column);
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), {
        src: cellValue
      }), getEditOns(renderOpts, params)))];
    }
  },
  VxeImageGroup: {
    renderTableDefault(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const {
        props
      } = renderOpts;
      const cellValue = (0, _util.getCellValue)(row, column);
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), {
        urlList: cellValue
      }), getEditOns(renderOpts, params)))];
    }
  },
  VxeTextEllipsis: {
    renderTableDefault(renderOpts, params) {
      const {
        row,
        column
      } = params;
      const {
        props
      } = renderOpts;
      const cellValue = (0, _util.getCellValue)(row, column);
      return [(0, _vue.h)(getDefaultComponent(renderOpts), Object.assign(Object.assign(Object.assign({}, props), {
        content: cellValue
      }), getEditOns(renderOpts, params)))];
    }
  },
  VxeRate: {
    renderTableDefault: defaultEditRender
  },
  VxeSlider: {
    renderTableDefault: defaultEditRender
  },
  // 以下已废弃
  $input: {
    tableAutoFocus: '.vxe-input--inner',
    renderTableEdit: oldEditRender,
    renderTableCell(renderOpts, params) {
      var _a;
      const {
        props = {}
      } = renderOpts;
      const {
        row,
        column
      } = params;
      const digits = props.digits || ((_a = getConfig().input) === null || _a === void 0 ? void 0 : _a.digits) || 2;
      let cellValue = _xeUtils.default.get(row, column.field);
      if (cellValue) {
        switch (props.type) {
          case 'date':
          case 'week':
          case 'month':
          case 'year':
            cellValue = getLabelFormatDate(cellValue, props);
            break;
          case 'float':
            cellValue = _xeUtils.default.toFixed(_xeUtils.default.floor(cellValue, digits), digits);
            break;
        }
      }
      return getCellLabelVNs(renderOpts, params, cellValue);
    },
    renderTableDefault: oldEditRender,
    renderTableFilter: oldFilterRender,
    tableFilterDefaultMethod: handleInputFilterMethod
  },
  $textarea: {
    tableAutoFocus: '.vxe-textarea--inner'
  },
  $button: {
    renderTableDefault: oldButtonEditRender
  },
  $buttons: {
    renderTableDefault: oldButtonsEditRender
  },
  $select: {
    tableAutoFocus: '.vxe-input--inner',
    renderTableEdit: oldSelectEditRender,
    renderTableDefault: oldSelectEditRender,
    renderTableCell(renderOpts, params) {
      return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
    },
    renderTableFilter(renderOpts, params) {
      const {
        column
      } = params;
      const {
        options,
        optionProps,
        optionGroups,
        optionGroupProps
      } = renderOpts;
      return column.filters.map((option, oIndex) => {
        const optionValue = option.data;
        return (0, _vue.h)(getOldComponent(renderOpts), Object.assign(Object.assign({
          key: oIndex
        }, getCellEditFilterProps(renderOpts, params, optionValue, {
          options,
          optionProps,
          optionGroups,
          optionGroupProps
        })), getFilterOns(renderOpts, params, option)));
      });
    },
    tableFilterDefaultMethod: handleFilterMethod,
    tableExportMethod: handleExportSelectMethod
  },
  $radio: {
    tableAutoFocus: '.vxe-radio--input'
  },
  $checkbox: {
    tableAutoFocus: '.vxe-checkbox--input'
  },
  $switch: {
    tableAutoFocus: '.vxe-switch--button',
    renderTableEdit: oldEditRender,
    renderTableDefault: oldEditRender
  }
  // 以上已废弃
});