登录界面修改

vue/src/assets/icons/svg/zhifubao.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1650119020631" class="icon" viewBox="0 0 1037 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15187" xmlns:xlink="http://www.w3.org/1999/xlink" width="129.625" height="128"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
+</style></defs><path d="M665.600029 614.4c70.4-128 96-249.6 96-249.6l-12.8 0 0 0L640.000029 364.8 524.800029 364.8 524.800029 275.2l281.6 0L806.400029 236.8 524.800029 236.8 524.800029 102.4l-128 0 0 134.4-256 0 0 38.4 256 0 0 89.6L179.200029 364.8l0 38.4 441.6 0c0 6.4 0 6.4-6.4 12.8C614.400029 460.8 582.400029 524.8 556.800029 576 230.400029 448 134.400029 524.8 108.800029 537.6c-217.6 153.6-12.8 345.6 19.2 339.2 230.4 51.2 377.6-44.8 480-166.4 6.4 6.4 12.8 6.4 19.2 6.4 70.4 38.4 409.6 198.4 409.6 198.4s0-140.8 0-192C985.600029 723.2 800.000029 659.2 665.600029 614.4zM499.200029 672c-160 204.8-352 140.8-384 128C38.400029 780.8 12.800029 640 108.800029 595.2c160-51.2 300.8 6.4 403.2 57.6C505.600029 665.6 499.200029 672 499.200029 672z" p-id="15188" fill="#ffffff"></path></svg>

vue/src/views/login.vue

@@ -6,12 +6,14 @@
             <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                 <div class="login-top">
                     <h1>物美智能 - 开源生活物联网平台</h1>
-                    <h2>wumei smart open source iot platform</h2>
+                    <h2>wumei smart open source living iot platform</h2>
                 </div>
             </el-col>
             <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                 <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" style="z-index:1000">
-                    <h3 class="title">账号登录</h3>
+                    <h3 class="title">账号登录
+                        <span style="font-size:16px;color:#eee">（ 演示账号：wumei<span style="margin:0 10px;">123456 ）</span></span>
+                    </h3>
                     <el-form-item prop="username">
                         <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
                             <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
@@ -36,10 +38,24 @@
                             <span v-if="!loading">登 录</span>
                             <span v-else>登 录 中...</span>
                         </el-button>
+                        <div style="margin-top:10px;">
+                            <span style="color:#fff;margin-right:10px;">第三方登录</span>
+
+                            <el-button type="success" circle title="微信登录" size="small" @click="authLogin">
+                                <svg-icon icon-class="wechat" />
+                            </el-button>
+
+                            <el-button type="danger" circle title="QQ登录" size="small" @click="authLogin">
+                                <svg-icon icon-class="qq" />
+                            </el-button>
+                            <el-button type="primary" circle title="支付宝登录" size="small" @click="authLogin">
+                                <svg-icon icon-class="zhifubao"/>
+                            </el-button>
+                        </div>
                         <div style="float: right;margin-top:10px;" v-if="register">
-                            <span style="margin-right:20px; color:#eee">演示账号：wumei<span style="margin:0 10px;">123456</span></span>
+
                             <a style="margin-right:20px;color:#222" target="_blank" href="http://wumei.live">返回官网</a>
-                            <router-link style="color:#fff;font-size:16px;display:none;" :to="'/register'" >立即注册 >></router-link>
+                            <router-link style="color:#fff;font-size:16px;" :to="'/register'">立即注册 >></router-link>
                         </div>
                     </el-form-item>
                 </el-form>
@@ -132,6 +148,29 @@ export default {
                 rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
             };
         },
+        weixinLogin() {
+            this.$alert('微信登录正在集成中...', '提示消息', {
+                confirmButtonText: '确定',
+                callback: action => {
+                    this.$message({
+                        type: 'info',
+                        message: `action: ${ action }`
+                    });
+                }
+            });
+        },
+        authLogin() {
+            
+            this.$alert('第三方登录正在集成中...', '提示消息', {
+                confirmButtonText: '确定',
+                callback: action => {
+                    // this.$message({
+                    //     type: 'info',
+                    //     message: `action: ${ action }`
+                    // });
+                }
+            });
+        },
         handleLogin() {
             this.$refs.loginForm.validate(valid => {
                 if (valid) {
@@ -179,7 +218,7 @@ export default {
 
 .title {
     margin: 0px auto 30px auto;
-    text-align: center;
+    text-align: left;
     color: #333;
     font-size: 24px;
 }
@@ -195,7 +234,7 @@ export default {
     }
 
     h2 {
-        font-size: 24px;
+        font-size: 21px;
         margin-top: -12px;
     }
 }

vue/src/views/register.vue

@@ -6,13 +6,12 @@
         <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <div class="login-top">
                 <h1>物美智能 - 开源生活物联网平台</h1>
-                <h2>wumei smart open source iot platform</h2>
+                <h2>wumei smart open source living iot platform</h2>
             </div>
         </el-col>
         <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
             <el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form" style="z-index:1000">
                 <h3 class="title">注册账号</h3>
-                <p style="text-align:center">账号可以用于学习和测试，请勿用于商业用途</p>
                 <el-form-item prop="username">
                     <el-input v-model="registerForm.username" type="text" auto-complete="off" placeholder="账号">
                         <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
@@ -206,7 +205,7 @@ export default {
     }
 
     h2 {
-        font-size: 24px;
+        font-size: 21px;
         margin-top: -12px;
     }
 }