mali-applet-ui 1.0.30 → 1.0.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -1
- package/config/store.js +4 -0
- package/lib/components/ml-cascader-picker/ml-cascader-picker.vue +1 -1
- package/lib/components/ml-datetime-picker/ml-datetime-picker.vue +5 -2
- package/lib/components/ml-form-item/ml-form-item.vue +29 -8
- package/lib/components/ml-input/ml-input.vue +3 -2
- package/lib/components/ml-load-more/ml-load-more.vue +1 -1
- package/lib/components/ml-month-picker/ml-month-picker.vue +3 -1
- package/lib/components/ml-not-data/ml-not-data.vue +14 -4
- package/lib/components/ml-province-city-picker/ml-province-city-picker.vue +1 -1
- package/lib/components/ml-select-picker/ml-select-picker.vue +1 -1
- package/lib/components/ml-tabs/ml-tabs.vue +1 -2
- package/lib/components/ml-textarea/ml-textarea.vue +3 -2
- package/lib/components/ml-year-picker/ml-year-picker.vue +3 -1
- package/package.json +1 -1
- package/theme.scss +2 -2
package/README.md
CHANGED
|
@@ -2,9 +2,31 @@
|
|
|
2
2
|
|
|
3
3
|
Mali-Applet-UI 码里云小程序组件库
|
|
4
4
|
|
|
5
|
+
## 初始化/更新依赖
|
|
6
|
+
|
|
7
|
+
```
|
|
8
|
+
npm run update
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## 运行项目
|
|
12
|
+
|
|
13
|
+
### 本地环境
|
|
14
|
+
|
|
15
|
+
#### 运行(微信小程序)
|
|
16
|
+
|
|
17
|
+
```
|
|
18
|
+
npm run serve:mp-weixin
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
#### 运行(钉钉小程序)
|
|
22
|
+
|
|
23
|
+
```
|
|
24
|
+
npm run serve:mp-dingtalk
|
|
25
|
+
```
|
|
26
|
+
|
|
5
27
|
## 发布npm
|
|
6
28
|
|
|
7
|
-
需要先登陆
|
|
29
|
+
需要先登陆NPM
|
|
8
30
|
|
|
9
31
|
```
|
|
10
32
|
npm run release
|
package/config/store.js
CHANGED
|
@@ -10,7 +10,10 @@ export default {
|
|
|
10
10
|
},
|
|
11
11
|
props: {
|
|
12
12
|
value: String,
|
|
13
|
-
border:
|
|
13
|
+
border: {
|
|
14
|
+
type: Boolean,
|
|
15
|
+
default: false
|
|
16
|
+
},
|
|
14
17
|
minDate: [String, Number],
|
|
15
18
|
maxDate: [String, Number],
|
|
16
19
|
clearable: Boolean,
|
|
@@ -40,4 +43,4 @@ export default {
|
|
|
40
43
|
}
|
|
41
44
|
}
|
|
42
45
|
}
|
|
43
|
-
</script>
|
|
46
|
+
</script>
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<view
|
|
2
|
+
<view
|
|
3
|
+
class="ml-form-item"
|
|
4
|
+
:class="[className || '', itemTitleAlign ? `title-align-${itemTitleAlign}` : '', itemAlign ? `align-${itemAlign}` : '', {'is-visible': visible, 'is-border': isFormBorder, 'is-vertical': itemVertical, 'is-required': isRequired, 'is-error': itemErrRule}]"
|
|
5
|
+
:style="styles">
|
|
3
6
|
<view v-if="title || $slots.title" class="ml-form-item-header" :style="titleStyle">
|
|
4
7
|
<view v-if="isRequired" class="ml-form-item-header-asterisk">*</view>
|
|
5
8
|
<view class="ml-form-item-header-title">
|
|
@@ -9,13 +12,13 @@
|
|
|
9
12
|
<view class="ml-form-item-content">
|
|
10
13
|
<view class="ml-form-item-content-warpper">
|
|
11
14
|
<slot>
|
|
12
|
-
<ml-input v-if="matchComponent('MlInput')" :value="itemValue"
|
|
13
|
-
<ml-number-input v-else-if="matchComponent('MlNumberInput')" :value="itemValue"
|
|
14
|
-
<ml-date-picker v-else-if="matchComponent('MlDatePicker')" :value="itemValue"
|
|
15
|
-
<ml-select-picker v-else-if="matchComponent('MlSelectPicker')" :value="itemValue" :options="renderOpts.options"
|
|
16
|
-
<ml-textarea v-else-if="matchComponent('MlTextarea')" :value="itemValue" :rows="renderOpts.rows || 3" :showVoice="renderOpts.showVoice || true"
|
|
15
|
+
<ml-input v-if="matchComponent('MlInput')" :value="itemValue" @change="modelEvent"></ml-input>
|
|
16
|
+
<ml-number-input v-else-if="matchComponent('MlNumberInput')" :value="itemValue" @change="modelEvent"></ml-number-input>
|
|
17
|
+
<ml-date-picker v-else-if="matchComponent('MlDatePicker')" :value="itemValue" @change="modelEvent"></ml-date-picker>
|
|
18
|
+
<ml-select-picker v-else-if="matchComponent('MlSelectPicker')" :value="itemValue" :options="renderOpts.options" @change="modelEvent"></ml-select-picker>
|
|
19
|
+
<ml-textarea v-else-if="matchComponent('MlTextarea')" :value="itemValue" :rows="renderOpts.rows || 3" :showVoice="renderOpts.showVoice || true" @change="modelEvent"></ml-textarea>
|
|
17
20
|
<ml-upload v-else-if="matchComponent('MlUpload')" :value="itemValue" :mediatype="renderOpts.mediatype || 'image'" @change="modelEvent"></ml-upload>
|
|
18
|
-
<ml-amount-input v-else-if="matchComponent('MlAmountInput')" :value="itemValue" :showTip="itemVertical"
|
|
21
|
+
<ml-amount-input v-else-if="matchComponent('MlAmountInput')" :value="itemValue" :showTip="itemVertical" @change="modelEvent"></ml-amount-input>
|
|
19
22
|
<ml-amount-text v-else-if="matchComponent('MlAmountText')" :value="itemValue" @change="modelEvent"></ml-amount-text>
|
|
20
23
|
<text v-else class="ml-form-item-default-content">{{ itemValue }}</text>
|
|
21
24
|
</slot>
|
|
@@ -40,8 +43,13 @@ export default {
|
|
|
40
43
|
required: Boolean,
|
|
41
44
|
titleAlign: String,
|
|
42
45
|
vertical: Boolean,
|
|
46
|
+
visible: {
|
|
47
|
+
type: Boolean,
|
|
48
|
+
default: true
|
|
49
|
+
},
|
|
43
50
|
labelWidth: String,
|
|
44
51
|
itemRender: Object,
|
|
52
|
+
itemStyle: Object,
|
|
45
53
|
className: String
|
|
46
54
|
},
|
|
47
55
|
inject: {
|
|
@@ -61,6 +69,15 @@ export default {
|
|
|
61
69
|
}
|
|
62
70
|
},
|
|
63
71
|
computed: {
|
|
72
|
+
styles () {
|
|
73
|
+
let rest = ''
|
|
74
|
+
for (const key in this.itemStyle) {
|
|
75
|
+
if (!XEUtils.eqNull(this.itemStyle[key])) {
|
|
76
|
+
rest += `${key}:${this.itemStyle[key]};`
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
return rest
|
|
80
|
+
},
|
|
64
81
|
titleStyle () {
|
|
65
82
|
if (this.itemVertical) {
|
|
66
83
|
return ''
|
|
@@ -186,10 +203,13 @@ export default {
|
|
|
186
203
|
<style lang="scss">
|
|
187
204
|
.ml-form-item {
|
|
188
205
|
position: relative;
|
|
189
|
-
display:
|
|
206
|
+
display: none;
|
|
190
207
|
flex-direction: row;
|
|
191
208
|
padding: 10rpx 20rpx;
|
|
192
209
|
font-size: $ml-base-font-size;
|
|
210
|
+
&.is-visible {
|
|
211
|
+
display: flex;
|
|
212
|
+
}
|
|
193
213
|
&.is-border {
|
|
194
214
|
border-bottom: 1px solid #e5e5e5;
|
|
195
215
|
}
|
|
@@ -267,6 +287,7 @@ export default {
|
|
|
267
287
|
.ml-form-item-content-warpper {
|
|
268
288
|
width: 100%;
|
|
269
289
|
padding: 10rpx 0;
|
|
290
|
+
word-break: break-all;
|
|
270
291
|
}
|
|
271
292
|
.ml-form-item-default-content {
|
|
272
293
|
vertical-align: middle;
|
|
@@ -41,6 +41,7 @@
|
|
|
41
41
|
|
|
42
42
|
<script>
|
|
43
43
|
import { getPlatformEnv } from '../../../utils'
|
|
44
|
+
import XEUtils from 'xe-utils'
|
|
44
45
|
|
|
45
46
|
export default {
|
|
46
47
|
name: 'MlInput',
|
|
@@ -103,11 +104,11 @@ export default {
|
|
|
103
104
|
},
|
|
104
105
|
watch: {
|
|
105
106
|
value (val) {
|
|
106
|
-
this.inpVal = val
|
|
107
|
+
this.inpVal = XEUtils.toValueString(val)
|
|
107
108
|
}
|
|
108
109
|
},
|
|
109
110
|
created () {
|
|
110
|
-
this.inpVal = this.value
|
|
111
|
+
this.inpVal = XEUtils.toValueString(this.value)
|
|
111
112
|
},
|
|
112
113
|
methods: {
|
|
113
114
|
inputEvent () {
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
<picker :value="value" class="ml-month-picker" mode="date" fields="month" @change="changeEvent">
|
|
3
3
|
<view class="ml-month-picker-warpper" :class="[className || '', {'is-border': border}]">
|
|
4
4
|
<view class="ml-month-picker-text">{{ value || '请选择' }}</view>
|
|
5
|
-
<
|
|
5
|
+
<view class="ml-month-picker-icon">
|
|
6
|
+
<ml-icon name="arrow-right"></ml-icon>
|
|
7
|
+
</view>
|
|
6
8
|
</view>
|
|
7
9
|
</picker>
|
|
8
10
|
</template>
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view class="ml-not-data">
|
|
3
3
|
<slot>
|
|
4
|
-
<view v-if="
|
|
4
|
+
<view v-if="emptyImgUrl || $slots.icon" class="ml-not-data-image">
|
|
5
5
|
<slot name="icon">
|
|
6
|
-
<image class="ml-not-data-image-icon" :src="
|
|
6
|
+
<image class="ml-not-data-image-icon" :src="emptyImgUrl" mode="aspectFit"></image>
|
|
7
7
|
</slot>
|
|
8
8
|
</view>
|
|
9
|
-
<view v-if="
|
|
9
|
+
<view v-if="emptyContentText || $slots.text" class="ml-not-data-text">
|
|
10
10
|
<slot name="text">
|
|
11
|
-
<text>{{
|
|
11
|
+
<text>{{ emptyContentText }}</text>
|
|
12
12
|
</slot>
|
|
13
13
|
</view>
|
|
14
14
|
<view v-if="emptyHint || $slots.hint" class="ml-not-data-hint">
|
|
@@ -24,12 +24,22 @@
|
|
|
24
24
|
</template>
|
|
25
25
|
|
|
26
26
|
<script>
|
|
27
|
+
import globalStore from '../../../config/store'
|
|
28
|
+
|
|
27
29
|
export default {
|
|
28
30
|
name: 'MlNotData',
|
|
29
31
|
props: {
|
|
30
32
|
emptyUrl: String,
|
|
31
33
|
emptyText: String,
|
|
32
34
|
emptyHint: String
|
|
35
|
+
},
|
|
36
|
+
computed: {
|
|
37
|
+
emptyImgUrl () {
|
|
38
|
+
return this.emptyUrl || globalStore.notData.emptyUrl
|
|
39
|
+
},
|
|
40
|
+
emptyContentText () {
|
|
41
|
+
return this.emptyText || globalStore.notData.emptyText
|
|
42
|
+
}
|
|
33
43
|
}
|
|
34
44
|
}
|
|
35
45
|
</script>
|
|
@@ -75,7 +75,6 @@ export default {
|
|
|
75
75
|
.ml-tabs-header {
|
|
76
76
|
background: #fff;
|
|
77
77
|
padding-bottom: 10rpx;
|
|
78
|
-
margin-bottom: 20rpx;
|
|
79
78
|
}
|
|
80
79
|
.ml-tabs-content {
|
|
81
80
|
display: flex;
|
|
@@ -90,7 +89,7 @@ export default {
|
|
|
90
89
|
text-align: center;
|
|
91
90
|
.ml-tabs-nav-title {
|
|
92
91
|
position: relative;
|
|
93
|
-
padding: 10rpx
|
|
92
|
+
padding: 10rpx 10rpx;
|
|
94
93
|
}
|
|
95
94
|
&.is-active {
|
|
96
95
|
.ml-tabs-nav-title {
|
|
@@ -36,6 +36,7 @@
|
|
|
36
36
|
|
|
37
37
|
<script>
|
|
38
38
|
import { getPlatformEnv } from '../../../utils'
|
|
39
|
+
import XEUtils from 'xe-utils'
|
|
39
40
|
// import VoiceInput from './voice-input.vue'
|
|
40
41
|
|
|
41
42
|
export default {
|
|
@@ -103,11 +104,11 @@ export default {
|
|
|
103
104
|
},
|
|
104
105
|
watch: {
|
|
105
106
|
value (val) {
|
|
106
|
-
this.inpVal = val
|
|
107
|
+
this.inpVal = XEUtils.toValueString(val)
|
|
107
108
|
}
|
|
108
109
|
},
|
|
109
110
|
created () {
|
|
110
|
-
this.inpVal = this.value
|
|
111
|
+
this.inpVal = XEUtils.toValueString(this.value)
|
|
111
112
|
},
|
|
112
113
|
methods: {
|
|
113
114
|
inputEvent () {
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
<picker :value="value" class="ml-year-picker" mode="date" fields="year" @change="changeEvent">
|
|
3
3
|
<view class="ml-year-picker-warpper" :class="[className || '', {'is-border': border}]">
|
|
4
4
|
<view class="ml-year-picker-text">{{ value || '请选择' }}</view>
|
|
5
|
-
<
|
|
5
|
+
<view class="ml-year-picker-icon">
|
|
6
|
+
<ml-icon name="arrow-right"></ml-icon>
|
|
7
|
+
</view>
|
|
6
8
|
</view>
|
|
7
9
|
</picker>
|
|
8
10
|
</template>
|
package/package.json
CHANGED