479 行
25 KiB
HTML
479 行
25 KiB
HTML
{include file="/shopro/common/script" /}
|
||
|
||
<style>
|
||
.goods-form .sa-title.is-line {
|
||
margin-bottom: 16px;
|
||
font-weight: 600;
|
||
font-size: 15px;
|
||
}
|
||
|
||
.goods-form .goods-card {
|
||
background: #f8f9fa;
|
||
border-radius: 8px;
|
||
padding: 14px 16px;
|
||
margin-bottom: 20px;
|
||
border: 1px solid var(--sa-border);
|
||
}
|
||
|
||
.goods-form .goods-item .goods-title {
|
||
height: 20px;
|
||
line-height: 20px;
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: var(--sa-font);
|
||
margin-bottom: 6px;
|
||
}
|
||
|
||
.goods-form .goods-item .goods-price {
|
||
font-size: 14px;
|
||
color: #f56c6c;
|
||
font-weight: 600;
|
||
margin-bottom: 6px;
|
||
}
|
||
|
||
.goods-form .goods-item .goods-sku {
|
||
width: fit-content;
|
||
height: 20px;
|
||
line-height: 20px;
|
||
background: var(--el-color-primary);
|
||
border-radius: 10px;
|
||
padding: 0 10px;
|
||
font-size: 12px;
|
||
color: var(--sa-background-assist);
|
||
}
|
||
|
||
.goods-form .section-box {
|
||
background: #fff;
|
||
border: 1px solid #e4e7ed;
|
||
border-radius: 8px;
|
||
padding: 16px;
|
||
margin-bottom: 18px;
|
||
}
|
||
|
||
.goods-form .section-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 14px;
|
||
padding-bottom: 8px;
|
||
border-bottom: 1px dashed #ebeef5;
|
||
}
|
||
|
||
.goods-form .section-title {
|
||
font-size: 14px;
|
||
font-weight: 600;
|
||
color: #303133;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.goods-form .section-title::before {
|
||
content: '';
|
||
display: inline-block;
|
||
width: 4px;
|
||
height: 14px;
|
||
background: var(--el-color-primary);
|
||
border-radius: 2px;
|
||
margin-right: 8px;
|
||
}
|
||
|
||
.goods-form .section-tip {
|
||
font-size: 12px;
|
||
color: #909399;
|
||
margin-top: 4px;
|
||
}
|
||
|
||
.goods-form .rules-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 14px;
|
||
}
|
||
|
||
.goods-form .rules-grid-2 {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 14px;
|
||
}
|
||
|
||
.goods-form .rules-grid-6 {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 12px;
|
||
}
|
||
|
||
.goods-form .field-item {
|
||
background: #fafafa;
|
||
padding: 10px 12px;
|
||
border-radius: 6px;
|
||
border: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.goods-form .field-label {
|
||
font-size: 12px;
|
||
color: #606266;
|
||
margin-bottom: 6px;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.goods-form .preview-summary {
|
||
background: #f0f9eb;
|
||
border: 1px solid #e1f3d8;
|
||
border-radius: 8px;
|
||
padding: 16px;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
.goods-form .preview-summary .summary-title {
|
||
font-weight: 600;
|
||
font-size: 14px;
|
||
color: #67c23a;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.goods-form .preview-list {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 10px;
|
||
font-size: 13px;
|
||
color: #555;
|
||
}
|
||
|
||
.goods-form .preview-item {
|
||
background: #fff;
|
||
padding: 8px 12px;
|
||
border-radius: 4px;
|
||
border: 1px solid #e1f3d8;
|
||
}
|
||
|
||
.goods-form .sku-toolbar {
|
||
background: #f4f6fa;
|
||
padding: 10px 14px;
|
||
border-radius: 6px;
|
||
margin-bottom: 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
gap: 10px;
|
||
}
|
||
|
||
.goods-form .sku-tab-wrap {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
flex-wrap: wrap;
|
||
}
|
||
</style>
|
||
|
||
<div id="addEdit" class="goods-form" v-cloak>
|
||
<el-container class="panel-block">
|
||
<el-main>
|
||
<el-scrollbar height="100%">
|
||
<!-- 商品基本信息卡片 -->
|
||
<div class="goods-card">
|
||
<div v-for="goods in state.data?.goods" :key="goods.id" class="goods-item sa-flex sa-col-top">
|
||
<sa-image class="mr-3" :url="goods.image" size="64"></sa-image>
|
||
<div>
|
||
<div class="goods-title sa-table-line-1">{{ goods.title }}</div>
|
||
<div class="goods-price" v-if="goods.price">
|
||
指导价：¥{{ Array.isArray(goods.price) ? goods.price.join(' ~ ') : goods.price }}
|
||
</div>
|
||
<div v-if="goods.is_sku" class="goods-sku">多规格商品（共 {{ goods.sku_prices?.length || 0 }} 种规格）</div>
|
||
<div v-else class="goods-sku" style="background:#67c23a;">单规格基础商品</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 计奖与分成核心设置 -->
|
||
<el-form label-width="120px" label-position="left">
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">计奖资格与业绩设置</div>
|
||
</div>
|
||
<el-form-item label="是否参与计奖">
|
||
<el-radio-group v-model="state.commission_goods.status">
|
||
<el-radio :label="1"><el-tag type="success" size="small">参与计奖</el-tag></el-radio>
|
||
<el-radio :label="0"><el-tag type="danger" size="small">不参与计奖</el-tag></el-radio>
|
||
</el-radio-group>
|
||
<div class="section-tip">
|
||
开启后，购买该商品的新订单将参与收益中心推三返一、创客极差、团队拆分、兑换券及全网日结奖池；关闭后整单或单品排除计奖。
|
||
</div>
|
||
</el-form-item>
|
||
|
||
<template v-if="state.commission_goods.status == 1">
|
||
<el-form-item label="分销商业绩">
|
||
<el-radio-group v-model="state.commission_goods.commission_order_status">
|
||
<el-radio :label="1">计入业绩</el-radio>
|
||
<el-radio :label="0">不计入业绩</el-radio>
|
||
</el-radio-group>
|
||
<div class="section-tip">
|
||
计入后，该订单将累加分销商团队订单金额和单数，用于创客升级考核。
|
||
</div>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="分成规则模式">
|
||
<el-radio-group v-model="state.commission_goods.self_rules" @change="onChangeSelfRules">
|
||
<el-radio :label="0">默认规则（跟随系统配置）</el-radio>
|
||
<el-radio :label="1" v-if="state.rulesType != 'batch'">独立规则（单独设置分成）</el-radio>
|
||
<el-radio :label="2">批量规则（统一设置分成）</el-radio>
|
||
</el-radio-group>
|
||
<div class="section-tip">
|
||
选择「默认规则」时直接继承系统收益中心全局配置；选择「独立规则」可为当前商品单独定制分成比例与金额。
|
||
</div>
|
||
</el-form-item>
|
||
</template>
|
||
</div>
|
||
|
||
<!-- 状态为不参与时的警示提示 -->
|
||
<el-alert v-if="state.commission_goods.status == 0" type="warning" show-icon :closable="false"
|
||
title="商品未参与计奖"
|
||
description="当前商品已关闭计奖，会员或下级购买该商品时将不产生推荐开拓奖、创客极差、酒道馆/区县团队奖及兑换券，亦不进入全网日结均分奖池。"
|
||
style="margin-bottom: 20px;">
|
||
</el-alert>
|
||
|
||
<!-- 模式 0：跟随系统默认规则预览卡片 -->
|
||
<div v-if="state.commission_goods.status == 1 && state.commission_goods.self_rules == 0" class="preview-summary">
|
||
<div class="summary-title sa-flex sa-row-between">
|
||
<span>系统收益中心全局默认分成规则概览</span>
|
||
<el-tag size="small" type="success">当前生效</el-tag>
|
||
</div>
|
||
<div class="preview-list">
|
||
<div class="preview-item">
|
||
<strong>推荐开拓奖（推三返一）：</strong>
|
||
循环返现 ¥{{ state.defaultPartnerRules.push3_amounts?.[0] || 398 }} / ¥{{ state.defaultPartnerRules.push3_amounts?.[1] || 400 }} / ¥{{ state.defaultPartnerRules.push3_amounts?.[2] || 600 }} 元
|
||
</div>
|
||
<div class="preview-item">
|
||
<strong>创客极差基数（V1~V6）：</strong>
|
||
¥{{ state.defaultPartnerRules.maker_bonus?.['2'] || 20 }} ~ ¥{{ state.defaultPartnerRules.maker_bonus?.['7'] || 120 }} 元
|
||
</div>
|
||
<div class="preview-item">
|
||
<strong>创客协同与超越：</strong>
|
||
同级协同 {{ ((state.defaultPartnerRules.maker_peer_rate || 0.10) * 100).toFixed(0) }}%，超越关怀 {{ ((state.defaultPartnerRules.maker_overtaken_rate || 0.05) * 100).toFixed(0) }}%
|
||
</div>
|
||
<div class="preview-item">
|
||
<strong>渠道运营统筹奖：</strong>
|
||
酒道馆 ¥{{ state.defaultPartnerRules.venue_split || 50 }}，区县统筹 ¥{{ state.defaultPartnerRules.county_full || 100 }}（有馆时各50）
|
||
</div>
|
||
<div class="preview-item">
|
||
<strong>馆/县平级协同奖：</strong>
|
||
酒道馆 {{ ((state.defaultPartnerRules.venue_peer_rate || 0.10) * 100).toFixed(0) }}%，区县代理 {{ ((state.defaultPartnerRules.county_peer_rate || 0.10) * 100).toFixed(0) }}%
|
||
</div>
|
||
<div class="preview-item">
|
||
<strong>消费补贴兑换券：</strong>
|
||
实付 {{ state.defaultPartnerRules.voucher_times || 1.5 }} 倍，分 {{ state.defaultPartnerRules.voucher_days || 365 }} 天线性释放
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 模式 1 / 2：独立设置分成规则面板 -->
|
||
<template v-if="state.commission_goods.status == 1 && (state.commission_goods.self_rules == 1 || state.commission_goods.self_rules == 2)">
|
||
<!-- 多规格切换与快捷操作栏 -->
|
||
<div class="sku-toolbar">
|
||
<div class="sa-flex" v-if="state.detailData?.is_sku == 1 && state.rulesType != 'batch'">
|
||
<span class="mr-2" style="font-size: 13px; font-weight: 500;">规格配置模式：</span>
|
||
<el-radio-group v-model="state.skuMode" size="small">
|
||
<el-radio-button label="unified">统一设置所有规格</el-radio-button>
|
||
<el-radio-button label="sku">按规格分别设置</el-radio-button>
|
||
</el-radio-group>
|
||
</div>
|
||
<div class="sa-flex" v-else>
|
||
<el-tag size="small" type="info">商品独立分成模式</el-tag>
|
||
</div>
|
||
<div class="sa-flex">
|
||
<el-button size="small" type="primary" plain @click="onFillDefaults(state.skuMode === 'sku' ? 'current_sku' : 'all_skus')">
|
||
一键填入系统默认值
|
||
</el-button>
|
||
<el-button size="small" type="success" plain v-if="state.skuMode === 'sku' && state.detailData?.sku_prices?.length > 1" @click="onSyncToAllSkus">
|
||
同步当前规则至全部规格
|
||
</el-button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 当按规格分别设置时的规格切换 Tabs -->
|
||
<div v-if="state.skuMode === 'sku' && state.detailData?.sku_prices?.length" style="margin-bottom: 16px;">
|
||
<el-radio-group v-model="state.activeSkuId" size="default">
|
||
<el-radio-button v-for="sku in state.detailData.sku_prices" :key="sku.id" :label="String(sku.id)">
|
||
{{ sku.goods_sku_text?.join(' / ') || '默认规格' }}（¥{{ sku.price }}）
|
||
</el-radio-button>
|
||
</el-radio-group>
|
||
</div>
|
||
|
||
<!-- 当前激活的表单对象引用 -->
|
||
<template v-for="curForm in [(state.skuMode === 'sku' && state.activeSkuId) ? state.skuRules[state.activeSkuId] : state.ruleForm]">
|
||
<!-- 1. 推荐开拓奖（推三返一） -->
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">1. 推荐开拓奖（推三返一循环返现）</div>
|
||
<span class="section-tip">直推有效单奖励，每 3 笔订单形成一个循环返还货款</span>
|
||
</div>
|
||
<div class="rules-grid">
|
||
<div class="field-item">
|
||
<div class="field-label">第 1 单返现金额</div>
|
||
<el-input v-model="curForm.push3_1" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">第 2 单返现金额</div>
|
||
<el-input v-model="curForm.push3_2" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">第 3 单返现金额（波峰档）</div>
|
||
<el-input v-model="curForm.push3_3" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 2. 创客进阶奖（极差基数）与协同奖 -->
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">2. 创客进阶奖（V1~V6极差基数）与协同奖</div>
|
||
<span class="section-tip">向上链条创客按自身基数减去已截留最高基数计提差额</span>
|
||
</div>
|
||
<div class="rules-grid-6" style="margin-bottom: 14px;">
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V1 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v1" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V2 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v2" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V3 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v3" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V4 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v4" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V5 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v5" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客 V6 进阶基数</div>
|
||
<el-input v-model="curForm.maker_v6" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
<div class="rules-grid-2">
|
||
<div class="field-item">
|
||
<div class="field-label">创客同级平级协同比例</div>
|
||
<el-input v-model="curForm.maker_peer_rate" type="number" :min="0" :max="100">
|
||
<template #append>%</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">创客下级反超卓越比例</div>
|
||
<el-input v-model="curForm.maker_overtaken_rate" type="number" :min="0" :max="100">
|
||
<template #append>%</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 3. 实体渠道与区域运营奖（团队拆分） -->
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">3. 实体渠道与区域运营奖（团队拆分）</div>
|
||
<span class="section-tip">无馆有县独享，有馆有县各分其半</span>
|
||
</div>
|
||
<div class="rules-grid-2" style="margin-bottom: 14px;">
|
||
<div class="field-item">
|
||
<div class="field-label">酒道馆运营奖基准</div>
|
||
<el-input v-model="curForm.venue_split" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">区县统筹全额（无馆时独享）</div>
|
||
<el-input v-model="curForm.county_full" type="number" :min="0">
|
||
<template #append>元</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
<div class="rules-grid-2">
|
||
<div class="field-item">
|
||
<div class="field-label">酒道馆平级协同比例</div>
|
||
<el-input v-model="curForm.venue_peer_rate" type="number" :min="0" :max="100">
|
||
<template #append>%</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">区县代理平级协同比例</div>
|
||
<el-input v-model="curForm.county_peer_rate" type="number" :min="0" :max="100">
|
||
<template #append>%</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 4. 消费补贴兑换券计划 -->
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">4. 消费补贴兑换券计划</div>
|
||
<span class="section-tip">买家本人下单实付金额按倍数赠送并在商城按日释放抵扣</span>
|
||
</div>
|
||
<div class="rules-grid-2">
|
||
<div class="field-item">
|
||
<div class="field-label">赠送兑换券倍数（相对计奖实付）</div>
|
||
<el-input v-model="curForm.voucher_times" type="number" :min="0" step="0.1">
|
||
<template #append>倍</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">线性释放周期天数</div>
|
||
<el-input v-model="curForm.voucher_days" type="number" :min="1">
|
||
<template #append>天</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 5. 全平台日结奖池注入（可选定制） -->
|
||
<div class="section-box">
|
||
<div class="section-header">
|
||
<div class="section-title">5. 全平台日结均分奖池注入（可选定制）</div>
|
||
<span class="section-tip">每日凌晨 00:30 全网有效订单向池中注入并由活跃身份均分</span>
|
||
</div>
|
||
<div class="rules-grid-2">
|
||
<div class="field-item">
|
||
<div class="field-label">酒道馆日结奖池单笔注入</div>
|
||
<el-input v-model="curForm.venue_share" type="number" :min="0">
|
||
<template #append>元/单</template>
|
||
</el-input>
|
||
</div>
|
||
<div class="field-item">
|
||
<div class="field-label">区县代理日结奖池单笔注入</div>
|
||
<el-input v-model="curForm.county_share" type="number" :min="0">
|
||
<template #append>元/单</template>
|
||
</el-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</template>
|
||
</el-form>
|
||
</el-scrollbar>
|
||
</el-main>
|
||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||
<el-button type="primary" size="large" @click="onConfirm">保存分成设置</el-button>
|
||
</el-footer>
|
||
</el-container>
|
||
</div> |