@longhongguo/form-create-ant-design-vue 3.2.68 → 3.2.69

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@longhongguo/form-create-ant-design-vue",
-  "version": "3.2.68",
+  "version": "3.2.69",
   "description": "AntDesignVue版本低代码表单|FormCreate 是一个可以通过 JSON 生成具有动态渲染、数据收集、验证和提交功能的低代码表单生成组件。支持6个UI框架，适配移动端，并且支持生成任何 Vue 组件。内置20种常用表单组件和自定义组件，再复杂的表单都可以轻松搞定。",
   "main": "./dist/form-create.min.js",
   "module": "./dist/form-create.esm.js",

package/src/parsers/spin.js

@@ -10,9 +10,29 @@ export default {
     ctx.rule.wrap.title = false
     
     const props = ctx.prop.props || {}
+    
+    // 读取 containerMode 配置
+    const containerMode = 
+      ctx.rule.containerMode ?? 
+      ctx.rule.props?.containerMode ?? 
+      ctx.prop.props?.containerMode ?? 
+      true
+    
+    // 如果不是容器模式，清空 children
+    if (!containerMode) {
+      ctx.rule.children = []
+    }
+    
     if (!hasProperty(props, 'spinning')) {
       props.spinning = ctx.prop.props?.spinning ?? ctx.rule.props?.spinning ?? false
     }
+    
+    // 如果没有子组件且不是容器模式，spinning 不应该为 true（避免显示空加载状态）
+    const hasChildren = ctx.rule.children && Array.isArray(ctx.rule.children) && ctx.rule.children.length > 0
+    if (!containerMode && !hasChildren && props.spinning) {
+      // 独立模式下如果没有内容，不建议显示加载状态
+      // 但这里不强制修改，让用户自己控制
+    }
 
     // 支持从多个位置读取配置
     const bindField =
@@ -59,14 +79,36 @@ export default {
       }
     }
 
-    // 确保子组件不被 a-col 包装
-    if (ctx.rule.children && Array.isArray(ctx.rule.children)) {
+    // 只在容器模式下处理 children
+    if (containerMode) {
+      // 确保 children 存在
+      if (!ctx.rule.children) {
+        ctx.rule.children = []
+      }
+
+      // 确保子组件不被 a-col 包装
+      if (ctx.rule.children && Array.isArray(ctx.rule.children)) {
       ctx.rule.children.forEach((child) => {
-        if (child && typeof child === 'object' && child.col !== false) {
-          child.col = false
+        if (
+          child &&
+          typeof child === 'object' &&
+          child.type !== 'DragTool' &&
+          child.type !== 'DragBox'
+        ) {
+          // 只有当 col 未设置或为默认值时才设置
+          if (child.col === undefined || child.col === null) {
+            child.col = false
+          } else if (
+            child.col &&
+            typeof child.col === 'object' &&
+            child.col.show !== false
+          ) {
+            child.col.show = false
+          }
         }
       })
     }
+    }
   },
   render(children, ctx) {
     // 获取 spinning 状态
@@ -100,14 +142,36 @@ export default {
     }
 
     // 设置类型为 a-spin
-    ctx.prop.type = 'a-spin'
+    if (ctx.prop.type === 'spin') {
+      ctx.prop.type = 'a-spin'
+    }
 
-    // 如果有子组件，渲染子组件，否则渲染默认内容
-    const childrenNodes = children && Array.isArray(children) && children.length > 0
-      ? children
-      : null
+    // 读取 containerMode 配置
+    const containerMode = 
+      ctx.rule.containerMode ?? 
+      ctx.rule.props?.containerMode ?? 
+      ctx.prop.props?.containerMode ?? 
+      true
+    
+    // children 会通过 form-create 的机制自动渲染
+    // 容器模式下，始终渲染 children（即使为空，也会显示拖拽区域）
+    // 独立模式下，不渲染 children
+    let spinChildren
+    if (containerMode) {
+      // 容器模式：总是渲染 children，即使为空
+      spinChildren = children && Array.isArray(children) ? children : []
+    } else {
+      // 独立模式：不渲染 children
+      spinChildren = undefined
+    }
 
-    return ctx.vNode.make('a-spin', ctx.prop, childrenNodes)
+    // 将 spin 容器包装在 col 中，确保它占满整行（span: 24）
+    return ctx.vNode.col(
+      { props: { span: 24 } },
+      {
+        default: () => [ctx.vNode.make('a-spin', ctx.prop, spinChildren)]
+      }
+    )
   }
 }