vxe-pc-ui 4.6.22 → 4.6.24

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.formItemProps=exports.default=void 0;var _vue=require("vue"),_util=require("./util"),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_render=require("./render"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const formItemProps=exports.formItemProps={title:String,field:String,span:{type:[String,Number],default:null},align:{type:String,default:null},verticalAlign:{type:String,default:null},titleBackground:{type:Boolean,default:null},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},formatter:[String,Function],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},showContent:{type:Boolean,default:null},folding:Boolean,collapseNode:Boolean,itemRender:Object,rules:Array};var _default=exports.default=(0,_vue.defineComponent)({name:"VxeFormItem",props:formItemProps,setup(e,{slots:t}){var l=_xeUtils.default.uniqueId();const f=(0,_vue.ref)(),p=(0,_vue.inject)("$xeForm",{}),n=(0,_vue.inject)("$xeFormGroup",null),_=(0,_vue.reactive)((0,_util.createItem)(p,e));_.slots=t;t={itemConfig:_};(0,_vue.provide)("xeFormItemInfo",t);const c={xID:l,formItem:_,renderVN:()=>{var e,t,l,n,r,i,u,o,a,d,s=!!p&&p.props.customLayout,m=_;return s?(s=p,m=m,d=s.props,e=s.xeGrid,{data:d,readonly:t,disabled:l}=d,{visible:n,field:r,itemRender:a,contentStyle:i,showContent:u}=m,o=(a=(0,_utils.isEnableConf)(a)?_ui.renderer.get(a.name):null)?a.formItemStyle||a.itemStyle:null,a=a?a.formItemContentStyle||a.itemContentStyle:null,!(d={data:d,disabled:l,readonly:t,field:r,property:r,item:m,$form:s,$grid:e})===n?(0,_ui.renderEmptyElement)(c):(0,_vue.h)("div",{ref:f,key:m.id,class:(0,_render.getItemClass)(s,m),style:_xeUtils.default.isFunction(o)?o(d):o},[(0,_render.renderTitle)(s,m),!1===u?(0,_ui.renderEmptyElement)(c):(0,_vue.h)("div",{class:(0,_render.getItemContentClass)(s,m),style:Object.assign({},_xeUtils.default.isFunction(a)?a(d):a,_xeUtils.default.isFunction(i)?i(d):i)},[(0,_render.renderItemContent)(s,m)])])):(0,_vue.h)("div",{ref:f})}};return(0,_util.watchItem)(e,_),(0,_vue.onMounted)(()=>{var e=f.value;(0,_util.assembleItem)(p,e,_,n)}),(0,_vue.onUnmounted)(()=>{(0,_util.destroyItem)(p,_)}),(0,_vue.provide)("$xeFormItem",c),(0,_vue.provide)("$xeFormGroup",null),c},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.formItemProps=exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_util=require("./util"),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_render=require("./render"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const formItemProps=exports.formItemProps={title:String,field:String,span:{type:[String,Number],default:null},align:{type:String,default:null},verticalAlign:{type:String,default:null},titleBackground:{type:Boolean,default:null},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},formatter:[String,Function],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},showContent:{type:Boolean,default:null},folding:Boolean,collapseNode:Boolean,itemRender:Object,rules:Array};var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeFormItem",props:formItemProps,setup(e,{slots:t}){var l=_xeUtils.default.uniqueId();const f=(0,_vue.ref)(),p=(0,_vue.inject)("$xeForm",{}),n=(0,_vue.inject)("$xeFormGroup",null),c=(0,_vue.reactive)((0,_util.createItem)(p,e));c.slots=t;t={itemConfig:c};(0,_vue.provide)("xeFormItemInfo",t);const _={xID:l,formItem:c,renderVN:()=>{var e,t,l,n,r,i,u,o,a,d,s=!!p&&p.props.customLayout,m=c;return s?(s=p,m=m,d=s.props,e=s.xeGrid,{data:d,readonly:t,disabled:l}=d,{visible:n,field:r,itemRender:a,contentStyle:i,showContent:u}=m,o=(a=(0,_utils.isEnableConf)(a)?_ui.renderer.get(a.name):null)?a.formItemStyle||a.itemStyle:null,a=a?a.formItemContentStyle||a.itemContentStyle:null,!(d={data:d,disabled:l,readonly:t,field:r,property:r,item:m,$form:s,$grid:e})===n?(0,_ui.renderEmptyElement)(_):(0,_vue.h)("div",{ref:f,key:m.id,class:(0,_render.getItemClass)(s,m),style:_xeUtils.default.isFunction(o)?o(d):o},[(0,_render.renderTitle)(s,m),!1===u?(0,_ui.renderEmptyElement)(_):(0,_vue.h)("div",{class:(0,_render.getItemContentClass)(s,m),style:Object.assign({},_xeUtils.default.isFunction(a)?a(d):a,_xeUtils.default.isFunction(i)?i(d):i)},[(0,_render.renderItemContent)(s,m)])])):(0,_vue.h)("div",{ref:f})}};return(0,_util.watchItem)(e,c),(0,_vue.onMounted)(()=>{var e=f.value;(0,_util.assembleItem)(p,e,c,n)}),(0,_vue.onUnmounted)(()=>{(0,_util.destroyItem)(p,c)}),(0,_vue.provide)("$xeFormItem",_),(0,_vue.provide)("$xeFormGroup",null),_},render(){return this.renderVN()}});

package/lib/form/src/form.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _ui = require("../../ui");
 var _utils = require("../../ui/src/utils");
@@ -139,7 +140,7 @@ function checkRuleStatus(rule, val) {
   }
   return true;
 }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'VxeForm',
   props: {
     collapseStatus: {

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_dom=require("../../ui/src/dom"),_util=require("./util"),_tooltip=_interopRequireDefault(require("../../tooltip/src/tooltip")),_formConfigItem=_interopRequireDefault(require("./form-config-item")),_loading=_interopRequireDefault(require("../../loading/src/loading")),_vn=require("../../ui/src/vn"),_log=require("../../ui/src/log");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}class Rule{constructor(e){Object.assign(this,{$options:e,required:e.required,min:e.min,max:e.min,type:e.type,pattern:e.pattern,validator:e.validator,trigger:e.trigger,maxWidth:e.maxWidth})}get content(){return(0,_utils.getFuncText)(this.$options.content||this.$options.message)}get message(){return this.content}}function validREValue(e,t){return!(e&&!(_xeUtils.default.isRegExp(e)?e:new RegExp(e)).test(t))}function validMaxValue(e,t){return!(!_xeUtils.default.eqNull(e)&&t>_xeUtils.default.toNumber(e))}function validMinValue(e,t){return!(!_xeUtils.default.eqNull(e)&&t<_xeUtils.default.toNumber(e))}function validRuleValue(e,t,i){var{type:e,min:l,max:r,pattern:a}=e,u="array"===e,o="number"===e,e="string"===e,n=""+t;if(!validREValue(a,n))return!1;if(u){if(!_xeUtils.default.isArray(t))return!1;if(i&&!t.length)return!1;if(!validMinValue(l,t.length))return!1;if(!validMaxValue(r,t.length))return!1}else if(o){a=Number(t);if(isNaN(a))return!1;if(!validMinValue(l,a))return!1;if(!validMaxValue(r,a))return!1}else{if(e&&!_xeUtils.default.isString(t))return!1;if(i&&!n)return!1;if(!validMinValue(l,n.length))return!1;if(!validMaxValue(r,n.length))return!1}return!0}function checkRuleStatus(e,t){var i=e["required"],l=_xeUtils.default.isArray(t)?!t.length:(0,_utils.eqEmptyValue)(t);if(i){if(l)return!1;if(!validRuleValue(e,t,i))return!1}else if(!l&&!validRuleValue(e,t,i))return!1;return!0}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeForm",props:{collapseStatus:{type:Boolean,default:!0},loading:Boolean,data:Object,size:{type:String,default:()=>(0,_ui.getConfig)().form.size||(0,_ui.getConfig)().size},span:{type:[String,Number],default:()=>(0,_ui.getConfig)().form.span},align:{type:String,default:()=>(0,_ui.getConfig)().form.align},verticalAlign:{type:String,default:()=>(0,_ui.getConfig)().form.verticalAlign},border:{type:Boolean,default:()=>(0,_ui.getConfig)().form.border},titleBackground:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleBackground},titleBold:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleBold},titleAlign:{type:String,default:()=>(0,_ui.getConfig)().form.titleAlign},titleWidth:{type:[String,Number],default:()=>(0,_ui.getConfig)().form.titleWidth},titleColon:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleColon},titleAsterisk:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleAsterisk},titleOverflow:{type:[Boolean,String],default:()=>(0,_ui.getConfig)().form.titleOverflow},vertical:{type:Boolean,default:()=>(0,_ui.getConfig)().form.vertical},padding:{type:Boolean,default:()=>(0,_ui.getConfig)().form.padding},className:[String,Function],readonly:Boolean,disabled:Boolean,items:Array,rules:Object,preventSubmit:{type:Boolean,default:()=>(0,_ui.getConfig)().form.preventSubmit},validConfig:Object,tooltipConfig:Object,collapseConfig:Object,customLayout:{type:Boolean,default:()=>(0,_ui.getConfig)().form.customLayout}},emits:["update:collapseStatus","collapse","toggle-collapse","submit","submit-invalid","reset"],setup(s,e){const{slots:d,emit:l}=e,o=(0,_vue.inject)("$xeGrid",null);var t=_xeUtils.default.uniqueId();const f=(0,_ui.useSize)(s)["computeSize"],c=(0,_vue.reactive)({collapseAll:s.collapseStatus,staticItems:[],formItems:[]}),m=(0,_vue.reactive)({meTimeout:void 0,stTimeout:void 0,tooltipStore:{item:null,visible:!1},itemFormatCache:{}}),g=(0,_vue.ref)(),v=(0,_vue.ref)();let i={};const p=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().form.validConfig,s.validConfig)),_=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().tooltip,(0,_ui.getConfig)().form.tooltipConfig,s.tooltipConfig));var r=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().form.collapseConfig,s.collapseConfig));const a={refElem:g},u={computeSize:f,computeValidOpts:p,computeTooltipOpts:_,computeCollapseOpts:r},h={xID:t,props:s,context:e,reactData:c,internalData:m,xeGrid:o,getRefMaps:()=>a,getComputeMaps:()=>u};const n=e=>(e.length&&e.forEach(e=>{e.slots&&_xeUtils.default.each(e.slots,e=>{_xeUtils.default.isFunction(e)||d[e]||(0,_log.errLog)("vxe.error.notSlot",[e])})}),c.staticItems=_xeUtils.default.mapTree(e,e=>(0,_util.createItem)(h,e),{children:"children"}),m.itemFormatCache={},(0,_vue.nextTick)()),x=()=>{const t=[];return _xeUtils.default.eachTree(c.formItems,e=>{t.push(e)},{children:"children"}),t},y=t=>{var e=_xeUtils.default.findTree(c.formItems,e=>e.field===t,{children:"children"});return e?e.item:null},C=()=>c.collapseAll,b=()=>{var e=!C();return c.collapseAll=e,l("update:collapseStatus",e),(0,_vue.nextTick)()};const U=t=>{if(t){let e=t;(e=_xeUtils.default.isArray(t)?e:[t]).forEach(e=>{e&&(e=(0,_util.handleFieldOrItem)(h,e))&&(e.showError=!1)})}else x().forEach(e=>{e.showError=!1});return(0,_vue.nextTick)()},S=(e,t,i)=>{var{field:l,resetValue:r}=e;return _xeUtils.default.isFunction(r)?r({field:l,item:e,data:t,$form:h,$grid:o}):_xeUtils.default.eqNull(r)&&_xeUtils.default.isArray(i)?[]:r},E=()=>{const u=s["data"];var e=x();return u&&e.forEach(e=>{var t,i,l,{field:r,itemRender:a}=e;(0,_utils.isEnableConf)(a)&&({name:a,startField:t,endField:i}=a,l=(a=_ui.renderer.get(a))?a.formItemResetMethod||a.itemResetMethod:null,a&&l?l({data:u,field:r,property:r,item:e,$form:h,$grid:o}):r&&(a=_xeUtils.default.get(u,r),_xeUtils.default.set(u,r,S(e,u,a))),t)&&i&&(_xeUtils.default.set(u,t,S(e,u,_xeUtils.default.get(u,t))),_xeUtils.default.set(u,i,S(e,u,_xeUtils.default.get(u,i))))}),m.itemFormatCache={},U()},T=e=>{e.preventDefault(),E(),i.dispatchEvent("reset",{data:s.data},e)},R=e=>{var i=g.value;if(i)for(let t=0;t<e.length;t++){var l=e[t],r=y(l);if(r&&(0,_utils.isEnableConf)(r.itemRender)){var a=r["itemRender"],u=_ui.renderer.get(a.name);t||(0,_dom.scrollToView)(i.querySelector("."+r.id));let e=null;a=a.autoFocus||a.autofocus||(u?u.formItemAutoFocus:null);if(_xeUtils.default.isFunction(a)?e=a({$form:h,$grid:o,item:r,data:s.data,field:l}):!0===a?e=i.querySelector(`.${r.id} input,textarea`):a&&(e=i.querySelector(`.${r.id} `+a)),e){e.focus();break}}}},I=(e,t,i)=>{const{data:f,rules:l}=s,r={};return _xeUtils.default.isArray(t)||(t=[t]),Promise.all(t.map(u=>{const o=[],n=[];if(u&&l){const s=_xeUtils.default.get(l,u);if(s){const d=_xeUtils.default.isUndefined(i)?_xeUtils.default.get(f,u):i;s.forEach(t=>{const{trigger:i,validator:l}=t;if("all"===e||!i||e===i)if(l){var r,a={itemValue:d,rule:t,rules:s,data:f,field:u,property:u,$form:h};let e;_xeUtils.default.isString(l)?(r=_ui.validators.get(l))?(r=r.formItemValidatorMethod||r.itemValidatorMethod)?e=r(a):(0,_log.warnLog)("vxe.error.notValidators",[l]):(0,_log.errLog)("vxe.error.notValidators",[l]):e=l(a),e&&(_xeUtils.default.isError(e)?o.push(new Rule({type:"custom",trigger:i,content:e.message,rule:new Rule(t)})):e.catch&&n.push(e.catch(e=>{o.push(new Rule({type:"custom",trigger:i,content:e?e.message:t.content||t.message,rule:new Rule(t)}))})))}else checkRuleStatus(t,d)||o.push(new Rule(t))})}}return Promise.all(n).then(()=>{o.length&&(r[u]=o.map(e=>({$form:h,rule:e,data:f,field:u,property:u})))})})).then(()=>{if(!_xeUtils.default.isEmpty(r))return Promise.reject(r)})},V=(t,e,i)=>{var{data:l,rules:r}=s;const a=p.value,u={},o=[],n=[];return clearTimeout(m.meTimeout),l&&r?(t.forEach(t=>{const i=t["field"];i&&!(0,_util.isHiddenItem)(h,t)&&(0,_util.isActiveItem)(h,t)&&n.push(I(e||"all",i).then(()=>{t.errRule=null}).catch(e=>{e=e[i];return u[i]||(u[i]=[]),u[i].push(e),o.push(i),t.errRule=e[0].rule,Promise.reject(e)}))}),Promise.all(n).then(()=>{i&&i()}).catch(()=>new Promise(e=>{m.meTimeout=setTimeout(()=>{t.forEach(e=>{e.errRule&&(e.showError=!0)})},20),!1!==a.autoPos&&(0,_vue.nextTick)(()=>{R(o)}),i?(i(u),e()):e(u)}))):(i&&i(),Promise.resolve())};const q=t=>{var e=s["readonly"];t.preventDefault(),s.preventSubmit||(U(),e?i.dispatchEvent("submit",{data:s.data},t):V(x()).then(e=>{e?i.dispatchEvent("submit-invalid",{data:s.data,errMap:e},t):i.dispatchEvent("submit",{data:s.data},t)}))},w=()=>{var e=m["tooltipStore"],t=v.value;return e.visible&&(Object.assign(e,{item:null,visible:!1}),t)&&t.close(),(0,_vue.nextTick)()};const F=(e,i,t)=>i?I(e?["blur"].includes(e.type)?"blur":"change":"all",i,t).then(()=>{U(i)}).catch(e=>{var e=e[i],t=y(i);e&&t&&(t.showError=!0,t.errRule=e[0].rule)}):(0,_vue.nextTick)();i={dispatchEvent(e,t,i){l(e,(0,_ui.createEvent)(i,{$form:h,$grid:o},t))},reset:E,validate:e=>{var t=s["readonly"];return U(),t?(0,_vue.nextTick)():V(x(),"",e)},validateField:(e,t)=>{var i=s["readonly"];if(i)return(0,_vue.nextTick)();let l=[];return e&&(l=_xeUtils.default.isArray(e)?e:[e]),V(l.map(e=>(0,_util.handleFieldOrItem)(h,e)),"",t)},clearValidate:U,updateStatus:(e,t)=>{e=e.field;return F(new Event("change"),e,t)},toggleCollapse:b,getItems:x,getItemByField:y,closeTooltip:w};r={callSlot:(e,t)=>e&&(_xeUtils.default.isString(e)&&(e=d[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[],triggerItemEvent:F,toggleCollapseEvent:e=>{b();var t=C();i.dispatchEvent("toggle-collapse",{status:t,collapse:t,data:s.data},e),i.dispatchEvent("collapse",{status:t,collapse:t,data:s.data},e),(0,_vue.nextTick)(()=>{o&&o.recalculate()})},triggerTitleTipEvent:(e,t)=>{var t=t["item"],i=m["tooltipStore"],l=v.value,e=e.currentTarget.children[0],r=(e.textContent||"").trim(),a=e.scrollWidth>e.clientWidth;clearTimeout(m.stTimeout),i.item!==t&&w(),r&&a&&(Object.assign(i,{item:t,visible:!0}),l)&&l.open(e,r)},handleTitleTipLeaveEvent:()=>{var e=_.value;let t=v.value;t&&t.setActived(!1),e.enterable?m.stTimeout=setTimeout(()=>{(t=v.value)&&!t.isActived()&&w()},e.leaveDelay):w()}};Object.assign(h,i,r);const A=(0,_vue.ref)(0),O=((0,_vue.watch)(()=>c.staticItems.length,()=>{A.value++}),(0,_vue.watch)(()=>c.staticItems,()=>{A.value++}),(0,_vue.watch)(A,()=>{c.formItems=c.staticItems}),(0,_vue.ref)(0));return(0,_vue.watch)(()=>s.items?s.items.length:-1,()=>{O.value++}),(0,_vue.watch)(()=>s.items,()=>{O.value++}),(0,_vue.watch)(O,()=>{n(s.items||[])}),(0,_vue.watch)(()=>s.collapseStatus,e=>{c.collapseAll=!!e}),(0,_vue.watch)(()=>s.readonly,()=>{U()}),(0,_vue.watch)(()=>s.disabled,()=>{U()}),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{s.customLayout&&s.items&&(0,_log.errLog)("vxe.error.errConflicts",["custom-layout","items"])})}),s.items&&n(s.items),(0,_vue.provide)("xeFormItemInfo",null),(0,_vue.provide)("$xeForm",h),(0,_vue.provide)("$xeFormGroup",null),(0,_vue.provide)("$xeFormItem",null),h.renderVN=()=>{var{loading:e,border:t,className:i,data:l,customLayout:r}=s,a=c["formItems"],u=f.value,o=_.value,n=d.default;return(0,_vue.h)("form",{ref:g,class:["vxe-form",i?_xeUtils.default.isFunction(i)?i({items:a,data:l,$form:h}):i:"",{["size--"+u]:u,"is--border":t,"custom--layout":r,"is--loading":e}],onSubmit:q,onReset:T},[(0,_vue.h)("div",{class:"vxe-form--wrapper vxe-form--item-row"},r?n?n({}):[]:a.map((e,t)=>(0,_vue.h)(_formConfigItem.default,{key:t,itemConfig:e}))),(0,_vue.h)("div",{class:"vxe-form-slots",ref:"hideItem"},!r&&n?n({}):[]),(0,_vue.h)(_loading.default,{class:"vxe-form--loading",modelValue:e}),(0,_vue.h)(_tooltip.default,Object.assign({ref:v},o))])},h},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_dom=require("../../ui/src/dom"),_util=require("./util"),_tooltip=_interopRequireDefault(require("../../tooltip/src/tooltip")),_formConfigItem=_interopRequireDefault(require("./form-config-item")),_loading=_interopRequireDefault(require("../../loading/src/loading")),_vn=require("../../ui/src/vn"),_log=require("../../ui/src/log");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}class Rule{constructor(e){Object.assign(this,{$options:e,required:e.required,min:e.min,max:e.min,type:e.type,pattern:e.pattern,validator:e.validator,trigger:e.trigger,maxWidth:e.maxWidth})}get content(){return(0,_utils.getFuncText)(this.$options.content||this.$options.message)}get message(){return this.content}}function validREValue(e,t){return!(e&&!(_xeUtils.default.isRegExp(e)?e:new RegExp(e)).test(t))}function validMaxValue(e,t){return!(!_xeUtils.default.eqNull(e)&&t>_xeUtils.default.toNumber(e))}function validMinValue(e,t){return!(!_xeUtils.default.eqNull(e)&&t<_xeUtils.default.toNumber(e))}function validRuleValue(e,t,i){var{type:e,min:l,max:r,pattern:a}=e,u="array"===e,o="number"===e,e="string"===e,n=""+t;if(!validREValue(a,n))return!1;if(u){if(!_xeUtils.default.isArray(t))return!1;if(i&&!t.length)return!1;if(!validMinValue(l,t.length))return!1;if(!validMaxValue(r,t.length))return!1}else if(o){a=Number(t);if(isNaN(a))return!1;if(!validMinValue(l,a))return!1;if(!validMaxValue(r,a))return!1}else{if(e&&!_xeUtils.default.isString(t))return!1;if(i&&!n)return!1;if(!validMinValue(l,n.length))return!1;if(!validMaxValue(r,n.length))return!1}return!0}function checkRuleStatus(e,t){var i=e["required"],l=_xeUtils.default.isArray(t)?!t.length:(0,_utils.eqEmptyValue)(t);if(i){if(l)return!1;if(!validRuleValue(e,t,i))return!1}else if(!l&&!validRuleValue(e,t,i))return!1;return!0}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeForm",props:{collapseStatus:{type:Boolean,default:!0},loading:Boolean,data:Object,size:{type:String,default:()=>(0,_ui.getConfig)().form.size||(0,_ui.getConfig)().size},span:{type:[String,Number],default:()=>(0,_ui.getConfig)().form.span},align:{type:String,default:()=>(0,_ui.getConfig)().form.align},verticalAlign:{type:String,default:()=>(0,_ui.getConfig)().form.verticalAlign},border:{type:Boolean,default:()=>(0,_ui.getConfig)().form.border},titleBackground:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleBackground},titleBold:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleBold},titleAlign:{type:String,default:()=>(0,_ui.getConfig)().form.titleAlign},titleWidth:{type:[String,Number],default:()=>(0,_ui.getConfig)().form.titleWidth},titleColon:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleColon},titleAsterisk:{type:Boolean,default:()=>(0,_ui.getConfig)().form.titleAsterisk},titleOverflow:{type:[Boolean,String],default:()=>(0,_ui.getConfig)().form.titleOverflow},vertical:{type:Boolean,default:()=>(0,_ui.getConfig)().form.vertical},padding:{type:Boolean,default:()=>(0,_ui.getConfig)().form.padding},className:[String,Function],readonly:Boolean,disabled:Boolean,items:Array,rules:Object,preventSubmit:{type:Boolean,default:()=>(0,_ui.getConfig)().form.preventSubmit},validConfig:Object,tooltipConfig:Object,collapseConfig:Object,customLayout:{type:Boolean,default:()=>(0,_ui.getConfig)().form.customLayout}},emits:["update:collapseStatus","collapse","toggle-collapse","submit","submit-invalid","reset"],setup(s,e){const{slots:d,emit:l}=e,o=(0,_vue.inject)("$xeGrid",null);var t=_xeUtils.default.uniqueId();const f=(0,_ui.useSize)(s)["computeSize"],c=(0,_vue.reactive)({collapseAll:s.collapseStatus,staticItems:[],formItems:[]}),m=(0,_vue.reactive)({meTimeout:void 0,stTimeout:void 0,tooltipStore:{item:null,visible:!1},itemFormatCache:{}}),g=(0,_vue.ref)(),v=(0,_vue.ref)();let i={};const p=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().form.validConfig,s.validConfig)),_=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().tooltip,(0,_ui.getConfig)().form.tooltipConfig,s.tooltipConfig));var r=(0,_vue.computed)(()=>Object.assign({},(0,_ui.getConfig)().form.collapseConfig,s.collapseConfig));const a={refElem:g},u={computeSize:f,computeValidOpts:p,computeTooltipOpts:_,computeCollapseOpts:r},h={xID:t,props:s,context:e,reactData:c,internalData:m,xeGrid:o,getRefMaps:()=>a,getComputeMaps:()=>u};const n=e=>(e.length&&e.forEach(e=>{e.slots&&_xeUtils.default.each(e.slots,e=>{_xeUtils.default.isFunction(e)||d[e]||(0,_log.errLog)("vxe.error.notSlot",[e])})}),c.staticItems=_xeUtils.default.mapTree(e,e=>(0,_util.createItem)(h,e),{children:"children"}),m.itemFormatCache={},(0,_vue.nextTick)()),x=()=>{const t=[];return _xeUtils.default.eachTree(c.formItems,e=>{t.push(e)},{children:"children"}),t},y=t=>{var e=_xeUtils.default.findTree(c.formItems,e=>e.field===t,{children:"children"});return e?e.item:null},C=()=>c.collapseAll,b=()=>{var e=!C();return c.collapseAll=e,l("update:collapseStatus",e),(0,_vue.nextTick)()};const U=t=>{if(t){let e=t;(e=_xeUtils.default.isArray(t)?e:[t]).forEach(e=>{e&&(e=(0,_util.handleFieldOrItem)(h,e))&&(e.showError=!1)})}else x().forEach(e=>{e.showError=!1});return(0,_vue.nextTick)()},S=(e,t,i)=>{var{field:l,resetValue:r}=e;return _xeUtils.default.isFunction(r)?r({field:l,item:e,data:t,$form:h,$grid:o}):_xeUtils.default.eqNull(r)&&_xeUtils.default.isArray(i)?[]:r},E=()=>{const u=s["data"];var e=x();return u&&e.forEach(e=>{var t,i,l,{field:r,itemRender:a}=e;(0,_utils.isEnableConf)(a)&&({name:a,startField:t,endField:i}=a,l=(a=_ui.renderer.get(a))?a.formItemResetMethod||a.itemResetMethod:null,a&&l?l({data:u,field:r,property:r,item:e,$form:h,$grid:o}):r&&(a=_xeUtils.default.get(u,r),_xeUtils.default.set(u,r,S(e,u,a))),t)&&i&&(_xeUtils.default.set(u,t,S(e,u,_xeUtils.default.get(u,t))),_xeUtils.default.set(u,i,S(e,u,_xeUtils.default.get(u,i))))}),m.itemFormatCache={},U()},T=e=>{e.preventDefault(),E(),i.dispatchEvent("reset",{data:s.data},e)},R=e=>{var i=g.value;if(i)for(let t=0;t<e.length;t++){var l=e[t],r=y(l);if(r&&(0,_utils.isEnableConf)(r.itemRender)){var a=r["itemRender"],u=_ui.renderer.get(a.name);t||(0,_dom.scrollToView)(i.querySelector("."+r.id));let e=null;a=a.autoFocus||a.autofocus||(u?u.formItemAutoFocus:null);if(_xeUtils.default.isFunction(a)?e=a({$form:h,$grid:o,item:r,data:s.data,field:l}):!0===a?e=i.querySelector(`.${r.id} input,textarea`):a&&(e=i.querySelector(`.${r.id} `+a)),e){e.focus();break}}}},I=(e,t,i)=>{const{data:f,rules:l}=s,r={};return _xeUtils.default.isArray(t)||(t=[t]),Promise.all(t.map(u=>{const o=[],n=[];if(u&&l){const s=_xeUtils.default.get(l,u);if(s){const d=_xeUtils.default.isUndefined(i)?_xeUtils.default.get(f,u):i;s.forEach(t=>{const{trigger:i,validator:l}=t;if("all"===e||!i||e===i)if(l){var r,a={itemValue:d,rule:t,rules:s,data:f,field:u,property:u,$form:h};let e;_xeUtils.default.isString(l)?(r=_ui.validators.get(l))?(r=r.formItemValidatorMethod||r.itemValidatorMethod)?e=r(a):(0,_log.warnLog)("vxe.error.notValidators",[l]):(0,_log.errLog)("vxe.error.notValidators",[l]):e=l(a),e&&(_xeUtils.default.isError(e)?o.push(new Rule({type:"custom",trigger:i,content:e.message,rule:new Rule(t)})):e.catch&&n.push(e.catch(e=>{o.push(new Rule({type:"custom",trigger:i,content:e?e.message:t.content||t.message,rule:new Rule(t)}))})))}else checkRuleStatus(t,d)||o.push(new Rule(t))})}}return Promise.all(n).then(()=>{o.length&&(r[u]=o.map(e=>({$form:h,rule:e,data:f,field:u,property:u})))})})).then(()=>{if(!_xeUtils.default.isEmpty(r))return Promise.reject(r)})},V=(t,e,i)=>{var{data:l,rules:r}=s;const a=p.value,u={},o=[],n=[];return clearTimeout(m.meTimeout),l&&r?(t.forEach(t=>{const i=t["field"];i&&!(0,_util.isHiddenItem)(h,t)&&(0,_util.isActiveItem)(h,t)&&n.push(I(e||"all",i).then(()=>{t.errRule=null}).catch(e=>{e=e[i];return u[i]||(u[i]=[]),u[i].push(e),o.push(i),t.errRule=e[0].rule,Promise.reject(e)}))}),Promise.all(n).then(()=>{i&&i()}).catch(()=>new Promise(e=>{m.meTimeout=setTimeout(()=>{t.forEach(e=>{e.errRule&&(e.showError=!0)})},20),!1!==a.autoPos&&(0,_vue.nextTick)(()=>{R(o)}),i?(i(u),e()):e(u)}))):(i&&i(),Promise.resolve())};const q=t=>{var e=s["readonly"];t.preventDefault(),s.preventSubmit||(U(),e?i.dispatchEvent("submit",{data:s.data},t):V(x()).then(e=>{e?i.dispatchEvent("submit-invalid",{data:s.data,errMap:e},t):i.dispatchEvent("submit",{data:s.data},t)}))},w=()=>{var e=m["tooltipStore"],t=v.value;return e.visible&&(Object.assign(e,{item:null,visible:!1}),t)&&t.close(),(0,_vue.nextTick)()};const F=(e,i,t)=>i?I(e?["blur"].includes(e.type)?"blur":"change":"all",i,t).then(()=>{U(i)}).catch(e=>{var e=e[i],t=y(i);e&&t&&(t.showError=!0,t.errRule=e[0].rule)}):(0,_vue.nextTick)();i={dispatchEvent(e,t,i){l(e,(0,_ui.createEvent)(i,{$form:h,$grid:o},t))},reset:E,validate:e=>{var t=s["readonly"];return U(),t?(0,_vue.nextTick)():V(x(),"",e)},validateField:(e,t)=>{var i=s["readonly"];if(i)return(0,_vue.nextTick)();let l=[];return e&&(l=_xeUtils.default.isArray(e)?e:[e]),V(l.map(e=>(0,_util.handleFieldOrItem)(h,e)),"",t)},clearValidate:U,updateStatus:(e,t)=>{e=e.field;return F(new Event("change"),e,t)},toggleCollapse:b,getItems:x,getItemByField:y,closeTooltip:w};r={callSlot:(e,t)=>e&&(_xeUtils.default.isString(e)&&(e=d[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[],triggerItemEvent:F,toggleCollapseEvent:e=>{b();var t=C();i.dispatchEvent("toggle-collapse",{status:t,collapse:t,data:s.data},e),i.dispatchEvent("collapse",{status:t,collapse:t,data:s.data},e),(0,_vue.nextTick)(()=>{o&&o.recalculate()})},triggerTitleTipEvent:(e,t)=>{var t=t["item"],i=m["tooltipStore"],l=v.value,e=e.currentTarget.children[0],r=(e.textContent||"").trim(),a=e.scrollWidth>e.clientWidth;clearTimeout(m.stTimeout),i.item!==t&&w(),r&&a&&(Object.assign(i,{item:t,visible:!0}),l)&&l.open(e,r)},handleTitleTipLeaveEvent:()=>{var e=_.value;let t=v.value;t&&t.setActived(!1),e.enterable?m.stTimeout=setTimeout(()=>{(t=v.value)&&!t.isActived()&&w()},e.leaveDelay):w()}};Object.assign(h,i,r);const A=(0,_vue.ref)(0),O=((0,_vue.watch)(()=>c.staticItems.length,()=>{A.value++}),(0,_vue.watch)(()=>c.staticItems,()=>{A.value++}),(0,_vue.watch)(A,()=>{c.formItems=c.staticItems}),(0,_vue.ref)(0));return(0,_vue.watch)(()=>s.items?s.items.length:-1,()=>{O.value++}),(0,_vue.watch)(()=>s.items,()=>{O.value++}),(0,_vue.watch)(O,()=>{n(s.items||[])}),(0,_vue.watch)(()=>s.collapseStatus,e=>{c.collapseAll=!!e}),(0,_vue.watch)(()=>s.readonly,()=>{U()}),(0,_vue.watch)(()=>s.disabled,()=>{U()}),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{s.customLayout&&s.items&&(0,_log.errLog)("vxe.error.errConflicts",["custom-layout","items"])})}),s.items&&n(s.items),(0,_vue.provide)("xeFormItemInfo",null),(0,_vue.provide)("$xeForm",h),(0,_vue.provide)("$xeFormGroup",null),(0,_vue.provide)("$xeFormItem",null),h.renderVN=()=>{var{loading:e,border:t,className:i,data:l,customLayout:r}=s,a=c["formItems"],u=f.value,o=_.value,n=d.default;return(0,_vue.h)("form",{ref:g,class:["vxe-form",i?_xeUtils.default.isFunction(i)?i({items:a,data:l,$form:h}):i:"",{["size--"+u]:u,"is--border":t,"custom--layout":r,"is--loading":e}],onSubmit:q,onReset:T},[(0,_vue.h)("div",{class:"vxe-form--wrapper vxe-form--item-row"},r?n?n({}):[]:a.map((e,t)=>(0,_vue.h)(_formConfigItem.default,{key:t,itemConfig:e}))),(0,_vue.h)("div",{class:"vxe-form-slots",ref:"hideItem"},!r&&n?n({}):[]),(0,_vue.h)(_loading.default,{class:"vxe-form--loading",modelValue:e}),(0,_vue.h)(_tooltip.default,Object.assign({ref:v},o))])},h},render(){return this.renderVN()}});

package/lib/form-design/src/default-setting-form.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DefaultSettingFormComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _ui = require("../../ui");
 var _form = _interopRequireDefault(require("../../form/src/form"));
 var _formItem = _interopRequireDefault(require("../../form/src/form-item"));
 var _switch = _interopRequireDefault(require("../../switch/src/switch"));
 var _text = _interopRequireDefault(require("../../text/src/text"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const DefaultSettingFormComponent = exports.DefaultSettingFormComponent = (0, _vue.defineComponent)({
+const DefaultSettingFormComponent = exports.DefaultSettingFormComponent = (0, _comp.defineVxeComponent)({
   name: 'DefaultSettingForm',
   props: {
     formData: {

package/lib/form-design/src/default-setting-form.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.DefaultSettingFormComponent=void 0;var _vue=require("vue"),_ui=require("../../ui"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_switch=_interopRequireDefault(require("../../switch/src/switch")),_text=_interopRequireDefault(require("../../text/src/text"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const DefaultSettingFormComponent=exports.DefaultSettingFormComponent=(0,_vue.defineComponent)({name:"DefaultSettingForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(e){var t=(0,_vue.inject)("$xeFormDesign",null);if(!t)return()=>[];const o=t["props"];return()=>{const i=e["formData"];return(0,_vue.h)(_form.default,{data:i,span:24,vertical:!0,titleBold:!0},{default(){var{showPc:e,showMobile:t}=o;return[(0,_vue.h)(_formItem.default,{title:(0,_ui.getI18n)("vxe.formDesign.formName"),field:"title",itemRender:{name:"VxeInput",props:{placeholder:(0,_ui.getI18n)("vxe.formDesign.defFormTitle")}}}),e&&t?(0,_vue.h)(_formItem.default,{title:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.name")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-devices"},[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-pc"},[(0,_vue.h)(_text.default,{icon:(0,_ui.getIcon)().FORM_DESIGN_PROPS_PC,content:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.pc")}),(0,_vue.h)(_switch.default,{modelValue:i.pcVisible,openLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.visible"),closeLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.hidden"),"onUpdate:modelValue"(e){i.pcVisible=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-mobile"},[(0,_vue.h)(_text.default,{icon:(0,_ui.getIcon)().FORM_DESIGN_PROPS_MOBILE,content:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.mobile")}),(0,_vue.h)(_switch.default,{modelValue:i.mobileVisible,openLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.visible"),closeLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.hidden"),"onUpdate:modelValue"(e){i.mobileVisible=e}})])])]}}):(0,_vue.createCommentVNode)()]}})}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.DefaultSettingFormComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_ui=require("../../ui"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_switch=_interopRequireDefault(require("../../switch/src/switch")),_text=_interopRequireDefault(require("../../text/src/text"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const DefaultSettingFormComponent=exports.DefaultSettingFormComponent=(0,_comp.defineVxeComponent)({name:"DefaultSettingForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(e){var t=(0,_vue.inject)("$xeFormDesign",null);if(!t)return()=>[];const o=t["props"];return()=>{const i=e["formData"];return(0,_vue.h)(_form.default,{data:i,span:24,vertical:!0,titleBold:!0},{default(){var{showPc:e,showMobile:t}=o;return[(0,_vue.h)(_formItem.default,{title:(0,_ui.getI18n)("vxe.formDesign.formName"),field:"title",itemRender:{name:"VxeInput",props:{placeholder:(0,_ui.getI18n)("vxe.formDesign.defFormTitle")}}}),e&&t?(0,_vue.h)(_formItem.default,{title:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.name")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-devices"},[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-pc"},[(0,_vue.h)(_text.default,{icon:(0,_ui.getIcon)().FORM_DESIGN_PROPS_PC,content:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.pc")}),(0,_vue.h)(_switch.default,{modelValue:i.pcVisible,openLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.visible"),closeLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.hidden"),"onUpdate:modelValue"(e){i.pcVisible=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-mobile"},[(0,_vue.h)(_text.default,{icon:(0,_ui.getIcon)().FORM_DESIGN_PROPS_MOBILE,content:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.mobile")}),(0,_vue.h)(_switch.default,{modelValue:i.mobileVisible,openLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.visible"),closeLabel:(0,_ui.getI18n)("vxe.formDesign.widgetProp.displaySetting.hidden"),"onUpdate:modelValue"(e){i.mobileVisible=e}})])])]}}):(0,_vue.createCommentVNode)()]}})}}});

package/lib/form-design/src/default-style-form.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DefaultPCStyleFormComponent = exports.DefaultMobileStyleFormComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _form = _interopRequireDefault(require("../../form/src/form"));
 var _formItem = _interopRequireDefault(require("../../form/src/form-item"));
@@ -64,7 +65,7 @@ const renderLayoutOption = (formData, field, type, changeEvent) => {
     class: 'vxe-form-design--widget-form-item-option-row'
   }), (0, _vue.h)('div', {}, isVertical ? (0, _core.getI18n)('vxe.formDesign.styleSetting.verticalLayout') : (0, _core.getI18n)('vxe.formDesign.styleSetting.horizontalLayout'))]);
 };
-const DefaultPCStyleFormComponent = exports.DefaultPCStyleFormComponent = (0, _vue.defineComponent)({
+const DefaultPCStyleFormComponent = exports.DefaultPCStyleFormComponent = (0, _comp.defineVxeComponent)({
   name: 'DefaultPCStyleForm',
   props: {
     formData: {
@@ -172,7 +173,7 @@ const DefaultPCStyleFormComponent = exports.DefaultPCStyleFormComponent = (0, _v
     };
   }
 });
-const DefaultMobileStyleFormComponent = exports.DefaultMobileStyleFormComponent = (0, _vue.defineComponent)({
+const DefaultMobileStyleFormComponent = exports.DefaultMobileStyleFormComponent = (0, _comp.defineVxeComponent)({
   name: 'DefaultMobileStyleForm',
   props: {
     formData: {

package/lib/form-design/src/default-style-form.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.DefaultPCStyleFormComponent=exports.DefaultMobileStyleFormComponent=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_input=_interopRequireDefault(require("../../input/src/input")),_group=_interopRequireDefault(require("../../radio/src/group")),_select=_interopRequireDefault(require("../../select/src/select"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const getBoldOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.fontNormal"),value:!1},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.fontBold"),value:!0}],getColonOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.colonVisible"),value:!0},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.colonHidden"),value:!1}],getAlignOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.alignLeft"),value:""},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.alignRight"),value:"right"}],getWidthUnitOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.unitPx"),value:""},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.unitPct"),value:"%"}],renderLayoutOption=(e,t,o,i)=>{const l="vertical"===o;return(0,_vue.h)("div",{class:["vxe-form-design--widget-form-item-option","is--"+o,{"is--active":l?e[t]:!e[t]}],onClick(){e[t]=l,i()}},[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-option-row"}),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-option-row"}),(0,_vue.h)("div",{},l?(0,_core.getI18n)("vxe.formDesign.styleSetting.verticalLayout"):(0,_core.getI18n)("vxe.formDesign.styleSetting.horizontalLayout"))])},DefaultPCStyleFormComponent=exports.DefaultPCStyleFormComponent=(0,_vue.defineComponent)({name:"DefaultPCStyleForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(o){const e=(0,_vue.inject)("$xeFormDesign",null),i="pcVertical",l=(0,_vue.ref)(getBoldOptions()),n=(0,_vue.ref)(getColonOptions()),r=(0,_vue.ref)(getAlignOptions()),u=(0,_vue.ref)(getWidthUnitOptions()),a=()=>{e&&e.refreshPreviewView()},s=()=>{var e=o["formData"];e.pcTitleWidth||(e.pcTitleWidth=100),a()};return()=>{const t=o["formData"];return(0,_vue.h)(_form.default,{data:t,span:24,vertical:!0,titleBold:!0},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.layoutTitle"),field:i},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-layout"},[renderLayoutOption(t,i,"vertical",s),renderLayoutOption(t,i,"horizontal",s)])]}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.styleTitle")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.boldTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleBold,options:l.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleBold=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.colonTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleColon,options:n.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleColon=e}})]),t.pcVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.alignTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleAlign,options:r.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleAlign=e}})]),t.pcVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.widthTitle")),(0,_vue.h)(_input.default,{class:"vxe-form-design--widget-form-item-prop-width",modelValue:t.pcTitleWidth,type:"integer",onChange:a,"onUpdate:modelValue"(e){t.pcTitleWidth=e}}),(0,_vue.h)(_select.default,{class:"vxe-form-design--widget-form-item-prop-unit",modelValue:t.pcTitleWidthUnit,options:u.value,transfer:!0,onChange:a,"onUpdate:modelValue"(e){t.pcTitleWidthUnit=e}})])]}})]}})}}}),DefaultMobileStyleFormComponent=exports.DefaultMobileStyleFormComponent=(0,_vue.defineComponent)({name:"DefaultMobileStyleForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(o){const e=(0,_vue.inject)("$xeFormDesign",null),i="mobileVertical",l=(0,_vue.ref)(getBoldOptions()),n=(0,_vue.ref)(getColonOptions()),r=(0,_vue.ref)(getAlignOptions()),u=(0,_vue.ref)(getWidthUnitOptions()),a=()=>{e&&e.refreshPreviewView()},s=()=>{var e=o["formData"];e.mobileTitleWidth||(e.mobileTitleWidth=100),a()};return()=>{const t=o["formData"];return(0,_vue.h)(_form.default,{data:t,span:24,vertical:!0,titleBold:!0},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.layoutTitle"),field:i},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-layout"},[renderLayoutOption(t,i,"vertical",s),renderLayoutOption(t,i,"horizontal",s)])]}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.styleTitle")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.boldTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleBold,options:l.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleBold=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.colonTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleColon,options:n.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleColon=e}})]),t.mobileVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.alignTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleAlign,options:r.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleAlign=e}})]),t.mobileVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.widthTitle")),(0,_vue.h)(_input.default,{class:"vxe-form-design--widget-form-item-prop-width",modelValue:t.mobileTitleWidth,type:"integer",onChange:a,"onUpdate:modelValue"(e){t.mobileTitleWidth=e}}),(0,_vue.h)(_select.default,{class:"vxe-form-design--widget-form-item-prop-unit",modelValue:t.mobileTitleWidthUnit,options:u.value,transfer:!0,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleWidthUnit=e}})])]}})]}})}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.DefaultPCStyleFormComponent=exports.DefaultMobileStyleFormComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_input=_interopRequireDefault(require("../../input/src/input")),_group=_interopRequireDefault(require("../../radio/src/group")),_select=_interopRequireDefault(require("../../select/src/select"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const getBoldOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.fontNormal"),value:!1},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.fontBold"),value:!0}],getColonOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.colonVisible"),value:!0},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.colonHidden"),value:!1}],getAlignOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.alignLeft"),value:""},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.alignRight"),value:"right"}],getWidthUnitOptions=()=>[{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.unitPx"),value:""},{label:(0,_core.getI18n)("vxe.formDesign.styleSetting.unitPct"),value:"%"}],renderLayoutOption=(e,t,o,i)=>{const l="vertical"===o;return(0,_vue.h)("div",{class:["vxe-form-design--widget-form-item-option","is--"+o,{"is--active":l?e[t]:!e[t]}],onClick(){e[t]=l,i()}},[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-option-row"}),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-option-row"}),(0,_vue.h)("div",{},l?(0,_core.getI18n)("vxe.formDesign.styleSetting.verticalLayout"):(0,_core.getI18n)("vxe.formDesign.styleSetting.horizontalLayout"))])},DefaultPCStyleFormComponent=exports.DefaultPCStyleFormComponent=(0,_comp.defineVxeComponent)({name:"DefaultPCStyleForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(o){const e=(0,_vue.inject)("$xeFormDesign",null),i="pcVertical",l=(0,_vue.ref)(getBoldOptions()),n=(0,_vue.ref)(getColonOptions()),r=(0,_vue.ref)(getAlignOptions()),u=(0,_vue.ref)(getWidthUnitOptions()),a=()=>{e&&e.refreshPreviewView()},s=()=>{var e=o["formData"];e.pcTitleWidth||(e.pcTitleWidth=100),a()};return()=>{const t=o["formData"];return(0,_vue.h)(_form.default,{data:t,span:24,vertical:!0,titleBold:!0},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.layoutTitle"),field:i},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-layout"},[renderLayoutOption(t,i,"vertical",s),renderLayoutOption(t,i,"horizontal",s)])]}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.styleTitle")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.boldTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleBold,options:l.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleBold=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.colonTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleColon,options:n.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleColon=e}})]),t.pcVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.alignTitle")),(0,_vue.h)(_group.default,{modelValue:t.pcTitleAlign,options:r.value,onChange:a,"onUpdate:modelValue"(e){t.pcTitleAlign=e}})]),t.pcVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.widthTitle")),(0,_vue.h)(_input.default,{class:"vxe-form-design--widget-form-item-prop-width",modelValue:t.pcTitleWidth,type:"integer",onChange:a,"onUpdate:modelValue"(e){t.pcTitleWidth=e}}),(0,_vue.h)(_select.default,{class:"vxe-form-design--widget-form-item-prop-unit",modelValue:t.pcTitleWidthUnit,options:u.value,transfer:!0,onChange:a,"onUpdate:modelValue"(e){t.pcTitleWidthUnit=e}})])]}})]}})}}}),DefaultMobileStyleFormComponent=exports.DefaultMobileStyleFormComponent=(0,_comp.defineVxeComponent)({name:"DefaultMobileStyleForm",props:{formData:{type:Object,default:()=>({})}},emits:[],setup(o){const e=(0,_vue.inject)("$xeFormDesign",null),i="mobileVertical",l=(0,_vue.ref)(getBoldOptions()),n=(0,_vue.ref)(getColonOptions()),r=(0,_vue.ref)(getAlignOptions()),u=(0,_vue.ref)(getWidthUnitOptions()),a=()=>{e&&e.refreshPreviewView()},s=()=>{var e=o["formData"];e.mobileTitleWidth||(e.mobileTitleWidth=100),a()};return()=>{const t=o["formData"];return(0,_vue.h)(_form.default,{data:t,span:24,vertical:!0,titleBold:!0},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.layoutTitle"),field:i},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-layout"},[renderLayoutOption(t,i,"vertical",s),renderLayoutOption(t,i,"horizontal",s)])]}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.styleSetting.styleTitle")},{default(){return[(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.boldTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleBold,options:l.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleBold=e}})]),(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.colonTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleColon,options:n.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleColon=e}})]),t.mobileVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.alignTitle")),(0,_vue.h)(_group.default,{modelValue:t.mobileTitleAlign,options:r.value,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleAlign=e}})]),t.mobileVertical?(0,_vue.createCommentVNode)():(0,_vue.h)("div",{class:"vxe-form-design--widget-form-item-prop-list"},[(0,_vue.h)("span",{},(0,_core.getI18n)("vxe.formDesign.styleSetting.widthTitle")),(0,_vue.h)(_input.default,{class:"vxe-form-design--widget-form-item-prop-width",modelValue:t.mobileTitleWidth,type:"integer",onChange:a,"onUpdate:modelValue"(e){t.mobileTitleWidth=e}}),(0,_vue.h)(_select.default,{class:"vxe-form-design--widget-form-item-prop-unit",modelValue:t.mobileTitleWidthUnit,options:u.value,transfer:!0,onChange:a,"onUpdate:modelValue"(e){t.mobileTitleWidthUnit=e}})])]}})]}})}}});

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

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _ui = require("../../ui");
 var _dom = require("../../ui/src/dom");
 var _widgetInfo = require("./widget-info");
@@ -16,7 +17,7 @@ var _layoutSetting = _interopRequireDefault(require("./layout-setting"));
 var _layoutStyle = _interopRequireDefault(require("./layout-style"));
 var _defaultSettingData = require("./default-setting-data");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'VxeFormDesign',
   props: {
     size: {

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_widgetInfo=require("./widget-info"),_xeUtils=_interopRequireDefault(require("xe-utils")),_button=_interopRequireDefault(require("../../button/src/button")),_layoutWidget=_interopRequireDefault(require("./layout-widget")),_layoutPreview=_interopRequireDefault(require("./layout-preview")),_layoutSetting=_interopRequireDefault(require("./layout-setting")),_layoutStyle=_interopRequireDefault(require("./layout-style")),_defaultSettingData=require("./default-setting-data");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeFormDesign",props:{size:{type:String,default:()=>(0,_ui.getConfig)().formDesign.size||(0,_ui.getConfig)().size},config:Object,height:{type:[String,Number],default:()=>(0,_ui.getConfig)().formDesign.height},widgets:{type:Array,default:()=>_xeUtils.default.clone((0,_ui.getConfig)().formDesign.widgets)||[]},showHeader:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showHeader},showPc:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showPc},showMobile:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showMobile},formRender:Object},emits:["click-widget","add-widget","copy-widget","remove-widget","drag-widget"],setup(u,e){const{emit:r,slots:d}=e;var t=_xeUtils.default.uniqueId();const o=(0,_vue.ref)(),a=(0,_vue.ref)(),g=(0,_ui.useSize)(u)["computeSize"],l=(0,_vue.reactive)({formData:{},widgetConfigs:[],widgetObjList:[],dragWidget:null,sortWidget:null,activeWidget:null});var i=(0,_vue.reactive)({});const n={refElem:o},s={computeSize:g},f={xID:t,props:u,context:e,reactData:l,internalData:i,getRefMaps:()=>n,getComputeMaps:()=>s},c=e=>new _widgetInfo.FormDesignWidgetInfo(f,e,l.widgetObjList),v=()=>new _widgetInfo.FormDesignWidgetInfo(f,"",l.widgetObjList),_=e=>{var t;e&&({formConfig:e,widgetData:t}=e,e&&m(e),t)&&w(t);const{activeWidget:i,widgetObjList:r}=l;return i?(e=_xeUtils.default.findTree(r,e=>e.id===i.id,{children:"children"}),l.activeWidget=e?e.item:r[0]||null):l.activeWidget=r[0]||null,(0,_vue.nextTick)()};const h=()=>_xeUtils.default.clone(l.formData,!0),m=e=>(l.formData=Object.assign({},W(),e),(0,_vue.nextTick)());const p=()=>{var e=_xeUtils.default.clone(l.widgetObjList,!0);return _xeUtils.default.eachTree(e,e=>{e.model.value=null},{children:"children"}),e},w=e=>(l.widgetObjList=(e||[]).map(e=>(0,_widgetInfo.configToWidget)(e)),(0,_vue.nextTick)()),x=()=>{var e=a.value;return e&&e.openStylePreview(),(0,_vue.nextTick)()},D=()=>(l.widgetObjList=[],q(),(0,_vue.nextTick)()),y={dispatchEvent(e,t,i){r(e,(0,_ui.createEvent)(i,{$xeFormDesign:f},t))},createWidget:c,createEmptyWidget:v,getConfig(){return{formConfig:h(),widgetData:p()}},clearConfig:D,loadConfig:_,reloadConfig:e=>(D(),_(e)),getFormConfig:h,loadFormConfig:m,getWidgetById:e=>{var t=l["widgetObjList"];if(e){const i=_xeUtils.default.toNumber(e);e=_xeUtils.default.findTree(t,e=>e&&e.id===i,{children:"children"});if(e)return e.item}return null},getFormData(){var e=l["widgetObjList"];const t={};return _xeUtils.default.eachTree(e,e=>{t[e.field]=null},{children:"children"}),t},getWidgetData:p,loadWidgetData:w,refreshPreviewView(){var e=a.value;return e&&e.updatePreviewView(),(0,_vue.nextTick)()},openStyleSetting:x},b=()=>{var e=u["widgets"],t=[];const n=[],d=[],o=[],a=[];_ui.renderer.forEach((e,t)=>{e=e.createFormDesignWidgetConfig;if(e){var i=c(t),e=(0,_widgetInfo.getWidgetConfig)(t);const r=(0,_widgetInfo.getWidgetConfigCustomGroup)(t,f);if(r){t=a.find(e=>e.title===r);t?t.children.push(i):a.push({title:r,children:[i]})}else switch(e.group){case"layout":d.push(i);break;case"advanced":o.push(i);break;default:["title"].includes(i.name)||n.push(i)}}}),n.length&&t.push({group:"base",children:n}),d.length&&t.push({group:"layout",children:d}),o.length&&t.push({group:"advanced",children:o}),a.length&&t.push(...a),e&&e.length?l.widgetConfigs=u.widgets.map(e=>({title:e.customGroup,group:e.group,children:e.children?e.children.map(e=>{return c(e)}):[]})):l.widgetConfigs=t},C=t=>{var e=l["widgetObjList"];if((0,_widgetInfo.getWidgetConfig)(t).unique){const i=[];_xeUtils.default.eachTree(e,e=>{e.name===t&&i.push(e)},{children:"children"});e=i.length<1;return e||_ui.VxeUI.modal&&_ui.VxeUI.modal.message({content:(0,_ui.getI18n)("vxe.formDesign.error.wdFormUni"),status:"error",id:"wdFormUni"}),e}return!0};t={validWidgetUnique:C,handleClickWidget(e,t){t&&t.name&&(e.stopPropagation(),l.activeWidget=t,y.dispatchEvent("click-widget",{widget:t},e))},handleCopyWidget(e,t){var i,r=l["widgetObjList"],n=_xeUtils.default.findTree(r,e=>e.id===t.id,{children:"children"});n&&(e.stopPropagation(),C(t.name))&&(n=n["path"],n=Number(n[0]),(i=c(t.name)).title&&(i.title=(0,_ui.getI18n)("vxe.formDesign.widget.copyTitle",[(""+t.title).replace((0,_ui.getI18n)("vxe.formDesign.widget.copyTitle",[""]),"")])),n>=r.length-1?r.push(i):r.splice(n+1,0,i),l.activeWidget=i,l.widgetObjList=[...r],y.dispatchEvent("copy-widget",{widget:t,newWidget:i},e))},handleRemoveWidget(e,t){var i,r,n=l["widgetObjList"],d=_xeUtils.default.findTree(n,e=>e.id===t.id,{children:"children"});d&&({index:d,parent:i,items:r}=d,e.stopPropagation(),d>=r.length-1?l.activeWidget=r[d-1]:l.activeWidget=r[d+1]||null,i&&"row"===i.name?r[d]=v():r.splice(d,1),l.widgetObjList=[...n],y.dispatchEvent("remove-widget",{widget:t},e))}};const W=()=>{var{formRender:e,showPc:t,showMobile:i}=u;let r=(0,_defaultSettingData.getDefaultSettingFormData)({pcVisible:t,mobileVisible:i});return e&&(i=(t=_ui.renderer.get(e.name))?t.createFormDesignSettingFormConfig:null,r=(i?i({}):{})||{}),r},q=()=>{l.formData=W()},I=()=>{x()};Object.assign(f,y,t);return f.renderVN=()=>{var{height:e,showHeader:t}=u,i=g.value,r=d.header,n=d.footer;return(0,_vue.h)("div",{ref:o,class:["vxe-form-design",{["size--"+i]:i}],style:e?{height:(0,_dom.toCssUnit)(e)}:null},[t||r?(0,_vue.h)("div",{class:"vxe-form-design--header"},r?r({}):(i=d.extra,(0,_vue.h)("div",{class:"vxe-form-design--header-wrapper"},[(0,_vue.h)("div",{class:"vxe-form-design--header-left"}),(0,_vue.h)("div",{class:"vxe-form-design--header-middle"}),(0,_vue.h)("div",{class:"vxe-form-design--header-right"},[i?(0,_vue.h)("div",{class:"vxe-form-design--header-extra"},i({})):(0,_ui.renderEmptyElement)(f),(0,_vue.h)("div",{class:"vxe-form-design--header-setting"},[(0,_vue.h)(_button.default,{mode:"text",status:"primary",icon:(0,_ui.getIcon)().FORM_DESIGN_STYLE_SETTING,content:(0,_ui.getI18n)("vxe.formDesign.styleSetting.btn"),onClick:I})])])]))):(0,_vue.createCommentVNode)(),(0,_vue.h)("div",{class:"vxe-form-design--body"},[(0,_vue.h)(_layoutWidget.default),(0,_vue.h)(_layoutPreview.default),(0,_vue.h)(_layoutSetting.default),(0,_vue.h)(_layoutStyle.default,{ref:a})]),n?(0,_vue.h)("div",{class:"vxe-form-design--footer"},n?n({}):[]):(0,_vue.createCommentVNode)()])},(0,_vue.watch)(()=>u.widgets,()=>{b()}),(0,_vue.watch)(()=>u.widgets,()=>{b()}),(0,_vue.watch)(()=>u.config,e=>{_(e||{})}),q(),b(),u.config&&_(u.config),(0,_vue.provide)("$xeFormDesign",f),f},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_ui=require("../../ui"),_dom=require("../../ui/src/dom"),_widgetInfo=require("./widget-info"),_xeUtils=_interopRequireDefault(require("xe-utils")),_button=_interopRequireDefault(require("../../button/src/button")),_layoutWidget=_interopRequireDefault(require("./layout-widget")),_layoutPreview=_interopRequireDefault(require("./layout-preview")),_layoutSetting=_interopRequireDefault(require("./layout-setting")),_layoutStyle=_interopRequireDefault(require("./layout-style")),_defaultSettingData=require("./default-setting-data");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeFormDesign",props:{size:{type:String,default:()=>(0,_ui.getConfig)().formDesign.size||(0,_ui.getConfig)().size},config:Object,height:{type:[String,Number],default:()=>(0,_ui.getConfig)().formDesign.height},widgets:{type:Array,default:()=>_xeUtils.default.clone((0,_ui.getConfig)().formDesign.widgets)||[]},showHeader:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showHeader},showPc:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showPc},showMobile:{type:Boolean,default:()=>(0,_ui.getConfig)().formDesign.showMobile},formRender:Object},emits:["click-widget","add-widget","copy-widget","remove-widget","drag-widget"],setup(u,e){const{emit:r,slots:d}=e;var t=_xeUtils.default.uniqueId();const o=(0,_vue.ref)(),a=(0,_vue.ref)(),g=(0,_ui.useSize)(u)["computeSize"],l=(0,_vue.reactive)({formData:{},widgetConfigs:[],widgetObjList:[],dragWidget:null,sortWidget:null,activeWidget:null});var i=(0,_vue.reactive)({});const n={refElem:o},s={computeSize:g},c={xID:t,props:u,context:e,reactData:l,internalData:i,getRefMaps:()=>n,getComputeMaps:()=>s},f=e=>new _widgetInfo.FormDesignWidgetInfo(c,e,l.widgetObjList),v=()=>new _widgetInfo.FormDesignWidgetInfo(c,"",l.widgetObjList),_=e=>{var t;e&&({formConfig:e,widgetData:t}=e,e&&m(e),t)&&w(t);const{activeWidget:i,widgetObjList:r}=l;return i?(e=_xeUtils.default.findTree(r,e=>e.id===i.id,{children:"children"}),l.activeWidget=e?e.item:r[0]||null):l.activeWidget=r[0]||null,(0,_vue.nextTick)()};const h=()=>_xeUtils.default.clone(l.formData,!0),m=e=>(l.formData=Object.assign({},W(),e),(0,_vue.nextTick)());const p=()=>{var e=_xeUtils.default.clone(l.widgetObjList,!0);return _xeUtils.default.eachTree(e,e=>{e.model.value=null},{children:"children"}),e},w=e=>(l.widgetObjList=(e||[]).map(e=>(0,_widgetInfo.configToWidget)(e)),(0,_vue.nextTick)()),x=()=>{var e=a.value;return e&&e.openStylePreview(),(0,_vue.nextTick)()},D=()=>(l.widgetObjList=[],q(),(0,_vue.nextTick)()),y={dispatchEvent(e,t,i){r(e,(0,_ui.createEvent)(i,{$xeFormDesign:c},t))},createWidget:f,createEmptyWidget:v,getConfig(){return{formConfig:h(),widgetData:p()}},clearConfig:D,loadConfig:_,reloadConfig:e=>(D(),_(e)),getFormConfig:h,loadFormConfig:m,getWidgetById:e=>{var t=l["widgetObjList"];if(e){const i=_xeUtils.default.toNumber(e);e=_xeUtils.default.findTree(t,e=>e&&e.id===i,{children:"children"});if(e)return e.item}return null},getFormData(){var e=l["widgetObjList"];const t={};return _xeUtils.default.eachTree(e,e=>{t[e.field]=null},{children:"children"}),t},getWidgetData:p,loadWidgetData:w,refreshPreviewView(){var e=a.value;return e&&e.updatePreviewView(),(0,_vue.nextTick)()},openStyleSetting:x},b=()=>{var e=u["widgets"],t=[];const n=[],d=[],o=[],a=[];_ui.renderer.forEach((e,t)=>{e=e.createFormDesignWidgetConfig;if(e){var i=f(t),e=(0,_widgetInfo.getWidgetConfig)(t);const r=(0,_widgetInfo.getWidgetConfigCustomGroup)(t,c);if(r){t=a.find(e=>e.title===r);t?t.children.push(i):a.push({title:r,children:[i]})}else switch(e.group){case"layout":d.push(i);break;case"advanced":o.push(i);break;default:["title"].includes(i.name)||n.push(i)}}}),n.length&&t.push({group:"base",children:n}),d.length&&t.push({group:"layout",children:d}),o.length&&t.push({group:"advanced",children:o}),a.length&&t.push(...a),e&&e.length?l.widgetConfigs=u.widgets.map(e=>({title:e.customGroup,group:e.group,children:e.children?e.children.map(e=>{return f(e)}):[]})):l.widgetConfigs=t},C=t=>{var e=l["widgetObjList"];if((0,_widgetInfo.getWidgetConfig)(t).unique){const i=[];_xeUtils.default.eachTree(e,e=>{e.name===t&&i.push(e)},{children:"children"});e=i.length<1;return e||_ui.VxeUI.modal&&_ui.VxeUI.modal.message({content:(0,_ui.getI18n)("vxe.formDesign.error.wdFormUni"),status:"error",id:"wdFormUni"}),e}return!0};t={validWidgetUnique:C,handleClickWidget(e,t){t&&t.name&&(e.stopPropagation(),l.activeWidget=t,y.dispatchEvent("click-widget",{widget:t},e))},handleCopyWidget(e,t){var i,r=l["widgetObjList"],n=_xeUtils.default.findTree(r,e=>e.id===t.id,{children:"children"});n&&(e.stopPropagation(),C(t.name))&&(n=n["path"],n=Number(n[0]),(i=f(t.name)).title&&(i.title=(0,_ui.getI18n)("vxe.formDesign.widget.copyTitle",[(""+t.title).replace((0,_ui.getI18n)("vxe.formDesign.widget.copyTitle",[""]),"")])),n>=r.length-1?r.push(i):r.splice(n+1,0,i),l.activeWidget=i,l.widgetObjList=[...r],y.dispatchEvent("copy-widget",{widget:t,newWidget:i},e))},handleRemoveWidget(e,t){var i,r,n=l["widgetObjList"],d=_xeUtils.default.findTree(n,e=>e.id===t.id,{children:"children"});d&&({index:d,parent:i,items:r}=d,e.stopPropagation(),d>=r.length-1?l.activeWidget=r[d-1]:l.activeWidget=r[d+1]||null,i&&"row"===i.name?r[d]=v():r.splice(d,1),l.widgetObjList=[...n],y.dispatchEvent("remove-widget",{widget:t},e))}};const W=()=>{var{formRender:e,showPc:t,showMobile:i}=u;let r=(0,_defaultSettingData.getDefaultSettingFormData)({pcVisible:t,mobileVisible:i});return e&&(i=(t=_ui.renderer.get(e.name))?t.createFormDesignSettingFormConfig:null,r=(i?i({}):{})||{}),r},q=()=>{l.formData=W()},I=()=>{x()};Object.assign(c,y,t);return c.renderVN=()=>{var{height:e,showHeader:t}=u,i=g.value,r=d.header,n=d.footer;return(0,_vue.h)("div",{ref:o,class:["vxe-form-design",{["size--"+i]:i}],style:e?{height:(0,_dom.toCssUnit)(e)}:null},[t||r?(0,_vue.h)("div",{class:"vxe-form-design--header"},r?r({}):(i=d.extra,(0,_vue.h)("div",{class:"vxe-form-design--header-wrapper"},[(0,_vue.h)("div",{class:"vxe-form-design--header-left"}),(0,_vue.h)("div",{class:"vxe-form-design--header-middle"}),(0,_vue.h)("div",{class:"vxe-form-design--header-right"},[i?(0,_vue.h)("div",{class:"vxe-form-design--header-extra"},i({})):(0,_ui.renderEmptyElement)(c),(0,_vue.h)("div",{class:"vxe-form-design--header-setting"},[(0,_vue.h)(_button.default,{mode:"text",status:"primary",icon:(0,_ui.getIcon)().FORM_DESIGN_STYLE_SETTING,content:(0,_ui.getI18n)("vxe.formDesign.styleSetting.btn"),onClick:I})])])]))):(0,_vue.createCommentVNode)(),(0,_vue.h)("div",{class:"vxe-form-design--body"},[(0,_vue.h)(_layoutWidget.default),(0,_vue.h)(_layoutPreview.default),(0,_vue.h)(_layoutSetting.default),(0,_vue.h)(_layoutStyle.default,{ref:a})]),n?(0,_vue.h)("div",{class:"vxe-form-design--footer"},n?n({}):[]):(0,_vue.createCommentVNode)()])},(0,_vue.watch)(()=>u.widgets,()=>{b()}),(0,_vue.watch)(()=>u.widgets,()=>{b()}),(0,_vue.watch)(()=>u.config,e=>{_(e||{})}),q(),b(),u.config&&_(u.config),(0,_vue.provide)("$xeFormDesign",c),c},render(){return this.renderVN()}});

package/lib/form-design/src/form-view.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _ui = require("../../ui");
 var _vn = require("../../ui/src/vn");
@@ -15,7 +16,7 @@ var _formItem = _interopRequireDefault(require("../../form/src/form-item"));
 var _widgetInfo = require("./widget-info");
 var _log = require("../../ui/src/log");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'VxeFormView',
   props: {
     modelValue: Object,

package/lib/form-design/src/form-view.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_vn=require("../../ui/src/vn"),_defaultSettingData=require("./default-setting-data"),_form=_interopRequireDefault(require("../../form/src/form")),_formGroup=_interopRequireDefault(require("../../form/src/form-group")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_widgetInfo=require("./widget-info"),_log=require("../../ui/src/log");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"VxeFormView",props:{modelValue:Object,config:Object,readonly:Boolean,disabled:Boolean,viewRender:Object,formOptions:Object,createFormConfig:Function,size:{type:String,default:()=>(0,_ui.getConfig)().formView.size||(0,_ui.getConfig)().size}},emits:["update:modelValue","submit","reset"],setup(f,e){const{emit:i,slots:m}=e;var t=_xeUtils.default.uniqueId();const g=(0,_vue.ref)(),v=(0,_vue.ref)(),c=(0,_ui.useSize)(f)["computeSize"],_=(0,_vue.inject)("$xeFormDesignLayoutStyle",null),p=(0,_vue.reactive)({formConfig:{},formRules:{},widgetObjList:[]}),r={refElem:g},a={computeSize:c},w={xID:t,props:f,context:e,reactData:p,getRefMaps:()=>r,getComputeMaps:()=>a};const u=e=>{var t;return e&&({formConfig:e,widgetData:t}=e,n(e||{}),s(t||[])),(0,_vue.nextTick)()};const o=e=>{var{viewRender:t,createFormConfig:r,formOptions:i}=f,e={viewRender:t,formConfig:e};return r?r(e):(r=(t||{})["name"],r=(t=_ui.renderer.get(r)||{})?t.createFormViewFormConfig:null,Object.assign({},(r||_defaultSettingData.createDefaultFormViewPCFormConfig)(e),i))},n=e=>(p.formConfig=o(e),(0,_vue.nextTick)()),l=e=>{const u={},o={};return _xeUtils.default.eachTree(e,e=>{var{name:t,field:r,required:i}=e,t=_ui.renderer.get(t)||{},a=t.createFormDesignWidgetFieldValue,t=t.createFormDesignWidgetFieldRules;u[r]=a?a({widget:e,$formView:w}):V(e),t?(a=t({widget:e,$formView:w}))&&a.length&&(o[r]=a):i&&(o[r]=b())},{children:"children"}),{formData:u,formRules:o}},d=e=>(e||[]).map(e=>(0,_widgetInfo.configToWidget)(e)),s=e=>{var e=d(e),{formData:e,formRules:t}=(p.widgetObjList=e,l(e));return p.formRules=t,i("update:modelValue",Object.assign(e,f.modelValue)),(0,_vue.nextTick)()},V=e=>"subtable"===e.name?[]:null,b=()=>[{required:!0,content:"该填写该字段！"}],x=(e,t)=>{var e=e["field"],r=v.value;return r&&r.updateStatus({field:e},t),(0,_vue.nextTick)()};const D=(e,t,r)=>{i(e,(0,_ui.createEvent)(r,{$formView:w},t))},C=e=>e?_xeUtils.default.isArray(e)?e.map(e=>e.name):[e.name]:null;t={dispatchEvent:D,clearConfig:()=>u({formConfig:{},widgetData:[]}),loadConfig:u,parseConfig:e=>{var{formConfig:e,widgetData:t}=e||{},t=d(t||[]);return Object.assign(Object.assign({},l(t)),{formConfig:o(e||{}),widgetData:t})},loadFormConfig:n,loadWidgetData:s,updateWidgetStatus:x,setItemValue:(e,t)=>{var r=f["modelValue"],e=e["field"],i=v.value;return r&&(r[e]=t),i&&i.updateStatus({field:e},t),(0,_vue.nextTick)()},getItemValue:e=>{var t=f["modelValue"];return t?t[e.field]:null},validate(){var e=v.value;return e?e.validate():(0,_vue.nextTick)()},validateWidget(e){var t=v.value;return t?t.validateField(C(e)):(0,_vue.nextTick)()},clearValidate(e){var t=v.value;return t?t.clearValidate(C(e)):(0,_vue.nextTick)()},reset(){var e=p["widgetObjList"],e=l(e)["formData"];return i("update:modelValue",Object.assign({},e)),(0,_vue.nextTick)()},updateItemStatus(e,t){return(0,_log.warnLog)("vxe.error.delFunc",["updateItemStatus","updateWidgetStatus"]),x(e,t)}};const F=e=>{D("submit",e,e.$event)},O=e=>{D("reset",e,e.$event)};Object.assign(w,t,{});return w.renderVN=()=>{var{readonly:e,disabled:t,modelValue:r}=f;const{formConfig:i,formRules:a,widgetObjList:u}=p;var o=c.value,n=m.top,l=m.bottom;const d=m.header,s=m.footer;return(0,_vue.h)("div",{ref:g,class:["vxe-form-view",{["size--"+o]:o}]},[n?(0,_vue.h)("div",{class:"vxe-form-view--top"},(0,_vn.getSlotVNs)(n({$formView:w}))):(0,_ui.renderEmptyElement)(w),(0,_vue.h)(_form.default,Object.assign(Object.assign({ref:v},i),{data:r,customLayout:!0,readonly:e,disabled:t,span:24,rules:a,onSubmit:F,onReset:O}),{default(){const{readonly:n,disabled:l}=f;return[d?(0,_vue.h)(_formItem.default,{},{default(){return d({})}}):(0,_ui.renderEmptyElement)(w),...u.map(e=>{var t=e["name"],t=_ui.renderer.get(t)||{};const r=t.renderFormDesignWidgetView,i=t.renderFormDesignWidgetPreview,a=t.renderFormDesignWidgetMobilePreview;t=!!_;const u=e,o={widget:e,readonly:!!n,disabled:!!l,isEditMode:t,isViewMode:!t,$formDesign:null,$formView:w};return(0,_vue.h)(_formGroup.default,{key:e.id},{default(){if(_)if(2===_.reactData.activeTab){if(a)return(0,_vn.getSlotVNs)(a(u,o))}else if(i)return(0,_vn.getSlotVNs)(i(u,o));return r?(0,_vn.getSlotVNs)(r(u,o)):[]}})}),s?(0,_vue.h)(_formGroup.default,{span:24},{default(){return s({})}}):(0,_ui.renderEmptyElement)(w)]}}),l?(0,_vue.h)("div",{class:"vxe-form-view--bottom"},(0,_vn.getSlotVNs)(l({$formView:w}))):(0,_ui.renderEmptyElement)(w)])},(0,_vue.watch)(()=>f.config,e=>{u(e||{})}),f.config&&u(f.config),(0,_vue.provide)("$xeFormView",w),w},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_vn=require("../../ui/src/vn"),_defaultSettingData=require("./default-setting-data"),_form=_interopRequireDefault(require("../../form/src/form")),_formGroup=_interopRequireDefault(require("../../form/src/form-group")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_widgetInfo=require("./widget-info"),_log=require("../../ui/src/log");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeFormView",props:{modelValue:Object,config:Object,readonly:Boolean,disabled:Boolean,viewRender:Object,formOptions:Object,createFormConfig:Function,size:{type:String,default:()=>(0,_ui.getConfig)().formView.size||(0,_ui.getConfig)().size}},emits:["update:modelValue","submit","reset"],setup(f,e){const{emit:i,slots:m}=e;var t=_xeUtils.default.uniqueId();const g=(0,_vue.ref)(),v=(0,_vue.ref)(),c=(0,_ui.useSize)(f)["computeSize"],_=(0,_vue.inject)("$xeFormDesignLayoutStyle",null),p=(0,_vue.reactive)({formConfig:{},formRules:{},widgetObjList:[]}),r={refElem:g},a={computeSize:c},w={xID:t,props:f,context:e,reactData:p,getRefMaps:()=>r,getComputeMaps:()=>a};const u=e=>{var t;return e&&({formConfig:e,widgetData:t}=e,n(e||{}),s(t||[])),(0,_vue.nextTick)()};const o=e=>{var{viewRender:t,createFormConfig:r,formOptions:i}=f,e={viewRender:t,formConfig:e};return r?r(e):(r=(t||{})["name"],r=(t=_ui.renderer.get(r)||{})?t.createFormViewFormConfig:null,Object.assign({},(r||_defaultSettingData.createDefaultFormViewPCFormConfig)(e),i))},n=e=>(p.formConfig=o(e),(0,_vue.nextTick)()),l=e=>{const u={},o={};return _xeUtils.default.eachTree(e,e=>{var{name:t,field:r,required:i}=e,t=_ui.renderer.get(t)||{},a=t.createFormDesignWidgetFieldValue,t=t.createFormDesignWidgetFieldRules;u[r]=a?a({widget:e,$formView:w}):V(e),t?(a=t({widget:e,$formView:w}))&&a.length&&(o[r]=a):i&&(o[r]=b())},{children:"children"}),{formData:u,formRules:o}},d=e=>(e||[]).map(e=>(0,_widgetInfo.configToWidget)(e)),s=e=>{var e=d(e),{formData:e,formRules:t}=(p.widgetObjList=e,l(e));return p.formRules=t,i("update:modelValue",Object.assign(e,f.modelValue)),(0,_vue.nextTick)()},V=e=>"subtable"===e.name?[]:null,b=()=>[{required:!0,content:"该填写该字段！"}],x=(e,t)=>{var e=e["field"],r=v.value;return r&&r.updateStatus({field:e},t),(0,_vue.nextTick)()};const D=(e,t,r)=>{i(e,(0,_ui.createEvent)(r,{$formView:w},t))},C=e=>e?_xeUtils.default.isArray(e)?e.map(e=>e.name):[e.name]:null;t={dispatchEvent:D,clearConfig:()=>u({formConfig:{},widgetData:[]}),loadConfig:u,parseConfig:e=>{var{formConfig:e,widgetData:t}=e||{},t=d(t||[]);return Object.assign(Object.assign({},l(t)),{formConfig:o(e||{}),widgetData:t})},loadFormConfig:n,loadWidgetData:s,updateWidgetStatus:x,setItemValue:(e,t)=>{var r=f["modelValue"],e=e["field"],i=v.value;return r&&(r[e]=t),i&&i.updateStatus({field:e},t),(0,_vue.nextTick)()},getItemValue:e=>{var t=f["modelValue"];return t?t[e.field]:null},validate(){var e=v.value;return e?e.validate():(0,_vue.nextTick)()},validateWidget(e){var t=v.value;return t?t.validateField(C(e)):(0,_vue.nextTick)()},clearValidate(e){var t=v.value;return t?t.clearValidate(C(e)):(0,_vue.nextTick)()},reset(){var e=p["widgetObjList"],e=l(e)["formData"];return i("update:modelValue",Object.assign({},e)),(0,_vue.nextTick)()},updateItemStatus(e,t){return(0,_log.warnLog)("vxe.error.delFunc",["updateItemStatus","updateWidgetStatus"]),x(e,t)}};const F=e=>{D("submit",e,e.$event)},q=e=>{D("reset",e,e.$event)};Object.assign(w,t,{});return w.renderVN=()=>{var{readonly:e,disabled:t,modelValue:r}=f;const{formConfig:i,formRules:a,widgetObjList:u}=p;var o=c.value,n=m.top,l=m.bottom;const d=m.header,s=m.footer;return(0,_vue.h)("div",{ref:g,class:["vxe-form-view",{["size--"+o]:o}]},[n?(0,_vue.h)("div",{class:"vxe-form-view--top"},(0,_vn.getSlotVNs)(n({$formView:w}))):(0,_ui.renderEmptyElement)(w),(0,_vue.h)(_form.default,Object.assign(Object.assign({ref:v},i),{data:r,customLayout:!0,readonly:e,disabled:t,span:24,rules:a,onSubmit:F,onReset:q}),{default(){const{readonly:n,disabled:l}=f;return[d?(0,_vue.h)(_formItem.default,{},{default(){return d({})}}):(0,_ui.renderEmptyElement)(w),...u.map(e=>{var t=e["name"],t=_ui.renderer.get(t)||{};const r=t.renderFormDesignWidgetView,i=t.renderFormDesignWidgetPreview,a=t.renderFormDesignWidgetMobilePreview;t=!!_;const u=e,o={widget:e,readonly:!!n,disabled:!!l,isEditMode:t,isViewMode:!t,$formDesign:null,$formView:w};return(0,_vue.h)(_formGroup.default,{key:e.id},{default(){if(_)if(2===_.reactData.activeTab){if(a)return(0,_vn.getSlotVNs)(a(u,o))}else if(i)return(0,_vn.getSlotVNs)(i(u,o));return r?(0,_vn.getSlotVNs)(r(u,o)):[]}})}),s?(0,_vue.h)(_formGroup.default,{span:24},{default(){return s({})}}):(0,_ui.renderEmptyElement)(w)]}}),l?(0,_vue.h)("div",{class:"vxe-form-view--bottom"},(0,_vn.getSlotVNs)(l({$formView:w}))):(0,_ui.renderEmptyElement)(w)])},(0,_vue.watch)(()=>f.config,e=>{u(e||{})}),f.config&&u(f.config),(0,_vue.provide)("$xeFormView",w),w},render(){return this.renderVN()}});

package/lib/form-design/src/layout-preview.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _vn = require("../../ui/src/vn");
 var _layoutViewItem = require("./layout-view-item");
@@ -12,7 +13,7 @@ var _util = require("../src/util");
 var _form = _interopRequireDefault(require("../../form/src/form"));
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'FormDesignLayoutPreview',
   props: {},
   emits: [],

package/lib/form-design/src/layout-preview.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_layoutViewItem=require("./layout-view-item"),_util=require("../src/util"),_form=_interopRequireDefault(require("../../form/src/form")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"FormDesignLayoutPreview",props:{},emits:[],setup(){const o=(0,_vue.inject)("$xeFormDesign",null);if(!o)return()=>[];const u=o["reactData"],e=e=>{const{widgetObjList:t,dragWidget:i}=u;i&&(e.preventDefault(),_xeUtils.default.findTree(t,e=>e&&e.id===i.id,{children:"children"})||(u.sortWidget=i,t.push(i),o.dispatchEvent("drag-widget",{widget:i},e)))},i=e=>{e.preventDefault()};let l=Date.now();const r=e=>{const{widgetObjList:t,sortWidget:i}=u;var r,n,d,s,a;e.stopPropagation(),l>Date.now()-300?e.preventDefault():i&&!(0,_util.hasFormDesignLayoutType)(i)&&(r=_xeUtils.default.findTree(t,e=>e.id===i.id,{children:"children"}))&&({item:n,index:d,items:s,parent:a}=r,a&&"row"===a.name?r.items[r.index]=o.createEmptyWidget():s.splice(d,1),t.unshift(n),l=Date.now(),o.dispatchEvent("drag-widget",{widget:n},e))},n=e=>{const{widgetObjList:t,sortWidget:i}=u;var r,n,d,s,a;e.stopPropagation(),l>Date.now()-300?e.preventDefault():i&&!(0,_util.hasFormDesignLayoutType)(i)&&(r=_xeUtils.default.findTree(t,e=>e.id===i.id,{children:"children"}))&&({item:n,index:d,items:s,parent:a}=r,a&&"row"===a.name?r.items[r.index]=o.createEmptyWidget():s.splice(d,1),t.push(n),l=Date.now(),o.dispatchEvent("drag-widget",{widget:n},e))};return()=>{const t=u["widgetObjList"];return(0,_vue.h)("div",{class:"vxe-form-design--preview",onDragenter:e,onDragover:i},[(0,_vue.h)("div",{class:"vxe-form-design--preview-wrapper"},[(0,_vue.h)("div",{class:"vxe-form-design--preview-place-widget",onDragenter:r}),(0,_vue.h)(_form.default,{customLayout:!0,span:24,vertical:!0},{default(){return(0,_vue.h)(_vue.TransitionGroup,{class:"vxe-form-design--preview-list",tag:"div",name:"vxe-form-design--preview-list"},{default:()=>t.map((r,e)=>(0,_vue.h)(_layoutViewItem.ViewItemComponent,{key:r.id,item:r,itemIndex:e,items:t},{default(){var e=r["name"],e=_core.renderer.get(e)||{},e=e.renderFormDesignWidgetEdit||e.renderFormDesignWidgetView,t=r,i={widget:r,readonly:!1,disabled:!1,isEditMode:!0,isViewMode:!1,$formDesign:o,$formView:null};return e?(0,_vn.getSlotVNs)(e(t,i)):[]}}))})}}),(0,_vue.h)("div",{class:"vxe-form-design--preview-place-widget",onDragenter:n})])])}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_layoutViewItem=require("./layout-view-item"),_util=require("../src/util"),_form=_interopRequireDefault(require("../../form/src/form")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"FormDesignLayoutPreview",props:{},emits:[],setup(){const a=(0,_vue.inject)("$xeFormDesign",null);if(!a)return()=>[];const u=a["reactData"],e=e=>{const{widgetObjList:t,dragWidget:i}=u;i&&(e.preventDefault(),_xeUtils.default.findTree(t,e=>e&&e.id===i.id,{children:"children"})||(u.sortWidget=i,t.push(i),a.dispatchEvent("drag-widget",{widget:i},e)))},i=e=>{e.preventDefault()};let l=Date.now();const r=e=>{const{widgetObjList:t,sortWidget:i}=u;var r,n,d,o,s;e.stopPropagation(),l>Date.now()-300?e.preventDefault():i&&!(0,_util.hasFormDesignLayoutType)(i)&&(r=_xeUtils.default.findTree(t,e=>e.id===i.id,{children:"children"}))&&({item:n,index:d,items:o,parent:s}=r,s&&"row"===s.name?r.items[r.index]=a.createEmptyWidget():o.splice(d,1),t.unshift(n),l=Date.now(),a.dispatchEvent("drag-widget",{widget:n},e))},n=e=>{const{widgetObjList:t,sortWidget:i}=u;var r,n,d,o,s;e.stopPropagation(),l>Date.now()-300?e.preventDefault():i&&!(0,_util.hasFormDesignLayoutType)(i)&&(r=_xeUtils.default.findTree(t,e=>e.id===i.id,{children:"children"}))&&({item:n,index:d,items:o,parent:s}=r,s&&"row"===s.name?r.items[r.index]=a.createEmptyWidget():o.splice(d,1),t.push(n),l=Date.now(),a.dispatchEvent("drag-widget",{widget:n},e))};return()=>{const t=u["widgetObjList"];return(0,_vue.h)("div",{class:"vxe-form-design--preview",onDragenter:e,onDragover:i},[(0,_vue.h)("div",{class:"vxe-form-design--preview-wrapper"},[(0,_vue.h)("div",{class:"vxe-form-design--preview-place-widget",onDragenter:r}),(0,_vue.h)(_form.default,{customLayout:!0,span:24,vertical:!0},{default(){return(0,_vue.h)(_vue.TransitionGroup,{class:"vxe-form-design--preview-list",tag:"div",name:"vxe-form-design--preview-list"},{default:()=>t.map((r,e)=>(0,_vue.h)(_layoutViewItem.ViewItemComponent,{key:r.id,item:r,itemIndex:e,items:t},{default(){var e=r["name"],e=_core.renderer.get(e)||{},e=e.renderFormDesignWidgetEdit||e.renderFormDesignWidgetView,t=r,i={widget:r,readonly:!1,disabled:!1,isEditMode:!0,isViewMode:!1,$formDesign:a,$formView:null};return e?(0,_vn.getSlotVNs)(e(t,i)):[]}}))})}}),(0,_vue.h)("div",{class:"vxe-form-design--preview-place-widget",onDragenter:n})])])}}});

package/lib/form-design/src/layout-setting.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _vn = require("../../ui/src/vn");
 var _tabs = _interopRequireDefault(require("../../tabs/src/tabs"));
 var _tabPane = _interopRequireDefault(require("../../tabs/src/tab-pane"));
 var _defaultSettingForm = require("./default-setting-form");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'FormDesignLayoutSetting',
   props: {},
   emits: [],

package/lib/form-design/src/layout-setting.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_tabs=_interopRequireDefault(require("../../tabs/src/tabs")),_tabPane=_interopRequireDefault(require("../../tabs/src/tab-pane")),_defaultSettingForm=require("./default-setting-form");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"FormDesignLayoutSetting",props:{},emits:[],setup(){const r=(0,_vue.inject)("$xeFormDesign",null);if(!r)return()=>[];const{props:i,reactData:n}=r,t=(0,_vue.ref)(1);return(0,_vue.watch)(()=>n.activeWidget,()=>{t.value=1}),()=>(0,_vue.h)("div",{class:"vxe-form-design--setting"},[(0,_vue.h)("div",{class:"vxe-form-design--setting-form"},[(0,_vue.h)(_tabs.default,{modelValue:t.value,titleWidth:"50%",titleAlign:"center",padding:!0,class:"vxe-form-design--setting-form-tabs","onUpdate:modelValue"(e){t.value=e}},{default(){return[(0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetPropTab"),name:1},{default(){var e=n["activeWidget"];if(e){var t=_core.renderer.get(e.name),t=t?t.renderFormDesignWidgetFormView:null;if(t)return(0,_vue.h)("div",{class:"vxe-form-design--custom-widget-form-view"},(0,_vn.getSlotVNs)(t(e,{isEditMode:!0,isViewMode:!1,widget:e,$formDesign:r,$formView:null})))}return(0,_vue.createCommentVNode)()}}),(0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetFormTab"),name:2},{default(){var e=i["formRender"],t=n["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignSettingFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:r})))}return(0,_vue.h)(_defaultSettingForm.DefaultSettingFormComponent,{formData:t})}})]}})])])}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_tabs=_interopRequireDefault(require("../../tabs/src/tabs")),_tabPane=_interopRequireDefault(require("../../tabs/src/tab-pane")),_defaultSettingForm=require("./default-setting-form");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"FormDesignLayoutSetting",props:{},emits:[],setup(){const r=(0,_vue.inject)("$xeFormDesign",null);if(!r)return()=>[];const{props:i,reactData:n}=r,t=(0,_vue.ref)(1);return(0,_vue.watch)(()=>n.activeWidget,()=>{t.value=1}),()=>(0,_vue.h)("div",{class:"vxe-form-design--setting"},[(0,_vue.h)("div",{class:"vxe-form-design--setting-form"},[(0,_vue.h)(_tabs.default,{modelValue:t.value,titleWidth:"50%",titleAlign:"center",padding:!0,class:"vxe-form-design--setting-form-tabs","onUpdate:modelValue"(e){t.value=e}},{default(){return[(0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetPropTab"),name:1},{default(){var e=n["activeWidget"];if(e){var t=_core.renderer.get(e.name),t=t?t.renderFormDesignWidgetFormView:null;if(t)return(0,_vue.h)("div",{class:"vxe-form-design--custom-widget-form-view"},(0,_vn.getSlotVNs)(t(e,{isEditMode:!0,isViewMode:!1,widget:e,$formDesign:r,$formView:null})))}return(0,_vue.createCommentVNode)()}}),(0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetFormTab"),name:2},{default(){var e=i["formRender"],t=n["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignSettingFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:r})))}return(0,_vue.h)(_defaultSettingForm.DefaultSettingFormComponent,{formData:t})}})]}})])])}});

package/lib/form-design/src/layout-style.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _vn = require("../../ui/src/vn");
 var _modal = _interopRequireDefault(require("../../modal/src/modal"));
@@ -14,7 +15,7 @@ var _formView = _interopRequireDefault(require("./form-view"));
 var _defaultStyleForm = require("./default-style-form");
 var _defaultSettingData = require("./default-setting-data");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   name: 'FormDesignLayoutStyle',
   props: {},
   emits: [],

package/lib/form-design/src/layout-style.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_modal=_interopRequireDefault(require("../../modal/src/modal")),_tabs=_interopRequireDefault(require("../../tabs/src/tabs")),_tabPane=_interopRequireDefault(require("../../tabs/src/tab-pane")),_formView=_interopRequireDefault(require("./form-view")),_defaultStyleForm=require("./default-style-form"),_defaultSettingData=require("./default-setting-data");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({name:"FormDesignLayoutStyle",props:{},emits:[],setup(){const r=(0,_vue.inject)("$xeFormDesign",null),o=(0,_vue.reactive)({activeTab:1});var e={reactData:o,renderVN(){return[]}};if(r){const{props:a,reactData:i}=r,n=(0,_vue.ref)(!1),u=(0,_vue.ref)(null),l=(0,_vue.ref)({}),s=()=>{u.value=r.getConfig()},v=e=>{var t=e["viewRender"],r=o["activeTab"],t=(t||{})["name"],t=_core.renderer.get(t)||{},a=t?t.createFormViewFormConfig:null,t=t?t.createFormViewMobileFormConfig:null;return(2===r?t||_defaultSettingData.createDefaultFormViewMobileFormConfig:a||_defaultSettingData.createDefaultFormViewPCFormConfig)(e)};var t={updatePreviewView:s,openStylePreview(){var e=a["showPc"];s(),o.activeTab=e?1:2,n.value=!0}};Object.assign(e,t);const f=()=>{var e=a["formRender"],t=i["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignMobileStyleFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-mobile-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:r,formConfig:t})))}return(0,_vue.h)(_defaultStyleForm.DefaultMobileStyleFormComponent,{formData:t})},d=()=>{var e=a["formRender"],t=i["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignStyleFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-pc-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:r,formConfig:t})))}return(0,_vue.h)(_defaultStyleForm.DefaultPCStyleFormComponent,{formData:t})};e.renderVN=()=>{const{showPc:t,showMobile:r}=a;return(0,_vue.h)(_modal.default,{modelValue:n.value,title:(0,_core.getI18n)("vxe.formDesign.styleSetting.title"),height:"90vh",width:"90vw",escClosable:!0,maskClosable:!0,destroyOnClose:!0,showMaximize:!0,transfer:!0,"onUpdate:modelValue"(e){n.value=e}},{default(){return(0,_vue.h)("div",{class:"vxe-form-design--layout-style"},[(e=o.activeTab,(0,_vue.h)("div",{class:["vxe-form-design--layout-style-preview","is--"+(2===e?"mobile":"pc")]},[(0,_vue.h)(_formView.default,{modelValue:l.value,config:u.value,createFormConfig:v,"onUpdate:modelValue"(e){l.value=e}})])),(t||r?()=>{const{showPc:t,showMobile:r}=a;var e=o["activeTab"];return(0,_vue.h)("div",{class:"vxe-form-design--layout-style-setting"},[(0,_vue.h)(_tabs.default,{modelValue:e,titleWidth:t&&r?"50%":"100%",titleAlign:"center",padding:!0,onChange:s,"onUpdate:modelValue"(e){o.activeTab=e}},{default(){var e=[];return t&&e.push((0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.displaySetting.pc"),icon:(0,_core.getIcon)().FORM_DESIGN_PROPS_PC,k:1,name:1},{default(){return d()}})),r&&e.push((0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.displaySetting.mobile"),icon:(0,_core.getIcon)().FORM_DESIGN_PROPS_MOBILE,key:2,name:2},{default(){return f()}})),e}})])}:(0,_vue.createCommentVNode))()]);var e}})},(0,_vue.provide)("$xeFormDesignLayoutStyle",e)}return e},render(){return this.renderVN()}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_modal=_interopRequireDefault(require("../../modal/src/modal")),_tabs=_interopRequireDefault(require("../../tabs/src/tabs")),_tabPane=_interopRequireDefault(require("../../tabs/src/tab-pane")),_formView=_interopRequireDefault(require("./form-view")),_defaultStyleForm=require("./default-style-form"),_defaultSettingData=require("./default-setting-data");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"FormDesignLayoutStyle",props:{},emits:[],setup(){const t=(0,_vue.inject)("$xeFormDesign",null),a=(0,_vue.reactive)({activeTab:1});var e={reactData:a,renderVN(){return[]}};if(t){const{props:o,reactData:i}=t,n=(0,_vue.ref)(!1),u=(0,_vue.ref)(null),l=(0,_vue.ref)({}),s=()=>{u.value=t.getConfig()},m=e=>{var r=e["viewRender"],t=a["activeTab"],r=(r||{})["name"],r=_core.renderer.get(r)||{},o=r?r.createFormViewFormConfig:null,r=r?r.createFormViewMobileFormConfig:null;return(2===t?r||_defaultSettingData.createDefaultFormViewMobileFormConfig:o||_defaultSettingData.createDefaultFormViewPCFormConfig)(e)};var r={updatePreviewView:s,openStylePreview(){var e=o["showPc"];s(),a.activeTab=e?1:2,n.value=!0}};Object.assign(e,r);const v=()=>{var e=o["formRender"],r=i["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignMobileStyleFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-mobile-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:t,formConfig:r})))}return(0,_vue.h)(_defaultStyleForm.DefaultMobileStyleFormComponent,{formData:r})},f=()=>{var e=o["formRender"],r=i["formData"];if(e){e=_core.renderer.get(e.name),e=e?e.renderFormDesignStyleFormView:null;if(e)return(0,_vue.h)("div",{class:"vxe-form-design--custom-setting-pc-form-view"},(0,_vn.getSlotVNs)(e({},{$formDesign:t,formConfig:r})))}return(0,_vue.h)(_defaultStyleForm.DefaultPCStyleFormComponent,{formData:r})};e.renderVN=()=>{const{showPc:r,showMobile:t}=o;return(0,_vue.h)(_modal.default,{modelValue:n.value,title:(0,_core.getI18n)("vxe.formDesign.styleSetting.title"),height:"90vh",width:"90vw",escClosable:!0,maskClosable:!0,destroyOnClose:!0,showMaximize:!0,transfer:!0,"onUpdate:modelValue"(e){n.value=e}},{default(){return(0,_vue.h)("div",{class:"vxe-form-design--layout-style"},[(e=a.activeTab,(0,_vue.h)("div",{class:["vxe-form-design--layout-style-preview","is--"+(2===e?"mobile":"pc")]},[(0,_vue.h)(_formView.default,{modelValue:l.value,config:u.value,createFormConfig:m,"onUpdate:modelValue"(e){l.value=e}})])),(r||t?()=>{const{showPc:r,showMobile:t}=o;var e=a["activeTab"];return(0,_vue.h)("div",{class:"vxe-form-design--layout-style-setting"},[(0,_vue.h)(_tabs.default,{modelValue:e,titleWidth:r&&t?"50%":"100%",titleAlign:"center",padding:!0,onChange:s,"onUpdate:modelValue"(e){a.activeTab=e}},{default(){var e=[];return r&&e.push((0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.displaySetting.pc"),icon:(0,_core.getIcon)().FORM_DESIGN_PROPS_PC,k:1,name:1},{default(){return f()}})),t&&e.push((0,_vue.h)(_tabPane.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.displaySetting.mobile"),icon:(0,_core.getIcon)().FORM_DESIGN_PROPS_MOBILE,key:2,name:2},{default(){return v()}})),e}})])}:(0,_vue.createCommentVNode))()]);var e}})},(0,_vue.provide)("$xeFormDesignLayoutStyle",e)}return e},render(){return this.renderVN()}});

package/lib/form-design/src/layout-view-item.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ViewItemComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _core = require("@vxe-ui/core");
 var _button = _interopRequireDefault(require("../../button/src/button"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const ViewItemComponent = exports.ViewItemComponent = (0, _vue.defineComponent)({
+const ViewItemComponent = exports.ViewItemComponent = (0, _comp.defineVxeComponent)({
   name: 'FormDesignLayoutViewItem',
   props: {
     item: {

package/lib/form-design/src/layout-view-item.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ViewItemComponent=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_core=require("@vxe-ui/core"),_button=_interopRequireDefault(require("../../button/src/button"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const ViewItemComponent=exports.ViewItemComponent=(0,_vue.defineComponent)({name:"FormDesignLayoutViewItem",props:{item:{type:Object,default:()=>({})},itemIndex:{type:Number,default:0},items:{type:Array,default:()=>[]}},emits:[],setup(a,{slots:o}){const s=(0,_vue.inject)("$xeFormDesign",null);if(!s)return()=>[];const u=s["reactData"],l=e=>{var t=u["widgetObjList"],e=e.currentTarget;const i=Number(e.getAttribute("data-widget-id"));e=_xeUtils.default.findTree(t,e=>e&&e.id===i,{children:"children"});e&&(u.dragWidget=null,u.sortWidget=e.item)},c=()=>{u.activeWidget=u.sortWidget,u.sortWidget=null},g=e=>{const{widgetObjList:t,sortWidget:i}=u;var r=s.internalData,n=r["lastDragTime"];if(n&&n>Date.now()-300)e.preventDefault();else if(i){var d,n=e.currentTarget;e.preventDefault();const a=Number(n.getAttribute("data-widget-id"));a!==i.id&&(n=_xeUtils.default.findTree(t,e=>e&&e.id===a,{children:"children"}))&&(d=_xeUtils.default.findTree(t,e=>e&&e.id===i.id,{children:"children"}))&&(d.parent&&"row"===d.parent.name?d.items[d.index]=s.createEmptyWidget():d.items.splice(d.index,1),n.items.splice(n.index,0,d.item),r.lastDragTime=Date.now(),s.dispatchEvent("drag-widget",{widget:d.item},e))}};return()=>{var{dragWidget:e,activeWidget:t,sortWidget:i}=u;const r=a["item"];var n=r["name"],t=t&&t.id===r.id,d=o.default;return(0,_vue.h)("div",{key:r.id,"data-widget-id":r.id,draggable:!0,class:["vxe-form-design--preview-item","widget-"+_xeUtils.default.kebabCase(n),{"is--active":t,"is--sort":i&&i.id===r.id,"is--drag":e&&e.id===r.id}],onDragstart:l,onDragend:c,onDragenter:g,onClick(e){var t;e=e,t=r,s.handleClickWidget(e,t)}},[(0,_vue.h)("div",{class:"vxe-form-design--preview-item-view vxe-form--item-row"},d?d({}):[]),t?(0,_vue.h)("div",{class:"vxe-form-design--preview-item-operate"},[(0,_vue.h)(_button.default,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_COPY,status:"primary",size:"mini",circle:!0,onClick(e){s.handleCopyWidget(e.$event,r)}}),(0,_vue.h)(_button.default,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_DELETE,status:"danger",size:"mini",circle:!0,onClick(e){s.handleRemoveWidget(e.$event,r)}})]):(0,_vue.createCommentVNode)()])}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ViewItemComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_core=require("@vxe-ui/core"),_button=_interopRequireDefault(require("../../button/src/button"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const ViewItemComponent=exports.ViewItemComponent=(0,_comp.defineVxeComponent)({name:"FormDesignLayoutViewItem",props:{item:{type:Object,default:()=>({})},itemIndex:{type:Number,default:0},items:{type:Array,default:()=>[]}},emits:[],setup(a,{slots:o}){const s=(0,_vue.inject)("$xeFormDesign",null);if(!s)return()=>[];const u=s["reactData"],l=e=>{var t=u["widgetObjList"],e=e.currentTarget;const i=Number(e.getAttribute("data-widget-id"));e=_xeUtils.default.findTree(t,e=>e&&e.id===i,{children:"children"});e&&(u.dragWidget=null,u.sortWidget=e.item)},c=()=>{u.activeWidget=u.sortWidget,u.sortWidget=null},m=e=>{const{widgetObjList:t,sortWidget:i}=u;var r=s.internalData,n=r["lastDragTime"];if(n&&n>Date.now()-300)e.preventDefault();else if(i){var d,n=e.currentTarget;e.preventDefault();const a=Number(n.getAttribute("data-widget-id"));a!==i.id&&(n=_xeUtils.default.findTree(t,e=>e&&e.id===a,{children:"children"}))&&(d=_xeUtils.default.findTree(t,e=>e&&e.id===i.id,{children:"children"}))&&(d.parent&&"row"===d.parent.name?d.items[d.index]=s.createEmptyWidget():d.items.splice(d.index,1),n.items.splice(n.index,0,d.item),r.lastDragTime=Date.now(),s.dispatchEvent("drag-widget",{widget:d.item},e))}};return()=>{var{dragWidget:e,activeWidget:t,sortWidget:i}=u;const r=a["item"];var n=r["name"],t=t&&t.id===r.id,d=o.default;return(0,_vue.h)("div",{key:r.id,"data-widget-id":r.id,draggable:!0,class:["vxe-form-design--preview-item","widget-"+_xeUtils.default.kebabCase(n),{"is--active":t,"is--sort":i&&i.id===r.id,"is--drag":e&&e.id===r.id}],onDragstart:l,onDragend:c,onDragenter:m,onClick(e){var t;e=e,t=r,s.handleClickWidget(e,t)}},[(0,_vue.h)("div",{class:"vxe-form-design--preview-item-view vxe-form--item-row"},d?d({}):[]),t?(0,_vue.h)("div",{class:"vxe-form-design--preview-item-operate"},[(0,_vue.h)(_button.default,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_COPY,status:"primary",size:"mini",circle:!0,onClick(e){s.handleCopyWidget(e.$event,r)}}),(0,_vue.h)(_button.default,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_DELETE,status:"danger",size:"mini",circle:!0,onClick(e){s.handleRemoveWidget(e.$event,r)}})]):(0,_vue.createCommentVNode)()])}}});

package/lib/form-design/src/layout-widget.js

@@ -5,12 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _core = require("@vxe-ui/core");
 var _vn = require("../../ui/src/vn");
 var _widgetInfo = require("./widget-info");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = exports.default = (0, _vue.defineComponent)({
+var _default = exports.default = (0, _comp.defineVxeComponent)({
   props: {},
   emits: [],
   setup() {

package/lib/form-design/src/layout-widget.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_widgetInfo=require("./widget-info");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_vue.defineComponent)({props:{},emits:[],setup(){const g=(0,_vue.inject)("$xeFormDesign",null);if(!g)return()=>[];const n=g["reactData"],a=e=>{var t,i=e.currentTarget,r=e.dataTransfer,i=i.getAttribute("data-widget-name")||"";g.validWidgetUnique(i)?(t=g.createWidget(i),r&&r.setData("text/plain",i),n.sortWidget=null,n.dragWidget=t):e.preventDefault()},s=e=>{var t;e.preventDefault(),n.dragWidget&&(t=n.dragWidget,n.activeWidget=t,g.dispatchEvent("add-widget",{newWidget:t},e)),n.dragWidget=null,n.sortWidget=null},o=(e,t)=>{var i;g.validWidgetUnique(t)&&(i=n["widgetObjList"],t=g.createWidget(t),i.push(t),n.activeWidget=t,n.sortWidget=null,n.dragWidget=null,g.dispatchEvent("add-widget",{newWidget:t},e))},e=()=>{var e=n["widgetConfigs"];return e.map((d,e)=>{var{title:t,group:i}=d;return(0,_vue.h)("div",{key:e,class:"vxe-form-design--widget-group"},[(0,_vue.h)("div",{class:"vxe-form-design--widget-title"},i?(0,_core.getI18n)("vxe.formDesign.widget.group."+i):""+(t||"")),(0,_vue.h)("div",{class:"vxe-form-design--widget-list",onDragover(e){{var t=d;const{widgetObjList:i,dragWidget:r}=n;r&&t.children.some(e=>e.name===r.name)&&(t=_xeUtils.default.findTree(i,e=>e&&e.id===r.id,{children:"children"}))&&t.items.splice(t.index,1)}}},(e=>{const n=[];return e.children&&e.children.forEach((e,t)=>{const i=e["name"];var e=(0,_widgetInfo.getWidgetConfigTitle)(i,g),r=_core.renderer.get(i)||{},d=(0,_widgetInfo.getWidgetConfig)(i),r=r.renderFormDesignWidgetItem;n.push((0,_vue.h)("div",{key:t,class:"vxe-form-design--widget-item"},(0,_vue.h)("div",{class:"vxe-form-design--widget-box","data-widget-name":i,title:e,draggable:!0,onDragstart:a,onDragend:s},r?(0,_vn.getSlotVNs)(r({},{$formDesign:g})):[(0,_vue.h)("i",{class:["vxe-form-design--widget-item-icon",d&&d.icon||""]}),(0,_vue.h)("span",{class:"vxe-form-design--widget-item-name"},e),(0,_vue.h)("span",{class:"vxe-form-design--widget-item-add",onClick(e){o(e,i)}},[(0,_vue.h)("i",{class:(0,_core.getIcon)().FORM_DESIGN_WIDGET_ADD})])])))}),n})(d))])})};return()=>(0,_vue.h)("div",{class:"vxe-form-design--widget"},e())}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_widgetInfo=require("./widget-info");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({props:{},emits:[],setup(){const g=(0,_vue.inject)("$xeFormDesign",null);if(!g)return()=>[];const n=g["reactData"],a=e=>{var t,i=e.currentTarget,r=e.dataTransfer,i=i.getAttribute("data-widget-name")||"";g.validWidgetUnique(i)?(t=g.createWidget(i),r&&r.setData("text/plain",i),n.sortWidget=null,n.dragWidget=t):e.preventDefault()},s=e=>{var t;e.preventDefault(),n.dragWidget&&(t=n.dragWidget,n.activeWidget=t,g.dispatchEvent("add-widget",{newWidget:t},e)),n.dragWidget=null,n.sortWidget=null},o=(e,t)=>{var i;g.validWidgetUnique(t)&&(i=n["widgetObjList"],t=g.createWidget(t),i.push(t),n.activeWidget=t,n.sortWidget=null,n.dragWidget=null,g.dispatchEvent("add-widget",{newWidget:t},e))},e=()=>{var e=n["widgetConfigs"];return e.map((d,e)=>{var{title:t,group:i}=d;return(0,_vue.h)("div",{key:e,class:"vxe-form-design--widget-group"},[(0,_vue.h)("div",{class:"vxe-form-design--widget-title"},i?(0,_core.getI18n)("vxe.formDesign.widget.group."+i):""+(t||"")),(0,_vue.h)("div",{class:"vxe-form-design--widget-list",onDragover(e){{var t=d;const{widgetObjList:i,dragWidget:r}=n;r&&t.children.some(e=>e.name===r.name)&&(t=_xeUtils.default.findTree(i,e=>e&&e.id===r.id,{children:"children"}))&&t.items.splice(t.index,1)}}},(e=>{const n=[];return e.children&&e.children.forEach((e,t)=>{const i=e["name"];var e=(0,_widgetInfo.getWidgetConfigTitle)(i,g),r=_core.renderer.get(i)||{},d=(0,_widgetInfo.getWidgetConfig)(i),r=r.renderFormDesignWidgetItem;n.push((0,_vue.h)("div",{key:t,class:"vxe-form-design--widget-item"},(0,_vue.h)("div",{class:"vxe-form-design--widget-box","data-widget-name":i,title:e,draggable:!0,onDragstart:a,onDragend:s},r?(0,_vn.getSlotVNs)(r({},{$formDesign:g})):[(0,_vue.h)("i",{class:["vxe-form-design--widget-item-icon",d&&d.icon||""]}),(0,_vue.h)("span",{class:"vxe-form-design--widget-item-name"},e),(0,_vue.h)("span",{class:"vxe-form-design--widget-item-add",onClick(e){o(e,i)}},[(0,_vue.h)("i",{class:(0,_core.getIcon)().FORM_DESIGN_WIDGET_ADD})])])))}),n})(d))])})};return()=>(0,_vue.h)("div",{class:"vxe-form-design--widget"},e())}});

package/lib/form-design/widget-input/input-form.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WidgetInputFormComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _form = _interopRequireDefault(require("../../form/src/form"));
 var _formItem = _interopRequireDefault(require("../../form/src/form-item"));
@@ -12,7 +13,7 @@ var _input = _interopRequireDefault(require("../../input/src/input"));
 var _switch = _interopRequireDefault(require("../../switch/src/switch"));
 var _use = require("../../form-design/src/use");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const WidgetInputFormComponent = exports.WidgetInputFormComponent = (0, _vue.defineComponent)({
+const WidgetInputFormComponent = exports.WidgetInputFormComponent = (0, _comp.defineVxeComponent)({
   props: {
     renderOpts: {
       type: Object,

package/lib/form-design/widget-input/input-form.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetInputFormComponent=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_input=_interopRequireDefault(require("../../input/src/input")),_switch=_interopRequireDefault(require("../../switch/src/switch")),_use=require("../../form-design/src/use");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetInputFormComponent=exports.WidgetInputFormComponent=(0,_vue.defineComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(r){const u=(0,_use.useWidgetName)(r)["computeKebabCaseName"];return()=>{var e=r["renderParams"];const t=e["widget"];e=u.value;return(0,_vue.h)(_form.default,{class:["vxe-form-design--widget-render-form-wrapper","widget-"+e],vertical:!0,span:24,titleBold:!0,titleOverflow:!0,data:t.options},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.name")},{default(){return(0,_vue.h)(_input.default,{modelValue:t.title,"onUpdate:modelValue"(e){t.title=e}})}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.placeholder"),field:"placeholder",itemRender:{name:"VxeInput"}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.required")},{default(){return(0,_vue.h)(_switch.default,{modelValue:t.required,"onUpdate:modelValue"(e){t.required=e}})}})]}})}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetInputFormComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_input=_interopRequireDefault(require("../../input/src/input")),_switch=_interopRequireDefault(require("../../switch/src/switch")),_use=require("../../form-design/src/use");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetInputFormComponent=exports.WidgetInputFormComponent=(0,_comp.defineVxeComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(t){const u=(0,_use.useWidgetName)(t)["computeKebabCaseName"];return()=>{var e=t["renderParams"];const r=e["widget"];e=u.value;return(0,_vue.h)(_form.default,{class:["vxe-form-design--widget-render-form-wrapper","widget-"+e],vertical:!0,span:24,titleBold:!0,titleOverflow:!0,data:r.options},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.name")},{default(){return(0,_vue.h)(_input.default,{modelValue:r.title,"onUpdate:modelValue"(e){r.title=e}})}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.placeholder"),field:"placeholder",itemRender:{name:"VxeInput"}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.required")},{default(){return(0,_vue.h)(_switch.default,{modelValue:r.required,"onUpdate:modelValue"(e){r.required=e}})}})]}})}}});

package/lib/form-design/widget-input/input-view.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WidgetInputViewComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _use = require("../../form-design/src/use");
 var _formItem = _interopRequireDefault(require("../../form/src/form-item"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const WidgetInputViewComponent = exports.WidgetInputViewComponent = (0, _vue.defineComponent)({
+const WidgetInputViewComponent = exports.WidgetInputViewComponent = (0, _comp.defineVxeComponent)({
   props: {
     renderOpts: {
       type: Object,

package/lib/form-design/widget-input/input-view.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetInputViewComponent=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_use=require("../../form-design/src/use"),_formItem=_interopRequireDefault(require("../../form/src/form-item"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetInputViewComponent=exports.WidgetInputViewComponent=(0,_vue.defineComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(u){const n=(0,_vue.inject)("$xeFormView",null),i=(0,_use.useWidgetName)(u)["computeKebabCaseName"],o=()=>{var e,t=u["renderParams"],t=t["widget"];n&&(e=n?n.getItemValue(t):null,n.updateWidgetStatus(t,e))};return()=>{var e=u["renderParams"];const t=e["widget"],r=t["options"];e=i.value;return(0,_vue.h)(_formItem.default,{class:["vxe-form-design--widget-render-form-item","widget-"+e],field:t.field,title:t.title,itemRender:{}},{default(){return(0,_vue.h)("input",{class:"vxe-default-input",type:"text",placeholder:r.placeholder||(0,_core.getI18n)("vxe.base.pleaseInput"),value:n?n.getItemValue(t):null,onChange:o,onInput(e){n&&n.setItemValue(t,e.target.value)}})}})}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetInputViewComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_use=require("../../form-design/src/use"),_formItem=_interopRequireDefault(require("../../form/src/form-item"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetInputViewComponent=exports.WidgetInputViewComponent=(0,_comp.defineVxeComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(u){const n=(0,_vue.inject)("$xeFormView",null),i=(0,_use.useWidgetName)(u)["computeKebabCaseName"],o=()=>{var e,t=u["renderParams"],t=t["widget"];n&&(e=n?n.getItemValue(t):null,n.updateWidgetStatus(t,e))};return()=>{var e=u["renderParams"];const t=e["widget"],r=t["options"];e=i.value;return(0,_vue.h)(_formItem.default,{class:["vxe-form-design--widget-render-form-item","widget-"+e],field:t.field,title:t.title,itemRender:{}},{default(){return(0,_vue.h)("input",{class:"vxe-default-input",type:"text",placeholder:r.placeholder||(0,_core.getI18n)("vxe.base.pleaseInput"),value:n?n.getItemValue(t):null,onChange:o,onInput(e){n&&n.setItemValue(t,e.target.value)}})}})}}});

package/lib/form-design/widget-row/row-form.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WidgetRowFormComponent = void 0;
 var _vue = require("vue");
+var _comp = require("../../ui/src/comp");
 var _core = require("@vxe-ui/core");
 var _use = require("../../form-design/src/use");
 var _form = _interopRequireDefault(require("../../form/src/form"));
@@ -13,7 +14,7 @@ var _row = _interopRequireDefault(require("../../row/src/row"));
 var _col = _interopRequireDefault(require("../../row/src/col"));
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const WidgetRowFormComponent = exports.WidgetRowFormComponent = (0, _vue.defineComponent)({
+const WidgetRowFormComponent = exports.WidgetRowFormComponent = (0, _comp.defineVxeComponent)({
   props: {
     renderOpts: {
       type: Object,

package/lib/form-design/widget-row/row-form.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetRowFormComponent=void 0;var _vue=require("vue"),_core=require("@vxe-ui/core"),_use=require("../../form-design/src/use"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_row=_interopRequireDefault(require("../../row/src/row")),_col=_interopRequireDefault(require("../../row/src/col")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetRowFormComponent=exports.WidgetRowFormComponent=(0,_vue.defineComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(u){const n=(0,_vue.inject)("$xeFormDesign",null);if(!n)return()=>[];const t=(0,_use.useWidgetName)(u)["computeKebabCaseName"],i=(0,_vue.ref)([{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col2"),value:2,list:[{value:"12,12",spans:[12,12]},{value:"8,16",spans:[8,16]},{value:"16,8",spans:[16,8]},{value:"6,18",spans:[6,18]},{value:"18,6",spans:[18,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col3"),value:3,list:[{value:"8,8,8",spans:[8,8,8]},{value:"6,6,12",spans:[6,6,12]},{value:"12,6,6",spans:[12,6,6]},{value:"6,12,6",spans:[6,12,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col4"),value:4,list:[{value:"6,6,6,6",spans:[6,6,6,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col6"),value:6,list:[{value:"4,4,4,4,4,4",spans:[4,4,4,4,4,4]}]}]),a={18:"3/4",16:"2/3",12:"1/2",8:"1/3",6:"1/4",4:"1/6"},l=(0,_vue.computed)(()=>{var e=u["renderParams"],e=e["widget"];const r=e["options"];return i.value.find(e=>e.value===r.colSize)});return()=>{var e=u["renderParams"];const r=e["widget"],o=t.value;return(0,_vue.h)(_form.default,{class:`vxe-form-design--widget-${o}-form`,vertical:!0,span:24,titleBold:!0,titleOverflow:!0,data:r.options},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.colSize"),field:"colSize",itemRender:{name:"VxeRadioGroup",options:i.value,props:{type:"button"}}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.layout")},{default(){var e=l.value;return e?e.list.map((s,t)=>(0,_vue.h)(_row.default,{key:t,class:[`vxe-form-design--widget-${o}-form-row`,{"is--active":s.value===r.options.colSpan}],onClick(){{var e=s,r;const a=(r=u["renderParams"])["widget"];var r=a["options"],t,t=(t=n["reactData"])["widgetObjList"];const l=a.children.filter(e=>e.name);var o,i=l.slice(r.colSize);i.length&&(t=_xeUtils.default.findTree(t,e=>e.id===a.id,{children:"children"}))&&({items:t,index:o}=t,o>=t.length-1?t.push(...i):t.splice(o+1,0,...i)),r.colSpan=e.value,a.children=_xeUtils.default.range(0,r.colSize).map((e,r)=>l[r]||n.createEmptyWidget())}}},{default(){return s.spans.map((e,r)=>(0,_vue.h)(_col.default,{key:""+t+r,class:`vxe-form-design--widget-${o}-form-col`,span:e},{default(){return(0,_vue.h)("div",{},""+a[e])}}))}})):[]}})]}})}}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetRowFormComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_use=require("../../form-design/src/use"),_form=_interopRequireDefault(require("../../form/src/form")),_formItem=_interopRequireDefault(require("../../form/src/form-item")),_row=_interopRequireDefault(require("../../row/src/row")),_col=_interopRequireDefault(require("../../row/src/col")),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const WidgetRowFormComponent=exports.WidgetRowFormComponent=(0,_comp.defineVxeComponent)({props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(u){const n=(0,_vue.inject)("$xeFormDesign",null);if(!n)return()=>[];const t=(0,_use.useWidgetName)(u)["computeKebabCaseName"],i=(0,_vue.ref)([{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col2"),value:2,list:[{value:"12,12",spans:[12,12]},{value:"8,16",spans:[8,16]},{value:"16,8",spans:[16,8]},{value:"6,18",spans:[6,18]},{value:"18,6",spans:[18,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col3"),value:3,list:[{value:"8,8,8",spans:[8,8,8]},{value:"6,6,12",spans:[6,6,12]},{value:"12,6,6",spans:[12,6,6]},{value:"6,12,6",spans:[6,12,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col4"),value:4,list:[{value:"6,6,6,6",spans:[6,6,6,6]}]},{label:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.col6"),value:6,list:[{value:"4,4,4,4,4,4",spans:[4,4,4,4,4,4]}]}]),a={18:"3/4",16:"2/3",12:"1/2",8:"1/3",6:"1/4",4:"1/6"},l=(0,_vue.computed)(()=>{var e=u["renderParams"],e=e["widget"];const r=e["options"];return i.value.find(e=>e.value===r.colSize)});return()=>{var e=u["renderParams"];const r=e["widget"],o=t.value;return(0,_vue.h)(_form.default,{class:`vxe-form-design--widget-${o}-form`,vertical:!0,span:24,titleBold:!0,titleOverflow:!0,data:r.options},{default(){return[(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.colSize"),field:"colSize",itemRender:{name:"VxeRadioGroup",options:i.value,props:{type:"button"}}}),(0,_vue.h)(_formItem.default,{title:(0,_core.getI18n)("vxe.formDesign.widgetProp.rowProp.layout")},{default(){var e=l.value;return e?e.list.map((s,t)=>(0,_vue.h)(_row.default,{key:t,class:[`vxe-form-design--widget-${o}-form-row`,{"is--active":s.value===r.options.colSpan}],onClick(){{var e=s,r;const a=(r=u["renderParams"])["widget"];var r=a["options"],t,t=(t=n["reactData"])["widgetObjList"];const l=a.children.filter(e=>e.name);var o,i=l.slice(r.colSize);i.length&&(t=_xeUtils.default.findTree(t,e=>e.id===a.id,{children:"children"}))&&({items:t,index:o}=t,o>=t.length-1?t.push(...i):t.splice(o+1,0,...i)),r.colSpan=e.value,a.children=_xeUtils.default.range(0,r.colSize).map((e,r)=>l[r]||n.createEmptyWidget())}}},{default(){return s.spans.map((e,r)=>(0,_vue.h)(_col.default,{key:""+t+r,class:`vxe-form-design--widget-${o}-form-col`,span:e},{default(){return(0,_vue.h)("div",{},""+a[e])}}))}})):[]}})]}})}}});