goufangtong3/components/gf-chat/gf-chat.vue

<template>
	<view class="gf-chat">
		<u-popup v-model="showchatlist" mode="center" border-radius="20" :closeable="true" @close="close">
			<view class="chat-list">
				<view class="worker-hrader">
					<text>在线咨询</text>
				</view>
				<scroll-view scroll-y="true" style="height: 60vh;" v-if="worker_list.length > 0">
					<view class="worker-item u-flex" v-for="(item,index) in worker_list" :key="index" @click="tochat(item)">
						<image :src="item.headimg" class="img1" mode=""></image>
						<text class="text1 u-flex-1">{{item.name}}</text>
						<u-icon name="chat-fill" color="#1677FF" size="40"></u-icon>
					</view>
				</scroll-view>
				<view v-else style="height: 60vh;">
					<u-empty text="暂无数据" mode="list"></u-empty>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		props: {
			type: {
				type: String,
				default: "1"
			}
		},
		data() {
			return {
				id: '',
				showchatlist: false,
				worker_list: []
			}
		},
		created() {

		},
		methods: {
			close(e) {
				this.$emit('close')
			},
			tochat(item) {
				uni.showLoading({
					mask: true,
					title: "请稍后"
				})
				this.$u.post('/api/Member/bind_worker', {
					worker_id: item.id
				}).then(res => {
					if (res.code == 1) {
						if (this.type == 1) {
							this.showchatlist = false
						}
						this.$emit('over')
						this.$u.post('/api/Member/member_info').then(res => {
							if (this.type == 1) {
								uni.navigateTo({
									url: "/pages/index/chat?hx_username=" + res.data.worker_hx_username + "&worker_id=" + item.id
								})
							} else {
								uni.redirectTo({
									url: "/pages/index/chat?hx_username=" + res.data.worker_hx_username + "&worker_id=" + item.id
								})
							}
						})
					} else {
						this.$u.toast(res.msg)
					}
				})
			},
			getdata(type) {
				if (type == 2) {
					// 福利
					this.$u.post('/api/welfare/welfare_detail', {
						id: this.id
					}).then(res => {
						this.worker_list = res.data.worker_info
						this.showchatlist = true
					})
				} else {
					// 楼盘
					this.$u.post('/api/Property/property_detail', {
						id: this.id
					}).then(res => {
						this.worker_list = res.data.worker_info
						this.showchatlist = true
					})
				}

			},
			open(id, type) {
				this.id = id
				uni.showLoading({
					mask: true,
					title: "请稍后"
				})
				this.getdata(type)
			}
		}
	}
</script>

<style lang="scss">
	.gf-chat {
		.chat-list {
			width: 650rpx;
			background: #FFFFFF;
			padding: 1rpx 0;

			.worker-hrader {
				line-height: 88rpx;
				border-bottom: 2rpx solid #E5E5E5;
				padding: 0 24rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
			}

			.worker-item {
				margin: 24rpx auto;
				width: 602rpx;
				height: 140rpx;
				background: #F2F2F2;
				border-radius: 20rpx;
				padding: 0 20rpx;

				.img1 {
					width: 100rpx;
					height: 100rpx;
					border-radius: 100rpx;
				}

				.text1 {
					font-size: 28rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					margin: 0 20rpx;
				}
			}
		}
	}
</style>