This commit is contained in:
linbin 2025-08-12 12:04:52 +08:00
parent 783abe8bf8
commit eb9673b40c
9 changed files with 134 additions and 31 deletions

View File

@ -302,17 +302,20 @@
</div>
<div class="info-row">
<span class="info-label">商品名称:</span>
<span class="info-value">黑木耳100g</span>
<span class="info-value">黑木耳</span>
</div>
<div class="info-row">
<span class="info-label">归属摊位:</span>
<span class="info-value">牛生蔬菜店</span>
</div>
<div class="info-row">
<span class="info-label">规格名称:</span>
<span class="info-value">小份</span>
</div>
<div class="info-row">
<span class="info-label">SKU-ID:</span>
<span class="info-value">194105142774503836</span>
</div>
<div class="form-group">
<label class="form-label">SKU-ID</label>
<input type="text" class="form-input" value="194105142774503836" readonly>
</div>
<div class="form-group">

View File

@ -253,32 +253,36 @@
<table>
<thead>
<tr>
<th>商品id</th>
<th>商品店铺</th>
<th>商品名称</th>
<th>商品id</th>
<th>商品规格</th>
<th>商品价格</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>1212</td>
<td>猪肉铺</td>
<td>猪肉</td>
<td>1212</td>
<td>大份</td>
<td>2元</td>
<td><a href="#" class="action-btn">添加为积分商品</a></td>
</tr>
<tr>
<td>1213</td>
<td>牛肉铺</td>
<td>牛肉</td>
<td>1213</td>
<td>小份</td>
<td>5元</td>
<td><a href="#" class="action-btn">添加为积分商品</a></td>
</tr>
<tr>
<td>1214</td>
<td>鸡肉铺</td>
<td>鸡肉</td>
<td>1214</td>
<td></td>
<td>3元</td>
<td><a href="#" class="action-btn">添加为积分商品</a></td>
</tr>

View File

@ -239,6 +239,7 @@
</th>
<th width="100">商品ID</th>
<th width="150">商品名称</th>
<th width="150">规格名称</th>
<th width="150">归属店铺</th>
<th width="100">兑换积分</th>
<th width="120">剩余兑换库存</th>
@ -252,7 +253,8 @@
<input type="checkbox" class="checkbox">
</td>
<td>001</td>
<td>黑木耳100g</td>
<td>黑木耳</td>
<td>小份</td>
<td>生生蔬菜店</td>
<td>1</td>
<td>10</td>
@ -269,7 +271,8 @@
<input type="checkbox" class="checkbox">
</td>
<td>002</td>
<td>苦瓜200g</td>
<td>黑木耳</td>
<td>大份</td>
<td>生生蔬菜店</td>
<td>1</td>
<td>10</td>
@ -286,7 +289,8 @@
<input type="checkbox" class="checkbox">
</td>
<td>003</td>
<td>番茄500g</td>
<td>番茄</td>
<td></td>
<td>生生蔬菜店</td>
<td>2</td>
<td>2</td>

View File

@ -252,7 +252,7 @@
<div class="modal">
<!-- Modal Header -->
<div class="modal-header">
<h2 class="modal-title">添加优惠券</h2>
<h2 class="modal-title">设置优惠券</h2>
<button class="close-button" onclick="closeModal()" title="关闭">×</button>
</div>

View File

@ -177,7 +177,7 @@
color: #666;
}
/* 添加优惠券按钮 */
/* 设置优惠券按钮 */
.add-coupon-btn {
background: white;
border: 1px dashed #ccc;
@ -233,7 +233,7 @@
font-size: 14px;
}
/* 兑换比例设置 */
/* 抵扣比例设置 */
.exchange-settings {
background: white;
border: 1px dashed #ccc;
@ -417,7 +417,7 @@
<th>成长值范围</th>
<th>开启会员折扣</th>
<th>折扣率%</th>
<th>开启积分兑换</th>
<th>开启积分抵扣</th>
<th>开启生日优惠券</th>
<th>生日优惠券操作</th>
<th>开启生日双倍积分</th>
@ -453,7 +453,7 @@
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox">
@ -490,7 +490,7 @@
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox">
@ -527,7 +527,7 @@
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox" checked>
@ -564,7 +564,7 @@
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox" checked>
@ -586,9 +586,9 @@
</div>
</div>
<!-- 金额与积分兑换比例设置 -->
<!-- 金额与积分抵扣比例设置 -->
<div class="exchange-settings">
<h2 class="section-title">金额与积分兑换比例设置</h2>
<h2 class="section-title">金额与积分抵扣比例设置</h2>
<div class="exchange-item">
<span>消费获得积分比例:消费</span>
<span class="exchange-value">1</span>
@ -598,7 +598,7 @@
</div>
<div class="exchange-item">
<span>积分抵扣金额比例:</span>
<span class="exchange-value">100</span>
<input type="number" class="setting-input" value="100" min="1" style="width: 80px; display: inline-block;">
<span>积分 =</span>
<span class="exchange-value">1</span>
<span></span>

View File

@ -151,6 +151,66 @@
line-height: 1.5;
}
/* 开关按钮 */
.switch {
position: relative;
display: inline-block;
width: 44px;
height: 24px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
border: 1px dashed #999;
transition: .4s;
border-radius: 24px;
}
.slider:before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 3px;
bottom: 3px;
background-color: white;
transition: .4s;
border-radius: 50%;
}
input:checked + .slider {
background-color: #28a745;
}
input:checked + .slider:before {
transform: translateX(20px);
}
/* 积分输入框 */
.points-input {
display: flex;
align-items: center;
gap: 5px;
}
.points-input .table-input {
max-width: 80px;
padding: 5px;
text-align: center;
}
/* 响应式设计 */
@media (max-width: 768px) {
.container {
@ -229,6 +289,7 @@
<th>所需成长值</th>
<th>会员人数</th>
<th>会员权益</th>
</tr>
</thead>
<tbody>
@ -236,25 +297,29 @@
<td class="level-name level-lv1">LV1</td>
<td class="growth-value">100</td>
<td class="member-count">1,250</td>
<td class="benefits">新会员欢迎礼包,享受基础会员价格优惠</td>
<td class="benefits">根据实际的会员内容生成</td>
</tr>
<tr>
<td class="level-name level-lv2">LV2</td>
<td class="growth-value">500</td>
<td class="member-count">850</td>
<td class="benefits">享受9.5折优惠,每月专属优惠券,生日礼品</td>
</tr>
<tr>
<td class="level-name level-lv3">LV3</td>
<td class="growth-value">1,200</td>
<td class="member-count">450</td>
<td class="benefits">享受9折优惠免费配送服务专属客服支持</td>
</tr>
<tr>
<td class="level-name level-lv4">LV4</td>
<td class="growth-value">2,500</td>
<td class="member-count">180</td>
<td class="benefits">享受8.5折优惠,优先配送,专属活动邀请,年度礼品</td>
</tr>
</tbody>
</table>

View File

@ -177,7 +177,7 @@
color: #666;
}
/* 添加优惠券按钮 */
/* 设置优惠券按钮 */
.add-coupon-btn {
background: #007bff;
border: 1px solid #007bff;
@ -361,7 +361,8 @@
<th>成长值范围</th>
<th>开启会员折扣</th>
<th>折扣率%</th>
<th>开启积分兑换</th>
<th>开启积分抵扣</th>
<th>积分抵扣额度</th>
<th>开启生日优惠券</th>
<th>生日优惠券操作</th>
<th>开启生日双倍积分</th>
@ -391,13 +392,19 @@
<span class="slider"></span>
</label>
</td>
<td>
<div style="display: flex; align-items: center; justify-content: center; gap: 5px;">
<input type="number" class="table-input" value="100" min="1" style="max-width: 80px;">
<span>积分=1元</span>
</div>
</td>
<td>
<label class="switch">
<input type="checkbox">
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox">
@ -428,13 +435,19 @@
<span class="slider"></span>
</label>
</td>
<td>
<div style="display: flex; align-items: center; justify-content: center; gap: 5px;">
<input type="number" class="table-input" value="100" min="1" style="max-width: 80px;">
<span>积分=1元</span>
</div>
</td>
<td>
<label class="switch">
<input type="checkbox" checked>
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox" checked>
@ -465,13 +478,19 @@
<span class="slider"></span>
</label>
</td>
<td>
<div style="display: flex; align-items: center; justify-content: center; gap: 5px;">
<input type="number" class="table-input" value="100" min="1" style="max-width: 80px;">
<span>积分=1元</span>
</div>
</td>
<td>
<label class="switch">
<input type="checkbox" checked>
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox" checked>
@ -502,13 +521,19 @@
<span class="slider"></span>
</label>
</td>
<td>
<div style="display: flex; align-items: center; justify-content: center; gap: 5px;">
<input type="number" class="table-input" value="100" min="1" style="max-width: 80px;">
<span>积分=1元</span>
</div>
</td>
<td>
<label class="switch">
<input type="checkbox" checked>
<span class="slider"></span>
</label>
</td>
<td><button class="add-coupon-btn">添加优惠券</button></td>
<td><button class="add-coupon-btn">设置优惠券</button></td>
<td>
<label class="switch">
<input type="checkbox" checked>

View File

@ -100,6 +100,8 @@
background-color: white;
}
.table-row:hover {
background-color: #f8f9fa;
}

Binary file not shown.