[TOC]

checked-pick-pc

pc端 选主体、部门、人员插件

安装

vue2.7 以上版本安装指令

npm i checked-pick-pc -D

vue2.7 以下版本安装指令

npm i @vue/composition-api -D
npm i checked-pick-pc -D

使用

在需要使用的组件内引入

import { departPerson } from 'checked-pick-pc'
export default {
  components: { departPerson }
}

在页面使用

<template>
  <div id="app">
    <departPerson :visible.sync="visible" v-bind="entity" @callback="handleCallback" @cancel="handleCancel">
      <template #checkedUser="{item}">
        <div class="item">{{item.name}}</div>
      </template>
    </departPerson>
  </div>
</template>
<script>
import 'checked-pick-pc/style.css'
import { departPerson } from 'checked-pick-pc'
export default {
  components: { departPerson },
  data() {
    return {
      visible: true,
      entity: {
        source: '0',
        type: '5',
        request: request,       
        businessId: '0003',
        codeType: [3],              
        multiple: true,
        // checkedArray: [
        //   { type: 1, id: '05d670c04eeb7b6c3eac074ac7787795', subjectId: '05d670c04eeb7b6c3eac074ac7787795', uid:''},
        //   { type: 1, id: '3577dfcafee9466baf6d34a002a8664e', subjectId: '3577dfcafee9466baf6d34a002a8664e', uid:''},
        //   { type: 2, id: '0871614242828d543cf594a5388d9ad2', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 2, id: 'd91643028e6eb5d214411b451e8577e6', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 3, id: '0c1c5f405d183e5bdaf3e63073e22954', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 3, id: '30a37a1f9875e577eda4982e33b153b0', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 3, id: '45595063d9886ed106b35550ce733c25', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 4, id: 'b97b3ade07e3bcffec60c10656b0b51a', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        //   { type: 4, id: '0b5cba3593e2f688cabb9ba27c2a2a36', subjectId: '9f13a9c9c400fa6e6228848ce1f131ee', uid:''},
        // ]      
      },
    }
  },
  methods: {
    handleCallback(res) {
      console.log('callback_OK', res)
    },
    handleCancel() {
      console.log('cancel_No')
    }
  }
}
</script>

属性-Attributes

注意:

deptCode 传递时 checkedArray内必须带上 deptId

deptCodeArray 不能和 deptCode 同时存在

| 参数 | 类型 | 默认值 | 说明 | | ---- | ---- | ---- | ---- | | visible | Boolean | false | 是否显示 true-显示 false-隐藏 | | source | String | '0' | 来源 0-平台 1-流程引擎 | | type | String | '0' | 类型 0-当前公司 1-当前公司下递归分子公司（不含当前公司） 2-当前主体及递归分子公司 3-当前主体+直属分子公司（即当前公司+一级分子公司） 4-当前主体下直属分子公司（即当前公司下一级分子公司（不含当前公司）） 5-集团及递归分子公司6-集团下递归分子公司（不含集团） 7-集团直属分子公司（即集团下一级子公司不含集团） 8-集团及直属分子公司（即集团+集团下一级子公司） | | request | Object | null | axios接口请求方法 [需要包含 get post 请求方式] | | businessId | String | '' | 业务Id | | orgType | Array | [0] | 显示类型 0-组织 1-群组 2-公共群组 | | codeType | Array | [] | 可选类型 1-主体 2-部门 3-人员 5-群组 6-群组人员 | | multiple | Boolean | false | 是否多选 true-多选 false-单选 | | maxMultiple | Number | 0 | 多选时最多选择多少项 0表示无限制 | | isNoClose | Boolean | false | 是否手动关闭 true-是 false-否 | | deptCode | String | '' | 部门id | | deptCodeArray| String | '' | 多部门id | | itemCode | String | '' | 群组id | | subjectName | String | '' | 主体名称 | | isLoadingClose | Boolean | false | 手动控制关闭loading 【根据业务id存储选中数据才生效】 | | checkedArray| Array | [] | 选中的数据 [checkedinfo,checkedinfo] |

checkedinfo-对象说明

注意：type=2或4时 subjectId必填 type=3时 传入uid时 deptId、subjectId不必填 传入id时 subjectId必传

| 属性名 | 类型 | 说明 | | ---- | ---- | ---- | | type | String | 类型 1-主体 2-部门 3-人员 4-当前部门及子部门 5-群组 6-群组人员 | | id | String | id（主体、部门、人员） | | subjectId | String | 主体id | | uid | String | uid | | deptId | String | 部门id | | itemId | String | 群组id | | isDeleteNo | Boolean | 禁用删除 true-禁用 false-不禁用 |

插槽-Slots

checkedUser 选中人员区域-关闭图标前面

插槽返回值

| 属性名 | 说明 | | ---- | ---- | | id | 人员id | | name | 人员名称 | | uid | 用户id |

事件-Events

| 事件名称 | 说明 | 回调参数 | | ---- | ---- | ---- | | callback | 点击确定按钮 回调事件 | [checkedArray] | | cancel | 点击取消按钮 | 无 |

callback 事件回调参数[checkedArray]说明

| 属性名 | 类型 | 说明 | | ---- | ---- | ---- | | type | String | 类型 1-主体 2-部门 3-人员 4-当前部门及子部门 | | id | String | id（主体、部门、人员） | | uid | String | uid | | name | String | 名称 | | ancestors | String | 祖级Id | | ancestorNames | String | 祖级名称 | | phone | String | 手机号码 | | subjectId | String | 主体id | | sex | String | 性别 0-女 1-男 | | avatar | String | 头像 |