提交 e42a57db authored 作者: lidongxu's avatar lidongxu

超出使用快捷方式登录上限次数

上级 464dd2bf
......@@ -18,16 +18,10 @@ export function submitUserInfoAPI(data) {
})
}
// 获取appId secret 和 accesstoken 微信的
export function getAppIdAPI() {
return request({
'url': '/wechat/miniapp/wxtoken'
})
}
// 获取手机号
export function getPhoneNumberAPI(accessToken, code) {
export function getPhoneNumberAPI(openId, code) {
return request({
'url': `/wechat/miniapp/phone?accessToken=${accessToken}&code=${code}`
'url': `/wechat/miniapp/phone?openId=${openId}&code=${code}`
})
}
// 获取 openId
......@@ -35,4 +29,11 @@ export function getOpenIdAPI(jsCode) {
return request({
'url': `/wechat/miniapp/openid?jsCode=${jsCode}`
})
}
// 获取快速获取手机号使用次数
export function getPhoneNumberCountAPI(openId) {
return request({
'url': `/wechat/miniapp/logincount?openId=${openId}`
})
}
\ No newline at end of file
......@@ -3,15 +3,15 @@ const {miniProgram} = wx.getAccountInfoSync()
const { envVersion } = miniProgram
const urlObj = {
'release': 'https://promotion.wxl66.cn', // 正式环境
'trial': 'https://promotion.wxl66.cn', // 体验环境
// 'trial': 'http://111.198.15.68:85/promotion-api', // 体验环境
'develop': 'http://192.168.100.39:8010' // 开发环境
// 'trial': 'https://promotion.wxl66.cn', // 体验环境
'trial': 'https://sfa-qa.wxl66.cn/promotion-api', // 体验环境
'develop': 'https://sfa-qa.wxl66.cn/promotion-api' // 开发环境
// 'develop': 'https://promotion.wxl66.cn' // 开发环境
}
const ossWebURL = {
'release': 'https://link-promotion.oss-cn-shanghai.aliyuncs.com/', // 正式环境
'trial': 'https://link-promotion.oss-cn-shanghai.aliyuncs.com/',
// 'trial': 'https://link-promotion-dev.oss-cn-shanghai.aliyuncs.com/',
// 'trial': 'https://link-promotion.oss-cn-shanghai.aliyuncs.com/',
'trial': 'https://link-promotion-dev.oss-cn-shanghai.aliyuncs.com/',
'develop': 'https://link-promotion-dev.oss-cn-shanghai.aliyuncs.com/'
// 'develop': 'https://link-promotion.oss-cn-shanghai.aliyuncs.com/'
}
......@@ -28,7 +28,7 @@ module.exports = {
// 应用版本
version: "1.0.0",
// 应用logo
logo: `https://link-promotion-${envVersion !== 'release' ? 'dev' : ''}.oss-cn-shanghai.aliyuncs.com/logo.png`,
logo: `https://link-promotion.oss-cn-shanghai.aliyuncs.com/logo.png`,
// 官方网站
site_url: "http://www.wangxiaolu.com.cn/",
// 政策协议
......
......@@ -3,17 +3,8 @@ import App from './App'
import store from './store'
import plugins from './plugins'
import './permission'
import { getAppIdAPI } from './api/index.js'
Vue.use(plugins)
// 发起请求
getAppIdAPI().then(res => {
const { appId, appSecret, access_token } = res.data
store.commit('SET_WXAPPID', appId)
store.commit('SET_WXAPPSECRET', appSecret)
store.commit('SET_WXACCESSTOKEN', access_token)
});
Vue.config.productionTip = false
Vue.prototype.$store = store
......
......@@ -7,14 +7,47 @@
</image>
</view>
<view class="login-form-content">
<!-- 手机号输入框 -->
<view class="input-container">
<view class="input-item">
<input type="number"
v-model="phoneNumber"
placeholder="手动输入手机号"
class="input-field"
@input="phoneFocus"></input>
</view>
<view class="action-btn"
v-show="showCustomLogin">
<view class="mark-btn"
@click="loginMark"
v-if="!agreeProtocol"></view>
<!-- 登录 -->
<button class="login-btn cu-btn block bg-blue lg round"
@click="customLogin">
登录
</button>
</view>
<!-- <view class="input-item">
<view class="input-label">验证码</view>
<input type="number"
v-model="verificationCode"
placeholder="请输入验证码"
class="input-field"></input>
<view class="get-code-btn"
@click="getVerificationCode"
v-if="!isCodeSent">获取验证码</view>
<view class="get-code-btn"
v-else>{{ countdown }}秒后重新获取</view>
</view> -->
</view>
<!-- 登录按钮 -->
<view class="action-btn">
<view class="mark-btn"
@click="loginMark"
v-if="!agreeProtocol"></view>
v-if="!agreeProtocol || maxSend"></view>
<button open-type="getPhoneNumber"
@getphonenumber="getPhoneNumber"
class="login-btn cu-btn block bg-blue lg round">手机号登录</button>
class="login-btn cu-btn block bg-blue lg round">获取手机号登录</button>
</view>
<view class="xieyi text-center">
<van-checkbox :value="agreeProtocol"
......@@ -24,12 +57,21 @@
class="text-blue">《用户协议》</text>
</view>
</view>
<!-- 特定人员使用范围 -->
<view class="special-login-container">
<div>
<h3 class="special-title">特定人员使用范围</h3>
<p>1、当前小程序仅限王小卤促销员活动上报使用。</p>
<p>2、小程序需经您同意,获取您的手机号登录当前系统。</p>
<p>3、您的手机号仅用于系统登录、领导联系。</p>
</div>
</view>
<uni-popup ref="agreementDialog"
mask-click
type="dialog">
<uni-popup-dialog type="info"
confirmText="同意"
@confirm="dialogConfirm"
@confirm="agreeFn"
title="小卤通 小程序隐私保护指引">
<p>本指引是小卤通小程序开发者 北京王小卤网络科技有限公司(以下简称“开发者”)为处理你的个人信息而制定。</p>
<h4>开发者处理的信息</h4>
......@@ -75,37 +117,45 @@
<script>
import storage from '@/utils/storage'
import constant from '@/utils/constant';
import { getPhoneNumberAPI } from '@/api';
import { getPhoneNumberAPI, getPhoneNumberCountAPI } from '@/api';
import { mapGetters } from 'vuex'
export default {
data() {
return {
globalConfig: getApp().globalData.config,
agreeProtocol: false
agreeProtocol: false,
phoneNumber: '',
showCustomLogin: false,
maxSend: false, // 是否超过最大获取手机号登录上限
}
},
async created() {
// 调用微信登录接口,获取 openID
const openId = await this.$store.dispatch('getOpenId')
const res = await getPhoneNumberCountAPI(openId)
this.maxSend = (res.data > 5)
},
computed: {
...mapGetters(['wxOpenId'])
},
methods: {
loginMark() {
if (this.maxSend) {
this.$modal.msgError('您已超出获取手机号登录次数上限,使用手动输入手机号登录')
return
}
this.$modal.msgError('请先勾选同意协议')
},
// 手机号登录
async getPhoneNumber(e) {
// 判断是否提供手机号
if (!e.detail.code) {
return this.$modal.msgError("请选择手机号登录")
}
phoneFocus() {
this.showCustomLogin = this.phoneNumber.length > 0
},
async login() {
this.$modal.loading("登录中,请耐心等待...")
// 通过微信小程序 API 获取手机号
const { data: { phone_info: { phoneNumber } } } = await getPhoneNumberAPI(this.$store.getters.wxAccessToten, e.detail.code)
// 调用微信登录接口,获取 openID
const openId = await this.$store.dispatch('getOpenId')
// 调用自己后台登录接口
const loginRes = await this.$store.dispatch('Login', { phoneNumber, openId })
storage.set(constant.loginPhone, phoneNumber)
const loginRes = await this.$store.dispatch('Login', { phoneNumber: this.phoneNumber, openId: this.wxOpenId })
storage.set(constant.loginPhone, this.phoneNumber)
// 手机号从未注册过-需要填写资料完成注册
if (loginRes.code === 3004) {
setTimeout(() => {
......@@ -118,12 +168,39 @@ export default {
this.$modal.closeLoading()
},
// 同意协议
dialogConfirm() {
this.agreeProtocol = true
// 自己输入手机号登录
async customLogin() {
// 正则判断手机号格式是否正确
const reg = /^1[3456789]\d{9}$/;
if (!reg.test(this.phoneNumber)) {
return this.$modal.msgError('请输入正确的手机号')
}
this.login()
},
// 手机号登录
async getPhoneNumber(e) {
// 判断是否提供手机号
if (!e.detail.code) {
return this.$modal.msgError("需要通过授权才能继续,请选择手机号登录", 3000)
}
// 快速验证,通过 code 到微信小程序 API 获取用户授权的手机号
const { data: { phone_info: { phoneNumber } } } = await getPhoneNumberAPI(this.wxOpenId, e.detail.code)
this.phoneNumber = phoneNumber
this.login()
},
// 同意协议
agreeFn(e) {
this.agreeProtocol = e.detail
if (e) {
// 复选框勾选
this.agreeProtocol = e.detail
} else {
// 查看用户协议页面-点击同意
this.agreeProtocol = true
}
}
}
}
......@@ -154,6 +231,9 @@ page {
.normal-login-container {
width: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
.logo-content {
width: 100%;
......@@ -237,5 +317,22 @@ page {
}
}
}
.special-login-container {
display: flex;
justify-content: center;
margin-top: auto;
padding-bottom: 150rpx;
.special-title {
text-align: center;
font-weight: 800;
margin-bottom: 25rpx;
}
}
}
.input-field {
height: 100%;
}
</style>
......@@ -60,7 +60,7 @@ import constant from '@/utils/constant'
export default {
created() {
this.phone = storage.get(constant.loginPhone)
this.openId = storage.get(constant.loginOpenId)
this.openId = storage.get(constant.wxOpenId)
},
data() {
return {
......@@ -110,7 +110,7 @@ export default {
// 手机号首次需要调用此接口注册-拿到后台 token(以后调用后台登录接口才能通过拿到 token)
await submitUserInfoAPI({
avatarUrl: this.formData.avatarUrl,
openId: storage.get(constant.loginOpenId),
openId: storage.get(constant.wxOpenId),
name: this.formData.name,
idenFrontPhotoUrl: this.formData.idenFrontUrl,
idenReversePhotoUrl: this.formData.idenBackUrl,
......
......@@ -7,9 +7,6 @@ const getters = {
permissions: state => state.user.permissions,
delayTime: state => 3000, // 延迟弹窗关闭时间
location: (state) => state.map.location,
wxAccessToten: state => state.user.wxAccessToken,
wxOpenId: state => state.user.wxOpenId,
wxAppId: state => state.user.wxAppId,
wxSecret: state => state.user.wxSecret,
}
export default getters
......@@ -14,9 +14,6 @@ const user = {
roles: storage.get(constant.roles),
permissions: storage.get(constant.permissions),
user: storage.get(constant.user),
wxAppId: storage.get(constant.wxAppId),
wxSecret: storage.get(constant.wxSecret),
wxAccessToken: storage.get(constant.wxAccessToken),
wxOpenId: storage.get(constant.wxOpenId)
},
......@@ -45,22 +42,6 @@ const user = {
state.user = user
storage.set(constant.user, user)
},
SET_OPENID: (state, openid) => {
state.openid = openid
storage.set(constant.loginOpenId, openid)
},
SET_WXAPPID: (state, id) => {
state.wxAppId = id
storage.set(constant.wxAppId, id)
},
SET_WXAPPSECRET: (state, secret) => {
state.wxSecret = secret
storage.set(constant.wxSecret, secret)
},
SET_WXACCESSTOKEN: (state, token) => {
state.wxAccessToken = token
storage.set(constant.wxAccessToken, token)
},
SET_WXOPENID: (state, token) => {
state.wxOpenId = token
storage.set(constant.wxOpenId, token)
......@@ -78,7 +59,7 @@ const user = {
// 通过 code 获取永久唯一身份标识 openid
const openRes = await getOpenIdAPI(loginRes.code)
commit('SET_OPENID', openRes.data.openid)
commit('SET_WXOPENID', openRes.data.openid)
resolve(openRes.data.openid)
})
},
......
......@@ -8,12 +8,6 @@ const constant = {
location: 'vuex_location',
// 登录使用手机号
loginPhone: 'vuex_login_phone',
loginOpenId: 'vuex_login_openid',
// 微信 AppId 和 SecretId
wxAppId: 'vuex_wx_appid',
wxSecret: 'vuex_wx_secret',
// 微信 AccessToken
wxAccessToken: 'vuex_wx_access_token',
// 微信用户 openId
wxOpenId: 'vuex_wx_open_id'
}
......
......@@ -35,11 +35,9 @@ export function checkRole(value) {
const roles = store.getters && store.getters.roles
const permissionRoles = value
const super_admin = "admin"
const hasRole = roles.some(role => {
return super_admin === role || permissionRoles.includes(role)
})
if (!hasRole) {
return false
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论