mali-applet-ui 0.0.85 → 0.0.87
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/components/ml-checkbox/ml-checkbox.vue +7 -4
- package/components/ml-chunk-group/ml-chunk-group.vue +1 -1
- package/components/ml-form-group/ml-form-group.vue +2 -2
- package/components/ml-form-item/ml-form-item.vue +7 -3
- package/components/ml-input/ml-input.vue +16 -2
- package/components/ml-list-group/ml-list-group.vue +2 -8
- package/components/ml-list-menu-group/ml-list-menu-group.vue +1 -1
- package/components/ml-progress-bar/ml-progress-bar.vue +2 -2
- package/components/ml-radio/ml-radio.vue +8 -4
- package/components/ml-radio-group/ml-radio-group.vue +0 -3
- package/components/ml-text/ml-text.vue +14 -8
- package/components/ml-textarea/ml-textarea.vue +1 -0
- package/package.json +1 -1
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view class="ml-checkbox" :class="[className || '', {'is-checked': checked, 'is-disabled': disabled}]" @tap="tapEvent">
|
|
3
|
-
<
|
|
3
|
+
<view class="ml-checkbox-icon">
|
|
4
4
|
<ml-icon :name="checked ? 'checkbox-checked' : (indeterminate ? 'checkbox-indeterminate' : 'checkbox-unchecked')"></ml-icon>
|
|
5
|
-
</
|
|
6
|
-
<
|
|
5
|
+
</view>
|
|
6
|
+
<view class="ml-checkbox-content">
|
|
7
7
|
<slot>
|
|
8
8
|
<text>{{ content }}</text>
|
|
9
9
|
</slot>
|
|
10
|
-
</
|
|
10
|
+
</view>
|
|
11
11
|
</view>
|
|
12
12
|
</template>
|
|
13
13
|
|
|
@@ -69,5 +69,8 @@ export default {
|
|
|
69
69
|
.ml-checkbox-content {
|
|
70
70
|
vertical-align: middle;
|
|
71
71
|
}
|
|
72
|
+
.ml-checkbox-content {
|
|
73
|
+
display: inline-block;
|
|
74
|
+
}
|
|
72
75
|
}
|
|
73
76
|
</style>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<view class="ml-form-group" :class="className">
|
|
2
|
+
<view class="ml-form-group" :class="className || ''">
|
|
3
3
|
<view v-if="title || $slots.title" class="ml-form-group-title">
|
|
4
4
|
<slot name="title">
|
|
5
5
|
<text>{{ title }}</text>
|
|
@@ -26,9 +26,9 @@ export default {
|
|
|
26
26
|
|
|
27
27
|
<style lang="scss">
|
|
28
28
|
.ml-form-group {
|
|
29
|
-
margin: 20rpx 0;
|
|
30
29
|
border-radius: 10rpx;
|
|
31
30
|
background: #ffffff;
|
|
31
|
+
margin-bottom: 20rpx;
|
|
32
32
|
.ml-form-group-title {
|
|
33
33
|
display: flex;
|
|
34
34
|
align-items: center;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view class="ml-form-item" :class="[className, '', itemTitleAlign ? `title-align-${itemTitleAlign}` : '', itemAlign ? `align-${itemAlign}` : '', {'is-border': isFormBorder, 'is-vertical': itemVertical, 'is-required': isRequired}]">
|
|
3
3
|
<view class="ml-form-item-header" :style="titleStyle">
|
|
4
|
-
<
|
|
5
|
-
<
|
|
4
|
+
<view v-if="isRequired" class="ml-form-item-header-asterisk">*</view>
|
|
5
|
+
<view class="ml-form-item-header-title">
|
|
6
6
|
<slot name="title">{{ title }}</slot>
|
|
7
|
-
</
|
|
7
|
+
</view>
|
|
8
8
|
</view>
|
|
9
9
|
<view class="ml-form-item-content">
|
|
10
10
|
<view class="ml-form-item-content-warpper">
|
|
@@ -152,9 +152,13 @@ export default {
|
|
|
152
152
|
color: rgba(0, 0, 0, 0.65);
|
|
153
153
|
}
|
|
154
154
|
.ml-form-item-header-asterisk {
|
|
155
|
+
display: inline;
|
|
155
156
|
color: red;
|
|
156
157
|
padding-right: 4rpx;
|
|
157
158
|
}
|
|
159
|
+
.ml-form-item-header-title {
|
|
160
|
+
display: inline;
|
|
161
|
+
}
|
|
158
162
|
&.is-vertical {
|
|
159
163
|
flex-direction: column;
|
|
160
164
|
}
|
|
@@ -95,18 +95,19 @@ export default {
|
|
|
95
95
|
}
|
|
96
96
|
.ml-input-prefix-icon,
|
|
97
97
|
.ml-input-suffix-icon {
|
|
98
|
+
min-width: 70rpx;
|
|
98
99
|
display: flex;
|
|
99
100
|
flex-shrink: 0;
|
|
100
101
|
align-items: center;
|
|
102
|
+
justify-content: center;
|
|
101
103
|
border: 1px solid #e5e5e5;
|
|
102
104
|
font-size: 30rpx;
|
|
105
|
+
padding: 0 10rpx;
|
|
103
106
|
}
|
|
104
107
|
.ml-input-prefix-icon {
|
|
105
|
-
padding-left: 20rpx;
|
|
106
108
|
border-right: 0;
|
|
107
109
|
}
|
|
108
110
|
.ml-input-suffix-icon {
|
|
109
|
-
padding-right: 20rpx;
|
|
110
111
|
border-left: 0;
|
|
111
112
|
}
|
|
112
113
|
&.is-right {
|
|
@@ -123,13 +124,26 @@ export default {
|
|
|
123
124
|
}
|
|
124
125
|
}
|
|
125
126
|
&.is-prefix {
|
|
127
|
+
.ml-input-prefix-icon {
|
|
128
|
+
border-radius: 10rpx 0 0 10rpx;
|
|
129
|
+
}
|
|
126
130
|
.ml-input-inp {
|
|
127
131
|
border-left: 0;
|
|
132
|
+
border-radius: 0 10rpx 10rpx 0;
|
|
128
133
|
}
|
|
129
134
|
}
|
|
130
135
|
&.is-suffix {
|
|
136
|
+
.ml-input-suffix-icon {
|
|
137
|
+
border-radius: 0 10rpx 10rpx 0;
|
|
138
|
+
}
|
|
131
139
|
.ml-input-inp {
|
|
132
140
|
border-right: 0;
|
|
141
|
+
border-radius: 10rpx 0 0 10rpx;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
&.is-prefix.is-suffix {
|
|
145
|
+
.ml-input-inp {
|
|
146
|
+
border-radius: 0;
|
|
133
147
|
}
|
|
134
148
|
}
|
|
135
149
|
}
|
|
@@ -15,16 +15,10 @@ import XEUtils from 'xe-utils'
|
|
|
15
15
|
|
|
16
16
|
export default {
|
|
17
17
|
name: 'MlListGroup',
|
|
18
|
-
options: {
|
|
19
|
-
virtualHost: true
|
|
20
|
-
},
|
|
21
18
|
props: {
|
|
22
19
|
value: Array,
|
|
23
20
|
showPage: Boolean,
|
|
24
|
-
autoload:
|
|
25
|
-
type: Boolean,
|
|
26
|
-
default: true
|
|
27
|
-
},
|
|
21
|
+
autoload: Boolean,
|
|
28
22
|
height: String,
|
|
29
23
|
pageProps: Object,
|
|
30
24
|
requestMethod: Function,
|
|
@@ -145,7 +139,7 @@ export default {
|
|
|
145
139
|
|
|
146
140
|
<style lang="scss">
|
|
147
141
|
.ml-list-group {
|
|
148
|
-
margin: 20rpx
|
|
142
|
+
margin-bottom: 20rpx;
|
|
149
143
|
.ml-list-group-content {
|
|
150
144
|
display: flex;
|
|
151
145
|
flex-direction: column;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<view class="ml-progress-bar" :class="className">
|
|
3
3
|
<view class="progress-bar-header">
|
|
4
4
|
<slot name="header">
|
|
5
|
-
<view v-if="title
|
|
5
|
+
<view v-if="title" class="progress-bar-title" :class="{'is-underline': titleUnderline}">{{ title }}</view>
|
|
6
6
|
</slot>
|
|
7
7
|
</view>
|
|
8
8
|
<view class="progress-bar-chart" @click="barClick">
|
|
@@ -93,7 +93,7 @@ export default {
|
|
|
93
93
|
}
|
|
94
94
|
.progress-bar-title {
|
|
95
95
|
color: rgba(0, 0, 0, 0.85);
|
|
96
|
-
&.underline {
|
|
96
|
+
&.is-underline {
|
|
97
97
|
text-decoration: underline;
|
|
98
98
|
}
|
|
99
99
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<view class="ml-radio" :class="[className || '', {'is-checked': checked, 'is-disabled': disabled}]" @tap="tapEvent">
|
|
3
|
-
<
|
|
3
|
+
<view class="ml-radio-icon">
|
|
4
4
|
<ml-icon :name="checked ? 'radio-checked' : 'radio-unchecked'"></ml-icon>
|
|
5
|
-
</
|
|
6
|
-
<
|
|
5
|
+
</view>
|
|
6
|
+
<view class="ml-radio-content">
|
|
7
7
|
<slot>
|
|
8
8
|
<text>{{ content }}</text>
|
|
9
9
|
</slot>
|
|
10
|
-
</
|
|
10
|
+
</view>
|
|
11
11
|
</view>
|
|
12
12
|
</template>
|
|
13
13
|
|
|
@@ -50,6 +50,7 @@ export default {
|
|
|
50
50
|
color: $uni-color-primary;
|
|
51
51
|
}
|
|
52
52
|
.ml-radio-icon {
|
|
53
|
+
display: inline-block;
|
|
53
54
|
margin-right: 10rpx;
|
|
54
55
|
font-size: 1.4em;
|
|
55
56
|
}
|
|
@@ -57,5 +58,8 @@ export default {
|
|
|
57
58
|
.ml-radio-content {
|
|
58
59
|
vertical-align: middle;
|
|
59
60
|
}
|
|
61
|
+
.ml-radio-content {
|
|
62
|
+
display: inline-block;
|
|
63
|
+
}
|
|
60
64
|
}
|
|
61
65
|
</style>
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
<
|
|
2
|
+
<view class="ml-text" :class="[className || '', status ? `status-${status}` : '', {'is-underline': underline}]" @click="clickEvent" @tap="tapEvent">
|
|
3
|
+
<view v-if="prefixIcon && prefixIcon !== 'none'" class="ml-text-left-icon">
|
|
4
4
|
<ml-icon :className="prefixIcon"></ml-icon>
|
|
5
|
-
</
|
|
6
|
-
<
|
|
5
|
+
</view>
|
|
6
|
+
<view class="ml-text-content">
|
|
7
7
|
<slot>{{ content }}</slot>
|
|
8
|
-
</
|
|
9
|
-
<
|
|
8
|
+
</view>
|
|
9
|
+
<view v-if="suffixIcon && suffixIcon !== 'none'" class="ml-text-right-icon">
|
|
10
10
|
<ml-icon :className="suffixIcon"></ml-icon>
|
|
11
|
-
</
|
|
12
|
-
</
|
|
11
|
+
</view>
|
|
12
|
+
</view>
|
|
13
13
|
</template>
|
|
14
14
|
|
|
15
15
|
<script>
|
|
@@ -49,6 +49,7 @@ export default {
|
|
|
49
49
|
|
|
50
50
|
<style lang="scss">
|
|
51
51
|
.ml-text {
|
|
52
|
+
display: inline;
|
|
52
53
|
padding: 0 4rpx;
|
|
53
54
|
&.is-underline {
|
|
54
55
|
text-decoration: underline;
|
|
@@ -68,5 +69,10 @@ export default {
|
|
|
68
69
|
&.status-danger {
|
|
69
70
|
color: $uni-color-error;
|
|
70
71
|
}
|
|
72
|
+
.ml-text-left-icon,
|
|
73
|
+
.ml-text-right-icon,
|
|
74
|
+
.ml-text-content {
|
|
75
|
+
display: inline;
|
|
76
|
+
}
|
|
71
77
|
}
|
|
72
78
|
</style>
|