mali-applet-ui 0.1.9 → 0.1.11
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<view v-if="isFromReadonly" class="ml-input is-readonly">
|
|
2
|
+
<view v-if="isFromReadonly" class="ml-input is-readonly" :class="[className || '', {'is-right': align === 'right', 'is-border': border}]">
|
|
3
3
|
<view class="ml-input-readonly-content">{{ inpVal }}</view>
|
|
4
4
|
</view>
|
|
5
5
|
<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}]">
|
|
@@ -15,10 +15,11 @@
|
|
|
15
15
|
:confirm-type="type === 'search' ? 'search' : 'done'"
|
|
16
16
|
:placeholder="placeholder"
|
|
17
17
|
:maxlength="maxlength"
|
|
18
|
+
:disabled="disabled"
|
|
18
19
|
@input="inputEvent"
|
|
19
20
|
@blur="blurEvent"
|
|
20
21
|
@confirm="confirmEvent"/>
|
|
21
|
-
<view v-if="clearable && inpVal" class="ml-input-clear-icon" @click.stop="clearEvent">
|
|
22
|
+
<view v-if="clearable && !disabled && inpVal" class="ml-input-clear-icon" @click.stop="clearEvent">
|
|
22
23
|
<ml-icon name="delete-filling"></ml-icon>
|
|
23
24
|
</view>
|
|
24
25
|
<view v-if="suffixIcon" class="ml-input-suffix-icon">
|
|
@@ -42,6 +43,7 @@ export default {
|
|
|
42
43
|
prefixIcon: String,
|
|
43
44
|
suffixIcon: String,
|
|
44
45
|
clearable: Boolean,
|
|
46
|
+
readonly: Boolean,
|
|
45
47
|
placeholder: {
|
|
46
48
|
type: String,
|
|
47
49
|
default: '请输入'
|
|
@@ -65,6 +67,9 @@ export default {
|
|
|
65
67
|
},
|
|
66
68
|
computed: {
|
|
67
69
|
isFromReadonly () {
|
|
70
|
+
if (this.readonly) {
|
|
71
|
+
return true
|
|
72
|
+
}
|
|
68
73
|
return this.form ? this.form.readonly : false
|
|
69
74
|
}
|
|
70
75
|
},
|
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
</view>
|
|
17
17
|
</view>
|
|
18
18
|
|
|
19
|
-
<ml-popup v-model="showPopup" title="请选择省/市" showConfirmButton showCancelButton @confirm="confirmEvent">
|
|
20
|
-
<picker-view v-if="
|
|
19
|
+
<ml-popup v-model="showPopup" title="请选择省/市" height="500rpx" showConfirmButton showCancelButton @confirm="confirmEvent">
|
|
20
|
+
<picker-view v-if="showPicker" :value="selectVals" @change="changeEvent" style="height: 400rpx;text-align: center;">
|
|
21
21
|
<picker-view-column>
|
|
22
22
|
<view class="item" v-for="(item, index) in provinceList" :key="index">{{ item[optLabelField] }}</view>
|
|
23
23
|
</picker-view-column>
|
|
@@ -54,6 +54,7 @@ export default {
|
|
|
54
54
|
data () {
|
|
55
55
|
return {
|
|
56
56
|
showPopup: false,
|
|
57
|
+
showPicker: false,
|
|
57
58
|
selectVals: [0]
|
|
58
59
|
}
|
|
59
60
|
},
|
|
@@ -104,9 +105,13 @@ export default {
|
|
|
104
105
|
methods: {
|
|
105
106
|
closePopup () {
|
|
106
107
|
this.showPopup = false
|
|
108
|
+
this.showPicker = false
|
|
107
109
|
},
|
|
108
110
|
openPopup () {
|
|
109
111
|
this.showPopup = true
|
|
112
|
+
setTimeout(() => {
|
|
113
|
+
this.showPicker = true
|
|
114
|
+
}, 50)
|
|
110
115
|
},
|
|
111
116
|
changeEvent (e) {
|
|
112
117
|
this.selectVals = e.detail.value
|
|
@@ -32,6 +32,7 @@ export default {
|
|
|
32
32
|
default: '请选择'
|
|
33
33
|
},
|
|
34
34
|
clearable: Boolean,
|
|
35
|
+
readonly: Boolean,
|
|
35
36
|
options: Array,
|
|
36
37
|
optionProps: Object,
|
|
37
38
|
width: String,
|
|
@@ -50,6 +51,9 @@ export default {
|
|
|
50
51
|
},
|
|
51
52
|
computed: {
|
|
52
53
|
isFromReadonly () {
|
|
54
|
+
if (this.readonly) {
|
|
55
|
+
return true
|
|
56
|
+
}
|
|
53
57
|
return this.form ? this.form.readonly : false
|
|
54
58
|
},
|
|
55
59
|
optionList () {
|
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<view v-if="isFromReadonly" class="ml-textarea is-readonly">
|
|
2
|
+
<view v-if="isFromReadonly" class="ml-textarea is-readonly" :class="[className || '', {'is-border': border}]">
|
|
3
3
|
<view class="ml-textarea-readonly-content">{{ inpVal }}</view>
|
|
4
4
|
</view>
|
|
5
|
-
<view v-else class="ml-textarea" :class="[className || '', {'is-border': border}]">
|
|
5
|
+
<view v-else class="ml-textarea" :class="[className || '', {'is-border': border, 'is-disabled': disabled}]">
|
|
6
6
|
<view v-if="readonly" class="ml-textarea-content">{{ inpVal }}</view>
|
|
7
7
|
<view v-else>
|
|
8
|
-
<textarea
|
|
9
|
-
|
|
8
|
+
<textarea
|
|
9
|
+
class="ml-textarea-inp"
|
|
10
|
+
v-model="inpVal"
|
|
11
|
+
:rows="rows"
|
|
12
|
+
:maxlength="maxLength"
|
|
13
|
+
:placeholder="placeholder"
|
|
14
|
+
:disabled="disabled"
|
|
15
|
+
:show-count="false"
|
|
16
|
+
@input="inputEvent"
|
|
17
|
+
:style="{color: fontColor, height: `${rows * 30}rpx`}" />
|
|
18
|
+
<view v-if="showWordLimit && !disabled" class="ml-textarea-word-count">
|
|
10
19
|
<!-- <VoiceInput v-if="showVoice" v-model="inpVal" @input="inputEvent"></VoiceInput> -->
|
|
11
20
|
<view class="ml-textarea-word-numbers">{{ value ? value.length : 0 }}/{{ maxLength }}</view>
|
|
12
21
|
</view>
|
|
@@ -31,6 +40,7 @@ export default {
|
|
|
31
40
|
default: ''
|
|
32
41
|
},
|
|
33
42
|
border: Boolean,
|
|
43
|
+
disabled: Boolean,
|
|
34
44
|
rows: {
|
|
35
45
|
type: Number,
|
|
36
46
|
default: 3
|