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

# Conflicts: # nezha-fronted/src/components/common/alert/alertLabel.vue # nezha-fronted/src/components/common/table/settings/userTable.vue
2022-06-24 16:34:40 +08:00
parent 4528a5dfec 04bb80d37c
commit f47ceb5ab4
4 changed files with 115 additions and 42 deletions
--- a/nezha-fronted/package-lock.json
+++ b/nezha-fronted/package-lock.json
@@ -3986,6 +3986,16 @@
      "integrity": "sha512-1QL4544moEsDVH9T/l6Cemov/37iv1RtoKf7NJ04A60+4MREXNfx/QvavbH6QoGdsD4N4Mwy49cmaINR/o2mdg==",
      "dev": true
    },
+    "clipboard": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.11.tgz",
+      "integrity": "sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==",
+      "requires": {
+        "good-listener": "^1.2.2",
+        "select": "^1.1.2",
+        "tiny-emitter": "^2.0.0"
+      }
+    },
    "cliui": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
@@ -6121,6 +6131,11 @@
      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
    },
+    "delegate": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
+      "integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
+    },
    "delegates": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
@@ -8428,6 +8443,14 @@
        "minimatch": "~3.0.2"
      }
    },
+    "good-listener": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
+      "integrity": "sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==",
+      "requires": {
+        "delegate": "^3.1.2"
+      }
+    },
    "got": {
      "version": "8.3.2",
      "resolved": "https://registry.npmjs.org/got/-/got-8.3.2.tgz",
@@ -16336,6 +16359,11 @@
        }
      }
    },
+    "select": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
+      "integrity": "sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA=="
+    },
    "select-hose": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -17807,6 +17835,11 @@
      "integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
      "dev": true
    },
+    "tiny-emitter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
+      "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
+    },
    "tinycolor2": {
      "version": "1.4.2",
      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz",
@@ -18486,6 +18519,14 @@
      "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
      "integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ=="
    },
+    "vue-clipboard2": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/vue-clipboard2/-/vue-clipboard2-0.3.3.tgz",
+      "integrity": "sha512-aNWXIL2DKgJyY/1OOeITwAQz1fHaCIGvUFHf9h8UcoQBG5a74MkdhS/xqoYe7DNZdQmZRL+TAdIbtUs9OyVjbw==",
+      "requires": {
+        "clipboard": "^2.0.0"
+      }
+    },
    "vue-color": {
      "version": "2.8.1",
      "resolved": "https://registry.npmjs.org/vue-color/-/vue-color-2.8.1.tgz",
--- a/nezha-fronted/src/assets/css/components/common/rightBox/panelBox.scss
+++ b/nezha-fronted/src/assets/css/components/common/rightBox/panelBox.scss
@@ -1,10 +1,17 @@
 .right-box-panel{
+  .item-report{
+    .form__sub-title{
+      margin-bottom: 5px;
+    }
+  }
  .item-receivers{
    .el-select.el-select--small{
      width: 100%;
    }
    .item-receivers-text{
+      font-size: 12px;
      color: $--color-text-secondary;
+      padding-left: 5px;
    }
  }
    .el-input--suffix.el-date-editor--datetime .el-input__inner{
@@ -51,6 +58,9 @@
            }
          }
        }
+    .el-checkbox-button.is-checked{
+      border: 1px solid #fbb569 !important;
+    }
        
    .el-checkbox-button.is-checked .el-checkbox-button__inner {
      color: #fff;
@@ -64,8 +74,16 @@
          height: 41px;
          .el-radio-group{
            height: 100%;
-            border-left: 1px solid $--border-color-light;
+            .el-radio-button{
+              border: 1px solid $--border-color-light;
+              margin-right: -1px;
+            }
+            .el-radio-button.is-active{
+              border: 1px solid #fbb569 !important;
+              border-radius: 0;
+            }
            .el-radio-button__inner{
+              border: 0;
              height: 100%;
              line-height: 1.5;
              font-size: 14px;
@@ -76,6 +94,7 @@
            height: 100%;
            .el-checkbox-button{
              margin-right: -2px;
+              width: calc(100% / 6.9) !important;
              .el-checkbox-button__inner{
                background-color: $--background-color-empty;
                border:1px solid $--border-color-light;
@@ -101,6 +120,7 @@
      }
      .form-tabs{
        width: 100%;
+        margin-bottom: 0 !important;
        .el-tabs__nav{
          display: flex;
          .el-tabs__item{
@@ -126,7 +146,6 @@
 }
      
  .el-form-item__content{
-    text-align: unset !important;
    .el-checkbox-button{
      width: calc(100% / 7) !important;
      .el-checkbox-button__inner{
--- a/nezha-fronted/src/components/common/rightBox/panelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/panelBox.vue
@@ -40,7 +40,7 @@
            </el-form-item>
          <!--   Report  -->
          <div>
-            <el-form-item >
+            <el-form-item class="item-report">
            <div class="form__sub-title">
              <span>{{$t('dashboard.panel.report')}}</span>
              <el-switch v-model="editPanel.param.report.enable" size="small"></el-switch>
@@ -264,17 +264,6 @@ export default {
    this.dateFormatStr = 'YYYY-MM-DD HH:mm:ss'
    if (this.editPanel.id) {
      this.isShow = Number(this.editPanel.param.report.schedule.type)
-      this.editPanel.param.report.schedule.type = this.editPanel.param.report.schedule.type + ''
-      if (this.editPanel.param.report.schedule.stime !== '') {
-        this.editPanel.param.report.schedule.stime = this.utcTimeToTimezoneStr(this.editPanel.param.report.schedule.stime)
-      } else {
-        this.editPanel.param.report.schedule.stime = ''
-      }
-      if (this.editPanel.param.report.schedule.etime !== '') {
-        this.editPanel.param.report.schedule.etime = this.utcTimeToTimezoneStr(this.editPanel.param.report.schedule.etime)
-      } else {
-        this.editPanel.param.report.schedule.etime = ''
-      }
    }
  },
  mounted () {
@@ -327,8 +316,8 @@ export default {
              type: Number(this.editPanel.param.report.schedule.type),
              repeat: this.editPanel.param.report.schedule.repeat ? this.editPanel.param.report.schedule.repeat : 1,
              nums: this.editPanel.param.report.schedule.nums,
-              stime: this.editPanel.param.report.schedule.stime !== '' ? this.timezoneToUtcTimeStr(this.editPanel.param.report.schedule.stime) : this.editPanel.param.report.schedule.stime,
-              etime: this.editPanel.param.report.schedule.etime !== '' ? this.timezoneToUtcTimeStr(this.editPanel.param.report.schedule.etime) : this.editPanel.param.report.schedule.etime
+              stime: this.editPanel.param.report.schedule.stime !== '' ? this.timezoneToUtcTimeStr(this.editPanel.param.report.schedule.stime, 'YYYY-MM-DD HH:mm:ss') : this.editPanel.param.report.schedule.stime,
+              etime: this.editPanel.param.report.schedule.etime !== '' ? this.timezoneToUtcTimeStr(this.editPanel.param.report.schedule.etime, 'YYYY-MM-DD HH:mm:ss') : this.editPanel.param.report.schedule.etime
            },
            receivers: this.editPanel.param.report.receivers
          },
@@ -404,15 +393,21 @@ export default {
    'editPanel.param.report.schedule.stime': {
      deep: true,
      handler (n) {
-        this.editPanel.param.report.schedule.stime = bus
-          .timeFormate(new Date(n), 'YYYY-MM-DD HH:mm:ss')
+        const startTime = this.$loadsh.get(this.editPanel, 'param.report.schedule.stime', '')
+        if (startTime !== '') {
+          this.editPanel.param.report.schedule.stime = bus
+            .timeFormate(new Date(n), 'YYYY-MM-DD HH:mm:ss')
+        }
      }
    },
    'editPanel.param.report.schedule.etime': {
      deep: true,
      handler (n) {
-        this.editPanel.param.report.schedule.etime = bus
-          .timeFormate(new Date(n), 'YYYY-MM-DD HH:mm:ss')
+        const endTime = this.$loadsh.get(this.editPanel, 'param.report.schedule.etime', '')
+        if (endTime !== '') {
+          this.editPanel.param.report.schedule.etime = bus
+            .timeFormate(new Date(n), 'YYYY-MM-DD HH:mm:ss')
+        }
      }
    }
  }
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -391,30 +391,48 @@ export default {
      })
    },
    edit (u) {
-      this.panel = Object.assign({}, u)
-      if (!this.panel.param.report) {
-        this.panel = {
-          ...u,
-          param: {
-            report: {
-              enable: false,
-              range: {
-                unit: ''
-              },
-              schedule: {
-                type: '0',
-                repeat: 1,
-                nums: [],
-                stime: '',
-                etime: ''
-              },
-              receivers: []
-            },
-            chartShare: 'none'
+      this.$get('visual/panel?ids=' + u.id).then(res => {
+        if (res.code === 200) {
+          this.panel = res.data.list[0]
+          if (!this.panel.param.report) {
+            this.panel = {
+              ...this.panel,
+              param: {
+                report: {
+                  enable: false,
+                  range: {
+                    unit: ''
+                  },
+                  schedule: {
+                    type: '0',
+                    repeat: 1,
+                    nums: [],
+                    stime: '',
+                    etime: ''
+                  },
+                  receivers: []
+                },
+                chartShare: 'none'
+              }
+            }
          }
+          this.panel.param.report.schedule.type = this.panel.param.report.schedule.type + ''
+          const startTime = this.$loadsh.get(this.panel, 'param.report.schedule.stime', '')
+          if (startTime !== '') {
+            this.panel.param.report.schedule.stime = this.utcTimeToTimezoneStr(this.panel.param.report.schedule.stime, 'YYYY-MM-DD HH:mm:ss')
+          } else {
+            this.panel.param.report.schedule.stime = ''
+          }
+          const endTime = this.$loadsh.get(this.panel, 'param.report.schedule.etime', '')
+          if (endTime !== '') {
+            this.panel.param.report.schedule.etime = this.utcTimeToTimezoneStr(this.panel.param.report.schedule.etime, 'YYYY-MM-DD HH:mm:ss')
+          } else {
+            this.panel.param.report.schedule.etime = ''
+          }
+          this.rightBox.panel.show = true
        }
-      }
-      this.rightBox.panel.show = true
+      })
+      // this.panel = Object.assign({}, u)
    },
    toAdd () {
      if (!this.hasButton('panel_view')) {