Merge branch 'dev-2.0' of https://git.mesalab.cn/nezha/nezha-fronted into dev-2.0

nezha-fronted/src/assets/stylus/main.scss

@@ -1047,6 +1047,9 @@ li{
   padding: 0 20px 20px 20px;
   border-radius: 10px;
 }
+.nz-pop-select-panel {
+  z-index: 1999 !important;
+}
 .nz-pop-select-area, .nz-pop-select-panel {
   padding: 0 !important;
   box-shadow: 0 2px 12px 0 rgba(0,0,0,.1) !important;

nezha-fronted/src/components/common/language/cn.js

@@ -1765,13 +1765,13 @@ const cn = {
   },
   profile: {
     profile: '个人中心',
-    close: '关闭',
+    close: '禁用',
     clear: '清空',
     enable: '启用',
     update: '更新',
     operationRecord: '操作记录',
     changePassword: '修改密码',
-    oldPassword: '旧密码',
+    oldPassword: '当前密码',
     newPassword: '新密码',
     confirmPassword: '确认密码',
     lastLoginIp: '最后登录IP',

nezha-fronted/src/components/common/language/en.js

@@ -1647,13 +1647,13 @@ const en = {
   },
   profile: {
     profile: 'Profile',
-    close: 'Close',
+    close: 'disable',
     clear: 'Clear',
     enable: 'Enable',
     update: 'Update',
     operationRecord: 'Operation log',
     changePassword: 'Change password',
-    oldPassword: 'Old password',
+    oldPassword: 'Current password',
     newPassword: 'New password',
     confirmPassword: 'Confirm password',
     lastLoginIp: 'Last login IP',

nezha-fronted/src/components/common/popBox/selectPanel.vue

@@ -22,10 +22,25 @@
             ref="panelTree">
             <div class="tree--node" slot-scope="{ node, data }">
               <span>{{ node.label }}</span>
-              <span class="tree--operation" v-if="!panelLock">
+<!--              <span class="tree&#45;&#45;operation" v-if="!panelLock">-->
-                <span @click.stop="deletePanel(data)" class="panel-dropdown-btn panel-dropdown-btn-delete" v-has="'panel_delete'"><i class="nz-icon nz-icon-delete"></i></span>
+<!--                <span @click.stop="deletePanel(data)" class="panel-dropdown-btn panel-dropdown-btn-delete" v-has="'panel_delete'"><i class="nz-icon nz-icon-delete"></i></span>-->
-                <span class="panel-dropdown-btn" @click.stop="editPanel(data)"><i v-has="'panel_edit'" class="nz-icon nz-icon-edit"></i></span>
+<!--                <span class="panel-dropdown-btn" @click.stop="editPanel(data)"><i v-has="'panel_edit'" class="nz-icon nz-icon-edit"></i></span>-->
-              </span>
+<!--              </span>-->
+              <el-row class="block-col-2" v-if="!panelLock"  style="width: 35px;">
+                <el-col>
+                  <el-dropdown placement="bottom" trigger="click">
+                    <span class="el-dropdown-link tree--operation" @click.stop><i class="nz-icon nz-icon-more1"></i></span>
+                    <el-dropdown-menu slot="dropdown"  v-has="['panel_edit', 'panel_delete']">
+                      <el-dropdown-item>
+                        <span @click.stop="editPanel(data)"><i v-has="'panel_edit'" class="nz-icon nz-icon-edit"></i>Edit</span>
+                      </el-dropdown-item>
+                      <el-dropdown-item>
+                        <span @click.stop="deletePanel(data)" v-has="'panel_delete'"><i class="nz-icon nz-icon-delete"></i>Delete</span>
+                      </el-dropdown-item>
+                    </el-dropdown-menu>
+                  </el-dropdown>
+                </el-col>
+              </el-row>
             </div>
           </el-tree>
         </div>
@@ -34,6 +49,9 @@
     <div slot="reference">
       <slot name="trigger"></slot>
     </div>
+    <div slot="default">
+      <slot name="tail"></slot>
+    </div>
   </el-popover>
 </template>
 
@@ -212,3 +230,8 @@ export default {
   color: #D96D7A;
 }
 </style>
+<style scoped lang="scss">
+.nz-pop-select-panel {
+  z-index: 1999 !important;
+}
+</style>

nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue

@@ -4,7 +4,7 @@
       <i class="nz-icon nz-icon-more2" style="font-size: 12px;"></i>
     </button>
     <el-dropdown-menu slot="dropdown">
-      <el-dropdown-item v-if="showLock">
+      <el-dropdown-item  v-if="showLock">
         <div @click="panelLock=!panelLock" id="panel-lock"><i :class="{'nz-icon nz-icon-lock':panelLock,'nz-icon nz-icon-unlock':!panelLock}"></i>{{panelLock ? $t("overall.locked") : $t("overall.unlocked")}}</div>
       </el-dropdown-item>
       <!-- import、export之前的内容 -->
@@ -102,7 +102,7 @@ export default {
   props: {
     size: {
       type: String,
-      default: 'small'
+      default: 'medium'
     },
     exportUrl: { type: String, default: '' },
     params: { type: Object },

nezha-fronted/src/components/page/config/profile.vue

@@ -63,7 +63,7 @@
         </div>
         <div class="profile-left__bottom-title">
           <div>{{$t('profile.lastLoginTime')}}</div>
-          <div>{{userList.lastLoginTime}}</div>
+          <div>{{utcTimeToTimezoneStr(userList.lastLoginTime)}}</div>
         </div>
       </div>
     </div>

nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue

@@ -8,16 +8,33 @@
         </div>
         <!-- 顶部工具栏 -->
         <div class="top-tools" style="z-index: 1">
-          <div class="top-tool-left">
+<!--          <div class="top-tool-left">-->
-            <el-select v-model="fromData.status" size="small" style="width: 120px;" @change="changeType">
+<!--            <el-select v-model="fromData.status" size="small" style="width: 120px;" @change="changeType">-->
-              <el-option
+<!--              <el-option-->
-                v-for="item in searchMetrics"
+<!--                v-for="item in searchMetrics"-->
-                :key="item.value"
+<!--                :key="item.value"-->
-                :label="item.label"
+<!--                :label="item.label"-->
-                :value="item.value">
+<!--                :value="item.value">-->
-              </el-option>
+<!--              </el-option>-->
-            </el-select>
+<!--            </el-select>-->
-          </div>
+<!--          </div>-->
+          <el-row class="block-col-2" style="width: 300px;">
+            <el-col>
+              <el-dropdown trigger="click">
+              <span class="el-dropdown-link">
+                <span><i :class="selectIcon"></i></span>
+                <span>{{selectValue}}</span>
+                <span><i class="el-icon-arrow-down el-icon--right"></i></span>
+              </span>
+                <el-dropdown-menu style="width: 118px" class="el-dropdown__width" placement="bottom-end" slot="dropdown">
+                  <el-dropdown-item
+                    @click.native="selectMetricsLogs(item.label,item.icon)"
+                    v-for="item in searchMetrics"
+                    :key="item.value">{{item.label}}</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </el-col>
+          </el-row>
           <div class="top-tool-right">
             <button v-if="!closable" class="top-tool-btn top-tool-btn--text margin-r-10" style="cursor: pointer;" type="button" @click="split">Split</button>
             <pick-time id="explore" ref="pickTime" v-model="filterTime" :class="{'margin-r-10': showMetrics}" :refresh-data-func="expressionChange" @unitChange="chartUnitChange">
@@ -327,13 +344,17 @@ export default {
       searchMetrics: [
         {
           value: 'Metrics',
-          label: this.$t('project.metrics.metrics')
+          label: this.$t('project.metrics.metrics'),
+          icon: 'nz-icon nz-icon-Metrics'
         },
         {
           value: 'Logs',
-          label: this.$t('overall.logs')
+          label: this.$t('overall.logs'),
+          icon: 'nz-icon nz-icon-logs'
         }
       ],
+      selectValue: '',
+      selectIcon: '',
       fromData: {
         status: ''
       },
@@ -373,89 +394,6 @@ export default {
       collapseValue: ['1', '2'],
       showTab: ['1', '2'],
       logData: []
-      /*logData: [JSON.parse(`{
-          "result": [{
-            "labels": {
-              "asset": "44.53",
-              "endpoint": "192.168.44.53",
-              "filename": "/opt/cn/cn-web/logs/cn-web.log",
-              "job": "cn-log",
-              "project": "cn"
-            },
-            "level": "debug",
-            "message": "2021-07-23 03:39:01.842 [quartzScheduler_QuartzSchedulerThread] DEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggers",
-            "timestamp": 1627545412000000000,
-            "uuid": "1jqsjdjdf"
-          }, {
-            "labels": {
-              "asset": "44.53",
-              "endpoint": "192.168.44.53",
-              "filename": "/opt/cn/cn-web/logs/cn-web.log",
-              "job": "cn-log",
-              "project": "cn"
-            },
-            "level": "debug",
-            "message": "2021-07-23 03:39:01.842 [quartzScheduler_QuartzSchedulerThread] DEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggers",
-            "timestamp": 1627545412000000000,
-            "uuid": "1jqsjdjdf"
-          }, {
-            "labels": {
-              "asset": "44.53",
-              "endpoint": "192.168.44.53",
-              "filename": "/opt/cn/cn-web/logs/cn-web.log",
-              "job": "cn-log",
-              "project": "cn"
-            },
-            "level": "debug",
-            "message": "2021-07-22 03:39:01.842 [quartzScheduler_QuartzSchedulerThread] DEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggersDEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggersDEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggersDEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggersDEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggers",
-            "timestamp": 1627543512000000000,
-            "uuid": "1jqsjdjdg"
-          }, {
-            "labels": {
-              "asset": "44.53",
-              "endpoint": "192.168.44.53",
-              "filename": "/opt/cn/cn-web/logs/cn-web.log",
-              "job": "cn-log",
-              "project": "cn"
-            },
-            "level": "debug",
-            "message": "2021-07-21 03:39:01.842 [quartzScheduler_QuartzSchedulerThread] DEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggers",
-            "timestamp": 1627542512000000000,
-            "uuid": "1jqsjdjdh"
-          }, {
-            "labels": {
-              "asset": "44.53",
-              "endpoint": "192.168.44.53",
-              "filename": "/opt/cn/cn-web/logs/cn-web.log",
-              "job": "cn-log",
-              "project": "cn"
-            },
-            "level": "debug",
-            "message": "2021-07-20 03:39:01.842 [quartzScheduler_QuartzSchedulerThread] DEBUG org.quartz.core.QuartzSchedulerThread - batch acquisition of 0 triggers",
-            "timestamp": 1627502512000000000,
-            "uuid": "1jqsjdjdi"
-          }
-          ],
-          "resultType": "streamsFormat",
-          "series": [
-            {
-              "name": "debug",
-              "data": [[1588889221, 123], [1588889222, 10]]
-            }, {
-              "name": "info",
-              "data": [[1588889221, 123], [1588889222, 10]]
-            }, {
-              "name": "warn",
-              "data": [[1588889221, 123], [1588889222, 10]]
-            }, {
-              "name": "error",
-              "data": [[1588889221, 123], [1588889222, 10]]
-            }, {
-              "name": "unknown",
-              "data": [[1588889221, 123], [1588889222, 10]]
-            }
-          ]
-        }`)]*/ // 日志数据
     }
   },
   created () {
@@ -463,8 +401,30 @@ export default {
     this.queryMetrics()
     this.promqlKeys.push(getUUID())
     this.fromData.status = this.searchMetrics[0].label
+    this.selectMetricsLogs()
   },
   methods: {
+    selectMetricsLogs (val, icon) {
+      if (this.selectValue === 'Metrics') {
+        this.selectValue = val
+        this.selectIcon = icon
+        this.showMetrics = val === 'Metrics'
+        this.showIntroduce = true
+        this.resetExpression()
+      } else if (this.selectValue === 'Logs') {
+        this.selectValue = val
+        this.selectIcon = icon
+        this.showMetrics = val === 'Metrics'
+        this.showIntroduce = true
+        this.resetExpression()
+      } else {
+        this.selectValue = 'Metrics'
+        this.selectIcon = 'nz-icon nz-icon-Metrics'
+        this.showMetrics = 'Metrics'
+        this.showIntroduce = true
+        this.resetExpression()
+      }
+    },
     changeType (value) {
       this.showMetrics = value === 'Metrics'
       this.showIntroduce = true
@@ -555,9 +515,9 @@ export default {
             res = res.filter((r, i) => errorRowIndex.indexOf(i) === -1)
           }
           if (res.length > 0) {
-            this.logData = res.map(r => r.data)
+            const logData = res.map(r => r.data)
-            const hasGraph = this.logData.some(d => d.resultType === 'matrix')
+            const hasGraph = logData.some(d => d.resultType === 'matrix')
-            const hasLog = this.logData.some(d => d.resultType === 'streamsFormat')
+            const hasLog = logData.some(d => d.resultType === 'streamsFormat')
             const graphTabIndex = this.showTab.indexOf('1')
             if (hasGraph) {
               if (graphTabIndex === -1) {
@@ -571,7 +531,7 @@ export default {
             const logTabIndex = this.showTab.indexOf('2')
             if (hasLog) {
               if (logTabIndex === -1) {
-                this.showTab.push('1')
+                this.showTab.push('2')
               }
             } else {
               if (logTabIndex > -1) {
@@ -580,6 +540,7 @@ export default {
             }
             this.$nextTick(() => {
               hasGraph && this.loadLogGraph()
+              this.logData = logData
             })
           }
         }).catch(e => {
@@ -1108,6 +1069,22 @@ export default {
 
 </style>
 <style lang="scss" scoped>
+  .el-dropdown-link {
+    span:nth-of-type(1) {
+      color:  #FA901C;
+      padding-right: 10px;
+    }
+    span:nth-of-type(2) {
+      font-family: Roboto-Medium;
+      font-size: 16px;
+      color: #333333;
+      font-weight: 500;
+      padding-right: 20px;
+    }
+    span:nth-of-type(3) {
+      color: #BEBEBE;
+    }
+  }
   .explore {
     height: 100%;
     .explore-close {

nezha-fronted/src/components/page/dashboard/explore/logTab.vue

@@ -61,7 +61,7 @@
           prop="date"
           width="140"
         >
-          <template slot-scope="{ row }">{{row.date}}</template>
+          <template slot-scope="{ row }">{{utcTimeToTimezoneStr(row.date)}}</template>
         </el-table-column>
         <el-table-column
           prop="message"
@@ -221,11 +221,12 @@ export default {
           xAxis: {
             type: 'time',
             axisTick: { show: false },
+            axisLine: { show: false },
             axisLabel: {
               rotate: 0,
               fontSize: 13 * window.devicePixelRatio,
               formatter (value) {
-                return vm.$unixTimeParseToString(vm.toMillisecondTime(value) / 1000, 'hh:mm')
+                return vm.utcTimeToTimezoneStr(vm.$unixTimeParseToString(vm.toMillisecondTime(value) / 1000), 'hh:mm')
               }
             },
             boundaryGap: [0, '1%']
@@ -235,6 +236,15 @@ export default {
           },
           yAxis: {
             type: 'value',
+            splitLine: {
+              show: true
+            },
+            axisLine: {
+              show: false
+            },
+            axisTick: {
+              show: false
+            },
             axisLabel: {
               fontSize: 13 * window.devicePixelRatio,
               formatter (value, i) {

nezha-fronted/src/components/page/dashboard/panel.vue

@@ -13,7 +13,7 @@
                 <template v-slot:header>
                   <div class="panel-select-header">
                     <el-input id="panel-list-search" v-model="filterPanel" :placeholder="$t('overall.search')" clearable size="mini" style="width: 340px;"></el-input>
-                    <span id="panel-list-toadd" v-has="'panel_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="toAdd"><i class="nz-icon nz-icon-plus"></i></span>
+<!--                    <span id="panel-list-toadd" v-has="'panel_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="toAdd"><i class="nz-icon nz-icon-plus"></i></span>-->
                   </div>
                 </template>
                 <template v-slot:trigger>
@@ -21,6 +21,11 @@
                     <i slot="prefix" class="el-icon-menu"></i>
                   </el-input>
                 </template>
+                <template v-slot:tail>
+                  <div class="panel-select-tail">
+                    <span id="panel-list-toadd" v-has="'panel_add'" :title='$t("dashboard.panel.createPanelTitleSec")' class="panel-select-add" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;Add</span>
+                  </div>
+                </template>
               </select-panel>
             </div>
             <div class="top-tool-right">
@@ -904,9 +909,19 @@ export default {
     display: flex;
     justify-content: space-evenly;
     margin-bottom: 15px;
+  }
+  .panel-select-tail {
     .panel-select-add {
-      line-height: 26px;
+      line-height: 32px;
+      height: 32px;
+      display: inline-block;
       cursor: pointer;
+      i {
+        color: #FA901C;
+        font-size: 12px;
+        font-weight: bold;
+        padding-left: 20px;
+      }
     }
   }
   /* end-chart list*/