vxe-pc-ui 3.0.1 → 3.0.2

package/lib/form/src/form-config-item.js

@@ -0,0 +1,210 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _utils = require("../../ui/src/utils");
+var _vn = require("../../ui/src/vn");
+var _render = require("./render");
+var _util = require("./util");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var VxeFormConfigItem = (0, _comp.defineVxeComponent)({
+  name: 'VxeFormConfigItem',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: {
+    itemConfig: Object
+  },
+  inject: {
+    $xeForm: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    var xeFormItemInfo = this;
+    return {
+      xeFormItemInfo: xeFormItemInfo,
+      $xeFormGather: null
+    };
+  },
+  computed: Object.assign({}, {}),
+  methods: {
+    renderVN: function renderVN(h) {
+      var $xeFormConfigItem = this;
+      var props = $xeFormConfigItem;
+      var $xeForm = $xeFormConfigItem.$xeForm;
+      var formProps = $xeForm;
+      var formReactData = $xeForm.reactData;
+      var data = formProps.data,
+        rules = formProps.rules,
+        readonly = formProps.readonly,
+        disabled = formProps.disabled,
+        allSpan = formProps.span,
+        allAlign = formProps.align,
+        allTitleBold = formProps.titleBold,
+        allTitleAlign = formProps.titleAlign,
+        allTitleWidth = formProps.titleWidth,
+        allTitleColon = formProps.titleColon,
+        allTitleAsterisk = formProps.titleAsterisk,
+        allTitleOverflow = formProps.titleOverflow,
+        allVertical = formProps.vertical,
+        allPadding = formProps.padding;
+      var item = props.itemConfig;
+      var collapseAll = formReactData.collapseAll;
+      var validOpts = $xeForm.computeValidOpts;
+      var slots = item.slots,
+        title = item.title,
+        visible = item.visible,
+        folding = item.folding,
+        field = item.field,
+        collapseNode = item.collapseNode,
+        itemRender = item.itemRender,
+        showError = item.showError,
+        errRule = item.errRule,
+        className = item.className,
+        titleOverflow = item.titleOverflow,
+        vertical = item.vertical,
+        padding = item.padding,
+        children = item.children,
+        showTitle = item.showTitle,
+        contentClassName = item.contentClassName,
+        contentStyle = item.contentStyle,
+        titleClassName = item.titleClassName,
+        titleStyle = item.titleStyle;
+      var compConf = (0, _utils.isEnableConf)(itemRender) ? _ui.renderer.get(itemRender.name) : null;
+      var itemClassName = compConf ? compConf.formItemClassName || compConf.itemClassName : '';
+      var itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
+      var itemContentClassName = compConf ? compConf.formItemContentClassName || compConf.itemContentClassName : '';
+      var itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
+      var itemTitleClassName = compConf ? compConf.formItemTitleClassName || compConf.itemTitleClassName : '';
+      var itemTitleStyle = compConf ? compConf.formItemTitleStyle || compConf.itemTitleStyle : null;
+      var defaultSlot = slots ? slots.default : null;
+      var titleSlot = slots ? slots.title : null;
+      var span = item.span || allSpan;
+      var align = item.align || allAlign;
+      var itemPadding = _xeUtils.default.eqNull(padding) ? allPadding : padding;
+      var itemVertical = _xeUtils.default.eqNull(vertical) ? allVertical : vertical;
+      var titleBold = _xeUtils.default.eqNull(item.titleBold) ? allTitleBold : item.titleBold;
+      var titleAlign = _xeUtils.default.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign;
+      var titleWidth = itemVertical ? null : _xeUtils.default.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth;
+      var titleColon = _xeUtils.default.eqNull(item.titleColon) ? allTitleColon : item.titleColon;
+      var titleAsterisk = _xeUtils.default.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk;
+      var itemOverflow = _xeUtils.default.eqNull(titleOverflow) ? allTitleOverflow : titleOverflow;
+      var ovEllipsis = itemOverflow === 'ellipsis';
+      var ovTitle = itemOverflow === 'title';
+      var ovTooltip = itemOverflow === true || itemOverflow === 'tooltip';
+      var hasEllipsis = ovTitle || ovTooltip || ovEllipsis;
+      var params = {
+        data: data,
+        disabled: disabled,
+        readonly: readonly,
+        field: field,
+        property: field,
+        item: item,
+        $form: $xeForm,
+        $grid: $xeForm.xegrid
+      };
+      if (visible === false) {
+        return (0, _ui.renderEmptyElement)($xeFormConfigItem);
+      }
+      var isRequired = false;
+      var isValid = false;
+      if (!readonly && rules) {
+        var itemRules = rules[field];
+        if (itemRules && itemRules.length) {
+          isValid = true;
+          isRequired = itemRules.some(function (rule) {
+            return rule.required;
+          });
+        }
+      }
+      // 如果为项集合
+      var isGather = children && children.length > 0;
+      if (isGather) {
+        var childVNs = children.map(function (childItem, index) {
+          return h(VxeFormConfigItem, {
+            key: index,
+            props: {
+              itemConfig: childItem
+            }
+          });
+        });
+        return childVNs.length ? h('div', {
+          class: ['vxe-form--gather vxe-form--item-row', item.id, span ? "vxe-form--item-col_".concat(span, " is--span") : '', className ? _xeUtils.default.isFunction(className) ? className(params) : className : '']
+        }, childVNs) : (0, _ui.renderEmptyElement)($xeFormConfigItem);
+      }
+      var contentVNs = [];
+      var rftContent = compConf ? compConf.renderFormItemContent || compConf.renderItemContent : null;
+      if (defaultSlot) {
+        contentVNs = $xeForm.callSlot(defaultSlot, params);
+      } else if (rftContent) {
+        contentVNs = (0, _vn.getSlotVNs)(rftContent(h, itemRender, params));
+      } else if (field) {
+        contentVNs = [_xeUtils.default.toValueString(_xeUtils.default.get(data, field))];
+      }
+      if (collapseNode) {
+        contentVNs.push(h('div', {
+          class: 'vxe-form--item-trigger-node',
+          on: {
+            click: $xeForm.toggleCollapseEvent
+          }
+        }, [h('span', {
+          class: 'vxe-form--item-trigger-text'
+        }, collapseAll ? (0, _ui.getI18n)('vxe.form.unfolding') : (0, _ui.getI18n)('vxe.form.folding')), h('i', {
+          class: ['vxe-form--item-trigger-icon', collapseAll ? (0, _ui.getIcon)().FORM_FOLDING : (0, _ui.getIcon)().FORM_UNFOLDING]
+        })]));
+      }
+      if (errRule && validOpts.showMessage) {
+        contentVNs.push(h('div', {
+          class: 'vxe-form--item-valid',
+          style: errRule.maxWidth ? {
+            width: "".concat(errRule.maxWidth, "px")
+          } : {}
+        }, errRule.content));
+      }
+      var ons = ovTooltip ? {
+        mouseenter: function mouseenter(evnt) {
+          $xeForm.triggerTitleTipEvent(evnt, params);
+        },
+        mouseleave: $xeForm.handleTitleTipLeaveEvent
+      } : {};
+      return h('div', {
+        class: ['vxe-form--item', item.id, span ? "vxe-form--item-col_".concat(span, " is--span") : '', className ? _xeUtils.default.isFunction(className) ? className(params) : className : '', itemClassName ? _xeUtils.default.isFunction(itemClassName) ? itemClassName(params) : itemClassName : '', {
+          'is--title': title,
+          'is--colon': titleColon,
+          'is--bold': titleBold,
+          'is--padding': itemPadding,
+          'is--vertical': itemVertical,
+          'is--asterisk': titleAsterisk,
+          'is--valid': isValid,
+          'is--required': isRequired,
+          'is--hidden': folding && collapseAll,
+          'is--active': (0, _util.isActiveItem)($xeForm, item),
+          'is--error': showError
+        }],
+        style: _xeUtils.default.isFunction(itemStyle) ? itemStyle(params) : itemStyle || {}
+      }, [h('div', {
+        class: 'vxe-form--item-inner'
+      }, [showTitle !== false && (title || titleSlot) ? h('div', {
+        class: ['vxe-form--item-title', titleAlign ? "align--".concat(titleAlign) : '', hasEllipsis ? 'is--ellipsis' : '', itemTitleClassName ? _xeUtils.default.isFunction(itemTitleClassName) ? itemTitleClassName(params) : itemTitleClassName : '', titleClassName ? _xeUtils.default.isFunction(titleClassName) ? titleClassName(params) : titleClassName : ''],
+        style: Object.assign({}, _xeUtils.default.isFunction(itemTitleStyle) ? itemTitleStyle(params) : itemTitleStyle, _xeUtils.default.isFunction(titleStyle) ? titleStyle(params) : titleStyle, titleWidth ? {
+          width: isNaN(titleWidth) ? titleWidth : "".concat(titleWidth, "px")
+        } : null),
+        attrs: {
+          title: ovTitle ? (0, _utils.getFuncText)(title) : null
+        },
+        on: ons
+      }, (0, _render.renderTitle)(h, $xeFormConfigItem, $xeForm, item)) : null, h('div', {
+        class: ['vxe-form--item-content', align ? "align--".concat(align) : '', itemContentClassName ? _xeUtils.default.isFunction(itemContentClassName) ? itemContentClassName(params) : itemContentClassName : '', contentClassName ? _xeUtils.default.isFunction(contentClassName) ? contentClassName(params) : contentClassName : ''],
+        style: Object.assign({}, _xeUtils.default.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, _xeUtils.default.isFunction(contentStyle) ? contentStyle(params) : contentStyle)
+      }, contentVNs)])]);
+    }
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});
+var _default = exports.default = VxeFormConfigItem;

package/lib/form/src/form-config-item.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_vn=require("../../ui/src/vn"),_render=require("./render"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var VxeFormConfigItem=(0,_comp.defineVxeComponent)({name:"VxeFormConfigItem",mixins:[_ui.globalMixins.sizeMixin],props:{itemConfig:Object},inject:{$xeForm:{default:null}},provide:function(){return{xeFormItemInfo:this,$xeFormGather:null}},computed:Object.assign({},{}),methods:{renderVN:function(i){var e=this,t=e.$xeForm,l=t.reactData,j=t.data,n=t.rules,s=t.readonly,r=t.disabled,o=t.span,u=t.align,a=t.titleBold,k=t.titleAlign,R=t.titleWidth,d=t.titleColon,m=t.titleAsterisk,c=t.titleOverflow,D=t.vertical,W=t.padding,f=e.itemConfig,l=l.collapseAll,$=t.computeValidOpts,x=f.slots,_=f.title,g=f.visible,B=f.folding,v=f.field,G=f.collapseNode,p=f.itemRender,L=f.showError,C=f.errRule,F=f.className,N=f.titleOverflow,h=f.vertical,U=f.padding,I=f.children,z=f.showTitle,q=f.contentClassName,y=f.contentStyle,O=f.titleClassName,b=f.titleStyle,S=(0,_utils.isEnableConf)(p)?_ui.renderer.get(p.name):null,T=S?S.formItemClassName||S.itemClassName:"",V=S?S.formItemStyle||S.itemStyle:null,E=S?S.formItemContentClassName||S.itemContentClassName:"",w=S?S.formItemContentStyle||S.itemContentStyle:null,A=S?S.formItemTitleClassName||S.itemTitleClassName:"",P=S?S.formItemTitleStyle||S.itemTitleStyle:null,H=x?x.default:null,x=x?x.title:null,o=f.span||o,u=f.align||u,W=_xeUtils.default.eqNull(U)?W:U,U=_xeUtils.default.eqNull(h)?D:h,D=_xeUtils.default.eqNull(f.titleBold)?a:f.titleBold,h=_xeUtils.default.eqNull(f.titleAlign)?k:f.titleAlign,a=U?null:_xeUtils.default.eqNull(f.titleWidth)?R:f.titleWidth,k=_xeUtils.default.eqNull(f.titleColon)?d:f.titleColon,R=_xeUtils.default.eqNull(f.titleAsterisk)?m:f.titleAsterisk,d=_xeUtils.default.eqNull(N)?c:N,m="title"===d,c=!0===d||"tooltip"===d,N=m||c||"ellipsis"===d,M={data:j,disabled:r,readonly:s,field:v,property:v,item:f,$form:t,$grid:t.xegrid};return!1===g?(0,_ui.renderEmptyElement)(e):(r=d=!1,!s&&n&&(g=n[v])&&g.length&&(r=!0,d=g.some(function(e){return e.required})),I&&0<I.length?(s=I.map(function(e,t){return i(VxeFormConfigItem,{key:t,props:{itemConfig:e}})})).length?i("div",{class:["vxe-form--gather vxe-form--item-row",f.id,o?"vxe-form--item-col_".concat(o," is--span"):"",F?_xeUtils.default.isFunction(F)?F(M):F:""]},s):(0,_ui.renderEmptyElement)(e):(n=[],g=S?S.renderFormItemContent||S.renderItemContent:null,H?n=t.callSlot(H,M):g?n=(0,_vn.getSlotVNs)(g(i,p,M)):v&&(n=[_xeUtils.default.toValueString(_xeUtils.default.get(j,v))]),G&&n.push(i("div",{class:"vxe-form--item-trigger-node",on:{click:t.toggleCollapseEvent}},[i("span",{class:"vxe-form--item-trigger-text"},l?(0,_ui.getI18n)("vxe.form.unfolding"):(0,_ui.getI18n)("vxe.form.folding")),i("i",{class:["vxe-form--item-trigger-icon",l?(0,_ui.getIcon)().FORM_FOLDING:(0,_ui.getIcon)().FORM_UNFOLDING]})])),C&&$.showMessage&&n.push(i("div",{class:"vxe-form--item-valid",style:C.maxWidth?{width:"".concat(C.maxWidth,"px")}:{}},C.content)),I=c?{mouseenter:function(e){t.triggerTitleTipEvent(e,M)},mouseleave:t.handleTitleTipLeaveEvent}:{},i("div",{class:["vxe-form--item",f.id,o?"vxe-form--item-col_".concat(o," is--span"):"",F?_xeUtils.default.isFunction(F)?F(M):F:"",T?_xeUtils.default.isFunction(T)?T(M):T:"",{"is--title":_,"is--colon":k,"is--bold":D,"is--padding":W,"is--vertical":U,"is--asterisk":R,"is--valid":r,"is--required":d,"is--hidden":B&&l,"is--active":(0,_util.isActiveItem)(t,f),"is--error":L}],style:_xeUtils.default.isFunction(V)?V(M):V||{}},[i("div",{class:"vxe-form--item-inner"},[!1!==z&&(_||x)?i("div",{class:["vxe-form--item-title",h?"align--".concat(h):"",N?"is--ellipsis":"",A?_xeUtils.default.isFunction(A)?A(M):A:"",O?_xeUtils.default.isFunction(O)?O(M):O:""],style:Object.assign({},_xeUtils.default.isFunction(P)?P(M):P,_xeUtils.default.isFunction(b)?b(M):b,a?{width:isNaN(a)?a:"".concat(a,"px")}:null),attrs:{title:m?(0,_utils.getFuncText)(_):null},on:I},(0,_render.renderTitle)(i,e,t,f)):null,i("div",{class:["vxe-form--item-content",u?"align--".concat(u):"",E?_xeUtils.default.isFunction(E)?E(M):E:"",q?_xeUtils.default.isFunction(q)?q(M):q:""],style:Object.assign({},_xeUtils.default.isFunction(w)?w(M):w,_xeUtils.default.isFunction(y)?y(M):y)},n)])])))}},render:function(e){return this.renderVN(e)}}),_default=exports.default=VxeFormConfigItem;

package/lib/form/src/form-gather.js

@@ -0,0 +1,99 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _util = require("./util");
+var _formItem = require("./form-item");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var formItemPropKeys = Object.keys(_formItem.formItemProps);
+var _default = exports.default = (0, _comp.defineVxeComponent)({
+  name: 'VxeFormGather',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: _formItem.formItemProps,
+  inject: {
+    $xeForm: {
+      default: null
+    },
+    $xeParentFormGather: {
+      from: '$xeFormGather',
+      default: null
+    }
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var formItem = {};
+    var reactData = {};
+    return {
+      xID: xID,
+      formItem: formItem,
+      reactData: reactData
+    };
+  },
+  computed: Object.assign({}, {}),
+  methods: {
+    renderVN: function renderVN(h) {
+      var $xeFormGather = this;
+      var props = $xeFormGather;
+      var slots = $xeFormGather.$scopedSlots;
+      var formItem = $xeFormGather.formItem;
+      var $xeForm = $xeFormGather.$xeForm;
+      var className = props.className,
+        field = props.field;
+      var span = props.span || ($xeForm ? $xeForm.span : null);
+      var defaultSlot = slots.default;
+      var params = {
+        $form: $xeForm,
+        data: $xeForm ? $xeForm.data : {},
+        item: formItem,
+        field: field,
+        property: field
+      };
+      return h('div', {
+        ref: 'refElem',
+        class: ['vxe-form--gather vxe-form--item-row', formItem.id, span ? "vxe-form--item-col_".concat(span, " is--span") : '', className ? _xeUtils.default.isFunction(className) ? className(params) : className : '']
+      }, defaultSlot ? defaultSlot({}) : []);
+    }
+  },
+  provide: function provide() {
+    var $xeFormGather = this;
+    var formItem = $xeFormGather.formItem;
+    return {
+      $xeFormGather: $xeFormGather,
+      $xeFormItem: null,
+      xeFormItemInfo: {
+        itemConfig: formItem
+      }
+    };
+  },
+  created: function created() {
+    var $xeFormGather = this;
+    var props = $xeFormGather;
+    var $xeForm = $xeFormGather.$xeForm;
+    var formItem = (0, _util.createItem)($xeForm, props);
+    formItem.children = [];
+    $xeFormGather.formItem = formItem;
+    (0, _util.watchItem)($xeFormGather, formItemPropKeys, formItem);
+  },
+  mounted: function mounted() {
+    var $xeFormGather = this;
+    var formItem = $xeFormGather.formItem;
+    var $xeForm = $xeFormGather.$xeForm;
+    var $xeParentFormGather = $xeFormGather.$xeParentFormGather;
+    var elem = $xeFormGather.$refs.refElem;
+    (0, _util.assembleItem)($xeForm, elem, formItem, $xeParentFormGather);
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeFormGather = this;
+    var formItem = $xeFormGather.formItem;
+    var $xeForm = $xeFormGather.$xeForm;
+    (0, _util.destroyItem)($xeForm, formItem);
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});

package/lib/form/src/form-gather.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util"),_formItem=require("./form-item");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var formItemPropKeys=Object.keys(_formItem.formItemProps),_default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeFormGather",mixins:[_ui.globalMixins.sizeMixin],props:_formItem.formItemProps,inject:{$xeForm:{default:null},$xeParentFormGather:{from:"$xeFormGather",default:null}},data:function(){return{xID:_xeUtils.default.uniqueId(),formItem:{},reactData:{}}},computed:Object.assign({},{}),methods:{renderVN:function(e){var t=this,r=t.$scopedSlots,o=t.formItem,m=t.$xeForm,i=t.className,u=t.field,t=t.span||(m?m.span:null),r=r.default,m={$form:m,data:m?m.data:{},item:o,field:u,property:u};return e("div",{ref:"refElem",class:["vxe-form--gather vxe-form--item-row",o.id,t?"vxe-form--item-col_".concat(t," is--span"):"",i?_xeUtils.default.isFunction(i)?i(m):i:""]},r?r({}):[])}},provide:function(){return{$xeFormGather:this,$xeFormItem:null,xeFormItemInfo:{itemConfig:this.formItem}}},created:function(){var e=this,t=e.$xeForm,t=(0,_util.createItem)(t,e);t.children=[],e.formItem=t,(0,_util.watchItem)(e,formItemPropKeys,t)},mounted:function(){var e=this,t=e.formItem,r=e.$refs.refElem;(0,_util.assembleItem)(e.$xeForm,r,t,e.$xeParentFormGather)},beforeDestroy:function(){var e=this.formItem,t=this.$xeForm;(0,_util.destroyItem)(t,e)},render:function(e){return this.renderVN(e)}});

package/lib/form/src/form-item.js

@@ -0,0 +1,299 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.formItemProps = exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _utils = require("../../ui/src/utils");
+var _vn = require("../../ui/src/vn");
+var _util = require("./util");
+var _render = require("./render");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var formItemProps = exports.formItemProps = {
+  title: String,
+  field: String,
+  span: [String, Number],
+  align: String,
+  titleBold: {
+    type: Boolean,
+    default: null
+  },
+  titleAlign: {
+    type: String,
+    default: null
+  },
+  titleWidth: {
+    type: [String, Number],
+    default: null
+  },
+  titleColon: {
+    type: Boolean,
+    default: null
+  },
+  titleAsterisk: {
+    type: Boolean,
+    default: null
+  },
+  showTitle: {
+    type: Boolean,
+    default: true
+  },
+  vertical: {
+    type: Boolean,
+    default: null
+  },
+  padding: {
+    type: Boolean,
+    default: null
+  },
+  className: [String, Function],
+  contentClassName: [String, Function],
+  contentStyle: [Object, Function],
+  titleClassName: [String, Function],
+  titleStyle: [Object, Function],
+  titleOverflow: {
+    type: [Boolean, String],
+    default: null
+  },
+  titlePrefix: Object,
+  titleSuffix: Object,
+  resetValue: {
+    default: null
+  },
+  visibleMethod: Function,
+  visible: {
+    type: Boolean,
+    default: null
+  },
+  folding: Boolean,
+  collapseNode: Boolean,
+  itemRender: Object,
+  rules: Array
+};
+var formItemPropKeys = Object.keys(formItemProps);
+var _default = exports.default = (0, _comp.defineVxeComponent)({
+  name: 'VxeFormItem',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: formItemProps,
+  inject: {
+    $xeForm: {
+      default: null
+    },
+    $xeFormGather: {
+      default: null
+    }
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var formItem = {};
+    var reactData = {};
+    return {
+      xID: xID,
+      formItem: formItem,
+      reactData: reactData
+    };
+  },
+  computed: Object.assign({}, {}),
+  methods: {
+    renderItem: function renderItem(h, $xeForm, item) {
+      var $xeFormItem = this;
+      var formProps = $xeForm;
+      var formReactData = $xeForm.reactData;
+      var data = formProps.data,
+        rules = formProps.rules,
+        readonly = formProps.readonly,
+        disabled = formProps.disabled,
+        allTitleBold = formProps.titleBold,
+        allTitleAlign = formProps.titleAlign,
+        allTitleWidth = formProps.titleWidth,
+        allTitleColon = formProps.titleColon,
+        allTitleAsterisk = formProps.titleAsterisk,
+        allTitleOverflow = formProps.titleOverflow,
+        allVertical = formProps.vertical,
+        allPadding = formProps.padding;
+      var collapseAll = formReactData.collapseAll;
+      var validOpts = $xeForm.computeValidOpts;
+      var slots = item.slots,
+        title = item.title,
+        visible = item.visible,
+        folding = item.folding,
+        field = item.field,
+        collapseNode = item.collapseNode,
+        itemRender = item.itemRender,
+        showError = item.showError,
+        errRule = item.errRule,
+        className = item.className,
+        titleOverflow = item.titleOverflow,
+        vertical = item.vertical,
+        padding = item.padding,
+        showTitle = item.showTitle,
+        contentClassName = item.contentClassName,
+        contentStyle = item.contentStyle,
+        titleClassName = item.titleClassName,
+        titleStyle = item.titleStyle;
+      var compConf = (0, _utils.isEnableConf)(itemRender) ? _ui.renderer.get(itemRender.name) : null;
+      var itemClassName = compConf ? compConf.formItemClassName || compConf.itemClassName : '';
+      var itemStyle = compConf ? compConf.formItemStyle || compConf.itemStyle : null;
+      var itemContentClassName = compConf ? compConf.formItemContentClassName || compConf.itemContentClassName : '';
+      var itemContentStyle = compConf ? compConf.formItemContentStyle || compConf.itemContentStyle : null;
+      var itemTitleClassName = compConf ? compConf.formItemTitleClassName || compConf.itemTitleClassName : '';
+      var itemTitleStyle = compConf ? compConf.formItemTitleStyle || compConf.itemTitleStyle : null;
+      var defaultSlot = slots ? slots.default : null;
+      var titleSlot = slots ? slots.title : null;
+      var span = item.span || formProps.span;
+      var align = item.align || formProps.align;
+      var itemPadding = _xeUtils.default.eqNull(padding) ? allPadding : padding;
+      var itemVertical = _xeUtils.default.eqNull(vertical) ? allVertical : vertical;
+      var titleBold = _xeUtils.default.eqNull(item.titleBold) ? allTitleBold : item.titleBold;
+      var titleAlign = _xeUtils.default.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign;
+      var titleWidth = itemVertical ? null : _xeUtils.default.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth;
+      var titleColon = _xeUtils.default.eqNull(item.titleColon) ? allTitleColon : item.titleColon;
+      var titleAsterisk = _xeUtils.default.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk;
+      var itemOverflow = _xeUtils.default.eqNull(titleOverflow) ? allTitleOverflow : titleOverflow;
+      var ovEllipsis = itemOverflow === 'ellipsis';
+      var ovTitle = itemOverflow === 'title';
+      var ovTooltip = itemOverflow === true || itemOverflow === 'tooltip';
+      var hasEllipsis = ovTitle || ovTooltip || ovEllipsis;
+      var params = {
+        data: data,
+        disabled: disabled,
+        readonly: readonly,
+        field: field,
+        property: field,
+        item: item,
+        $form: $xeForm,
+        $grid: $xeForm.xegrid
+      };
+      var isRequired = false;
+      var isValid = false;
+      if (visible === false) {
+        return (0, _ui.renderEmptyElement)($xeFormItem);
+      }
+      if (!readonly && rules) {
+        var itemRules = rules[field];
+        if (itemRules && itemRules.length) {
+          isValid = true;
+          isRequired = itemRules.some(function (rule) {
+            return rule.required;
+          });
+        }
+      }
+      var contentVNs = [];
+      var rftContent = compConf ? compConf.renderFormItemContent || compConf.renderItemContent : null;
+      if (defaultSlot) {
+        contentVNs = $xeForm.callSlot(defaultSlot, params);
+      } else if (rftContent) {
+        contentVNs = (0, _vn.getSlotVNs)(rftContent(h, itemRender, params));
+      } else if (field) {
+        contentVNs = ["".concat(_xeUtils.default.get(data, field))];
+      }
+      if (collapseNode) {
+        contentVNs.push(h('div', {
+          class: 'vxe-form--item-trigger-node',
+          on: {
+            click: $xeForm.toggleCollapseEvent
+          }
+        }, [h('span', {
+          class: 'vxe-form--item-trigger-text'
+        }, collapseAll ? (0, _ui.getI18n)('vxe.form.unfolding') : (0, _ui.getI18n)('vxe.form.folding')), h('i', {
+          class: ['vxe-form--item-trigger-icon', collapseAll ? (0, _ui.getIcon)().FORM_FOLDING : (0, _ui.getIcon)().FORM_UNFOLDING]
+        })]));
+      }
+      if (errRule && validOpts.showMessage) {
+        contentVNs.push(h('div', {
+          class: 'vxe-form--item-valid',
+          style: errRule.maxWidth ? {
+            width: "".concat(errRule.maxWidth, "px")
+          } : {}
+        }, errRule.message));
+      }
+      var ons = ovTooltip ? {
+        mouseenter: function mouseenter(evnt) {
+          $xeForm.triggerTitleTipEvent(evnt, params);
+        },
+        mouseleave: $xeForm.handleTitleTipLeaveEvent
+      } : {};
+      return h('div', {
+        ref: 'refElem',
+        class: ['vxe-form--item', item.id, span ? "vxe-form--item-col_".concat(span, " is--span") : '', className ? _xeUtils.default.isFunction(className) ? className(params) : className : '', itemClassName ? _xeUtils.default.isFunction(itemClassName) ? itemClassName(params) : itemClassName : '', {
+          'is--title': title,
+          'is--colon': titleColon,
+          'is--bold': titleBold,
+          'is--padding': itemPadding,
+          'is--vertical': itemVertical,
+          'is--asterisk': titleAsterisk,
+          'is--valid': isValid,
+          'is--required': isRequired,
+          'is--hidden': folding && collapseAll,
+          'is--active': (0, _util.isActiveItem)($xeForm, item),
+          'is--error': showError
+        }],
+        style: _xeUtils.default.isFunction(itemStyle) ? itemStyle(params) : itemStyle || {}
+      }, [h('div', {
+        class: 'vxe-form--item-inner'
+      }, [showTitle !== false && (title || titleSlot) ? h('div', {
+        class: ['vxe-form--item-title', titleAlign ? "align--".concat(titleAlign) : '', hasEllipsis ? 'is--ellipsis' : '', itemTitleClassName ? _xeUtils.default.isFunction(itemTitleClassName) ? itemTitleClassName(params) : itemTitleClassName : '', titleClassName ? _xeUtils.default.isFunction(titleClassName) ? titleClassName(params) : titleClassName : ''],
+        style: Object.assign({}, _xeUtils.default.isFunction(itemTitleStyle) ? itemTitleStyle(params) : itemTitleStyle, _xeUtils.default.isFunction(titleStyle) ? titleStyle(params) : titleStyle, titleWidth ? {
+          width: isNaN(titleWidth) ? titleWidth : "".concat(titleWidth, "px")
+        } : null),
+        attrs: {
+          title: ovTitle ? (0, _utils.getFuncText)(title) : null
+        },
+        on: ons
+      }, (0, _render.renderTitle)(h, $xeFormItem, $xeForm, item)) : null, h('div', {
+        class: ['vxe-form--item-content', align ? "align--".concat(align) : '', itemContentClassName ? _xeUtils.default.isFunction(itemContentClassName) ? itemContentClassName(params) : itemContentClassName : '', contentClassName ? _xeUtils.default.isFunction(contentClassName) ? contentClassName(params) : contentClassName : ''],
+        style: Object.assign({}, _xeUtils.default.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, _xeUtils.default.isFunction(contentStyle) ? contentStyle(params) : contentStyle)
+      }, contentVNs)])]);
+    },
+    renderVN: function renderVN(h) {
+      var $xeFormItem = this;
+      var formItem = $xeFormItem.formItem;
+      var $xeForm = $xeFormItem.$xeForm;
+      var customLayout = $xeForm ? $xeForm.customLayout : false;
+      return customLayout ? $xeFormItem.renderItem(h, $xeForm, formItem) : h('div', {
+        ref: 'refElem'
+      });
+    }
+  },
+  provide: function provide() {
+    var $xeFormItem = this;
+    var formItem = $xeFormItem.formItem;
+    return {
+      $xeFormGather: null,
+      $xeFormItem: $xeFormItem,
+      xeFormItemInfo: {
+        itemConfig: formItem
+      }
+    };
+  },
+  created: function created() {
+    var $xeFormItem = this;
+    var props = $xeFormItem;
+    var $xeForm = $xeFormItem.$xeForm;
+    var formItem = (0, _util.createItem)($xeForm, props);
+    $xeFormItem.formItem = formItem;
+    (0, _util.watchItem)($xeFormItem, formItemPropKeys, formItem);
+  },
+  mounted: function mounted() {
+    var $xeFormItem = this;
+    var slots = $xeFormItem.$scopedSlots;
+    var formItem = $xeFormItem.formItem;
+    var $xeForm = $xeFormItem.$xeForm;
+    var $xeFormGather = $xeFormItem.$xeFormGather;
+    formItem.slots = slots;
+    var elem = $xeFormItem.$refs.refElem;
+    (0, _util.assembleItem)($xeForm, elem, formItem, $xeFormGather);
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeFormItem = this;
+    var formItem = $xeFormItem.formItem;
+    var $xeForm = $xeFormItem.$xeForm;
+    (0, _util.destroyItem)($xeForm, formItem);
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});

package/lib/form/src/form-item.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.formItemProps=exports.default=void 0;var _comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_vn=require("../../ui/src/vn"),_util=require("./util"),_render=require("./render");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var formItemProps=exports.formItemProps={title:String,field:String,span:[String,Number],align:String,titleBold:{type:Boolean,default:null},titleAlign:{type:String,default:null},titleWidth:{type:[String,Number],default:null},titleColon:{type:Boolean,default:null},titleAsterisk:{type:Boolean,default:null},showTitle:{type:Boolean,default:!0},vertical:{type:Boolean,default:null},padding:{type:Boolean,default:null},className:[String,Function],contentClassName:[String,Function],contentStyle:[Object,Function],titleClassName:[String,Function],titleStyle:[Object,Function],titleOverflow:{type:[Boolean,String],default:null},titlePrefix:Object,titleSuffix:Object,resetValue:{default:null},visibleMethod:Function,visible:{type:Boolean,default:null},folding:Boolean,collapseNode:Boolean,itemRender:Object,rules:Array},formItemPropKeys=Object.keys(formItemProps),_default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeFormItem",mixins:[_ui.globalMixins.sizeMixin],props:formItemProps,inject:{$xeForm:{default:null},$xeFormGather:{default:null}},data:function(){return{xID:_xeUtils.default.uniqueId(),formItem:{},reactData:{}}},computed:Object.assign({},{}),methods:{renderItem:function(e,t,l){var i=t,n=t.reactData,r=i.data,o=i.rules,s=i.readonly,a=i.disabled,u=i.titleBold,m=i.titleAlign,E=i.titleWidth,d=i.titleColon,f=i.titleAsterisk,c=i.titleOverflow,P=i.vertical,D=i.padding,n=n.collapseAll,M=t.computeValidOpts,x=l.slots,p=l.title,g=l.visible,k=l.folding,_=l.field,R=l.collapseNode,v=l.itemRender,V=l.showError,I=l.errRule,h=l.className,y=l.titleOverflow,F=l.vertical,N=l.padding,W=l.showTitle,C=l.contentClassName,S=l.contentStyle,U=l.titleClassName,b=l.titleStyle,q=(0,_utils.isEnableConf)(v)?_ui.renderer.get(v.name):null,O=q?q.formItemClassName||q.itemClassName:"",B=q?q.formItemStyle||q.itemStyle:null,$=q?q.formItemContentClassName||q.itemContentClassName:"",T=q?q.formItemContentStyle||q.itemContentStyle:null,j=q?q.formItemTitleClassName||q.itemTitleClassName:"",A=q?q.formItemTitleStyle||q.itemTitleStyle:null,G=x?x.default:null,x=x?x.title:null,L=l.span||i.span,i=l.align||i.align,D=_xeUtils.default.eqNull(N)?D:N,N=_xeUtils.default.eqNull(F)?P:F,P=_xeUtils.default.eqNull(l.titleBold)?u:l.titleBold,F=_xeUtils.default.eqNull(l.titleAlign)?m:l.titleAlign,u=N?null:_xeUtils.default.eqNull(l.titleWidth)?E:l.titleWidth,m=_xeUtils.default.eqNull(l.titleColon)?d:l.titleColon,E=_xeUtils.default.eqNull(l.titleAsterisk)?f:l.titleAsterisk,d=_xeUtils.default.eqNull(y)?c:y,f="title"===d,c=!0===d||"tooltip"===d,y=f||c||"ellipsis"===d,w={data:r,disabled:a,readonly:s,field:_,property:_,item:l,$form:t,$grid:t.xegrid},d=!1,a=!1;if(!1===g)return(0,_ui.renderEmptyElement)(this);!s&&o&&(g=o[_])&&g.length&&(a=!0,d=g.some(function(e){return e.required}));s=[],o=q?q.renderFormItemContent||q.renderItemContent:null,G?s=t.callSlot(G,w):o?s=(0,_vn.getSlotVNs)(o(e,v,w)):_&&(s=["".concat(_xeUtils.default.get(r,_))]),R&&s.push(e("div",{class:"vxe-form--item-trigger-node",on:{click:t.toggleCollapseEvent}},[e("span",{class:"vxe-form--item-trigger-text"},n?(0,_ui.getI18n)("vxe.form.unfolding"):(0,_ui.getI18n)("vxe.form.folding")),e("i",{class:["vxe-form--item-trigger-icon",n?(0,_ui.getIcon)().FORM_FOLDING:(0,_ui.getIcon)().FORM_UNFOLDING]})])),I&&M.showMessage&&s.push(e("div",{class:"vxe-form--item-valid",style:I.maxWidth?{width:"".concat(I.maxWidth,"px")}:{}},I.message)),g=c?{mouseenter:function(e){t.triggerTitleTipEvent(e,w)},mouseleave:t.handleTitleTipLeaveEvent}:{};return e("div",{ref:"refElem",class:["vxe-form--item",l.id,L?"vxe-form--item-col_".concat(L," is--span"):"",h?_xeUtils.default.isFunction(h)?h(w):h:"",O?_xeUtils.default.isFunction(O)?O(w):O:"",{"is--title":p,"is--colon":m,"is--bold":P,"is--padding":D,"is--vertical":N,"is--asterisk":E,"is--valid":a,"is--required":d,"is--hidden":k&&n,"is--active":(0,_util.isActiveItem)(t,l),"is--error":V}],style:_xeUtils.default.isFunction(B)?B(w):B||{}},[e("div",{class:"vxe-form--item-inner"},[!1!==W&&(p||x)?e("div",{class:["vxe-form--item-title",F?"align--".concat(F):"",y?"is--ellipsis":"",j?_xeUtils.default.isFunction(j)?j(w):j:"",U?_xeUtils.default.isFunction(U)?U(w):U:""],style:Object.assign({},_xeUtils.default.isFunction(A)?A(w):A,_xeUtils.default.isFunction(b)?b(w):b,u?{width:isNaN(u)?u:"".concat(u,"px")}:null),attrs:{title:f?(0,_utils.getFuncText)(p):null},on:g},(0,_render.renderTitle)(e,this,t,l)):null,e("div",{class:["vxe-form--item-content",i?"align--".concat(i):"",$?_xeUtils.default.isFunction($)?$(w):$:"",C?_xeUtils.default.isFunction(C)?C(w):C:""],style:Object.assign({},_xeUtils.default.isFunction(T)?T(w):T,_xeUtils.default.isFunction(S)?S(w):S)},s)])])},renderVN:function(e){var t=this.formItem,l=this.$xeForm;return!!l&&l.customLayout?this.renderItem(e,l,t):e("div",{ref:"refElem"})}},provide:function(){return{$xeFormGather:null,$xeFormItem:this,xeFormItemInfo:{itemConfig:this.formItem}}},created:function(){var e=this.$xeForm,e=(0,_util.createItem)(e,this);this.formItem=e,(0,_util.watchItem)(this,formItemPropKeys,e)},mounted:function(){var e=this,t=e.$scopedSlots,l=e.formItem,i=e.$xeForm,n=e.$xeFormGather,t=(l.slots=t,e.$refs.refElem);(0,_util.assembleItem)(i,t,l,n)},beforeDestroy:function(){var e=this.formItem,t=this.$xeForm;(0,_util.destroyItem)(t,e)},render:function(e){return this.renderVN(e)}});