工况管理

wente

2024-11-07 12e38a9c58fa02cc42104793609ac4e240bc6184

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

@@ -1,13 +1,16 @@
<template>
  <div>
        <div class="fa-card-a">

          <div id="containerImg" style="border: 1px solid #EAEBEE;border-radius: 6px;
        box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);height: 100%">
    <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
      <el-form-item :label="modelName"></el-form-item>
      <el-form-item style="float: right">
        <el-button type="danger" @click="closeDigram()">关闭</el-button>
      </el-form-item>
    </el-form>
          <div  style="border: 1px solid #EAEBEE;border-radius: 6px;box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);height: calc(100vh - 233px);">
            <div id="containerImg"></div>
          </div>
          <config-node ref="configNode" v-show="type === 'node'"/>
          <config-edge ref="configEdge" v-show="type === 'edge'"/>
        </div>
  </div>
</template>

@@ -668,17 +671,22 @@
        this.projectId = this.$route.params.projectId
        console.log(this.$route.params.projectId, 'this.$route.params.projectId')
        console.log(this.$route.params.diagramId, 'this.$route.params.diagramId')
      }
      },
    },
    mounted() {
      this.type = 'grid'
    },
    methods: {
      init(row) {
        this.modelName = row.modelName
        this.modelName = row.title
        this.dataForm.id = row.id
        this.collapseTransition = row.collapseTransition
        this.initDigram()
        console.log(this.dataForm, 'init(row){')
      },
      closeDigram(){
        this.collapseTransition = 16
        this.$emit('closeWindow',this.collapseTransition)
      },
      async getDiagram(modelId) {
        this.isFirstLoad = true;
@@ -697,7 +705,8 @@
          this.isFirstLoad = false;
          console.log(this.diagramJson.cells.length, 'this.diagramJson.cells.length')

          this.graph.positionContent('left')
          // this.graph.positionContent('left')
          this.graph.positionContent('left',{ padding: { left: 0 }})
          // this.graph.centerContent()
          // this.graph.zoomToFit()
        } else {
@@ -719,7 +728,7 @@
        this.graph = new Graph({
          container: document.getElementById('containerImg'),
          width: document.documentElement.clientWidth,
          height: document.documentElement.clientHeight - 200,
          height: document.documentElement.clientHeight - 240,
          // async: true,
          grid: {
            visible: true,
@@ -734,23 +743,16 @@
              }
            },
          },
          scroller: {
            enabled: true,
            pageVisible: true,
            autoResize: true,
            pageBreak: true,
            pannable: true,
            minVisibleWidth: 200,
            minVisibleHeight: 200,
            modifiers: 'shift',
          },
          mousewheel: {
            enabled: true,
            zoomAtMousePosition: true,
            modifiers: 'ctrl',
            minScale: 0.5,
            maxScale: 3,
          },
          // scroller: {
          //   enabled: true,
          //   pageVisible: true,
          //   autoResize: true,
          //   pageBreak: true,
          //   pannable: true,
          //   minVisibleWidth: 200,
          //   minVisibleHeight: 200,
          //   modifiers: 'shift',
          // },
          connecting: {
            router: {
              name: 'manhattan',
@@ -822,12 +824,12 @@
          },
          resizing: true,
          rotating: true,
          selecting: {
            enabled: true,
            rubberband: true,
            rubberEdge: true,
            showNodeSelectionBox: true,
          },
          // selecting: {
          //   enabled: true,
          //   rubberband: true,
          //   rubberEdge: true,
          //   showNodeSelectionBox: true,
          // },
          snapline: true,
          keyboard: true,
          clipboard: true,
@@ -1451,8 +1453,8 @@
          leftTopY = centerY
        let dragNodeType = dragNode.getData().nodeType
        if (dragNodeType === 'node') {
          width = 60
          height = 60
          width = 100
          height = 70
        } else if (dragNodeType === 'dashedBox') {
          width = 60
          height = 40
@@ -1461,7 +1463,7 @@
          height = 175
        } else {
          width = 270
          height = 60
          height = 70
        }
        leftTopX = centerX - width / 2
        leftTopY = centerY - height / 2