若依ruoyi框架实现目录树与查询页面联动
目录
- 1、业务场景
- 2、前端
- api.js修改
- index.vue修改
- template修改
- script修改
- 3、后端
- controller
- serviceimpl
- domain
- entity
- treeselect
1、业务场景
后管页面实现目录数与查询页面的联动,类似若依框架用户管理页面。

2、前端
api.js修改
在原有的js文件里配置目录树的查询接口
// 查询目录树的接口调用
export function areaTreeSelect() {return request({url: '/test/test/areaTree',//后端接口URLmethod: 'get'})
}
index.vue修改
template修改
<template><div class="app-container"><el-row :gutter="20"><!-- 目录树 --><el-col :span="4" :xs="24"><div class="head-container"><el-inputv-model="areaName"placeholder="请输入区划名称"clearablesize="small"prefix-icon="el-icon-search"style="margin-bottom: 20px"/></div><div class="head-container"><el-tree:data="deptOptions":props="defaultProps":expand-on-click-node="false":filter-node-method="filterNode"ref="tree"node-key="id"default-expand-allhighlight-current@node-click="handleNodeClick"/></div></el-col><!-- 查询页面 --><el-col :span="20" :xs="24"><!-- 这里将原来的查询页面代码都放里边,截止到新增修改的代码 --></el-col></el-row></div>
</template>
script修改
export default {name: "xxx",dicts: ['xxx'],components: { Treeselect },data() {return {//...// 树选项deptOptions: undefined,// 部门名称areaName: undefined}//...},// 表单参数form: {},defaultProps: {children: "children",label: "label"},watch: {// 根据名称筛选目录树areaName(val) {this.$refs.tree.filter(val);}},created() {this.getList();this.getDeptTree();//js文件配置的目录树接口},methods: {//.../** 查询下拉树结构 */getDeptTree() {areaTreeSelect().then(response => {console.log("树结构="+response.data)this.deptOptions = response.data;});},// 筛选节点filterNode(value, data) {if (!value) return true;return data.label.indexOf(value) !== -1;},// 节点单击事件handleNodeClick(data) {this.queryParams.areaCode = data.id;this.handleQuery();},//...}//...
}
3、后端
controller
/*** 获取行目录树列表*/@PreAuthorize("@ss.hasPermi('test:area:list')")@GetMapping("/areaTree")public AjaxResult areaTree(Area area){return success(commonService.selectTreeList(area));}
serviceimpl
本质上还是复用SysDept````和SysDeptServiceImpl````的代码块
@Override
public List<TreeSelectArea> selectDeptTreeList(CommonArea dept) {List<CommonArea> depts = this.selectCommonAreaList(dept);
// List<CommonArea> depts = SpringUtils.getAopProxy(this).selectCommonAreaList(dept);return buildDeptTreeSelect(depts);
}@Override
public List<CommonArea> buildDeptTree(List<CommonArea> depts) {List<CommonArea> returnList = new ArrayList<CommonArea>();List<String> tempList = depts.stream().map(CommonArea::getAreaCode).collect(Collectors.toList());for (CommonArea dept : depts){// 如果是顶级节点, 遍历该父节点的所有子节点if (!tempList.contains(dept.getParentCode())){recursionFn(depts, dept);returnList.add(dept);}}if (returnList.isEmpty()){returnList = depts;}return returnList;
}@Override
public List<TreeSelectArea> buildDeptTreeSelect(List<CommonArea> depts) {List<CommonArea> deptTrees = buildDeptTree(depts);return deptTrees.stream().map(TreeSelectArea::new).collect(Collectors.toList());
}/*** 递归列表*/
private void recursionFn(List<CommonArea> list, CommonArea t)
{// 得到子节点列表List<CommonArea> childList = getChildList(list, t);t.setChildren(childList);for (CommonArea tChild : childList){if (hasChild(list, tChild)){recursionFn(list, tChild);}}
}
/*** 得到子节点列表*/
private List<CommonArea> getChildList(List<CommonArea> list, CommonArea t)
{List<CommonArea> tlist = new ArrayList<CommonArea>();Iterator<CommonArea> it = list.iterator();while (it.hasNext()){CommonArea n = (CommonArea) it.next();if (StringUtils.isNotNull(n.getParentCode()) && n.getParentCode().equals(t.getAreaCode())){tlist.add(n);}}return tlist;
}/*** 判断是否有子节点*/
private boolean hasChild(List<CommonArea> list, CommonArea t)
{return getChildList(list, t).size() > 0;
}
domain
entity
//原来的system包继承的是TreeEntity
public class CommonArea extends TreeEntity {
}//需要确认修改为common包的BaseEntity
public class CommonArea extends BaseEntity {//切记实现children/** 子集 */private List<CommonArea> children = new ArrayList<CommonArea>();public List<CommonArea> getChildren() {return children;}public void setChildren(List<CommonArea> children) {this.children = children;}
}
treeselect
需要在common包下TreeSelect同级目录下生成自己的目录支撑对象.
package com.ruoyi.common.core.domain;/*** Treeselect树结构实体类* * @author ruoyi*/
public class TreeSelectArea implements Serializable
{private static final long serialVersionUID = 1L;/** 节点ID */private String id;/** 节点名称 */private String label;/** 子节点 */@JsonInclude(JsonInclude.Include.NON_EMPTY)private List<TreeSelectArea> children;public TreeSelectArea(){}public TreeSelectArea(CommonArea area){this.id = area.getAreaCode();this.label = area.getAreaName();this.children = area.getChildren().stream().map(TreeSelectArea::new).collect(Collectors.toList());}
}
相关文章:
若依ruoyi框架实现目录树与查询页面联动
目录1、业务场景2、前端api.js修改index.vue修改template修改script修改3、后端controllerserviceimpldomainentitytreeselect1、业务场景 后管页面实现目录数与查询页面的联动,类似若依框架用户管理页面。 2、前端 api.js修改 在原有的js文件里配置目录树的查…...
Laravel框架学习笔记——Laravel环境配置及安装(Ubuntu20.04为例)
目录引言1、安装Nginx2、安装PHP3、安装Composer4、搭建Laravel框架项目5、修改Nginx映射6、安装MySQL引言 好久没写博客了,因为个人需要, 所以要涉及到Laravel框架的学习,所以会出一系列的关于PHP的Laravel框架学习笔记,希望能够…...
模拟百度翻译-课后程序(JAVA基础案例教程-黑马程序员编著-第六章-课后作业)
【案例6-5】 模拟百度翻译 【案例介绍】 1.任务描述 大家对百度翻译并不陌生,本案例要求编写一个程序模拟百度翻译。用户输入英文之后搜索程序中对应的中文,如果搜索到对应的中文就输出搜索结果,反之给出提示。本案例要求使用Map集合实现英…...
自然语言处理(NLP)之求近义词和类比词<MXNet中GloVe和FastText的模型使用>
这节主要就是熟悉MXNet框架中的两种模型:GloVe和FastText的模型(词嵌入名称),每个模型下面有很多不同的词向量,这些基本都来自wiki维基百科和twitter推特这些子集预训练得到的。我们只需要导入mxnet.contrib中的text模块即可,这里…...
2023年CDGA考试-第13章-数据质量(含答案)
2023年CDGA考试-第13章-数据质量(含答案) 单选题 1.在导致数据质量问题的常见原因中关于数据输入问题以下描述正确的是: A.数据采集端缺乏数据质量管控 B.相同字段重复设计导致数据不一致 C.缺乏数据采集规范的制定 D.所有描述都正确 答案 D 2.数据质量计划应将其范围限…...
ASEMI高压MOS管ASE65R330参数,ASE65R330图片
编辑-Z ASEMI高压MOS管ASE65R330参数: 型号:ASE65R330 漏极-源极电压(VDS):650V 栅源电压(VGS):20V 漏极电流(ID):12.5A 功耗(P…...
LeetCode动态规划经典题目(九):子序列、子数组问题
目录 31. LeetCode674. 最长连续递增序列 32. LeetCode18. 最长重复子数组 33. LeetCode1143. 最长公共子序列 34. LeetCode1035. 不相交的线 35. LeetCode53. 最大子数组和 36. LeetCode392.判断子序列 37. LeetCode115. 不同的子序列 38. LeetCode583. 两个字符串的删…...
如何利用有限的数据发表更多的SCI论文?——利用ArcGIS探究环境和生态因子对水体、土壤和大气污染物的影响
SCI的写作和发表是科研人提升自身实力和实现自己价值的必要途径。“如何利用有限的数据发表更多的SCI论文?”是我们需要解决的关键问题。软件应用只是过程和手段,理解事件之间的内在逻辑和寻找事物之间的内在规律才是目的。如何利用有限的数据发表更多的…...
六【 SpringMVC框架】
一 SpringMVC框架 目录一 SpringMVC框架1.什么是MVC2.SpringMVC概述3.SpringMVC常见开发方式4.SpringMVC执行流程5.SpringMVC核心组件介绍6.快速构建Spring MVC程序✅作者简介:Java-小白后端开发者 🥭公认外号:球场上的黑曼巴 🍎个…...
【BBuf的CUDA笔记】八,对比学习OneFlow 和 FasterTransformer 的 Softmax Cuda实现
0x1. OneFlow/FasterTransformer SoftMax CUDA Kernel 实现学习 这篇文章主要学习了oneflow的softmax kernel实现以及Faster Transformer softmax kernel的实现,并以个人的角度分别解析了原理和代码实现,最后对性能做一个对比方便大家直观的感受到onefl…...
python 类对象的析构释放代码演示
文章目录一、类的构造函数与析构函数二、代码演示1. 引用的更迭2. 只在函数内部的类对象三、函数内部返回的类对象1. 使用全局变量 引用 函数内部的类对象一、类的构造函数与析构函数 init 函数是python 类的构造函数,在创建一个类对象的时候,就会自动调…...
Hadoop Shell常用命令
Hadoop Shell命令在管理HDFS的时候还是比较常用的,Hadoop Shell命令与shell命令极为相似,但是方便查询,在这里总结分享,大家enjoy~~ 1,cat 语法格式:hadoop fs -cat URI [URI …] 含义:将路径…...
Android中级——色彩处理和图像处理
色彩处理 通过色彩矩阵处理 色彩矩阵介绍 图像的RGBA可拆分为一个4行5列的矩阵和5行1列矩阵相乘 其中4行5列矩阵即为ColorMatrix,可通过调整ColorMatrix间接调整RGBA 第一行 abcde 决定新的 R第二行 fghij 决定新的 G第三行 klmno 决定新的 G第四行 pqrst 决定新…...
C++类和对象:类的定义、类对象的存储、this指针
目录 一. 对于面向过程和面向对象的认识 二. 类 2.1 struct关键字定义类 2.1.1 C语言中的struct关键字 2.1.2 C中的struct关键字 2.2 class关键字 2.1 使用class关键字定义类 三. 类的访问限定及封装 3.1 类的访问权限及访问限定符 3.1.1 访问权限 3.1.2 访问限定…...
代码随想录算法训练营第三十九天 | 62.不同路径,63. 不同路径 II
一、参考资料不同路径https://programmercarl.com/0062.%E4%B8%8D%E5%90%8C%E8%B7%AF%E5%BE%84.html 视频讲解:https://www.bilibili.com/video/BV1ve4y1x7Eu不同路径 IIhttps://programmercarl.com/0063.%E4%B8%8D%E5%90%8C%E8%B7%AF%E5%BE%84II.htmlhttps://progr…...
数据库复习3
一. 简答题(共1题,100分) 1. (简答题) 存在数据库test,数据库中有如下表: 1.学生表 Student(Sno,Sname,Sage,Ssex) --Sno 学号,Sname 学生姓名,Sage 出生年月,Ssex 学生性别 主键Sno 2.教师表 Teacher(Tno,Tname) --T…...
顺序表的增删查改
数据结构 是数据存储的方式,对于不同的数据我们要采用不同的数据结构。就像交通运输,选用什么交通工具取决于你要运输的是人还是货物,以及它们的数量。 顺序存储结构 包括顺序表、链表、栈和队列等。 例如腾讯QQ中的好友列表,…...
jupyter matplotlib中文乱码解决
中文乱码可能有两种情况 1. matplotlib里面有中文字体 2. 没有中文字体 查看是否有中文字体: # 查询当前系统所有字体 from matplotlib.font_manager import FontManager import subprocessmpl_fonts = set(f.name for f in FontManager().ttflist)print(all font list get f…...
Smtplib之发邮件模块
目录 创建Smtp对象 Smtp类中的方法 MIME MIMEBase MIMEBase MIMEMultipart MIMEApplication MIMEAudio MIMEImage MIMEText 实例 texthtml格式 发送带图片附件的邮件 发送带附件的邮件 含多种格式 SMTP模块 SMTP 简单传输协议,它是一组用于由源…...
Android 适配手机和平板
一、屏幕适配限定符Android 系统加载应用资源时 , 会根据当前运行应用的设备的相关属性 , 如 : 屏幕尺寸 / 屏幕像素密度 / 宽高比 / 屏幕方向 等属性 , 加载不同的屏幕适配限定符目录下的资源 ;如 : 横竖屏切换时 , res/layout-land 目录中 , 存放的是横屏布局 , res/layout-p…...
【大模型RAG】拍照搜题技术架构速览:三层管道、两级检索、兜底大模型
摘要 拍照搜题系统采用“三层管道(多模态 OCR → 语义检索 → 答案渲染)、两级检索(倒排 BM25 向量 HNSW)并以大语言模型兜底”的整体框架: 多模态 OCR 层 将题目图片经过超分、去噪、倾斜校正后,分别用…...
【杂谈】-递归进化:人工智能的自我改进与监管挑战
递归进化:人工智能的自我改进与监管挑战 文章目录 递归进化:人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管?3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...
基于uniapp+WebSocket实现聊天对话、消息监听、消息推送、聊天室等功能,多端兼容
基于 UniApp + WebSocket实现多端兼容的实时通讯系统,涵盖WebSocket连接建立、消息收发机制、多端兼容性配置、消息实时监听等功能,适配微信小程序、H5、Android、iOS等终端 目录 技术选型分析WebSocket协议优势UniApp跨平台特性WebSocket 基础实现连接管理消息收发连接…...
【2025年】解决Burpsuite抓不到https包的问题
环境:windows11 burpsuite:2025.5 在抓取https网站时,burpsuite抓取不到https数据包,只显示: 解决该问题只需如下三个步骤: 1、浏览器中访问 http://burp 2、下载 CA certificate 证书 3、在设置--隐私与安全--…...
vue3 定时器-定义全局方法 vue+ts
1.创建ts文件 路径:src/utils/timer.ts 完整代码: import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...
【git】把本地更改提交远程新分支feature_g
创建并切换新分支 git checkout -b feature_g 添加并提交更改 git add . git commit -m “实现图片上传功能” 推送到远程 git push -u origin feature_g...
解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错
出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上,所以报错,到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本,cu、torch、cp 的版本一定要对…...
用机器学习破解新能源领域的“弃风”难题
音乐发烧友深有体会,玩音乐的本质就是玩电网。火电声音偏暖,水电偏冷,风电偏空旷。至于太阳能发的电,则略显朦胧和单薄。 不知你是否有感觉,近两年家里的音响声音越来越冷,听起来越来越单薄? —…...
安宝特案例丨Vuzix AR智能眼镜集成专业软件,助力卢森堡医院药房转型,赢得辉瑞创新奖
在Vuzix M400 AR智能眼镜的助力下,卢森堡罗伯特舒曼医院(the Robert Schuman Hospitals, HRS)凭借在无菌制剂生产流程中引入增强现实技术(AR)创新项目,荣获了2024年6月7日由卢森堡医院药剂师协会࿰…...
【C++进阶篇】智能指针
C内存管理终极指南:智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...
