lambo-design-bi 0.0.240 → 0.0.242

package/bi/widget/charts/index.vue

@@ -187,7 +187,7 @@ export default {
       }
       const params = {}
       Object.keys(keyMap).forEach(paramKey => {
-        params[paramKey] = row[keyMap[paramKey]]
+        params[keyMap[paramKey]] = row[paramKey]
       })
       console.log("charts联动参数:", {
         sourceWidgetId,

package/bi/widget/container/card/card-widget.vue

@@ -1,14 +1,13 @@
 <template>
-  <lambo-indicator-card-bi
-    :has-title="(cardOptions.title && cardOptions.title.length > 0) ? true : false"
-    :has-extend="isTabsLayout">
+  <lambo-indicator-card-bi :has-title="(cardOptions.title && cardOptions.title.length > 0) ? true : false"
+    :has-extend="hasSwitchLayout">
     <template slot="content-title" v-if="(cardOptions.title && cardOptions.title.length > 0)">
       <div>{{ cardOptions.title }}</div>
       <div class="card-subtitle" v-if="subTitle">{{ subTitle }}</div>
     </template>
-    <template slot="content-extend" v-if="isTabsLayout">
-      <RadioGroup v-model="activeWidgetIndex" type="button" size="small" class="card-tabs-radio">
-        <Radio v-for="(item, index) in childWidgets" :key="index" :label="index">{{ getWidgetLabel(item, index) }}</Radio>
+    <template slot="content-extend" v-if="hasSwitchLayout">
+      <RadioGroup v-model="activeSwitchValue" type="button" size="small" class="card-tabs-radio">
+        <Radio v-for="item in switchItems" :key="item.key" :label="item.key">{{ item.title }}</Radio>
       </RadioGroup>
     </template>
     <div :style="containerStyle || {}">
@@ -44,7 +43,8 @@ export default {
     return {
       containerStyle: {},
       subTitle: null,
-      activeWidgetIndex: 0
+      activeWidgetIndex: 0,
+      activeGroupKey: ''
     }
   },
   computed: {
@@ -54,14 +54,107 @@ export default {
     isTabsLayout() {
       return this.cardOptions.layout === 'tabs'
     },
+    isGroupTabsLayout() {
+      return this.cardOptions.layout === 'groupTabs'
+    },
+    hasSwitchLayout() {
+      return (this.isTabsLayout && this.childWidgets.length > 0)
+        || (this.isGroupTabsLayout && this.groupedWidgets.length > 1)
+    },
     childWidgets() {
       return this.widget.widgets || []
     },
+    childWidgetMap() {
+      const map = {}
+      this.childWidgets.forEach(item => {
+        if (item && (item.id || item.id === 0)) {
+          map[String(item.id)] = item
+        }
+      })
+      return map
+    },
+    groupConfig() {
+      const rawConfig = this.cardOptions.groupConfig
+        || this.cardOptions.group_config
+      if (!rawConfig) {
+        return []
+      }
+      let configList = rawConfig
+      if (typeof configList === 'string') {
+        const trimConfig = configList.trim()
+        if (!trimConfig) {
+          return []
+        }
+        try {
+          configList = JSON.parse(trimConfig)
+        } catch (e) {
+          console.error("BiContainerCard -- groupConfig JSON解析异常:", rawConfig, e)
+          return []
+        }
+      }
+      if (!Array.isArray(configList)) {
+        console.warn("BiContainerCard -- groupConfig 不是数组，忽略:", rawConfig)
+        return []
+      }
+      return configList.filter(item => item && item.key !== undefined && item.key !== null && item.key !== '')
+    },
+    groupedWidgets() {
+      const widgetMap = this.childWidgetMap
+      return this.groupConfig.map(group => {
+        const widgetIds = Array.isArray(group.widgets) ? group.widgets : []
+        const widgets = widgetIds
+          .map(id => widgetMap[String(id)])
+          .filter(Boolean)
+        return {
+          key: String(group.key),
+          title: group.title || group.label || group.name || String(group.key),
+          widgets
+        }
+      })
+    },
+    switchItems() {
+      if (this.isTabsLayout) {
+        return this.childWidgets.map((item, index) => ({
+          key: index,
+          title: this.getWidgetLabel(item, index)
+        }))
+      }
+      if (this.isGroupTabsLayout) {
+        return this.groupedWidgets.map(item => ({
+          key: item.key,
+          title: item.title
+        }))
+      }
+      return []
+    },
     visibleWidgets() {
-      if (!this.isTabsLayout) {
-        return this.childWidgets
+      if (this.isTabsLayout) {
+        return this.childWidgets[this.activeWidgetIndex]
+          ? [this.childWidgets[this.activeWidgetIndex]]
+          : []
+      }
+      if (this.isGroupTabsLayout) {
+        const groups = this.groupedWidgets
+        if (!groups.length) {
+          // 分组配置缺失或无效，回退展示全部子组件，避免页面空白
+          return this.childWidgets
+        }
+        const activeGroup = groups.find(item => item.key === this.activeGroupKey) || groups[0]
+        return activeGroup ? activeGroup.widgets : []
+      }
+      return this.childWidgets
+    },
+    activeSwitchValue: {
+      get() {
+        return this.isGroupTabsLayout ? this.activeGroupKey : this.activeWidgetIndex
+      },
+      set(value) {
+        if (this.isGroupTabsLayout) {
+          this.activeGroupKey = value
+        } else {
+          this.activeWidgetIndex = value
+        }
       }
-      return this.childWidgets[this.activeWidgetIndex] ? [this.childWidgets[this.activeWidgetIndex]] : []
     }
   },
   methods: {
@@ -70,7 +163,13 @@ export default {
       return item.name || (item.options && item.options.title) || `组件${index + 1}`
     },
     getWidgetKey(item, index) {
-      return this.isTabsLayout ? `${this.activeWidgetIndex}_${item.id || index}` : (item.id || index)
+      if (this.isTabsLayout) {
+        return `${this.activeWidgetIndex}_${item.id || index}`
+      }
+      if (this.isGroupTabsLayout) {
+        return `${this.activeGroupKey}_${item.id || index}`
+      }
+      return item.id || index
     },
     initConfig() {
       if (this.cardOptions) {
@@ -81,6 +180,21 @@ export default {
           this.containerStyle = parseStyleStr(this.cardOptions["style"] || {}) || {}
         }
       }
+      this.syncActiveGroupKey()
+    },
+    syncActiveGroupKey() {
+      if (!this.isGroupTabsLayout) {
+        return
+      }
+      const groups = this.groupedWidgets
+      if (!groups.length) {
+        this.activeGroupKey = ''
+        return
+      }
+      const exists = groups.some(item => item.key === this.activeGroupKey)
+      if (!exists) {
+        this.activeGroupKey = groups[0].key
+      }
     }
   },
   created() {
@@ -96,6 +210,18 @@ export default {
         if (this.activeWidgetIndex >= (val || []).length) {
           this.activeWidgetIndex = 0
         }
+        this.syncActiveGroupKey()
+      },
+      deep: true
+    },
+    'cardOptions.layout': {
+      handler() {
+        this.syncActiveGroupKey()
+      }
+    },
+    groupConfig: {
+      handler() {
+        this.syncActiveGroupKey()
       },
       deep: true
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lambo-design-bi",
-  "version": "0.0.240",
+  "version": "0.0.242",
   "description": "Vue2 BI 数据可视化组件库",
   "main": "index.js",
   "author": "finch",

package/pub/order/comps/order-node-header.vue

@@ -9,17 +9,20 @@
       </div>
     </div>
     <div class="node-info">
-      <div class="node-title-row">
+      <div class="node-title-row" v-if="nodeInfo.taskName">
         <span class="task-name">{{ nodeInfo.taskName }}</span>
         <slot name="extra"></slot>
       </div>
+      <div class="node-title-row" v-else>
+        <slot name="extra"></slot>
+      </div>
       <div
           class="node-user-row"
           v-if="nodeInfo.handleUserName"
           :class="{ 'user-bold': !nodeInfo.taskName }"
       >
-      <span class="user-name">{{ nodeInfo.handleUserName }}</span>
-    </div>
+        <span class="user-name">{{ nodeInfo.handleUserName }}</span>
+      </div>
     </div>
   </div>
 </template>
@@ -66,6 +69,18 @@ export default {
   margin-right: 12px;
   flex-shrink: 0;
 }
+.avatar-wrapper ::v-deep .ivu-avatar {
+  text-align: center !important;
+}
+.avatar-wrapper ::v-deep .ivu-avatar-inner {
+  text-align: center !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+}
+.avatar-wrapper ::v-deep .ivu-avatar-string {
+  left: calc(50% - 10px) !important;
+}
 
 .avatar-wrapper >>> .avatar-no-image {
   background: #1890ff !important;

package/pub/order/detail/order-detail.vue

@@ -435,10 +435,5 @@ export default {
   margin: 12px 0 0 0;
   font-size: 14px;
 }
-::v-deep .avatar-wrapper .ivu-avatar {
-  display: flex !important;
-  align-items: center !important;
-  justify-content: center !important;
-  text-align: center !important;
-}
+
 </style>