diff --git a/.env.development b/.env.development index 1d451e7..5b6f2bd 100644 --- a/.env.development +++ b/.env.development @@ -5,7 +5,7 @@ VITE_APP_TITLE = 金武联驾校 VITE_APP_ENV = 'development' # 金武联驾校/开发环境 -VITE_APP_BASE_API = 'https://test.jd-mall.cn/dev/zongheng-api/' +VITE_APP_BASE_API = 'http://118.31.23.45:8888/' # -VITE_WEB_BASE_URL = 'https://test.jd-mall.cn/dev/zongheng' +VITE_WEB_BASE_URL = 'http://118.31.23.45:8888/' diff --git a/package.json b/package.json index 3fcf045..07e5a3e 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "OA", + "name": "jwl", "version": "0.0.0", "scripts": { "dev:h5": "uni", @@ -15,7 +15,7 @@ "@dcloudio/uni-h5": "3.0.0-alpha-3060420220922001", "@dcloudio/uni-mp-weixin": "3.0.0-alpha-3060420220922001", "jsencrypt-plus": "^0.1.0", - "pinia": "^2.0.36", + "pinia": "2.0.36", "pinia-plugin-persist-uni": "^1.2.0", "vue": "^3.2.37", "vue-i18n": "^9.1.9" diff --git a/src/jtools/api/login.js b/src/jtools/api/login.js index 77eaf29..6c3f231 100644 --- a/src/jtools/api/login.js +++ b/src/jtools/api/login.js @@ -2,9 +2,25 @@ import request from '../request/index.js'; export function login(data) { return request({ - url: 'api-admin/pcLogin', + url: 'driver-api/tdSysUser/login', method: 'POST', data, noToken: true }); } + +export function getCode(data) { + return request({ + url: 'driver-api/tdSysUser/code', + method: 'get', + data, + noToken: true + }); +} + +export function logout() { + return request({ + url: 'driver-api/tdSysUser/loginOut', + method: 'get', + }); +} \ No newline at end of file diff --git a/src/jtools/api/vip.js b/src/jtools/api/vip.js new file mode 100644 index 0000000..ee5f469 --- /dev/null +++ b/src/jtools/api/vip.js @@ -0,0 +1,9 @@ +import request from '../request/index.js'; + +export function queryVip(data) { + return request({ + url: 'driver-api/tdMember/queryUserMember', + method: 'POST', + data, + }); +} \ No newline at end of file diff --git a/src/jtools/request/index.js b/src/jtools/request/index.js index 241d7de..f8e4f3c 100644 --- a/src/jtools/request/index.js +++ b/src/jtools/request/index.js @@ -1,4 +1,6 @@ import storage from '../storage/index.js'; +import useUserStore from '@/jtools/store/user' + //把配置项单独处理 let server_url = ' '; // 请求地址 let token = ' '; // 凭证 @@ -27,11 +29,15 @@ function service(options = {}) { title: res.data.message, icon: 'none' }); - uni.redirectTo({ - url: '/pages/login/login' - }); + useUserStore().logout() //请求成功 resolved(res.data); + } else if(res.data.code != '0000') { + uni.showToast({ + title: resp.message, + icon: 'none' + }) + resolved(res.data) } else { //请求成功 resolved(res.data); diff --git a/src/jtools/store/user.js b/src/jtools/store/user.js index d1fde67..bd845df 100644 --- a/src/jtools/store/user.js +++ b/src/jtools/store/user.js @@ -1,9 +1,9 @@ import { defineStore } from 'pinia'; -import http from '@/jtools/request/index'; +import { login,logout } from '@/jtools/api/login'; import constants from '@/jtools/constants'; import storage from '@/jtools/storage'; -const user = defineStore({ +const useUserStore = defineStore({ id: 'user', state: () => ({ token: storage.get('token'), @@ -12,57 +12,43 @@ const user = defineStore({ }), actions: { - // 登录 - showAuth() { - // router.replaceAll('/pages/login/login'); + login(params) { + // commit('isLogin', true); + return new Promise(async (resolve, reject) => { + const resp = await login(params); + if (resp.code === '0000') { + // 保存登录信息,用于重新登录 + this.isLogin = true; + this.token = resp.data.token; + this.userInfo = resp.data + storage.set('isLogin', true) + storage.set('token', resp.data.token) + storage.set('userInfo', resp.data) + resolve(resp.data); + } else { + reject(); + } + }); }, - - // 获取个人信息 - async getInfo() { - const { error, data } = await userApi.profile(); - if (error !== 0) return; - this.userInfo = data; - return Promise.resolve(data); - }, - - - // 设置token - setToken(token = '') { - if (token === '') { - this.isLogin = false; - this.token = '' - this.userInfo = {} - storage.set('token', ''); - storage.set('isLogin', false); - storage.set('userInfo', {}); - } else { - this.isLogin = true; - this.token = token - storage.set('token', token); - storage.set('isLogin', true); - } - return this.isLogin; - }, - - // 重置用户默认数据 - resetUserData() { - this.setToken(); - }, // 登出 - async logout(force = false) { - if (!force) { - const { error } = await userApi.logout(); - if (error === 0) { - this.resetUserData(); - } - } - if (force) { + logout(force = false) { + return new Promise((resolve, reject) => { this.resetUserData(); - } - - return !this.isLogin; + uni.redirectTo({ + url: '/pages/login/login' + }) + resolve(); + }) }, + resetUserData() { + this.isLogin = false; + this.token = ''; + this.userInfo = {} + storage.remove('isLogin') + storage.remove('token') + storage.remove('userInfo') + } }, }); -export default user; +export default useUserStore; diff --git a/src/jtools/utils/validate.js b/src/jtools/utils/validate.js new file mode 100644 index 0000000..bc0902e --- /dev/null +++ b/src/jtools/utils/validate.js @@ -0,0 +1,167 @@ +/** + * 判断url是否是http或https + * @param {string} path + * @returns {Boolean} + */ +export function isHttp(url) { + return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1; +} + +/** + * 判断path是否为外链 + * @param {string} path + * @returns {Boolean} + */ +export function isExternal(path) { + return /^(https?:|mailto:|tel:)/.test(path); +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validUsername(str) { + const valid_map = ['admin', 'editor']; + return valid_map.indexOf(str.trim()) >= 0; +} + +/** + * @param {string} url + * @returns {Boolean} + */ +export function isURL(url) { + const reg = + /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/; + return reg.test(url); +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validLowerCase(str) { + const reg = /^[a-z]+$/; + return reg.test(str); +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validUpperCase(str) { + const reg = /^[A-Z]+$/; + return reg.test(str); +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function validAlphabets(str) { + const reg = /^[A-Za-z]+$/; + return reg.test(str); +} + +/** + * @param {string} email + * @returns {Boolean} + */ +export function isEmail(email) { + const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; + return reg.test(email); +} + +/** + * @param {string} str + * @returns {Boolean} + */ +export function isString(str) { + if (typeof str === 'string' || str instanceof String) { + return true; + } + return false; +} + +export function isPhone(str) { + return str && /^1[3456789]\d{9}$/.test(str) +} + +/** + * @param {Array} arg + * @returns {Boolean} + */ +export function isArray(arg) { + if (typeof Array.isArray === 'undefined') { + return Object.prototype.toString.call(arg) === '[object Array]'; + } + return Array.isArray(arg); +} + +// 是否纯英文 +export function isAllEN(val) { + return /^[a-zA-Z]*$/.test(val); +} + +// 是否纯中文 +export function isAllCN(val) { + return /^[\u4E00-\u9FA5]*$/.test(val); +} + +// 校验手机号 +export function validPhone(rule, value, callback) { + if (value && !/^1[3456789]\d{9}$/.test(value)) { + return callback(new Error('请输入正确的11位号码')); + } else { + return callback(); + } +} + +// 校验固话和手机号 +export function validPhoneAndMobile(rule, value, callback) { + if (value && !/^((0\d{2,3}-?\d{7,8})|(1[3465789]\d{9}))$/.test(value)) { + return callback(new Error('请输入正确的电话号码')); + } else { + return callback(); + } +} + +// 校验邮箱 +export function validEmail(rule, value, callback) { + if (value && !isEmail(value)) { + return callback(new Error('请输入正确的邮箱')); + } else { + return callback(); + } +} + +// 校验纳税人识别号 +export function validTaxpayer(rule, value, callback) { + if (value && !/^[A-Z0-9]{15}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/.test(value)) { + return callback(new Error('请输入正确的纳税人识别号')); + } else { + return callback(); + } +} + +// 校验是否网站 +export function validUrl(rule, value, callback) { + if (value && !isURL(value)) { + return callback(new Error('请输入正确的网站')); + } else { + return callback(); + } +} + +// 校验银行卡 +export function validBankCard(rule, value, callback) { + const strBin = '10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99'; + if (!value) { + return callback(); + } else if (!Number.isInteger(+value)) { + callback(new Error('银行卡号必须全为数字')); + } else if (value.trim().length < 8 || value.trim().length > 32) { + callback(new Error('银行卡号长度必须在8到32之间')); + } else { + callback(); + } +} diff --git a/src/main.js b/src/main.js index 3b3b5c3..8fbb63c 100644 --- a/src/main.js +++ b/src/main.js @@ -5,7 +5,7 @@ import uviewPlus from './uni_modules/uview-plus' import platform from '@/jtools/platform'; import constants from '@/jtools/constants'; import storage from '@/jtools/storage'; -import { createPinia } from 'pinia' +import * as Pinia from 'pinia' import App from "./App.vue"; export function createApp() { const app = createSSRApp(App); @@ -13,8 +13,9 @@ export function createApp() { app.config.globalProperties.$constants=constants app.config.globalProperties.$storage=storage app.use(uviewPlus) - app.use(createPinia()) + app.use(Pinia.createPinia()) return { app, + Pinia }; } diff --git a/src/pages.json b/src/pages.json index 3b05749..5a48211 100644 --- a/src/pages.json +++ b/src/pages.json @@ -97,13 +97,20 @@ "enablePullDownRefresh": false } }, - { - "path": "pages/index/videoVip", - "style": { - "navigationBarTitleText": "视频精品课", - "enablePullDownRefresh": false - } - } + { + "path": "pages/index/videoVip", + "style": { + "navigationBarTitleText": "视频精品课", + "enablePullDownRefresh": false + } + }, + { + "path": "pages/login/login", + "style": { + "navigationBarTitleText": "登录", + "enablePullDownRefresh": false + } + } ], "globalStyle": { diff --git a/src/pages/login/agreement.vue b/src/pages/login/agreement.vue deleted file mode 100644 index 2e8d56e..0000000 --- a/src/pages/login/agreement.vue +++ /dev/null @@ -1,27 +0,0 @@ -<template> - <view> - <web-view :webview-styles="webviewStyles" :src="articleurl"></web-view> - </view> -</template> - -<script> - export default { - data() { - return { - articleurl: '', - webviewStyles: { - progress: { - color: '#FF7200' - } - } - }; - }, - onLoad(options) { - this.articleurl = 'http://www.baidu.com/'; - } - } -</script> - -<style> - -</style> diff --git a/src/pages/login/forget.vue b/src/pages/login/forget.vue deleted file mode 100644 index 83a4500..0000000 --- a/src/pages/login/forget.vue +++ /dev/null @@ -1,255 +0,0 @@ -<template> - <view class="content"> - <view class="list"> - <view class="tishi">若您忘记了密码,可在此重新设置新密码。</view> - <view class="list-call"> - <u-icon name="phone" color="#EE2626" size="40"></u-icon> - <input class="sl-input" type="number" v-model="phone" maxlength="11" placeholder="请输入手机号" /> - </view> - <view class="list-call"> - <u-icon name="lock" color="#EE2626" size="40"></u-icon> - <input class="sl-input" type="text" v-model="password" maxlength="32" placeholder="请输入新密码" - :password="!showPassword" /> - <u-icon @click="display" :name="showPassword?'eye-off':'eye-fill'" color="#EE2626" size="40"></u-icon> - - </view> - <view class="list-call"> - <u-icon name="checkmark-circle" color="#EE2626" size="40"></u-icon> - <input class="sl-input" type="number" v-model="code" maxlength="4" placeholder="验证码" /> - <view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view> - </view> - </view> - <view class="button-login" hover-class="button-hover" @tap="bindLogin()"> - <text>修改密码</text> - </view> - - </view> -</template> - -<script> - var _this, js; - export default { - data() { - return { - phone: '', - second: 0, - code: "", - showPassword: false, - password: '' - } - }, - onLoad() { - _this = this; - }, - computed: { - yanzhengma() { - if (this.second == 0) { - return '获取验证码'; - } else { - if (this.second < 10) { - return '重新获取0' + this.second; - } else { - return '重新获取' + this.second; - } - } - } - }, - onUnload() { - this.clear() - }, - methods: { - display() { - this.showPassword = !this.showPassword - }, - clear() { - clearInterval(js) - js = null - this.second = 0 - }, - getcode() { - if (this.phone.length != 11) { - uni.showToast({ - icon: 'none', - title: '手机号不正确' - }); - return; - } - if (this.second > 0) { - return; - } - _this.second = 60; - js = setInterval(function() { - _this.second--; - if (_this.second == 0) { - _this.clear() - } - }, 1000) - uni.request({ - url: 'http://***/getPassWord', //仅为示例,并非真实接口地址。 - data: { - phone: this.phone, - type: 'forget' - }, - method: 'POST', - dataType: 'json', - success: (res) => { - if (res.data.code != 200) { - uni.showToast({ - title: res.data.msg, - icon: 'none' - }); - _this.second = 0; - } else { - uni.showToast({ - title: res.data.msg - }); - _this.second = 60; - js = setInterval(function() { - _this.second--; - if (_this.second == 0) { - _this.clear() - } - }, 1000) - } - }, - fail() { - this.clear() - } - }); - - - - - }, - bindLogin() { - if (this.phone.length != 11) { - uni.showToast({ - icon: 'none', - title: '手机号不正确' - }); - return; - } - if (this.password.length < 6) { - uni.showToast({ - icon: 'none', - title: '密码不正确' - }); - return; - } - if (this.code.length != 4) { - uni.showToast({ - icon: 'none', - title: '验证码不正确' - }); - return; - } - uni.request({ - url: 'http://***/forget', - data: { - phone: this.phone, - password: this.password, - code: this.code - }, - method: 'POST', - dataType: 'json', - success: (res) => { - if (res.data.code != 200) { - uni.showToast({ - title: res.data.msg, - icon: 'none' - }); - } else { - uni.showToast({ - title: res.data.msg - }); - setTimeout(function() { - uni.navigateBack(); - }, 1500) - } - } - }); - - } - } - } -</script> - -<style> - page { - background-color: #fff; - } - - .content { - display: flex; - flex-direction: column; - justify-content: center; - } - - .tishi { - color: #999999; - font-size: 28rpx; - line-height: 50rpx; - margin-bottom: 50rpx; - } - - .list { - display: flex; - flex-direction: column; - padding-top: 50rpx; - padding-left: 70rpx; - padding-right: 70rpx; - } - - .list-call { - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - height: 100rpx; - color: #333333; - border-bottom: 0.5px solid #e2e2e2; - } - - - .list-call .sl-input { - flex: 1; - text-align: left; - font-size: 32rpx; - margin-left: 16rpx; - } - - .button-login { - color: #FFFFFF; - font-size: 34rpx; - width: 470rpx; - height: 100rpx; - background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); - border-radius: 50rpx; - line-height: 100rpx; - text-align: center; - margin-left: auto; - margin-right: auto; - margin-top: 100rpx; - } - - .button-hover { - background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); - } - - .yzm { - color: #FF7D13; - font-size: 24rpx; - line-height: 64rpx; - padding-left: 10rpx; - padding-right: 10rpx; - width: auto; - height: 64rpx; - border: 1rpx solid rgba(255, 131, 30, 1); - border-radius: 50rpx; - } - - .yzms { - color: #999999 !important; - border: 1rpx solid #999999; - } -</style> diff --git a/src/pages/login/login.vue b/src/pages/login/login.vue index af57c29..d4a1d45 100644 --- a/src/pages/login/login.vue +++ b/src/pages/login/login.vue @@ -1,140 +1,162 @@ <template> - <view class="content"> - <view class="header"> - <image src="/static/images/login/logo.jpg"></image> - </view> - - <view class="list"> - <view class="list-call"> - <u-icon name="phone" color="#EE2626" size="40"></u-icon> - <input class="sl-input" v-model="login.phone" type="number" maxlength="11" placeholder="输入手机号" /> - </view> - <view class="list-call"> - <u-icon name="lock" color="#EE2626" size="40"></u-icon> - <input class="sl-input" v-model="login.password" type="text" maxlength="32" placeholder="输入密码" - password="true" /> - </view> - - </view> - - <view class="button-login" hover-class="button-hover" @tap="bindLogin()"> - <text>登录</text> - </view> - - <view class="agreenment"> - <navigator url="/pages/login/forget" open-type="navigate">忘记密码</navigator> - <text>|</text> - <navigator url="/pages/login/reg" open-type="navigate">注册账户</navigator> - </view> - </view> + <view class="content"> + <view class="header"> + <image src="/static/image/login/logo.png" mode="widthFix"></image> + <view class="mt21 fs16 cor-333 fwb text-center">欢迎使用金联武驾考!</view> + </view> + + <view class="list"> + <view class="list-call"> + <u-input class="sl-input" border="none" v-model="login.phone" type="number" maxlength="11" + placeholder="输入手机号" /> + </view> + <view class="list-call"> + <u-input class="sl-input" v-model="login.code" type="text" maxlength="6" border="none" placeholder="输入验证码"> + <template #suffix> + <text class="fs14 mr10" style="color: #05C341;" @tap="getCode">{{countDown==0?'获取验证码':countDown}}</text> + </template> + </u-input> + </view> + </view> + + <view class="button-login" @tap="bindLogin()"> + <text>登录</text> + </view> + + </view> </template> <script> - export default { - data() { - return { - login: { - phone: '', - password: '' - } - - }; - }, - methods: { - bindLogin() { - - } - } - } + import { + isPhone + } from '@/jtools/utils/validate.js' + import { + getCode, + login + } from '@/jtools/api/login' + import useUserStore from '@/jtools/store/user' + export default { + data() { + return { + login: { + phone: '', + code: '' + }, + countDown: 0, + js: undefined + }; + }, + onShow() { + if(useUserStore().isLogin) { + this.toHome() + } + }, + methods: { + getCode() { + if (isPhone(this.login.phone) && this.countDown == 0) { + getCode({ + phone: this.login.phone + }).then(resp => { + if (resp.code == '0000') { + uni.showToast({ + title: '发送成功!', + icon: 'none' + }) + this.countDown = 60 + this.js = setInterval(() => { + this.countDown; + if (this.countDown == 0) { + this.clear() + } + }, 1000) + } + }) + } + }, + clear() { + clearInterval(js) + this.js = null + this.countDown = 0 + }, + bindLogin() { + if(isPhone(this.login.phone) && this.login.code) { + useUserStore().login(this.login).then(resp => { + if(resp.userId) { + this.toHome() + } + }) + } + }, + toHome() { + uni.switchTab({ + url: '/pages/index/index' + }) + } + } + } </script> <style> - page { - background-color: #fff; - } - - .content { - display: flex; - flex-direction: column; - justify-content: center; - } - - .header { - width: 161rpx; - height: 161rpx; - border-radius: 50%; - margin-top: 30rpx; - margin-left: auto; - margin-right: auto; - } - - .header image { - width: 161rpx; - height: 161rpx; - border-radius: 50%; - } - - .list { - display: flex; - flex-direction: column; - padding-top: 50rpx; - padding-left: 70rpx; - padding-right: 70rpx; - } - - .list-call { - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - height: 100rpx; - color: #333333; - border-bottom: 0.5px solid #e2e2e2; - } - - - - .list-call .sl-input { - flex: 1; - text-align: left; - font-size: 32rpx; - margin-left: 16rpx; - } - - .button-login { - color: #FFFFFF; - font-size: 34rpx; - width: 470rpx; - height: 100rpx; - background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); - border-radius: 50rpx; - line-height: 100rpx; - text-align: center; - margin-left: auto; - margin-right: auto; - margin-top: 100rpx; - } - - .button-hover { - background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); - } - - .agreenment { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - font-size: 30rpx; - margin-top: 80rpx; - color: #FFA800; - text-align: center; - height: 40rpx; - line-height: 40rpx; - } - - .agreenment text { - font-size: 24rpx; - margin-left: 15rpx; - margin-right: 15rpx; - } -</style> + page { + background-color: #fff; + } + + .content { + display: flex; + flex-direction: column; + justify-content: center; + } + + .header { + margin-top: 166rpx; + margin-left: auto; + margin-right: auto; + letter-spacing: 10rpx; + } + + .header image { + width: 383rpx; + } + + .list { + display: flex; + flex-direction: column; + padding-top: 120rpx; + padding-left: 90rpx; + padding-right: 90rpx; + } + + .list-call { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + height: 100rpx; + color: #333333; + border-bottom: 0.5px solid #e2e2e2; + } + + + + .list-call .sl-input { + flex: 1; + text-align: left; + font-size: 32rpx; + margin-left: 16rpx; + } + + .button-login { + color: #FFFFFF; + font-size: 34rpx; + width: 560rpx; + height: 100rpx; + background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%); + border-radius: 50rpx; + line-height: 100rpx; + text-align: center; + margin-top: 100rpx; + margin-left: auto; + margin-right: auto; + } + +</style> \ No newline at end of file diff --git a/src/pages/login/reg.vue b/src/pages/login/reg.vue deleted file mode 100644 index d51c945..0000000 --- a/src/pages/login/reg.vue +++ /dev/null @@ -1,303 +0,0 @@ -<template> - <view class="content"> - <view class="header"> - <image src="/static/images/login/logo.jpg"></image> - </view> - - <view class="list"> - <view class="list-call"> - <u-icon name="phone" color="#EE2626" size="40"></u-icon> - <input class="sl-input" v-model="phone" type="number" maxlength="11" placeholder="手机号" /> - </view> - <view class="list-call"> - <u-icon name="lock" color="#EE2626" size="40"></u-icon> - <input class="sl-input" v-model="password" type="text" maxlength="32" placeholder="登录密码" - :password="!showPassword" /> - <u-icon @click="display" :name="showPassword?'eye-off':'eye-fill'" color="#EE2626" size="40"></u-icon> - </view> - <view class="list-call"> - <u-icon name="checkmark-circle" color="#EE2626" size="40"></u-icon> - <input class="sl-input" v-model="code" type="number" maxlength="4" placeholder="验证码" /> - <view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view> - </view> - - </view> - - <view class="button-login" hover-class="button-hover" @tap="bindLogin"> - <text>注册</text> - </view> - - <view class="agreement"> - <image @tap="agreementSuccess" - :src="agreement==true?'/static/images/login/ty1.png':'/static/images/login/ty0.png'"></image> - <text @tap="agreementSuccess"> 同意</text> - <navigator url="/pages/login/agreement?id=1" open-type="navigate">《软件用户协议》</navigator> - </view> - </view> -</template> - -<script> - var _this, js; - export default { - onLoad() { - _this = this; - - }, - onUnload() { - clearInterval(js) - this.second = 0; - }, - data() { - return { - phone: '', - password: '', - code: '', - agreement: true, - showPassword: false, - second: 0 - }; - }, - computed: { - yanzhengma() { - if (this.second == 0) { - return '获取验证码'; - } else { - if (this.second < 10) { - return '重新获取0' + this.second; - } else { - return '重新获取' + this.second; - } - } - } - }, - onUnload() { - this.clear() - }, - methods: { - clear() { - clearInterval(js) - js = null - this.second = 0 - }, - display() { - this.showPassword = !this.showPassword - }, - agreementSuccess() { - this.agreement = !this.agreement; - }, - getcode() { - if (this.phone.length != 11) { - uni.showToast({ - icon: 'none', - title: '手机号不正确' - }); - return; - } - if (this.second > 0) { - return; - } - this.second = 60; - //请求业务 - js = setInterval(function() { - _this.second--; - if (_this.second == 0) { - _this.clear() - } - }, 1000) - // uni.request({ - // url: 'http://***/getcode.html', //仅为示例,并非真实接口地址。 - // data: { - // phone: this.phone, - // type: 'reg' - // }, - // method: 'POST', - // dataType: 'json', - // success: (res) => { - // if (res.data.code != 200) { - // uni.showToast({ - // title: res.data.msg, - // icon: 'none' - // }); - // } else { - // uni.showToast({ - // title: res.data.msg - // }); - // js = setInterval(function() { - // _this.second--; - // if (_this.second == 0) { - // _this.clear() - // } - // }, 1000) - // } - // }, - // fail() { - // this.second == 0 - // } - // }); - }, - bindLogin() { - if (this.agreement == false) { - uni.showToast({ - icon: 'none', - title: '请先阅读《软件用户协议》' - }); - return; - } - if (this.phone.length != 11) { - uni.showToast({ - icon: 'none', - title: '手机号不正确' - }); - return; - } - if (this.password.length < 6) { - uni.showToast({ - icon: 'none', - title: '密码不正确' - }); - return; - } - if (this.code.length != 4) { - uni.showToast({ - icon: 'none', - title: '验证码不正确' - }); - return; - } - uni.request({ - url: 'http://***/reg.html', - data: { - phone: this.phone, - password: this.password, - code: this.code, - }, - method: 'POST', - dataType: 'json', - success: (res) => { - if (res.data.code != 200) { - uni.showToast({ - title: res.data.msg, - icon: 'none' - }); - } else { - uni.showToast({ - title: res.data.msg - }); - setTimeout(function() { - uni.navigateBack(); - }, 1500) - } - } - }); - - } - } - } -</script> - -<style> - page { - background-color: #fff; - } - - .content { - display: flex; - flex-direction: column; - justify-content: center; - } - - .header { - width: 161rpx; - height: 161rpx; - border-radius: 50%; - margin-top: 30rpx; - margin-left: auto; - margin-right: auto; - } - - .header image { - width: 161rpx; - height: 161rpx; - border-radius: 50%; - } - - .list { - display: flex; - flex-direction: column; - padding-top: 50rpx; - padding-left: 70rpx; - padding-right: 70rpx; - } - - .list-call { - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - height: 100rpx; - color: #333333; - border-bottom: 0.5px solid #e2e2e2; - } - - - - .list-call .sl-input { - flex: 1; - text-align: left; - font-size: 32rpx; - margin-left: 16rpx; - } - - .yzm { - color: #FF7D13; - font-size: 24rpx; - line-height: 64rpx; - padding-left: 10rpx; - padding-right: 10rpx; - width: auto; - height: 64rpx; - border: 1rpx solid #FFA800; - border-radius: 50rpx; - } - - .yzms { - color: #999999 !important; - border: 1rpx solid #999999; - } - - .button-login { - color: #FFFFFF; - font-size: 34rpx; - width: 470rpx; - height: 100rpx; - line-height: 100rpx; - background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); - border-radius: 50rpx; - text-align: center; - margin-left: auto; - margin-right: auto; - margin-top: 100rpx; - } - - .button-hover { - background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); - } - - .agreement { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - font-size: 30rpx; - margin-top: 80rpx; - color: #FFA800; - text-align: center; - height: 40rpx; - line-height: 40rpx; - } - - .agreement image { - width: 40rpx; - height: 40rpx; - } -</style> diff --git a/src/pages/me/index.vue b/src/pages/me/index.vue index 5d03cf4..e8ca953 100644 --- a/src/pages/me/index.vue +++ b/src/pages/me/index.vue @@ -3,14 +3,23 @@ <!-- <view class="wp100" style="background-color: #333;height: 205px;"></view> --> <view class="relative" style="height: 205px;"> <image src="/static/image/mine/mine_bg.png" mode="widthFix" style="width: 100%;"></image> - <view class="info flex ai-c"> - <u-avatar class="br-p50 overflow-h" :size="64" :src="user.avatar" mp-avatar shape="circle"></u-avatar> + <view class="info flex ai-c" v-if="isLogin"> + <u-avatar class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar> <view class="ml12"> <view class="flex ai-c fs18 cor-333 fwb"> - <text class="mr10">{{user.name}}</text> + <text class="mr10">{{ user.userName }}{{user.userId}}</text> <image src="/static/image/mine/vip.png" mode="widthFix" style="width: 18px;"></image> </view> - <view class="mt5 fs14 cor-666">陪您学车 第{{user.count}}天</view> + <view class="mt5 fs14 cor-666">陪您学车 第{{ user.count }}天</view> + </view> + </view> + <view class="info flex ai-c" v-else @tap="toLogin"> + <u-avatar class="br-p50 overflow-h" :size="64" src="@/static/image/mine/default_avatar.png" shape="circle"></u-avatar> + <view class="ml12"> + <view class="flex ai-c fs18 cor-333 fwb"> + <text class="mr10">立即登录</text> + </view> + <view class="mt5 fs14 cor-666">登录后获得更多学车信息</view> </view> </view> </view> @@ -52,12 +61,12 @@ </view> <view class="mt12 bc-fff br8"> <u-cell-group> - <u-cell size="large" title="我的资料" value="修改" isLink url="/pages/me/info"> + <u-cell size="large" title="我的资料" value="修改" isLink @tap="handleInfo"> <template #icon> <img src="/static/image/mine/wdzl.png" style="width: 24px;height: 24px;"> </template> </u-cell> - <u-cell size="large" title="我的体检" value="查看报告" isLink url="/pages/me/tijian"> + <u-cell size="large" title="我的体检" value="查看报告" isLink @tap="handleTJ"> <template #icon> <img src="/static/image/mine/wdtj.png" style="width: 24px;height: 24px;"> </template> @@ -69,48 +78,83 @@ </u-cell> </u-cell-group> </view> - <view class="flex ai-c jc-c mt12 br8 bc-fff" style="height: 50px;"> + <view class="flex ai-c jc-c mt12 br8 bc-fff" style="height: 50px;" @tap="handleLogout"> <text class="fs16" style="color: #A09F9F;">退出登录</text> </view> </view> </view> </template> <script> - export default { - components: {}, - data() { - return { - user: { - avatar: '', - name: '帅帅的黑啤酒', - count: '215' +import useUserStore from '@/jtools/store/user' +import { queryVip } from '@/jtools/api/vip' +export default { + components: {}, + computed: { + isLogin() { + return useUserStore().isLogin + }, + user() { + return useUserStore().userInfo + } + }, + data() { + return { + }; + }, + onShow() { + this.searchVip() + }, + methods: { + searchVip() { + queryVip().then(resp => { + if(resp.code == '0000') { + debugger } - }; - }, - onShow() { - //加载 - }, - onLoad() { - - }, - methods: { - handleVip() { + }) + }, + handleVip() { + uni.navigateTo({ + url: '/pages/me/vip' + }) + }, + handleCallPhone() { + uni.makePhoneCall({ + phoneNumber: '17318531354' + }) + }, + handleChangeSchool() { + uni.navigateTo({ + url: '/pages/me/school' + }) + }, + handleInfo() { + if(this.isLogin) { uni.navigateTo({ - url: '/pages/me/vip' + url: '/pages/me/info' }) - }, - handleCallPhone() { - uni.makePhoneCall({ - phoneNumber: '17318531354' - }) - }, - handleChangeSchool() { + } else { + this.toLogin() + } + }, + handleTJ() { + if(this.isLogin) { uni.navigateTo({ - url: '/pages/me/school' + url: '/pages/me/tijian' }) + } else { + this.toLogin() } - } - } + }, + toLogin() { + uni.navigateTo({ + url: '/pages/login/login' + }) + }, + handleLogout() { + useUserStore().logout() + } + } +} </script> <style lang="scss" scoped> @@ -119,12 +163,14 @@ top: 32px; left: 27px; } + .phone { width: 75px; height: 26px; background: #05C341; border-radius: 16px 16px 0px 16px; } + .study { width: 200px; height: 35px; diff --git a/src/static/image/login/logo.png b/src/static/image/login/logo.png new file mode 100644 index 0000000..f98f796 Binary files /dev/null and b/src/static/image/login/logo.png differ diff --git a/src/static/image/mine/default_avatar.png b/src/static/image/mine/default_avatar.png new file mode 100644 index 0000000..23fb40c Binary files /dev/null and b/src/static/image/mine/default_avatar.png differ