@formily-djd/designer 0.0.13 → 0.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css CHANGED
@@ -132,14 +132,14 @@
132
132
  }
133
133
 
134
134
 
135
- .reactions-editor[data-v-a23b0a0a] {
135
+ .reactions-editor[data-v-6b415c60] {
136
136
  max-height: 600px;
137
137
  overflow-y: auto;
138
138
  }
139
- .section[data-v-a23b0a0a] {
139
+ .section[data-v-6b415c60] {
140
140
  margin-bottom: 24px;
141
141
  }
142
- .section-header[data-v-a23b0a0a] {
142
+ .section-header[data-v-6b415c60] {
143
143
  display: flex;
144
144
  justify-content: space-between;
145
145
  align-items: center;
@@ -147,68 +147,88 @@
147
147
  padding-bottom: 8px;
148
148
  border-bottom: 1px solid #ebeef5;
149
149
  }
150
- .section-title[data-v-a23b0a0a] {
150
+ .section-title[data-v-6b415c60] {
151
151
  font-size: 16px;
152
152
  font-weight: 600;
153
153
  color: #303133;
154
154
  }
155
- .empty-tip[data-v-a23b0a0a] {
155
+ .empty-tip[data-v-6b415c60] {
156
156
  padding: 20px;
157
157
  text-align: center;
158
158
  color: #909399;
159
159
  background-color: #f5f7fa;
160
160
  border-radius: 4px;
161
161
  }
162
- .dependency-list[data-v-a23b0a0a],
163
- .state-rule-list[data-v-a23b0a0a],
164
- .simple-condition-list[data-v-a23b0a0a] {
162
+ .dependency-list[data-v-6b415c60],
163
+ .state-rule-list[data-v-6b415c60],
164
+ .simple-condition-list[data-v-6b415c60] {
165
165
  display: flex;
166
166
  flex-direction: column;
167
167
  gap: 16px;
168
168
  }
169
- .dependency-item[data-v-a23b0a0a],
170
- .state-rule-item[data-v-a23b0a0a],
171
- .simple-condition-item[data-v-a23b0a0a] {
169
+ .dependency-item[data-v-6b415c60],
170
+ .state-rule-item[data-v-6b415c60],
171
+ .simple-condition-item[data-v-6b415c60] {
172
172
  padding: 16px;
173
173
  background-color: #f5f7fa;
174
174
  border-radius: 4px;
175
175
  border: 1px solid #e4e7ed;
176
176
  }
177
- .dependency-header[data-v-a23b0a0a],
178
- .state-rule-header[data-v-a23b0a0a],
179
- .simple-condition-header[data-v-a23b0a0a] {
177
+ .dependency-header[data-v-6b415c60],
178
+ .state-rule-header[data-v-6b415c60],
179
+ .simple-condition-header[data-v-6b415c60] {
180
180
  display: flex;
181
181
  justify-content: space-between;
182
182
  align-items: center;
183
183
  margin-bottom: 12px;
184
184
  }
185
- .dependency-index[data-v-a23b0a0a],
186
- .state-rule-index[data-v-a23b0a0a],
187
- .simple-condition-index[data-v-a23b0a0a] {
185
+ .dependency-index[data-v-6b415c60],
186
+ .state-rule-index[data-v-6b415c60],
187
+ .simple-condition-index[data-v-6b415c60] {
188
188
  font-weight: 600;
189
189
  color: #606266;
190
190
  }
191
- .expression-tip[data-v-a23b0a0a] {
191
+ .expression-tip[data-v-6b415c60] {
192
192
  margin-top: 4px;
193
193
  font-size: 12px;
194
194
  color: #909399;
195
195
  }
196
- .reactions-editor[data-v-a23b0a0a] .el-form-item {
196
+ .reactions-editor[data-v-6b415c60] .el-form-item {
197
197
  margin-bottom: 12px;
198
198
  }
199
- .reactions-editor[data-v-a23b0a0a] .el-form-item:last-child {
199
+ .reactions-editor[data-v-6b415c60] .el-form-item:last-child {
200
200
  margin-bottom: 0;
201
201
  }
202
- .simple-connector[data-v-a23b0a0a] {
202
+ .simple-connector[data-v-6b415c60] {
203
203
  display: flex;
204
204
  align-items: center;
205
205
  gap: 8px;
206
206
  justify-content: center;
207
207
  }
208
- .connector-label[data-v-a23b0a0a] {
208
+ .connector-label[data-v-6b415c60] {
209
209
  color: #606266;
210
210
  font-size: 13px;
211
211
  }
212
+ .field-select-row[data-v-6b415c60] {
213
+ display: flex;
214
+ align-items: center;
215
+ gap: 12px;
216
+ width: 100%;
217
+ }
218
+ .field-select[data-v-6b415c60] {
219
+ flex: 1;
220
+ }
221
+ .array-mode-switch[data-v-6b415c60] {
222
+ display: flex;
223
+ align-items: center;
224
+ gap: 4px;
225
+ flex-shrink: 0;
226
+ }
227
+ .array-mode-label[data-v-6b415c60] {
228
+ font-size: 12px;
229
+ color: #606266;
230
+ white-space: nowrap;
231
+ }
212
232
 
213
233
 
214
234
  .config-panel[data-v-66ec4854] {
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,getCurrentInstance as l,h as u,inject as d,isRef as f,mergeProps as p,nextTick as m,normalizeClass as h,normalizeProps as g,normalizeStyle as _,onBeforeUnmount as v,openBlock as y,provide as b,ref as x,renderList as S,renderSlot as C,resolveComponent as w,resolveDynamicComponent as T,shallowRef as E,toDisplayString as D,toRef as O,unref as k,watch as A,withCtx as j,withModifiers as M}from"vue";import{uid as N}from"@formily/shared";import{deleteByPath as P,getByPath as F,getFieldNameFromPath as I,setByPath as L}from"@formily-djd/utils";import{ArrayItems as R,Checkbox as z,FormItem as B,Input as V,InputNumber as ee,Radio as te,Select as ne,Space as re,Switch as ie}from"@formily/element-plus";import{FormProvider as ae,RecursionField as oe,createSchemaField as se,useField as ce,useFieldSchema as le}from"@formily/vue";import{createForm as ue,isVoidField as H,onFormValuesChange as de}from"@formily/core";import{Bottom as fe,CirclePlus as U,CopyDocument as pe,Delete as me,FolderAdd as he,Search as ge,Top as _e}from"@element-plus/icons-vue";import{observer as ve}from"@formily/reactive-vue";const W=Symbol(`DesignStore`);function G(){let e=d(W);if(!e)throw Error(`[useDesignStore] 必须在 Designer 组件内使用`);return e}const ye=Symbol(`ComponentSettings`),be=Symbol(`ArrayField`),xe=Symbol(`ArrayItemKey`),Se=Symbol(`LeftPanel`),Ce=Symbol(`RenderDisabled`);function we(e,n=`.canvas-content`){return t(()=>{if(!e.value)return null;let t=document.querySelector(`[data-node-id="${e.value}"]`);if(!t)return null;let r=document.querySelector(n);if(!r)return null;let i=t.getBoundingClientRect(),a=r.getBoundingClientRect();return{x:i.x-a.x+r.scrollLeft,y:i.y-a.y+r.scrollTop,width:i.width,height:i.height}})}function K(e,t,n=!0){let r=e=>{if(!n)return 0;let t=e*.1;return t>20?20:t<10?10:t},i=r(t.width),a=r(t.height);return e.x>=t.x+i&&e.x<=t.x+t.width-i&&e.y>=t.y+a&&e.y<=t.y+t.height-a}function Te(e,t){let n=Math.min(Math.abs(e.x-t.x),Math.abs(e.x-(t.x+t.width))),r=Math.min(Math.abs(e.y-t.y),Math.abs(e.y-(t.y+t.height)));return e.x>=t.x&&e.x<=t.x+t.width&&(n=0),e.y>=t.y&&e.y<=t.y+t.height&&(r=0),Math.sqrt(n**2+r**2)}function Ee(e,t,n){return n?e.x>=t.x+t.width/2:e.y>=t.y+t.height/2}function De(e){return e.width>e.height}let q=function(e){return e.Before=`BEFORE`,e.After=`AFTER`,e.Upper=`UPPER`,e.Under=`UNDER`,e.Inner=`INNER`,e.InnerBefore=`INNER_BEFORE`,e.InnerAfter=`INNER_AFTER`,e.ForbidBefore=`FORBID_BEFORE`,e.ForbidAfter=`FORBID_AFTER`,e.ForbidUpper=`FORBID_UPPER`,e.ForbidUnder=`FORBID_UNDER`,e.ForbidInner=`FORBID_INNER`,e.ForbidInnerBefore=`FORBID_INNER_BEFORE`,e.ForbidInnerAfter=`FORBID_INNER_AFTER`,e.Forbid=`FORBID`,e}({});var Oe=class{sensitive;forceBlock;dragNodes=x([]);touchNode=x(null);closestNode=x(null);closestPosition=x(q.Before);closestRect=x(null);getNodeRect;getNodeSchema;getCanvasRect;findChildNodes;constructor(e,t){this.sensitive=t?.sensitive??!0,this.forceBlock=t?.forceBlock??!1,this.getNodeRect=e.getNodeRect,this.getNodeSchema=e.getNodeSchema,this.getCanvasRect=e.getCanvasRect,this.findChildNodes=e.findChildNodes}setDragNodes(e){this.dragNodes.value=e}calculate(e){let{point:t,touchNode:n,closestNode:r,closestPosition:i}=e;if(r!==void 0&&i!==void 0){this.closestNode.value=r,this.closestPosition.value=i,r&&(this.closestRect.value=this.getNodeRect(r));return}if(!t)return;n!==void 0&&(this.touchNode.value=n);let a=this.getClosestNode(t);if(this.closestNode.value=a,!a){this.closestPosition.value=q.Before,this.closestRect.value=null;return}this.closestPosition.value=this.getClosestPosition(t,a),this.closestRect.value=this.getNodeRect(a)}getClosestNode(e){let t=this.touchNode.value;if(!t)return null;let n=this.getNodeRect(t);if(!n)return null;let r=this.findChildNodes(t);if(r.length===0)return t;let i=K(e,n,this.sensitive)?0:Te(e,n),a=t;for(let t of r){let n=this.getNodeRect(t);if(!n)continue;let r=K(e,n,this.sensitive)?0:Te(e,n);r<=i&&(i=r,a=t)}return a}getClosestPosition(e,t){console.log(`[Dragon] getClosestPosition`,t);let n=this.getNodeRect(t),r=this.getNodeSchema(t);if(!n||!r)return q.Forbid;let i=this.getLayout(n)===`horizontal`,a=K(e,n,this.sensitive),o=this.isContainer(r),s=this.canInsertSibling(t),c=Ee(e,n,i);return a?o&&this.canDropInside(t)?this.findChildNodes(t).length===0?q.Inner:c?q.InnerAfter:q.InnerBefore:s?i?c?q.After:q.Before:c?q.Under:q.Upper:q.Forbid:s?i?c?q.ForbidAfter:q.ForbidBefore:c?q.ForbidUnder:q.ForbidUpper:q.Forbid}getLayout(e){return this.forceBlock?`vertical`:De(e)?`horizontal`:`vertical`}isContainer(e){return!e||e[`x-droppable`]===!1?!1:e.type===`object`||e.type===`void`||e.type===`array`}canInsertSibling(e){return!(e===``||e==null)}canDropInside(e){if(this.getNodeSchema(e)?.[`x-droppable`]===!1)return!1;let t=this.dragNodes.value;if(t.length===0)return!0;for(let n of t)if(n.nodePath===e||e.startsWith(`${n.nodePath}.`))return!1;return!0}clear(){this.dragNodes.value=[],this.touchNode.value=null,this.closestNode.value=null,this.closestPosition.value=q.Before,this.closestRect.value=null}};function ke(e=!1){let t=x({type:`object`,properties:{}}),n=x(null),r=x(null),i=x(null),a=x(!1),o=x([]),s=x(null),c=x(null),l=x(q.Before);function u(e){let t=document.querySelector(`[data-node-id="${e}"]`);if(!t)return null;let n=document.querySelector(`.canvas-content`);if(!n)return null;let r=t.getBoundingClientRect(),i=n.getBoundingClientRect();return{x:r.x-i.x,y:r.y-i.y,width:r.width,height:r.height}}function d(){let e=document.querySelector(`.canvas-content`);if(!e)return{x:0,y:0,width:0,height:0};let t=e.getBoundingClientRect();return{x:t.x,y:t.y,width:t.width,height:t.height}}let f=new Oe({getNodeRect:u,getNodeSchema:e=>F(t.value.properties,e),getCanvasRect:d,findChildNodes:e=>{let n=F(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{r.push(`${e}.properties.${t}`)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{r.push(`${e}.items.properties.${t}`)}),r}},{sensitive:!0,forceBlock:!1});function p(e,n){t.value.properties||(t.value.properties={}),t.value.properties[e]=n}function m(e,n){L(t.value.properties,e,n)}function h(e){n.value=e}function g(){return n.value&&F(t.value.properties,n.value)||null}function _(e){r.value=e,n.value=e}function v(e){i.value=e}function y(e){a.value=!0,o.value=e,f.setDragNodes(e)}function S(e,t){if(!a.value)return;t!==void 0&&(s.value=t);let n=d(),r={x:e.x-n.x,y:e.y-n.y};f.calculate({point:r,touchNode:s.value||void 0}),c.value=f.closestNode.value,l.value=f.closestPosition.value}function C(){if(console.log(`[DesignStore] drop`),!a.value)return;let e=c.value,t=l.value;if(!e){w();return}if(t.includes(`FORBID`)){w();return}let n=o.value;if(n.length===0){w();return}n.length===1&&T(n[0].nodePath,e,t),w()}function w(){a.value=!1,o.value=[],s.value=null,c.value=null,l.value=q.Before,f.clear()}function T(e,n,r){let i=P(t.value.properties,e);if(!i)return;let a=I(e);if(r===q.Inner||r===q.InnerAfter||r===q.InnerBefore){let e=F(t.value.properties,n);if(!e)return;let o,s;if(e.type===`array`?(e.items||={type:`object`,properties:{}},e.items.properties||(e.items.properties={}),o=e.items.properties,s=`${n}.items.properties`):(e.properties||={},o=e.properties,s=`${n}.properties`),r===q.InnerBefore){let e={[a]:i,...o};L(t.value.properties,s,e)}else L(t.value.properties,`${s}.${a}`,i)}else{let e=r===q.Before||r===q.Upper?`before`:`after`,o=n.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?F(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=e===`after`?f+1:f,m=[...d.slice(0,p),[a,i],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?L(t.value.properties,c,h):t.value.properties=h}}function E(e,n,r,i){if(!e){t.value.properties||(t.value.properties={}),t.value.properties[n]=r;return}if(i===q.Inner||i===q.InnerAfter||i===q.InnerBefore){let a=F(t.value.properties,e);if(!a)return;let o,s;if(a.type===`array`?(a.items||={type:`object`,properties:{}},a.items.properties||(a.items.properties={}),o=a.items.properties,s=`${e}.items.properties`):(a.properties||={},o=a.properties,s=`${e}.properties`),i===q.InnerBefore){let e={[n]:r,...o};L(t.value.properties,s,e)}else L(t.value.properties,`${s}.${n}`,r)}else{let a=i===q.Before||i===q.Upper?`before`:`after`,o=e.split(`.`),s=o[o.length-1],c;o.length===1&&(c=``);let l=o.lastIndexOf(`properties`);c=o.slice(0,l+1).join(`.`);let u=c?F(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=a===`after`?f+1:f,m=[...d.slice(0,p),[n,r],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?L(t.value.properties,c,h):t.value.properties=h}}function D(e){return F(t.value.properties,e)}function O(e){let n=F(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{let n=e?`${e}.properties.${t}`:t;r.push(n)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{let n=`${e}.items.properties.${t}`;r.push(n)}),r}let k={formSchema:t,selectedFieldName:n,selectedNodeId:r,hoveredNodeId:i,draggable:e,dragon:f,isDragging:a,dragNodes:o,touchNode:s,closestNode:c,closestPosition:l,addField:p,updateFieldSchema:m,selectField:h,selectNode:_,getSelectedField:g,setHover:v,startDrag:y,updateDragPosition:S,drop:C,cancelDrag:w,moveField:T,insertField:E,getNodeSchema:D,findChildNodes:O};return b(W,k),k}function Ae(e,t){let n={};return Object.entries(t.properties||{}).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=F(e,i);r!==void 0&&(n[t]=r)}}),n}function je(e,t,n){let r=JSON.parse(JSON.stringify(n));return Object.entries(t.properties||{}).forEach(([t,n])=>{let i=n[`x-path`];i&&e[t]!==void 0&&L(r,i,e[t])}),r}var J=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},Me=J(c({__name:`HoverBox`,setup(e){let n=G(),a=we(n.hoveredNodeId),o=t(()=>!n.hoveredNodeId.value||!n.selectedNodeId.value?!1:n.hoveredNodeId.value===n.selectedNodeId.value),s=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:2,visibility:`hidden`};return a.value&&!o.value&&(e.transform=`perspective(1px) translate3d(${a.value.x}px, ${a.value.y}px, 0)`,e.width=`${a.value.width}px`,e.height=`${a.value.height}px`,e.visibility=`visible`),e}),c=t(()=>a.value&&!o.value);return(e,t)=>c.value?(y(),i(`div`,{key:0,class:`hover-box`,style:_(s.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-2759debe`]]),Ne=J(c({__name:`Insertion`,setup(e){let n=G(),a=t(()=>{if(!n.isDragging.value||!n.closestNode.value)return{display:`none`};let e=n.closestPosition.value,t=n.dragon.closestRect.value;if(!t)return{display:`none`};let r=e.toString().includes(`FORBID`),i={position:`absolute`,backgroundColor:r?`#ef4444`:`#3b82f6`,pointerEvents:`none`,zIndex:10,transition:`all 0.15s cubic-bezier(0.4, 0, 0.2, 1)`,boxShadow:r?`0 0 8px rgba(239, 68, 68, 0.5)`:`0 0 8px rgba(59, 130, 246, 0.5)`};switch(e){case q.Before:case q.ForbidBefore:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case q.After:case q.ForbidAfter:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x+t.width-2}px, ${t.y}px, 0)`});break;case q.Upper:case q.ForbidUpper:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case q.Under:case q.ForbidUnder:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y+t.height-2}px, 0)`});break;case q.Inner:case q.InnerBefore:case q.InnerAfter:case q.ForbidInner:case q.ForbidInnerBefore:case q.ForbidInnerAfter:Object.assign(i,{width:`${t.width}px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`,backgroundColor:`transparent`,border:r?`2px dashed #ef4444`:`2px dashed #3b82f6`});break;case q.Forbid:return{display:`none`};default:return{display:`none`}}return i});return(e,t)=>k(n).draggable?(y(),i(`div`,{key:0,class:`insertion-indicator`,style:_(a.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-9dbef644`]]),Pe=J(c({__name:`SelectionBox`,setup(e){let n=we(G().selectedNodeId),o=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:4,visibility:`hidden`};return n.value&&(e.transform=`perspective(1px) translate3d(${n.value.x-2}px, ${n.value.y-2}px, 0)`,e.width=`${n.value.width+4}px`,e.height=`${n.value.height+4}px`,e.visibility=`visible`),e}),s=t(()=>n.value!==null);return(e,t)=>s.value?(y(),i(`div`,{key:0,class:`selection-box`,style:_(o.value)},[...t[0]||=[a(`div`,{class:`selection-box-inner`},null,-1)]],4)):r(``,!0)}}),[[`__scopeId`,`data-v-c58abee5`]]);const Fe={class:`aux-tool-widget`};var Ie=J(c({__name:`AuxToolWidget`,setup(e){return(e,t)=>(y(),i(`div`,Fe,[s(Me),s(Pe),s(Ne)]))}}),[[`__scopeId`,`data-v-2d0e316d`]]);function Le(e,t){let n={...e?.[`x-component-props`]||{}};return t.basicSetter&&Object.entries(t.basicSetter).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=F(e,i);r!==void 0&&(n[t]=r)}}),t.componentSetter?.properties&&Object.entries(t.componentSetter.properties).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=F(e,i);r!==void 0&&(n[t]=r)}}),n}function Re(e){if(e?.[`x-droppable`]===!1)return!1;let t=e.type;return(t===`object`||t===`void`||t===`array`)&&!!e.properties}function ze(e){return e.type===`array`&&!!e.items}const Be=[`data-node-id`,`draggable`],Ve={key:0,class:`empty-container-placeholder`},He={key:0,class:`empty-container-placeholder`};var Ue=J(c({name:`CanvasField`,__name:`index`,props:{schema:{},fieldName:{},nodePath:{}},setup(o){let s=o,c=d(ye)??{},l=G(),u=t(()=>s.schema?.[`x-component`]),f=t(()=>s.nodePath?s.fieldName?s.nodePath?`${s.nodePath}.${s.fieldName}`:s.fieldName:s.nodePath:s.fieldName||``),m=t(()=>l.selectedNodeId.value===f.value),_=t(()=>!l.draggable||!s.fieldName?!1:m.value);function v(){return s.schema?.type===`array`?f.value?`${f.value}.items`:``:f.value?`${f.value}.properties`:``}let b=t(()=>{let e=s.schema;if(!e||e[`x-droppable`]===!1)return!1;let t=e.type===`object`||e.type===`void`,n=!e.properties||Object.keys(e.properties).length===0;return t&&n});function x(e){if(!_.value||!e.dataTransfer)return;let t={type:`move-component`,nodePath:f.value,fieldName:s.fieldName,schema:s.schema};e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`application/json`,JSON.stringify(t)),l.startDrag([{nodePath:f.value,fieldName:s.fieldName||``,schema:s.schema}])}function C(){l.cancelDrag()}return(t,o)=>{let l=w(`CanvasField`);return s.schema?(y(),i(`div`,{key:0,"data-node-id":f.value,class:h({"is-draggable":_.value,"is-selected":m.value}),draggable:_.value,onDragstart:x,onDragend:C},[u.value&&k(c)[u.value]?(y(),n(T(k(c)[u.value].component),g(p({key:0},k(Le)(s.schema,k(c)[u.value].setterSchema))),{default:j(()=>[b.value?(y(),i(`div`,Ve,[...o[0]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),k(ze)(s.schema)?(y(),n(l,{key:1,schema:s.schema.items,"node-path":`${v()}`},null,8,[`schema`,`node-path`])):r(``,!0),k(Re)(s.schema)?(y(!0),i(e,{key:2},S(Object.keys(s.schema?.properties||{}),e=>(y(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":v()},null,8,[`schema`,`field-name`,`node-path`]))),128)):r(``,!0)]),_:1},16)):(y(),i(e,{key:1},[b.value?(y(),i(`div`,He,[...o[1]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),(y(!0),i(e,null,S(Object.keys(s.schema?.properties||{}),e=>(y(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":v()},null,8,[`schema`,`field-name`,`node-path`]))),128))],64))],42,Be)):r(``,!0)}}}),[[`__scopeId`,`data-v-18008a74`]]);const We={class:`canvas djd-design`};var Ge=J(c({__name:`canvas`,props:{components:{}},setup(e){b(ye,e.components);let o=G(),c=x(!1),l=t(()=>{let e=o.formSchema.value?.properties;return!e||Object.keys(e).length===0});function u(e){let t=e.target.closest(`[data-node-id]`);if(t){let e=t.getAttribute(`data-node-id`);e&&(console.log(e),o.selectNode(e))}else o.selectNode(null)}function d(e){let t=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`);if(o.setHover(t||null),o.isDragging.value){let n={x:e.clientX,y:e.clientY};o.updateDragPosition(n,t||void 0)}}function f(){o.setHover(null)}function p(e){if(!o.draggable||(e.preventDefault(),e.stopPropagation(),!e.dataTransfer))return;let t=o.dragNodes.value.length>0;e.dataTransfer.dropEffect=t?`move`:`copy`,c.value=!0,o.isDragging.value||o.startDrag([]);let n=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`),r={x:e.clientX,y:e.clientY};o.updateDragPosition(r,n||void 0)}function m(e){e.target.classList.contains(`canvas-content`)&&(c.value=!1)}function g(e){if(o.draggable&&(console.log(`[Canvas] handleDrop`),e.preventDefault(),e.stopPropagation(),c.value=!1,e.dataTransfer))try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);console.log(`dragData`,n),n.type===`new-component`?_(n):n.type===`move-component`&&v()}catch(e){console.error(`解析拖拽数据失败:`,e)}}function _(e){let{componentKey:t,defaultSchema:n}=e;if(!n){console.warn(`组件缺少 defaultSchema:`,t);return}let r=`f_${N()}`,i=o.closestNode.value,a=o.closestPosition.value;i?o.insertField(i,r,n,a):o.addField(r,n),o.selectNode(r),o.cancelDrag()}function v(){o.drop()}return(e,t)=>(y(),i(`div`,We,[a(`div`,{class:h([`canvas-content`,{"drag-over":c.value,empty:l.value}]),onClick:u,onMousemove:d,onMouseleave:f,onDragover:p,onDragleave:m,onDrop:g},[k(o).formSchema.value?(y(),n(Ue,{key:0,schema:k(o).formSchema.value},null,8,[`schema`])):r(``,!0),s(Ie)],34)]))}}),[[`__scopeId`,`data-v-b174a160`]]);function Ke(e,t){let n=t.getSelectedField();return ue({values:n?Ae(n,e):{},effects(){de(n=>{let r=t.getSelectedField(),i=t.selectedFieldName.value;if(!r||!i)return;let a=je(n.values,e,r);t.updateFieldSchema(i,a)})}})}function qe(){return{source:``,property:`value`,name:``,type:`any`}}function Je(e){return!e?.dependencies||!Array.isArray(e.dependencies)?[]:e.dependencies.map(e=>({source:e?.source||``,property:e?.property||`value`,name:e?.name||``,type:e?.type||`any`}))}function Ye(e){return e?.fulfill?.state?Object.entries(e.fulfill.state).map(([e,t])=>({state:e,expression:String(t).replace(/^\{\{|\}\}$/g,``).trim()})):[]}function Xe(){let e=x([]),t=x([]);function n(n){e.value=Je(n),t.value=Ye(n)}function r(){e.value.push(qe())}function i(t){e.value.splice(t,1)}function a(e){!e.name&&e.source&&(e.name=`${e.source.split(`.`).pop()||e.source}_${e.property}`)}function o(){t.value.push({state:`visible`,expression:``})}function s(e){t.value.splice(e,1)}function c(){let n={};return e.value.length>0&&(n.dependencies=e.value.filter(e=>e.source).map(e=>({source:e.source,property:e.property,name:e.name,type:e.type}))),t.value.length>0&&(n.fulfill={state:{}},t.value.forEach(e=>{e.state&&e.expression&&(n.fulfill.state[e.state]=`{{${e.expression}}}`)})),n}return{dependencies:e,stateRules:t,loadAdvancedConfig:n,addDependency:r,removeDependency:i,handleFieldChange:a,addStateRule:o,removeStateRule:s,buildAdvancedReactions:c}}function Y(e,t,n=``){if(!e)return[];let r=[];return Object.entries(e).forEach(([e,i])=>{let a=n?`${n}.${e}`:e,o=i.title||e;if(t&&(a===t||a.startsWith(`${t}.`)))return;let s={value:a,label:`${o} (${e})`,children:void 0};if(i.properties){let e=Y(i.properties,t,a);e.length>0&&(s.children=e)}r.push(s)}),r}function Ze(e,n){return{fieldTree:t(()=>{let t=k(e),r=k(n);return Y(t?.properties,r)})}}function Qe(e){return String(e??``).replace(/^\{\{|\}\}$/g,``).trim()}function $e(e){let t=e.trim();for(;t.startsWith(`(`)&&t.endsWith(`)`);){let e=0,n=!0;for(let r=0;r<t.length;r++)if(t[r]===`(`?e++:t[r]===`)`&&e--,e===0&&r<t.length-1){n=!1;break}if(n)t=t.slice(1,-1).trim();else break}return t}function X(e){let t=e.trim().replace(/^\(|\)$/g,``).trim();try{let e=JSON.parse(t);return typeof e==`string`?e:String(e)}catch{return t.replace(/^['"]|['"]$/g,``)}}function et(e,t){let n=$e(e),r=n.match(/^\$deps\.([a-zA-Z0-9_]+)\s*===\s*(.+)$/);if(r){let[,e,n]=r,i=t.get(e);return i?{field:i,operator:`eq`,value:X(n)}:null}let i=n.match(/^\$deps\.([a-zA-Z0-9_]+)\s*!==\s*(.+)$/);if(i){let[,e,n]=i,r=t.get(e);return r?{field:r,operator:`neq`,value:X(n)}:null}let a=n.match(/^Array\.isArray\(\s*\$deps\.([a-zA-Z0-9_]+)\s*\)\s*&&\s*\$deps\.\1\.includes\((.+)\)$/);if(a){let[,e,n]=a,r=t.get(e);return r?{field:r,operator:`includes`,value:X(n)}:null}let o=n.match(/^Array\.isArray\(\s*\$deps\.([a-zA-Z0-9_]+)\s*\)\s*&&\s*!\s*\$deps\.\1\.includes\((.+)\)$/);if(o){let[,e,n]=o,r=t.get(e);return r?{field:r,operator:`notIncludes`,value:X(n)}:null}return null}function tt(e){let t=[],n=0,r=``,i=0;for(;i<e.length;){let a=e[i];if(a===`(`?n++:a===`)`&&(n=Math.max(0,n-1)),n===0){let n=e.slice(i,i+2);if(n===`&&`||n===`||`){t.push({expression:r.trim(),connector:n}),r=``,i+=2;continue}}r+=a,i++}return r.trim()&&t.push({expression:r.trim()}),t}function nt(e){if(!e?.fulfill?.state?.visible||!Array.isArray(e.dependencies))return null;let t=Qe(e.fulfill.state.visible);if(!t)return null;let n=new Map;if(e.dependencies.forEach(e=>{e?.name&&e?.source&&e?.property===`value`&&n.set(e.name,e.source)}),n.size===0)return null;let r=et(t,n);if(r)return[{...r,connector:void 0}];let i=tt(t);if(!i.length)return null;let a=[];for(let e=0;e<i.length;e++){let t=i[e],r=et(t.expression,n);if(!r)return null;a.push({...r,connector:t.connector?t.connector===`||`?`or`:`and`:void 0})}return a.length&&(a[a.length-1].connector=void 0),a.length?a:null}function rt(e){let t=(e??``).toString().trim();if(!t)return``;try{return JSON.parse(t)}catch{return t.replace(/^['"]|['"]$/g,``)}}function it(e){let t=rt(e);return JSON.stringify(t)}function at(e,t,n){if(t.has(e))return t.get(e);let r=`${e.split(`.`).pop()||e}_value`,i=r,a=1;for(;n.has(i);)i=`${r}_${a}`,a++;return t.set(e,i),n.add(i),i}function ot(e){let t=e.map((t,n)=>({...t,connector:n<e.length-1?t.connector||`and`:void 0})).filter(e=>e.field&&e.value!==``);if(!t.length)return null;let n=[],r=new Map,i=new Set,a=[];return t.forEach(e=>{let t=at(e.field,r,i);n.find(n=>n.source===e.field&&n.name===t)||n.push({source:e.field,property:`value`,name:t,type:`any`});let o=`$deps.${t}`,s=it(e.value),c=``;switch(e.operator){case`eq`:c=`${o} === ${s}`;break;case`neq`:c=`${o} !== ${s}`;break;case`includes`:c=`Array.isArray(${o}) && ${o}.includes(${s})`;break;case`notIncludes`:c=`Array.isArray(${o}) && !${o}.includes(${s})`;break}a.push(`(${c})`)}),{dependencies:n,fulfill:{state:{visible:`{{${a.reduce((e,n,r)=>r===0?n:`${e} ${t[r-1].connector===`or`?`||`:`&&`} ${n}`,``)}}}`}}}}function Z(){return{field:``,operator:`eq`,value:``,connector:void 0}}function st(){let e=x([Z()]);function t(){e.value=[Z()]}function n(){if(e.value.length>0){let t=e.value[e.value.length-1];t.connector||=`and`}e.value.push(Z())}function r(n){if(e.value.splice(n,1),!e.value.length){t();return}n>0&&n===e.value.length&&(e.value[n-1].connector=void 0)}function i(n){let r=nt(n);return r?(e.value=r,!0):(t(),!1)}return{simpleConditions:e,addSimpleCondition:n,removeSimpleCondition:r,resetSimpleConditions:t,loadSimpleConditions:i,buildSimpleReactions:()=>ot(e.value)}}const ct=[{label:`显示/隐藏 (visible)`,value:`visible`},{label:`禁用 (disabled)`,value:`disabled`},{label:`只读 (readOnly)`,value:`readOnly`},{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`必填 (required)`,value:`required`},{label:`标题 (title)`,value:`title`},{label:`描述 (description)`,value:`description`}],lt=[{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`初始值 (initialValue)`,value:`initialValue`},{label:`错误信息 (errors)`,value:`errors`},{label:`验证状态 (valid)`,value:`valid`}],ut=[{label:`任意类型 (any)`,value:`any`},{label:`字符串 (string)`,value:`string`},{label:`数字 (number)`,value:`number`},{label:`布尔值 (boolean)`,value:`boolean`},{label:`数组 (array)`,value:`array`},{label:`对象 (object)`,value:`object`}],dt=[{label:`等于`,value:`eq`},{label:`不等于`,value:`neq`},{label:`包含`,value:`includes`},{label:`不包含`,value:`notIncludes`}],ft={class:`reactions-editor`},pt={class:`section`},mt={class:`section-header`},ht={key:0,class:`empty-tip`},gt={key:1,class:`simple-condition-list`},_t={class:`simple-condition-item`},vt={class:`simple-condition-header`},yt={class:`simple-condition-index`},bt={key:0,class:`simple-connector`},xt={class:`section`},St={class:`section-header`},Ct={key:0,class:`empty-tip`},wt={key:1,class:`dependency-list`},Tt={class:`dependency-header`},Et={class:`dependency-index`},Dt={class:`section`},Ot={class:`section-header`},kt={key:0,class:`empty-tip`},At={key:1,class:`state-rule-list`},jt={class:`state-rule-header`},Mt={class:`state-rule-index`};var Nt=J(c({__name:`ReactionsEditor`,props:{modelValue:{type:Boolean},schema:{},currentFieldName:{},initialReactions:{}},emits:[`update:modelValue`,`save`],setup(c,{emit:u}){let d=c,f=u,p=t({get:()=>d.modelValue,set:e=>f(`update:modelValue`,e)}),m=x(`simple`),{fieldTree:h}=Ze(O(d,`schema`),O(d,`currentFieldName`)),{dependencies:g,stateRules:_,loadAdvancedConfig:v,addDependency:b,removeDependency:C,handleFieldChange:T,addStateRule:E,removeStateRule:A,buildAdvancedReactions:M}=Xe(),{simpleConditions:N,addSimpleCondition:P,removeSimpleCondition:F,resetSimpleConditions:I,loadSimpleConditions:L,buildSimpleReactions:R}=st();function z(){let e=d.initialReactions;if(v(e),!e){I(),m.value=`simple`;return}m.value=L(e)?`simple`:`advanced`}function B(){z()}function V(){let e=m.value===`simple`?R():M();if(m.value===`simple`&&!e){let e=l()?.appContext.config.globalProperties?.$message;(typeof e==`function`||typeof window<`u`)&&e.warning?.(`请至少添加一条完整的简单条件`);return}f(`save`,e||{}),p.value=!1}function ee(){p.value=!1}return(t,c)=>{let l=w(`ElButton`),u=w(`ElTreeSelect`),d=w(`ElFormItem`),f=w(`ElOption`),v=w(`ElSelect`),x=w(`ElInput`),O=w(`ElForm`),M=w(`ElRadioButton`),I=w(`ElRadioGroup`),L=w(`ElTabPane`),R=w(`ElTabs`),z=w(`ElDialog`);return y(),n(z,{modelValue:p.value,"onUpdate:modelValue":c[1]||=e=>p.value=e,title:`条件渲染配置`,width:`800px`,onOpen:B},{footer:j(()=>[s(l,{onClick:ee},{default:j(()=>[...c[14]||=[o(` 取消 `,-1)]]),_:1}),s(l,{type:`primary`,onClick:V},{default:j(()=>[...c[15]||=[o(` 保存 `,-1)]]),_:1})]),default:j(()=>[a(`div`,ft,[s(R,{modelValue:m.value,"onUpdate:modelValue":c[0]||=e=>m.value=e},{default:j(()=>[s(L,{label:`简单配置`,name:`simple`},{default:j(()=>[a(`div`,pt,[a(`div`,mt,[c[3]||=a(`span`,{class:`section-title`},`条件组合`,-1),s(l,{size:`small`,type:`primary`,onClick:k(P)},{default:j(()=>[...c[2]||=[o(` 添加条件 `,-1)]]),_:1},8,[`onClick`])]),k(N).length===0?(y(),i(`div`,ht,` 暂无条件,点击"添加条件"按钮添加 `)):(y(),i(`div`,gt,[(y(!0),i(e,null,S(k(N),(t,p)=>(y(),i(e,{key:p},[a(`div`,_t,[a(`div`,vt,[a(`span`,yt,`条件 `+D(p+1),1),k(N).length>1?(y(),n(l,{key:0,size:`small`,type:`danger`,text:``,onClick:e=>k(F)(p)},{default:j(()=>[...c[4]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])):r(``,!0)]),s(O,{"label-width":`80px`},{default:j(()=>[s(d,{label:`字段`},{default:j(()=>[s(u,{modelValue:t.field,"onUpdate:modelValue":e=>t.field=e,data:k(h),placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1},null,8,[`modelValue`,`onUpdate:modelValue`,`data`])]),_:2},1024),s(d,{label:`操作`},{default:j(()=>[s(v,{modelValue:t.operator,"onUpdate:modelValue":e=>t.operator=e,placeholder:`选择操作`},{default:j(()=>[(y(!0),i(e,null,S(k(dt),e=>(y(),n(f,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(d,{label:`值`},{default:j(()=>[s(x,{modelValue:t.value,"onUpdate:modelValue":e=>t.value=e,placeholder:`输入匹配值`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]),p<k(N).length-1?(y(),i(`div`,bt,[s(I,{modelValue:t.connector,"onUpdate:modelValue":e=>t.connector=e,size:`small`},{default:j(()=>[s(M,{label:`and`},{default:j(()=>[...c[5]||=[o(` 与 `,-1)]]),_:1}),s(M,{label:`or`},{default:j(()=>[...c[6]||=[o(` 或 `,-1)]]),_:1})]),_:1},8,[`modelValue`,`onUpdate:modelValue`])])):r(``,!0)],64))),128))]))])]),_:1}),s(L,{label:`高级配置`,name:`advanced`},{default:j(()=>[a(`div`,xt,[a(`div`,St,[c[8]||=a(`span`,{class:`section-title`},`依赖字段`,-1),s(l,{size:`small`,type:`primary`,onClick:k(b)},{default:j(()=>[...c[7]||=[o(` 添加依赖 `,-1)]]),_:1},8,[`onClick`])]),k(g).length===0?(y(),i(`div`,Ct,` 暂无依赖字段,点击"添加依赖"按钮添加 `)):(y(),i(`div`,wt,[(y(!0),i(e,null,S(k(g),(t,r)=>(y(),i(`div`,{key:r,class:`dependency-item`},[a(`div`,Tt,[a(`span`,Et,`依赖 `+D(r+1),1),s(l,{size:`small`,type:`danger`,text:``,onClick:e=>k(C)(r)},{default:j(()=>[...c[9]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(O,{"label-width":`80px`},{default:j(()=>[s(d,{label:`字段`},{default:j(()=>[s(u,{modelValue:t.source,"onUpdate:modelValue":e=>t.source=e,data:k(h),placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1,onChange:e=>k(T)(t)},null,8,[`modelValue`,`onUpdate:modelValue`,`data`,`onChange`])]),_:2},1024),s(d,{label:`属性`},{default:j(()=>[s(v,{modelValue:t.property,"onUpdate:modelValue":e=>t.property=e,placeholder:`选择属性`,onChange:e=>k(T)(t)},{default:j(()=>[(y(!0),i(e,null,S(k(lt),e=>(y(),n(f,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`,`onChange`])]),_:2},1024),s(d,{label:`变量名`},{default:j(()=>[s(x,{modelValue:t.name,"onUpdate:modelValue":e=>t.name=e,placeholder:`在表达式中使用的变量名`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(d,{label:`类型`},{default:j(()=>[s(v,{modelValue:t.type,"onUpdate:modelValue":e=>t.type=e,placeholder:`选择类型`},{default:j(()=>[(y(!0),i(e,null,S(k(ut),e=>(y(),n(f,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]))),128))]))]),a(`div`,Dt,[a(`div`,Ot,[c[11]||=a(`span`,{class:`section-title`},`状态控制`,-1),s(l,{size:`small`,type:`primary`,onClick:k(E)},{default:j(()=>[...c[10]||=[o(` 添加规则 `,-1)]]),_:1},8,[`onClick`])]),k(_).length===0?(y(),i(`div`,kt,` 暂无状态规则,点击"添加规则"按钮添加 `)):(y(),i(`div`,At,[(y(!0),i(e,null,S(k(_),(t,r)=>(y(),i(`div`,{key:r,class:`state-rule-item`},[a(`div`,jt,[a(`span`,Mt,`规则 `+D(r+1),1),s(l,{size:`small`,type:`danger`,text:``,onClick:e=>k(A)(r)},{default:j(()=>[...c[12]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(O,{"label-width":`80px`},{default:j(()=>[s(d,{label:`状态属性`},{default:j(()=>[s(v,{modelValue:t.state,"onUpdate:modelValue":e=>t.state=e,placeholder:`选择要控制的状态`},{default:j(()=>[(y(!0),i(e,null,S(k(ct),e=>(y(),n(f,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(d,{label:`表达式`},{default:j(()=>[s(x,{modelValue:t.expression,"onUpdate:modelValue":e=>t.expression=e,type:`textarea`,rows:2,placeholder:`输入 JS 表达式,如:$deps.username_value === '123'`},null,8,[`modelValue`,`onUpdate:modelValue`]),c[13]||=a(`div`,{class:`expression-tip`},` 使用 $deps.变量名 访问依赖字段的值 `,-1)]),_:2},1024)]),_:2},1024)]))),128))]))])]),_:1})]),_:1},8,[`modelValue`])])]),_:1},8,[`modelValue`])}}}),[[`__scopeId`,`data-v-a23b0a0a`]]);const Pt={class:`config-panel`},Ft={key:0,class:`config-empty`},It={key:1,class:`config-content`},Lt={class:`config-title`};var Rt=J(c({__name:`index`,props:{components:{}},setup(e){let c=e,l=G(),{SchemaField:u}=se({components:{FormItem:B,Input:V,InputNumber:ee,Checkbox:z,Radio:te,Switch:ie,Select:ne,Space:re,ArrayItems:R}}),d=E(null),f=t(()=>l.getSelectedField()),p=t(()=>f.value?f.value[`x-component`]:null),m=t(()=>{let e=p.value;return e?c.components[e]?.setterSchema:null}),h=t(()=>{if(!m.value)return null;let e=m.value.basicSetter;return!e||Object.keys(e).length===0?null:{type:`object`,properties:e}}),g=t(()=>{if(!m.value)return null;let e=m.value.componentSetter;return!e||!e.properties||Object.keys(e.properties).length===0?null:e}),_=t(()=>{if(!m.value)return null;let e=m.value.basicSetter||{},t=m.value.componentSetter?.properties||{};return{type:`object`,properties:{...e,...t}}});A(()=>l.selectedFieldName.value,()=>{f.value&&_.value?d.value=Ke(_.value,l):d.value=null},{immediate:!0});let v=E([`base`,`operate`,`component`]),b=t(()=>l.selectedFieldName.value||`empty`),S=x(!1);function C(){S.value=!0}function T(e){let t=l.selectedFieldName.value;if(!t)return;let n=l.getSelectedField();if(!n)return;let r={...n,"x-reactions":Object.keys(e).length>0?e:void 0};l.updateFieldSchema(t,r)}return(e,t)=>{let c=w(`ElCollapseItem`),m=w(`ElButton`),_=w(`ElCollapse`);return y(),i(`div`,Pt,[f.value?(y(),i(`div`,It,[a(`h3`,Lt,D(p.value)+` 配置 `,1),d.value?(y(),n(k(ae),{key:b.value,form:d.value},{default:j(()=>[s(_,{modelValue:v.value,"onUpdate:modelValue":t[0]||=e=>v.value=e,class:`config-section`},{default:j(()=>[h.value?(y(),n(c,{key:0,name:`base`,title:`基本配置`},{default:j(()=>[s(k(u),{schema:h.value},null,8,[`schema`])]),_:1})):r(``,!0),s(c,{name:`operate`,title:`操作配置`},{default:j(()=>[a(`div`,null,[s(m,{type:`primary`,onClick:C},{default:j(()=>[...t[3]||=[o(` 条件渲染 `,-1)]]),_:1})])]),_:1}),g.value?(y(),n(c,{key:1,name:`component`,title:`组件配置`},{default:j(()=>[s(k(u),{schema:g.value},null,8,[`schema`])]),_:1})):r(``,!0)]),_:1},8,[`modelValue`])]),_:1},8,[`form`])):r(``,!0),s(k(Nt),{modelValue:S.value,"onUpdate:modelValue":t[1]||=e=>S.value=e,schema:k(l).formSchema.value,"current-field-name":k(l).selectedFieldName.value,"initial-reactions":f.value?.[`x-reactions`],onSave:T},null,8,[`modelValue`,`schema`,`current-field-name`,`initial-reactions`])])):(y(),i(`div`,Ft,[...t[2]||=[a(`p`,null,`请选择一个字段`,-1)]]))])}}}),[[`__scopeId`,`data-v-66ec4854`]]);const zt={class:`material-panel`},Bt={class:`panel-content`},Vt={class:`category-title`},Ht={class:`component-grid`},Ut=[`onClick`,`onDragstart`],Wt={class:`component-icon`},Gt={class:`component-name`},Kt={key:0,class:`component-desc`};var qt=J(c({__name:`materialPanel`,props:{components:{}},setup(n){let o=n,s=d(Se,null),c=t(()=>{let e={};return Object.entries(o.components).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e});function l(e,t,n){if(!e.dataTransfer)return;let r={type:`new-component`,componentKey:t,componentName:n.config.name,defaultSchema:n.defaultSchema};e.dataTransfer.effectAllowed=`copy`,e.dataTransfer.setData(`application/json`,JSON.stringify(r));let i=e.target;e.dataTransfer.setDragImage(i,10,10),setTimeout(()=>{s?.switchToTreeTab()},100)}function u(e){let t=e.target;t.style.opacity=`1`}function f(e){console.log(`点击组件:`,e)}return(t,n)=>(y(),i(`div`,zt,[n[0]||=a(`div`,{class:`panel-header`},[a(`h3`,null,`组件库`)],-1),a(`div`,Bt,[(y(!0),i(e,null,S(c.value,(t,n)=>(y(),i(`div`,{key:n,class:`category-group`},[a(`div`,Vt,D(n),1),a(`div`,Ht,[(y(!0),i(e,null,S(t,({key:e,component:t})=>(y(),i(`div`,{key:e,class:`component-item`,draggable:`true`,onClick:t=>f(e),onDragstart:n=>l(n,e,t),onDragend:u},[a(`div`,Wt,D(t.config?.icon?.slice(0,3)),1),a(`div`,Gt,D(t.config?.name||e),1),t.config?.description?(y(),i(`div`,Kt,D(t.config.description),1)):r(``,!0)],40,Ut))),128))])]))),128))])]))}}),[[`__scopeId`,`data-v-93609a69`]]);const Jt={key:0,class:`clipboard-paste-section`},Yt={class:`component-picker-content`},Xt={class:`picker-category-title`},Zt={class:`picker-component-grid`},Qt=[`onClick`],$t={class:`picker-component-icon`},en={class:`picker-component-name`};var tn=J(c({__name:`ComponentPicker`,props:{visible:{type:Boolean},groupedComponents:{}},emits:[`update:visible`,`select`,`pasteSchema`],setup(t,{emit:c}){let l=t,u=c,d=x(null);async function f(){d.value=null;try{let e=await navigator.clipboard.readText();if(!e)return;let t=JSON.parse(e);t&&typeof t==`object`&&t[`x-component`]&&(d.value=t)}catch{}}function p(){d.value&&(u(`pasteSchema`,d.value),u(`update:visible`,!1))}return A(()=>l.visible,e=>{e&&f()}),(t,c)=>{let f=w(`ElButton`),m=w(`ElDialog`);return y(),n(m,{"model-value":l.visible,title:`选择组件`,width:`600px`,"close-on-click-modal":!1,"onUpdate:modelValue":c[0]||=e=>u(`update:visible`,e)},{default:j(()=>[d.value?(y(),i(`div`,Jt,[s(f,{type:`primary`,onClick:p},{default:j(()=>[o(` 从剪切板粘贴 (`+D(d.value[`x-component`])+`) `,1)]),_:1})])):r(``,!0),a(`div`,Yt,[(y(!0),i(e,null,S(l.groupedComponents,(t,n)=>(y(),i(`div`,{key:n,class:`picker-category-group`},[a(`div`,Xt,D(n),1),a(`div`,Zt,[(y(!0),i(e,null,S(t,({key:e,component:t})=>(y(),i(`div`,{key:e,class:`picker-component-item`,onClick:n=>u(`select`,e,t)},[a(`div`,$t,D(t.config?.icon?.slice(0,3)),1),a(`div`,en,D(t.config?.name||e),1)],8,Qt))),128))])]))),128))])]),_:1},8,[`model-value`])}}}),[[`__scopeId`,`data-v-2f266708`]]);const nn={class:`context-menu`},rn={key:0,class:`menu-divider`},an=[`onClick`];var on=J(c({__name:`ContextMenu`,props:{visible:{type:Boolean},virtualRef:{},menuItems:{}},emits:[`update:visible`,`select`],setup(t,{emit:r}){let o=t,c=r;return(t,r)=>{let l=w(`ElIcon`),u=w(`ElPopover`);return y(),n(u,{visible:o.visible,"virtual-ref":o.virtualRef,"virtual-triggering":``,"show-arrow":!1,"popper-class":`schema-tree-context-menu`,placement:`bottom-start`,offset:6,"onUpdate:visible":r[0]||=e=>c(`update:visible`,e)},{default:j(()=>[a(`div`,nn,[(y(!0),i(e,null,S(o.menuItems,(t,r)=>(y(),i(e,{key:r},[t===`divider`?(y(),i(`div`,rn)):(y(),i(`div`,{key:1,class:`menu-item`,onClick:e=>c(`select`,t.type)},[s(l,null,{default:j(()=>[(y(),n(T(t.icon)))]),_:2},1024),a(`span`,null,D(t.label),1)],8,an))],64))),128))])]),_:1},8,[`visible`,`virtual-ref`])}}}),[[`__scopeId`,`data-v-1ef29c4a`]]);function sn(){let e=x(!1),n=x(null),r=x(`node`),i=x(null),a=x(null),o=t(()=>{if(r.value===`empty`)return[{type:`insertRoot`,label:`插入组件`,icon:U}];let e=n.value;if(!e)return[];let t=[{type:`copy`,label:`复制`,icon:pe},{type:`copyTemplate`,label:`复制模板`,icon:pe},{type:`delete`,label:`删除`,icon:me},`divider`,{type:`moveUp`,label:`上移`,icon:_e},{type:`moveDown`,label:`下移`,icon:fe},`divider`,{type:`insertBefore`,label:`上方插入`,icon:U},{type:`insertAfter`,label:`下方插入`,icon:U}];return e.isContainer&&t.push({type:`insertInner`,label:`插入内部`,icon:he}),t}),s=e=>{let t=new DOMRect(e.clientX,e.clientY,0,0);i.value={getBoundingClientRect:()=>t,contextElement:document.body}},c=()=>{a.value&&=(document.removeEventListener(`click`,a.value),null)},l=()=>{e.value=!1,c()},u=()=>{c();let e=()=>{l()};a.value=e,document.addEventListener(`click`,e)},d=(t,i,a)=>{t.preventDefault(),t.stopPropagation(),r.value=i,n.value=a,s(t),e.value=!0,setTimeout(()=>{u()},0)};return v(()=>{c()}),{contextMenuVisible:e,contextMenuNode:n,contextMenuMode:r,contextMenuVirtualRef:i,menuItems:o,handleEmptyContextMenu:e=>{d(e,`empty`,null)},handleNodeContextMenu:(e,t)=>{d(e,`node`,t)},closeContextMenu:l}}function cn(e){return JSON.parse(JSON.stringify(e))}function ln(e){return e.split(`.`).filter(e=>e!==`properties`&&e!==`items`)}function un(e,t,n){let r=ln(t),i=[...r.slice(0,-1),n],a=new Map,o=(e,t,n)=>{let r=cn(e);if(a.set(t.join(`.`),n.join(`.`)),e.properties&&typeof e.properties==`object`){let i={};Object.entries(e.properties).forEach(([e,r])=>{let a=`f_${N()}`;i[a]=o(r,[...t,e],[...n,a])}),r.properties=i}return e.items&&typeof e.items==`object`&&(r.items=o(e.items,[...t,`items`],[...n,`items`])),r},s=e=>{if(a.has(e))return a.get(e)||null;for(let[t,n]of a.entries())if(e.startsWith(`${t}.`))return`${n}${e.slice(t.length)}`;return null},c=e=>{if(!e||typeof e!=`object`)return;let t=e[`x-reactions`];t&&Array.isArray(t.dependencies)&&(t.dependencies=t.dependencies.map(e=>{if(e&&typeof e.source==`string`){let t=s(e.source);if(t)return{...e,source:t}}return e}),e[`x-reactions`]=t),e.properties&&Object.values(e.properties).forEach(e=>c(e)),e.items&&c(e.items)},l=o(e,r,i);return c(l),l}function dn(e){return e[`x-droppable`]===!1?!1:!![`object`,`void`,`array`].includes(e.type)}function Q(e,t=``){let n=[];return!e||typeof e!=`object`?n:(e.properties&&typeof e.properties==`object`&&Object.entries(e.properties).forEach(([e,r])=>{let i=t?`${t}.properties.${e}`:e,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:dn(r),children:Q(r,i)};n.push(s)}),e.items?.properties&&Object.entries(e.items.properties).forEach(([e,r])=>{let i=`${t}.items.properties.${e}`,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:dn(r),children:Q(r,i)};n.push(s)}),n)}function $(e){let t=[];return e.forEach(e=>{t.push(e.path),e.children&&e.children.length>0&&t.push(...$(e.children))}),t}function fn(e,t){let n=t.getBoundingClientRect(),r=e.clientY-n.top,i=n.height*.2;return r<i?`before`:r>n.height-i?`after`:`inner`}function pn(e,t,n){let r=document.elementFromPoint(t,n)?.closest(`.el-tree-node`);if(!r)return null;let i=r.querySelector(`.el-tree-node__content`);if(!i)return null;let a=(e,t)=>{for(let n of e){if(n.path===t)return n;if(n.children){let e=a(n.children,t);if(e)return e}}return null},o=r.getAttribute(`data-path`)||i.getAttribute(`data-path`);if(o){let t=a(e,o);if(t)return{element:r,data:t}}let s=document.querySelectorAll(`.el-tree-node`),c=Array.from(s).indexOf(r);return c>=0&&c<e.length?{element:r,data:e[c]}:null}function mn(e){let{components:n,contextMenuNode:r,closeContextMenu:i,treeData:a,expandAll:o,store:s}=e,c=x(!1),l=x(null),u=t(()=>{let e={};return Object.entries(n||{}).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e}),d=(e,t,n)=>{let{defaultSchema:r}=e,i=`f_${N()}`,a;a=n===`inner`?q.Inner:n===`before`?q.Before:q.After,s.insertField(t.path,i,r,a),m(()=>{let e;if(n===`inner`)e=s.getNodeSchema(t.path)?.type===`array`?`${t.path}.items.properties.${i}`:`${t.path}.properties.${i}`;else{let n=t.path.split(`.`).slice(0,-1).join(`.`);e=n?`${n}.${i}`:i}s.selectNode(e),o()})},f=e=>{let{defaultSchema:t}=e,n=`f_${N()}`;s.addField(n,t),s.selectNode(n),m(()=>{o()})},p=(e,t)=>{l.value={targetNode:e,position:t},c.value=!0},h=(e,t)=>{if(!l.value)return;let{targetNode:n,position:r}=l.value,i={componentKey:e,defaultSchema:JSON.parse(JSON.stringify(t.defaultSchema))};r===`root`?f(i):n&&d(i,n,r),c.value=!1,l.value=null},g=e=>{if(!l.value)return;let{targetNode:t,position:n}=l.value,r=un(e,`paste`,`f_${N()}`),i={componentKey:e[`x-component`]||`Unknown`,defaultSchema:r};n===`root`?f(i):t&&d(i,t,n),c.value=!1,l.value=null},_=e=>{let t=e.split(`.`),n=t[t.length-1],r=t.includes(`items`)&&t.includes(`properties`),i=``;if(r){let e=t.lastIndexOf(`items`);i=t.slice(0,e).join(`.`)}else{let e=t.lastIndexOf(`properties`);e>0&&(i=t.slice(0,e).join(`.`))}let a,o;return i?(a=s.getNodeSchema(i),a&&(o=a.type===`array`?a.items?.properties:a.properties)):(a=s.formSchema.value,o=a.properties),{parentSchema:a,propertiesObj:o,fieldName:n}},v=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let{parentSchema:n,propertiesObj:a,fieldName:o}=_(e);if(!n||!a)return;let c=`f_${N()}`,l=un(t,e,c),u=Object.entries(a),d=u.findIndex(([e])=>e===o),f=d>=0?d+1:u.length;u.splice(f,0,[c,l]);let p={};u.forEach(([e,t])=>{p[e]=t});let m=e.split(`.`);if(m.length===1)s.formSchema.value.properties=p;else{let e=m.includes(`items`),t;if(e){let e=m.lastIndexOf(`items`);t=`${m.slice(0,e).join(`.`)}.items.properties`}else{let e=m.lastIndexOf(`properties`);t=m.slice(0,e+1).join(`.`)}L(s.formSchema.value.properties,t,p)}i()},y=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let n=JSON.stringify(t);navigator.clipboard.writeText(n),i()},b=()=>{if(!r.value)return;let e=r.value.path;P(s.formSchema.value.properties,e),i()},S=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=_(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c<=0)return;let l=o[c];o[c]=o[c-1],o[c-1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}L(s.formSchema.value.properties,t,u)}i()},C=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=_(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c===-1||c>=o.length-1)return;let l=o[c];o[c]=o[c+1],o[c+1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}L(s.formSchema.value.properties,t,u)}i()};return{groupedComponents:u,componentPickerVisible:c,handleMenuClick:e=>{switch(e){case`insertRoot`:p(null,`root`);break;case`insertBefore`:p(r.value,`before`);break;case`insertAfter`:p(r.value,`after`);break;case`insertInner`:p(r.value,`inner`);break;case`copy`:v();return;case`copyTemplate`:y();return;case`delete`:b();return;case`moveUp`:S();return;case`moveDown`:C();return}i()},handleSelectComponent:h,handlePasteSchema:g,handleExternalDrop:e=>{if(e.preventDefault(),e.stopPropagation(),e.dataTransfer)try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);if(n.type!==`new-component`)return;let{componentKey:r,defaultSchema:i}=n;if(!i){console.warn(`组件缺少 defaultSchema:`,r);return}let o=pn(a.value,e.clientX,e.clientY);if(console.log(`targetNode`,o),o){let t=fn(e,o.element);d(n,o.data,t)}else f(n)}catch(e){console.error(`解析拖拽数据失败:`,e)}}}}function hn(e=G()){let n=x(),r=x(``),i=t(()=>Q(e.formSchema.value));return{treeRef:n,filterText:r,treeData:i,treeProps:{children:`children`,label:`label`},filterNode:(e,t)=>e?t.label.toLowerCase().includes(e.toLowerCase()):!0,handleFilterChange:e=>{n.value?.filter(e)},expandAll:()=>{$(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!0)})},collapseAll:()=>{$(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!1)})},handleNodeClick:t=>{e.selectNode(t.path)},handleAllowDrag:e=>!0,handleAllowDrop:(e,t,n)=>{let r=t.data;return n===`inner`?r.isContainer:!0},handleNodeDrop:(t,n,r,i)=>{let a=t.data,o=n.data,s;s=r===`inner`?`INNER`:r===`before`?`BEFORE`:`AFTER`,e.moveField(a.path,o.path,s)}}}const gn={class:`schema-tree`},_n={class:`tree-toolbar`},vn={class:`toolbar-buttons`},yn={class:`node-label`},bn={class:`node-component`};var xn=J(c({__name:`SchemaTree`,setup(e){let t=G(),n=d(`designerComponents`,{}),{treeRef:r,filterText:c,treeData:l,treeProps:u,filterNode:p,handleFilterChange:g,expandAll:_,collapseAll:v,handleNodeClick:b,handleAllowDrop:x,handleAllowDrag:S,handleNodeDrop:C}=hn(t),{contextMenuVisible:T,contextMenuNode:E,contextMenuVirtualRef:O,menuItems:A,handleEmptyContextMenu:N,handleNodeContextMenu:P,closeContextMenu:F}=sn(),{groupedComponents:I,componentPickerVisible:L,handleMenuClick:R,handleSelectComponent:z,handlePasteSchema:B,handleExternalDrop:V}=mn({store:t,components:n,contextMenuNode:E,closeContextMenu:F,treeData:l,expandAll:_});return m(()=>{_()}),(e,t)=>{let n=w(`ElIcon`),d=w(`ElInput`),m=w(`ElButton`),E=w(`ElEmpty`),F=w(`ElTree`);return y(),i(`div`,gn,[a(`div`,_n,[s(d,{modelValue:k(c),"onUpdate:modelValue":t[0]||=e=>f(c)?c.value=e:null,placeholder:`搜索组件`,clearable:``,size:`small`,onInput:k(g)},{prefix:j(()=>[s(n,null,{default:j(()=>[s(k(ge))]),_:1})]),_:1},8,[`modelValue`,`onInput`]),a(`div`,vn,[s(m,{size:`small`,text:``,onClick:k(_)},{default:j(()=>[...t[7]||=[o(` 全部展开 `,-1)]]),_:1},8,[`onClick`]),s(m,{size:`small`,text:``,onClick:k(v)},{default:j(()=>[...t[8]||=[o(` 全部折叠 `,-1)]]),_:1},8,[`onClick`])])]),a(`div`,{class:`tree-content`,onDrop:t[2]||=(...e)=>k(V)&&k(V)(...e),onDragover:t[3]||=M(()=>{},[`prevent`]),onContextmenu:t[4]||=(...e)=>k(N)&&k(N)(...e)},[s(F,{ref_key:`treeRef`,ref:r,style:{height:`100%`},data:k(l),props:k(u),"node-key":`path`,draggable:``,"allow-drop":k(x),"allow-drag":k(S),"filter-node-method":(e,t)=>k(p)(e,t),"default-expand-all":``,"highlight-current":``,onNodeClick:k(b),onNodeDrop:k(C),onNodeContextmenu:t[1]||=(e,t)=>k(P)(e,t)},{default:j(({data:e})=>[a(`div`,{class:h([`tree-node`,{"is-container":e.isContainer}])},[a(`span`,yn,D(e.label),1),a(`span`,bn,`(`+D(e.component)+`)`,1)],2)]),empty:j(()=>[s(E,{description:`暂无组件,请点击右键插入`})]),_:1},8,[`data`,`props`,`allow-drop`,`allow-drag`,`filter-node-method`,`onNodeClick`,`onNodeDrop`])],32),s(on,{visible:k(T),"onUpdate:visible":t[5]||=e=>f(T)?T.value=e:null,"virtual-ref":k(O),"menu-items":k(A),onSelect:k(R)},null,8,[`visible`,`virtual-ref`,`menu-items`,`onSelect`]),s(tn,{visible:k(L),"onUpdate:visible":t[6]||=e=>f(L)?L.value=e:null,"grouped-components":k(I),onSelect:k(z),onPasteSchema:k(B)},null,8,[`visible`,`grouped-components`,`onSelect`,`onPasteSchema`])])}}}),[[`__scopeId`,`data-v-c20e7234`]]);const Sn={class:`left-panel`};var Cn=J(c({__name:`index`,props:{components:{},draggable:{type:Boolean,default:!1}},setup(e){let t=e,r=x(`materials`);function a(){r.value!==`tree`&&(r.value=`tree`)}return b(Se,{switchToTreeTab:a}),(a,o)=>{let c=w(`ElTabPane`),l=w(`ElTabs`);return y(),i(`div`,Sn,[t.draggable?(y(),n(l,{key:0,modelValue:r.value,"onUpdate:modelValue":o[0]||=e=>r.value=e,class:`panel-tabs`},{default:j(()=>[s(c,{label:`组件库`,name:`materials`},{default:j(()=>[s(qt,{components:e.components},null,8,[`components`])]),_:1}),s(c,{label:`组件树`,name:`tree`},{default:j(()=>[s(xn)]),_:1})]),_:1},8,[`modelValue`])):(y(),n(xn,{key:1}))])}}}),[[`__scopeId`,`data-v-7b552cf6`]]),wn=c({name:`ArrayInner`,inheritAttrs:!1,__name:`arrayInner`,setup(e){return b(be,ce()),(e,t)=>C(e.$slots,`default`)}}),Tn=c({inheritAttrs:!1,__name:`arrayItemInner`,props:{index:{}},setup(e){return b(xe,e),(e,t)=>C(e.$slots,`default`)}});function En(e){return Array.isArray(e?.items)?En(e.items[0]):e?.items?.type===`array`||e?.items?.type===`object`}function Dn(e){let t=En(e),n=null;return n=t?new WeakMap:[],v(()=>{n=null}),{getKey:(e,t)=>n instanceof WeakMap?(n.has(e)||n.set(e,N()),`${n.get(e)}-${t}`):(n&&!n[t]&&(n[t]=N()),n?`${n[t]}-${t}`:void 0)}}function On(e){return ve(c({name:`SchemaWrapper`,props:{value:{type:[String,Number,Boolean,Array,Object],default:void 0},onChange:{type:Function,default:void 0}},setup(n,r){let{setterSchema:i}=e,a=ce(),o=le(),s=d(be,void 0),c=d(xe,void 0),l=d(Ce,t(()=>!1)),{getKey:f}=Dn(o.value),p=t(()=>{let e=a.value,t={...o.value?.[`x-component-props`]||{},value:n.value,onChange:n.onChange};if(e&&!H(e)&&(t.pattern=e.pattern),i.basicSetter)for(let[e,n]of Object.entries(i.basicSetter)){let r=n[`x-path`];if(r){let n=F(o.value,r);n!==void 0&&(t[e]=n)}}if(i.componentSetter?.properties)for(let[e,n]of Object.entries(i.componentSetter.properties)){let r=n[`x-path`];if(r){let n=F(o.value,r);n!==void 0&&(t[e]=n)}}e&&!H(e)&&(t.pattern=e.pattern);let r=o.value?.type===`array`?a.value:s?.value;return r&&(t.onAdd=()=>r.push({}),t.onPush=()=>r.push({}),t.onUnshift=()=>r.unshift({}),t.onRemove=e=>r.remove(e),t.onMove=(e,t)=>r.move(e,t),t.onMoveUp=e=>{e>0&&r.move(e,e-1)},t.onMoveDown=e=>{e<r.value.length-1&&r.move(e,e+1)},c?.index!==void 0&&(t.pattern=r.pattern)),c?.index!==void 0&&(t.arrayIndex=c.index),l.value&&(t.pattern=`disabled`),t});return()=>{let t=a.value;if(!t||t.display!==`visible`)return u(`template`,{},{});let n=()=>{if(!t||H(t))return null;let e=t.errors||[];return e.length===0?null:u(`div`,{class:`formily-validation-errors`,style:{color:`#f56c6c`,fontSize:`12px`,marginTop:`4px`,lineHeight:`1.5`}},u(`div`,{class:`formily-validation-error-item`},e[0].messages))};if(o.value?.type===`array`){let r=t?.value||[],i=r.length>0?r.map((e,t)=>u(Tn,{index:t},{default:()=>u(oe,{key:f(e,t),schema:o.value.items,name:t})})):null;return u(`div`,{},[u(wn,{},{default:()=>u(e.component,p.value,{default:()=>i})}),n()])}return u(`div`,{},[u(e.component,p.value,r.slots),n()])}}}))}var kn=c({__name:`index`,props:{values:{},schema:{},components:{},disabled:{type:Boolean}},setup(e,{expose:r}){let i=e,a=ue({values:i.values??{}});b(Ce,t(()=>i.disabled??!1));let{SchemaField:o}=se({components:Object.keys(i.components).reduce((e,t)=>(e[t]=On(i.components[t]),e),{})});return r({form:a}),(t,r)=>(y(),n(k(ae),{form:k(a)},{default:j(()=>[s(k(o),{schema:e.schema},null,8,[`schema`])]),_:1},8,[`form`]))}});const An={key:0,class:`designer-layout`},jn={class:`designer-material`},Mn={class:`designer-canvas`},Nn={class:`designer-config`},Pn={key:1,class:`designer-preview`};var Fn=J(c({__name:`designer`,props:{components:{},mode:{default:`edit`},modelValue:{},draggable:{type:Boolean,default:!1},height:{default:`100vh`}},emits:[`update:modelValue`],setup(e,{expose:n,emit:r}){let o=e,c=r,l=ke(o.draggable);b(`designerComponents`,o.components);let u=x(null);A(()=>o.modelValue,e=>{e&&JSON.stringify(e)!==JSON.stringify(l.formSchema.value)&&(l.formSchema.value=e)},{immediate:!0,deep:!0}),A(()=>l.formSchema.value,e=>{c(`update:modelValue`,e)},{deep:!0});function d(){return u.value?.form?.values||{}}return n({getFormValues:d,schema:t(()=>l.formSchema.value),store:l}),(t,n)=>(y(),i(`div`,{class:`designer`,style:_({height:o.height})},[o.mode===`edit`?(y(),i(`div`,An,[a(`div`,jn,[s(Cn,{components:e.components,draggable:e.draggable},null,8,[`components`,`draggable`])]),a(`div`,Mn,[s(Ge,{components:e.components},null,8,[`components`])]),a(`div`,Nn,[s(Rt,{components:e.components},null,8,[`components`])])])):(y(),i(`div`,Pn,[s(kn,{ref_key:`renderRef`,ref:u,schema:k(l).formSchema.value,components:e.components},null,8,[`schema`,`components`])]))],4))}}),[[`__scopeId`,`data-v-be54faba`]]);const In=Ge,Ln=Rt,Rn=qt,zn=Fn,Bn=kn;export{In as Canvas,Ln as ConfigPanel,W as DesignStoreKey,zn as Designer,Rn as MaterialPanel,Bn as Render,Ae as schemaToSetterValues,je as setterValuesToSchema,ke as useCreateDesignStore,G as useDesignStore};
1
+ import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,inject as u,isRef as d,mergeProps as f,nextTick as p,normalizeClass as m,normalizeProps as h,normalizeStyle as g,onBeforeUnmount as _,openBlock as v,provide as y,ref as b,renderList as x,renderSlot as S,resolveComponent as C,resolveDynamicComponent as w,shallowRef as T,toDisplayString as E,toRef as D,unref as O,watch as k,withCtx as A,withModifiers as j}from"vue";import{uid as M}from"@formily/shared";import{deleteByPath as N,getByPath as P,getFieldNameFromPath as F,setByPath as I}from"@formily-djd/utils";import{ArrayItems as L,Checkbox as R,FormItem as z,Input as B,InputNumber as V,Radio as H,Select as U,Space as W,Switch as ee}from"@formily/element-plus";import{FormProvider as G,RecursionField as te,createSchemaField as ne,useField as re,useFieldSchema as ie}from"@formily/vue";import{createForm as ae,isVoidField as K,onFormValuesChange as oe}from"@formily/core";import{Bottom as se,CirclePlus as q,CopyDocument as ce,Delete as le,FolderAdd as ue,Search as de,Top as fe}from"@element-plus/icons-vue";import{observer as pe}from"@formily/reactive-vue";const J=Symbol(`DesignStore`);function Y(){let e=u(J);if(!e)throw Error(`[useDesignStore] 必须在 Designer 组件内使用`);return e}const me=Symbol(`ComponentSettings`),he=Symbol(`ArrayField`),ge=Symbol(`ArrayItemKey`),_e=Symbol(`LeftPanel`),ve=Symbol(`RenderDisabled`);function ye(e,n=`.canvas-content`){return t(()=>{if(!e.value)return null;let t=document.querySelector(`[data-node-id="${e.value}"]`);if(!t)return null;let r=document.querySelector(n);if(!r)return null;let i=t.getBoundingClientRect(),a=r.getBoundingClientRect();return{x:i.x-a.x+r.scrollLeft,y:i.y-a.y+r.scrollTop,width:i.width,height:i.height}})}function X(e,t,n=!0){let r=e=>{if(!n)return 0;let t=e*.1;return t>20?20:t<10?10:t},i=r(t.width),a=r(t.height);return e.x>=t.x+i&&e.x<=t.x+t.width-i&&e.y>=t.y+a&&e.y<=t.y+t.height-a}function be(e,t){let n=Math.min(Math.abs(e.x-t.x),Math.abs(e.x-(t.x+t.width))),r=Math.min(Math.abs(e.y-t.y),Math.abs(e.y-(t.y+t.height)));return e.x>=t.x&&e.x<=t.x+t.width&&(n=0),e.y>=t.y&&e.y<=t.y+t.height&&(r=0),Math.sqrt(n**2+r**2)}function xe(e,t,n){return n?e.x>=t.x+t.width/2:e.y>=t.y+t.height/2}function Se(e){return e.width>e.height}let Z=function(e){return e.Before=`BEFORE`,e.After=`AFTER`,e.Upper=`UPPER`,e.Under=`UNDER`,e.Inner=`INNER`,e.InnerBefore=`INNER_BEFORE`,e.InnerAfter=`INNER_AFTER`,e.ForbidBefore=`FORBID_BEFORE`,e.ForbidAfter=`FORBID_AFTER`,e.ForbidUpper=`FORBID_UPPER`,e.ForbidUnder=`FORBID_UNDER`,e.ForbidInner=`FORBID_INNER`,e.ForbidInnerBefore=`FORBID_INNER_BEFORE`,e.ForbidInnerAfter=`FORBID_INNER_AFTER`,e.Forbid=`FORBID`,e}({});var Ce=class{sensitive;forceBlock;dragNodes=b([]);touchNode=b(null);closestNode=b(null);closestPosition=b(Z.Before);closestRect=b(null);getNodeRect;getNodeSchema;getCanvasRect;findChildNodes;constructor(e,t){this.sensitive=t?.sensitive??!0,this.forceBlock=t?.forceBlock??!1,this.getNodeRect=e.getNodeRect,this.getNodeSchema=e.getNodeSchema,this.getCanvasRect=e.getCanvasRect,this.findChildNodes=e.findChildNodes}setDragNodes(e){this.dragNodes.value=e}calculate(e){let{point:t,touchNode:n,closestNode:r,closestPosition:i}=e;if(r!==void 0&&i!==void 0){this.closestNode.value=r,this.closestPosition.value=i,r&&(this.closestRect.value=this.getNodeRect(r));return}if(!t)return;n!==void 0&&(this.touchNode.value=n);let a=this.getClosestNode(t);if(this.closestNode.value=a,!a){this.closestPosition.value=Z.Before,this.closestRect.value=null;return}this.closestPosition.value=this.getClosestPosition(t,a),this.closestRect.value=this.getNodeRect(a)}getClosestNode(e){let t=this.touchNode.value;if(!t)return null;let n=this.getNodeRect(t);if(!n)return null;let r=this.findChildNodes(t);if(r.length===0)return t;let i=X(e,n,this.sensitive)?0:be(e,n),a=t;for(let t of r){let n=this.getNodeRect(t);if(!n)continue;let r=X(e,n,this.sensitive)?0:be(e,n);r<=i&&(i=r,a=t)}return a}getClosestPosition(e,t){console.log(`[Dragon] getClosestPosition`,t);let n=this.getNodeRect(t),r=this.getNodeSchema(t);if(!n||!r)return Z.Forbid;let i=this.getLayout(n)===`horizontal`,a=X(e,n,this.sensitive),o=this.isContainer(r),s=this.canInsertSibling(t),c=xe(e,n,i);return a?o&&this.canDropInside(t)?this.findChildNodes(t).length===0?Z.Inner:c?Z.InnerAfter:Z.InnerBefore:s?i?c?Z.After:Z.Before:c?Z.Under:Z.Upper:Z.Forbid:s?i?c?Z.ForbidAfter:Z.ForbidBefore:c?Z.ForbidUnder:Z.ForbidUpper:Z.Forbid}getLayout(e){return this.forceBlock?`vertical`:Se(e)?`horizontal`:`vertical`}isContainer(e){return!e||e[`x-droppable`]===!1?!1:e.type===`object`||e.type===`void`||e.type===`array`}canInsertSibling(e){return!(e===``||e==null)}canDropInside(e){if(this.getNodeSchema(e)?.[`x-droppable`]===!1)return!1;let t=this.dragNodes.value;if(t.length===0)return!0;for(let n of t)if(n.nodePath===e||e.startsWith(`${n.nodePath}.`))return!1;return!0}clear(){this.dragNodes.value=[],this.touchNode.value=null,this.closestNode.value=null,this.closestPosition.value=Z.Before,this.closestRect.value=null}};function we(e=!1){let t=b({type:`object`,properties:{}}),n=b(null),r=b(null),i=b(null),a=b(!1),o=b([]),s=b(null),c=b(null),l=b(Z.Before);function u(e){let t=document.querySelector(`[data-node-id="${e}"]`);if(!t)return null;let n=document.querySelector(`.canvas-content`);if(!n)return null;let r=t.getBoundingClientRect(),i=n.getBoundingClientRect();return{x:r.x-i.x,y:r.y-i.y,width:r.width,height:r.height}}function d(){let e=document.querySelector(`.canvas-content`);if(!e)return{x:0,y:0,width:0,height:0};let t=e.getBoundingClientRect();return{x:t.x,y:t.y,width:t.width,height:t.height}}let f=new Ce({getNodeRect:u,getNodeSchema:e=>P(t.value.properties,e),getCanvasRect:d,findChildNodes:e=>{let n=P(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{r.push(`${e}.properties.${t}`)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{r.push(`${e}.items.properties.${t}`)}),r}},{sensitive:!0,forceBlock:!1});function p(e,n){t.value.properties||(t.value.properties={}),t.value.properties[e]=n}function m(e,n){I(t.value.properties,e,n)}function h(e){n.value=e}function g(){return n.value&&P(t.value.properties,n.value)||null}function _(e){r.value=e,n.value=e}function v(e){i.value=e}function x(e){a.value=!0,o.value=e,f.setDragNodes(e)}function S(e,t){if(!a.value)return;t!==void 0&&(s.value=t);let n=d(),r={x:e.x-n.x,y:e.y-n.y};f.calculate({point:r,touchNode:s.value||void 0}),c.value=f.closestNode.value,l.value=f.closestPosition.value}function C(){if(console.log(`[DesignStore] drop`),!a.value)return;let e=c.value,t=l.value;if(!e){w();return}if(t.includes(`FORBID`)){w();return}let n=o.value;if(n.length===0){w();return}n.length===1&&T(n[0].nodePath,e,t),w()}function w(){a.value=!1,o.value=[],s.value=null,c.value=null,l.value=Z.Before,f.clear()}function T(e,n,r){let i=N(t.value.properties,e);if(!i)return;let a=F(e);if(r===Z.Inner||r===Z.InnerAfter||r===Z.InnerBefore){let e=P(t.value.properties,n);if(!e)return;let o,s;if(e.type===`array`?(e.items||={type:`object`,properties:{}},e.items.properties||(e.items.properties={}),o=e.items.properties,s=`${n}.items.properties`):(e.properties||={},o=e.properties,s=`${n}.properties`),r===Z.InnerBefore){let e={[a]:i,...o};I(t.value.properties,s,e)}else I(t.value.properties,`${s}.${a}`,i)}else{let e=r===Z.Before||r===Z.Upper?`before`:`after`,o=n.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?P(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=e===`after`?f+1:f,m=[...d.slice(0,p),[a,i],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?I(t.value.properties,c,h):t.value.properties=h}}function E(e,n,r,i){if(!e){t.value.properties||(t.value.properties={}),t.value.properties[n]=r;return}if(i===Z.Inner||i===Z.InnerAfter||i===Z.InnerBefore){let a=P(t.value.properties,e);if(!a)return;let o,s;if(a.type===`array`?(a.items||={type:`object`,properties:{}},a.items.properties||(a.items.properties={}),o=a.items.properties,s=`${e}.items.properties`):(a.properties||={},o=a.properties,s=`${e}.properties`),i===Z.InnerBefore){let e={[n]:r,...o};I(t.value.properties,s,e)}else I(t.value.properties,`${s}.${n}`,r)}else{let a=i===Z.Before||i===Z.Upper?`before`:`after`,o=e.split(`.`),s=o[o.length-1],c;o.length===1&&(c=``);let l=o.lastIndexOf(`properties`);c=o.slice(0,l+1).join(`.`);let u=c?P(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=a===`after`?f+1:f,m=[...d.slice(0,p),[n,r],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?I(t.value.properties,c,h):t.value.properties=h}}function D(e){return P(t.value.properties,e)}function O(e){let n=P(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{let n=e?`${e}.properties.${t}`:t;r.push(n)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{let n=`${e}.items.properties.${t}`;r.push(n)}),r}let k={formSchema:t,selectedFieldName:n,selectedNodeId:r,hoveredNodeId:i,draggable:e,dragon:f,isDragging:a,dragNodes:o,touchNode:s,closestNode:c,closestPosition:l,addField:p,updateFieldSchema:m,selectField:h,selectNode:_,getSelectedField:g,setHover:v,startDrag:x,updateDragPosition:S,drop:C,cancelDrag:w,moveField:T,insertField:E,getNodeSchema:D,findChildNodes:O};return y(J,k),k}function Te(e,t){let n={};return Object.entries(t.properties||{}).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=P(e,i);r!==void 0&&(n[t]=r)}}),n}function Ee(e,t,n){let r=JSON.parse(JSON.stringify(n));return Object.entries(t.properties||{}).forEach(([t,n])=>{let i=n[`x-path`];i&&e[t]!==void 0&&I(r,i,e[t])}),r}var Q=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},De=Q(c({__name:`HoverBox`,setup(e){let n=Y(),a=ye(n.hoveredNodeId),o=t(()=>!n.hoveredNodeId.value||!n.selectedNodeId.value?!1:n.hoveredNodeId.value===n.selectedNodeId.value),s=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:2,visibility:`hidden`};return a.value&&!o.value&&(e.transform=`perspective(1px) translate3d(${a.value.x}px, ${a.value.y}px, 0)`,e.width=`${a.value.width}px`,e.height=`${a.value.height}px`,e.visibility=`visible`),e}),c=t(()=>a.value&&!o.value);return(e,t)=>c.value?(v(),i(`div`,{key:0,class:`hover-box`,style:g(s.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-2759debe`]]),Oe=Q(c({__name:`Insertion`,setup(e){let n=Y(),a=t(()=>{if(!n.isDragging.value||!n.closestNode.value)return{display:`none`};let e=n.closestPosition.value,t=n.dragon.closestRect.value;if(!t)return{display:`none`};let r=e.toString().includes(`FORBID`),i={position:`absolute`,backgroundColor:r?`#ef4444`:`#3b82f6`,pointerEvents:`none`,zIndex:10,transition:`all 0.15s cubic-bezier(0.4, 0, 0.2, 1)`,boxShadow:r?`0 0 8px rgba(239, 68, 68, 0.5)`:`0 0 8px rgba(59, 130, 246, 0.5)`};switch(e){case Z.Before:case Z.ForbidBefore:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case Z.After:case Z.ForbidAfter:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x+t.width-2}px, ${t.y}px, 0)`});break;case Z.Upper:case Z.ForbidUpper:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case Z.Under:case Z.ForbidUnder:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y+t.height-2}px, 0)`});break;case Z.Inner:case Z.InnerBefore:case Z.InnerAfter:case Z.ForbidInner:case Z.ForbidInnerBefore:case Z.ForbidInnerAfter:Object.assign(i,{width:`${t.width}px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`,backgroundColor:`transparent`,border:r?`2px dashed #ef4444`:`2px dashed #3b82f6`});break;case Z.Forbid:return{display:`none`};default:return{display:`none`}}return i});return(e,t)=>O(n).draggable?(v(),i(`div`,{key:0,class:`insertion-indicator`,style:g(a.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-9dbef644`]]),ke=Q(c({__name:`SelectionBox`,setup(e){let n=ye(Y().selectedNodeId),o=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:4,visibility:`hidden`};return n.value&&(e.transform=`perspective(1px) translate3d(${n.value.x-2}px, ${n.value.y-2}px, 0)`,e.width=`${n.value.width+4}px`,e.height=`${n.value.height+4}px`,e.visibility=`visible`),e}),s=t(()=>n.value!==null);return(e,t)=>s.value?(v(),i(`div`,{key:0,class:`selection-box`,style:g(o.value)},[...t[0]||=[a(`div`,{class:`selection-box-inner`},null,-1)]],4)):r(``,!0)}}),[[`__scopeId`,`data-v-c58abee5`]]);const Ae={class:`aux-tool-widget`};var je=Q(c({__name:`AuxToolWidget`,setup(e){return(e,t)=>(v(),i(`div`,Ae,[s(De),s(ke),s(Oe)]))}}),[[`__scopeId`,`data-v-2d0e316d`]]);function Me(e,t){let n={...e?.[`x-component-props`]||{}};return t.basicSetter&&Object.entries(t.basicSetter).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=P(e,i);r!==void 0&&(n[t]=r)}}),t.componentSetter?.properties&&Object.entries(t.componentSetter.properties).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=P(e,i);r!==void 0&&(n[t]=r)}}),n}function Ne(e){if(e?.[`x-droppable`]===!1)return!1;let t=e.type;return(t===`object`||t===`void`||t===`array`)&&!!e.properties}function Pe(e){return e.type===`array`&&!!e.items}const Fe=[`data-node-id`,`draggable`],Ie={key:0,class:`empty-container-placeholder`},Le={key:0,class:`empty-container-placeholder`};var Re=Q(c({name:`CanvasField`,__name:`index`,props:{schema:{},fieldName:{},nodePath:{}},setup(o){let s=o,c=u(me)??{},l=Y(),d=t(()=>s.schema?.[`x-component`]),p=t(()=>s.nodePath?s.fieldName?s.nodePath?`${s.nodePath}.${s.fieldName}`:s.fieldName:s.nodePath:s.fieldName||``),g=t(()=>l.selectedNodeId.value===p.value),_=t(()=>!l.draggable||!s.fieldName?!1:g.value);function y(){return s.schema?.type===`array`?p.value?`${p.value}.items`:``:p.value?`${p.value}.properties`:``}let b=t(()=>{let e=s.schema;if(!e||e[`x-droppable`]===!1)return!1;let t=e.type===`object`||e.type===`void`,n=!e.properties||Object.keys(e.properties).length===0;return t&&n});function S(e){if(!_.value||!e.dataTransfer)return;let t={type:`move-component`,nodePath:p.value,fieldName:s.fieldName,schema:s.schema};e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`application/json`,JSON.stringify(t)),l.startDrag([{nodePath:p.value,fieldName:s.fieldName||``,schema:s.schema}])}function T(){l.cancelDrag()}return(t,o)=>{let l=C(`CanvasField`);return s.schema?(v(),i(`div`,{key:0,"data-node-id":p.value,class:m({"is-draggable":_.value,"is-selected":g.value}),draggable:_.value,onDragstart:S,onDragend:T},[d.value&&O(c)[d.value]?(v(),n(w(O(c)[d.value].component),h(f({key:0},O(Me)(s.schema,O(c)[d.value].setterSchema))),{default:A(()=>[b.value?(v(),i(`div`,Ie,[...o[0]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),O(Pe)(s.schema)?(v(),n(l,{key:1,schema:s.schema.items,"node-path":`${y()}`},null,8,[`schema`,`node-path`])):r(``,!0),O(Ne)(s.schema)?(v(!0),i(e,{key:2},x(Object.keys(s.schema?.properties||{}),e=>(v(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128)):r(``,!0)]),_:1},16)):(v(),i(e,{key:1},[b.value?(v(),i(`div`,Le,[...o[1]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),(v(!0),i(e,null,x(Object.keys(s.schema?.properties||{}),e=>(v(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128))],64))],42,Fe)):r(``,!0)}}}),[[`__scopeId`,`data-v-18008a74`]]);const ze={class:`canvas djd-design`};var Be=Q(c({__name:`canvas`,props:{components:{}},setup(e){y(me,e.components);let o=Y(),c=b(!1),l=t(()=>{let e=o.formSchema.value?.properties;return!e||Object.keys(e).length===0});function u(e){let t=e.target.closest(`[data-node-id]`);if(t){let e=t.getAttribute(`data-node-id`);e&&(console.log(e),o.selectNode(e))}else o.selectNode(null)}function d(e){let t=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`);if(o.setHover(t||null),o.isDragging.value){let n={x:e.clientX,y:e.clientY};o.updateDragPosition(n,t||void 0)}}function f(){o.setHover(null)}function p(e){if(!o.draggable||(e.preventDefault(),e.stopPropagation(),!e.dataTransfer))return;let t=o.dragNodes.value.length>0;e.dataTransfer.dropEffect=t?`move`:`copy`,c.value=!0,o.isDragging.value||o.startDrag([]);let n=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`),r={x:e.clientX,y:e.clientY};o.updateDragPosition(r,n||void 0)}function h(e){e.target.classList.contains(`canvas-content`)&&(c.value=!1)}function g(e){if(o.draggable&&(console.log(`[Canvas] handleDrop`),e.preventDefault(),e.stopPropagation(),c.value=!1,e.dataTransfer))try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);console.log(`dragData`,n),n.type===`new-component`?_(n):n.type===`move-component`&&x()}catch(e){console.error(`解析拖拽数据失败:`,e)}}function _(e){let{componentKey:t,defaultSchema:n}=e;if(!n){console.warn(`组件缺少 defaultSchema:`,t);return}let r=`f_${M()}`,i=o.closestNode.value,a=o.closestPosition.value;i?o.insertField(i,r,n,a):o.addField(r,n),o.selectNode(r),o.cancelDrag()}function x(){o.drop()}return(e,t)=>(v(),i(`div`,ze,[a(`div`,{class:m([`canvas-content`,{"drag-over":c.value,empty:l.value}]),onClick:u,onMousemove:d,onMouseleave:f,onDragover:p,onDragleave:h,onDrop:g},[O(o).formSchema.value?(v(),n(Re,{key:0,schema:O(o).formSchema.value},null,8,[`schema`])):r(``,!0),s(je)],34)]))}}),[[`__scopeId`,`data-v-b174a160`]]);function Ve(e,t){let n=t.getSelectedField();return ae({values:n?Te(n,e):{},effects(){oe(n=>{let r=t.getSelectedField(),i=t.selectedFieldName.value;if(!r||!i)return;let a=Ee(n.values,e,r);t.updateFieldSchema(i,a)})}})}function He(){return{source:``,property:`value`,name:``,type:`any`}}function Ue(e){return!e?.dependencies||!Array.isArray(e.dependencies)?[]:e.dependencies.map(e=>({source:e?.source||``,property:e?.property||`value`,name:e?.name||``,type:e?.type||`any`}))}function We(e){return e?.fulfill?.state?Object.entries(e.fulfill.state).map(([e,t])=>({state:e,expression:String(t).replace(/^\{\{|\}\}$/g,``).trim()})):[]}function Ge(){let e=b([]),t=b([]);function n(n){e.value=Ue(n),t.value=We(n)}function r(){e.value.push(He())}function i(t){e.value.splice(t,1)}function a(e){!e.name&&e.source&&(e.name=`${e.source.split(`.`).pop()||e.source}_${e.property}`)}function o(){t.value.push({state:`visible`,expression:``})}function s(e){t.value.splice(e,1)}function c(){let n={};return e.value.length>0&&(n.dependencies=e.value.filter(e=>e.source).map(e=>({source:e.source,property:e.property,name:e.name,type:e.type}))),t.value.length>0&&(n.fulfill={state:{}},t.value.forEach(e=>{e.state&&e.expression&&(n.fulfill.state[e.state]=`{{${e.expression}}}`)})),n}return{dependencies:e,stateRules:t,loadAdvancedConfig:n,addDependency:r,removeDependency:i,handleFieldChange:a,addStateRule:o,removeStateRule:s,buildAdvancedReactions:c}}function Ke(e,t){let n=t.split(`.`),r=e;for(let e of n){if(!r)return;if(!(e===`properties`&&r.properties))if(e===`items`&&r.items)r=r.items;else if(r.properties&&r.properties[e])r=r.properties[e];else return}return r}function qe(e,t){let n=t.split(`.`),r=``,i=``,a=0;for(let t=0;t<n.length;t++){let o=n[t];r=r?`${r}.${o}`:o;let s=Ke(e,r);s?.type===`array`&&s.items&&(i=`${r}.items.properties`,a=n.length-t-1,n[t+1]===`items`&&t++,n[t+1]===`properties`&&t++)}return i?{scopePath:i,depth:a}:null}function Je(e,t,n=``){if(!e)return[];let r=[];return Object.entries(e).forEach(([e,i])=>{let a=n?`${n}.${e}`:e,o=i.title||e;if(t&&(a===t||a.startsWith(`${t}.`))||i.type===`array`)return;let s=i.type===`object`||i.type===`void`,c={value:a,label:`${o} (${e})`,disabled:s,children:void 0};if(i.properties){let e=Je(i.properties,t,a);e.length>0&&(c.children=e)}r.push(c)}),r}function Ye(e,t,n,r=``){if(!e)return[];let i=[];return Object.entries(e).forEach(([e,a])=>{let o=r?`${r}.${e}`:e,s=a.title||e;if(t&&(o===t||o.startsWith(`${t}.`)))return;let c=`${n}${o}`,l=a.type===`object`||a.type===`void`,u={value:c,label:`${s} (${e})`,disabled:l,children:void 0};if(a.properties){let e=Ye(a.properties,t,n,o);e.length>0&&(u.children=e)}i.push(u)}),i}function Xe(e,t,n=``){if(!e)return[];let r=[];return Object.entries(e).forEach(([e,i])=>{let a=n?`${n}.${e}`:e,o=i.title||e;if(t&&(a===t||a.startsWith(`${t}.`)))return;let s={value:a,label:`${o} (${e})`,children:void 0};if(i.properties){let e=Xe(i.properties,t,a);e.length>0&&(s.children=e)}r.push(s)}),r}function Ze(e,n,r){return{fieldTree:t(()=>{let t=O(e),i=O(n),a=O(r)||{};if(!t)return[];if(a.isArrayMode&&i){let e=qe(t,i);if(e){let n=Ke(t,e.scopePath);if(n){let t=`${e.scopePath}.`,r=i.startsWith(t)?i.slice(t.length):i,a=Math.ceil(r.split(`.`).length/2);console.log(`depth`,a,r);let o=`${`.`.repeat(a)}.[].`;return Ye(n.properties,r,o)}}return[]}return a.filterArrayFields?Je(t.properties,i):Xe(t.properties,i)}),isInArray:t(()=>O(n)?.includes(`.items.properties.`))}}function Qe(e){return String(e??``).replace(/^\{\{|\}\}$/g,``).trim()}function $e(e){let t=e.trim();for(;t.startsWith(`(`)&&t.endsWith(`)`);){let e=0,n=!0;for(let r=0;r<t.length;r++)if(t[r]===`(`?e++:t[r]===`)`&&e--,e===0&&r<t.length-1){n=!1;break}if(n)t=t.slice(1,-1).trim();else break}return t}function $(e){let t=e.trim().replace(/^\(|\)$/g,``).trim();try{let e=JSON.parse(t);return typeof e==`string`?e:String(e)}catch{return t.replace(/^['"]|['"]$/g,``)}}function et(e,t){let n=$e(e),r=n.match(/^\$deps\.([a-zA-Z0-9_]+)\s*===\s*(.+)$/);if(r){let[,e,n]=r,i=t.get(e);return i?{field:i,operator:`eq`,value:$(n)}:null}let i=n.match(/^\$deps\.([a-zA-Z0-9_]+)\s*!==\s*(.+)$/);if(i){let[,e,n]=i,r=t.get(e);return r?{field:r,operator:`neq`,value:$(n)}:null}let a=n.match(/^Array\.isArray\(\s*\$deps\.([a-zA-Z0-9_]+)\s*\)\s*&&\s*\$deps\.\1\.includes\((.+)\)$/);if(a){let[,e,n]=a,r=t.get(e);return r?{field:r,operator:`includes`,value:$(n)}:null}let o=n.match(/^Array\.isArray\(\s*\$deps\.([a-zA-Z0-9_]+)\s*\)\s*&&\s*!\s*\$deps\.\1\.includes\((.+)\)$/);if(o){let[,e,n]=o,r=t.get(e);return r?{field:r,operator:`notIncludes`,value:$(n)}:null}return null}function tt(e){let t=[],n=0,r=``,i=0;for(;i<e.length;){let a=e[i];if(a===`(`?n++:a===`)`&&(n=Math.max(0,n-1)),n===0){let n=e.slice(i,i+2);if(n===`&&`||n===`||`){t.push({expression:r.trim(),connector:n}),r=``,i+=2;continue}}r+=a,i++}return r.trim()&&t.push({expression:r.trim()}),t}function nt(e){if(!e?.fulfill?.state?.visible||!Array.isArray(e.dependencies))return null;let t=Qe(e.fulfill.state.visible);if(!t)return null;let n=new Map;if(e.dependencies.forEach(e=>{e?.name&&e?.source&&e?.property===`value`&&n.set(e.name,e.source)}),n.size===0)return null;let r=et(t,n);if(r)return[{...r,connector:void 0}];let i=tt(t);if(!i.length)return null;let a=[];for(let e=0;e<i.length;e++){let t=i[e],r=et(t.expression,n);if(!r)return null;a.push({...r,connector:t.connector?t.connector===`||`?`or`:`and`:void 0})}return a.length&&(a[a.length-1].connector=void 0),a.length?a:null}function rt(e){let t=(e??``).toString().trim();if(!t)return``;try{return JSON.parse(t)}catch{return t.replace(/^['"]|['"]$/g,``)}}function it(e){let t=rt(e);return JSON.stringify(t)}function at(e,t,n){if(t.has(e))return t.get(e);let r=`${e.split(`.`).pop()||e}_value`,i=r,a=1;for(;n.has(i);)i=`${r}_${a}`,a++;return t.set(e,i),n.add(i),i}function ot(e){let t=e.map((t,n)=>({...t,connector:n<e.length-1?t.connector||`and`:void 0})).filter(e=>e.field&&e.value!==``);if(!t.length)return null;let n=[],r=new Map,i=new Set,a=[];return t.forEach(e=>{let t=at(e.field,r,i);n.find(n=>n.source===e.field&&n.name===t)||n.push({source:e.field,property:`value`,name:t,type:`any`});let o=`$deps.${t}`,s=it(e.value),c=``;switch(e.operator){case`eq`:c=`${o} === ${s}`;break;case`neq`:c=`${o} !== ${s}`;break;case`includes`:c=`Array.isArray(${o}) && ${o}.includes(${s})`;break;case`notIncludes`:c=`Array.isArray(${o}) && !${o}.includes(${s})`;break}a.push(`(${c})`)}),{dependencies:n,fulfill:{state:{visible:`{{${a.reduce((e,n,r)=>r===0?n:`${e} ${t[r-1].connector===`or`?`||`:`&&`} ${n}`,``)}}}`}}}}function st(e){return e.includes(`[]`)||e.startsWith(`.`)}function ct(){return{field:``,operator:`eq`,value:``,connector:void 0,isArrayMode:!1}}function lt(){let e=b([ct()]);function t(){e.value=[ct()]}function n(){if(e.value.length>0){let t=e.value[e.value.length-1];t.connector||=`and`}e.value.push(ct())}function r(n){if(e.value.splice(n,1),!e.value.length){t();return}n>0&&n===e.value.length&&(e.value[n-1].connector=void 0)}function i(n){let r=nt(n);return r?(e.value=r.map(e=>({...e,isArrayMode:st(e.field)})),!0):(t(),!1)}return{simpleConditions:e,addSimpleCondition:n,removeSimpleCondition:r,resetSimpleConditions:t,loadSimpleConditions:i,buildSimpleReactions:()=>ot(e.value)}}const ut=[{label:`显示/隐藏 (visible)`,value:`visible`},{label:`禁用 (disabled)`,value:`disabled`},{label:`只读 (readOnly)`,value:`readOnly`},{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`必填 (required)`,value:`required`},{label:`标题 (title)`,value:`title`},{label:`描述 (description)`,value:`description`}],dt=[{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`初始值 (initialValue)`,value:`initialValue`},{label:`错误信息 (errors)`,value:`errors`},{label:`验证状态 (valid)`,value:`valid`}],ft=[{label:`任意类型 (any)`,value:`any`},{label:`字符串 (string)`,value:`string`},{label:`数字 (number)`,value:`number`},{label:`布尔值 (boolean)`,value:`boolean`},{label:`数组 (array)`,value:`array`},{label:`对象 (object)`,value:`object`}],pt=[{label:`等于`,value:`eq`},{label:`不等于`,value:`neq`},{label:`包含`,value:`includes`},{label:`不包含`,value:`notIncludes`}],mt={class:`reactions-editor`},ht={class:`section`},gt={class:`section-header`},_t={key:0,class:`empty-tip`},vt={key:1,class:`simple-condition-list`},yt={class:`simple-condition-item`},bt={class:`simple-condition-header`},xt={class:`simple-condition-index`},St={class:`field-select-row`},Ct={class:`array-mode-switch`},wt={key:0,class:`simple-connector`},Tt={class:`section`},Et={class:`section-header`},Dt={key:0,class:`empty-tip`},Ot={key:1,class:`dependency-list`},kt={class:`dependency-header`},At={class:`dependency-index`},jt={class:`section`},Mt={class:`section-header`},Nt={key:0,class:`empty-tip`},Pt={key:1,class:`state-rule-list`},Ft={class:`state-rule-header`},It={class:`state-rule-index`};var Lt=Q(c({__name:`ReactionsEditor`,props:{modelValue:{type:Boolean},schema:{},currentFieldName:{},initialReactions:{}},emits:[`update:modelValue`,`save`],setup(c,{emit:l}){let u=c,d=l,f=t({get:()=>u.modelValue,set:e=>d(`update:modelValue`,e)}),p=b(`simple`),m=t(()=>({filterArrayFields:!0})),{fieldTree:h,isInArray:g}=Ze(D(u,`schema`),D(u,`currentFieldName`),m),_=t(()=>({isArrayMode:!0})),{fieldTree:y}=Ze(D(u,`schema`),D(u,`currentFieldName`),_);function S(e){return e?y.value:h.value}function w(e){e.field=``}let{dependencies:T,stateRules:k,loadAdvancedConfig:j,addDependency:M,removeDependency:N,handleFieldChange:P,addStateRule:F,removeStateRule:I,buildAdvancedReactions:L}=Ge(),{simpleConditions:R,addSimpleCondition:z,removeSimpleCondition:B,resetSimpleConditions:V,loadSimpleConditions:H,buildSimpleReactions:U}=lt();function W(){let e=u.initialReactions;if(j(e),!e){V(),p.value=`simple`;return}p.value=H(e)?`simple`:`advanced`}function ee(){W()}function G(){d(`save`,(p.value===`simple`?U():L())||{}),f.value=!1}function te(){f.value=!1}return(t,c)=>{let l=C(`ElButton`),u=C(`ElTreeSelect`),d=C(`ElSwitch`),m=C(`ElTooltip`),_=C(`ElFormItem`),y=C(`ElOption`),b=C(`ElSelect`),D=C(`ElInput`),j=C(`ElForm`),L=C(`ElRadioButton`),V=C(`ElRadioGroup`),H=C(`ElTabPane`),U=C(`ElTabs`),W=C(`ElDialog`);return v(),n(W,{modelValue:f.value,"onUpdate:modelValue":c[1]||=e=>f.value=e,title:`条件渲染配置`,width:`800px`,onOpen:ee},{footer:A(()=>[s(l,{onClick:te},{default:A(()=>[...c[15]||=[o(` 取消 `,-1)]]),_:1}),s(l,{type:`primary`,onClick:G},{default:A(()=>[...c[16]||=[o(` 保存 `,-1)]]),_:1})]),default:A(()=>[a(`div`,mt,[s(U,{modelValue:p.value,"onUpdate:modelValue":c[0]||=e=>p.value=e},{default:A(()=>[s(H,{label:`简单配置`,name:`simple`},{default:A(()=>[a(`div`,ht,[a(`div`,gt,[c[3]||=a(`span`,{class:`section-title`},`条件组合`,-1),s(l,{size:`small`,type:`primary`,onClick:O(z)},{default:A(()=>[...c[2]||=[o(` 添加条件 `,-1)]]),_:1},8,[`onClick`])]),O(R).length===0?(v(),i(`div`,_t,` 暂无条件,点击"添加条件"按钮添加 `)):(v(),i(`div`,vt,[(v(!0),i(e,null,x(O(R),(t,f)=>(v(),i(e,{key:f},[a(`div`,yt,[a(`div`,bt,[a(`span`,xt,`条件 `+E(f+1),1),s(l,{size:`small`,type:`danger`,text:``,onClick:e=>O(B)(f)},{default:A(()=>[...c[4]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(j,{"label-width":`80px`},{default:A(()=>[s(_,{label:`字段`},{default:A(()=>[a(`div`,St,[s(u,{modelValue:t.field,"onUpdate:modelValue":e=>t.field=e,data:S(t.isArrayMode),placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1,class:`field-select`},null,8,[`modelValue`,`onUpdate:modelValue`,`data`]),O(g)?(v(),n(m,{key:0,content:`开启后可选择当前数组内的字段(相对路径)`,placement:`top`},{default:A(()=>[a(`div`,Ct,[c[5]||=a(`span`,{class:`array-mode-label`},`数组内`,-1),s(d,{modelValue:t.isArrayMode,"onUpdate:modelValue":e=>t.isArrayMode=e,size:`small`,onChange:e=>w(t)},null,8,[`modelValue`,`onUpdate:modelValue`,`onChange`])])]),_:2},1024)):r(``,!0)])]),_:2},1024),s(_,{label:`操作`},{default:A(()=>[s(b,{modelValue:t.operator,"onUpdate:modelValue":e=>t.operator=e,placeholder:`选择操作`},{default:A(()=>[(v(!0),i(e,null,x(O(pt),e=>(v(),n(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(_,{label:`值`},{default:A(()=>[s(D,{modelValue:t.value,"onUpdate:modelValue":e=>t.value=e,placeholder:`输入匹配值`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]),f<O(R).length-1?(v(),i(`div`,wt,[s(V,{modelValue:t.connector,"onUpdate:modelValue":e=>t.connector=e,size:`small`},{default:A(()=>[s(L,{label:`and`},{default:A(()=>[...c[6]||=[o(` 与 `,-1)]]),_:1}),s(L,{label:`or`},{default:A(()=>[...c[7]||=[o(` 或 `,-1)]]),_:1})]),_:1},8,[`modelValue`,`onUpdate:modelValue`])])):r(``,!0)],64))),128))]))])]),_:1}),s(H,{label:`高级配置`,name:`advanced`},{default:A(()=>[a(`div`,Tt,[a(`div`,Et,[c[9]||=a(`span`,{class:`section-title`},`依赖字段`,-1),s(l,{size:`small`,type:`primary`,onClick:O(M)},{default:A(()=>[...c[8]||=[o(` 添加依赖 `,-1)]]),_:1},8,[`onClick`])]),O(T).length===0?(v(),i(`div`,Dt,` 暂无依赖字段,点击"添加依赖"按钮添加 `)):(v(),i(`div`,Ot,[(v(!0),i(e,null,x(O(T),(t,r)=>(v(),i(`div`,{key:r,class:`dependency-item`},[a(`div`,kt,[a(`span`,At,`依赖 `+E(r+1),1),s(l,{size:`small`,type:`danger`,text:``,onClick:e=>O(N)(r)},{default:A(()=>[...c[10]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(j,{"label-width":`80px`},{default:A(()=>[s(_,{label:`字段`},{default:A(()=>[s(u,{modelValue:t.source,"onUpdate:modelValue":e=>t.source=e,data:O(h),placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1,onChange:e=>O(P)(t)},null,8,[`modelValue`,`onUpdate:modelValue`,`data`,`onChange`])]),_:2},1024),s(_,{label:`属性`},{default:A(()=>[s(b,{modelValue:t.property,"onUpdate:modelValue":e=>t.property=e,placeholder:`选择属性`,onChange:e=>O(P)(t)},{default:A(()=>[(v(!0),i(e,null,x(O(dt),e=>(v(),n(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`,`onChange`])]),_:2},1024),s(_,{label:`变量名`},{default:A(()=>[s(D,{modelValue:t.name,"onUpdate:modelValue":e=>t.name=e,placeholder:`在表达式中使用的变量名`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(_,{label:`类型`},{default:A(()=>[s(b,{modelValue:t.type,"onUpdate:modelValue":e=>t.type=e,placeholder:`选择类型`},{default:A(()=>[(v(!0),i(e,null,x(O(ft),e=>(v(),n(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]))),128))]))]),a(`div`,jt,[a(`div`,Mt,[c[12]||=a(`span`,{class:`section-title`},`状态控制`,-1),s(l,{size:`small`,type:`primary`,onClick:O(F)},{default:A(()=>[...c[11]||=[o(` 添加规则 `,-1)]]),_:1},8,[`onClick`])]),O(k).length===0?(v(),i(`div`,Nt,` 暂无状态规则,点击"添加规则"按钮添加 `)):(v(),i(`div`,Pt,[(v(!0),i(e,null,x(O(k),(t,r)=>(v(),i(`div`,{key:r,class:`state-rule-item`},[a(`div`,Ft,[a(`span`,It,`规则 `+E(r+1),1),s(l,{size:`small`,type:`danger`,text:``,onClick:e=>O(I)(r)},{default:A(()=>[...c[13]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(j,{"label-width":`80px`},{default:A(()=>[s(_,{label:`状态属性`},{default:A(()=>[s(b,{modelValue:t.state,"onUpdate:modelValue":e=>t.state=e,placeholder:`选择要控制的状态`},{default:A(()=>[(v(!0),i(e,null,x(O(ut),e=>(v(),n(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`]))),128))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(_,{label:`表达式`},{default:A(()=>[s(D,{modelValue:t.expression,"onUpdate:modelValue":e=>t.expression=e,type:`textarea`,rows:2,placeholder:`输入 JS 表达式,如:$deps.username_value === '123'`},null,8,[`modelValue`,`onUpdate:modelValue`]),c[14]||=a(`div`,{class:`expression-tip`},` 使用 $deps.变量名 访问依赖字段的值 `,-1)]),_:2},1024)]),_:2},1024)]))),128))]))])]),_:1})]),_:1},8,[`modelValue`])])]),_:1},8,[`modelValue`])}}}),[[`__scopeId`,`data-v-6b415c60`]]);const Rt={class:`config-panel`},zt={key:0,class:`config-empty`},Bt={key:1,class:`config-content`},Vt={class:`config-title`};var Ht=Q(c({__name:`index`,props:{components:{}},setup(e){let c=e,l=Y(),{SchemaField:u}=ne({components:{FormItem:z,Input:B,InputNumber:V,Checkbox:R,Radio:H,Switch:ee,Select:U,Space:W,ArrayItems:L}}),d=T(null),f=t(()=>l.getSelectedField()),p=t(()=>f.value?f.value[`x-component`]:null),m=t(()=>{let e=p.value;return e?c.components[e]?.setterSchema:null}),h=t(()=>{if(!m.value)return null;let e=m.value.basicSetter;return!e||Object.keys(e).length===0?null:{type:`object`,properties:e}}),g=t(()=>{if(!m.value)return null;let e=m.value.componentSetter;return!e||!e.properties||Object.keys(e.properties).length===0?null:e}),_=t(()=>{if(!m.value)return null;let e=m.value.basicSetter||{},t=m.value.componentSetter?.properties||{};return{type:`object`,properties:{...e,...t}}});k(()=>l.selectedFieldName.value,()=>{f.value&&_.value?d.value=Ve(_.value,l):d.value=null},{immediate:!0});let y=T([`base`,`operate`,`component`]),x=t(()=>l.selectedFieldName.value||`empty`),S=b(!1);function w(){S.value=!0}function D(e){let t=l.selectedFieldName.value;if(!t)return;let n=l.getSelectedField();if(!n)return;let r={...n,"x-reactions":Object.keys(e).length>0?e:void 0};l.updateFieldSchema(t,r)}return(e,t)=>{let c=C(`ElCollapseItem`),m=C(`ElButton`),_=C(`ElCollapse`);return v(),i(`div`,Rt,[f.value?(v(),i(`div`,Bt,[a(`h3`,Vt,E(p.value)+` 配置 `,1),d.value?(v(),n(O(G),{key:x.value,form:d.value},{default:A(()=>[s(_,{modelValue:y.value,"onUpdate:modelValue":t[0]||=e=>y.value=e,class:`config-section`},{default:A(()=>[h.value?(v(),n(c,{key:0,name:`base`,title:`基本配置`},{default:A(()=>[s(O(u),{schema:h.value},null,8,[`schema`])]),_:1})):r(``,!0),s(c,{name:`operate`,title:`操作配置`},{default:A(()=>[a(`div`,null,[s(m,{type:`primary`,onClick:w},{default:A(()=>[...t[3]||=[o(` 条件渲染 `,-1)]]),_:1})])]),_:1}),g.value?(v(),n(c,{key:1,name:`component`,title:`组件配置`},{default:A(()=>[s(O(u),{schema:g.value},null,8,[`schema`])]),_:1})):r(``,!0)]),_:1},8,[`modelValue`])]),_:1},8,[`form`])):r(``,!0),s(O(Lt),{modelValue:S.value,"onUpdate:modelValue":t[1]||=e=>S.value=e,schema:O(l).formSchema.value,"current-field-name":O(l).selectedFieldName.value,"initial-reactions":f.value?.[`x-reactions`],onSave:D},null,8,[`modelValue`,`schema`,`current-field-name`,`initial-reactions`])])):(v(),i(`div`,zt,[...t[2]||=[a(`p`,null,`请选择一个字段`,-1)]]))])}}}),[[`__scopeId`,`data-v-66ec4854`]]);const Ut={class:`material-panel`},Wt={class:`panel-content`},Gt={class:`category-title`},Kt={class:`component-grid`},qt=[`onClick`,`onDragstart`],Jt={class:`component-icon`},Yt={class:`component-name`},Xt={key:0,class:`component-desc`};var Zt=Q(c({__name:`materialPanel`,props:{components:{}},setup(n){let o=n,s=u(_e,null),c=t(()=>{let e={};return Object.entries(o.components).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e});function l(e,t,n){if(!e.dataTransfer)return;let r={type:`new-component`,componentKey:t,componentName:n.config.name,defaultSchema:n.defaultSchema};e.dataTransfer.effectAllowed=`copy`,e.dataTransfer.setData(`application/json`,JSON.stringify(r));let i=e.target;e.dataTransfer.setDragImage(i,10,10),setTimeout(()=>{s?.switchToTreeTab()},100)}function d(e){let t=e.target;t.style.opacity=`1`}function f(e){console.log(`点击组件:`,e)}return(t,n)=>(v(),i(`div`,Ut,[n[0]||=a(`div`,{class:`panel-header`},[a(`h3`,null,`组件库`)],-1),a(`div`,Wt,[(v(!0),i(e,null,x(c.value,(t,n)=>(v(),i(`div`,{key:n,class:`category-group`},[a(`div`,Gt,E(n),1),a(`div`,Kt,[(v(!0),i(e,null,x(t,({key:e,component:t})=>(v(),i(`div`,{key:e,class:`component-item`,draggable:`true`,onClick:t=>f(e),onDragstart:n=>l(n,e,t),onDragend:d},[a(`div`,Jt,E(t.config?.icon?.slice(0,3)),1),a(`div`,Yt,E(t.config?.name||e),1),t.config?.description?(v(),i(`div`,Xt,E(t.config.description),1)):r(``,!0)],40,qt))),128))])]))),128))])]))}}),[[`__scopeId`,`data-v-93609a69`]]);const Qt={key:0,class:`clipboard-paste-section`},$t={class:`component-picker-content`},en={class:`picker-category-title`},tn={class:`picker-component-grid`},nn=[`onClick`],rn={class:`picker-component-icon`},an={class:`picker-component-name`};var on=Q(c({__name:`ComponentPicker`,props:{visible:{type:Boolean},groupedComponents:{}},emits:[`update:visible`,`select`,`pasteSchema`],setup(t,{emit:c}){let l=t,u=c,d=b(null);async function f(){d.value=null;try{let e=await navigator.clipboard.readText();if(!e)return;let t=JSON.parse(e);t&&typeof t==`object`&&t[`x-component`]&&(d.value=t)}catch{}}function p(){d.value&&(u(`pasteSchema`,d.value),u(`update:visible`,!1))}return k(()=>l.visible,e=>{e&&f()}),(t,c)=>{let f=C(`ElButton`),m=C(`ElDialog`);return v(),n(m,{"model-value":l.visible,title:`选择组件`,width:`600px`,"close-on-click-modal":!1,"onUpdate:modelValue":c[0]||=e=>u(`update:visible`,e)},{default:A(()=>[d.value?(v(),i(`div`,Qt,[s(f,{type:`primary`,onClick:p},{default:A(()=>[o(` 从剪切板粘贴 (`+E(d.value[`x-component`])+`) `,1)]),_:1})])):r(``,!0),a(`div`,$t,[(v(!0),i(e,null,x(l.groupedComponents,(t,n)=>(v(),i(`div`,{key:n,class:`picker-category-group`},[a(`div`,en,E(n),1),a(`div`,tn,[(v(!0),i(e,null,x(t,({key:e,component:t})=>(v(),i(`div`,{key:e,class:`picker-component-item`,onClick:n=>u(`select`,e,t)},[a(`div`,rn,E(t.config?.icon?.slice(0,3)),1),a(`div`,an,E(t.config?.name||e),1)],8,nn))),128))])]))),128))])]),_:1},8,[`model-value`])}}}),[[`__scopeId`,`data-v-2f266708`]]);const sn={class:`context-menu`},cn={key:0,class:`menu-divider`},ln=[`onClick`];var un=Q(c({__name:`ContextMenu`,props:{visible:{type:Boolean},virtualRef:{},menuItems:{}},emits:[`update:visible`,`select`],setup(t,{emit:r}){let o=t,c=r;return(t,r)=>{let l=C(`ElIcon`),u=C(`ElPopover`);return v(),n(u,{visible:o.visible,"virtual-ref":o.virtualRef,"virtual-triggering":``,"show-arrow":!1,"popper-class":`schema-tree-context-menu`,placement:`bottom-start`,offset:6,"onUpdate:visible":r[0]||=e=>c(`update:visible`,e)},{default:A(()=>[a(`div`,sn,[(v(!0),i(e,null,x(o.menuItems,(t,r)=>(v(),i(e,{key:r},[t===`divider`?(v(),i(`div`,cn)):(v(),i(`div`,{key:1,class:`menu-item`,onClick:e=>c(`select`,t.type)},[s(l,null,{default:A(()=>[(v(),n(w(t.icon)))]),_:2},1024),a(`span`,null,E(t.label),1)],8,ln))],64))),128))])]),_:1},8,[`visible`,`virtual-ref`])}}}),[[`__scopeId`,`data-v-1ef29c4a`]]);function dn(){let e=b(!1),n=b(null),r=b(`node`),i=b(null),a=b(null),o=t(()=>{if(r.value===`empty`)return[{type:`insertRoot`,label:`插入组件`,icon:q}];let e=n.value;if(!e)return[];let t=[{type:`copy`,label:`复制`,icon:ce},{type:`copyTemplate`,label:`复制模板`,icon:ce},{type:`delete`,label:`删除`,icon:le},`divider`,{type:`moveUp`,label:`上移`,icon:fe},{type:`moveDown`,label:`下移`,icon:se},`divider`,{type:`insertBefore`,label:`上方插入`,icon:q},{type:`insertAfter`,label:`下方插入`,icon:q}];return e.isContainer&&t.push({type:`insertInner`,label:`插入内部`,icon:ue}),t}),s=e=>{let t=new DOMRect(e.clientX,e.clientY,0,0);i.value={getBoundingClientRect:()=>t,contextElement:document.body}},c=()=>{a.value&&=(document.removeEventListener(`click`,a.value),null)},l=()=>{e.value=!1,c()},u=()=>{c();let e=()=>{l()};a.value=e,document.addEventListener(`click`,e)},d=(t,i,a)=>{t.preventDefault(),t.stopPropagation(),r.value=i,n.value=a,s(t),e.value=!0,setTimeout(()=>{u()},0)};return _(()=>{c()}),{contextMenuVisible:e,contextMenuNode:n,contextMenuMode:r,contextMenuVirtualRef:i,menuItems:o,handleEmptyContextMenu:e=>{d(e,`empty`,null)},handleNodeContextMenu:(e,t)=>{d(e,`node`,t)},closeContextMenu:l}}function fn(e){return JSON.parse(JSON.stringify(e))}function pn(e){return e.split(`.`).filter(e=>e!==`properties`&&e!==`items`)}function mn(e,t,n){let r=pn(t),i=[...r.slice(0,-1),n],a=new Map,o=(e,t,n)=>{let r=fn(e);if(a.set(t.join(`.`),n.join(`.`)),e.properties&&typeof e.properties==`object`){let i={};Object.entries(e.properties).forEach(([e,r])=>{let a=`f_${M()}`;i[a]=o(r,[...t,e],[...n,a])}),r.properties=i}return e.items&&typeof e.items==`object`&&(r.items=o(e.items,[...t,`items`],[...n,`items`])),r},s=e=>{if(a.has(e))return a.get(e)||null;for(let[t,n]of a.entries())if(e.startsWith(`${t}.`))return`${n}${e.slice(t.length)}`;return null},c=e=>{if(!e||typeof e!=`object`)return;let t=e[`x-reactions`];t&&Array.isArray(t.dependencies)&&(t.dependencies=t.dependencies.map(e=>{if(e&&typeof e.source==`string`){let t=s(e.source);if(t)return{...e,source:t}}return e}),e[`x-reactions`]=t),e.properties&&Object.values(e.properties).forEach(e=>c(e)),e.items&&c(e.items)},l=o(e,r,i);return c(l),l}function hn(e){return e[`x-droppable`]===!1?!1:!![`object`,`void`,`array`].includes(e.type)}function gn(e,t=``){let n=[];return!e||typeof e!=`object`?n:(e.properties&&typeof e.properties==`object`&&Object.entries(e.properties).forEach(([e,r])=>{let i=t?`${t}.properties.${e}`:e,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:hn(r),children:gn(r,i)};n.push(s)}),e.items?.properties&&Object.entries(e.items.properties).forEach(([e,r])=>{let i=`${t}.items.properties.${e}`,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:hn(r),children:gn(r,i)};n.push(s)}),n)}function _n(e){let t=[];return e.forEach(e=>{t.push(e.path),e.children&&e.children.length>0&&t.push(..._n(e.children))}),t}function vn(e,t){let n=t.getBoundingClientRect(),r=e.clientY-n.top,i=n.height*.2;return r<i?`before`:r>n.height-i?`after`:`inner`}function yn(e,t,n){let r=document.elementFromPoint(t,n)?.closest(`.el-tree-node`);if(!r)return null;let i=r.querySelector(`.el-tree-node__content`);if(!i)return null;let a=(e,t)=>{for(let n of e){if(n.path===t)return n;if(n.children){let e=a(n.children,t);if(e)return e}}return null},o=r.getAttribute(`data-path`)||i.getAttribute(`data-path`);if(o){let t=a(e,o);if(t)return{element:r,data:t}}let s=document.querySelectorAll(`.el-tree-node`),c=Array.from(s).indexOf(r);return c>=0&&c<e.length?{element:r,data:e[c]}:null}function bn(e){let{components:n,contextMenuNode:r,closeContextMenu:i,treeData:a,expandAll:o,store:s}=e,c=b(!1),l=b(null),u=t(()=>{let e={};return Object.entries(n||{}).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e}),d=(e,t,n)=>{let{defaultSchema:r}=e,i=`f_${M()}`,a;a=n===`inner`?Z.Inner:n===`before`?Z.Before:Z.After,s.insertField(t.path,i,r,a),p(()=>{let e;if(n===`inner`)e=s.getNodeSchema(t.path)?.type===`array`?`${t.path}.items.properties.${i}`:`${t.path}.properties.${i}`;else{let n=t.path.split(`.`).slice(0,-1).join(`.`);e=n?`${n}.${i}`:i}s.selectNode(e),o()})},f=e=>{let{defaultSchema:t}=e,n=`f_${M()}`;s.addField(n,t),s.selectNode(n),p(()=>{o()})},m=(e,t)=>{l.value={targetNode:e,position:t},c.value=!0},h=(e,t)=>{if(!l.value)return;let{targetNode:n,position:r}=l.value,i={componentKey:e,defaultSchema:JSON.parse(JSON.stringify(t.defaultSchema))};r===`root`?f(i):n&&d(i,n,r),c.value=!1,l.value=null},g=e=>{if(!l.value)return;let{targetNode:t,position:n}=l.value,r=mn(e,`paste`,`f_${M()}`),i={componentKey:e[`x-component`]||`Unknown`,defaultSchema:r};n===`root`?f(i):t&&d(i,t,n),c.value=!1,l.value=null},_=e=>{let t=e.split(`.`),n=t[t.length-1],r=t.includes(`items`)&&t.includes(`properties`),i=``;if(r){let e=t.lastIndexOf(`items`);i=t.slice(0,e).join(`.`)}else{let e=t.lastIndexOf(`properties`);e>0&&(i=t.slice(0,e).join(`.`))}let a,o;return i?(a=s.getNodeSchema(i),a&&(o=a.type===`array`?a.items?.properties:a.properties)):(a=s.formSchema.value,o=a.properties),{parentSchema:a,propertiesObj:o,fieldName:n}},v=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let{parentSchema:n,propertiesObj:a,fieldName:o}=_(e);if(!n||!a)return;let c=`f_${M()}`,l=mn(t,e,c),u=Object.entries(a),d=u.findIndex(([e])=>e===o),f=d>=0?d+1:u.length;u.splice(f,0,[c,l]);let p={};u.forEach(([e,t])=>{p[e]=t});let m=e.split(`.`);if(m.length===1)s.formSchema.value.properties=p;else{let e=m.includes(`items`),t;if(e){let e=m.lastIndexOf(`items`);t=`${m.slice(0,e).join(`.`)}.items.properties`}else{let e=m.lastIndexOf(`properties`);t=m.slice(0,e+1).join(`.`)}I(s.formSchema.value.properties,t,p)}i()},y=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let n=JSON.stringify(t);navigator.clipboard.writeText(n),i()},x=()=>{if(!r.value)return;let e=r.value.path;N(s.formSchema.value.properties,e),i()},S=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=_(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c<=0)return;let l=o[c];o[c]=o[c-1],o[c-1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}I(s.formSchema.value.properties,t,u)}i()},C=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=_(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c===-1||c>=o.length-1)return;let l=o[c];o[c]=o[c+1],o[c+1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}I(s.formSchema.value.properties,t,u)}i()};return{groupedComponents:u,componentPickerVisible:c,handleMenuClick:e=>{switch(e){case`insertRoot`:m(null,`root`);break;case`insertBefore`:m(r.value,`before`);break;case`insertAfter`:m(r.value,`after`);break;case`insertInner`:m(r.value,`inner`);break;case`copy`:v();return;case`copyTemplate`:y();return;case`delete`:x();return;case`moveUp`:S();return;case`moveDown`:C();return}i()},handleSelectComponent:h,handlePasteSchema:g,handleExternalDrop:e=>{if(e.preventDefault(),e.stopPropagation(),e.dataTransfer)try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);if(n.type!==`new-component`)return;let{componentKey:r,defaultSchema:i}=n;if(!i){console.warn(`组件缺少 defaultSchema:`,r);return}let o=yn(a.value,e.clientX,e.clientY);if(console.log(`targetNode`,o),o){let t=vn(e,o.element);d(n,o.data,t)}else f(n)}catch(e){console.error(`解析拖拽数据失败:`,e)}}}}function xn(e=Y()){let n=b(),r=b(``),i=t(()=>gn(e.formSchema.value));return{treeRef:n,filterText:r,treeData:i,treeProps:{children:`children`,label:`label`},filterNode:(e,t)=>e?t.label.toLowerCase().includes(e.toLowerCase()):!0,handleFilterChange:e=>{n.value?.filter(e)},expandAll:()=>{_n(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!0)})},collapseAll:()=>{_n(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!1)})},handleNodeClick:t=>{e.selectNode(t.path)},handleAllowDrag:e=>!0,handleAllowDrop:(e,t,n)=>{let r=t.data;return n===`inner`?r.isContainer:!0},handleNodeDrop:(t,n,r,i)=>{let a=t.data,o=n.data,s;s=r===`inner`?`INNER`:r===`before`?`BEFORE`:`AFTER`,e.moveField(a.path,o.path,s)}}}const Sn={class:`schema-tree`},Cn={class:`tree-toolbar`},wn={class:`toolbar-buttons`},Tn={class:`node-label`},En={class:`node-component`};var Dn=Q(c({__name:`SchemaTree`,setup(e){let t=Y(),n=u(`designerComponents`,{}),{treeRef:r,filterText:c,treeData:l,treeProps:f,filterNode:h,handleFilterChange:g,expandAll:_,collapseAll:y,handleNodeClick:b,handleAllowDrop:x,handleAllowDrag:S,handleNodeDrop:w}=xn(t),{contextMenuVisible:T,contextMenuNode:D,contextMenuVirtualRef:k,menuItems:M,handleEmptyContextMenu:N,handleNodeContextMenu:P,closeContextMenu:F}=dn(),{groupedComponents:I,componentPickerVisible:L,handleMenuClick:R,handleSelectComponent:z,handlePasteSchema:B,handleExternalDrop:V}=bn({store:t,components:n,contextMenuNode:D,closeContextMenu:F,treeData:l,expandAll:_});return p(()=>{_()}),(e,t)=>{let n=C(`ElIcon`),u=C(`ElInput`),p=C(`ElButton`),D=C(`ElEmpty`),F=C(`ElTree`);return v(),i(`div`,Sn,[a(`div`,Cn,[s(u,{modelValue:O(c),"onUpdate:modelValue":t[0]||=e=>d(c)?c.value=e:null,placeholder:`搜索组件`,clearable:``,size:`small`,onInput:O(g)},{prefix:A(()=>[s(n,null,{default:A(()=>[s(O(de))]),_:1})]),_:1},8,[`modelValue`,`onInput`]),a(`div`,wn,[s(p,{size:`small`,text:``,onClick:O(_)},{default:A(()=>[...t[7]||=[o(` 全部展开 `,-1)]]),_:1},8,[`onClick`]),s(p,{size:`small`,text:``,onClick:O(y)},{default:A(()=>[...t[8]||=[o(` 全部折叠 `,-1)]]),_:1},8,[`onClick`])])]),a(`div`,{class:`tree-content`,onDrop:t[2]||=(...e)=>O(V)&&O(V)(...e),onDragover:t[3]||=j(()=>{},[`prevent`]),onContextmenu:t[4]||=(...e)=>O(N)&&O(N)(...e)},[s(F,{ref_key:`treeRef`,ref:r,style:{height:`100%`},data:O(l),props:O(f),"node-key":`path`,draggable:``,"allow-drop":O(x),"allow-drag":O(S),"filter-node-method":(e,t)=>O(h)(e,t),"default-expand-all":``,"highlight-current":``,onNodeClick:O(b),onNodeDrop:O(w),onNodeContextmenu:t[1]||=(e,t)=>O(P)(e,t)},{default:A(({data:e})=>[a(`div`,{class:m([`tree-node`,{"is-container":e.isContainer}])},[a(`span`,Tn,E(e.label),1),a(`span`,En,`(`+E(e.component)+`)`,1)],2)]),empty:A(()=>[s(D,{description:`暂无组件,请点击右键插入`})]),_:1},8,[`data`,`props`,`allow-drop`,`allow-drag`,`filter-node-method`,`onNodeClick`,`onNodeDrop`])],32),s(un,{visible:O(T),"onUpdate:visible":t[5]||=e=>d(T)?T.value=e:null,"virtual-ref":O(k),"menu-items":O(M),onSelect:O(R)},null,8,[`visible`,`virtual-ref`,`menu-items`,`onSelect`]),s(on,{visible:O(L),"onUpdate:visible":t[6]||=e=>d(L)?L.value=e:null,"grouped-components":O(I),onSelect:O(z),onPasteSchema:O(B)},null,8,[`visible`,`grouped-components`,`onSelect`,`onPasteSchema`])])}}}),[[`__scopeId`,`data-v-c20e7234`]]);const On={class:`left-panel`};var kn=Q(c({__name:`index`,props:{components:{},draggable:{type:Boolean,default:!1}},setup(e){let t=e,r=b(`materials`);function a(){r.value!==`tree`&&(r.value=`tree`)}return y(_e,{switchToTreeTab:a}),(a,o)=>{let c=C(`ElTabPane`),l=C(`ElTabs`);return v(),i(`div`,On,[t.draggable?(v(),n(l,{key:0,modelValue:r.value,"onUpdate:modelValue":o[0]||=e=>r.value=e,class:`panel-tabs`},{default:A(()=>[s(c,{label:`组件库`,name:`materials`},{default:A(()=>[s(Zt,{components:e.components},null,8,[`components`])]),_:1}),s(c,{label:`组件树`,name:`tree`},{default:A(()=>[s(Dn)]),_:1})]),_:1},8,[`modelValue`])):(v(),n(Dn,{key:1}))])}}}),[[`__scopeId`,`data-v-7b552cf6`]]),An=c({name:`ArrayInner`,inheritAttrs:!1,__name:`arrayInner`,setup(e){return y(he,re()),(e,t)=>S(e.$slots,`default`)}}),jn=c({inheritAttrs:!1,__name:`arrayItemInner`,props:{index:{}},setup(e){return y(ge,e),(e,t)=>S(e.$slots,`default`)}});function Mn(e){return Array.isArray(e?.items)?Mn(e.items[0]):e?.items?.type===`array`||e?.items?.type===`object`}function Nn(e){let t=Mn(e),n=null;return n=t?new WeakMap:[],_(()=>{n=null}),{getKey:(e,t)=>n instanceof WeakMap?(n.has(e)||n.set(e,M()),`${n.get(e)}-${t}`):(n&&!n[t]&&(n[t]=M()),n?`${n[t]}-${t}`:void 0)}}function Pn(e){return pe(c({name:`SchemaWrapper`,props:{value:{type:[String,Number,Boolean,Array,Object],default:void 0},onChange:{type:Function,default:void 0}},setup(n,r){let{setterSchema:i}=e,a=re(),o=ie(),s=u(he,void 0),c=u(ge,void 0),d=u(ve,t(()=>!1)),{getKey:f}=Nn(o.value),p=t(()=>{let e=a.value,t={...o.value?.[`x-component-props`]||{},value:n.value,onChange:n.onChange};if(e&&!K(e)&&(t.pattern=e.pattern),i.basicSetter)for(let[e,n]of Object.entries(i.basicSetter)){let r=n[`x-path`];if(r){let n=P(o.value,r);n!==void 0&&(t[e]=n)}}if(i.componentSetter?.properties)for(let[e,n]of Object.entries(i.componentSetter.properties)){let r=n[`x-path`];if(r){let n=P(o.value,r);n!==void 0&&(t[e]=n)}}e&&!K(e)&&(t.pattern=e.pattern);let r=o.value?.type===`array`?a.value:s?.value;return r&&(t.onAdd=()=>r.push({}),t.onPush=()=>r.push({}),t.onUnshift=()=>r.unshift({}),t.onRemove=e=>r.remove(e),t.onMove=(e,t)=>r.move(e,t),t.onMoveUp=e=>{e>0&&r.move(e,e-1)},t.onMoveDown=e=>{e<r.value.length-1&&r.move(e,e+1)},c?.index!==void 0&&(t.pattern=r.pattern)),c?.index!==void 0&&(t.arrayIndex=c.index),d.value&&(t.pattern=`disabled`),t});return()=>{let t=a.value;if(!t||t.display!==`visible`)return l(`template`,{},{});let n=()=>{if(!t||K(t))return null;let e=t.errors||[];return e.length===0?null:l(`div`,{class:`formily-validation-errors`,style:{color:`#f56c6c`,fontSize:`12px`,marginTop:`4px`,lineHeight:`1.5`}},l(`div`,{class:`formily-validation-error-item`},e[0].messages))};if(o.value?.type===`array`){let r=t?.value||[],i=r.length>0?r.map((e,t)=>l(jn,{index:t},{default:()=>l(te,{key:f(e,t),schema:o.value.items,name:t})})):null;return l(`div`,{},[l(An,{},{default:()=>l(e.component,p.value,{default:()=>i})}),n()])}return l(`div`,{},[l(e.component,p.value,r.slots),n()])}}}))}var Fn=c({__name:`index`,props:{values:{},schema:{},components:{},disabled:{type:Boolean}},setup(e,{expose:r}){let i=e,a=ae({values:i.values??{}});y(ve,t(()=>i.disabled??!1));let{SchemaField:o}=ne({components:Object.keys(i.components).reduce((e,t)=>(e[t]=Pn(i.components[t]),e),{})});return r({form:a}),(t,r)=>(v(),n(O(G),{form:O(a)},{default:A(()=>[s(O(o),{schema:e.schema},null,8,[`schema`])]),_:1},8,[`form`]))}});const In={key:0,class:`designer-layout`},Ln={class:`designer-material`},Rn={class:`designer-canvas`},zn={class:`designer-config`},Bn={key:1,class:`designer-preview`};var Vn=Q(c({__name:`designer`,props:{components:{},mode:{default:`edit`},modelValue:{},draggable:{type:Boolean,default:!1},height:{default:`100vh`}},emits:[`update:modelValue`],setup(e,{expose:n,emit:r}){let o=e,c=r,l=we(o.draggable);y(`designerComponents`,o.components);let u=b(null);k(()=>o.modelValue,e=>{e&&JSON.stringify(e)!==JSON.stringify(l.formSchema.value)&&(l.formSchema.value=e)},{immediate:!0,deep:!0}),k(()=>l.formSchema.value,e=>{c(`update:modelValue`,e)},{deep:!0});function d(){return u.value?.form?.values||{}}return n({getFormValues:d,schema:t(()=>l.formSchema.value),store:l}),(t,n)=>(v(),i(`div`,{class:`designer`,style:g({height:o.height})},[o.mode===`edit`?(v(),i(`div`,In,[a(`div`,Ln,[s(kn,{components:e.components,draggable:e.draggable},null,8,[`components`,`draggable`])]),a(`div`,Rn,[s(Be,{components:e.components},null,8,[`components`])]),a(`div`,zn,[s(Ht,{components:e.components},null,8,[`components`])])])):(v(),i(`div`,Bn,[s(Fn,{ref_key:`renderRef`,ref:u,schema:O(l).formSchema.value,components:e.components},null,8,[`schema`,`components`])]))],4))}}),[[`__scopeId`,`data-v-be54faba`]]);const Hn=Be,Un=Ht,Wn=Zt,Gn=Vn,Kn=Fn;export{Hn as Canvas,Un as ConfigPanel,J as DesignStoreKey,Gn as Designer,Wn as MaterialPanel,Kn as Render,Te as schemaToSetterValues,Ee as setterValuesToSchema,we as useCreateDesignStore,Y as useDesignStore};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@formily-djd/designer",
3
3
  "type": "module",
4
- "version": "0.0.13",
4
+ "version": "0.0.16",
5
5
  "description": "djd formily designer",
6
6
  "author": "gaojinsong2010@gmail.com",
7
7
  "license": "MIT",
@@ -27,7 +27,7 @@
27
27
  "@formily/shared": "^2.3.7",
28
28
  "@formily/vue": "^2.3.7",
29
29
  "vue": "^3.5.22",
30
- "@formily-djd/utils": "0.0.13"
30
+ "@formily-djd/utils": "0.0.16"
31
31
  },
32
32
  "devDependencies": {
33
33
  "@antfu/eslint-config": "^5.4.1",
@@ -57,7 +57,7 @@
57
57
  "vitest": "^3.2.4",
58
58
  "vitest-package-exports": "^0.1.1",
59
59
  "yaml": "^2.8.1",
60
- "@formily-djd/component": "0.0.13"
60
+ "@formily-djd/component": "0.0.16"
61
61
  },
62
62
  "publishConfig": {
63
63
  "access": "public",