@farris/ui-vue/components/designer-outline/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(f,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("vue"),require("../tree-view/index.umd.js"),require("../designer-canvas/index.umd.js"),require("lodash-es")):typeof define=="function"&&define.amd?define(["exports","vue","../tree-view/index.umd.js","../designer-canvas/index.umd.js","lodash-es"],u):(f=typeof globalThis<"u"?globalThis:f||self,u(f["designer-outline"]={},f.Vue,f.treeView,f.designerCanvas,f.LodashES))})(this,function(f,u,P,V,B){"use strict";const D={data:{type:Object,default:[]},selectable:{type:Boolean,default:!1},autoCheckChildren:{type:Boolean,default:!0},cascade:{type:Boolean,default:!0},showTreeNodeIcons:{type:Boolean,default:!0},showLines:{type:Boolean,default:!1},newDataItem:{type:Object,default:{}},lineColor:{type:String,default:"#9399a0"},cellHeight:{type:Number,default:28},dgControl:{type:Object,default:{}}};var h=(n=>(n.Frame="frame",n.dataGrid="data-grid",n.listView="list-view",n.form="form",n.uploader="uploader",n.calendar="calendar",n.page="page",n.table="table",n))(h||{});function L(n,v){const c=u.inject("designerContext"),g=c&&c.dgControl?c.dgControl:V.DgControl,b=u.ref(""),S=u.ref("");function y(e){var d,o,s,N;let i="controlIcon fd-i-Family ",t="";switch(e==null?void 0:e.type){case"form-group":{t=((d=g[e.type])==null?void 0:d.icon)||((o=e.editor)==null?void 0:o.type)||"",(s=g[e.editor.type])!=null&&s.icon&&(t=g[e.editor.type].icon);break}default:t=((N=g[e.type])==null?void 0:N.icon)||e.type}const r=`fd_pc-${t}`;return i+=r,i}function O(e,i){var d;let t=e.id;const r=i==null?void 0:i.contents;if((i==null?void 0:i.type)==="splitter"&&r&&r.length===2){const o=i.direction!=="column";e.id===((d=r[0])==null?void 0:d.id)?t=o?"左侧区域":"上方区域":t=o?"右侧区域":"下方区域"}return t}function T(e){if(e.isLikeCardContainer)return"区块";const i=e.appearance&&e.appearance.class||"",t=i.split(" ");return e.id==="page-header"&&i&&i==="f-page-header"?"页头":t.includes("f-page-header-base")?"页头容器":t.includes("f-page-header-extend")?"页头扩展容器":t.includes("f-title")?"标题容器":t.includes("f-page")?"根容器":t.includes("f-page-main")?"内容区域":t.includes("f-scrollspy-content")&&e.isScrollspyContainer?"滚动监听容器":t.includes("f-grid-is-sub")?"表格容器":t.includes("f-filter-container")?"筛选条容器":"容器"}function k(e){const{componentType:i}=e;switch(i){case h.Frame:return"根组件";case h.dataGrid:return(n==null?void 0:n.formSchemaUtils.selectNode(e,r=>r.type===(g["tree-grid"]&&g["tree-grid"].type)))?"树表格组件":"表格组件";case h.uploader:return"附件组件";case h.listView:return"列表视图组件";case h.form:return"卡片组件";case h.calendar:return"日历组件";case h.table:return"表格布局组件";case h.page:return e.name||"页面";default:return"组件"}}function x(e,i){const t=e.name||e.text||e.label||e.title||e.mainTitle;if(e.type!=="component"&&t&&typeof t=="string")return t.trim();switch(e.type){case"content-container":return T(e);case"splitter-pane":return O(e,i);case"component":return k(e);default:return g[e.type]&&g[e.type].name||e.id}}function a(e,i){const t=e.length?e[0]:null;if(!t)return;S.value="",b.value=t.originalId;const r=t?`${t.originalId}-design-item`:"",d=document.getElementById(r);d&&d.click(),v.emit("selectionChanged",t)}function l(e){if(!e)return;const i=`${e}-design-item`,t=document.getElementById(i);t&&t.click()}return{getIcon:y,getTitle:x,onChanged:a,currentSelectedNodeId:b,currentSelectedOutsideNodeId:S,triggerOutsideClick:l}}function R(n,v,c=!1){const{getIcon:g,getTitle:b}=v;function S(a,l,e,i,t){var d;const r=(d=n.data.module)==null?void 0:d.components.find(o=>o.id===a.component);r&&y([r],l,e,i,t)}function y(a,l,e,i,t){return a.forEach(r=>{var o,s;if(r.type==="component"&&(t=r.id),r.type==="component-ref"){S(r,l,e,i,t);return}const d={originalId:r.id,layer:e,originalParent:i==null?void 0:i.id,componentId:t,name:b(r,i),type:r.type,controlIcon:g(r),rawSchema:r};l.push(B.cloneDeep(d)),(r.contents||r.buttons)&&y(r.contents||r.buttons,l,e+1,r,t),c&&(s=(o=r.toolbar)==null?void 0:o.buttons)!=null&&s.length&&y(r.toolbar.buttons,l,e+1,r,t)}),l}function O(a){const l=[],e=a.find(d=>d.layer===0);a=a.filter(d=>d.layer!==0),l.push(e);let i=e.originalId,t=0,r=1e3;for(;a.length!==0||r===0;){const d=a.find(o=>o.originalParent===i);d?(l.push(d),i=d.originalId,a=a.filter(o=>o.originalId!==i),t=0):(t-=1,i=l.slice(t)[0].originalId),r-=1}return l}function T(a){return a.forEach((l,e)=>{l.id=(e+1).toString()}),a.forEach(l=>{var e;l.parent=((e=a.find(i=>i.originalId===l.originalParent))==null?void 0:e.id)||""}),a.forEach(l=>{l.hasChildren=a.findIndex(e=>e.parent===l.id)>0}),a}function k(a){const l={originalId:n.data.module.id,layer:0,originalParent:null,name:"页面",type:"module",controlIcon:"controlIcon fd-i-Family fd_pc-module",rawSchema:n.data.module},e=[];return a.forEach(i=>{i[0].originalParent=l.originalId,e.push(...i)}),e.unshift(l),e}function x(){const a=n.data.module?u.ref(n.data.module.components):u.ref([n.data]);if(!a.value)return;const l=[];a.value.forEach(r=>{if(r){const d=[];d.push(r);const N=y(d,[],1,null,r.id);l.push(N)}});const e=k(l),i=O(e);return T(i)}return{getData:x}}const q=u.defineComponent({name:"FDesignerOutline",props:D,emits:["outputValue","currentEvent","selectionChanged"],setup(n,v){const c=u.ref(),g=u.ref(n.selectable),b=u.ref(n.autoCheckChildren),S=u.ref(n.cascade),y=u.ref(n.showTreeNodeIcons),O=u.ref(n.showLines),T=u.ref(n.newDataItem),k=u.ref(n.lineColor),x=u.ref(n.cellHeight),a=u.ref([{field:"name",title:"",dataType:"string"}]),l=u.inject("designer-host-service"),e=L(l,v),{onChanged:i,currentSelectedNodeId:t,currentSelectedOutsideNodeId:r,triggerOutsideClick:d}=e,{getData:o}=R(n,e);let s=o();function N(){var w,E,F,C;if(s=o(),c.value&&c.value.updateDataSource){if(c.value.updateDataSource(s),r.value){(E=(w=c.value).emptyCurrentRowId)==null||E.call(w),d(r.value);return}t&&((C=(F=c.value).emptyCurrentRowId)==null||C.call(F),j({id:t.value}))}}function j(w){var E,F;if(!w&&c.value&&((F=(E=c.value).emptyCurrentRowId)==null||F.call(E)),w&&c.value&&c.value.selectItem){const C=s.find(G=>G.originalId===w.id);C?(c.value.selectRowById(C.id),t&&(t.value=C.originalId),c.value.activeRowById(C.id),r.value=""):t&&(t.value="",r.value=w.id)}}return v.expose({selectControlTreeNode:j,refreshControlTree:N}),u.onMounted(()=>{s.length&&c.value&&j({id:s[0].originalId})}),()=>u.createVNode("div",{class:"designer-control-tree"},[u.createVNode(P.FTreeView,{ref:c,data:s,columns:a.value,selectable:g.value,columnOption:{fitColumns:!0,fitMode:"expand"},autoCheckChildren:b.value,cascade:S.value,showTreeNodeIcons:y.value,showLines:O.value,newDataItem:T.value,lineColor:k.value,cellHeight:x.value,fit:!1,autoHeight:!0,iconField:"controlIcon",virtualized:!0,onSelectionChange:i},null)])}});f.ComponentType=h,f.FDesignerOutline=q,f.designerOutlineProps=D,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});