Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
@xuliangzhan
xuliangzhan committed Aug 7, 2019
1 parent a3ef920 commit 3ae7752
Show file tree
Hide file tree
Showing 10 changed files with 430 additions and 293 deletions.
6 changes: 5 additions & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,8 +42,12 @@ VXETable.use(VXETablePluginIView)

| 属性 | 描述 | 类型 | 可选值 | 默认值 |
|------|------|-----|-----|-----|
| name | 支持的渲染组件 | String | Input, AutoComplete, InputNumber | — |
| name | 支持的渲染组件 | String | Input, AutoComplete, InputNumber, Select | — |
| props | 渲染组件附加属性，参数请查看被渲染的 Component props | Object | — | {} |
| options | 只对 name=Select 有效，下拉组件选项列表 | Array | — | [] |
| optionProps | 只对 name=Select 有效，下拉组件选项属性参数配置 | Object | — | { value: 'value', label: 'label' } |
| optionGroups | 只对 name=ElSelect 有效，下拉组件分组选项列表 | Array | — | [] |
| optionGroupProps | 只对 name=ElSelect 有效，下拉组件分组选项属性参数配置 | Object | — | { options: 'options', label: 'label' } |
| events | 渲染组件附加事件，参数为 ( {row,rowIndex,column,columnIndex}, ...Component arguments ) | Object | — | — |

## Cell demo
Expand Down
249 changes: 144 additions & 105 deletions dist/index.common.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,14 @@ function matchCascaderData(index, list, values, labels) {
}
}

function getProps(_ref, _ref2) {
var $table = _ref.$table;
var props = _ref2.props;
return _xeUtils["default"].assign($table.vSize ? {
size: $table.vSize
} : {}, props);
}

function getCellEvents(editRender, params) {
var events = editRender.events;
var $table = params.$table;
Expand All @@ -60,17 +68,9 @@ function getCellEvents(editRender, params) {
}

function defaultCellRender(h, editRender, params) {
var $table = params.$table,
row = params.row,
var row = params.row,
column = params.column;
var props = editRender.props;

if ($table.vSize) {
props = _xeUtils["default"].assign({
size: $table.vSize
}, props);
}

var props = getProps(params, editRender);
return [h(editRender.name, {
props: props,
model: {
Expand Down Expand Up @@ -98,18 +98,10 @@ function getFilterEvents(on, filterRender, params) {
}

function defaultFilterRender(h, filterRender, params, context) {
var $table = params.$table,
column = params.column;
var name = filterRender.name,
props = filterRender.props;
var column = params.column;
var name = filterRender.name;
var type = 'on-change';

if ($table.vSize) {
props = _xeUtils["default"].assign({
size: $table.vSize
}, props);
}

var props = getProps(params, filterRender);
return column.filters.map(function (item) {
return h(name, {
props: props,
Expand All @@ -120,23 +112,41 @@ function defaultFilterRender(h, filterRender, params, context) {
}
},
on: getFilterEvents(_defineProperty({}, type, function () {
context[column.filterMultiple ? 'changeMultipleOption' : 'changeRadioOption']({}, !!item.data, item);
handleConfirmFilter(context, column, !!item.data, item);
}), filterRender, params)
});
});
}

function defaultFilterMethod(_ref) {
var option = _ref.option,
row = _ref.row,
column = _ref.column;
function handleConfirmFilter(context, column, checked, item) {
context[column.filterMultiple ? 'changeMultipleOption' : 'changeRadioOption']({}, checked, item);
}

function defaultFilterMethod(_ref3) {
var option = _ref3.option,
row = _ref3.row,
column = _ref3.column;
var data = option.data;

var cellValue = _xeUtils["default"].get(row, column.property);

return cellValue === data;
}

function renderOptions(h, options, optionProps) {
var labelProp = optionProps.label || 'label';
var valueProp = optionProps.value || 'value';
return _xeUtils["default"].map(options, function (item, index) {
return h('Option', {
props: {
value: item[valueProp],
label: item[labelProp]
},
key: index
});
});
}

function cellText(h, cellValue) {
return ['' + (cellValue === null || cellValue === void 0 ? '' : cellValue)];
}
Expand Down Expand Up @@ -168,23 +178,13 @@ var renderMap = {
renderEdit: function renderEdit(h, editRender, params) {
var options = editRender.options,
optionGroups = editRender.optionGroups,
_editRender$props = editRender.props,
props = _editRender$props === void 0 ? {} : _editRender$props,
_editRender$optionPro = editRender.optionProps,
optionProps = _editRender$optionPro === void 0 ? {} : _editRender$optionPro,
_editRender$optionGro = editRender.optionGroupProps,
optionGroupProps = _editRender$optionGro === void 0 ? {} : _editRender$optionGro;
var $table = params.$table,
row = params.row,
var row = params.row,
column = params.column;
var labelProp = optionProps.label || 'label';
var valueProp = optionProps.value || 'value';

if ($table.vSize) {
props = _xeUtils["default"].assign({
size: $table.vSize
}, props);
}
var props = getProps(params, editRender);

if (optionGroups) {
var groupOptions = optionGroupProps.options || 'options';
Expand All @@ -204,15 +204,7 @@ var renderMap = {
label: group[groupLabel]
},
key: gIndex
}, _xeUtils["default"].map(group[groupOptions], function (item, index) {
return h('Option', {
props: {
value: item[valueProp],
label: item[labelProp]
},
key: index
});
}));
}, renderOptions(h, group[groupOptions], optionProps));
}))];
}

Expand All @@ -225,21 +217,13 @@ var renderMap = {
}
},
on: getCellEvents(editRender, params)
}, _xeUtils["default"].map(options, function (item, index) {
return h('Option', {
props: {
value: item[valueProp],
label: item[labelProp]
},
key: index
});
}))];
}, renderOptions(h, options, optionProps))];
},
renderCell: function renderCell(h, editRender, params) {
var options = editRender.options,
optionGroups = editRender.optionGroups,
_editRender$props2 = editRender.props,
props = _editRender$props2 === void 0 ? {} : _editRender$props2,
_editRender$props = editRender.props,
props = _editRender$props === void 0 ? {} : _editRender$props,
_editRender$optionPro2 = editRender.optionProps,
optionProps = _editRender$optionPro2 === void 0 ? {} : _editRender$optionPro2,
_editRender$optionGro2 = editRender.optionGroupProps,
Expand Down Expand Up @@ -277,13 +261,90 @@ var renderMap = {
}

return cellText(h, '');
},
renderFilter: function renderFilter(h, filterRender, params, context) {
var options = filterRender.options,
optionGroups = filterRender.optionGroups,
_filterRender$optionP = filterRender.optionProps,
optionProps = _filterRender$optionP === void 0 ? {} : _filterRender$optionP,
_filterRender$optionG = filterRender.optionGroupProps,
optionGroupProps = _filterRender$optionG === void 0 ? {} : _filterRender$optionG;
var column = params.column;
var props = getProps(params, filterRender);

if (optionGroups) {
var groupOptions = optionGroupProps.options || 'options';
var groupLabel = optionGroupProps.label || 'label';
return column.filters.map(function (item) {
return h('Select', {
props: props,
model: {
value: item.data,
callback: function callback(optionValue) {
item.data = optionValue;
}
},
on: getFilterEvents({
'on-change': function onChange(value) {
handleConfirmFilter(context, column, value && value.length > 0, item);
}
}, filterRender, params)
}, _xeUtils["default"].map(optionGroups, function (group, gIndex) {
return h('OptionGroup', {
props: {
label: group[groupLabel]
},
key: gIndex
}, renderOptions(h, group[groupOptions], optionProps));
}));
});
}

return column.filters.map(function (item) {
return h('Select', {
props: props,
model: {
value: item.data,
callback: function callback(optionValue) {
item.data = optionValue;
}
},
on: getFilterEvents({
'on-change': function onChange(value) {
handleConfirmFilter(context, column, value && value.length > 0, item);
}
}, filterRender, params)
}, renderOptions(h, options, optionProps));
});
},
filterMethod: function filterMethod(_ref4) {
var option = _ref4.option,
row = _ref4.row,
column = _ref4.column;
var data = option.data;
var property = column.property,
filterRender = column.filterRender;
var _filterRender$props = filterRender.props,
props = _filterRender$props === void 0 ? {} : _filterRender$props;

var cellValue = _xeUtils["default"].get(row, property);

if (props.multiple) {
if (_xeUtils["default"].isArray(cellValue)) {
return _xeUtils["default"].includeArrays(cellValue, data);
}

return data.indexOf(cellValue) > -1;
}

return cellValue === data;
}
},
Cascader: {
renderEdit: defaultCellRender,
renderCell: function renderCell(h, _ref2, params) {
var _ref2$props = _ref2.props,
props = _ref2$props === void 0 ? {} : _ref2$props;
renderCell: function renderCell(h, _ref5, params) {
var _ref5$props = _ref5.props,
props = _ref5$props === void 0 ? {} : _ref5$props;
var row = params.row,
column = params.column;

Expand All @@ -297,9 +358,9 @@ var renderMap = {
},
DatePicker: {
renderEdit: defaultCellRender,
renderCell: function renderCell(h, _ref3, params) {
var _ref3$props = _ref3.props,
props = _ref3$props === void 0 ? {} : _ref3$props;
renderCell: function renderCell(h, _ref6, params) {
var _ref6$props = _ref6.props,
props = _ref6$props === void 0 ? {} : _ref6$props;
var row = params.row,
column = params.column;
var separator = props.separator;
Expand Down Expand Up @@ -339,16 +400,8 @@ var renderMap = {
return cellText(h, cellValue);
},
renderFilter: function renderFilter(h, filterRender, params, context) {
var $table = params.$table,
column = params.column;
var props = filterRender.props;

if ($table.vSize) {
props = _xeUtils["default"].assign({
size: $table.vSize
}, props);
}

var column = params.column;
var props = getProps(params, filterRender);
return column.filters.map(function (item) {
return h(filterRender.name, {
props: props,
Expand All @@ -360,21 +413,20 @@ var renderMap = {
},
on: getFilterEvents({
'on-change': function onChange(value) {
// 当前的选项是否选中，如果有值就是选中了，需要进行筛选
context[column.filterMultiple ? 'changeMultipleOption' : 'changeRadioOption']({}, value && value.length > 0, item);
handleConfirmFilter(context, column, !!value, item);
}
}, filterRender, params)
});
});
},
filterMethod: function filterMethod(_ref4) {
var option = _ref4.option,
row = _ref4.row,
column = _ref4.column;
filterMethod: function filterMethod(_ref7) {
var option = _ref7.option,
row = _ref7.row,
column = _ref7.column;
var data = option.data;
var filterRender = column.filterRender;
var _filterRender$props = filterRender.props,
props = _filterRender$props === void 0 ? {} : _filterRender$props;
var _filterRender$props2 = filterRender.props,
props = _filterRender$props2 === void 0 ? {} : _filterRender$props2;

var cellValue = _xeUtils["default"].get(row, column.property);

Expand Down Expand Up @@ -404,43 +456,30 @@ var renderMap = {
renderEdit: defaultCellRender
}
/**
* 筛选兼容性处理
* 事件兼容性处理
*/

};

function handleClearFilterEvent(params, evnt, context) {
function handleClearEvent(params, evnt, context) {
var getEventTargetNode = context.getEventTargetNode;

if ( // 下拉框、日期
getEventTargetNode(evnt, document.body, 'ivu-select-dropdown').flag) {
return false;
}
}
/**
* 单元格兼容性处理
*/


function handleClearActivedEvent(params, evnt, context) {
var getEventTargetNode = context.getEventTargetNode;
var VXETablePluginIView = {
install: function install(_ref8) {
var interceptor = _ref8.interceptor,
renderer = _ref8.renderer;
// 添加到渲染器
renderer.mixin(renderMap); // 处理事件冲突

if ( // 下拉框、日期
getEventTargetNode(evnt, document.body, 'ivu-select-dropdown').flag) {
return false;
interceptor.add('event.clear_filter', handleClearEvent);
interceptor.add('event.clear_actived', handleClearEvent);
}
}

function VXETablePluginIView() {}

VXETablePluginIView.install = function (_ref5) {
var interceptor = _ref5.interceptor,
renderer = _ref5.renderer;
// 添加到渲染器
renderer.mixin(renderMap); // 处理事件冲突

interceptor.add('event.clear_filter', handleClearFilterEvent);
interceptor.add('event.clear_actived', handleClearActivedEvent);
};

if (typeof window !== 'undefined' && window.VXETable) {
Expand Down
Loading

0 comments on commit 3ae7752

Please sign in to comment.