<template>
 <div class="position-re">
   <my-breadcrumb class="my-breadcrumb" :breadcrumb-arr="taskSetDetailArr"/>
   <div class="back" @click="back"><span class="fa fa-reply cur-po " >返回</span></div>
   <flow-chart :operation-type="operationType" :class="{'h0':settingType}"  @changeFormD="changeFormD" @editOrAddGooFlow="editOrAddGooFlow" v-model:setting-type="settingType" :current-op-obj="myForm" />
   <chart-sync-rule  @click="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-if="['2','7','8','9','10','15','16'].includes(settingType)"/>
   <chart-clear-rule  @click="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-else-if="['4'].includes(settingType)"/>
   <chart-quality-check-rule @back="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-else-if="['3'].includes(settingType)"/>
   <chart-label-rule  @click="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-else-if="['6'].includes(settingType)"/>
   <chart-safe-rule  @click="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-else-if="['5'].includes(settingType)"/>
   <process-start-page @back="back" :current-op-obj="currentOpObj" :operation-type="operationType"  v-model:setting-type="settingType" v-else-if="['start'].includes(settingType)"/>
 </div>
</template>

<script>
import TaskSetHome from "@/view/other/c-views/data-handle/task-manage/task-set/TaskSetHome.vue";
import MyBreadcrumb from "@/components/common/MyBreadcrumb.vue";

import FlowChart from "@/components/FlowChart.vue";
import {computed, onBeforeMount, ref} from "vue";
import ChartSyncRule from "@/view/other/c-views/data-handle/task-manage/task-set/ChartSyncRule.vue";
import ChartClearRule from "@/view/other/c-views/data-handle/task-manage/task-set/ChartClearRule.vue";
import ChartQualityCheckRule from "@/view/other/c-views/data-handle/task-manage/task-set/ChartQualityCheckRule.vue";
import ChartLabelRule from "@/view/other/c-views/data-handle/task-manage/task-set/ChartLabelRule.vue";
import ChartSafeRule from "@/view/other/c-views/data-handle/task-manage/task-set/ChartSafeRule.vue";
import ProcessStartPage from "@/view/other/c-views/data-handle/task-manage/task-set/ProcessStartPage.vue";
import {addProcessMbDData, editProcessMbDData} from "@/service/zsk/process-mb";
import {handleMes} from "@/unit/element-ui/tip";
import {uuidv4} from "@/unit/random";

export default {
  name: "TaskSetDetail",
  components: {
    ProcessStartPage,
    ChartSafeRule,
    ChartLabelRule,
    ChartQualityCheckRule, ChartClearRule, ChartSyncRule, FlowChart, MyBreadcrumb, TaskSetHome},
  props:{
    currentOpObj:{

    },
    operationType:{}
  },
  setup(props,{emit}) {
    const myForm = ref({

    })
    function back() {
      if (!settingType.value){
        emit('changeOperation','',{})
      }else {
        settingType.value = ''
      }
    }
    function changeFormD(forms2){

      myForm.value= {
        ...myForm.value,
        ...forms2.value,
        CATALOG_NAME:forms2.title
      }
    }
    function editOrAddGooFlow(allNodes,allLine,data2) {

      let url = props.operationType !== 'add'?editProcessMbDData:addProcessMbDData
      console.log(allLine,'allLine')
      let nodeObj = {

      }
      let lineObj = {

      }
      allNodes.forEach(i => {
        nodeObj[i.id] = {
          top:i.position().y,
          left:i.position().x,
          nood_id:i.id,
          name:i.label,
          width:100,
          height:40,
          type:'rect',
          yw_type:i.data.type
        }
      })
      allLine.forEach(i => {
        lineObj[i.id] = {
          from:i.source.cell,
          to:i.target.cell,
        }
      })
      let params = {
        nodes:nodeObj,
        id:data2.id || uuidv4(),
        catalog_code:data2.CATALOG_CODE || props.currentOpObj.CATALOG_CODE,
        // is_template:'1',
        state:props.currentOpObj.STATE || '',
        title:data2.CATALOG_NAME ||props.currentOpObj.CATALOG_NAME,
        lines:lineObj,
        initNum:props.currentOpObj?.INITNUM ||1
      }
      // if (props.operationType !== 'add'){
      //   params.id = props.currentOpObj.id
      // }
      // if (data2.id){
      //   params.id = data2.id
      // }
      url(params).then(res => {
        handleMes(res,() => {
          emit('changeOperation','')
        })
      })
    }
    const settingType = ref('')
    const taskSetDetailArr = computed(() => {
      return [
        {
          name:'任务管理  ',
        },
        {
          name:'任务配置',
        },
        {
          name:myForm.value.CATALOG_NAME,
        },

      ]
    })
    onBeforeMount(() => {

      if (props.currentOpObj){
        myForm.value = {
          ...props.currentOpObj
        }
      }
    })
    return {
      taskSetDetailArr,
      settingType,
      back,
      editOrAddGooFlow,
      changeFormD,
      myForm
    }
  }
}
</script>

<style scoped lang="scss">
.my-breadcrumb{
  margin-bottom: 20px;
}
.h0{
  height: 0;
  overflow: hidden;
}
</style>
