dm-manage-web/src/views/finance/expense/index.vue

<template>
  <div class="p20">
    <el-tabs v-model="expenseType" tab-position="left">
      <el-tab-pane label="报名点报销" v-hasPermi="['finance:expense:signPlace']" name="1">
        <PlaceSignExpense v-if="expenseType==1" :type="expenseType" />
      </el-tab-pane>
      <el-tab-pane label="学员成交报销" v-hasPermi="['finance:expense:sign']" name="2">
        <SignExpense v-if="expenseType==2" :type="expenseType" />
      </el-tab-pane>
      <el-tab-pane label="美团刷单报销" v-hasPermi="['finance:expense:meituan']" name="3">
        <MeituanExpense v-if="expenseType==3" :type="expenseType" />
      </el-tab-pane>
      <el-tab-pane label="办公费用报销" v-hasPermi="['finance:expense:office']" name="4">
        <OfficeExpense v-if="expenseType==4" :type="expenseType" />
      </el-tab-pane>
      <el-tab-pane label="账户充值报销" v-hasPermi="['finance:expense:account']" name="5">
        <AccountExpense v-if="expenseType==5" :type="expenseType" />
      </el-tab-pane>
    </el-tabs>

  </div>
</template>

<script>
import RightPane from './RightPane';
import SignExpense from './components/SignExpense'
import PlaceSignExpense from './components/PlaceSignExpense'
import OfficeExpense from './components/OfficeExpense'

import AccountExpense from './components/AccountExpense'
import MeituanExpense from './components/MeituanExpense'

export default {
  components: {
    RightPane, AccountExpense, MeituanExpense, OfficeExpense, PlaceSignExpense, SignExpense
  },
  data() {
    return {
      expenseType: '1'
    };
  }
};
</script>

<style lang="scss" scoped></style>