mali-applet-ui 0.1.76 → 0.1.78

package/components/ml-drawer/ml-drawer.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="ml-drawer" :class="[className || '', `placement-${placement || 'bottom'}`, {'is-visible': visible, 'is-animate': isAnimate}]" @tap="tapMaskEvent">
-    <view v-if="visible" class="ml-drawer-warpper" @tap.stop>
+    <view v-if="visible" class="ml-drawer-warpper" @tap.stop.prevent>
       <view v-if="showHeader" class="ml-drawer-header">
         <slot name="header">
           <view v-if="title" class="ml-drawer-header-title">{{ title }}</view>
@@ -182,13 +182,11 @@ export default {
     flex-direction: row;
     align-items: center;
     padding: 10rpx 20rpx;
-    min-height: 80rpx;
+    min-height: 90rpx;
+    font-size: $uni-font-size-lg;
   }
   .ml-drawer-header-title {
     text-align: center;
-    height: 70rpx;
-    line-height: 70rpx;
-    font-size: $uni-font-size-base;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;

package/components/ml-list-group/ml-list-group.vue

@@ -24,6 +24,8 @@ export default {
       type: [Array, Boolean, Number, String],
       default: null
     },
+    isAllChecked: Boolean,
+    isAllIndeterminate: Boolean,
     type: String,
     vertical: Boolean,
     showPage: Boolean,
@@ -54,6 +56,7 @@ export default {
         total: 0
       },
       selectValue: null,
+      itemList: [],
       selection: []
     }
   },
@@ -94,6 +97,11 @@ export default {
       }
     })
   },
+  mounted () {
+    if (this.type === 'checkbox') {
+      setTimeout(() => this.updateStatus(), 10)
+    }
+  },
   methods: {
     getParams () {
       return this.showPage ? {
@@ -171,6 +179,12 @@ export default {
         }
       }
     },
+    updateStatus () {
+      const isAllChecked = this.selection.length > 0 && this.selection.length === this.itemList.length
+      const isAllIndeterminate =  this.selection.length > 0 && this.selection.length < this.itemList.length
+      this.$emit('update:isAllChecked', isAllChecked)
+      this.$emit('update:isAllIndeterminate', isAllIndeterminate)
+    },
     updateChecked () {
       let rest = null
       this.updateModel = true
@@ -182,6 +196,7 @@ export default {
         this.$emit('update:checked', rest)
       }
       this.$emit('change', { checked: rest })
+      this.updateStatus()
     },
     toggleCheckboxRow (label) {
       const index = this.selection.indexOf(label)

package/components/ml-list-item/ml-list-item.vue

@@ -21,6 +21,8 @@
 </template>
 
 <script>
+import XEUtils from 'xe-utils'
+
 export default {
   name: 'MlListItem',
   options: {
@@ -54,6 +56,11 @@ export default {
       default: null
     }
   },
+  data () {
+    return {
+      mId: XEUtils.uniqueId('mlListItem')
+    }
+  },
   computed: {
     styles () {
       const cr = this.color ? `color:${this.color};` : ''
@@ -79,6 +86,21 @@ export default {
       return this.listGroup ? this.listGroup.type : ''
     }
   },
+  mounted () {
+    this.$nextTick(() => {
+      if (this.listGroup) {
+        this.listGroup.itemList.push({
+          mId: this.mId,
+          value: this.value,
+        })
+      }
+    })
+  },
+  beforeDestroy () {
+    if (this.listGroup) {
+      XEUtils.remove(this.listGroup.itemList, item => item.mId === this.mId)
+    }
+  },
   methods: {
     clickEvent () {
       this.$emit('click', {})

package/components/ml-list-menu-group/ml-list-menu-group.vue

@@ -25,6 +25,8 @@ export default {
       type: [Array, Boolean, Number, String],
       default: null
     },
+    isAllChecked: Boolean,
+    isAllIndeterminate: Boolean,
     type: String,
     vertical: Boolean,
     prefixIcon: String,
@@ -34,6 +36,7 @@ export default {
   data () {
     return {
       selectValue: null,
+      itemList: [],
       selection: []
     }
   },
@@ -65,7 +68,18 @@ export default {
       }
     }
   },
+  mounted () {
+    if (this.type === 'checkbox') {
+      setTimeout(() => this.updateStatus(), 10)
+    }
+  },
   methods: {
+    updateStatus () {
+      const isAllChecked = this.selection.length > 0 && this.selection.length === this.itemList.length
+      const isAllIndeterminate =  this.selection.length > 0 && this.selection.length < this.itemList.length
+      this.$emit('update:isAllChecked', isAllChecked)
+      this.$emit('update:isAllIndeterminate', isAllIndeterminate)
+    },
     updateChecked () {
       let rest = null
       this.updateModel = true
@@ -77,6 +91,7 @@ export default {
         this.$emit('update:checked', rest)
       }
       this.$emit('change', { checked: rest })
+      this.updateStatus()
     },
     toggleCheckboxRow (label) {
       const index = this.selection.indexOf(label)

package/components/ml-list-menu-item/ml-list-menu-item.vue

@@ -24,6 +24,8 @@
 </template>
 
 <script>
+import XEUtils from 'xe-utils'
+
 export default {
   name: 'MlListMenuItem',
   options: {
@@ -55,6 +57,11 @@ export default {
       default: null
     }
   },
+  data () {
+    return {
+      mId: XEUtils.uniqueId('mlListMenuItem')
+    }
+  },
   computed: {
     hasCheckedChecked () {
       return this.selection.includes(this.value)
@@ -75,6 +82,21 @@ export default {
       return this.listMenuGroup ? this.listMenuGroup.type : ''
     }
   },
+  mounted () {
+    this.$nextTick(() => {
+      if (this.listGroup) {
+        this.listGroup.itemList.push({
+          mId: this.mId,
+          value: this.value,
+        })
+      }
+    })
+  },
+  beforeDestroy () {
+    if (this.listGroup) {
+      XEUtils.remove(this.listGroup.itemList, item => item.mId === this.mId)
+    }
+  },
   methods: {
     getDotNum (num) {
       return num > 99 ? '99+' : num

package/package.json

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