lambo-design-bi 0.0.150 → 0.0.152

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

@@ -39,7 +39,7 @@ export default {
     getWidgetName
   },
   created() {
-
+    console.log("ContainerCard params:", this.params)
   },
   mounted() {
 

package/bi/widget/container/card/comps/indicator-card/src/styles/css/card.less

@@ -85,13 +85,7 @@
     background: var(--component-background, @_component-background);
     border-radius: 0 0 var(--border-radius-base, @_border-radius-base) var(--border-radius-base, @_border-radius-base);
     padding: 8px 8px;
-
-    display: flex;          // 启用flex布局
-    flex-wrap: wrap;        // 允许换行
-    justify-content: flex-start; // 元素间距均匀分布
-    align-items: flex-start; // 顶部对齐
-    gap: 8px;
-
+    
     &.no-border-top {
       border-top: 0;
       border-radius: var(--border-radius-base, @_border-radius-base);

package/bi/widget/num/index.vue

@@ -1,14 +1,15 @@
 <template>
-  <num-index :title="widget.name" :val="numVal" :unit="unit" :items="items" :note="widget.options.note"></num-index>
+  <LamboNumberInfoBi :title="title" :sub-title="subTitle" :num="num" :sub-num1="subNum1" :trend1="trend1"
+    :sub-num2="subNum2" :trend2="trend2">
+  </LamboNumberInfoBi>
 </template>
 <script>
-import NumIndex from "../../../pub/num-index/num-index.vue"
 import { getListMapData } from "../api/data"
-import { formatNumLocale } from "../../../util/num-util"
+import LamboNumberInfoBi from "../../../pub/number-info/index"
 
 export default {
   name: "BiNumIndex",
-  components: { NumIndex },
+  components: { LamboNumberInfoBi },
   props: {
     widget: {
       type: Object,
@@ -21,25 +22,20 @@ export default {
   },
   data() {
     return {
-      numVal: '',
-      unit: '',
-      /**
-       * [
-       *  {"k_name": "同比", "val": "+12%"},
-       *  {"k_name": "环比", "val": "-12%"},
-       * ]
-       */
-      kName1: '',
-      kName2: '',
-      items: [],
-      apiId: '',
+      title: '',
+      apiId: null,
+      subTitle: null,
+      num: null,
+      subNum1: null,
+      trend1: null,
+      subNum2: null,
+      trend2: null
     }
   },
   methods: {
     initConfig() {
+      this.title = this.widget.options.title || this.widget.name || ''
       this.apiId = this.widget.options.apiId
-      this.kName1 = this.widget.options.kName1 || ''
-      this.kName2 = this.widget.options.kName2 || ''
     },
     doSearch() {
       if (!this.apiId) {
@@ -52,26 +48,13 @@ export default {
         } else {
           if (res.data.data.rows.length > 0) {
             let row = res.data.data.rows[0]
-            /**
-             * [
-             *  {"val": "457182134", "unit": "条", "extend_val1": "+12%", "extend_val2": "-12%",  }
-             * ]
-             */
             if (row) {
-              if (Object.prototype.hasOwnProperty.call(row, "val") && row['val']) {
-                this.numVal = formatNumLocale(row.val)
-              }
-              if (Object.prototype.hasOwnProperty.call(row, "unit") && row['unit']) {
-                this.unit = row['unit']
-              }
-              let itemArr = []
-              if (Object.prototype.hasOwnProperty.call(row, "extend_val1") && row['extend_val1']) {
-                itemArr.push({ "k_name": this.kName1, "val": row['extend_val1'] })
-              }
-              if (Object.prototype.hasOwnProperty.call(row, "extend_val2") && row['extend_val2']) {
-                itemArr.push({ "k_name": this.kName2, "val": row['extend_val2'] })
-              }
-              this.items = itemArr
+              this.subTitle = row['sub_title']
+              this.num = row['num']
+              this.subNum1 = row['sub_num1']
+              this.trend1 = row['trend1']
+              this.subNum2 = row['sub_num2']
+              this.trend2 = row['trend2']
             }
           }
         }
@@ -81,6 +64,7 @@ export default {
     }
   },
   created() {
+    console.log("num-idx widget:", this.widget)
     this.initConfig()
     this.doSearch()
   },
@@ -98,4 +82,3 @@ export default {
   }
 }
 </script>
-<style scoped></style>

package/bi/widget/page/child-page-tm.vue

@@ -27,9 +27,8 @@ import BiSearchForm from '../search/search-form.vue'
 import LamboIndicatorCardBiSearch from '../container/card/comps/indicator-card/src/indicator-card-bi-search.vue'
 import { getPageConfig } from '../api/config'
 import { deepCopy } from "@lambo-design/shared/utils/assist"
-import { SEARCH_DICT, DATE_RANGE_PFIX } from '../../../util/constants'
-import moment from "moment/moment"
 import { getWidgetName } from '../util/widget-map'
+import { setRouteCfg2Search, getInitSearchRes, getSearchFormRes } from './util/common'
 
 export default {
   name: 'BiChildPageTm',
@@ -62,10 +61,14 @@ export default {
           if (res.data.data) {
             let pageWidgetTree = deepCopy(res.data.data)
             this.pageTitle = pageWidgetTree.options.title || ''
+
             console.log("获取页面配置 1:", pageWidgetTree)
-            this.setRouteConfig2Search(pageWidgetTree)
+            let routeConfig = this.$route.query || {}
+            setRouteCfg2Search(routeConfig, pageWidgetTree)
             console.log("获取页面配置 2:", pageWidgetTree)
+
             this.childPageWidget = deepCopy(pageWidgetTree)
+            this.initSearch()
           } else {
             console.error("获取页面配置[" + this.pageId + "]失败：配置数据为空")
             return
@@ -81,113 +84,29 @@ export default {
       // name从路由里面取
       // this.$router.push({  name: 'xxx' })
     },
-    doSearch(params) {
-      console.log("child-page-tm doSearch 1 params:", params)
-      console.log("child-page-tm doSearch this.childPageWidget:", this.childPageWidget)
-      let emptySearchArr = []
-      // 增加前端校验是否必传
-      let searchConfig = this.childPageWidget.search
-      if (searchConfig && Object.prototype.hasOwnProperty.call(searchConfig, "widgets") && searchConfig.widgets) {
-        for (let i = 0; i < searchConfig.widgets.length; i++) {
-          let oneSearch = searchConfig.widgets[i]
-          console.log("child-page-tm doSearch oneSearch:", oneSearch)
-          if (oneSearch && oneSearch.options.isRequired === '1' && oneSearch.options.qKey) {
-            // 时间范围选择框
-            if (oneSearch.options.searchType && oneSearch.options.searchType === SEARCH_DICT.MUlTI_DATE.id) {
-              if (!params[oneSearch.options.qKey + DATE_RANGE_PFIX.START] || !params[oneSearch.options.qKey + DATE_RANGE_PFIX.END]) {
-                emptySearchArr.push(oneSearch.name)
-              }
-            } else {
-              if (!params[oneSearch.options.qKey]) {
-                emptySearchArr.push(oneSearch.name)
-              }
-            }
-          }
-        }
-      }
+    initSearch() {
+      let resObj = getInitSearchRes(this.childPageWidget)
+      let emptySearchArr = resObj['emptySearchArr']
+      let initParams = resObj['initParams']
       if (emptySearchArr.length > 0) {
         console.log("必选查询条件为空：", emptySearchArr)
         this.$Message.warning({ content: "必选查询条件" + emptySearchArr.join() + "为空，请选择", duration: 1.8 })
         return
       }
-      this.params = deepCopy(params)
-      console.log("child-page-tm doSearch 2 this.params:", this.params)
+      this.params = deepCopy(initParams)
+      console.log("child-page-tm initSearch this.params:", this.params)
     },
-    setRouteConfig2Search(widgetData) {
-      let routeConfig = this.$route.query || {}
-      console.log("child-page-tm setRouteConfig2Search -- routeConfig:", routeConfig)
-      console.log("child-page-tm setRouteConfig2Search -- widgetData:", widgetData)
-      if (routeConfig && widgetData && widgetData.search && widgetData.search.widgets) {
-        widgetData.search.widgets.map(item => {
-          if (item.options && Object.prototype.hasOwnProperty.call(item.options, "qKey") && item.options['qKey']) {
-            let searchType = item.options['searchType']
-            let qKey = item.options['qKey']
-            if (searchType === SEARCH_DICT.INPUT.id) {
-              item.options['val'] = routeConfig[qKey]
-            } else if (searchType === SEARCH_DICT.SINGLE_SELECT.id) {
-              let val = routeConfig[qKey]
-              let valName = ''
-              let selDataList = item.options['dataList']
-              if (val && selDataList) {
-                for (let i = 0; i < selDataList.length; i++) {
-                  let selDataItem = selDataList[i]
-                  if (selDataItem && Object.prototype.hasOwnProperty.call(selDataItem, "K") && Object.prototype.hasOwnProperty.call(selDataItem, "V")) {
-                    if (selDataItem['K'] && selDataItem['K'] === val) {
-                      valName = selDataItem['V']
-                      break;
-                    }
-                  }
-                }
-                if (valName) {
-                  item.options['val'] = val
-                  item.options['valName'] = valName
-                }
-              }
-            } else if (searchType === SEARCH_DICT.MUlTI_SELECT.id) {
-              let val = routeConfig[qKey]
-              let valNameArr = []
-              let selDataList = item.options['dataList']
-              if (val && selDataList) {
-                let valArr = val.split(',')
-                for (let i = 0; i < selDataList.length; i++) {
-                  let selDataItem = selDataList[i]
-                  if (selDataItem && Object.prototype.hasOwnProperty.call(selDataItem, "K") && Object.prototype.hasOwnProperty.call(selDataItem, "V")) {
-                    if (selDataItem['K'] && valArr.includes(selDataItem['K'])) {
-                      valNameArr.push(selDataItem['V'])
-                    }
-                  }
-                }
-                if (valNameArr && valNameArr.length > 0) {
-                  item.options['val'] = valArr
-                  item.options['valName'] = valNameArr.join()
-                }
-              }
-            } else if (searchType === SEARCH_DICT.SINGLE_DATE.id) {
-              let val = routeConfig[qKey]
-              if (val && val.indexOf('-') > 0) {
-                val = moment(val).format("YYYYMMDD")
-              }
-              item.options['val'] = val
-            } else if (searchType === SEARCH_DICT.MUlTI_DATE.id) {
-              console.log("detail -- getPageConfig -- routeConfig:", routeConfig)
-              let startDate = routeConfig[qKey + '_start']
-              console.log("detail -- getPageConfig -- startDate:", startDate)
-              if (startDate.indexOf('-') > 0) {
-                startDate = moment(startDate).format("YYYYMMDD") || ''
-              }
-
-              let endDate = routeConfig[qKey + '_end']
-              console.log("detail -- getPageConfig -- endDate:", endDate)
-              if (endDate.indexOf('-')) {
-                endDate = moment(endDate).format("YYYYMMDD") || ''
-              }
-              if (startDate && endDate) {
-                item.options['val'] = [startDate, endDate]
-              }
-            }
-          }
-        })
+    doSearch(formParams) {
+      console.log("child-page-tm doSearch 1 formParams:", formParams)
+      console.log("child-page-tm doSearch this.childPageWidget:", this.childPageWidget)
+      let emptySearchArr = getSearchFormRes(formParams, this.childPageWidget)
+      if (emptySearchArr && emptySearchArr.length > 0) {
+        console.log("必选查询条件为空：", emptySearchArr)
+        this.$Message.warning({ content: "必选查询条件" + emptySearchArr.join() + "为空，请选择", duration: 1.8 })
+        return
       }
+      this.params = deepCopy(formParams)
+      console.log("child-page-tm doSearch 2 this.params:", this.params)
     }
   },
   created() {
@@ -201,7 +120,7 @@ export default {
     '$route'(to, from) {
       // 只有 query 或 params 变化时执行逻辑（避免 path 相同但参数变化时无响应）
       if (to.path === from.path && (to.query !== from.query || to.params !== from.params)) {
-        console.log("------------'$route'(to, from)---------------------------")
+        console.log("------------'$route'(to, from)------------")
         this.getConfig()
       }
     }

package/bi/widget/page/index-page-tm.vue

@@ -24,8 +24,8 @@ import BiSearchForm from '../search/search-form.vue'
 import LamboIndicatorCardBiSearch from '../container/card/comps/indicator-card/src/indicator-card-bi-search.vue'
 import { getPageConfig } from '../api/config'
 import { deepCopy } from "@lambo-design/shared/utils/assist"
-import { SEARCH_DICT, DATE_RANGE_PFIX } from '../../../util/constants'
 import { getWidgetName } from '../util/widget-map'
+import { setRouteCfg2Search, getInitSearchRes, getSearchFormRes } from './util/common'
 
 export default {
   name: 'BiIndexPageTm',
@@ -55,11 +55,20 @@ export default {
         if (res.data.code !== 1) {
           console.error("获取页面配置[" + this.pageId + "]失败：" + res.data.message)
         } else {
-          let pageWidgetTree = res.data.data
-          if (pageWidgetTree) {
+          if (res.data.data) {
+            let pageWidgetTree = deepCopy(res.data.data)
+            this.pageTitle = pageWidgetTree.options.title || ''
+
+            let routeConfig = this.$route.query || {}
+            // 首页一般路由都会有参数，但是大多数情况不需要配置输入参数
+            if (Object.prototype.hasOwnProperty.call(routeConfig, "paramsPass") && routeConfig['paramsPass']) {
+              console.log("获取页面配置 1:", pageWidgetTree)
+              setRouteCfg2Search(routeConfig, pageWidgetTree)
+              console.log("获取页面配置 2:", pageWidgetTree)
+            }
+
             this.pageWidget = deepCopy(pageWidgetTree)
-            this.pageTitle = this.pageWidget.options.title || ''
-            console.log("获取页面配置成功:", this.pageWidget)
+            this.initSearch()
           } else {
             console.error("获取页面配置[" + this.pageId + "]失败：配置数据为空")
             return
@@ -69,38 +78,30 @@ export default {
         console.error("获取页面配置[" + this.pageId + "]异常：", err)
       })
     },
-    doSearch(params) {
-      console.log("index-page-tm doSearch 1 params:", params)
-      console.log("index-page-tm doSearch this.pageWidget:", this.pageWidget)
-      let emptySearchArr = []
-      // 增加前端校验是否必传
-      let searchConfig = this.pageWidget.search
-      if (searchConfig && Object.prototype.hasOwnProperty.call(searchConfig, "widgets") && searchConfig.widgets) {
-        for (let i = 0; i < searchConfig.widgets.length; i++) {
-          let oneSearch = searchConfig.widgets[i]
-          console.log("index-page-tm doSearch oneSearch:", oneSearch)
-          if (oneSearch && oneSearch.options.isRequired === '1' && oneSearch.options.qKey) {
-            // 时间范围选择框
-            if (oneSearch.options.searchType && oneSearch.options.searchType === SEARCH_DICT.MUlTI_DATE.id) {
-              if (!params[oneSearch.options.qKey + DATE_RANGE_PFIX.START] || !params[oneSearch.options.qKey + DATE_RANGE_PFIX.END]) {
-                emptySearchArr.push(oneSearch.name)
-              }
-            } else {
-              if (!params[oneSearch.options.qKey]) {
-                emptySearchArr.push(oneSearch.name)
-              }
-            }
-          }
-        }
-      }
+    initSearch() {
+      let resObj = getInitSearchRes(this.childPageWidget)
+      let emptySearchArr = resObj['emptySearchArr']
+      let initParams = resObj['initParams']
       if (emptySearchArr.length > 0) {
         console.log("必选查询条件为空：", emptySearchArr)
         this.$Message.warning({ content: "必选查询条件" + emptySearchArr.join() + "为空，请选择", duration: 1.8 })
         return
       }
-      this.params = deepCopy(params)
-      console.log("index-page-tm doSearch 2 this.params:", this.params)
+      this.params = deepCopy(initParams)
+      console.log("index-page-tm initSearch this.params:", this.params)
     },
+    doSearch(formParams) {
+      console.log("index-page-tm doSearch 1 formParams:", formParams)
+      console.log("index-page-tm doSearch this.pageWidget:", this.pageWidget)
+      let emptySearchArr = getSearchFormRes(formParams, this.pageWidget)
+      if (emptySearchArr && emptySearchArr.length > 0) {
+        console.log("必选查询条件为空：", emptySearchArr)
+        this.$Message.warning({ content: "必选查询条件" + emptySearchArr.join() + "为空，请选择", duration: 1.8 })
+        return
+      }
+      this.params = deepCopy(formParams)
+      console.log("index-page-tm doSearch 2 this.params:", this.params)
+    }
   },
   created() {
     this.getConfig()

package/bi/widget/page/util/common.js

@@ -0,0 +1,157 @@
+import { SEARCH_DICT, DATE_RANGE_PFIX, DEFAULT_DATE_FORMAT } from '../../../../util/constants'
+import moment from "moment/moment"
+
+/**
+ * 将路由携带的参数，赋值给查询条件列表
+ * 
+ * @param {*} widgetData 
+ */
+export function setRouteCfg2Search(routeConfig, widgetData) {
+  console.log("setRouteConfig2Search -- routeConfig:", routeConfig)
+  console.log("setRouteConfig2Search -- widgetData:", widgetData)
+  if (routeConfig && widgetData && widgetData.search && widgetData.search.widgets) {
+    widgetData.search.widgets.map(item => {
+      if (item.options && item.options['qKey'] && Object.prototype.hasOwnProperty.call(routeConfig, item.options['qKey'])) {
+        let qKey = item.options['qKey']
+        let searchType = item.options['searchType']
+        if (searchType === SEARCH_DICT.INPUT.id || searchType === SEARCH_DICT.NOT_SHOW_INPUT.id) {
+          item.options['val'] = routeConfig[qKey]
+        } else if (searchType === SEARCH_DICT.SINGLE_SELECT.id) {
+          let val = routeConfig[qKey]
+          let valName = ''
+          let selDataList = item.options['dataList']
+          if (val && selDataList) {
+            for (let i = 0; i < selDataList.length; i++) {
+              let selDataItem = selDataList[i]
+              if (selDataItem && Object.prototype.hasOwnProperty.call(selDataItem, "K") && Object.prototype.hasOwnProperty.call(selDataItem, "V")) {
+                if (selDataItem['K'] && selDataItem['K'] === val) {
+                  valName = selDataItem['V']
+                  break;
+                }
+              }
+            }
+            if (valName) {
+              item.options['val'] = val
+              item.options['valName'] = valName
+            }
+          }
+        } else if (searchType === SEARCH_DICT.MUlTI_SELECT.id) {
+          let val = routeConfig[qKey]
+          let valNameArr = []
+          let selDataList = item.options['dataList']
+          if (val && selDataList) {
+            let valArr = val.split(',')
+            for (let i = 0; i < selDataList.length; i++) {
+              let selDataItem = selDataList[i]
+              if (selDataItem && Object.prototype.hasOwnProperty.call(selDataItem, "K") && Object.prototype.hasOwnProperty.call(selDataItem, "V")) {
+                if (selDataItem['K'] && valArr.includes(selDataItem['K'])) {
+                  valNameArr.push(selDataItem['V'])
+                }
+              }
+            }
+            if (valNameArr && valNameArr.length > 0) {
+              item.options['val'] = valArr
+              item.options['valName'] = valNameArr.join()
+            }
+          }
+        } else if (searchType === SEARCH_DICT.SINGLE_DATE.id) {
+          let val = routeConfig[qKey]
+          if (val && val.indexOf('-') > 0) {
+            val = moment(val).format("YYYYMMDD")
+          }
+          item.options['val'] = val
+        } else if (searchType === SEARCH_DICT.MUlTI_DATE.id) {
+          let startDate = routeConfig[qKey + '_start']
+          if (startDate.indexOf('-') > 0) {
+            startDate = moment(startDate).format("YYYYMMDD") || ''
+          }
+          let endDate = routeConfig[qKey + '_end']
+          if (endDate.indexOf('-')) {
+            endDate = moment(endDate).format("YYYYMMDD") || ''
+          }
+          if (startDate && endDate) {
+            item.options['val'] = [startDate, endDate]
+          }
+        }
+      }
+    })
+  }
+}
+
+/**
+ * 初始化的查询条件，提取后端查询参数值合集、校验必传参数
+ * 
+ * @param {*} pageWidget 
+ * @returns 
+ */
+export function getInitSearchRes(pageWidget) {
+  let emptySearchArr = []
+  let initParams = {}
+  // 页面没设置查询条件的先不管
+  if (pageWidget && pageWidget.search) {
+    let searchList = pageWidget.search.widgets
+    searchList.map(item => {
+      if (item.options && Object.prototype.hasOwnProperty.call(item.options, "qKey")) {
+        let qKey = item.options.qKey
+        if (Object.prototype.hasOwnProperty.call(item.options, "val") && item.options.val) {
+          let val = item.options.val
+          if (Array.isArray(val)) {
+            if (item.options.searchType === SEARCH_DICT.MUlTI_DATE.id) {
+              if (val && Array.isArray(val) && val.length === 2 && val[0] && val[1]) {
+                initParams[qKey + DATE_RANGE_PFIX.START] = moment(val[0]).format(DEFAULT_DATE_FORMAT)
+                initParams[qKey + DATE_RANGE_PFIX.END] = moment(val[1]).format(DEFAULT_DATE_FORMAT)
+              }
+            } else {
+              initParams[qKey] = val.join()
+            }
+          } else {
+            if (item.options.searchType === SEARCH_DICT.SINGLE_DATE.id) {
+              initParams[qKey] = moment(val).format(DEFAULT_DATE_FORMAT)
+            } else {
+              initParams[qKey] = val
+            }
+          }
+        } else {
+          // 必填查询条件
+          if (item.options.isRequired === '1') {
+            emptySearchArr.push(item.name)
+          }
+        }
+      }
+    })
+  }
+  return { emptySearchArr: emptySearchArr, initParams: initParams }
+}
+
+/**
+ * 校验SearchForm中获取查询条件的值合集，是否必传但为空值的
+ * 
+ * @param {*} formParams 
+ * @param {*} pageWidget 
+ * @returns 
+ */
+export function getSearchFormRes(formParams, pageWidget) {
+  let emptySearchArr = []
+  // 增加前端校验是否必传
+  let searchConfig = pageWidget.search
+  if (searchConfig && Object.prototype.hasOwnProperty.call(searchConfig, "widgets") && searchConfig.widgets) {
+    for (let i = 0; i < searchConfig.widgets.length; i++) {
+      let oneSearch = searchConfig.widgets[i]
+      console.log("child-page-tm doSearch oneSearch:", oneSearch)
+      if (oneSearch && oneSearch.options.isRequired === '1' && oneSearch.options.qKey) {
+        // 时间范围选择框
+        if (oneSearch.options.searchType && oneSearch.options.searchType === SEARCH_DICT.MUlTI_DATE.id) {
+          if (!formParams[oneSearch.options.qKey + DATE_RANGE_PFIX.START] || !formParams[oneSearch.options.qKey + DATE_RANGE_PFIX.END]) {
+            emptySearchArr.push(oneSearch.name)
+          }
+        } else {
+          if (!formParams[oneSearch.options.qKey]) {
+            emptySearchArr.push(oneSearch.name)
+          }
+        }
+      }
+    }
+  }
+  return emptySearchArr
+
+}

package/bi/widget/search/search-form.vue

@@ -51,15 +51,17 @@ export default {
                   params[qKey] = val.join()
                 }
               } else {
-                if (item.options.searchType === '50') {
+                if (item.options.searchType === SEARCH_DICT.SINGLE_DATE.id) {
                   params[qKey] = moment(val).format(DEFAULT_DATE_FORMAT)
                 } else {
                   params[qKey] = val
                 }
               }
-            } else {
-              params[qKey] = null
             }
+            // TODO：这里传null还是不传后面看下
+            // else {
+            //   params[qKey] = null
+            // }
           }
         })
       }

package/bi/widget/search/search-item.vue

@@ -1,27 +1,27 @@
 <!-- eslint-disable -->
 <template>
   <div>
-    <div v-if="widget.options.searchType === '00'"> <!-- 输入框 -->
+    <div v-if="widget.options.searchType === searchDict.INPUT.id"> <!-- 输入框 -->
       <Input v-model="widget.options.val" class="query" placeholder="请输入" :clearable="true" />
     </div>
-    <div v-else-if="widget.options.searchType === '01'"> <!-- 模糊输入框 -->
+    <div v-else-if="widget.options.searchType === searchDict.FUZZY_INPUT.id"> <!-- 模糊输入框 -->
       <Input v-model="widget.options.val" class="query" placeholder="请输入" :clearable="true" />
     </div>
-    <div v-else-if="widget.options.searchType === 'A0'" class="not-show"> <!-- 隐形查询条件 -->
+    <div v-else-if="widget.options.searchType === searchDict.NOT_SHOW_INPUT.id" class="not-show"> <!-- 隐形查询条件 -->
       <Input v-model="widget.options.val" class="query" />
     </div>
-    <div v-else-if="widget.options.searchType === '10'"> <!-- 单选下拉框 -->
+    <div v-else-if="widget.options.searchType === searchDict.SINGLE_SELECT.id"> <!-- 单选下拉框 -->
       <Select v-model="widget.options.val" class="query" filterable :clearable="true" placeholder="请选择">
         <Option v-for="(item, index) in widget.options.dataList" :key="index" :value="item.K"> {{ item.V }}</Option>
       </Select>
     </div>
-    <div v-else-if="widget.options.searchType === '20'"> <!-- 多选下拉框 -->
+    <div v-else-if="widget.options.searchType === searchDict.MUlTI_SELECT.id"> <!-- 多选下拉框 -->
       <Select v-model="widget.options.val" class="query" filterable :clearable="true" placeholder="请选择" multiple
         :max-tag-count="1">
         <Option v-for="(item, index) in widget.options.dataList" :key="index" :value="item.K"> {{ item.V }}</Option>
       </Select>
     </div>
-    <div v-else-if="widget.options.searchType === '30'"> <!-- 单选帮助框 -->
+    <div v-else-if="widget.options.searchType === searchDict.SINGLE_HELP.id"> <!-- 单选帮助框 -->
       <Input class="display-none" v-model="helpVal" />
       <Input class="query" v-model="helpValName" icon="ios-list-box-outline" readonly @on-click="showHelpBox"
         placeholder="请选择" />
@@ -30,7 +30,7 @@
         :row-key="helpRowIdKey" :row-name="helpRowNameKey" :selected-key="helpSelectKey" :multi-select="false"
         :help-box-search-params="helpSearchParams" @on-ok="onHelpOk" @onClear="onHelpClear"></HelpBox>
     </div>
-    <div v-else-if="widget.options.searchType === '40'"> <!-- 多选帮助框 -->
+    <div v-else-if="widget.options.searchType === searchDict.MUlTI_HELP.id"> <!-- 多选帮助框 -->
       <Input class="display-none" v-model="helpVal" />
       <Input class="query" v-model="helpValName" icon="ios-list-box-outline" readonly @on-click="showHelpBox"
         placeholder="请选择" />
@@ -39,11 +39,11 @@
         :row-key="helpRowIdKey" :row-name="helpRowNameKey" :selected-key="helpSelectKey" :multi-select="true"
         :help-box-search-params="helpSearchParams" @on-ok="onHelpOk" @onClear="onHelpClear"></HelpBox>
     </div>
-    <div v-else-if="widget.options.searchType === '50'"> <!-- 单日期选择框 -->
+    <div v-else-if="widget.options.searchType === searchDict.SINGLE_DATE.id"> <!-- 单日期选择框 -->
       <DatePicker v-model="widget.options.val" format="yyyy-MM-dd" placeholder="请选择" placement="bottom-end"
         class="query"></DatePicker>
     </div>
-    <div v-else-if="widget.options.searchType === '51'"> <!-- 日期范围选择框 -->
+    <div v-else-if="widget.options.searchType === searchDict.MUlTI_DATE.id"> <!-- 日期范围选择框 -->
       <DatePicker v-model="widget.options.val" format="yyyy-MM-dd" placeholder="请选择" placement="bottom-end"
         class="query" type="daterange"></DatePicker>
     </div>
@@ -53,6 +53,7 @@
 /* eslint-disable */
 import HelpBox from "../../../pub/helpbox/index.vue"
 import biConfig from "../config/config"
+import { SEARCH_DICT } from '../../../util/constants'
 
 export default {
   name: 'BiSearchItem',
@@ -99,7 +100,8 @@ export default {
       helpApiId: '',
       helpVal: null,
       helpValName: null,
-      helpSearchParams: null
+      helpSearchParams: null,
+      searchDict: SEARCH_DICT
     }
   },
   methods: {

package/bi/widget/table/detail-table.vue

@@ -1,13 +1,13 @@
 <template>
-  <DetailTableBi :data="data"></DetailTableBi>
+  <LamboDetailTableBi :data="data"></LamboDetailTableBi>
 </template>
 <script>
-import DetailTableBi from "../../../pub/table/detail-table/index.vue"
+import LamboDetailTableBi from "../../../pub/table/detail-table/index.vue"
 import { getListMapData } from "../api/data"
 
 export default {
   name: "BiDetailTable",
-  components: { DetailTableBi },
+  components: { LamboDetailTableBi },
   props: {
     widget: {
       type: Object,
@@ -45,11 +45,12 @@ export default {
     }
   },
   created() {
+    console.log("detail-table created params:", this.params)
     this.initConfig()
-    this.doSearch()
   },
   mounted() {
-
+    // 组件渲染之前已经拿到该拿到的数据了
+    this.doSearch()
   },
   watch: {
     params: {
@@ -58,7 +59,7 @@ export default {
         this.doSearch()
       },
       deep: true
-    },
+    }
   }
 }
 </script>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lambo-design-bi",
-  "version": "0.0.150",
-  "description": "",
+  "version": "0.0.152",
+  "description": "Vue2 BI 数据可视化组件库",
   "main": "index.js",
   "author": "finch",
   "license": "ISC",
@@ -16,20 +16,21 @@
   },
   "dependencies": {
     "@lambo-design/core": "^4.7.1-beta.162",
+    "@lambo-design/detail-table": "^1.0.0-beta.23",
     "@lambo-design/file-list": "^1.0.0-beta.9",
+    "@lambo-design/page-container": "^1.0.0-beta.35",
     "@lambo-design/percent-progress": "^1.0.0-beta.9",
-    "@lambo-design/shared": "^1.0.0-beta.283",
     "@lambo-design/query-filter": "^1.0.0-beta.38",
-    "@lambo-design/detail-table": "^1.0.0-beta.23",
-    "@lambo-design/page-container": "^1.0.0-beta.35",
+    "@lambo-design/shared": "^1.0.0-beta.283",
     "axios": "1.6.7",
     "core-js": "^3.8.3",
     "echarts": "^4.8.0",
     "element-ui": "^2.15.14",
+    "jszip": "^3.5.0",
     "moment": "^2.30.1",
+    "view-ui-plus": "^1.3.21",
     "xlsx": "^0.13.3",
-    "xlsx-style": "^0.8.13",
-    "jszip": "^3.5.0"
+    "xlsx-style": "^0.8.13"
   },
   "devDependencies": {
     "less": "^4.4.0",

package/pub/number-info/index.js

@@ -0,0 +1,2 @@
+import LamboNumberInfoBi from './number-info.vue'
+export default LamboNumberInfoBi

package/pub/number-info/number-info.vue

@@ -0,0 +1,102 @@
+<template>
+  <div class="ivu-number-info">
+    <div class="ivu-number-info-title-lambo" v-if="title || $slots.title">
+      <slot name="title">{{ title }}</slot>
+    </div>
+    <div class="ivu-number-info-subTitle" v-if="subTitle || $slots.subTitle">
+      <slot name="subTitle">{{ subTitle }}</slot>
+    </div>
+    <div class="ivu-number-info-value-lambo" :style="valueStyle">
+      <span class="ivu-number-info-total">
+        <slot name="num">{{ num }}</slot>
+      </span>
+      <span class="ivu-number-info-subTotal" v-if="subNum1 || subNum2">
+        <slot name="subNum">
+          <template v-if="subNum1">
+            <template v-if="trend1">
+              <Trend :flag="trend1" text-color>{{ subNum1 }}</Trend>
+            </template>
+            <template v-else>
+              {{ subNum1 }}
+            </template>
+          </template>
+          <template v-if="subNum2">
+            <template v-if="trend1">
+              <Trend :flag="trend2" text-color>{{ subNum2 }}</Trend>
+            </template>
+            <template v-else>
+              {{ subNum2 }}
+            </template>
+          </template>
+        </slot>
+      </span>
+    </div>
+  </div>
+</template>
+<script>
+import { oneOf } from 'view-ui-plus/src/utils/assist'
+import Trend from 'view-ui-plus/src/components/trend'
+import 'view-ui-plus/dist/styles/viewuiplus.css'
+
+export default {
+  name: 'LamboNumberInfoBi',
+  components: { Trend },
+  props: {
+    title: {
+      type: String
+    },
+    subTitle: {
+      type: String
+    },
+    num: {
+      type: [String, Number]
+    },
+    subNum1: {
+      type: [String, Number]
+    },
+    trend1: {
+      validator(value) {
+        return oneOf(value, ['up', 'down']);
+      }
+    },
+    subNum2: {
+      type: [String, Number]
+    },
+    trend2: {
+      validator(value) {
+        return oneOf(value, ['up', 'down']);
+      }
+    },
+    gap: {
+      type: [String, Number],
+      default: 6
+    }
+  },
+  computed: {
+    valueStyle() {
+      return {
+        'margin-top': this.gap + 'px'
+      };
+    }
+  }
+};
+</script>
+<style scoped lang="less">
+.ivu-number-info-value-lambo {
+  margin-top: 4px;
+  overflow: hidden;
+  font-size: 0;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  word-break: break-all;
+  display: flex;
+  flex-direction: column;
+}
+.ivu-number-info-title-lambo {
+  margin-bottom: 9px;
+  color: #17233d;
+  font-size: 16px;
+  -webkit-transition: all .2s;
+  transition: all .2s
+}
+</style>

package/pub/table/detail-table/index.vue

@@ -9,7 +9,7 @@
 import { LamboDetailTable, LamboDetailTableItem } from "@lambo-design/detail-table"
 
 export default {
-  name: "DetailTableBi",
+  name: "LamboDetailTableBi",
   components: { LamboDetailTable, LamboDetailTableItem },
   props: {
     data: {

package/util/constants.js

@@ -3,6 +3,10 @@ export const SEARCH_DICT = Object.freeze({
     id: "00",
     name: "输入框"
   },
+  FUZZY_INPUT: {
+    id: "01",
+    name: "模糊输入框"
+  },
   SINGLE_SELECT: {
     id: "10",
     name: "单选下拉框"
@@ -27,6 +31,10 @@ export const SEARCH_DICT = Object.freeze({
     id: "51",
     name: "日期范围帮助框"
   },
+  NOT_SHOW_INPUT: {
+    id: "A0",
+    name: "隐形输入框"
+  },
 })
 
 export const DATE_RANGE_PFIX = Object.freeze({

package/pub/num-index/num-index.vue

@@ -1,120 +0,0 @@
-<template>
-  <div class="num-index">
-    <div class="title">
-      <span class="title-text">{{ title }}</span>
-      <Poptip v-if="note" trigger="hover" placement="right-end" transfer word-wrap width="250" :content="note"
-        class="title-icon">
-        <Icon type="ios-information-circle-outline" />
-      </Poptip>
-    </div>
-    <div class="content">
-      <span class="value">{{ val }}</span>
-      <span v-if="unit" class="unit">{{ unit }}</span>
-    </div>
-    <div class="extends">
-      <div v-for="(item, index) in items" :key="index" class="extends-item">
-        <p><span>{{ item.k_name }}&nbsp;</span><span>{{ item.val }}</span></p>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-
-export default {
-  name: "NumIndex",
-  components: {},
-  props: {
-    title: {
-      type: String,
-      default: ''
-    },
-    val: {
-      type: [String, Number],
-      default: ''
-    },
-    unit: {
-      type: String,
-      default: ''
-    },
-    items: {
-      type: Array,
-      default: () => []
-    },
-    note: {
-      type: String,
-      default: ''
-    }
-  },
-  data() {
-    return {
-
-    }
-  },
-  methods: {
-
-  },
-  created() {
-
-  },
-  mounted() {
-
-  }
-}
-</script>
-<style scoped lang="less">
-.num-index {
-  width: 257px;
-
-  .title {
-    font-size: 16px;
-    position: relative;
-    text-align: center;
-
-    .title-text {
-      display: inline-block;
-      position: relative;
-      z-index: 1
-    }
-
-    .title-icon {
-      position: absolute;
-      right: 0;
-      width: 16px;
-      height: 16px;
-      line-height: 24px;
-    }
-  }
-
-  .content {
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-    line-height: 50px;
-    position: relative;
-
-    .value {
-      font-size: 35px;
-    }
-
-    .unit {
-      font-size: 12px;
-      position: absolute;
-      right: 0;
-    }
-  }
-
-  .extends {
-    margin-left: 10px;
-    display: flex;
-    justify-content: center;
-    flex-direction: row;
-    flex-wrap: wrap;
-    gap: 0 10px;
-
-    .extends-item {
-      font-size: 14px;
-      color: #888;
-    }
-  }
-}
-</style>