Skip to content

H
horse
Commit 718837fb authored by 罗超's avatar 罗超
Browse files
Options

1

parent 095fa2e3
Hide whitespace changes
Inline Side-by-side
Showing with 286 additions and 172 deletions
quasar.conf.js
View file @ 718837fb
...@@ -61,7 +61,7 @@ module.exports = configure(function (ctx) { ...@@ -61,7 +61,7 @@ module.exports = configure(function (ctx) {
env: ctx.dev env: ctx.dev
? { ? {
BASE_APP_API: 'http://192.168.20.51:8088/api' BASE_APP_API: 'http://192.168.10.9:8085/api'
} }
: { : {
BASE_APP_API: 'https://eduapi.oytour.com/api' BASE_APP_API: 'https://eduapi.oytour.com/api'
......
src/api/axios.ts
View file @ 718837fb
...@@ -74,6 +74,7 @@ const service = Axios.create({ ...@@ -74,6 +74,7 @@ const service = Axios.create({
*/ */
service.interceptors.request.use( service.interceptors.request.use(
async (config: AxiosRequestConfig) => { async (config: AxiosRequestConfig) => {
console.log(config)
// 如果是获取token接口： // 如果是获取token接口：
if (config.url === '/auth/oauth/token') { if (config.url === '/auth/oauth/token') {
//TODO:用户登录的特殊处理， //TODO:用户登录的特殊处理，
......
src/api/user.ts
View file @ 718837fb
...@@ -6,8 +6,8 @@ import { HttpResponse } from '@/@types' ...@@ -6,8 +6,8 @@ import { HttpResponse } from '@/@types'
import Axios from './axios' import Axios from './axios'
interface HttpParams { interface HttpParams {
coinName: string coinName: string
cashName: string cashName: string
} }
/** /**
...@@ -17,9 +17,9 @@ interface HttpParams { ...@@ -17,9 +17,9 @@ interface HttpParams {
* @property {string} password -用户密码 * @property {string} password -用户密码
*/ */
interface LoginParams { interface LoginParams {
grant_type: string grant_type?: string
username: string Account: string
password: string Password: string
} }
/** /**
...@@ -27,7 +27,7 @@ interface LoginParams { ...@@ -27,7 +27,7 @@ interface LoginParams {
* @property {string} refresh_token -refresh_token * @property {string} refresh_token -refresh_token
*/ */
interface RefreshTokenParams { interface RefreshTokenParams {
refresh_token: string refresh_token: string
} }
/** /**
...@@ -35,7 +35,7 @@ interface RefreshTokenParams { ...@@ -35,7 +35,7 @@ interface RefreshTokenParams {
* @property {string} email -邮箱 * @property {string} email -邮箱
*/ */
interface SendEmailCodeParams { interface SendEmailCodeParams {
email: string email: string
} }
/** /**
...@@ -44,8 +44,8 @@ interface SendEmailCodeParams { ...@@ -44,8 +44,8 @@ interface SendEmailCodeParams {
* @property {string} code -验证码 * @property {string} code -验证码
*/ */
interface VerifyEmailCodeParams { interface VerifyEmailCodeParams {
email: string email: string
code: string code: string
} }
/** /**
...@@ -53,7 +53,7 @@ interface VerifyEmailCodeParams { ...@@ -53,7 +53,7 @@ interface VerifyEmailCodeParams {
* @property {string} phone -手机号 * @property {string} phone -手机号
*/ */
interface SendPhoneCodeParams { interface SendPhoneCodeParams {
phone: string phone: string
} }
/** /**
...@@ -62,8 +62,8 @@ interface SendPhoneCodeParams { ...@@ -62,8 +62,8 @@ interface SendPhoneCodeParams {
* @property {string} code -手机验证码 * @property {string} code -手机验证码
*/ */
interface BindPhoneParams { interface BindPhoneParams {
phone: string phone: string
code: string code: string
} }
/** /**
...@@ -73,13 +73,13 @@ interface BindPhoneParams { ...@@ -73,13 +73,13 @@ interface BindPhoneParams {
* @property {string} code -验证码 * @property {string} code -验证码
*/ */
interface RegisterParams { interface RegisterParams {
email: string email: string
password: string password: string
code: string code: string
} }
export interface UserApi { export interface UserApi {
coin2cash(param: HttpParams): Promise<any> coin2cash(param: HttpParams): Promise<any>
} }
/** /**
...@@ -88,87 +88,87 @@ export interface UserApi { ...@@ -88,87 +88,87 @@ export interface UserApi {
*/ */
class UserService { class UserService {
// 登录 // 登录
static async login(params: LoginParams): Promise<HttpResponse> { static async login(data: LoginParams): Promise<HttpResponse> {
return Axios('/auth/oauth/token', { return Axios('/login/login', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
params: params data
}) })
} }
// 刷新令牌 // 刷新令牌
static async refreshToken(params: RefreshTokenParams): Promise<HttpResponse> { static async refreshToken(data: RefreshTokenParams): Promise<HttpResponse> {
return Axios('/auth/oauth/token', { return Axios('/auth/oauth/token', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
params: { data: {
grant_type: 'refresh_token', grant_type: 'refresh_token',
...params ...data
} }
}) })
} }
// 获取用户信息 // 获取用户信息
static getUserDetail(): Promise<HttpResponse> { static getUserDetail(): Promise<HttpResponse> {
return Axios('/bus/user/userDetail', { return Axios('/bus/user/userDetail', {
method: 'get', method: 'get',
responseType: 'json' responseType: 'json'
}) })
} }
// 添加登录记录 // 添加登录记录
static addLoginLog(): Promise<HttpResponse> { static addLoginLog(): Promise<HttpResponse> {
return Axios('/bus/user/success', { return Axios('/bus/user/success', {
method: 'get', method: 'get',
responseType: 'json' responseType: 'json'
}) })
} }
// 发送邮箱验证码 // 发送邮箱验证码
static sendEmailCode(params: SendEmailCodeParams): Promise<HttpResponse> { static sendEmailCode(data: SendEmailCodeParams): Promise<HttpResponse> {
return Axios('/bus/common/sendEmailCode', { return Axios('/bus/common/sendEmailCode', {
method: 'get', method: 'get',
responseType: 'json', responseType: 'json',
params data
}) })
} }
// 验证邮箱验证码 // 验证邮箱验证码
static verifyEmailCode(params: VerifyEmailCodeParams): Promise<HttpResponse> { static verifyEmailCode(data: VerifyEmailCodeParams): Promise<HttpResponse> {
return Axios('/bus/common/verifyEmailCode', { return Axios('/bus/common/verifyEmailCode', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
params data
}) })
} }
// 发送手机验证码 // 发送手机验证码
static sendPhoneCode(params: SendPhoneCodeParams): Promise<HttpResponse> { static sendPhoneCode(data: SendPhoneCodeParams): Promise<HttpResponse> {
return Axios('/bus/common/sendPhoneCode', { return Axios('/bus/common/sendPhoneCode', {
method: 'get', method: 'get',
responseType: 'json', responseType: 'json',
params data
}) })
} }
// 绑定手机 // 绑定手机
static bindPhone(params: BindPhoneParams): Promise<HttpResponse> { static bindPhone(data: BindPhoneParams): Promise<HttpResponse> {
return Axios('/bus/user/bindingPhone', { return Axios('/bus/user/bindingPhone', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
params data
}) })
} }
// 注册 // 注册
static register(params: RegisterParams): Promise<HttpResponse> { static register(data: RegisterParams): Promise<HttpResponse> {
return Axios('/bus/user/register', { return Axios('/bus/user/register', {
method: 'post', method: 'post',
responseType: 'json', responseType: 'json',
data: params data
}) })
} }
} }
export default UserService export default UserService
src/boot/axios.ts
View file @ 718837fb
import { boot } from 'quasar/wrappers' import { boot } from 'quasar/wrappers'
import axios, { AxiosInstance } from 'axios' import axios, { AxiosInstance } from 'axios'
import 'element-plus/dist/index.css'
declare module '@vue/runtime-core' { declare module '@vue/runtime-core' {
interface ComponentCustomProperties { interface ComponentCustomProperties {
$axios: AxiosInstance $axios: AxiosInstance
...@@ -17,7 +17,6 @@ const api = axios.create({ baseURL: 'https://api.example.com' }) ...@@ -17,7 +17,6 @@ const api = axios.create({ baseURL: 'https://api.example.com' })
export default boot(({ app }) => { export default boot(({ app }) => {
// for use inside Vue files (Options API) through this.$axios and this.$api // for use inside Vue files (Options API) through this.$axios and this.$api
app.config.globalProperties.$axios = axios app.config.globalProperties.$axios = axios
// ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form) // ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form)
// so you won't necessarily have to import axios in each vue file // so you won't necessarily have to import axios in each vue file
......
src/module/user/loginModule.ts
View file @ 718837fb
import { ResultType } from '@/@types/enumHelper' // import { ResultType } from '@/@types/enumHelper'
import router from '@/router' // import router from '@/router'
import { UserActionsType } from '@/store/modules/user/actions' // import { UserActionsType } from '@/store/modules/user/actions'
import { UserGetter } from '@/store/modules/user/getters' // import { UserGetter } from '@/store/modules/user/getters'
import { dispatchAction, getStoreGetter, setStoreState } from '@/store/utils' // import { dispatchAction, getStoreGetter, setStoreState } from '@/store/utils'
import message from '@/utils/message' import message from '@/utils/message'
import { reactive, ref } from 'vue' import { reactive, ref } from 'vue'
import UserService from '@/api/user'
interface LoginParams { interface LoginParams {
username: string username: string
password: string password: string
...@@ -40,38 +41,43 @@ const userUserLoginModule = () => { ...@@ -40,38 +41,43 @@ const userUserLoginModule = () => {
stateManager.subLogin = false stateManager.subLogin = false
} else { } else {
setTimeout(() => { setTimeout(async () => {
//#region 测试使用 //#region 测试使用
const param = { const param = {
username: userModel.username, Account: userModel.username,
password: userModel.password Password: userModel.password
} }
dispatchAction<UserActionsType>('user', 'userLogin', param) // dispatchAction<UserActionsType>('user', 'userLogin', param)
const menu:any = { // const menu:any = {
menuId: 1, // menuId: 1,
menuName: '首页', // menuName: '首页',
menuUrl: '/index' // menuUrl: '/index'
} // }
const menu2:any = { // const menu2:any = {
menuId: 2, // menuId: 2,
menuName: '首页', // menuName: '首页',
menuUrl: '/' // menuUrl: '/'
} // }
const menus: Array<any> = [] // const menus: Array<any> = []
const auths = getStoreGetter<UserGetter>('user', 'getUserAllAuth') // const auths = getStoreGetter<UserGetter>('user', 'getUserAllAuth')
if (auths != ResultType.EmptyArray) { // if (auths != ResultType.EmptyArray) {
Object.assign(menus, ...auths) // Object.assign(menus, ...auths)
} // }
menus.push(menu) // menus.push(menu)
menus.push(menu2) // menus.push(menu2)
setStoreState('user', 'menuList', menus) //-------------
message.successMsg('登录成功') UserService.login(param).then(res => {
stateManager.subLogin = false console.log(72, res)
router.push({
path: '/index'
}) })
// setStoreState('user', 'menuList', menus)
// message.successMsg('登录成功')
// stateManager.subLogin = false
// router.push({
// path: '/index'
// })
//#endregion //#endregion
}, 2000) }, 2000)
} }
......
src/pages/auth/login.vue
View file @ 718837fb
<template> <template>
<div class="row"> <div class="row login-bg">
<div class="col window-height column"> <!-- <div class="col window-height column">
<div class="col q-pa-lg flex justify-center items-center"> <div class="col q-pa-lg flex justify-center items-center">
<div class="relative-position"> <div class="relative-position">
<img src="../../assets/images/big-logo.png" style="height: 60px" class="q-mb-lg" alt="" /> <img src="../../assets/images/big-logo.png" style="height: 60px" class="q-mb-lg" alt="" />
...@@ -11,9 +11,9 @@ ...@@ -11,9 +11,9 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col q-mb-lg login-bg"></div> <div class="col q-mb-lg login-bg1"></div>
</div> </div> -->
<div class="col q-pa-xl column"> <!-- <div class="col q-pa-xl column">
<div class="col"> <div class="col">
<q-card class="w-450 q-ma-xl q-pa-xl"> <q-card class="w-450 q-ma-xl q-pa-xl">
<div class="text-h5 pfb q-mb-md text-center">登录大水豚</div> <div class="text-h5 pfb q-mb-md text-center">登录大水豚</div>
...@@ -42,49 +42,157 @@ ...@@ -42,49 +42,157 @@
</div> </div>
</q-card> </q-card>
</div> </div>
<div class="q-my-lg q-mx-xl text-center row w-450-only">
<div class="f12 text-dark">© 2021-{{ dtNow }} 微途科技 版权所有</div> </div> -->
<div class="text-center col text-right"> <div class="login-box">
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">关于大水豚</router-link> <div class="login-box-desc"></div>
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">联系我们</router-link> <div class="login-box-form">
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">技术支持</router-link> <div class="form-title">登录</div>
<div class="form-content">
<q-input standout v-model="userModel.username" dense ref="usernameRef" label="账号"
:rules="userValidateRule.usernameRule" />
<q-input standout v-model="userModel.password" type="password" dense ref="passwordRef" label="密码"
:rules="userValidateRule.userpasswordRule" />
<q-btn color="primary" label="登录" class="login-btn" @click="loginSubmit" />
</div> </div>
</div> </div>
</div>
<div class="q-my-lg q-mx-xl text-center row w-450-only right-copy">
<div class="f12 text-dark">© 2021-{{ dtNow }} 微途科技 版权所有</div>
<div class="text-center col text-right">
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">关于大水豚
</router-link>
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">联系我们</router-link>
<router-link :to="{ path: '/auth/forget' }" class="f12 no-underline change-a-primary q-mr-md">技术支持
</router-link>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { defineComponent } from 'vue' import {
import useLgoinModule from '@/module/user/loginModule' defineComponent
import useMetaModule from '@/module/meta/metaModule' } from 'vue'
import useLgoinModule from '@/module/user/loginModule'
import useMetaModule from '@/module/meta/metaModule'
export default defineComponent({
components: {
},
setup() {
//TODO: 缺陷，验证与提交应该使用Form表单来完成，不应该进行单个验证
let {
userModel,
usernameRef,
passwordRef,
userValidateRule,
loginSubmit,
stateManager
} = useLgoinModule()
let {
setTitle
} = useMetaModule()
setTitle('登录')
const dtNow = new Date().getFullYear()
return {
userModel,
usernameRef,
passwordRef,
userValidateRule,
loginSubmit,
dtNow,
stateManager
}
}
})
export default defineComponent({
setup() {
//TODO: 缺陷，验证与提交应该使用Form表单来完成，不应该进行单个验证
let { userModel, usernameRef, passwordRef, userValidateRule, loginSubmit, stateManager } = useLgoinModule()
let { setTitle } = useMetaModule()
setTitle('登录')
const dtNow = new Date().getFullYear()
return { userModel, usernameRef, passwordRef, userValidateRule, loginSubmit, dtNow, stateManager }
}
})
</script> </script>
<style> <style lang="scss" scoped>
.login-bg { .login-bg {
background-image: url(../../assets/images/8.png); min-height: 100vh;
background-position-x: center; background-image: url(../../assets/images/login-bg.jpeg);
background-position-y: bottom; background-position-x: 50%;
background-repeat: no-repeat; background-position-y: center;
background-size: contain; background-repeat: no-repeat;
} background-size: cover;
.w-450 { position: relative;
width: 450px;
box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075) !important; .login-box {
border-radius: 0.475rem !important; height: 440px;
} display: flex;
.w-450-only { box-shadow: 0 0 15px 0 rgb(0 66 255 / 9%);
width: 450px; border-radius: 15px;
} overflow: hidden;
background-color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.login-box-desc {
position: relative;
width: 375px;
height: 100%;
background: url(../../assets/images/8.png) no-repeat 50%;
background-size: 100%;
text-align: center;
}
.login-box-form {
position: relative;
height: 100%;
width: 366px;
.form-title {
width: 252px;
margin: 60px auto 50px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #e7e7e7;
position: relative;
text-align: center;
position: relative;
font-size: 20px;
font-weight: 600;
color: #000;
line-height: 28px;
padding-bottom: 11px;
cursor: pointer;
}
.form-content {
width: 237px;
text-align: center;
margin: 0 auto;
.login-btn {
width: 100%;
margin-top: 15px;
}
}
}
}
}
.right-copy{
position: absolute;
bottom: 10%;
left: 50%;
transform: translateX(-50%);
text-align: center;
}
.w-450 {
width: 450px;
box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075) !important;
border-radius: 0.475rem !important;
}
.w-450-only {
width: 450px;
}
</style> </style>
src/store/utils.ts
View file @ 718837fb
...@@ -46,4 +46,4 @@ export function dispatchAction<T>(module: ModuleNameType, key: keyof T, value?: ...@@ -46,4 +46,4 @@ export function dispatchAction<T>(module: ModuleNameType, key: keyof T, value?:
*/ */
export function getStoreGetter<T>(module: ModuleNameType, key: keyof T) { export function getStoreGetter<T>(module: ModuleNameType, key: keyof T) {
return store.getters[`${module}/${key}`] return store.getters[`${module}/${key}`]
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment