新版云中心页面

assets/scss/common.scss

@@ -718,3 +718,89 @@ form .questions .el-form-item__content span.question {
   padding:0;
   border-radius:15px;
 }
+
+
+//查看大图
+#image-box .x-floating-wrap,.image-box .x-floating-wrap {
+  position: fixed;
+  z-index: 99998;
+  background: #000;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.5;
+}
+#image-box,.image-box{
+  display:table; overflow:hidden; margin-left:50px; _position:relative;  width: 1200px;height: 700px;
+  position: fixed;
+  top: 50%;
+  margin-top: -350px;
+  left: 50%;
+  margin-left: -600px;
+  z-index: 2020;
+}
+#image-box .x-floating,.image-box .x-floating {
+  vertical-align:middle !important;
+  display:table-cell;
+  text-align:center;
+  _position:absolute;
+  _top:50%; _left:50%;
+  top: inherit !important;
+  left: inherit !important;
+}
+#image-box .x-floating img ,.image-box .x-floating img {
+  margin: auto auto;
+  max-width: 970px !important;
+  max-height: 600px !important;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+#image-box .x-floating-wrap,.image-box .x-floating-wrap{
+  z-index: 1000000 !important;
+}
+#item-content{
+  color:#fff; display:inline-block; _position:relative; _top:-50%; _left:-50%;
+  position: relative;
+  z-index: 10000000;
+}
+#item-content div.x-close-wrap{
+  position: absolute;
+  right: -15px;
+  line-height: 30px;
+  top: -13px;
+  color: #fff;
+  width: 35px;
+  height: 35px;
+  background: rgba(0, 0, 0, 0.5);
+  border-radius: 100%;
+  opacity: 1;
+  margin: 0;
+  z-index: 100000;
+  min-height: initial;
+  text-align: center;
+}
+#item-content div.x-close-wrap a{
+  position: relative;
+  left: 0;
+  bottom: 0;
+  font-size: 34px;
+  color: #fff;
+}
+#item-content div.x-close-wrap a:hover{
+  color: #fff !important;
+}
+#item-content div.x-close-wrap:hover{
+  cursor: pointer;
+  opacity: .9;
+}
+#item-content div.x-close-wrap img{
+  width: 30px !important;
+  height: 30px !important;
+}
+#item-content .img{
+  position: relative;
+  z-index: 10;
+}

components/appeal/ChangeManagerAppeal.vue

@@ -491,8 +491,6 @@
             .then(response => {
               this.isShowLoading = false
               let path = response.data.content
-              console.log(path)
-              console.log(path.slice(path.lastIndexOf('.')).toLowerCase())
               if (path.slice(path.lastIndexOf('.')).toLowerCase() === '.pdf') {
                 this.isPdf = true
               } else {

components/appeal/PasswordRestAppeal.vue

@@ -187,6 +187,7 @@
         if (value === '') {
           callback(new Error('请输入密码'))
           this.passwordChecked = false
+          console.log(this.passwordChecked)
         } else {
           if (this.passwordRest.password !== '') {
             if (value.length <= 20 && value.length >= 8) {
@@ -425,8 +426,11 @@
                 return Promise.reject(response.data)
               }
             }).catch(err => {
-              this.isShowLoading = false
               this.$message.error(err.errMsg)
+              this.isShowLoading = false
+              this.codeErrorChecked = true
+              this.codeChecked = false
+              this.account_time = 0
             })
         }
       },

components/login/Login.vue

@@ -225,7 +225,6 @@
         this.$http.get(`/sso/login/page/style`, {params: {appId: this.appId}})
           .then(response => {
             if (response.data.success) {
-              console.log(response.data)
               let logoUrlStyle = response.data.content.logoUrl
               let bgUrl = response.data.content.bgUrl
               let bgColor = response.data.content.bgColor

nuxt.config.js

@@ -1,6 +1,6 @@
 const path = require('path')
 const isProdMode = Object.is(process.env.NODE_ENV, 'production')
-const baseUrl = process.env.BASE_URL || (isProdMode ? 'https://city-service.ubtob.com' : 'http://192.168.253.12:23232/')
+const baseUrl = process.env.BASE_URL || (isProdMode ? 'https://city-service.ubtob.com' : 'http://192.168.253.66:8081/')
 
 module.exports = {
   router: {

pages/cloudcenter/index.vue

@@ -2,45 +2,136 @@
   <div class="info">
     <div class="w-over-box">
       <div class="container">
-        <div class="basic-info">
-          <div class="row">
-            <div class="col-xs-3"><h3><i class="man"></i><b v-text="user.user.vipName ? user.user.vipName : '用户名'"></b></h3></div>
-            <div class="col-xs-9"><span>上次登录时间： {{user.user.lastLoginTime | time}}</span></div>
+        <div class="basic-nav">
+          <span @click="activeTab = 0" :class="{active: activeTab === 0}">个人账号信息<em></em></span>
+          <span @click="activeTab = 1" :class="{active: activeTab === 1}" v-show="user.userspace">绑定企业信息<em></em></span></div>
+        <div class="basic-info" v-show="activeTab === 0">
+          <div class="basic-top">
+            <div class="line">
+              <div class="people"><i class="man"></i><em v-text="user.user.vipName ? user.user.vipName : '用户名'"></em></div>
+              <div class="time"><span>上次登录时间： {{user.user.lastLoginTime | time}}</span></div>
+            </div>
           </div>
-          <hr/>
-          <div class="row">
-            <div class="col-xs-3"><p>绑定手机</p></div>
-            <div class="col-xs-9"><span v-text="user.user.mobile ? user.user.mobile : ''"></span></div>
+          <div class="basic-bottom">
+            <div class="item">
+              <div class="item-list">
+                <div class="pwd-level">账号安全等级</div>
+                <div class="pwd sm" v-show="user.user.passwordLevel === 1"><em></em><em></em><em></em><span>弱</span></div>
+                <div class="pwd md" v-show="user.user.passwordLevel === 2"><em></em><em></em><em></em><span>中</span></div>
+                <div class="pwd lar" v-show="user.user.passwordLevel === 3"><em></em><em></em><em></em><span>强</span></div>
+              </div>
+            </div>
+            <div class="item items">
+              <div class="item-list">
+                <div class="bind-name">
+                  <img v-show="user.user.mobileValidCode === 2" src="/images/all/right.png" alt="">
+                  <img v-show="user.user.mobileValidCode != 2" src="/images/all/questions.png" alt="">
+                  <span>绑定手机</span>
+                </div>
+                <div class="bind-tip">您绑定的手机：{{secretMobile}}。若已丢失或停用，请立即更换，避免账户被盗。</div>
+                <a href="/validation/phoneValidation" class="bind-btn" v-show="user.user.mobileValidCode === 2">修改</a>
+                <a href="/validation/phoneValidation" class="go-btn" v-show="user.user.mobileValidCode != 2">设置</a>
+              </div>
+            </div>
+            <div class="item items">
+              <div class="item-list">
+                <div class="bind-name">
+                  <img v-show="user.user.emailValidCode === 2" src="/images/all/right.png" alt="">
+                  <img v-show="user.user.emailValidCode != 2" src="/images/all/questions.png" alt="">
+                  <span>绑定邮箱</span>
+                </div>
+                <div class="bind-tip">{{secretEmail}}</div>
+                <a href="/validation/emailValidation" class="bind-btn" v-show="user.user.emailValidCode === 2">修改</a>
+                <a href="/validation/emailValidation" class="go-btn" v-show="user.user.emailValidCode != 2">设置</a>
+              </div>
+            </div>
+            <div class="item items">
+              <div class="item-list">
+                <div class="bind-name">
+                  <img v-show="user.user.passwordLevel === 2 || user.user.passwordLevel === 3" src="/images/all/right.png" alt="">
+                  <img v-show="user.user.passwordLevel === 1" src="/images/all/questions.png" alt="">
+                  <span>登录密码</span>
+                </div>
+                <div class="bind-tip">安全性高的密码可以使账号更安全，建议您定期更换密码，并且设置一个包含数字和字母，长度超过8位以上的密码。</div>
+                <a href="/reset/changePasswordChooseStyle" class="bind-btn" v-show="user.user.passwordLevel === 2 || user.user.passwordLevel === 3">修改</a>
+                <a href="/reset/changePasswordChooseStyle" class="go-btn" v-show="user.user.passwordLevel === 1">设置</a>
+              </div>
+            </div>
+            <div class="item items">
+              <div class="item-list">
+                <div class="bind-name">
+                  <img v-show="user.user.hasQuestion" src="/images/all/right.png" alt="">
+                  <img v-show="!user.user.hasQuestion" src="/images/all/questions.png" alt="">
+                  <span>密保问题</span>
+                </div>
+                <div class="bind-tip">安全性高的密码可以使账号更安全，建议您定期更换密码，并且设置一个包含数字和字母，长度超过8位以上的密码。</div>
+                <a href="/encrypted-setting/EncryptedSetting" class="bind-btn" v-show="user.user.hasQuestion">修改</a>
+                <a href="/encrypted-setting/EncryptedSetting" class="go-btn" v-show="!user.user.hasQuestion">设置</a>
+              </div>
+            </div>
+            <div class="item items">
+              <div class="item-list">
+                <div class="bind-name">
+                  <img v-show="user.user.identityValidCode === 2" src="/images/all/right.png" alt="">
+                  <img v-show="user.user.identityValidCode != 2" src="/images/all/questions.png" alt="">
+                  <span>实名认证</span>
+                </div>
+                <div class="bind-tip">实名认证后，可通过实名信息找回支付密码、修改手机号等，提高账户安全性。</div>
+                <a href="/certification/realNameCertification" class="bind-btn" v-show="user.user.identityValidCode === 2">修改</a>
+                <a href="/certification/realNameCertification" class="go-btn" v-show="user.user.identityValidCode != 2">设置</a>
+              </div>
+            </div>
           </div>
-          <div class="row">
-            <div class="col-xs-3"><p>绑定邮箱</p></div>
-            <div class="col-xs-9"><span v-text="user.user.email ? user.user.email : ''"></span></div>
+        </div>
+        <div class="basic-info" v-show="activeTab === 1" v-if="user.userspace">
+          <div class="basic-top">
+            <div class="line">
+              <div class="people"><i class="enterprise-img"></i><em v-text="user.userspace.spaceName ? user.userspace.spaceName : '企业名称'"></em></div>
+            </div>
+          </div>
+          <div class="enterprise-bottom">
+            <div class="enterprise">
+              <div class="bind-info">管理员</div>
+              <div class="bind-detail">{{user.userspace.admin.vipName || '-'}}<a href="/change/changeManager">修改</a></div>
+            </div>
+            <div class="enterprise">
+              <div class="bind-info">企业认证</div>
+              <div class="bind-detail">
+                <em v-text="user.userspace.validCode === 2 ? '已认证' : '未认证'"></em>
+                <a v-show="user.userspace.validCode != 2" href="/certification/enterpriseCertification">申请认证</a></div>
+            </div>
+            <div class="enterprise">
+              <div class="bind-info">营业执照号</div>
+              <div class="bind-detail">{{user.userspace.businessCode || '-'}}</div>
+            </div>
+            <div class="enterprise">
+              <div class="bind-info">营业执照扫描件</div>
+              <div class="bind-detail"
+                   v-show="user.userspace.businessCodeImage">
+                附件: <span>营业执照.jpg</span><i class="fa fa-eye" @click="showImg(user.userspace.businessCodeImage)"></i>
+              </div>
+              <div class="bind-detail"
+                   v-show="!user.userspace.businessCodeImage">未上传</div>
+            </div>
+            <div class="enterprise">
+              <div class="bind-info">法定代表人</div>
+              <div class="bind-detail">{{user.userspace.corporation || '-'}}</div>
+            </div>
+            <div class="enterprise">
+              <div class="bind-info">注册地址</div>
+              <div class="bind-detail">{{user.userspace.regAddress || '-'}}</div>
+            </div>
           </div>
         </div>
       </div>
     </div>
-    <div class="w-over-box" v-if="user.userspace">
-      <div class="container">
-        <div class="basic-info">
-          <h3><i class="business"></i><b v-text="user.userspace.spaceName ? user.userspace.spaceName : '企业名称'"></b></h3>
-          <hr/>
-          <div class="row">
-            <div class="col-xs-3"><p>管理员</p></div>
-            <div class="col-xs-9"><span v-text="user.userspace.admin.vipName ? user.userspace.admin.vipName : '管理员'"></span>  <a href="/appeals/changeManagerAppeal">更换</a></div>
-          </div>
-          <div class="row">
-            <div class="col-xs-3"><p>企业法人</p></div>
-            <div class="col-xs-9"><span v-text="user.userspace.corporation ? user.userspace.corporation : ''"></span></div>
-          </div>
-          <div class="row">
-            <div class="col-xs-3"><p>营业执照</p></div>
-            <div class="col-xs-9"><span v-text="user.userspace.businessCode ? user.userspace.businessCode : ''"></span></div>
-          </div>
-          <div class="row">
-            <div class="col-xs-3"><p>企业地址</p></div>
-            <div class="col-xs-9"><span v-text="user.userspace.regAddress ? user.userspace.regAddress : ''"></span></div>
-          </div>
-          <input type="hidden" id="spaceAdminTel">
+    <!--查看大图-->
+    <div id="image-box" v-if="isShow">
+      <div class="x-floating-wrap"></div>
+      <div class="x-floating">
+        <div id="item-content">
+          <div class="x-close-wrap" @click="isShow = false"><a href="javascript:void(0);">&times;</a></div>
+          <div class="img"><img :src="imgUrl"/></div>
         </div>
       </div>
     </div>
@@ -50,9 +141,35 @@
 <script>
     export default {
       layout: 'cloud',
+      data () {
+        return {
+          activeTab: 0,
+          secretMobile: '',
+          secretEmail: '',
+          isShow: false,
+          imgUrl: ''
+        }
+      },
       middleware: 'authenticated',
       computed: {
         user () {
+          let mobile = this.$store.state.option.userInfo.data.content.user.mobile
+          if (mobile) {
+            var reg = /^(\d{3})\d{4}(\d{4})$/
+            this.secretMobile = mobile.replace(reg, '$1******$2')
+          }
+          let email = this.$store.state.option.userInfo.data.content.user.email
+          if (email) {
+            let getEmailIndex = email.indexOf('@')
+            if (getEmailIndex > 3) {
+              let len = email.substring(3, getEmailIndex)
+              this.secretEmail = email.replace(len, '*')
+            } else {
+              this.getEmailArr = email.split('')
+              this.getEmailSplit = this.getEmailArr.splice(getEmailIndex, 0, '*')
+              this.secretEmail = this.getEmailArr.join('')
+            }
+          }
           return this.$store.state.option.userInfo.data.content
         }
       },
@@ -73,6 +190,12 @@
             }
           }
         }
+      },
+      methods: {
+        showImg (imgUrl) {
+          this.imgUrl = imgUrl
+          this.isShow = true
+        }
       }
     }
 </script>
@@ -82,70 +205,258 @@
     padding:50px 0 112px 30px;
     background:#eee;
   }
-  .w-btn{
-    width:180px;
-    height:30px;
-    line-height: 16px;
-    border-radius:15px;
-    color:#656565;
-    font-size: 14px;
-  }
-  .w-over-box {
-    padding-top:10px;
-  }
-  .w-over-box .basic-info{
-    padding:20px 30px;
+  .w-over-box .basic-nav{
+    margin: 0 auto 15px;
+    padding: 0 245px;
+    width: 1200px;
+    height: 70px;
+    line-height: 70px;
+    text-align: center;
     background: #fff;
+    span{
+      position: relative;
+      font-size: 20px;
+      color: #8c8c8c;
+      cursor: pointer;
+      &:nth-child(1){
+        float: left;
+      }
+      &:nth-child(2){
+        float: right;
+      }
+      em{
+        &:after{
+          content: '';
+          position: absolute;
+          bottom: 0;
+          left: 30px;
+          width: 52px;
+          height: 6px;
+          background: transparent ;
+        }
+      }
+      &:hover,&.active{
+        color: #000;
+        em {
+          &:after{
+            background: #0076ad;
+          }
+        }
+      }
+    }
   }
-  .w-over-box .basic-info .f-pr{
-    position:relative;
-    top:10px;
-  }
-  .w-over-box .basic-info hr{
-    border:1px solid #e5e5e5;
-  }
-  .w-over-box .basic-info h3{
-    font-size: 18px;
-    color:#000;
-    line-height: 20px;
-    font-weight: bold;
-    margin:0;
-  }
-  .w-over-box .basic-info h3 i.business{
+  .w-over-box .basic-info i.man{
     display:inline-block;
     position:relative;
-    top:2px;
+    top:5px;
     width:30px;
     height:20px;
-    background:url('/img/over_account/business.png')no-repeat;
+    background: url('/img/over_account/man.png') no-repeat;
   }
-  .w-over-box .basic-info h3 em{
-    color:#e87405;
-    font-style:normal;
-  }
-  .w-over-box .basic-info .row{
-    margin-bottom:30px;
-  }
-  .w-over-box .basic-info .row a{
-    margin-left:25px;
-    color:#0076ad;
-  }
-  .w-over-box .basic-info .row i.man{
+  .w-over-box .basic-info i.enterprise-img{
     display:inline-block;
     position:relative;
     top:5px;
     width:30px;
     height:20px;
-    background:url('/img/over_account/man.png')no-repeat;
+    background: url('/img/over_account/enter.png') no-repeat;
   }
-  .w-over-box .basic-info .row p{
+  .w-over-box .basic-info p{
     font-weight: bold;
     font-size: 14px;
     color:#000;
     margin:0;
   }
-  .w-over-box .basic-info .row span{
+  .w-over-box .basic-info span{
     font-size: 14px;
     color:#787878;
   }
+  .w-over-box .basic-info{
+    width: 1200px;
+    background: #fff;
+    .basic-top{
+      padding: 0 40px;
+      width: 100%;
+      height: 70px;
+      line-height: 70px;
+      div.line{
+        overflow: hidden;
+        border-bottom: 2px solid #e5e5e5;
+        div.people{
+          float: left;
+          margin-right: 30px;
+        }
+        div.time{
+          float: left;
+        }
+      }
+      em{
+        font-style: normal;
+        font-size: 18px;
+        color: #000;
+      }
+    }
+    .basic-bottom{
+      width: 100%;
+      padding: 20px 0;
+      .item{
+        height: 60px;
+        line-height: 60px;
+        .item-list{
+          padding: 0 37px;
+          width: 100%;
+          overflow: hidden;
+          .pwd-level{
+            float: left;
+            margin: 16px 19px 0 0;
+            width: 120px;
+            height: 28px;
+            line-height: 28px;
+            text-align: center;
+            font-size: 14px;
+            color: #797979;
+            background: #eee;
+          }
+          .pwd{
+            float: left;
+            em{
+              display: inline-block;
+              margin: 0 8px 2px 0;
+              width: 24px;
+              height: 6px;
+              &:first-child{
+                margin-left: 10px;
+              }
+            }
+            span{
+              margin-left: 10px;
+              font-size: 13px;
+            }
+          }
+          .pwd.sm{
+            color: #8c8c8c;
+            em {
+              background: #bfbfbf;
+              &:first-child{
+                background: #ff4e00;
+              }
+            }
+            span{
+              color: #ff4e00;
+            }
+          }
+          .pwd.md{
+            color: #8c8c8c;
+            em {
+              background: #22ac38;
+              &:nth-child(3){
+                background: #bfbfbf;
+              }
+            }
+            span{
+              color: #22ac38;
+            }
+          }
+          .pwd.lar{
+            color: #8c8c8c;
+            em {
+              background: #00a0e9;
+            }
+            span{
+              color: #00a0e9;
+            }
+          }
+        }
+      }
+      .items{
+        &:hover{
+        background: #eaf4f9;
+        }
+        .bind-name{
+          float: left;
+          margin-right: 55px;
+          img{
+            margin-right: 15px;
+            width: 20px;
+            height: 18px;
+          }
+          span{
+            font-size: 14px;
+            color: #000;
+          }
+        }
+        .bind-tip{
+          float: left;
+          font-size: 14px;
+          color: #787878;
+        }
+        .bind-btn {
+          float: right;
+          display: inline-block;
+          width: 86px;
+          text-align: center;
+          font-size: 14px;
+          color: #0076ad;
+        }
+        .go-btn{
+          margin-top: 15px;
+          float: right;
+          display: inline-block;
+          width: 86px;
+          text-align: center;
+          height: 30px;
+          line-height: 30px;
+          font-size: 14px;
+          color: #fff;
+          background: #0076ad;
+        }
+      }
+    }
+    .enterprise-bottom{
+      width: 100%;
+      padding: 38px 0 50px 0;
+      .enterprise{
+        margin-bottom: 45px;
+        padding: 0 37px;
+        height: 20px;
+        overflow: hidden;
+        &:last-child {
+          margin-bottom: 0;
+        }
+        .bind-info{
+          float: left;
+          margin-right: 50px;
+          width: 100px;
+          font-size: 14px;
+          color: #000;
+        }
+        .bind-detail{
+          float: left;
+          font-size: 14px;
+          color: #787878;
+          em{
+            font-style: normal;
+            font-size: 14px;
+            color: #787878;
+          }
+          a{
+            margin-left: 25px;
+            font-size: 14px;
+            color: #0076ad;
+          }
+          span{
+            font-size: 14px;
+            color: #0076ad;
+          }
+          i{
+            margin-left: 12px;
+            font-size: 18px;
+            color: #000;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+
 </style>