jsonpath #128

4dc379d5 · baiy · ninecents · 7440eec6 · 4dc379d5 · 4dc379d5
7 changed file
--- a/README.md
+++ b/README.md
@@ -40,36 +40,36 @@ npm run build -adapter=[chrome|edge|utools|firefox|web]

 ## 功能列表

-| 功能           |说明|离线使用|
-|--------------|---|---|
-| 哈希           |`md5`, `sha1`, `sha256`, `sha512`,`sm3`|√|
-| 加密/解密        |`AES`,`DES`,`RC4`,`Rabbit`,`TripleDes`,`sm2`|√|
-| BASE64编码     |`加密`,`解密`,`支持文件`|√|
-| URL编码        |`编码`,`解码`|√|
-| 时间戳          |`双向转换`,`毫秒`|√|
-| 二维码          |`生成`,`解析`|√|
-| 条形码          |`生成`|√|
-| 汉字转拼音        |`声调`,`首字母`,`分隔符`|√|
-| IP地址查询       |`运营商`,`城市`|×|
-| 代码格式化        |`js`, `ts`, `html`, `css`, `less`, `scss`, `graphql`, `vue`, `angular`, `markdown`, `json5`, `xml`, `yaml`, `sql`, `压缩`|√|
-| Unicode      |`双向转换`,`emoji`,`html 实体`,`css 实体`|√|
-| 进制转换         |`2-64进制`|√|
-| 正则表达式        |`匹配`,`查找`,`替换`|√|
-| 随机字符生成器      |`批量`,`特殊字符`|√|
-| 序列化转换        |`json`, `xml`, `yaml`, `phpArray`, `phpSerialize`, `properties`|√|
-| 文本差异化对比      |`行`,`单词`,`css`|√|
-| crontab校验    |`Crontab`,`规则`,`校验`,`例子`|√|
-| websocket调试  |`websocket`,`在线调试`|×|
-| 单位换算         |`长度`,`面积`,`体积`,`质量`,`温度`,`压力`,`功率`,`功`,`密度`,`力`,`时间`,`速度`,`数据存储`,`角度`|√|
-| 时间计算器        | - |√|
-| JSON工具       |`格式化`,`校验`,`压缩`,`转义`,`去除转义`,`Unicode转中文`,`中文转Unicode`,`转GET参数`,`Java`, `C#`, `Go`, `Dart`,`csv`,`table`,`Protobuf`|√|
-| UUID         |`在线生成uuid`|√|
-| ascii编码转换    |`十进制`, `十六进制`, `八进制`, `二进制`, `字符串`|√|
-| 变量名格式转换      |`Var Name`, `var-name`, `VAR_NAME`, `VarName`, `varName`, `var_name`, `var name`|√|
-| jwt解码        |`header`, `payload`|√|
-| Hex/String转换 |`hex to string`, `string to hex`, `十六进制转字符串`, `字符串转十六进制`|√|
-| 文本处理         |`大小写转换`, `中英文标点转换`, `简繁转换`, `替换`, `字符统计`, `行去重`, `添加行号`, `行排序`, `过滤行首尾不可见字符`,`过滤空行`|√|
-| html编码       |-|√|
-| 原码/反码/补码     |`生成`|√|
-| ARM/HEX      |`互转`|×|
-| IP网络计算器    |`子网掩码各个进制表示换算,IP地址进制表示换算`|√|
+| 功能           | 说明                                                                                                                            |离线使用|
+|--------------|-------------------------------------------------------------------------------------------------------------------------------|---|
+| 哈希           | `md5`, `sha1`, `sha256`, `sha512`,`sm3`                                                                                       |√|
+| 加密/解密        | `AES`,`DES`,`RC4`,`Rabbit`,`TripleDes`,`sm2`                                                                                  |√|
+| BASE64编码     | `加密`,`解密`,`支持文件`                                                                                                              |√|
+| URL编码        | `编码`,`解码`                                                                                                                     |√|
+| 时间戳          | `双向转换`,`毫秒`                                                                                                                   |√|
+| 二维码          | `生成`,`解析`                                                                                                                     |√|
+| 条形码          | `生成`                                                                                                                          |√|
+| 汉字转拼音        | `声调`,`首字母`,`分隔符`                                                                                                              |√|
+| IP地址查询       | `运营商`,`城市`                                                                                                                    |×|
+| 代码格式化        | `js`, `ts`, `html`, `css`, `less`, `scss`, `graphql`, `vue`, `angular`, `markdown`, `json5`, `xml`, `yaml`, `sql`, `压缩`       |√|
+| Unicode      | `双向转换`,`emoji`,`html 实体`,`css 实体`                                                                                             |√|
+| 进制转换         | `2-64进制`                                                                                                                      |√|
+| 正则表达式        | `匹配`,`查找`,`替换`                                                                                                                |√|
+| 随机字符生成器      | `批量`,`特殊字符`                                                                                                                   |√|
+| 序列化转换        | `json`, `xml`, `yaml`, `phpArray`, `phpSerialize`, `properties`                                                               |√|
+| 文本差异化对比      | `行`,`单词`,`css`                                                                                                                |√|
+| crontab校验    | `Crontab`,`规则`,`校验`,`例子`                                                                                                      |√|
+| websocket调试  | `websocket`,`在线调试`                                                                                                            |×|
+| 单位换算         | `长度`,`面积`,`体积`,`质量`,`温度`,`压力`,`功率`,`功`,`密度`,`力`,`时间`,`速度`,`数据存储`,`角度`                                                         |√|
+| 时间计算器        | -                                                                                                                             |√|
+| JSON工具       | `格式化`,`校验`,`压缩`,`转义`,`去除转义`,`Unicode转中文`,`中文转Unicode`,`转GET参数`,`Java`, `C#`, `Go`, `Dart`,`csv`,`table`,`Protobuf`,`jsonpath` |√|
+| UUID         | `在线生成uuid`                                                                                                                    |√|
+| ascii编码转换    | `十进制`, `十六进制`, `八进制`, `二进制`, `字符串`                                                                                            |√|
+| 变量名格式转换      | `Var Name`, `var-name`, `VAR_NAME`, `VarName`, `varName`, `var_name`, `var name`                                              |√|
+| jwt解码        | `header`, `payload`                                                                                                           |√|
+| Hex/String转换 | `hex to string`, `string to hex`, `十六进制转字符串`, `字符串转十六进制`                                                                      |√|
+| 文本处理         | `大小写转换`, `中英文标点转换`, `简繁转换`, `替换`, `字符统计`, `行去重`, `添加行号`, `行排序`, `过滤行首尾不可见字符`,`过滤空行`                                           |√|
+| html编码       | -                                                                                                                             |√|
+| 原码/反码/补码     | `生成`                                                                                                                          |√|
+| ARM/HEX      | `互转`                                                                                                                          |×|
+| IP网络计算器    | `子网掩码各个进制表示换算,IP地址进制表示换算`                                                                                                     |√|
--- a/package-lock.json
+++ b/package-lock.json
 {
    "name": "c-tool",
-    "version": "1.10.3",
+    "version": "1.11.0",
    "lockfileVersion": 2,
    "requires": true,
    "packages": {
        "": {
            "name": "c-tool",
-            "version": "1.10.3",
+            "version": "1.11.0",
            "dependencies": {
                "@babel/parser": "^7.17.0",
                "@prettier/plugin-php": "^0.17.6",
@@ -43,6 +43,7 @@
                "json-to-properties": "^1.1.3",
                "json5": "^2.2.0",
                "jsonlint": "^1.6.3",
+                "jsonpath-plus": "^6.0.1",
                "jsrsasign": "^10.5.1",
                "jsrsasign-util": "^1.0.5",
                "jwt-decode": "^3.1.2",
@@ -8458,6 +8459,14 @@
                "node": ">= 0.6"
            }
        },
+        "node_modules/jsonpath-plus": {
+            "version": "6.0.1",
+            "resolved": "https://registry.npmjs.org/jsonpath-plus/-/jsonpath-plus-6.0.1.tgz",
+            "integrity": "sha512-EvGovdvau6FyLexFH2OeXfIITlgIbgZoAZe3usiySeaIDm5QS+A10DKNpaPBBqqRSZr2HN6HVNXxtwUAr2apEw==",
+            "engines": {
+                "node": ">=10.0.0"
+            }
+        },
        "node_modules/jsprim": {
            "version": "1.4.2",
            "resolved": "https://registry.npmmirror.com/jsprim/-/jsprim-1.4.2.tgz",
@@ -20831,6 +20840,11 @@
                "nomnom": "^1.5.x"
            }
        },
+        "jsonpath-plus": {
+            "version": "6.0.1",
+            "resolved": "https://registry.npmjs.org/jsonpath-plus/-/jsonpath-plus-6.0.1.tgz",
+            "integrity": "sha512-EvGovdvau6FyLexFH2OeXfIITlgIbgZoAZe3usiySeaIDm5QS+A10DKNpaPBBqqRSZr2HN6HVNXxtwUAr2apEw=="
+        },
        "jsprim": {
            "version": "1.4.2",
            "resolved": "https://registry.npmmirror.com/jsprim/-/jsprim-1.4.2.tgz",
--- a/package.json
+++ b/package.json
 {
    "name": "c-tool",
-    "version": "1.11.0",
+    "version": "1.11.1",
    "private": true,
    "scripts": {
        "serve": "vue-cli-service serve --port 8081",
@@ -44,6 +44,7 @@
        "json-to-properties": "^1.1.3",
        "json5": "^2.2.0",
        "jsonlint": "^1.6.3",
+        "jsonpath-plus": "^6.0.1",
        "jsrsasign": "^10.5.1",
        "jsrsasign-util": "^1.0.5",
        "jwt-decode": "^3.1.2",

--- a/src/i18n/locales/en/json.i18n.json5
+++ b/src/i18n/locales/en/json.i18n.json5
@@ -16,7 +16,8 @@
    "get": "Get Query",
    "object":"To Object",
    "csv": "CSV",
-    "table":"Html Table",
+    "table":"Table",
+    "path":"Path",
    "add_quote":"Add Quote",
    "column_name":"Column Name",
    "json_type_json": "Json",

--- a/src/i18n/locales/zh_CN/json.i18n.json5
+++ b/src/i18n/locales/zh_CN/json.i18n.json5
@@ -15,7 +15,8 @@
    "get": "Get参数",
    "object":"转实体类",
    "csv": "CSV",
-    "table":"Html Table",
+    "table":"Table",
+    "path":"Path",
    "add_quote":"添加引号",
    "column_name":"列名",
    "json_type_json": "Json",

--- a/src/views/tool/json.vue
+++ b/src/views/tool/json.vue
@@ -25,6 +25,9 @@
                <Col :span="24-jsonInputCol" v-if="isMode('object')">
                    <jsonToObject :json="current.content" :height="height" v-model="current.to_object" @saveToolData="saveToolData" />
                </Col>
+                <Col :span="24-jsonInputCol" v-if="isMode('path')">
+                    <jsonPath :json="current.content" :height="height" v-model="current.path" @saveToolData="saveToolData" />
+                </Col>
            </Row>
        </heightResize>
        <option-block style="padding-top: 10px" disable-padding class="tool-json-mode-get" v-if="isMode('to_get') || isMode('from_get')">
@@ -36,6 +39,7 @@
                <ButtonGroup class="tool-json-item">
                    <Button type="primary" @click="simple('beautify')">{{ $t('json_format') }}</Button>
                    <Button type="primary" @click="simple('compress')">{{ $t('json_compress') }}</Button>
+                    <Button type="primary" @click="setMode('path')">{{ $t('json_path') }}</Button>
                </ButtonGroup>
                <Dropdown @on-click="(name)=>simple(name)" class="tool-json-item">
                    <Button type="primary">
@@ -57,34 +61,18 @@
                        <DropdownItem name="zh2unicode">{{ $t('json_zh_to_unicode') }}</DropdownItem>
                    </DropdownMenu>
                </Dropdown>
-                <Dropdown @on-click="(name)=>setMode(name)" class="tool-json-item">
-                    <Button type="primary">
-                        {{ $t('json_get') }}
-                        <Icon type="ios-arrow-up" />
-                    </Button>
-                    <DropdownMenu slot="list">
-                        <DropdownItem name="to_get">JSON => Get</DropdownItem>
-                        <DropdownItem name="from_get">Get => JSON</DropdownItem>
-                    </DropdownMenu>
-                </Dropdown>
                <Button class="tool-json-item" type="primary" @click="setMode('object')">{{ $t('json_object') }}</Button>
                <Dropdown @on-click="(name)=>setMode(name)" class="tool-json-item">
                    <Button type="primary">
-                        {{ $t('json_csv') }}
+                        {{ $t('json_get') }} / {{ $t('json_csv') }} / {{ $t('json_table') }}
                        <Icon type="ios-arrow-up" />
                    </Button>
                    <DropdownMenu slot="list">
+                        <DropdownItem name="to_get">JSON => Get</DropdownItem>
                        <DropdownItem name="to_csv">JSON => CSV</DropdownItem>
-                        <DropdownItem name="from_csv">CSV => JSON</DropdownItem>
-                    </DropdownMenu>
-                </Dropdown>
-                <Dropdown @on-click="(name)=>setMode(name)" class="tool-json-item">
-                    <Button type="primary">
-                        {{ $t('json_table') }}
-                        <Icon type="ios-arrow-up" />
-                    </Button>
-                    <DropdownMenu slot="list">
                        <DropdownItem name="to_table">JSON => Table</DropdownItem>
+                        <DropdownItem name="from_get">Get => JSON</DropdownItem>
+                        <DropdownItem name="from_csv">CSV => JSON</DropdownItem>
                        <DropdownItem name="from_table">Table => JSON</DropdownItem>
                    </DropdownMenu>
                </Dropdown>
@@ -102,6 +90,7 @@ import tableToJson from "./library/json/components/tableToJson";
 import {dispatchWindowResize} from "../../tool/event";
 import jsonToCsv from "./library/json/components/jsonToCsv";
 import jsonToTable from "./library/json/components/jsonToTable";
+import jsonPath from "./library/json/components/jsonPath";

 export default {
    components: {
@@ -111,14 +100,15 @@ export default {
        heightResize,
        csvToJson,
        jsonToObject,
-        tableToJson
+        tableToJson,
+        jsonPath
    },
    computed:{
        jsonInputCol(){
            if (this.isMode('object')){
                return 10
            }
-            if (this.isMode('from_csv') || this.isMode('from_table') || this.isMode('to_csv') || this.isMode('to_table')){
+            if (this.isMode('from_csv') || this.isMode('from_table') || this.isMode('to_csv') || this.isMode('to_table') || this.isMode('path')){
                return 12
            }
            return 24
@@ -210,6 +200,7 @@ export default {
                from_table:{},
                to_csv:{},
                to_table:{},
+                path:{},
                mode: "default"
            },
            height:100

--- a/src/views/tool/library/json/components/jsonPath.vue
+++ b/src/views/tool/library/json/components/jsonPath.vue
+<template>
+    <div>
+        <div style="margin-bottom: 10px">
+            <Input v-model="options.path">
+                <span slot="prepend">JsonPath</span>
+                <Button slot="append" icon="md-help-circle" to="https://goessner.net/articles/JsonPath/" target="_blank"></Button>
+            </Input>
+        </div>
+        <div :style="`height:${height - 42}px`">
+            <code-editor :value="output" language="json"></code-editor>
+        </div>
+    </div>
+</template>
+<script>
+import codeEditor from "../../../components/codeEditor";
+import {JSONPath} from "jsonpath-plus";
+import jsonInstance from "../../../library/json";
+
+export default {
+    components: {
+        codeEditor
+    },
+    props: {
+        value: {
+            type: Object,
+            default: function () {
+                return {}
+            }
+        },
+        json: {
+            type: String,
+            default: ""
+        },
+        height: {
+            type: Number,
+            default: 100
+        }
+    },
+    created() {
+        this.options = Object.assign(this.options, this.value)
+    },
+    computed: {
+        output() {
+            try{
+                const json = this.json.trim();
+                if (!json) {
+                    return "";
+                }
+                const result = JSONPath({path: this.options.path, json:JSON.parse(json)});
+                this.$emit('input', this.options);
+                // 保存数据
+                this.$emit('saveToolData');
+                return jsonInstance.beautify(JSON.stringify(result));
+            }catch (e) {
+                return e.message
+            }
+        },
+    },
+    data() {
+        return {
+            options: {
+                path: ""
+            }
+        }
+    },
+}
+</script>