| | |
|---|
| | | <template> |
|---|
| | | <el-main> |
|---|
| | | <div class="switchStyle"> |
|---|
| | | <el-button size="small" @click="switchCss" >切换</el-button> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div class="scale"> |
|---|
| | | <el-button icon="el-icon-plus" size="small" @click="scale += 10" :disabled="scale >= 150" circle></el-button> |
|---|
| | | <span>{{ scale }}%</span> |
|---|
| | | <el-button icon="el-icon-minus" size="small" @click="scale -= 10" :disabled="scale <= 40" circle></el-button> |
|---|
| | | <!-- <el-button @click="validate">校验流程</el-button>--> |
|---|
| | | </div> |
|---|
| | | <div class="design" :style="'transform: scale('+ scale / 100 +');'"> |
|---|
| | | <process-tree ref="process-tree" @selectedNode="nodeSelected"/> |
|---|
| | |
|---|
| | | }, |
|---|
| | | computed:{ |
|---|
| | | selectedNode(){ |
|---|
| | | console.log("ProcessDesign-selectedNode") |
|---|
| | | return this.$store.state.selectedNode |
|---|
| | | } |
|---|
| | | }, |
|---|
| | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | switchCss(){ |
|---|
| | | |
|---|
| | | console.log(this.$cssSrc) |
|---|
| | | console.log(this.$isVertical) |
|---|
| | | |
|---|
| | | if(this.$isVertical){ |
|---|
| | | this.$cssSrc=require('@/assets/flowDesign.scss') |
|---|
| | | this.$isVertical=false; |
|---|
| | | }else{ |
|---|
| | | this.$cssSrc=require('@/assets/flowDesignVertical.scss') |
|---|
| | | this.$isVertical=true; |
|---|
| | | } |
|---|
| | | this.$forceUpdate() |
|---|
| | | |
|---|
| | | }, |
|---|
| | | validate(){ |
|---|
| | | return this.$refs["process-tree"].validateProcess() |
|---|
| | | }, |
|---|
| | | nodeSelected(node){ |
|---|
| | | console.log('配置节点aaa', node) |
|---|
| | | this.showConfig = true |
|---|
| | | } |
|---|
| | | }, |
|---|
