diff --git a/mock/tools.ts b/mock/tools.ts index 6e2e59b..1a55065 100644 --- a/mock/tools.ts +++ b/mock/tools.ts @@ -80,7 +80,7 @@ function getTools() { desc: '在线图片裁剪,标注,滤镜,画等操作', url: '/signimage', cateId: 5, - cate: '设计工具', + cate: '图片处理', }, { id: 1, @@ -142,8 +142,8 @@ function getTools() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/%E8%B0%83%E8%89%B2%E6%9D%BF.png', desc: '包含纯色、渐变与阶梯色和常用色彩组合', url: '/palettes', - cateId: 5, - cate: '设计工具' + cateId: 7, + cate: '其他工具' }, { id: 1, @@ -152,7 +152,7 @@ function getTools() { desc: '在线生成带logo、透明、艺术的二维码', url: '/qrcode', cateId: 5, - cate: '设计工具' + cate: '图片处理' }, { id: 1, @@ -160,8 +160,8 @@ function getTools() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/choose.png', desc: '选择困难,难以决定,今天吃什么,现在做什么,自定义选项都给你安排的明明白白', url: '/decision', - cateId: 7, - cate: '其他' + cateId: 9, + cate: '选择随机' }, { id: 1, @@ -169,8 +169,8 @@ function getTools() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/medium.png', desc: '支持中文的摩斯电码编码解码', url: '/morse', - cateId: 3, - cate: '文本处理' + cateId: 4, + cate: '教育学术' }, { id: 1, @@ -178,8 +178,8 @@ function getTools() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/randomnum.png', desc: '可定制范围内进行随机数字,可用于抽奖、点名等用途', url: '/random', - cateId: 7, - cate: '其他' + cateId: 9, + cate: '选择随机' }, { id: 1, @@ -188,7 +188,7 @@ function getTools() { desc: '在线数字一键转换成人民币大写,中文大写转换数字', url: '/numberToChinese', cateId: 7, - cate: '其他' + cate: '其他工具' }, { id: 1, @@ -215,7 +215,7 @@ function getTools() { desc: '把文本转换成图片,生成长图,具有超多个性文字排版', url: '/textToImg', cateId: 5, - cate: '设计工具' + cate: '图片处理' }, { id: 1, @@ -235,6 +235,69 @@ function getTools() { cateId: 8, cate: '数据图表', }, + { + id: 1, + title: '折线图', + logo: '/images/logo/bar.png', + desc: '在线制作柱状图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/line', + cateId: 8, + cate: '数据图表', + }, + { + id: 1, + title: '饼图', + logo: '/images/logo/bar.png', + desc: '在线制作柱状图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/pie', + cateId: 8, + cate: '数据图表', + }, + { + id: 1, + title: '散点图', + logo: '/images/logo/bar.png', + desc: '在线制作柱状图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/scatter', + cateId: 8, + cate: '数据图表', + }, + { + id: 1, + title: '抛硬币', + logo: '/images/logo/bar.png', + desc: '在线抛硬币,选择困难那么交给硬币来帮你选择吧', + url: '/coin', + cateId: 9, + cate: '选择随机', + }, + { + id: 1, + title: '投骰子', + logo: '/images/logo/bar.png', + desc: '在线投骰子,可自定义骰子数量,简单好用的骰子工具', + url: '/dice', + cateId: 9, + cate: '选择随机', + }, + { + id: 1, + title: '文本去重', + logo: '/images/logo/bar.png', + desc: '可以删除或去除文本或字符串中的重复行', + url: '/textRemoveDuplicate', + cateId: 3, + cate: '文本处理', + }, + { + id: 1, + title: '图片分割', + logo: '/images/logo/bar.png', + desc: '将图片分割成四宫格、九宫格、十六宫格,支持自定义行与列', + url: '/imgCut', + cateId: 5, + cate: '图片处理', + }, ] } @@ -343,15 +406,6 @@ function getToolsCate() { cateId: 3, cate: '文本处理' }, - { - id: 1, - title: '摩斯电码', - logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/medium.png', - desc: '支持中文的摩斯电码编码解码', - url: '/morse', - cateId: 3, - cate: '文本处理' - }, { id: 1, title: '字数统计', @@ -360,7 +414,16 @@ function getToolsCate() { url: '/wordCount', cateId: 3, cate: '文本处理', - } + }, + { + id: 1, + title: '文本去重', + logo: '/images/logo/bar.png', + desc: '可以删除或去除文本或字符串中的重复行', + url: '/textRemoveDuplicate', + cateId: 3, + cate: '文本处理', + }, ] }, { @@ -377,6 +440,15 @@ function getToolsCate() { cateId: 4, cate: '教育学术' }, + { + id: 1, + title: '摩斯电码', + logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/medium.png', + desc: '支持中文的摩斯电码编码解码', + url: '/morse', + cateId: 4, + cate: '教育学术' + }, { id: 1, title: '常用进制转换', @@ -399,18 +471,9 @@ function getToolsCate() { }, { id: 5, - title: '设计工具', + title: '图片处理', icon: '', list: [ - { - id: 1, - title: '色板', - logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/%E8%B0%83%E8%89%B2%E6%9D%BF.png', - desc: '包含纯色、渐变与阶梯色和常用色彩组合', - url: '/palettes', - cateId: 5, - cate: '设计工具' - }, { id: 1, title: '二维码生成', @@ -418,7 +481,7 @@ function getToolsCate() { desc: '在线生成带logo、透明、艺术的二维码', url: '/qrcode', cateId: 5, - cate: '设计工具' + cate: '图片处理' }, { id: 1, @@ -427,7 +490,7 @@ function getToolsCate() { desc: '在线图片裁剪,标注,滤镜,画等操作', url: '/signimage', cateId: 5, - cate: '设计工具', + cate: '图片处理', }, { id: 1, @@ -436,8 +499,17 @@ function getToolsCate() { desc: '把文本转换成图片,生成长图,具有超多个性文字排版', url: '/textToImg', cateId: 5, - cate: '设计工具' - } + cate: '图片处理' + }, + { + id: 1, + title: '图片分割', + logo: '/images/logo/bar.png', + desc: '将图片分割成四宫格、九宫格、十六宫格,支持自定义行与列', + url: '/imgCut', + cateId: 5, + cate: '图片处理', + }, ] }, { @@ -478,12 +550,38 @@ function getToolsCate() { url: '/bar', cateId: 8, cate: '数据图表', + },{ + id: 1, + title: '折线图', + logo: '/images/logo/bar.png', + desc: '在线制作折线图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/line', + cateId: 8, + cate: '数据图表', + }, + { + id: 1, + title: '饼图', + logo: '/images/logo/bar.png', + desc: '在线制作饼图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/pie', + cateId: 8, + cate: '数据图表', + }, + { + id: 1, + title: '散点图', + logo: '/images/logo/bar.png', + desc: '在线制作散点图,像做表格一样制作可视化图表,支持导出静态或动态图表', + url: '/scatter', + cateId: 8, + cate: '数据图表', } ] }, { - id: 7, - title: '其他', + id: 9, + title: '选择随机', icon: '', list: [ { @@ -492,17 +590,8 @@ function getToolsCate() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/randomnum.png', desc: '可定制范围内进行随机数字,可用于抽奖、点名等用途', url: '/random', - cateId: 7, - cate: '其他' - }, - { - id: 1, - title: '数字转金额大写', - logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/text%20recognition.png', - desc: '在线数字一键转换成人民币大写,中文大写转换数字', - url: '/numberToChinese', - cateId: 7, - cate: '其他' + cateId: 9, + cate: '选择随机' }, { id: 1, @@ -510,8 +599,42 @@ function getToolsCate() { logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/choose.png', desc: '选择困难,难以决定,今天吃什么,现在做什么,自定义选项都给你安排的明明白白', url: '/decision', + cateId: 9, + cate: '选择随机' + }, + { + id: 1, + title: '抛硬币', + logo: '/images/logo/bar.png', + desc: '在线抛硬币,选择困难那么交给硬币来帮你选择吧', + url: '/coin', + cateId: 9, + cate: '选择随机', + }, + { + id: 1, + title: '投骰子', + logo: '/images/logo/bar.png', + desc: '在线投骰子,可自定义骰子数量,简单好用的骰子工具', + url: '/dice', + cateId: 9, + cate: '选择随机', + }, + ] + }, + { + id: 7, + title: '其他工具', + icon: '', + list: [ + { + id: 1, + title: '数字转金额大写', + logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/text%20recognition.png', + desc: '在线数字一键转换成人民币大写,中文大写转换数字', + url: '/numberToChinese', cateId: 7, - cate: '其他' + cate: '其他工具' }, { id: 1, @@ -520,7 +643,16 @@ function getToolsCate() { desc: '手持滚动弹幕', url: '/barrage', cateId: 7, - cate: '其他', + cate: '其他工具', + }, + { + id: 1, + title: '色板', + logo: 'https://baseran2.oss-cn-shenzhen.aliyuncs.com/toools-web/icon/%E8%B0%83%E8%89%B2%E6%9D%BF.png', + desc: '包含纯色、渐变与阶梯色和常用色彩组合', + url: '/palettes', + cateId: 7, + cate: '其他工具' } ] } diff --git a/public/images/coin/dollar.png b/public/images/coin/dollar.png new file mode 100644 index 0000000..1945776 Binary files /dev/null and b/public/images/coin/dollar.png differ diff --git a/public/images/coin/xingxing.png b/public/images/coin/xingxing.png new file mode 100644 index 0000000..8e5f3e4 Binary files /dev/null and b/public/images/coin/xingxing.png differ diff --git a/public/images/dice/dice1.png b/public/images/dice/dice1.png new file mode 100644 index 0000000..c3ba8f3 Binary files /dev/null and b/public/images/dice/dice1.png differ diff --git a/public/images/dice/dice2.png b/public/images/dice/dice2.png new file mode 100644 index 0000000..5dfde70 Binary files /dev/null and b/public/images/dice/dice2.png differ diff --git a/public/images/dice/dice3.png b/public/images/dice/dice3.png new file mode 100644 index 0000000..426b87f Binary files /dev/null and b/public/images/dice/dice3.png differ diff --git a/public/images/dice/dice4.png b/public/images/dice/dice4.png new file mode 100644 index 0000000..e392264 Binary files /dev/null and b/public/images/dice/dice4.png differ diff --git a/public/images/dice/dice5.png b/public/images/dice/dice5.png new file mode 100644 index 0000000..f7c641c Binary files /dev/null and b/public/images/dice/dice5.png differ diff --git a/public/images/dice/dice6.png b/public/images/dice/dice6.png new file mode 100644 index 0000000..0ec9e98 Binary files /dev/null and b/public/images/dice/dice6.png differ diff --git a/public/images/dice/dice_run1.png b/public/images/dice/dice_run1.png new file mode 100644 index 0000000..a9aa844 Binary files /dev/null and b/public/images/dice/dice_run1.png differ diff --git a/public/images/dice/dice_run2.png b/public/images/dice/dice_run2.png new file mode 100644 index 0000000..d9fb714 Binary files /dev/null and b/public/images/dice/dice_run2.png differ diff --git a/public/images/dice/dice_run3.png b/public/images/dice/dice_run3.png new file mode 100644 index 0000000..df4801d Binary files /dev/null and b/public/images/dice/dice_run3.png differ diff --git a/public/images/dice/dice_run4.png b/public/images/dice/dice_run4.png new file mode 100644 index 0000000..6df47a9 Binary files /dev/null and b/public/images/dice/dice_run4.png differ diff --git a/src/components/Chart/Bar/Bar.vue b/src/components/Chart/Bar/Bar.vue index 2564e7f..7e839a4 100644 --- a/src/components/Chart/Bar/Bar.vue +++ b/src/components/Chart/Bar/Bar.vue @@ -296,7 +296,7 @@ const updateDataFile = async (params) => { console.log(e) } } - fileReader.readAsBinaryString(_file) + fileReader.readAsArrayBuffer(_file) } //copy diff --git a/src/components/Chart/Line/Line.vue b/src/components/Chart/Line/Line.vue new file mode 100644 index 0000000..3b5d26c --- /dev/null +++ b/src/components/Chart/Line/Line.vue @@ -0,0 +1,466 @@ + + + + + \ No newline at end of file diff --git a/src/components/Chart/Pie/Pie.vue b/src/components/Chart/Pie/Pie.vue new file mode 100644 index 0000000..3106023 --- /dev/null +++ b/src/components/Chart/Pie/Pie.vue @@ -0,0 +1,474 @@ + + + + + \ No newline at end of file diff --git a/src/components/Chart/Scatter/Scatter.vue b/src/components/Chart/Scatter/Scatter.vue new file mode 100644 index 0000000..f855802 --- /dev/null +++ b/src/components/Chart/Scatter/Scatter.vue @@ -0,0 +1,469 @@ + + + + + \ No newline at end of file diff --git a/src/components/Coin/Coin.vue b/src/components/Coin/Coin.vue new file mode 100644 index 0000000..1dbcd60 --- /dev/null +++ b/src/components/Coin/Coin.vue @@ -0,0 +1,133 @@ + + + + + \ No newline at end of file diff --git a/src/components/Dice/Dice.vue b/src/components/Dice/Dice.vue new file mode 100644 index 0000000..b495074 --- /dev/null +++ b/src/components/Dice/Dice.vue @@ -0,0 +1,79 @@ + + + + + \ No newline at end of file diff --git a/src/components/Dice/DiceCore.vue b/src/components/Dice/DiceCore.vue new file mode 100644 index 0000000..a364078 --- /dev/null +++ b/src/components/Dice/DiceCore.vue @@ -0,0 +1,115 @@ + + + + + \ No newline at end of file diff --git a/src/components/Home/About.vue b/src/components/Home/About.vue index 4354178..20c3815 100644 --- a/src/components/Home/About.vue +++ b/src/components/Home/About.vue @@ -15,9 +15,9 @@ const feedBackUrl = import.meta.env.VITE_FEEDBACK_URL

-

本项目是一个开源工具站, 求星星

+

本项目基于 tools-web 构建


-

本项目开源地址:https://github.com/taoran1401/tools-web

+

ctrl + D收藏本站,以便以后使用


联系作者/问题反馈


diff --git a/src/components/ImgCut/ImgCut.vue b/src/components/ImgCut/ImgCut.vue new file mode 100644 index 0000000..7e95ad5 --- /dev/null +++ b/src/components/ImgCut/ImgCut.vue @@ -0,0 +1,143 @@ + + + + + \ No newline at end of file diff --git a/src/components/TextRemoveDuplicate/TextRemoveDuplicate.vue b/src/components/TextRemoveDuplicate/TextRemoveDuplicate.vue new file mode 100644 index 0000000..deac694 --- /dev/null +++ b/src/components/TextRemoveDuplicate/TextRemoveDuplicate.vue @@ -0,0 +1,55 @@ + + + + + \ No newline at end of file diff --git a/src/router/router.ts b/src/router/router.ts index c22bc29..20d05d4 100644 --- a/src/router/router.ts +++ b/src/router/router.ts @@ -1,5 +1,6 @@ //对外暴露配置路由(常量路由) export const constantRoute = [ + //首页 { path: '/', component: () => import('@/components/Home/Home.vue'), @@ -9,6 +10,7 @@ export const constantRoute = [ description: '然部落,在线工具,在线工具大全,开发人员工具,日常生活工具,办公助手,时间戳转换,加密,解密,md5,进制转换,二维码,正则表达式,json格式化,照片处理,字数统计', } }, + //工具 { path: '/timetran', component: () => import('@/components/TimeTran/TimeTran.vue'), @@ -269,6 +271,77 @@ export const constantRoute = [ description: '在线制作柱状图,像做表格一样制作可视化图表,支持导出静态或动态图表', } }, + { + path: '/line', + component: () => import('@/components/Chart/Line/Line.vue'), + name: 'line', + meta: { + title: "折线图", + keywords: '折线图', + description: '在线制作折线图,像做表格一样制作可视化图表,支持导出静态或动态图表', + } + }, + { + path: '/Pie', + component: () => import('@/components/Chart/Pie/Pie.vue'), + name: 'pie', + meta: { + title: "饼图", + keywords: '饼图', + description: '在线制作饼图,像做表格一样制作可视化图表,支持导出静态或动态图表', + } + }, + { + path: '/Scatter', + component: () => import('@/components/Chart/Scatter/Scatter.vue'), + name: 'scatter', + meta: { + title: "散点图", + keywords: '散点图', + description: '在线制作散点图,像做表格一样制作可视化图表,支持导出静态或动态图表', + } + }, + { + path: '/Coin', + component: () => import('@/components/Coin/Coin.vue'), + name: 'coin', + meta: { + title: "抛硬币", + keywords: '抛硬币,硬币', + description: '在线抛硬币,选择困难那么交给硬币来帮你选择吧', + } + }, + { + path: '/Dice', + component: () => import('@/components/Dice/Dice.vue'), + name: 'dice', + meta: { + title: "投骰子", + keywords: '投骰子,骰子,自定义骰子', + description: '在线投骰子,可自定义骰子数量,简单好用的骰子工具', + } + }, + { + path: '/TextRemoveDuplicate', + component: () => import('@/components/TextRemoveDuplicate/TextRemoveDuplicate.vue'), + name: 'textRemoveDuplicate', + meta: { + title: "文本去重", + keywords: '文本去重,文本排重,文本去除重复', + description: '可以删除或去除文本或字符串中的重复行', + } + }, + { + path: '/ImgCut', + component: () => import('@/components/ImgCut/ImgCut.vue'), + name: 'imgCut', + meta: { + title: "图片分割", + keywords: '图片分割,图片切割,四宫格,九宫格,十六宫格', + description: '将图片分割成四宫格、九宫格、十六宫格,支持自定义行与列', + } + }, + // 关于 { path: '/about', component: () => import('@/components/Home/About.vue'), @@ -279,6 +352,7 @@ export const constantRoute = [ description: '', } }, + //其他路由 { path: '/404', component: () => import('@/components/404/404.vue'), diff --git a/src/store/modules/linux.ts b/src/store/modules/linux.ts new file mode 100644 index 0000000..559e9e6 --- /dev/null +++ b/src/store/modules/linux.ts @@ -0,0 +1,21 @@ +import { defineStore } from 'pinia' +export const useUserStore = defineStore('linux', { + //用来存放变量 + state: () => ({ + + }), + //方法 + actions: { + //获取tools + async getCmds() { + //发送请求 + // const result: any = await getTools(data) + // if (result.code == 200) { + + // return result.message + // } else { + // return Promise.reject(new Error(result.message)) + // } + }, + } +}) \ No newline at end of file diff --git a/src/utils/echarts.ts b/src/utils/echarts.ts index b388f25..dedbbd3 100644 --- a/src/utils/echarts.ts +++ b/src/utils/echarts.ts @@ -22,11 +22,11 @@ export function toSpreadsheetData(data, type = 'bar') { } /** - * 转换成echarts使用的数据 + * 转换成echarts使用的数据 - 基础格式(适用于柱状图、折线图等) */ export function toEchartsData(data) { - let tmpColumn: Array = []; - let tmpValue: Array = []; + let tmpColumn: Array = []; + let tmpValue: Array = []; for (let item in data.rows) { if (item == 'len') { continue @@ -37,9 +37,94 @@ export function toEchartsData(data) { return [tmpColumn, tmpValue]; } +/** + * 转换成echarts使用的数据 - 适用于饼图 + * + * @param data + * @returns + */ +export function toEchartsPieData(data) { + let tmpArr: Array = [] + for (let item in data.rows) { + if (item == 'len') { + continue + } + tmpArr.push({ + name: data.rows[item]['cells'][0] ? data.rows[item]['cells'][0]['text'] : '', + value: data.rows[item]['cells'][1] ? data.rows[item]['cells'][1]['text'] : '' + }) + // tmpColumn.push(data.rows[item]['cells'][0] ? data.rows[item]['cells'][0]['text'] : '') + // tmpValue.push(data.rows[item]['cells'][1] ? data.rows[item]['cells'][1]['text'] : '') + } + return tmpArr; +} + +/** + * 数据格式转换 - 根据type转换格式 + * 对象格式{name: '', value: ''}; 列格式: nameArr = [], valueArr = [] + * @param data + * @returns + */ +export function tranObjAndColumn(data, type = 'toObj') { + let returnData = [] as any[]; + if (type == 'toObj') { + if (data.len === 0 || data[0].len === 0) { + return returnData; + } + //转换成饼图使用的obj + let nameArr = data[0]; + let valueArr = data[1]; + let tmpArr: Array = [] + + for (let item in nameArr) { + if (item == 'len') { + continue + } + tmpArr.push({ + name: nameArr[item] ? nameArr[item] : '', + value: valueArr[item] ? valueArr[item] : '', + }) + } + returnData = tmpArr + } else if (type == 'toColumn') { + //饼图对象转换成列数组 + let nameArr = [] as string[] + let valueArr = [] as number[] + for (let item in data) { + nameArr.push(data[item]?.name) + valueArr.push(data[item]?.value) + } + returnData = [nameArr, valueArr] + } else if (type == "toCoord") { + //转换成坐标(散点图用到) + if (data.len === 0 || data[0].len === 0) { + return returnData; + } + //转换成饼图使用的obj + let nameArr = data[0]; + let valueArr = data[1]; + let tmpArr: Array = [] + + for (let item in nameArr) { + if (item == 'len') { + continue + } + tmpArr.push([ + nameArr[item] ? nameArr[item] : 0, + valueArr[item] ? valueArr[item] : 0, + ]) + } + returnData = tmpArr + } + return returnData; +} + + const EchartsUtils = { toSpreadsheetData, toEchartsData, + toEchartsPieData, + tranObjAndColumn, } export default EchartsUtils