日志、可视化

src/layouts/header/index.vue

@@ -46,33 +46,6 @@
                 <el-button size="small" type="primary" @click="editPassword">确 定</el-button>
             </span>
         </el-dialog>
-
-        <div class="log-mask" v-if="logVisible"></div>
-        <div class="log-dia" v-if="logVisible">
-          <img class="bg1" src="@/assets/img/log-bg.png" alt="">
-          <img class="bg2" src="@/assets/img/log-bg1.png" alt="">
-          <p class="log-title">更新日志</p>
-          <div class="log-wrap">
-            <div class="logs">
-              <div class="item" v-for="(item, i) in list" :key="i" v-show="!i || (i && logAll)">
-                <h6>{{ item.versionName }}</h6>
-                <img v-if="item.coverUrl" :src="item.coverUrl" alt="" class="cover">
-                <ul class="detail">
-                  <li v-for="(item, i) in item.logContents" :key="i">
-                    <p class="name"><img :src="require('@/assets/img/' + funcList.find(e => e.id === item.type).icon + '.png')" alt=""> {{ funcList.find(e => e.id === item.type).name }}</p>
-                    <div class="val">
-                      <p v-for="(item, i) in item.content" :key="i">{{ i + 1 }}、{{ item }}</p>
-                    </div>
-                  </li>
-                </ul>
-              </div>
-            </div>
-            <div class="more-wrap">
-              <p>更多功能介绍，点击 <span class="more" @click="logAll = !logAll">了解更多</span></p>
-              <el-button class="know" type="primary" size="small" @click="logVisible = false">知道了</el-button>
-            </div>
-          </div>
-        </div>
     </div>
 </template>
 <script>
@@ -94,27 +67,7 @@ export default {
         password: '',
         newPassword: '',
         reNewPassword: ''
-      },
+      }
-      logVisible: false,
-      list: [],
-      logAll: false,
-      funcList: [
-          {
-              id: 0,
-              name: '新功能',
-              icon: 'func'
-          },
-          {
-              id: 1,
-              name: '修复',
-              icon: 'bug'
-          },
-          {
-              id: 2,
-              name: '优化',
-              icon: 'optimize'
-          }
-      ]
     };
   },
   components: { navbar },
@@ -141,42 +94,15 @@ export default {
         userName
       })
     }
-    this.logView || this.getLogStatus() // logView为false才需要查询接口
     // 如果登录了,并且非客户，才调用用户信息的接口。客户是没有用户信息的，但是能进入后台（如果有权限菜单）
     setTimeout(() => {
       this.token && !this.isCustomer && this.getUserInfo()
     }, 1000)
   },
   methods: {
-    ...mapMutations('user', [
-        'SET_LOG'
-    ]),
     ...mapActions('user', [
       'setInfo', 'logout', 'setManager', 'setCustomer'
     ]),
-    // 获取日志列表
-    getLog() {
-      this.$get(`${this.api.platformLogList}?platformId=${Setting.platformId}&port=1&versionName=`).then(({ logList }) => {
-        logList.map((e, i) => {
-          e.logContents.map(n => {
-            n.content = n.content.split('\n')
-          })
-        })
-        this.list = logList
-      }).catch(res => {})
-    },
-    // 获取日志状态
-    getLogStatus() {
-        this.token && this.$get(this.api.logNotification, {
-            platformId: Setting.platformId
-          }).then(({ notification }) => {
-          this.SET_LOG() // 把查看日志状态设置为true
-          if (notification) {
-            this.logVisible = true // 返回true，则显示日志弹框
-            this.getLog()
-          }
-        }).catch(res => {})
-    },
     // 获取个人信息
     getUserInfo() {
       this.$get(this.api.userInfo).then(res => {
@@ -367,98 +293,4 @@ $height: 64px;
         }
     }
 }
-.log-mask {
-  position: fixed;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  background-color: rgba(0, 0, 0, .4);
-}
-/deep/.log-dia {
-  position: absolute;
-  top: calc((100vh - 500px) / 2);
-  left: 50%;
-  width: 500px;
-  transform: translateX(-50%);
-  background-color: #fff;
-  border-radius: 6px;
-  .bg1 {
-    width: 100%;
-    height: 200px;
-  }
-  .bg2 {
-    position: absolute;
-    top: -150px;
-    left: 0;
-    max-width: 100%;
-  }
-  .log-title {
-    position: absolute;
-    top: 90px;
-    left: 130px;
-    font-size: 40px;
-    color: #fff;
-    font-weight: 600;
-  }
-  .log-wrap {
-    padding-bottom: 30px;
-  }
-  .logs {
-    max-height: 300px;
-    padding: 0 60px;
-    margin: 30px 0;
-    overflow: auto;
-  }
-  h6 {
-    margin-bottom: 15px;
-    font-size: 18px;
-    color: #333;
-    line-height: 1;
-  }
-  .more-wrap {
-    padding: 0 60px;
-    font-size: 14px;
-    color: #333;
-  }
-  .more {
-    font-size: 14px;
-    color: $main-color;
-    cursor: pointer;
-    &:hover {
-      opacity: .9;
-    }
-  }
-  .know {
-    margin-top: 15px;
-  }
-  .cover {
-      max-width: 400px;
-      margin: 10px 0 20px;
-  }
-  .detail {
-    li {
-        margin-bottom: 20px;
-    }
-    .name {
-        display: flex;
-        align-items: center;
-        margin-bottom: 5px;
-        font-size: 14px;
-        img {
-            width: 20px;
-            margin-right: 8px;
-        }
-    }
-    .val {
-        font-size: 15px;
-        line-height: 1.8;
-        white-space: pre-wrap;
-        p {
-          position: relative;
-          color: #505050;
-        }
-    }
-  }
-}
 </style>

src/layouts/home/index.vue

@@ -9,6 +9,31 @@
                 <el-backtop target=".content"></el-backtop>
                 <v-footer></v-footer>
             </div>
+            <div class="log-mask" v-if="logVisible"></div>
+            <div class="log-dia" v-if="logVisible">
+              <img class="bg1" src="@/assets/img/log-bg.png" alt="">
+              <img class="bg2" src="@/assets/img/log-bg1.png" alt="">
+              <p class="log-title">更新日志</p>
+              <div class="log-wrap">
+                <div class="logs">
+                  <div class="item" v-for="(item, i) in list" :key="i" v-show="!i || (i && logAll)">
+                    <h6>{{ item.versionName }}</h6>
+                    <img v-if="item.coverUrl" :src="item.coverUrl" alt="" class="cover">
+                    <ul class="detail">
+                      <li v-for="(item, i) in item.logContents" :key="i">
+                        <p class="name"><img :src="require('@/assets/img/' + funcList.find(e => e.id === item.type).icon + '.png')" alt=""> {{ funcList.find(e => e.id === item.type).name }}</p>
+                        <div class="val">
+                          <p v-for="(item, i) in item.content" :key="i">{{ i + 1 }}、{{ item }}</p>
+                        </div>
+                      </li>
+                    </ul>
+                  </div>
+                </div>
+                <div class="more-wrap">
+                  <el-button class="know" type="primary" size="small" @click="logVisible = false">知道了</el-button>
+                </div>
+              </div>
+            </div>
         </div>
     </div>
 </template>
@@ -16,26 +41,77 @@
 <script>
 import vHead from '../header'
 import vFooter from '../footer'
-import { mapActions } from 'vuex'
+import { mapState, mapMutations, mapActions } from 'vuex'
 import Setting from '@/setting'
 import util from '@/libs/util'
 export default {
     data() {
         return {
-            
+            logVisible: false,
+            list: [],
+            logAll: false,
+            funcList: [
+                {
+                    id: 0,
+                    name: '新功能',
+                    icon: 'func'
+                },
+                {
+                    id: 1,
+                    name: '修复',
+                    icon: 'bug'
+                },
+                {
+                    id: 2,
+                    name: '优化',
+                    icon: 'optimize'
+                }
+            ]
         };
     },
     components: {
         vHead,
         vFooter
     },
+    computed: {
+        ...mapState("user", [
+            'logView'
+        ])
+    },
     mounted() {
         this.autoLogout()
+        this.logView || this.getLogStatus() // logView为false才需要查询接口
     },
     methods: {
+        ...mapMutations("user", [
+            'SET_LOG'
+        ]),
         ...mapActions('user', [
             'logout'
         ]),
+        // 获取日志列表
+        getLog() {
+          this.$get(`${this.api.platformLogList}?platformId=${Setting.platformId}&port=1&versionName=`).then(({ logList }) => {
+            logList.map((e, i) => {
+              e.logContents.map(n => {
+                n.content = n.content.split('\n')
+              })
+            })
+            this.list = logList
+          }).catch(res => {})
+        },
+        // 获取日志状态
+        getLogStatus() {
+            util.local.get(Setting.tokenKey) && this.$get(this.api.logNotification, {
+              platformId: Setting.platformId
+            }).then(({ notification }) => {
+              this.SET_LOG() // 把查看日志状态设置为true
+              if (notification) {
+                this.logVisible = true // 返回true，则显示日志弹框
+                this.getLog()
+              }
+            }).catch(res => {})
+        },
         // 长时间未操作,自动退出登录
         autoLogout() {
             let lastTime = new Date().getTime()
@@ -55,25 +131,117 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-    .main{
+.main{
-        min-height: calc(100% - 64px);
+    min-height: calc(100% - 64px);
-        .layout{
+    .layout{
-            padding-top: 64px;
+        padding-top: 64px;
-        }
+    }
-        .view{
+    .view{
-            min-width: $min-width;
+        min-width: $min-width;
-            min-height: calc(100vh - 134px);
+        min-height: calc(100vh - 134px);
-            padding: 12px 80px 0;
+        padding: 12px 80px 0;
-            margin: 0 auto;
+        margin: 0 auto;
-            background-color: #F3F6FA;
+        background-color: #F3F6FA;
-            background: url(../../assets/img/shapes/shape1.png) 0 50px no-repeat,
+        background: url(../../assets/img/shapes/shape1.png) 0 50px no-repeat,
-            url(../../assets/img/shapes/shape7.png) right 70px no-repeat,
+        url(../../assets/img/shapes/shape7.png) right 70px no-repeat,
-            url(../../assets/img/shapes/shape8.png) 0 574px no-repeat,
+        url(../../assets/img/shapes/shape8.png) 0 574px no-repeat,
-            url(../../assets/img/shapes/shape9.png) right 645px no-repeat,
+        url(../../assets/img/shapes/shape9.png) right 645px no-repeat,
-            url(../../assets/img/shapes/shape6.png) 0 1074px no-repeat;
+        url(../../assets/img/shapes/shape6.png) 0 1074px no-repeat;
+    }
+    .index{
+        padding: 0;
+    }
+}
+.log-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background-color: rgba(0, 0, 0, .4);
+}
+/deep/.log-dia {
+  z-index: 11;
+  position: absolute;
+  top: 250px;
+  left: 50%;
+  width: 550px;
+  transform: translateX(-50%);
+  background-color: #fff;
+  border-radius: 6px;
+  .bg1 {
+    width: 100%;
+    height: 140px;
+  }
+  .bg2 {
+    position: absolute;
+    top: -130px;
+    left: 48px;
+    max-width: 100%;
+    height: 250px;
+  }
+  .log-title {
+    position: absolute;
+    top: 65px;
+    left: 0;
+    width: 100%;
+    text-align: center;
+    font-size: 22px;
+    color: #fff;
+    font-weight: 600;
+  }
+  .log-wrap {
+    padding-bottom: 30px;
+  }
+  .logs {
+    max-height: 250px;
+    padding: 0 100px;
+    margin: 30px 0;
+    overflow: auto;
+  }
+  h6 {
+    margin-bottom: 15px;
+    font-size: 16px;
+    color: #333;
+    line-height: 1;
+  }
+  .more-wrap {
+    padding: 0 60px;
+    font-size: 14px;
+    color: #333;
+    text-align: center;
+  }
+  .know {
+    margin-top: 15px;
+  }
+  .cover {
+      max-width: 250px;
+      margin: 10px 0 20px;
+  }
+  .detail {
+    li {
+        margin-bottom: 20px;
+    }
+    .name {
+        display: flex;
+        align-items: center;
+        margin-bottom: 5px;
+        font-size: 14px;
+        img {
+            width: 20px;
+            margin-right: 8px;
         }
-        .index{
+    }
-            padding: 0;
+    .val {
+        font-size: 15px;
+        line-height: 1.8;
+        white-space: pre-wrap;
+        p {
+          position: relative;
+          font-size: 13px;
+          color: #727272;
         }
     }
+  }
+}
 </style>

src/pages/account/login/index.vue

@@ -249,7 +249,8 @@ export default {
         // 选择用户回调
         chooseUser(user) {
           user.isEnable && this.$post(`${this.api.getToken}?id=${user.id}`).then(({ data }) => {
-            this.queryClient(data.token)
+            this.token = data.token
+            this.setLogin()
           }).catch(res => {})
         },
         // 处理登录成功
@@ -294,8 +295,13 @@ export default {
                     } else if (status == 200) {
                       // 如果返回的是数组，则弹框给用户选择登录哪个用户，否则，直接登录
                       if (data instanceof Array) {
-                        this.users = data
+                        // 如果只查询到一个用户，则直接登录，否则，弹框让用户选择
-                        this.userVisible = true
+                        if (data.length === 1) {
+                          this.chooseUser(data[0])
+                        } else {
+                          this.users = data
+                          this.userVisible = true
+                        }
                       } else {
                         this.token = data.token
                         this.setLogin()

src/pages/screen/list/index.vue

@@ -648,13 +648,13 @@ export default {
               boundaryGap: false,
               axisLabel: {
                 textStyle: {
-                  color: "rgba(255,255,255,.6)",
+                  color: "rgba(255,255,255,1)",
                   fontSize: 12,
                 },
               },
               axisLine: {
                 lineStyle: {
-                  color: 'rgba(255,255,255,.2)'
+                  color: 'rgba(255,255,255,1)'
                 }
               },
               data: data.map(e => e.statistical_time.replace(' 0:00', ''))
@@ -680,7 +680,7 @@ export default {
               },
               axisLabel: {
                 textStyle: {
-                  color: "rgba(255,255,255,.6)",
+                  color: "rgba(255,255,255,1)",
                   fontSize: 12,
                 },
               },
@@ -990,9 +990,7 @@ export default {
               axisLabel: {
                 margin: 10,
                 textStyle: {
-                  fontSize: 12
+                  fontSize: 12,
-                },
-                textStyle: {
                   color: '#fff'
                 },
                 formatter: '{value}%'
@@ -1112,7 +1110,7 @@ export default {
               // 使用函数模板  传入的数据值 -> value: number | Array
               formatter: function (val) {
                 const { data } = val
-                return data ? (data.name + '利率: ' + data.value + '%') : val.name
+                return data ? (data.name + '利率: ' + data.value + '%') : ''
               }
             },
             // 视觉映射组件

src/setting.js

@@ -25,7 +25,7 @@ const Setting = {
      * 正式：http://www.dataforward.cn:9000
      * */
     // apiBaseURL: env === 'development' ? 'http://192.168.31.151:9000' : 'http://39.108.250.202:9000',
-    apiBaseURL: env === 'development' ? 'http://192.168.31.151:9000/' : `${location.origin}:9000/`,
+    apiBaseURL: env === 'development' ? 'http://39.108.250.202:9000/' : `${location.origin}:9000/`,
     // 加密货币接口地址
     cryptoBaseURL: `http://159.138.53.111/`,
     // 接口请求返回错误时，弹窗的持续时间，单位：秒