<template>
  <div class="dingflow-design">
    <div class="box-scale" id="box-scale">
      <nodeWrap :nodeConfig.sync="nodeConfig"></nodeWrap>
      
      <div class="end-node">
        <div class="end-node-circle"></div>
        <div class="end-node-text">流程结束</div>
      </div>
    </div>
    <workflow-setting />
  </div>
</template>

<script>
import './css/workflow.css';
import nodeWrap from './nodeWrap.vue';
import workflowSetting from './workflow-setting.vue';
import { mapState, mapMutations } from 'vuex';
export default {
  name: 'workflow',
  components: { nodeWrap, workflowSetting },
  data() {
    return {
      nodeConfig: [ {
      index:1,
      name: '申请',
      type: 0,
      // conditionNodes: [],
      // content: '申请申报',
      sendRuleVO: {
        // hjlx: '212',
        cyzlb: 1,
        cyzjgfw: [],
        cyzgw: [],
      },
    },
    ]
    };
  },
    computed: {
    ...mapState({
      workflowSettingConfigobj: (state) => state.workflow.workflowSettingConfigobj,
    }),
  },
  mounted() {
    // this.nodeConfig =[ {
    //   index:1,
    //   name: '申请',
    //   type: 0,
    //   // conditionNodes: [],
    //   content: '申请申报',
    //   sendRuleVO: {
    //     hjlx: '212',
    //     cyzlb: 1,
    //     cyzjgfw: [],
    //     cyzgw: [],
    //   },
    // },
    // ];
    if(!this.workflowSettingConfigobj){
       this.SET_WORKFLOWSETTINGCONFIGOBJ(this.nodeConfig);
    }else{
      this.nodeConfig=this.workflowSettingConfigobj;
    }
    // console.log('workflowSettingConfigobj',this.workflowSettingConfigobj);
    // this.nodeConfig = this.workflowSettingConfigobj
  },methods:{
    ...mapMutations(['SET_WORKFLOWSETTINGCONFIGOBJ']),
  },
    watch: {
    nodeConfig: {
      handler(config) {
        console.log('watch里面workflowSettingConfigobj', config);
        // this.SET_WORKFLOWSETTINGCONFIGOBJ(config);
        //  this.workflowSettingConfigobj = config;
        // console.log(this.workflowSettingConfigobj);
        // this.workflowSettingConfigobj = config;
      },
      deep: true,
    },
    workflowSettingConfigobj:{
       handler(config) {
        console.log('watch里面workflowSettingConfigobj111', config);
        this.nodeConfig = config;
        // this.SET_WORKFLOWSETTINGCONFIGOBJ(config);
        //  this.workflowSettingConfigobj = config;
        // console.log(this.workflowSettingConfigobj);
        // this.workflowSettingConfigobj = config;
      },
      deep: true,
    }
  },
};
</script>

<style lang="less" scoped>
.dingflow-design{
  overflow: auto;
}
</style>
