open-index/open-npm huggingface dataset:
npm package: @scenetechnology/cj_orgpicker
Description: 组织选择组件
Latest version: 0.0.21

# cj_orgpicker

## 项目概述

cj_orgpicker 是一个基于 Vue3 和 Element Plus 的组织选择组件。该组件提供了部门和用户的多选功能，支持树形结构展示，可用于组织架构人员选择等场景。

## 安装说明

### 环境要求
- Node.js (建议 v16 或更高版本)
- Vue 3.x
- Element Plus

### 安装步骤

1. 使用npm安装组件：
```bash
npm install @scenetechnology/cj_orgpicker --legacy-peer-deps
```

2. 在main.js中引入组件：
```javascript
import cj_orgpicker from '@scenetechnology/cj_orgpicker'
import '@scenetechnology/cj_orgpicker/dist/cj_orgpicker.css'

app.use(cj_orgpicker)
```

## 组件说明
cj_orgpicker 组件提供以下主要功能：
- 支持部门和用户的树形展示和选择
- 支持多选功能
- 支持搜索过滤

## 属性配置

### 基础属性
| 属性名 | 说明 | 类型 | 默认值 | 是否必填 |
| --- | --- | --- | --- | --- |
| title | 对话框标题 | String | '请选择' | 否 |
| type | 选择器类型，可选值：'org'、'user'、'dept'、'deptpost'、'role'、'range'、'dept_user' | String | 'org' | 否 |
| multiple | 是否多选 | Boolean | false | 否 |
| selected | 已选中的项 | Array | [] | 否 |
| show | 是否显示对话框 | Boolean | false | 否 |
| all_project | 是否显示所有项目 | Boolean | true | 否 |

### type 类型说明
| type值 | 说明 |
| --- | --- |
| org | 选择所有类型（部门、岗位、人员均可选） |
| user | 仅选择人员，部门和岗位节点不可选 |
| dept | 仅选择部门，过滤掉岗位和人员节点 |
| deptpost | 仅选择部门和岗位，过滤掉人员节点 |
| role | 角色/岗位下的人员选择，简化UI |
| range | 范围选择，行为与role一致 |
| dept_user | 混合选择模式：部门和岗位为**单选**，人员为**多选**。常用于需要固定归属部门但允许指派多个执行人的场景。 |

## 事件
| 事件名 | 说明 | 回调参数 |
| --- | --- | --- |
| selectOk | 点击确定按钮时触发 | (value: array) 当前选中的值 |
| selectClose | 关闭对话框时触发 | - |

## 使用示例
```vue
<template>
  <cj_orgpicker
    v-model:show="showPicker"
    title="选择组织"
    type="org"
    :multiple="true"
    :selected="selectedItems"
    @selectOk="handleSelectOk"
    @selectClose="handleSelectClose"
  />
</template>

<script setup>
import { ref } from 'vue'

const showPicker = ref(false)
const selectedItems = ref([])

const handleSelectOk = (value) => {
  console.log('选中的项：', value)
  selectedItems.value = value
  showPicker.value = false
}

const handleSelectClose = () => {
  showPicker.value = false
}
</script>
```

## 注意事项
1. 组件依赖于Element Plus，使用前请确保已正确安装和配置Element Plus
2. 多选模式（`multiple: true`）下，可以同时选择多个部门或用户。但在 `dept_user` 模式下，即便开启多选，部门和岗位依然遵循单选逻辑。
3. 搜索功能支持按名称搜索。
npm run build:lib //打包 记得改版本号

npm publish --access public //发布
npm package: @scenetechnology/person_msg
Description: 人员信息组件vue3
Latest version: 0.0.39

# cj_person_msg

#### Description
{**When you're done, you can delete the content in this README and update the file with details for others getting started with your repository**}

#### Software Architecture
Software architecture description

#### Installation

1.  xxxx
2.  xxxx
3.  xxxx

#### Instructions

1.  xxxx
2.  xxxx
3.  xxxx

#### Contribution

1.  Fork the repository
2.  Create Feat_xxx branch
3.  Commit your code
4.  Create Pull Request


#### Gitee Feature

1.  You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
2.  Gitee blog [blog.gitee.com](https://blog.gitee.com)
3.  Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
4.  The most valuable open source project [GVP](https://gitee.com/gvp)
5.  The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
6.  The most popular members  [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)