@dhccmobile/vue3-lo-form 0.1.0

package/src/services/validate-generator.service.ts

@@ -0,0 +1,710 @@
+import { DesFormControl, FormControl, Validate } from "../domain";
+import { FormFieldType, ValidateRules, ValidateStatus } from "../constants/enum";
+import moment from "moment";
+
+interface Rule {
+  ruleType?: any;
+  ruleContent?: any;
+  describe?: any;
+}
+
+class ValidateGeneratorService {
+  /**
+   * @description: 填充校验规则
+   * @author ChenRui
+   * @date 2021/1/27 15:07
+   */
+  fillCheckRule(formControl: FormControl, controlAttr: DesFormControl): void {
+    if (controlAttr.verificationRules && controlAttr.verificationRules.length > 0) {
+      const validates: Validate[] = [];
+      controlAttr.verificationRules.forEach((item: Rule) => {
+        const validate: Validate | undefined = this.getBuiltInValidationRules(item, controlAttr);
+        if (validate) {
+          validates.push(validate);
+        }
+      });
+      formControl.addValidate(validates);
+    }
+  }
+
+  /**
+   * @description: 获取校验规则
+   * @author ChenRui
+   * @date 2021/7/19 17:55
+   */
+  getBuiltInValidationRules(item: Rule, controlAttr: DesFormControl): Validate | undefined {
+    let validate: Validate | undefined;
+    switch (item.ruleType) {
+      case ValidateRules.SameValue.code:
+        validate = this.genSameValue(item);
+        break;
+      case ValidateRules.MailBox.code:
+        validate = this.genMailBox(item);
+        break;
+      case ValidateRules.RegEx.code:
+        validate = this.genRegEx(item);
+        break;
+      case ValidateRules.MinTextLength.code:
+        validate = this.genMinTextLength(item);
+        break;
+      case ValidateRules.MaxTextLength.code:
+        validate = this.genMaxTextLength(item);
+        break;
+      case ValidateRules.MinValue.code:
+        validate = this.genMinValue(item);
+        break;
+      case ValidateRules.MaxValue.code:
+        validate = this.genMaxValue(item);
+        break;
+      case ValidateRules.SpecifiedValue.code:
+        validate = this.genSpecifiedValue(item);
+        break;
+      case ValidateRules.SpecifiedDigitsNumber.code:
+        validate = this.genSpecifiedDigitsNumber(item);
+        break;
+      case ValidateRules.DateNotEarlierThan.code:
+        validate = this.genDateNotEarlierThan(item);
+        break;
+      case ValidateRules.DateNoLaterThan.code:
+        validate = this.genDateNoLaterThan(item);
+        break;
+      case ValidateRules.SpecifiedRangeNumber.code:
+        validate = this.genSpecifiedRangeNumber(item);
+        break;
+      case ValidateRules.PhoneNumber.code:
+        validate = this.genPhoneNumber(item);
+        break;
+      case ValidateRules.Required.code:
+        validate = this.genRequired(item, controlAttr.controlType);
+        break;
+      case ValidateRules.LineUnique.code:
+        validate = this.genLineUnique(item);
+        break;
+      case ValidateRules.LetterSpace.code:
+        validate = this.genLetterSpace(item);
+        break;
+      case ValidateRules.AlphanumericUnderline.code:
+        validate = this.genAlphanumericUnderline(item);
+        break;
+      case ValidateRules.Alphanumeric.code:
+        validate = this.genAlphanumeric(item);
+        break;
+      case ValidateRules.JsMethodVerification.code:
+        validate = this.genJsMethodVerification(item);
+        break;
+      case ValidateRules.BackEndVerification.code:
+        validate = this.genBackEndVerification(item);
+        break;
+      case ValidateRules.LandlineNumber.code:
+        validate = this.genLandlineNumber(item);
+        break;
+    }
+    return validate;
+  }
+
+  /**
+   * @description: 相同的值
+   * @author ChenRui
+   * @date 2021/1/27 15:12
+   */
+  genSameValue(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val != item.ruleContent) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `与预期值(${item.ruleContent})不符`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 电子邮箱
+   * @author ChenRui
+   * @date 2021/1/27 15:15
+   */
+  genMailBox(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          const emreg = /^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/;
+          if (!emreg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "电子邮件格式不正确",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 正则匹配
+   * @author ChenRui
+   * @date 2021/1/27 15:17
+   */
+  genRegEx(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && !eval(item.ruleContent).test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: item.describe ? item.describe : `'不满足正则校验'${item.ruleContent}`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 最小文本长度
+   * @author ChenRui
+   * @date 2021/1/27 15:18
+   */
+  genMinTextLength(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val && String(val).length < Number(item.ruleContent)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `内容不少于${item.ruleContent}个字`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 最大文本长度
+   * @author ChenRui
+   * @date 2021/1/27 15:21
+   */
+  genMaxTextLength(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val && String(val).length > Number(item.ruleContent)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `内容不超过${item.ruleContent}个字`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 最小值
+   * @author ChenRui
+   * @date 2021/1/27 15:24
+   */
+  genMinValue(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != undefined && val !== "") {
+          if (item.ruleContent != null && val != null && val !== "" && Number(val) < Number(item.ruleContent)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `数值不能小于${item.ruleContent}`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 最大值
+   * @author ChenRui
+   * @date 2021/1/27 15:25
+   */
+  genMaxValue(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != undefined && val !== "") {
+          if (item.ruleContent != null && val != null && val !== "" && Number(val) > Number(item.ruleContent)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `数值不能大于${item.ruleContent}`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 指定的值
+   * @author ChenRui
+   * @date 2021/1/27 15:27
+   */
+  genSpecifiedValue(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val != item.ruleContent) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: `与预期值(${item.ruleContent})不符`,
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 指定位数数字
+   * @author ChenRui
+   * @date 2021/1/27 15:31
+   */
+  genSpecifiedDigitsNumber(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != undefined && val !== "") {
+          if (item.ruleContent && val) {
+            let countDecimals = 0;
+            if (Math.floor(val).toString() !== val.toString()) {
+              countDecimals = val.toString().split(".")[1].length || 0;
+            }
+            if (countDecimals != Number(item.ruleContent)) {
+              return {
+                validateStatus: ValidateStatus.Error.code,
+                errorMsg: item.ruleContent === "0" || item.ruleContent === 0 ? `请输入整数` : `请保留${item.ruleContent}位小数`,
+              };
+            }
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 自动补位
+   * @author ChenRui
+   * @date 2021/1/27 15:59
+   */
+  roundNumber(number: any, decimals: any): any {
+    let newString; // The new rounded number
+    decimals = Number(decimals);
+    if (decimals < 1) {
+      newString = Math.round(number).toString();
+    } else {
+      let numString = number.toString();
+      if (numString.lastIndexOf(".") == -1) {
+        // If there is no decimal point
+        numString += "."; // give it one at the end
+      }
+      let cutoff = numString.lastIndexOf(".") + decimals; // The point at which to truncate the number
+      let d1: any = Number(numString.substring(cutoff, cutoff + 1)); // The value of the last decimal place that we'll end up with
+      const d2 = Number(numString.substring(cutoff + 1, cutoff + 2)); // The next decimal, after the last one we want
+      if (d2 >= 5) {
+        // Do we need to round up at all? If not, the string will just be truncated
+        if (d1 == 9 && cutoff > 0) {
+          // If the last digit is 9, find a new cutoff point
+          while (cutoff > 0 && (d1 == 9 || isNaN(d1))) {
+            if (d1 != ".") {
+              cutoff -= 1;
+              d1 = Number(numString.substring(cutoff, cutoff + 1));
+            } else {
+              cutoff -= 1;
+            }
+          }
+        }
+        d1 += 1;
+      }
+      if (d1 == 10) {
+        numString = numString.substring(0, numString.lastIndexOf("."));
+        const roundedNum = Number(numString) + 1;
+        newString = roundedNum.toString() + ".";
+      } else {
+        newString = numString.substring(0, cutoff) + d1.toString();
+      }
+    }
+    if (newString.lastIndexOf(".") == -1) {
+      // Do this again, to the new string
+      newString += ".";
+    }
+    const decs = newString.substring(newString.lastIndexOf(".") + 1).length;
+    for (let i = 0; i < decimals - decs; i++) newString += "0";
+    return newString;
+  }
+
+  /**
+   * @description: 日期不早于
+   * @author ChenRui
+   * @date 2021/1/27 16:06
+   */
+  genDateNotEarlierThan(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val) {
+            try {
+              if (val.toDate() > moment(item.ruleContent).toDate()) {
+                return {
+                  validateStatus: ValidateStatus.Error.code,
+                  errorMsg: `日期不早于${item.ruleContent}`,
+                };
+              }
+            } catch (e) {
+              return {
+                validateStatus: ValidateStatus.Error.code,
+                errorMsg: `最大值日期(${item.ruleContent})格式有误！`,
+              };
+            }
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 日期不晚于
+   * @author ChenRui
+   * @date 2021/1/27 16:08
+   */
+  genDateNoLaterThan(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent && val) {
+            try {
+              if (val.toDate() < moment(item.ruleContent).toDate()) {
+                return {
+                  validateStatus: ValidateStatus.Error.code,
+                  errorMsg: `日期不晚于${item.ruleContent}`,
+                };
+              }
+            } catch (e) {
+              return {
+                validateStatus: ValidateStatus.Error.code,
+                errorMsg: `最小值日期(${item.ruleContent})格式有误！`,
+              };
+            }
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 指定范围的数字
+   * @author ChenRui
+   * @date 2021/1/27 16:35
+   */
+  genSpecifiedRangeNumber(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (item.ruleContent != null && val && item.ruleContent.indexOf("/") > -1) {
+            const arr: any[] = item.ruleContent.split("/");
+            if (arr && arr.length > 1) {
+              if (val < Number(arr[0]) || val > Number(arr[1])) {
+                return {
+                  validateStatus: ValidateStatus.Error.code,
+                  errorMsg: `数值大小应在${arr[0]}~${arr[1]}之间`,
+                };
+              }
+            }
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 手机号
+   * @author ChenRui
+   * @date 2021/1/27 16:55
+   */
+  genPhoneNumber(item: Rule): Validate {
+    const reg = /^0?1[3|4|5|6|7|8][0-9]\d{8}$/;
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (val && !reg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "手机号不合法",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 必填
+   * @author ChenRui
+   * @date 2021/1/27 15:28
+   */
+  genRequired(item: Rule, controlType: string): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val == null || (typeof val == "string" && val.trim() === "") || (Array.isArray(val) && val.length === 0)) {
+          let msg = "为必输项";
+          if (controlType === FormFieldType.Select.code || controlType === FormFieldType.Radio.code || controlType === FormFieldType.Checkbox.code) {
+            msg += ",请选择";
+          } else {
+            msg += ",请输入";
+          }
+          return {
+            validateStatus: ValidateStatus.Error.code,
+            errorMsg: msg,
+          };
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 唯一行
+   * @author ChenRui
+   * @date 2021/1/27 17:16
+   */
+  genLineUnique(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: () => {
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 仅包含字母空格
+   * @author ChenRui
+   * @date 2021/1/27 17:21
+   */
+  genLetterSpace(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          const reg = /^(?!_)([A-Za-z ]+)$/;
+          if (val && !reg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "仅包含字母空格",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 数字字母下划线
+   * @author ChenRui
+   * @date 2021/1/27 17:28
+   */
+  genAlphanumericUnderline(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          const reg = /^[a-zA-Z0-9_]{1,}$/;
+          if (val && !reg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "仅包含数字字母下划线",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 字母数字
+   * @author ChenRui
+   * @date 2021/1/27 17:32
+   */
+  genAlphanumeric(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          const reg = /^[0-9a-zA-Z]*$/g;
+          if (val && !reg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "仅包含数字字母",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: JS方法校验
+   * @author ChenRui
+   * @date 2021/1/27 17:42
+   */
+  genJsMethodVerification(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (val && item.ruleContent) {
+            try {
+              const func = new Function(item.ruleContent);
+              return func(val);
+            } catch (e) {
+              return {
+                validateStatus: ValidateStatus.Error.code,
+                errorMsg: item.describe ? item.describe : `'JS校验函数不合法`,
+              };
+            }
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 后端校验
+   * @author ChenRui
+   * @date 2021/1/27 17:43
+   */
+  genBackEndVerification(item: Rule): Validate {
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: () => {
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+
+  /**
+   * @description: 座机号校验
+   * @author ChenRui
+   * @date 2021/4/14 11:40
+   */
+  genLandlineNumber(item: Rule): Validate {
+    const reg = /^0\d{2,3}-?\d{7,8}$/;
+    const validate: Validate = {
+      name: item.ruleType,
+      validateFunc: (val: any) => {
+        if (val != null && val !== "") {
+          if (val && !reg.test(val)) {
+            return {
+              validateStatus: ValidateStatus.Error.code,
+              errorMsg: "座机号不合法",
+            };
+          }
+        }
+        return {
+          validateStatus: ValidateStatus.Success.code,
+        };
+      },
+    };
+    return validate;
+  }
+}
+const validateGeneratorService = new ValidateGeneratorService();
+export { Rule, validateGeneratorService };

package/src/shims-vue.d.ts

@@ -0,0 +1,6 @@
+/* eslint-disable */
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue'
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}