"use strict"; var _xeUtils = _interopRequireDefault(require("xe-utils")); var _ui = require("../../ui"); var _vn = require("../../ui/src/vn"); var _log = require("../../ui/src/log"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; } function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } var componentDefaultModelProp = 'value'; /** * 已废弃 * @deprecated */ function getOldComponentName(name) { return "vxe-".concat(name.replace('$', '')); } /** * 已废弃 * @deprecated */ function getOldComponent(_ref) { var name = _ref.name; return getOldComponentName(name); } function getDefaultComponent(_ref2) { var name = _ref2.name; return (0, _ui.getComponent)(name) || name; } function getNativeAttrs(renderOpts) { var name = renderOpts.name, attrs = renderOpts.attrs; if (name === 'input') { attrs = Object.assign({ type: 'text' }, attrs); } return attrs; } function getComponentFormItemProps(renderOpts, params, value, defaultProps) { return _xeUtils.default.assign({}, defaultProps, renderOpts.props, _defineProperty({}, componentDefaultModelProp, value)); } /** * 原生事件处理 * @param renderOpts * @param params * @param modelFunc * @param changeFunc */ function getElementOns(renderOpts, params, modelFunc, changeFunc) { var events = renderOpts.events; var modelEvent = (0, _vn.getModelEvent)(renderOpts.name); var changeEvent = (0, _vn.getChangeEvent)(renderOpts.name); var isSameEvent = changeEvent === modelEvent; var ons = {}; if (events) { _xeUtils.default.objectEach(events, function (func, key) { ons[(0, _vn.getOnName)(key)] = function () { for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } func.apply(void 0, [params].concat(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 () { for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { args[_key2] = arguments[_key2]; } changeFunc.apply(void 0, args); if (events && events[changeEvent]) { events[changeEvent].apply(events, [params].concat(args)); } }; } return ons; } /** * 组件事件处理 * @param renderOpts * @param params * @param modelFunc * @param changeFunc */ function getComponentOns(renderOpts, params, eFns, eventOns) { var events = renderOpts.events; var _ref3 = eFns || {}, modelFunc = _ref3.model, changeFunc = _ref3.change; var modelEvent = (0, _vn.getModelEvent)(renderOpts.name); var changeEvent = (0, _vn.getChangeEvent)(renderOpts.name); var ons = {}; _xeUtils.default.objectEach(events, function (func, key) { ons[(0, _vn.getOnName)(key)] = function () { if (!_xeUtils.default.isFunction(func)) { (0, _log.errLog)('vxe.error.errFunc', [func]); } for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { args[_key3] = arguments[_key3]; } func.apply(void 0, [params].concat(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 () { for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { args[_key4] = arguments[_key4]; } changeFunc.apply(void 0, args); if (events && events[changeEvent]) { events[changeEvent].apply(events, [params].concat(args)); } }; } return eventOns ? Object.assign(ons, eventOns) : ons; } function getItemOns(renderOpts, params) { var $form = params.$form, data = params.data, field = params.field; return getComponentOns(renderOpts, params, { model: function model(value) { // 处理 model 值双向绑定 _xeUtils.default.set(data, field, value); }, change: function change() { // 处理 change 事件相关逻辑 $form.updateStatus(params); } }); } function getNativeItemOns(renderOpts, params) { var $form = params.$form, data = params.data, field = params.field; return getElementOns(renderOpts, params, function (evnt) { // 处理 model 值双向绑定 var itemValue = evnt.target.value; _xeUtils.default.set(data, field, itemValue); }, function () { // 处理 change 事件相关逻辑 $form.updateStatus(params); }); } function renderNativeOptgroup(h, renderOpts, params, renderOptionsMethods) { var optionGroups = renderOpts.optionGroups, _renderOpts$optionGro = renderOpts.optionGroupProps, optionGroupProps = _renderOpts$optionGro === void 0 ? {} : _renderOpts$optionGro; var groupOptions = optionGroupProps.options || 'options'; var groupLabel = optionGroupProps.label || 'label'; if (optionGroups) { return optionGroups.map(function (group, gIndex) { return h('optgroup', { key: gIndex, attrs: { label: group[groupLabel] } }, renderOptionsMethods(group[groupOptions], renderOpts, params)); }); } return []; } /** * 渲染表单-项 * 用于渲染原生的标签 */ function nativeItemRender(h, renderOpts, params) { var data = params.data, field = params.field; var name = renderOpts.name; var attrs = getNativeAttrs(renderOpts); var itemValue = _xeUtils.default.get(data, field); return [h(name, { class: "vxe-default-".concat(name), attrs: attrs, domProps: { value: attrs && name === 'input' && (attrs.type === 'submit' || attrs.type === 'reset') ? null : itemValue }, on: getNativeItemOns(renderOpts, params) })]; } function defaultItemRender(h, renderOpts, params) { var data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue), on: getItemOns(renderOpts, params) })]; } /** * 已废弃 * @deprecated */ function oldItemRender(h, renderOpts, params) { var data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); return [h(getOldComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue), on: getItemOns(renderOpts, params) })]; } /** * 已废弃 * @deprecated */ function oldButtonItemRender(h, renderOpts, params) { return [h('vxe-button', { props: getComponentFormItemProps(renderOpts, params, null), on: getComponentOns(renderOpts, params) })]; } /** * 已废弃 * @deprecated */ function oldButtonsItemRender(h, renderOpts, params) { return renderOpts.children.map(function (childRenderOpts) { return oldButtonItemRender(h, childRenderOpts, params)[0]; }); } /** * 渲染原生的 select 标签 */ function renderNativeFormOptions(h, options, renderOpts, params) { var data = params.data, field = params.field; var _renderOpts$optionPro = renderOpts.optionProps, optionProps = _renderOpts$optionPro === void 0 ? {} : _renderOpts$optionPro; var labelProp = optionProps.label || 'label'; var valueProp = optionProps.value || 'value'; var disabledProp = optionProps.disabled || 'disabled'; var cellValue = _xeUtils.default.get(data, field); if (options) { return options.map(function (item, oIndex) { return h('option', { key: oIndex, props: { value: item[valueProp], disabled: item[disabledProp], /* eslint-disable eqeqeq */ selected: item[valueProp] == cellValue } }, item[labelProp]); }); } return []; } /** * 渲染表单-项 */ function defaultFormItemRender(h, renderOpts, params) { var data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue), on: getItemOns(renderOpts, params) })]; } function formItemRadioAndCheckboxRender(h, renderOpts, params) { var options = renderOpts.options, optionProps = renderOpts.optionProps; var data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: Object.assign({ options: options, optionProps: optionProps }, getComponentFormItemProps(renderOpts, params, itemValue)), on: getItemOns(renderOpts, params) })]; } /** * 已废弃 * @deprecated */ function oldFormItemRadioAndCheckboxRender(h, renderOpts, params) { var name = renderOpts.name, options = renderOpts.options, _renderOpts$optionPro2 = renderOpts.optionProps, optionProps = _renderOpts$optionPro2 === void 0 ? {} : _renderOpts$optionPro2; var data = params.data, field = params.field; var labelProp = optionProps.label || 'label'; var valueProp = optionProps.value || 'value'; var disabledProp = optionProps.disabled || 'disabled'; var itemValue = _xeUtils.default.get(data, field); var compName = getOldComponentName(name); // 如果是分组 if (options) { return [h("".concat(compName, "-group"), { props: getComponentFormItemProps(renderOpts, params, itemValue), on: getItemOns(renderOpts, params), scopedSlots: { default: function _default() { return options.map(function (item, index) { return h(compName, { key: index, props: { label: item[valueProp], content: item[labelProp], disabled: item[disabledProp] } }); }); } } })]; } return [h(compName, { props: getComponentFormItemProps(renderOpts, params, itemValue), on: getItemOns(renderOpts, params) })]; } /** * 表单 - 渲染器 */ _ui.renderer.mixin({ input: { formItemAutoFocus: 'input', renderFormItemContent: nativeItemRender }, textarea: { formItemAutoFocus: 'textarea', renderFormItemContent: nativeItemRender }, select: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { return [h('select', { class: 'vxe-default-select', attrs: Object.assign({}, getNativeAttrs(renderOpts)), on: getNativeItemOns(renderOpts, params) }, renderOpts.optionGroups ? renderNativeOptgroup(h, renderOpts, params, renderNativeFormOptions) : renderNativeFormOptions(h, renderOpts.options, renderOpts, params))]; } }, VxeInput: { formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeNumberInput: { formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxePasswordInput: { formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeTextarea: { formItemAutoFocus: 'textarea', renderFormItemContent: defaultItemRender }, VxeDatePicker: { formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeDateRangePicker: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var startField = renderOpts.startField, endField = renderOpts.endField; var $form = params.$form, data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); var seProps = {}; var seOs = {}; if (startField && endField) { seProps.startValue = _xeUtils.default.get(data, startField); seProps.endValue = _xeUtils.default.get(data, endField); seOs['update:startValue'] = function (value) { if (startField) { _xeUtils.default.set(data, startField, value); } }; seOs['update:endValue'] = function (value) { if (endField) { _xeUtils.default.set(data, endField, value); } }; } return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, seProps), on: getComponentOns(renderOpts, params, { model: function model(value) { // 处理 model 值双向绑定 _xeUtils.default.set(data, field, value); }, change: function change() { // 处理 change 事件相关逻辑 $form.updateStatus(params); } }, seOs) })]; } }, VxeButton: { renderFormItemContent: defaultFormItemRender }, VxeButtonGroup: { renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var options = renderOpts.options; var data = params.data, field = params.field; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: Object.assign({ options: options }, getComponentFormItemProps(renderOpts, params, itemValue)), on: getItemOns(renderOpts, params) })]; } }, VxeSelect: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options, optionProps = renderOpts.optionProps, optionGroups = renderOpts.optionGroups, optionGroupProps = renderOpts.optionGroupProps; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { options: options, optionProps: optionProps, optionGroups: optionGroups, optionGroupProps: optionGroupProps }), on: getItemOns(renderOpts, params) })]; } }, VxeTreeSelect: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options, optionProps = renderOpts.optionProps; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { options: options, optionProps: optionProps }), on: getItemOns(renderOpts, params) })]; } }, VxeTableSelect: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options, optionProps = renderOpts.optionProps; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { options: options, optionProps: optionProps }), on: getItemOns(renderOpts, params) })]; } }, VxeColorPicker: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { colors: options }), on: getItemOns(renderOpts, params) })]; } }, VxeIconPicker: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { icons: options }), on: getItemOns(renderOpts, params) })]; } }, VxeRadio: { renderFormItemContent: defaultFormItemRender }, VxeRadioGroup: { renderFormItemContent: formItemRadioAndCheckboxRender }, VxeCheckbox: { renderFormItemContent: defaultFormItemRender }, VxeCheckboxGroup: { renderFormItemContent: formItemRadioAndCheckboxRender }, VxeSwitch: { renderFormItemContent: defaultItemRender }, VxeRate: { renderFormItemContent: defaultItemRender }, VxeSlider: { renderFormItemContent: defaultItemRender }, VxeImage: { renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var props = renderOpts.props; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: Object.assign(Object.assign({}, props), { src: itemValue }), on: getItemOns(renderOpts, params) })]; } }, VxeImageGroup: { renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var props = renderOpts.props; var itemValue = _xeUtils.default.get(data, field); return [h(getDefaultComponent(renderOpts), { props: Object.assign(Object.assign({}, props), { urlList: itemValue }), on: getItemOns(renderOpts, params) })]; } }, VxeUpload: { renderFormItemContent: defaultItemRender }, // 以下已废弃 $input: { formItemAutoFocus: 'input', renderFormItemContent: oldItemRender }, $textarea: { formItemAutoFocus: 'textarea', renderFormItemContent: oldItemRender }, $button: { renderFormItemContent: oldButtonItemRender }, $buttons: { renderFormItemContent: oldButtonsItemRender }, $select: { formItemAutoFocus: 'input', renderFormItemContent: function renderFormItemContent(h, renderOpts, params) { var data = params.data, field = params.field; var options = renderOpts.options, optionProps = renderOpts.optionProps, optionGroups = renderOpts.optionGroups, optionGroupProps = renderOpts.optionGroupProps; var itemValue = _xeUtils.default.get(data, field); return [h(getOldComponent(renderOpts), { props: getComponentFormItemProps(renderOpts, params, itemValue, { options: options, optionProps: optionProps, optionGroups: optionGroups, optionGroupProps: optionGroupProps }), on: getItemOns(renderOpts, params) })]; } }, $radio: { renderFormItemContent: oldFormItemRadioAndCheckboxRender }, $checkbox: { renderFormItemContent: oldFormItemRadioAndCheckboxRender }, $switch: { renderFormItemContent: oldItemRender } // 以上已废弃 });