<template>
	<view>
		<view class="home-list-item d-flex a-center j-sb animated fadeIn fast" hover-class="home-list-hover"
			@tap="clickevent">
			<view class="d-flex a-center">
				<view v-if="item.icon" class="icon iconfont" :class="['icon-'+item.icon]"></view> {{item.name}}
			</view>
			<view class="d-flex a-center j-center rightText">
				{{item.text}}
				<view class="icon iconfont" :class="{'icon-youjiantou':!item.data}">{{item.data || ''}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	const PACKAGE_INFO_KEY = '__package_info__'
	export default {
		
		data() {
			return {}
		},
		props: {
			item: Object,
			index: Number
		},
		methods: {
			clickevent() {
				switch (this.item.clicktype) {
					case "navigateTo":
						if (this.item.url) {
							let option = {
								url: this.item.url
							};
							if (this.item.auth) {
								return this.navigate(option, 'navigateTo', true);
							}
							uni.navigateTo(option);
						}
						break;
					case "switchTab":
						if (this.item.url) {
							let option = {
								url: this.item.url
							};
							if (this.item.auth) {
								return this.navigate(option, 'switchTab', true);
							}
							uni.switchTab(option);
						}
						break;
					case "clear":
						uni.showModal({
							title: '提示',
							content: '是否要清除缓存？',
							confirmText: '立刻清除',
							success: res => {
								if (res.confirm) {
									uni.showToast({
										title: '清除缓存成功！',
										icon: "none"
									});
								}
							},
						});
						break;
					case "bind":
						if (this.User.userbind[this.item.provider]) return;
						this.bindother();
						break;
					case "nothing":
						uni.showToast({
							title: '更新中...',
							icon: 'none'
						});
						break;
					
				}
			},
			// 绑定第三方登录
			bindother() {
				uni.login({
					provider: this.item.provider,
					// #ifdef MP-ALIPAY
					scopes: 'auth_user', //支付宝小程序需设置授权类型
					// #endif
					success: (res) => {
						uni.getUserInfo({
							provider: this.item.provider,
							success: (infoRes) => {
								let options = Object.assign(infoRes, res);
								this.bindEvent(this.User.__formatOtherLogin(this.item.provider,
									options));
							}
						});
					},
					fail: (err) => {
						uni.showToast({
							title: '绑定失败',
							icon: "none"
						});
						console.log('login fail:', err);
					}
				});
			},
			async bindEvent(data) {
				uni.showLoading({
					title: '绑定中...',
					mask: false
				});
				let [err, res] = await this.$http.post("/user/bindother", data, {
					token: true,
					checkToken: true
				})
				if (!this.$http.errorCheck(err, res)) return uni.hideLoading();
				// 绑定成功
				uni.hideLoading();
				uni.showToast({
					title: '绑定成功！'
				});
				// 修改状态，缓存
				this.User.userbind[this.item.provider] = {
					nickname: data.nickName
				}
				uni.setStorageSync("userbind", this.User.userbind);
				this.$emit('updateuserbind');
			},

			
		}
	}
</script>

<style scoped>
	.home-list-item {
		padding: 20upx;
		border-top: 1upx solid #F4F4F4;
		border-bottom: 1upx solid #F4F4F4;
	}

	.home-list-item>view:first-child {
		color: #333333;
	}

	.home-list-item>view:first-child>view {
		margin-right: 10upx;
		font-size: 32upx;
	}

	.home-list-item>view:last-child {
		color: #CCCCCC;
	}

	.home-list-hover {
		background: #f4f4f4;
	}

	.rightText {
		font-size: 30upx;
	}

	.icon {
		margin-left: 10upx;
		font-size: 24upx;
	}
</style>
