<template>
  <section>
    <div class="clear site_container">
      <!-- <div class="fl left_side">
        <test-nav :array="testData" @change="handleChange"></test-nav>
      </div> -->
      <div>
        <test-one v-if="currentIndex === 0"></test-one>
        <test-two v-if="currentIndex === 1"></test-two>
        <test-three v-if="currentIndex === 2"></test-three>
      </div>
    </div>
    <!-- <div class="pop_wrapper">
      <div class="pop_box">
        <h2>验证信息</h2>
        <div class="info-box">
          <div class="cinfo"><span>用户名</span><input type="text"></div>
          <div class="cinfo"><span>密码</span><input type="password"></div>
        </div>
        <div class="pop_btns_box">
          <div class="pop_btn pop_btn_primary">确定</div>
          <div class="pop_btn">退出</div>
        </div>
      </div>
    </div>
    <div class="modal"></div> -->
  </section>
</template>

<script>
import NavBar from '@components/NavBar.vue'
import SiteNav from '@components/SiteNav.vue'
import TestNav from '@components/TestNav.vue'
import TestOne from '@components/TestOne.vue'
import TestTwo from '@components/TestTwo.vue'
import TestThree from '@components/TestThree.vue'

export default {
  name: 'TaskManage',
  components: {
    NavBar,
    SiteNav,
    TestNav,
    TestOne,
    TestTwo,
    TestThree
  },
  data () {
    return {
      // pkId: '',
      // dataList: [
      //   {
      //     task_id: '1',
      //     task_no: '1001',
      //     next_point: '1001',
      //     status: '正在执行',
      //     time: '2021-07-14  12:00:00'
      //   },
      //   {
      //     task_id: '2',
      //     task_no: '1002',
      //     next_point: '1001',
      //     status: '未执行',
      //     time: '2021-07-15  12:00:00'
      //   },
      //   {
      //     task_id: '3',
      //     task_no: '1003',
      //     next_point: '1001',
      //     status: '未执行',
      //     time: '2021-07-18  12:00:00'
      //   },
      //   {
      //     task_id: '4',
      //     task_no: '1004',
      //     next_point: '1001',
      //     status: '未执行',
      //     time: '2021-09-10  12:00:00'
      //   }
      // ],
      testData: [
        {
          label: '搬运站点',
          index: 0
        },
        {
          label: '任务列表',
          index: 1
        },
        {
          label: '任务操作',
          index: 2
        }
      ],
      currentIndex: 2
    }
  },
  mounted () {
    // init
  },
  methods: {
    // toRadio (e) {
    //   this.pkId = this.pkId === e.task_id ? '' : e.task_id
    // },
    handleChange (i) {
      this.currentIndex = i
    }
  }
}
</script>

// <style lang="stylus" scoped>
// @import '~@style/mixin'
// .pop_btns_box
//   _wh(100%,.88rem)
//   _fj(center)
//   margin-top .2rem
// .pop_btn
//   _wh(1.8rem,.88rem)
//   background #989EBB
//   border 2px solid #8B90A6
//   border-radius: .28rem
//   _font(.32rem,.88rem,#fff,500,center)
//   margin 0 .12rem
// .pop_btn_primary
//   background #FD6A35
//   border 2px solid #E74F19
// .pop_wrapper
//   position fixed
//   top 0
//   bottom 0
//   left 0
//   right 0
//   text-align center
//   z-index 10000
//   &::after
//     content ""
//     display inline-block
//     height 100%
//     width 0
//     vertical-align middle
// .modal
//   position fixed
//   left 0
//   top 0
//   _wh(100%,100%)
//   opacity .5
//   background #000
//   z-index 999
// .pop_box
//   display inline-block
//   vertical-align middle
//   _wh(9rem,4.8rem)
//   padding .2rem
//   background-color #fff
//   border-radius .16rem
//   overflow hidden
//   h2
//     _font(.4rem,.56rem,#464646,600,center)
// .info-box
//   font-size .3rem
//   span
//     display inline-block
//     width 1.8rem
//     margin-right .2rem
//   input
//     border 1px solid #464646
//     border-radius 8px
//     height .9rem
//     line-height .9rem
//     width 4.6rem
//     margin-top .22rem
//     margin-bottom .2rem
//     text-indent .14rem
// </style>
