From 9ce28811e94fa042adb7cabe6581b0393c6d576d Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期一, 09 十二月 2024 18:17:11 +0800
Subject: [PATCH] ll
---
h5/pages/login.vue | 496 +++++++++++++++++++++++++++++++-----------------------
1 files changed, 283 insertions(+), 213 deletions(-)
diff --git a/h5/pages/login.vue b/h5/pages/login.vue
index 4c32dbc..bfa5c86 100644
--- a/h5/pages/login.vue
+++ b/h5/pages/login.vue
@@ -1,213 +1,283 @@
-<template>
- <view class="login">
- <view class="login_title">娆㈣繋鐧诲綍</view>
- <view class="login_title login_title2">闃滃畞鏂囦綋涓績</view>
- <view class="login_list">
- <view class="login_list_item">
- <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
- <input v-model="form.phone" maxlength="18" placeholder="璇疯緭鍏ユ墜鏈哄彿" />
- </view>
-<!-- <view class="login_list_item">
- <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
- <input v-model="form.password" type="password" placeholder="瀵嗙爜" />
- </view> -->
- <view class="login_list_item">
- <image src="@/static/login_ic_password@2x.png" mode="widthFix"></image>
- <input v-model="form.code" placeholder="璇疯緭鍏ラ獙璇佺爜" type="text" />
- <view v-if="downTime == 0" class="btn" @click="sendSms">鑾峰彇楠岃瘉鐮�</view>
- <view v-else class="btn gray">{{ downTime }}</view>
- </view>
- </view>
- <view class="login_btn">
- <view class="login_btn_n" @click="onLogin">鐧诲綍</view>
- </view>
- </view>
-</template>
-
-<script>
-import { loginPost, getUserInfo, sendSMsPost } from '@/api'
-import { mapState, mapMutations } from 'vuex'
-export default {
- name: 'login',
-
- data() {
- return {
- form: {
- phone: '18888888888',
- code: '1'
- },
- downTime: 0
- }
- },
-
- onLoad() {
- },
- onBackPress(options) {
- uni.redirectTo({
- url: '/pages/login/login'
- })
- return true
- },
- methods: {
- ...mapMutations(["setToken", "setUserInfo"]),
- sendSms() {
- this.downTime = 60
- let timer = setInterval(() => {
- if(this.downTime == 0) return clearInterval(timer)
- this.downTime = this.downTime - 1
- }, 1000)
- const { form } = this
- sendSMsPost({
- phone: form.phone,
- type: 0
- }).then(res => {
- this.showToast('鐭俊鍙戦�佹垚鍔�')
- })
- },
- onLogin() {
- const { form, ProtocolFlag } = this
- // if (!ProtocolFlag) return uni.showToast({
- // title: '璇峰厛闃呰骞跺悓鎰忕敤鎴峰崗璁�',
- // icon: 'none'
- // })
- if (!form.phone) return uni.showToast({
- title: '鎵嬫満鍙蜂笉鑳戒负绌�',
- icon: 'none'
- })
- if (!form.code) return uni.showToast({
- title: '楠岃瘉鐮佷笉鑳戒负绌�',
- icon: 'none'
- })
- loginPost({
- ...form,
- openId: this.$store.state.openId
- }).then(res => {
- if (res.code === 200) {
- this.setToken(res.data)
- this.showToast('鐧诲綍鎴愬姛')
- getUserInfo().then(ress => {
- this.setUserInfo(ress.data)
- uni.redirectTo({
- url: "/pages/index"
- })
- })
- }
- })
- }
- }
-}
-</script>
-
-<style lang="scss" scoped>
-.login {
- width: 100%;
- height: 100vh;
- display: flex;
- padding-top: 130rpx;
- box-sizing: border-box;
- align-items: center;
- flex-direction: column;
- background: linear-gradient( 180deg, #C5DDFF 0%, #FFFFFF 100%);
- .login_title {
- font-weight: 500;
- font-size: 52rpx;
- color: #222222;
- margin-top: 180rpx;
- width: 100%;
- padding-left: 60rpx;
- }
- .login_title2{
- margin-top: 10rpx;
- margin-bottom: 80rpx;
- }
- .login_list {
- width: 100%;
- padding: 0 60rpx;
- box-sizing: border-box;
- .login_list_item {
- width: 100%;
- border-radius: 50rpx;
- height: 98rpx;
- padding: 0 40rpx;
- box-sizing: border-box;
- background: #ffffff;
- margin-bottom: 40rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- &:last-child {
- margin-bottom: 0 !important;
- }
- image {
- flex-shrink: 0;
- width: 40rpx;
- height: 40rpx;
- }
- .btn{
- width: 145rpx;
- color: $primaryColor;
- text-align: center;
- }
- .gray{
- color: #999999;
- }
- input {
- flex: 1;
- height: 100%;
- color: #666666;
- margin-left: 24rpx;
- border: none;
- }
- }
- }
- .login_btn {
- width: 100%;
- padding: 0 60rpx;
- box-sizing: border-box;
- margin-top: 60rpx;
- .for_psd {
- color: $uni-color-primary;
- width: 140rpx;
- text-align: center;
- margin: 40rpx auto;
- }
- .login_btn_n {
- width: 100%;
- height: 98rpx;
- background: $uni-color-primary;
- box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(39, 155, 170, 0.2);
- display: flex;
- align-items: center;
- justify-content: center;
- color: #ffffff;
- border-radius: 50rpx;
- font-weight: 500;
- font-size: 32rpx;
- }
- }
- .deal_wrap {
- position: absolute;
- width: 100%;
- left: 0;
- text-align: center;
- bottom: 88rpx;
- display: flex;
- justify-content: center;
- align-items: center;
- .deal {
- color: $uni-color-primary;
- }
- .checked {
- width: 48rpx;
- margin-right: 12rpx;
- }
- }
-}
-.modal {
- width: 690rpx;
- min-height: 920rpx;
- max-height: 720px;
- border-radius: 24rpx;
- padding: 32rpx;
-}
-</style>
+<template>
+ <view class="login">
+ <view class="login_title">娆㈣繋鐧诲綍</view>
+ <view class="login_title login_title2">闃滃畞鏂囦綋涓績</view>
+ <view class="login_list">
+ <view class="login_list_item">
+ <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
+ <input v-model="form.phone" maxlength="18" placeholder="璇疯緭鍏ユ墜鏈哄彿" />
+ </view>
+ <!-- <view class="login_list_item">
+ <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
+ <input v-model="form.password" type="password" placeholder="瀵嗙爜" />
+ </view> -->
+ <view class="login_list_item">
+ <image src="@/static/login_ic_password@2x.png" mode="widthFix"></image>
+ <input v-model="form.code" placeholder="璇疯緭鍏ラ獙璇佺爜" type="text" />
+ <view v-if="downTime == 0" class="btn" @click="sendSms">鑾峰彇楠岃瘉鐮�</view>
+ <view v-else class="btn gray">{{ downTime }}</view>
+ </view>
+ </view>
+ <view class="login_btn">
+ <view class="login_btn_n" @click="onLogin">鐧诲綍</view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import {
+ loginPost,
+ getUserInfo,
+ sendSMsPost,
+ ywWxAuthorize
+ } from '@/api'
+ import {
+ mapState,
+ mapMutations
+ } from 'vuex'
+ export default {
+ name: 'login',
+
+ data() {
+ return {
+ form: {
+ phone: '',
+ code: ''
+ },
+ downTime: 0,
+ // code: '011dfEkl2PzcFe4ZxSnl22NKXz4dfEkQ'
+ code: ''
+ }
+ },
+
+ onShow() {
+ // return
+ var that = this
+ let url = window.location.href
+ if (url.indexOf('code=') !== -1 || this.code) {
+ let code = ''
+ const query = url.split('?')
+ for (const q of query) {
+ if (q.indexOf('code=') !== -1) {
+ let statusIndex = q.indexOf('&state')
+ code = q.substring(q.indexOf('code=') + 5, statusIndex)
+ }
+ }
+ ywWxAuthorize({
+ code: code || this.code
+ }).then(res => {
+ if (res.code === 200) {
+ that.$store.commit('setOpenId', res.data.openid)
+ if (res.data.token && res.data.token != '') {
+ that.$store.commit('setToken', res.data.token)
+ getUserInfo().then(ress => {
+ that.$store.commit('setUserInfo', ress.data)
+ })
+ setTimeout(() => {
+ uni.redirectTo({
+ url: "/pages/index"
+ })
+ }, 300)
+ }
+ }
+ })
+ } else {
+ let url = 'https://zhcg.fnwtzx.com/yunwei_h5'
+ const appID = 'wx95ac1efb67f0330d'
+ let uri = encodeURIComponent(url)
+ let authURL =
+ `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appID}&redirect_uri=${uri}&response_type=code&scope=snsapi_base#wechat_redirect`
+ window.location.href = authURL
+ }
+
+ },
+ // onBackPress(options) {
+ // uni.redirectTo({
+ // url: '/pages/login/login'
+ // })
+ // return true
+ // },
+ methods: {
+ ...mapMutations(["setToken", "setUserInfo"]),
+ onLogin() {
+ const {
+ form,
+ ProtocolFlag
+ } = this
+ if (!form.phone) return uni.showToast({
+ title: '鎵嬫満鍙蜂笉鑳戒负绌�',
+ icon: 'none'
+ })
+ if (!form.code) return uni.showToast({
+ title: '楠岃瘉鐮佷笉鑳戒负绌�',
+ icon: 'none'
+ })
+
+ loginPost({
+ ...form,
+ openid: this.$store.state.openId
+ }).then(res => {
+ if (res.code === 200) {
+ this.setToken(res.data)
+ this.showToast('鐧诲綍鎴愬姛')
+ getUserInfo().then(ress => {
+ this.setUserInfo(ress.data)
+ uni.redirectTo({
+ url: "/pages/index"
+ })
+ })
+ }
+ })
+
+
+
+ },
+ sendSms() {
+ this.downTime = 60
+ let timer = setInterval(() => {
+ if (this.downTime == 0) return clearInterval(timer)
+ this.downTime = this.downTime - 1
+ }, 1000)
+ const {
+ form
+ } = this
+ sendSMsPost({
+ phone: form.phone,
+ type: 0
+ }).then(res => {
+ this.showToast('鐭俊鍙戦�佹垚鍔�')
+ })
+ },
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .login {
+ width: 100%;
+ height: 100vh;
+ display: flex;
+ padding-top: 130rpx;
+ box-sizing: border-box;
+ align-items: center;
+ flex-direction: column;
+ background: linear-gradient(180deg, #C5DDFF 0%, #FFFFFF 100%);
+
+ .login_title {
+ font-weight: 500;
+ font-size: 52rpx;
+ color: #222222;
+ margin-top: 180rpx;
+ width: 100%;
+ padding-left: 60rpx;
+ }
+
+ .login_title2 {
+ margin-top: 10rpx;
+ margin-bottom: 80rpx;
+ }
+
+ .login_list {
+ width: 100%;
+ padding: 0 60rpx;
+ box-sizing: border-box;
+
+ .login_list_item {
+ width: 100%;
+ border-radius: 50rpx;
+ height: 98rpx;
+ padding: 0 40rpx;
+ box-sizing: border-box;
+ background: #ffffff;
+ margin-bottom: 40rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ &:last-child {
+ margin-bottom: 0 !important;
+ }
+
+ image {
+ flex-shrink: 0;
+ width: 40rpx;
+ height: 40rpx;
+ }
+
+ .btn {
+ width: 145rpx;
+ color: $primaryColor;
+ text-align: center;
+ }
+
+ .gray {
+ color: #999999;
+ }
+
+ input {
+ flex: 1;
+ height: 100%;
+ color: #666666;
+ margin-left: 24rpx;
+ border: none;
+ }
+ }
+ }
+
+ .login_btn {
+ width: 100%;
+ padding: 0 60rpx;
+ box-sizing: border-box;
+ margin-top: 60rpx;
+
+ .for_psd {
+ color: $uni-color-primary;
+ width: 140rpx;
+ text-align: center;
+ margin: 40rpx auto;
+ }
+
+ .login_btn_n {
+ width: 100%;
+ height: 98rpx;
+ background: $uni-color-primary;
+ box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(39, 155, 170, 0.2);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #ffffff;
+ border-radius: 50rpx;
+ font-weight: 500;
+ font-size: 32rpx;
+ }
+ }
+
+ .deal_wrap {
+ position: absolute;
+ width: 100%;
+ left: 0;
+ text-align: center;
+ bottom: 88rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .deal {
+ color: $uni-color-primary;
+ }
+
+ .checked {
+ width: 48rpx;
+ margin-right: 12rpx;
+ }
+ }
+ }
+
+ .modal {
+ width: 690rpx;
+ min-height: 920rpx;
+ max-height: 720px;
+ border-radius: 24rpx;
+ padding: 32rpx;
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.3