Merge remote-tracking branch 'origin/master'

ruoyi-ui/src/settings.js

@@ -1,7 +1,7 @@
 module.exports = {
   title: '招商引资管理系统',
-  // urls: 'http://47.99.82.249:80',
-  urls: 'http://192.168.101.11:8010',
+  urls: 'http://47.99.82.249:80',
+  // urls: 'http://192.168.101.11:8010',
 
   /**
    * 侧边栏主题 深色主题theme-dark，浅色主题theme-light

ruoyi-ui/src/views/login.vue

@@ -1,17 +1,25 @@
 <template>
   <div class="login">
-    <div class="log_box">
-    <div class="log_img">
-      <img src="../assets/images/logo.png" alt="" class="img">
-    </div>
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <!-- <h3 class="title">招商引资管理系统</h3> -->
-      <el-form-item prop="username" style="height:45px;">
+      <img src="../assets/images/icon_dl_ewm@2x.png" v-if="statusFlag==1" @click="statusFlag=2" alt="" class="icon_rw">
+      <img src="../assets/images/icon_dl_madl@2x.png" v-if="statusFlag==2" alt="" @click="statusFlag=1" class="icon_mim">
+      <h3 class="title">招商引资管理系统</h3>
+      <div v-if="statusFlag==2">
+        <div class="erw_img">
+          <img src="" alt="" class="imgs">
+          <p>请使用手机扫描上方二维码登录</p>
+        </div>
+        <div class="mim_p">
+          密码登录
+        </div>
+      </div>
+      <div v-if="statusFlag==1">
+      <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" />
         </el-input>
       </el-form-item>
-      <el-form-item prop="password" style="height:45px;">
+      <el-form-item prop="password">
         <el-input
           v-model="loginForm.password"
           type="password"
@@ -22,7 +30,7 @@
           <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
         </el-input>
       </el-form-item>
-<!--      <el-form-item prop="code">
+      <!-- <el-form-item prop="code">
         <el-input
           v-model="loginForm.code"
           auto-complete="off"
@@ -35,25 +43,55 @@
         <div class="login-code">
           <img :src="codeUrl" @click="getCode" class="login-code-img"/>
         </div>
-      </el-form-item>-->
-      <!-- <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox> -->
-      <el-form-item style="width:100%;height:45px;margin: 0;">
+      </el-form-item> -->
+      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
+      <el-form-item style="width:100%; margin-bottom: 42px;">
+         <div class="medTitle">
+           快捷登录
+         </div>
+         <div class="med_icons">
+           <div class="med_icons_item" @click="btns">
+             <img src="@/assets/images/icon_kjdl_wz@2x.png" alt="" class="icon">
+             <p>皖事通</p>
+           </div>
+           <div class="med_icons_item" @click="btns">
+             <img src="@/assets/images/icon_kjdl_dd@2x.png" alt="" class="icon">
+             <p>钉钉</p>
+           </div>
+           <div class="med_icons_item" @click="btns">
+             <img src="@/assets/images/icon_kjdl_wx@2x.png" alt="" class="icon">
+             <p>微信</p>
+           </div>
+           <div class="med_icons_item" @click="btns">
+             <img src="@/assets/images/icon_kjdl_qywx@2x.png" alt="" class="icon">
+             <p>企业微信</p>
+           </div>
+           <div class="med_icons_item" @click="btns">
+             <img src="@/assets/images/icon_kjdl_qq@2x.png" alt="" class="icon">
+             <p>QQ</p>
+           </div>
+         </div>
+      </el-form-item>
+      <el-form-item style="width:100%;margin-bottom: 0;">
         <el-button
           :loading="loading"
           size="medium"
           type="primary"
-          style="width:100%;background-color: #1C83C6;color: #CDCDCD;"
+          style="width: 100%;background-color: #2865E1;height: 45px;"
           @click.native.prevent="handleLogin"
         >
           <span v-if="!loading">登 录</span>
           <span v-else>登 录 中...</span>
         </el-button>
+        <p class="div_p">
+          * 使用快捷登录，请先绑定第三方账号
+        </p>
       </el-form-item>
+      </div>
     </el-form>
-    </div>
     <!--  底部  -->
-   <div class="el-login-footer">
-      <span>潜山市招商引资局  版权所有  © 2018-2028</span>
+    <div class="el-login-footer">
+      <!-- <span>Copyright © 2018-2021 ruoyi.vip All Rights Reserved.</span> -->
     </div>
   </div>
 </template>
@@ -67,13 +105,14 @@ export default {
   name: "Login",
   data() {
     return {
+      statusFlag: 1,
       codeUrl: "",
       cookiePassword: "",
       loginForm: {
         username: "",
         password: "",
         rememberMe: false,
-        code: "",
+        // code: "",
         uuid: ""
       },
       loginRules: {
@@ -82,8 +121,8 @@ export default {
         ],
         password: [
           { required: true, trigger: "blur", message: "密码不能为空" }
-        ]
-/*        code: [{ required: true, trigger: "change", message: "验证码不能为空" }]*/
+        ],
+        // code: [{ required: true, trigger: "change", message: "验证码不能为空" }]
       },
       loading: false,
       redirect: undefined
@@ -98,16 +137,19 @@ export default {
     }
   },
   created() {
-    /*this.getCode();*/
+    // this.getCode();
     this.getCookie();
   },
   methods: {
-/*    getCode() {
+    btns() {
+      this.msgInfo('暂未开放')
+    },
+    getCode() {
       getCodeImg().then(res => {
         this.codeUrl = "data:image/gif;base64," + res.img;
         this.loginForm.uuid = res.uuid;
       });
-    },*/
+    },
     getCookie() {
       const username = Cookies.get("username");
       const password = Cookies.get("password");
@@ -135,7 +177,7 @@ export default {
             this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
           }).catch(() => {
             this.loading = false;
-           /* this.getCode();*/
+            // this.getCode();
           });
         }
       });
@@ -145,40 +187,134 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
-  .log_box{
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    height: 100vh;
-    padding-top: 19vh;
-    box-sizing: border-box;
-  }
-  .log_img{
-    width: 46vw;
-    margin-bottom: 62px;
-    .img{
-      width: 100%;
-    }
-  }
 .login {
   display: flex;
-  justify-content: center;
+  justify-content: flex-end;
   align-items: center;
   height: 100%;
   background-image: url("../assets/images/login-background.jpg");
   background-size: cover;
 }
+.div_p{
+  text-align: center;
+  font-size: 11px;
+  color: #AAAAAA;
+  line-height: 1;
+}
+.medTitle{
+  margin-top: 10px;
+  text-align: center;
+  line-height: 50px;
+  position: relative;
+  color: #343434;
+  font-size: 14px;
+  font-weight: bold;
+  margin-bottom: 5px;
+  &::before{
+    content: "";
+    position: absolute;
+    width: 30px;
+    height: 2px;
+    border-radius: 1px;
+    background-color: #F4AD6B;
+    top: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+.med_icons{
+  display: flex;
+  justify-content: space-between;
+  width: 365px;
+  position: relative;
+  left: -23px;
+
+  .med_icons_item{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    cursor: pointer;
+    .icon{
+      width: 34px;
+      height: 34px;
+      margin-bottom: 6px;
+    }
+    p{
+      text-align: center;
+      font-size: 11px;
+      color: #666666;
+      line-height: 24px;
+      margin: 0;
+    }
+  }
+}
 .title {
-  margin: 0px auto 30px auto;
+  margin: 0px auto 40px auto;
   text-align: center;
-  color: #707070;
+  color: #343434;
+  padding:  0 15px;
+  position: relative;
+  font-weight: normal;
+  font-size: 22px;
+  &::before{
+    position: absolute;
+    content: '';
+    width: 145px;
+    height: 15px;
+    background-image: url('../assets/images/pic_dlbt_hx@2x.png');
+    background-size: 100% 100%;
+    bottom: -15px;
+    left: 50%;
+    transform: translateX(-50%);
+  }
 }
 
 .login-form {
   border-radius: 6px;
   background: #ffffff;
-  width: 520px;
-  padding: 46px 60px;
+  width: 441px;
+  box-shadow: 0 0 25px #E3E3EA;
+  margin-right: 101px;
+  background-image: urk;
+  padding: 58px 62px 49px;
+  position: relative;
+  .icon_rw{
+    position: absolute;
+    width: 72px;
+    height: 72px;
+    top: 11px;
+    right: 11px;
+    cursor: pointer;
+  }
+  .icon_mim{
+    position: absolute;
+    width: 57px;
+    height: 57px;
+    top: 11px;
+    right: 11px;
+    cursor: pointer;
+  }
+  .erw_img{
+    margin: 69px 0 83px;
+    text-align: center;
+    .img{
+      width: 240px;
+      height: 240px;
+      margin-bottom: 17px;
+    }
+    p{
+      color: #666666;
+      font-size: 14px;
+    }
+  }
+  .mim_p{
+    text-align: center;
+    color: #2865E1;
+    font-size: 15px;
+    font-weight: bold;
+    cursor: pointer;
+    text-decoration: underline;
+  }
   .el-input {
     height: 38px;
     input {
@@ -212,7 +348,7 @@ export default {
   bottom: 0;
   width: 100%;
   text-align: center;
-  color: #5E6F90;
+  color: #fff;
   font-family: Arial;
   font-size: 12px;
   letter-spacing: 1px;