im-ui-mobile 0.1.40 → 0.1.41
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.
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
<view v-if="showStatus && status" class="im-avatar__status" :class="`im-avatar__status--${status}`" />
|
|
32
32
|
|
|
33
33
|
<!-- 加载状态 -->
|
|
34
|
-
<im-loading v-if="loading" :
|
|
34
|
+
<im-loading v-if="loading" :custom-style="loadingStyle" :size="32" text="" :mask="true" />
|
|
35
35
|
</view>
|
|
36
36
|
</template>
|
|
37
37
|
|
|
@@ -114,6 +114,24 @@ const textStyle = computed(() => {
|
|
|
114
114
|
return style
|
|
115
115
|
})
|
|
116
116
|
|
|
117
|
+
const loadingStyle = computed(() => {
|
|
118
|
+
let borderRadius = '8rpx'
|
|
119
|
+
|
|
120
|
+
switch (props.shape) {
|
|
121
|
+
case 'circle':
|
|
122
|
+
borderRadius = '50%'
|
|
123
|
+
break
|
|
124
|
+
case 'square':
|
|
125
|
+
borderRadius = '8rpx'
|
|
126
|
+
break
|
|
127
|
+
case 'rounded':
|
|
128
|
+
borderRadius = '20%'
|
|
129
|
+
break
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
return { borderRadius }
|
|
133
|
+
})
|
|
134
|
+
|
|
117
135
|
// 事件处理
|
|
118
136
|
const handleClick = () => {
|
|
119
137
|
if (props.clickable && !props.loading) {
|
|
@@ -70,7 +70,7 @@ const badgeText = computed(() => {
|
|
|
70
70
|
return String(props.badge)
|
|
71
71
|
})
|
|
72
72
|
|
|
73
|
-
const badgeSize = computed(() => {
|
|
73
|
+
const badgeSize = computed((): 'small' | 'medium' | 'large' => {
|
|
74
74
|
switch (props.size) {
|
|
75
75
|
case 'mini':
|
|
76
76
|
return 'small'
|
|
@@ -82,8 +82,7 @@ const badgeSize = computed(() => {
|
|
|
82
82
|
case 'xxlarge':
|
|
83
83
|
return 'large'
|
|
84
84
|
default:
|
|
85
|
-
return
|
|
86
|
-
|
|
85
|
+
return 'medium'
|
|
87
86
|
}
|
|
88
87
|
})
|
|
89
88
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<view class="loading" :style="loadingStyle">
|
|
2
|
+
<view class="loading" :style="[customStyle, loadingStyle]">
|
|
3
3
|
<view :style="icontStyle">
|
|
4
4
|
<im-icon name="loading" :color="iconColor" :size="size" spin :spin-speed="2" />
|
|
5
5
|
<text v-if="text" class="loading-text">{{ text }}</text>
|
|
@@ -16,14 +16,17 @@ interface Props {
|
|
|
16
16
|
size?: number;
|
|
17
17
|
iconColor?: string;
|
|
18
18
|
mask?: boolean;
|
|
19
|
-
text?: string
|
|
19
|
+
text?: string;
|
|
20
|
+
// 自定义样式
|
|
21
|
+
customStyle?: Record<string, string | number> | string
|
|
20
22
|
}
|
|
21
23
|
|
|
22
24
|
const props = withDefaults(defineProps<Props>(), {
|
|
23
25
|
size: 32,
|
|
24
26
|
iconColor: '',
|
|
25
27
|
mask: true,
|
|
26
|
-
text: 'loading...'
|
|
28
|
+
text: 'loading...',
|
|
29
|
+
customStyle: () => ({})
|
|
27
30
|
});
|
|
28
31
|
|
|
29
32
|
const icontStyle = computed(() => {
|
package/package.json
CHANGED