📧叮~你有一份 DevUI 12 新版本待查收~😋

DevUI是面向企业中后台产品的开源前端解决方案，其设计价值观基于"至简"、"沉浸"、"灵活"三种天然与人文相结合的理念，旨在为设计师、前端开发者提供标准的设计体系，并知足各种落地场景，是一款企业级开箱即用的产品。若是你正在开发 ToB 的工具类产品，DevUI 将是一个很不错的选择！

DevUI是一款基于DevUI Design设计规范的Angular组件库，开源于2019年，已经持续维护2年时间，沉淀了61个组件，其中有很多都是业界组件库没有的特点组件。

前面预告了两次，今天 DevUI 12 版本终于来了！升级了最新的 Angular 12 版本，让咱们一块儿来看看还有哪些新特性吧！

DevUI 12：全面支持 Angular Ivy 新引擎

新特性

1. 规范化组件间距，变动为4的倍数以更好兼容缩放等计算后的展现效果
2. Select支持多选模式下回车选中/取消选中
3. TreeSelect支持自定义已选中项模板，支持经过设置checkRelation控制父子节点的选中关系
4. Upload支持选择文件夹上传，单文件上传成功后保留文件显示
5. Cascader支持设置appendTobody
6. Button优化设置宽度后文字过长超出显示范围

Bug修复

1. TreeSelect修复多选模式下设置treeNodeIdKey后没法删除节点的问题
2. DataTable修复拖拽中容易失焦的问题
3. dragDrop修复无主题设置场景下placeholder无颜色的问题
4. Editorx中文输入法下光标定位等问题修复
5. Tree修复调用checkAllNodes方法没法改变半选状态的问题
6. TagsInput修复标签过长没法删除的问题

完整Changelog：12.0.0版本Changelog

特点组件展播

Datepicker Pro 日期选择器

组件连接：devui.design/components/…

特色介绍

Datepicker Pro组件借鉴移动端，利用鼠标滚轮操做范围选择，附加精准位置点击，减小用户的点击次数，缩短用户对于时间选择的操做路径。

功能详情

1. 组件提供了单选/范围类型，支持日期/周/月份/年份的模式，支持各类自定义模板扩展，充分知足业务复杂场景
2. 提供日历面板形式，用户可自定义嵌入各种型场景，灵活使用

更详细的介绍能够参考咱们以前的文章：

DevUI 11.4.0 发布：DatePickerPro来啦

Category Search 分类搜索

组件连接：devui.design/components/…

特色介绍

Category Search组件将高频经常使用的搜索过滤内容聚合到一个组件中，造成符合搜索过滤的操做模型，减小页面冗余的搜索过滤条件的呈现，进而下降用户的理解和使用成本

功能详情

组件提供多场景菜单模式，不一样操做模式下，菜单的展现内容不一样：

1. 默认提供类别信息
2. 存在类别选中项时，展现该类别的选项详情
3. 输入框存在搜索文本，展现符合文本的搜索分类或分类下符合条件的选项

组件提供一键清空，过滤器保存，类别过多的列表展现，最大程度兼容各种复杂的业务场景

更详细的介绍能够参考咱们以前的文章：

CategorySearch分类搜索组件初体验

Quadrant Diagram 象限图

组件连接：devui.design/components/…

特色介绍

象限图常常用于规划事件的优先级，用于分析处理数据与指望的偏离程度等。组件经过拖拽，实现对目标的位置掌控及信息呈现。

功能详情

1. 组件经过与拖拽的联动，坐标跟随线的定位，能够轻松实现标签的移动，便于使用者进行数据的变动，掌控事项的发展；
2. 组件内置了功能区域，提供标签的放大，缩小及象限图全屏的功能；
3. 灵活的样式定制能力，用户可根据本身的诉求灵活搭配。

手把手教你如何使用象限图组件

Gantt 甘特图

组件连接：devui.design/components/…

特色介绍

甘特图经常使用于多个事务进度的跟踪与管理，每一个项目以条状图的形式显示，进度与其余时间相关的进展的内在关系以可视化形式进行显示。

功能详情

1. 基本图形形式呈现，以时间维度显示每一个条目之间内在联系，支持bar、bar-parent、milestone三种不一样形式条状展现；
2. 多种交互支持：条目拖拽、进度更新、时间范围更新、快捷跳转、视图变化、全屏等；
3. 与table搭配：可与datatable搭配使用，进行更丰富维度信息呈现与管理。

致谢

感谢对DevUI组件库给予帮助的开发者们，祝你们使用愉快~

预告

DevUI Admin 2.0 版本也将在本月17号重磅发布，提供了一项神奇的黑科技，让咱们拭目以待吧！

也欢迎你们参与到DevUI生态的建设中来，目前 DevUI 开源生态主要有如下产品：

• NG DevUI：基于DevUI Design设计规范的Angular组件库
• DevUI Icons：与DevUI组件库配套使用的字体图标库
• NG DevUI Admin：开箱即用的企业级中后台管理系统
• DevUI Helper：一款VSCode插件，DevUI代码助手，给你带来丝滑的代码补全体验。
• Vue DevUI：vue3版本DevUI组件库，支持PC/Mobile（目前还在孵化中，欢迎参与建设~）