|
@@ -1,61 +1,72 @@
|
|
<template>
|
|
<template>
|
|
- <view class="ezy-login-page">
|
|
|
|
- <view class="ezy-login-wrap" >
|
|
|
|
|
|
+ <view class="ezy-login-page">
|
|
|
|
+ <view class="ezy-login-wrap">
|
|
<!-- 手机号 -->
|
|
<!-- 手机号 -->
|
|
- <view class="login-body-box">
|
|
|
|
- <view class="index-title-img"></view>
|
|
|
|
- <view class="phone-input-box">
|
|
|
|
- <view class="phone-prefix">+86</view>
|
|
|
|
- <input class="phone-input" type="text" v-model="indexData.phoneNumber" placeholder="请输入手机号"
|
|
|
|
|
|
+ <view class="login-body-box">
|
|
|
|
+ <view class="index-title-img"></view>
|
|
|
|
+ <view class="phone-input-box">
|
|
|
|
+ <view class="phone-prefix">+86</view>
|
|
|
|
+ <input class="phone-input" type="text" v-model="indexData.phoneNumber" placeholder="请输入手机号"
|
|
maxlength="11" @input="clearTelInput" />
|
|
maxlength="11" @input="clearTelInput" />
|
|
- <view class="close-btn" v-if="indexData.clearTelIcon" @click="clearTel"></view>
|
|
|
|
- </view>
|
|
|
|
- <!-- 协议勾选框和按钮 -->
|
|
|
|
- <view class="agreement-checkbox-box">
|
|
|
|
- <checkbox-group @change="handleAgreementChange">
|
|
|
|
- <checkbox class="agreement-checkbox-input" color="#FFFFFF" value="agree" :checked="indexData.isAgreed"/>
|
|
|
|
- </checkbox-group>
|
|
|
|
- <view class="agreement-text-box">
|
|
|
|
- 我已阅读并同意<view class="agreement-text" @click="agreeBtn">《用户协议》</view>和<view @click="agreeBtn" class="agreement-text">《隐私政策》</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="login-btn" @click="getYzmBtn" :class="indexData.telStatus"></view>
|
|
|
|
|
|
+ <view class="close-btn" v-if="indexData.clearTelIcon" @click="clearTel"></view>
|
|
</view>
|
|
</view>
|
|
- <view class="bottom-btn-box">
|
|
|
|
- <view class="wx-btn"></view>
|
|
|
|
- <view class="yk-btn" @click="ykBtn"></view>
|
|
|
|
|
|
+ <!-- 协议勾选框和按钮 -->
|
|
|
|
+ <view class="agreement-checkbox-box">
|
|
|
|
+ <checkbox-group @change="handleAgreementChange">
|
|
|
|
+ <checkbox class="agreement-checkbox-input" color="#FFFFFF" value="agree"
|
|
|
|
+ :checked="indexData.isAgreed" />
|
|
|
|
+ </checkbox-group>
|
|
|
|
+ <view class="agreement-text-box">
|
|
|
|
+ 我已阅读并同意<view class="agreement-text" @click="agreeBtn">《用户协议》</view>和<view @click="agreeBtn"
|
|
|
|
+ class="agreement-text">《隐私政策》</view>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
|
|
+ <view class="login-btn" @click="getYzmBtn" :class="indexData.telStatus"></view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="bottom-btn-box">
|
|
|
|
+ <view class="wx-btn" @click="wxLoginClick"></view>
|
|
|
|
+ <view class="yk-btn" @click="ykBtn"></view>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
- <agree-content-dialog ref="agreeContentDialogRef"></agree-content-dialog>
|
|
|
|
- <agree-dialog ref="agreeDialogRef" @confirm-btn="confirmBtn"></agree-dialog>
|
|
|
|
- </view>
|
|
|
|
|
|
+ <agree-content-dialog ref="agreeContentDialogRef"></agree-content-dialog>
|
|
|
|
+ <agree-dialog ref="agreeDialogRef" @confirm-btn="confirmBtn"></agree-dialog>
|
|
|
|
+ </view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
- import {ref,reactive} from "vue"
|
|
|
|
- import { onLoad,onReady } from '@dcloudio/uni-app';
|
|
|
|
|
|
+ import {
|
|
|
|
+ ref,
|
|
|
|
+ reactive
|
|
|
|
+ } from "vue"
|
|
|
|
+ import {
|
|
|
|
+ onLoad,
|
|
|
|
+ onReady
|
|
|
|
+ } from '@dcloudio/uni-app';
|
|
import agreeContentDialog from './agreeContentDialog.vue';
|
|
import agreeContentDialog from './agreeContentDialog.vue';
|
|
import agreeDialog from './agreeDialog.vue'
|
|
import agreeDialog from './agreeDialog.vue'
|
|
-
|
|
|
|
|
|
+ import {
|
|
|
|
+ wxLogin,
|
|
|
|
+ } from "@/api/login.js"
|
|
|
|
+import { error } from "uview-plus";
|
|
let indexData = reactive({
|
|
let indexData = reactive({
|
|
phoneNumber: null,
|
|
phoneNumber: null,
|
|
clearTelIcon: false,
|
|
clearTelIcon: false,
|
|
- telStatus:'tel-btn-disabled',
|
|
|
|
|
|
+ telStatus: 'tel-btn-disabled',
|
|
isAgreed: false,
|
|
isAgreed: false,
|
|
- sliderObj:{},
|
|
|
|
|
|
+ sliderObj: {},
|
|
})
|
|
})
|
|
const agreeContentDialogRef = ref(null);
|
|
const agreeContentDialogRef = ref(null);
|
|
const agreeDialogRef = ref(null);
|
|
const agreeDialogRef = ref(null);
|
|
|
|
|
|
onLoad((options) => {})
|
|
onLoad((options) => {})
|
|
-
|
|
|
|
|
|
+
|
|
const getYzmBtn = () => {
|
|
const getYzmBtn = () => {
|
|
- if(indexData.telStatus === 'tel-btn-normal'){
|
|
|
|
- if(indexData.isAgreed === true){
|
|
|
|
|
|
+ if (indexData.telStatus === 'tel-btn-normal') {
|
|
|
|
+ if (indexData.isAgreed === true) {
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
url: `/pages/login/login?telNum=${indexData.phoneNumber}`
|
|
url: `/pages/login/login?telNum=${indexData.phoneNumber}`
|
|
})
|
|
})
|
|
- }else{
|
|
|
|
|
|
+ } else {
|
|
agreeDialogRef.value.handleShow();
|
|
agreeDialogRef.value.handleShow();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -67,42 +78,73 @@
|
|
}
|
|
}
|
|
// 手机号校验规则
|
|
// 手机号校验规则
|
|
const validatePhoneNumber = (value) => {
|
|
const validatePhoneNumber = (value) => {
|
|
- const phoneRegex = /^1[3-9]\d{9}$/;
|
|
|
|
- if (phoneRegex.test(value)) {
|
|
|
|
- indexData.telStatus = 'tel-btn-normal';
|
|
|
|
- } else {
|
|
|
|
- indexData.telStatus = 'tel-btn-disabled';
|
|
|
|
- }
|
|
|
|
|
|
+ const phoneRegex = /^1[3-9]\d{9}$/;
|
|
|
|
+ if (phoneRegex.test(value)) {
|
|
|
|
+ indexData.telStatus = 'tel-btn-normal';
|
|
|
|
+ } else {
|
|
|
|
+ indexData.telStatus = 'tel-btn-disabled';
|
|
|
|
+ }
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
const clearTelInput = (event) => {
|
|
const clearTelInput = (event) => {
|
|
- if (event.detail.value.length > 0) {
|
|
|
|
- indexData.clearTelIcon = true;
|
|
|
|
|
|
+ if (event.detail.value.length > 0) {
|
|
|
|
+ indexData.clearTelIcon = true;
|
|
validatePhoneNumber(event.detail.value);
|
|
validatePhoneNumber(event.detail.value);
|
|
- } else {
|
|
|
|
- indexData.clearTelIcon = false;
|
|
|
|
- }
|
|
|
|
|
|
+ } else {
|
|
|
|
+ indexData.clearTelIcon = false;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
const clearTel = () => {
|
|
const clearTel = () => {
|
|
indexData.phoneNumber = '';
|
|
indexData.phoneNumber = '';
|
|
indexData.telStatus = 'tel-btn-disabled';
|
|
indexData.telStatus = 'tel-btn-disabled';
|
|
indexData.clearTelIcon = false;
|
|
indexData.clearTelIcon = false;
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
const agreeBtn = () => {
|
|
const agreeBtn = () => {
|
|
agreeContentDialogRef.value.handleShow();
|
|
agreeContentDialogRef.value.handleShow();
|
|
};
|
|
};
|
|
|
|
|
|
- const handleAgreementChange= (event) => {
|
|
|
|
- if(event.detail.value[0]==='agree'){
|
|
|
|
|
|
+ const handleAgreementChange = (event) => {
|
|
|
|
+ if (event.detail.value[0] === 'agree') {
|
|
indexData.isAgreed = true;
|
|
indexData.isAgreed = true;
|
|
- }else{
|
|
|
|
|
|
+ } else {
|
|
indexData.isAgreed = false;
|
|
indexData.isAgreed = false;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
// 游客登录
|
|
// 游客登录
|
|
const ykBtn = () => {
|
|
const ykBtn = () => {
|
|
- uni.redirectTo({url:`/pages/selectGradesTerms/index`})
|
|
|
|
|
|
+ uni.redirectTo({
|
|
|
|
+ url: `/pages/selectGradesTerms/index`
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ const wxLoginClick = () => {
|
|
|
|
+ console.log('11111');
|
|
|
|
+ uni.login({
|
|
|
|
+ "provider": "weixin",
|
|
|
|
+ "onlyAuthorize": true, // 微信登录仅请求授权认证
|
|
|
|
+ success: function(event) {
|
|
|
|
+ console.log(event);
|
|
|
|
+ const {
|
|
|
|
+ code
|
|
|
|
+ } = event
|
|
|
|
+ //客户端成功获取授权临时票据(code),向业务服务器发起登录请求。
|
|
|
|
+ let req = {
|
|
|
|
+ "apple": false,
|
|
|
|
+ "code": code
|
|
|
|
+ }
|
|
|
|
+ wxLogin(req).then(res => {
|
|
|
|
+ console.log(res);
|
|
|
|
+ }).catch((error)=>{
|
|
|
|
+ console.log(error);
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ fail: function(err) {
|
|
|
|
+ console.log(err);
|
|
|
|
+ // 登录授权失败
|
|
|
|
+ // err.code是错误码
|
|
|
|
+ }
|
|
|
|
+ })
|
|
}
|
|
}
|
|
-</script>
|
|
|
|
|
|
+</script>
|