fix: 恢复project修改，修复overview/asset接口

2021-04-30 11:45:22 +08:00
parent 66409db79f
commit 3f348e3624
9 changed files with 654 additions and 635 deletions
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTabNew.vue
@@ -43,6 +43,7 @@ import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
 import axios from 'axios'
 import bus from '@/libs/bus'
 import alertMessageTable from '@/components/common/table/alert/alertMessageTable.vue'
+import { fromRoute } from '@/components/common/js/constants'
 // import {getTime} from "@/components/common/js/tools";
 // import chartDataFormat from "@/components/charts/chartDataFormat";

@@ -293,14 +294,16 @@ export default {
        delete this.searchLabel.endAt
      }
      this.tools.loading = true
-      if (this.targetTab === 'moduleAlertMessage') {
+      if (this.from === fromRoute.module) {
        this.searchLabel.moduleIds = this.obj.id
-      } else {
+      } else if (this.from === fromRoute.endpoint) {
        this.searchLabel.endpointIds = this.obj.id
+      } else if (this.from === fromRoute.asset) {
+        this.searchLabel.assetIds = this.obj.id
      }
      this.$get(this.url, this.searchLabel).then(response => {
        this.tools.loading = false
-        if (response.code == 200) {
+        if (response.code === 200) {
          this.nowTime = this.utcTimeToTimezoneStr(response.time)
          this.tableData = response.data.list
          const axiosAll = []
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTabNew.vue
@@ -43,6 +43,7 @@ import subDataListMixin from '@/components/common/mixin/subDataList'
 import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
 import endpointTable from '@/components/common/table/settings/endpointTable'
 import EditEndpointBoxNew from '@/components/common/rightBox/editEndpointBoxNew'
+import {fromRoute} from "@/components/common/js/constants";

 export default {
  name: 'terminalLogTab',
@@ -56,7 +57,6 @@ export default {
    obj: {
      immediate: true,
      handler (n) {
-        console.log(n)
        if (n) {
          this.getTableData()
        }
@@ -99,7 +99,11 @@ export default {
        pageNo: this.pageObj.pageNo,
        pageSize: this.pageObj.pageSize
      }
+      if (this.from === fromRoute.module) {
        params.moduleIds = this.obj.id
+      } else if (this.from === fromRoute.asset) {
+        params.assetIds = this.obj.id
+      }
      this.$get(this.url, params).then(response => {
        this.tools.loading = false
        if (response.code === 200) {
--- a/nezha-fronted/src/components/common/project/topologyL5.vue
+++ b/nezha-fronted/src/components/common/project/topologyL5.vue
@@ -1,12 +1,12 @@
 <style>
-  @import "./L5/css/iconfont.css";
-  @import "./L5/css/props.css";
+@import "./L5/css/iconfont.css";
+@import "./L5/css/props.css";
 </style>
 <template>
  <div class="project-box list-page" v-loading="topologyLoading" v-has="'topo_list'">
-    <div class="main-list">
-      <div class="main-container">
-        <div v-if="editTopologyFlag" class="edit-topologyLine" style="padding-left: 20px;width: calc(100% - 20px);position: absolute;top: 9px;padding-right: 20px">
+    <!--project主要信息-->
+    <div v-if="showTopTools&&!fromOverView" :style="{'background':editTopologyFlag?'#F6F6F6':'#ffffff','border-bottom':editTopologyFlag? '1px solid #F6F6F6':'' }" class="project-title">
+      <div v-show="editTopologyFlag" class="edit-topologyLine" style="padding-left: 20px;width: calc(100% - 20px);position: absolute;top: 9px;padding-right: 20px">
        <!--工具栏-->
        <span class="project-topology-tool">
          <el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'">
@@ -110,9 +110,19 @@
           </button>
         </span>
      </div>
-        <div v-if="!editTopologyFlag&&!fromOverView" class="top-tools">
+      <div v-if="!editTopologyFlag&&!fromOverView" class="top-tool-main-right top-tools" style="width: 100%;display: flex;justify-content: space-between;padding-left: 10px;padding-top: 10px">
        <div>{{topologyInfo.name}}</div>
-          <div v-if="!editTopologyFlag&&!fromPrev&&!fromOverView" class="top-tool-right">
+        <span v-show="!editTopologyFlag&&!fromPrev&&!fromOverView" class="edit-topologyLine" style="padding-top: 5px">
+<button class="top-tool-btn float-right" style="border-right: 1px solid rgba(162,162,162,0.50);margin-right: 12px;"
+        type="button" @click="changeScreen"
+>
+                  <i :class="topoScreen?'nz-icon-exit-full-screen':'nz-icon-full-screen'" class="nz-icon"></i>
+        </button>
+        <button v-has="'project_topo_update'" class="top-tool-btn float-right"
+                style="border-right: 1px solid rgba(162,162,162,0.50);margin-right: 12px;" type="button" @click="editTopology"
+        >
+                  <i :title="$t('project.topology.edit')" class="nz-icon nz-icon-edit"></i>
+        </button>
          <pick-time
            v-show="!editTopologyFlag"
            ref="pickTime"
@@ -120,37 +130,10 @@
            :refresh-data-func="dateChange"
            :showTimePicker="false"
            :use-chart-unit="false"
-              class="pickTime margin-r-10">
+            class="float-right pickTime top-tool-btn-group">
          </pick-time>
-            <button v-has="'project_topo_update'" class="top-tool-btn margin-r-10" type="button" @click="editTopology">
-              <i :title="$t('project.topology.edit')" class="nz-icon nz-icon-edit"></i>
-            </button>
-            <button class="top-tool-btn" type="button" @click="changeScreen">
-              <i :class="topoScreen?'nz-icon-exit-full-screen':'nz-icon-full-screen'" class="nz-icon"></i>
-            </button>
-          </div>
-        </div>
-        <div class="nz-table2">
-          <!--悬浮network部分-->
-          <div class="network-info">
-            <div v-if="popDataShow.main">
-              <popDataMain :moduleId="moduleId" :projectId="projectInfo.id"></popDataMain>
-            </div>
-            <div v-if="popDataShow.info">
-              <popDataInfo :moduleId="moduleId" :projectId="projectInfo.id"></popDataInfo>
-            </div>
-          </div>
-          <!--endpoint-->
-          <transition name="right-box">
-            <endpointTable v-if="popDataShow.endpoint" :moduleId="moduleId" :projectId="projectInfo.id"
-                           @close="popDataShowUpdate('',true)">endpoint
-            </endpointTable>
-          </transition>
-          <div v-if="!fromOverView&&!editTopologyFlag&&!fromPrev" class="right-bottom-zoom">
-            <div class="zoom-option" style="border-bottom: 1px solid #c5c8cb;" @click="zoomMap(0.25)"><span><i class="nz-icon nz-icon-enlarge"></i></span></div>
-            <div class="zoom-option" @click="zoomMap(-0.25)"><span><i class="nz-icon nz-icon-narrow"></i></span></div>
-          </div>
-        </div>
+
+      </span>
      </div>
    </div>
    <div :class="['page',fromOverView?'overview-page':'']" :style="{'border':fromOverView?'none':'1px solid #eeeeee'}">
@@ -233,6 +216,21 @@
    <!--<li>3.选中元素 按下Delete键或者Backspace可以删除元素</li>-->
    <!--</ul>-->
    <!--</div>-->
+    <!--悬浮network部分-->
+    <div class="network-info">
+      <div v-if="popDataShow.main">
+        <popDataMain :moduleId="moduleId" :projectId="projectInfo.id"></popDataMain>
+      </div>
+      <div v-if="popDataShow.info">
+        <popDataInfo :moduleId="moduleId" :projectId="projectInfo.id"></popDataInfo>
+      </div>
+    </div>
+    <!--endpoint-->
+    <transition name="right-box">
+      <endpointTable v-if="popDataShow.endpoint" :moduleId="moduleId" :projectId="projectInfo.id"
+                     @close="popDataShowUpdate('',true)">endpoint
+      </endpointTable>
+    </transition>
    <!--asset-->
    <transition name="right-box">
      <assetTable v-if="popDataShow.asset" :moduleId="moduleId" :projectId="projectInfo.id"
@@ -324,6 +322,10 @@
      </div>

    </el-dialog>
+    <div v-if="!fromOverView&&!editTopologyFlag&&!fromPrev" class="right-bottom-zoom">
+      <div class="zoom-option" style="border-bottom: 1px solid #c5c8cb;" @click="zoomMap(0.25)"><span><i class="nz-icon nz-icon-enlarge"></i></span></div>
+      <div class="zoom-option" @click="zoomMap(-0.25)"><span><i class="nz-icon nz-icon-narrow"></i></span></div>
+    </div>
  </div>
 </template>

@@ -1547,6 +1549,7 @@ export default {
    upload () {
      const form = new FormData()
      form.append('file', this.file)
+      console.log(this.file)
      if (this.uploadPic.name) {
        form.append('name', this.uploadPic.name)
      } else {
@@ -1559,7 +1562,7 @@ export default {
        if (res.code == 200) {
          this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
          this.uploadPicShow = false
-          this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data,header) => {
+          this.dealImg(`monitor/project/topo/icon/${res.data.id}/0`).then((data,header) => {
            const group = this.tools.find(tool => tool.group === this.uploadPic.unit)
            if (group) {
              group.children.push({
@@ -1615,7 +1618,7 @@ export default {
          res.data.list.forEach((item, index) => {
            item.imageName = item.name
            delete item.name
-            promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`))
+            promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/0`))
            imgArr.push({ ...item })
          })
          Promise.all(promiseArr).then((res2,header) => {
@@ -1659,7 +1662,7 @@ export default {
        const promiseArr = []
        imgidList.forEach((item, index) => {
          if (item.data.imageId) {
-            promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`))
+            promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/0`))
          } else {
            promiseArr.push('')
          }
@@ -1685,10 +1688,13 @@ export default {
      if (url) {
        return new Promise((resolve, reject) => {
          this.$axios
-            .get(url)
-            .then((res) => {
+            .get(url, {
+              responseType: 'arraybuffer'
+            })
+            .then((res, resHeader) => {
              return {
-                data: ('data:image/jpeg;base64,' + res.data),
+                data: ('data:image/jpeg;base64,' + btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), ''))),
+                header: resHeader
              }
            })
            .then(data => {
@@ -2032,7 +2038,7 @@ export default {
 }
 </script>
 <style lang="scss">
-  .el-dropdown-menu {
+.el-dropdown-menu {
  .project-topology-add-node {
    .el-collapse-item__header {
      padding: 0 10px;
@@ -2174,10 +2180,10 @@ export default {
  .avatar-uploader:active .el-upload--picture-card:hover, .avatar-uploader:active .el-upload:focus {
    color: #DB8B8B;
  }
-  }
+}
 </style>
 <style lang="scss" scoped>
-  .project-box{
+.project-box{
  @keyframes model-error-animation {
    0% {
      transform: scale(0.7);
@@ -2446,13 +2452,13 @@ export default {
  .align--center{
    text-align: center;
  }
-  }
-  .project-topology-tool {
+}
+.project-topology-tool {
  display: inline-flex;
  height: 30px;
-  }
+}

-  .el-dropdown-title {
+.el-dropdown-title {
  background: #FFFFFF;
  border: 1px solid $--primary-border-color;
  border-radius: 2px;
@@ -2464,10 +2470,12 @@ export default {
  .icon-cube {
    margin-left: 15px;
  }
-  }
+}

-  .project-box {
+.project-box {
  width: 100%;
+  height: calc(100% - 20px);
+  margin-top: 10px;
  position: relative;
  border-radius: 2px;
  overflow: hidden;
@@ -2491,9 +2499,9 @@ export default {
    left: 10px;
    bottom: 10px;
  }
-  }
+}

-  .page {
+.page {
  display: flex;
  height: calc(100% - 65px);
  width: calc(100% - 10px);
@@ -2531,49 +2539,49 @@ export default {
    box-shadow: inset 1px 0 0 0 rgba(0, 0, 0, 0.09);
    border-radius: 0px;
  }
-  }
-  .overview-page{
+}
+.overview-page{
  height: 100%;
-  }
-  .special-select svg {
+}
+.special-select svg {
  width: 75px;
  height: 30px;
-  }
+}

-  .special-select .el-select.el-select--small {
+.special-select .el-select.el-select--small {
  width: 100%;
-  }
+}

-  .special-select /deep/ .el-select-dropdown {
+.special-select /deep/ .el-select-dropdown {
  width: 130px !important;

  .el-select-dropdown__item {
    padding: 0 0 0 10px;
  }
-  }
+}

-  .special-select /deep/ .el-input.el-input--prefix.el-input--suffix, .line-width /deep/ .el-input.el-input--prefix.el-input--suffix {
+.special-select /deep/ .el-input.el-input--prefix.el-input--suffix, .line-width /deep/ .el-input.el-input--prefix.el-input--suffix {
  border: 1px solid #DCDFE6;
  height: 28px;
-  }
+}

-  .special-select /deep/ .el-input__inner, .line-width /deep/ .el-input__inner {
+.special-select /deep/ .el-input__inner, .line-width /deep/ .el-input__inner {
  display: none;
-  }
+}

-  .special-select /deep/ .el-input__prefix, .line-width /deep/ .el-input__prefix {
+.special-select /deep/ .el-input__prefix, .line-width /deep/ .el-input__prefix {
  height: 28px;
  line-height: 28px;
  color: #899FB7;
  width: 100%;
-  }
+}

-  .special-select /deep/ .el-input__prefix > div {
+.special-select /deep/ .el-input__prefix > div {
  width: 100%;
  height: 100%;
-  }
+}

-  .upload-pic-row{
+.upload-pic-row{
  width: 420px;
  margin-bottom: 10px;
  .upload-pic-label{
@@ -2592,8 +2600,8 @@ export default {
      width: 100%;
    }
  }
-  }
-  .upload-pic-box{
+}
+.upload-pic-box{
  width: 284px;
  height: 30px;
  text-align: center;
@@ -2605,8 +2613,8 @@ export default {
  .el-icon-plus{
    color: #FA901C;
  }
-  }
-  .top-tool-btn{
+}
+.top-tool-btn{
  height: 32px;
  width: 32px;
  border: 1px solid $--primary-border-color;
@@ -2616,15 +2624,15 @@ export default {
  -webkit-transition: background-color linear .1s;
  transition: background-color linear .1s;
  padding: 0;
-  }
-  .top-tool-btn:hover{
+}
+.top-tool-btn:hover{
  background-color: #fff;
-  }
-  .top-tool-btn:focus{
+}
+.top-tool-btn:focus{
  background-color: #fff;
  border-color: #FBCEA4;
-  }
-  .top-tool-btn:focus .nz-icon{
+}
+.top-tool-btn:focus .nz-icon{
  color: #FBCEA4;
-  }
+}
 </style>
--- a/nezha-fronted/src/components/page/dashboard/overview/overview.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview.vue
@@ -96,7 +96,7 @@
              </el-tooltip>
              <div class="content-col-content-title">{{$t("overall.alert")}}</div>
            </div>
-            <div class="content-alert-num">{{$t("dashboard.overview.alert.ruleNum")}}&nbsp;:&nbsp;{{(alertRuleData ? alertRuleData.alertRuleTotal : "") | numberFormat}}</div>
+            <div class="content-alert-num">{{$t("dashboard.overview.alert.ruleNum")}}&nbsp;:&nbsp;{{(alertRuleData ? alertRuleData : "") | numberFormat}}</div>
          </div>
        </div>
      </div>
@@ -222,7 +222,7 @@ export default {
      endpointData: { num: 0 },
      alertMessageLoading: false,
      alertMessageData: { num: 0 },
-      alertRuleData: [],
+      alertRuleData: 0,
      map: null,
      allProject: [],

@@ -605,7 +605,9 @@ export default {
      return new Promise(resolve => {
        this.$get('stat/alertRule/total').then(response => {
          if (response.code === 200) {
-            this.alertRuleData = response.data
+            response.data.list.forEach(d => {
+              this.alertRuleData += d.num
+            })
          }
          resolve()
        })
--- a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
+++ b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
@@ -1,17 +1,18 @@
 <template>
-  <div class="endpoint-list" v-has="'endpoint_list'">
+  <div>
    <nz-data-list
      ref="dataList"
      :api="url"
-      :tableId="tableId"
-      class="dataList"
      :custom-table-title.sync="tools.customTableTitle"
      :from="fromRoute.endpoint"
-      :layout="['searchInput', 'elementSet']"
-      :hasSearch="true"
+      :layout="dataListLayout"
+      :search-msg="searchMsg"
      @search="search"
-      :search-msg="searchMsg">
+    >
      <template v-slot:top-tool-right>
+        <button id="asset-filter" :class="{ 'is-focus': dataListLayout.indexOf('clickSearch') > -1 }" class="top-tool-btn margin-r-10" @click.stop="showClickSearch">
+          <i class="nz-icon nz-icon-funnel"></i>
+        </button>
        <export-excel
          id="expression-template-list"
          v-has="''"
@@ -24,7 +25,7 @@
          class="top-tool-export margin-r-10"
        >
          <template slot="optionZone">
-            <button id="account-add" v-has="'monitor_endpoint_add'" class="top-tool-btn margin-l-20"
+            <button id="account-add" v-has="'monitor_endpoint_add'" class="top-tool-btn"
                    type="button" @click="add">
              <i class="nz-icon-create-square nz-icon"></i>
            </button>
@@ -45,7 +46,7 @@
          v-loading="slotProps.loading"
          :api="url"
          :custom-table-title="tools.customTableTitle"
-          :height="searchTableHeight"
+          :height="dataListLayout.indexOf('clickSearch') > -1 ? endpointTableHeight : mainTableHeight"
          :table-data="tableData"
          :tableId="tableId"
          @del="del"
@@ -106,6 +107,8 @@ export default {
      blankObject: {}, // 新增/编辑的endpoint
      tableId: 'endpointTable',
      queryPermission: 'account_view',
+      endpointTableHeight: 'calc(100% - 193px)', // 主列表table高度
+      dataListLayout: ['searchInput', 'elementSet'],
      searchMsg: { // 给搜索框子组件传递的信息
        zheze_none: true,
        searchLabelList: [{
@@ -354,7 +357,4 @@ export default {
    flex: 1;
    width: 100%;
  }
-  /deep/ .nz-btn-disabled {
-    opacity: 0.5;
-  }
 </style>
--- a/nezha-fronted/src/components/page/monitor/module/moduleList.vue
+++ b/nezha-fronted/src/components/page/monitor/module/moduleList.vue
@@ -7,7 +7,9 @@
      :custom-table-title.sync="tools.customTableTitle"
      :from="fromRoute.module"
      :layout="['searchInput', 'elementSet']"
-      :search-msg="searchMsg">
+      :search-msg="searchMsg"
+      @search="search"
+    >
      <template v-slot:top-tool-right>
        <export-excel
          id="expression-template-list"
@@ -21,7 +23,7 @@
          class="top-tool-export margin-r-10"
        >
          <template slot="optionZone">
-            <button id="account-add" v-has="'monitor_module_add'" :title="$t('overall.createUser')" class="top-tool-btn margin-l-20"
+            <button id="account-add" v-has="'monitor_module_add'" :title="$t('overall.createUser')" class="top-tool-btn"
                    type="button" @click="add">
              <i class="nz-icon-create-square nz-icon"></i>
            </button>
--- a/nezha-fronted/src/components/page/monitor/project/project.vue
+++ b/nezha-fronted/src/components/page/monitor/project/project.vue
@@ -25,9 +25,7 @@
 </style>
 <template>
  <div class="project">
-    <template>
-      <topologyL5 :obj="currentProject" targetTab.sync="panel" ref="facade" :topologyIndexF="topologyIndexF" v-if="reloadFacade" @changeTopologyIndexF="changeTopologyIndexF" v-has="'topo_list'"/>
-    </template>
+    <topologyL5 v-if="reloadFacade" ref="facade" v-has="'topo_list'" :obj="currentProject" :topologyIndexF="topologyIndexF" targetTab.sync="panel" @changeTopologyIndexF="changeTopologyIndexF"/>

    <transition name="el-zoom-in-bottom">
      <bottom-box v-if="bottomBox.showSubList"
--- a/nezha-fronted/src/components/page/monitor/project/projectList.vue
+++ b/nezha-fronted/src/components/page/monitor/project/projectList.vue
@@ -7,9 +7,11 @@
      :custom-table-title.sync="tools.customTableTitle"
      :from="fromRoute.project"
      :layout="['searchInput', 'elementSet']"
-      :search-msg="searchMsg">
+      :search-msg="searchMsg"
+      @search="search"
+    >
      <template v-slot:top-tool-right>
-        <button id="account-add" v-has="'project_add'" :title="$t('overall.createUser')" class="top-tool-btn margin-l-20 margin-r-10"
+        <button id="account-add" v-has="'project_add'" :title="$t('overall.createUser')" class="top-tool-btn margin-r-10"
                type="button" @click="add">
          <i class="nz-icon-create-square nz-icon"></i>
        </button>