<template>
	<view class="nav-card">
		<u-grid :col="4" customStyle="height: 334rpx;align-content: normal">
			<u-grid-item v-for="(item, index) in navItems" :key="item.icon" @click="handleItemClick(index)">
				<u-icon :name="item.icon" :size="46"></u-icon>
				<view class="grid-text">{{ item.text }}</view>
			</u-grid-item>
		</u-grid>
		<u-modal :show="showM" showCancelButton closeOnClickOverlay="false" confirmText="是" cancelText="否"
			@confirm="confirm" @cancel="cancel">
			<view>
				<view>{{mobile}}</view>
				<text>是否拨打客服电话</text>
			</view>
		</u-modal>
		<view>
			<u-overlay :show="!isLoad">
				<login @success="reOnLoad()" @fail="failToLoad()"></login>
			</u-overlay>
		</view>
	</view>
</template>

<script>
	import login from 'pages/my/login/login'
	export default {
		components: {
			login
		},
		data() {
			return {
				showM: false,
				mobile: '',
				isLoad: true,
				navItems: [{
						icon: "/static/navbar/sy_icon_zrxx.png",
						text: "转让信息",
						url: "/pages/index/NavBarPages/zrxx/zrxx"
					},
					{
						icon: "/static/navbar/sy_icon_zdxx.png",
						text: "找店信息",
						url: "/pages/index/NavBarPages/zdxx/zdxx"
					},
					{
						icon: "/static/navbar/sy_icon_czxx.png",
						text: "出租信息",
						url: "/pages/index/NavBarPages/czxx/czxx"
					},
					{
						icon: "/static/navbar/sy_icon_xmzs.png",
						text: "项目招商",
						url: "/pages/index/NavBarPages/xmzs/xmzs"
					},
					{
						icon: "/static/navbar/sy_icon_cjal.png",
						text: "成交案例",
						url: "/pages/index/NavBarPages/cjal/cjal"
					},
					{
						icon: "/static/navbar/sy_icon_spdt.png",
						text: "速配地图",
						url: '/pages/index/map/map'
					},
					{
						icon: "/static/navbar/sy_icon_zmhb.png",
						text: "招募合伙",
						url: '/pages/Partnerships/Partnerships'
					},
					{
						icon: "/static/navbar/sy_icon_lxwm.png",
						text: "联系我们"
					}
					// 可以继续添加更多的项目
				]
			};
		},
		created() {
			this.getCsTel()
		},
		methods: {
			reOnLoad() {
				if (!uni.getStorageSync('loginToken') || uni.getStorageSync('loginToken').length === 0) {
					this.$toast.warn('登录失败请重试')
					this.isLoad = false
					return
				}
				this.isLoad = true
			},
			failToLoad() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},
			confirm() {
				this.showM = false
				let phone = this.mobile
				phone = phone.toString()
				uni.makePhoneCall({
					phoneNumber: phone,
					success: function() {
						console.log('拨打电话成功');
					},
					fail() {
						console.log('打电话失败了');
					}
				})
			},
			cancel() {
				this.showM = false
			},
			getCsTel() {
				this.$api.getCsTel().then(res => {
					console.log(res.data);
					if (res.data.data) {
						this.mobile = res.data.data.kf_phone
					}
				}).finally(_ => {})
			},
			handleItemClick(index) {
				// 跳转页面
				if (index >= 0 && index <= 6) {
					if (index == 4 || index == 6) {
						if (!uni.getStorageSync('loginToken') || uni.getStorageSync('loginToken').length === 0) {
							this.isLoad = false
							return
						}
						this.isLoad = true
					}
					uni.navigateTo({
						url: this.navItems[index].url
					})
				} else if (index == 7) {
					this.showM = true
				}
			}
		}
	};
</script>



<style lang="scss">
	.nav-card {
		margin: 15px 0px;
		padding: 10px 0;
		background-color: $uni-bg-color;

		border-radius: $uni-border-radius-lg;
		box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.10);

		.grid-text {
			font-size: 12px;
		}
	}
</style>