<template>
	<profile-relation-list
		ref="list"
		:user-no="userNo"
		list-type="fans"
		:title="copy.fansTitle"
		:empty-text="copy.fansEmpty"
		:default-bio="copy.defaultBio"
		:follow-label="copy.follow"
		:unfollow-label="copy.followed"
		:loading-text="copy.loading"
		:no-more-text="copy.noMore"
		:load-more-hint="copy.loadMore"
		:load-failed-text="copy.loadFailed"
		:action-failed-text="copy.actionFailed"
		:shop-tag="copy.shopTag"
	/>
</template>

<script>
import ProfileRelationList from '@/components/profile/relation-list.vue'

export default {
	components: { ProfileRelationList },
	data() {
		return {
			userNo: ''
		}
	},
	computed: {
		copy() {
			const t = this.$t.bind(this)
			return {
				fansTitle: t('relation.fansTitle'),
				fansEmpty: t('relation.fansEmpty'),
				defaultBio: t('findUser.defaultBio'),
				follow: t('mine.follow'),
				followed: t('mine.followed'),
				loading: t('relation.loading'),
				noMore: t('relation.noMore'),
				loadMore: t('relation.loadMore'),
				loadFailed: t('relation.loadFailed'),
				actionFailed: t('relation.actionFailed'),
				shopTag: t('relation.shopTag')
			}
		}
	},
	onLoad(query) {
		this.userNo = (query && query.id) || ''
	},
	onPullDownRefresh() {
		const list = this.$refs.list
		if (list && list.reload) {
			list.reload().finally(() => uni.stopPullDownRefresh())
		} else {
			uni.stopPullDownRefresh()
		}
	}
}
</script>
