美文网首页
表单设计器 数据验证 自定义高级搜索功能讨论

表单设计器 数据验证 自定义高级搜索功能讨论

作者: 时代小召唤 | 来源:发表于2018-04-03 21:13 被阅读0次

一.各个关键类和属性


由于只讨论表单设计器的数据验证以及高级搜索不扩展讨论其他属性和细节

流程图实体

public class Workflow : NamedEntity, ITenantScope, IWorkflow
{
        ...

        /// <summary>
        /// 流程组件集合
        /// </summary>
        public IList<Component> Components { get; set; }
}

流程组件

 public class Component
{
    ...
        /// <summary>
        /// 关联的自定义表单(视图)
        /// </summary>
        public CustomView CustomView  { get; set; }
}

自定义表单

由表单设计器设计生成

 public class CustomView
{
  public String Title{ get; set; }

  public List<CustomColumn> CustomColumns{ get; set; }
}

自定义列

 public class CustomColumn
{
  public String Name{ get; set; }

  public Enum CustomColumnType { get; set; }

  public bool Require{ get; set; }
...
 public List<Validator> Validators{ get; set; }
}

自定义验证

 public class Validator
{
  public Enum ValidatorType{ get; set; }//正则,长度,范围
  public String Regex { get; set; }
  public long Min { get; set; }
  public long Max{ get; set; }
  public String ErrorMessage { get; set; }
  
  
}

表单实体

public class Runtime : Entity
{
        ...

        /// <summary>
        /// 流程历史
        /// </summary>
        [DataMember]
        public List<Process> Processes { get; set; }

        /// <summary>
        /// 所有数据汇总
        /// </summary>
        [BsonExtraElements]
        [DataMember]
        public IDictionary<string, object> MainData { get; set; }

}


流程

public class Process :IRecord
{
         ...
        /// <summary>
        /// 流程组件
        /// </summary>
        public Component Component { get; set; }

        /// <summary>
        /// 所有通过自定义表单提交的数据
        /// </summary>
        [BsonExtraElements]
        [DataMember]
        public IDictionary<string, object> data { get; set; }
}

二.原理说明


1.自定义表单的运作

由表单设计器预先配置好所有的字段和其验证方式,持久化到流程图中,当流程运转的时候,就会根据表单实体(Runtime)的 当前流程(CurrentComponent)来获取对应的自定义表单/视图(CustomView),循环其中所有的自定义列(CustomColumn)生成html代码,同时根据每个自定义列的自定义验证列表属性(Validators)循环生成对应的前端验证代码(Html5)或脚本(JS)

2.自定义验证的运作

有了前端的验证还要有后台的服务端验证.同样,根据提交过来的Form中的 CustomView信息 获取到对应的自定义表单 通过其中的 自定义列的自定义验证属性 对所有数据进行再次确认.到了后台的Form数据会被统一转换为 流程(Process)验证并保存 . 如何把Form转换成Bson/Process 以便于验证和保存 是需要尝试研究的.

3.工作流引擎的运作

沿用并改进北汽三期的工作流引擎

4.高级搜索的运作

之前写过的 高级搜索规则,配合后台代码

            var arr = new BsonArray();
foreach (var item in SearchStringList)
{
    var operater = Regex.Match(item.Key, @"\$eq|\$lt|\$gt|\$regex|\$in|\$nin").Value;
    var key = item.Key;
    if (!string.IsNullOrEmpty(operater))
    {
        key = item.Key.Replace(operater, "");
    }
    var dataType = Regex.Match(item.Value, @"\$date|\$num").Value;
    var value = item.Value;
    if (!string.IsNullOrEmpty(dataType))
    {
        value = item.Value.Replace(dataType, "");
    }

    BsonDocument temp;
    if (dataType == "$date")
    {
        temp = new BsonDocument
        {
            {
                key, new BsonDocument
                {
                    {operater == "" ? "$eq" : operater, BsonDateTime.Create(value)}
                }
            }
        };
    }
    else if (dataType == "$num")
    {
        temp = new BsonDocument
        {
            {
                key, new BsonDocument
                {
                    {operater == "" ? "$eq" : operater, Convert.ToInt32(value)}
                }
            }
        };
    }
    else if (operater == "$in" || operater == "$nin")
    {
        temp = new BsonDocument
        {
            {
                key, new BsonDocument
                {
                    {
                        operater, value.ToBsonArray()
                    }
                }
            }
        };
    }
    else
    {
        temp = new BsonDocument
        {
            {
                key, new BsonDocument
                {
                    {
                        operater == "" ? "$eq" : operater, value
                    }
                }
            }
        };
    }
    arr.Add(temp);
}

相关文章

  • 表单设计器 数据验证 自定义高级搜索功能讨论

    一.各个关键类和属性 由于只讨论表单设计器的数据验证以及高级搜索不扩展讨论其他属性和细节 流程图实体 流程组件 自...

  • 【Vue3+Vite+TS】13.0 组件十:强大的表单组件(上

    功能 可配置型表单,通过json对象的方式自动生成表单 具备更完善的功能:表单验证、自定义验证规则、动态删减表单、...

  • vue+element 表单验证问题

    常规表单验证、自定义表单验证、动态增删表单验证 1.常规表单验证 2.自定义表单验证 3.动态增减 a.表单 b.表格

  • runoob js第八天

    JavaScript 表单验证 JavaScript 表单验证avaScript 可用来在数据被送往服务器前对 H...

  • 15.《Angular表单校验》

    一、使用Angular自带的表单校验器 运行结果: 二、自定义表单校验器 当然我们也可以将验证器方法独立出来 使用...

  • Vue from-validate 表单验证

    前言 需要进行表单数据验证,原先才用html5来完成验证,但是效果很差,也不够灵活,所以需要进行自定义的表单验证,...

  • 2018-05-16

    今天继续学习JavaScript。 1.表单验证:在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证 ...

  • 表单相关

    1.自定义验证器 1.1 行内验证器 当表单类中包含以'validate_字段属性名'形式命名的方法时,在验证字段...

  • ruby基础功能-数据验证

    数据验证 验证表单提供的数据是否符合要求使用rails自带的内置辅助功能ActiveRecord Validati...

  • thinkphp5.1

    一、验证器 官方文档:验证器官方文档:验证场景 验证器定义 数据验证 批量验证 抛出验证异常 自定义验证规则

网友评论

      本文标题:表单设计器 数据验证 自定义高级搜索功能讨论

      本文链接:https://www.haomeiwen.com/subject/tqwchftx.html