Merge branch 'need_loginStyle'

src/views/Login.vue

@@ -65,51 +65,73 @@
 				</el-form-item>
 			</el-form>  -->
 			<div class="login-box" id="login-container" v-if="activeModel!=='forgetPassModel'">
-				<span class="login-title">ETA — 让投研领先市场半步</span>
-				<el-tabs v-model="activeModel" @tab-click="handleClick">
-					<el-tab-pane label="账号登录" name="ordinaryModel">
-						<OrdinaryModel ref="ordinaryModel"
-							:loginCheck="loginCheck"
-							:accountCheck="accountCheck"
-							@clearnHint="clearnHint"
-							@changeModel="changeModel('forgetPassModel')"
-						/>
-					</el-tab-pane>
-					<el-tab-pane label="手机号登录" name="mobileModel">
-						<MobileModel ref="mobileModel"
-							:areaCode="areaCode"
-						/>
-					</el-tab-pane>
-					<!-- <el-tab-pane label="邮箱登录" name="emailModel"> -->
-						<EmailModel ref="emailModel" v-show="activeModel=='emailModel'"/>
-					<!-- </el-tab-pane> -->
-				</el-tabs>
-				<el-button
-					type="primary"
-					size="medium"
-					@click.native="handleLogin"
-					:loading="logining"
-					class="submit_btn"
-					>登录</el-button>
-                <div class="another-login-type">
-                    <div class="another-type-hint">
-                        <div class="type-hint-line"></div>
-                        <div class="type-hint-text">其他登录方式</div>
-                        <div class="type-hint-line"></div>
-                    </div>
-                    <div class="another-type">
-                        <!-- <div class="login-type-item"
-                        > -->
-                            <img src="~@/assets/img/icons/email-login-type.png" @click="activeModel='emailModel';handleClick({name:'emailModel'})" />
-                        <!-- </div> -->
+                <div class="fixed-login-cont">
+                    <span class="login-title">ETA — 让投研领先市场半步</span>
+                    <el-tabs v-model="activeModel" >
+                        <!-- <el-tab-pane label="账号登录" name="ordinaryModel">
+                            <OrdinaryModel ref="ordinaryModel"
+                                :loginCheck="loginCheck"
+                                :accountCheck="accountCheck"
+                                @clearnHint="clearnHint"
+                                @changeModel="changeModel('forgetPassModel')"
+                            />
+                        </el-tab-pane>
+                        <el-tab-pane label="手机号登录" name="mobileModel">
+                            <MobileModel ref="mobileModel"
+                                :areaCode="areaCode"
+                            />
+                        </el-tab-pane> -->
+
+                        <OrdinaryModel ref="ordinaryModel"
+                            :loginCheck="loginCheck"
+                            :accountCheck="accountCheck"
+                            @clearnHint="clearnHint"
+                            @changeModel="changeModel('forgetPassModel')"
+                            v-show="activeModel=='ordinaryModel'"
+                        />
+
+                        <MobileModel ref="mobileModel"
+                            :areaCode="areaCode"
+                            v-show="activeModel=='mobileModel'"
+                        />
+
+                        <EmailModel ref="emailModel" v-show="activeModel=='emailModel'"/>
+                    </el-tabs>
+                    <el-button
+                        type="primary"
+                        size="medium"
+                        @click.native="handleLogin"
+                        :loading="logining"
+                        class="submit_btn"
+                        >登录</el-button>
+                    <div class="another-login-type">
+                        <div class="another-type-hint">
+                            <div class="type-hint-line"></div>
+                            <div class="type-hint-text">其他登录方式</div>
+                            <div class="type-hint-line"></div>
+                        </div>
+                        <div class="another-type">
+                            <div class="login-type-item"
+                                v-for="item in loginTypeIcons"
+                                :key="item.name"
+                                :style="activeModel===item.name?'display: none':''"
+                                @click="activeModel=item.name;handleClick(item)"
+                            >
+                            <div v-html="item.svg"></div>
+                            {{item.label}}
+                            </div>
+                                <!-- <img src="~@/assets/img/icons/email-login-type.png" @click="activeModel='emailModel';handleClick({name:'emailModel'})" /> -->
+                        </div>
                     </div>
                 </div>
 			</div>
 			<div class="login-box" v-else>
-				<ForgetPassModel 
-					ref="forgetPassModel"
-					:autoAccount="$refs.ordinaryModel?$refs.ordinaryModel.form.account:''"
-					@changeModel="changeModel('ordinaryModel')"/>
+                <div class="fixed-login-cont">
+                    <ForgetPassModel 
+                        ref="forgetPassModel"
+                        :autoAccount="$refs.ordinaryModel?$refs.ordinaryModel.form.account:''"
+                        @changeModel="changeModel('ordinaryModel')"/>
+                </div>
 			</div>
 		</div>
 		<!-- 验证弹窗 -->
@@ -153,44 +175,122 @@ import OrdinaryModel from "./login_manage/OrdinaryModel.vue";
 
 export default {
     components: { OrdinaryModel, MobileModel, EmailModel, ForgetPassModel },
-  data() {
-    return {
-        b: new http.Base64(),
-        logining: false, //登录loadding
-        ruleForm: {
-            account: "",
-            checkPass: "",
-        },
-        rules: {
-            account: [
-            {
-                required: true,
-                message: "请输入用户名",
-                trigger: "blur",
+    data() {
+        return {
+            b: new http.Base64(),
+            logining: false, //登录loadding
+            ruleForm: {
+                account: "",
+                checkPass: "",
             },
-            ],
-            checkPass: [
-            {
-                required: true,
-                message: "请输入密码",
-                trigger: "blur",
+            rules: {
+                account: [
+                {
+                    required: true,
+                    message: "请输入用户名",
+                    trigger: "blur",
+                },
+                ],
+                checkPass: [
+                {
+                    required: true,
+                    message: "请输入密码",
+                    trigger: "blur",
+                },
+                ],
             },
-            ],
-        },
-        checked: false, //是否保持登录状态
-        visible: true, //密码输入类型
+            checked: false, //是否保持登录状态
+            visible: true, //密码输入类型
+
+            activeModel: 'ordinaryModel',
+            /* form check 错误提示标识*/
+            loginCheck:false, //账号或密码错误
+            accountCheck:false,//账号异常：多次输错密码、长时间未登录
+            accountForbidden:false,//账号被禁用
+            mobileCheck:false,//手机号未绑定
+            emailCheck:false,//邮箱未绑定
+            areaCode:[],
 
-        activeModel: 'ordinaryModel',
-        /* form check 错误提示标识*/
-        loginCheck:false, //账号或密码错误
-        accountCheck:false,//账号异常：多次输错密码、长时间未登录
-        accountForbidden:false,//账号被禁用
-        mobileCheck:false,//手机号未绑定
-        emailCheck:false,//邮箱未绑定
-        areaCode:[],
+            isCheckDialogShow:false,
+            checkActiveModel:'checkMobileModel',
+            
+            /* 登录方式icon */
+            loginTypeIcons: [
+                {
+                    name: 'ordinaryModel',
+                    label: '账号登录',
+                    svg: `<svg data-v-5b948168="" width="64" height="64" viewBox="0 0 60 64" fill="none" xmlns="http://www.w3.org/2000/svg"><g filter="url(#filter0_d_6575_1450)">
+                        <circle cx="26" cy="25" r="20" fill="white"></circle>
+                        <circle cx="26" cy="25" r="19.75" stroke="#DCDFE6" stroke-width="0.5"></circle>
+                        </g>
+                        <g clip-path="url(#clip0_6575_1450)">
+                        <path d="M30.9555 24.9201C29.6869 26.0392 28.0029 26.7261 26.1469 26.7261C24.2634 26.7261 22.5516 26.0169 21.2775 24.8647C18.3137 25.6402 16.48 28.2883 16.48 31.4516V33.0637C16.48 36.8364 35.5204 36.8364 35.5204 33.0637V31.4516C35.5203 28.3716 33.7809 25.7678 30.9555 24.9201ZM26.1469 25.5794C29.4321 25.5794 32.1023 23.0144 32.1023 19.8457C32.1023 16.677 29.4376 14.1064 26.1469 14.1064C22.8673 14.1064 20.1972 16.677 20.1972 19.8457C20.1972 23.0145 22.8673 25.5794 26.1469 25.5794Z" fill="#0052D9"></path>
+                        </g>
+                        <defs>
+                        <filter id="filter0_d_6575_1450" x="0" y="0" width="52" height="52" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+                        <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
+                        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
+                        <feOffset dy="1"></feOffset>
+                        <feGaussianBlur stdDeviation="3"></feGaussianBlur>
+                        <feComposite in2="hardAlpha" operator="out"></feComposite>
+                        <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
+                        <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_6575_1450"></feBlend>
+                        <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_6575_1450" result="shape"></feBlend>
+                        </filter>
+                        <clipPath id="clip0_6575_1450">
+                        <rect width="24" height="24" fill="white" transform="translate(14 13)"></rect>
+                        </clipPath>
+                        </defs></svg>`
+                },
+                {
+                    name:'mobileModel',
+                    label: '手机号登录',
+                    svg: `<svg data-v-5b948168="" width="64" height="64" viewBox="0 0 56 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <g filter="url(#filter0_d_6575_1430)">
+                        <circle cx="26" cy="25" r="20" fill="white"></circle>
+                        <circle cx="26" cy="25" r="19.75" stroke="#DCDFE6" stroke-width="0.5"></circle>
+                        </g>
+                        <path d="M31.7982 13.6985H19.7718C18.6414 13.6985 17.7246 14.6153 17.7246 15.7457V34.2977C17.7246 35.4281 18.6414 36.3449 19.7718 36.3449H24.8262H27.6366H31.7982C32.9286 36.3449 33.8454 35.4281 33.8454 34.2977V15.7457C33.8454 14.6153 32.9286 13.6985 31.7982 13.6985ZM23.8038 15.1577H27.7662C27.963 15.1577 28.1238 15.3185 28.1238 15.5153C28.1238 15.7121 27.963 15.8729 27.7662 15.8729H23.8038C23.607 15.8729 23.4462 15.7121 23.4462 15.5153C23.4462 15.3185 23.607 15.1577 23.8038 15.1577ZM25.7862 33.9689C24.9894 33.9689 24.3438 33.3233 24.3438 32.5265C24.3438 31.7297 24.9894 31.0841 25.7862 31.0841C26.583 31.0841 27.2286 31.7297 27.2286 32.5265C27.2262 33.3233 26.5806 33.9689 25.7862 33.9689ZM32.3478 28.6337C32.3478 28.9169 32.1198 29.1449 31.8366 29.1449H19.7334C19.4502 29.1449 19.2222 28.9169 19.2222 28.6337V17.7377C19.2222 17.4545 19.4502 17.2265 19.7334 17.2265H31.8342C32.1174 17.2265 32.3454 17.4545 32.3454 17.7377V28.6337H32.3478Z" fill="#0052D9"></path>
+                        <defs>
+                        <filter id="filter0_d_6575_1430" x="0" y="0" width="52" height="52" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+                        <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
+                        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
+                        <feOffset dy="1"></feOffset>
+                        <feGaussianBlur stdDeviation="3"></feGaussianBlur>
+                        <feComposite in2="hardAlpha" operator="out"></feComposite>
+                        <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
+                        <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_6575_1430"></feBlend>
+                        <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_6575_1430" result="shape"></feBlend>
+                        </filter>
+                        </defs></svg>`
+                },
+                {
+                    name: 'emailModel',
+                    label: '邮箱登录',
+                    svg: `
+                        <svg data-v-5b948168="" width="64" height="64" viewBox="0 4 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+                        <g filter="url(#filter0_d_6575_1422)">
+                        <circle cx="32" cy="30" r="20" fill="white"></circle>
+                        <circle cx="32" cy="30" r="19.5" stroke="#DCDFE6"></circle>
+                        </g>
+                        <path d="M41.1382 34.9875C41.1382 37.1966 39.3473 38.9875 37.1382 38.9875H26.8774C24.6683 38.9875 22.8774 37.1966 22.8774 34.9875V28.1164C22.8774 26.864 23.464 25.6839 24.4623 24.9278L31.3139 19.7381C31.517 19.5832 31.7594 19.5 32.0078 19.5C32.2562 19.5 32.4986 19.5832 32.7017 19.7381L39.5533 24.9278C40.5516 25.6839 41.1382 26.864 41.1382 28.1164V34.9875Z" fill="#0052D9"></path>
+                        <path d="M38.682 26.5957C38.682 27.0061 38.4316 27.3751 38.0501 27.5266L33.4963 29.3353C32.5408 29.7148 31.4758 29.7119 30.5224 29.327L25.956 27.4837C25.5853 27.334 25.3425 26.9743 25.3425 26.5745C25.3425 26.033 25.7815 25.594 26.323 25.594H37.6803C38.2335 25.594 38.682 26.0425 38.682 26.5957Z" fill="white"></path>
+                        <defs>
+                        <filter id="filter0_d_6575_1422" x="0" y="0" width="64" height="64" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+                        <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
+                        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
+                        <feOffset dy="2"></feOffset>
+                        <feGaussianBlur stdDeviation="6"></feGaussianBlur>
+                        <feComposite in2="hardAlpha" operator="out"></feComposite>
+                        <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
+                        <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_6575_1422"></feBlend>
+                        <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_6575_1422" result="shape"></feBlend>
+                        </filter>
+                        </defs></svg>`
+                },
+            ]
 
-        isCheckDialogShow:false,
-        checkActiveModel:'checkMobileModel'
+        
         };
     },
     created() {
@@ -572,7 +672,7 @@ export default {
 		}
 		.login-title {
 			color: #333;
-			font-size: 38px;
+			font-size: 32px;
 			display: block;
 			text-align: center;
 			margin-bottom: 60px;
@@ -588,6 +688,10 @@ export default {
 			input::-webkit-input-placeholder {
 				color: #595959 !important;
 			}
+            .fixed-login-cont {
+                width: 460px;
+                margin: 0 auto;
+            }
 			.remember {
 				margin: 0px 0 20px;
 			}
@@ -618,6 +722,8 @@ export default {
                     display: flex;
                     align-items: center;
                     justify-content: center;
+                    gap:10%;
+                    margin-top: 20px;
                     img{
                         margin-top: 20px;
                         height: 72px;
@@ -625,19 +731,11 @@ export default {
                         cursor: pointer;
                         // margin-bottom: 4px;
                     }
-					// .login-type-item{
-					// 	display: flex;
-					// 	flex-direction: column;
-					// 	justify-content: center;
-					// 	align-items: center;
-					// 	margin-top: 20px;
-					// 	cursor: pointer;
-	
-					// 	span{
-					// 		font-size: 16px;
-					// 		color: #666666;
-					// 	}
-					// }
+                    .login-type-item {
+                        text-align: center;
+                        color: #666;
+                        cursor: pointer;
+                    }
 				}
 			}
 			.el-input input {
@@ -699,16 +797,10 @@ export default {
 			#login-container ,.login-box{
 				width: 70%;
 				top:15%;
+                left: 50%;
+                transform: translateX(-50%);
 			}
 		}
-		@media screen and (max-width:1440px){
-			#login-container ,.login-box{
-				.login-title{
-					font-size: 32px;
-				}
-			}
-			
-		}
 		@media screen and (max-height:720px) {
 			#login-container ,.login-box{
 				top:20%;

src/views/login_manage/ForgetPassModel.vue

@@ -281,6 +281,10 @@ export default {
                     }).then(res=>{
                         if(res.Ret!==200) return
                         this.$message.success('重置密码成功，请登陆')
+                        localStorage.setItem('timeKey',Date.now())
+                        localStorage.setItem("account", new http.Base64().encode(this.form.account));
+                        localStorage.setItem("checkPass", new http.Base64().encode(this.passForm.pass1));
+
                         this.resetPassCountDown()
                         this.resetPassTimer = setInterval(()=>{
                             this.resetPassCountDown()