小狐狸和小兔子

前言在做组织架构的时候，有一个问题，当同一个人位于多个部门，担任不同职务，这时候在部门员工树上的体现就会出现多次，这是合理的，但是当我们选人的时候，就会发现勾选了相同的人就应该全部勾选上，反之，取消亦然，这里的筛选用的是的基于ant-design-vue中a-tree的搜索功能代码，感谢这个之前用elementUI的时候也有这个需求，那时候代码写了有一些了，但还是没有弄出来，现在弃用了ElementUI，换成了Ant Design Vue，在陆续完成其他功能后，抽了点时间重新思考了下，组织架构多人的问题

elementui el-tree 关于菜单权限选择的问题，如图，比如系统设置下有用户管理、角色管理、组织架构管理，现在分配权限只勾选了如图所示权限，我们先将数据保存到后台// 保存权限设置验证// 获取所有选中的节点const checkeds = this.$refs.tree.getCheckedKeys();// 获取目前半选中节点const checkedParent = this.$refs.tree.getHalfCheckedKeys();// 合并父子节点，避免菜单显示逻辑错误

使用Vue时，我们前端如何处理后端返回的文件流首先后端返回流，这里我把流的动作拿出来了，我很多地方要用 /** * 下载单个文件 * * @param docId */ @GetMapping("/download/{docId}") public void download(@PathVariable("docId") String docId, HttpServletResponse re

关于树排序，自己也许是跟这个有点缘分把，前后陆续写了几个不同版本的拖拽排序，在这里做一个归纳，后续如果有在更新也会同步更新组件地址z-TreezTree通用拖拽排序，实时保存数据库，批量更新部分节点ElementUI / El-TreeElementUI El-Tree 拖拽排序方法（通用）Ant Design Vue / A-Treeantd-vue a-tree拖拽排序方法（通用）注：以上方式数据库表结构都有核心的 ID、PID、ORDER/SORT 三个

最近因为仿钉钉做内部IM，头觉得ElementUI功能有点简单了，不太适合当前业务需求，于是舍弃了，换成了 Ant Design Vue，这下好，之前做的功能全部重新修改…没办法，谁让人生就是这样改来改去，推掉重来在修改部门的时候，原本的组织架构拖拽排序并实时后台存储从el-tree 换成了 a-tree 后，之前的代码不能用了，但是思路大体还是一致，然后我找了找a-tree 的节点规律以及官方文档，自己重写了一个，原则上还是以尽可能的少改动数据为优先首先我们的Vue文件声明如下（由于文件内容多，

最近在模仿钉钉，做一个企业内部沟通管理软件，技术使用了 Ant Design Vue 、Electron，功能主要有聊天、文档、通讯录、工作台，对于钉钉的上传文件，既有单个文件，也有文件夹，如图于是自己摸索着也实现了一个，直接上代码<a-upload ref="upload" class="dd-display-inline" :show-upload-list="false" :directory="isDirectory" :open-file-dialog-on-clic

前面那篇选中默认节点，有朋友留言说能不能支持自定义节点，自己想了想认为可行，思路主要利用el-tree 的current-node-key 和highlight-current属性，如图<el-tree :data="deptTree" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode"

最近在把旧版本的ztree部门排序完成后，详情见 zTree通用拖拽排序寻思着把新版本的el-tree也给加入排序功能，毕竟一碗水要端平（功能都是自己写的。。。），由于二者表结构也类似，核心也还是那几个字段 id、pid、order，就看了下ElementUI官网的文档，便有了这么一篇，原则上还是以尽可能的少改动数据为优先首先我们的Vue文件声明如下（由于文件内容多，只贴关键代码），主要加入了draggable属性和node-drop事件，支持拖拽<el-tree :data="deptTr

任何事物都无法抗拒吞食一切的时间。——泰戈尔上一篇写到用el-tree实现触发部门管理的默认点击事件，但是当我们的部门名称过长时候发现展示效果不尽人意，查看文档后只能自己间接来实现了，借助el-tooltip和el-tree的自定义内容，以下是关于自定义内容的两种实现可以通过两种方法进行树例程内容的自定义：render-content和范围槽。使用render-content指定渲染函数...

如果你浪费了自己的年龄，那是挺可悲的。因为你的青春只能持续一点儿时间——很短的一点儿时间。 —— 王尔德前言最近工作使用Vue+Element UI来进行开发，遇到部门树功能的时候选择了el-tree组件来展示，功能都完成了，但需要在加载完成后默认点击第一个节点，从而查询右侧对应的部门人员信息，但官方没有提供默认触发node-click事件，通过Google找到相关答案，代码如下watc...

Vue 入门之安装（Mac）Step 1安装npm，npm全称为Node Package Manager，是一个基于Node.js的包管理器brew install node//安装nodenode -v//查看版本npm -v//与node同步安装Step 2切换国内淘宝源，安装cnpmnpm install -g cnpm --registry=https://regi...