super-page-runtime 1.0.12 → 1.0.14

package/src/components/runtime/utils/events/validator-util.ts

@@ -0,0 +1,474 @@
+import Validator from 'async-validator'
+import { ElMessage, ElMessage as Message } from 'element-plus'
+import { getComponentRef } from '../global-refs'
+import { getI18n } from 'agilebuilder-ui/src/utils/util'
+
+export function setObjectPropRule(prop, rules, leafRule) {
+  const rule = {}
+  if (!rules) {
+    rules = {}
+  }
+  let num = 0
+  const props = prop.split('.')
+  props.forEach((subProp) => {
+    let objectRule
+    if (num === props.length - 1) {
+      // 说明是最后一个
+      objectRule = getEndObjectRule(rule, props, subProp)
+      objectRule.fields[subProp] = leafRule
+    } else {
+      let lastObjectRule
+      if (num === 0) {
+        objectRule = rules
+      } else {
+        lastObjectRule = getLastObjectRule(rule, props, props[num - 1])
+        objectRule = lastObjectRule.fields
+      }
+      if (!objectRule[subProp]) {
+        objectRule[subProp] = {
+          type: 'object',
+          required: true,
+          fields: {}
+        }
+      }
+      if (num === 0) {
+        rule[subProp] = objectRule[subProp]
+      } else {
+        lastObjectRule.fields[subProp] = objectRule[subProp]
+      }
+    }
+    num++
+  })
+  return rule
+}
+
+function getLastObjectRule(rule, props, currentProp) {
+  let lastObjectdRule
+  for (let i = 0; i < props.length; i++) {
+    const subProp = props[i]
+    if (i === 0) {
+      lastObjectdRule = rule[subProp]
+    } else {
+      lastObjectdRule = lastObjectdRule.fields[props[i]]
+    }
+    if (subProp === currentProp) {
+      break
+    }
+  }
+  return lastObjectdRule
+}
+
+function getEndObjectRule(rule, props, currentProp) {
+  let lastObjectdRule
+  for (let i = 0; i < props.length; i++) {
+    if (i === 0) {
+      lastObjectdRule = rule[props[i]]
+    } else {
+      lastObjectdRule = lastObjectdRule.fields[props[i]]
+    }
+    if (i !== props.length - 1) {
+      const leafSubProp = props[i + 1]
+      if (leafSubProp === currentProp) {
+        break
+      }
+    }
+  }
+  return lastObjectdRule
+}
+
+/**
+ * @param {editFieldInfos} Array 编辑字段信息集合
+ */
+function getValidator(columns) {
+  const rules = {}
+  if (columns) {
+    columns.forEach((editField) => {
+      const prop = editField.model
+      if (prop && editField.validations) {
+        const validations = editField.validations
+        if (prop.indexOf('.') > 0) {
+          setObjectPropRule(editField.prop, rules, validations)
+        } else {
+          if (validations && validations.length > 0) {
+            rules[prop] = [...validations]
+          }
+        }
+      }
+    })
+  }
+  return rules
+}
+
+export function validator(entity, rules, columns, rowIndex, isSql) {
+  return validatorEntity(entity, rules, columns, rowIndex, true, isSql)
+}
+/**
+ * @description: 子表表单必填检验
+ * @Date: 2023-07-13 15:51:34
+ * @param {*}
+ * @return {*}
+ */
+function sublistVerify(rules) {
+  if (!rules) {
+    return
+  }
+  Object.keys(rules).forEach((item) => {
+    if (item.indexOf('.') >= 0) {
+      let ruleKetArr = []
+      ruleKetArr = item.split('.')
+      if (rules[ruleKetArr[0]]) {
+        rules[ruleKetArr[0]].fields[ruleKetArr[1]] = rules[item][0]
+      } else {
+        rules[ruleKetArr[0]] = new Object()
+        rules[ruleKetArr[0]].fields = new Object()
+        rules[ruleKetArr[0]].fields[ruleKetArr[1]] = rules[item][0]
+        rules[ruleKetArr[0]].type = 'object'
+      }
+      delete rules[item]
+    }
+  })
+  return rules
+}
+
+function validatorEntity(entity, rules, columns, rowIndex, isShouldRepeateValdate, isSql) {
+  let validateRules = sublistVerify(rules)
+
+  if ((!rules || rules === null) && columns) {
+    validateRules = getValidator(columns)
+  }
+  // console.log('validateSubTables--validator-validateRules-', entity, validateRules)
+  if (!validateRules || Object.keys(validateRules).length === 0) {
+    // 表示没有字段权限限制
+    entity['validateErrorField'] = ''
+    return true
+  }
+  let result
+  const validator = new Validator(validateRules)
+  validator.validate(
+    entity,
+    {
+      first: true
+    },
+    (errors, fields) => {
+      let fieldName
+      if (errors) {
+        result = errors[0].message
+        fieldName = errors[0]['field']
+        // entity['validateErrorField'] = errors[0].field
+        if (typeof rowIndex !== 'undefined' && rowIndex !== null) {
+          // 表示是子表字段验证失败
+          result =
+            getI18n().t('superPageRuntimeMessage.recordLine', {
+              row: rowIndex + 1
+            }) +
+            '，' +
+            result
+          // result ='第 '+ (rowIndex + 1) +' 行记录'+
+          // '，' +
+          // result
+        }
+        Message({
+          message: result,
+          showClose: true,
+          type: 'warning',
+          duration: 3 * 1000
+        })
+
+        console.log('errors', errors, 'fields', fields)
+      } else {
+        // 验证成功后，将最后验证失败的字段置空
+        // entity['validateErrorField'] = ''
+        result = true
+      }
+      if (fieldName && isShouldRepeateValdate === true) {
+        // 将实体中字段名改为大写，然后再验证一次该字段是否已填值。因为mysql中jdbc获得实体记录字段名是小写的，但是验证规则中字段名是大写的，所以会导致字段验证失败
+        const reg1 = /[A-Z]+/ // 大写字母
+        if (
+          isSql !== undefined &&
+          isSql === true &&
+          reg1.test(fieldName) &&
+          entity[fieldName.toLowerCase()] !== undefined
+        ) {
+          const copyEntity = JSON.parse(JSON.stringify(entity))
+          copyEntity[fieldName.toUpperCase()] = entity[fieldName.toLowerCase()]
+          delete copyEntity[fieldName.toLowerCase()]
+          result = validatorEntity(copyEntity, rules, columns, rowIndex, false, isSql)
+        }
+      }
+    }
+  )
+  return result
+}
+// 验证表单方法
+export function validateDataModelFunc(pageContext, configureObj, isEnableRequired) {
+  const dataModel = pageContext.entity.data
+  const pageModel = pageContext.entity.page
+  const data = { ...pageModel, ...dataModel }
+  const rules = pageContext.rules
+  if (isEnableRequired === undefined || isEnableRequired === null) {
+    // 如果没有传是否必填标识，则以按钮配置的为准
+    // 是否启用必填
+    isEnableRequired = configureObj.props.verification.required
+    if (typeof isEnableRequired === 'undefined') {
+      // 默认是启用必填验证
+      isEnableRequired = true
+    }
+  }
+  return validateDataModel(isEnableRequired, data, rules, pageContext)
+}
+
+// 验证表单实现
+function validateDataModel(isEnableRequired, dataModel, rules, pageContext) {
+  if (isEnableRequired) {
+    // 表示需要必填验证
+    // 是否是流程表单
+    const isWorkflow = pageContext.workflowCode ? true : false
+    const customRules = pageContext.customRules
+    if (isWorkflow) {
+      // 表示是流程表单
+      return validateWorkflowFormDataModel(dataModel, pageContext, customRules)
+    } else {
+      // 表示是普通表单
+      return validateCommonFormDataModel(dataModel, pageContext, rules, customRules)
+    }
+  } else {
+    // 表示不需要必填验证
+    return new Promise((resolve, reject) => {
+      resolve(true)
+    })
+  }
+}
+
+// 验证流程表单必填
+function validateWorkflowFormDataModel(dataModel, pageContext, customRules) {
+  return new Promise((resolve, reject) => {
+    const additionalParamMap = pageContext.entity.request
+    const contextParameter = pageContext.entity.context
+    const taskParamMap = pageContext.entity.task
+    const isSql = true
+    const subTablePageInfo = pageContext.subTablePageInfo
+    let workflowFieldPermissionRules = window['$vueApp'].config.globalProperties.$getValidator(
+      pageContext.completeTaskParam.fieldPermissions,
+      dataModel,
+      isSql,
+      additionalParamMap,
+      taskParamMap,
+      contextParameter
+    )
+    // 添加自定义规则到原规则中
+    workflowFieldPermissionRules = packageCustomRules(customRules, workflowFieldPermissionRules)
+    // 验证流程字段权限
+    let result = false
+    if (!workflowFieldPermissionRules) {
+      result = true
+    } else {
+      result = window['$vueApp'].config.globalProperties.$formValidator(
+        dataModel,
+        workflowFieldPermissionRules,
+        isSql,
+        additionalParamMap,
+        taskParamMap,
+        contextParameter,
+        subTablePageInfo
+      )
+    }
+    if (result !== true) {
+      // 字段验证失败
+      ElMessage({
+        showClose: true,
+        message: result + '',
+        type: 'warning'
+      })
+      resolve(false)
+    } else {
+      const validatorResult = []
+      const customUuids = pageContext.customValidatorUuids
+      if (customUuids) {
+        customUuids.forEach((componentUuid) => {
+          const customRef = getComponentRef(pageContext, componentUuid)
+          if (customRef) {
+            // TODO: 自定义组件中暴露validator方法
+            validatorResult.push(customRef.validator())
+          }
+        })
+      }
+      if (validatorResult && validatorResult.length > 0) {
+        // 验证自定义控件校验
+        Promise.all(validatorResult).then((values) => {
+          if (values.includes(false)) {
+            // 验证失败的提示信息由自定义控件抛出
+            resolve(false)
+          } else {
+            // 验证成功
+            // 移除验证失败字段名，否则会造成后台保存失败
+            if (Object.keys(dataModel).indexOf('validateErrorField') >= 0) {
+              delete dataModel.validateErrorField
+            }
+            resolve(dataModel)
+          }
+        })
+      } else {
+        // 验证成功
+        // 移除验证失败字段名，否则会造成后台保存失败
+        if (Object.keys(dataModel).indexOf('validateErrorField') >= 0) {
+          delete dataModel.validateErrorField
+        }
+        resolve(dataModel)
+      }
+    }
+  })
+}
+// 验证普通表单必填
+function validateCommonFormDataModel(dataModel, pageContext, rules, customRules) {
+  return new Promise((resolve, reject) => {
+    const handleModels = JSON.parse(JSON.stringify(dataModel))
+    // 表示启用了必填验证
+    // 添加自定义规则到原规则中
+    rules = packageCustomRules(customRules, rules)
+    if (!rules) {
+      resolve(handleModels)
+    } else {
+      // 为了处理a.b.c格式的属性，el-form的验证不支持a.b.c格式，所以使用原生Validator验证
+      const validateEntityResult = validator(handleModels, rules, null, null, true)
+      if (validateEntityResult === true) {
+        // 验证表格组件
+        const validateResult = validateSubTables(pageContext)
+        if (validateResult === true) {
+          // 如果验证成功
+          // 移除验证失败字段名，否则会造成后台保存失败
+          if (Object.keys(handleModels).indexOf('validateErrorField') >= 0) {
+            delete handleModels.validateErrorField
+          }
+          resolve(handleModels)
+        } else {
+          // 子表验证失败
+          reject(
+            new Error(
+              getI18n().t('superPageRuntimeMessage.tableListSubTableDataVerificationFailed')
+            ).message
+          )
+          // reject('表单子表数据校验失败')
+        }
+      } else {
+        reject(new Error(getI18n().t('superPageRuntimeMessage.formDataVerificationFailed')).message)
+        // reject('表单数据校验失败')
+      }
+    }
+  })
+}
+
+/**
+ * 封装自定义校验规则
+ * @param orgCustomRules 自定义规则
+ * @param orgRules 原来的表单规则
+ * @returns 添加了自定义规则后的规则
+ */
+function packageCustomRules(orgCustomRules, orgRules) {
+  if (!orgCustomRules || !orgRules) {
+    return
+  }
+  // 为了解决表单内，在页面事件内动态控制字段必填和非必填的问题
+  const customRulesKeys = Object.keys(orgCustomRules)
+  const customRules = orgCustomRules
+  customRulesKeys.forEach((key) => {
+    if (key === '__subRules') {
+      const subRules = customRules['__subRules']
+      const customSubTableKey = Object.keys(subRules)
+      customSubTableKey.forEach((subTableKey) => {
+        // 子表规则 获取自定义的子表校验规则赋值给表单校验规则
+        if (!orgRules.subRules) {
+          orgRules['subRules'] = {}
+        }
+        if (orgRules.subRules[subTableKey]) {
+          // 向已有的子表校验规则。
+          Object.assign(orgRules.subRules[subTableKey], subRules[subTableKey])
+        } else {
+          orgRules.subRules[subTableKey] = subRules[subTableKey]
+        }
+      })
+    } else {
+      orgRules[key] = customRules[key]
+    }
+  })
+  return sublistVerify(orgRules)
+}
+
+// 验证表格组件
+function validateSubTables(pageContext) {
+  if (!pageContext) {
+    return
+  }
+  const tableUuidArr = pageContext.tableUuids
+  if (!tableUuidArr) {
+    return
+  }
+  for (let i = 0; i < tableUuidArr.length; i++) {
+    const tableUuid = tableUuidArr[i]
+    const refDom = getComponentRef(pageContext, tableUuid)
+    if (refDom) {
+      const flag = refDom.validatorSunTableListData()
+      if (!flag) {
+        return false
+      }
+    }
+  }
+  return true
+}
+
+// 表单必填格式验证时，国际化message功能
+export function i18nValidateRulesMessage(rules) {
+  if (!rules || Object.keys(rules).length === 0) {
+    return
+  }
+  const newRules = {}
+  const propNames = Object.keys(rules)
+  for (let i = 0; i < propNames.length; i++) {
+    const propName = propNames[i]
+    // 获得的是个数组
+    const propRules = rules[propName]
+    propRules.forEach((rule) => {
+      const label = rule['label']
+      // TODO： 验证时国际化配置待测试
+      const i18nLabel = getI18n().t(label)
+      if (rule['required']) {
+        // 必填
+        rule['message'] = getI18n().t('superPageRuntimeMessage.required', { label: i18nLabel })
+      }
+      if (rule['myType']) {
+        // 文本、邮箱、网址  格式不匹配
+        rule['message'] = getI18n().t('superPageRuntimeMessage.formatMismatch', {
+          label: i18nLabel
+        })
+      }
+      if (rule['patternType']) {
+        // 正则表达式 格式不匹配
+        rule['message'] = getI18n().t('superPageRuntimeMessage.formatMismatch', {
+          label: i18nLabel
+        })
+      }
+      if (rule['max'] !== undefined && rule['max'] !== null) {
+        // 最大长度
+        rule['message'] = getI18n().t('superPageRuntimeMessage.overMaxLength', {
+          label: i18nLabel,
+          value: rule['max']
+        })
+      }
+      if (rule['min'] !== undefined && rule['min'] !== null) {
+        // 最小长度
+        rule['message'] = getI18n().t('superPageRuntimeMessage.limitMinLength', {
+          label: i18nLabel,
+          value: rule['min']
+        })
+      }
+    })
+    if (propName.indexOf('.') > 0) {
+      // 表示有主子表
+      setObjectPropRule(propName, newRules, propRules)
+    } else {
+      if (propRules && propRules.length > 0) {
+        newRules[propName] = [...propRules]
+      }
+    }
+  }
+  return newRules
+}

package/src/components/runtime/utils/global-refs.ts

@@ -0,0 +1,160 @@
+import { reactive } from 'vue';
+import type {PageContext} from './interfaces/page-design-types';
+declare global {
+  interface Window {
+      globalRefs: any
+  }
+}
+//缓存全局的对象
+if(!window['globalRefs']){
+  window['globalRefs'] = {};
+}
+const globalRefs:any = window['globalRefs'];
+
+/**
+ * 添加组件引用对象
+ * @param pageContext 页面运行时对象
+ * @param componentIndex 对象ID
+ * @param refObj 引用对象
+ * @returns 
+ */
+export function addComponentRef(pageContext:PageContext,componentUuid:string,refObj:any):any{
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKey(pageContext.code,pageContext.version);
+  if(!globalRefs[cacheKey]){
+    globalRefs[cacheKey] = {};
+  }
+  globalRefs[cacheKey][componentUuid] = refObj;
+  return globalRefs[cacheKey];
+}
+
+/**
+ * 添加组件引用对象
+ * @param pageContext 页面运行时对象
+ * @param componentIndex 对象ID
+ * @param refObj 引用对象
+ * @returns 
+ */
+export function addComponentRefByCode(pageContext:PageContext,componentCode:string,refObj:any):any{
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKeyByCode(pageContext.code,pageContext.version);
+  if(!globalRefs[cacheKey]){
+    globalRefs[cacheKey] = {};
+  }
+  globalRefs[cacheKey][componentCode] = refObj;
+  return globalRefs[cacheKey];
+}
+
+/**
+ * 获取组件引用对象
+ * @param pageDesign 页面设计对象
+ * @param componentIndex 对象ID
+ * @returns
+ */
+export function getComponentRef(pageContext:PageContext,componentUuid:string):any{
+  if(!pageContext || !componentUuid){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKey(pageContext.code,pageContext.version);
+  if(!globalRefs[cacheKey]){
+    globalRefs[cacheKey] = {};
+  }
+  const objRef = globalRefs[cacheKey][componentUuid];
+  return objRef?objRef.value:objRef;
+}
+
+/**
+ * 根据编码获取组件引用对象
+ * @param pageDesign 页面设计对象
+ * @param componentCode 对象code
+ * @returns
+ */
+export function getComponentRefByCode(pageContext:PageContext,componentCode:string):any{
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKeyByCode(pageContext.code,pageContext.version);
+  if(!globalRefs[cacheKey]){
+    globalRefs[cacheKey] = {};
+  }
+  const objRef = globalRefs[cacheKey][componentCode];
+  return objRef?objRef.value:objRef;
+}
+
+/**
+ * 移除组件引用对象
+ * @param pageDesign 页面设计对象
+ * @param componentIndex 对象ID
+ * @param refObj 引用对象
+ * @returns 
+ */
+export function removeComponentRef(pageContext:PageContext,componentUuid:string):any{
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKey(pageContext.code,pageContext.version);
+  if(!globalRefs[cacheKey]){
+    globalRefs[cacheKey] = {};
+  }
+  delete globalRefs[cacheKey][componentUuid];
+  return globalRefs[cacheKey];
+}
+
+/**
+ * 移除页面所有引用
+ * @param pageDesign 页面设计对象
+ * @param componentIndex 对象ID
+ * @param refObj 引用对象
+ * @returns 
+ */
+export function removePageAllRef(pageContext:PageContext){
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKey(pageContext.code,pageContext.version);
+  globalRefs[cacheKey] = {};
+}
+
+/**
+ * 初始化页面引用对象
+ * @param pageCode 
+ * @param pageVersion
+ */
+export function initComponentRefState(pageContext:PageContext):void{
+  if(!pageContext){
+    return
+  }
+  //获取原对象,并设置为空
+  const cacheKey = getPageRefKey(pageContext.code,pageContext.version);
+  globalRefs[cacheKey] = {};
+}
+
+/**
+ * 获取页面组件的缓存Key
+ * @param pageCode 
+ * @param pageVersion 
+ */
+function getPageRefKey(pageCode:string,pageVersion:number|any):string{
+  return "pageRuntimeRef-"+pageCode+"-"+(pageVersion?pageVersion:1);
+}
+
+/**
+ * 获取页面组件的缓存Key 缓存code
+ * @param pageCode 
+ * @param pageVersion 
+ */
+function getPageRefKeyByCode(pageCode:string,pageVersion:number|any):string{
+  return getPageRefKey(pageCode,pageVersion)+'-code';
+}
+
+