3.0.3 • Published 7 years ago
hyhc-objselector v3.0.3
hyhc-objselector
华云合创PC组件-objSelector 3.0, js原生控件 浏览器兼容性: ie9及以上版本
1.引入
//es6 import引入
import objSelect from 'hyhc-objselector';
//require引入
let objSelect = require('hyhc-objselector');
//script引入
<script src="./objSelector3.0.js"></script>使用测试
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="./objSelect.css">
<script src="./objSelect3.0.js"></script>
<style>
div.test{
position: absolute;
left : 50%;
top: 50%;
width: 200px;
transform: translate(-50%,-50%);
}
div.test a{
display: block;
padding: 20px 0;
background: #4da9df;
color: #fff;
margin: 10px 0;
text-align: center;
font-size: 13px;
}
</style>
</head>
<body>
<div class="test">
<a href="javascript:;" id="ojb1">组织架构组件-1 <br />最大:8,<br />允许选择部门： 假</a>
<a href="javascript:;" id="ojb2">组织架构组件-2 <br />最大:15,<br />允许选择部门： 真</a>
</div>
<script>
document.getElementById('ojb1').addEventListener('click',function () {
var a = objSelector({
max : 8,
allowSelectDepartment: false,
//确定
callback : function (data) {
console.log("确认：",data);
},
//取消
cancle :function () {
console.log("取消")
}
});
});
document.getElementById('ojb2').addEventListener('click',function () {
var b = objSelector({
max : 15,
allowSelectDepartment: true,
//确定
callback : function (data) {
console.log("确认：",data);
},
//取消
cancle :function () {
console.log("取消")
}
});
});
</script>
</body>
</html>Options 参数
| 参数 | 默认值 | 描述 |
|---|---|---|
title | 选择联系人 | 组件框标题 |
max | 50 | 最大选择人数 |
userId | 10053 | 用户ID |
companyId | 100206 | 公司ID |
token | 123456 | token |
allowSelectDepartment | true | 是否允许选择部门 |
host | JS内查找 | api请求主机地址,参考JS代码 |
baseUrl | JS内查找 | url前缀 |
custom | |
custom 自定义请求实例
var a = objSelector({
max : 8,
title : '请选择联系人',
allowSelectDepartment: false,
//自定义请求数据，不适合树形数据,如果传入该字段 allowSelectDepartment无效
custom : {
url : 'http://192.168.2.161:8080/plugin-attendance-record/rest/group/all/100202', //完整的URL地址，不再与baseUrl希哈
data : {}, //非必传 --默认是一个对象字面量
method : 'get', //非必传 --默认get方式
menuTitle : '签到对象', //自定义列表框上方标题
nameFeild : 'groupName', //自定义显示字段 --默认groupName
mapFeild : 'uuid' //自定义数据记录map 映射字段， --默认uuid
},
//确定
callback : function (data) {
console.log("确认：",data);
},
//取消
cancle :function () {
console.log("取消")
}
});