登录页面做适配

components/change/ChangeManager.vue

@@ -273,14 +273,13 @@
         if (!this.logged.isLogin) {
 //          console.log(this.logged.isLogin)
 //          未登录跳到登录页面
-          window.location.href = '/'
+          window.location.href = '/appeals/changeManagerAppeal'
         }
       },
 //      获取验证方式
       getVerifyWay () {
         this.$http.get('/sso/change/admin/checkType').then(response => {
           if (response.data.success) {
-            // console.log(response.data)
             if (!response.data.content) {
               this.goFirstStep = true
               this.showManualAppeal = true

components/default/LoginHeader.vue

@@ -1,58 +1,65 @@
-<template>
-  <nav class="x-navbar">
-    <div class="container">
-      <div class="navbar-header">
-        <input type="hidden" name="iconUrl" value="/static/img/icon_mall_index.png">
-        <a class="navbar-brand" href="https://www.usoftmall.com/">
-          欢迎登录
-        </a>
-      </div>
-      <div class="collapse navbar-collapse navbar-right">
-        <a href="http://www.ubtob.com">优软云首页</a> <a href="http://uas.ubtob.com/serve#/">帮助</a>
-      </div>
-    </div>
-  </nav>
-</template>
-<script>
-  export default {
-    name: 'LoginHeader',
-    data () {
-      return {}
-    }
-  }
-</script>
-<style lang="scss" scoped>
-  @import '~assets/scss/mixins';
-  @import '~assets/scss/variables';
-  .x-navbar{
-    height: 80px;
-    line-height: 80px;
-    margin: 0;
-    .container{
-      position: relative;
-      width: 990px!important;
-      a.navbar-brand{
-        padding: 0 0 0 85px;
-        height: inherit;
-        line-height: inherit;
-        font-family: "\5FAE\8F6F\96C5\9ED1";
-        font-size: 24px;
-        font-weight: 400;
-        color: #888;
-        background: url(/images/all/icon_brand.png) left center no-repeat;
-      }
-      .collapse{
-        a{
-          padding-left: 12px;
-          margin-right: 10px;
-          color: #666;
-          outline: 0;
-          border-left: 1px solid #ddd;
-          &:first-child{
-             border-width: 0;
-           }
-        }
-      }
-    }
-  }
-</style>
+<!--<template>-->
+  <!--<nav class="x-navbar">-->
+    <!--<div class="container">-->
+      <!--<div class="navbar-header">-->
+        <!--<input type="hidden" name="iconUrl" value="/static/img/icon_mall_index.png">-->
+        <!--<a class="navbar-brand" href="https://www.usoftmall.com/">-->
+          <!--<img :src="item.logoUrl" alt="">-->
+          <!--欢迎登录-->
+        <!--</a>-->
+      <!--</div>-->
+      <!--<div class="collapse navbar-collapse navbar-right">-->
+        <!--<a href="http://www.ubtob.com">优软云首页</a> <a href="http://uas.ubtob.com/serve#/">帮助</a>-->
+      <!--</div>-->
+    <!--</div>-->
+  <!--</nav>-->
+<!--</template>-->
+<!--<script>-->
+  <!--export default {-->
+    <!--name: 'LoginHeader',-->
+    <!--data () {-->
+      <!--return {}-->
+    <!--},-->
+    <!--computed: {-->
+      <!--loginUrl () {-->
+        <!--console.log(this.$store.state.login.loginStyle.loginStyle.data.content)-->
+        <!--return this.$store.state.login.loginStyle.loginStyle.data.content-->
+      <!--}-->
+    <!--}-->
+  <!--}-->
+<!--</script>-->
+<!--<style lang="scss" scoped>-->
+  <!--@import '~assets/scss/mixins';-->
+  <!--@import '~assets/scss/variables';-->
+  <!--.x-navbar{-->
+    <!--height: 80px;-->
+    <!--line-height: 80px;-->
+    <!--margin: 0;-->
+    <!--.container{-->
+      <!--position: relative;-->
+      <!--width: 990px!important;-->
+      <!--a.navbar-brand{-->
+        <!--padding: 0 0 0 85px;-->
+        <!--height: inherit;-->
+        <!--line-height: inherit;-->
+        <!--font-family: "\5FAE\8F6F\96C5\9ED1";-->
+        <!--font-size: 24px;-->
+        <!--font-weight: 400;-->
+        <!--color: #888;-->
+        <!--background: url(/images/all/icon_brand.png) left center no-repeat;-->
+      <!--}-->
+      <!--.collapse{-->
+        <!--a{-->
+          <!--padding-left: 12px;-->
+          <!--margin-right: 10px;-->
+          <!--color: #666;-->
+          <!--outline: 0;-->
+          <!--border-left: 1px solid #ddd;-->
+          <!--&:first-child{-->
+             <!--border-width: 0;-->
+           <!--}-->
+        <!--}-->
+      <!--}-->
+    <!--}-->
+  <!--}-->
+<!--</style>-->

components/login/Login.vue

@@ -1,91 +1,108 @@
 <template>
-  <div class="x-container">
-    <!-- background slider -->
-    <div class="x-banner-wrap">
-      <div class="x-banner">
-        <ul class="list-unstyled">
-          <li>
-            <a>
-              <div class="inner">
-                <div class="x-title x-text-0"></div>
-                <div class="x-subtitle x-text-0"></div>
-                <div class="x-btn-group">
+  <div>
+    <!--头部-->
+    <nav class="x-navbar">
+      <div class="container">
+        <div class="navbar-header">
+          <input type="hidden" name="iconUrl" value="/static/img/icon_mall_index.png">
+          <a class="navbar-brand" id="navbar-brand" href="https://www.usoftmall.com/">
+            欢迎登录
+          </a>
+        </div>
+        <div class="collapse navbar-collapse navbar-right">
+          <a href="http://www.ubtob.com">优软云首页</a> <a href="http://uas.ubtob.com/serve#/">帮助</a>
+        </div>
+      </div>
+    </nav>
+    <div class="x-container">
+      <!-- background slider -->
+      <div class="x-banner-wrap">
+        <div class="x-banner">
+          <ul class="list-unstyled">
+            <li id="bgStyle">
+              <a>
+                <div class="inner">
+                  <div class="x-title x-text-0"></div>
+                  <div class="x-subtitle x-text-0"></div>
+                  <div class="x-btn-group">
+                  </div>
                 </div>
-              </div>
-            </a>
-          </li>
-        </ul>
+              </a>
+            </li>
+          </ul>
+        </div>
       </div>
-    </div>
-    <div class="x-login-wrap">
-      <div class="x-login">
-        <!-- user & pwd login wrap -->
-        <div id="form-wrap" class="x-login-form">
-          <div>
-            <el-form :model="login" :rules="rules2" ref="login" class="demo-ruleForm login-form">
-              <el-form-item prop="username">
-                <el-input type="text" v-model="login.username" auto-complete="off" placeholder="手机号/邮箱/账号ID"></el-input>
-                <i class="fa fa-user"></i>
-              </el-form-item>
-              <el-form-item prop="password">
-                <el-input type="password" v-model="login.password" auto-complete="off" placeholder="密码"></el-input>
-                <i class="fa fa-lock"></i>
-              </el-form-item>
-              <el-form-item prop="captcha" class="captcha" v-show="showCheckCode">
-                <el-input type="text" v-model="login.captcha" auto-complete="off" class="code-input"></el-input>
-                <img id="captchaImage" class="code-img" src="/sso/login/checkCode"/>
-                <a class="code-click" @click="getCode">看不清换一张</a>
-              </el-form-item>
-              <el-form-item class="text-right">
-                <a class="forget" id='forget' @click="goForgetPassword">忘记密码?</a>
-              </el-form-item>
-              <el-form-item>
-                <a class="btn login"
-                   @click="isLogin(true)"
-                   :disabled="isLoginDisabled">登录</a>
-              </el-form-item>
-            </el-form>
-          </div>
-          <div class="warn-text-area">
-            为确保您账户的安全及正常使用，依《网络安全法》相关要求，6月1日起会员账户需绑定手机、设置密码保护。感谢您的理解和支持！
+      <div class="x-login-wrap">
+        <div class="x-login">
+          <!-- user & pwd login wrap -->
+          <div id="form-wrap" class="x-login-form">
+            <div>
+              <el-form :model="login" :rules="rules2" ref="login" class="demo-ruleForm login-form">
+                <el-form-item prop="username">
+                  <el-input type="text" v-model="login.username" auto-complete="off" placeholder="手机号/邮箱/账号ID"></el-input>
+                  <i class="fa fa-user"></i>
+                </el-form-item>
+                <el-form-item prop="password">
+                  <el-input type="password" v-model="login.password" auto-complete="off" placeholder="密码"></el-input>
+                  <i class="fa fa-lock"></i>
+                </el-form-item>
+                <el-form-item prop="captcha" class="captcha" v-show="showCheckCode">
+                  <el-input type="text" v-model="login.captcha" auto-complete="off" class="code-input"></el-input>
+                  <img id="captchaImage" class="code-img" src="/sso/login/checkCode"/>
+                  <a class="code-click" @click="getCode">看不清换一张</a>
+                </el-form-item>
+                <el-form-item class="text-right">
+                  <a class="forget" id='forget' @click="goForgetPassword">忘记密码?</a>
+                </el-form-item>
+                <el-form-item>
+                  <a class="btn login"
+                     @click="isLogin(true)"
+                     :disabled="isLoginDisabled">登录</a>
+                </el-form-item>
+              </el-form>
+            </div>
+            <div class="warn-text-area">
+              为确保您账户的安全及正常使用，依《网络安全法》相关要求，6月1日起会员账户需绑定手机、设置密码保护。感谢您的理解和支持！
+            </div>
+            <div class="link-go">
+              <a href="appeals/changeManagerAppeal" class="first">更换管理员</a>
+              <a id="register" @click="goRegister" class="second">
+                <i class="fa fa-arrow-circle-o-right"></i>免费注册</a>
+            </div>
           </div>
-          <div style="text-align: right;">
-            <a id="register" @click="goRegister">
-              <i class="fa fa-arrow-circle-o-right"></i>免费注册</a>
+          <!-- qrcode login wrap -->
+          <div id="qrcode-wrap" class="x-login-qrcode">
+            <div class="x-qrcode-help">
+              <span>打开手机客户端，扫描下面的二维码</span>
+            </div>
+            <div class="x-qrcode-img">
+              <img src="/images/all/qrcode.jpg">
+            </div>
+            <div class="x-qrcode-ex">
+              <ul class="list-unstyled list-inline">
+                <li><i class="iconfont icon-left icon-input"></i><span>免输入</span></li>
+                <li><i class="iconfont icon-left icon-fast"></i><span>更快捷</span></li>
+                <li><i class="iconfont icon-left icon-safe"></i><span>更安全</span></li>
+              </ul>
+            </div>
           </div>
         </div>
-        <!-- qrcode login wrap -->
-        <div id="qrcode-wrap" class="x-login-qrcode">
-          <div class="x-qrcode-help">
-            <span>打开手机客户端，扫描下面的二维码</span>
-          </div>
-          <div class="x-qrcode-img">
-            <img src="/images/all/qrcode.jpg">
-          </div>
-          <div class="x-qrcode-ex">
-            <ul class="list-unstyled list-inline">
-              <li><i class="iconfont icon-left icon-input"></i><span>免输入</span></li>
-              <li><i class="iconfont icon-left icon-fast"></i><span>更快捷</span></li>
-              <li><i class="iconfont icon-left icon-safe"></i><span>更安全</span></li>
+      </div>
+      <!--选择企业弹出框-->
+      <div>
+        <el-dialog class="dialog"
+                   :visible.sync="dialogVisible"
+                   size="tiny">
+          <div class="x-floating x-list" v-show="dialogVisible">
+            <div class="x-list-header">您要登录的公司是：</div>
+            <ul class="list-unstyled" v-for="space in this.enterprise">
+              <li v-text="space.name" @click="chooseOneEnterprise(false, space.id)">华商龙科技有限公司</li>
             </ul>
           </div>
-        </div>
+        </el-dialog>
       </div>
+      <loading v-show="isShowLoading"/>
     </div>
-    <!--选择企业弹出框-->
-    <div>
-      <el-dialog class="dialog"
-                 :visible.sync="dialogVisible"
-                 size="tiny">
-        <div class="x-floating x-list" v-show="dialogVisible">
-          <div class="x-list-header">您要登录的公司是：</div>
-          <ul class="list-unstyled" v-for="space in this.enterprise">
-            <li v-text="space.name" @click="chooseOneEnterprise(false, space.id)">华商龙科技有限公司</li>
-          </ul>
-        </div>
-      </el-dialog>
-    </div>
-    <loading v-show="isShowLoading"/>
   </div>
 </template>
 
@@ -173,13 +190,19 @@
       this.$nextTick(() => {
         this.getUrl()
       })
+      this.$nextTick(() => {
+        this.getLoginStyle()
+      })
     },
     computed: {
       enterprise () {
         let chooseEnterprise = this.$store.state.login.chooseRegisterEnterprise.choose.data
-//        console.log(chooseEnterprise)
         return chooseEnterprise
       }
+      // loginUrl () {
+      //   console.log(this.$store.state.login.loginStyle.loginStyle.data)
+      //   return this.$store.state.login.loginStyle.loginStyle.data
+      // }
     },
     methods: {
 //      获取url参数
@@ -197,6 +220,25 @@
         this.returnUrl = request['returnUrl'] || ''
         this.baseUrl = request['baseUrl'] || ''
       },
+      // 获取后台返回的数据
+      getLoginStyle () {
+        this.$http.get(`/sso/login/page/style`, {params: {appId: this.appId}})
+          .then(response => {
+            if (response.data.success) {
+              let logoUrlStyle = response.data.content.logoUrl
+              let bgUrl = response.data.content.bgUrl
+              let bgColor = response.data.content.bgColor
+              document.getElementById('navbar-brand').style.backgroundImage = 'url(' + logoUrlStyle + ')'
+              let bg = document.getElementById('bgStyle')
+              bg.style.backgroundImage = 'url(' + bgUrl + ')'
+              bg.style.backgroundColor = bgColor
+            } else {
+              return Promise.reject(response.data)
+            }
+          }).catch(err => {
+            console.log(err)
+          })
+      },
 //      忘记密码
       goForgetPassword () {
         let url = `/reset/forgetPasswordValidationAccount?appId=${this.appId}&returnUrl=${this.returnUrl}`
@@ -247,7 +289,6 @@
                 } else if (response.data.content.loginUrls) {
 //                  遍历登录url循环让各应用登录(需要跨域)
                   for (var i in response.data.content.loginUrls) {
-//                    this.$http.post(response.data.content.loginUrls[i], response.data.content.data)
                     this.$jsonp(`response.data.content.loginUrls${[i]}`, function (err, data) {
                       if (err) throw err
                       console.log(data)
@@ -293,9 +334,59 @@
   }
 </script>
 <style lang="scss" scoped>
+  @import '~assets/scss/mixins';
+  @import '~assets/scss/variables';
+  .x-navbar{
+    height: 80px;
+    line-height: 80px;
+    margin: 0;
+  .container{
+    position: relative;
+    width: 990px!important;
+  a.navbar-brand{
+    padding: 0 0 0 85px;
+    height: inherit;
+    line-height: inherit;
+    font-family: "\5FAE\8F6F\96C5\9ED1";
+    font-size: 24px;
+    font-weight: 400;
+    color: #888;
+    background: url(/images/all/icon_brand.png) left center no-repeat;
+  }
+  .collapse{
+  a{
+    padding-left: 12px;
+    margin-right: 10px;
+    color: #666;
+    outline: 0;
+    border-left: 1px solid #ddd;
+  &:first-child{
+     border-width: 0;
+   }
+  }
+  }
+  }
+  }
   .x-container{
     position: relative;
     height: 475px;
+    div.link-go {
+      text-align: right;
+      margin-top: 7px;
+      a{
+        color: #2d8cf0;
+        background: 0 0;
+        text-decoration: none;
+        outline: 0;
+        cursor: pointer;
+        transition: color .2s ease;
+      }
+      a.first{
+        float: left;
+        margin-top: 3px;
+        font-size: 12px;
+      }
+    }
     /*登录弹出框*/
     .x-floating {
       position: fixed;

pages/bindEnterPrise/_uuid.vue

@@ -40,7 +40,7 @@
             </div>
           </div>
           <template v-if="hasRegister && !searchInfo">
-            <a name="register" href="/sso/register">立即注册</a>
+            <a name="register" href="/register/enterpriseRegistration">立即注册</a>
           </template>
           <template v-if="hasRegister && searchInfo && !searchInfo.admin">
             <a href="javascript:void(0)" @click="bingEnterPrise()">申请绑定</a>

pages/index.vue

@@ -1,16 +1,13 @@
 <template>
   <div>
-    <login-header/>
     <login/>
   </div>
 </template>
 <script>
-  import LoginHeader from '~components/default/LoginHeader.vue'
   import {Login} from '~components/login'
   export default {
     layout: 'loginDefault',
     components: {
-      LoginHeader,
       Login
     }
   }

store/login.js

@@ -2,13 +2,14 @@
 //
 // export const actions = {
 //   // 登录选择企业
-//   ChooseRegisterEnterprise ({commit}, params = {}) {
-//     commit('chooseRegisterEnterprise/REQUEST_ENTERPRISE', params)
-//     return axios.post(`/sso/login`, {params})
+//   GetLoginStyle ({commit}, params = {}) {
+//     commit('loginStyle/REQUEST_LOGIN_STYLE', params)
+//     return axios.get(`/sso/login/page/style`, {params})
 //       .then(response => {
-//         commit('chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data)
+//         console.log(response.data)
+//         commit('loginStyle/GET_LOGIN_STYLE_SUCCESS', response.data)
 //       }, err => {
-//         commit('chooseRegisterEnterprise/GET_ENTERPRISE_FAILURE', err)
+//         commit('loginStyle/GET_LOGIN_STYLE_FAILURE', err)
 //       })
 //   }
 // }