Vue_New/src/xt_pages/stock/drugs/drugIndex.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>
    <div class="app-container">
      <div class="service-box">
        <el-tabs v-model="activeName">
          <el-tab-pane label="入库明细" name="first">
            <drug-in-order></drug-in-order>
          </el-tab-pane>
          <el-tab-pane label="退货明细">
            <drug-cancel-order></drug-cancel-order>
          </el-tab-pane>
          <el-tab-pane label="出库明细">
            <drug-out-detail></drug-out-detail>
          </el-tab-pane>
          <el-tab-pane label="退库明细">
            <drug-cancel-detail></drug-cancel-detail>
          </el-tab-pane>

        </el-tabs>
      </div>
    </div>
  </div>
</template>
<script>
import BreadCrumb from '@/xt_pages/components/bread-crumb'
import DrugInOrder from '@/xt_pages/stock/drugs/components/drugInOrder'
import DrugCancelOrder from '@/xt_pages/stock/drugs/components/drugCancelOrder'
import DrugOutDetail from '@/xt_pages/stock/drugs/components/drugOutDetail'
import DrugCancelDetail from '@/xt_pages/stock/drugs/components/drugCancelDetail'
export default {
  components: {
    BreadCrumb,
    DrugInOrder,
    DrugCancelOrder,
    DrugOutDetail,
    DrugCancelDetail
  },
   data() {
      return {
        crumbs: [
          { path: false, name: '库存管理' },
          { path: '/stock/drugs/stock/detail', name: '出入库明细查询' }
        ],
        activeName: 'first'

      }
    },
}
</script>