新增二次封装axios,登录对接逻辑

main
helloworld180 1 week ago
parent 968b81ea7c
commit 821a126fe0

@ -1 +1 @@
[{"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js":"1","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue":"2","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js":"3","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue":"4","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue":"5","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue":"6","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue":"7","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue":"8","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue":"9","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue":"10","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue":"11"},{"size":261,"mtime":1731506523733,"results":"12","hashOfConfig":"13"},{"size":97,"mtime":1731506523731,"results":"14","hashOfConfig":"13"},{"size":1052,"mtime":1731513557777,"results":"15","hashOfConfig":"13"},{"size":753,"mtime":1731566372416,"results":"16","hashOfConfig":"13"},{"size":2643,"mtime":1731566073424,"results":"17","hashOfConfig":"13"},{"size":919,"mtime":1731566064122,"results":"18","hashOfConfig":"13"},{"size":161,"mtime":1731508571798,"results":"19","hashOfConfig":"13"},{"size":156,"mtime":1731511731213,"results":"20","hashOfConfig":"13"},{"size":155,"mtime":1731512433247,"results":"21","hashOfConfig":"13"},{"size":157,"mtime":1731512507547,"results":"22","hashOfConfig":"13"},{"size":151,"mtime":1731513510444,"results":"23","hashOfConfig":"13"},{"filePath":"24","messages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},"10795if",{"filePath":"27","messages":"28","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"30","messages":"31","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},{"filePath":"32","messages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"40","messages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"42","messages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"44","messages":"45","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"46","messages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue",[]]
[{"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js":"1","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue":"2","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js":"3","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue":"4","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue":"5","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue":"6","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue":"7","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue":"8","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue":"9","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue":"10","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue":"11"},{"size":261,"mtime":1731506523733,"results":"12","hashOfConfig":"13"},{"size":97,"mtime":1731506523731,"results":"14","hashOfConfig":"13"},{"size":1052,"mtime":1731513557777,"results":"15","hashOfConfig":"13"},{"size":359,"mtime":1731741182777,"results":"16","hashOfConfig":"13"},{"size":2643,"mtime":1731566073424,"results":"17","hashOfConfig":"13"},{"size":919,"mtime":1731566064122,"results":"18","hashOfConfig":"13"},{"size":161,"mtime":1731508571798,"results":"19","hashOfConfig":"13"},{"size":156,"mtime":1731511731213,"results":"20","hashOfConfig":"13"},{"size":155,"mtime":1731512433247,"results":"21","hashOfConfig":"13"},{"size":157,"mtime":1731512507547,"results":"22","hashOfConfig":"13"},{"size":14422,"mtime":1731741182778,"results":"23","hashOfConfig":"13"},{"filePath":"24","messages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},"10795if",{"filePath":"27","messages":"28","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"30","messages":"31","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},{"filePath":"32","messages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"40","messages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"42","messages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"44","messages":"45","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"46","messages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue",[]]

56
package-lock.json generated

@ -8,6 +8,7 @@
"name": "demo",
"version": "0.1.0",
"dependencies": {
"axios": "^1.7.7",
"core-js": "^3.8.3",
"element-plus": "^2.8.6",
"vite": "^5.4.10",
@ -4337,6 +4338,11 @@
"integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==",
"license": "MIT"
},
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmmirror.com/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
},
"node_modules/at-least-node": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/at-least-node/-/at-least-node-1.0.0.tgz",
@ -4385,6 +4391,16 @@
"postcss": "^8.1.0"
}
},
"node_modules/axios": {
"version": "1.7.7",
"resolved": "https://registry.npmmirror.com/axios/-/axios-1.7.7.tgz",
"integrity": "sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
"proxy-from-env": "^1.1.0"
}
},
"node_modules/babel-loader": {
"version": "8.4.1",
"resolved": "https://registry.npmmirror.com/babel-loader/-/babel-loader-8.4.1.tgz",
@ -5046,6 +5062,17 @@
"dev": true,
"license": "MIT"
},
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmmirror.com/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"dependencies": {
"delayed-stream": "~1.0.0"
},
"engines": {
"node": ">= 0.8"
}
},
"node_modules/commander": {
"version": "8.3.0",
"resolved": "https://registry.npmmirror.com/commander/-/commander-8.3.0.tgz",
@ -5884,6 +5911,14 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/depd": {
"version": "2.0.0",
"resolved": "https://registry.npmmirror.com/depd/-/depd-2.0.0.tgz",
@ -7214,7 +7249,6 @@
"version": "1.15.9",
"resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.9.tgz",
"integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==",
"dev": true,
"funding": [
{
"type": "individual",
@ -7231,6 +7265,19 @@
}
}
},
"node_modules/form-data": {
"version": "4.0.1",
"resolved": "https://registry.npmmirror.com/form-data/-/form-data-4.0.1.tgz",
"integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/forwarded": {
"version": "0.2.0",
"resolved": "https://registry.npmmirror.com/forwarded/-/forwarded-0.2.0.tgz",
@ -8872,7 +8919,6 @@
"version": "1.52.0",
"resolved": "https://registry.npmmirror.com/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"dev": true,
"license": "MIT",
"engines": {
"node": ">= 0.6"
@ -8882,7 +8928,6 @@
"version": "2.1.35",
"resolved": "https://registry.npmmirror.com/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"dev": true,
"license": "MIT",
"dependencies": {
"mime-db": "1.52.0"
@ -10512,6 +10557,11 @@
"node": ">= 0.10"
}
},
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmmirror.com/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/pseudomap": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/pseudomap/-/pseudomap-1.0.2.tgz",

@ -8,6 +8,7 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^1.7.7",
"core-js": "^3.8.3",
"element-plus": "^2.8.6",
"vite": "^5.4.10",

@ -6,5 +6,14 @@
<script setup></script>
<style>
/* 让页面铺满整个屏幕,不出现滚动条 */
html,
body,
#app {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: auto;
}
</style>

@ -0,0 +1,147 @@
.base{
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-image: url("@/assets/pictures/background.png");
background-size: 100%;
}
.loginAndRegist{
position: absolute;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
right:6%;
top:35%;
}
.loginArea{
background-color: rgba(255,255,255,0.8);
opacity: 0.8;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
height: 400px;
width: 400px;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
overflow: hidden;
}
.registArea{
opacity: 0.8;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
height: 400px;
width: 400px;
background-color: rgba(255,255,255,0.8);
z-index: 1;
display: flex;
flex-direction: column;
justify-content:center ;
align-items: center;
}
.showInfo{
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
position: absolute;
height: 400px;
width: 400px;
z-index:2;
top: 0;
right: 0;
background-image: url("@/assets/pictures/welcome.png");
background-size: 90%;
}
.showInfo:hover{
background-size: 100%;
background-position: -50px -50px;
}
.title{
width: 80%;
flex:1;
border-bottom: 1px solid #E44B9D;
display: flex;
align-items: center;
color: #E44B9D;
font-weight: bold;
font-size: 24px;
display: flex;
justify-content: center;
}
#aaa{
transition: 0.3s linear;
}
.pwdArea{
width: 100%;
flex:2;
display: flex;
flex-direction: column;
color: #E44B9D;
font-size: 20px;
font-weight: bold;
}
.pwdArea input{
height: 30px;
border-radius:15px ;
padding-left: 10px;
font-size: 13px;
}
/* 移除输入框边框 */
.el-input__inner {
border: none !important;
outline: none !important;
}
.pwdArea input:focus{
border: 2px solid #E44B9D;
}
.btnArea{
flex:1;
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
}
.rigestTitle{
width: 70%;
flex: 1;
color: #E44B9D;
font-weight: bold;
font-size: 24px;
display: flex;
justify-content: center;
align-items: center;
border-bottom: 1px solid #E44B9D;
}
.registForm{
flex: 2;
display: flex;
flex-direction: column;
color: #E44B9D;
font-size: 20px;
font-weight: bold;
}
.registForm input{
outline: none;
height: 30px;
border-radius:13px ;
padding-left: 10px;
font-size: 12px;
border: 1px solid gray;
}
.registForm input:focus{
border: 2px solid #E44B9D;
}
#elselect:focus{
border: 2px solid #E44B9D;
}
.registBtn{
flex: 1;
display: flex;
justify-content: center;
align-items: center;
}

@ -0,0 +1,18 @@
// 存储、获取、删除token的文件
// 定义 setToken 函数,用于将 token 存储到 localStorage
export function setToken(token) {
localStorage.setItem('authToken', token);
}
// 定义 getToken 函数,用于从 localStorage 获取 token
export function getToken() {
return localStorage.getItem('authToken');
}
// 定义 removeToken 函数,用于从 localStorage 删除 token
export function removeToken() {
localStorage.removeItem('authToken');
}

@ -0,0 +1,64 @@
// axiosConfig.js
import axios from 'axios';
import {getToken} from '@/token/auth' // 注意这里使用了解构赋值来导入getToken函数
// 创建axios实例
const service = axios.create({
baseURL: 'http://47.122.59.26:8080/api', // 配置基础URL
timeout: 5000, // 请求超时时间
});
// 请求拦截器
service.interceptors.request.use(
config => {
// 在发送请求之前做些什么
const token = getToken(); // 获取token的方式取决于你的应用
// console.log('请求拦截器的token是' +token)
console.log('Request Config:', config);
if (token) {
config.headers['Authorization'] = `Bearer ${token}`; // 设置token
// axios.defaults.headers.common['Authorization'] = 'Bearer ' + token;
}
config.headers['Accept'] = 'application/json';
return config;
},
error => {
// 对请求错误做些什么
console.error('Request Error:', error);
return Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
response => {
// 对响应数据做点什么
// 注意这里返回已经包含data
const res = response.data;
// 你可以根据实际情况在这里添加一些通用的响应处理逻辑
// 例如,根据返回的状态码判断请求是否成功
// if (res.code !== 200) {
// 业务错误处理,比如弹窗提示等
// return Promise.reject(new Error(res.message || 'Error'));
// } else {
return res;
// }
},
error => {
// 对响应错误做点什么
// if (error.response) {
// 请求已发出但服务器响应的状态码不在2xx的范围
// console.error('Error status:', error.response.status);
// console.error('Error data:', error.response.data);
// } else if (error.request) {
// 请求已发出,但没有收到响应
// console.error('Error request:', error.request);
// } else {
// 在设置请求时触发错误
console.error('响应拦截器errorMessage:', error.message);
// }
return Promise.reject(error);
}
);
export default service;

@ -33,7 +33,7 @@
</div>
<div style="flex: 1;justify-content: center;display: flex;align-items: center">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:&nbsp;&nbsp;&nbsp;&nbsp;
<el-input placeholder="请输入验证码" v-model="loginUser.password" style="width: 125px" show-password></el-input>
<el-input placeholder="请输入验证码" v-model="loginUser.code" style="width: 125px" ></el-input>
<img src="../../assets/pictures/yanzheng.png" style="width: 60px" alt="假验证码" />
</div>
@ -98,8 +98,8 @@
</div>
<div style="flex: 1;display: flex;align-items: center">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
<el-input placeholder="请输入验证码" v-model="loginUser.password" style="width: 105px;margin-left: 10px" show-password></el-input>
<img src="../../assets/pictures/yanzheng.png" style="width: 60px" alt="假验证码" />
<el-input placeholder="请输入验证码" v-model="regUser.code" style="width: 105px;margin-left: 10px"></el-input>
<img src="../../assets/pictures/yanzheng.png" style="width: 60px;" alt="假验证码" />
</div>
</div>
</transition>
@ -170,172 +170,23 @@
</div>
</div>
</template>
<style>
/* @import '../assets/css/Login.css' */
.base{
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-image: url("../../assets/pictures/background.png");
background-size: 100%;
}
.loginAndRegist{
position: absolute;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
right:6%;
top:35%;
}
.loginArea{
background-color: rgba(255,255,255,0.8);
opacity: 0.8;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
height: 400px;
width: 400px;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
overflow: hidden;
}
.registArea{
opacity: 0.8;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
height: 400px;
width: 400px;
background-color: rgba(255,255,255,0.8);
z-index: 1;
display: flex;
flex-direction: column;
justify-content:center ;
align-items: center;
}
.showInfo{
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
position: absolute;
height: 400px;
width: 400px;
z-index:2;
top: 0;
right: 0;
background-image: url("../../assets/pictures/welcome.png");
background-size: 90%;
}
.showInfo:hover{
background-size: 100%;
background-position: -50px -50px;
}
.title{
width: 80%;
flex:1;
border-bottom: 1px solid #E44B9D;
display: flex;
align-items: center;
color: #E44B9D;
font-weight: bold;
font-size: 24px;
display: flex;
justify-content: center;
}
#aaa{
transition: 0.3s linear;
}
.pwdArea{
width: 100%;
flex:2;
display: flex;
flex-direction: column;
color: #E44B9D;
font-size: 20px;
font-weight: bold;
}
.pwdArea input{
height: 30px;
border-radius:15px ;
padding-left: 10px;
font-size: 13px;
border: 3px solid #EAF2FF;
}
.pwdArea input:focus{
border: 2px solid #E44B9D;
}
.btnArea{
flex:1;
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
}
.rigestTitle{
width: 70%;
flex: 1;
color: #E44B9D;
font-weight: bold;
font-size: 24px;
display: flex;
justify-content: center;
align-items: center;
border-bottom: 1px solid #E44B9D;
}
.registForm{
flex: 2;
display: flex;
flex-direction: column;
color: #E44B9D;
font-size: 20px;
font-weight: bold;
}
.registForm input{
outline: none;
height: 30px;
border-radius:13px ;
padding-left: 10px;
font-size: 12px;
border: 1px solid gray;
}
.registForm input:focus{
border: 2px solid #E44B9D;
}
#elselect:focus{
border: 2px solid #E44B9D;
}
.registBtn{
flex: 1;
display: flex;
justify-content: center;
align-items: center;
}
</style>
</template>
<script>
import 'animate.css';
// eslint-disable-next-line no-unused-vars
import {Axios as request} from "axios";
// import 'animate.css';
// eslint-disable-next-line no-unused-vars
import {Axios as request} from "axios";
import axios from '@/utils/axiosConfig';
import {setToken} from '@/token/auth'
export default {
name:'loginIndex',
data(){
return{
//
loginUser:{
name:"",
password:""
password:"",
code:'',
},
admins:{},
@ -344,7 +195,7 @@ export default {
regUsername:'',
regRePwd:'',
regPwd:'',
selectValue:"",
code:'',
},
styleObj:{
bordertoprightradius:'15px',
@ -373,9 +224,62 @@ export default {
this.styleObj.rightDis='0px'
this.isShow = !this.isShow
},
async UserLogin() {
if(this.loginUser.code === 'Yj98') {
try {
const response = await axios.post('', null, {
params: {
username: this.loginUser.name,
password: this.loginUser.password
}
});
console.log('登录成功', response)
// tokendata
// !!!
const token = response.token;
// token
setToken(token);
// console.log( 'token' + getToken() )
//
this.$router.push('/main');
} catch (error) {
//
console.error('登录错误:', error);
}
}else{
alert("验证码错误")
}
},
async userRegister() {
if (this.regUser.regPwd !== this.regUser.regRePwd) {
alert('两次输入的密码不一致');
return;
}
if (this.regUser.code !== 'Yj98') {
alert('验证码错误')
}
try {
//
const response = await axios.post('', null, {
params:{
username: this.regUser.regUsername,
password: this.regUser.regPwd,
}
});
//
alert('注册成功');
console.log('注册成功', response);
} catch (error) {
//
console.error('注册失败', error);
}
}
},
}
</script>
</script>
<style>
@import url('../../assets/css/login/login.css');
</style>
Loading…
Cancel
Save