@blueking/bkui-form 0.0.4 → 0.0.5

package/dist/bkui-form-umd.js

@@ -9322,7 +9322,7 @@
     var formItem = widgetTree.widgetMap[path];
     if (!formItem) return true;
     var instance = formItem.instance;
-    var ownSchema = instance.schema; // json schema validate
+    var ownSchema = instance.schema; // json schema 规则校验
 
     var schemaValidate = ajv.compile(ownSchema);
     var value = instance.value === undefined ? initializationValue(ownSchema.type, {
@@ -9334,20 +9334,19 @@
     if (!schemaValid) {
       var _schemaValidate$error;
 
-      instance.setState('error', true);
-      instance.setErrorTips((_schemaValidate$error = schemaValidate.errors) === null || _schemaValidate$error === void 0 ? void 0 : _schemaValidate$error.map(function (err) {
+      instance === null || instance === void 0 ? void 0 : instance.setState('error', true);
+      instance === null || instance === void 0 ? void 0 : instance.setErrorTips((_schemaValidate$error = schemaValidate.errors) === null || _schemaValidate$error === void 0 ? void 0 : _schemaValidate$error.map(function (err) {
         return err.message;
       }));
       return false;
     }
 
-    var customRules = (_instance$schema = instance.schema) === null || _instance$schema === void 0 ? void 0 : _instance$schema[OWN_RULE_PROPERTY]; // 自定义规则校验
+    var customRules = (_instance$schema = instance.schema) === null || _instance$schema === void 0 ? void 0 : _instance$schema[OWN_RULE_PROPERTY]; // 如果不存在自定义规则校验，不进行校验
 
     if (!customRules) {
-      instance.setState('error', false);
-      instance.setErrorTips('');
       return true;
     }
+
     var isError = false;
     var errorMsg = '';
 
@@ -9371,8 +9370,27 @@
       _iterator.f();
     }
 
-    instance.setState('error', isError);
-    instance.setErrorTips(errorMsg);
+    instance === null || instance === void 0 ? void 0 : instance.setState('error', isError);
+    instance === null || instance === void 0 ? void 0 : instance.setErrorTips(errorMsg); // 如果实例属于某个组，则沿着 path 向上查找，如果找到组且组的 verifiable 设置为 true，则通过实例的校验状态改变组的校验状态
+    // TODO submit 时校验，change 时去掉错误
+
+    var widgetPaths = path.split('.');
+    var fieldTitleBreadcrumb = [];
+    widgetPaths.forEach(function (thePath, thePathIndex) {
+      var currentPaths = widgetPaths.slice(0, widgetPaths.length - thePathIndex);
+      var widgetPath = currentPaths.join('.');
+      var theWidget = widgetTree.widgetMap[widgetPath];
+      fieldTitleBreadcrumb.push(theWidget.instance.schema.title || currentPaths.pop());
+
+      if (theWidget.instance.verifiable && theWidget.type === 'group') {
+        if (isError) {
+          var groupErrors = "".concat(fieldTitleBreadcrumb.reverse().join('-'), ": ").concat(errorMsg);
+          theWidget.instance.setGroupErrorTips(path, groupErrors);
+        } else {
+          theWidget.instance.removeGroupErrorTips(path);
+        }
+      }
+    });
     return !isError;
   };
   /**
@@ -9381,13 +9399,7 @@
 
   var validateForm = function validateForm() {
     var isValid = true;
-    Object.keys(widgetTree.widgetMap).filter(function (path) {
-      var _ref = widgetTree.widgetMap[path] || {},
-          type = _ref.type; // todo 组类型校验
-
-
-      return type === 'node';
-    }).forEach(function (path) {
+    Object.keys(widgetTree.widgetMap).forEach(function (path) {
       if (!validateFormItem(path)) isValid = false;
     });
     return isValid;
@@ -10150,8 +10162,17 @@
       border: {
         type: Boolean,
         default: false
+      },
+      verifiable: {
+        type: Boolean,
+        default: false
       }
     }),
+    data: function data() {
+      return {
+        groupErrorTips: {}
+      };
+    },
     created: function created() {
       // 注册widget TreeNode
       widgetTree.addWidgetNode(this.path, this, 'group');
@@ -10159,8 +10180,20 @@
     beforeDestroy: function beforeDestroy() {
       widgetTree.removeWidgetNode(this.path, this);
     },
+    methods: {
+      setGroupErrorTips: function setGroupErrorTips(widgetPath, errorTips) {
+        this.$set(this.groupErrorTips, widgetPath, errorTips);
+      },
+      removeGroupErrorTips: function removeGroupErrorTips(widgetPath) {
+        this.$delete(this.groupErrorTips, widgetPath);
+      }
+    },
     render: function render(h) {
-      var _this$layout, _this$layout2, _this$schema, _this$layout3;
+      var _this$layout,
+          _this$layout2,
+          _this$schema,
+          _this$layout3,
+          _this = this;
 
       var schemaFormStyle = _objectSpread2({
         position: 'relative',
@@ -10193,12 +10226,22 @@
       };
 
       var title = ((_this$schema = this.schema) === null || _this$schema === void 0 ? void 0 : _this$schema.title) || ((_this$layout3 = this.layout) === null || _this$layout3 === void 0 ? void 0 : _this$layout3.prop);
+      var groupErrorTipsContent = Object.keys(this.groupErrorTips).map(function (widgetPath) {
+        return h("p", [_this.groupErrorTips[widgetPath]]);
+      });
+      var hasError = JSON.stringify(this.groupErrorTips) !== '{}';
       return h("div", {
-        "class": ['bk-schema-form-group', this.type],
+        "class": ['bk-schema-form-group', this.type, {
+          'bk-schema-form-group--error': hasError
+        }],
         "style": schemaFormStyle
       }, [title && this.showTitle ? h("span", {
         "class": ['bk-schema-form-group-title', this.type]
-      }, [title]) : null, h("div", {
+      }, [title, hasError ? h("span", {
+        "class": "bk-schema-form-group__error-tips"
+      }, [h("span", {
+        "class": "bk-schema-form-group__error-tips-popover"
+      }, [groupErrorTipsContent])]) : null]) : null, h("div", {
         "style": groupContentStyle,
         "class": "bk-schema-form-group-content"
       }, [this.$slots.default]), this.removeable && renderDelete()]);
@@ -10387,6 +10430,10 @@
       border: {
         type: Boolean,
         default: false
+      },
+      verifiable: {
+        type: Boolean,
+        default: false
       }
     }),
     render: function render(h) {
@@ -10463,6 +10510,10 @@
         default: function _default() {
           return [];
         }
+      },
+      verifiable: {
+        type: Boolean,
+        default: false
       }
     }),
     data: function data() {