From f26f29d84e0a68831a6af14dab3eec5500496d2e Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期三, 28 五月 2025 16:48:52 +0800
Subject: [PATCH] 初始化项目
---
pages/sys/login/smsCode.vue | 214 +++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 214 insertions(+), 0 deletions(-)
diff --git a/pages/sys/login/smsCode.vue b/pages/sys/login/smsCode.vue
new file mode 100644
index 0000000..4537333
--- /dev/null
+++ b/pages/sys/login/smsCode.vue
@@ -0,0 +1,214 @@
+<template>
+ <view>
+ <view class="list">
+ <view class="list-call">
+ <u-icon class="u-icon" size="40" name="account"></u-icon>
+ <input class="u-input" type="text" v-model="model.mobile" maxlength="32"
+ :placeholder="$t('login.placeholderMobile')" />
+ </view>
+ <view class="list-call">
+ <u-icon class="u-icon" size="40" name="coupon"></u-icon>
+ <input class="u-input" type="text" v-model="model.code" maxlength="4" placeholder="鎵嬫満楠岃瘉鐮�" />
+ <u-button :disabled="smsCodeBtnDisabled" @click="getSmsCode">
+ <text v-if="!smsCodeBtnDisabled">鑾峰彇楠岃瘉鐮�</text>
+ <text v-else>{{
+ `閲嶆柊鍙戦�� (${codeSeconds})`
+ }}
+ </text>
+ </u-button>
+
+ </view>
+ <view class="button" hover-class="button-hover" @click="toLogin">
+ <text>缁戝畾鐢ㄦ埛</text>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import moment from '@/common/moment';
+
+ export default {
+ name: 'smsCode',
+ data() {
+ return {
+ smsCodeBtnDisabled: false, //楠岃瘉鐮佹寜閽�
+ codeSeconds: 0, // 楠岃瘉鐮佸彂閫佹椂闂撮棿闅�
+ model: {
+ mobile: '',
+ code: ''
+ }, //缁戝畾鐨勬墜鏈哄彿銆侀獙璇佺爜鏁版嵁
+ };
+ },
+ onLoad() {
+ //楠岃瘉鐮佸彂閫侀棿闅�
+ const time = moment().valueOf() / 1000 - uni.getStorageSync('loginSmsCodeTime');
+
+ //鏄惁鍏佽閲嶆柊鍙戦�侀獙璇佺爜
+ if (time < 60) {
+ this.codeSeconds = 60 - parseInt(time, 10);
+ this.handleSmsCodeTime(this.codeSeconds);
+ } else {
+ this.codeSeconds = 60
+ this.smsCodeBtnDisabled = false;
+ uni.removeStorageSync('loginSmsCodeTime');
+ }
+ },
+ methods: {
+ // 鍙戦�侀獙璇佺爜骞惰繘鍏ュ�掕鏃�
+ getSmsCode() {
+ //琛ㄥ崟鏍￠獙
+ if (this.model.mobile.length === 0) {
+ this.$u.toast("璇疯緭鍏ユ墜鏈哄彿");
+ return;
+ }
+
+ this.$u.api.sendCode({
+ mobile: this.model.mobile
+ }, {
+ 'Authorization': 'Basic c29jaWFsOnNvY2lhbA=='
+ }).then(r => {
+ if (r.data) {
+ this.$u.toast(`楠岃瘉鐮佸彂閫佹垚鍔�!`);
+ this.smsCodeBtnDisabled = true;
+ uni.setStorageSync('loginSmsCodeTime', moment().valueOf() / 1000);
+ this.handleSmsCodeTime(59);
+ console.log(`楠岃瘉鐮佹槸${r.msg}`)
+ } else {
+ this.$u.toast(r.msg === '鎵嬫満鍙锋湭娉ㄥ唽' ? '鎵嬫満鍙锋湭缁戝畾璐﹀彿' : r.msg);
+ }
+ })
+ },
+ handleSmsCodeTime(time) {
+ let timer = setInterval(() => {
+ if (time === 0) {
+ clearInterval(timer);
+ this.smsCodeBtnDisabled = false;
+ } else {
+ this.codeSeconds = time;
+ this.smsCodeBtnDisabled = true;
+ time--;
+ }
+ }, 1000);
+ },
+ // 鎻愪氦琛ㄥ崟
+ async toLogin() {
+ //琛ㄥ崟鏍￠獙
+ if (this.model.mobile.length === 0) {
+ this.$u.toast('璇疯緭鍏ユ墜鏈哄彿');
+ return;
+ }
+ if (this.model.code.length === 0) {
+ this.$u.toast('璇疯緭鍏ラ獙璇佺爜');
+ return;
+ }
+
+ //缁戝畾鐢ㄦ埛淇℃伅
+ await this.setUserBind()
+ },
+
+ // 寰俊缁戝畾鐢ㄦ埛
+ async setUserBind() {
+ let ctx = this
+ let mobile = this.model.mobile
+ //鑾峰彇code
+ uni.login({
+ provider: 'weixin',
+ success: function(res) {
+ let code = res.code
+ console.log('vxCode:', code)
+ //鎵嬫満鍙风櫥褰�
+ ctx.$u.api.smsLogin({
+ mobile,
+ code
+ }, {
+ Authorization: 'Basic c29jaWFsOnNvY2lhbA=='
+ }).then(res => {
+ let token = res.access_token
+ console.log('鎵嬫満鐧诲綍鎴愬姛:', res)
+
+ //鍌ㄥ瓨鐢ㄦ埛淇℃伅
+ ctx.$u.vuex('vuex_token', res.access_token)
+ ctx.$u.vuex('vuex_refresh_token', res.refresh_token)
+ ctx.$u.vuex('vuex_username', res.username)
+ ctx.$u.vuex('vuex_userId', res.user_id)
+ ctx.$u.vuex('vuex_client_id', res.client_id)
+
+ //缁戝畾鐢ㄦ埛
+ ctx.$u.api.bingUser({
+ code
+ }, {
+ 'Authorization': 'Bearer ' + token
+ }).then(res => {
+ console.log('缁戝畾鐢ㄦ埛鎴愬姛')
+ uni.reLaunch({
+ url: '/pages/sys/home/index'
+ });
+ })
+ })
+ }
+ })
+ }
+
+ }
+ };
+</script>
+
+
+<style lang="scss">
+ @import 'index.scss';
+
+ .logo {
+ width: 260rpx;
+ height: 260rpx;
+ //background: rgba(59, 121, 235, 1);
+ //box-shadow: 0rpx 5rpx 20rpx 5rpx rgba(45, 127, 235, 0.5);
+ border-radius: 50%;
+ margin: 70rpx auto 10rpx auto;
+ }
+
+ .logo image {
+ width: 260rpx;
+ height: 260rpx;
+ border-radius: 50%;
+ }
+
+ .base-url js-select {
+ width: 100%;
+ }
+
+ .button {
+ margin: 30rpx auto 0;
+ }
+
+ .footer {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ color: #46afff;
+ height: 40rpx;
+ line-height: 40rpx;
+ font-size: 35rpx;
+ margin-top: 60rpx;
+ }
+
+ .footer text {
+ font-size: 30rpx;
+ margin-left: 25rpx;
+ margin-right: 25rpx;
+ }
+
+ .oauth2 {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+ margin: 55rpx 100rpx;
+
+ image {
+ height: 100rpx;
+ width: 100rpx;
+ }
+ }
+</style>
--
Gitblit v1.9.3