longlong/xw_admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化邮箱激活

Browse Source
This commit is contained in:
龙运模 2024-07-19 15:33:48 +08:00
parent 69e5e3a302
commit 36bd41de6b
7 changed files with 93 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/config/index.js
View File

@ -43,7 +43,7 @@ const DEFAULT_CONFIG = {
LAYOUT: "menu",
//菜单是否折叠
MENU_IS_COLLAPSE: false,
MENU_IS_COLLAPSE: true,
//菜单是否启用手风琴效果
MENU_UNIQUE_OPENED: true,

13
src/layout/index.vue
View File

@ -54,9 +54,15 @@
<template v-else-if="layout=='menu'">
<header class="adminui-header">
<div class="adminui-header-left">
<div class="logo-bar">
<div :class="menuIsCollapse?'logo-bar isCollapse':'logo-bar'">
<span v-if="menuIsCollapse">
<img class="logo" src="https://dm-wh.oss-cn-shanghai.aliyuncs.com/wh/mobilePhoto/4d6e70dbcb2f27d00da51c5232dea6fb1c87ba63.jpg" alt="">
</span>
<!-- <img class="logo" src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/login_logo.png">-->
<span>{{ $CONFIG.APP_NAME }}</span>
<span v-else>{{ $CONFIG.APP_NAME }}</span>
</div>
<div class="adminui-side-bottom" @click="$store.commit('TOGGLE_menuIsCollapse')">
<el-icon><el-icon-expand v-if="menuIsCollapse"/><el-icon-fold v-else /></el-icon>
</div>
<Topbar v-if="!ismobile"></Topbar>
</div>
@ -73,9 +79,6 @@
</el-menu>
</el-scrollbar>
</div>
<!-- <div class="adminui-side-bottom" @click="$store.commit('TOGGLE_menuIsCollapse')">-->
<!-- <el-icon><el-icon-expand v-if="menuIsCollapse"/><el-icon-fold v-else /></el-icon>-->
<!-- </div>-->
</div>
<Side-m v-if="ismobile"></Side-m>
<div class="aminui-body el-container">

7
src/style/app.scss
View File

@ -25,10 +25,13 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
/* 头部 */
.adminui-header {height: 50px;background: #fff;color: #222;display: flex;justify-content:space-between;}
.adminui-header-left {display: flex;align-items: center;padding-left:20px;}
.adminui-header-left {display: flex;align-items: center;}
.adminui-header-right {display: flex;align-items: center;}
.adminui-header .logo-bar {font-size: 18px;font-weight: bold;display: flex;align-items: center;width: 160px;height: 100%;border-right: 1px solid #f2f2f2;}
.adminui-header .logo-bar {font-size: 18px;font-weight: bold;display: flex;align-items: center;justify-content: center;width: 180px;height: 100%;border-right: 1px solid #f2f2f2;}
.adminui-header .isCollapse{width: 65px;}
.adminui-header .logo-bar .logo {height: 42px;}
.adminui-header .logo-bar>span{display: flex;align-items: center;justify-content: center;}
.adminui-header-left .adminui-side-bottom{margin: 0 15px 0 20px;}
.adminui-header .nav {display: flex;height: 100%;margin-left: 40px;}
.adminui-header .nav li {padding:0 10px;margin: 0 10px 0 0;font-size: 14px;color: rgba(255, 255, 255, 0.6);list-style: none;height: 100%;display: flex;align-items: center;cursor: pointer;}
.adminui-header .nav li i {margin-right: 5px;}

3
src/style/pages.scss
View File

@ -24,9 +24,10 @@
/*common-page*/
.common-page {}
.pageHeader{box-shadow: 0 1px 10px rgba(0,0,0,0.14);margin-bottom: 10px;}
.common-header-left {display: flex;align-items: center;}
.common-header-logo {display: flex;align-items: center;}
.common-header-logo img {height:30px;margin-right: 10px;vertical-align: bottom;}
.common-header-logo img {height:40px;margin-right: 10px;vertical-align: bottom;}
.common-header-logo label {font-size: 20px;}
.common-header-title {font-size: 16px;border-left: 1px solid var(--el-border-color-light);margin-left: 15px;padding-left: 15px;}
.common-header-right {display: flex;align-items: center;}

53
src/views/login/activate.vue
View File

@ -1,10 +1,25 @@
<template>
<div></div>
<div class="activateBox">
<common-page>
<div class="cardMain">
<div class="headerBox">电子邮件确认链接</div>
<div class="mainBox">
<div class="msg">电子邮件确认链接</div>
<el-button type="primary" @click="getActivation">请求向您发送新的电子邮件</el-button>
<div class="text">您最近是否申请过帐户，但未确认您的电子邮件地址?如果您尚未确认您的电子邮件地址，您可能需要创建一个新帐户。如果您有问题，请参阅帐户帮助。</div>
</div>
</div>
</common-page>
</div>
</template>
<script>
import commonPage from './components/commonPage'
export default {
name: "activate",
components:{
commonPage
},
data(){
return{
@ -15,9 +30,7 @@ export default {
this.$TOOL.cookie.set("TOKEN", token)
},
mounted() {
setTimeout(()=>{
this.getActivation();
},200)
},
methods:{
async getActivation() {
@ -62,5 +75,35 @@ export default {
</script>
<style scoped lang="scss">
.activateBox{
::v-deep .common-main{
background: #F6F8F9;
}
}
.cardMain{
background: var(--el-color-white);
width: 580px;
margin: 20px auto;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
.headerBox{
padding: 20px;
border-bottom: 1px solid #DCDFE6;
display: flex;
align-items: center;
font-size: 16px;
font-weight: 600;
}
.mainBox{
padding: 20px;
.msg{
margin-bottom: 20px;
font-size: 14px;
}
.text{
margin-top: 20px;
line-height: 20px;
}
}
}
</style>

8
src/views/login/components/commonPage.vue
View File

@ -1,12 +1,12 @@
<template>
<el-container>
<el-header style="height:50px;">
<el-header class="pageHeader" style="height:55px;">
<div class="common-header-left">
<div class="common-header-logo">
<img :alt="$CONFIG.APP_NAME" src="img/logo.png">
<label>{{$CONFIG.APP_NAME}}</label>
<img class="logo" :alt="$CONFIG.APP_NAME" src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/login_logo.png">
<!-- <label>{{$CONFIG.APP_NAME}}</label>-->
</div>
<div class="common-header-title">{{title}}</div>
<!-- <div class="common-header-title">{{title}}</div>-->
</div>
<div class="common-header-right">
<router-link to="/login">返回登录</router-link>

37
src/views/login/userRegister.vue
View File

@ -1,9 +1,9 @@
<template>
<common-page title="注册">
<el-steps :active="stepActive" simple finish-status="success">
<el-step title="填写信息" />
<el-steps :active="stepActive" simple finish-status="success" process-status="finish">
<el-step title="填写信息" />
<el-step title="创建账户" />
<el-step title="注册完成" />
<el-step title="注册完成" />
</el-steps>
<el-form v-if="stepActive==0" ref="stepForm_0" :model="form" :rules="rules" label-position="top">
<el-form-item label="公司名称" prop="company_name">
@ -40,7 +40,7 @@
<div v-if="stepActive==2">
<el-result icon="success" title="账号注册成功" sub-title="">
<template #extra>
<p class="activation" @click="goActivation">激活邮箱</p>
<p class="activation" @click="goActivation">激活邮箱，即可登录</p>
</template>
</el-result>
</div>
@ -70,13 +70,13 @@
stepActive: 0,
form: {
email: "2678188150@qq.com",
mobile:"17610119150",
verify_code:"143087",
company_name:"中国移动管理有限公司",
customer: "中国移动",
login_name:"admin",
name:"ykxiao",
email: "",
mobile:"",
verify_code:"",
company_name:"",
customer: "",
login_name:"",
name:"",
},
rules: {
email: [
@ -177,7 +177,7 @@
<style scoped lang="scss">
.activation{
color: var(--el-color-primary);
color: var(--el-text-color-placeholder);
cursor: pointer;
}
.btnBox{
@ -186,4 +186,17 @@
flex: 1;
}
}
.el-step.is-simple{
::v-deep .el-step__arrow::after{
height: 10px;
width: 1px;
transform: rotate(45deg) translateY(3px);
}
::v-deep .el-step__arrow::before{
height: 10px;
width: 1px;
transform: rotate(-45deg) translateY(-3px);
}
}
</style>