Browse Source

增加初始化状态显示

master
xsx 1 year ago
parent
commit
7bc22c0cc2
  1. 2
      im-uniapp/App.vue
  2. 16
      im-uniapp/components/chat-item/chat-item.vue
  3. 27
      im-uniapp/pages/chat/chat.vue

2
im-uniapp/App.vue

@ -9,6 +9,7 @@ import UNI_APP from '@/.env.js'
export default { export default {
data() { data() {
return { return {
isInit: false, //
isExit: false, // 退 isExit: false, // 退
audioTip: null, audioTip: null,
reconnecting: false // reconnecting: false //
@ -21,6 +22,7 @@ export default {
this.loadStore().then(() => { this.loadStore().then(() => {
// websocket // websocket
this.initWebSocket(); this.initWebSocket();
this.isInit = true;
}).catch((e) => { }).catch((e) => {
console.log(e); console.log(e);
this.exit(); this.exit();

16
im-uniapp/components/chat-item/chat-item.vue

@ -42,8 +42,15 @@ export default {
} }
}, },
methods: { methods: {
showChatBox() { showChatBox() {
//
if(!getApp().$vm.isInit || this.chatStore.isLoading()){
uni.showToast({
title: "正在初始化页面,请稍后...",
icon: 'none'
})
return;
}
uni.navigateTo({ uni.navigateTo({
url: "/pages/chat/chat-box?chatIdx=" + this.index url: "/pages/chat/chat-box?chatIdx=" + this.index
}) })
@ -155,7 +162,8 @@ export default {
font-size: $im-font-size-smaller; font-size: $im-font-size-smaller;
color: $im-text-color-lighter; color: $im-text-color-lighter;
padding-top: 8rpx; padding-top: 8rpx;
align-items: center;
.chat-at-text { .chat-at-text {
color: $im-color-danger; color: $im-color-danger;
} }
@ -170,10 +178,6 @@ export default {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
img {
width: 40rpx !important;
height: 40rpx !important;
}
} }
} }

27
im-uniapp/pages/chat/chat.vue

@ -1,14 +1,20 @@
<template> <template>
<view class="tab-page"> <view class="tab-page">
<nav-bar search @search="showSearch = !showSearch">消息</nav-bar> <nav-bar search @search="onSearch()">消息</nav-bar>
<view v-if="loading" class="chat-loading"> <view v-if="loading" class="chat-loading">
<loading :size="50" :mask="false"> <loading :size="50" :mask="false">
<view>消息接收中...</view> <view>消息接收中...</view>
</loading> </loading>
</view> </view>
<view v-if="initializing" class="chat-loading">
<loading :size="50" :mask="false">
<view>正在初始化...</view>
</loading>
</view>
<view class="nav-bar" v-if="showSearch"> <view class="nav-bar" v-if="showSearch">
<view class="nav-search"> <view class="nav-search">
<uni-search-bar radius="100" v-model="searchText" cancelButton="none" placeholder="搜索"></uni-search-bar> <uni-search-bar focus="true" radius="100" v-model="searchText" cancelButton="none"
placeholder="搜索"></uni-search-bar>
</view> </view>
</view> </view>
<view class="chat-tip" v-if="!loading && chatStore.chats.length == 0"> <view class="chat-tip" v-if="!loading && chatStore.chats.length == 0">
@ -77,6 +83,10 @@ export default {
} }
return !this.searchText || chat.showName.includes(this.searchText) return !this.searchText || chat.showName.includes(this.searchText)
}, },
onSearch() {
this.showSearch = !this.showSearch;
this.searchText = "";
},
refreshUnreadBadge() { refreshUnreadBadge() {
if (this.unreadCount > 0) { if (this.unreadCount > 0) {
uni.setTabBarBadge({ uni.setTabBarBadge({
@ -86,7 +96,7 @@ export default {
} else { } else {
uni.removeTabBarBadge({ uni.removeTabBarBadge({
index: 0, index: 0,
complete: () => { } complete: () => {}
}) })
} }
} }
@ -102,7 +112,10 @@ export default {
return count; return count;
}, },
loading() { loading() {
return this.chatStore.loadingGroupMsg || this.chatStore.loadingPrivateMsg return this.chatStore.isLoading();
},
initializing(){
return !getApp().$vm.isInit;
} }
}, },
watch: { watch: {
@ -116,7 +129,7 @@ export default {
} }
</script> </script>
<style scoped lang="scss"> <style lang="scss">
.tab-page { .tab-page {
position: relative; position: relative;
display: flex; display: flex;
@ -136,9 +149,7 @@ export default {
width: 100%; width: 100%;
height: 120rpx; height: 120rpx;
background: white; background: white;
position: fixed;
top: 0;
z-index: 999;
color: $im-text-color-lighter; color: $im-text-color-lighter;
.loading-box { .loading-box {

Loading…
Cancel
Save