vxe-design
Version:
A PC-based visual designer based on Vxe UI, used for building zero-code and low-code platforms
1 lines • 4.74 kB
JavaScript
Object.defineProperty(exports,"__esModule",{value:!0}),exports.WidgetRowViewComponent=exports.WidgetRowEditComponent=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_util=require("../src/util"),_core=require("@vxe-ui/core"),_vn=require("../../ui/src/vn"),_xeUtils=_interopRequireDefault(require("xe-utils"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let ViewColItemComponent=(0,_comp.defineVxeComponent)({name:"ViewColItem",props:{parentWidget:{type:Object,default:()=>({})},widget:{type:Object,default:()=>({})},span:Number,colItemIndex:{type:Number,default:0}},emits:[],setup(m){let t=_core.VxeUI.getComponent("vxe-form-item"),l=_core.VxeUI.getComponent("vxe-button"),g=(0,_vue.inject)("$xeFormDesign",null);if(!g)return()=>[];let p=g.reactData,u=e=>{e.stopPropagation();var t=e.currentTarget,e=e.dataTransfer,t=t.getAttribute("data-widget-id")||"",i=g.getWidgetById(t);e&&e.setData("text/plain",t),p.sortWidget=i,p.dragWidget=null},c=e=>{let{parentWidget:t,colItemIndex:i}=m,{widgetObjList:r,sortWidget:n}=p;var d=t.children[i],o=g.internalData;if(e.stopPropagation(),n&&t&&n.id!==t.id&&!(0,_util.hasFormDesignLayoutType)(n)&&!(0,_util.hasFormDesignLayoutType)(d)){var a=_xeUtils.default.findTree(r,e=>e&&e.id===n.id,{children:"children"});if(a){var{item:a,index:s,items:l,parent:u}=a;if(t.children.length!==t.options.colSize&&(t.children=_xeUtils.default.range(0,t.options.colSize).map(e=>t.children[e]||g.createEmptyWidget())),u&&u.id===t.id)t.children[i]=a,t.children[s]=d;else{if(d&&d.name)return;t.children[i]=a,l.splice(s,1)}e.preventDefault(),o.lastDragTime=Date.now(),g.dispatchEvent("widget-drag",{widget:a},e),g.dispatchEvent("drag-widget",{widget:a},e)}}};return()=>{let{widget:d,span:e}=m,{dragWidget:o,activeWidget:a,sortWidget:s}=p;return(0,_vue.h)(t,{span:e,padding:!1},{default(){var e=d?d.name:"",t=_core.renderer.get(e)||{},t=t.renderFormDesignWidgetEdit||t.renderFormDesignWidgetView,e=d||{name:e},i={widget:d,readonly:!1,disabled:!1,isEditMode:!0,isViewMode:!1,$formDesign:g,$formView:null},r=a&&d&&a.id===d.id,n=!t;return(0,_vue.h)("div",{class:"vxe-form-design--widget-row-view","data-widget-id":d.id,draggable:!n,onDragstart:u,onDragenter:c,onContextmenu(e){d&&g.handleContextmenuWidget(e,d)},onClick(e){d&&g.handleClickWidget(e,d)}},[(0,_vue.h)("div",{class:["vxe-form-design--widget-row-view-item-inner",{"is--empty":n,"is--active":r,"is--sort":s&&d&&s.id===d.id,"is--drag":o&&d&&o.id===d.id}]},[t?(0,_vue.h)("div",{class:"vxe-form-design--widget-row-view-item-wrapper"},[(0,_vue.h)("div",{class:"vxe-form-design--widget-row-view-item-box vxe-form--item-row"},(0,_vn.getSlotVNs)(t(e,i))),r?(0,_vue.h)("div",{class:"vxe-form-design--preview-item-operate"},[(0,_vue.h)(l,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_COPY,status:"primary",size:"mini",circle:!0,onClick(e){g.handleCopyWidget(e.$event,d)}}),(0,_vue.h)(l,{icon:(0,_core.getIcon)().FORM_DESIGN_WIDGET_DELETE,status:"danger",size:"mini",circle:!0,onClick(e){g.handleRemoveWidget(e.$event,d)}})]):(0,_vue.createCommentVNode)()]):(0,_vue.h)("div",{class:"vxe-form-design--widget-row-view-empty"},"控件位置")])])}})}}}),WidgetRowEditComponent=exports.WidgetRowEditComponent=(0,_comp.defineVxeComponent)({name:"WidgetRowEdit",props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(t){let r=_core.VxeUI.getComponent("vxe-form-group"),n=(0,_vue.computed)(()=>{var e=t.renderParams,e=e.widget,e=e.options,e=e.colSpan;return(e?(""+e).split(","):[]).map(e=>Number(e))});return()=>{var e=t.renderParams;let i=e.widget;return(0,_vue.h)(r,{field:i.field},{default(){return n.value.map((e,t)=>(0,_vue.h)(ViewColItemComponent,{key:t,parentWidget:i,widget:i.children[t],span:e,colItemIndex:t}))}})}}}),WidgetRowViewComponent=exports.WidgetRowViewComponent=(0,_comp.defineVxeComponent)({name:"WidgetRowView",props:{renderOpts:{type:Object,default:()=>({})},renderParams:{type:Object,default:()=>({})}},emits:[],setup(i){let r=_core.VxeUI.getComponent("vxe-row"),o=_core.VxeUI.getComponent("vxe-col"),a=(0,_vue.inject)("$xeFormDesign",null),s=(0,_vue.inject)("$xeFormView",null),n=(0,_vue.computed)(()=>{var e=i.renderParams,e=e.widget,e=e.options,e=e.colSpan;return(e?(""+e).split(","):[]).map(e=>Number(e))});return()=>{var e=i.renderParams;let d=e.widget,t=n.value;return(0,_vue.h)(r,{},{default(){return t.map((e,n)=>(0,_vue.h)(o,{key:n,class:"vxe-form--item-row",span:e},{default(){var e=d.children[n];if(e){var t=e.name,t=(_core.renderer.get(t)||{}).renderFormDesignWidgetView,i=e,r=!!a,e={widget:e,readonly:!1,disabled:!1,isEditMode:r,isViewMode:!r,$formDesign:a,$formView:s};if(t)return(0,_vn.getSlotVNs)(t(i,e))}return(0,_vue.createCommentVNode)()}}))}})}}});