1 line
8.3 KiB
JSON
1 line
8.3 KiB
JSON
{"ast":null,"code":"import \"./assets/jsoneditor.css\";\nimport JsonEditor from \"./assets/jsoneditor\";\nexport default {\n // props: ['value', 'showBtns', 'mode', 'modes', 'lang'],\n props: {\n value: [String, Number, Object, Array],\n showBtns: [Boolean],\n expandedOnStart: {\n type: Boolean,\n default: false\n },\n mode: {\n type: String,\n default: \"tree\"\n },\n modes: {\n type: Array,\n default: function () {\n return [\"tree\", \"code\", \"form\", \"text\", \"view\"];\n }\n },\n lang: {\n type: String,\n default: \"en\"\n }\n },\n watch: {\n value: {\n immediate: true,\n async handler(val) {\n if (!this.internalChange) {\n await this.setEditor(val);\n this.error = false;\n this.expandAll();\n }\n },\n deep: true\n }\n },\n data() {\n return {\n editor: null,\n error: false,\n json: this.value,\n internalChange: false,\n expandedModes: [\"tree\", \"view\", \"form\"],\n locale: {\n it: {\n save: \"SALVA\"\n },\n en: {\n save: \"SAVE\"\n },\n zh: {\n save: \"保存\"\n }\n }\n };\n },\n mounted() {\n let self = this;\n let options = {\n mode: this.mode,\n modes: this.modes,\n // allowed modes\n onChange() {\n try {\n let json = self.editor.get();\n self.json = json;\n self.error = false;\n self.$emit(\"json-change\", json);\n self.internalChange = true;\n self.$emit(\"input\", json);\n self.$nextTick(function () {\n self.internalChange = false;\n });\n } catch (e) {\n self.error = true;\n self.$emit(\"has-error\", e);\n }\n },\n onModeChange() {\n self.expandAll();\n }\n };\n this.editor = new JsonEditor(this.$el.querySelector(\".jsoneditor-vue\"), options, this.json);\n },\n methods: {\n expandAll() {\n if (this.expandedOnStart && this.expandedModes.includes(this.editor.getMode())) {\n this.editor.expandAll();\n }\n },\n onSave() {\n this.$emit(\"json-save\", this.json);\n },\n async setEditor(value) {\n if (this.editor) this.editor.set(value);\n }\n }\n};","map":{"version":3,"names":["JsonEditor","props","value","String","Number","Object","Array","showBtns","Boolean","expandedOnStart","type","default","mode","modes","lang","watch","immediate","handler","val","internalChange","setEditor","error","expandAll","deep","data","editor","json","expandedModes","locale","it","save","en","zh","mounted","self","options","onChange","get","$emit","$nextTick","e","onModeChange","$el","querySelector","methods","includes","getMode","onSave","set"],"sources":["node_modules/vue-json-editor/vue-json-editor.vue"],"sourcesContent":["<template>\r\n <div>\r\n <div class=\"jsoneditor-vue\"></div>\r\n <div class=\"jsoneditor-btns\" v-if=\"showBtns!==false\">\r\n <button\r\n class=\"json-save-btn\"\r\n type=\"button\"\r\n @click=\"onSave()\"\r\n :disabled=\"error\"\r\n >{{ locale[lang].save }}</button>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport \"./assets/jsoneditor.css\";\r\nimport JsonEditor from \"./assets/jsoneditor\";\r\nexport default {\r\n // props: ['value', 'showBtns', 'mode', 'modes', 'lang'],\r\n props: {\r\n value: [String, Number, Object, Array],\r\n showBtns: [Boolean],\r\n expandedOnStart: {\r\n type: Boolean,\r\n default: false\r\n },\r\n mode: {\r\n type: String,\r\n default: \"tree\"\r\n },\r\n modes: {\r\n type: Array,\r\n default: function() {\r\n return [\"tree\", \"code\", \"form\", \"text\", \"view\"];\r\n }\r\n },\r\n lang: {\r\n type: String,\r\n default: \"en\"\r\n }\r\n },\r\n watch: {\r\n value: {\r\n immediate: true,\r\n async handler(val) {\r\n if (!this.internalChange) {\r\n await this.setEditor(val);\r\n\r\n this.error = false;\r\n this.expandAll();\r\n }\r\n },\r\n deep: true\r\n }\r\n },\r\n data() {\r\n return {\r\n editor: null,\r\n error: false,\r\n json: this.value,\r\n internalChange: false,\r\n expandedModes: [\"tree\", \"view\", \"form\"],\r\n locale: {\r\n it: {\r\n save: \"SALVA\"\r\n },\r\n en: {\r\n save: \"SAVE\"\r\n },\r\n zh: {\r\n save: \"保存\"\r\n }\r\n }\r\n };\r\n },\r\n mounted() {\r\n let self = this;\r\n\r\n let options = {\r\n mode: this.mode,\r\n modes: this.modes, // allowed modes\r\n onChange() {\r\n try {\r\n let json = self.editor.get();\r\n self.json = json;\r\n self.error = false;\r\n self.$emit(\"json-change\", json);\r\n self.internalChange = true;\r\n self.$emit(\"input\", json);\r\n self.$nextTick(function() {\r\n self.internalChange = false;\r\n });\r\n } catch (e) {\r\n self.error = true;\r\n self.$emit(\"has-error\", e);\r\n }\r\n },\r\n onModeChange() {\r\n self.expandAll();\r\n }\r\n };\r\n\r\n this.editor = new JsonEditor(\r\n this.$el.querySelector(\".jsoneditor-vue\"),\r\n options,\r\n this.json\r\n );\r\n },\r\n methods: {\r\n expandAll() {\r\n if (\r\n this.expandedOnStart &&\r\n this.expandedModes.includes(this.editor.getMode())\r\n ) {\r\n this.editor.expandAll();\r\n }\r\n },\r\n\r\n onSave() {\r\n this.$emit(\"json-save\", this.json);\r\n },\r\n\r\n async setEditor(value) {\r\n if (this.editor) this.editor.set(value);\r\n }\r\n }\r\n};\r\n</script>\r\n\r\n<style scoped>\r\n .ace_line_group {\r\n text-align: left;\r\n }\r\n .json-editor-container {\r\n display: flex;\r\n width: 100%;\r\n }\r\n .json-editor-container .tree-mode {\r\n width: 50%;\r\n }\r\n .json-editor-container .code-mode {\r\n flex-grow: 1;\r\n }\r\n .jsoneditor-btns{\r\n text-align: center;\r\n margin-top:10px;\r\n }\r\n .jsoneditor-vue .jsoneditor-outer{\r\n min-height:150px;\r\n }\r\n .jsoneditor-vue div.jsoneditor-tree{\r\n min-height: 350px;\r\n }\r\n .json-save-btn{\r\n background-color: #20A0FF;\r\n border: none;\r\n color:#fff;\r\n padding:5px 10px;\r\n border-radius: 5px;\r\n cursor: pointer;\r\n }\r\n .json-save-btn:focus{\r\n outline: none;\r\n }\r\n .json-save-btn[disabled]{\r\n background-color: #1D8CE0;\r\n cursor: not-allowed;\r\n }\r\n code {\r\n background-color: #f5f5f5;\r\n }\r\n</style>\r\n"],"mappings":"AAeA;AACA,OAAAA,UAAA;AACA;EACA;EACAC,KAAA;IACAC,KAAA,GAAAC,MAAA,EAAAC,MAAA,EAAAC,MAAA,EAAAC,KAAA;IACAC,QAAA,GAAAC,OAAA;IACAC,eAAA;MACAC,IAAA,EAAAF,OAAA;MACAG,OAAA;IACA;IACAC,IAAA;MACAF,IAAA,EAAAP,MAAA;MACAQ,OAAA;IACA;IACAE,KAAA;MACAH,IAAA,EAAAJ,KAAA;MACAK,OAAA,WAAAA,CAAA;QACA;MACA;IACA;IACAG,IAAA;MACAJ,IAAA,EAAAP,MAAA;MACAQ,OAAA;IACA;EACA;EACAI,KAAA;IACAb,KAAA;MACAc,SAAA;MACA,MAAAC,QAAAC,GAAA;QACA,UAAAC,cAAA;UACA,WAAAC,SAAA,CAAAF,GAAA;UAEA,KAAAG,KAAA;UACA,KAAAC,SAAA;QACA;MACA;MACAC,IAAA;IACA;EACA;EACAC,KAAA;IACA;MACAC,MAAA;MACAJ,KAAA;MACAK,IAAA,OAAAxB,KAAA;MACAiB,cAAA;MACAQ,aAAA;MACAC,MAAA;QACAC,EAAA;UACAC,IAAA;QACA;QACAC,EAAA;UACAD,IAAA;QACA;QACAE,EAAA;UACAF,IAAA;QACA;MACA;IACA;EACA;EACAG,QAAA;IACA,IAAAC,IAAA;IAEA,IAAAC,OAAA;MACAvB,IAAA,OAAAA,IAAA;MACAC,KAAA,OAAAA,KAAA;MAAA;MACAuB,SAAA;QACA;UACA,IAAAV,IAAA,GAAAQ,IAAA,CAAAT,MAAA,CAAAY,GAAA;UACAH,IAAA,CAAAR,IAAA,GAAAA,IAAA;UACAQ,IAAA,CAAAb,KAAA;UACAa,IAAA,CAAAI,KAAA,gBAAAZ,IAAA;UACAQ,IAAA,CAAAf,cAAA;UACAe,IAAA,CAAAI,KAAA,UAAAZ,IAAA;UACAQ,IAAA,CAAAK,SAAA;YACAL,IAAA,CAAAf,cAAA;UACA;QACA,SAAAqB,CAAA;UACAN,IAAA,CAAAb,KAAA;UACAa,IAAA,CAAAI,KAAA,cAAAE,CAAA;QACA;MACA;MACAC,aAAA;QACAP,IAAA,CAAAZ,SAAA;MACA;IACA;IAEA,KAAAG,MAAA,OAAAzB,UAAA,CACA,KAAA0C,GAAA,CAAAC,aAAA,qBACAR,OAAA,EACA,KAAAT,IACA;EACA;EACAkB,OAAA;IACAtB,UAAA;MACA,IACA,KAAAb,eAAA,IACA,KAAAkB,aAAA,CAAAkB,QAAA,MAAApB,MAAA,CAAAqB,OAAA,KACA;QACA,KAAArB,MAAA,CAAAH,SAAA;MACA;IACA;IAEAyB,OAAA;MACA,KAAAT,KAAA,mBAAAZ,IAAA;IACA;IAEA,MAAAN,UAAAlB,KAAA;MACA,SAAAuB,MAAA,OAAAA,MAAA,CAAAuB,GAAA,CAAA9C,KAAA;IACA;EACA;AACA","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]} |