数据可视化大屏项目开发中，登录页需要一个验证码发送功能，这里我们来实现这个功能。
使用
<captcha :phone="phone"></captcha>
创建组件captcha
组件接收电话号码，使用label来显示获取验证码，...
yekong
1年前 (2023-09-22)
喜欢
vue3数据可视化大屏项目开发中，需要一个24小时时间段，时间段可以点击选择，可以多选以用来记录时间段。
通过鼠标可以选择时间点，点击保存后可以将数据通过localStorage缓存到本地。
效果截图
演示地址
vue3实现时间段布防时间效果
项目应用
视频监控智能分析系统
部...
yekong
1年前 (2023-09-11)
喜欢
vue3 可视化数据大屏 项目开发中，会遇到各种各样的头部，今天整理的是 vue3数据可视化大屏顶部组件 - 医疗体检健康可视化数据。
效果截图
帧动画效果
通过ae实现从两侧到中间的扫光动画，使用帧动画生成。帧动画虽然增加了效果同时也增加了文件大小。
动画持续时间
动画持续...
yekong
1年前 (2023-08-29)
喜欢
vue3 数据可视化大屏 中，经常会需要各种效果的表格，这里将各种表格效果整理在一块，方便复用。
10 斑马线装饰表格
9 表格效果
表头和表列表两侧各有两个三角装饰图标。
8 仿3d表格效果
组件代码
vue3 仿3d表格效果
由背景图片进行装饰，让表格看起来有3d的感觉。...
yekong
1年前 (2023-08-29)
喜欢
vue3 数据可视化大屏 开发中，需要展示一些表格效果，今天整理 vue3 仿3d表格效果。
通过使用flex控制宽度，通过Vue3SeamlessScroll实现列表滚动，根据状态字段显示不同的label样式。
部分代码
<template>
<div...
yekong
1年前 (2023-08-29)
喜欢
vue 数据可视化大屏 项目中，按照效果图，需要实现一组气泡效果，气泡内有数字以及标题。
这里我们需要实现这里出气泡的大小，位置以及气泡的颜色等信息。将气泡渲染出来后，为了让页面看起来更生动，我们使用gsap来给组件添加一个上下轻微晃动的效果。
效果截图
效果动画
组件代码
...
yekong
1年前 (2023-07-14)
喜欢
vue 数据可视化大屏 开发中，需要实现横向滚动的效果，除了可以使用鼠标拖动滚动外，还需要可以通过点击按钮实现左右滚动。
效果截图
动态效果
实现代码
/**
* @Author: 858834013@qq.com
* @Name: scrollbar
* @Date: 20...
yekong
1年前 (2023-07-14)
喜欢
vue 数据可视化大屏 项目开发过程中，需要实现一个按钮，按钮要可以点击，点击后，对应的图标需要有一个旋转的动画效果。
实现代码
<template>
<div class="refresh" @click="getRefr...
yekong
1年前 (2023-07-01)
喜欢
vue3 两级树列表，父节点可以展开收缩 可以全选和取消全选 子节点可以选中 子节点全部选择后父节点自动选择
可以按照以下步骤进行操作：
在Vue组件中，创建一个包含树的数据的数组，每个节点包含id、label、selected、expanded和children属性。
在模板...
yekong
1年前 (2023-06-28)
喜欢
数据可视化大屏 页面都会有一个特色的头部，用来放标题时间以及菜单等效果，为了方便复用可能会出现的头部，这里将可能会遇到的 数据可视化大屏头部组件 都整理出来方便复用。今天整理的来自数据大屏：物流园系统可视化页面 头部组件。
效果截图
帧动画效果
通过ae实现从两侧到中间的扫光动...
yekong
1年前 (2023-06-22)
喜欢
