mali-applet-ui 0.0.64 → 0.0.65

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

@@ -44,6 +44,7 @@ export default {
   },
   data () {
     return {
+      itemList: []
     }
   },
   methods: {

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

@@ -1,9 +1,10 @@
 <template>
-  <view class="ml-form-item" :class="[className, '', itemTitleAlign ? `title-align-${itemTitleAlign}` : '', itemAlign ? `align-${itemAlign}` : '', {'is-border': isFormBorder, 'is-vertical': itemVertical}]">
-    <view class="ml-form-item-title" :style="titleStyle">
-      <slot name="title">
-        <text>{{ title }}</text>
-      </slot>
+  <view class="ml-form-item" :class="[className, '', itemTitleAlign ? `title-align-${itemTitleAlign}` : '', itemAlign ? `align-${itemAlign}` : '', {'is-border': isFormBorder, 'is-vertical': itemVertical, 'is-required': isRequired}]">
+    <view class="ml-form-item-header" :style="titleStyle">
+      <text v-if="isRequired" class="ml-form-item-header-asterisk">*</text>
+      <text class="ml-form-item-header-title">
+        <slot name="title">{{ title }}</slot>
+      </text>
     </view>
     <view class="ml-form-item-content">
       <view class="ml-form-item-content-warpper">
@@ -11,7 +12,7 @@
           <ml-input v-if="matchComponent('MlInput')" :value="itemValue" border @change="modelEvent"></ml-input>
           <ml-date-picker v-else-if="matchComponent('MlDatePicker')" :value="itemValue" border @change="modelEvent"></ml-date-picker>
           <ml-select-picker v-else-if="matchComponent('MlSelectPicker')" :value="itemValue" :options="renderOpts.options" border @change="modelEvent"></ml-select-picker>
-          <ml-textarea v-else-if="matchComponent('MlTextarea')" :value="itemValue" :rows="renderOpts.rows || 3" border @change="modelEvent"></ml-textarea>
+          <ml-textarea v-else-if="matchComponent('MlTextarea')" :value="itemValue" :rows="renderOpts.rows || 3" :showVoice="renderOpts.showVoice || true" border @change="modelEvent"></ml-textarea>
           <ml-upload v-else-if="matchComponent('MlUpload')" :value="itemValue" :mediatype="renderOpts.mediatype || 'image'" @change="modelEvent"></ml-upload>
           <ml-amount-input v-else-if="matchComponent('MlAmountInput')" :value="itemValue" border @change="modelEvent"></ml-amount-input>
           <ml-amount-text v-else-if="matchComponent('MlAmountText')" :value="itemValue" @change="modelEvent"></ml-amount-text>
@@ -23,6 +24,8 @@
 </template>
 
 <script>
+import XEUtils from 'xe-utils'
+
 export default {
   name: 'MlFormItem',
   options: {
@@ -44,6 +47,23 @@ export default {
       default: null
     }
   },
+  data () {
+    return {
+      mId: XEUtils.uniqueId('mlFItem')
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      if (this.form) {
+        this.form.itemList.push(this)
+      }
+    })
+  },
+  beforeDestroy () {
+    if (this.form) {
+      XEUtils.remove(this.form.itemList, item => item.mId === this.mId)
+    }
+  },
   computed: {
     titleStyle () {
       return this.itemLabelWidth ? `width:${this.itemLabelWidth};` : ''
@@ -98,12 +118,7 @@ export default {
       return labelWidth
     }
   },
-  created () {
-    this.init()
-  },
   methods: {
-    init () {
-    },
     matchComponent (name) {
       return this.renderOpts.name === name
     },
@@ -127,30 +142,34 @@ export default {
       border: 0;
     }
   }
-  .ml-form-item-title {
+  .ml-form-item-header {
     min-height: 70rpx;
     color: rgba(0, 0, 0, 0.65);
   }
+  .ml-form-item-header-asterisk {
+    color: red;
+    padding-right: 4rpx;
+  }
   &.is-vertical {
     flex-direction: column;
   }
   &:not(.is-vertical) {
-    .ml-form-item-title {
+    .ml-form-item-header {
       flex-shrink: 0;
     }
   }
   &.title-align-left {
-    .ml-form-item-title {
+    .ml-form-item-header {
       text-align: left;
     }
   }
   &.title-align-center {
-    .ml-form-item-title {
+    .ml-form-item-header {
       text-align: center;
     }
   }
   &.title-align-right {
-    .ml-form-item-title {
+    .ml-form-item-header {
       text-align: right;
     }
   }
@@ -169,7 +188,7 @@ export default {
       text-align: right;
     }
   }
-  .ml-form-item-title {
+  .ml-form-item-header {
     display: flex;
     align-items: center;
     padding-right: 20rpx;

package/index.js

@@ -1,18 +1,21 @@
 import config from './config'
-import MaliToast from './toast'
-import MaliLoading from './loading'
+import MaliToast from './modal/toast'
+import MaliModal from './modal/modal'
+import MaliLoading from './modal/loading'
 import * as MaliUtils from './utils'
 
 const MaliUI = {
   config,
   MaliUtils,
   MaliToast,
+  MaliModal,
   MaliLoading
 }
 
 export {
 	MaliUtils,
   MaliToast,
+  MaliModal,
   MaliLoading
 }
 

package/modal/modal.js

@@ -0,0 +1,47 @@
+const MaliModal = {
+  open (option = {}) {
+    return new Promise(resolve => {
+      uni.showModal({
+        title: option.title || '系统提示',
+        content: option.content || '',
+        ...option,
+        success (res) {
+          if (res.confirm) {
+            resolve('confirm')
+          } else if (res.cancel) {
+            resolve('cancel')
+          }
+        }
+      })
+    })
+  },
+  alert (option = {}) {
+    return new Promise(resolve => {
+      uni.showModal({
+        title: option.title || '系统提示',
+        content: option.content || '',
+        success () {
+          resolve('confirm')
+        }
+      })
+    })
+  },
+  confirm (option = {}) {
+    return new Promise(resolve => {
+      uni.showModal({
+        title: option.title || '系统提示',
+        content: option.content || '',
+        showCancel: true,
+        success (res) {
+          if (res.confirm) {
+            resolve('confirm')
+          } else if (res.cancel) {
+            resolve('cancel')
+          }
+        }
+      })
+    })
+  }
+}
+
+export default MaliModal

package/package.json

@@ -1,13 +1,12 @@
 {
   "name": "mali-applet-ui",
-  "version": "0.0.64",
+  "version": "0.0.65",
   "description": "码里云小程序组件库",
   "files": [
     "components",
     "config",
     "utils",
-    "loading",
-    "toast",
+    "modal",
     "iconfont.css",
     "index.js",
     "index.scss"