当前位置：首页 > news >正文

重构 cluster-db 选择器，新增限制字段 showDb 不影响原功能前提实现查询功能增量拓展

news 来源：原创 2025/8/5 18:55:23

1.为DbSelect组件新添加showDb字段 :show-db="false"时只显示集群不显示数据库信息

重构 cluster-db 选择器，新增限制字段 showDb 不影响原功能前提实现查询功能增量拓展,。保证组件**高可用性,减少冗余方法的编写,提高整体代码复用性和维护性**。

<!-- 简易版 cluster-db选择器 支持筛选，需要传递emit onChange来获取返回值 -->
<!-- 返回值为数据，第一个是 集群， 第二个是 DB：ID ["base_dms_platform","dms_main_beta:1"
] -->
<template><Cascader2v-model:model-value="selectedValue":options="filteredOptions"filterableremotehideAfterSelect:filter-method="handleFilter"@change="handleChange"></Cascader2>
</template>

<script lang="ts" setup>
import { Cascader2, OptionContent, useDebounce } from '@xhs/delight'
import { onBeforeMount, Ref, ref } from 'vue'
import { getDbByEnv } from '~/page/mysql/SQLQuery/service'

const props = defineProps<{env: stringshowDb?: boolean  // 添加 showDb 属性，控制是否显示数据库选项
}>(),{showDb: true
}

const emit = defineEmits(['onChange'])
const optionsContents: Ref<OptionContent[]> = ref([])
const filteredOptions: Ref<OptionContent[]> = ref([])

const getClusterAndDbOptions = () => {getDbByEnv({ env: props.env }).then((res) => {const databases = resconst clusters: Record<string, (typeof databases)[number][]> = {}databases.forEach((db) => {const cluster = db.clusterNameif (!clusters[cluster]) clusters[cluster] = []clusters[cluster].push(db)})// 生成下拉选项optionsContents.value = Object.entries(clusters).map(([cluster, dbs]) => ({value: cluster,label: cluster,...(props.showDb && {children: dbs.map((db: any) => ({label: db.dbname,value: db.dbname + ':' + db.id}))})}))filteredOptions.value = optionsContents.value})
}

onBeforeMount(() => {getClusterAndDbOptions()
})

const selectedValue = ref([])

const handleFilter: any = useDebounce((value: string) => {const lowerValue = value.toLowerCase()
filteredOptions.value = optionsContents.value.map((item: any) => {if (item.children) {// 过滤子节点const filteredChildren = item.children.filter((child: any) =>child.label.toLowerCase().includes(lowerValue))// 如果父节点的label匹配，保留所有子节点if (item.label.toLowerCase().includes(lowerValue)) {return { ...item, children: item.children }}// 如果有符合条件的子节点，保留父节点并更新子节点if (filteredChildren.length > 0) {return { ...item, children: filteredChildren }}} else {// 如果是单层结构直接匹配if (item.label.toLowerCase().includes(lowerValue)) {return item}}return null // 无符合条件的节点}).filter((item: any) => item !== null)
return false},{delay: 200}
)

const handleChange = () => {emit('onChange', selectedValue.value)
}
</script>

主要修改点：

将 ...(props.showDb !== false && { 简化为 ...(props.showDb && {
这样当 showDb 为 false 或 undefined 时，不会添加 children 属性
当 showDb 为 true 时，会添加 children 属性

使用方式

<!-- 只显示集群信息 -->
<DbSelect env="sit" :show-db="false"@on-change="handleTargetClusterChange"
/>

<!-- 显示集群和数据库信息（默认行为） -->
<DbSelect env="sit" @on-change="handleTargetClusterChange"
/>

重构 cluster-db 选择器，新增限制字段 showDb 不影响原功能前提实现查询功能增量拓展

1.为DbSelect组件新添加showDb字段 :show-db"false"时只显示集群不显示数据库信息重构 cluster-db 选择器，新增限制字段 showDb 不影响原功能前提实现查询功能增量拓展,。保证组件**高可用性,减少冗余方法的编写,提高整体代码复用性和维护性**。 <!-…...

编程日记 2025/8/5 18:55:23

Modbus RTU 详解 + FreeMODBUS移植（附项目源码）

文章目录前言一、Modbus RTU1.1 通信方式1.2 模式特点1.3 数据模型1.4 常用功能码说明1.5 异常响应码1.6 通信帧格式1.6.1 示例一：读取保持寄存器（功能码 0x03）1.6.2 示例二：写单个线圈（功能码 0x05）1.6.3…...

编程日记 2025/8/5 18:54:06

新闻发稿筛选媒体核心标准：影响力、适配性与合规性

1. 评估媒体影响力权威性与公信力：优先选择央级媒体，其报道常被其他平台转载，传播链条长，加分权重高。传播数据：参考定海区融媒体中心的赋分办法，关注媒体的阅读量、视频播放量等指标，如阅读…...

编程日记 2025/8/5 18:55:06

豆包：基于多模态交互的智能心理咨询机器人系统设计与效果评估——情感计算框架下的对话机制创新

豆包：基于多模态交互的智能心理咨询机器人系统设计与效果评估——情感计算框架下的对话机制创新摘要随着人工智能在心理健康领域的应用深化，本文提出一种融合情感计算与动态对话管理的智能心理咨询机器人系统架构。通过构建“用户状态-情感响应-策略生成”三层模型，结合…...

编程日记 2025/8/5 18:54:05

坐席业绩可视化分析工具

这个交互式的坐席业绩分析工具具有以下特点： 数据导入功能：支持上传 CSV 文件，自动解析并展示数据多维度分析：可按日 / 周 / 月分析业绩数据，支持切换不同业绩指标（接通时长 / 外呼次数 / 接通次数&#x…...

编程日记 2025/8/1 3:05:52

MATLAB制作柱状图与条图：数据可视化的基础利器

一、什么是柱状图与条图？ 柱状图和条图都是用来表示分类数据的常见图表形式，它们的核心目的是通过矩形的长度来比较各类别的数值大小。条图其实就是“横着的柱状图”，它们的本质是一样的：用矩形的长度表示数值大小，不同…...

编程日记 2025/8/1 3:05:50

com.fasterxml.jackson.dataformat.xml.XmlMapper把对象转换xml格式，属性放到标签＜＞里边

之前从没用过xml和对象相互转换，最近项目接了政府相关的。需要用xml格式数据进行相互转换。有些小问题，困扰了我一下下。 1.有些属性需要放到标签里边，有的需要放到标签子集。 2.xml需要加<?xml version"1.0" encoding"…...

编程日记 2025/8/5 18:52:58

在js中大量接口调用并发批量请求处理器

并发批量请求处理器 ✨ 设计目标该类用于批量异步请求处理，支持： 自定义并发数请求节拍控制（延时）失败重试机制进度回调通知 🔧 构造函数参数 new BulkRequestHandler({dataList, // 要处理的数据列表r…...

编程日记 2025/8/1 3:05:47

Azure资源创建与部署指南

本文将指导您如何在Azure平台上创建和配置必要的资源，以部署基于OpenAI的应用程序。资源组创建资源组是管理和组织Azure资源的逻辑容器。在Azure门户顶端的查询框中输入"Resource groups"（英文环境）或"资源组"（中文环境）在搜索结果中点击"资…...

编程日记 2025/8/5 18:55:07

图解gpt之神经概率语言模型与循环神经网络

上节课我们聊了词向量表示，像Word2Vec这样的模型，它确实能捕捉到词语之间的语义关系，但问题在于，它本质上还是在孤立地看待每个词。英文的“Apple”，可以指苹果公司，也可以指水果。这种一词多义的特性&…...

编程日记 2025/8/1 3:05:43

jenkins启动 service jenkins start 重启 service jenkins restart 停止 service jenkins stop jenkins安装命令切换到自己的下载目录直接用命令下载 wget http://pkg.jenkins-ci.org/redhat-stable/jenkins-2.190.3-1.1.noarch.rpm 下载直接安装 rpm -ivh jenkins-2.190.3-…...

编程日记 2025/8/5 18:51:44

android 修改单GPS，单北斗，单伽利略等

从hal层入手，代码如下： 各个类型如下： typedef enum {MTK_CONFIG_GPS_GLONASS 0,MTK_CONFIG_GPS_BEIDOU,MTK_CONFIG_GPS_GLONASS_BEIDOU,MTK_CONFIG_GPS_ONLY,MTK_CONFIG_BEIDOU_ONLY,MTK_CONFIG_GLONASS_ONLY,MTK_CONFIG_GPS_GLONASS_BEIDO…...

编程日记 2025/8/5 18:52:56

CNG汽车加气站操作工岗位职责

CNG（压缩天然气）汽车加气站操作工是负责天然气加气设备操作、维护及安全管理的重要岗位。以下是该岗位的职责、技能要求、安全注意事项及职业发展方向的详细说明： *主要职责加气操作按照规程为车辆加注CNG，检查车辆气瓶合格证…...

编程日记 2025/8/1 0:08:59

纯Java实现反向传播算法：零依赖神经网络实战

在深度学习框架泛滥的今天，理解算法底层实现变得愈发重要。反向传播(Backpropagation)作为神经网络训练的基石算法，其实现往往被各种框架封装。本文将突破常规，仅用Java标准库实现完整BP算法，帮助开发者： 1) 深入理解…...

编程日记 2025/8/5 18:55:06

springboot3 + mybatis-plus3 创建web项目实现表增删改查

Idea创建项目环境配置说明在现代化的企业级应用开发中，合适的开发环境配置能够极大提升开发效率和应用性能。本文介绍的环境配置为： 操作系统：Windows 11JDK：JDK 21Maven：Maven 3.9.xIDE：IntelliJ IDEA…...

编程日记 2025/8/5 18:55:07

多模型协同预测在风机故障预测的应用（demo）

数据加载和预处理的真实性： 下面的代码中，DummyDataset 和数据加载部分仍然是高度简化和占位的。为了让这个训练循环真正有效，您必须用您自己的数据加载逻辑替换它。这意味着您需要创建一个 torch.utils.data.Dataset 的子类，它能…...

编程日记 2025/8/5 18:51:42

韩媒聚焦Lazarus攻击手段升级，CertiK联创顾荣辉详解应对之道

近日，韩国知名科技媒体《韩国IT时报》（Korea IT Times）刊文引述了CertiK联合创始人兼CEO顾荣辉教授的专业见解，聚焦黑客组织Lazarus在Web3.0领域攻击手段的持续升级，分析这一威胁的严峻性，并探讨了提升行业…...

编程日记 2025/8/5 18:55:08

5.9-selcct_poll_epoll 和 reactor 的模拟实现

5.9-select_poll_epoll 本文演示 select 等 io 多路复用函数的应用方法，函数具体介绍可以参考我过去写的博客。先绑定监听的文件描述符 int sockfd socket(AF_INET, SOCK_STREAM, 0); struct sockaddr_in serveraddr; memset(&serveraddr, 0, sizeof(struc…...

编程日记 2025/8/5 18:52:57

图上思维：基于知识图的大型语言模型的深层可靠推理

摘要尽管大型语言模型（LLM）在各种任务中取得了巨大的成功，但它们经常与幻觉问题作斗争，特别是在需要深入和负责任的推理的场景中。这些问题可以通过在LLM推理中引入外部知识图（KG）来部分解决。在本文中&am…...

编程日记 2025/8/5 18:55:05

37-智慧医疗服务平台(在线接诊/问诊)

系统功能特点： 技术栈: springBootVueMysql 功能点: 医生端用户端管理员端医生端: 科室信息管理、在线挂号管理、预约体检管理、体检报告管理、药品信息管理、处方信息管理、缴费信息管理、病历信息管理、智能导诊管理、在线接诊患者功能 (和患者1V1沟通) 用户…...

编程日记 2025/8/1 0:08:43

【新品发布】VXI可重构信号处理系统模块系列

VXI可重构信号处理系统模块概述 VXI可重构信号处理系统模块包括了 GPU 模块，CPU 模块，射频模块、IO 模块、DSP模块、高速存储模块、交换模块，采集处理模块、回放处理模块等，全套组件为单体3U VPX架构，可自由组合到多槽…...

编程日记 2025/8/5 18:51:41

React 第三十八节 Router 中useRoutes 的使用详解及注意事项

前言 useRoutes 是 React Router v6 引入的一个钩子函数，允许通过 JavaScript 对象（而非传统的 JSX 语法）定义路由配置。这种方式更适合复杂路由结构，且代码更简洁易维护。一、基础使用 1.1、useRoutes路由配置对象 useRoute…...

编程日记 2025/8/5 18:50:21

Redhat 系统详解

Red Hat 系统深度解析：从企业级架构到核心组件一、Red Hat 概述：企业级 Linux 的标杆 Red Hat 是全球领先的开源解决方案供应商，其核心产品 Red Hat Enterprise Linux（RHEL） 是企业级 Linux 的黄金标准。RHEL 以稳…...

编程日记 2025/8/5 18:52:57

docker常用命令总结

常用命令含义docker info查看docker 服务的信息-------------------------镜像篇docker pull XXX从官网上拉取名为XXX的镜像docker login -u name登录自己的dockerhub账号docker push XXX将XXX镜像上传到自己的dockerhub账户中（XXX的命名必须是用户名/镜像名&#x…...

编程日记 2025/8/5 18:54:08

【el-admin】el-admin关联数据字典

数据字典使用一、新增数据字典1、新增【图书状态】和【图书类型】数据字典2、编辑字典值二、代码生成配置1、表单设置2、关联字典3、验证关联数据字典三、查询操作1、模糊查询2、按类别查询（下拉框） 四、数据校验一、新增数据字典 1、新增【图书状态…...

编程日记 2025/8/5 18:52:07

component ：is是什么？

问： component ：is是什么？ 是组件？ 那我们是不是就不需要自己创建组件了？还是什么意思？component ：is和什么功能是类似的，同时和类似功能相比对什么时候用component ：is…...

编程日记 2025/8/5 18:52:06

适老化洗浴辅具产业：在技术迭代与需求升级中重塑银发经济新生态

随着中国人口老龄化程度的不断加深，老年群体对于适老化产品的需求日益增长。适老化洗浴辅具作为保障老年人洗浴安全与舒适的关键产品，其发展状况备受关注。深入剖析中国适老化洗浴辅具的发展现状，并探寻助力产业发展的有效路径&#xff0…...

编程日记 2025/8/5 18:50:20

『Python学习笔记』ubuntu解决matplotlit中文乱码的问题！

ubuntu解决matplotlit中文乱码的问题！ 文章目录 simhei.ttf字体下载链接：http://xiazaiziti.com/210356.html将字体放到合适的地方 sudo cp SimHei.ttf /usr/share/fonts/(base) zkfzkf:~$ fc-list | grep -i "SimHei" /usr/local/share/font…...

编程日记 2025/8/5 18:52:56

从AI到新能源：猎板PCB的HDI技术如何定义高端制造新标准？

2025年，随着AI服务器、新能源汽车、折叠屏设备等新兴领域的爆发式增长，高密度互连（HDI）电路板成为电子制造业的“必争之地”。HDI板凭借微孔、细线宽和高层间对位精度，能够实现电子设备的高集成化与微型化，…...

编程日记 2025/8/5 18:52:09

汽车制造行业的数字化转型

嘿，大家好！今天来和大家聊聊汽车制造行业的数字化转型，这可是当下非常热门的话题哦！ 随着科技的飞速发展，传统的汽车制造行业正经历着一场深刻的变革。数字化技术已经不再是“锦上添花”，而是车企能否在未…...

编程日记 2025/8/5 18:51:41

Redis 常见数据类型

Redis 常见数据类型一、基本全局命令详解与实操 1. KEYS 命令功能：按模式匹配返回所有符合条件的键（生产环境慎用，可能导致阻塞）。语法： KEYS pattern 模式规则： h?llo：匹配 hello, ha…...

编程日记 2025/8/5 18:52:06

【计算机网络-传输层】传输层协议-TCP核心机制与可靠性保障

编程日记 2025/8/5 18:50:22

对golang中CSP的理解

概念： CSP模型，即通信顺序进程模型，是由英国计算机科学家C.A.R. Hoare于1978年提出的。该模型强调进程之间通过通道（channel）进行通信，并通过消息传递来协调并发执行的进程。CSP模型的核心思想是“不要通过…...

编程日记 2025/8/5 18:52:07

嵌入式openharmony标准系统中HDF框架底层原理分析

1、案例简介该程序是基于OpenHarmony标准系统编写的基础外设类：简易HDF驱动。 2、基础知识 2.1、OpenHarmony HDF开发简介 HDF（Hardware Driver Foundation）驱动框架，为驱动开发者提供驱动框架能力，包括驱动加载、驱动服务管理、驱动消息机制和配置管理。旨在构建统一…...

编程日记 2025/8/5 18:51:40

238.除自身以外数组的乘积

给你一个数组，求出第 i 个元素以外的数组元素的乘积，不能使用除法，且时间复杂度O(n), 对于一个数，如果知道了前缀元素的乘积和后缀元素的乘积，就知道了这个元素以外的数组元素的乘积，所以现在的问题是如何…...

编程日记 2025/8/5 18:54:07

AI文旅|暴雨打造旅游新体验

今年"五一"假期，全国文旅市场迎来爆发式增长，从丈崖瀑布的磅礴水雾到城市商区的璀璨霓虹，从山野民宿的静谧悠然到主题乐园的欢腾喧嚣，处处人潮涌动。在这火热的景象背后，一股“无形之力”正悄然改变旅游体验…...

编程日记 2025/8/5 18:54:07

学习心得《How Global AI Policy and Regulations Will Impact Your Enterprise》Gartner

AI时代来临，然而与之对应的是海量的数据的安全性和合规性如何保障，如何平衡个人与智能体的利益，恰巧，最近Gartner发布了《How Global AI Policy and Regulations Will Impact Your Enterprise》，我们就其中的观点一起进行探讨。战略规划假设我们首先关注的是关键的战略…...

编程日记 2025/8/5 18:50:19

JAVA将一个同步方法改为异步执行

目的： 这么做的目的就是为了使一个高频率执行的方法能不阻塞整个程序，将该方法丢入到线程池中让线程去做异步执行，既提高了程序整体运行速度，也使得在高并发环境下程序能够更加健壮（同步执行可能会使得请求堆积以致系…...

编程日记 2025/8/5 18:51:43

对遗传算法思想的理解与实例详解

目录一、概述二、实例详解 1）问题描述与分析 2）初始化种群 3）计算种群适应度 4）遗传操作 5）基因交叉操作 6）变异操作三、计算结果四、总结一、概述遗传算法在求解最优解的问题中最为常用&a…...

编程日记 2025/8/5 18:52:08

数据可视化大屏——物流大数据服务平台（二）

代码分析： 物流大数据平台代码分析这是一个基于 Bootstrap 和 ECharts 构建的物流大数据平台前端页面，设计采用了经典的三栏布局，主要展示河南省及全国的物流数据可视化内容。下面从多个维度进行分析： 1. 页面结构分析整体采…...

编程日记 2025/8/5 18:50:22

MindSpore框架学习项目-ResNet药物分类-构建模型

目录 2.构建模型 2.1定义模型类 2.1.1 基础块ResidualBlockBase ResidualBlockBase代码解析 2.1.2 瓶颈块ResidualBlock ResidualBlock代码解释 2.1.3 构建层构建层代码说明 2.1.4 定义不同组合(block，layer_nums)的ResNet网络实现 ResNet组建类代码解析…...

编程日记 2025/8/5 18:52:57

ChatTempMail - AI驱动的免费临时邮箱服务

在当今数字世界中，保护在线隐私的需求日益增长。ChatTempMail应运而生，作为一款融合人工智能技术的新一代临时邮箱服务，它不仅提供传统临时邮箱的基本功能，还通过AI技术大幅提升了用户体验。核心功能与特性 1. AI驱动的智能邮件…...

编程日记 2025/8/5 18:54:05

(leetcode) 力扣100 9.找到字符串中所有字母异位词(滑动窗口)

题目给定两个字符串 s 和 p，找到 s 中所有 p 的异位词的子串，返回这些子串的起始索引。不考虑答案输出的顺序。数据范围 1 < s.length, p.length < 3 * 104 s 和 p 仅包含小写字母样例示例 1: 输入: s "cbaebabacd", p &quo…...

编程日记 2025/8/5 18:52:58

深入了解 Stable Diffusion：AI 图像生成的奥秘

一、引言 AI 艺术与图像生成技术的兴起改变了我们创造和体验视觉内容的方式。在过去几年里，深度学习模型已经能够创造出令人惊叹的艺术作品，这些作品不仅模仿了人类艺术家的风格，甚至还能创造出前所未有的新风格。在这个领域，Sta…...

编程日记 2025/8/5 18:50:20

场外期权平值期权实值期权虚值期权有什么区别？收益如何计算？

期权汇场外期权按价值状态分为平值、虚值、实值期权。 01｜实值期权对于看涨期权而言，如果行权价格低于标的市场价格，则该期权处于实值状态；对于看跌期权，如果行权价格高于标的市场价格，则处于实值状态…...

编程日记 2025/8/5 18:52:08

微软系统红帽系统网络故障排查：ping、traceroute、netstat

在微软（Windows）和红帽（Red Hat Enterprise Linux，RHEL）等系统中，网络故障排查是确保系统正常运行的重要环节。 ping、traceroute（在Windows中为tracert）和netstat是三个常用的网络…...

编程日记 2025/8/5 18:54:06

HOT 100 | 【子串】76.最小覆盖子串、【普通数组】53.最大子数组和、【普通数组】56.合并区间

一、【子串】76.最小覆盖子串 1. 解题思路定义两个哈希表分别用于 t 统计字符串 t 的字符个数，另一个sub_s用于统计字符串 t 在 s 的子串里面字符出现的频率。为了降低时间复杂度，定义一个变量t_count用于统计 t 哈希表中元素的个数。哈希表sub_s是一…...

编程日记 2025/8/1 3:04:56

基于CNN的猫狗图像分类系统

一、系统概述本系统是基于PyTorch框架构建的智能图像分类系统，专门针对CIFAR-10数据集中的猫（类别3）和狗（类别5）进行分类任务。系统采用卷积神经网络（CNN）作为核心算法，结合图形用…...

编程日记 2025/8/1 3:04:54

《时序数据库全球格局：国产与国外主流方案的对比分析》

引言时序数据库（Time Series Database, TSDB）是专门用于存储、查询和分析时间序列数据的数据库系统，广泛应用于物联网（IoT）、金融、工业监控、智能运维等领域。近年来，随着大数据和物联网技术的发展&…...

编程日记 2025/8/1 3:04:53

力扣-2.两数相加

题目描述给你两个非空的链表，表示两个非负的整数。它们每位数字都是按照逆序的方式存储的，并且每个节点只能存储一位数字。请你将两个数相加，并以相同形式返回一个表示和的链表。你可以假设除了数字 0 之外，这两个数都…...

编程日记 2025/8/1 3:04:51

1.为DbSelect组件新添加showDb字段 :show-db="false"时只显示集群不显示数据库信息

相关文章：