fix：修复 alertMessage 图表不显示的问题以及查看图表后分页查询带了时间参数的问题

2021-05-14 15:24:32 +08:00
parent 212cb25ad0
commit 801180443f
22 changed files with 72 additions and 44 deletions
--- a/nezha-fronted/src/components/charts/chart-alert-list.vue
+++ b/nezha-fronted/src/components/charts/chart-alert-list.vue
@@ -301,7 +301,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
--- a/nezha-fronted/src/components/charts/chart-detail.vue
+++ b/nezha-fronted/src/components/charts/chart-detail.vue
@@ -357,7 +357,7 @@ export default {
        path: this.$t('project.endpoint.path'),
        param: this.$t('project.endpoint.param'),
        state: this.$t('alert.list.state'),
-        project: this.$t('project.project.project'),
+        project: this.$t('project.project.projectName'),
        module: this.$t('project.module.module')
      }
    }
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
@@ -198,7 +198,7 @@ export default {
          disabled: false
        }, {
          id: 20,
-          name: this.$t('project.project.project'),
+          name: this.$t('project.project.projectName'),
          type: 'project',
          label: 'project',
          disabled: false
@@ -272,7 +272,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
@@ -193,7 +193,7 @@ export default {
          prop: 'id',
          show: true
        }, {
-          label: this.$t('project.project.project'),
+          label: this.$t('project.project.projectName'),
          prop: 'project',
          show: true,
          width: '120'
@@ -288,7 +288,7 @@ export default {
          readonly: true
        }, {
          id: 34,
-          name: this.$t('project.project.project'),
+          name: this.$t('project.project.projectName'),
          // name: this.$t('asset.asset'),
          type: 'input',
          label: 'projectName',
--- a/nezha-fronted/src/components/common/header.vue
+++ b/nezha-fronted/src/components/common/header.vue
@@ -253,7 +253,7 @@ export default {
      },
      createMenu: [ // 新增按钮内容
        {
-          label: this.$t('project.project.project'),
+          label: this.$t('project.project.projectName'),
          url: 'project',
          type: 1,
          permission: 'header_add_project'
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -106,7 +106,8 @@ const cn = {
    moreOption: '更多选项',
    copy: '复制',
    silence: '静默',
-    labels: '标签'
+    labels: '标签',
+    editType: '类型'
  },
  setup: {
    step0: '欢迎',
@@ -1163,7 +1164,7 @@ const cn = {
    },
    project: {
      project: '名称',
-      projectName: '系统名称',
+      projectName: '系统',
      editProject: '编辑系统',
      description: '描述',
      createProject: '新增系统'
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -111,7 +111,8 @@ const en = {
    labels: 'Labels',
    moreOption: 'More option',
    copy: 'Copy',
-    silence: 'Silence'
+    silence: 'Silence',
+    editType: 'Type'
  },
  pageSize: '/page',
  setup: {
@@ -1177,7 +1178,7 @@ const en = {
    },
    project: {
      project: 'Name', // "系统"
-      projectName: 'Project name', // "系统名称"
+      projectName: 'Project', // "系统名称"
      editProject: 'Edit project', // "编辑系统"
      description: 'Description', // "描述"
      createProject: 'New project'// "新增系统"
--- a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
+++ b/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
@@ -1884,8 +1884,14 @@ export default {
      outline: none;
    }

+    /deep/ .el-input-number:focus {
+      .el-input-number__decrease, .el-input-number__increase {
+        visibility: visible;
+        outline: none;
+      }
+    }
    /deep/ .el-input-number:focus-within {
-      /deep/ .el-input-number__decrease, /deep/ .el-input-number__increase {
+      .el-input-number__decrease, .el-input-number__increase {
        visibility: visible;
        outline: none;
      }
--- a/nezha-fronted/src/components/common/project/popData/alertTable.vue
+++ b/nezha-fronted/src/components/common/project/popData/alertTable.vue
@@ -203,7 +203,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
@@ -284,7 +284,7 @@ export default {
          disabled: false
        }, {
          id: 22,
-          name: this.$t('project.project.project'),
+          name: this.$t('project.project.projectName'),
          type: 'project',
          label: 'project',
          disabled: false
--- a/nezha-fronted/src/components/common/project/popData/assetTable.vue
+++ b/nezha-fronted/src/components/common/project/popData/assetTable.vue
@@ -130,7 +130,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
--- a/nezha-fronted/src/components/common/project/popData/endpointTable.vue
+++ b/nezha-fronted/src/components/common/project/popData/endpointTable.vue
@@ -116,7 +116,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -13,7 +13,7 @@
    <div class="right-box-form-box right-box__container" style="overflow: hidden">
      <el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules">
        <!--project-->
-        <el-form-item :label='$t("project.project.project")' prop="projectId" class="select-warp">
+        <el-form-item :label='$t("project.project.projectName")' prop="projectId" class="select-warp">
          <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project">
            <el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option>
          </el-select>
--- a/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/asset/assetBatchEditBox.vue
@@ -10,7 +10,7 @@
      <div class="container__form">
        <!-- Edit type -->
        <el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px">
-          <el-form-item :label="$t('overall.name')" prop="editType">
+          <el-form-item :label="$t('overall.editType')" prop="editType">
            <el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="value">
              <el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
            </el-select>
--- a/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/chartTempBox.vue
@@ -373,7 +373,7 @@ export default {
            disabled: false
          }, {
            id: 34,
-            name: this.$t('project.project.project'),
+            name: this.$t('project.project.projectName'),
            // name: this.$t('asset.asset'),
            type: 'input',
            label: 'projectName',
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
@@ -17,7 +17,7 @@
    <div class="right-box-form-box">
      <el-form class="right-box-form  right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm">
        <!--project-->
-        <el-form-item :label="$t('project.project.project')" prop="project.id">
+        <el-form-item :label="$t('project.project.projectName')" prop="project.id">
          <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project">
            <el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -27,7 +27,7 @@
          <el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input>
        </el-form-item>
        <!--project-->
-        <el-form-item :label='$t("project.project.project")' prop="projectId">
+        <el-form-item :label='$t("project.project.projectName")' prop="projectId">
          <el-select value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="module-box-input-project" @change="changeProject" :disabled="disabled">
            <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
@@ -121,18 +121,18 @@
            </el-form-item>
            <transition name="el-zoom-in-top">
              <div v-show="showAllBasicOption" >
-                <!--name pattern-->
-                <el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item">
-                  <!--              <el-input placeholder="" v-model=""></el-input>-->
-                  <el-autocomplete
-                    class="inline-input"
-                    size="small"
-                    id="module-box-input-pattern"
-                    v-model="editEndpoint.endpointNameTmpl"
-                    :fetch-suggestions="querySearch"
-                    placeholder="请输入内容"
-                  ></el-autocomplete>
-                </el-form-item>
+<!--                &lt;!&ndash;name pattern&ndash;&gt;-->
+<!--                <el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item">-->
+<!--                  &lt;!&ndash;              <el-input placeholder="" v-model=""></el-input>&ndash;&gt;-->
+<!--                  <el-autocomplete-->
+<!--                    class="inline-input"-->
+<!--                    size="small"-->
+<!--                    id="module-box-input-pattern"-->
+<!--                    v-model="editEndpoint.endpointNameTmpl"-->
+<!--                    :fetch-suggestions="querySearch"-->
+<!--                    placeholder="请输入内容"-->
+<!--                  ></el-autocomplete>-->
+<!--                </el-form-item>-->
                <!--scrape_interval-->
                <el-form-item :label='$t("project.endpoint.scrape_interval")' prop="scrape_interval" class="half-form-item">
                  <el-input :placeholder='$t("project.endpoint.scrape_interval_placeholder")' v-model.number="editEndpoint.configs.scrape_interval" size="small" id="module-box-input-scrape_interval">
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -122,7 +122,7 @@
                    id="module-box-input-pattern"
                    v-model="editModule.endpointNameTmpl"
                    :fetch-suggestions="querySearch"
-                    placeholder="请输入内容"
+                    :placeholder="$t('overall.placeHolder')"
                  ></el-autocomplete>
                </el-form-item>
                <!--scrape_interval-->
--- a/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertMessageTable.vue
@@ -224,7 +224,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
--- a/nezha-fronted/src/components/layout/container.vue
+++ b/nezha-fronted/src/components/layout/container.vue
@@ -20,7 +20,7 @@ export default {
  height: calc(100% - 50px);
  background-color: #f6f6f6;
  width: 100%;
-
+  padding-right: 10px;
  &>div {
    height: 100%;
  }
--- a/nezha-fronted/src/components/layout/header.vue
+++ b/nezha-fronted/src/components/layout/header.vue
@@ -79,7 +79,7 @@ export default {
      // 顶部菜单相关
      createMenu: [ // 新增按钮内容
        {
-          label: this.$t('project.project.project'),
+          label: this.$t('project.project.projectName'),
          url: 'project',
          type: 1,
          permission: 'header_add_project'
--- a/nezha-fronted/src/components/page/alert/alertMessage.vue
+++ b/nezha-fronted/src/components/page/alert/alertMessage.vue
@@ -89,7 +89,7 @@
      <div slot="title">
        {{$t("project.endpoint.dialogTitle")}}
        <div class="float-right panel-calendar dialog-tool" style="display: flex">
-          <pick-time v-model="searchTime" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
+          <pick-time v-model="searchTimeDialog" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
        </div>
      </div>
      <chart ref="messageChart" :unit="chartUnit" name="alertMessageChart"></chart>
@@ -132,6 +132,7 @@ export default {
      sameLabels: ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter'],
      legend: [],
      searchTime: [],
+      searchTimeDialog: [],
      searchTimeSelect: bus.getTimezontDateRange(),
      currentMsg: {},
      chartUnit: 5,
@@ -193,7 +194,7 @@ export default {
      return (key, value) => {
        if (key == 'type') {
          if (value == 1) {
-            value = this.$t('project.project.project')
+            value = this.$t('project.project.projectName')
          } else if (value == 2) {
            value = this.$t('module.module.module')
          } else if (value == 3) {
@@ -247,7 +248,7 @@ export default {
      // const end = this.searchTime[1] ? this.searchTime[1] : getTime(0, 'h')
      const start = this.currentMsg.startAt
      const end = this.currentMsg.endAt
-      this.searchTime = [start, end]
+      this.searchTimeDialog = [start, end]
      const timeDiff = (new Date(end).getTime() - new Date(start).getTime()) / 1000 / (24 * 60 * 60)
      let step = '15s'
      if (timeDiff < 1) {
@@ -323,7 +324,7 @@ export default {
                    chartData.name += '}'
                    const legend = {
                      name: chartData.name,
-                      alias: alias,
+                      alias: chartData.name,
                      isGray: false
                    }
                    this.legend.push(legend)
@@ -344,7 +345,7 @@ export default {
              this.$refs.messageChart.endLoading()
            })
          } catch (err) {
-            this.$message.error(err)
+            // this.$message.error(err)
            this.$refs.messageChart.endLoading()
          }
        })
@@ -584,8 +585,27 @@ export default {
        this.$refs.dataTable.$refs.dataTable.bodyWrapper.scrollTop = 0
      }
      this.getTableData()
+    },
+    computeDistance (str) {
+      let width = 0
+      const html = document.createElement('span')
+      html.innerText = str
+      html.className = 'getTextWidth'
+      document.querySelector('body').appendChild(html)
+      width = document.querySelector('.getTextWidth').offsetWidth
+      document.querySelector('.getTextWidth').remove()
+      return Number('-' + (width + 5))
+    },
+    returnMarkArea () {
+      if (this.currentMsg) {
+        if (this.currentMsg.alertRule.operator == '>' || this.currentMsg.alertRule.operator == '>=') {
+          return [{ yAxis: this.currentMsg.alertRule.threshold }, {}]
+        } else {
+          return [{}, { yAxis: this.currentMsg.alertRule.threshold }]
        }
      }
+    },
+  }
 }
 </script>

--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -1,7 +1,7 @@
 <template>
  <div class="panel list-page">
    <div class="main-list">
-      <div class="main-container">
+      <div class="main-container" style="padding-right: 0">
        <div class="top-tools">
          <div v-if="panelData.length == 0" class="top-tool-left" style="margin-left: 10px;">
            <button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button>