11

pageMy/my/vip/bind.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="vip">
+		<view class="vip-title">
+			输入邀请码
+		</view>
+		<view class="vip-tip">通过客服获取由字母数字组成不少于10位的编码</view>
+		<jl-form>
+			<jl-form-item>
+				<jl-input v-model="code" placeholder="请输入" clearable></jl-input>
+			</jl-form-item>
+		</jl-form>
+		<view class="vip-btn">
+			<jl-button inline type="primary" :disabled="valid" :loading="loading" @click="confirm">申请绑定</jl-button>
+		</view>
+		<view class="vip-bottom">
+			未实名认证用户，请先进行实名认证。未完成实名认证，申请VIP会员无法成功。
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		bind
+	} from "@/api/vip.js"
+	import jlInput from "@/components/jl-input/main.vue"
+	import {
+		mapGetters
+	} from "vuex"
+
+	export default {
+		components: {
+			jlInput
+		},
+		data() {
+			return {
+				loading: false,
+				code: ""
+			}
+		},
+		methods: {
+			confirm() {
+				this.loading = true
+				this.$store.dispatch("bindVipCode", this.code).then(() => {
+					this.loading = false
+				}).catch(() => {
+					this.loading = false
+				})
+			}
+		},
+		computed: {
+			...mapGetters(["authInfo"]),
+			valid() {
+				return this.code.length < 10
+			}
+		}
+	}
+</script>
+
+<style>
+	.vip {
+		width: 80%;
+		padding-top: 108rpx;
+		margin: 0 auto;
+	}
+
+	.vip-title {
+		font-size: 46rpx;
+		color: #333333;
+		letter-spacing: 0;
+		line-height: 46rpx;
+		margin-bottom: 30rpx;
+	}
+
+	.vip-tip {
+		font-size: 28rpx;
+		color: #999999;
+		line-height: 28rpx;
+		margin-bottom: 43rpx;
+	}
+
+	.vip-btn {
+		padding-top: 50rpx;
+	}
+
+	.vip-btn-invit .jl-button {
+		display: block;
+	}
+
+	.vip-bottom {
+		padding-top: 41rpx;
+		font-family: PingFangSC-Regular;
+		font-size: 24rpx;
+		color: #999999;
+		line-height: 34rpx;
+	}
+</style>

pageMy/my/vip/index.vue

@@ -0,0 +1,33 @@
+<template>
+	<success v-if="isVip"></success>
+	<bind v-else></bind>
+</template>
+
+<script>
+	import bind from "./bind.vue"
+	import success from "./success.vue"
+	import {
+		mapGetters
+	} from "vuex"
+
+	export default {
+		components: {
+			bind,
+			success
+		},
+		data() {
+			return {
+				state: ""
+			}
+		},
+		computed: {
+			...mapGetters(["isVip"])
+		}
+	}
+</script>
+
+<style>
+	page{
+		height: 100%;
+	}
+</style>

pageMy/my/vip/success.vue

@@ -0,0 +1,74 @@
+<template>
+	<view class="vip-success">
+		<view class="vip-success-body">
+			<image class="vip-success-img" src="/static/img/noauth.svg"></image>
+			<view class="vip-success-text">我的邀请码：{{vipCode}}</view>
+			<jl-button class="vip-success-btn" @click="copy">复制</jl-button>
+		</view>
+		<view class="vip-success-footer">说明：邀请码用作企业自主注册时填写的邀请码</view>
+	</view>
+</template>
+
+<script>
+	import {
+		mapGetters
+	} from "vuex"
+	import uniCopy from '@/js_sdk/xb-copy/uni-copy.js'
+
+	export default {
+		methods: {
+			copy() {
+				uniCopy({
+					content: `企业登录链接：https://www.jlhrms.cn/manage/#/login\r\n企业邀请码:${this.vipCode}`,
+					success: (res) => {
+						uni.showToast({
+							title: "复制成功",
+							icon: 'none'
+						})
+					},
+				})
+			}
+		},
+		computed: {
+			...mapGetters(["vipCode"])
+		}
+	}
+</script>
+
+<style>
+	.vip-success {
+		height: 100%;
+		text-align: center;
+	}
+
+	.vip-success-body {
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+	}
+
+	.vip-success-img {
+		width: 337rpx;
+		height: 188rpx;
+		margin: 0 auto 43.2rpx auto;
+	}
+
+	.vip-success-text {
+		font-size: 28rpx;
+		color: #666666;
+		letter-spacing: 0;
+		line-height: 32rpx;
+		margin-bottom: 20rpx;
+	}
+
+	.vip-success-footer {
+		width: 100%;
+		position: absolute;
+		bottom: 128rpx;
+		font-size: 24rpx;
+		color: #999999;
+		letter-spacing: 0;
+		line-height: 24rpx;
+	}
+</style>