时序图

wente

2024-10-30 5f7101c8de0603c876b70735a881caa2d8437130

 web/src/views/modules/taskReliability/TimeDiagram.vue

@@ -13,12 +13,12 @@
            <zt-select v-model="dataForm.id" :datas="simulatList" @change="onSimulatSelected"/>
          </zt-form-item>
          <zt-form-item label="时间分片" prop="samplPeriod">
            <el-input v-model="dataForm.samplPeriod" readonly="false">
            <el-input v-model="dataForm.samplPeriod" readonly="false" style="width: 150px;vertical-align: baseline;">
              <template slot="append">分钟</template>
            </el-input>
          </zt-form-item>
          <zt-form-item label="仿真次数" prop="simulatFrequency">
            <el-input v-model="dataForm.simulatFrequency" readonly="false">
            <el-input v-model="dataForm.simulatFrequency" readonly="false" style="width: 150px;">
            </el-input>
          </zt-form-item>
          <zt-form-item>
@@ -141,7 +141,9 @@
      window.removeEventListener('scroll', this.handleScroll,true);
    },
    mounted() {
      // alert(`mounted执行了`)
      this.getProductList()
      this.init()
      this.$refs.textDiagram.init()
      this.$refs.timeDiagramThumbnail.init()
    },
@@ -162,8 +164,6 @@
        this.$refs.timeDiagramThumbnail.getNodePointX(left,this.bigWidth)
      },
      init() {
        console.log(document.documentElement.clientWidth, 'document.documentElement.clientWidth')
        console.log(document.documentElement.clientHeight, 'document.documentElement.clientHeight')
        this.graph = new Graph({
          container: document.getElementById('timeDiagram'),
          // width: document.documentElement.clientWidth - 100,
@@ -231,8 +231,7 @@
                line: {
                  stroke: '#A2B1C3',
                  strokeWidth: 2,
                  sourceMarker: 'none',
                  targetMarker: 'none'
                  targetMarker: null,
                }
              },
              tools: {
@@ -246,8 +245,8 @@
        this.knob = document.createElement('div',false)
        this.knob.style.position = 'absolute'
        document.getElementById('timeDiagram').appendChild(this.knob)
        this.graph.centerContent()

        this.graph.positionContent('left',{ padding: { left: 0 }})
        // this.graph.centerContent()
        Graph.registerNode(
          'custom-rect',
          {
@@ -582,7 +581,7 @@
        this.$nextTick(() => {
          this.$refs.ProductModelTree.getProductList()
        })
        this.init()
        // this.init()
      },
      onTaskSelected(data) {
        console.log(data, ' onProductSelected(data)')
@@ -632,16 +631,12 @@
          this.$refs.timeDiagramThumbnail.getThumbnail(smallDiagramJson)
        } else {
          this.graph.fromJSON(this.emptyJson)
          this.graph.centerContent()
          this.graph.positionContent('left',{ padding: { left: 0 }})
          // this.graph.centerContent()
          //this.graph.zoomToFit()
          this.graph.freeze()
        }
        console.log(res.data)
      },
      graphRightTranslate(){
        this.left+=200
        this.graph.scrollToPoint(this.left, null,  { animation: { duration: 400 }})
        // this.graph.setScrollbarPosition(100, null, { animation: { duration: 200, easing: 'linear' }})
      },
      getPoint(x,smallWidth){
        let pointX = Number((x * (this.bigWidth / smallWidth )).toFixed(0))