基于库体积的考虑，请自行引入公共css文件（如项目中已有elementui的css文件可忽略）
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.9/lib/theme-chalk/index.css">
或者使用本项目提供的css，路径为cdn路径/yiyun-components/theme/index.css
通过script方式引入（使用lib文件夹下的browser.js）
<script src="yiyun-components/lib/browser.js"></script>
// 全局变量为yiyun
npm install yiyun-components
// 全部引入
import yiyun from 'yiyun-components'
// 按需引入
import 组件名 from 'yiyun-components/lib/组件名'
选择设备：yiyun.selectEquipment()
单选：
var data = await yiyun.selectEquipment(true,'你的token',[不可选id列表],[已选择id列表])
....
或者：
yiyun.selectEquipment(true,'你的token',[不可选id列表],[已选择id列表]).then((data){
.....
})
data: {
id: '', // 设备id
code: '', // 设备标识
name: '', // 设备名称
modelId: '' // 设备型号id
modelName: '' // 设备型号名称
status: 0 // 设备状态：0.停用 1.启用
}
多选：
var data = await yiyun.selectEquipment(false,'你的token',[不可选id列表],[已选择id列表])
....
或者：
yiyun.selectEquipment(false,'你的token',[不可选id列表],[已选择id列表]).then((data){
.....
})
data: [{
id: '', // 设备id
code: '', // 设备标识
name: '', // 设备名称
modelId: '' // 设备型号id
modelName: '' // 设备型号名称
status: 0 // 设备状态：0.停用 1.启用
},{
id: '',
...
},...]
| 参数名 |
参数类型 |
说明 |
其他 |
| isOnly |
bool |
true表示单选，false表示多选（必传） |
|
| Authorization |
string |
token字符串（必传） |
|
| disable |
array |
禁用设备的id列表（可选） |
|
| selected |
array |
已选设备的id列表（可选） |
|
| 参数类型 |
说明 |
其他 |
| Array[Object] |
选择的设备对象数组 |
|
| 参数名 |
参数类型 |
说明 |
其他 |
| id |
String |
设备id |
|
| code |
String |
设备标识 |
|
| name |
String |
设备名称 |
|
| modelId |
String |
设备型号id |
|
| modelName |
String |
设备型号名 |
|
| status |
int |
设备状态：0.停用 1.启用 |
|
var yiyunMap
try {
var res = await yiyun.initMap({
id: '4YcVwbubaA3', //地图的id
container: document.getElementById('map-container'), // 用于加载地图的dom节点
Authorization: '', // 平台token
onload: function (map) { // 地图加载的回调，返回YiyunMap实例
yiyunMap = map
}
beforeDraw: (cover) => {
if (cover.type === 'area') {
cover.setConfig({
strokeColor: '#000C25',
strokeWeight: 3,
fillColor: '#000C25',
fillOpacity: 0.3
})
} else if (cover.type === 'line') {
cover.setConfig({
strokeColor: '#000C25',
strokeWeight: 6,
strokeOpacity: 1,
showDir: true
})
} else if (cover.type === 'label') {
cover.setConfig({
fontSize: 14,
fontColor: '#000C25',
content: '标签内容',
fontAngle: 30
})
} else if (cover.type === 'icon') {
cover.setConfig({
icon: 'https://aaa.bbb.ccc/ddd.png'
})
} else if (cover.type === 'comp') {
cover.setConfig({
icon: 'https://aaa.bbb.ccc/ddd.png'
})
}
},
})
} catch (e) {
}
let line
yiyunMap.updateCover(
yiyunMap.covers.areas[0],
{
strokeColor: '#000C25',
strokeWeight: 3,
fillColor: '#000C25',
fillOpacity: 0.3
}
)
line = yiyunMap.drawPolyline({
path: [[121.622797,29.866232],[121.612501,29.883464],[121.653685,29.876544]],
strokeColor: '#3389FF',
strokeWeight: 6,
strokeOpacity: 1,
showDir: true
})
yiyunMap.clearMapItem(line)
| 参数名 |
参数类型 |
说明 |
其他 |
| id |
String |
地图的ID |
必填 |
| container |
dom |
用于加载地图的dom节点 |
必填 |
| Authorization |
string |
平台token |
必填 |
| center |
Array
|
地图中心点 |
选填 例：[lng,lat],默认为地图实例所设置的中心点 |
| zoom |
int |
地图的缩放等级 |
选填 地图定点类型的缩放范围3-20，默认14；本地上传的图片类型的地图缩放范围为10-20 默认15 |
| useOldSdk |
bool |
是否使用旧版高德地图Sdk |
选填 |
| onload((map) => {}) |
func |
地图加载后回调函数，返回YiyunMap实例 |
选填 |
| beforeDraw((cover) => {}) |
function |
覆盖物绘制前的回调，返回的cover为覆盖物对象 |
选填 可以在回调用中调用cover.setConfig(config)在覆盖物渲染之前修改渲染样式 |
| afterDraw((cover) => {}) |
function |
覆盖物绘制后的回调，返回的cover为覆盖物对象 |
选填 |
| 参数名 |
参数类型 |
说明 |
| code |
String |
异常状态码 1001：dom节点不存在 1002：参数错误 1003：未找到对应的地图实例 1004：获取地图实例失败 |
| msg |
String |
异常说明 |
| 参数名 |
参数类型 |
说明 |
其他 |
| id |
String |
地图的ID |
|
| name |
String |
地图的名称 |
|
| covers |
Object |
地图覆盖物 |
查看说明 |
| moveTo(obj) |
function |
移动地图中心点 |
接收cover，或者经纬度数组[lng,lat] |
| zoomTo(int) |
function |
修改地图的zoom |
地图定点类型的缩放范围3-20，默认14；本地上传的图片类型的地图缩放范围为10-20 默认15 |
| setTheme(string) |
function |
设置地图的风格 |
'normal'（标准）、'macaron'（马卡龙）、'graffiti'(涂鸦)、'whitesmoke'(远山黛)、'fresh'(草色青)、'darkblue'(极夜蓝)、'wine'(酱籽)、'dart'(幻影黑) |
| updateCover(cover,config) |
function |
更新覆盖物在地图上的显示样式 |
接收cover以及覆盖物的渲染配置config
|
| drawPolyline(lineOption) |
function |
绘制路径,返回高德地图覆盖物实例 |
lineOption说明：{path,strokeColor,strokeWeight,strokeOpacity,showDir} path: 经纬度点集合（[[lng,lat],[lng,lat],……]）其他查看覆盖物的渲染配置
|
| clearMapItem(_mapItem) |
function |
移除地图上的覆盖物 |
接收高德地图覆盖物实例（通过drawPolyline返回获取或者各类cover中的_mapItem） |
| interact(obj) |
function |
覆盖物交互 |
接收cover
|
| getCenter() |
function |
获取地图当前的中心点 |
返回{lng,lat} |
| getZoom(digits) |
function |
获取地图当前的缩放等级 |
digits (Number) zoom级别的小数位精度 默认为2 |
| showCover(cover) |
function |
显示某一覆盖物 |
接收cover
|
| hideCover(cover) |
function |
隐藏某一覆盖物 |
接收cover
|
| 参数名 |
参数类型 |
说明 |
其他 |
| areas |
Array
|
区块覆盖物的数组 类型说明
|
|
| lines |
Array
|
路径覆盖物的数组 类型说明
|
|
| points |
Array
|
标记覆盖物的数组 类型说明
|
|
| labels |
Array
|
标签覆盖物的数组 类型说明
|
|
| components |
Array
|
组件覆盖物的数组 类型说明
|
|
| 参数名 |
参数类型 |
说明 |
| id |
String |
区块id |
| fillColor |
String |
当前区块的颜色,使用16进制颜色代码赋值 |
| name |
String |
区块名字 |
| obj |
Object |
绑定的对象实例 查看说明
|
| points |
Object |
区块的类型以及位置信息说明 |
| type |
String |
cover的类型，值为"area"。该字段只在beforeDraw返回的cover对象中赋值 |
| setConfig(config) |
function |
设置覆盖物的渲染配置。该方法只在beforeDraw返回的cover对象中赋值。查看config配置参数
|
| _mapItem |
AMap.Overlay |
高德地图覆盖物实例,该字段在afterDraw之后赋值 |
| 参数名 |
参数类型 |
说明 |
| id |
String |
区块id |
| fillColor |
String |
当前路径的颜色,使用16进制颜色代码赋值 |
| name |
String |
路径名字 |
| obj |
Object |
绑定的对象实例 查看说明
|
| points |
Object |
路径位置信息说明 |
| type |
String |
cover的类型，值为"line"。该字段只在beforeDraw返回的cover对象中赋值 |
| setConfig(config) |
function |
设置覆盖物的渲染配置。该方法只在beforeDraw返回的cover对象中赋值。查看config配置参数
|
| _mapItem |
Overlay.Polyline |
高德地图覆盖物实例,该字段在afterDraw之后赋值 |
| 参数名 |
参数类型 |
说明 |
| id |
String |
图标 |
| icon |
String |
图标的url |
| name |
String |
图标名字 |
| obj |
Object |
绑定的对象实例 查看说明
|
| points |
Object |
图标的位置信息 |
| type |
String |
cover的类型，值为"point"。该字段只在beforeDraw返回的cover对象中赋值 |
| setConfig(config) |
function |
设置覆盖物的渲染配置。该方法只在beforeDraw返回的cover对象中赋值。查看config配置参数
|
| _mapItem |
AMap.Marker |
高德地图覆盖物实例,该字段在afterDraw之后赋值 |
| 参数名 |
参数类型 |
说明 |
| id |
String |
标签id |
| content |
String |
标签内容 |
| fontColor |
String |
当前区块的颜色,使用16进制颜色代码赋值 |
| fontSize |
int |
字号 |
| fontAngle |
String |
标签旋转角度 |
| points |
Object |
标签位置信息说明 |
| type |
String |
cover的类型，值为"label"。该字段只在beforeDraw返回的cover对象中赋值 |
| setConfig(config) |
function |
设置覆盖物的渲染配置。该方法只在beforeDraw返回的cover对象中赋值。查看config配置参数
|
| _mapItem |
AMap.Marker |
高德地图覆盖物实例,该字段在afterDraw之后赋值 |
| 参数名 |
参数类型 |
说明 |
| id |
String |
组件id |
| name |
String |
组件名字 |
| points |
Object |
组件位置信息说明 |
| comp |
Object |
组件的实例的详情 查看说明
|
| type |
String |
cover的类型，值为"comp"。该字段只在beforeDraw返回的cover对象中赋值 |
| setConfig(config) |
function |
设置覆盖物的渲染配置。该方法只在beforeDraw返回的cover对象中赋值。查看config配置参数
|
| _mapItem |
AMap.Marker |
高德地图覆盖物实例,该字段在afterDraw之后赋值 |
| 参数名 |
参数类型 |
说明 |
其他 |
| strokeColor |
String |
线条颜色,使用16进制颜色代码赋值 |
适用于area、line |
| strokeWeight |
int |
线条宽度 |
适用于area、line |
| strokeOpacity |
int |
线条透明度 |
适用于line |
| fillColor |
string |
区块填充色 |
适用于area |
| fillOpacity |
int |
区块填充色透明度 |
适用于area |
| showDir |
bool |
是否显示路径的白色箭头 |
适用于line |
| fontSize |
int |
label的字体大小 |
适用于label |
| fontColor |
string |
label的字体颜色,使用16进制颜色代码赋值 |
适用于label |
| fontAngle |
int |
label的角度 |
适用于label |
| content |
string |
label的内容 |
适用于label |
| icon |
string |
图标的地址或者base64 |
适用于point、comp |
| 参数名 |
参数类型 |
说明 |
| objId |
String |
对象id |
| objAppId |
String |
实例相关的app的id |
| objAppName |
String |
实例相关的app的name |
| objError |
int |
对象的错误码 |
| objExampleId |
String |
实例id |
| objExampleName |
String |
实例名字 |
| 参数名 |
参数类型 |
说明 |
| compAppId |
String |
组件相关的app的id |
| compAppName |
String |
组件相关的app的name |
| compError |
int |
组件的错误码 |
| compIcon |
String |
组件的图标地址 |
| compId |
String |
组件Id |
| objId |
String |
对象id |
| objAppId |
String |
实例相关的app的id |
| objAppName |
String |
实例相关的app的name |
| objError |
int |
对象的错误码 |
| objExampleId |
String |
实例id |
| objExampleName |
String |
实例名字 |
工厂模型公共选择： yiyun.nodeSelect()
树结构调用方式：
try {
let res = await yiyun.nodeSelect(
{
nodeId: "指定节点id",
Authorization: "token",
isOnly: false,
selectedNode: ["选中节点id", ...]
}
)
} catch (err) {
// 取消
}
....
或者：
yiyun.nodeSelect({
nodeId: "指定节点id",
Authorization: "token",
isOnly: false,
selectedNode: ["选中节点id", ...]
}).then((res) => {
// 确定
}).catch((err) => {
// 取消
})
列表结构调用方式：
try {
let res = await yiyun.nodeSelect(
{
type: "对应层级"
nodeId: "指定节点id",
Authorization: "token",
isOnly: false,
selectedNode: ["选中节点id", ...]
}
)
} catch (err) {
// 取消
}
....
或者：
yiyun.nodeSelect({
type: "对应层级"
nodeId: "指定节点id",
Authorization: "token",
isOnly: false,
selectedNode: ["选中节点id", ...]
}).then((res) => {
// 确定
}).catch((err) => {
// 取消
})
单选 res {}
多选 res [{},...]
{
id: '节点id',
name: '节点名称',
level: '节点等级',
pid: '父节点id',
isError: '节点数据是否无效',
createTime: '创建时间',
children: '子节点集合'
}
| 参数名 |
参数类型 |
说明 |
其他 |
| type |
number |
可选，不传表示树结构，列表结构分别传：2（站点）、3（区域）、4（工作中心）、5（工作单元） |
|
| nodeId |
String |
可选，指定节点id，默认为空 |
|
| Authorization |
string |
必传，token |
|
| isOnly |
bool |
可选，true单选，false多选，默认为false |
|
| selectedNode |
array |
可选，需要选中节点的id数组 |
|
| level |
number |
树结构时，传某个级别，返回小于等于该级别的数据 |
|
| 参数类型 |
说明 |
其他 |
| Array[Object] |
选择的节点对象数组 |
|
组织架构公共选择： yiyun.organizationSelect()
组织架构单选：
yiyun.organizationSelect(
{
isOnly: true,
mode: '选择模式', // 包括人、岗位、部门
needMember: true,
isActiveMember: false,
needPost: true,
orgId: '',
authorization: '你的token',
disabled: ["禁用id",...],
selected: { id: "已选id", name: "已选名称" },
close: function () {
},
confirm: function (data) {
}
}
)
....
组织架构多选：
yiyun.organizationSelect(
{
isOnly: false,
mode: '选择模式', // 包括人、岗位、部门、人_岗位、人_部门
needMember: true,
isActiveMember: false,
needPost: true,
orgId: '',
authorization: '你的token',
disabled: ["禁用id",...],
selected: [{ id: "已选id", name: "已选名称" },...],
close: function () {
},
confirm: function (data) {
}
}
)
....
组织架构部门对应成员多选：
yiyun.organizationSelect({
isOnly: false,
mode: 'member',
orgId: '',
authorization: '你的token',
disabled: ["禁用id",...],
selected: [{ id: "已选id", name: "已选名称" },...],
deptId: '部门id', // 必须传对应部门id
state: 1,
close: function () {
},
confirm: function (data) {
}
})
....
组织架构部门对应成员单选：
yiyun.organizationSelect({
isOnly: true,
mode: 'member',
orgId: '',
authorization: '你的token',
disabled: ["禁用id",...],
selected: { id: "已选id", name: "已选名称" },
deptId: '部门id', // 必须传对应部门id
state: 1,
close: function () {
},
confirm: function (data) {
}
})
单选 res {}
多选 res [{},...]
人 {
id: '成员Id',
name: '成员名称',
headPortrait: '头像',
userId: '用户Id'
}
岗位 {
id: '岗位Id'
name: '岗位名称',
level: '岗位层级',
}
部门 {
id: '部门Id',
name: '部门名称',
code: '部门码',
parentId: '父部门Id',
}
| 参数名 |
参数类型 |
说明 |
其他 |
| isOnly |
bool |
可选，true表示单选，false表示多选，默认为多选 |
|
| mode |
string |
必传，包括人（member）、岗位（position）、部门（dept）、人-岗位（member_position）、人-部门(member&dept)~~（member_dept 不再维护）~~5种模式 |
|
| Authorization |
string |
必传，token |
|
| orgId |
string |
可选，需要查询的组织Id,空表示查询当前用户的企业，默认为空 |
|
| needMember |
bool |
不传部门id时为必传，部门下是否需要带成员 |
|
| isActiveMember |
bool |
不传部门id时为必传，是否只显示已经激活的成员 |
|
| needMember |
bool |
不传部门id时为必传，部门下是否需要带岗位 |
|
| disabled |
array |
可选，默认为空数组，数组中每一项为禁用id，当选择模式为'member&dept'时，传入{members:[{...}],depts:[{...}]},数组中对象内容为{ id: "禁用的id", name: "禁用的名称" } |
|
| selected |
array或object |
可选，单选默认为{}，多选默认为[]，单选和多选的每一项格式为{ id: "已选id", name: "已选名称" } ，当选择模式为'member&dept'时，传入{members:[{...}],depts:[{...}]},数组中对象内容保持不变 |
|
| deptId |
string |
选择部门对应的成员时传入 |
|
| state |
int |
需要选部门下的成员时,-2.全部（默认） -1.已离职 0.未入职 1.在职 |
|
| maxValue |
number |
需要选部门下的成员时,最多可选人数，不传表示全部 |
|
| message |
string |
超过maxValue时，提示的字符串，不传提示默认 |
|
| appId |
string |
应用授权权限模式时，必需传对应应用id |
|
| groupId |
string |
传对应应用id时，必须传应用下的某个组id |
|
| close |
func |
点取消按钮对应的回调 |
|
| confirm |
func |
点确定按钮对应的回调，参数为选中的项 |
|
| 参数类型 |
说明 |
其他 |
| Array[Object] |
选择的节点对象数组 |
|
| 参数类型 |
说明 |
其他 |
| Object |
对象结构为{ members: [], depts: [] } |
|
let res = await yiyun.getOrganizationOfMember(
token, // token
orgId, // 需要查询的组织Id,空表示查询当前用户的企业
isActiveMember // 是否只显示已经激活的成员，true表示只显示已激活（已绑定），false表示显示全部
)
res = [
{
id: '部门id',
parentId: '父部门Id',
code: '部门码',
name: '部门名称',
createTime: '创建时间戳',
memberCount: '当前部门下的成员数量（包括下下级）',
type: '类型：member表示人，dept表示部门',
children: [...] // 包含子部门和部门下的人，以此类推
},
...
,
{
id: '成员Id',
name: '成员名称',
headPortrait: '头像',
userId: '用户Id',
type: '类型：member表示人，dept表示部门',
}
]
let res = await yiyun.getOrganizationOfPosition(
token, // token
orgId // 需要查询的组织Id,空表示查询当前用户的企业
)
res = [
{
id: '岗位Id',
name: '岗位名称',
level: '岗位层级',
createTime: '创建时间戳',
memberCount: '岗位上的人数',
depts: [ // 相关的岗位（根据成员的部门-岗位得到的）
{ id: '岗位Id', name: '岗位名称' },
...
]
},
...
]
let res = await yiyun.getOrganizationOfDept(
token, // token
orgId // 需要查询的组织Id,空表示查询当前用户的企业
)
res = [
{
id: '部门id',
parentId: '父部门Id',
code: '部门码',
name: '部门名称',
createTime: '创建时间戳',
memberCount: '当前部门下的成员数量（包括下下级）',
children: [...] // 包含子部门列表，子部门可能存在子部门，以此类推
},
...
]
let res = await yiyun.getOrganizationOfMemberPosition(
token, // token
orgId, // 需要查询的组织Id,空表示查询当前用户的企业
isActiveMember // 是否只显示已经激活的成员，true表示只显示已激活（已绑定），false表示显示全部
)
res = [
{
id: '部门id',
parentId: '父部门Id',
code: '部门码',
name: '部门名称',
createTime: '创建时间戳',
memberCount: '当前部门下的成员数量（包括下下级）',
type: 'dept',
children: [
...,
{
id: '岗位Id',
name: '岗位名称',
level: '岗位层级',
type: 'position'
}
...,
] // 包含子部门、部门下的人及部门下的岗位，以此类推
},
...
,
{
id: '成员Id',
name: '成员名称',
headPortrait: '头像',
userId: '用户Id',
type: 'member',
}
]
let res = await yiyun.getOrganizationOfMemberByDept(
token, // token
orgId, // 需要查询的组织Id,空表示查询当前用户的企业
deptId // 部门Id
)
res = [
{
id: '成员Id',
name: '成员名称',
headPortrait: '头像',
userId: '用户Id'
},
...
]
审批流程设置组件 const { save } = yiyun.approvalFlowConfig(config)
1.10.0 新增
{
"authorization": 平台用户登入的Authorization
"appId": String appId,必填 应用id
"isAllowAll": Boolean 允许审批人员为全企业成员，false时，只有app权限人员出现在审批步骤中,默认false
"allowStepApvlType": Int32[] 允许的审批步骤中审批人类型 0 按人员 1按岗位 2 按部门岗位 8.直属上级 9.部门主管 10.连续多级主管,未设置默认[0,1,2,8,9,10]
"isAllowAddCC": Boolean 允许添加抄送人,默认false
"isAllowAddTransactor": Boolean 允许添加办理人,默认false
"isAllowSetIsAuto2": Boolean 是否允许设置自动跳过2（类型为1.按岗位、2.部门岗位 9.部门主管时：成员空自动跳过）,默认false,
"defaultIsAuto2": Boolean 自动跳过2的默认值,默认false,
"isAllowSetIsAuto3": Boolean 是否允许设置自动跳过3，审批人与发起人为同一人时的处理（类型 9.部门主管 10.连续多级部门主管）,默认false,
"defaultIsAuto3": Boolean 自动跳过3的默认值,默认false,
"isAllowSetMemberSignType": Boolean 是否允许设置会签、或签（类型0.按人员,1按岗位, 2 按部门岗位, 4.发起人自选, 5.审批人自选, 9.部门主管, 10.连续多级部门主管）,默认false,
"defaultMemberSignType": Int32 设置会签、或签的默认值 0.或签 1.会签,默认0,
"flowId":String 流程id（有值时，表示修改）,
"containerId": String 组件容器id,
"onSuccess": Function, 成功时回调, (flowId) => {}
}
{
save: (beforeSave:Function,可选,方法参数为步骤列表,返回false或Promise.reject()可阻止保存) => {},保存流程，成功则调用配置中的onSuccess
}
插件内部逻辑与审批一样，根据插件调用参数显示/隐藏部分设置功能和设置默认值
