From 36bd41de6b579bedca75cb37ef5fad981b7a29c4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com>
Date: Fri, 19 Jul 2024 15:33:48 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=82=AE=E7=AE=B1=E6=BF=80?=
 =?UTF-8?q?=E6=B4=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/config/index.js                       |  2 +-
 src/layout/index.vue                      | 13 +++---
 src/style/app.scss                        |  7 ++-
 src/style/pages.scss                      |  3 +-
 src/views/login/activate.vue              | 53 ++++++++++++++++++++---
 src/views/login/components/commonPage.vue |  8 ++--
 src/views/login/userRegister.vue          | 37 +++++++++++-----
 7 files changed, 93 insertions(+), 30 deletions(-)

diff --git a/src/config/index.js b/src/config/index.js
index 9028d9d..a790059 100644
--- a/src/config/index.js
+++ b/src/config/index.js
@@ -43,7 +43,7 @@ const DEFAULT_CONFIG = {
 	LAYOUT: "menu",
 
 	//菜单是否折叠
-	MENU_IS_COLLAPSE: false,
+	MENU_IS_COLLAPSE: true,
 
 	//菜单是否启用手风琴效果
 	MENU_UNIQUE_OPENED: true,
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 6ddc38b..c7427cf 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -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">
diff --git a/src/style/app.scss b/src/style/app.scss
index e0f1376..a7c8daf 100644
--- a/src/style/app.scss
+++ b/src/style/app.scss
@@ -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;}
diff --git a/src/style/pages.scss b/src/style/pages.scss
index 17d2437..65ee0be 100644
--- a/src/style/pages.scss
+++ b/src/style/pages.scss
@@ -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;}
diff --git a/src/views/login/activate.vue b/src/views/login/activate.vue
index 38df0b5..5a96083 100644
--- a/src/views/login/activate.vue
+++ b/src/views/login/activate.vue
@@ -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>
diff --git a/src/views/login/components/commonPage.vue b/src/views/login/components/commonPage.vue
index 3886624..d3aef66 100644
--- a/src/views/login/components/commonPage.vue
+++ b/src/views/login/components/commonPage.vue
@@ -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>
diff --git a/src/views/login/userRegister.vue b/src/views/login/userRegister.vue
index 5a76283..694b6f4 100644
--- a/src/views/login/userRegister.vue
+++ b/src/views/login/userRegister.vue
@@ -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>