guoxiangbin
/
ocr-web
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Merge branch 'al'

Browse Source
pull/1/head
刘释隆 1 year ago
parent 30080d27f4 7b41058379
commit fb6abe1028
3 changed files with 113 additions and 105 deletions
Show Stats Download Patch File Download Diff File

2
src/utils/http/axios/index.ts
Unescape View File

@ -201,7 +201,7 @@ const transform: AxiosTransform = {
// eslint-disable-next-line ts/no-use-before-define
const instance = http.getAxios()
const config = response.config
const whitelist = ['/api/captcha/captchatoken', '/api/captcha/captchaImage', '/api/backstage/adminlogin', '/api/oauthweb/token']
const whitelist = ['/api/captcha/captchatoken', '/api/captcha/captchaImage', '/api/backstage/adminlogin', '/api/oauthweb/token','/api/web/smslogin/login']
const expirationTime = storage.get(TOKEN_EXPIRATION_TIME)
// console.log('剩余失效时间(分):', (expirationTime - Date.now()) / 1000 / 60, config.url)

22
src/views/login/components/Login.vue
Unescape View File

@ -54,7 +54,23 @@ const rules = {
enterprisecode: { required: true, message: "请输入企业编码", trigger: "blur" },
agentcode: { required: true, message: "请输入企业编码", trigger: "blur" },
phone: { required: true, message: "请输入手机号", trigger: "blur" },
phonecode: { required: true, message: "请输入验证码", trigger: "blur" },
phonecode: [
{ required: true, message: "请输入验证码", trigger: "blur" },
{
trigger: ["blur"],
level: "error",
validator(_rule, value) {
if (value.length < 4 && value.length > 0) {
return new Error("请正确填写4位手机短信验证码");
}
if (loginSuccess.value) {
return true;
} else {
return new Error("验证码错误");
}
},
},
],
username: { required: true, message: "请输入用户名", trigger: "blur" },
password: { required: true, message: "请输入密码", trigger: "blur" },
captcha: { required: true, message: "请输入验证码", trigger: "blur" },
@ -114,6 +130,7 @@ function handleSmsSubmit(e) {
});
const { code, message: msg } = res;
if (code === ResultEnum.SUCCESS) {
loginSuccess.value = true;
// const { code, message: msg } = await userStore.login(params)
await userStore.getInformation();
@ -125,7 +142,10 @@ function handleSmsSubmit(e) {
} else {
message.destroyAll();
message.info(msg || "登录失败");
loginSuccess.value = false;
}
}
catch(e){
} finally {
loading.value = false;
}

194
src/views/login/index.vue
Unescape View File

@ -1,18 +1,18 @@
<script lang="ts" setup>
import { ref } from 'vue'
import Login from './components/Login.vue'
import Forget from './components/Forget.vue'
import { ref } from "vue";
import Login from "./components/Login.vue";
import Forget from "./components/Forget.vue";
const show = ref(false)
const ifLogin = ref(true)
const show = ref(false);
const ifLogin = ref(true);
function showLogin() {
show.value = true
show.value = true;
}
function close() {
show.value = false
ifLogin.value = true
show.value = false;
ifLogin.value = true;
}
</script>
@ -20,87 +20,59 @@ function close() {
<div class="wrap-login">
<div class="content">
<div class="header f-c-b">
<img class="img-logo" src="@/assets/images/login/logo.png" alt="">
<div class="btn-login f-c-c" @click="showLogin">
登录
</div>
<img class="img-logo" src="@/assets/images/login/logo.png" alt="" />
<div class="btn-login f-c-c" @click="showLogin">登录</div>
</div>
<div class="img-wrap f-s">
<img class="img-ai" src="../../assets/images/login/ai.png" alt="">
<img class="img-ai" src="../../assets/images/login/ai.png" alt="" />
<div class="right">
<div class="f-c">
<img class="img-item" src="../../assets/images/login/img-item-1.png" alt="">
<img class="img-item" src="../../assets/images/login/img-item-2.png" alt="">
<img class="img-item" src="../../assets/images/login/img-item-3.png" alt="">
<img class="img-item" src="../../assets/images/login/img-item-4.png" alt="">
<img class="img-item" src="../../assets/images/login/img-item-5.png" alt="">
</div>
<div class="img-task">
Task approval
<img class="img-item" src="../../assets/images/login/img-item-1.png" alt="" />
<img class="img-item" src="../../assets/images/login/img-item-2.png" alt="" />
<img class="img-item" src="../../assets/images/login/img-item-3.png" alt="" />
<img class="img-item" src="../../assets/images/login/img-item-4.png" alt="" />
<img class="img-item" src="../../assets/images/login/img-item-5.png" alt="" />
</div>
<div class="img-task">Task approval</div>
</div>
</div>
<div class="center-text f-c-b">
<img class="img-ip" src="../../assets/images/login/img-ip.png" alt="">
<img class="img-text" src="../../assets/images/login/img-text.png" alt="">
<img class="img-icon-1" src="../../assets/images/login/img-icon-1.png" alt="">
</div>
<div class="text">
企业级 SaaS 智能审批解决方案
</div>
<img class="img-icon-2" src="../../assets/images/login/img-icon-2.png" alt="">
<div class="btn-login-2 f-c-c" @click="showLogin">
立即登录 ->
<img class="img-ip" src="../../assets/images/login/img-ip.png" alt="" />
<img class="img-text" src="../../assets/images/login/img-text.png" alt="" />
<img class="img-icon-1" src="../../assets/images/login/img-icon-1.png" alt="" />
</div>
<div class="text">企业级 SaaS 智能审批解决方案</div>
<img class="img-icon-2" src="../../assets/images/login/img-icon-2.png" alt="" />
<div class="btn-login-2 f-c-c" @click="showLogin">立即登录 -></div>
<div class="item-wrap f-c">
<div class="item">
<img class="item-img" src="../../assets/images/login/item-1.png" alt="">
<div class="title">
AI一键查重
</div>
<div class="subtitle">
一键查重，生成任务包
</div>
<img class="item-img" src="../../assets/images/login/item-1.png" alt="" />
<div class="title">AI一键查重</div>
<div class="subtitle">一键查重，生成任务包</div>
</div>
<div class="item">
<img class="item-img" src="../../assets/images/login/item-2.png" alt="">
<div class="title">
AI工单管理
</div>
<div class="subtitle">
智能批量辨识真假，假图快速审批
</div>
<img class="item-img" src="../../assets/images/login/item-2.png" alt="" />
<div class="title">AI工单管理</div>
<div class="subtitle">智能批量辨识真假，假图快速审批</div>
</div>
<div class="item">
<img class="item-img" src="../../assets/images/login/item-3.png" alt="">
<div class="title">
AI快速审批
</div>
<div class="subtitle">
智能图片比对，批量审批，一键确认
</div>
<img class="item-img" src="../../assets/images/login/item-3.png" alt="" />
<div class="title">AI快速审批</div>
<div class="subtitle">智能图片比对，批量审批，一键确认</div>
</div>
<div class="item">
<img class="item-img" src="../../assets/images/login/item-4.png" alt="">
<div class="title">
OCR
</div>
<div class="subtitle">
图片自动识别、文档图片版面解析
</div>
<img class="item-img" src="../../assets/images/login/item-4.png" alt="" />
<div class="title">OCR</div>
<div class="subtitle">图片自动识别、文档图片版面解析</div>
</div>
<div class="item">
<img class="item-img" src="../../assets/images/login/item-5.png" alt="">
<div class="title">
更多功能
</div>
<div class="subtitle">
探索更多功能
</div>
<img class="item-img" src="../../assets/images/login/item-5.png" alt="" />
<div class="title">更多功能</div>
<div class="subtitle">探索更多功能</div>
</div>
</div>
<img class="item-footer" src="../../assets/images/login/footer.png" alt="">
<img class="item-footer" src="../../assets/images/login/footer.png" alt="" />
</div>
<n-modal v-model:show="show" :mask-closable="false">
<Login v-if="ifLogin" @close="close" @forget="ifLogin = !ifLogin" />
@ -111,54 +83,54 @@ function close() {
<style lang="less" scoped>
.wrap-login {
background-image: url('../../assets/images/login/bg.png');
background-image: url("../../assets/images/login/bg.png");
background-repeat: no-repeat;
background-size: cover;
height: 100vh;
.f-c-c{
.f-c-c {
display: flex;
align-items: center;
justify-content: center;
}
.f-c-b{
.f-c-b {
display: flex;
align-items: center;
justify-content: space-between;
}
.f-c{
.f-c {
display: flex;
align-items: center;
}
.f-s{
.f-s {
display: flex;
align-items: flex-start;
}
.img-logo{
.img-logo {
width: 121px;
height: 35px;
}
.img-ai{
.img-ai {
width: 97px;
height: 90px;
}
.img-item{
.img-item {
width: 53px;
height: 52px;
margin-left: -10px;
}
.img-task{
.img-task {
width: 138px;
height: 54px;
border-radius: 6px;
background-image: url('../../assets/images/login/img-task.png');
background-image: url("../../assets/images/login/img-task.png");
background-repeat: no-repeat;
background-size: cover;
font-size: 14px;
@ -173,38 +145,38 @@ function close() {
text-align: center;
}
.img-ip{
.img-ip {
width: 80px;
height: 80px;
}
.img-text{
.img-text {
width: 600px;
height: 65px;
margin-top: 43px;
}
.img-icon-1{
.img-icon-1 {
width: 54px;
height: 54px;
}
.img-icon-2{
.img-icon-2 {
width: 54px;
height: 54px;
margin-left: 830px;
}
.content{
.content {
width: 1300px;
margin: 0 auto;
padding-top: 27px;
}
.header{
.header {
margin-bottom: 44px;
.btn-login{
.btn-login {
width: 76px;
height: 40px;
border: 1px solid #666666;
@ -217,16 +189,16 @@ function close() {
}
}
.img-wrap{
.img-wrap {
padding-left: 174px;
}
.center-text{
.center-text {
margin: 0 auto;
width: 776px;
}
.text{
.text {
font-size: 20px;
font-family: PingFang SC, PingFang SC-Regular;
font-weight: Regular;
@ -236,12 +208,12 @@ function close() {
margin-top: 32px;
}
.btn-login-2{
.btn-login-2 {
width: 138px;
height: 44px;
background: linear-gradient(136deg,#3258e8, #786efc 100%);
background: linear-gradient(136deg, #3258e8, #786efc 100%);
border-radius: 8px;
box-shadow: 0px 2px 6px 0px rgba(116,153,253,0.30);
box-shadow: 0px 2px 6px 0px rgba(116, 153, 253, 0.3);
font-size: 16px;
font-family: PingFang SC, PingFang SC-Medium;
font-weight: Medium;
@ -252,12 +224,12 @@ function close() {
cursor: pointer;
}
.item-wrap{
.item-wrap {
margin-top: 78px;
.item{
.item {
width: 258px;
height: 132px;
background-image: url('../../assets/images/login/item-bg.png');
background-image: url("../../assets/images/login/item-bg.png");
background-repeat: no-repeat;
background-size: cover;
position: relative;
@ -266,7 +238,7 @@ function close() {
box-sizing: border-box;
}
.item-img{
.item-img {
width: 66px;
height: 76px;
position: absolute;
@ -274,7 +246,7 @@ function close() {
left: 20px;
}
.title{
.title {
font-size: 16px;
font-family: PingFang SC, PingFang SC-Medium;
font-weight: Medium;
@ -283,7 +255,7 @@ function close() {
margin-bottom: 8px;
}
.subtitle{
.subtitle {
font-size: 12px;
font-family: PingFang SC, PingFang SC-Regular;
font-weight: Regular;
@ -292,13 +264,29 @@ function close() {
}
}
.item-footer{
width: 970px;
height: 119px;
position: fixed;
left: 50%;
bottom: 0;
margin-left: -485px;
@media screen and (min-width: 1440px) {
.item-footer {
max-width: 970px;
max-height: 119px;
width: 50%;
height: 10vh;
position: fixed;
left: 50%;
bottom: 0;
margin-left: -485px;
}
}
@media screen and (min-width:1440) {
.item-footer {
max-width: 970px;
max-height: 119px;
width: 50%;
height: 10vh;
position: fixed;
left: 60%;
bottom: 0;
margin-left: -485px;
}
}
}
</style>

Write Preview
Loading…
Cancel
Save