+
+
+
+## 演示图
+
+
+
+ 
+
+
+
+
+
+
+
+ -
+
+
-
+
+ 标签++
+
+
-
+
+ approval-opinion2++
+
+
-
+
+ 文件夹设置++
+
+
-
+
+ 班型设置++
+
+
-
+
+ 设置-界面设置++
+
+
-
+
+ 列表空空++
+
+
-
+
+ 刷子++
+
+
-
+
+ 25单据++
+
+
-
+
+ 211铃铛++
+
+
-
+
+ 喇叭++
+
+
-
+
+ 章++
+
+
-
+
+ 交接情况++
+
+
-
+
+ 编辑++
+
+
-
+
+ 审核++
+
+
-
+
+ 更新日志++
+
+
-
+
+ 菜单管理++
+
+
-
+
+ 按钮管理++
+
+
-
+
+ 计划看板++
+
+
-
+
+ 合同阶段档案++
+
+
-
+
+ 存货档案++
+
+
-
+
+ 客户档案++
+
+
-
+
+ 拦截日志++
+
+
-
+
+ 权限管理++
+
+
-
+
+ 发票管理++
+
+
-
+
+ 考勤管理++
+
+
-
+
+ 流程管理++
+
+
-
+
+ 供应商档案++
+
+
-
+
+ 任务审核++
+
+
-
+
+ 图标库++
+
+
-
+
+ 三方系统++
+
+
-
+
+ 数据字典++
+
+
-
+
+ 我的计划++
+
+
-
+
+ 收款管理++
+
+
-
+
+ 商机++
+
+
-
+
+ 日志审核++
+
+
-
+
+ 任务下发++
+
+
-
+
+ 我的日志++
+
+
-
+
+ 线索++
+
+
-
+
+ 我的任务++
+
+
-
+
+ 业务员指标设置++
+
+
-
+
+ 项目新增++
+
+
-
+
+ 销售合同++
+
+
-
+
+ 用户反馈++
+
+
-
+
+ 用车管理++
+
+
-
+
+ 项目阶段计划++
+
+
-
+
+ 消息记录++
+
+
-
+
+ 用户管理++
+
+
-
+
+ 项目问题++
+
+
-
+
+ 项目清单++
+
+
-
+
+ 项目查看++
+
+
-
+
+ 收藏网址++
+
+
-
+
+ 员工关怀++
+
+
-
+
+ 组织机构++
+
+
-
+
+ 在线人数++
+
+
-
+
+ 组织架构++
+
+
-
+
+ bug管理++
+
+
-
+
+ 定时任务++
+
+
-
+
+ 单据管理++
+
+
-
+
+ 操作日志++
+
+
-
+
+ 初始化设置++
+
+
-
+
+ 登录日志++
+
+
-
+
+ 镂空++
+
+
+
+ +第一步：拷贝项目下面生成的
+
+ Unicode 引用
++ +
Unicode 是字体在网页端最原始的应用方式，特点是：
+-
+
- 支持按字体的方式去动态调整图标大小，颜色等等。 +
- 默认情况下不支持多色，直接添加多色图标会自动去色。 +
++注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）
+
Unicode 使用步骤如下：
+第一步：拷贝项目下面生成的 @font-face
+@font-face {
+ font-family: 'iconfont';
+ src: url('iconfont.woff2?t=1695173268309') format('woff2'),
+ url('iconfont.woff?t=1695173268309') format('woff'),
+ url('iconfont.ttf?t=1695173268309') format('truetype');
+}
+第二步：定义使用 iconfont 的样式
+.iconfont {
+ font-family: "iconfont" !important;
+ font-size: 16px;
+ font-style: normal;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+第三步：挑选相应图标并获取字体编码，应用于页面
+
+<span class="iconfont">3</span>
+
+ ++"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。
+
+
+ -
+
+
-
+
+ + 标签 ++.icon-biaoqian ++
+
+
-
+
+ + approval-opinion2 ++.icon-approval-opinion2 ++
+
+
-
+
+ + 文件夹设置 ++.icon-wenjianjiashezhi ++
+
+
-
+
+ + 班型设置 ++.icon-banxingshezhi ++
+
+
-
+
+ + 设置-界面设置 ++.icon-shezhi-jiemianshezhi ++
+
+
-
+
+ + 列表空空 ++.icon-shiliangzhinengduixiang- ++
+
+
-
+
+ + 刷子 ++.icon-fl-shuazi ++
+
+
-
+
+ + 25单据 ++.icon-danju ++
+
+
-
+
+ + 211铃铛 ++.icon-lingdang ++
+
+
-
+
+ + 喇叭 ++.icon-laba ++
+
+
-
+
+ + 章 ++.icon-zhang ++
+
+
-
+
+ + 交接情况 ++.icon-jiaojieqingkuang ++
+
+
-
+
+ + 编辑 ++.icon-bianji ++
+
+
-
+
+ + 审核 ++.icon-shenhe1 ++
+
+
-
+
+ + 更新日志 ++.icon-gengxinrizhi ++
+
+
-
+
+ + 菜单管理 ++.icon-caidanguanli ++
+
+
-
+
+ + 按钮管理 ++.icon-anniuguanli ++
+
+
-
+
+ + 计划看板 ++.icon-jihuakanban ++
+
+
-
+
+ + 合同阶段档案 ++.icon-hetongjieduandangan ++
+
+
-
+
+ + 存货档案 ++.icon-cunhuodangan ++
+
+
-
+
+ + 客户档案 ++.icon-kehudangan ++
+
+
-
+
+ + 拦截日志 ++.icon-lanjierizhi ++
+
+
-
+
+ + 权限管理 ++.icon-quanxianguanli ++
+
+
-
+
+ + 发票管理 ++.icon-fapiaoguanli ++
+
+
-
+
+ + 考勤管理 ++.icon-kaoqinguanli ++
+
+
-
+
+ + 流程管理 ++.icon-liuchengguanli ++
+
+
-
+
+ + 供应商档案 ++.icon-gongyingshangdangan ++
+
+
-
+
+ + 任务审核 ++.icon-renwushenhe ++
+
+
-
+
+ + 图标库 ++.icon-tubiaoku ++
+
+
-
+
+ + 三方系统 ++.icon-sanfangxitong ++
+
+
-
+
+ + 数据字典 ++.icon-shujuzidian ++
+
+
-
+
+ + 我的计划 ++.icon-wodejihua ++
+
+
-
+
+ + 收款管理 ++.icon-shoukuanguanli ++
+
+
-
+
+ + 商机 ++.icon-shangji ++
+
+
-
+
+ + 日志审核 ++.icon-rizhishenhe ++
+
+
-
+
+ + 任务下发 ++.icon-renwuxiafa ++
+
+
-
+
+ + 我的日志 ++.icon-woderizhi ++
+
+
-
+
+ + 线索 ++.icon-xiansuo ++
+
+
-
+
+ + 我的任务 ++.icon-woderenwu ++
+
+
-
+
+ + 业务员指标设置 ++.icon-yewuyuanzhibiaoshezhi ++
+
+
-
+
+ + 项目新增 ++.icon-xiangmuxinzeng ++
+
+
-
+
+ + 销售合同 ++.icon-xiaoshouhetong ++
+
+
-
+
+ + 用户反馈 ++.icon-yonghufankui ++
+
+
-
+
+ + 用车管理 ++.icon-yongcheguanli ++
+
+
-
+
+ + 项目阶段计划 ++.icon-xiangmujieduanjihua ++
+
+
-
+
+ + 消息记录 ++.icon-xiaoxijilu ++
+
+
-
+
+ + 用户管理 ++.icon-yonghuguanli ++
+
+
-
+
+ + 项目问题 ++.icon-xiangmuwenti ++
+
+
-
+
+ + 项目清单 ++.icon-xiangmuqingdan ++
+
+
-
+
+ + 项目查看 ++.icon-xiangmuchakan ++
+
+
-
+
+ + 收藏网址 ++.icon-shoucangwangzhi ++
+
+
-
+
+ + 员工关怀 ++.icon-yuangongguanhuai ++
+
+
-
+
+ + 组织机构 ++.icon-zuzhijigou ++
+
+
-
+
+ + 在线人数 ++.icon-zaixianrenshu ++
+
+
-
+
+ + 组织架构 ++.icon-zuzhijiagou ++
+
+
-
+
+ + bug管理 ++.icon-bugguanli ++
+
+
-
+
+ + 定时任务 ++.icon-dingshirenwu ++
+
+
-
+
+ + 单据管理 ++.icon-danjuguanli ++
+
+
-
+
+ + 操作日志 ++.icon-caozuorizhi ++
+
+
-
+
+ + 初始化设置 ++.icon-chushihuashezhi ++
+
+
-
+
+ + 登录日志 ++.icon-denglurizhi ++
+
+
-
+
+ + 镂空 ++.icon-loukong ++
+
+
+
+ +
+ font-class 引用
++ +
font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。
+与 Unicode 使用方式相比，具有如下特点：
+-
+
- 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。 +
- 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。 +
使用步骤如下：
+第一步：引入项目下面生成的 fontclass 代码：
+<link rel="stylesheet" href="./iconfont.css">
+第二步：挑选相应图标并获取类名，应用于页面：
+<span class="iconfont icon-xxx"></span>
+++" + iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。
+
+
+
+ -
+
+
-
+
+ 标签+#icon-biaoqian+
+
+
-
+
+ approval-opinion2+#icon-approval-opinion2+
+
+
-
+
+ 文件夹设置+#icon-wenjianjiashezhi+
+
+
-
+
+ 班型设置+#icon-banxingshezhi+
+
+
-
+
+ 设置-界面设置+#icon-shezhi-jiemianshezhi+
+
+
-
+
+ 列表空空+#icon-shiliangzhinengduixiang-+
+
+
-
+
+ 刷子+#icon-fl-shuazi+
+
+
-
+
+ 25单据+#icon-danju+
+
+
-
+
+ 211铃铛+#icon-lingdang+
+
+
-
+
+ 喇叭+#icon-laba+
+
+
-
+
+ 章+#icon-zhang+
+
+
-
+
+ 交接情况+#icon-jiaojieqingkuang+
+
+
-
+
+ 编辑+#icon-bianji+
+
+
-
+
+ 审核+#icon-shenhe1+
+
+
-
+
+ 更新日志+#icon-gengxinrizhi+
+
+
-
+
+ 菜单管理+#icon-caidanguanli+
+
+
-
+
+ 按钮管理+#icon-anniuguanli+
+
+
-
+
+ 计划看板+#icon-jihuakanban+
+
+
-
+
+ 合同阶段档案+#icon-hetongjieduandangan+
+
+
-
+
+ 存货档案+#icon-cunhuodangan+
+
+
-
+
+ 客户档案+#icon-kehudangan+
+
+
-
+
+ 拦截日志+#icon-lanjierizhi+
+
+
-
+
+ 权限管理+#icon-quanxianguanli+
+
+
-
+
+ 发票管理+#icon-fapiaoguanli+
+
+
-
+
+ 考勤管理+#icon-kaoqinguanli+
+
+
-
+
+ 流程管理+#icon-liuchengguanli+
+
+
-
+
+ 供应商档案+#icon-gongyingshangdangan+
+
+
-
+
+ 任务审核+#icon-renwushenhe+
+
+
-
+
+ 图标库+#icon-tubiaoku+
+
+
-
+
+ 三方系统+#icon-sanfangxitong+
+
+
-
+
+ 数据字典+#icon-shujuzidian+
+
+
-
+
+ 我的计划+#icon-wodejihua+
+
+
-
+
+ 收款管理+#icon-shoukuanguanli+
+
+
-
+
+ 商机+#icon-shangji+
+
+
-
+
+ 日志审核+#icon-rizhishenhe+
+
+
-
+
+ 任务下发+#icon-renwuxiafa+
+
+
-
+
+ 我的日志+#icon-woderizhi+
+
+
-
+
+ 线索+#icon-xiansuo+
+
+
-
+
+ 我的任务+#icon-woderenwu+
+
+
-
+
+ 业务员指标设置+#icon-yewuyuanzhibiaoshezhi+
+
+
-
+
+ 项目新增+#icon-xiangmuxinzeng+
+
+
-
+
+ 销售合同+#icon-xiaoshouhetong+
+
+
-
+
+ 用户反馈+#icon-yonghufankui+
+
+
-
+
+ 用车管理+#icon-yongcheguanli+
+
+
-
+
+ 项目阶段计划+#icon-xiangmujieduanjihua+
+
+
-
+
+ 消息记录+#icon-xiaoxijilu+
+
+
-
+
+ 用户管理+#icon-yonghuguanli+
+
+
-
+
+ 项目问题+#icon-xiangmuwenti+
+
+
-
+
+ 项目清单+#icon-xiangmuqingdan+
+
+
-
+
+ 项目查看+#icon-xiangmuchakan+
+
+
-
+
+ 收藏网址+#icon-shoucangwangzhi+
+
+
-
+
+ 员工关怀+#icon-yuangongguanhuai+
+
+
-
+
+ 组织机构+#icon-zuzhijigou+
+
+
-
+
+ 在线人数+#icon-zaixianrenshu+
+
+
-
+
+ 组织架构+#icon-zuzhijiagou+
+
+
-
+
+ bug管理+#icon-bugguanli+
+
+
-
+
+ 定时任务+#icon-dingshirenwu+
+
+
-
+
+ 单据管理+#icon-danjuguanli+
+
+
-
+
+ 操作日志+#icon-caozuorizhi+
+
+
-
+
+ 初始化设置+#icon-chushihuashezhi+
+
+
-
+
+ 登录日志+#icon-denglurizhi+
+
+
-
+
+ 镂空+#icon-loukong+
+
+
+
+ +
+ Symbol 引用
++ +
这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：
+-
+
- 支持多色图标了，不再受单色限制。 +
- 通过一些技巧，支持像字体那样，通过
font-size,color来调整样式。
+ - 兼容性较差，支持 IE9+，及现代浏览器。 +
- 浏览器渲染 SVG 的性能一般，还不如 png。 +
使用步骤如下：
+第一步：引入项目下面生成的 symbol 代码：
+<script src="./iconfont.js"></script>
+第二步：加入通用 CSS 代码（引入一次就行）：
+<style>
+.icon {
+ width: 1em;
+ height: 1em;
+ vertical-align: -0.15em;
+ fill: currentColor;
+ overflow: hidden;
+}
+</style>
+第三步：挑选相应图标并获取类名，应用于页面：
+<svg class="icon" aria-hidden="true">
+ <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+**提示：** 使用该插件前确保你已经导入 `uni-popup` `uni-icons` `uni-easyinput` 插件。
+
+当前插件主要作为表单中选择器来使用，如果只是作为弹窗会出现数据状态无法重置，此时推荐使用 [`custom-tree-popup`](https://ext.dcloud.net.cn/plugin?name=custom-tree-popup) 组件。
+
+**如果在微信小程序中使用，在 `main.js` 文件中添加以下代码,2023/05/04 之前安装插件或者本地插件版本 `<=3.7.1` 需要添加**
+
+```js
+// #ifdef MP-WEIXIN
+Vue.prototype.$bus = new Vue()
+// #endif
+```
+
+**有问题可以加 QQ 群：297080738**
+
+## 优势
+
+💪：基于 `uni-popup`、 `uni-icons`、 `uni-easyinput` 插件进行开发，默认样式与 `uni-easyinput` 样式对标。
+
+⚡：全面支持懒加载应对大量数据。
+
+🚀：v-model 绑定数据、数据回显、移除选项。
+
+⚙ ：提供更多配置项。
+
+📦：开箱即用。
+
+## Props
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| :-------------------: | :-----------------: | :----------------------------: | :----------------------------------------------------------: |
+| canSelectAll | Boolean | false | 开启一键全选功能 |
+| contentHeight | String | '500px' \| 视窗高度的75%的像素 | 弹出内选择器容器高度，为解决搜索时搜索框被顶出屏幕，监听输入框 focus 事件 动态修改弹窗内选择器容器高度 |
+| clearResetSearch | Boolean | false | 设置为 `true` 并且搜索之后，点击输入框清除按钮，会清空搜索内容并且会直接重置整个弹窗内树形选择器内容，默认情况下只有清除之后再次进行查询才会重置选择器 |
+| animation | Boolean | ture | 是否开启弹窗动画 |
+| is-mask-click | Boolean | true | 点击遮罩关闭弹窗 |
+| mask-background-color | String | rgba(0,0,0,0.4) | 蒙版颜色，建议使用 rgba 颜色值 |
+| background-color | String | none | 主窗口背景色 |
+| safe-area | Boolean | true | 是否适配底部安全区 |
+| **choseParent** | **Boolean** | **true** | **父节点是否可选** |
+| **linkage** | **Boolean** | **false** | **父子节点是否联动** |
+| placeholder | String | 请选择 | 空状态信息提示、弹窗标题 |
+| confirmText | String | 完成 | 确定按钮文字 |
+| confirmTextColor | String | #007aff | 确定按钮文字颜色 |
+| listData | Array | - | 展示的数据 |
+| **dataLabel** | **String** | **name** | **listData 中对应数据的 label** |
+| **dataValue** | **String** | **id** | **listData 中对应数据的 value** |
+| **dataChildren** | **String** | **children** | **listData 中对应数据的 children** |
+| clearable | Boolean | false | 是否显示清除按钮，点击清除所有已选项 |
+| **mutiple** | **Boolean** | **false** | **是否可以多选** |
+| **disabled** | **Boolean** | **false** | **是否允许修改** |
+| disabledList | Array | [] | 设置某些选项为不可选，数组元素为数据 dataValue 对应的值，也可以操作数据 disabled 属性实现 |
+| search | Boolean | false | 是否可以搜索（常用于数据较多的情况） |
+| showChildren | Boolean | true | 默认展开（数据内部 showChildren 属性优先级更高，可以设置全局收起，单独展开某一条数据） |
+| border | Boolean | false | 显示引导线 |
+| **v-model/value** | **Array \| String** | **[ ]** | **已选择的值，通过 v-model 进行绑定，例如：v-model="formData.selectedList" ，根据你绑定数据的类型自动返回相同类型的数据，String 类型通过 `,` 进行分隔** |
+
+## listdata 特有属性
+
+| 名称 | 类型 | 默认值 | 说明 |
+| ------------ | ------- | ------ | ------------------ |
+| disabled | Boolean | false | 选项默认可选 |
+| visible | Boolean | true | 选项默认展示 |
+| showChildren | Boolean | true | 选项默认展示子节点 |
+
+## Events
+
+| 事件名称 | 说明 | 返回值 |
+| ------------ | ------------------------ | ------------------------------------- |
+| change | 弹窗组件状态发生变化触发 | e={show: true ｜ false,type:当前模式} |
+| maskClick | 点击遮罩层触发 | |
+| input | 选中数据或取消选中时触发 | 以数组形式返回已选择数据 |
+| selectChange | 选中数据或取消选中时触发 | 以数组形式返回已选择数据完整信息 |
+| removeSelect | 选择框移除选项时触发 | 返回对应数据的完整信息 |
+
+## 基础使用示例
+
+```vue
+
+
+