Skip to content

1
1024程序员开源挑战赛

夜猫逐梦 / 1024程序员开源挑战赛
与 Fork 源项目一致

Fork自 GitCode / 1024程序员开源挑战赛（10.23-11.14）

通知 3
Star 1
Fork 0
1
1024程序员开源挑战赛

体验新版 GitCode，发现更多精彩内容 >>

提交 953f7c93 编写于 作者: B baiy 提交者： ninecents
浏览文件
操作

添加json处理工具 #22

上级 7b4deed5
隐藏空白更改
内联 并排
Showing with 350 addition and 40 deletion
package-lock.json
浏览文件 @ 953f7c93
......@@ -3110,6 +3110,11 @@
"integrity": "sha1-0pHGpOl5ibXGHZrPOWrk/hM6cY0=",
"dev": true
},
"JSV": {
"version": "4.0.2",
"resolved": "https://registry.npm.taobao.org/JSV/download/JSV-4.0.2.tgz",
"integrity": "sha1-0Hf2glVx+CEy+d/67Vh7QCn+/1c="
},
"accepts": {
"version": "1.3.7",
"resolved": "https://registry.npm.taobao.org/accepts/download/accepts-1.3.7.tgz",
......@@ -4415,6 +4420,11 @@
"integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
"dev": true
},
"codemirror": {
"version": "5.55.0",
"resolved": "https://registry.npm.taobao.org/codemirror/download/codemirror-5.55.0.tgz?cache=0&sync_timestamp=1592745428423&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcodemirror%2Fdownload%2Fcodemirror-5.55.0.tgz",
"integrity": "sha1-I3MfZBKI8gKmhY/ch48xSeDgQ2M="
},
"collection-visit": {
"version": "1.0.0",
"resolved": "http://registry.npm.taobao.org/collection-visit/download/collection-visit-1.0.0.tgz",
......@@ -5471,6 +5481,11 @@
"resolved": "https://registry.npm.taobao.org/diff/download/diff-4.0.2.tgz",
"integrity": "sha1-YPOuy4nV+uUgwRqhnvwruYKq3n0="
},
"diff-match-patch": {
"version": "1.0.5",
"resolved": "https://registry.npm.taobao.org/diff-match-patch/download/diff-match-patch-1.0.5.tgz",
"integrity": "sha1-q7WE1fEM0Rlt/FWqA3AVkq4/ezc="
},
"diffie-hellman": {
"version": "5.0.3",
"resolved": "https://registry.npm.taobao.org/diffie-hellman/download/diffie-hellman-5.0.3.tgz",
......@@ -6535,6 +6550,11 @@
"escape-string-regexp": "^1.0.5"
}
},
"file": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/file/-/file-0.2.2.tgz",
"integrity": "sha1-w9/Y+M81Na5FXCtCPC5SY112tNM="
},
"file-entry-cache": {
"version": "2.0.0",
"resolved": "http://registry.npm.taobao.org/file-entry-cache/download/file-entry-cache-2.0.0.tgz",
......@@ -7560,6 +7580,11 @@
}
}
},
"has-color": {
"version": "0.1.7",
"resolved": "https://registry.npm.taobao.org/has-color/download/has-color-0.1.7.tgz",
"integrity": "sha1-ZxRKUmDDT8PMpnfQQdr1L+e3iy8="
},
"has-flag": {
"version": "3.0.0",
"resolved": "https://registry.npm.taobao.org/has-flag/download/has-flag-3.0.0.tgz",
......@@ -7820,6 +7845,11 @@
}
}
},
"http-build-query": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/http-build-query/-/http-build-query-0.7.0.tgz",
"integrity": "sha512-r5jnQ/PcKzFg2dLJAj9xU8cBHuLubxLli6NiFtziNrDqVwPcjIgioamZszzGOPJq6ekUu+WfIcgsuPqe9MX4Ag=="
},
"http-deceiver": {
"version": "1.2.7",
"resolved": "https://registry.npm.taobao.org/http-deceiver/download/http-deceiver-1.2.7.tgz",
......@@ -8593,6 +8623,15 @@
"graceful-fs": "^4.1.6"
}
},
"jsonlint": {
"version": "1.6.3",
"resolved": "https://registry.npm.taobao.org/jsonlint/download/jsonlint-1.6.3.tgz",
"integrity": "sha1-y14x78C3gpHQ2GL77wWQCt8hKYg=",
"requires": {
"JSV": "^4.0.x",
"nomnom": "^1.5.x"
}
},
"jsprim": {
"version": "1.4.1",
"resolved": "http://registry.npm.taobao.org/jsprim/download/jsprim-1.4.1.tgz",
......@@ -9384,6 +9423,37 @@
}
}
},
"nomnom": {
"version": "1.8.1",
"resolved": "https://registry.npm.taobao.org/nomnom/download/nomnom-1.8.1.tgz",
"integrity": "sha1-IVH3Ikcrp55Qp2/BJbuMjy5Nwqc=",
"requires": {
"chalk": "~0.4.0",
"underscore": "~1.6.0"
},
"dependencies": {
"ansi-styles": {
"version": "1.0.0",
"resolved": "https://registry.npm.taobao.org/ansi-styles/download/ansi-styles-1.0.0.tgz",
"integrity": "sha1-yxAt8cVvUSPquLZ817mAJ6AnkXg="
},
"chalk": {
"version": "0.4.0",
"resolved": "https://registry.npm.taobao.org/chalk/download/chalk-0.4.0.tgz",
"integrity": "sha1-UZmj3c0MHv4jvAjBsCewYXbgxk8=",
"requires": {
"ansi-styles": "~1.0.0",
"has-color": "~0.1.0",
"strip-ansi": "~0.1.0"
}
},
"strip-ansi": {
"version": "0.1.1",
"resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-0.1.1.tgz?cache=0&sync_timestamp=1573280518303&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-0.1.1.tgz",
"integrity": "sha1-OeipjQRNFQZgq+SmgIrPcLt7yZE="
}
}
},
"normalize-package-data": {
"version": "2.5.0",
"resolved": "http://registry.npm.taobao.org/normalize-package-data/download/normalize-package-data-2.5.0.tgz",
......@@ -12279,6 +12349,11 @@
"util.promisify": "~1.0.0"
}
},
"system": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/system/-/system-2.0.1.tgz",
"integrity": "sha512-BwSUSa8LMHZouGadZ34ck3TsrH5s3oMmTKPK+xHdbBnTCZOZMJ38fHGKLAHkBl0PXru1Z4BsymQU4qqvTxWzdQ=="
},
"table": {
"version": "4.0.2",
"resolved": "https://registry.npm.taobao.org/table/download/table-4.0.2.tgz",
......@@ -12636,6 +12711,11 @@
}
}
},
"underscore": {
"version": "1.6.0",
"resolved": "https://registry.npm.taobao.org/underscore/download/underscore-1.6.0.tgz",
"integrity": "sha1-izixDKze9jM3uLJOT/htRa6lKag="
},
"unicode-canonical-property-names-ecmascript": {
"version": "1.0.4",
"resolved": "http://registry.npm.taobao.org/unicode-canonical-property-names-ecmascript/download/unicode-canonical-property-names-ecmascript-1.0.4.tgz",
......@@ -12976,6 +13056,15 @@
"integrity": "sha1-JWhhitMcxSX7ggnxXr/85JrmQbM=",
"dev": true
},
"vue-codemirror": {
"version": "4.0.6",
"resolved": "https://registry.npm.taobao.org/vue-codemirror/download/vue-codemirror-4.0.6.tgz",
"integrity": "sha1-t4a7gNjXYqk6q45G95qBAG8EN8Q=",
"requires": {
"codemirror": "^5.41.0",
"diff-match-patch": "^1.0.0"
}
},
"vue-eslint-parser": {
"version": "2.0.3",
"resolved": "https://registry.npm.taobao.org/vue-eslint-parser/download/vue-eslint-parser-2.0.3.tgz",
......
package.json
浏览文件 @ 953f7c93
{
"name": "c-tool",
"version": "1.0.2",
"version": "1.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --port 8081",
......@@ -15,9 +15,12 @@
"cronstrue": "^1.94.0",
"crypto-js": "^3.3.0",
"diff": "^4.0.2",
"file": "^0.2.2",
"http-build-query": "^0.7.0",
"ipinyinjs": "^1.0.0",
"is-url": "^1.2.4",
"js-base64": "^2.6.3",
"jsonlint": "^1.6.3",
"lscache": "^1.3.0",
"moment": "^2.27.0",
"php-array-reader": "^1.2.0",
......@@ -27,8 +30,10 @@
"query-string": "^6.13.1",
"radix.js": "0.0.1",
"serialize-php": "^1.1.2",
"system": "^2.0.1",
"view-design": "^4.0.0",
"vue": "^2.6.11",
"vue-codemirror": "^4.0.6",
"vue-prismjs": "^1.2.0",
"vue-router": "^3.3.4"
},
......
src/tool.router.js
浏览文件 @ 953f7c93
......@@ -81,6 +81,10 @@ const routes = [
{
path: '/tool/time',
component: r => require(['./views/tool/time.vue'], r)
},
{
path: '/tool/json',
component: r => require(['./views/tool/json.vue'], r)
}
]
......
src/tool/config.js
浏览文件 @ 953f7c93
......@@ -6,21 +6,21 @@ export const TOOL_DATA_EXPIRY = 1800
// 徽章过期时间(天)
export const BADGE_EXPIRY = 10
// 分类徽章
export const BADGE_CATEGORY = ['other']
export const BADGE_CATEGORY = ['json']
// 工具徽章
export const BADGE_TOOL = ['time']
export const BADGE_TOOL = ['json']
// 默认常用工具
export const DEFAULT_COMMON_TOOL = [
'hash', 'encrypt', 'base64', 'url', 'timestamp',
'hash', 'encrypt', 'json' ,'base64', 'url', 'timestamp',
'qrCode', 'pinyin', 'ip', 'code', 'unicode',
'decimalConvert', 'regex', 'randomString', 'phpArraySerialize',
'diffs'
'decimalConvert', 'randomString','diffs'
]
const category = [
{ 'name': 'common', 'title': '常用工具' },
{ 'name': 'encryption', 'title': '加密解密' },
{ 'name': 'conversion', 'title': '编码转换' },
{ 'name': 'json', 'title': 'JSON' },
{ 'name': 'other', 'title': '其他工具' },
]
......@@ -28,6 +28,7 @@ const tool = [
{ 'name': 'hash', 'title': '哈希(hash)', cat: ['encryption'] },
{ 'name': 'encrypt', 'title': '加密/解密', cat: ['encryption'] },
{ 'name': 'base64', 'title': 'BASE64编码', cat: ['encryption'] },
{ 'name': 'json', 'title': 'JSON常用工具', cat: ['conversion','json'] },
{ 'name': 'url', 'title': 'URL编码', cat: ['conversion'] },
{ 'name': 'timestamp', 'title': '时间戳', cat: ['conversion'] },
{ 'name': 'qrCode', 'title': '二维码', cat: ['other'] },
......@@ -38,7 +39,7 @@ const tool = [
{ 'name': 'decimalConvert', 'title': '进制转换', cat: ['conversion'] },
{ 'name': 'regex', 'title': '正则表达式', cat: ['other'] },
{ 'name': 'randomString', 'title': '随机字符生成', cat: ['other'] },
{ 'name': 'phpArraySerialize', 'title': 'PHP数组/序列化', cat: ['conversion'] },
{ 'name': 'phpArraySerialize', 'title': 'PHP数组/序列化', cat: ['conversion','json'] },
{ 'name': 'diffs', 'title': '文本差异化对比', cat: ['other'] },
{ 'name': 'crontab', 'title': 'crontab校验', cat: ['other'] },
{ 'name': 'websocket', 'title': 'websocket调试', cat: ['other'] },
......
src/views/tool/code.vue
浏览文件 @ 953f7c93
<template>
<div>
<Tabs v-model="operation">
<TabPane label="输入代码" name="input">
<Input v-model="current.input" :rows="14" type="textarea" placeholder="内容"></Input>
<option-block>
<FormItem>
<ButtonGroup>
<Button type="primary" @click="handle(l)" v-for="l in lang" :key="l">{{l}}</Button>
</ButtonGroup>
</FormItem>
</option-block>
</TabPane>
<TabPane :label="'格式化'+(current.lang ? '('+current.lang+')' : '')+''" name="output">
<code-highlight :lang="current.lang" :code="this.current.output"></code-highlight>
</TabPane>
</Tabs>
<div>
<div style="border: 1px solid #dcdee2;border-radius: 4px;">
<codemirror ref="code" v-model="current.content" :options="options"></codemirror>
</div>
<option-block>
<FormItem>
<ButtonGroup>
<Button type="primary" @click="handle(k,v)" v-for="(v,k) in lang" :key="k">{{k}}</Button>
</ButtonGroup>
</FormItem>
<FormItem>
<Checkbox v-model="current.isCompress">压缩</Checkbox>
</FormItem>
</option-block>
</div>
</template>
<script>
import formatter from 'code-formatter' ;
import { codemirror } from 'vue-codemirror'
import formatter from 'code-formatter'
import 'codemirror/lib/codemirror.css'
import 'codemirror/mode/javascript/javascript.js'
import 'codemirror/mode/htmlmixed/htmlmixed.js'
import 'codemirror/mode/css/css.js'
import 'codemirror/mode/xml/xml.js'
import 'codemirror/mode/sql/sql.js'
import 'codemirror/addon/fold/foldcode.js'
import 'codemirror/addon/fold/foldgutter.js'
import 'codemirror/addon/fold/brace-fold.js'
import 'codemirror/addon/fold/comment-fold.js'
import 'codemirror/addon/fold/foldgutter.css'
export default {
created() {
this.current = Object.assign(this.current, this.$getToolData("input"))
components: {
codemirror,
},
created () {
this.current = Object.assign(this.current, this.$getToolData('content'))
},
mounted () {
this.codemirror.setSize(null, 385)
if (this.current.lang) {
this.codemirror.setOption('mode', this.options[this.current.lang])
}
},
computed: {
codemirror () {
return this.$refs.code.codemirror
},
},
methods: {
handle(v){
if (this.current.input) {
this.current.output = formatter(this.current.input, {
method: v
});
this.current.lang = v;
this.$saveToolData(this.current);
this.operation = "output";
handle (lang, mode) {
if (this.current.content) {
this.current.content = formatter(this.current.content, {
method: this.current.isCompress ? lang+"min" : lang
})
this.codemirror.setOption('mode', mode)
this.current.lang = lang
this.$saveToolData(this.current)
}
},
},
data() {
data () {
return {
current: {
input: "",
output: "",
lang: "",
content: '',
lang: '',
isCompress: false,
},
options: {
mode: null,
lineNumbers: true,
lineWrapping: false,
foldGutter: true,
indentUnit: 4,
gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
},
lang: {
'js': 'text/javascript',
'html': 'text/html',
'css': 'text/css',
'xml': 'application/xml',
'sql': 'text/x-mysql',
},
lang: ["js", "html", "css", "json", "xml", "sql"],
operation: "input"
}
},
}
......
src/views/tool/json.vue 0 → 100644
浏览文件 @ 953f7c93
<template>
<div>
<div style="border: 1px solid #dcdee2;border-radius: 4px;">
<codemirror ref="code" v-model="current.content" :options="options"></codemirror>
</div>
<option-block :style="{textAlign:'center'}">
<FormItem>
<ButtonGroup>
<Button type="primary" @click="handle(k)" v-for="(v,k) in type" :key="k">{{v}}</Button>
</ButtonGroup>
</FormItem>
</option-block>
</div>
</template>
<script>
import { codemirror } from 'vue-codemirror'
import 'codemirror/lib/codemirror.css'
import 'codemirror/mode/javascript/javascript.js'
import 'codemirror/addon/fold/foldcode.js'
import 'codemirror/addon/fold/foldgutter.js'
import 'codemirror/addon/fold/brace-fold.js'
import 'codemirror/addon/fold/comment-fold.js'
import 'codemirror/addon/fold/foldgutter.css'
export default {
components: {
codemirror,
},
created () {
this.current = Object.assign(this.current, this.$getToolData('content'))
},
mounted(){
this.codemirror.setSize(null, 385)
},
computed: {
codemirror() {
return this.$refs.code.codemirror
}
},
methods: {
handle (v) {
if (this.current.content) {
switch (v) {
case 'format':
try {
let content = this.current.content.trim()
if (!content) {
return this.$Notice.error({ title: '错误提示', desc: '请输入内容' })
}
require('jsonlint').parse(content)
this.current.content = JSON.stringify(JSON.parse(this.current.content), null, 4)
} catch (error) {
this.$Notice.error({
title: '错误提示',
desc: error.message,
})
return
}
break
case 'compress':
try {
this.current.content = JSON.stringify(JSON.parse(this.current.content.trim()))
} catch (e) {
this.current.content = this.current.content.replace(/\n/g, '').replace(/\r/g, '')
}
break
case 'escape':
this.current.content = this.current.content.trim().
replace(/\\/g, '\\\\').
replace(/"/g, '\\"')
break
case 'clearEscape':
this.current.content = this.current.content.trim().
replace(/\\\\/g, '\\').
replace(/\\"/g, '"')
break
case 'unicode2zh':
this.current.content = this.unicode2zh()
break
case 'zh2unicode':
this.current.content = this.zh2unicode()
break
case 'get':
try {
const httpBuildQuery = require('http-build-query');
let content = this.current.content.trim()
if (!content) {
return
}
require('jsonlint').parse(content)
this.current.content = httpBuildQuery(JSON.parse(this.current.content))
} catch (error) {
this.$Notice.error({
title: '错误提示',
desc: error.message,
})
return
}
break
case 'clear':
this.current.content = ''
break
default:
return
}
this.$clipboardCopy(this.current.content)
this.$saveToolData(this.current)
}
},
unicode2zh () {
let content = this.current.content
if (content) {
let newStr = ''
let t = 1
for (let i = 0; i < content.length; i += t) {
let str = content.charAt(i)
if (str === '\\' && 'u' === content.charAt(i + 1)) {
console.log(parseInt(parseInt(content.substr(i + 2, 4), 16).toString(10), 10))
newStr += String.fromCharCode(
parseInt(
parseInt(content.substr(i + 2, 4), 16).toString(10),
10
)
)
t = 6
} else {
t = 1
newStr += str
}
}
return newStr
}
return content
},
zh2unicode () {
let content = this.current.content
if (content) {
let newStr = ''
for (let i = 0; i < content.length; i++) {
let str = content.charAt(i)
newStr += /[\u4e00-\u9fa5]/.test(str) ? '\\u' + str.charCodeAt(0).toString(16) : str
}
return newStr
}
return content
},
},
data () {
return {
current: {
content: '',
},
options: {
mode: 'application/json',
lineNumbers: true,
lineWrapping: false,
foldGutter: true,
indentUnit: 4,
gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
},
type: {
'format': '格式化/校验',
'compress': '压缩',
'escape': '转义',
'clearEscape': '去除转义',
'unicode2zh': 'Unicode转中文',
'zh2unicode': '中文转Unicode',
'get': '转GET参数',
'clear': '清空数据',
},
}
},
}
</script>
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或