框架PasteForm实际开发案例，支持多级对象的表单看看有多简单只要几个特性即可！(1)

PasteForm框架的主要思想就是对Dto进行标记特性，然后管理端的页面就会以不一样的UI呈现
使用PasteForm框架开发，让你免去开发管理端的烦恼，你只需要专注于业务端和用户端！

今天来分享的主要有以下几个点
1.多级嵌套，也可以说是外表或者是子表集合模式
2.按需显示，比如某一个选项选择a的时候，哪些要输入，选择b的时候又是哪些要输入

带子页面和可选输入的UI

先看UI

如果我选择条件包邮，则变成下面的

注意看上图的条件包邮，后面又新增+ 删除 收缩的操作，也就是可以以当前为范本新增一个对象的！
思考下，看UI可以知道条件包邮是下一级的东西，然后地区选择应该是一个array对吧，一起看看Dto长啥模样

Dto

    ///<summary>
    ///运费模板
    ///</summary>
    public class TemplateInfoAddDto
    {
        ///<summary>
        ///模板名称
        ///</summary>
        [MaxLength(64)]
        [Required]
        public string name { get; set; }

        ///<summary>
        ///计费类型
        ///</summary>
        [MaxLength(8)]
        [PasteLselect(PasteFormString.SelectValuationType, "", 1)]
        public string valuation_type { get; set; } = "PIECE";

        ///<summary>
        ///发货期限 SendTime_TWENTYFOUR_HOUR SendTime_FOUTYEIGHT_HOUR
        ///</summary>
        [MaxLength(32)]
        [PasteLselect(PasteFormString.SelectSendTime, "", 1)]
        public string send_time { get; set; } = "SendTime_TWENTYFOUR_HOUR";

        ///<summary>
        ///运输方式 EXPRESS：快递
        ///</summary>
        [MaxLength(16)]
        [PasteSelect(PasteFormString.SelectDeliveryType)]
        public string delivery_type { get; set; } = "EXPRESS";

        ///<summary>
        ///计费方式
        ///</summary>
        [MaxLength(16)]
        [PasteLselect(PasteFormString.SelectShippingMethod, "", 1)]
        [ColumnDataType("changeui", "CONDITION_FREE", "group:regexp:condition_free_detail_list__(.*)", "")]
        [ColumnDataType("changeui", "NO_FREE", "group:regexp:freight_calc_method_list__(.*)", "")]
        public string shipping_method { get; set; } = "FREE";

        /////<summary>
        /////条件包邮
        /////</summary>
        //public string all_condition_free_detail_json { get; set; }

        /////<summary>
        /////条件包邮
        /////</summary>
        //[PasteDirectsun]
        //public AllConditionFreeDetail all_condition_free_detail { get; set; } = new AllConditionFreeDetail();

        /// <summary>
        /// 条件包邮
        /// </summary>
        [PasteDirectsun]
        [PasteHidden]
        public List<ConditionFreeDetail> condition_free_detail_list { get; set; } = new List<ConditionFreeDetail> { };

        /////<summary>
        /////计费方法 默认运费，指定地区运费等
        /////</summary>
        //public string all_freight_calc_method_json { get; set; }

        /////<summary>
        /////计费方法 默认运费，指定地区运费等
        /////</summary>
        //[PasteDirectsun]
        //public AllFreightCalcMethod all_freight_calc_method { get; set; } = new AllFreightCalcMethod();

        /// <summary>
        /// 计费方法
        /// </summary>
        [PasteDirectsun]
        [PasteHidden]
        public List<FreightCalcMethod> freight_calc_method_list { get; set; } = new List<FreightCalcMethod> { };

        /////<summary>
        /////不发货区域
        /////</summary>
        //public string not_send_area_json { get; set; }

        ///<summary>
        ///
        ///</summary>
        [PasteGroupItem("g_no_area", "不发货地区", false)]
        [PasteSunform("../area/index.html?datainfo=address_infos",420)]
        public List<AddressShort> not_send_area { get; set; }
    }

上面用到了几个特性，简单介绍下，如果你要了解具体的特性用法，可以查阅PasteForm的操作文档
PasteForm文档
应该说是说明文档比较贴切

lselect

这个是select的变种，以横向模式展示可选项，支持单选和多选模式，选中的为蓝色粗体模式

changeui

这个是最近添加的特性，表示基于当前字段的最新值，进行UI的显示隐藏操作，目前只支持在select或者lselect后面执行
选择条件包邮后的UI变动就是这个特性生效的！

directsun

表示的是以对象模式读取当前对象，一般用于非基础数据类型，比如上面的

        /// <summary>
        /// 计费方法
        /// </summary>
        [PasteDirectsun]
        [PasteHidden]
        public List<FreightCalcMethod> freight_calc_method_list { get; set; } = new List<FreightCalcMethod> { new FreightCalcMethod { } };

上面是一个集合List,所以在UI中会以组别形式呈现，还支持+和删除操作，注意初始化的时候要new一项，不然UI中没有数据的！
非List也是支持的，比如

        /// <summary>
        /// 计费方法
        /// </summary>
        [PasteDirectsun]
        public FreightCalcMethod freight_calc_method_list { get; set; } 

sunform

这个就很有意思了，表示以iframe的形式载入一个页面，这个页面要实现一个函数

/**
 * 提交表单 提交表单的数据，最好前面加一层转化啥的
 **/
function funcSubmitForm() {
	//把当前页面的内容读取成obj或者array,具体看需求
}

这样就可以实现有些特别复杂的直接写一个个性化的页面来实现！

问题

目前遇到一个问题，看上面的，如果某一个UI中的字段等没有被显示，而特性又标记required的时候，这个时候肯定有问题的，因为提交的时候会被阻断了！(因为必填你没填)

首先使用:hidden(判断元素是否显示)是不行的，因为组别的展开和收缩也是这个

还有一个是表单项有层级关系的，比如组隐藏了，就包含他里面的所有表单项了

这个问题我估计会使用class的名称来判定，如果是多级套的问题，其实class也有问题的。。。

如果你有好的建议欢迎留言，我会很开心看到你的建议的

下期见