fx-epic-designer
Version:
基于vue3的设计器,可视化开发页面表单
2 lines (1 loc) • 3.05 kB
JavaScript
;const e=require("vue");;/* empty css */const v=require("../../../../base-ui/src/icon/icon.vue2.cjs"),l=require("../../../../../utils/src/common/data.cjs");require("@vueuse/core");require("../../../../../hooks/src/store/index.cjs");const a=require("../../../../../utils/src/manager/pluginManager.cjs"),S=require("vuedraggable"),k={class:"epic-component-view flex flex-col"},w={class:"epic-search-box px-10px py-6px"},N={class:"box-border h-full flex-1 overflow-auto py-2"},b=["onClick"],q={class:"epic-componet-label w-0 flex-1 truncate"},E={class:"pt-42px text-center text-gray-400"},U=e.defineComponent({__name:"index",setup(I){const x=a.pluginManager.getComponent("input"),s=e.inject("pageSchema"),u=e.inject("designer"),_=e.inject("revoke");e.inject("designerProps"),a.pluginManager.getComponentSchemaGroups();const r=e.ref(""),C=e.inject("externalConfig",e.ref({buttonlist:[]})),c=e.computed(()=>C.value.buttonlist);function V(o){var g,f,h;if(o.isUse===1)return!1;const n=l.findSchemaInfoById(s.schemas,((g=u.state.selectedNode)==null?void 0:g.id)??"root");if(!n)return!1;let{index:t,schema:i,list:p}=n;i.children&&!((h=(f=a.pluginManager.getComponentConfingByType(i.type))==null?void 0:f.editConstraints)!=null&&h.childImmovable)&&(p=i.children,t=i.children.length-1);const m=l.generateNewSchema(o);p.splice(t+1,0,m),u.setSelectedNode(m),_.push("插入组件"),o.isUse=1}function y(o){return o.isUse===1}function d(o,n){for(const t of o)if(t.sourceId===n||t.children&&d(t.children,n))return!0;return!1}return e.watch(()=>s.schemas,o=>{c.value.forEach(n=>{n.isUse=n.id&&d(o,n.id)?1:0})},{deep:!0,immediate:!0}),(o,n)=>(e.openBlock(),e.createElementBlock("div",k,[e.createElementVNode("div",w,[e.createVNode(e.unref(x),{modelValue:r.value,"onUpdate:modelValue":n[0]||(n[0]=t=>r.value=t),value:r.value,"onUpdate:value":n[1]||(n[1]=t=>r.value=t),placeholder:"搜索组件",clearable:"","allow-clear":""},{prefix:e.withCtx(()=>[e.createVNode(e.unref(v),{class:"text-$epic-text-helper",name:"icon--epic--search-rounded"})]),_:1},8,["modelValue","value"])]),e.createElementVNode("div",N,[e.createVNode(e.unref(S),e.mergeProps({modelValue:c.value,"onUpdate:modelValue":n[2]||(n[2]=t=>c.value=t)},{group:{name:"edit-draggable",pull:"clone",put:!1},sort:!1,animation:180,ghostClass:"moving",filter:".epic-componet-item--clicked"},{clone:e.unref(l.generateNewSchema),"item-key":"id",class:"px-10px grid grid-cols-[auto_auto] gap-2"}),{item:e.withCtx(({element:t})=>[e.createElementVNode("div",{class:e.normalizeClass(["epic-componet-item flex items-center truncate",{"epic-componet-item--clicked":y(t)}]),onClick:i=>V(t)},[e.createVNode(e.unref(v),{name:e.unref(a.pluginManager).getComponentConfingByType(t.type).icon??"",class:"epic-componet-icon"},null,8,["name"]),e.createElementVNode("div",q,e.toDisplayString(t.label),1)],10,b)]),_:1},16,["modelValue","clone"]),e.withDirectives(e.createElementVNode("div",E," 没有查询到的组件 ",512),[[e.vShow,c.value.length===0]])])]))}});module.exports=U;