<template>
	<view class="main">
		<view class="one">
			<swiper class="swiper" circular :indicator-dots="true" indicator-color="#FFFFFF"
				indicator-active-color="#007AFF" :autoplay="true" :interval="3000" :duration="1000">
				<swiper-item class="list" v-for="(item,index) in advertList" :key="index">
					<image class="image" :src="item.image&&item.image.length>0?item.image[0].url:''" mode=""></image>
				</swiper-item>
			</swiper>
		</view>
		<view class="two">
			<uni-collapse>
				<uni-collapse-item title="群组" :thumb="config.group_url[0].url">
					<view class="content">
						<view class="list" v-for="(item, index) in groupList" :key="index" @tap="toInfo(item)">
							<uni-list-chat title="uni-app"
								avatar="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png"
								note="您收到一条新的消息" time="2020-02-02 20:20" badge-positon="left"
								badge-text="99"></uni-list-chat>
						</view>
						<view class="is_bottom" v-if="is_bottom">
							<text>{{config.bottom_title||'到底了！'}}</text>
						</view>
					</view>
				</uni-collapse-item>
				<uni-collapse-item title="好友" :thumb="config.friend_url[0].url">
					<view class="content">
						<view class="list" v-for="(item, index) in friendList" :key="index" @tap="toInfo(item)">
							<uni-list-chat title="uni-app"
								avatar="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png"
								note="您收到一条新的消息" time="2020-02-02 20:20" badge-positon="left"
								badge-text="99"></uni-list-chat>
						</view>
						<view class="is_bottom" v-if="is_bottom">
							<text>{{config.bottom_title||'到底了！'}}</text>
						</view>
					</view>
				</uni-collapse-item>
			</uni-collapse>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {},
				config: {},
				// 广告
				advertList: [],
				// 群组
				groupList: [{
					id: '1'
				}],
				// 好友
				friendList: [{
					id: '1'
				}]
			}
		},
		onShow: async function() {
			const that = this;
			await that.searchToken();
			await that.searchConfig();
			await that.search();
		},
		onPullDownRefresh: async function() {
			const that = this;
			await that.search();
			uni.stopPullDownRefresh();
		},
		methods: {
			// 用户信息
			searchToken() {
				const that = this;
				try {
					const res = uni.getStorageSync('token');
					if (res) that.$set(that, `user`, res);
				} catch (e) {
					uni.showToast({
						title: err.errmsg,
						icon: 'error',
						duration: 2000
					});
				}
			},
			searchConfig() {
				const that = this;
				try {
					const res = uni.getStorageSync('config');
					if (res) that.$set(that, `config`, res);
				} catch (e) {
					uni.showToast({
						title: err.errmsg,
						icon: 'error',
						duration: 2000
					});
				}
			},
			// 查询
			async search() {
				const that = this;
				// 广告
				const res = await that.$api(`/adv`, 'GET', {
					is_use: '0'
				})
				if (res.errcode == '0') {
					that.$set(that, `advertList`, res.data)
				} else {
					uni.showToast({
						title: res.errmsg,
					});
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		.one {
			padding: 0 0 2vw 0;

			.swiper {
				height: 70vw;

				.list {
					.image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}
</style>