fix(ModelManager): Support custom list item component

Author: floryst

src/components/core/WorkflowMenu/script.js

@@ -13,5 +13,8 @@ export default {
       const viewItem = this.dataModel.model.views[viewId];
       return 'size' in viewItem || 'children' in viewItem;
     },
+    getListComponentByName(name) {
+      return this.$store.state.properties.mapping[name.toLowerCase()];
+    },
   },
 };

src/components/core/WorkflowMenu/template.html

@@ -53,7 +53,13 @@
                 <span
                   :class="child.active ? $style.activeListItem : null"
                 >
-                  {{ child.label }}
+                  <component
+                    v-if="node.listComponent"
+                    :is="getListComponentByName(node.listComponent)"
+                    :viewItem="child.viewItem"
+                    :label="child.label"
+                  />
+                  <span v-else>{{ child.label }}</span>
                 </span>
                 <v-spacer />
                 <v-icon

src/core/ModelManager.js

@@ -361,15 +361,18 @@ export default class ModelManager {
     const menu = [];
     this.model.order.forEach((id) => {
       if (this.hideViews.indexOf(id) === -1) {
+        const { size, children, listComponent } = this.model.views[id];
+
         const node = {
           id,
           label: this.localizedData.getView(id),
           bullet: this.isCollapsed(id, 0)
             ? 'collapsedBullet'
             : 'expendedBullet',
           index: 0,
+          listComponent,
         };
-        const { size, children } = this.model.views[id];
+
         const childCount = (this.data[id] && this.data[id].length) || 0;
 
         // Flags
@@ -397,6 +400,7 @@ export default class ModelManager {
               readOnly: this.model.views[id].readOnly || viewItem.readOnly,
               clonable: this.model.views[id].clonable || viewItem.clonable,
               invalid: viewItem.invalid,
+              viewItem,
             };
             nodeChildren.push(child);
           });
@@ -416,6 +420,7 @@ export default class ModelManager {
               noDelete: true,
               readOnly: true,
               clonable: false,
+              viewItem,
             };
             nodeChildren.push(child);
           });