NEZ-3157 feat：时间选择器 支持选择今天 （00:00:00 - now）

nezha-fronted/src/assets/css/components/common/timePicker.scss

@@ -267,6 +267,10 @@
     display: flex;
     flex-direction: column;
     overflow: hidden;
+    .date-range-item {
+      height: 353px;
+      overflow-y: auto;
+    }
     ul {
       flex: 1;
       padding: 0;
@@ -312,8 +316,10 @@
 @media (max-height: 900px) {
   .date-range-panel {
     .date-range-panel-content-right {
-      height: 180px;
+      .date-range-item {
-      overflow-y: auto;
+        height: 180px;
+        overflow-y: auto;
+      }
     }
     .date-range-panel-content-left {
       height: 180px;

nezha-fronted/src/components/chart/panelChart.vue

@@ -203,6 +203,7 @@ export default {
       // TODO assetInfo、endpointInfo、echarts等进行不同的处理
       let startTime = ''
       let endTime = ''
+      // todo 刷新 需要判断是否是相对时间
       if (isRefresh) { // 刷新则视情况更新时间范围
         const now = new Date(bus.computeTimezone(new Date().getTime()))
         const origin = new Date(bus.timeFormate(bus.formateTimeToTime(this.timeRange[1]), 'YYYY-MM-DD HH:mm:ss'))

nezha-fronted/src/components/common/bottomBox/tabs/dashboardTab.vue

@@ -621,7 +621,7 @@ export default {
       if (this.$refs.pickTime) {
         const nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
         this.nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
-        this.setSearchTime(nowTimeType.type, nowTimeType.value)
+        this.setSearchTime('searchTime', this.storeDispatchPanelTime)
         this.filter.dashboardId = this.showPanel.id
         this.getData(this.filter)
         this.$store.dispatch('dispatchPanelTime', {
@@ -635,27 +635,7 @@ export default {
       }
     },
     /* 时间条件查询--end */
-    setSearchTime (type, val) { // 设置searchTime
+    storeDispatchPanelTime () { // 设置searchTime
-      if (type === 'minute') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setMinutes(new Date(bus.computeTimezone(new Date().getTime())).getMinutes() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'm')
-      } else if (type === 'hour') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setHours(new Date(bus.computeTimezone(new Date().getTime())).getHours() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'h')
-      } else if (type === 'date') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setDate(new Date(bus.computeTimezone(new Date().getTime())).getDate() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'd')
-      }
-      this.$refs.pickTime.$refs.timePicker.searchTime = this.searchTime
       this.$store.dispatch('dispatchPanelTime', {
         time: this.searchTime,
         nowTimeType: this.nowTimeType
@@ -908,7 +888,7 @@ export default {
         this.nowTimeType = this.$lodash.cloneDeep(nowTimeType)
         // 刷新时间范围
         this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('searchTime', this.storeDispatchPanelTime)
         this.$store.dispatch('dispatchPanelTime', {
           time: this.searchTime,
           nowTimeType: this.nowTimeType
@@ -927,7 +907,7 @@ export default {
         const nowTimeType = this.nowTimeType = this.timePickerRange.nowTimeType
         this.searchTime = this.timePickerRange.time
         this.$refs.pickTime && this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType, this.searchTime)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('searchTime', this.storeDispatchPanelTime)
       })
     },
     // 设置默认刷新

nezha-fronted/src/components/common/bottomBox/tabs/logBottomTab.vue

@@ -129,7 +129,7 @@ export default {
     },
     getData () {
       const nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
-      this.setSearchTime(nowTimeType.type, nowTimeType.value)
+      this.setSearchTime('filterTime')
       this.$store.dispatch('dispatchTimePickerRange', {
         time: this.searchTime,
         nowTimeType: this.nowTimeType
@@ -144,31 +144,9 @@ export default {
         const nowTimeType = this.nowTimeType = this.timePickerRange.nowTimeType
         this.filterTime = this.timePickerRange.time
         this.$refs.pickTime && this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType, this.filterTime)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('filterTime')
       })
     },
-    setSearchTime (type, val) { // 设置searchTime
-      if (type === 'minute') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setMinutes(new Date(bus.computeTimezone(new Date().getTime())).getMinutes() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'm')
-      } else if (type === 'hour') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setHours(new Date(bus.computeTimezone(new Date().getTime())).getHours() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'h')
-      } else if (type === 'date') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setDate(new Date(bus.computeTimezone(new Date().getTime())).getDate() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'd')
-      }
-      this.$refs.pickTime.$refs.timePicker.searchTime = this.filterTime
-    },
     queryLogData (limit) { // log的chart和table是一个请求
       this.loading = true
       if (limit) {

nezha-fronted/src/components/common/mixin/mainMixinFun.js

@@ -160,7 +160,22 @@ export default {
         this.nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
         const type = nowTimeType.type
         const val = nowTimeType.value
-        if (type === 'minute') {
+        if (type === 'relative') {
+          const now = new Date(bus.computeTimezone(new Date().getTime()))
+          let start = bus.timeFormate(now, 'YYYY-MM-DD')
+          let end = bus.timeFormate(now, 'YYYY-MM-DD HH:mm:ss')
+          let unit = ''
+          if (nowTimeType.id === 13) { // today
+            unit = 't'
+            start += '00:00:00'
+            end += ''
+            start = this.momentTz(this.momentStrToTimestamp(start, 'YYYY-MM-DD HH:mm:ss'))
+            end = this.momentTz(this.momentStrToTimestamp(end, 'YYYY-MM-DD HH:mm:ss'))
+          }
+          this.$set(this[key], 0, start)
+          this.$set(this[key], 1, end)
+          this.$set(this[key], 2, val + unit)
+        } else if (type === 'minute') {
           const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setMinutes(new Date(bus.computeTimezone(new Date().getTime())).getMinutes() - val))
           const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
           this.$set(this[key], 0, startTime)
@@ -179,6 +194,7 @@ export default {
           this.$set(this[key], 1, endTime)
           this.$set(this[key], 2, val + 'd')
         }
+        console.log(this[key], 'mainMixin')
         this.$refs.pickTime.$refs.timePicker.searchTime = this[key]
       }
       if (cb) {

nezha-fronted/src/components/common/project/L5/CanvasContextMenu.vue

@@ -1,125 +0,0 @@
-<template>
-  <div class="menus">
-    <div>
-      <a :class="{disabled:!props.pen && !props.pens}" @click="onTop()">{{$t('project.topology.top')}}</a>
-    </div>
-    <div>
-      <a :class="{disabled:!props.pen && !props.pens}" @click="onBottom()">{{$t('project.topology.bottom')}}</a>
-    </div>
-    <div class="line"></div>
-    <div>
-      <a :class="{disabled:!props.pen && !props.pens && !props.line}" @click="onDel()">{{$t('overall.delete')}}</a>
-    </div>
-    <div class="line"></div>
-    <div>
-      <a @click="canvascut()" class="flex">
-        <span class="full">{{$t('project.topology.cut')}}</span>
-        <span class="ml50">Ctrl + X</span>
-      </a>
-    </div>
-    <div>
-      <a @click="canvascopy()" class="flex">
-        <span class="full">{{$t('overall.duplicate')}}</span>
-        <span class="ml50">Ctrl + C</span>
-      </a>
-    </div>
-    <div>
-      <a @click="canvaspaste()" class="flex">
-        <span class="full">{{$t('project.topology.paste')}}</span>
-        <span class="ml50">Ctrl + V</span>
-      </a>
-    </div>
-  </div>
-</template>
-
-<script >
-import { getTopology } from '../../js/common'
-export default {
-  data () {
-    return {}
-  },
-  props: {
-    index: {
-      require: true
-    },
-    props: {
-      type: Object,
-      require: true
-    }
-  },
-  methods: {
-    onTop () {
-      if (this.props.pens) {
-        for (const item of this.props.pens) {
-          getTopology(this.index).top(item)
-        }
-      } else if (this.props.pen) {
-        getTopology(this.index).top(this.props.pen)
-      }
-
-      getTopology(this.index).render()
-    },
-
-    onBottom () {
-      if (this.props.pens) {
-        for (const item of this.props.pens) {
-          getTopology(this.index).bottom(item)
-        }
-      } else if (this.props.pen) {
-        getTopology(this.index).bottom(this.props.pen)
-      }
-
-      getTopology(this.index).render()
-    },
-
-    onCombine (stand) {
-      if (!this.props.pens) {
-        return
-      }
-      getTopology(this.index).combine(this.props.pens, stand)
-      getTopology(this.index).render()
-    },
-
-    onUncombine () {
-      if (!this.props.pen) {
-        return
-      }
-      getTopology(this.index).uncombine(this.props.pen)
-      getTopology(this.index).render()
-    },
-
-    onLock () {
-      // eslint-disable-next-line vue/no-mutating-props
-      this.props.locked = !this.props.locked
-      if (this.props.pen) {
-        // eslint-disable-next-line vue/no-mutating-props
-        this.props.pen.locked = this.props.locked
-      }
-      if (this.props.pens) {
-        for (const item of this.props.pens) {
-          item.locked = this.props.locked
-        }
-      }
-      if (this.props.lines) {
-        for (const item of this.props.lines) {
-          item.locked = this.props.locked
-        }
-      }
-      getTopology(this.index).render(true)
-    },
-
-    onDel () {
-      getTopology(this.index).delete(this.props.pens || [this.props.pen])
-    },
-    canvascut () {
-      getTopology(this.index).cut(this.props.pens || [this.props.pen])
-    },
-    canvascopy () {
-      getTopology(this.index).copy(this.props.pens || [this.props.pen])
-    },
-    canvaspaste () {
-      getTopology(this.index).paste()
-    }
-  }
-}
-</script>

nezha-fronted/src/components/common/project/L5/services/canvas.js

@@ -1,941 +0,0 @@
-import { s16, s8 } from '@topology/core'
-export let canvas
-
-export const Tools = [
-  {
-    group: 'General',
-    children: [
-      // {
-      //   name: 'rectangle',
-      //   icon: 'icon-cube',
-      //   data: {
-      //     rect: {
-      //       width: 100,
-      //       height: 100
-      //     },
-      //     is3D: true,
-      //     z: 20,
-      //     zRotate: 15,
-      //     name: 'myCube',
-      //     iconFamily: 'topology',
-      //     iconColor: '#777',
-      //     iconSize: 30
-      //   }
-      // },
-      {
-        name: 'rectangle',
-        icon: 'icon-rect',
-        type: 0,
-        data: {
-          text: 'rect',
-          type: 0,
-          width: 100,
-          height: 100,
-          paddingLeft: 10,
-          paddingRight: 10,
-          paddingTop: 10,
-          paddingBottom: 10,
-          name: 'rectangle'
-        }
-      },
-      {
-        name: 'rectangle',
-        icon: 'icon-rectangle',
-        type: 0,
-        data: {
-          text: 'rectangle',
-          type: 0,
-          width: 200,
-          height: 50,
-          paddingLeft: 10,
-          paddingRight: 10,
-          paddingTop: 10,
-          paddingBottom: 10,
-          borderRadius: 0.1,
-          name: 'rectangle'
-          // icon: '\ue680',
-          // iconFamily: 'nz-icon',
-          // iconColor: ''
-        }
-      },
-      {
-        name: 'circle',
-        icon: 'icon-circle',
-        type: 0,
-        data: {
-          text: 'circle',
-          type: 0,
-          width: 100,
-          height: 100,
-          name: 'circle',
-          textMaxLine: 1
-        }
-      },
-      {
-        name: 'triangle',
-        icon: 'icon-triangle',
-        type: 0,
-        data: {
-          text: 'triangle',
-          type: 0,
-          width: 100,
-          height: 100,
-          name: 'triangle'
-        }
-      },
-      {
-        name: 'diamond',
-        icon: 'icon-diamond',
-        type: 0,
-        data: {
-          text: 'diamond',
-          type: 0,
-          width: 100,
-          height: 100,
-          name: 'diamond'
-        }
-      },
-      {
-        name: 'pentagon',
-        icon: 'icon-pentagon',
-        type: 0,
-        data: {
-          text: 'pentagon',
-          type: 0,
-          width: 100,
-          height: 100,
-          name: 'pentagon'
-        }
-      },
-      {
-        name: 'hexagon',
-        icon: 'icon-hexagon',
-        type: 0,
-        data: {
-          text: 'hexagon',
-          type: 0,
-          width: 100,
-          height: 100,
-          paddingTop: 10,
-          paddingBottom: 10,
-          name: 'hexagon'
-        }
-      },
-      {
-        name: 'pentagram',
-        icon: 'icon-pentagram',
-        type: 0,
-        data: {
-          text: 'pentagram',
-          type: 0,
-          width: 100,
-          height: 100,
-          name: 'pentagram'
-        }
-      }
-    ]
-  }
-]
-
-export const imageTemp = {
-  name: 'rectangleImg',
-  icon: 'icon-image',
-  data: {
-    type: 0,
-    x: 922,
-    y: 406,
-    width: 100,
-    height: 100,
-    imageRatio: false,
-    lineWidth: 0,
-    rotate: 0,
-    offsetRotate: 0,
-    globalAlpha: 1,
-    lineDash: [],
-    color: '#000000',
-    background: '#ffffff00',
-    animatePos: 0,
-    name: 'rectangleImg',
-    lineDashOffset: 0,
-    text: '',
-    textOffsetX: 0,
-    textOffsetY: 0,
-    visible: true,
-    zRotate: 0,
-    animateDuration: 0,
-    animateFrames: [],
-    animateFrame: 0,
-    borderRadius: 0,
-    icon: '',
-    image: '',
-    imageAlign: 'center',
-    bkType: 0,
-    gradientAngle: 0,
-    gradientRadius: 0.01,
-    paddingTop: 5,
-    paddingBottom: 5,
-    paddingLeft: 5,
-    paddingRight: 5,
-    paddingLeftNum: 5,
-    paddingRightNum: 5,
-    paddingTopNum: 5,
-    paddingBottomNum: 5,
-    fullIconRect: { width: 80, height: 90, center: { x: 972, y: 456 }, ex: 1012, ey: 496 }
-  }
-}
-export const imageTemp2 = {
-  name: 'rectangleImg2',
-  icon: 'icon-image',
-  data: {
-    type: 0,
-    x: 922,
-    y: 406,
-    width: 100,
-    height: 100,
-    imageRatio: false,
-    lineWidth: 0,
-    rotate: 0,
-    offsetRotate: 0,
-    globalAlpha: 1,
-    lineDash: [],
-    color: '#000000',
-    background: '#ffffff00',
-    animatePos: 0,
-    name: 'rectangleImg2',
-    lineDashOffset: 0,
-    text: '',
-    textOffsetX: 0,
-    textOffsetY: 0,
-    visible: true,
-    zRotate: 0,
-    animateDuration: 0,
-    animateFrames: [],
-    animateFrame: 0,
-    borderRadius: 0,
-    icon: '',
-    image: '',
-    imageAlign: 'center',
-    bkType: 0,
-    gradientAngle: 0,
-    gradientRadius: 0.01,
-    paddingTop: 5,
-    paddingBottom: 5,
-    paddingLeft: 5,
-    paddingRight: 5,
-    paddingLeftNum: 5,
-    paddingRightNum: 5,
-    paddingTopNum: 5,
-    paddingBottomNum: 5,
-    fullIconRect: { width: 80, height: 90, center: { x: 972, y: 456 }, ex: 1012, ey: 496 }
-  }
-}
-export function rectangleImg (ctx, pen) {
-  ctx.beginPath()
-
-  ctx.rect(pen.x, pen.y, pen.width, pen.height)
-  if (pen.data && !pen.data.animateNeedLine) {
-    if (pen.data && pen.data.lineWidth <= 0) {
-      ctx.strokeStyle = 'rgba(0,0,0,0)'
-    }
-  }
-  // 必须判空再填充
-  (pen.background || pen.bkType) && ctx.fill()
-  pen.calculative.worldIconRect = {
-    height: pen.height - 10 - 20,
-    rotate: 0,
-    width: pen.width - 10,
-    x: pen.x + 5,
-    y: pen.y + 5
-  }
-  pen.calculative.worldTextRect = {
-    height: 20,
-    width: pen.width - 10,
-    x: pen.x + 5,
-    y: pen.y + pen.height - 5 - 20
-  }
-  // pen.iconRect = new Rect(pen.x + pen.paddingLeft, pen.y + pen.paddingTop, pen.width - (pen.paddingLeft + pen.paddingRight), pen.height - 20 - (pen.paddingTop + pen.paddingBottom))
-  // pen.fullIconRect = { width: 80, height: 90, center: { x: 972, y: 456 }, ex: 1012, ey: 496 }
-  ctx.stroke()
-}
-export function rectangleImgAnchors (pen) {
-  const anchors = []
-  anchors.push({
-    id: '0',
-    penId: pen.id,
-    x: pen.x,
-    y: pen.y + pen.height / 2
-  })
-  anchors.push({
-    id: '1',
-    penId: pen.id,
-    x: pen.x + pen.width / 2,
-    y: pen.y
-  })
-  anchors.push({
-    id: '2',
-    penId: pen.id,
-    x: pen.x + pen.width,
-    y: pen.y + pen.height / 2
-  })
-  anchors.push({
-    id: '3',
-    penId: pen.id,
-    x: pen.x + pen.width / 2,
-    y: pen.y + pen.height
-  })
-  anchors.push({
-    id: '4',
-    penId: pen.id,
-    x: pen.x,
-    y: pen.y + pen.height / 8
-  })
-  return anchors
-  // pen.anchors.push(new Point(pen.x, pen.y + pen.height / 2, Direction.Left))
-  // pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y, Direction.Up))
-  // pen.anchors.push(new Point(pen.x + pen.width, pen.y + pen.height / 2, Direction.Right))
-  // pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y + pen.height, Direction.Bottom))
-}
-export function rectangleImg2 (ctx, pen) {
-  ctx.beginPath()
-
-  ctx.rect(pen.x, pen.y, pen.width, pen.height)
-  if (pen.data && !pen.data.animateNeedLine) {
-    if (pen.data && pen.data.lineWidth <= 0) {
-      ctx.strokeStyle = 'rgba(0,0,0,0)'
-    }
-  }
-  // 必须判空再填充
-  (pen.background || pen.bkType) && ctx.fill()
-  pen.calculative.worldIconRect = {
-    height: pen.height - 10,
-    rotate: 0,
-    width: pen.width - 10,
-    x: pen.x + 5,
-    y: pen.y + 5
-  }
-  pen.calculative.worldTextRect = {
-    height: 20,
-    width: pen.width - 10,
-    x: pen.x + 5,
-    y: pen.y + pen.height
-  }
-  // pen.iconRect = new Rect(pen.x + pen.paddingLeft, pen.y + pen.paddingTop, pen.width - (pen.paddingLeft + pen.paddingRight), pen.height - 20 - (pen.paddingTop + pen.paddingBottom))
-  // pen.fullIconRect = { width: 80, height: 90, center: { x: 972, y: 456 }, ex: 1012, ey: 496 }
-  ctx.stroke()
-}
-export function rectangleImgAnchors2 (pen) {
-  const anchors = []
-  anchors.push({
-    id: '0',
-    penId: pen.id,
-    x: pen.x,
-    y: pen.y + pen.height / 2
-  })
-  anchors.push({
-    id: '1',
-    penId: pen.id,
-    x: pen.x + pen.width / 2,
-    y: pen.y
-  })
-  anchors.push({
-    id: '2',
-    penId: pen.id,
-    x: pen.x + pen.width,
-    y: pen.y + pen.height / 2
-  })
-  anchors.push({
-    id: '3',
-    penId: pen.id,
-    x: pen.x + pen.width / 2,
-    y: pen.y + pen.height
-  })
-  anchors.push({
-    id: '4',
-    penId: pen.id,
-    x: pen.x,
-    y: pen.y + pen.height / 8
-  })
-  return anchors
-  // pen.anchors.push(new Point(pen.x, pen.y + pen.height / 2, Direction.Left))
-  // pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y, Direction.Up))
-  // pen.anchors.push(new Point(pen.x + pen.width, pen.y + pen.height / 2, Direction.Right))
-  // pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y + pen.height, Direction.Bottom))
-}
-export function disposeTopoOldData (pen, allPen) { // 处理旧数据
-  let obj = {}
-  if (pen.type === 0) {
-    obj = {
-      id: pen.id,
-      data: pen.data,
-      keepDecimal: 2,
-      scale: 1,
-      valueMapping: pen.valueMapping,
-      tags: [
-
-      ],
-      type: 0,
-      name: pen.name,
-      icon: pen.icon,
-      iconColor: pen.iconColor,
-      iconFamily: pen.iconFamily,
-      iconName: pen.iconName,
-      iconSize: pen.iconSize ? pen.iconSize : 12,
-      x: pen.rect.x,
-      y: pen.rect.y,
-      ex: pen.rect.ex,
-      ey: pen.rect.ey,
-      width: pen.rect.width,
-      height: pen.rect.height,
-      paddingLeft: pen.paddingLeft,
-      paddingRight: pen.paddingRight,
-      paddingTop: pen.paddingTop,
-      paddingBottom: pen.paddingBottom,
-      color: pen.strokeStyle,
-      lineWidth: pen.lineWidth,
-      borderWidth: null,
-      borderColor: pen.strokeStyle,
-      rotate: pen.rotate,
-      visible: true,
-      background: pen.fillStyle,
-      lineHeight: pen.lineHeight,
-      fontSize: pen.fontSize,
-      fontFamily: pen.fontFamily,
-      fontStyle: pen.fontStyle,
-      fontWeight: pen.fontWeight,
-      text: pen.text,
-      textColor: pen.fontColor,
-      textAlign: pen.textAlign,
-      textBaseline: pen.textBaseline,
-      textBackground: pen.textBackground,
-      lineAnimateType: pen.lineAnimateType,
-      textLeft: pen.textOffsetX,
-      textTop: pen.textOffsetY,
-      animateType: '',
-      frames: [
-
-      ],
-      autoPlay: pen.autoPlay,
-      globalAlpha: pen.globalAlpha,
-      bkType: pen.bkType,
-      gradientAngle: pen.gradientAngle,
-      gradientRadius: pen.gradientRadius,
-      borderRadius: pen.borderRadius,
-      events: [
-
-      ],
-      anchors: [
-        {
-          id: '0',
-          penId: pen.id,
-          x: 0,
-          y: 0.5
-        },
-        {
-          id: '1',
-          penId: pen.id,
-          x: 0.5,
-          y: 0
-        },
-        {
-          id: '2',
-          penId: pen.id,
-          x: 1,
-          y: 0.5
-        },
-        {
-          id: '3',
-          penId: pen.id,
-          x: 0.5,
-          y: 1
-        }
-      ],
-      // connectedLines: [
-      //   {
-      //     anchor: '1',
-      //     lineAnchor: '9a5fccf',
-      //     lineId: '3e3a3d'
-      //   }
-      // ]
-      connectedLines: pen.connectedLines || [],
-      image: pen.image
-    }
-  } else {
-    const width = pen.from.x - pen.to.x
-    const height = pen.from.y - pen.to.y
-    obj = {
-      id: pen.id,
-      keepDecimal: 2,
-      tags: [
-
-      ],
-      name: 'line',
-      scale: 1,
-      lineName: pen.name,
-      type: pen.type,
-      autoPolyline: true,
-      fromArrow: pen.fromArrow,
-      toArrow: pen.toArrow,
-      x: width > 0 ? pen.to.x : pen.from.x,
-      y: height > 0 ? pen.to.y : pen.from.y,
-      width: Math.abs(pen.to.x - pen.from.x),
-      height: Math.abs(pen.to.y - pen.from.y),
-      data: pen.data,
-      valueMapping: pen.valueMapping,
-      anchors: [
-        {
-          anchorId: pen.from.anchorIndex + '',
-          id: pen.id + '-0',
-          penId: pen.id,
-          connectTo: pen.from.id,
-          prevNextType: undefined,
-          x: 0,
-          y: 0,
-          prev: {
-            penId: pen.id,
-            connectTo: pen.from.id,
-            x: -0.2,
-            y: 0
-          },
-          next: {
-            penId: pen.id,
-            connectTo: pen.from.id,
-            x: 0.2,
-            y: 0
-          }
-        },
-        {
-          anchorId: pen.to.anchorIndex + '',
-          id: pen.id + '-1',
-          penId: pen.id,
-          connectTo: pen.to.id,
-          prevNextType: undefined,
-          hidden: undefined,
-          x: 1,
-          y: 1,
-          prev: {
-            penId: pen.id,
-            connectTo: pen.to.id,
-            x: 0.8,
-            y: 1
-          },
-          next: {
-            penId: pen.id,
-            connectTo: pen.to.id,
-            x: 1.2,
-            y: 1
-          }
-        }
-      ],
-      color: pen.strokeStyle,
-      lineWidth: pen.lineWidth,
-      lineDashOffset: pen.lineDashOffset,
-      lineDash: pen.dash ? (pen.dash == 1 ? [5, 5] : ((pen.dash == 2 ? [10, 10] : [10, 10, 2, 10]))) : [],
-      borderColor: pen.borderColor,
-      borderWidth: pen.borderWidth,
-      rotate: pen.rotate,
-      visible: true,
-      background: '',
-      lineHeight: pen.lineHeight,
-      fontSize: pen.fontSize,
-      fontFamily: pen.fontFamily,
-      fontStyle: pen.fontStyle,
-      fontWeight: pen.fontWeight,
-      textColor: '',
-      textAlign: pen.textAlign,
-      textBaseline: pen.textBaseline,
-      textBackground: pen.textBackground,
-      textLeft: pen.textOffsetX,
-      textTop: pen.textOffsetY,
-      animateSpan: pen.animateSpan,
-      animateColor: pen.animateColor,
-      lineAnimateType: 0,
-      animateDotSize: pen.animateDotSize,
-      frames: [
-
-      ],
-      autoPlay: false,
-      globalAlpha: 1,
-      events: [
-
-      ]
-    }
-    if (width > 0 && height > 0) {
-      obj.anchors[0].x = 1
-      obj.anchors[0].y = 1
-      obj.anchors[1].x = 0
-      obj.anchors[1].y = 0
-    } else if (width > 0 && height < 0) {
-      obj.anchors[0].x = 1
-      obj.anchors[0].y = 0
-      obj.anchors[1].x = 0
-      obj.anchors[1].y = 1
-    } else if (width < 0 && height > 0) {
-      obj.anchors[0].x = 0
-      obj.anchors[0].y = 1
-      obj.anchors[1].x = 1
-      obj.anchors[1].y = 0
-    } else if (width < 0 && height < 0) {
-      obj.anchors[0].x = 0
-      obj.anchors[0].y = 0
-      obj.anchors[1].x = 1
-      obj.anchors[1].y = 1
-    }
-    if (pen.name === 'polyline') {
-      obj.anchors.splice(1, 0, {
-        id: s8(),
-        penId: pen.id,
-        x: 0.1,
-        y: 0
-      }, {
-        id: s8(),
-        penId: pen.id,
-        x: 0.5,
-        y: 0
-      },
-      {
-        id: s8(),
-        penId: pen.id,
-        x: 0.5,
-        y: 1
-      },
-      {
-        id: s8(),
-        penId: pen.id,
-        x: 0.9,
-        y: 1
-      }
-      )
-    }
-    pen.data.valueMapping.forEach(item => {
-      if (item.animateType == 1) {
-        item.animateType = 'flow'
-      } else if (item.animateType == 'comet') {
-        item.animateType = 'dot'
-      }
-    })
-  }
-  return obj
-}
-/* 自定义图片组件 */
-// export function myShape (ctx, node) { // 自定义图片组件
-//   ctx.beginPath()
-//
-//   ctx.rect(pen.x, pen.y, pen.width, pen.height)
-//   if (pen.data && pen.data.lineWidth <= 0) {
-//     ctx.strokeStyle = 'rgba(0,0,0,0)'
-//   }
-//   // 必须判空再填充
-//   (pen.fillStyle || pen.bkType) && ctx.fill()
-//   ctx.stroke()
-// }
-// export function myAnchors (node) {
-//   pen.anchors.push(new Point(pen.x, pen.y + pen.height / 2, Direction.Left))
-//   pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y, Direction.Up))
-//   pen.anchors.push(new Point(pen.x + pen.width, pen.y + pen.height / 2, Direction.Right))
-//   pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y + pen.height, Direction.Bottom))
-// }
-// export function myIconRect (node) {
-//   pen.iconRect = new Rect(pen.x + pen.paddingLeft, pen.y + pen.paddingTop, pen.width - (pen.paddingLeft + pen.paddingRight), pen.height - 20 - (pen.paddingTop + pen.paddingBottom))
-//   pen.fullIconRect = pen.rect
-// }
-// export function myTextRect (node) {
-//   pen.textRect = new Rect(
-//     pen.x + pen.paddingLeft,
-//     pen.y + pen.height - 20 - pen.paddingBottom,
-//     pen.width - (pen.paddingLeft + pen.paddingRight),
-//     20
-//   )
-//   pen.fullTextRect = pen.rect
-// }
-// export function myIconRect2 (node) {
-//   pen.iconRect = pen.rect
-//   pen.fullIconRect = pen.rect
-// }
-// export function myTextRect2 (node) {
-//   pen.textRect = new Rect(
-//     pen.x + pen.paddingLeft,
-//     pen.y + pen.height + 10,
-//     pen.width - (pen.paddingLeft + pen.paddingRight),
-//     20
-//   )
-//   pen.fullTextRect = pen.rect
-// }
-// /* 自定义图片组件 */
-//
-// /* 自定义立方体 */
-// export function myCubec (ctx, node) {
-//   // 立方体
-//   // ctx.rect(pen.x,pen.y,pen.width,pen.height);
-//   const x = pen.x + 10; const y = pen.y + 10; const w = pen.width - 20; const h = pen.height - 20
-//
-//   // LINE MODE
-//   ctx.lineJoin = 'round'
-//
-//   // center face
-//   ctx.beginPath()
-//   ctx.moveTo(x, y + h / 3)
-//   ctx.lineTo(x + w * 2 / 3, y + h / 3)
-//   ctx.lineTo(x + w * 2 / 3, y + h)
-//   ctx.lineTo(x, y + h)
-//   ctx.closePath()
-//   ctx.fillStyle = pen.fillStyle
-//   ctx.strokeStyle = pen.strokeStyle
-//   ctx.stroke();
-//   (pen.fillStyle || pen.bkType) && ctx.fill()
-//
-//   // top face
-//   ctx.beginPath()
-//   ctx.moveTo(x, y + h / 3)
-//   ctx.lineTo(x + w / 3, y)
-//   ctx.lineTo(x + w, y)
-//   ctx.lineTo(x + w * 2 / 3, y + h / 3)
-//   ctx.closePath()
-//   ctx.fillStyle = pen.fillStyle
-//   ctx.strokeStyle = pen.strokeStyle
-//   ctx.stroke();
-//   (pen.fillStyle || pen.bkType) && ctx.fill()
-//
-//   // right face
-//   ctx.beginPath()
-//   ctx.moveTo(x + w * 2 / 3, y + h / 3)
-//   ctx.lineTo(x + w, y)
-//   ctx.lineTo(x + w, y + h * 2 / 3)
-//   ctx.lineTo(x + w * 2 / 3, y + h)
-//   ctx.closePath()
-//   ctx.fillStyle = pen.fillStyle
-//   ctx.strokeStyle = pen.strokeStyle
-//   ctx.stroke();
-//   (pen.fillStyle || pen.bkType) && ctx.fill()
-//
-//   // 必须判空再填充
-// }
-// export function myCubeAnchors (node) { // 立方体锚点
-//   pen.anchors.push(new Point(pen.x, pen.y + pen.height / 2, Direction.Left))
-//   pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y, Direction.Up))
-//   pen.anchors.push(new Point(pen.x + pen.width, pen.y + pen.height / 2, Direction.Right))
-//   pen.anchors.push(new Point(pen.x + pen.width / 2, pen.y + pen.height, Direction.Bottom))
-// }
-// /* 自定义立方体 */
-//
-export function onChangeAnimate (pen, animateType, fillStyle, strokeStyle) {
-  pen.animateType = animateType
-  if (pen.animateType === 'custom') {
-    return
-  }
-
-  pen.animateFrames = []
-  // const state = Node.cloneState(pen)
-  const state = {}
-  switch (animateType) {
-    case 'upDown':
-      pen.frames = [
-        {
-          duration: 200,
-          y: 20
-        },
-        {
-          duration: 200,
-          y: 0
-        },
-        {
-          duration: 200,
-          y: -20
-        }
-      ]
-      break
-    case 'leftRight':
-      pen.frames = [
-        {
-          duration: 200,
-          x: 20
-        },
-        {
-          duration: 200,
-          x: 0
-        },
-        {
-          duration: 200,
-          x: -20
-        }
-      ]
-      break
-    case 'heart':
-      pen.frames = [
-        {
-          duration: 300,
-          scale: 1.2
-        },
-        // {
-        //   duration: 300,
-        //   x: 0,
-        //   y: 0,
-        //   width: 0,
-        //   height: 0
-        // },
-        {
-          duration: 300,
-          scale: 0.8
-        },
-        {
-          duration: 300,
-          scale: 1
-        }
-      ]
-      break
-    case 'success':
-      pen.frames = [
-        {
-          duration: 200,
-          color: strokeStyle || '#237804'
-        },
-        {
-          duration: 200,
-          color: strokeStyle || '#237804',
-          backGround: fillStyle || '#389e0d22'
-        }
-      ]
-      break
-    case 'warning':
-      pen.data.animateNeedLine = true
-      pen.frames = [
-        {
-          duration: 500,
-          color: strokeStyle || '#fa8c16',
-          background: fillStyle || '#fa8c16',
-          lineWidth: 5,
-          lineDash: [5, 5]
-        },
-        {
-          duration: 500,
-          color: strokeStyle || '#fa8c16',
-          background: '#ffffff',
-          lineWidth: 1,
-          lineDash: []
-        }
-      ]
-      break
-    case 'error':
-      state.strokeStyle = strokeStyle || '#cf1322'
-      state.fillStyle = fillStyle || '#cf132222'
-      state.lineWidth = 5
-      state.dash = 2
-      pen.animateFrames.push({
-        duration: 100,
-        linear: true,
-        state
-      })
-      state.strokeStyle = strokeStyle || '#cf1322'
-      state.fillStyle = '#ffffff'
-      state.dash = 0
-      state.lineWidth = 1
-      pen.animateFrames.push({
-        duration: 500,
-        linear: true,
-        state: Node.cloneState(state)
-      })
-      state.strokeStyle = strokeStyle || '#cf1322'
-      state.fillStyle = fillStyle || '#cf132222'
-      state.dash = 2
-      state.lineWidth = 5
-      pen.animateFrames.push({
-        duration: 300,
-        linear: true,
-        state: Node.cloneState(state)
-      })
-      break
-    case 'show':
-      pen.frames = [
-        {
-          duration: 100,
-          rotate: -5
-        },
-        {
-          duration: 100,
-          rotate: 0
-        },
-        {
-          duration: 100,
-          rotate: 5
-        },
-        {
-          duration: 100,
-          rotate: 0
-        }
-      ]
-      break
-    case 'fade':
-      state.globalAlpha = 0.3
-      pen.frames = [
-        {
-          duration: 500,
-          globalAlpha: 0.3
-        },
-        {
-          duration: 500,
-          globalAlpha: 1
-        }
-      ]
-      break
-  }
-  pen.animatePlay = true
-}
-export function onChangeAnimateLine (line, type, isOldData) {
-  // { id: 'flow', name: this.$t('project.topology.flow') },
-  // { id: 'beads', name: this.$t('project.topology.beads') },
-  // { id: 'dot', name: this.$t('project.topology.dot') },
-  let animateType = type
-  if (type === 'dot') {
-    animateType = 2
-  }
-  if (type === 'beads') {
-    animateType = 1
-  }
-  if (type === 'custom') {
-    delete line.lineAnimateType
-    return
-  }
-  line.lineAnimateType = animateType
-  line.animatePlay = true
-}
-// export function changeImage (dataImg, callback) {
-//   // const base64Img = document.createElement('base64Img')
-//   const canvas = document.createElement('canvas')
-//   const context = canvas.getContext('2d')
-//   // 创建新图片
-//   const img = new Image()
-//   img.src = dataImg
-//   img.addEventListener(
-//     'load',
-//     function () {
-//       // 绘制图片到canvas上
-//       canvas.width = img.width
-//       canvas.height = img.height
-//       context.drawImage(img, 0, 0)
-//
-//       // 将canvas的透明背景设置成白色
-//       const imageData = context.getImageData(
-//         0,
-//         0,
-//         canvas.width,
-//         canvas.height
-//       )
-//       for (let i = 0; i < imageData.data.length; i += 4) {
-//         // rgb大于250的透明度y均设置成0
-//         if (
-//           imageData.data[i] > 0 &&
-//           imageData.data[i + 1] > 0 &&
-//           imageData.data[i + 2] > 0
-//         ) {
-//           imageData.data[i + 3] = 200
-//         }
-//       }
-//       context.putImageData(imageData, 0, 0)
-//       const baseImg = canvas.toDataURL('image/png')// 返回base64
-//       if (typeof callback !== 'undefined') {
-//         if (callback) callback(baseImg)
-//       }
-//       img.remove()
-//     },
-//     false
-//   )
-// }

nezha-fronted/src/components/common/project/L5/topoTooltip.vue

@@ -1,446 +0,0 @@
-<template>
-  <div class="tooltip-box" style="display: flex;" v-if="(isChart||chartData.tooltipShow)&&chartData.expressAllArr&&chartData.expressAllArr.length">
-    <div class="tooltip-box-chart" style="" v-if="isChart||(chartData.displayChart&&chartData.tooltipShow&&chartData.expressAllArr&&chartData.expressAllArr.length)">
-        <line-chart-block v-show="isChart || chartData.type !== 'table'"
-                          :key="'inner' + chartData.id"
-                          :class="isPanel? 'topology-tool-tip line-chart' : 'line-chart'"
-                          id="listContainer"
-                          :from="'topology'"
-                          :ref="chartData.type !== 'table'?'editChart' + chartData.type:'editChart'"
-                          :temp-dom="tempDom"
-                          :panel-id="-1"
-                          :is-lock="true"
-                          :chart-index="-2"
-                          :fromTopo="true"
-                          :chartTitleShow="false"
-                          :chart-data="chartData">
-        </line-chart-block>
-      <div v-if="chartData.remark" class="chart-remark">{{chartData.remark}}</div>
-      <chart-table  v-show="isChart || chartData.type === 'table'"
-                    :key="'inner' + 1"
-                    :from="'project'"
-                    ref="editCharttable"
-                    :is-lock="true"
-                    :panel-id="-1"
-                    :chart-data="chartData"
-                    :chart-index="0"></chart-table>
-    </div>
-<!--    <div class="tooltip-box-info" v-if="!isChart">-->
-<!--      <expression-info :chart-data="chartData" :filterTime="filterTime"/>-->
-<!--    </div>-->
-  </div>
-</template>
-
-<script>
-import lineChartBlock from '@/components/chart/chart/line-chart-block'
-import chartTable from '@/components/chart/chart/chart-table'
-import bus from '../../../../libs/bus'
-import ExpressionInfo from '../popData/expressionInfo'
-import { fromRoute } from '@/components/common/js/constants'
-import chartTempData from '@/components/chart/chartTempData'
-import axios from 'axios'
-import chartDataFormat from '@/components/chart/chartDataFormat'
-import { dealLegendAlias } from '@/components/common/js/tools'
-export default {
-  name: 'topoTooltip',
-  components: {
-    ExpressionInfo,
-    lineChartBlock,
-    chartTable
-  },
-  props: {
-    chartDataParent: {
-      type: Object
-    },
-    filterTime: {},
-    isChart: {
-      type: Boolean,
-      default: false
-    },
-    isPanel: {
-      type: Boolean,
-      default: false
-    }
-  },
-  watch: {
-    chartDataParent: {
-      immediate: true,
-      handler (n) {
-        this.process(n)
-      }
-
-    }
-  },
-  data () {
-    return {
-      tempDom: { height: 250, width: '' },
-      chartDataTemp: { id: 8832, prev: null, next: null, dashboardId: 0, title: '123', span: 12, height: 0, createAt: '2021-01-27 07:36:19', unit: 2, weight: 0, pid: null, buildIn: null, seq: null, param: { last: 0, legendValue: { total: 'off', min: 'off', avg: 'off', last: 'off', max: 'off' }, threshold: '', url: '', nullType: 'null' }, sync: null, asset: null, isLoaded: true, from: '__vue_devtool_undefined__', draggable: true, resizable: true, editable: true },
-      chartData: {},
-      filter: {
-        end_time: bus.timeFormate(bus.getOffsetTimezoneData(), 'YYYY-MM-DD HH:mm:ss'),
-        dashboardId: 0,
-        searchName: '',
-        start_time: bus.timeFormate(bus.getOffsetTimezoneData(-1), 'YYYY-MM-DD HH:mm:ss')
-      }
-    }
-  },
-  mounted () {
-    this.tempDomInit()
-  },
-  methods: {
-    tempDomInit () {
-      this.tempDom.width = 250
-    },
-    process (item) {
-      const chartData = { ...this.chartDataTemp, ...item, name: item.chartTitle }
-      chartData.elements = []
-      chartData.expressAllArr && chartData.expressAllArr.forEach((item1, index) => {
-        chartData.elements.push({
-          expression: item1,
-          legend: chartData.legendsAll[index],
-          type: 'expert',
-          id: index,
-          buildIn: null,
-          seq: null
-        })
-      })
-      chartData.id = 0
-      chartData.param = {
-        legendValue: { total: 'off', min: 'off', avg: 'off', last: 'off', max: 'off' },
-        last: 0,
-        nullType: 'null',
-        threshold: '',
-        url: '',
-        valueMapping: { mapping: [{ color: { bac: '#fff', text: '#000' }, text: '', value: '' }], type: 'text' },
-        statistics: chartData.aggregation
-      }
-      chartData.span = 12
-      this.chartData = chartData
-      this.getChartData(chartData, 0)
-    },
-    // 获取一个图表具体数据,图表信息，图表位置index
-    getChartData (chartInfo, pos, filterType) {
-      const chartItem = chartInfo
-      // 没有数据的设置提示信息暂无数据-针对每一个图
-      const len = chartItem.elements.length
-      if (len === 0) {
-        this.$nextTick(() => {
-          if (this.$refs['editChart' + chartItem.type]) {
-            this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId, this.filter, [])
-          }
-        })
-      } else {
-        const dashboardTime = localStorage.getItem('dashboardTime') ? JSON.parse(localStorage.getItem('dashboardTime')) : ['', '']
-        const endTime = dashboardTime[1] || bus.timeFormate(bus.getOffsetTimezoneData(), 'YYYY-MM-DD HH:mm:ss')
-        const startTime = dashboardTime[0] || bus.timeFormate(bus.getOffsetTimezoneData(-1), 'YYYY-MM-DD HH:mm:ss')
-        const step = bus.getStep(startTime, endTime)
-        this.$nextTick(() => {
-          const axiosArr = chartItem.elements.map((ele) => {
-            const filterItem = ele
-            let query = encodeURIComponent(filterItem.expression)
-            if ((chartInfo.type === 'line' || chartInfo.type === 'bar' || chartInfo.type === 'stackArea' || chartInfo.type === 'table') && chartInfo.param) { // 如果是这三个 默认给null
-              chartInfo.param.nullType = chartInfo.param.nullType || 'null'
-              query += '&nullType=' + chartInfo.param.nullType
-            }
-            // if(chartInfo.type === 'table'&&chartInfo.param&&chartInfo.param.last == 1){
-            //   return this.$get('/prom/api/v1/query_range?query=' + query + "&start=" + this.$stringTimeParseToUnix(endTime) + "&end=" + this.$stringTimeParseToUnix(endTime) + '&step=' + step);
-            // }
-            if (this.from === fromRoute.chartTemp) {
-              return chartTempData
-            }
-            return this.$get('/prom/api/v1/query_range?query=' + query + '&start=' + this.$stringTimeParseToUnix(startTime) + '&end=' + this.$stringTimeParseToUnix(endTime) + '&step=' + step)
-          })
-          // 一个图表的所有element单独获取数据
-          axios.all(axiosArr).then((res) => {
-            if (res.length > 0) {
-              const series = []
-              let singleStatRlt = ''
-              const legend = []
-              const tableData = []
-              /* let sumData = {
-                  name: 'sum',
-                  data: [],
-                  visible: true,
-                  threshold: null,
-                }; */
-              let errorMsg = ''
-              let pieSeries
-              if (chartInfo.type === 'pie') {
-                pieSeries = {
-                  type: 'pie',
-                  radius: '100%',
-                  center: ['50%', '50%'],
-                  top: '20%',
-                  bottom: '20%',
-                  // roseType: 'radius',
-                  minAngle: 10,
-                  itemStyle: {
-                    borderRadius: 5,
-                    borderColor: '#fff',
-                    borderWidth: 1
-                  },
-                  label: {
-                    show: false
-                  },
-                  emphasis: {
-                    label: {
-                      show: false
-                    }
-                  },
-                  data: []
-                }
-              }
-              if (chartInfo.type === 'bar' && chartInfo.param.statistics && chartInfo.param.statistics !== 'null') {
-                pieSeries = {
-                  type: 'bar',
-                  // roseType: 'radius',
-                  itemStyle: {
-                    borderRadius: 5,
-                    borderColor: '#fff',
-                    borderWidth: 1
-                  },
-                  label: {
-                    show: false
-                  },
-                  emphasis: {
-                    label: {
-                      show: false
-                    }
-                  },
-                  data: []
-                }
-              }
-              res.forEach((response, innerPos) => {
-                if (response.status === 'success') {
-                  errorMsg = ''
-                  if (response.data.result) {
-                    // 循环处理每个elements下获取的数据列
-                    if (chartItem.type === 'singleStat') {
-                      if (response.data.result.length === 1) {
-                        const statistics = chartItem.param.statistics || 'null'
-                        if (response.data.result[0].values) {
-                          singleStatRlt = bus.getSingleStatRlt(statistics, response.data.result[0].values)
-                        }
-                      } else if (response.data.result.length > 1) {
-                        singleStatRlt = this.$t('dashboard.dashboard.singleStatErrorTip')
-                      }
-                    } else {
-                      response.data.result.forEach((queryItem, resIndex) => {
-                        let seriesItem = {
-                          theData: {
-                            name: '',
-                            symbol: 'emptyCircle', // 去掉点
-                            symbolSize: [2, 2],
-                            smooth: 0.2, // 曲线变平滑
-                            showSymbol: false,
-                            data: [],
-                            lineStyle: {
-                              width: 1,
-                              opacity: 0.9
-                            },
-                            animation: false,
-                            type: chartInfo.type
-                          },
-                          metric_name: ''
-                        }
-
-                        if (chartInfo.type === 'stackArea') {
-                          seriesItem.theData.type = 'line'
-                          seriesItem.theData.stack = chartInfo.name
-                          seriesItem.theData.areaStyle = { opacity: 0.3 }
-                        }
-                        if ((chartInfo.type === 'line' || chartInfo.type === 'stackArea' || chartInfo.type === 'bar') && chartInfo.param && chartInfo.param.threshold) {
-                          seriesItem.theData.markLine = {
-                            silent: true,
-                            symbol: ['circle', 'circle'],
-                            label: {
-                              distance: this.computeDistance(chartDataFormat.getUnit(chartInfo.unit ? chartInfo.unit : 2).compute(chartInfo.param.threshold)),
-                              formatter (params) {
-                                return chartDataFormat.getUnit(chartInfo.unit ? chartInfo.unit : 2).compute(params.value)
-                              }
-                            },
-                            lineStyle: {
-                              color: '#d64f40',
-                              width: 2,
-                              type: 'dotted'
-                            },
-                            data: [{
-                              yAxis: Number(chartInfo.param.threshold)
-                            }]
-                          }
-                        }
-                        // 图表中每条线的名字,后半部分
-                        let host = ''// up,
-                        if (queryItem.metric.__name__) {
-                          host = `${queryItem.metric.__name__}{`// up,
-                        }
-                        const tagsArr = Object.keys(queryItem.metric)// ["__name__","asset","idc","instance","job","module","project"]
-                        // 设置时间-数据格式对
-                        let tempArr = []
-                        let dpsArr = []
-                        tempArr = queryItem.values
-                        dpsArr = Object.entries(queryItem.values)// [ ["0",[1577959830.781,"0"]], ["1",[1577959845.781,"0"]] ]
-                        dpsArr = dpsArr.map(item => {
-                          return [item[0], [item[1][0], Number(item[1][1])]]
-                        })
-                        // 判断是否有数据, && tagsArr.length > 0
-                        if (dpsArr.length > 0 && this.$refs['editChart' + chartItem.type]) {
-                          tagsArr.forEach((tag, i) => {
-                            if (tag !== '__name__') {
-                              host += `${tag}="${queryItem.metric[tag]}",`
-                            }
-                          })
-                          if (host.endsWith(',')) {
-                            host = host.substr(0, host.length - 1)
-                          }
-                          if (queryItem.metric.__name__) {
-                            host += '}'
-                          }
-                          if (!host || host === '') {
-                            host = chartItem.elements[innerPos].expression
-                          }
-                          // 处理legend别名
-                          let alias = dealLegendAlias(host, chartItem.elements[innerPos].legend)
-                          if (!alias || alias === '') {
-                            alias = host
-                          }
-                          legend.push({ name: host + '-' + chartItem.elements[innerPos].id + '-' + resIndex, alias: alias })
-                          // 图表中每条线的名字,去掉最后的逗号与空格:metric名称,  标签1=a,标签2=c
-
-                          seriesItem.theData.name = host + '-' + chartItem.elements[innerPos].id + '-' + resIndex
-                          // alert(seriesItem.theData.name);
-                          seriesItem.metric_name = seriesItem.theData.name
-                          // 将秒改为毫秒
-                          // alert('table=='+JSON.stringify(queryItem))
-                          seriesItem.theData.data = tempArr.map((dpsItem, dpsIndex) => {
-                            /* 曲线汇总暂不需要
-                              if (sumData.data[dpsIndex]) {
-                                const sumNum = sumData.data[dpsIndex][1] || 0;
-                                sumData.data[dpsIndex][1] = sumNum + dpsItem[1];
-                              } else {
-                                sumData.data[dpsIndex] = [dpsItem[0] * 1000, dpsItem[1]];
-                              }
-                              */
-                            // let t_date = new Date(dpsItem[0] * 1000);
-                            // let timeTmp = bus.timeFormate(t_date, 'YYYY-MM-DD HH:mm:ss');
-                            tableData.push({ // 表格数据
-                              // label: host.slice(host.indexOf('{') + 1,host.indexOf('}')),//label
-                              // metric: queryItem.metric.__name__?queryItem.metric.__name__:'',//metric列
-                              element: { element: host, alias: alias },
-                              // time: timeTmp,//采集时间
-                              // value: dpsItem[1],//数值
-                              data: [dpsItem[0] * 1000, dpsItem[1]]
-                            })
-                            return [dpsItem[0] * 1000, dpsItem[1]]
-                          })
-                          if (chartInfo.type === 'pie') {
-                            pieSeries.data.push({ value: bus.getSingleStatRlt(chartInfo.param.statistics, seriesItem.theData.data), name: host + '-' + chartItem.elements[innerPos].id + '-' + resIndex })
-                          } else if (chartInfo.type === 'bar' && chartInfo.param.statistics && chartInfo.param.statistics !== 'null') {
-                            pieSeries.data.push({ value: bus.getSingleStatRlt(chartInfo.param.statistics, seriesItem.theData.data), name: host + '-' + chartItem.elements[innerPos].id + '-' + resIndex })
-                          } else {
-                            series.push(seriesItem.theData)
-                            seriesItem = null
-                          }
-                        }
-                      })
-                    }
-                  }
-                } else {
-                  if (response.msg) {
-                    errorMsg = response.msg
-                  } else if (response.error) {
-                    errorMsg = response.error
-                  } else {
-                    errorMsg = response
-                  }
-                }
-              })
-              if (this.$refs['editChart' + chartItem.type]) {
-                if (chartInfo.type === 'pie') {
-                  series.push(pieSeries)
-                }
-                if (chartInfo.type === 'bar' && chartInfo.param.statistics && chartInfo.param.statistics !== 'null') {
-                  series.push(pieSeries)
-                }
-                const chartData = {
-                  chartItem: chartItem,
-                  series: series,
-                  singleStatRlt: singleStatRlt,
-                  legend: legend,
-                  tableData: tableData,
-                  dashboardId: this.filter.dashboardId,
-                  filter: this.filter,
-                  filterType: filterType,
-                  errorMsg: errorMsg
-                }
-                if (chartItem.type === 'table') { // 表格
-                  if (filterType === 'showFullScreen') { // 全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, tableData,
-                      this.filter.dashboardId, this.filter, filterType, errorMsg)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, tableData,
-                      this.filter.dashboardId, this.filter, '', errorMsg)
-                  }
-                } else if (chartItem.type === 'line' || chartItem.type === 'bar' || chartItem.type === 'stackArea' || chartItem.type === 4 || chartItem.type == 'pie') {
-                  if (series.length && chartItem.type === 4) { // 曲线汇总
-                    // series.push(sumData);//后续需要
-                  }
-                  if (filterType === 'showFullScreen') { // 全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, series,
-                      this.filter.dashboardId, this.filter, legend, filterType, errorMsg)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, series,
-                      this.filter.dashboardId, this.filter, legend, '', errorMsg)
-                  }
-                } else if (chartItem.type === 'singleStat') {
-                  if (filterType === 'showFullScreen') { // 全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, singleStatRlt,
-                      this.filter.dashboardId, this.filter, filterType, errorMsg)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, singleStatRlt,
-                      this.filter.dashboardId, this.filter, '', errorMsg)
-                  }
-                }
-              }
-            } else {
-              const type = chartItem.type
-              if (this.$refs['editChart' + chartItem.type]) {
-                if (type === 'table') {
-                  if (filterType === 'showFullScreen') { // table的全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
-                      this.filter, filterType)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
-                      this.filter)
-                  }
-                } else if (type === 'line' || type === 'bar' || type === 'stackArea' || chartItem.type === 4 || chartItem.type === 'pie') {
-                  if (filterType === 'showFullScreen') { // table的全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
-                      this.filter, filterType)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
-                      this.filter)
-                  }
-                } else if (chartItem.type === 'singleStat') {
-                  if (filterType === 'showFullScreen') { // 全屏查询
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, '',
-                      this.filter.dashboardId, this.filter, filterType)
-                  } else {
-                    this.$refs['editChart' + chartItem.type].setData(chartItem, '',
-                      this.filter.dashboardId, this.filter)
-                  }
-                }
-              }
-            }
-          }).catch((error) => {
-            if (error) {
-              this.$message.error(error.toString())
-              console.error(error)
-            }
-          })
-        })
-      }
-    }
-  }
-}
-</script>

nezha-fronted/src/components/common/project/L5/topologyTopTool.vue

@@ -1,165 +0,0 @@
-<template>
-  <div class="tool-top" id="tool-top">
-    <div id="undo" :class="['top-tool-item',]"  @click="undo"> <i class="nz-icon nz-icon-revoke" :title="$t('overall.revocation')"/> </div>
-    <div id="redo" :class="['top-tool-item',]" @click="redo"> <i class="nz-icon nz-icon-revoke1"  :title="$t('overall.redo')"/> </div>
-    <!--<div> 保存为图片 </div>-->
-    <div class="top-tool-item" @click="del" :title="$t('overall.delete')">  <i class="nz-icon nz-icon-delete"/> </div>
-    <div class="top-tool-item top-tool-item-scale">
-      <span class="scale-number">
-          <span class="scale-number-minus scale-number-symbol" @click="changeScale(-25)">-</span>
-          <el-popover
-            placement="bottom"
-            width="111"
-            trigger="hover"
-            class="scale-number-box"
-            popper-class="scale-number-popover no-style-class"
-           >
-            <div class="scale-num-pop" style=" width: 91px;min-width: 91px">
-              <div>缩放级别</div>
-              <div @click="scale(50)" :class="['scale-num-pop',scaleNum==50?'is-active':'']">50</div>
-              <div @click="scale(100)" :class="['scale-num-pop',scaleNum==100?'is-active':'']">100</div>
-              <div @click="scale(200)" :class="['scale-num-pop',scaleNum==200?'is-active':'']">200</div>
-            </div>
-            <span class="scale-number-content" slot="reference">{{scaleNum}}%</span>
-          </el-popover>
-          <span class="scale-number-add scale-number-symbol" @click="changeScale(25)">+</span>
-        </span>
-    </div>
-    <div  class="top-tool-item top-tool-item-switch">
-      <label>{{$t('project.topology.grids')}}</label>
-      <el-switch
-        v-model="option.grid"
-        :active-value="true"
-        :inactive-value="false"
-        @change="changeOption('grid')">
-      </el-switch>
-    </div>
-    <div class="top-tool-item top-tool-item-switch">
-      <label>{{$t('project.topology.rule')}}</label>
-      <el-switch
-        v-model="option.rule"
-        :active-value="true"
-        :inactive-value="false"
-        @change="changeOption('rule')">
-      </el-switch>
-    </div>
-  </div>
-</template>
-
-<script>
-import { getTopology } from '../../js/common'
-
-export default {
-  name: 'topologyTopTool',
-  data () {
-    return {
-      option: {
-        lineName: 'curve',
-        lineWidth: 1,
-        fromArrow: '',
-        toArrow: 'triangleSolid',
-        scale: 100,
-        grid: false,
-        rule: false
-      },
-      scaleNum: 100,
-      penLineType: [
-        { d: 'M5 14 a100,50 0 0,1 85,0', 'stroke-dasharray': '', name: 'curve' },
-        { d: 'M5 8 l40 0 l0 12 l40 0', 'stroke-dasharray': '', name: 'polyline' },
-        { d: 'M5 14 l85 0', 'stroke-dasharray': '', name: 'line' },
-        { d: 'M5 20 C0,8 50,0 85,0', 'stroke-dasharray': '', name: 'mind' }
-      ],
-      penLineFromTOArrow: [
-        { d: 'M5 14 l85 0', points: '', fill: '', stroke: '', 'stroke-width': '', name: '' },
-        { d: 'M5 14 l85 0', points: '5 14,20 9,20 19', fill: '#000000', stroke: '', 'stroke-width': '', name: 'triangleSolid' },
-        { d: 'M5 14 l85 0', points: '5 14,20 9,20 19', fill: '#ffffff', stroke: '#000000', 'stroke-width': '1', name: 'triangle' },
-        { d: 'M5 14 l85 0', fill: '#000000', stroke: '', 'stroke-width': '', cx: '10', cy: '14', r: '5', name: 'circleSolid' },
-        { d: 'M5 14 l85 0', fill: '#ffffff', stroke: '#000000', 'stroke-width': '1', cx: '10', cy: '14', r: '5', name: 'circle' }
-      ],
-      redoFlag: false
-    }
-  },
-  props: {
-    selection: {
-      type: Object,
-      require: true
-    },
-    index: {
-      type: Number,
-      require: true
-    },
-    toolShow: {
-      type: Object,
-      require: true
-    },
-    cachesIndex: {
-      type: Number,
-      require: true
-    }
-  },
-  mounted () {
-    const dataOption = getTopology(this.index).store.data
-    Object.keys(this.option).forEach(key => {
-      if (key === 'scale') {
-        this.scaleNum = (JSON.stringify(dataOption[key]) ? parseInt(dataOption[key] * 100) : this.scaleNum)
-      } else {
-        this.option[key] = (JSON.stringify(dataOption[key]) ? dataOption[key] : this.option[key])
-      }
-    })
-  },
-  methods: {
-    changeOption (key) {
-      // getTopology(this.index).data[key] = this.option[key]
-      const obj = {}
-      obj[key] = this.option[key]
-      if (key === 'grid') {
-        getTopology(this.index).setGrid(obj)
-      } else {
-        getTopology(this.index).setRule(obj)
-      }
-      getTopology(this.index).render()
-    },
-    undo () { // 撤销
-      getTopology(this.index).undo()
-    },
-    redo () { // 重做
-      getTopology(this.index).redo()
-    },
-    centerView () { // 居中显示
-      getTopology(this.index).centerView()
-    },
-    fitView () { // 自适应画布大小
-      getTopology(this.index).fitView()
-    },
-    changeScale (num) {
-      this.scaleNum += num
-      if (this.scaleNum < 25) {
-        this.scaleNum = 25
-      }
-      if (this.scaleNum > 400) {
-        this.scaleNum = 400
-      }
-      this.scale(this.scaleNum)
-    },
-    scale (val) {
-      this.scaleNum = val
-      getTopology(this.index).scale(val / 100)
-    },
-    del () {
-      const delObj = this.selection.pen ? [this.selection.pen] : this.selection.pens
-      this.$emit('del', delObj)
-    },
-    clear () {
-      const data = { ...getTopology(this.index).data }
-      data.pens = []
-      getTopology(this.index).open({})
-    },
-    toolShowChange (attr) {
-      this.$emit('toolShowChange', attr)
-    },
-    changeOpt (key, val) {
-
-    }
-  }
-}
-</script>

nezha-fronted/src/components/common/project/meta2d/js/meta2dMainCalc.js

@@ -4,9 +4,6 @@ import { activityDiagram } from '@meta2d/activity-diagram'
 import { classPens } from '@meta2d/class-diagram'
 import { sequencePens, sequencePensbyCtx } from '@meta2d/sequence-diagram'
 // import { chartsPens } from '@meta2d/le5le-charts'
-import {
-  disposeTopoOldData
-} from '../../L5/services/canvas.js'
 import { getTopology, setTopology, dealImg, topologyImg } from '@/components/common/js/common'
 import bus from '@/libs/bus'
 import topoUtil from '@/components/common/project/meta2d/js/topoUtil'

nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue

@@ -1113,9 +1113,7 @@
 <script>
 import nezhaColor from '@/components/common/nezhaColor'
 import meta2dSelectImage from '@/components/common/project/meta2d/meta2dSelectImage'
-import { imageTemp } from '@/components/common/project/L5/services/canvas'
 import { dealImg, getUUID, topologyImg } from '@/components/common/js/common'
-import imgDefault from '@/components/common/project/L5/services/img'
 import { ColorReverse, randomcolor } from '@/components/common/js/radomcolor/randomcolor'
 import lodash from 'lodash'
 import draggable from 'vuedraggable'

nezha-fronted/src/components/common/table/settings/softwareAssetTable.vue

@@ -56,6 +56,11 @@
               <i v-if="scope.row.asset&&scope.row.asset.name" class="nz-icon nz-icon-override" style="visibility: hidden" @click="onCopy(scope.row.asset.name)" :title="$t('overall.copyText')"></i>
             </div>
           </template>
+          <template v-else-if="item.prop === 'category'">
+            <div>
+              {{scope.row.type ? scope.row.type.category : '-'}}
+            </div>
+          </template>
           <template v-else-if="item.prop === 'project'">
             <div class="document-copy-block">
               <span class="document-copy-text"

nezha-fronted/src/components/common/timePicker.vue

@@ -204,6 +204,12 @@ export default {
         { id: 10, text: this.$t('dashboard.dashboard.lastSevenDay'), type: 'date', value: 7 },
         { id: 11, text: this.$t('dashboard.dashboard.lastThirtyDay'), type: 'date', value: 30 }
       ],
+      relativeData: [
+        { id: 13, text: 'today', type: 'relative', value: 0 },
+        { id: 14, text: 'Yesterday ', type: 'relative', value: 1 },
+        { id: 15, text: 'The day before yesterday', type: 'relative', value: 2 },
+        { id: 16, text: 'This day last week', type: 'relative', value: 7 }
+      ],
       timeShowData: [],
       nowTimeType: {
         id: 4,
@@ -232,6 +238,7 @@ export default {
   mounted () {
     this.timePickerLocked = localStorage.getItem('nz-time-picker-locked') ? JSON.parse(localStorage.getItem('nz-time-picker-locked')) : false
     this.timeShowData = JSON.parse(JSON.stringify(this.timeData))
+    this.timeShowData.push(...this.relativeData)
     this.timeShowData.shift()
     this.getItem()
     this.getUtcStr()
@@ -322,6 +329,7 @@ export default {
       this.showTime = this.nowTimeType = {
         id: 0,
         text: this.searchTime[0] + ' ' + this.$t('dashboard.dashboard.to') + ' ' + this.searchTime[1],
+        type: 'custom',
         value: -1
       }
       this.isCustom = true
@@ -527,7 +535,22 @@ export default {
       // }
     },
     setSearchTime (type, val, time) {
-      if (type === 'minute') {
+      if (type === 'relative') {
+        const now = new Date(bus.computeTimezone(new Date().getTime()))
+        let start = bus.timeFormate(now, 'YYYY-MM-DD')
+        let end = bus.timeFormate(now, 'YYYY-MM-DD HH:mm:ss')
+        console.log(start, end, val)
+        if (this.nowTimeType.id === 13) { // today
+          start += '00:00:00'
+          end += ''
+          start = this.momentTz(this.momentStrToTimestamp(start, 'YYYY-MM-DD HH:mm:ss'))
+          end = this.momentTz(this.momentStrToTimestamp(end, 'YYYY-MM-DD HH:mm:ss'))
+        }
+        console.log(start, end)
+        this.$set(this.searchTime, 0, start)
+        this.$set(this.searchTime, 1, end)
+        this.$set(this.searchTime, 2, this.nowTimeType.id)
+      } else if (type === 'minute') {
         const startTime = bus.timeFormate(
           new Date(bus.computeTimezone(new Date().getTime())).setMinutes(
             new Date(bus.computeTimezone(new Date().getTime())).getMinutes() -

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

@@ -852,7 +852,7 @@ export default {
       clearTopology()
       const nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
       this.nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
-      this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+      this.setSearchTime('searchTime')
       this.getData(this.filter)
       this.$store.dispatch('dispatchPanelTime', {
         time: this.searchTime,
@@ -871,27 +871,7 @@ export default {
         this.updatePath(param, path)
       }
     },
-    setSearchTime (type, val, nowTimeType) { // 设置searchTime
+    storeDispatchPanelTime () { // 设置searchTime
-      if (type === 'minute') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setMinutes(new Date(bus.computeTimezone(new Date().getTime())).getMinutes() - val), this.panelDateFormatTime)
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())), this.panelDateFormatTime)
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'm')
-      } else if (type === 'hour') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setHours(new Date(bus.computeTimezone(new Date().getTime())).getHours() - val), this.panelDateFormatTime)
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())), this.panelDateFormatTime)
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'h')
-      } else if (type === 'date') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setDate(new Date(bus.computeTimezone(new Date().getTime())).getDate() - val), this.panelDateFormatTime)
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())), this.panelDateFormatTime)
-        this.$set(this.searchTime, 0, startTime)
-        this.$set(this.searchTime, 1, endTime)
-        this.$set(this.searchTime, 2, val + 'd')
-      }
-      this.$refs.pickTime && (this.$refs.pickTime.$refs.timePicker.searchTime = this.searchTime)
       this.$store.dispatch('dispatchPanelTime', {
         time: this.searchTime,
         nowTimeType: this.nowTimeType
@@ -1199,7 +1179,7 @@ export default {
         this.nowTimeType = this.$lodash.cloneDeep(nowTimeType)
         // 刷新时间范围
         this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('searchTime')
         this.$store.dispatch('dispatchPanelTime', {
           time: this.searchTime,
           nowTimeType: this.nowTimeType
@@ -1219,7 +1199,7 @@ export default {
         const nowTimeType = this.nowTimeType = this.timePickerRange.nowTimeType
         this.searchTime = this.timePickerRange.time
         this.$refs.pickTime && this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType, this.searchTime)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('searchTime')
       })
     },
     // 设置默认刷新
@@ -1257,7 +1237,7 @@ export default {
     this.$store.commit('setMode', this.mode)
     await this.getTableData()
     if (this.nowTimeType.type) {
-      this.setSearchTime(this.nowTimeType.type, this.nowTimeType.value, this.nowTimeType)
+      this.setSearchTime('searchTime')
     }
     if (this.nowTimeType) {
       this.nowTimeType.start_time = this.searchTime[0]

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

@@ -3682,7 +3682,7 @@ export default {
         const nowTimeType = this.nowTimeType = this.timePickerRange.nowTimeType
         this.filterTime = this.timePickerRange.time
         this.$refs.pickTime && this.$refs.pickTime.$refs.timePicker.setTimeRange(this.nowTimeType, this.filterTime)
-        this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+        this.setSearchTime('filterTime')
       })
     },
     selectMetricsLogs (val, icon, label) {
@@ -4116,7 +4116,7 @@ export default {
       if (this.$refs.pickTime) {
         const nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
         this.nowTimeType = this.$refs.pickTime.$refs.timePicker.nowTimeType
-        this.setSearchTime(nowTimeType.type, nowTimeType.value)
+        this.setSearchTime('filterTime')
       }
       if (this.expressions && this.expressions.length >= 1) {
         let error = false
@@ -4155,7 +4155,7 @@ export default {
         const nowTimeType = data.nowTimeType
         this.filterTime = data.searchTime
         if (nowTimeType && nowTimeType.type) {
-          this.setSearchTime(nowTimeType.type, nowTimeType.value, nowTimeType)
+          this.setSearchTime('filterTime')
         }
         if (nowTimeType) {
           nowTimeType.start_time = this.filterTime[0]
@@ -4214,28 +4214,6 @@ export default {
       }
       this.$router.replace({ query: param })
     },
-    setSearchTime (type, val) { // 设置searchTime
-      if (type === 'minute') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setMinutes(new Date(bus.computeTimezone(new Date().getTime())).getMinutes() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'm')
-      } else if (type === 'hour') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setHours(new Date(bus.computeTimezone(new Date().getTime())).getHours() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'h')
-      } else if (type === 'date') {
-        const startTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setDate(new Date(bus.computeTimezone(new Date().getTime())).getDate() - val))
-        const endTime = bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())))
-        this.$set(this.filterTime, 0, startTime)
-        this.$set(this.filterTime, 1, endTime)
-        this.$set(this.filterTime, 2, val + 'd')
-      }
-      this.$refs.pickTime.$refs.timePicker.searchTime = this.filterTime
-    },
     storeHistory () {
       const expire = 24
       const historyJson = localStorage.getItem(this.historyParam.key)

nezha-fronted/src/components/page/monitor/project/project.vue

@@ -67,7 +67,6 @@
 
 <script>
 import bus from '@/libs/bus'
-import topologyL5 from '@/components/common/project/topologyL5'
 import meta2dMain from '@/components/common/project/meta2d/meta2dMain'
 import beforeMeta2d from '@/components/common/mixin/beforeMeta2d'
 import { clearTopology } from '@/components/common/js/common'
@@ -76,7 +75,6 @@ export default {
   name: 'project2',
   mixins: [beforeMeta2d],
   components: {
-    topologyL5,
     meta2dMain
   },
   data () {