mali-applet-ui 1.0.18 → 1.0.20

package/README.md

@@ -4,6 +4,8 @@ Mali-Applet-UI 码里云小程序组件库
 
 ## 发布npm
 
+需要先登陆
+
 ```
 npm run release
 ```

package/config/store.js

@@ -28,13 +28,13 @@ const globalStore = {
       optionMethod: null
     },
     types: [
-      { value: 0, label: '起草中', color: '#353535', background: '#F0F2F5' },
-      { value: 1, label: '审批中', color: '#ffffff', background: '#246BFD' },
-      { value: 2, label: '已通过', color: '#ffffff', background: '#00D35C' },
-      { value: 3, label: '已驳回', color: '#ffffff', background: '#FF5064' },
-      { value: 4, label: '会签中', color: '#ffffff', background: '#FF9C00' },
-      { value: 5, label: '处理中', color: '#ffffff', background: '#246BFD' },
-      { value: 6, label: '已完成', color: '#ffffff', background: '#00D35C' }
+      { value: 0, label: '起草中', color: '#353535', background: '#eaebed' },
+      { value: 1, label: '审批中', color: '#007FFF', background: '#e0efff' },
+      { value: 2, label: '已通过', color: '#00B042', background: '#e0f5e8' },
+      { value: 3, label: '已驳回', color: '#FF5064', background: '#ffeaec' },
+      { value: 4, label: '会签中', color: '#007FFF', background: '#e0efff' },
+      { value: 5, label: '处理中', color: '#007FFF', background: '#e0efff' },
+      { value: 6, label: '已完成', color: '#00B042', background: '#e0f5e8' }
     ]
   },
   // 上拉加载更多

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

@@ -215,7 +215,7 @@ export default {
   display: flex;
   flex-direction: row;
   .ml-amount-input-placeholder {
-    color: $uni-text-color-placeholder;
+    color: $ml-input-color-placeholder;;
   }
   .ml-amount-input-readonly-content {
     padding: 20rpx 4rpx;
@@ -263,7 +263,7 @@ export default {
   }
   .ml-amount-input-inp,
   .ml-amount-input-simulate {
-    font-size: $uni-font-size-base;
+    font-size: $ml-base-font-size;
     width: 100%;
     height: 70rpx;
     padding: 0 10rpx;

package/lib/components/ml-approval-type/ml-approval-type.vue

@@ -38,8 +38,8 @@ export default {
 <style lang="scss">
 .ml-approval-type {
   display: inline-block;
-  padding: 8rpx 16rpx;
+  padding: 6rpx 20rpx;
   border-radius: $ml-border-radius;
-  font-size: 24rpx;
+  font-size: $ml-describe-font-size;
 }
 </style>

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

@@ -1,5 +1,12 @@
 <template>
-  <button class="ml-button" :class="[className || '', `type-${type}`, size ? `size-${size}` : '', status ? `ss-${status}` : '', {'is-round': round, 'is-underline': underline, 'is-disabled': disabled}]" :disabled="disabled" :open-type="openType" :style="styles" @tap="tapEvent" @click="clickEvent">
+  <button
+    class="ml-button"
+    :class="[className || '', `type-${type}`, size ? `size-${size}` : '', status ? `ss-${status}` : '', {'is-round': round, 'is-underline': underline, 'is-disabled': disabled}]"
+    :disabled="disabled"
+    :open-type="openType"
+    :style="styles"
+    @tap="tapEvent"
+    @click="clickEvent">
     <slot>{{ content }}</slot>
   </button>
 </template>
@@ -72,7 +79,19 @@ export default {
     line-height: 1.5;
     vertical-align: middle;
     background: transparent;
-    font-size: $uni-font-size-base;
+    font-size: $ml-base-font-size;
+    &.size-large {
+      font-size: 40rpx;
+    }
+    &.size-medium {
+      font-size: 36rpx;
+    }
+    &.size-small {
+      font-size: 28rpx;
+    }
+    &.size-mini {
+      font-size: 24rpx;
+    }
     &.is-underline {
       text-decoration: underline;
     }

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

@@ -1,5 +1,5 @@
 <template>
-  <view class="ml-card"  :class="{'is-bg': background, 'is-padding': padding}">
+  <view class="ml-card"  :class="{'is-bg': background, 'is-padding': padding, 'is-border': border}">
     <view v-if="title || showHeader" class="ml-card-header">
       <view class="ml-card-title">
         <slot name="title">{{ title }}</slot>
@@ -22,6 +22,7 @@ export default {
   },
   props: {
     title: String,
+    border: Boolean,
     background: {
       type: Boolean,
       default: true
@@ -42,6 +43,9 @@ export default {
   &.is-bg {
     background: #fff;
   }
+  &.is-border {
+    border: 1px solid #e5e5e5;
+  }
   &.is-padding {
     .ml-card-body {
       padding: 0 20rpx 20rpx 20rpx;

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

@@ -60,7 +60,7 @@ export default {
   flex-direction: column;
   padding: 20rpx;
   line-height: 50rpx;
-  font-size: $uni-font-size-base;
+  font-size: $ml-describe-font-size;
   $spans: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%,
           37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%,
           70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%;

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

@@ -51,9 +51,9 @@ export default {
   }
   &.is-important {
     padding-bottom: 10rpx;
-    font-size: 30rpx;
+    font-size: $ml-base-font-size;
   }
-  &.normal-shrink {
+  &.is-shrink {
     flex-shrink: 0;
   }
   &.is-ellipsis {

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

@@ -43,6 +43,11 @@ export default {
       cvsHeight: ''
     }
   },
+  watch: {
+    options () {
+      this.loadChart()
+    }
+  },
   mounted  () {
     if (!this.lazyLoad) {
       this.init()

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

@@ -153,6 +153,5 @@ export default {
 <style lang="scss">
 .ml-form {
   display: block;
-  font-size: $uni-font-size-base;
 }
-</style>
+</style>

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

@@ -31,6 +31,7 @@ export default {
 <style lang="scss">
 .ml-form-group {
   margin-bottom: 20rpx;
+  font-size: $ml-base-font-size;
   .ml-form-group-header {
     display: flex;
     flex-direction: row;

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

@@ -1,6 +1,6 @@
 <template>
   <view class="ml-form-item" :class="[className || '', itemTitleAlign ? `title-align-${itemTitleAlign}` : '', itemAlign ? `align-${itemAlign}` : '', {'is-border': isFormBorder, 'is-vertical': itemVertical, 'is-required': isRequired, 'is-error': itemErrRule}]">
-    <view class="ml-form-item-header" :style="titleStyle">
+    <view v-if="title || $slots.title" class="ml-form-item-header" :style="titleStyle">
       <view v-if="isRequired" class="ml-form-item-header-asterisk">*</view>
       <view class="ml-form-item-header-title">
         <slot name="title">{{ title }}</slot>
@@ -185,8 +185,8 @@ export default {
   position: relative;
   display: flex;
   flex-direction: row;
-  font-size: $uni-font-size-base;
   padding: 10rpx 20rpx;
+  font-size: $ml-base-font-size;
   &.is-border {
     border-bottom: 1px solid #e5e5e5;
   }
@@ -207,6 +207,7 @@ export default {
   }
   .ml-form-item-header-title {
     display: inline;
+    color: #171A1D;
   }
   &.is-vertical {
     flex-direction: column;
@@ -256,12 +257,11 @@ export default {
 .ml-form-item-content {
   position: relative;
   display: flex;
-  align-items: center;
+  justify-content: center;
   flex-direction: column;
   flex-grow: 1;
 }
 .ml-form-item-content-warpper {
-  flex-grow: 1;
   width: 100%;
   padding: 10rpx 0;
 }
@@ -269,9 +269,6 @@ export default {
   vertical-align: middle;
 }
 .ml-form-item-content-error {
-  position: absolute;
-  left: 0;
-  bottom: -20rpx;
   width: 100%;
   color: $uni-color-error;
   font-size: 24rpx;

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

@@ -8,10 +8,12 @@
       <text v-else class="ml-input-placeholder">{{ placeholder }}</text>
     </view>
   </view>
-  <view v-else class="ml-input" :class="[className || '', {'is-right': align === 'right', 'is-border': border, 'is-prefix': prefixIcon || type === 'search', 'is-suffix': suffixIcon, 'is-disabled': disabled, 'is-clear': clearable && inpVal}]">
-    <view v-if="prefixIcon || type === 'search'" class="ml-input-prefix-icon">
-      <ml-icon v-if="prefixIcon" :className="prefixIcon"></ml-icon>
-      <ml-icon v-else name="search"></ml-icon>
+  <view v-else class="ml-input" :class="[className || '', {'is-right': align === 'right', 'is-border': border, 'is-prefix': hasPrefix || type === 'search', 'is-suffix': hasSuffix, 'is-disabled': disabled, 'is-clear': clearable && inpVal}]">
+    <view v-if="hasPrefix || type === 'search'" class="ml-input-prefix-icon">
+      <slot name="prefix">
+        <ml-icon v-if="prefixIcon" :name="prefixIcon"></ml-icon>
+        <ml-icon v-else name="search"></ml-icon>
+      </slot>
     </view>
     <input
       v-model="inpVal"
@@ -29,8 +31,10 @@
     <view v-if="clearable && !disabled && inpVal" class="ml-input-clear-icon" @click.stop="clearEvent">
       <ml-icon name="delete-filling"></ml-icon>
     </view>
-    <view v-if="suffixIcon" class="ml-input-suffix-icon">
-      <ml-icon :className="suffixIcon"></ml-icon>
+    <view v-if="hasSuffix" class="ml-input-suffix-icon">
+      <slot name="suffix">
+        <ml-icon :name="suffixIcon"></ml-icon>
+      </slot>
     </view>
   </view>
 </template>
@@ -41,6 +45,7 @@ import { getPlatformEnv } from '../../../utils'
 export default {
   name: 'MlInput',
   options: {
+    styleIsolation: 'shared',
     virtualHost: true
   },
   props: {
@@ -88,6 +93,12 @@ export default {
         return true
       }
       return this.form ? this.form.readonly : false
+    },
+    hasSuffix () {
+      return this.$slots.suffix || this.suffixIcon
+    },
+    hasPrefix () {
+      return this.$slots.prefix || this.prefixIcon
     }
   },
   watch: {
@@ -123,13 +134,13 @@ export default {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .ml-input {
   flex-grow: 1;
   display: flex;
   flex-direction: row;
   .ml-input-placeholder {
-    color: $uni-text-color-placeholder;
+    color: $ml-input-color-placeholder;;
   }
   .ml-input-simulate {
     padding: 0 10rpx;
@@ -151,7 +162,7 @@ export default {
     padding: 0 10rpx;
     height: 70rpx;
     width: 100%;
-    font-size: $uni-font-size-base;
+    font-size: $ml-base-font-size;
   }
   .ml-input-clear-icon {
     width: 60rpx;
@@ -170,10 +181,13 @@ export default {
     flex-shrink: 0;
     align-items: center;
     justify-content: center;
-    border: 1px solid #e5e5e5;
     font-size: 34rpx;
-    padding: 0 10rpx;
     color: rgba(0, 0, 0, 0.4);
+    ::v-deep .ml-button.type-button {
+      height: 67rpx !important;
+      line-height: 67rpx !important;
+      border: none;
+    }
   }
   .ml-input-prefix-icon {
     border-right: 0;
@@ -187,8 +201,6 @@ export default {
       text-align: right;
     }
   }
-  &.is-prefix,
-  &.is-suffix,
   &.is-border {
     .ml-input-clear-icon {
       border: 1px solid #e5e5e5;
@@ -201,6 +213,12 @@ export default {
     }
   }
   &.is-prefix {
+    &.is-border {
+      .ml-input-prefix-icon {
+        border: 1px solid #e5e5e5;
+        border-right: 0;
+      }
+    }
     .ml-input-prefix-icon {
       border-radius: $ml-border-radius 0 0 $ml-border-radius;
     }
@@ -210,6 +228,12 @@ export default {
     }
   }
   &.is-suffix {
+    &.is-border {
+      .ml-input-suffix-icon {
+        border: 1px solid #e5e5e5;
+        border-left: 0;
+      }
+    }
     .ml-input-clear-icon {
       border-radius: 0;
       border-right: 0;

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

@@ -270,6 +270,7 @@ export default {
 .ml-list-group {
   margin-bottom: 20rpx;
   color: $uni-text-color;
+  font-size: $ml-base-font-size;
   .ml-list-group-content {
     display: flex;
     flex-direction: column;

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

@@ -47,6 +47,7 @@ export default {
     },
     url: String,
     redirect: Boolean,
+    itemStyle: Object,
     backgroundColor: String,
     color: String,
     className: String
@@ -66,7 +67,13 @@ export default {
     styles () {
       const cr = this.color ? `color:${this.color};` : ''
       const bgCr = this.backgroundColor ? `background-color:${this.backgroundColor};` : ''
-      return `${bgCr}${cr}`
+      let rest = `${bgCr}${cr}`
+      for (const key in this.itemStyle) {
+        if (!XEUtils.eqNull(this.itemStyle[key])) {
+          rest += `${key}:${this.itemStyle[key]};`
+        }
+      }
+      return rest
     },
     hasCheckedChecked () {
       return this.selection.includes(this.value)
@@ -154,6 +161,7 @@ export default {
   padding: 20rpx;
   border-radius: $ml-border-radius;
   background: #ffffff;
+  font-size: $ml-describe-font-size;
   &.is-disabled {
     opacity: 0.5;
     // #ifdef H5

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

@@ -157,7 +157,6 @@ export default {
   display: flex;
   flex-direction: column;
   margin-bottom: 20rpx;
-  background: #ffffff;
   .ml-list-menu-group-title {
     display: flex;
     flex-direction: row;

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

@@ -1,5 +1,5 @@
 <template>
-  <view class="ml-list-menu-item" :class="[className || '', itemType ? `type-${itemType}` : '', {'is-vertical': itemVertical, 'is-disabled': disabled}]" @click="clickEvent" @tap="tapEvent">
+  <view class="ml-list-menu-item" :class="[className || '', itemType ? `type-${itemType}` : '', {'is-vertical': itemVertical, 'is-border': border, 'is-disabled': disabled}]" :style="styles" @click="clickEvent" @tap="tapEvent">
     <view v-if="itemType === 'checkbox'" class="ml-list-menu-checkbox-icon">
       <ml-checkbox :value="hasCheckedChecked" :disabled="disabled"></ml-checkbox>
     </view>
@@ -46,8 +46,16 @@ export default {
       default: 'mlicon-arrow-right'
     },
     url: String,
+    border: {
+      type: Boolean,
+      default: true
+    },
     redirect: Boolean,
     className: String,
+    backgroundColor: String,
+    margin: String,
+    color: String,
+    itemStyle: Object,
     showDot: Boolean,
     dotStatus: String,
     dotNum: [String, Number]
@@ -64,6 +72,17 @@ export default {
     }
   },
   computed: {
+    styles () {
+      const cr = this.color ? `color:${this.color};` : ''
+      const bgCr = this.backgroundColor ? `background-color:${this.backgroundColor};` : ''
+      let rest = `${bgCr}${cr}`
+      for (const key in this.itemStyle) {
+        if (!XEUtils.eqNull(this.itemStyle[key])) {
+          rest += `${key}:${this.itemStyle[key]};`
+        }
+      }
+      return rest
+    },
     hasCheckedChecked () {
       return this.selection.includes(this.value)
     },
@@ -152,9 +171,8 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  border-bottom: 1px solid #e5e5e5;
   min-height: 90rpx;
-  font-size: 30rpx;
+  font-size: $ml-base-font-size;
   padding: 10rpx 20rpx;
   background: #ffffff;
   &.is-disabled {
@@ -163,8 +181,11 @@ export default {
     cursor: no-drop;
     // #endif
   }
-  &:first-child {
-    border-top: 1px solid #e5e5e5;
+  &.is-border {
+    border-bottom: 1px solid #e5e5e5;
+    &:first-child {
+      border-top: 1px solid #e5e5e5;
+    }
   }
   .ml-list-menu-checkbox-icon,
   .ml-list-menu-radio-icon {

package/lib/components/ml-location-pick/location.js

@@ -0,0 +1,12 @@
+export const getLocation = () => {
+  return new Promise((resolve, reject) => {
+    uni.chooseLocation({
+      success: (res) => {
+        resolve([res])
+      },
+      fail (err) {
+        resolve([null, err])
+      }
+    })
+  })
+}

package/lib/components/ml-location-pick/ml-location-pick.vue

@@ -0,0 +1,72 @@
+<template>
+  <view class="ml-location-pick">
+    <ml-input
+      :border="border"
+      :placeholder="placeholder"
+      v-model="useValue"
+      :disabled="disabled">
+      <template #suffix>
+        <ml-button @click="handleSelectLocation">
+          <ml-icon name="map"></ml-icon>
+        </ml-button>
+      </template>
+    </ml-input>
+  </view>
+</template>
+
+<script>
+import { getLocation } from './location.js'
+
+export default {
+  name: 'MlLocationPick',
+  components: {},
+
+  options: {
+    virtualHost: true
+  },
+  props: {
+    value: String,
+    placeholder: {
+      type: String,
+      default: '请选择地址'
+    },
+    latitude: Number,
+    longitude: Number,
+    border: Boolean,
+    disabled: Boolean,
+    simple: Boolean
+  },
+  methods: {
+    async handleSelectLocation () {
+      const [res, err] = await getLocation()
+      if (!err) {
+        const address = (this.simple ? '' : res.address) + res.name
+        this.$emit('input', address)
+        this.$emit('update:latitude', res.latitude)
+        this.$emit('update:longitude', res.longitude)
+        this.$emit('change', {
+          address: address,
+          latitude: res.latitude,
+          longitude: res.longitude
+        })
+      }
+    }
+  },
+  computed: {
+    useValue: {
+      set (val) {
+        this.$emit('input', val)
+      },
+      get () {
+        return this.value
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.ml-location-pick {
+  display: flex;
+}
+</style>

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

@@ -136,6 +136,7 @@ export default {
   width: $ml-page-full-width;
   height: 100vh;
   z-index: 999;
+  font-size: $ml-base-font-size;
   background-color: rgba(0, 0, 0, 0.4);
   // #ifdef H5
   left: 50%;

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

@@ -31,7 +31,7 @@ export default {
 <style lang="scss">
 .ml-month-picker {
   display: inline-block;
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
   box-sizing: border-box;
   padding: 0;
   position: relative;

package/lib/components/ml-not-data/ml-not-data.vue

@@ -56,4 +56,4 @@ export default {
     margin-bottom: 20rpx;
   }
 }
-</style>
+</style>

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

@@ -195,7 +195,7 @@ export default {
   display: flex;
   flex-direction: row;
   .ml-number-input-placeholder {
-    color: $uni-text-color-placeholder;
+    color: $ml-input-color-placeholder;;
   }
   .ml-number-input-readonly-content {
     padding: 20rpx 4rpx;
@@ -234,7 +234,7 @@ export default {
   }
   .ml-number-input-inp,
   .ml-number-input-simulate {
-    font-size: $uni-font-size-base;
+    font-size: $ml-base-font-size;
     width: 100%;
     height: 70rpx;
     padding: 0 10rpx;

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

@@ -73,7 +73,7 @@ export default {
 
 <style lang="scss">
 .ml-progress-bar {
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
   .progress-bar-header {
     text-align: left;
   }

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

@@ -100,10 +100,10 @@ export default {
   flex-grow: 1;
   display: flex;
   flex-direction: row;
-  background: #eaeced;
+  background: #eaebed;
   border-radius: $ml-border-radius;
   .ml-search-bar-placeholder {
-    color: $uni-text-color-placeholder;
+    color: $ml-input-color-placeholder;
   }
   .ml-search-bar-simulate {
     padding: 0 10rpx;
@@ -112,22 +112,22 @@ export default {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    background: #eaeced;
+    background: #eaebed;
   }
   .ml-search-bar-readonly-content {
     padding: 20rpx 4rpx;
   }
   .ml-search-bar-inp {
     outline: 0;
-    color: rgb(23, 26, 29);
-    background: #eaeced;
+    color: rgba(0, 0, 0, 0.45);
+    background: #eaebed;
   }
   .ml-search-bar-inp,
   .ml-search-bar-simulate {
     padding: 0 10rpx;
     height: 70rpx;
     width: 100%;
-    font-size: 30rpx;
+    font-size: 26rpx;
   }
   .ml-search-bar-clear-icon {
     width: 60rpx;
@@ -135,7 +135,7 @@ export default {
     flex-shrink: 0;
     align-items: center;
     justify-content: center;
-    background: #eaeced;
+    background: #eaebed;
     color: $ml-input-clear-icon-color;
     border-radius: 0 $ml-border-radius $ml-border-radius 0;
   }
@@ -147,7 +147,7 @@ export default {
     justify-content: center;
     font-size: 34rpx;
     padding: 0 10rpx;
-    color: rgba(0, 0, 0, 0.4);
+    color: rgba(0, 0, 0, 0.45);
   }
   &.is-right {
     .ml-search-bar-inp,

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

@@ -126,7 +126,7 @@ export default {
 <style lang="scss">
 .ml-select-picker {
   display: block;
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
   box-sizing: border-box;
   padding: 0;
   position: relative;

package/lib/components/ml-status-tag/ml-status-tag.vue

@@ -37,41 +37,49 @@ export default {
 <style lang="scss">
 .ml-status-tag {
   display: inline-block;
-  color: #ffffff;
-  padding: 8rpx 16rpx;
+  padding: 6rpx 20rpx;
   border-radius: $ml-border-radius;
-  font-size: 24rpx;
+  font-size: $ml-describe-font-size;
   &.ss-primary {
+    color: #ffffff;
     background: $uni-color-primary;
   }
   &.ss-success {
+    color: #ffffff;
     background: $uni-color-success;
   }
   &.ss-info {
     background: #909399;
   }
   &.ss-warning {
+    color: #ffffff;
     background: $uni-color-warning;
   }
   &.ss-danger {
+    color: #ffffff;
     background: $uni-color-error;
   }
   &.ss-gray {
     background: $ml-gray-color;
   }
   &.ss-blue {
+    color: #ffffff;
     background: $ml-blue-color;
   }
   &.ss-green {
+    color: #ffffff;
     background: $ml-green-color;
   }
   &.ss-pink {
+    color: #ffffff;
     background: $ml-pink-color;
   }
   &.ss-orange {
+    color: #ffffff;
     background: $ml-orange-color;
   }
   &.ss-purple {
+    color: #ffffff;
     background: $ml-purple-color;
   }
   .ml-status-tag-left-icon,
@@ -80,4 +88,4 @@ export default {
     display: inline;
   }
 }
-</style>
+</style>

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

@@ -58,7 +58,7 @@ export default {
 .ml-tabs {
   display: flex;
   flex-direction: column;
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
   .ml-tabs-navs {
     flex-shrink: 0;
     white-space: nowrap;

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

@@ -132,11 +132,10 @@ export default {
 .ml-textarea {
   display: block;
   width: 100%;
-  font-size: $uni-font-size-base;
   padding: 20rpx 10rpx 10rpx 20rpx;
   background: #fff;
   .ml-textarea-placeholder {
-    color: $uni-text-color-placeholder;
+    color: $ml-input-color-placeholder;;
   }
   .ml-textarea-simulate {
     background: #ffffff;
@@ -159,7 +158,7 @@ export default {
   .ml-textarea-simulate {
     height: 280rpx;
     width: 100%;
-    font-size: $uni-font-size-base;
+    font-size: $ml-base-font-size;
   }
   .ml-textarea-word-count {
     padding-top: 10rpx;
@@ -170,7 +169,7 @@ export default {
     color: #999999;
     text-align: right;
     padding-right: 20rpx;
-    font-size: 24rpx;
+    font-size: $ml-describe-font-size;
   }
 }
 </style>

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

@@ -94,7 +94,7 @@ export default {
   display: flex;
   align-items: center;
   color: #2497FF;
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
 }
 
 .voice-mark {

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

@@ -39,8 +39,8 @@
         <view class="ml-upload-file-info">
           <view class="ml-upload-file-name">{{ item[nameField] }}</view>
           <view class="ml-upload-file-desc">
-            <ml-button v-if="preview && previewTypes.includes(item[typeField])" status="primary" type="text" @click="previewDocs(item)">预览</ml-button>
-            <ml-button status="primary" type="text" @click="downloadEvent(item)">下载</ml-button>
+            <ml-button v-if="preview && previewTypes.includes(item[typeField])" status="primary" type="text" size="small" @click="previewDocs(item)">预览</ml-button>
+            <ml-button status="primary" type="text" size="small" @click="downloadEvent(item)">下载</ml-button>
           </view>
         </view>
         <view v-if="!isFromReadonly" class="ml-upload-file-right">
@@ -425,10 +425,6 @@ export default {
 </script>
 
 <style lang="scss">
-.ml-upload{
-  margin: 20rpx 0;
-  background: #fff;
-}
 .ml-upload-image-list {
   display: flex;
   flex-direction: row;
@@ -477,9 +473,9 @@ export default {
     font-size: 24rpx;
   }
   .ml-upload-image-img {
-    width: 120rpx;
-    height: 120rpx;
-    line-height: 120rpx;
+    width: 116rpx;
+    height: 116rpx;
+    line-height: 116rpx;
     border-radius: $ml-border-radius;
   }
 }

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

@@ -31,7 +31,7 @@ export default {
 <style lang="scss">
 .ml-year-picker {
   display: inline-block;
-  font-size: $uni-font-size-base;
+  font-size: $ml-base-font-size;
   box-sizing: border-box;
   padding: 0;
   position: relative;

package/package.json

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

package/theme.scss

@@ -1,6 +1,13 @@
 // 页面宽度
 $ml-page-full-width: 100%;
 
+//  字体
+$ml-base-font-size: 34rpx;
+// 副标题体
+$ml-subhead-font-size: 30rpx;
+// 描述体
+$ml-describe-font-size: 28rpx;
+
 // 页面间隔宽度
 $ml-page-interval-margin: 16rpx;
 $ml-page-toolbar-left-width: 120rpx;
@@ -20,3 +27,5 @@ $ml-border-radius: 8rpx;
 $ml-button-interval-margin: 16rpx;
 // 输入框清除按钮颜色
 $ml-input-clear-icon-color:  rgba(23, 26, 29, 0.4);
+// 输入框提示物资颜色
+$ml-input-color-placeholder: rgba(23, 26, 29, 0.4);