全球资金项目组前端公共组件common.js & common-zoom.js说明文档
GFP front-end component common.js & common-zoom.js readme text
common.js
-
对MeiUI组件的再次封装
-
表格
var muTable = $([selector]).dataGridTable({ ...... }) -
表单组件
类名 组件名 组件方法名 可在标签中配置的属性 .gfp-inputtext 输入框 muInputField width、mutype、placeholder、name、maxLength、readonly、 disabled、align(type=‘amount’时) .gfp-textarea 多行文本输入域 muTextarea placeholder、name、width、height、lang、disabled .gfp-combo 下拉框 muCombo width、placeholder、name、disabled .gfp-calendar 日历 muCalendar dateFormat、width、placeholder、name、lang、disabled -
公共iframe弹框
GFPCommon.gfpDialog.refresh({ ...... })
-
-
封装的公共方法及全局默认设置
-
查询条件展开收缩显示区块HTML代码
<div class="mu-row-grid"> <div class="mu-col-12 search-buttonbar"> <button id="searchButton" type="button" class="form-btn">查询</button> <button id="resetButton" type="button" class="form-btn">重置</button> <div class="fold-condition-wrap"> <div class="fold-operate unfold"> <span>展开</span> <i></i> </div> <div class="fold-operate fold"> <span>收缩</span> <i></i> </div> </div> </div> </div> 刷新表单防重方法
GFPCommon.refreshRequestToken()获得表格checkbox选中的值，
checkData是选中的多行的json数据，field是取得表格中那一列的值
GFPCommon.getDataGridCheck(checkData,field)加入json或json数组到己有的json数据，
formData目标数据，key主键，jsonObject被添加的json
GFPCommon.addJsonToListData(formData,key,jsonObject)格式化金额（转为千分位），
strData目标字符串，n保留几位小数 0-6
GFPCommon.formatAmount(strData, n)金额反格式化（去除千分位格式），
strData目标字符串
GFPCommon.reverseFormatAmount(strData)取消事件冒泡
GFPCommon.cancelBubble(event)重置form表单，saveData为重置后的默认值，如果为
undefined则重置为$([form]).data()的返回结果
$([form]).resetForm(saveData)清空form表单
$([form]).clearForm()设置表单值，
data格式为{name:XXX,value:XXXX}
$([form]).setFormData(data)设置表单内组件为readonly，如果不设置
nameArr则全部设为readonly
$([form]).setProhibitedEdit(nameArr)把form数据序列成json对象
$([form]).serializeObject()加法运算，
arg1、arg2相加的两数，precision精度
GFPCommon.sum(arg1, arg2, precision)减法运算，
arg1、arg2相减的两数，precision精度
GFPCommon.subtr(arg1, arg2, precision)乘法运算，
arg1、arg2相乘的两数，precision精度
GFPCommon.accMul(arg1, arg2, precision)除法运算，
arg1、arg2相除的两数，precision精度
GFPCommon.accDiv(arg1, arg2, precision)ajax默认设置，可由
$.ajaxSettings可获取默认设置
-
common-zoom.js（依赖common.js文件）
- 全球资金系统公共放大镜组件，调用方法：
var zoomDialog = new GFPZoomDialog({
id: "testDialogContainer", //弹窗唯一id
title:'放大镜示例',//弹窗title
dataUrl:'../view/data/dialogForm2.json',//表格数据源
method: 'post',//ajax请求方式，'get'或'post'
formElement: [ //头部条件，支持输入框和下拉框
{"fieldLabel":"测试21","fieldName":"container31","fieldType":"text"},
{"fieldLabel":"测试22","fieldName":"container32","fieldType":"combo", "dataSource":'../view/data/combo.json'}
],
cols : [ [ //表格列
{
radio: true
},{
title : 'BIC',
field : 'BIC',
width : 50,
align: 'center'
},{
title : 'name',
field : 'name',
width : 50,
align : 'center'
},{
title : 'city',
field : 'city',
width : 50,
align : 'center'
}
] ],
fieldMatch:{"container3": "name","container2":"BIC","container5":"city"},
onDialogOpen: function(instance,selectorObj){
console.log(instance,selectorObj)
},
onSubmit: function(data){
console.log(data)
}
});
- 参数详解
- tableContainerId：如果是嵌入表格中的放大镜，该项必填，否则放大镜数据无法带入，为表格外层div的id值。
- title：弹框的标题，非必填，不填则没有标题。
- gfpType：弹框里面内容形式。'table'表格，'listView'单项项选择列表，'mulListView'双项选择列表,mulGridView:双向选择表格。
- dataUrl：查询结果的数据源。
- mapperKey：表单外查询条件，额外的mapperKey字段。
- identity：弹窗内容形式为双向选择表格，即
gfpType:'mulGridView'，该属性为表格内数据主键标识，多选时必填，填入的值必须为字段之一，且每条数据的该字段为唯一值。 - queryParam：自定义的查询条件。
- formElement：用来配置弹框中查询输入框下拉框。类型为
object。fieldLabel为文字标签的文本内容，fieldName为表单组件的name属性值，fieldType为组件类型，输入框或下拉框。 - cols：对列进行配置。
- fieldMatch：弹框内层被选中的查询结果与弹框外层被带入的字段做匹配。
- buttons：弹框中查询结果的显示类型为双向选择的类型，如双向选择列表、双向选择表格，用以配置两个列表或表格之间的按钮组中额外增加的button。
- LModel：双向选择列表、双向选择表格左侧数据。
- RModel：双向选择列表、双向选择表格右侧数据。
- textField：配置单向、双向选择列表的textField，数据格式默认为
{text:'',value:''}，当后台传递过来的参数名不一致时，可以通过textField和valueField设置。 - valueField：配置单向、双向选择列表的valueField，数据格式默认为
{text:'',value:''}，当后台传递过来的参数名不一致时，可以通过textField和valueField设置。 - listViewTitle：单向选择列表的title。
- isShowNoData：单向选择列表时若设置为true，当dataSource未定义、获取数据源失败或数据源长度小于1，显示未获取数据源的提示语，提示语在langPackage中可定义，默认为‘暂无数据’；若设置为false时，不显示提示语。
- langPackage：单向选择列表isShowNoData设置为true时配置提示语。
- isDelete：双向选择列表添加的时候，把左边列表选中的值添加到右边时，当值为false的时候，左边列表不变，当为true的时候，值会被删除。
- extraData：单向选择列表dataUrl为ajax地址时，发送ajax传递给后台的查询条件参数。
- onDialogOpen：弹框打开时触发的事件。
- onSubmit：点击确定时触发的事件。
- onBindLinkage：可以在该回调事件中去掉两个字段之间的清空联动。
- mulGridViewWidth：双向选择表格的宽度。
- mulGridViewHeight：双向选择表格的高度。
- buttonsOnOff：是否展示双向选择表格的默认按钮。
- unbindFlag：是否绑定默认联动，默认即false为绑定，设为true则不绑定。
- validator：配置校验器。
- addRules：新增校验方法。
