<!--
  @description: 发起评审费报销
  @Modifier: 肖文龙
  @routerPath: /fee/evalfeeApplyStep
  @date: 2020/06/09
-->
<template>
  <div class="p0-16">
    <!-- 返回 -->
    <div class="title title_border" @click="back()">
      <i class="iconfont icon-fanhui mr10" />专家评审费报销
    </div>
    <div>
      <tabs ref="tabs" :active="active" :is-open-all="isOpenAll" :list="tabsList" />
    </div>
    <div>
      <router-view ref="evalfeeApply" :eval-fee-data="evalFeeData" @stepPage="_stepPage" />
    </div>
  </div>
</template>
<script>
/* 组件*/
import tabs from '@comp/common/tabsParams'
export default {
  name: 'EvalfeeApplyStep',
  components: {
    tabs
  },
  data() {
    return {
      active: 1, // 在没有保存时，前几active可以点击进行切换
      isOpenAll: false, // 是否开启所有节点
      tabsList: [
        {
          name: '报销申请',
          path: '/fee/evalfeeApplyStep/evalfeeApplyInfo-add'
        },
        {
          name: '发放明细',
          path: '/fee/evalfeeApplyStep/evalfeeGrant-add'
        }
      ],
      // 传给子组件编辑带入id
      evalFeeData: {
        evalFeeId: this.$route.params.evalFeeId, // 评审费id
        meetingId: this.$route.params.meetingId // 会议id
      }
    }
  },
  watch: {
    $route() {
      this.isOpenChange()// 节点打开状态
    }
  },
  created() {
    this.isOpenChange()// 节点打开状态
  },
  methods: {
    // 节点打开状态
    isOpenChange() {
      // 判断是否报销Id 如果有则所有tabs可切换
      if (this.evalFeeData.evalFeeId) {
        this.isOpenAll = true
      }
    },
    // 控制上一步 下一步跳转页面 子组件传给父组件
    // prev 上一步 next 下一步 或者是数字直接指定展示第几步的页面
    _stepPage(page) {
      // 调用步骤条-组件方法
      this.$refs.tabs.tabPage(page)
    },
    /*
      * 暂存接口
      * type参数 draft 点击步骤条切换-进行保存草稿
      * */
    save(type) {
    // 调用公共页面的方法-暂存草稿
      if (this.$refs.evalfeeApply.saveData) {
        this.$refs.evalfeeApply.saveData(type)
      }
    },
    // 返回
    back() {
      this.$router.push({
        path: '/fee/evalfeeApply-list'
      })
    }
  }
}
</script>
<style lang="less" scoped>

</style>
