<template>
  <a-card :bordered="true">

    <a-tabs style="text-align: center">
      <a-tab-pane tab="流程正文" key="1" forceRender>
        <process-udget-plan-form :isNew="isNew" :processData="processData" :disabled="disabled" @afterSubmit="afterSub" @close="close" :task="task" @passTask="passTask" @backTask="backTask"/>
      </a-tab-pane>

        <a-tab-pane tab="流程节点图" key="2" forceRender>
          <historic-pictrue :pictureId="pictureId" :procInstId="procInstId" />
        </a-tab-pane>
        <a-tab-pane tab="审批历史" key="3" forceRender>
          <historic-detail :pictureId="pictureId" :procInstId="procInstId"/>
        </a-tab-pane>
    </a-tabs>
  </a-card>
</template>

<script>
  import ProcessUdgetPlanForm from './ProcessUdgetPlanForm'
  import historicPictrue from '../historicPictrue'
  import historicDetail from '../historicDetail'
  export default {
    name: 'ProcessUdgetPlan',
    components: {ProcessUdgetPlanForm,historicPictrue, historicDetail},
    data() {
      return {
      }
    },
    props: {
      /*流程数据*/
      isNew: {type: Boolean, default: false, required: false},
      task: {type: Boolean, default: false, required: false},
      processData:{
        type:Object,
        default:()=>{return {}},
        required:false
      },
      pictureId: {
        type: String,
        default: '',
        required: true
      },
      procInstId: {
        type: String,
        default: '',
        required: true
      },
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    // props: {
    //   /*流程数据*/
    //   processData:{
    //     type:Object,
    //     default:()=>{return {}},
    //     required:false
    //   },
    //   /*是否新增*/
    //   isNew: {type: Boolean, default: false, required: false},
    //   /*是否处理流程*/
    //   task: {type: Boolean, default: false, required: false},
    //   //流程表单data
    //   formData: {
    //     type: Object,
    //     default: () => {
    //     },
    //     required: false
    //   },
    //   //表单模式：false流程表单 true普通表单
    //   formBpm: {
    //     type: Boolean,
    //     default: false,
    //     required: false
    //   },
    //   //表单禁用
    //   disabled: {
    //     type: Boolean,
    //     default: false,
    //     required: false
    //   }
    // },
    methods: {
      afterSub(formData){
        this.$emit('afterSubmit',formData)
      },
      close() {
        //todo 关闭后的回调
        this.$emit('close')
      },
      /*通过审批*/
      passTask() {
        this.$emit('passTask')
      },
      /*驳回审批*/
      backTask() {
        this.$emit('backTask')
      },
    },
  }
</script>

<style scoped>

</style>