This commit is contained in:
parent
5555189e52
commit
67e06f8be4
|
|
@ -217,7 +217,6 @@
|
|||
<h1 class="page-title">会员等级明细</h1>
|
||||
<div class="action-buttons">
|
||||
<button class="btn btn-primary">等级编辑</button>
|
||||
<button class="btn btn-success">提交</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>时尚服装店 - 会员编辑</title>
|
||||
<title>时尚服装店 - 等级编辑</title>
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
|
|
@ -41,19 +41,19 @@
|
|||
}
|
||||
|
||||
.submit-btn {
|
||||
background: white;
|
||||
border: 1px dashed #999;
|
||||
background: #007bff;
|
||||
border: 1px solid #007bff;
|
||||
padding: 10px 24px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.submit-btn:hover {
|
||||
background: #f5f5f5;
|
||||
border-color: #666;
|
||||
background: #0056b3;
|
||||
border-color: #0056b3;
|
||||
}
|
||||
|
||||
/* 会员等级表格 */
|
||||
|
|
@ -164,7 +164,7 @@
|
|||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #999;
|
||||
background-color: #28a745;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
|
|
@ -179,18 +179,34 @@
|
|||
|
||||
/* 添加优惠券按钮 */
|
||||
.add-coupon-btn {
|
||||
background: white;
|
||||
border: 1px dashed #ccc;
|
||||
background: #007bff;
|
||||
border: 1px solid #007bff;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-coupon-btn:hover {
|
||||
border-color: #999;
|
||||
background: #f9f9f9;
|
||||
background: #0056b3;
|
||||
border-color: #0056b3;
|
||||
}
|
||||
|
||||
/* 编辑按钮 */
|
||||
.edit-btn {
|
||||
background: #007bff;
|
||||
border: 1px solid #007bff;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.edit-btn:hover {
|
||||
background: #0056b3;
|
||||
border-color: #0056b3;
|
||||
}
|
||||
|
||||
/* 积分设置区域 */
|
||||
|
|
@ -233,8 +249,8 @@
|
|||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* 兑换比例设置 */
|
||||
.exchange-settings {
|
||||
/* 积分任务管理 */
|
||||
.points-task-settings {
|
||||
background: white;
|
||||
border: 1px dashed #ccc;
|
||||
border-radius: 8px;
|
||||
|
|
@ -242,52 +258,41 @@
|
|||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.exchange-item {
|
||||
margin-bottom: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
.task-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.exchange-value {
|
||||
.task-table th,
|
||||
.task-table td {
|
||||
padding: 12px;
|
||||
text-align: left;
|
||||
border: 1px dashed #ddd;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.task-table th {
|
||||
background: #f8f9fa;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
/* 限制设置 */
|
||||
.limit-settings {
|
||||
background: white;
|
||||
border: 1px dashed #ccc;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.radio-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.radio-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.radio-item input[type="radio"] {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
accent-color: #666;
|
||||
}
|
||||
|
||||
.radio-item label {
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.task-table td {
|
||||
background: white;
|
||||
}
|
||||
|
||||
.task-table td:nth-child(3),
|
||||
.task-table td:nth-child(4) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.task-table td:nth-child(2) {
|
||||
color: #666;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
|
|
@ -325,6 +330,15 @@
|
|||
.setting-label {
|
||||
min-width: auto;
|
||||
}
|
||||
|
||||
.task-table {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.task-table th,
|
||||
.task-table td {
|
||||
padding: 8px 4px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
@ -332,7 +346,7 @@
|
|||
<div class="container">
|
||||
<!-- 页面头部 -->
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">时尚服装店 - 会员编辑</h1>
|
||||
<h1 class="page-title">时尚服装店 - 等级编辑</h1>
|
||||
<button class="submit-btn">提交</button>
|
||||
</div>
|
||||
|
||||
|
|
@ -347,7 +361,7 @@
|
|||
<th>成长值范围</th>
|
||||
<th>开启会员折扣</th>
|
||||
<th>折扣率%</th>
|
||||
<th>开启积分兑换</th>
|
||||
<th>开启积分奖励</th>
|
||||
<th>开启生日优惠券</th>
|
||||
<th>生日优惠券操作</th>
|
||||
<th>开启生日双倍积分</th>
|
||||
|
|
@ -356,12 +370,12 @@
|
|||
<tbody>
|
||||
<tr>
|
||||
<td><span class="level-number">LV1</span></td>
|
||||
<td><input type="text" class="table-input" value="青铜会员" placeholder="等级名称"></td>
|
||||
<td><input type="text" class="table-input" value="铜牌会员" placeholder="等级名称"></td>
|
||||
<td>
|
||||
<div class="range-input">
|
||||
<input type="number" class="table-input" value="0" min="0">
|
||||
<span>-</span>
|
||||
<input type="number" class="table-input" value="999" min="0">
|
||||
<input type="number" class="table-input" value="100" min="0">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
|
|
@ -370,10 +384,10 @@
|
|||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><input type="number" class="table-input" value="95" min="0" max="100" step="0.1"></td>
|
||||
<td><input type="number" class="table-input" value="5" min="0" max="100" step="0.1"></td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
<input type="checkbox">
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
|
|
@ -393,12 +407,12 @@
|
|||
</tr>
|
||||
<tr>
|
||||
<td><span class="level-number">LV2</span></td>
|
||||
<td><input type="text" class="table-input" value="白银会员" placeholder="等级名称"></td>
|
||||
<td><input type="text" class="table-input" value="银牌会员" placeholder="等级名称"></td>
|
||||
<td>
|
||||
<div class="range-input">
|
||||
<input type="number" class="table-input" value="1000" min="0">
|
||||
<input type="number" class="table-input" value="101" min="0">
|
||||
<span>-</span>
|
||||
<input type="number" class="table-input" value="2999" min="0">
|
||||
<input type="number" class="table-input" value="500" min="0">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
|
|
@ -407,7 +421,7 @@
|
|||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><input type="number" class="table-input" value="90" min="0" max="100" step="0.1"></td>
|
||||
<td><input type="number" class="table-input" value="10" min="0" max="100" step="0.1"></td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
|
|
@ -423,19 +437,19 @@
|
|||
<td><button class="add-coupon-btn">添加优惠券</button></td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox">
|
||||
<input type="checkbox" checked>
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="level-number">LV3</span></td>
|
||||
<td><input type="text" class="table-input" value="黄金会员" placeholder="等级名称"></td>
|
||||
<td><input type="text" class="table-input" value="金牌会员" placeholder="等级名称"></td>
|
||||
<td>
|
||||
<div class="range-input">
|
||||
<input type="number" class="table-input" value="3000" min="0">
|
||||
<input type="number" class="table-input" value="501" min="0">
|
||||
<span>-</span>
|
||||
<input type="number" class="table-input" value="5999" min="0">
|
||||
<input type="number" class="table-input" value="1200" min="0">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
|
|
@ -444,7 +458,7 @@
|
|||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><input type="number" class="table-input" value="85" min="0" max="100" step="0.1"></td>
|
||||
<td><input type="number" class="table-input" value="15" min="0" max="100" step="0.1"></td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
|
|
@ -470,9 +484,9 @@
|
|||
<td><input type="text" class="table-input" value="钻石会员" placeholder="等级名称"></td>
|
||||
<td>
|
||||
<div class="range-input">
|
||||
<input type="number" class="table-input" value="6000" min="0">
|
||||
<input type="number" class="table-input" value="1201" min="0">
|
||||
<span>-</span>
|
||||
<input type="number" class="table-input" value="99999" min="0">
|
||||
<input type="number" class="table-input" value="9999" min="0">
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
|
|
@ -481,7 +495,7 @@
|
|||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><input type="number" class="table-input" value="80" min="0" max="100" step="0.1"></td>
|
||||
<td><input type="number" class="table-input" value="20" min="0" max="100" step="0.1"></td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
|
|
@ -516,42 +530,76 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 金额与积分兑换比例设置 -->
|
||||
<div class="exchange-settings">
|
||||
<h2 class="section-title">金额与积分兑换比例设置</h2>
|
||||
<div class="exchange-item">
|
||||
<span>消费获得积分比例：消费</span>
|
||||
<span class="exchange-value">1</span>
|
||||
<span>元 =</span>
|
||||
<span class="exchange-value">1</span>
|
||||
<span>积分</span>
|
||||
</div>
|
||||
<div class="exchange-item">
|
||||
<span>积分抵扣金额比例：</span>
|
||||
<span class="exchange-value">100</span>
|
||||
<span>积分 =</span>
|
||||
<span class="exchange-value">1</span>
|
||||
<span>元</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 单笔订单最大积分使用限制 -->
|
||||
<div class="limit-settings">
|
||||
<h2 class="section-title">单笔订单最大积分使用限制</h2>
|
||||
<div class="radio-group">
|
||||
<div class="radio-item">
|
||||
<input type="radio" id="no-limit" name="limit-type" value="no-limit" checked>
|
||||
<label for="no-limit">不限制</label>
|
||||
</div>
|
||||
<div class="radio-item">
|
||||
<input type="radio" id="percentage-limit" name="limit-type" value="percentage">
|
||||
<label for="percentage-limit">按订单金额百分比限制</label>
|
||||
</div>
|
||||
<div class="radio-item">
|
||||
<input type="radio" id="fixed-limit" name="limit-type" value="fixed">
|
||||
<label for="fixed-limit">按固定金额限制</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 积分任务管理 -->
|
||||
<div class="points-task-settings">
|
||||
<h2 class="section-title">积分任务管理</h2>
|
||||
<table class="task-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>任务名称</th>
|
||||
<th>任务描述</th>
|
||||
<th>是否启用</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>每日签到</strong></td>
|
||||
<td>第一天签到1分，第二天2分，第三天3分，连续7天循环</td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><button class="edit-btn">编辑</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>浏览商品</strong></td>
|
||||
<td>浏览一个商品获得1分，每天最多奖励2分</td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><button class="edit-btn">编辑</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>购买商品</strong></td>
|
||||
<td>购买1元=1分，每天最多获得500分</td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox" checked>
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><button class="edit-btn">编辑</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>分享商品</strong></td>
|
||||
<td>分享一个商品获得5分，每天最多奖励3次</td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox">
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><button class="edit-btn">编辑</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>评价商品</strong></td>
|
||||
<td>评价一个商品获得10分，文字评价+图片可获得20分</td>
|
||||
<td>
|
||||
<label class="switch">
|
||||
<input type="checkbox">
|
||||
<span class="slider"></span>
|
||||
</label>
|
||||
</td>
|
||||
<td><button class="edit-btn">编辑</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue