mali-applet-ui 1.0.66 → 1.0.68

package/lib/components/ml-echarts/ml-echarts.vue

@@ -128,25 +128,27 @@ export default {
           context: true
         })
         .exec(res => {
-          const canvasNode = res[0].node
-          const ratio = getAppDpr()
-          const canvasWidth = res[0].width
-          const canvasHeight = res[0].height
-          this.cvsWidth = canvasWidth
-          this.cvsHeight = canvasHeight
-          this.ctx = canvasNode.getContext('2d')
-          const canvas = new WxCanvas(this.ctx, this.canvasId, true, canvasNode)
-          echarts.setCanvasCreator(() => {
-            return canvas
-          })
-          const chart = echarts.init(canvas, null, {
-            width: canvasWidth,
-            height: canvasHeight,
-            devicePixelRatio: ratio
-          })
-          canvas.setChart(chart)
-          this.chart = chart
-          this.loadChart()
+          if (res && res[0]) {
+            const canvasNode = res[0].node
+            const ratio = getAppDpr()
+            const canvasWidth = res[0].width
+            const canvasHeight = res[0].height
+            this.cvsWidth = canvasWidth
+            this.cvsHeight = canvasHeight
+            this.ctx = canvasNode.getContext('2d')
+            const canvas = new WxCanvas(this.ctx, this.canvasId, true, canvasNode)
+            echarts.setCanvasCreator(() => {
+              return canvas
+            })
+            const chart = echarts.init(canvas, null, {
+              width: canvasWidth,
+              height: canvasHeight,
+              devicePixelRatio: ratio
+            })
+            canvas.setChart(chart)
+            this.chart = chart
+            this.loadChart()
+          }
         })
     },
     // #endif

package/lib/components/ml-fixed-footer/ml-fixed-footer.vue

@@ -84,7 +84,7 @@ export default {
   left: 0;
   width: $ml-page-full-width;
   bottom: 0;
-  z-index: 20;
+  z-index: 22;
   box-shadow: 0px -2px 4px 0px rgba(0,0,0,0.1);
   // #ifdef H5
   left: 50%;

package/lib/components/ml-fixed-header/ml-fixed-header.vue

@@ -81,7 +81,7 @@ export default {
   position: fixed;
   left: 0;
   top: 0;
-  z-index: 20;
+  z-index: 33;
   width: $ml-page-full-width;
   box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
   // #ifdef H5

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

@@ -42,7 +42,10 @@ export default {
     align: String,
     required: Boolean,
     titleAlign: String,
-    vertical: Boolean,
+    vertical: {
+      type: Boolean,
+      default: null
+    },
     visible: {
       type: Boolean,
       default: true
@@ -135,10 +138,10 @@ export default {
       return this.form ? this.form.titleAlign : ''
     },
     itemVertical () {
-      if (this.vertical) {
-        return true
+      if (this.vertical === null) {
+        return this.form ? this.form.vertical : false
       }
-      return this.form ? this.form.vertical : false
+      return !!this.vertical
     },
     itemLabelWidth () {
       let labelWidth = this.labelWidth

package/lib/components/ml-header-filter-form/ml-header-filter-form.vue

@@ -74,8 +74,15 @@ export default {
     },
     resetDownEvent () {
       const { filterForm } = this
-      XEUtils.clear(filterForm, null)
-      this.$emit('update:filterForm', filterForm)
+      const newValue = {}
+      XEUtils.each(filterForm, (item, key) => {
+        if (XEUtils.isArray(item)) {
+          newValue[key] = []
+        } else {
+          newValue[key] = null
+        }
+      })
+      this.$emit('update:filterForm', newValue)
       this.$emit('reset')
     },
     confirmDownEvent () {

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

@@ -1,5 +1,5 @@
 <template>
-  <view class="ml-list-item-title">
+  <view class="ml-list-item-title" @tap="tapEvent">
     <view class="ml-list-item-title-left">
       <text v-if="showSeq" class="ml-list-item-title-seq">{{ itemIndex + 1 }}</text>
       <text v-if="icon" class="ml-list-item-title-icon">
@@ -36,6 +36,12 @@ export default {
       }
       return text
     }
+  },
+  methods: {
+    tapEvent () {
+      this.$emit('tap', {})
+      this.$emit('click', {})
+    }
   }
 }
 </script>

package/lib/components/ml-switch/ml-switch.vue

@@ -1,5 +1,11 @@
 <template>
-  <switch class="ml-switch" :class="className" :checked="value" :color="color" @change="changeEvent"></switch>
+  <view class="ml-switch" :style="styles">
+    <view v-if="openLabel && closeLabel" class="ml-switch-warpper" @tap="toggleEvent">
+      <view class="ml-switch-btn" :class="{'is-active': checked}">{{ openLabel }}</view>
+      <view class="ml-switch-btn" :class="{'is-active': !checked}">{{ closeLabel }}</view>
+    </view>
+    <switch v-else class="ml-switch-native" :class="className" :checked="checked" :color="color" @change="changeEvent"></switch>
+  </view>
 </template>
 
 <script>
@@ -9,16 +15,41 @@ export default {
     virtualHost: true
   },
   props: {
-    value: Boolean,
+    value: [String, Number, Boolean],
     color: {
       type: String,
       default: '#007aff'
     },
+    width: String,
+    openLabel: String,
+    closeLabel: String,
+    openValue: {
+      type: [String, Number, Boolean],
+      default: true
+    },
+    closeValue: {
+      type: [String, Number, Boolean],
+      default: false
+    },
     className: String
   },
+  computed: {
+    styles () {
+      const wSys = this.width ? `width: ${this.width};` : ''
+      return `${wSys}`
+    },
+    checked () {
+      return this.value === this.openValue
+    }
+  },
   methods: {
     changeEvent (e) {
-      const value = e.detail.value
+      const value = e.detail.value ? this.openValue : this.closeValue
+      this.$emit('input', value)
+      this.$emit('change', { value })
+    },
+    toggleEvent  () {
+      const value = this.checked ? this.closeValue : this.openValue
       this.$emit('input', value)
       this.$emit('change', { value })
     }
@@ -28,6 +59,28 @@ export default {
 
 <style lang="scss">
 .ml-switch {
-  transform: scale(0.8);
+  display: inline-flex;
+  .ml-switch-native {
+    transform: scale(0.8);
+  }
+  .ml-switch-warpper {
+    display: inline-flex;
+    flex-direction: row;
+    padding: 8rpx;
+    border-radius: $ml-border-radius;
+    background: #e5e6e8;
+    .ml-switch-btn {
+      flex-grow: 1;
+      padding: 0 24rpx;
+      height: 44rpx;
+      line-height: 44rpx;
+      font-size: $ml-describe-font-size;
+      transition: all 0.3s;
+      &.is-active {
+        background: #ffffff;
+        border-radius: $ml-border-radius;
+      }
+    }
+  }
 }
-</style>
+</style>

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

@@ -20,13 +20,18 @@ export default {
   props: {
     data: Array,
     height: String,
-    checkStrictly: Boolean,
-    showRadio: Boolean,
-    showCheckbox: Boolean,
+    // 是否显示顶部全选按钮
     showAllCheckbox: Boolean,
-    indeterminateToChecked: Boolean,
+    // 是是否显示顶部操作按钮
     showCheckboxBtn: Boolean,
+    // 单选框
+    showRadio: Boolean,
+    // 复选框
+    showCheckbox: Boolean,
+    // （复选框）父子不关联
+    checkStrictly: Boolean,
     checkRowKeys: Array,
+    halfRowKeys: Array,
     nodeProps: Object
   },
   provide () {
@@ -72,8 +77,7 @@ export default {
     },
     checkRowKeys (value) {
       if (!this.isCheckboxModelUpdate) {
-        this.selectCheckboxRowKeys = []
-        this.setCheckboxRow(value, true)
+        this.initCheckboxRows(value)
       }
       this.isCheckboxModelUpdate = false
     }
@@ -135,6 +139,7 @@ export default {
       this.isCheckboxModelUpdate = true
       this.$emit('checkbox-change', { row: nodeData, checked, checkedKeys: this.selectCheckboxRowKeys })
       this.$emit('update:checkRowKeys', [...this.selectCheckboxRowKeys])
+      this.$emit('update:halfRowKeys', [...this.indeterminateRowKeys])
     },
     expandNodeEvent ({ nodeData, nodeKey }) {
       const nodeIndex = this.expandRowKeys.indexOf(nodeKey)
@@ -183,6 +188,17 @@ export default {
       this.isAllCheckboxChecked = this.treeData.every(item => this.selectCheckboxRowKeys.includes(item[keyField]))
       this.isAllCheckboxIndeterminate = !this.isAllCheckboxChecked && this.treeData.some(item => this.selectCheckboxRowKeys.includes(item[keyField]))
     },
+    initCheckboxRows (selecKeys) {
+      this.selectCheckboxRowKeys = []
+      this.indeterminateRowKeys = []
+      selecKeys.forEach(nodeKey => {
+        if (!this.selectCheckboxRowKeys.includes(nodeKey)) {
+          this.selectCheckboxRowKeys.push(nodeKey)
+        }
+      })
+      // 更新全部节点半选状态
+      this.updateCheckStatus()
+    },
     setCheckboxRow (key, checked) {
       let keys = key
       if (!XEUtils.isArray(key)) {
@@ -209,6 +225,7 @@ export default {
       this.isCheckboxModelUpdate = true
       this.$emit('checkbox-all', { checkedKeys: this.selectCheckboxRowKeys, checkedRows: [] })
       this.$emit('update:checkRowKeys', [...this.selectCheckboxRowKeys])
+      this.$emit('update:halfRowKeys', [...this.indeterminateRowKeys])
     },
     toggleAllCheckboxRow () {
       const { keyField, childrenField } = this

package/package.json

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