mabao/pages/index/message.vue

<template>
	<view class="main">
		<!-- <loading :show="isshow"></loading> -->
		<view class="padding-lr">
			<view v-for="(item,index) in messageList" @click="gotoliaotian(item)" :key="index" class="padding-lr-sm padding-tb-sm bg-white margin-top-sm fade-in"
			 :style="'border-radius: 16rpx;box-shadow: 0 0 50rpx 0 rgba(0, 0, 0, 0.1);'+'opacity:'+opacity+';'+'transform: scale('+scale+');'">
				<view class="flex justify-start align-center">
					<u-icon name="order"></u-icon>
					<text class="text-lg margin-left-xs">{{
						item.type==1?'医生确认接单':item.type==2?'医生确认结束':item.type==3?'系统通知':item.type==4?'下单成功':item.type==5?'服务包下单成功':item.type==6?'服务包到期':item.type==7?'充值成功':item.type==8?'余额付款成功':item.type==9?'修改密码':item.type==10?'修改绑定电话':item.type==11?'修改支付密码':item.type==12?'社区端通知':item.type==13?'后台通知':item.type==99?'医生消息':'订单通知'
					}}</text>
					<view class="cu-tag badge text-xs margin-left-sm" v-if="item.type==99&&item.unread" style="position: static;">{{item.unread}}</view>
				</view>
				<view class="margin-top-sm text-cut">
					{{item.type==99?'最新消息：'+item.content:item.content}}
				</view>
				<view class="text-right" style="position: relative">
					<!-- <u-badge size="mini" :absolute="false" type="error" v-if="item.status==1" :is-dot="true"></u-badge>
					<text class="margin-left-xs" v-if="item.status==1">未读</text>
					<text class="margin-left-xs" v-if="item.status==2">已读</text> -->
				</view>
			</view>
		</view>
		<u-empty text="暂无数据" mode="order" :show="show" margin-top="250"></u-empty>
		<view class="cu-tabbar-height"></view>
		<view class="cu-tabbar-height"></view>
		<u-no-network></u-no-network>
	</view>
</template>

<script>
	import loading from '../../components/loading/loading'
	export default {
		components: {
			loading
		},
		onLoad(options) {

		},
		onShow() {
			this.pageindex = 1
			this.messageList = []
			this.getMessage()
			// if (getApp().globalData.imService == null) {
			// 	let user = uni.getStorageSync('user')
			// 	getApp().globalData.imService = new IMService();
			// 	let loginResult = getApp().globalData.imService.login({
			// 		flag: user.flag,
			// 		nickname: user.nickname,
			// 		avatar: user.avatar
			// 	});
			// 	if (loginResult) {
			// 		//连接IM
			// 		getApp().globalData.imService.connectIM();
			// 	}
			// }
			this.imService = getApp().globalData.imService;
			this.imService.onConversationsUpdate = (conversations) => {
				this.conversations = conversations;
				// this.setUnreadAmount();
			};
			var promise = this.imService.latestConversations();
			promise.then(res => {
				this.conversations = res.content;
				console.log("conversations load successfully")
				// this.setUnreadAmount();
				console.log(this.conversations)
				uni.hideLoading();
			}).catch(e => {
				console.log(e)
			});
		},
		mounted() {
			// this.isshow = true
			setTimeout(() => {
				this.handleScroll()
				// this.isshow = false
			}, 800)
		},
		data() {
			return {
				messageList: [],
				pageindex: 1,
				show: false,
				conversations: {
					unreadTotal: 0,
					conversations: []
				},
				imService: null,
				opacity: 0,
				scale: 0.8,
				isshow: false
			}
		},
		onReachBottom() {
			this.getMessage()
		},
		methods: {
			getNodes(item) {
				return (item.top + 200) < uni.getSystemInfoSync().windowHeight && item.bottom >= 0
			},
			handleScroll() {
				let query = uni.createSelectorQuery().selectAll('.fade-in').boundingClientRect((res) => {
					res.forEach(item => {
						if (this.getNodes(item)) {
							this.opacity = 1
							this.scale = 1
						}
					})
				}).exec()
			},
			getMessage: async function() {
				let res = await this.$request.post("/api/v1/user/userMessageList", {
					page: this.pageindex
				})
				console.log(res)
				if (res.status == 0) {
					if (this.pageindex > res.data.last_page) {
						uni.showToast({
							title: "没有更多了",
							icon: "none"
						})
					} else {
						this.messageList = this.messageList.concat(res.data.data)
						this.pageindex++
					}
				}
				if (this.messageList.length == 0) {
					this.show = true
				} else {
					this.show = false
				}
				this.conversations.conversations.reverse()
				this.conversations.conversations.forEach(item => {
					let obj = {
						type: 99,
						content: item.lastMessage.type == 'text' ? item.lastMessage.payload.text : item.lastMessage.type == 'audio' ?
							'[语音消息]' : '[图片消息]',
						unread: item.unread,
						docter_id: item.userId.split('_')[1],
					}
					this.messageList.unshift(obj)
				})
			},
			gotoliaotian(item) {
				// this.getNodes()
				console.log(item)
				if (item.type == 1 || item.type == 4) {
					uni.navigateTo({
						url: "../common_tools/my_consulting/consultingInfo?id=" + item.relation_id
					})
				} else if (item.type == 2 && item.product_type == 1 || item.type == 2 && item.product_type == 2) {
					uni.navigateTo({
						url: "../common_tools/my_consulting/opinionInfo?id=" + item.relation_id
					})
				} else if (item.type == 5 || item.type == 6) {
					uni.navigateTo({
						url: "../service_box/box_details"
					})
				} else if (item.type == 99) {
					this.$request.post("/api/v1/docter/docterDetail", {
						docter_id: item.docter_id
					}).then(res => {
						let obj = {
							id: res.id,
							name: res.name,
							avatar: res.avatar
						}
						uni.navigateTo({
							url: "../common_tools/my_consulting/conversation?doctor=" + JSON.stringify(obj) + "&doctorstatus=" + 3
						})
					})
				}
			}
		}
	};
</script>

<style scoped lang="scss">
	.main {}

	.fade-in {
		transition: 0.3s all ease-out;
		box-sizing: border-box;
	}
</style>