mali-applet-ui 1.0.39 → 1.0.40

package/lib/components/ml-amount-input/ml-amount-input.vue

@@ -9,29 +9,28 @@
     </view>
   </view>
   <view v-else class="ml-amount-input" :class="[{'is-right': align === 'right', 'is-border': border, 'is-disabled': disabled, 'is-clear': clearable && inpVal}, className]">
-    <view v-if="showTip" class="ml-amount-tip">
-      <view>首位：</view>
-      <view class="ml-amount-tip-label">{{ firstNumLabel }}</view>
-    </view>
-    <input
-      v-model="inpVal"
-      type="digit"
-      class="ml-amount-input-inp"
-      autocomplete="off"
-      :placeholder="placeholder"
-      :maxlength="maxLength"
-      :disabled="disabled"
-      @blur="blurEvent"
-      @input="inputEvent" />
-    <view v-if="clearable && !disabled && inpVal" class="ml-amount-input-clear-icon" @click.stop="clearEvent">
-      <ml-icon name="delete-filling"></ml-icon>
+    <view class="ml-amount-input-warpper">
+      <input
+        v-model="inpVal"
+        type="digit"
+        class="ml-amount-input-inp"
+        autocomplete="off"
+        :placeholder="placeholder"
+        :maxlength="maxLength"
+        :disabled="disabled"
+        @blur="blurEvent"
+        @input="inputEvent" />
+      <view v-if="clearable && !disabled && inpVal" class="ml-amount-input-clear-icon" @click.stop="clearEvent">
+        <ml-icon name="delete-filling"></ml-icon>
+      </view>
     </view>
+    <view v-if="showTip" class="ml-amount-tip">{{ currAmountLabel }}</view>
   </view>
 </template>
 
 <script>
 import XEUtils from 'xe-utils'
-import { getPlatformEnv, toAmountString, toWanAmountString } from '../../../utils'
+import { getPlatformEnv, toAmountString, toWanAmountString, toNumMoneyToChinese } from '../../../utils'
 
 function eqEmptyNull (value) {
   return value === '' || XEUtils.eqNull(value)
@@ -112,34 +111,8 @@ export default {
       }
       return null
     },
-    firstNumLabel () {
-      const numVal = XEUtils.toNumber(this.value)
-      if (numVal > 999999999999) {
-        return '万亿'
-      } else if (numVal > 99999999999) {
-        return '千亿'
-      } else if (numVal > 9999999999) {
-        return '百亿'
-      } else if (numVal > 999999999) {
-        return '十亿'
-      } else if (numVal > 99999999) {
-        return '亿'
-      } else if (numVal > 9999999) {
-        return '千万'
-      } else if (numVal > 999999) {
-        return '百万'
-      } else if (numVal > 99999) {
-        return '十万'
-      } else if (numVal > 9999) {
-        return '万'
-      } else if (numVal > 999) {
-        return '千'
-      } else if (numVal > 99) {
-        return '百'
-      } else if (numVal > 9) {
-        return '十'
-      }
-      return '-'
+    currAmountLabel () {
+      return this.currAmountNum === '' ? '' : toNumMoneyToChinese(this.currAmountNum)
     }
   },
   watch: {
@@ -212,8 +185,6 @@ export default {
 .ml-amount-input {
   position: relative;
   flex-grow: 1;
-  display: flex;
-  flex-direction: row;
   .ml-amount-input-placeholder {
     color: $ml-input-color-placeholder;;
   }
@@ -247,16 +218,12 @@ export default {
     }
   }
   .ml-amount-tip {
+    padding: 0 10rpx;
+    font-size: $ml-describe-font-size;
+  }
+  .ml-amount-input-warpper {
     display: flex;
     flex-direction: row;
-    position: absolute;
-    top: -60rpx;
-    right: 10rpx;
-    z-index: 1;
-    .ml-amount-tip-label {
-      min-width: 60rpx;
-      text-align: right;
-    }
   }
   .ml-amount-input-inp {
     outline: 0;

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

@@ -12,7 +12,8 @@
 export default {
   name: 'MlCol',
   options: {
-    virtualHost: true
+    virtualHost: true,
+    styleIsolation: 'shared'
   },
   props: {
     span: [String, Number],

package/lib/components/ml-date-picker/ml-date-picker.vue

@@ -2,7 +2,7 @@
   <view v-if="isFromReadonly" class="ml-date-picker is-readonly">
     <view class="ml-date-picker-readonly-content">{{ value }}</view>
   </view>
-  <uni-datetime-picker v-else :class="className" v-model="selectVal" type="date" :start="minDate" :end="maxDate" @change="changeEvent" :border="border"/>
+  <uni-datetime-picker v-else :class="className" v-model="selectVal" type="date" :start="minDate" :end="maxDate" :placeholder="placeholder" @change="changeEvent" :border="border"/>
 </template>
 
 <script>
@@ -13,9 +13,16 @@ export default {
   },
   props: {
     value: String,
-    border: Boolean,
+    border: {
+      type: Boolean,
+      default: false
+    },
     minDate: [String, Number],
     maxDate: [String, Number],
+    placeholder: {
+      type: String,
+      default: '请选择日期'
+    },
     className: String
   },
   inject: {

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

@@ -221,12 +221,14 @@ export default {
   }
   .ml-form-item-header {
     min-height: 78rpx;
+    padding: 0 10rpx;
   }
   .ml-form-item-header-asterisk {
-    display: inline;
+    position: absolute;
+    left: 10rpx;
     color: red;
-    padding-right: 4rpx;
     font-weight: 700;
+    padding-top: 10rpx;
   }
   .ml-form-item-header-title {
     display: inline;

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

@@ -6,7 +6,8 @@
 export default {
   name: 'MlIcon',
   options: {
-    virtualHost: true
+    virtualHost: true,
+    styleIsolation: 'shared'
   },
   props: {
     name: String,

package/lib/components/ml-progress-bar/ml-progress-bar.vue

@@ -2,10 +2,11 @@
   <view class="ml-progress-bar" :class="className">
     <view class="progress-bar-header">
       <slot name="header">
-        <view v-if="title" class="progress-bar-title" :class="{'is-underline': titleUnderline}">{{ title }}</view>
+        <view v-if="title" class="progress-header-title" :class="{'is-underline': titleUnderline}">{{ title }}</view>
+        <view v-if="title && showNum" class="progress-header-num">{{ value || 0 }}{{ unit || '' }}</view>
       </slot>
     </view>
-    <view class="progress-bar-chart" @click="barClick">
+    <view class="progress-bar-chart" :class="{'show-num': !title && showNum}" @click="barClick">
       <progress
         :percent="percNum"
         :activeColor="activeColor || '#1890FF'"
@@ -13,7 +14,7 @@
         :strokeWidth="strokeWidth"
         :fontSize="fontSize"
         :border-radius="borderRadius" />
-      <view v-if="showNum" class="progress-bar-num">{{ value || 0 }}{{ unit || '' }}</view>
+      <view v-if="!title && showNum" class="progress-bar-num">{{ value || 0 }}{{ unit || '' }}</view>
     </view>
     <view class="progress-bar-footer">
       <slot name="footer"></slot>
@@ -75,13 +76,17 @@ export default {
 .ml-progress-bar {
   font-size: $ml-base-font-size;
   .progress-bar-header {
+    display: flex;
+    flex-direction: row;
     text-align: left;
   }
   .progress-bar-chart {
     height: 24rpx;
     position: relative;
     margin: 12rpx 0;
-    padding-right: 80rpx;
+    &.show-num {
+      padding-right: 80rpx;
+    }
     .progress-bar-num {
       position: absolute;
       right: 0;
@@ -91,7 +96,8 @@ export default {
       text-align: left;
     }
   }
-  .progress-bar-title {
+  .progress-header-title {
+    flex-grow: 1;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -100,5 +106,10 @@ export default {
       text-decoration: underline;
     }
   }
+  .progress-header-num {
+    flex-grow: 1;
+    min-width: 60rpx;
+    text-align: right;
+  }
 }
 </style>

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

@@ -8,7 +8,8 @@
 export default {
   name: 'MlRow',
   options: {
-    virtualHost: true
+    virtualHost: true,
+    styleIsolation: 'shared'
   },
   props: {
     gutter: [String, Number],

package/lib/components/ml-select-picker/ml-select-picker.vue

@@ -161,6 +161,9 @@ export default {
     text-overflow: ellipsis;
     white-space: nowrap;
   }
+  .ml-select-picker-placeholder {
+    color: $uni-text-color-placeholder;
+  }
 }
 .ml-select-picker-clear-icon {
   width: 34rpx;

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

@@ -17,6 +17,9 @@ import XEUtils from 'xe-utils'
 
 export default {
   name: 'MlText',
+  options: {
+    styleIsolation: 'shared'
+  },
   props: {
     status: String,
     content: String,
@@ -115,4 +118,4 @@ export default {
     display: inline;
   }
 }
-</style>
+</style>

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

@@ -133,7 +133,7 @@ export default {
 .ml-textarea {
   display: block;
   width: 100%;
-  padding: 20rpx 10rpx 10rpx 10rpx;
+  padding: 0 10rpx;
   background: #fff;
   .ml-textarea-placeholder {
     color: $ml-input-color-placeholder;;
@@ -157,6 +157,7 @@ export default {
   }
   .ml-textarea-inp,
   .ml-textarea-simulate {
+    padding: 0;
     height: 280rpx;
     width: 100%;
     font-size: $ml-base-font-size;

package/package.json

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