customerapp-H5/pages/index/index.vue

<template>
	<view class="content">
		<image src="https://soap.cliu.cc/chumeng/indexBanner.png" class="content_banner"></image>
		<view style="padding: 0 24rpx 2rpx 24rpx;">
			<view class="content_item flexB" v-for="(item, i) in list" :key="i" @click="getUrl(item.name, item.url)">
				<view class="flexM">
					<text>{{ item.name }}</text>
					<text>{{ item.tip }}</text>
				</view>
				<image :src="`${'../../static/index/' + item.icon}`"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import { wxLogin, getOpenid } from '@/api/index.js'
	export default {
		data() {
			return {
				data: {},
				list: [
					{
						name: '肥皂下单',
						tip: '大卫博士竹炭植物精油皂',
						icon: 'soap.png',
						url: '../Buy_soap_tape/goods?type=soap'
					}
				]
			}
		},
		onShow() {
			let wxcode = this.getUrlParam('code')
			// 回调
			if (!uni.getStorageSync('token') && wxcode) {
				wxLogin({ code: wxcode }).then(res => {
					uni.hideLoading()
					if (res.code == 200) {
						this.checkLogin(res.data)
					} else {
						uni.showModal({
							title: '提示',
							content: res.msg,
							showCancel: false
						})
					}
				})
				return
			}
			// 有token
			if (uni.getStorageSync('userInfo') && uni.getStorageSync('token')) {
				this.showALL()
			} else {
				this.toWxchatLogin("/", null)
				return false
			}
		},
		methods: {
			// 跳转微信授权
			toWxchatLogin(url, state) {
				url = url || '/pages/index/index';
				state = state || 'cli';
				const redirect_uri = encodeURIComponent(`${this.$config.redirect_uri}/#${url}`);
				const auth = () =>
					(window.location.href = `${this.$config.wxURL}?appid=${
					this.$config.appid
				}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=${state}#wechat_redirect`);
				auth();
			},
			//获取code值方法
			getUrlParam(name) {
			    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)'); //构造一个含有目标参数的正则表达式对象
			    var r = window.location.search.substr(1).match(reg); //匹配目标参数
			    if (r != null) return decodeURIComponent(r[2]);
			    // return null; //返回参数值
			    return ''; //返回参数值
			},
			// 批发商显示所有操作
			showALL() {
				let userInfo = uni.getStorageSync('userInfo')
				if (userInfo.level == 3) {
					this.list = [
						{
							name: '退货',
							tip: '订单退货或取消',
							icon: 'tui.png',
							url: '../return/list'
						},
						{
							name: '调货',
							tip: '款式或尺码调换',
							icon: 'huan.png',
							url: ''
						},{
							name: '肥皂下单',
							tip: '大卫博士竹炭植物精油皂',
							icon: 'soap.png',
							url: '../Buy_soap_tape/goods?type=soap'
						},{
							name: '胶带下单',
							tip: '品牌周边产品效应',
							icon: 'tape.png',
							url: '../Buy_soap_tape/goods?type=tape'
						}
					]
				}
			},
			checkLogin(data) {
				// 登录后
				if (data.token) {
					uni.showLoading({ title: '加载中', mask: true })
					uni.setStorageSync('token', data.token)
					uni.setStorageSync('userInfo', data.user)
					this.showALL()
					uni.hideLoading()
				} else if (!data.token && data.openid) {
					uni.showModal({
						title: '提示',
						content: data.msg,
						showCancel: false,
						success: res => {
							uni.reLaunch({
								url: '../login/login?type=index' + '&openid=' + data.openid
							})
						}
					})
				} else if (!data.token && !data.openid) {
					uni.showModal({
						title: '错误提示',
						content: data.msg,
						showCancel: false
					})
				}
			},
			// 跳转页面
			getUrl(name, url) {
				if (uni.getStorageSync('token')) {
					if (name == '调货') {
						uni.toast('该功能暂未开通')
						return
					}
					uni.navigateTo({
						url: url
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		&_banner {
			width: 100%;
			height: 476rpx;
			margin-bottom: 32rpx;
		}
		&_item {
			background-color: #fff;
			margin-bottom: 24rpx;
			padding: 24rpx 40rpx;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			.flexM {
				text:nth-child(1) {
					font-size: 36rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					color: #333333;
					margin-bottom: 10rpx;
				}
				text:nth-child(2) {
					font-size: 28rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #999999;
				}
			}
			image {
				width: 100rpx;
				height: 100rpx;
			}
		}
	}
</style>