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