Skip to content

1
1024程序员开源挑战赛

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

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

通知 3
Star 1
Fork 0
1
1024程序员开源挑战赛
提交 6050d5cf 编写于 作者: B baiy 提交者： ninecents
浏览文件
操作

添加json处理工具 #22

上级 b0f9f954
隐藏空白更改
内联 并排
Showing with 396 addition and 343 deletion
package-lock.json
浏览文件 @ 6050d5cf
......@@ -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
浏览文件 @ 6050d5cf
{
"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
浏览文件 @ 6050d5cf
import Vue from 'vue'
import Router from 'vue-router'
import {env} from './helper'
import {stringify as queryStringify} from "query-string";
import user from "./tool/user";
import { stat } from './helper'
Vue.use(Router)
export const stat = (action, data = {}) => {
setTimeout(() => {
try {
let img = new Image(1, 1);
img.src = 'https://www.baiy.org/chrome_tool/stat/?' + queryStringify({
v: env('version'),
a: action,
u: user.uid(),
p: env('platform'),
r: Math.random(),
...data
});
} catch (e) {
// todo
}
}, 3000)
};
// 路由配置
const routes = [
{
......@@ -46,10 +26,6 @@ const routes = [
path: '/tool/encrypt',
component: r => require(['./views/tool/encrypt.vue'], r)
},
{
path: '/tool/sign',
component: r => require(['./views/tool/sign.vue'], r)
},
{
path: '/tool/hash',
component: r => require(['./views/tool/hash.vue'], r)
......@@ -59,8 +35,8 @@ const routes = [
component: r => require(['./views/tool/ip.vue'], r)
},
{
path: '/tool/serializeConversion',
component: r => require(['./views/tool/serializeConversion.vue'], r)
path: '/tool/phpArraySerialize',
component: r => require(['./views/tool/phpArraySerialize.vue'], r)
},
{
path: '/tool/pinyin',
......@@ -70,10 +46,6 @@ const routes = [
path: '/tool/qrCode',
component: r => require(['./views/tool/qrCode.vue'], r)
},
{
path: '/tool/barcode',
component: r => require(['./views/tool/barcode.vue'], r)
},
{
path: '/tool/randomString',
component: r => require(['./views/tool/randomString.vue'], r)
......@@ -113,47 +85,15 @@ const routes = [
{
path: '/tool/json',
component: r => require(['./views/tool/json.vue'], r)
},
{
path: '/tool/uuid',
component: r => require(['./views/tool/uuid.vue'], r)
},
{
path: '/tool/jsonToObject',
component: r => require(['./views/tool/jsonToObject.vue'], r)
},
{
path: '/tool/ascii',
component: r => require(['./views/tool/ascii.vue'], r)
},
{
path: '/tool/variableConversion',
component: r => require(['./views/tool/variableConversion.vue'], r)
},
{
path: '/tool/jwt',
component: r => require(['./views/tool/jwt.vue'], r)
},
{
path: '/tool/hexString',
component: r => require(['./views/tool/hexString.vue'], r)
},
{
path: '/tool/text',
component: r => require(['./views/tool/text.vue'], r)
},
{
path: '/tool/html',
component: r => require(['./views/tool/html.vue'], r)
}
]
const router = new Router({routes})
const router = new Router({ routes })
stat('index')
router.afterEach(to => {
stat('tool', {tool: to.path})
stat('tool', { tool: to.path })
})
export default router
export default router
\ No newline at end of file
src/tool/config.js
浏览文件 @ 6050d5cf
import {env} from '../helper'
import { env, inArray } from '../helper'
import cache from './cache'
const toolConfig = require('../config')
// 工具缓存数据过期时间(秒)
export const TOOL_DATA_EXPIRY = toolConfig.toolDataExpiry
export const TOOL_DATA_EXPIRY = 1800
// 徽章过期时间(天)
export const BADGE_EXPIRY = toolConfig.badgeExpiry
export const BADGE_EXPIRY = 10
// 分类徽章
export const BADGE_CATEGORY = toolConfig.badgeCategory
export const BADGE_CATEGORY = ['json']
// 工具徽章
export const BADGE_TOOL = toolConfig.badgeTool
export const BADGE_TOOL = ['json']
// 默认常用工具
export const DEFAULT_COMMON_TOOL = toolConfig.defaultCommonTool
export const DEFAULT_COMMON_TOOL = [
'hash', 'encrypt', 'json' ,'base64', 'url', 'timestamp',
'qrCode', 'pinyin', 'ip', 'code', 'unicode',
'decimalConvert', 'randomString','diffs'
]
const category = toolConfig.category
const category = [
{ 'name': 'common', 'title': '常用工具' },
{ 'name': 'encryption', 'title': '加密解密' },
{ 'name': 'conversion', 'title': '编码转换' },
{ 'name': 'json', 'title': 'JSON' },
{ 'name': 'other', 'title': '其他工具' },
]
const tool = toolConfig.tool
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'] },
{ 'name': 'pinyin', 'title': '汉字转拼音', cat: ['conversion'] },
{ 'name': 'ip', 'title': 'IP地址查询', cat: ['other'] },
{ 'name': 'code', 'title': '代码格式化', cat: ['other'] },
{ 'name': 'unicode', 'title': 'Unicode', cat: ['conversion'] },
{ 'name': 'decimalConvert', 'title': '进制转换', cat: ['conversion'] },
{ 'name': 'regex', 'title': '正则表达式', cat: ['other'] },
{ 'name': 'randomString', 'title': '随机字符生成', cat: ['other'] },
{ 'name': 'phpArraySerialize', 'title': 'PHP数组/序列化', cat: ['conversion','json'] },
{ 'name': 'diffs', 'title': '文本差异化对比', cat: ['other'] },
{ 'name': 'crontab', 'title': 'crontab校验', cat: ['other'] },
{ 'name': 'websocket', 'title': 'websocket调试', cat: ['other'] },
{ 'name': 'unit', 'title': '单位换算', cat: ['other'] },
{ 'name': 'time', 'title': '时间计算器', cat: ['other'] },
]
// 徽章是否显示
const badgeIsShow = function () {
return (Date.parse((new Date()).toString()) / 1000) - env('updateTime') <
BADGE_EXPIRY * 86400
return (Date.parse((new Date()).toString()) / 1000) - env('updateTime') < BADGE_EXPIRY * 86400
}
const getUserCommon = function () {
......@@ -30,61 +58,26 @@ const getUserCommon = function () {
}
const setUserCommon = function (tools) {
cache.setNoVersion('user_common', tools)
}
const getToolDefaultCategory = function (name) {
for (let i = 0; i < tool.length; i++) {
if (tool[i].name === name) {
return tool[i].cat[0]
}
}
return ''
}
/**
* @param name
* @param defaultValue
* @return {any}
*/
const getSetting = function (name, defaultValue = null) {
let setting = cache.getNoVersion('setting', {})
return !setting.hasOwnProperty(name) ? defaultValue : setting[name]
}
/**
* @param name
* @param value
* @return {boolean}
*/
const saveSetting = function (name, value) {
let setting = cache.getNoVersion('setting', {})
setting[name] = value
cache.setNoVersion('setting', setting);
return true
cache.setnNoVersion('user_common', tools)
}
export default {
tool:tool,
saveSetting,
getSetting,
tool,
category,
setUserCommon,
getUserCommon,
getToolByCategory(cat) {
let common = getUserCommon();
getToolByCategory (cat) {
return tool.filter((t) => {
if (cat === 'common') {
return common.includes(t.name)
return inArray(t.name, getUserCommon())
}
return t.cat.includes(cat);
return inArray(cat, t.cat)
})
},
getToolDefaultCategory,
badgeToolIsShow(tool) {
return badgeIsShow() && BADGE_TOOL.includes(tool)
},
badgeCategoryIsShow(cat) {
return badgeIsShow() && BADGE_CATEGORY.includes(cat)
badgeToolIsShow (tool) {
return badgeIsShow() && inArray(tool, BADGE_TOOL)
},
}
badgeCategoryIsShow (cat) {
return badgeIsShow() && inArray(cat, BADGE_CATEGORY)
}
}
\ No newline at end of file
src/views/tool/code.vue
浏览文件 @ 6050d5cf
<template>
<div>
<heightResize :append="['.page-option-block']">
<code-editor ref="editor" v-model="current.content" :language="this.current.lang"></code-editor>
</heightResize>
<option-block class="page-option-block">
<FormItem>
<ButtonGroup>
<Button
:type="current.lang !== item ? 'primary' : 'warning'"
@click="handle(item)"
v-for="item in buttonLang"
:key="item"
>{{ item }}
</Button>
</ButtonGroup>
</FormItem>
<FormItem>
<Select :placeholder="$t('code_more')" @on-change="(value)=>{handle(value)}">
<Option v-for="item in lang" :value="item" :key="item">{{ item }}</Option>
</Select>
</FormItem>
<FormItem>
<Select :placeholder="$t('code_indent')" v-model="current.tab">
<Option :value="2">{{ $t('code_indent_width',[2]) }}</Option>
<Option :value="4">{{ $t('code_indent_width',[4]) }}</Option>
<Option :value="6">{{ $t('code_indent_width',[6]) }}</Option>
<Option :value="8">{{ $t('code_indent_width',[8]) }}</Option>
</Select>
</FormItem>
<FormItem>
<Checkbox v-model="current.isCompress">{{ $t('code_compress') }}</Checkbox>
</FormItem>
</option-block>
<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 _ from "lodash";
import codeEditor from "./components/codeEditor";
import heightResize from "./components/heightResize";
export default {
components: {
codeEditor,
heightResize
},
computed: {
buttonLang() {
let data = _.slice(this.lang, 0, 7)
if (this.current.lang && !data.includes(this.current.lang)) {
data.push(this.current.lang)
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 {
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])
}
return data
}
},
created() {
this.$initToolData('content')
},
methods: {
handle(language) {
if (this.current.content) {
try {
this.current.lang = language;
if (!this.current.isCompress) {
let option = {tab: this.current.tab}
this.$refs.editor.format(language, option);
} else {
this.$refs.editor.compress(language);
}
this.$saveToolData(this.current);
return this.$Message.success(this.$t('code_complete').toString());
} catch (e) {
console.log(e)
return this.$Modal.error({
title: this.$t('code_error_prompt').toString(),
content: `${e.message}`
});
},
computed: {
codemirror () {
return this.$refs.code.codemirror
},
},
methods: {
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 () {
return {
current: {
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',
},
}
},
},
data() {
return {
current: {
content: "",
isCompress: false,
lang: "",
tab: 4,
},
lang: [
"html",
"js",
"css",
"xml",
"json",
"sql",
"yaml",
"php",
"ts",
"java",
"scss",
"less",
"graphql",
"markdown",
"vue",
"angular",
],
};
},
};
</script>
}
</script>
\ No newline at end of file
src/views/tool/json.vue
浏览文件 @ 6050d5cf
<template>
<div>
<heightResize :append="['.page-option-block']">
<code-editor :placeholder="$t('json_input')" v-model="current.content" language="json"></code-editor>
</heightResize>
<option-block center class="page-option-block">
<FormItem>
<ButtonGroup class="tool-json-button">
<Button type="primary" @click="handle(k)" v-for="(v,k) in type" :key="k">{{ v }}</Button>
</ButtonGroup>
</FormItem>
</option-block>
<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 Unicode from "./library/unicode"
import jsonFormatter from "./library/formatter/json"
import codeEditor from "./components/codeEditor";
import heightResize from "./components/heightResize";
export default {
components: {
codeEditor,
heightResize
},
created() {
this.$initToolData('content')
},
methods: {
handle(v) {
try {
if (!this.current.content.trim()) {
throw new Error(this.$t('json_content_empty').toString())
}
// 保存操作前数据
this.$saveToolData(this.current, true)
this.operation(v)
this.$clipboardCopy(this.current.content)
this.$saveToolData(this.current)
} catch (e) {
return this.$Message.error(this.$t('json_error', [e.message]).toString())
}
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,
},
operation(type) {
switch (type) {
case 'format':
require('jsonlint').parse(this.current.content)
this.current.content = jsonFormatter.beautify(this.current.content)
break
case 'compress':
this.current.content = jsonFormatter.compress(this.current.content)
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(this.current.content)
break
case 'zh2unicode':
this.current.content = this.zh2unicode(this.current.content)
break
case 'get':
require('jsonlint').parse(this.current.content)
this.current.content = require('query-string').stringify(
JSON.parse(this.current.content), {arrayFormat: 'bracket'}
)
break
case 'getToJson':
this.current.content = jsonFormatter.beautify(
JSON.stringify(require('query-string').parse(this.current.content.trim(), {arrayFormat: 'bracket'}))
)
break
case 'clear':
this.current.content = ''
break
default:
return
}
created () {
this.current = Object.assign(this.current, this.$getToolData('content'))
},
unicode2zh(content) {
return Unicode.decode(
content.replace(/\\U[0-9a-fA-F]{4}/g, (item) => {
// \Uxxxx=>\uxxxx
return item.replace("\\U", "\\u");
})
)
mounted(){
this.codemirror.setSize(null, 385)
},
zh2unicode(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
computed: {
codemirror() {
return this.$refs.code.codemirror
}
return content
}
},
data() {
return {
current: {
content: '',
},
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)
}
},
type: {
'format': this.$t('json_format'),
'compress': this.$t('json_compress'),
'escape': this.$t('json_escape'),
'clearEscape': this.$t('json_clear_escape'),
'unicode2zh': this.$t('json_unicode_to_zh'),
'zh2unicode': this.$t('json_zh_to_unicode'),
'get': this.$t('json_to_get'),
'getToJson': this.$t('json_get_to_json'),
'clear': this.$t('json_clear'),
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
},
}
},
}
</script>
<style scoped>
.tool-json-button .ivu-btn {
padding: 0 10px;
}
</style>
},
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.
先完成此消息的编辑！
想要评论请 注册 或