feat:支持自定义工具项、物料。

VueMue · Jun 24, 2020 · ba69631 · ba69631
1 parent 2a925ba
commit ba69631
Show file tree

Hide file tree

Showing 8 changed files with 2,205 additions and 41 deletions.
diff --git a/public/index.html b/public/index.html
@@ -6,12 +6,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title>x-flowchart-vue</title>
+    <!-- 使用CDN的CSS文件 -->
+    <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
+    <link rel="stylesheet" href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" />
+    <% } %>
   </head>
   <body>
     <noscript>
       <strong>We're sorry but x-flowchart-vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->
+    <!-- 使用CDN的JS文件 -->
+    <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
+    <script type="text/javascript" src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
+    <% } %>
   </body>
 </html>
diff --git a/src/App.vue b/src/App.vue
diff --git a/src/Editor/Index.vue b/src/Editor/Index.vue
@@ -67,6 +67,10 @@
       ShortcutList,
       History
     },
+    props: {
+      tools: Object,
+      materials: Array
+    },
     data () {
       return {
         editorInfo: {},
@@ -311,9 +315,12 @@
         // 绑定unload
         _t.bindUnload()
         // 更新编辑器数据
+        const tools = _t.tools || _t.$X.config.tools
+        const materials = _t.materials || _t.$X.config.materials
         _t.$store.commit('editor/init', {
           instance: _t.editor,
-          ..._t.$X.config.tools
+          ...tools,
+          materials
         })
       },
       _canvasMousedown () {

diff --git a/src/Editor/containers/PanelLeft.vue b/src/Editor/containers/PanelLeft.vue
@@ -18,7 +18,7 @@
 <template>
   <CardBox class="panel-left" placement="left" position="right" :width="250" :title="$t('L10300')" @expand="toggleHandler">
     <CardItem
-      v-for="(item, index) in materials"
+      v-for="(item, index) in materialList"
       :key="index"
       :title="$t(item.lang) || item.label"
       :enableFold="true"
@@ -36,6 +36,8 @@
 </template>
 
 <script>
+  import { mapGetters } from 'vuex'
+
   import CardBox from '../components/CardBox'
   import CardItem from '../components/CardItem'
   import NodeElement from '../components/NodeElement'
@@ -51,9 +53,11 @@
       return {}
     },
     computed: {
-      materials () {
-        const { materials } = this.$X.config
-        return materials.filter(item => item.enable)
+      ...mapGetters([
+        'materials'
+      ]),
+      materialList () {
+        return this.materials.filter(item => item.enable)
       }
     },
     methods: {