mali-applet-ui 1.0.74 → 1.0.75

package/lib/components/ml-form-item/ml-form-item.vue

@@ -8,6 +8,9 @@
       <view class="ml-form-item-header-title">
         <slot name="title">{{ title }}</slot>
       </view>
+      <view class="ml-form-item-header-extra">
+        <slot name="extra"></slot>
+      </view>
     </view>
     <view class="ml-form-item-content">
       <view class="ml-form-item-content-warpper">
@@ -223,10 +226,13 @@ export default {
     }
   }
   .ml-form-item-header {
+    display: flex;
+    flex-direction: row;
     min-height: 78rpx;
     padding: 0 10rpx;
   }
   .ml-form-item-header-asterisk {
+    flex-shrink: 0;
     position: absolute;
     left: 10rpx;
     color: red;
@@ -234,8 +240,14 @@ export default {
     padding-top: 10rpx;
   }
   .ml-form-item-header-title {
-    display: inline;
+    flex-grow: 1;
     color: #171A1D;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .ml-form-item-header-extra {
+    flex-shrink: 0;
   }
   &.is-vertical {
     flex-direction: column;

package/lib/components/ml-tree-box/ml-tree-box.vue

@@ -1,16 +1,18 @@
 <template>
   <view class="ml-tree-box">
     <view class="ml-tree-tool">
-      <view class="ml-tree-breadcrumb" v-if="breadcrumb">
-        <view class="breadcrumb-item" @click="handleToBreadcrumb()">
-          全部
-          <ml-icon v-if="cache && cache.length" name="arrow-right"></ml-icon>
+      <scroll-view :scroll-x="true" class="ml-tree-breadcrumb-scroll" v-if="breadcrumb">
+        <view class="ml-tree-breadcrumb">
+          <view class="breadcrumb-item" @click="handleToBreadcrumb()">
+            <text class="breadcrumb-text">全部</text>
+            <ml-icon v-if="cache && cache.length" name="arrow-right"></ml-icon>
+          </view>
+          <view class="breadcrumb-item" v-for="(item, index) in cache" :key="index" @click="handleToBreadcrumb(index)">
+            <text class="breadcrumb-text">{{ item[useProps.label] || '' }}</text>
+            <ml-icon v-if="index !== (cache.length - 1)" name="arrow-right"></ml-icon>
+          </view>
         </view>
-        <view class="breadcrumb-item" v-for="(item, index) in cache" :key="index" @click="handleToBreadcrumb(index)">
-          {{ item[useProps.label] || '' }}
-          <ml-icon v-if="index !== (cache.length - 1)" name="arrow-right"></ml-icon>
-        </view>
-      </view>
+      </scroll-view>
     </view>
     <view class="ml-tree-content">
       <view class="ml-tree-node" v-if="cache && cache.length" @click="handleBack">
@@ -98,6 +100,12 @@ export default {
       }
     }
   },
+  inject: {
+    currVM: {
+      from: '$pageVM',
+      default: null
+    }
+  },
   computed: {
     showTree () {
       const { current, tree } = this
@@ -120,9 +128,10 @@ export default {
   methods: {
     async handleIntoChildren (item) {
       const { lazyLoad, lazy } = this
-      if (!(item.children && item.children) && lazy && lazyLoad && !item.isLeaf) {
+      console.log(this)
+      if (!(item.children && item.children.length) && lazy && lazyLoad && !item.isLeaf) {
         // this.lazyLoading = true
-        await lazyLoad(item)
+        await lazyLoad.call(this.currVM, item)
         // this.lazyLoading = false
       }
       if (item.children && item.children.length) {
@@ -133,7 +142,7 @@ export default {
       const { lazyLoad, lazy, current } = this
       if (lazy && lazyLoad) {
         // this.lazyLoading = true
-        await lazyLoad(current)
+        await lazyLoad.call(this.currVM, current)
         // this.lazyLoading = false
       }
     },
@@ -351,10 +360,13 @@ export default {
   }
 
   .ml-tree-tool {
+    .ml-tree-breadcrumb-scroll {
+      background-color: #f3f3f3;
+    }
     .ml-tree-breadcrumb {
       display: flex;
-      background-color: #f3f3f3;
       padding: 0 30rpx;
+      align-items: center;
 
       .breadcrumb-item {
         position: relative;
@@ -362,6 +374,14 @@ export default {
         line-height: 50rpx;
         color: #afafaf;
         font-size: 26rpx;
+        display: flex;
+        align-items: center;
+        .breadcrumb-text {
+          max-width: 220rpx;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
 
         &:last-child {
           color: #6e6e6e;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mali-applet-ui",
-  "version": "1.0.74",
+  "version": "1.0.75",
   "description": "码里云小程序组件库",
   "files": [
     "lib",