This commit is contained in:
@@ -25,125 +25,123 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { ShopPackageAllocationService } from '@/api/modules'
|
||||
import type { ShopPackageAllocationResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { ShopPackageAllocationService } from '@/api/modules'
|
||||
import type { ShopPackageAllocationResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
|
||||
defineOptions({ name: 'PackageAssignDetail' })
|
||||
defineOptions({ name: 'PackageAssignDetail' })
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const loading = ref(false)
|
||||
const detailData = ref<ShopPackageAllocationResponse | null>(null)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<ShopPackageAllocationResponse | null>(null)
|
||||
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '套餐编码', prop: 'package_code' },
|
||||
{ label: '套餐名称', prop: 'package_name' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{ label: '被分配店铺', prop: 'shop_name' },
|
||||
{
|
||||
label: '分配者店铺',
|
||||
formatter: (_, data) => {
|
||||
if (data.allocator_shop_id === 0) {
|
||||
return '平台'
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '套餐编码', prop: 'package_code' },
|
||||
{ label: '套餐名称', prop: 'package_name' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{ label: '被分配店铺', prop: 'shop_name' },
|
||||
{
|
||||
label: '分配者店铺',
|
||||
formatter: (_, data) => {
|
||||
if (data.allocator_shop_id === 0) {
|
||||
return '平台'
|
||||
}
|
||||
return data.allocator_shop_name || '-'
|
||||
}
|
||||
return data.allocator_shop_name || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '成本价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.cost_price / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await ShopPackageAllocationService.getShopPackageAllocationDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
},
|
||||
{
|
||||
label: '成本价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.cost_price / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await ShopPackageAllocationService.getShopPackageAllocationDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.package-assign-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
.package-assign-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -19,7 +19,9 @@
|
||||
@refresh="handleRefresh"
|
||||
>
|
||||
<template #left>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'package_assign:add'">新增分配</ElButton>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'package_assign:add'"
|
||||
>新增分配</ElButton
|
||||
>
|
||||
</template>
|
||||
</ArtTableHeader>
|
||||
|
||||
@@ -113,7 +115,12 @@
|
||||
<script setup lang="ts">
|
||||
import { h } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { ShopPackageAllocationService, PackageManageService, ShopService, ShopSeriesAllocationService } from '@/api/modules'
|
||||
import {
|
||||
ShopPackageAllocationService,
|
||||
PackageManageService,
|
||||
ShopService,
|
||||
ShopSeriesAllocationService
|
||||
} from '@/api/modules'
|
||||
import { ElMessage, ElMessageBox, ElSwitch } from 'element-plus'
|
||||
import type { FormInstance, FormRules } from 'element-plus'
|
||||
import type { ShopPackageAllocationResponse, PackageResponse, ShopResponse } from '@/types/api'
|
||||
@@ -386,14 +393,14 @@
|
||||
{
|
||||
prop: 'operation',
|
||||
label: '操作',
|
||||
width: 200,
|
||||
width: 220,
|
||||
fixed: 'right',
|
||||
formatter: (row: ShopPackageAllocationResponse) => {
|
||||
const buttons = []
|
||||
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type:"view",
|
||||
text: '详情',
|
||||
onClick: () => handleViewDetail(row)
|
||||
})
|
||||
)
|
||||
@@ -401,7 +408,7 @@
|
||||
if (hasAuth('package_assign:edit')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type:"edit",
|
||||
text: '编辑',
|
||||
onClick: () => showDialog('edit', row)
|
||||
})
|
||||
)
|
||||
@@ -410,7 +417,7 @@
|
||||
if (hasAuth('package_assign:delete')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type:"delete",
|
||||
text: '删除',
|
||||
onClick: () => deleteAllocation(row)
|
||||
})
|
||||
)
|
||||
|
||||
@@ -25,224 +25,231 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { PackageManageService } from '@/api/modules'
|
||||
import type { PackageResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { PackageManageService } from '@/api/modules'
|
||||
import type { PackageResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
|
||||
defineOptions({ name: 'PackageDetail' })
|
||||
defineOptions({ name: 'PackageDetail' })
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const loading = ref(false)
|
||||
const detailData = ref<PackageResponse | null>(null)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<PackageResponse | null>(null)
|
||||
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '套餐编码', prop: 'package_code' },
|
||||
{ label: '套餐名称', prop: 'package_name' },
|
||||
{ label: '套餐系列', prop: 'series_name' },
|
||||
{
|
||||
label: '套餐类型',
|
||||
formatter: (_, data) => {
|
||||
const typeMap = {
|
||||
formal: '正式套餐',
|
||||
addon: '附加套餐'
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '套餐编码', prop: 'package_code' },
|
||||
{ label: '套餐名称', prop: 'package_name' },
|
||||
{ label: '套餐系列', prop: 'series_name' },
|
||||
{
|
||||
label: '套餐类型',
|
||||
formatter: (_, data) => {
|
||||
const typeMap = {
|
||||
formal: '正式套餐',
|
||||
addon: '附加套餐'
|
||||
}
|
||||
return typeMap[data.package_type] || data.package_type
|
||||
}
|
||||
return typeMap[data.package_type] || data.package_type
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '套餐时长',
|
||||
formatter: (_, data) => {
|
||||
return `${data.duration_months} 个月`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '上架状态',
|
||||
formatter: (_, data) => {
|
||||
return data.shelf_status === 1 ? '上架' : '下架'
|
||||
}
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '流量配置',
|
||||
fields: [
|
||||
{
|
||||
label: '真流量额度',
|
||||
formatter: (_, data) => {
|
||||
if (data.real_data_mb >= 1024) {
|
||||
return `${(data.real_data_mb / 1024).toFixed(2)} GB`
|
||||
},
|
||||
{
|
||||
label: '套餐时长',
|
||||
formatter: (_, data) => {
|
||||
return `${data.duration_months} 个月`
|
||||
}
|
||||
return `${data.real_data_mb} MB`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '启用虚流量',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_virtual_data ? '是' : '否'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '虚流量额度',
|
||||
formatter: (_, data) => {
|
||||
if (!data.enable_virtual_data) return '-'
|
||||
if (data.virtual_data_mb >= 1024) {
|
||||
return `${(data.virtual_data_mb / 1024).toFixed(2)} GB`
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '上架状态',
|
||||
formatter: (_, data) => {
|
||||
return data.shelf_status === 1 ? '上架' : '下架'
|
||||
}
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '流量配置',
|
||||
fields: [
|
||||
{
|
||||
label: '真流量额度',
|
||||
formatter: (_, data) => {
|
||||
if (data.real_data_mb >= 1024) {
|
||||
return `${(data.real_data_mb / 1024).toFixed(2)} GB`
|
||||
}
|
||||
return `${data.real_data_mb} MB`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '启用虚流量',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_virtual_data ? '是' : '否'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '虚流量额度',
|
||||
formatter: (_, data) => {
|
||||
if (!data.enable_virtual_data) return '-'
|
||||
if (data.virtual_data_mb >= 1024) {
|
||||
return `${(data.virtual_data_mb / 1024).toFixed(2)} GB`
|
||||
}
|
||||
return `${data.virtual_data_mb} MB`
|
||||
}
|
||||
return `${data.virtual_data_mb} MB`
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '价格信息',
|
||||
fields: [
|
||||
{
|
||||
label: '成本价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.cost_price / 100).toFixed(2)}`
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '价格信息',
|
||||
fields: [
|
||||
{
|
||||
label: '成本价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.cost_price / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '建议售价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.suggested_retail_price / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '利润空间',
|
||||
formatter: (_, data) => {
|
||||
if (data.profit_margin === null || data.profit_margin === undefined) return '-'
|
||||
return `¥${(data.profit_margin / 100).toFixed(2)}`
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '建议售价',
|
||||
formatter: (_, data) => {
|
||||
return `¥${(data.suggested_retail_price / 100).toFixed(2)}`
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '当前返佣比例',
|
||||
formatter: (_, data) => {
|
||||
return data.current_commission_rate || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '一次性佣金金额',
|
||||
formatter: (_, data) => {
|
||||
if (
|
||||
data.one_time_commission_amount === null ||
|
||||
data.one_time_commission_amount === undefined
|
||||
)
|
||||
return '-'
|
||||
return `¥${(data.one_time_commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '当前返佣档位',
|
||||
formatter: (_, data) => {
|
||||
if (!data.tier_info || !data.tier_info.current_rate) return '-'
|
||||
return data.tier_info.current_rate
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '下一档位比例',
|
||||
formatter: (_, data) => {
|
||||
if (!data.tier_info || !data.tier_info.next_rate) return '-'
|
||||
return data.tier_info.next_rate
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '下一档位阈值',
|
||||
formatter: (_, data) => {
|
||||
if (
|
||||
!data.tier_info ||
|
||||
data.tier_info.next_threshold === null ||
|
||||
data.tier_info.next_threshold === undefined
|
||||
)
|
||||
return '-'
|
||||
return data.tier_info.next_threshold
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '利润空间',
|
||||
formatter: (_, data) => {
|
||||
if (data.profit_margin === null || data.profit_margin === undefined) return '-'
|
||||
return `¥${(data.profit_margin / 100).toFixed(2)}`
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '当前返佣比例',
|
||||
formatter: (_, data) => {
|
||||
return data.current_commission_rate || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '一次性佣金金额',
|
||||
formatter: (_, data) => {
|
||||
if (data.one_time_commission_amount === null || data.one_time_commission_amount === undefined) return '-'
|
||||
return `¥${(data.one_time_commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '当前返佣档位',
|
||||
formatter: (_, data) => {
|
||||
if (!data.tier_info || !data.tier_info.current_rate) return '-'
|
||||
return data.tier_info.current_rate
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '下一档位比例',
|
||||
formatter: (_, data) => {
|
||||
if (!data.tier_info || !data.tier_info.next_rate) return '-'
|
||||
return data.tier_info.next_rate
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '下一档位阈值',
|
||||
formatter: (_, data) => {
|
||||
if (!data.tier_info || data.tier_info.next_threshold === null || data.tier_info.next_threshold === undefined) return '-'
|
||||
return data.tier_info.next_threshold
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await PackageManageService.getPackageDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
]
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await PackageManageService.getPackageDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.package-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
.package-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -18,7 +18,9 @@
|
||||
@refresh="handleRefresh"
|
||||
>
|
||||
<template #left>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'package:add'">新增套餐</ElButton>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'package:add'"
|
||||
>新增套餐</ElButton
|
||||
>
|
||||
</template>
|
||||
</ArtTableHeader>
|
||||
|
||||
@@ -50,13 +52,13 @@
|
||||
>
|
||||
<ElForm ref="formRef" :model="form" :rules="rules" label-width="150px">
|
||||
<ElFormItem label="套餐编码" prop="package_code">
|
||||
<div style="display: flex; gap: 8px;">
|
||||
<div style="display: flex; gap: 8px">
|
||||
<ElInput
|
||||
v-model="form.package_code"
|
||||
placeholder="请输入套餐编码或点击生成"
|
||||
:disabled="dialogType === 'edit'"
|
||||
clearable
|
||||
style="flex: 1;"
|
||||
style="flex: 1"
|
||||
/>
|
||||
<ElButton v-if="dialogType === 'add'" @click="handleGeneratePackageCode">
|
||||
生成编码
|
||||
@@ -478,14 +480,14 @@
|
||||
{
|
||||
prop: 'operation',
|
||||
label: '操作',
|
||||
width: 200,
|
||||
width: 220,
|
||||
fixed: 'right',
|
||||
formatter: (row: PackageResponse) => {
|
||||
const buttons = []
|
||||
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'view',
|
||||
text: '详情',
|
||||
onClick: () => handleViewDetail(row)
|
||||
})
|
||||
)
|
||||
@@ -493,7 +495,7 @@
|
||||
if (hasAuth('package:edit')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'edit',
|
||||
text: '编辑',
|
||||
onClick: () => showDialog('edit', row)
|
||||
})
|
||||
)
|
||||
@@ -502,7 +504,7 @@
|
||||
if (hasAuth('package:delete')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'delete',
|
||||
text: '删除',
|
||||
onClick: () => deletePackage(row)
|
||||
})
|
||||
)
|
||||
@@ -661,7 +663,9 @@
|
||||
form.virtual_data_mb = row.virtual_data_mb || 0
|
||||
form.duration_months = row.duration_months
|
||||
form.cost_price = row.cost_price / 100 // 分转换为元显示
|
||||
form.suggested_retail_price = row.suggested_retail_price ? row.suggested_retail_price / 100 : undefined
|
||||
form.suggested_retail_price = row.suggested_retail_price
|
||||
? row.suggested_retail_price / 100
|
||||
: undefined
|
||||
form.description = row.description || ''
|
||||
} else {
|
||||
form.id = 0
|
||||
|
||||
@@ -25,239 +25,247 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, h } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage, ElTag } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { PackageSeriesService } from '@/api/modules'
|
||||
import type { PackageSeriesResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
import { ref, onMounted, h } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage, ElTag } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { PackageSeriesService } from '@/api/modules'
|
||||
import type { PackageSeriesResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
|
||||
defineOptions({ name: 'PackageSeriesDetail' })
|
||||
defineOptions({ name: 'PackageSeriesDetail' })
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const loading = ref(false)
|
||||
const detailData = ref<PackageSeriesResponse | null>(null)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<PackageSeriesResponse | null>(null)
|
||||
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '系列编码', prop: 'series_code' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '描述',
|
||||
prop: 'description',
|
||||
fullWidth: true
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '一次性佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.one_time_commission_config?.enable ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '佣金类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.commission_type) return '-'
|
||||
return config.commission_type === 'fixed' ? '固定佣金' : '梯度佣金'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '固定佣金金额',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (config?.commission_type !== 'fixed' || !config.commission_amount) return '-'
|
||||
return `¥${(config.commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发阈值',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.threshold) return '-'
|
||||
return `¥${(config.threshold / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.trigger_type) return '-'
|
||||
return config.trigger_type === 'first_recharge' ? '首次充值' : '累计充值'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '梯度配置',
|
||||
fullWidth: true,
|
||||
render: (data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (config?.commission_type !== 'tiered' || !config.tiers || config.tiers.length === 0) {
|
||||
return h('span', '-')
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '系列编码', prop: 'series_code' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
|
||||
return h('div', { style: 'display: flex; flex-direction: column; gap: 8px;' },
|
||||
config.tiers.map((tier: any, index: number) => {
|
||||
const dimensionText = tier.dimension === 'sales_count' ? '销量' : '销售额'
|
||||
const thresholdText = tier.dimension === 'sales_amount'
|
||||
? `¥${(tier.threshold / 100).toFixed(2)}`
|
||||
: tier.threshold
|
||||
const amountText = `¥${(tier.amount / 100).toFixed(2)}`
|
||||
const scopeText = tier.stat_scope === 'self' ? '仅自己' : '自己+下级'
|
||||
|
||||
return h(ElTag, { type: 'info', size: 'default' },
|
||||
() => `档位${index + 1}: ${dimensionText} ≥ ${thresholdText}, 佣金 ${amountText}, ${scopeText}`
|
||||
)
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '强充配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.one_time_commission_config?.enable_force_recharge ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充金额',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.force_amount) return '-'
|
||||
return `¥${(config.force_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充计算类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.force_calc_type) return '-'
|
||||
return config.force_calc_type === 'fixed' ? '固定' : '动态'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '时效配置',
|
||||
fields: [
|
||||
{
|
||||
label: '时效类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.validity_type) return '-'
|
||||
const typeMap = {
|
||||
permanent: '永久',
|
||||
fixed_date: '固定日期',
|
||||
relative: '相对时长'
|
||||
},
|
||||
{
|
||||
label: '描述',
|
||||
prop: 'description',
|
||||
fullWidth: true
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '一次性佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.one_time_commission_config?.enable ? '已启用' : '未启用'
|
||||
}
|
||||
return typeMap[config.validity_type] || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '时效值',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.validity_value) return '-'
|
||||
if (config.validity_type === 'relative') {
|
||||
return `${config.validity_value}个月`
|
||||
} else if (config.validity_type === 'fixed_date') {
|
||||
return config.validity_value
|
||||
},
|
||||
{
|
||||
label: '佣金类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.commission_type) return '-'
|
||||
return config.commission_type === 'fixed' ? '固定佣金' : '梯度佣金'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '固定佣金金额',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (config?.commission_type !== 'fixed' || !config.commission_amount) return '-'
|
||||
return `¥${(config.commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发阈值',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.threshold) return '-'
|
||||
return `¥${(config.threshold / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.trigger_type) return '-'
|
||||
return config.trigger_type === 'first_recharge' ? '首次充值' : '累计充值'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '梯度配置',
|
||||
fullWidth: true,
|
||||
render: (data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (
|
||||
config?.commission_type !== 'tiered' ||
|
||||
!config.tiers ||
|
||||
config.tiers.length === 0
|
||||
) {
|
||||
return h('span', '-')
|
||||
}
|
||||
|
||||
return h(
|
||||
'div',
|
||||
{ style: 'display: flex; flex-direction: column; gap: 8px;' },
|
||||
config.tiers.map((tier: any, index: number) => {
|
||||
const dimensionText = tier.dimension === 'sales_count' ? '销量' : '销售额'
|
||||
const thresholdText =
|
||||
tier.dimension === 'sales_amount'
|
||||
? `¥${(tier.threshold / 100).toFixed(2)}`
|
||||
: tier.threshold
|
||||
const amountText = `¥${(tier.amount / 100).toFixed(2)}`
|
||||
const scopeText = tier.stat_scope === 'self' ? '仅自己' : '自己+下级'
|
||||
|
||||
return h(
|
||||
ElTag,
|
||||
{ type: 'info', size: 'default' },
|
||||
() =>
|
||||
`档位${index + 1}: ${dimensionText} ≥ ${thresholdText}, 佣金 ${amountText}, ${scopeText}`
|
||||
)
|
||||
})
|
||||
)
|
||||
}
|
||||
return '-'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await PackageSeriesService.getPackageSeriesDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '强充配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.one_time_commission_config?.enable_force_recharge ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充金额',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.force_amount) return '-'
|
||||
return `¥${(config.force_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充计算类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.force_calc_type) return '-'
|
||||
return config.force_calc_type === 'fixed' ? '固定' : '动态'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '时效配置',
|
||||
fields: [
|
||||
{
|
||||
label: '时效类型',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.validity_type) return '-'
|
||||
const typeMap = {
|
||||
permanent: '永久',
|
||||
fixed_date: '固定日期',
|
||||
relative: '相对时长'
|
||||
}
|
||||
return typeMap[config.validity_type] || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '时效值',
|
||||
formatter: (_, data) => {
|
||||
const config = data.one_time_commission_config
|
||||
if (!config?.validity_value) return '-'
|
||||
if (config.validity_type === 'relative') {
|
||||
return `${config.validity_value}个月`
|
||||
} else if (config.validity_type === 'fixed_date') {
|
||||
return config.validity_value
|
||||
}
|
||||
return '-'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await PackageSeriesService.getPackageSeriesDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.package-series-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
.package-series-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -243,7 +243,13 @@
|
||||
:icon="Delete"
|
||||
circle
|
||||
@click="removeTier(index)"
|
||||
style="flex-shrink: 0; margin-top: 28px; width: 32px; height: 32px; padding: 0"
|
||||
style="
|
||||
flex-shrink: 0;
|
||||
margin-top: 28px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</ElCard>
|
||||
@@ -673,7 +679,7 @@
|
||||
{
|
||||
prop: 'operation',
|
||||
label: '操作',
|
||||
width: 200,
|
||||
width: 220,
|
||||
fixed: 'right',
|
||||
formatter: (row: PackageSeriesResponse) => {
|
||||
const buttons = []
|
||||
@@ -681,7 +687,7 @@
|
||||
// 详情按钮
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'view',
|
||||
text: '详情',
|
||||
onClick: () => handleViewDetail(row)
|
||||
})
|
||||
)
|
||||
@@ -689,7 +695,7 @@
|
||||
if (hasAuth('package_series:edit')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'edit',
|
||||
text: '编辑',
|
||||
onClick: () => showDialog('edit', row)
|
||||
})
|
||||
)
|
||||
@@ -698,7 +704,7 @@
|
||||
if (hasAuth('package_series:delete')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'delete',
|
||||
text: '删除',
|
||||
onClick: () => deleteSeries(row)
|
||||
})
|
||||
)
|
||||
|
||||
@@ -25,183 +25,181 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, h } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage, ElTag } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { ShopSeriesAllocationService } from '@/api/modules'
|
||||
import type { ShopSeriesAllocationResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
import { ref, onMounted, h } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ElCard, ElButton, ElIcon, ElMessage, ElTag } from 'element-plus'
|
||||
import { ArrowLeft, Loading } from '@element-plus/icons-vue'
|
||||
import DetailPage from '@/components/common/DetailPage.vue'
|
||||
import type { DetailSection } from '@/components/common/DetailPage.vue'
|
||||
import { ShopSeriesAllocationService } from '@/api/modules'
|
||||
import type { ShopSeriesAllocationResponse } from '@/types/api'
|
||||
import { formatDateTime } from '@/utils/business/format'
|
||||
|
||||
defineOptions({ name: 'SeriesAssignDetail' })
|
||||
defineOptions({ name: 'SeriesAssignDetail' })
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const loading = ref(false)
|
||||
const detailData = ref<ShopSeriesAllocationResponse | null>(null)
|
||||
const loading = ref(false)
|
||||
const detailData = ref<ShopSeriesAllocationResponse | null>(null)
|
||||
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '系列编码', prop: 'series_code' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{ label: '店铺名称', prop: 'shop_name' },
|
||||
{
|
||||
label: '分配者店铺',
|
||||
formatter: (_, data) => {
|
||||
if (data.allocator_shop_id === 0) {
|
||||
return '平台'
|
||||
// 详情页配置
|
||||
const detailSections: DetailSection[] = [
|
||||
{
|
||||
title: '基本信息',
|
||||
fields: [
|
||||
{ label: 'ID', prop: 'id' },
|
||||
{ label: '系列编码', prop: 'series_code' },
|
||||
{ label: '系列名称', prop: 'series_name' },
|
||||
{ label: '店铺名称', prop: 'shop_name' },
|
||||
{
|
||||
label: '分配者店铺',
|
||||
formatter: (_, data) => {
|
||||
if (data.allocator_shop_id === 0) {
|
||||
return '平台'
|
||||
}
|
||||
return data.allocator_shop_name || '-'
|
||||
}
|
||||
return data.allocator_shop_name || '-'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '一次性佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_one_time_commission ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '佣金金额上限',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_amount) return '-'
|
||||
return `¥${(data.one_time_commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发阈值',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_threshold) return '-'
|
||||
return `¥${(data.one_time_commission_threshold / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发类型',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_trigger) return '-'
|
||||
const typeMap = {
|
||||
first_recharge: '首次充值',
|
||||
accumulated_recharge: '累计充值'
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
formatter: (_, data) => {
|
||||
return data.status === 1 ? '启用' : '禁用'
|
||||
}
|
||||
return typeMap[data.one_time_commission_trigger] || '-'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '强制充值配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_force_recharge ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充金额',
|
||||
formatter: (_, data) => {
|
||||
if (!data.force_recharge_amount) return '-'
|
||||
return `¥${(data.force_recharge_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充触发类型',
|
||||
formatter: (_, data) => {
|
||||
if (!data.force_recharge_trigger_type) return '-'
|
||||
const typeMap = {
|
||||
1: '单次充值',
|
||||
2: '累计充值'
|
||||
},
|
||||
{ label: '创建时间', prop: 'created_at', formatter: (value) => formatDateTime(value) },
|
||||
{ label: '更新时间', prop: 'updated_at', formatter: (value) => formatDateTime(value) }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '一次性佣金配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_one_time_commission ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '佣金金额上限',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_amount) return '-'
|
||||
return `¥${(data.one_time_commission_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发阈值',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_threshold) return '-'
|
||||
return `¥${(data.one_time_commission_threshold / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '触发类型',
|
||||
formatter: (_, data) => {
|
||||
if (!data.one_time_commission_trigger) return '-'
|
||||
const typeMap = {
|
||||
first_recharge: '首次充值',
|
||||
accumulated_recharge: '累计充值'
|
||||
}
|
||||
return typeMap[data.one_time_commission_trigger] || '-'
|
||||
}
|
||||
return typeMap[data.force_recharge_trigger_type] || '-'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await ShopSeriesAllocationService.getShopSeriesAllocationDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '强制充值配置',
|
||||
fields: [
|
||||
{
|
||||
label: '启用状态',
|
||||
formatter: (_, data) => {
|
||||
return data.enable_force_recharge ? '已启用' : '未启用'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充金额',
|
||||
formatter: (_, data) => {
|
||||
if (!data.force_recharge_amount) return '-'
|
||||
return `¥${(data.force_recharge_amount / 100).toFixed(2)}`
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '强充触发类型',
|
||||
formatter: (_, data) => {
|
||||
if (!data.force_recharge_trigger_type) return '-'
|
||||
const typeMap = {
|
||||
1: '单次充值',
|
||||
2: '累计充值'
|
||||
}
|
||||
return typeMap[data.force_recharge_trigger_type] || '-'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
// 返回上一页
|
||||
const handleBack = () => {
|
||||
router.back()
|
||||
}
|
||||
|
||||
// 获取详情数据
|
||||
const fetchDetail = async () => {
|
||||
const id = Number(route.params.id)
|
||||
if (!id) {
|
||||
ElMessage.error('缺少ID参数')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await ShopSeriesAllocationService.getShopSeriesAllocationDetail(id)
|
||||
if (res.code === 0) {
|
||||
detailData.value = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
ElMessage.error('获取详情失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchDetail()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.series-assign-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 24px;
|
||||
padding-bottom: 16px;
|
||||
border-bottom: 1px solid var(--el-border-color-light);
|
||||
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
.series-assign-detail {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
.detail-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding-bottom: 16px;
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
.detail-title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
gap: 12px;
|
||||
color: var(--el-text-color-secondary);
|
||||
|
||||
.el-icon {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -19,7 +19,9 @@
|
||||
@refresh="handleRefresh"
|
||||
>
|
||||
<template #left>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'series_assign:add'">新增系列分配</ElButton>
|
||||
<ElButton type="primary" @click="showDialog('add')" v-permission="'series_assign:add'"
|
||||
>新增系列分配</ElButton
|
||||
>
|
||||
</template>
|
||||
</ArtTableHeader>
|
||||
|
||||
@@ -565,7 +567,7 @@
|
||||
{
|
||||
prop: 'operation',
|
||||
label: '操作',
|
||||
width: 180,
|
||||
width: 220,
|
||||
fixed: 'right',
|
||||
formatter: (row: ShopSeriesAllocationResponse) => {
|
||||
const buttons = []
|
||||
@@ -573,7 +575,7 @@
|
||||
// 详情按钮
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'view',
|
||||
text: '详情',
|
||||
onClick: () => handleViewDetail(row)
|
||||
})
|
||||
)
|
||||
@@ -581,7 +583,7 @@
|
||||
if (hasAuth('series_assign:edit')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'edit',
|
||||
text: '编辑',
|
||||
onClick: () => showDialog('edit', row)
|
||||
})
|
||||
)
|
||||
@@ -590,7 +592,7 @@
|
||||
if (hasAuth('series_assign:delete')) {
|
||||
buttons.push(
|
||||
h(ArtButtonTable, {
|
||||
type: 'delete',
|
||||
text: '删除',
|
||||
onClick: () => deleteAllocation(row)
|
||||
})
|
||||
)
|
||||
@@ -800,7 +802,8 @@
|
||||
page_size: pagination.page_size,
|
||||
shop_id: searchForm.shop_id || undefined,
|
||||
series_id: searchForm.series_id || undefined,
|
||||
allocator_shop_id: searchForm.allocator_shop_id !== undefined ? searchForm.allocator_shop_id : undefined,
|
||||
allocator_shop_id:
|
||||
searchForm.allocator_shop_id !== undefined ? searchForm.allocator_shop_id : undefined,
|
||||
status: searchForm.status || undefined
|
||||
}
|
||||
const res = await ShopSeriesAllocationService.getShopSeriesAllocations(params)
|
||||
|
||||
Reference in New Issue
Block a user