UserSelector人员选择器.md

+
+**一、使用说明及示例**
+1.  **人员选择器地址：console_user_selector_url(eg:https://devel.ketanyun.cn/console/userselector)**  
+
+2.  **从[postMessage.js](uploads/041422a1474a18fec20034501d4374f8/postMessage.js)中引入DesignerFactory, Designer作为数据传递工具**
+
+3.  **示例** [UseSelector.zip](uploads/8baaff234cd1ced5766f1ca614b6713b/UseSelector.zip)
+
+
+
+**二、参数说明**
+|参数名|类型|说明|
+|:----|:----- |-----   |
+|ismultiple|Boolean  |是否支持多选 默认true   |
+|scanway|Array  | 人员选择器可选类型：人员，岗位，组织机构，群组（按先后顺序排列）。可选：[{value:"user",lable:"人员"},{value:"post",lable:"岗位"},{value:"dept",lable:"组织机构"},{value:"group",lable:"群组"}]   |
+|outputway|String   | 人员选择器辅助信息（如人的姓名，组织机构，岗位名称等信息，与scanway匹配使用）可选："user,dept,post"    |
+|inputdata|String   | 已选数据，已选人员进行回显，仅支持userFilter 格式 [userFilter](https://github.com/infoplus/docs/wiki/UserFilter)   |
+|themecolor|String   | 主题颜色|
+|ispostclassify|Boolean  | 按岗位类型分类展示 默认false  |
+|isdeptclassify|Boolean  | 按组织类型分类展示 默认false  |
+|parenttoken|String   | 使用父级的token   |
+|needallperson|Boolean  | 是否开启“所有人员”选项  默认false|
+
+
+
+
+**三、初始化选择器(init,load,save)**
+```javascript
+// mounted使用人员选择器前 
+DesignerFactory.init(true);
+Designer.load = this.designerLoad();
+Designer.save = this.designerSave();
+// metheds 
+designerLoad() {
+ let that = this;
+ let load = () => {
+ //入参
+ let _source = {
+   ismultiple:true,
+   scanway:[{
+            value:"user",
+            label:"人员"
+   }],
+   outputway: "user",
+   inputdata:"",
+   themecolor:"",
+   ispostclassify:false,
+   isdeptclassify:false,
+   parenttoken:'',
+   needallperson:false,
+ };
+ let designerSource = {
+   source: _source,
+   timestamp: new Date().getTime(),
+   data: "",
+   dataUpdate: true
+  }
+  return designerSource;
+ };
+ return load;
+}
+```
+**四、父页面打开人员选择器(open)**
+```javascript
+    designerOpen() {
+      let name = this.$global.uuidv1();//为打开的人员选择器创建一个独一无二的name
+      let url = this.$store.state.console_user_selector_url;//来自环境变量，参见1
+      DesignerFactory.open(url,name);
+    }
+```
+**五、人员选择器内确认已选事件，关闭人员选择器并返回已选数据到该方法**
+```javascript
+    designerSave() {
+         let that = this;
+         let save = (name, source, timestamp, force) => {
+            console.log(source)
+              return true;
+         };
+    return save;
+    }
+```  
+
+**六、数据结构确认已选后输出数据结构**
+  
+```javascript
+{
+    //标准输出
+    "userfilter": "::useropenid1,::useropenid2",
+    //辅助输出
+    "users": [
+        {
+            "id": "userid",
+            "account": "useraccount",
+            "username": "username",
+            "openid": "useropenid1",
+            "name": "张三"
+        },
+        {
+            "id": "userid",
+            "account": "useraccount",
+            "username": "username",
+            "openid": "useropenid2",
+            "name": "张四"
+        }
+    ],
+    "rules": [
+        {
+            "filter": "::useropenid1",
+            "text": "张三"
+        },
+        {
+            "filter": "::useropenid2",
+            "text": "张四"
+        }
+    ]
+}
+```
\ No newline at end of file