<template>
  <div class="flowBox">
    <div class="node" v-for="node in flowData.Process.Nodes.ManualNode" :key="node.id">{{node.name}}</div>
  </div>
</template>

<script>
export default {
  name:"",
  components:{},
  props:{
    flowData:{
      type:Object,
      default:null
    }
  },
  data(){
    return {
    }
  },
  created(){},
  mounted(){
    this.$nextTick(()=>{
      console.log(this.flowData,'flowData.Nodes'); 
    })
    
  },
  methods:{},
  computed: {},
  watch: {},
}
</script>
<style scoped  lang="less">
.flowBox{
		width: 150%;
		height: 100%;
  	//    网格背景
		background-image: -webkit-gradient(
				linear,
				left top,
				right top,
				color-stop(10%, rgba(0, 0, 0, 0.15)),
				color-stop(10%, rgba(0, 0, 0, 0))
			),
			-webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(0, 0, 0, 0.15)), color-stop(10%, rgba(0, 0, 0, 0)));
		background-image: linear-gradient(
				90deg,
				rgba(0, 0, 0, 0.15) 10%,
				rgba(0, 0, 0, 0) 10%
			),
			linear-gradient(rgba(0, 0, 0, 0.15) 10%, rgba(0, 0, 0, 0) 10%);
		background-size: 10px 10px;
}
</style>