From d1399868aa72b2cc75725e74500936b33de49910 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期一, 06 一月 2025 18:15:05 +0800
Subject: [PATCH] ll
---
h5/pages/driver/login.vue | 209 +++++++++++++++++++++++++++++++++++++--------------
1 files changed, 150 insertions(+), 59 deletions(-)
diff --git a/h5/pages/driver/login.vue b/h5/pages/driver/login.vue
index 99240e5..28c5d00 100644
--- a/h5/pages/driver/login.vue
+++ b/h5/pages/driver/login.vue
@@ -3,18 +3,44 @@
<image class="login_bg" src="@/static/login_bg@2x.png" mode="widthFix" />
<image class="login_logo" src="@/static/logo@2x.png" mode="widthFix" />
<view class="login_title">瀹夋嘲鐗╂祦鏅烘収鍥尯</view>
- <view class="login_title">鐗╂祦杞﹀徃鏈虹櫥褰�</view>
+ <view class="login_title">鐗╂祦杞﹀徃鏈虹櫥褰�</view>
+ <view class="tabs">
+ <view class="tab" @click="tabsClick(0)" :class="{active: activeTab == 0 }"><view>璐﹀彿鐧诲綍</view><view class="bor"></view></view>
+ <view class="tab" @click="tabsClick(1)" :class="{active: activeTab == 1 }"><view>楠岃瘉鐮佺櫥褰�</view><view class="bor"></view></view>
+ </view>
<view class="login_list">
- <view class="login_list_item">
- <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
- <input v-model="form.username" type="tel" @focus="showKeyboard = true" @blur="showKeyboard = false"
- maxlength="18" placeholder="鎵嬫満鍙�" />
- </view>
- <view class="login_list_item">
- <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
- <input v-model="form.password" @focus="showKeyboard = true" @blur="showKeyboard = false" type="password"
- placeholder="瀵嗙爜" />
- </view>
+ <template v-if="activeTab == 0">
+ <view class="login_list_item">
+ <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
+ <input v-model="form.username" type="tel" @focus="showKeyboard = true" @blur="showKeyboard = false"
+ maxlength="18" placeholder="璐﹀彿" />
+ </view>
+ <view class="login_list_item">
+ <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
+ <input v-model="form.password" @focus="showKeyboard = true" @blur="showKeyboard = false" type="password"
+ placeholder="瀵嗙爜" />
+ </view>
+ </template>
+ <template v-else>
+ <view class="login_list_item">
+ <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
+ <input v-model="form.phone" type="tel" @focus="showKeyboard = true" @blur="showKeyboard = false"
+ :maxlength="18" placeholder="鎵嬫満鍙�" />
+ </view>
+ <view class="login_list_item">
+ <image src="@/static/ic_captcha.png" mode="widthFix"></image>
+ <input
+ v-model="form.code"
+ placeholder="璇疯緭鍏ラ獙璇佺爜"
+ :maxlength="6"
+ type="number"
+ />
+ <text class="captcha" v-if="countDown == 0" @click="initCaptcha"
+ >鑾峰彇楠岃瘉鐮�</text
+ >
+ <text class="placeholder9" v-else>{{ countDown }}</text>
+ </view>
+ </template>
</view>
<view class="login_btn">
<view class="login_btn_n" @click="onLogin">绔嬪嵆鐧诲綍</view>
@@ -32,7 +58,9 @@
import {
driverLogin,
loginCaptcha,
- getUserInfo
+ getUserInfo,
+ sendSms,
+ loginDriverByPhone
} from '@/api'
import {
mapState,
@@ -42,18 +70,19 @@
data() {
return {
form: {
- username: '',
- password: ''
+ username: null,
+ phone: null,
+ password: null
},
isShowProtocol: false,
showKeyboard: false,
countDown: 0,
+ activeTab: 0,
ywinfo: {}
}
},
onLoad() {
- this.initCaptcha()
const ywinfo = uni.getStorageSync('ywinfo') || {}
if (ywinfo.ywid && ywinfo.type == 0) {
this.ywinfo = ywinfo
@@ -61,60 +90,96 @@
}
},
- methods: {
+ methods: {
+ onLogin() {
+ const {
+ form,activeTab
+ } = this
+ if(activeTab == 0){
+ if (!form.username) return uni.showToast({
+ title: '璐﹀彿涓嶈兘涓虹┖',
+ icon: 'none'
+ })
+ if (!form.password) return uni.showToast({
+ title: '瀵嗙爜涓嶈兘涓虹┖',
+ icon: 'none'
+ })
+ }else{
+ if (!form.phone) return uni.showToast({
+ title: '鎵嬫満鍙蜂笉鑳戒负绌�',
+ icon: 'none'
+ })
+ if (!form.code) return uni.showToast({
+ title: '楠岃瘉鐮佷笉鑳戒负绌�',
+ icon: 'none'
+ })
+ }
+ let fn = activeTab == 0 ? driverLogin : loginDriverByPhone
+ fn({
+ ...form,
+ openid: this.$store.state.openId,
+ }).then(res => {
+ if (res.code === 200) {
+ this.setToken(res.data)
+ getUserInfo().then(ress => {
+ setTimeout(() => {
+ this.showToast('鐧诲綍鎴愬姛')
+ })
+ uni.setStorageSync('ywinfo', this.ywinfo)
+ this.setDriverInfo(ress.data)
+ uni.redirectTo({
+ url: "/pages/driver/index"
+ })
+ })
+ }
+ })
+ },
...mapMutations(["setToken", "setDriverInfo"]),
handleRegister() {
uni.navigateTo({
url: "/pages/driver/register"
})
+ },
+ tabsClick(val) {
+ this.activeTab = val
+ if(val == 0){
+ this.form.username = this.form.username || this.form.phone
+ this.form.phone = null
+ this.form.code = null
+ }else{
+ this.form.phone = this.form.username || this.form.phone
+ this.form.password = null
+ this.form.username = null
+ }
},
- handleSetPsd() {
- uni.navigateTo({
- url: "/pages/driver/forgetPsd?phone=" + this.form.username
- })
+ handleSetPsd() {
+ if(this.form.username || this.form.phone){
+ uni.navigateTo({
+ url: "/pages/driver/forgetPsd?phone=" + this.form.username || this.form.phone || ''
+ })
+ }else{
+ uni.navigateTo({
+ url: "/pages/driver/forgetPsd"
+ })
+ }
+
},
dealChange(e) {
console.log(e)
},
initCaptcha() {
- loginCaptcha().then(res => {
- this.captcha = res.data
+ if (!this.form.phone) return uni.showToast({
+ title: '鎵嬫満鍙蜂笉鑳戒负绌�',
+ icon: 'none'
+ })
+ sendSms({ phone: this.form.phone }).then(res => {
+ this.countDown = 60
+ setInterval(() => {
+ if (this.countDown == 0) return
+ this.countDown--
+ }, 1000)
})
},
-
- onLogin() {
- const {
- form
- } = this
- if (!form.username) return uni.showToast({
- title: '鎵嬫満鍙蜂笉鑳戒负绌�',
- icon: 'none'
- })
- if (!form.password) return uni.showToast({
- title: '瀵嗙爜涓嶈兘涓虹┖',
- icon: 'none'
- })
- driverLogin({
- ...form,
- uuid: this.captcha.uuid,
- openid: this.$store.state.openId,
- code: '1'
- }).then(res => {
- if (res.code === 200) {
- this.setToken(res.data)
- getUserInfo().then(ress => {
- setTimeout(() => {
- this.showToast('鐧诲綍鎴愬姛')
- })
- uni.setStorageSync('ywinfo', this.ywinfo)
- this.setDriverInfo(ress.data)
- uni.redirectTo({
- url: "/pages/driver/index"
- })
- })
- }
- })
- }
}
}
</script>
@@ -150,9 +215,34 @@
font-weight: 600;
color: #333333;
}
-
+ .tabs{
+ display: flex;
+ align-items: center;
+ justify-content: space-evenly;
+ width: 530rpx;
+ margin: 48rpx auto 0rpx;
+ .tab{
+ font-size: 30rpx;
+ color: #666666;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ height: 52rpx;
+ line-height: 36rpx;
+ }
+ .active{
+ font-weight: bold;
+ font-size: 34rpx;
+ color: #222222;
+ .bor{
+ width: 80rpx;
+ height: 8rpx;
+ background: linear-gradient(to bottom, #4d99a8, #a3c8d4);
+ }
+ }
+ }
.login_list {
- margin-top: 60rpx;
+ margin-top: 36rpx;
width: 100%;
padding: 0 60rpx;
box-sizing: border-box;
@@ -180,7 +270,8 @@
}
.captcha {
- color: $uni-color-primary;
+ color: $uni-color-primary;
+ font-size: 30rpx;
}
input {
--
Gitblit v1.9.3