vue 表格 vxe-table 树结构实现单元格复制粘贴功能,实现树层级节点复制功能
vue 表格 vxe-table 树结构实现单元格复制粘贴功能,实现树层级节点复制功能;树结构默认是平级粘贴,可以通过 clip-config.isDeepPaste 启用深层数据结构的粘贴,需要注意树结构只支持 tree-config.transform 模式
https://vxetable.cn
可以通过 clip-config.isDeepPaste 启用深层数据结构的粘贴
<template>
<div>
...
vue 表格 vxe-table 如何实现右键菜单异步权限控制,权限控制邮件菜单按钮禁用与显示
vue 表格 vxe-table 如何实现右键菜单异步权限控制,权限控制邮件菜单按钮禁用与显示,支持自定义方法参数来控制菜单选项的异步禁用与显示
https://vxetable.cn
右键菜单加载中,通过 visibleMethod 和 loading | disabled | visible 属性来控制菜单选项的异步禁用与显示,可以精确到每一列每一行的显示隐藏与禁用控制
<te ...
年会抽奖不用愁!这款开源 3D 抽奖工具,颜值与实用双在线!
大家好,我是 Java陈序员。
临近年底,又到了喜闻乐见的年会活动。但对于策划部门来说,每年都会为年会抽奖环节用什么工具发愁?用 Excel 随机抽奖太枯燥,花钱买商业软件又不划算。
今天,给大家安利一款免费开源的 3D 抽奖神器,炫酷球体抽奖效果直接拉满活动氛围,自定义配置更是精准适配各类年会、团建场景!
关注微信 ...
VUE3大屏自适应布局
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
1. 视口单位布局 (Viewport Units)
使用 vw 和 vh 单位来实现响应式布局:
.full-screen {
width: vw(1920);
height: vh(1080);
padding: vh(5) vw(5) vh(5) vw(5);
}
.header-title {
font-size: vw(40);
line-height: vh(80);
}
这里的&nbs ...
vxe-table 如何实现复选框范围选取,鼠标滑动选择行效果不
vxe-table 如何实现复选框范围选取,鼠标滑动选择行效果不,按住复选框的列,向上或向下滑动选取, 鼠标按 MouseLeft + Ctrl 局部选取/取消选择
https://vxetable.cn
<template>
<div>
<vxe-grid v-bind="gridOptions"></vxe-grid>
</div>
</template>
<script setup>
import { reactive } from 'vue'
const grid ...
海康威视web插件版-vue3
1、下载web插件
官网地址:https://open.hikvision.com/download/5cda567cf47ae80dd41a54b3?type=20&id=77c7f9ab64da4dbe8b2df7efe3365ec2
下载 并安装
2、引入web插件包
在 public/index.html中引入插件
<script src="/webVideoCtrl.js"></script>
<script src="jsVideoPlugin-1.0.0.min.js"></script>
<scrip ...
vue 甘特图 vxe-gantt 任务里程碑和依赖线的使用
vue 甘特图 vxe-gantt 任务里程碑和依赖线的使用
https://gantt.vxeui.com/
通过设置 task-bar-milestone-config 和 type=moveable 启用里程碑类型,当设置为里程碑类型时,只需要设置 start 开始日期就可以,无需设置 end 结束日期,设置 links 定义连接线,from 对应源任务的行主键,tom 对应目标任务的行主键
<template>
...
vue 甘特图 vxe-gantt 任务里程碑类型的配置用法
vue 甘特图 vxe-gantt 任务里程碑类型的配置用法
查看官网:https://gantt.vxeui.com/
gitbub:https://github.com/x-extends/vxe-gantt
gitee:https://gitee.com/x-extends/vxe-gantt
通过设置 task-bar-milestone-config 和 type=moveable 启用里程碑类型
<template>
<div>
<vxe-gantt v-bind="ganttOptions"></v ...
vxe-table 导入 excel xlsx 时,单元格内容值丢失前面0解决方法
vxe-table 导入 excel xlsx 时,单元格内容值丢失前面0解决方法,不如到出数据为 "003200" ,导出到 xlsx 时,由于 xlsx 会自定义格式化数字,所以 0 就没了;解决方法就是知道为字符串类型,可以通过 column.cell-type 设置
查看官网:https://vxetable.cn
gitbub:https://github.com/x-extends/vxe-table
gitee:https: ...
vue 甘特图 vxe-gantt 手动增加一条依赖线,删除连接线的用法
vue 甘特图 vxe-gantt 手动增加一条依赖线,删除连接线的用法,通过设置 links 定义连接线,from 对应源任务的行主键,tom 对应目标任务的行主键
0 FinishToStart 结束后才开始,表示一个任务必须在另一个任务开始之前完成
1 StartToFinish 开始到结束,表示从某个过程的开始到结束的整个过程
2 StartToStart 开始后才开始,表 ...
vue 甘特图 vxe-gantt table 连接线的用法教程
vue 甘特图 vxe-gantt table 连接线的用法教程,通过设置 links 定义连接线,from 对应源任务的行主键,tom 对应目标任务的行主键
https://gantt.vxeui.com
类型说明
0 FinishToStart 结束后才开始,表示一个任务必须在另一个任务开始之前完成
1 StartToFinish 开始到结束,表示从某个过程的开始到结束的整个过程
2 StartToSt ...
vue 甘特图 vxe-gantt table 依赖线的使用,配置连接线
vue 甘特图 vxe-gantt table 依赖线的使用,配置连接线
连接线有几种类型:
FinishToFinish:完成到完成,表示一个任务必须在另一个任务完成之后才能完成
StartToStart:开始后才开始,表示一个活动结束了,另一个活动才能开始,它们之间按先后顺序进行
FinishToStart:结束后才开始,表示一个任务必须在另一个任务开始之前 ...
vue 甘特图 vxe-gantt table 任务条可拖拽左右调整日期,拖拽任务调整日期
vue 甘特图 vxe-gantt table 任务条可拖拽左右调整日期,拖拽任务调整日期
查看官网:https://gantt.vxeui.com/
gitbub:https://github.com/x-extends/vxe-gantt
gitee:https://gitee.com/x-extends/vxe-gantt
效果
代码
通过设置 task-bar-config.resize 启用拖拽任务条调整日期功能
<template>
<div>
<vxe-gantt ...
一键部署!一款开源自托管的照片画廊神器!
大家好,我是 Java陈序员。
在这个数字时代,我们的手机和相机里存满了无数珍贵的照片 —— 家人的笑脸、旅行的风景、生活的点滴瞬间。但这些回忆往往被淹没在杂乱的相册里,要么受制于云存储的隐私风险,要么因格式兼容问题难以完整呈现。
这时候,我们可以搭建一个完全属于自己、能按时间和地点梳理回忆的照片画廊。
今天 ...
如何实现 vxe-tree 树组件拖拽节点后进行二次确认提示
如何实现 vxe-tree 树组件拖拽节点后进行二次确认提示,参数 drag-config.dragStartMethod 可以自定义处理拖拽开始时的拖动,可以自定义是否允许拖拽
官网:https://vxeui.com
github:https://github.com/x-extends/vxe-pc-ui
gitee:https://gitee.com/x-extends/vxe-pc-ui
需要提示操作时,通过 drag-config.dragEndMet ...
vxe-tree 树组件拖拽排序功能的使用教程
vxe-tree 树组件拖拽排序功能的使用教程,通过 drag 启用行拖拽排序功能,支持同层级、跨层级、拖拽到子级非常强大的拖拽功能等
官网:https://vxeui.com
github:https://github.com/x-extends/vxe-pc-ui
gitee:https://gitee.com/x-extends/vxe-pc-ui
同层级拖拽
通过 drag-config.isPeerDrag 启用同层级拖拽
<template ...
vue-dawn-flow 低代码流程插件
一、vue-dawn-flow介绍
vue-dawn-flow是一款功能强大的开源流程设计器,专为 Vue.js 生态打造,完美兼容 Vue 2 和 Vue 3 框架。并且能很好的兼容vue前端所有框架。
1.1插件功能
提供了一个可视化的流程设计器,你可以在设计器中拖拽组件,连接组件,设置组件属性。
提供了多种节点类型可共筛选。
提供了节点的相关操作,比 ...
vxe-table 如何实现每一行的下拉框选项都是不一样的
vxe-table 如何实现每一行的下拉框选项都是不一样的
实现方式非常简单,通过自定义插槽模板,给每一行的下拉框赋值不同的 options 就可以实现
查看官网:https://vxetable.cn
gitbub:https://github.com/x-extends/vxe-table
gitee:https://gitee.com/x-extends/vxe-table
需要注意的是由于每一行的下拉选项都是不一样 ...
vue 常用的 gantt 甘特图组件推荐
vue 常用的 gantt 甘特图组件推荐,项目中使用过的甘特图组件,各有优缺点。
dhtmlx-gantt 甘特图
https://dhtmlx.com/docs/products/demoApps/
老牌的甘特图组件,给你非常全面,使用难度高,可定制化功能比较一般,原生 js 和 vue 项目都能用,基础版本免费,功能限制较多,企业版功能更强
任务列表
任务依赖关系
vxe- ...
vue 如何实现 vxe-gantt table 甘特图的任务拖拽后调整日期的二次确认提示
vue 如何实现 vxe-gantt table 甘特图的任务拖拽后调整日期的二次确认提示
查看官网:https://gantt.vxeui.com/
gitbub:https://github.com/x-extends/vxe-gantt
gitee:https://gitee.com/x-extends/vxe-gantt
效果
代码
通过设置 task-bar-drag-config.dragEndMethod 对拖拽后的行为进行二次确认
<template>
<div>
...