web-app/pages/index/index.vue

<template>
	<view class="index-index">
		<custom-nav ref="ltm" :title="title" transparent="transparent" noback="noback"></custom-nav>
		<view class="content">
			<view class="area manage">
				<navigator v-for="(item, index) in namageList" :url="item.url" :key="index">
					<image :src="item.image"></image>
					<text>{{ item.name }}</text>
				</navigator>
			</view>
			<view class="area swiper">
				<swiper :autoplay="true" :circular="true" :interval="3456" :duration="345">
					<swiper-item v-for="(item, index) in swiper" :key="index" @tap="toSwiperDetail(index)">
						<image :src="item.imgurl"></image>
					</swiper-item>
				</swiper>
			</view>
			<view class="area news" v-if="news.length">
				<image src="../../static/index/index/news.png"></image>
				<view class="hot">热点</view>
				<swiper :vertical="true" :autoplay="true" :circular="true" :interval="3456" :duration="345">
					<swiper-item class="ellipsis" v-for="(item, index) in news" :key="index">
						{{ item.contents}}
					</swiper-item>
				</swiper>
			</view>
			<view class="area kingkong">
				<navigator v-for="(item, index) in kingkongList" :url="item.url" :key="index">
					<image :src="item.image"></image>
					<text>{{ item.name }}</text>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	import { deepClone } from '@/common/util/index.js'
	import { _API_InviteCode } from '@/apis/team.js'
	import { _API_IndexIndex, _API_AppUpdata, _API_DownLoadNewVersion } from '@/apis/app.js'
	import { _API_GetUserStatus, _API_GetUserInfo, _API_ConfireLevel } from '@/apis/user.js'
	export default {
		data() {
			return {
				title: '首页',
				namageList: [
					{
						name: '订单管理',
						url: '../../pages/manage-order/manage-order',
						image: '../../static/index/index/manage-order.png'
					},
					{
						name: '人员管理',
						url: '../../pages/manage-people/manage-people',
						image: '../../static/index/index/manage-poeple.png'
					},
					{
						name: '财富管理',
						url: '../../pages/manage-money/manage-money',
						image: '../../static/index/index/manage-money.png'
					}
				],
				news: {},
				swiper: [],
				article: {},
				invite_code: '',
			}
		},
		computed: {
			kingkongList() {
				const data = deepClone(this.$store.state.userinfo)
				delete data.avatar
				return [
					{
						name: '订货下单',
						url: '../../pages/place-order/place-order',
						image: '../../static/index/index/place-order.png'
					},
					{
						name: '我的订单',
						url: '../../pages/my-order/my-order',
						image: '../../static/index/index/my-order.png'
					},
					{
						name: '下级订单',
						url: '../../pages/down-order/down-order',
						image: '../../static/index/index/down-order.png'
					},
					{
						name: '我的库存',
						url: '../../pages/my-storage/my-storage',
						image: '../../static/index/index/my-stock.png'
					},
					{
						name: '邀请代理',
						url: `../../pages/invite-proxy/invite-proxy?data=${JSON.stringify(data)}`,
						image: '../../static/index/index/invite-proxy.png'
					},
					{
						name: '注册审核',
						url: '../../pages/register-examine/register-examine',
						image: '../../static/index/index/register-examine.png'
					},
					{
						name: '我的邀请',
						url: '../../pages/my-invite/my-invite',
						image: '../../static/index/index/my-invite.png'
					},
					{
						name: '团队管理',
						url: '../../pages/team-manage/team-manage',
						image: '../../static/index/index/team-manage.png'
					}
				]
			}
		},
		onLoad() {
			uni.$on('noopening', () => uni.showToast({ title: '暂未开放', icon: 'none' }))
			// if (!this.$store.state.app.token) { // 
			// 	if (location.search.length > 24 && decodeURIComponent) {
			// 		uni.reLaunch({ url: `../invite-proxy/invite-proxy?data=${JSON.stringify({
			// 			nickname: decodeURIComponent(location.search.replace(/^\?/, '').split('&')[0].split('=')[1]),
			// 			mobile: decodeURIComponent(location.search.replace(/^\?/, '').split('&')[1].split('=')[1]),
			// 			invite_code: decodeURIComponent(location.search.replace(/^\?/, '').split('&')[2].split('=')[1]),
			// 		})}` })
			// 		return
			// 	}
			// 	uni.reLaunch({ url: '../login-psw/login-psw' }) // 跳转到登陆
			// 	return
			// }
		},
		mounted() { // 页面创建后判断用户状态
			uni.$on('RELAUNCH', () => uni.reLaunch({ url: '../login-psw/login-psw' })) // 监听 token 失效事件，跳转到登录页
			if (this.$store.state.app.token) { // 当用户处于登陆状态
				uni.showLoading({ mask: true })
				_API_GetUserStatus().then(res => { // 获取用户状态
					this.$store.commit('userinfo/UPDATA_USERINFO', res.data) // 获取用户状态后保存在 vuex 中
					if (res.data.status == 1) { // 用户状态为 1 表示正常
						if (res.data.cert_status == 0) { // 用户认证状态为 0 表示 已注册 未填写信息
							this.indexRequest() // 请求首页数据
							uni.reLaunch({ url: '../auth-identity/auth-identity' })
						} else if (res.data.cert_status > 0 && res.data.cert_status < 6) { // 用户为认证状态
							uni.reLaunch({ url: '../auth-progress/auth-progress' }) // 跳转到用户认证进度页面
						} else if (res.data.cert_status == 6) { // 用户认证完成
							this.indexRequest() // 请求首页数据
							_API_GetUserInfo().then(res => { // 请求用户信息
								this.$store.commit('userinfo/UPDATA_USERINFO', res.data) // 获取用户信息后保存在 vuex 中
								console.log(this.$store.state.userinfo.pass_status)
								if (this.$store.state.userinfo.pass_status) {
									uni.showModal({ title: '提示', content: '为了保障您的账户安全，请立即修改密码', showCancel: false, success: res => {
										uni.reLaunch({ url: '../updata-psw/updata-psw' })
									}})
								}
							})
							_API_InviteCode().then(res => {
								this.$store.commit('userinfo/UPDATA_USERINFO', { invite_code: res.data.invite_code.toUpperCase() }) // 获取用户邀请码后保存在 vuex 中
							})
						}
					} else if (res.data.status == 0) { // 用户状态为 0 表示用户已被冻结
						this.$store.commit('app/LOGOUT')
						this.$refs.ltm.modal('提示', ['您已退出大卫博士'], 'noCancle').then(() => {
							uni.reLaunch({ url: '../login-reg/login-reg' })
						})
					}
				})
			} else {
				if (window.location.pathname.split('/').length > 4) {
					uni.showLoading({ mask: true })
					setTimeout(() => {
						uni.hideLoading()
						uni.reLaunch({ url: `../invite-proxy/invite-proxy?data=${JSON.stringify({
							nickname: decodeURIComponent(window.location.pathname.split('/')[3]),
							mobile: decodeURIComponent(window.location.pathname.split('/')[4]),
							invite_code: decodeURIComponent(window.location.pathname.split('/')[5])
						})}` })
					}, 888)
				} else {
					uni.reLaunch({ url: '../login-psw/login-psw' })
				}
			}
		},
		methods: {
			rTap() { uni.navigateTo({ url: '../help-use/help-use' }) }, // 点击导航栏帮助
			toSwiperDetail(index) { // 点击轮播图
				if (this.swiper[index].is_jump == 1) {
					uni.navigateTo({ url: `../app-webview/app-webview?url=${this.swiper[index].url}` })
				}
			},
			indexRequest() { // 请求首页数据
				_API_IndexIndex().then(res => {
					uni.stopPullDownRefresh()
					this.news = res.data.news
					this.swiper = res.data.swiper
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.index-index {
		@include page();
		.title {
			.cuIcon-question {
				font-size: 38rpx;
				margin-right: 30rpx;
			}
		}
		.content {
			.area {
				background: #FFFFFF;
				&.manage {
					height: 170rpx;
					display: flex;
					navigator {
						flex: 1;
						height: 100%;
						display: flex;
						align-items: center;
						flex-direction: column;
						image {
							width: 94rpx;
							height: 94rpx;
							margin-top: 20rpx;
						}
						text {
							font-size:32rpx;
							margin-top: 10rpx;
						}
					}
				}
				&.swiper {
					height: 250rpx;
					margin-top: 12rpx;
					swiper {
						height: 100%;
						image {
							width: 100%;
							height: 100%;
						}
					}
				}
				&.news {
					display: flex;
					height: 50rpx;
					padding: 10rpx 30rpx;
					box-sizing: border-box;
					image {
						height: 100%;
						width: 180rpx;
					}
					.hot {
						@include flex();
						width: 72rpx;
						height: 100%;
						font-size: 24rpx;
						margin-left: 10rpx;
						border-radius: 4rpx;
						color: $app-base-color;
						border:1px solid $app-base-color;
					}
					swiper {
						flex: 1;
						height: 100%;
						font-size: 26rpx;
						margin-left: 20rpx;
					}
				}
				&.article {
					margin-top: 10rpx;
					.area-name {
						@include flex();
						height: 72rpx;
						font-size: 32rpx;
						padding: 0 30rpx;
						box-sizing: border-box;
						justify-content: flex-start;
						border-bottom: 1rpx solid $app-base-bg;
						.border {
							width: 6rpx;
							height: 30rpx;
							margin-right: 16rpx;
							background: $app-base-color;
						}
					}
					.article-body {
						@include flex();
						height: 200rpx;
						padding: 10rpx 30rpx;
						box-sizing: border-box;
						.left {
							width: 180rpx;
							height: 180rpx;
							margin-right: 30rpx;
							border-radius: 10rpx;
						}
						.right {
							@include flex(column);
							flex: 1;
							height: 100%;
							align-items: flex-start;
							justify-content: space-between;
							.title {
								width: 444rpx;
								font-size: 32rpx;
							}
							.des {
								flex: 1;
								width: 100%;
								margin: 2rpx 0;
								font-size: 24rpx;
								overflow: scroll;
							}
							.time-auth {
								@include flex();
								width: 100%;
								font-size: 24rpx;
								color: $app-sec-text-color;
								justify-content: space-between;
							}
						}
					}
					.more-article {
						@include flex();
						height: 72rpx;
						font-size: 26rpx;
						border-top: 1rpx solid $app-base-bg;
					}
				}
			}
		}
	}
</style>