<template>
	<view class="workbench_page">
		<uni-nav-bar 
			title="发现"
			statusBar
			fixed
			background-color="transparent"></uni-nav-bar>
		<uni-list>
			<uni-list-item title="朋友圈" 
				thumb="/static/images/find/01.png" 
				:thumbSize="thumbSize" 
				showArrow
				to="/pages/find/friend-circle/friend-circle">
				<view slot="footer" v-if="storeCircleTopUnreadItems.length>0">
					<view class="avatargroup">
						<MyAvatar :src="item.user.avatar" shape="circle" size="32" v-for="(item,index) in storeCircleTopUnreadItems" :key="index"></MyAvatar>
						<u-avatar :text="'+'+storeCircleUnreadCount" size="32" bg-color="#353432" shape="circle"></u-avatar>
					</view>
				</view>
			</uni-list-item>
		</uni-list>
		<u-gap :height="10"></u-gap>
		<uni-list>
			<uni-list-item title="扫一扫" thumb="/static/images/find/03.png" :thumbSize="thumbSize" @click="scan" clickable  showArrow></uni-list-item>
			<uni-list-item v-if="1==2" title="摇一摇" thumb="/static/images/find/05.png" :thumbSize="thumbSize" to="/pages/find/friend-circle/friend-circle" showArrow></uni-list-item>
			<uni-list-item v-if="1==2" title="看一看" thumb="/static/images/find/06.png" :thumbSize="thumbSize" to="/pages/find/friend-circle/friend-circle" showArrow></uni-list-item>
			<uni-list-item v-if="1==2" title="听一听" thumb="/static/images/find/06.png" :thumbSize="thumbSize" to="/pages/find/friend-circle/friend-circle" showArrow></uni-list-item>
			<uni-list-item v-if="config.near_user_open == '1'" title="附近" thumb="/static/images/find/08.png" :thumbSize="thumbSize" to="/pages/find/near/near" showArrow></uni-list-item>
			<uni-list-item v-if="1===2" title="购物" thumb="/static/images/find/09.png" :thumbSize="thumbSize" :to="'/pages/common/webview?url='+encodeURI('http://pinduoduo.com')" showArrow></uni-list-item>
		</uni-list>
	</view>
</template>

<script>
	import { mapGetters } from "vuex";
	import MyAvatar from "@/components/MyAvatar/index.vue";
	import util from "@/util";
	export default {
		components:{MyAvatar},
		data() {
			return {
				thumbSize:"base"
			};
		},
		computed:{
			...mapGetters(["config",'storeCircleUnreadCount','storeCircleTopUnreadItems']),
		},
		onShow: function() {
			let unreadCount= 1;
			this.$store.dispatch('circle/getFriendCircleInfo');
		},
		methods: {
			scan:util.scan
		}
	};
</script>

<style lang="scss" scoped>
	.workbench_page {
		background-color: #ececec !important;
	}
	.avatargroup{
		display: flex;
		.u-avatar {
		    position: relative;
		    margin-left: -16px;
		    //border: 1px solid #333;
		}
	}
</style>
