70 lines
1.8 KiB
Vue
70 lines
1.8 KiB
Vue
<template>
|
|
<div class="voucher-management-container">
|
|
<div class="header">
|
|
<el-page-header @back="goBack">
|
|
<template #content>
|
|
<span class="text-large font-600 mr-3">代金券管理 (ID: {{ voucherId }})</span>
|
|
</template>
|
|
</el-page-header>
|
|
</div>
|
|
|
|
<el-card class="mt-4" shadow="never">
|
|
<el-tabs v-model="activeTab" type="card">
|
|
<el-tab-pane label="用户分发管理" name="user-distribution">
|
|
<UserVoucher :code-id="voucherId" />
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="商品关联管理" name="discount-goods">
|
|
<DiscountGoods :code-id="voucherId" />
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="用户关联管理" name="discount-users">
|
|
<DiscountUsers :code-id="voucherId" />
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="用户信息管理" name="user-info">
|
|
<VoucherHolders :code-id="voucherId" />
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="用户使用记录" name="user-history">
|
|
<VoucherHistory :code-id="voucherId" />
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed } from 'vue'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import UserVoucher from './UserVoucher.vue'
|
|
import DiscountGoods from './DiscountGoods.vue'
|
|
import DiscountUsers from './DiscountUsers.vue'
|
|
import VoucherHolders from './VoucherHolders.vue'
|
|
import VoucherHistory from './VoucherHistory.vue'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
const activeTab = ref('user-distribution')
|
|
|
|
const voucherId = computed(() => route.params.id)
|
|
|
|
const goBack = () => {
|
|
router.push('/marketing/voucher')
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.voucher-management-container {
|
|
padding: 20px;
|
|
}
|
|
|
|
.header {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.mt-4 {
|
|
margin-top: 16px;
|
|
}
|
|
</style>
|