完成登录功能
This commit is contained in:
parent
1ef1329495
commit
e8c230211b
|
|
@ -0,0 +1,92 @@
|
|||
/*
|
||||
* @Author: Kane
|
||||
* @Date: 2023-02-28 14:48:30
|
||||
* @LastEditors: Kane
|
||||
* @FilePath: /task_schedule/src/data/cpicxim/StuffInfo.ts
|
||||
* @Description:
|
||||
*
|
||||
* Copyright (c) ${2022} by Kane, All Rights Reserved.
|
||||
*/
|
||||
|
||||
class StaffInfo
|
||||
{
|
||||
constructor(
|
||||
p13uid: string,
|
||||
staff_code: string,
|
||||
staff_name: string,
|
||||
department_code: string,
|
||||
department_name: string,
|
||||
section_office_code: string,
|
||||
section_office_name: string
|
||||
)
|
||||
{
|
||||
this._stuffCode = staff_code;
|
||||
this._stuffName = staff_name;
|
||||
this._p13uid = p13uid;
|
||||
this._department_code = department_code;
|
||||
this._department_name = department_name;
|
||||
this._section_office_code = section_office_code;
|
||||
this._section_office_name = section_office_name;
|
||||
}
|
||||
|
||||
public get stuffCode(): string
|
||||
{
|
||||
return this._stuffCode;
|
||||
}
|
||||
|
||||
public set stuffCode(stuff_code: string)
|
||||
{
|
||||
this._stuffCode = stuff_code;
|
||||
}
|
||||
|
||||
public get stuffName(): string
|
||||
{
|
||||
return this._stuffName;
|
||||
}
|
||||
|
||||
public set stuffName(stuff_name: string)
|
||||
{
|
||||
this._stuffName = stuff_name;
|
||||
}
|
||||
|
||||
public get P13UID(): string
|
||||
{
|
||||
return this._p13uid;
|
||||
}
|
||||
|
||||
public set P13UID(p13uid: string)
|
||||
{
|
||||
this._p13uid = p13uid;
|
||||
}
|
||||
|
||||
public set departmentCode(department_code: string)
|
||||
{
|
||||
this._department_code = department_code;
|
||||
}
|
||||
|
||||
public get departmentCode()
|
||||
{
|
||||
return this._department_code;
|
||||
}
|
||||
|
||||
public set departmentName(department_name: string)
|
||||
{
|
||||
this._department_name = department_name;
|
||||
}
|
||||
|
||||
public get departmentName()
|
||||
{
|
||||
return this._department_name;
|
||||
}
|
||||
|
||||
private _stuffCode: string;
|
||||
private _stuffName: string;
|
||||
private _p13uid: string;
|
||||
private _department_code: string;
|
||||
private _department_name: string;
|
||||
private _section_office_code: string;
|
||||
private _section_office_name: string;
|
||||
}
|
||||
|
||||
export { StaffInfo };
|
||||
|
||||
|
|
@ -1,66 +0,0 @@
|
|||
/*
|
||||
* @Author: Kane
|
||||
* @Date: 2023-02-28 14:48:30
|
||||
* @LastEditors: Kane
|
||||
* @FilePath: /deskop_task_schedule/code/web/task_schedule/src/data/cpicxim/StuffInfo.ts
|
||||
* @Description:
|
||||
*
|
||||
* Copyright (c) ${2022} by Kane, All Rights Reserved.
|
||||
*/
|
||||
|
||||
class StuffInfo
|
||||
{
|
||||
StuffInfo(
|
||||
stuff_code: string = "",
|
||||
stuff_name: string = "",
|
||||
p13uid: string = "",
|
||||
department_code: string = "",
|
||||
department_name: string = ""
|
||||
)
|
||||
{
|
||||
this._stuffCode = stuff_code;
|
||||
this._stuffName = stuff_name;
|
||||
this._p13uid = p13uid;
|
||||
this._department_code = department_code;
|
||||
this._department_name = department_name;
|
||||
}
|
||||
|
||||
public get StuffCode(): string
|
||||
{
|
||||
return this._stuffCode;
|
||||
}
|
||||
|
||||
public set StuffCode(stuff_code: string)
|
||||
{
|
||||
this._stuffCode = stuff_code;
|
||||
}
|
||||
|
||||
public get StuffName(): string
|
||||
{
|
||||
return this._stuffName;
|
||||
}
|
||||
|
||||
public set StuffName(stuff_name: string)
|
||||
{
|
||||
this._stuffName = stuff_name;
|
||||
}
|
||||
|
||||
public get P13UID(): string
|
||||
{
|
||||
return this._p13uid;
|
||||
}
|
||||
|
||||
public set P13UID(p13uid: string)
|
||||
{
|
||||
this._p13uid = p13uid;
|
||||
}
|
||||
|
||||
private _stuffCode: string;
|
||||
private _stuffName: string;
|
||||
private _p13uid: string;
|
||||
private _department_code: string;
|
||||
private _department_name: string;
|
||||
}
|
||||
|
||||
export { StuffInfo };
|
||||
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
html {
|
||||
/* background-color: #8796a6; */
|
||||
background-image: url("./assets/img/bg/bg_01.jpg");
|
||||
background-attachment: fixed;
|
||||
background-size: contain;
|
||||
|
|
@ -8,11 +7,8 @@ html {
|
|||
}
|
||||
|
||||
body {
|
||||
/* background-color: #8796a6; */
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
border: 1px solid green;
|
||||
/* overflow: hidden; */
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ import { service as instance } from "@/utils/api/request";
|
|||
import { API_URL } from "@/utils/api/config";
|
||||
interface LoginInfo
|
||||
{
|
||||
account: string;
|
||||
p13account: string;
|
||||
password: string;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,19 +2,17 @@
|
|||
* @Author: Kane
|
||||
* @Date: 2023-02-28 09:26:45
|
||||
* @LastEditors: Kane
|
||||
* @FilePath: /deskop_task_schedule/code/web/task_schedule/src/utils/localStorage/localStorage.ts
|
||||
* @FilePath: /task_schedule/src/utils/api/localStorage.ts
|
||||
* @Description:
|
||||
*
|
||||
* Copyright (c) ${2022} by Kane, All Rights Reserved.
|
||||
*/
|
||||
import { StuffInfo } from "@/data/cpicxim/StuffInfo";
|
||||
import { StaffInfo } from "@/data/cpicxim/StaffInfo";
|
||||
|
||||
const STUFF_ITEM = "STUFF_INFO";
|
||||
const STUFF_ITEM = "stuff_info";
|
||||
|
||||
function loadStaffInfo(): StuffInfo
|
||||
function loadStaffInfo(): StaffInfo
|
||||
{
|
||||
const stuff = new StuffInfo();
|
||||
|
||||
let obj = null;
|
||||
|
||||
try
|
||||
|
|
@ -26,18 +24,24 @@ function loadStaffInfo(): StuffInfo
|
|||
obj = {};
|
||||
}
|
||||
|
||||
stuff.StuffCode = obj._stuffCode || "";
|
||||
stuff.StuffName = obj._stuffName || "";
|
||||
stuff.P13UID = obj._p13uid || "";
|
||||
const stuff = new StaffInfo(
|
||||
obj._p13uid || "",
|
||||
obj._stuffCode || "",
|
||||
obj._stuffName || "",
|
||||
obj._department_code || "",
|
||||
obj._department_name || "",
|
||||
obj._section_office_code || "",
|
||||
obj._section_office_name || "");
|
||||
|
||||
|
||||
return stuff;
|
||||
}
|
||||
|
||||
function saveStuffInfo(stuff: StuffInfo)
|
||||
function saveStaffInfo(stuff: StaffInfo)
|
||||
{
|
||||
const json = JSON.stringify(stuff);
|
||||
|
||||
window.localStorage.setItem(STUFF_ITEM, json);
|
||||
};
|
||||
|
||||
export { loadStaffInfo, saveStuffInfo };
|
||||
export { loadStaffInfo, saveStaffInfo };
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
* @Author: Kane
|
||||
* @Date: 2023-02-28 00:57:21
|
||||
* @LastEditors: Kane
|
||||
* @FilePath: /deskop_task_schedule/code/web/task_schedule/src/views/Login.vue
|
||||
* @FilePath: /task_schedule/src/views/Login.vue
|
||||
* @Description:
|
||||
* 登录页面，路由默认指向这个页面
|
||||
* 1、判断url中的参数，取得用户信息，根据用户的部门改变路由
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
<template>
|
||||
<div class="page-wrapper">
|
||||
<div class="login-wrapper">
|
||||
<h1>登录</h1>
|
||||
<h1>请登录</h1>
|
||||
<el-form ref="loginForm">
|
||||
<el-form-item>
|
||||
<label class="form-label">用户名</label>
|
||||
|
|
@ -20,29 +20,27 @@
|
|||
</el-form-item>
|
||||
<el-form-item>
|
||||
<label class="form-label">密码</label>
|
||||
<el-input type="text" v-model.trim.lazy="ui.savedP13uid" placeholder="请输入P13密码"></el-input>
|
||||
<el-input type="password" v-model.trim.lazy="ui.password" placeholder="请输入P13密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" class="el-button-block" @click="savedP13uid">
|
||||
<el-button type="primary" class="el-button-block" @click="onLogin">
|
||||
登录
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div>
|
||||
<span>{{ ui.savedP13uid }}</span>
|
||||
<span>{{ ui.tips }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { reactive } from "vue";
|
||||
import { service as instance } from "@/utils/api/request";
|
||||
import { getParamsFromURL } from "@/utils/api/url";
|
||||
import { loadStaffInfo, saveStuffInfo } from "@/utils/api/localStorage";
|
||||
|
||||
|
||||
const URL = "http://222.76.244.118:11001/admin-system/account/p13_account_check";
|
||||
import { reactive, onBeforeMount } from "vue";
|
||||
import { loadStaffInfo, saveStaffInfo } from "@/utils/api/localStorage";
|
||||
import { login } from "@/utils/account";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { StaffInfo } from "@/data/cpicxim/StaffInfo";
|
||||
|
||||
export default {
|
||||
name: "LoginPage",
|
||||
|
|
@ -50,7 +48,8 @@ export default {
|
|||
{
|
||||
const ui = reactive({
|
||||
account: "",
|
||||
savedP13uid: "",
|
||||
password: "",
|
||||
tips: "",
|
||||
showNeedAccountTip: false,
|
||||
showAccountErrorTip: false,
|
||||
});
|
||||
|
|
@ -58,20 +57,81 @@ export default {
|
|||
const savedP13uid = () =>
|
||||
{
|
||||
window.localStorage.setItem("stuff_account", ui.account);
|
||||
|
||||
ui.savedP13uid = window.localStorage.getItem("stuff_account") || "";
|
||||
|
||||
alert(ui.savedP13uid);
|
||||
};
|
||||
|
||||
ui.savedP13uid = window.localStorage.getItem("stuff_account") || "";
|
||||
const onLogin = () =>
|
||||
{
|
||||
const info = {
|
||||
p13account: ui.account,
|
||||
password: ui.password,
|
||||
};
|
||||
|
||||
login(info)
|
||||
.then((response) =>
|
||||
{
|
||||
const data = response.data || { success: false, };
|
||||
|
||||
if (data.success == true)
|
||||
{
|
||||
//提示登录成功，并保存到localStorage，然后路由跳转
|
||||
ElMessage({
|
||||
message: data.message,
|
||||
type: "success",
|
||||
center: true,
|
||||
});
|
||||
|
||||
const staffInfo = new StaffInfo(
|
||||
data.staff_info.p13uid || "",
|
||||
data.staff_info.code || "",
|
||||
data.staff_info.name || "",
|
||||
data.staff_info.department_code || "",
|
||||
data.staff_info.department_name || "",
|
||||
data.staff_info.section_office_code || "",
|
||||
data.staff_info.p13section_office_nameuid || ""
|
||||
);
|
||||
|
||||
saveStaffInfo(staffInfo);
|
||||
|
||||
//跳转路由
|
||||
}
|
||||
else
|
||||
{
|
||||
ElMessage({
|
||||
message: data.message,
|
||||
type: "error",
|
||||
center: true,
|
||||
});
|
||||
}
|
||||
|
||||
console.log(data);
|
||||
})
|
||||
.catch((error) =>
|
||||
{
|
||||
debugger;
|
||||
console.log(`登录失败，返回信息：${error}`);
|
||||
});
|
||||
};
|
||||
|
||||
onBeforeMount(() =>
|
||||
{
|
||||
const staffInfo = loadStaffInfo();
|
||||
|
||||
if (staffInfo.P13UID)
|
||||
{
|
||||
ElMessage({
|
||||
message: `已登录账号:${staffInfo.stuffName}`,
|
||||
type: "success",
|
||||
center: true,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// setInterval(() =>
|
||||
// {
|
||||
// window.location.reload();
|
||||
// }, 5000);
|
||||
|
||||
return { ui, savedP13uid, };
|
||||
return { ui, savedP13uid, onLogin, };
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -81,12 +141,12 @@ export default {
|
|||
box-sizing: border-box;
|
||||
height: calc(100vh - 10mm);
|
||||
width: calc(100vw - 10mm);
|
||||
margin: 5mm;
|
||||
border: 1px solid red;
|
||||
// border: 1px solid red;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: start;
|
||||
padding-top: calc(100vh * 0.1);
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
|
||||
|
||||
span {
|
||||
font-size: 30px;
|
||||
|
|
@ -95,9 +155,11 @@ export default {
|
|||
}
|
||||
|
||||
.login-wrapper {
|
||||
box-sizing: border-box;
|
||||
width: 320px;
|
||||
// margin-top: 5cm auto auto auto;
|
||||
padding: 5mm;
|
||||
margin-top: calc(100vh * 0.05);
|
||||
padding: 10mm;
|
||||
background-color: #cac2c27f;
|
||||
backdrop-filter: blur(10px);
|
||||
border-radius: 5px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue