|-- `assets` 静态文件资源库（存放编译打包后的js&css）

		|-- `accountswitcher` 
		
		|-- `alipay`
		
		|-- `arale`
		
		|-- `bizfundprod`
		
		|-- `cellula`
		
		|-- `enterpriseportal`
			
		|-- `fdp` `Form` `dataView` `paginator`
		
		|-- `gallery`
		
		|- `seajs-style`
		
		|-- `itemList` 一个使用`cellula`做的小玩意儿
		
		|-- `select`
		
		|-- `singleForm` 单表单模型
		
		|-- `tinyscrollbar`
		
		|-- ...
		
|-- `data`

|-- `example` 示例
		
|-- `htdocs` 

	  |-- `bizfundprod`
	  
	  |-- ...

|-- images

|-- `lib` 公共js库

/-- `static` 静态文件

/-- `test` 单元测试

Gruntfile.js 部署脚本

package.js 项目配置

    <div class="mi-form-item" id="memo">
        <label class="mi-label">备注</label>
        <input class="mi-input memo" type="text" data-maxlength="50" name="memo" autocomplete="off" tabindex="7" />
        <div class="mi-form-explain">50个汉字，100个字符。</div>
    </div>

    this.addRule('isChinese', function(options) {
        if (!/[\u4e00-\u9fa5]+/.test(options.element.value)) {
            return false; // 校验失败
        } else {
            return true; // 校验通过
        }
    }, this.label + '需要包含中文字符');

    this.addRule('isChinese', /[\u4e00-\u9fa5]+/, this.label + '需要包含中文字符'); 

    this.addRule('availableBatchNo', function(options, commit) {
        $.ajax({
            url: 'availableBatchNo.json',
            type: 'POST',
            data : {
                userid : 1024
            },
            success: function(resp) {
                if (resp.result) {
                    commit(true); // 校验通过
                } else {
                    commit(false, '批次号异常错误'); // 校验失败
                }
            },
            error: function() { 
                commit(false, '系统异常'); // 校验失败
            }
        });
    });

    var MyForm = Form.build('MyForm', {
        type : 'single',
        itemList : null,
        autoSubmit: false,
        init : function(conf) {
            this._super(conf);
        }
    });

    var BpToAccountForm = Form.build('BpToAccountForm', {
		type : 'single',
		itemList : null,
		autoSubmit: false, // 手动提交
		init : function(conf) {
			this._super(conf);
		},
		onFormValidated: function(options) {
			if (options.validate) this.submit(); // 当所有表单项都验证通过进入提交
		},
		submit: function() {
			window.console && console.log('manual submit form.');
			if (typeof securityCore !== 'undefined') {
				securityCore && securityCore.execute(); // 安全服务化验证
			} else {
				this.element.submit();
			}
		}
	});

    // 是否为主操作员
    var isMainOperator = $('#cardNo').attr('data-ismopt'); // 'true' | 'false'

    <div class="mi-form-item accountCard" id="cardNo" data-ismopt="$!isMainOperator">
        <label class="mi-label">付款账户</label>
        <input type="hidden" name="cardNo" value="$!alipayCard.cardNo" />
        <div class="fn-clear">
            #if($!isMainOperator)
            <div class="curAccount fn-left">
                <span class="ft-bold">#if($!alipayCard.displayAlias)[$!alipayCard.displayAlias] - #end $!alipayCard.logonId</span>
            </div>
            #else
            <div class="fn-left">
                <div class="accountSwitch ui-selectmenu fn-hide" role="button" aria-haspopup="true" aria-owns="accountSwitcher" aria-disabled="false">
                    <span class="fn-left ft-14 ft-bold accountName"></span> <span class="fn-left accountHyphen"> - </span> <span class="fn-left accountEmail"></span>
                </div>
                <div class="accountSwitcher ui-selectmenu-menu" aria-hidden="false" role="listbox" aria-labelledby="accountSwitch"></div>
            </div>
            <script type="text/javascript">
                // 后端同步输出账户的json数据
                window.accountSwitchList = '#SLITERAL($!alipayCardList)';
            </script>
            #end
            <div class="accountAmount fn-left">
                <span class="useableBlance fn-hide">（可用余额 <em class="ft-orange"></em> 元）</span>
                <span class="usableBalanceAbort fn-hide">（可用余额：系统异常，<em>重新获取信息</em>）</span>
            </div>
        </div>
        <div class="mi-form-explain"></div>
    </div>

    var CardNo; // 初始化控件对象
    /* 
     * 付款账户（非主操作员则加载）
     *
     */
    if (isMainOperator == 'false') {
        CardNo = FormItem.build('CardNo', {
            type : 'input',
            label : '付款账户',
            acountList: undefined,
            accountSwitcher: null,
            getAccountUsablebBalance: getAccountUsablebBalance,
            init : function(conf) {
                var _self = this, t = null;
                this._super(conf);
                this._bindAll('trigger', 'triggerValidate');
                this.acountList = window.accountSwitchList;
                if (this.acountList) this.element.value = this.acountList[0].accountId;
                this.accountSwitcher = AccountSwitcher.init({
                    dataList: this.acountList,
                    bSwitchDefault: true,
                    accountSwitchInput: $(this.element)
                });
                // 因为组件用到`onload`先于`init`执行，所以需要延迟验证。
                t = setTimeout(function() { 
                    $(_self.element).trigger('changed');
                    clearTimeout(t);
                }, 50);
                $(this.element).on('changed', this.trigger);
                this.addRule('usablebBalance', this.getAccountUsablebBalance);
                $('.usableBalanceAbort em', this.rootNode).on('click', this.triggerValidate);
            },
            trigger: function() {
                this.triggerValidate();
            }
        });
    }
    /* 
     * 当前账户
     *
     */
    else if (isMainOperator == 'true') {
        CardNo = FormItem.build('CardNo', {
            type : 'input',
            label : '付款账户',
            getAccountUsablebBalance: getAccountUsablebBalance,
            init : function(conf) {
                this._super(conf);
                this._bindAll('triggerValidate');
                this.addRule('usablebBalance', this.getAccountUsablebBalance);
                this.triggerValidate(); // 初始化获取当前账户可用余额
                $('.usableBalanceAbort em', this.rootNode).on('click', this.triggerValidate);
            }
        });
    }

    // 获取账户可用余额并得知余额是否被冻结
    var getAccountUsablebBalance = function(options, commit) {
        var _self = this;
        var cardNo = options.element.value;
        $.ajax({
            type: 'POST',
            url: 'getAccountInfoWithBalance.json',
            data: { cardNo: cardNo },
            success: function(data) {
                if (data.isSuccess) {
                    $('.useableBlance em', _self.rootNode).text(data.cardInfo && data.cardInfo.availableAmount);
                    $('.usableBalanceAbort', _self.rootNode).addClass('fn-hide');
                    $('.useableBlance', _self.rootNode).removeClass('fn-hide');
                    if (data.cardInfo && data.cardInfo.enablePayment) {
                        // 账户被冻结，不可转出
                        commit(false, '该账户余额支付功能关闭，不可将资金转出。');
                    } else {
                        commit(true);
                    }
                    return;
                } else {
                    $('.useableBlance', _self.rootNode).addClass('fn-hide');
                    $('.usableBalanceAbort', _self.rootNode).removeClass('fn-hide');
                    commit(false, '系统异常，请重新登录。');
                    return;
                } 
                if (data.stat == 'deny') {
                    // 系统超时
                    $('.useableBlance', _self.rootNode).addClass('fn-hide');
                    $('.usableBalanceAbort', _self.rootNode).removeClass('fn-hide');
                    commit(false, '连接超时，请重新登录。');
                }
            },
            error: function() {
                $('.useableBlance', _self.rootNode).addClass('fn-hide');
                $('.usableBalanceAbort', _self.rootNode).removeClass('fn-hide');
                commit(false, '系统异常，请重新登录。');
            }
        });
    };

    /** 批次号 **/
    var BatchNo = FormItem.build('BatchNo', {
        type : 'input',
        label : '批次号',
        init : function(conf) {
            this._super(conf);
            this.addRule('digits', /^[0-9]+$/, this.label + '应为当天日期开头的11-20位数字，如：2014052021219810')
                .addRule('size', /^[0-9]{11,20}$/, this.label + '应为当天日期开头的11-20位数字，如：2014052021219810');
        }
    });
    /** 付款文件 **/
    var UploadFile = FormItem.build('UploadFile', {
        type : 'input',
        label : '付款文件',
        init : function(conf) {
            this._super(conf);
            this._bindAll('trigger', 'repair');
            $(this.element).change(this.trigger);
            $(this.element).click(this.repair);
            this.addRule('availableFileType', function(options) {
                var fullpath = options.element.value;
                var filename = fullpath.substr(fullpath.lastIndexOf('\\') + 1);
                var allow = ['.csv', '.xls'],
                    extension = /\.[^\.]+$/.exec(fullpath);
                if (!extension) {
                    return false;
                }
                if ($.inArray(extension[0].toLowerCase(), allow) == -1) {
                    return false;
                }
                $('.upload-trigger', this.rootNode).addClass('fn-hide');
                $('.rollback-filename', this.rootNode).text(filename).attr('title', filename).removeClass('fn-hide');
                $('.reupload-file', this.rootNode).removeClass('fn-hide');
                return true;
            }, '无效的文件类型，请重新选择' + this.label);
        },
        trigger: function() {
            this.element.blur();
            this.triggerValidate();
        },
        repair: function() {
            var _self = this, t = setTimeout(function() {
                _self.element.blur();
                clearTimeout(t);
            }, 500);
        }
    });
    /* 总笔数 */
    var TotalCount = FormItem.build('TotalCount', {
        type : 'input',
        label : '总笔数',
        max: undefined,
        init : function(conf) {
            this._super(conf);
            this.max = parseInt(this.element.getAttribute('data-max'), 10);
            this.addRule('format', /^[1-9]\d*$/, this.label + '的格式不正确')
            .addRule('limit', function(options) {
                if (parseInt(this.element.value, 10) <= 0) {
                    this.setMessage('limit', this.label + '必须大于或者等于1');
                    return false;
                }
                if (this.max < parseInt(this.element.value, 10)) {
                    return false;
                }
                return true;
            }, this.label + '最多' + this.max + '笔');
        }
    });
    /* 总金额 */
    var TotalAmount = FormItem.build('TotalAmount', {
        type : 'input',
        label : '总金额',
        reg: new RegExp('^\\d+(\\.\\d{0,2})?$'),
        toMoney: undefined,
        init : function(conf) {
            this._super(conf);
            this._bindAll('trigger');
            this.toMoney = $('.toMoney', this.rootNode);
            $(this.element).on('keyup', this.trigger);
            this.addRule('money', this.reg, this.label + '的格式不正确')
            .addRule('limit', function() {
                if (parseFloat(this.element.value) == 0) {
                    return false;
                }
                return true;
            }, this.label + '至少为0.01元');
        },
        trigger: function() {
            var val = $.trim(this.element.value);
            if (this.reg.test(val)) {
                var upperCase = Money.convert(val);
                upperCase && this.toMoney.text(upperCase);
                this.toMoney.removeClass('fn-hide');
                this.setDefaultTip();
            } else {
                this.error(this.label + '的格式不正确');
                this.toMoney.addClass('fn-hide');
            }
        }
    });
    /* 备注 */
    var Remark = FormItem.build('Remark', {
        required : false,
        type : 'input',
        label : '备注',
        defaultTip : '',
        maxLength : undefined,
        init : function(conf) {
            this._super(conf);
            this.defaultTip = this.tip;
            this.maxLength = parseInt(this.element.getAttribute('data-maxlength'), 10) * 2;
            this._bindAll('limit');
            $(this.element).on('change keyup', this.limit);
            this.defaultTip = this.tip;
            this.addRule('limitWord', function(options, commit) {
                var msg;
                var val = options.element.value;
                var len = val.replace(/[\u4E00-\u9FBF]/g, 'BB').length;
                if (len > this.maxLength) {
                    msg = this.tip = '输入已超过' + Math.floor((len - this.maxLength) / 2) + '个字。';
                    this.setMessage('limitWord', msg);
                    return false;
                } else {
                    if (len == 0)
                        this.tip = this.defaultTip;
                    else
                        this.tip = '还可以输入' + Math.ceil((this.maxLength - len) / 2) + '个字。';
                    return true;
                }
            });
        },
        limit : function(e) {
            var _self = this, t = null;
            if (_self.element.value == '') { 
                this.tip = _self.defaultTip; 
                _self.setDefaultTip();
                return;
            }
            t = setTimeout(function() {
                _self.triggerValidate();
                clearTimeout(t);
            }, 50);
        }
    });

    /** collection **/
    var formElements = {
        batchNo : new BatchNo({
            key : 'batchNo'
        }),
        uploadFile : new UploadFile({
            key : 'uploadFile'
        }),
        totalCount : new TotalCount({
            key : 'totalCount'
        }),
        totalAmount : new TotalAmount({
            key : 'totalAmount'
        }),
        remark : new Remark({
            key : 'remark'
        })
    };
    
    if (CardNo) {
        formElements.cardNo = new CardNo({
            key: 'cardNo'
        });
}

    var BpToAccountForm = Form.build('BpToAccountForm', {
        type : 'single',
        itemList : null,
        autoSubmit: false,
        init : function(conf) {
            this._super(conf);
        },
        onFormValidated: function(options) {
            if (options.validate) this.submit();
        },
        submit: function() {
            window.console && console.log('manual submit form.');
            if (typeof securityCore !== 'undefined') {
                securityCore && securityCore.execute(); // 安全服务化验证
            } else {
                this.element.submit();
            }
        }
    });

    // 安全服务化
    if (window.alipay && alipay.security && alipay.security.core) {
        var bpform = $('#bpToAccountForm'), bpSubmit = $('input[type=submit]', bpform);
        var disBtn = function() {
            bpSubmit.attr('disabled', 'disabled');
            bpSubmit.parent().addClass('mi-button-mblue-disabled');
        }, enbBtn = function() {
            bpSubmit.removeAttr('disabled');
            bpSubmit.parent().removeClass('mi-button-mblue-disabled');
        };
        light.ready(function() {
            securityCore = alipay.security.core.init({
                form: bpform[0],
                stopSubmit: true,
                beforeAjaxValidate: function() {
                    // 按钮设置为不可点击，样式置灰自行完成
                    disBtn();
                },
                afterAjaxValidate: function() {
                    // 按钮设置为可点击，样式自行恢复
                    enbBtn();
                },
                block: function() {
                    // 安全产品校验失败提交区域
                    disBtn();
                },
                beforeSubmit: function() {
                    /* CTU验证  */
                    sendCTURecheckReq($(bpform).serialize(), checkStep2SecProd);
                },
                reCheckSuccess: function() {
                    // 按钮设置为可点击，样式自行恢复
                    enbBtn();
                }
            });
        });
    }

    var bpToAccountForm = new BpToAccountForm({
        key : 'bpToAccountForm',
        itemList : formElements // formItems
    });