<template>
  <div class="report-container">
    <el-tabs v-model="value" style="color: #fff">
      <el-tab-pane label="可申请报表" name="1">
        <ReportApply v-if="value === '1'" />
      </el-tab-pane>
      <el-tab-pane label="报表申请记录" name="2">
        <ReportRecord v-if="value === '2'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup lang="ts">
import { shallowRef } from "vue";
import ReportApply from "./components/reportApply/index.vue";
import ReportRecord from "./components/reportRecord/index.vue";

const value = shallowRef("1");
</script>

<style scoped lang="scss">
.report-container {
  // background: #fff;
  height: calc(100vh - 48px);

  :deep(.el-tabs__header) {
    background-color: #fff;
    padding: 10px;
    padding-bottom: 0px;
  }
}
</style>
