标签:没有 自定义 forms 点击 删除 tree graph err array
力软前端组件 API
目录
力软前端组件 API.............................................................................................................. 1
一、时间查询框........................................................... 2
二、下拉选择框........................................................... 3
三、数据字典下拉选择框................................................... 4
四、数据源下拉选择框..................................................... 4
五、树形插件............................................................. 4
六、获取表单数据......................................................... 5
七、设置表单数据......................................................... 5
八、验证表单输入字段..................................................... 5
九、弹层插件............................................................. 6
十、弹层选择框插件....................................................... 6
十一、树型表格选择框插件................................................. 6
十二、表格选择框插件..................................................... 7
十三、表格插件........................................................... 8
十四、甘特图插件......................................................... 9
一、时间查询框
方法:$(‘#‘+id).lrdate(op);
参数说明:
参数
|
说明
|
默认
|
dfdata
|
自定义数据
|
[]
|
mShow
|
是否显示当月按钮
|
true
|
premShow
|
是否显示上月按钮
|
true
|
jShow
|
是否显示当季度按钮
|
true
|
prejShow
|
是否显示上季度按钮
|
true
|
ysShow
|
是否显示上半年按钮
|
true
|
yxShow
|
是否显示下半年按钮
|
true
|
preyShow
|
是否显示去年按钮
|
true
|
yShow
|
是否显示今年按钮
|
true
|
dfvalue
|
默认选择值
|
未选择
|
selectfn
|
选择后回调函数
|
false
|
minDate
|
最小日期
|
‘‘
|
maxDate
|
最大日期
|
‘‘
|
示例:
$(this).lrdate({
dfdata: [
{ name: ‘今天‘, begin: function ()
{ return learun.getDate(‘yyyy-MM-dd
00:00:00‘)
}, end: function () { return
learun.getDate(‘yyyy-MM-dd 23:59:59‘)
} },
{ name: ‘近7天‘,
begin: function () { return
learun.getDate(‘yyyy-MM-dd 00:00:00‘,
‘d‘, -6) }, end: function
() { return learun.getDate(‘yyyy-MM-dd 23:59:59‘) } },
{ name: ‘近1个月‘, begin: function ()
{ return learun.getDate(‘yyyy-MM-dd 00:00:00‘, ‘m‘,
-1) }, end: function () {
return learun.getDate(‘yyyy-MM-dd
23:59:59‘) } },
{ name: ‘近3个月‘, begin: function ()
{ return learun.getDate(‘yyyy-MM-dd 00:00:00‘, ‘m‘,
-3) }, end: function () {
return learun.getDate(‘yyyy-MM-dd
23:59:59‘) } },
],
// 月
mShow: false, premShow: false,
// 季度
jShow: false, prejShow: false,
// 年ysShow: false,
yxShow: false,
preyShow: false, yShow: false,
// 默认
dfvalue: ‘1‘,
selectfn: function (begin, end) {
logbegin = begin;
logend = end;
page.search();
}
});
二、下拉选择框
方法:$(‘#‘+id).lrselect(op);
参数
|
说明
|
默认
|
placeholder
|
占位符
|
请选择
|
type
|
数据展示类型:
1.default:普通;2.tree:树形数据;3. treemultiple:树形多选;multiple:普通多选
|
default
|
value
|
数据值字段名
|
id
|
text
|
数据显示字段名
|
text
|
title
|
数据标题字段名
|
title
|
maxHeight
|
下拉框最大高度
|
200
|
width
|
下拉框宽度
|
跟随输入框宽度
|
allowSearch
|
是否允许搜索
|
false
|
url
|
获取数据地址
|
false
|
data
|
下拉选择数据
|
false
|
param
|
请求后台参数
|
Null
|
method
|
请求后台方法:GET、POST
|
GET
|
select
|
选择后触发方法
|
false
|
示例:
$(‘#customerId‘).lrselect({
url: top.$.rootUrl + ‘/LR_CRMModule/Customer/GetList‘,
text: ‘F_FullName‘,
value: ‘F_CustomerId‘, allowSearch: true, maxHeight: 400
});
三、数据字典下拉选择框
方法:$(‘#‘+id).
lrDataItemSelect (op);
参数
|
说明
|
默认
|
code
|
字典编码
|
|
allowSearch
|
是否允许搜索
|
false
|
select
|
选择后触发方法
|
false
|
示例:
$(‘#F_Process‘).lrDataItemSelect({
code: ‘Process‘ });
四、数据源下拉选择框
参数
|
说明
|
默认
|
value
|
数据值字段名
|
id
|
text
|
数据显示字段名
|
text
|
title
|
数据标题字段名
|
title
|
maxHeight
|
下拉框最大高度
|
200
|
width
|
下拉框宽度
|
跟随输入框宽度
|
allowSearch
|
是否允许搜索
|
false
|
select
|
选择后触发方法
|
false
|
方法:$(‘#‘+id). lrDataSourceSelect (op);
示例:
$(‘#F_text‘).lrDataSourceSelect({
code: ‘userdata‘,
value:
‘f_userid‘, text: ‘f_realname‘ }
);
五、树形插件
方法:$(‘#‘+id).lrtree(op);
参数
|
说明
|
默认
|
method
|
请求后台方法:GET、POST
|
GET
|
url
|
请求后台地址
|
false
|
param
|
请求后台参数
|
Null
|
data
|
数据[{id,
|
[]
|
text,显示数据
value,选中值
showcheck,bool,是否显示多选框
checkstate,int,选中状态
0 未选中 1 选中
hasChildren,bool,是否有子节点
isexpand,bool,是否展开
complete,bool,数据是否加载完全,
ChildNodes,[]}]子节点数据
|
isAllExpand
|
是否所以节点都展开
|
false
|
nodeClick
|
点击事件
|
|
nodeCheck
|
选中事件
|
|
示例:
$(‘#companyTree‘).lrtree({
url:
top.$.rootUrl + ‘/LR_OrganizationModule/Company/GetTree‘,
param: { parentId: ‘0‘ },
nodeClick: page.treeNodeClick
});
六、获取表单数据
方法:$(‘#‘+id).
lrGetFormData(keyvalue);
说明:返回数据为 json 数据{id:value,id:value}
七、设置表单数据
方法:$(‘#‘+id). lrSetFormData
(json);
说明: json 数据{id:value,id:value}
八、验证表单输入字段
方法:$(‘#‘+id). lrValidform();
说明:成功返回 true,失败返回 false
九、弹层插件
方法:learun.
layerForm(op)
参数
|
说明
|
默认
|
Id
|
窗体
id
|
Null
|
title
|
窗体标题
|
系统窗口
|
width
|
窗体宽
|
550
|
height
|
窗体高
|
400
|
url
|
窗口地址
|
error
|
btn
|
按钮名称
|
[‘确认‘, ‘关闭‘]
|
callBack
|
第一个按钮点击回调函数
|
|
maxmin
|
窗体是否允许最大最小
|
|
end
|
窗体关闭后执行
|
|
十、弹层选择框插件
方法:$(‘#‘+id).
lrformselect (op)
参数
|
说明
|
默认
|
placeholder
|
占位符
|
请选择
|
icon
|
选择图标
|
‘fa-plus‘
|
layerUrl
|
弹框页面地址
|
false
|
layerParam
|
向弹出页面传递的参数
|
false
|
layerUrlW
|
弹框宽度
|
600
|
layerUrlH
|
弹框高度
|
400
|
dataUrl
|
将选中项
ID 转换成 text 接口地址
|
null
|
select
|
选择事件
|
false
|
示例:
$(‘#user).lrformselect({
layerUrl:
top.$.rootUrl + ‘/LR_OrganizationModule/User/SelectForm‘,
layerUrlW: 800,
layerUrlH: 520,
dataUrl: top.$.rootUrl + ‘/LR_OrganizationModule/User/GetListByUserIds‘
});
十一、树型表格选择框插件
方法:$(‘#‘+id).
lrlayerselect (op)
placeholder
|
占位符
|
请选择
|
icon
|
选择图标
|
‘fa-plus‘
|
treeCode
|
左侧树数据源编码
|
|
treeParentId
|
树型数据父级字段
ID
|
|
treeValueId
|
树型数据值字段
ID
|
|
treeTextId
|
树型数据文本字段
ID
|
|
dataCode
|
右侧列表数据源编码
|
|
dataTreeId
|
左侧树点击节点时触发指定字段查询
|
|
dataValueId
|
值字段名
|
|
dataTextId
|
显示名称字段名
|
|
headData
|
表格列数据
|
|
select
|
选择事件
|
false
|
isMultiple
|
是否允许多选
|
false
|
示例:
$(‘#select6‘).lrlayerselect({
treeCode: ‘dataitemc‘,
treeParentId: ‘f_parentid‘, treeValueId: ‘f_itemid‘,
treeTextId: ‘f_itemname‘,
dataCode: ‘dataitem‘, dataTreeId: ‘f_itemid‘,
dataValueId: ‘f_itemdetailid‘, dataTextId: ‘f_itemname‘,
grid: [
{ label: ‘项目名‘, name: ‘f_itemname‘, width: 175, align:
‘left‘ },
{ label: ‘项目值‘, name: ‘f_itemvalue‘, width: 175, align:
‘left‘ },
{ label: "备注",
name: "f_description", width: 200,
align: "left" }
],
select: function
(values, texts) {
}
});
十二、表格选择框插件
方法:$(‘#‘+id).
lrGirdSelect (op)
参数
|
说明
|
默认
|
placeholder
|
占位符
|
请选择
|
icon
|
选择图标
|
‘fa-plus‘
|
selectWord
|
查询字段
|
‘’
|
headData
|
表格列数据
|
|
value
|
选择后得到的值字段
|
|
text
|
选择后显示的字段
|
|
url
|
获取弹出表格数据的地址
|
|
param
|
参数
|
null
|
width
|
弹框宽度
|
600
|
height
|
弹框高度
|
400
|
select
|
选择事件
|
false
|
示例:
$(‘#select5‘).lrGirdSelect({
// 字段
url:
top.$.rootUrl + ‘/LR_SystemModule/DataItem/GetDetailList‘,
param: { itemCode: ‘Client_ProductInfo‘ },
selectWord: ‘F_ItemName‘, value: ‘F_ItemValue‘,
text: ‘F_ItemName‘,
headData: [{ label: "商品编号",
name: "F_ItemValue", width: 100,
align: "left" },
{ label: "商品名称", name: "F_ItemName",
width: 450, align: "left" }],
select: function (item) {
}
});
十三、表格插件
方法:$(‘#‘+id).
jfGrid(op);
参数
|
说明
|
默认
|
url
|
数据服务地址
|
|
param
|
请求参数
|
|
rowdatas
|
列表数据
|
|
datatype
|
数据类型
|
array
|
headData
|
表格列数据
|
|
isShowNum
|
是否显示序号
|
true
|
isMultiselect
|
是否允许多选
|
false
|
multiselectfield
|
多选绑定字段
|
|
isSubGrid
|
是否有子表
|
false
|
subGridRowExpanded
|
子表展开后回调函数
|
|
subGridHeight
|
子表高度
|
|
onSelectRow
|
选中一行后回调函数
|
|
onRenderComplete
|
表格加载完后调用
|
|
isPage
|
是否分页
|
false
|
sidx
|
排序字段
|
‘‘
|
sord
|
排序方式
|
ASC
|
isTree
|
是否树形显示(没有分页的情况下才支持)
|
false
|
mainId
|
关联的主键
|
id
|
parentId
|
树形关联字段
|
parentId
|
reloadSelected
|
刷新后是否还选择之前选中的,只支持单选
|
false
|
isAutoHeight
|
自动适应表格高度
|
false
|
footerrow
|
底部合计条
|
false
|
isEidt
|
是否编辑
|
false
|
minheight
|
最低高度
|
0
|
height
|
高度
|
0
|
onAddRow
|
添加一行数据后执行
|
false
|
onMinusRow
|
删除一行数据后执行
|
false
|
beforeMinusRow
|
删除一行数据前执行
|
false
|
ishide
|
是否隐藏
|
false
|
rows
|
表格每页行数
|
100
|
|