From b870e28608dbefd18e5163c585cdb65af5715a08 Mon Sep 17 00:00:00 2001 From: shangbin Date: Wed, 8 Dec 2021 18:59:04 +0800 Subject: [PATCH] =?UTF-8?q?update:=20=E9=9B=86=E6=88=90=E5=A5=BDvuedraggab?= =?UTF-8?q?le?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 27 +- package.json | 3 +- src/components-v2/VCC.vue | 20 +- src/components/AttributeInput.vue | 4 +- src/components/CodeStructure.vue | 105 ++--- src/components/halower-tree.min.css | 576 +++++++++++++++++++++++++++- src/components/nested.vue | 89 +++++ src/libs/store.js | 24 ++ src/main.js | 10 +- 9 files changed, 766 insertions(+), 92 deletions(-) create mode 100644 src/components/nested.vue create mode 100644 src/libs/store.js diff --git a/package-lock.json b/package-lock.json index 1c91ac8..0e359d8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2189,6 +2189,11 @@ } } }, + "@vue/devtools-api": { + "version": "6.0.0-beta.20.1", + "resolved": "https://rg.cnpmjs.org/@vue/devtools-api/download/@vue/devtools-api-6.0.0-beta.20.1.tgz", + "integrity": "sha512-R2rfiRY+kZugzWh9ZyITaovx+jpU4vgivAEAiz80kvh3yviiTU3CBuGuyWpSwGz9/C7TkSWVM/FtQRGlZ16n8Q==" + }, "@vue/eslint-config-airbnb": { "version": "5.3.0", "resolved": "https://r.cnpmjs.org/@vue/eslint-config-airbnb/download/@vue/eslint-config-airbnb-5.3.0.tgz", @@ -11934,6 +11939,11 @@ } } }, + "sortablejs": { + "version": "1.14.0", + "resolved": "https://rg.cnpmjs.org/sortablejs/download/sortablejs-1.14.0.tgz", + "integrity": "sha1-bS4XzL2yX0ZHNN9iHU811Ks1s9g=" + }, "source-list-map": { "version": "2.0.1", "resolved": "https://r.cnpmjs.org/source-list-map/download/source-list-map-2.0.1.tgz", @@ -13347,10 +13357,21 @@ "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=", "dev": true }, + "vuedraggable": { + "version": "4.1.0", + "resolved": "https://rg.cnpmjs.org/vuedraggable/download/vuedraggable-4.1.0.tgz", + "integrity": "sha1-7ezmituKTZ4GrM/538kEDmaFInA=", + "requires": { + "sortablejs": "1.14.0" + } + }, "vuex": { - "version": "3.6.2", - "resolved": "https://r.cnpmjs.org/vuex/download/vuex-3.6.2.tgz", - "integrity": "sha1-I2vAhqhww655lG8QfxbeWdWJXnE=" + "version": "4.0.2", + "resolved": "https://rg.cnpmjs.org/vuex/download/vuex-4.0.2.tgz", + "integrity": "sha1-+Jbb1b8qDpY/AMZ+m2EN50nMrMk=", + "requires": { + "@vue/devtools-api": "^6.0.0-beta.11" + } }, "watchpack": { "version": "1.7.5", diff --git a/package.json b/package.json index 0b21e45..591938f 100644 --- a/package.json +++ b/package.json @@ -62,7 +62,8 @@ "vue": "^3.2.22", "vue-nestable": "^2.6.0", "vue-router": "^3.4.9", - "vuex": "^3.1.2" + "vuedraggable": "^4.1.0", + "vuex": "^4.0.2" }, "devDependencies": { "@babel/generator": "^7.11.6", diff --git a/src/components-v2/VCC.vue b/src/components-v2/VCC.vue index 32f4273..5d6c907 100644 --- a/src/components-v2/VCC.vue +++ b/src/components-v2/VCC.vue @@ -16,8 +16,7 @@ + ref="attributeInput" shortcutInitMode="hand" :__rawVueInfo__="currentEditRawInfo"> @@ -50,7 +49,7 @@ + @reRender="render"> @@ -220,11 +219,6 @@ export default { this.mainPanelProvider.saveAttribute(resultList, lc_id); }, - onLevelChange(removeID, movePath) { - this.mainPanelProvider.onLevelChange(removeID, movePath); - }, - - generateVueCode() { }, onRemove({ lc_id }) { this.mainPanelProvider.remove(lc_id); }, @@ -240,10 +234,20 @@ export default { this.mainPanelProvider.saveJSCode(code); }, + /** + * 二级编辑解析 + */ codeParseSucess(vueCodeEntity) { this.mainPanelProvider.render(vueCodeEntity); }, + /** + * 渲染指定结构 + */ + render(codeEntity) { + this.mainPanelProvider.render(codeEntity); + }, + help() { window.open('/doc') } diff --git a/src/components/AttributeInput.vue b/src/components/AttributeInput.vue index 014f6e8..4041bf3 100644 --- a/src/components/AttributeInput.vue +++ b/src/components/AttributeInput.vue @@ -1,7 +1,7 @@ + \ No newline at end of file diff --git a/src/libs/store.js b/src/libs/store.js new file mode 100644 index 0000000..63f5c66 --- /dev/null +++ b/src/libs/store.js @@ -0,0 +1,24 @@ +import { createStore } from 'vuex' + +const store = createStore({ + state() { + return { + count: 0, + currentEditComp: null, + renderCount: 0 + } + }, + mutations: { + increment(state) { + state.count++ + }, + storeCurrentEditComp(state, newComp) { + state.currentEditComp = newComp; + }, + onDragEnd(state) { + state.renderCount++; + } + } +}) + +globalApp.use(store); \ No newline at end of file diff --git a/src/main.js b/src/main.js index 9ed3967..5d21b76 100644 --- a/src/main.js +++ b/src/main.js @@ -1,4 +1,4 @@ -import { createApp, compile } from "vue"; +import { createApp } from "vue"; import ElementPlus from "element-plus"; import { QuestionFilled, CirclePlus, DocumentCopy, Delete, Refresh, Minus } from "@element-plus/icons"; @@ -19,8 +19,12 @@ function createBaseApp(renderComponent = {}) { return app; } -createBaseApp(APP).mount("#app"); +const globalApp = createBaseApp(APP) +globalApp.mount("#app"); // 内部需要同样配置的全局Vue self.createBaseApp = createBaseApp; -self.compile = compile; +self.globalApp = globalApp; // 内部需要使用Vuex + + +import("@/libs/store.js"); \ No newline at end of file