微信公众号自动登录
This commit is contained in:
Vinjor
parent
05e7447f70
commit
ed71f35fcb
@ -18,6 +18,14 @@ export function login(username, password, code, uuid) {
|
||||
})
|
||||
}
|
||||
|
||||
// 微信登录
|
||||
export function wechatLogin(data) {
|
||||
return request({
|
||||
'url': '/weChat/wechatLogin',
|
||||
'method': 'post',
|
||||
'data':data
|
||||
})
|
||||
}
|
||||
// 获取用户详细信息
|
||||
export function getInfo() {
|
||||
return request({
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
// 应用全局配置
|
||||
module.exports = {
|
||||
//baseUrl: 'https://www.nuoyunr.com/admin-api',
|
||||
baseUrl: 'http://192.168.1.4:48080/userClient',
|
||||
baseUrl: 'https://3w823u8516.vicp.fun',
|
||||
imagesUrl: 'http://shequ.0315e.com/static/images/pages/',
|
||||
baseImageUrl: 'https://www.nuoyunr.com/minio',
|
||||
//wsUrl: 'wss://www.nuoyunr.com/admin-api',
|
||||
|
||||
@ -69,5 +69,15 @@
|
||||
"uniStatistics" : {
|
||||
"enable" : false
|
||||
},
|
||||
"h5" : {
|
||||
"router" : {
|
||||
"base" : "/lanan-repair"
|
||||
},
|
||||
"devServer" : {
|
||||
"port" : 8080,
|
||||
"disableHostCheck" : true,
|
||||
"https" : false
|
||||
}
|
||||
},
|
||||
"vueVersion" : "2"
|
||||
}
|
||||
|
||||
12
pages.json
12
pages.json
@ -6,12 +6,12 @@
|
||||
// "navigationBarTitleText": "uni-app"
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// "path": "pages/login/login",
|
||||
// "style": {
|
||||
// "navigationBarTitleText": "uni-app"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
"path": "pages/login/login",
|
||||
"style": {
|
||||
"navigationBarTitleText": "uni-app"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/home/home",
|
||||
"style" :
|
||||
|
||||
@ -1,449 +1,510 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="top">
|
||||
<view class="touxiang">
|
||||
<image src="../../static/xinlogo.png" mode=""></image>
|
||||
</view>
|
||||
<view class="inputs">
|
||||
<input type="text" v-model="userName" placeholder="请输入用户名">
|
||||
</view>
|
||||
<view class="inputs">
|
||||
<input type="password" v-model="wrod" placeholder="请输入密码">
|
||||
</view>
|
||||
<view class="wjworb" @click="goforgot()">
|
||||
<view class="">忘记密码</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dl" @click="getlogin()">
|
||||
<text>登 录</text>
|
||||
</view>
|
||||
<!-- <view class="hging">
|
||||
<text>没有账号？</text>
|
||||
<text style="color: #0078FF;" @click="goregister()">立即注册</text>
|
||||
</view> -->
|
||||
<view class="dbottom">
|
||||
<view class="quanzi" v-if="qindex == false " @click="qindex =! qindex"></view>
|
||||
<view class="lanquanzi" v-if="qindex == true" @click="qindex =! qindex">
|
||||
<uni-icons type="checkmarkempty" color="#ffffff" size="14"></uni-icons>
|
||||
</view>
|
||||
<text>请仔细阅读</text>
|
||||
<text class="lan">《用户协议》</text>
|
||||
<text>和</text>
|
||||
<text class="lan">《隐私政策》</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="top">
|
||||
<view class="touxiang">
|
||||
<image src="../../static/xinlogo.png" mode=""></image>
|
||||
</view>
|
||||
<view class="inputs">
|
||||
<input type="text" v-model="userName" placeholder="请输入用户名">
|
||||
</view>
|
||||
<view class="inputs">
|
||||
<input type="password" v-model="wrod" placeholder="请输入密码">
|
||||
</view>
|
||||
<view class="wjworb" @click="goforgot()">
|
||||
<view class="">忘记密码</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dl" @click="getlogin()">
|
||||
<text>登 录</text>
|
||||
</view>
|
||||
<!-- <view class="hging">
|
||||
<text>没有账号？</text>
|
||||
<text style="color: #0078FF;" @click="goregister()">立即注册</text>
|
||||
</view> -->
|
||||
<view class="dbottom">
|
||||
<view class="quanzi" v-if="qindex == false " @click="qindex =! qindex"></view>
|
||||
<view class="lanquanzi" v-if="qindex == true" @click="qindex =! qindex">
|
||||
<uni-icons type="checkmarkempty" color="#ffffff" size="14"></uni-icons>
|
||||
</view>
|
||||
<text>请仔细阅读</text>
|
||||
<text class="lan">《用户协议》</text>
|
||||
<text>和</text>
|
||||
<text class="lan">《隐私政策》</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '../../utils/request';
|
||||
import {
|
||||
loginApp
|
||||
} from '@/api/login.js';
|
||||
import {
|
||||
setToken,
|
||||
setTenantId
|
||||
} from '@/utils/auth.js'
|
||||
import {
|
||||
login,
|
||||
getInfo,
|
||||
getTenantIdByWebsite
|
||||
} from '@/api/login.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phoneNumber: "",
|
||||
baseUrl: this.$baseUrl,
|
||||
isButtonDisabled: false,
|
||||
countdownTime: 60,
|
||||
qindex: false,
|
||||
sfindex: 'user',
|
||||
userName: '',
|
||||
yzm: '',
|
||||
wrod: '',
|
||||
activeid: 0,
|
||||
tenantCode: 'lanan'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
groupChange(n) {
|
||||
console.log('groupChange', n);
|
||||
},
|
||||
radioChange(n) {
|
||||
console.log('radioChange', n);
|
||||
},
|
||||
buttonText() {
|
||||
if (this.isButtonDisabled) {
|
||||
return `${this.countdownTime}s 后重新发送`;
|
||||
} else {
|
||||
return "获取验证码";
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
import request from '../../utils/request';
|
||||
import {
|
||||
loginApp,
|
||||
} from '@/api/login.js';
|
||||
import {
|
||||
setToken,
|
||||
setTenantId,
|
||||
removeToken
|
||||
} from '@/utils/auth.js'
|
||||
import {
|
||||
login,
|
||||
getInfo,
|
||||
getTenantIdByWebsite
|
||||
} from '@/api/login.js'
|
||||
import drawQrcode from "weapp-qrcode";
|
||||
|
||||
setidentity(text) {
|
||||
this.sfindex = text
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
//用户微信openId
|
||||
openId: "",
|
||||
phoneNumber: "",
|
||||
baseUrl: this.$baseUrl,
|
||||
isButtonDisabled: false,
|
||||
countdownTime: 60,
|
||||
qindex: false,
|
||||
sfindex: 'user',
|
||||
userName: '',
|
||||
yzm: '',
|
||||
wrod: '',
|
||||
activeid: 0,
|
||||
tenantCode: 'lanan'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
groupChange(n) {
|
||||
console.log('groupChange', n);
|
||||
},
|
||||
radioChange(n) {
|
||||
console.log('radioChange', n);
|
||||
},
|
||||
buttonText() {
|
||||
if (this.isButtonDisabled) {
|
||||
return `${this.countdownTime}s 后重新发送`;
|
||||
} else {
|
||||
return "获取验证码";
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
created(){
|
||||
//先删token
|
||||
removeToken()
|
||||
/*2.微信公众平台自动登录*/
|
||||
let code = this.getUrlCode('code')
|
||||
if (code !== null && code !== "") {
|
||||
//自动登录
|
||||
this.getOpenidAndUserinfo(code)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '未获取到授权信息，请重新进入！！',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
|
||||
},
|
||||
//登录请求
|
||||
getlogin() {
|
||||
if (this.qindex != true) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "请阅读并勾选用户协议",
|
||||
duration: 2000
|
||||
})
|
||||
return;
|
||||
}
|
||||
if (this.userName == '') {
|
||||
uni.showToast({
|
||||
title: '输入框不能为空！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
uni.setStorageSync('identity', this.sfindex);
|
||||
methods: {
|
||||
/**
|
||||
* 微信自动登录
|
||||
* @param {Object} code 用户code
|
||||
*/
|
||||
async getOpenidAndUserinfo(code) {
|
||||
await request({
|
||||
url: '/userClient/weChat/wechatLogin',
|
||||
method: 'get',
|
||||
params: {code:code}
|
||||
}).then((res) => {
|
||||
if (res.code==200) {
|
||||
if(res.data.hasOwnProperty("accessToken")){
|
||||
setToken(res.data.accessToken)
|
||||
uni.reLaunch({
|
||||
url: '/pages/home/home'
|
||||
})
|
||||
}else{
|
||||
//去注册
|
||||
this.openId = res.data
|
||||
//跳转到注册页
|
||||
this.goregister()
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 获取路径中的参数
|
||||
* @param {Object} name
|
||||
*/
|
||||
getUrlCode(name) {
|
||||
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ''])[1].replace(/\+/g, '%20')) || null
|
||||
},
|
||||
setidentity(text) {
|
||||
this.sfindex = text
|
||||
|
||||
const loginFun = () => {
|
||||
const data = {
|
||||
username: this.userName,
|
||||
password: this.wrod,
|
||||
type: 0
|
||||
}
|
||||
loginApp(data).then(res => {
|
||||
if (res.data.needMobile === "1") {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/bindPhoe'
|
||||
})
|
||||
uni.setStorageSync('validaCodeToken', res.data.accessToken)
|
||||
} else {
|
||||
setToken(res.data.accessToken)
|
||||
uni.reLaunch({
|
||||
url: '/pages/home/home'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
//登录请求
|
||||
getlogin() {
|
||||
if (this.qindex != true) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "请阅读并勾选用户协议",
|
||||
duration: 2000
|
||||
})
|
||||
return;
|
||||
}
|
||||
if (this.userName == '') {
|
||||
uni.showToast({
|
||||
title: '输入框不能为空！',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
getTenantIdByWebsite(this.tenantCode).then(res => {
|
||||
if (res.code === 200 && res.data && res.data.length > 0) {
|
||||
uni.showActionSheet({
|
||||
itemList: res.data.map(m => m.name),
|
||||
success: ({
|
||||
tapIndex
|
||||
}) => {
|
||||
setTenantId(res.data[tapIndex].id)
|
||||
loginFun()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
setTenantId('')
|
||||
loginFun()
|
||||
}
|
||||
})
|
||||
},
|
||||
getxz(index) {
|
||||
this.activeid = index
|
||||
},
|
||||
goregister() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/register'
|
||||
})
|
||||
},
|
||||
goforgot() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/forgot'
|
||||
})
|
||||
},
|
||||
goselect() {
|
||||
console.log('执行去救援', this.sfindex);
|
||||
// pages/rescue/trafficPolice
|
||||
if (this.sfindex == 'police') {
|
||||
uni.reLaunch({
|
||||
url: '/pages/rescue/trafficPolice'
|
||||
})
|
||||
} else {
|
||||
uni.reLaunch({
|
||||
url: '/pages/rescue/rescue'
|
||||
})
|
||||
}
|
||||
uni.setStorageSync('identity', this.sfindex);
|
||||
|
||||
},
|
||||
// 验证码方法
|
||||
sendVerificationCode() {
|
||||
let reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/;
|
||||
if (!reg.test(this.userName)) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '请输入正确的11位手机号'
|
||||
})
|
||||
this.userName = '';
|
||||
return false;
|
||||
}
|
||||
if (this.isButtonDisabled) {
|
||||
return; // 如果按钮已禁用，则直接返回
|
||||
}
|
||||
const data = {
|
||||
phone: this.userName,
|
||||
}
|
||||
request({
|
||||
url: '/loginSmsCode',
|
||||
method: 'post',
|
||||
params: data
|
||||
}).then((res) => {
|
||||
console.log('验证码', res);
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '验证码已发送 请注意查收',
|
||||
icon: 'none'
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '网络不佳请稍后再试',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
const loginFun = () => {
|
||||
const data = {
|
||||
username: this.userName,
|
||||
password: this.wrod,
|
||||
type: 0
|
||||
}
|
||||
loginApp(data).then(res => {
|
||||
if (res.data.needMobile === "1") {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/bindPhoe'
|
||||
})
|
||||
uni.setStorageSync('validaCodeToken', res.data.accessToken)
|
||||
} else {
|
||||
setToken(res.data.accessToken)
|
||||
uni.reLaunch({
|
||||
url: '/pages/home/home'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
getTenantIdByWebsite(this.tenantCode).then(res => {
|
||||
if (res.code === 200 && res.data && res.data.length > 0) {
|
||||
uni.showActionSheet({
|
||||
itemList: res.data.map(m => m.name),
|
||||
success: ({
|
||||
tapIndex
|
||||
}) => {
|
||||
setTenantId(res.data[tapIndex].id)
|
||||
loginFun()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
setTenantId('')
|
||||
loginFun()
|
||||
}
|
||||
})
|
||||
},
|
||||
getxz(index) {
|
||||
this.activeid = index
|
||||
},
|
||||
goregister() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/my/register?openId='+this.openId
|
||||
})
|
||||
},
|
||||
goforgot() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/forgot'
|
||||
})
|
||||
},
|
||||
goselect() {
|
||||
console.log('执行去救援', this.sfindex);
|
||||
// pages/rescue/trafficPolice
|
||||
if (this.sfindex == 'police') {
|
||||
uni.reLaunch({
|
||||
url: '/pages/rescue/trafficPolice'
|
||||
})
|
||||
} else {
|
||||
uni.reLaunch({
|
||||
url: '/pages/rescue/rescue'
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
// 验证码方法
|
||||
sendVerificationCode() {
|
||||
let reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/;
|
||||
if (!reg.test(this.userName)) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '请输入正确的11位手机号'
|
||||
})
|
||||
this.userName = '';
|
||||
return false;
|
||||
}
|
||||
if (this.isButtonDisabled) {
|
||||
return; // 如果按钮已禁用，则直接返回
|
||||
}
|
||||
const data = {
|
||||
phone: this.userName,
|
||||
}
|
||||
request({
|
||||
url: '/loginSmsCode',
|
||||
method: 'post',
|
||||
params: data
|
||||
}).then((res) => {
|
||||
console.log('验证码', res);
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '验证码已发送 请注意查收',
|
||||
icon: 'none'
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '网络不佳请稍后再试',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
this.disableButton(); // 禁用按钮
|
||||
this.startCountdown(); // 启动倒计时
|
||||
this.disableButton(); // 禁用按钮
|
||||
this.startCountdown(); // 启动倒计时
|
||||
|
||||
},
|
||||
disableButton() {
|
||||
this.isButtonDisabled = true;
|
||||
},
|
||||
enableButton() {
|
||||
this.isButtonDisabled = false;
|
||||
},
|
||||
startCountdown() {
|
||||
let countdown = setInterval(() => {
|
||||
this.countdownTime--;
|
||||
if (this.countdownTime === 0) {
|
||||
clearInterval(countdown);
|
||||
this.enableButton(); // 启用按钮
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
disableButton() {
|
||||
this.isButtonDisabled = true;
|
||||
},
|
||||
enableButton() {
|
||||
this.isButtonDisabled = false;
|
||||
},
|
||||
startCountdown() {
|
||||
let countdown = setInterval(() => {
|
||||
this.countdownTime--;
|
||||
if (this.countdownTime === 0) {
|
||||
clearInterval(countdown);
|
||||
this.enableButton(); // 启用按钮
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.jsq {
|
||||
border: none !important;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #0078FF;
|
||||
}
|
||||
.jsq {
|
||||
border: none !important;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #0078FF;
|
||||
}
|
||||
|
||||
button {
|
||||
border: none !important;
|
||||
background: none !important;
|
||||
margin: 0px;
|
||||
display: block;
|
||||
}
|
||||
button {
|
||||
border: none !important;
|
||||
background: none !important;
|
||||
margin: 0px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
color: #0078FF;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
button:focus {
|
||||
color: #0078FF;
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.content {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.content {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.top {
|
||||
box-sizing: border-box;
|
||||
padding: 0px 27px;
|
||||
padding-top: 100px;
|
||||
background-image: url('../../static/loginbj.png');
|
||||
// background-color:lightseagreen;
|
||||
// background-image: url('../../static/loginbj.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
// height: 385px;
|
||||
}
|
||||
.top {
|
||||
box-sizing: border-box;
|
||||
padding: 0px 27px;
|
||||
padding-top: 100px;
|
||||
background-image: url('../../static/loginbj.png');
|
||||
// background-color:lightseagreen;
|
||||
// background-image: url('../../static/loginbj.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
// height: 385px;
|
||||
}
|
||||
|
||||
.touxiang {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
border-radius: 10px;
|
||||
background: #D7D7D7;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 40px;
|
||||
overflow: hidden;
|
||||
.touxiang {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
border-radius: 10px;
|
||||
background: #D7D7D7;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 40px;
|
||||
overflow: hidden;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.twotap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.twotap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
view {
|
||||
font-size: 15px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-right: 38.5px;
|
||||
}
|
||||
}
|
||||
view {
|
||||
font-size: 15px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-right: 38.5px;
|
||||
}
|
||||
}
|
||||
|
||||
.blck {
|
||||
color: #333333 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
.blck {
|
||||
color: #333333 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
.inputs {
|
||||
box-sizing: border-box;
|
||||
padding: 16px 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 2px solid #E8E8E8;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.inputs {
|
||||
box-sizing: border-box;
|
||||
padding: 16px 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 2px solid #E8E8E8;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.wjworb {
|
||||
margin-top: 5px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
font-size: 12px;
|
||||
color: #0078FF;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
.wjworb {
|
||||
margin-top: 5px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
font-size: 12px;
|
||||
color: #0078FF;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.dl {
|
||||
width: 90%;
|
||||
height: 44px;
|
||||
background: linear-gradient(-46deg, #0853C4 0%, #4282D8 80%);
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 22px;
|
||||
}
|
||||
.dl {
|
||||
width: 90%;
|
||||
height: 44px;
|
||||
background: linear-gradient(-46deg, #0853C4 0%, #4282D8 80%);
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
||||
.hging {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #636363;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.hging {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #636363;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.wx {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
margin: 0px auto;
|
||||
margin-top: 20px;
|
||||
.wx {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
margin: 0px auto;
|
||||
margin-top: 20px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.hui {
|
||||
font-size: 10px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
.hui {
|
||||
font-size: 10px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.dbottom {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #333333;
|
||||
margin-top: 40px;
|
||||
position: fixed;
|
||||
bottom: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.dbottom {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #333333;
|
||||
margin-top: 40px;
|
||||
position: fixed;
|
||||
bottom: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.quanzi {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #666666;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.quanzi {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #666666;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.lanquanzi {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #0078FF;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
background: #0078FF;
|
||||
color: white;
|
||||
}
|
||||
.lanquanzi {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #0078FF;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
background: #0078FF;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.lan {
|
||||
color: #0078FF;
|
||||
}
|
||||
.lan {
|
||||
color: #0078FF;
|
||||
}
|
||||
|
||||
.jiuzhong {
|
||||
width: 90%;
|
||||
margin: 10px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.jiuzhong {
|
||||
width: 90%;
|
||||
margin: 10px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.dist {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0px 10px;
|
||||
}
|
||||
.dist {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0px 10px;
|
||||
}
|
||||
|
||||
.d-zi {
|
||||
font-size: 14px;
|
||||
}
|
||||
.d-zi {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.d-qian {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid #666666;
|
||||
color: white;
|
||||
}
|
||||
.d-qian {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid #666666;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.d-qian-lan {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #0078FF;
|
||||
border: 1px solid #0078FF;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
.d-qian-lan {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #0078FF;
|
||||
border: 1px solid #0078FF;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,189 +1,305 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<VNavigationBar title-color="#333" background-color="#fff" title="信息填写"></VNavigationBar>
|
||||
<view class="body">
|
||||
<view class="formItem">
|
||||
<view class="formLabel">姓名</view>
|
||||
<view class="formContainer">
|
||||
<input placeholder="请填写你的真实姓名" type="text" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">性别</view>
|
||||
<view class="formContainer">
|
||||
<radio-group class="radioGroup">
|
||||
<label class="radio">
|
||||
<radio activeBackgroundColor="#009EDA" value="r1" checked="true" />男
|
||||
</label>
|
||||
<label class="radio">
|
||||
<radio activeBackgroundColor="#009EDA" value="r2" />女
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">省份</view>
|
||||
<view class="formContainer">
|
||||
<picker :range="addressRange" mode="multiSelector" @columnchange="addressColumnChangeFun">
|
||||
<view class="formPicker">
|
||||
<input class="formPickerInput" type="text" disabled="true" placeholder="请选择所在省份/城市/区" />
|
||||
<image class="formPickerBtn" src="../../static/icons/homeInfoMore.png" mode="aspectFit">
|
||||
</image>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">详细地址</view>
|
||||
<view class="formContainer">
|
||||
<picker :range="detailAddress" mode="multiSelector" @columnchange="detailColumnChangeFun">
|
||||
<view class="formPicker">
|
||||
<input class="formPickerInput" type="text" disabled="true" placeholder="请选择所在街道/小区" />
|
||||
<image class="formPickerBtn" src="../../static/icons/homeInfoMore.png" mode="aspectFit">
|
||||
</image>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">上传图片</view>
|
||||
<view class="formContainer">
|
||||
<view class="">
|
||||
<uni-file-picker :image-styles="{width: 80, height: 80}" v-model="imageValue"
|
||||
fileMediatype="image" limit="1" mode="grid" @select="select" @progress="progress"
|
||||
@success="success" @fail="fail">
|
||||
<image style="width: 160rpx;height: 160rpx;" src="../../static/icons/addImageIcon.png"
|
||||
mode="aspectFit"></image>
|
||||
</uni-file-picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="container">
|
||||
<VNavigationBar title-color="#333" background-color="#fff" title="信息填写"></VNavigationBar>
|
||||
<view class="body">
|
||||
<view class="formItem">
|
||||
<view class="formLabel">姓名</view>
|
||||
<view class="formContainer">
|
||||
<input placeholder="请填写你的真实姓名" v-model="formData.cusName" type="text"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">性别</view>
|
||||
<view class="formContainer">
|
||||
<radio-group name="group1" class="radioGroup" :bindchange="radioChange">
|
||||
<label class="radio" v-for="(item, index) in radioSexItems" :key="item.value">
|
||||
<radio activeBackgroundColor="#009EDA" :value="item.value" :checked="item.checked"/>
|
||||
{{item.name}}
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">身份证号</view>
|
||||
<view class="formContainer">
|
||||
<input placeholder="请填写你的身份证号" v-model="formData.idCard" type="text"/>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="formItem">-->
|
||||
<!-- <view class="formLabel">生日</view>-->
|
||||
<!-- <view class="formContainer">-->
|
||||
<!-- <picker mode="date" :value="formData.birthday" start="1900-01-01" end="2050-12-12" :bindchange="bindDateChange">-->
|
||||
<!-- </picker>-->
|
||||
<!-- </view>-->
|
||||
<!-- </view>-->
|
||||
<view class="formItem">
|
||||
<view class="formLabel">手机号</view>
|
||||
<view class="formContainer">
|
||||
<input placeholder="请填写你的手机号" v-model="formData.phoneNumber" type="text"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="formItem">
|
||||
<view class="formLabel">联系地址</view>
|
||||
<view class="formContainer">
|
||||
<textarea placeholder="请填写你的联系地址" v-model="formData.address" maxlength="300"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dl" @click="getlogin()">
|
||||
<text>注册</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VNavigationBar from '@/components/VNavigationBar.vue'
|
||||
import VNavigationBar from '@/components/VNavigationBar.vue'
|
||||
import request from "../../utils/request";
|
||||
import {
|
||||
setToken,
|
||||
} from '@/utils/auth.js'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VNavigationBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detailAddress: [
|
||||
['a', 'b'],
|
||||
['b', 'a']
|
||||
],
|
||||
addressRange: [
|
||||
['山东'],
|
||||
['济南'],
|
||||
['历下区']
|
||||
]
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
detailColumnChangeFun({
|
||||
detail
|
||||
}) {
|
||||
if (detail.column === 0) {
|
||||
// 动态配置第二列
|
||||
this.$set(this.detailAddress, 1, ['m', 'n'])
|
||||
}
|
||||
},
|
||||
addressColumnChangeFun({
|
||||
detail
|
||||
}) {
|
||||
if (detail.column === 0) {
|
||||
// 动态配置第二列
|
||||
this.$set(this.detailAddress, 1, ['济宁'])
|
||||
// 动态配置第三列
|
||||
this.$set(this.detailAddress, 2, ['任城'])
|
||||
} else if (detail.column === 1) {
|
||||
// 动态配置第三列
|
||||
this.$set(this.detailAddress, 2, ['任城'])
|
||||
}
|
||||
},
|
||||
// 获取上传状态
|
||||
select(e) {
|
||||
console.log('选择文件：', e)
|
||||
},
|
||||
// 获取上传进度
|
||||
progress(e) {
|
||||
console.log('上传进度：', e)
|
||||
},
|
||||
export default {
|
||||
components: {
|
||||
VNavigationBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
openId: "",
|
||||
cusName: "",
|
||||
sex: "",
|
||||
idCard:"",
|
||||
phoneNumber:"",
|
||||
address:"",
|
||||
},
|
||||
//性别
|
||||
radioSexItems: [
|
||||
{ name: '男', value: '0', checked: true },
|
||||
{ name: '女', value: '1', checked: false },
|
||||
],
|
||||
detailAddress: [
|
||||
['a', 'b'],
|
||||
['b', 'a']
|
||||
],
|
||||
addressRange: [
|
||||
['山东'],
|
||||
['济南'],
|
||||
['历下区']
|
||||
]
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
this.formData.openId = e.openId
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 注册
|
||||
*/
|
||||
async getlogin(){
|
||||
//校验表单填写
|
||||
if(this.checkForm()){
|
||||
//获取选的性别
|
||||
this.formData.sex = this.radioSexItems.filter(item => item.checked ===true)[0].value;
|
||||
await request({
|
||||
url: '/base/custom-app/register',
|
||||
method: 'post',
|
||||
data: this.formData
|
||||
}).then((res) => {
|
||||
if (res.code==200) {
|
||||
if(res.data.hasOwnProperty("accessToken")){
|
||||
setToken(res.data.accessToken)
|
||||
uni.reLaunch({
|
||||
url: '/pages/home/home'
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
checkForm(){
|
||||
if(""==this.formData.cusName){
|
||||
uni.showToast({
|
||||
title: '请填写姓名',
|
||||
icon: 'none'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if(""==this.formData.idCard || !this.isValidID(this.formData.idCard)){
|
||||
uni.showToast({
|
||||
title: '请填写正确的身份证号',
|
||||
icon: 'none'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if(""==this.formData.phoneNumber || !this.isValidPhoneNumber(this.formData.phoneNumber)){
|
||||
uni.showToast({
|
||||
title: '请填写手机号',
|
||||
icon: 'none'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if(""==this.formData.address){
|
||||
uni.showToast({
|
||||
title: '请填写联系地址',
|
||||
icon: 'none'
|
||||
})
|
||||
return false
|
||||
}
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 校验身份证号是否合法
|
||||
* @param id
|
||||
* @returns {boolean}
|
||||
*/
|
||||
isValidID(id) {
|
||||
const regex = /^[1-9]\d{5}(18|19|20|21|22)?\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}(\d|[Xx])$/;
|
||||
return regex.test(id);
|
||||
},
|
||||
/**
|
||||
* 校验手机号
|
||||
* @param phoneNumber
|
||||
* @returns {boolean}
|
||||
*/
|
||||
isValidPhoneNumber(phoneNumber) {
|
||||
const regex = /^1[3-9]\d{9}$/;
|
||||
return regex.test(phoneNumber);
|
||||
},
|
||||
bindDateChange(e) {
|
||||
this.formData.birthday = e.detail.value;
|
||||
},
|
||||
radioChange: function(e) {
|
||||
let radioItems = this.radioSexItems;
|
||||
for (let i = 0, len = radioItems.length; i < len; ++i) {
|
||||
radioItems[i].checked = radioItems[i].value === e.detail.value;
|
||||
}
|
||||
this.radioSexItems = radioItems;
|
||||
},
|
||||
submit() {
|
||||
this.$refs.form.validate().then(res => {
|
||||
console.log('表单数据信息：', res);
|
||||
}).catch(err => {
|
||||
console.log('表单错误信息：', err);
|
||||
})
|
||||
},
|
||||
detailColumnChangeFun({
|
||||
detail
|
||||
}) {
|
||||
if (detail.column === 0) {
|
||||
// 动态配置第二列
|
||||
this.$set(this.detailAddress, 1, ['m', 'n'])
|
||||
}
|
||||
},
|
||||
addressColumnChangeFun({
|
||||
detail
|
||||
}) {
|
||||
if (detail.column === 0) {
|
||||
// 动态配置第二列
|
||||
this.$set(this.detailAddress, 1, ['济宁'])
|
||||
// 动态配置第三列
|
||||
this.$set(this.detailAddress, 2, ['任城'])
|
||||
} else if (detail.column === 1) {
|
||||
// 动态配置第三列
|
||||
this.$set(this.detailAddress, 2, ['任城'])
|
||||
}
|
||||
},
|
||||
// 获取上传状态
|
||||
select(e) {
|
||||
console.log('选择文件：', e)
|
||||
},
|
||||
// 获取上传进度
|
||||
progress(e) {
|
||||
console.log('上传进度：', e)
|
||||
},
|
||||
|
||||
// 上传成功
|
||||
success(e) {
|
||||
console.log('上传成功')
|
||||
},
|
||||
// 上传成功
|
||||
success(e) {
|
||||
console.log('上传成功')
|
||||
},
|
||||
|
||||
// 上传失败
|
||||
fail(e) {
|
||||
console.log('上传失败：', e)
|
||||
}
|
||||
}
|
||||
}
|
||||
// 上传失败
|
||||
fail(e) {
|
||||
console.log('上传失败：', e)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.body {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
overflow: auto;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
.body {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
overflow: auto;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.formItem {
|
||||
padding: 40rpx 0;
|
||||
margin: 0 32rpx;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
}
|
||||
.formItem {
|
||||
padding: 40rpx 0;
|
||||
margin: 0 32rpx;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
}
|
||||
|
||||
.formLabel {
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
.formLabel {
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.radioGroup {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 100rpx;
|
||||
}
|
||||
.radioGroup {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 100rpx;
|
||||
}
|
||||
|
||||
.radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
}
|
||||
.radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
}
|
||||
|
||||
/* #ifdef MP-WEIXIN */
|
||||
radio {
|
||||
filter: hue-rotate(90deg);
|
||||
}
|
||||
/* #ifdef MP-WEIXIN */
|
||||
radio {
|
||||
filter: hue-rotate(90deg);
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.formPicker {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
}
|
||||
/* #endif */
|
||||
.formPicker {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
}
|
||||
|
||||
.formPickerInput {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
.formPickerInput {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.formPickerBtn {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
.formPickerBtn {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
.dl {
|
||||
width: 90%;
|
||||
height: 44px;
|
||||
background: linear-gradient(-46deg, #0853C4 0%, #4282D8 80%);
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 22px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,9 +26,9 @@ const request = config => {
|
||||
const isTanantId = (config.headers || {}).isTanantId === false
|
||||
config.header = config.header || {}
|
||||
if(getTenantId() && !isTanantId){
|
||||
config.header['Tenant-Id'] = getTenantId()
|
||||
config.header['tenant-id'] = getTenantId()
|
||||
}
|
||||
config.header['Tenant-Id'] = 180
|
||||
config.header['tenant-id'] = 180
|
||||
console.log(config.header,424242);
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
@ -41,7 +41,7 @@ console.log(config.header,424242);
|
||||
}).then(response => {
|
||||
// debugger
|
||||
let res = response
|
||||
|
||||
|
||||
const code = res.data.code || 200
|
||||
const msg = errorCode[code] || res.data.msg || errorCode['default']
|
||||
if (code === 401) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user