复制表格内容至剪切板(含数据转换)

// row--当前行;newColumns--表格列配置;menu:含code,根据code区分右键复制是否含表头
function copyDataToclipboard(row, newColumns, menu) {let copyRow = ''; // 最终粘贴板数据let title = ''; // 表头数据let rowData = ''; // 当前行数据const oldColumns = cloneDeep(newColumns);const columns = cloneDeep(newColumns);oldColumns.forEach((item) => {if (item.params && item.params.spliceList && item.params.spliceList.length) {item.params.spliceList.forEach(v => {v.params = item.params});const index = columns.findIndex((v) => v.property === item.property)columns.splice(index, 1, ...item.params.spliceList)}});columns.forEach((column) => {// 当前行数据处理if (column.property && column.type !== 'seq' && column.type !== 'checkbox' && column.property !== 'dropGroupProp') {const dataCell = getValue({ row, column });rowData += (dataCell ?  dataCell.toString().replaceAll('\n', '').replaceAll('\r', '') : '') + '\t';// 复制含表头处理if (menu.code === 'COPY_ROW_WITH_HEADER') {title += column.title + '\t';}}});copyRow = title === '' ? rowData : title + '\n' + rowData;navigator.clipboard.writeText(copyRow);
}

处理每一个单元格数据,进行格式化数据


// grid表格中用于format-view插槽数据展示
export const getValue = ({ row, column }: any) => {let result = '';const type = column?.params?.type || '';const deepValue = column?.params?.deepValue || null;let value = row[column.property];// columns中的列配置可配置成多级对象,如: aaa.bbb.ccc【有些时候,前端需要的部分列数据,后端接口会返回在一个对象中,需要深层去拿值】value = getDeepValue(row, column.property.toString(), deepValue);if (column?.params?.renderFunc) {result = column.params.renderFunc(row, column);} else if (type === 'select' || type === 'boolean') {result = getLabelByValue(value,column.params.optionsConfig,column.params.options,column.params.type,column.params.multiple,);} else if (column?.params?.spliceList && column?.optionList && column?.optionList?.length) {// 拆分列时,若需要格式化枚举数据,需在spliceList对应的对象中添加optionListresult = column?.optionList.find((v) => v.value === value)? column?.optionList.find((v) => v.value === value).label: '';} else {if ((type === 'string' || type === 'number' || type === undefined) && column.params.formatter === 'thousandtsh') {if (column.params.showZero || value || value === 0) {if (column.params.showZero && !value) {value = 0;}if (value !== '0' && value !== 0 && !Number(value)) {return value;}let num = 2;if (column.params.digit != undefined || column.params.digit != null) {num = column.params.digit;}result = formatMoneyByRound(value, num);} else {result = '';}} else {result = value;}}return result;
};

根据当前行数据及列配置中的枚举值,转换数据;拓展出下拉框枚举是树形结构的,支持深层次遍历


export const getLabelByValue = (value: any,optionsConfig: { filtersLabel?: string; optionLabel?: string; optionkey?: string; optionValue?: string },options: any[],_type: string,multiple: false,
) => {let result = value ? (value === '0' || value === 0 ? value : value) : ''; // select匹配不上时,取该字段原本的值const optionConfig = Object.assign({ filtersLabel: 'label', optionLabel: 'label', optionkey: 'value', optionValue: 'value', treeField: 'children' },optionsConfig,);if (multiple && isArray(value)) {const arr: Array<string> = [];(value as Array<string>).forEach((value1: string) => {options?.forEach((item) => {if (item[optionConfig.optionValue] === value1) {arr.push(item[optionConfig.optionLabel]);return true;}});});result = arr.join(',');} else if (Array.isArray(options)) {for (let index = 0; index < options.length; index++) {const item = options[index];if (item[optionConfig.optionValue] === value) {result = item[optionConfig.optionLabel];break;} else if (Object.hasOwnProperty.call(item, optionConfig.treeField)) {// 如果下拉框枚举是树形结构的,支持深层次遍历const res = getLabelByChildNode(value, item, optionConfig);if (res) {result = res;}}}}return result;
};
// 写一个迭代,如果下拉框枚举是树形结构的,支持深层次遍历
const getLabelByChildNode = (value, item, optionConfig) => {if (Object.hasOwnProperty.call(item, optionConfig.treeField) && item[optionConfig.treeField]?.length > 0) {for (let index = 0; index < item[optionConfig.treeField].length; index++) {const element = item[optionConfig.treeField][index];if (element[optionConfig.optionValue] === value) {return element[optionConfig.optionLabel];} else {const res = getLabelByChildNode(value, element, optionConfig);if (res) {return res;}}}}return '';
};

// 获取深层次对象的某个值
export function getDeepValue(row, field, deepValue) {if (field?.includes('.') && row[field] !== 0 && !row[field]) {let fieldValue = null;field.split('.').filter((item) => item != '').forEach((item) => {if (fieldValue && typeof fieldValue === 'object') {fieldValue = fieldValue[item];} else if (row[item]) {// 应对行数据中,属性包含.的对象嵌套fieldValue = row[item];} else {// 应对行数据中,属性包含.的字符串,理论性不会走到这里,会被方法第一步卡掉fieldValue = row[field];}});return fieldValue;} else {let value = '';if (deepValue) {deepValue.split('.').forEach((item, i) => {value = i < 1 ? row[item] : value[item];});} else {value = row[field];}return value;}
}

//千分位分隔符,控制小数位数,四舍五入,12345.6格式化为12,345.60
export function formatMoneyByRound(s, n) {let flag = false;if (String(s).substr(0, 1) == '-') {s = String(s).substr(1);flag = true;}if(n >= 0 && n <= 20) {n = n >= 0 && n <= 20 ? n : 2;const time = Math.pow(10, n);s = (Math.round(parseFloat(s) * time) / time).toFixed(n);} else {s = s.toString();if(s.split('.').length === 1) {return parseInt(s).toLocaleString();}}let result = '';if(n === 0) {result = parseInt(s).toLocaleString();} else {const l = s.split('.')[0].split('').reverse(),r = s.split('.')[1];let t = '';for (let i = 0; i < l.length; i++) {t += l[i] + ((i + 1) % 3 == 0 && i + 1 != l.length ? ',' : '');}result = t.split('').reverse().join('') + '.' + r;}if (flag) {result = '-' + result;}return result;
}

Over!!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/20161.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux下基于Dockerfile构建镜像应用(1)

目录 基于已有容器创建镜像 Dockerfile构建SSHD镜像 构建镜像 测试容器 可以登陆 Dockerfile构建httpd镜像 构建镜像 测试容器 Dockerfile构建nginx镜像 构建镜像 概述&#xff1a; Docker 镜像是Docker容器技术中的核心&#xff0c;也是应用打包构建发布的标准格式。…

云曦暑期学习第三周——ctfshow--php特性(89-104)

目录 web89 preg_match函数 、数组 web90 intval()函数、强比较 web91 正则修饰符 web92 intval()函数、弱比较 web93 八进制、小数点 web94 strpos() 函数、小数点 web95 小数点 web96 highlight_file() 下的目录路径 web97 数组 web98 三目运算符 web9…

chrome扩展在popup、background、content之间通信解决传输文件问题

文章目录 背景介绍案例介绍代码示例popup页面&#xff0c;上传文件页面popup页面&#xff0c;js上传代码&#xff0c;file文件转base64background监听消息&#xff0c;base64转file文件&#xff0c;axios上传 附-转base64后直接下载 背景介绍 示例扩展API版本MV2。 以弹…

关于Hive的使用技巧

前言 Hive是一个基于Hadoop的数据仓库基础架构&#xff0c;它提供了一种类SQL的查询语言&#xff0c;称为HiveQL&#xff0c;用于分析和处理大规模的结构化数据。 Hive的主要特点包括&#xff1a; 可扩展性&#xff1a;Hive可以处理大规模的数据&#xff0c;支持高性能的并行…

利用openTCS实现车辆调度系统(一)系统介绍

系统介绍 openTCS简介 官方的回答&#xff1a; openTCS&#xff08;开放式运输控制系统的缩写&#xff09;是一种免费的控制系统软件&#xff0c;用于协调自动导引车&#xff08;AGV&#xff09;和移动机器人车队&#xff0c;例如在生产工厂中。 通常应该可以控制任何具有通信…

在线思维导图怎么绘制?学学这几种绘制方法

在线思维导图怎么绘制&#xff1f;思维导图是一种非常有效的学习和工作工具&#xff0c;可以帮助我们更好地组织和呈现信息&#xff0c;提高学习效率和工作效率。而在线思维导图的出现&#xff0c;更是为我们的绘制带来了极大的便利。现在也有很多绘制思维导图的方法&#xff0…

android pdf框架,编译mupdf

因为mupdf编译的体积不小,之前也发过编译的文章,现在更新一下. 建一个mupdf_c目录,名字自己取,在里面git下载mupdf源码,把目录修改为libmupdf mupdf_c目录下建build.gradle文件,内容如下 apply plugin: com.android.library apply plugin: maven-publishgroup com.artifex.…

量子机器学习

量子机器学习(QML)是结合量子计算和机器学习的交叉领域&#xff0c;旨在利用量子计算的优势来改进机器学习算法的性能。下面是一些有关量子机器学习的学习资源和技术应用&#xff1a; 学术论文和研究资料&#xff1a; ArXiv.org&#xff1a;在ArXiv的量子物理和机器学习类别中&…

用chatglm实现code interpreter

背景 开始文章之前可以先介绍下何为code interpreter。所谓code interpreter从实际操作讲就是让llm模型具备了立马执行代码、并把执行结果作为下轮模型生成的物料。这里面有两个关键词“立马执行代码”、“结果作为物料”&#xff0c;其实如果llm不具备控制计算机得到执行结果…

伪操作、C和汇编、ATPCS协议

一、伪操作.global 全局.local 局部.equ 声明.macro 子函数.if .endif 条件编译.rept 重复操作.weak 弱化.word 申请一个字空间.byte 申请一个字节空间.align 地址对齐.arm ARM指令.thumb Thumb指令.text 代码段.data 数据段.space 申请N个字节空间 二、C和汇编的混合编程三、A…

图文演示:如何三分钟极速搭建一个元宇宙3D虚拟展厅

引言&#xff1a; 元宇宙3D虚拟展厅时代已经来临。元宇宙是一个虚拟的、立体的数字空间&#xff0c;可以让用户沉浸在其中进行交互操作&#xff0c;并体验无限可能。如何快速搭建一个属于自己的虚拟展厅则受到越来越多人的关注。 一&#xff0e;虚拟展厅类型 1.党建展馆 实现…

html:去除input/textarea标签的拼写检查

默认情况下&#xff0c;textarea 会启动拼写和语法检查&#xff0c;表现效果就是单词拼写错误会出现红色下划线提示 <textarea></textarea>效果 有时&#xff0c;我们并不需要拼写检查&#xff0c;可以通过配置属性spellcheck"false" 去除拼写和语法检…

振弦传感器信号转换器应用山体滑坡安全监测

振弦传感器信号转换器应用山体滑坡安全监测 随着人类文明的进步&#xff0c;自然灾害对人们的生活和财产安全造成的威胁也越来越大。山体滑坡作为自然灾害中的一种&#xff0c;给人们的生活和财产安全带来了极大的威胁。因此&#xff0c;进行山体滑坡的安全监测显得尤为重要。振…

Docker设置代理、Linux系统设置代理

使用方式 新建或修改~/.docker/config.json文件&#xff0c;设置可用的代理地址。 {"proxies": {"default": {"httpProxy": "http://192.168.0.32:1080","httpsProxy": "http://192.168.0.32:1080","noPro…

【U8+】用友U8重新注册加密锁,提示:写卡失败,请重新配置客户端控件。

【问题描述】 用友U8软件重新安装后&#xff0c;需要重新注册加密锁激活软件。 注册反馈提示&#xff1a;产品注册失败。 原因&#xff08;1&#xff09;&#xff1a;写卡失败&#xff0c;请重新配置客户端控件。 【解决方法】 1、打开控制面板&#xff0c;网络和 Internet&a…

ArmSoM-W3之RK3588安装Qt+opencv+采集摄像头画面

1. 简介 场景&#xff1a;在RK3588上做qt开发工作 RK3588安装Qtopencv采集摄像头画面 2. 环境介绍 这里使用了OpenCV所带的库函数捕获摄像头的视频图像。 硬件环境&#xff1a; ArmSoM-RK3588开发板、&#xff08;MIPI-DSI&#xff09;摄像头 软件版本&#xff1a; OS&…

PSO粒子群优化算法

PSO粒子群优化算法 算法思想matlab代码python代码 算法思想 粒子群算法&#xff08;Particle Swarm Optimization&#xff09; 优点: 1&#xff09;原理比较简单&#xff0c;实现容易&#xff0c;参数少。 缺点: 1&#xff09;易早熟收敛至局部最优、迭代后期收敛速度慢的…

55对象的新增方法

对象的新增方法 Object.is()Object.assign()Object.getOwnPropertyDescriptors()__proto__属性&#xff0c;Object.setPrototypeOf()&#xff0c;Object.getPrototypeOf()Object.keys()&#xff0c;Object.values()&#xff0c;Object.entries()Object.fromEntries()Object.ha…

初阶数据结构——二叉树题目

文章目录 一、单值二叉树二、检查两颗树是否相同三、另一棵树的子树四、二叉树的前序遍历五、对称二叉树 一、单值二叉树 单值二叉树 如果二叉树每个节点都具有相同的值&#xff0c;那么该二叉树就是单值二叉树。只有给定的树是单值二叉树时&#xff0c;才返回 true&#xff…

最适合个人博客做的6种内容!你get了吗

很多朋友私信looklook说自己很想试着开创一个属于自己的个人博客&#xff0c;但是又不知道从哪里下手比较好&#xff0c;不知道网友们喜欢看什么。今天looklook就从内容出发&#xff0c;把大家比较常在个人博客分享的内容列举出来&#xff0c;希望可以给到大家一个参考。 推荐的…