页面布局重构

src/components/navLeft.vue

@@ -17,6 +17,9 @@
         <el-menu-item index="BTY">BTY</el-menu-item>
         <el-menu-item index="YCC">YCC</el-menu-item>
       </el-submenu>
+      <el-menu-item index="account">
+        <span slot="title">账户监控</span>
+      </el-menu-item>
     </el-menu>
   </div>
 </template>
@@ -26,17 +29,22 @@
   export default {
     data(){
       return{
+        platInfo: JSON.parse(sessionStorage.getItem('platInfo')),
         active: ''
       }
     },
-    props: ['platInfo'],
     created() {
-      this.active = this.$route.params.name;
+      this.active = this.$route.params.name || 'account';
     },
     methods: {
       navClick() {
+        if(this.active != 'account'){
           this.$router.push('/monitor/' + this.active)
           Bus.$emit('navClick')
+        }else{
+          this.active = 'account';
+          this.$router.push('/monitor/account');
+        }
       }
     },
     watch: {

src/router/index.js

@@ -24,9 +24,15 @@ export default new Router({
       children:
         [
           {
+            path: 'account',
+            component: function(resolve){
+              require(['../views/account.vue'],resolve);
+            },
+          },
+          {
             path:":name",
             component: function(resolve){
-              require(['../views/overview.vue'],resolve);
+              require(['../views/RobotContainer.vue'],resolve);
             },
             children: [
               {

src/views/Login.vue

@@ -104,6 +104,7 @@ import ApiConfig from "../config/api-config";
 export default {
   data(){
     return {
+      salt: 'fzm_salt',//md5加盐值
       show:true,
       count:'',
       timer:null,
@@ -115,8 +116,8 @@ export default {
       forget_password:'',//新密码
       forget_rppassword:'',//确认新密码
       forget_yzm:'',//忘记密码验证码
-      islogin:1,//1是登陆，2是注册 3是忘记密码
-      loginBody: {//登陆的数据
+      islogin:1,//1是登录，2是注册 3是忘记密码
+      loginBody: {//登录的数据
         email: "",
         password: "",
       },
@@ -213,7 +214,7 @@ export default {
         if(res.data.code === 200){
           this.$notify({
             title: '提示',
-            message: "注册成功，请返回登陆",
+            message: "注册成功，请返回登录",
             type: 'success',
             duration:'2000',
           });
@@ -255,7 +256,7 @@ export default {
         if(res.data.code === 200){
           this.$notify({
             title: '提示',
-            message: "登陆成功",
+            message: "登录成功",
             type: 'success',
             duration:'2000',
           });
@@ -280,7 +281,7 @@ export default {
       .catch(err=>{
         this.$notify({
           title: '提示',
-          message: "登陆失败，请稍后再试",
+          message: "登录失败，请稍后再试",
           type: 'error',
           duration:'2000',
         });
@@ -338,7 +339,7 @@ export default {
         if(res.data.code === 200){
           this.$notify({
             title: '提示',
-            message: "重置密码成功，请返回登陆",
+            message: "重置密码成功，请返回登录",
             type: 'success',
             duration:'2000',
           });

src/views/RobotContainer.vue

+<template>
+  <div class="box">
+    <overview v-if="$route.path.split('/').pop() !== 'RobotDetail'" :platInfo="platInfo"></overview>
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+  import overview from './overview'
+  export default {
+    data() {
+      return {
+
+      }
+    },
+    props: ['platInfo'],
+    components: { overview },
+  }
+</script>
+
+<style scoped>
+  .box {
+    padding: 0 20px;
+  }
+</style>

src/views/RobotDetails.vue

@@ -462,6 +462,7 @@
   export default {
     data(){
       return{
+        robotBankList: JSON.parse(sessionStorage.getItem('robotBankList')),
         robotDetailInfo: JSON.parse(sessionStorage.getItem('robotDetailInfo')),
         robotInfo: {},
         ticketInfo: '',//行情
@@ -510,7 +511,6 @@
         recordsLoading: false,//交易记录查询加载
       }
     },
-    props: ['robotBankList'],
     created() {
       this.init();
     },
@@ -1094,6 +1094,54 @@
 </style>
 <style>
   /*select组件样式覆盖*/
+  .select-bar-content {
+    padding: 2px 0 0 65px;
+    .el-checkbox-button:last-child .el-checkbox-button__inner, .el-checkbox-button:first-child .el-checkbox-button__inner {
+      border-radius: 3px;
+    }
+    &.pair {
+      .el-checkbox-button__inner{
+        width: 85px;
+      }
+      .el-checkbox-group .el-checkbox-button:first-child {
+        margin-left: 90px;
+      }
+    }
+    .el-checkbox-button__inner {
+      padding: 5px 0;
+      width: 58px;
+      text-align: center;
+      background-color: #C3D3DF;
+      border-color: #C3D3DF;
+      box-shadow: none;
+      color: #fff;
+      border-radius: 3px;
+      font-size: 12px;
+    }
+    .el-checkbox-button {
+      margin: 0 10px 10px 0;
+      border-radius: 3px;
+    }
+    .el-checkbox-button.is-checked .el-checkbox-button__inner {
+      background-color: #7792A7;
+      border-color: #7792A7;
+    }
+    .el-checkbox-button.is-focus .el-checkbox-button__inner {
+      border-color: #dcdfe6;
+    }
+    &>.el-checkbox-button {
+      margin-left: -69px;
+    }
+    .el-checkbox-group {
+      margin-top: -34px;
+      .el-checkbox-button:first-child {
+        margin-left: 70px;
+      }
+    }
+  }
+</style>
+<style>
+  /*select组件样式覆盖*/
   .record-box {
     .select-bar-content {
       padding: 0 0 0 40px;

src/views/account.vue

+<template>
+  <div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+
+  }
+</script>
+
+<style scoped>
+
+</style>

src/views/container.vue

@@ -48,17 +48,10 @@
         })
       },
       getRobotBank() {
-        const params = {
-          "class":"bank",			//账户级别 有robot bank admin三个返回数据也不同
-          "coin":[],			//目标币种，用于首页里的筛选和币种监控 	可选参数
-          "symbol":[],		//币种对，用于网站监控里的筛选			可选参数
-          "status":"",			//机器人运行状态							可选参数
-          "abnormal":"",		//有profit,coin,base这三种异常类别			可选参数
-          "platform":[]		//交易所种类								可选参数
-        }
-        axios.post(ApiConfig.GetRobotBank,params).then( res => {
+        axios.post(ApiConfig.GetRobotBank,{class : "bank"}).then( res => {
           if (res.data.code === 200) {
             // console.log(res.data.data);
+            sessionStorage.setItem('robotBankList',JSON.stringify(res.data.data))
             this.robotBankList = res.data.data
           }
         })

src/views/overview.vue

 <template>
   <div class="overview">
-    <div v-if="$route.path.split('/').pop() !== 'RobotDetail'">
     <div class="overview-title">
       <span>机器人监控</span>
     </div>
@@ -131,11 +130,8 @@
     </ul>
     <p v-if="robotList === null" class="no-data">暂无数据</p>
   </div>
-    <router-view :robotBankList="robotBankList"></router-view>
-  </div>
 </template>
 <script>
-  import RobotDetails from './RobotDetails'
   import Bus from '../assets/js/bus'
   import axios from 'axios';
   import ApiConfig from "../config/api-config";
@@ -178,8 +174,7 @@
         showPairFilter: false,//是否显示交易对过滤
       };
     },
-    components: { RobotDetails },
-    props: ['platInfo','robotBankList'],
+    props: ['platInfo'],
     created() {
       this.init();
       Bus.$on('navClick', ()=> {
@@ -205,6 +200,8 @@
     },
     methods: {
       init() {
+        this.webs = this.webs.length === 0 && sessionStorage.getItem('webs') ? JSON.parse(sessionStorage.getItem('webs')) : this.webs;
+        this.currencies = this.currencies.length === 0 && sessionStorage.getItem('currencies') ? JSON.parse(sessionStorage.getItem('currencies')) : this.currencies;
         const RoutePath = this.$route.params.name;
         // console.log(RoutePath);
         var StatusParams = {platform: '', coin: ''};//预警状态查询入参
@@ -224,6 +221,7 @@
             this.RobotListParams.platform = [];
             break;
           default:
+            if (RoutePath) {
               this.showPairFilter = true;
               this.showWebFilter = this.showCurrencyFilter = false;
               var index = +RoutePath;
@@ -232,6 +230,7 @@
               StatusParams.platform = this.platform;
               this.RobotListParams.platform = [this.platform];
               this.RobotListParams.coin = [];
+            }
             break;
         }
         this.getRobotStatus(StatusParams);
@@ -401,10 +400,13 @@
         // console.log(newVal.params.name)
       },
       platInfo(val){
+        this.webs = [];
         //获取所有的交易所和币种
         for (let item of this.platInfo){
           this.webs.push(item.platform);
           this.currencies = this.allCurrencies = [...new Set(this.currencies.concat(item.coin))];
+          sessionStorage.setItem('webs', JSON.stringify(this.webs));
+          sessionStorage.setItem('currencies', JSON.stringify(this.currencies));
         }
       }
     }
@@ -412,9 +414,6 @@
 </script>
 
 <style scoped>
-  .overview {
-    padding: 0 20px;
-  }
   .overview-title {
     position: relative;
     height: 40px;