44 lines
1.5 KiB
Vue
44 lines
1.5 KiB
Vue
<template>
|
|
<div class="layout-padding">
|
|
<div class="layout-padding-auto layout-padding-view">
|
|
<el-tabs v-model="activeName" class="demo-tabs">
|
|
<div v-for="v in data.tabList" :key="v.id">
|
|
<el-tab-pane :label="v.label" :name="v.id">
|
|
<div></div>
|
|
</el-tab-pane>
|
|
</div>
|
|
</el-tabs>
|
|
<div class="flex justify-center">
|
|
<recharge-package v-if="activeName == 10" />
|
|
<extra-price v-if="activeName == 20" />
|
|
<refund v-if="activeName == 30" />
|
|
<Code v-if="activeName == 40" />
|
|
<off-line v-if="activeName == 50" />
|
|
<third-zy v-if="activeName == 60" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const RechargePackage = defineAsyncComponent(() => import("./components/recharge-package/index.vue"))
|
|
const Code = defineAsyncComponent(() => import("./components/code/index.vue"))
|
|
const Refund = defineAsyncComponent(() => import("./components/refund/index.vue"))
|
|
const OffLine = defineAsyncComponent(() => import("./components/off-line/index.vue"))
|
|
const ExtraPrice = defineAsyncComponent(() => import("./components/extra-price/index.vue"))
|
|
const ThirdZy = defineAsyncComponent(() => import("./components/third-zy/index.vue"))
|
|
|
|
const data = {
|
|
tabList: [
|
|
{ id: 10, label: "充值套餐" },
|
|
{ id: 20, label: "每餐额定金额配置" },
|
|
{ id: 30, label: "退款配置" },
|
|
{ id: 40, label: "二维码配置" },
|
|
{ id: 50, label: "离线配置" },
|
|
{ id: 60, label: "正元同步配置" },
|
|
],
|
|
}
|
|
|
|
const activeName = ref(data.tabList[0].id)
|
|
</script>
|