im-ui-mobile 0.0.82 → 0.0.84
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/LICENSE +21 -0
- package/components/{im-head-image/im-head-image.vue → im-avatar/im-avatar.vue} +2 -2
- package/components/im-button/im-button.vue +603 -38
- package/components/im-cell/im-cell.vue +462 -0
- package/components/{im-bar-group/im-bar-group.vue → im-cell-group/im-cell-group.vue} +4 -4
- package/components/im-cell-switch/im-cell-switch.vue +223 -0
- package/components/im-chat-item/im-chat-item.vue +4 -5
- package/components/{im-long-press-menu/im-long-press-menu.vue → im-context-menu/im-context-menu.vue} +2 -2
- package/components/im-file-upload/im-file-upload.vue +9 -2
- package/components/im-friend-item/im-friend-item.vue +2 -2
- package/components/im-group-item/im-group-item.vue +2 -2
- package/components/im-group-member-selector/im-group-member-selector.vue +3 -3
- package/components/im-group-rtc-join/im-group-rtc-join.vue +3 -3
- package/components/im-image-upload/im-image-upload.vue +3 -2
- package/components/{im-chat-at-box/im-chat-at-box.vue → im-mention-picker/im-mention-picker.vue} +5 -5
- package/components/{im-chat-message-item/im-chat-message-item.vue → im-message-item/im-message-item.vue} +19 -21
- package/components/{im-chat-group-readed/im-chat-group-readed.vue → im-read-receipt/im-read-receipt.vue} +5 -5
- package/components/im-virtual-list/im-virtual-list.vue +444 -0
- package/components/{im-chat-record/im-chat-record.vue → im-voice-input/im-voice-input.vue} +11 -11
- package/index.js +7 -13
- package/package.json +4 -4
- package/types/components/{head-image.d.ts → avatar.d.ts} +4 -4
- package/types/components/button.d.ts +73 -3
- package/types/components/{bar-group.d.ts → cell-group.d.ts} +4 -4
- package/types/components/cell-switch.d.ts +31 -0
- package/types/components/cell.d.ts +46 -0
- package/types/components/context-menu.d.ts +23 -0
- package/types/components/{chat-at-box.d.ts → mention-picker.d.ts} +6 -6
- package/types/components/{chat-message-item.d.ts → message-item.d.ts} +6 -6
- package/types/components/{chat-group-readed.d.ts → read-receipt.d.ts} +6 -6
- package/types/components/virtual-list.d.ts +148 -0
- package/types/components/{chat-record.d.ts → voice-input.d.ts} +4 -4
- package/types/components.d.ts +9 -10
- package/types/index.d.ts +4 -2
- package/utils/config.js +17 -0
- package/utils/datetime.js +1 -1
- package/utils/emoji.js +9 -4
- package/components/im-arrow-bar/im-arrow-bar.vue +0 -59
- package/components/im-sample/im-sample.vue +0 -192
- package/components/im-switch-bar/im-switch-bar.vue +0 -62
- package/types/components/long-press-menu.d.ts +0 -23
- package/types/components/switch-bar.d.ts +0 -19
|
@@ -1,192 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<view class="im-sample" :class="[`im-sample--${type}`]" @click="handleClick">
|
|
3
|
-
<view class="im-sample__avatar">
|
|
4
|
-
<view class="avatar-fallback">
|
|
5
|
-
<u-avatar v-if="avatar" :src="avatar" />
|
|
6
|
-
<text v-else class="avatar-text">{{ displayName }}</text>
|
|
7
|
-
</view>
|
|
8
|
-
</view>
|
|
9
|
-
<view class="im-sample__content">
|
|
10
|
-
<view class="im-sample__header">
|
|
11
|
-
<text class="im-sample__name">{{ name }}</text>
|
|
12
|
-
<text class="im-sample__time">{{ time }}</text>
|
|
13
|
-
</view>
|
|
14
|
-
<view class="im-sample__message">
|
|
15
|
-
<text class="im-sample__text">{{ lastMessage }}</text>
|
|
16
|
-
<u-badge v-if="unreadCount > 0" :max="99" :value="unreadCount" />
|
|
17
|
-
</view>
|
|
18
|
-
</view>
|
|
19
|
-
</view>
|
|
20
|
-
</template>
|
|
21
|
-
|
|
22
|
-
<script setup lang="ts">
|
|
23
|
-
import { computed, withDefaults } from 'vue'
|
|
24
|
-
|
|
25
|
-
// 定义 Props 接口
|
|
26
|
-
interface Props {
|
|
27
|
-
type?: 'default' | 'group'
|
|
28
|
-
avatar?: string
|
|
29
|
-
name: string
|
|
30
|
-
time: string
|
|
31
|
-
lastMessage: string
|
|
32
|
-
unreadCount?: number
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
// 定义 Emits 接口
|
|
36
|
-
interface Emits {
|
|
37
|
-
(e: 'click', event: Event): void
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
// Props 和 Emits
|
|
41
|
-
const props = withDefaults(defineProps<Props>(), {
|
|
42
|
-
type: 'default',
|
|
43
|
-
avatar: '',
|
|
44
|
-
unreadCount: 0
|
|
45
|
-
})
|
|
46
|
-
|
|
47
|
-
const emit = defineEmits<Emits>()
|
|
48
|
-
|
|
49
|
-
// 计算属性
|
|
50
|
-
const displayName = computed(() => {
|
|
51
|
-
return props.name ? props.name.charAt(0) : ''
|
|
52
|
-
})
|
|
53
|
-
|
|
54
|
-
const displayUnreadCount = computed(() => {
|
|
55
|
-
return props.unreadCount > 99 ? '99+' : props.unreadCount.toString()
|
|
56
|
-
})
|
|
57
|
-
|
|
58
|
-
// 点击事件处理
|
|
59
|
-
const handleClick = (event: Event) => {
|
|
60
|
-
console.log('🔍 uni 对象检查:', {
|
|
61
|
-
hasUni: typeof uni !== 'undefined',
|
|
62
|
-
hasShowToast: typeof uni?.showToast === 'function',
|
|
63
|
-
hasShowModal: typeof uni?.showModal === 'function'
|
|
64
|
-
})
|
|
65
|
-
|
|
66
|
-
try {
|
|
67
|
-
// 使用 showModal 替代 showToast 进行测试
|
|
68
|
-
uni.showModal({
|
|
69
|
-
title: '提示',
|
|
70
|
-
content: `点击了 ${props.name}`,
|
|
71
|
-
showCancel: false,
|
|
72
|
-
confirmText: '知道了'
|
|
73
|
-
})
|
|
74
|
-
console.log('✅ uni.showModal 调用成功')
|
|
75
|
-
} catch (error) {
|
|
76
|
-
console.error('❌ uni API 调用失败:', error)
|
|
77
|
-
|
|
78
|
-
// 备用方案:在开发环境显示提示
|
|
79
|
-
if (typeof document !== 'undefined') {
|
|
80
|
-
alert(`点击了 ${props.name}`)
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
emit('click', event)
|
|
85
|
-
}
|
|
86
|
-
</script>
|
|
87
|
-
|
|
88
|
-
<style lang="scss" scoped>
|
|
89
|
-
.im-sample {
|
|
90
|
-
display: flex;
|
|
91
|
-
padding: 24rpx 32rpx;
|
|
92
|
-
transition: background-color 0.3s;
|
|
93
|
-
border-bottom: 2rpx solid #f5f7fa;
|
|
94
|
-
|
|
95
|
-
&:active {
|
|
96
|
-
background-color: #f5f7fa;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
&__avatar {
|
|
100
|
-
margin-right: 24rpx;
|
|
101
|
-
|
|
102
|
-
.avatar-fallback {
|
|
103
|
-
width: 80rpx;
|
|
104
|
-
height: 80rpx;
|
|
105
|
-
border-radius: 50%;
|
|
106
|
-
background: linear-gradient(135deg, #409EFF, #67C23A);
|
|
107
|
-
display: flex;
|
|
108
|
-
align-items: center;
|
|
109
|
-
justify-content: center;
|
|
110
|
-
overflow: hidden;
|
|
111
|
-
|
|
112
|
-
.avatar-image {
|
|
113
|
-
width: 100%;
|
|
114
|
-
height: 100%;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
.avatar-text {
|
|
118
|
-
color: white;
|
|
119
|
-
font-size: 32rpx;
|
|
120
|
-
font-weight: bold;
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
&__content {
|
|
126
|
-
flex: 1;
|
|
127
|
-
min-width: 0;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
&__header {
|
|
131
|
-
display: flex;
|
|
132
|
-
justify-content: space-between;
|
|
133
|
-
align-items: center;
|
|
134
|
-
margin-bottom: 8rpx;
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
&__name {
|
|
138
|
-
font-size: 32rpx;
|
|
139
|
-
font-weight: 500;
|
|
140
|
-
color: #303133;
|
|
141
|
-
overflow: hidden;
|
|
142
|
-
text-overflow: ellipsis;
|
|
143
|
-
white-space: nowrap;
|
|
144
|
-
flex: 1;
|
|
145
|
-
|
|
146
|
-
/* 群聊样式 */
|
|
147
|
-
.im-sample--group &::before {
|
|
148
|
-
content: "👥 ";
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
&__time {
|
|
153
|
-
font-size: 24rpx;
|
|
154
|
-
color: #909399;
|
|
155
|
-
flex-shrink: 0;
|
|
156
|
-
margin-left: 16rpx;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
&__message {
|
|
160
|
-
display: flex;
|
|
161
|
-
justify-content: space-between;
|
|
162
|
-
align-items: center;
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
&__text {
|
|
166
|
-
font-size: 28rpx;
|
|
167
|
-
color: #606266;
|
|
168
|
-
overflow: hidden;
|
|
169
|
-
text-overflow: ellipsis;
|
|
170
|
-
white-space: nowrap;
|
|
171
|
-
flex: 1;
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
.badge-fallback {
|
|
175
|
-
background-color: #FA3534;
|
|
176
|
-
border-radius: 40rpx;
|
|
177
|
-
min-width: 36rpx;
|
|
178
|
-
height: 36rpx;
|
|
179
|
-
display: flex;
|
|
180
|
-
align-items: center;
|
|
181
|
-
justify-content: center;
|
|
182
|
-
margin-left: 16rpx;
|
|
183
|
-
|
|
184
|
-
.badge-text {
|
|
185
|
-
color: white;
|
|
186
|
-
font-size: 20rpx;
|
|
187
|
-
font-weight: bold;
|
|
188
|
-
padding: 0 8rpx;
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
</style>
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<view class="switch-bar">
|
|
3
|
-
<text class="title">{{ title }}</text>
|
|
4
|
-
<switch class="switch" :checked="checked" color="#18bc37" @change="onChange"></switch>
|
|
5
|
-
</view>
|
|
6
|
-
</template>
|
|
7
|
-
|
|
8
|
-
<script setup lang="ts">
|
|
9
|
-
import { ref, watch } from 'vue'
|
|
10
|
-
|
|
11
|
-
interface Props {
|
|
12
|
-
title: string;
|
|
13
|
-
checked?: boolean;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
interface Emits {
|
|
17
|
-
(e: 'change', value: boolean): void;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
const props = withDefaults(defineProps<Props>(), {
|
|
21
|
-
checked: false
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const emit = defineEmits<Emits>();
|
|
25
|
-
|
|
26
|
-
const value = ref(props.checked);
|
|
27
|
-
|
|
28
|
-
watch(() => props.checked, (newVal) => {
|
|
29
|
-
value.value = newVal;
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
const onChange = (e: any) => {
|
|
33
|
-
value.value = true;
|
|
34
|
-
setTimeout(() => {
|
|
35
|
-
value.value = false;
|
|
36
|
-
}, 100);
|
|
37
|
-
|
|
38
|
-
emit('change', e);
|
|
39
|
-
};
|
|
40
|
-
</script>F
|
|
41
|
-
|
|
42
|
-
<style lang="scss" scoped>
|
|
43
|
-
.switch-bar {
|
|
44
|
-
width: 100%;
|
|
45
|
-
height: 100rpx;
|
|
46
|
-
font-size: 34rpx;
|
|
47
|
-
color: black;
|
|
48
|
-
margin-top: 5rpx;
|
|
49
|
-
background-color: white;
|
|
50
|
-
line-height: 100rpx;
|
|
51
|
-
display: flex;
|
|
52
|
-
|
|
53
|
-
.title {
|
|
54
|
-
flex: 1;
|
|
55
|
-
margin-left: 40rpx;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
.switch {
|
|
59
|
-
margin-right: 40rpx;
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
</style>
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { AllowedComponentProps, VNodeProps } from '../common'
|
|
2
|
-
|
|
3
|
-
declare interface LongPressMenuProps {
|
|
4
|
-
items?: any[]
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
declare interface LongPressMenuEmits {
|
|
8
|
-
(e: 'select', item: any): void
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
declare interface LongPressMenuSlots {
|
|
12
|
-
default?: () => any
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
declare interface _LongPressMenu {
|
|
16
|
-
new(): {
|
|
17
|
-
$props: AllowedComponentProps & VNodeProps & LongPressMenuProps
|
|
18
|
-
$emit: LongPressMenuEmits
|
|
19
|
-
$slots: LongPressMenuSlots
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export declare const LongPressMenu: _LongPressMenu
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { AllowedComponentProps, VNodeProps } from '../common'
|
|
2
|
-
|
|
3
|
-
declare interface SwitchBarProps {
|
|
4
|
-
title: string
|
|
5
|
-
checked?: boolean
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
declare interface SwitchBarEmits {
|
|
9
|
-
(e: 'change', value: boolean): void
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
declare interface _SwitchBar {
|
|
13
|
-
new(): {
|
|
14
|
-
$props: AllowedComponentProps & VNodeProps & SwitchBarProps
|
|
15
|
-
$emit: SwitchBarEmits
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
export declare const SwitchBar: _SwitchBar
|