<template>
	<div class="CustomerList">
		<div class="item acea-row row-between-wrapper" v-for="item in list" :key="item.id" @click="goPage(item)">
			<div class="pictrue"><img :src="item.avatar" /></div>
			<div class="text line1">{{ item.nickname }}</div>
		</div>
	</div>
</template>
<script>
import { serviceList } from '@/api/user';

export default {
	name: 'CustomerList',
	data() {
		return {
			list: [],
			productId: 0,
			orderId: ''
		};
	},
	methods: {
		getList() {
			serviceList().then(res => {
				this.list = res.data;
			});
		},
		goPage(item) {
			//console.log('11111')
			uni.navigateTo({
				url:'/pages/customer_list/chat?uid='+item.uid+'&productId='+ this.productId+'&orderId='+this.orderId
			});
		}
	},
	onLoad(option) {
		this.getList();
		if (option.productId) {
			this.productId = option.productId;
		}
		if (option.orderId) {
			this.orderId = option.orderId;
		}
	}
};
</script>
<style scoped>
.CustomerList {
	margin-top: 20rpx;
}
.CustomerList .item {
	height: 138rpx;
	border-bottom: 1px solid #eee;
	padding: 0 24rpx;
	background-color: #fff;
	display: flex;
	align-items: center;
}
.CustomerList .item .pictrue {
	width: 90rpx;
	height: 90rpx;
	border-radius: 50%;
	border: 3rpx solid #fff;
	box-shadow: 0 0 1rpx 5rpx #f3f3f3;
}
.CustomerList .item .pictrue img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
}
.CustomerList .item .text {
	margin-left: 20rpx;
	width: 582rpx;
	font-size: 32rpx;
	color: #000;
}
</style>