mali-applet-ui 0.1.40 → 0.1.41

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

@@ -13,8 +13,8 @@
       </view>
       <view v-if="showConfirmButton || showCancelButton || showFooter" class="ml-drawer-footer">
         <slot name="footer">
-          <ml-button v-if="showCancelButton" width="40%" round @click="cancelEvent">{{ cancelButtonText }}</ml-button>
-          <ml-button v-if="showConfirmButton" status="primary" width="40%" round @click="confirmEvent">{{ confirmButtonText }}</ml-button>
+          <ml-button v-if="showCancelButton" width="40%" @click="cancelEvent">{{ cancelButtonText }}</ml-button>
+          <ml-button v-if="showConfirmButton" status="primary" width="40%" @click="confirmEvent">{{ confirmButtonText }}</ml-button>
         </slot>
       </view>
     </view>

package/components/ml-tooltip/ml-tooltip.vue

@@ -0,0 +1,27 @@
+<template>
+  <view class="ml-tooltip">
+    <slot></slot>
+    <view class="ml-tooltip-title">
+      <view>{{ title }}</view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'MlTooltip',
+  props: {
+    value: Boolean,
+    title: String,
+    placement: String
+  },
+  data () {
+    return {
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+
+</style>

package/package.json

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

package/components/ml-popup/ml-popup.vue

@@ -1,200 +0,0 @@
-<template>
-  <view class="ml-popup" :class="[className || '', `placement-${placement || 'bottom'}`, {'is-visible': visible, 'is-animate': isAnimate}]" @tap="tapMaskEvent">
-    <view v-if="visible" class="ml-popup-warpper" @tap.stop>
-      <view v-if="showHeader" class="ml-popup-header">
-        <slot name="header">
-          <view v-if="title" class="ml-popup-header-title">{{ title }}</view>
-        </slot>
-      </view>
-      <view class="ml-popup-body" :style="bodyStyles">
-        <scroll-view scroll-y>
-          <slot></slot>
-        </scroll-view>
-      </view>
-      <view v-if="showConfirmButton || showCancelButton || showFooter" class="ml-popup-footer">
-        <slot name="footer">
-          <ml-button v-if="showCancelButton" width="40%" round @click="cancelEvent">{{ cancelButtonText }}</ml-button>
-          <ml-button v-if="showConfirmButton" status="primary" width="40%" round @click="confirmEvent">{{ confirmButtonText }}</ml-button>
-        </slot>
-      </view>
-    </view>
-  </view>
-</template>
-
-<script>
-export default {
-	name: 'MlPopup',
-  props: {
-    value: Boolean,
-    title: String,
-    height: String,
-    width: String,
-    showHeader: {
-      type: Boolean,
-      default: true
-    },
-    showFooter: Boolean,
-    placement: String,
-    maskClosable: Boolean,
-    showConfirmButton: Boolean,
-    confirmButtonText: {
-      type: String,
-      default: '确认'
-    },
-    confirmClosable: Boolean,
-    showCancelButton: Boolean,
-    cancelButtonText: {
-      type: String,
-      default: '取消'
-    },
-    cancelClosable: {
-      type: Boolean,
-      default: true
-    },
-    className: String
-  },
-  data () {
-    return {
-      visible: false,
-      isAnimate: false,
-      animateTime: null
-    }
-  },
-  computed: {
-    bodyStyles () {
-      const wSty = this.width ? `width:${this.width};` : ''
-      const hSty = this.height ? `height:${this.height};` : ''
-      return `${wSty}${hSty}`
-    }
-  },
-  watch: {
-    value (val) {
-      if (val) {
-        this.open()
-      } else {
-        this.close()
-      }
-    }
-  },
-  created () {
-    this.$nextTick(() => {
-      if (this.value) {
-        this.open()
-      } else {
-        this.close()
-      }
-    })
-  },
-  methods: {
-    close () {
-      clearTimeout(this.animateTime)
-      this.isAnimate = true
-      this.isAnimate = false
-      this.animateTime = setTimeout(() => {
-        this.visible = false
-        this.$emit('input', false)
-        this.$emit('hide', {})
-      }, 300)
-    },
-    open () {
-      clearTimeout(this.animateTime)
-      this.isAnimate = false
-      this.visible = true
-      this.animateTime = setTimeout(() => {
-        this.isAnimate = true
-        this.$emit('show', {})
-      }, 20)
-      this.$emit('input', true)
-    },
-    tapMaskEvent () {
-      if (this.maskClosable) {
-        this.close()
-      }
-    },
-    cancelEvent () {
-      if (this.cancelClosable) {
-        this.close()
-      }
-      this.$emit('cancel', {})
-    },
-    confirmEvent () {
-      if (this.confirmClosable) {
-        this.close()
-      }
-      this.$emit('confirm', {})
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.ml-popup {
-  display: none;
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: $ml-page-full-width;
-  height: 100vh;
-  z-index: 999;
-  background-color: rgba(0, 0, 0, 0.4);
-  // #ifdef H5
-  left: 50%;
-  transform: translateX(-50%);
-  // #endif
-  &.is-visible {
-    display: block;
-  }
-  &.placement-left {
-    &.is-animate {
-      .ml-popup-warpper {
-        transform: translateX(0);
-      }
-    }
-    .ml-popup-warpper {
-      height: 100%;
-      transform: translateX(-100%);
-    }
-  }
-  &.placement-bottom {
-    &.is-animate {
-      .ml-popup-warpper {
-        transform: translateY(0);
-      }
-    }
-    .ml-popup-warpper {
-      width: 100%;
-      transform: translateY(100%);
-    }
-  }
-}
-.ml-popup-warpper {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  padding-bottom: 20rpx;
-  background: #fff;
-  transition: transform 0.25s ease, transform 0.3s ease;
-}
-.ml-popup-header {
-  padding: 10rpx 20rpx;
-}
-.ml-popup-header-title {
-  text-align: center;
-  height: 70rpx;
-  line-height: 70rpx;
-  font-size: $uni-font-size-base;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.ml-popup-body {
-  padding: 20rpx;
-  overflow: auto;
-  height: 500rpx;
-}
-.ml-popup-footer {
-  display: flex;
-  flex-direction: row;
-  padding: 20rpx;
-}
-</style>