mali-applet-ui 0.1.75 → 0.1.77

package/components/ml-checkbox/ml-checkbox.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="ml-checkbox" :class="[className || '', {'is-vertical': vertical, 'is-checked': checked, 'is-disabled': disabled}]" @tap="tapEvent">
+	<view class="ml-checkbox" :class="[className || '', {'is-vertical': vertical, 'is-checked': checked, 'is-half': indeterminate, 'is-disabled': disabled}]" @tap="tapEvent">
     <view class="ml-checkbox-icon">
       <ml-icon :name="checked ? 'checkbox-checked' : (indeterminate ? 'checkbox-indeterminate' : 'checkbox-unchecked')"></ml-icon>
     </view>
@@ -64,6 +64,9 @@ export default {
   &.is-checked {
     color: $uni-color-primary;
   }
+  &.is-half {
+    color: $uni-color-primary;
+  }
   &.is-disabled {
     color: rgba(0,0,0,0.25);
   }

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

@@ -178,7 +178,11 @@ export default {
     transition: transform 0.25s ease, transform 0.3s ease;
   }
   .ml-drawer-header {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
     padding: 10rpx 20rpx;
+    min-height: 80rpx;
   }
   .ml-drawer-header-title {
     text-align: center;
@@ -197,6 +201,7 @@ export default {
   .ml-drawer-footer {
     display: flex;
     flex-direction: row;
+    align-items: center;
     padding: 20rpx;
   }
 }

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)
@@ -227,8 +242,10 @@ export default {
       const { value: label } = params
       if (this.type === 'checkbox') {
         this.toggleCheckboxRow(label)
+        this.$emit('checkbox-change', {})
       } else if (this.type === 'radio') {
         this.setRadioRow(label)
+        this.$emit('radio-change', {})
       }
     }
   }

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)
@@ -122,8 +137,10 @@ export default {
       const { value: label } = params
       if (this.type === 'checkbox') {
         this.toggleCheckboxRow(label)
+        this.$emit('checkbox-change', {})
       } else if (this.type === 'radio') {
         this.setRadioRow(label)
+        this.$emit('radio-change', {})
       }
     }
   }

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.75",
+  "version": "0.1.77",
   "description": "码里云小程序组件库",
   "files": [
     "components",