feat(lib): ui配置支持 ui:xxx 配置表达式

re #19
lljj-x · Nov 24, 2020 · 570dd57 · 570dd57
1 parent 7c20bb8
commit 570dd57
Show file tree

Hide file tree

Showing 10 changed files with 65 additions and 33 deletions.
diff --git a/packages/demo/src/schema-generator/views/editor/common/editorData.js b/packages/demo/src/schema-generator/views/editor/common/editorData.js
@@ -189,14 +189,14 @@ export function componentList2JsonSchema(componentList) {
     const baseObj = genBaseObj();
 
     let parentObj = baseObj;
-    let stack = [{ $$parentFlag: parentObj }, ...componentList];
+    let queue = [{ $$parentFlag: parentObj }, ...componentList];
 
     const hasChild = data => Array.isArray(data.childList) && data.childList.length > 0;
 
-    // 广度，同时标记父节点
-    while (stack.length) {
-        // 出栈
-        const item = stack.shift();
+    // 队列广度，同时标记父节点
+    while (queue.length) {
+        // 出队
+        const item = queue.shift();
 
         // 标记节点 切换parent
         if (item.$$parentFlag) {
@@ -208,9 +208,9 @@ export function componentList2JsonSchema(componentList) {
                 ...uiSchema
             };
 
-            // 入栈
+            // 入队
             if (hasChild(item)) {
-                stack = [...stack, { $$parentFlag: curSchema }, ...item.childList];
+                queue = [...queue, { $$parentFlag: curSchema }, ...item.childList];
             }
 
             // 连接数据

diff --git a/packages/lib/src/JsonSchemaForm/common/formUtils.js b/packages/lib/src/JsonSchemaForm/common/formUtils.js
@@ -113,19 +113,22 @@ export function getUserUiOptions({
 }) {
     // 支持 uiSchema配置在 schema文件中
     return Object.assign({}, ...[schema, uiSchema].map(itemSchema => Object.keys(itemSchema)
-        .filter(key => key.indexOf('ui:') === 0)
         .reduce((options, key) => {
             const value = itemSchema[key];
             // options 内外合并
             if (key === 'ui:options' && isObject(value)) {
                 return { ...options, ...value };
             }
 
-            // 只对 ui:xxx 配置形式支持表达式
-            return {
-                ...options,
-                [key.substring(3)]: curNodePath === undefined ? value : handleExpression(rootFormData, curNodePath, value, () => value)
-            };
+            if (key.indexOf('ui:') === 0) {
+                // 只对 ui:xxx 配置形式支持表达式
+                return {
+                    ...options,
+                    [key.substring(3)]: curNodePath === undefined ? value : handleExpression(rootFormData, curNodePath, value, () => value)
+                };
+            }
+
+            return options;
         }, {})));
 }
 
@@ -192,11 +195,15 @@ export function getUiOptions({
 // 处理成 Widget 组件需要的格式
 export function getWidgetConfig({
     schema = {},
-    uiSchema = {}
+    uiSchema = {},
+    curNodePath,
+    rootFormData,
 }, fallback = null) {
     const uiOptions = getUiOptions({
         schema,
-        uiSchema
+        uiSchema,
+        curNodePath,
+        rootFormData,
     });
 
     // 没有配置 Widget ，各个Field组件根据类型判断
@@ -247,14 +254,18 @@ export function getUserErrOptions({
     errorSchema = {}
 }) {
     return Object.assign({}, ...[schema, uiSchema, errorSchema].map(itemSchema => Object.keys(itemSchema)
-        .filter(key => key.indexOf('err:') === 0)
         .reduce((options, key) => {
             const value = itemSchema[key];
             // options 内外合并
             if (key === 'err:options' && isObject(value)) {
                 return { ...options, ...value };
             }
-            return { ...options, [key.substring(4)]: value };
+
+            if (key.indexOf('err:') === 0) {
+                return { ...options, [key.substring(4)]: value };
+            }
+
+            return options;
         }, {})));
 }
 

diff --git a/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldDateRange.js b/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldDateRange.js
@@ -12,13 +12,17 @@ export default {
     props: vueProps,
     functional: true,
     render(h, context) {
-        const { schema, uiSchema } = context.props;
+        const {
+            schema, uiSchema, curNodePath, rootFormData
+        } = context.props;
         const widgetConfig = getWidgetConfig({
             schema,
             uiSchema: {
                 'ui:widget': WIDGET_MAP.formats[schema.format],
-                ...uiSchema
-            }
+                ...uiSchema,
+            },
+            curNodePath,
+            rootFormData
         });
 
         return h(

diff --git a/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldMultiSelect.js b/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldMultiSelect.js
@@ -30,7 +30,9 @@ export default {
 
         const widgetConfig = getWidgetConfig({
             schema,
-            uiSchema
+            uiSchema,
+            curNodePath,
+            rootFormData
         }, () => ({
             widget: WIDGET_MAP.common.checkboxGroup
         }));

diff --git a/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldNormal.js b/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldNormal.js
@@ -23,7 +23,7 @@ export default {
     },
     render(h, context) {
         const {
-            schema, uiSchema, curNodePath, itemsFormData, errorSchema
+            schema, uiSchema, curNodePath, rootFormData, itemsFormData, errorSchema
         } = context.props;
 
         const {
@@ -40,7 +40,9 @@ export default {
             fieldStyle,
         } = getUiOptions({
             schema,
-            uiSchema
+            uiSchema,
+            curNodePath,
+            rootFormData,
         });
 
         const arrayItemsVNodeList = itemsFormData.map((item, index) => {

diff --git a/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldTuple.js b/packages/lib/src/JsonSchemaForm/fields/ArrayField/arrayTypes/ArrayFieldTuple.js
@@ -57,7 +57,7 @@ export default {
         if (!Array.isArray(this.itemsFormData)) return false;
 
         const {
-            schema, uiSchema, errorSchema
+            schema, uiSchema, errorSchema, curNodePath
         } = this.$props;
 
         const {
@@ -75,7 +75,7 @@ export default {
         } = getUiOptions({
             schema,
             uiSchema,
-            curNodePath: this.curNodePath,
+            curNodePath,
             rootFormData: this.rootFormData,
         });
 
@@ -92,7 +92,7 @@ export default {
                     schema: schema.items[index],
                     uiSchema: uiSchema.items ? uiSchema.items[index] : {},
                     errorSchema: errorSchema.items ? errorSchema.items[index] : {},
-                    curNodePath: computedCurPath(this.curNodePath, index)
+                    curNodePath: computedCurPath(curNodePath, index)
                 }
             }
         ));

diff --git a/packages/lib/src/JsonSchemaForm/fields/BooleanField/index.js b/packages/lib/src/JsonSchemaForm/fields/BooleanField/index.js
@@ -25,7 +25,9 @@ export default {
 
         const widgetConfig = getWidgetConfig({
             schema,
-            uiSchema
+            uiSchema,
+            curNodePath,
+            rootFormData
         }, () => ({
             widget: WIDGET_MAP.types.boolean
         }));

diff --git a/packages/lib/src/JsonSchemaForm/fields/ObjectField/index.js b/packages/lib/src/JsonSchemaForm/fields/ObjectField/index.js
@@ -60,7 +60,9 @@ export default {
             title, description, showTitle, showDescription, order, fieldClass, fieldAttrs, fieldStyle, onlyShowIfDependent
         } = getUiOptions({
             schema,
-            uiSchema
+            uiSchema,
+            curNodePath,
+            rootFormData
         });
 
         const properties = Object.keys(schema.properties || {});

diff --git a/packages/lib/src/JsonSchemaForm/fields/StringField/index.js b/packages/lib/src/JsonSchemaForm/fields/StringField/index.js
@@ -21,7 +21,9 @@ export default {
 
         const widgetConfig = getWidgetConfig({
             schema,
-            uiSchema
+            uiSchema,
+            curNodePath,
+            rootFormData
         }, () => {
             const isNumber = schema.type === 'number' || schema.type === 'integer';
 

diff --git a/packages/lib/src/JsonSchemaForm/fields/combiningSchemas/SelectLinkageField/index.js b/packages/lib/src/JsonSchemaForm/fields/combiningSchemas/SelectLinkageField/index.js
@@ -54,7 +54,9 @@ export default {
             // 下拉选项参数
             const selectWidgetConfig = getWidgetConfig({
                 schema: this.schema[`${this.combiningType}Select`] || {}, // 扩展 oneOfSelect,anyOfSelect字段
-                uiSchema: this.uiSchema[`${this.combiningType}Select`] || {} // 通过 uiSchema['oneOf'] 配置ui信息
+                uiSchema: this.uiSchema[`${this.combiningType}Select`] || {}, // 通过 uiSchema['oneOf'] 配置ui信息
+                curNodePath: this.curNodePath,
+                rootFormData: this.rootFormData,
             }, () => ({
                 // 枚举参数
                 widget: 'SelectWidget'
@@ -72,7 +74,9 @@ export default {
                     const curUiOptions = getUiOptions({
                         schema: option,
                         uiSchema: uiSchemaSelectList[index],
-                        containsSpec: false
+                        containsSpec: false,
+                        // curNodePath: this.curNodePath,
+                        // rootFormData: this.rootFormData,
                     });
                     return {
                         label: curUiOptions.title || `选项 ${index + 1}`,
@@ -141,7 +145,8 @@ export default {
         }
     },
     render(h) {
-        const pathClassName = nodePath2ClassName(this.$props.curNodePath);
+        const { curNodePath } = this.$props;
+        const pathClassName = nodePath2ClassName(curNodePath);
 
         // object 需要保持原有属性，如果存在原有属性这里单独渲染
         let originVnode = null;
@@ -188,7 +193,9 @@ export default {
             const userUiOptions = filterObject(getUiOptions({
                 schema: this.schema,
                 uiSchema: this.uiSchema,
-                containsSpec: false
+                containsSpec: false,
+                curNodePath,
+                rootFormData: this.rootFormData,
             }), key => (key === this.combiningType ? undefined : `ui:${key}`));
 
             const userErrOptions = filterObject(getUserErrOptions({