161 lines
5.3 KiB
HTML
161 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>等级编辑 - H5</title>
|
||
<link rel="stylesheet" href="../css/mobile.css">
|
||
<style>
|
||
.level-detail-row {
|
||
background: #f8f9fa;
|
||
border-top: 2px solid #4CAF50;
|
||
}
|
||
.level-detail-content {
|
||
padding: 15px;
|
||
border-left: 3px solid #4CAF50;
|
||
margin: 10px 0;
|
||
}
|
||
.detail-form-group {
|
||
margin-bottom: 15px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 8px 0;
|
||
border-bottom: 1px solid #eee;
|
||
}
|
||
.detail-form-group:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.detail-label {
|
||
font-weight: bold;
|
||
color: #333;
|
||
flex: 1;
|
||
font-size: 14px;
|
||
}
|
||
.detail-input {
|
||
flex: 1;
|
||
text-align: right;
|
||
}
|
||
.detail-input input {
|
||
width: 80px;
|
||
padding: 5px;
|
||
border: 1px solid #ddd;
|
||
border-radius: 3px;
|
||
text-align: center;
|
||
}
|
||
.detail-actions {
|
||
margin-top: 15px;
|
||
text-align: center;
|
||
padding-top: 15px;
|
||
border-top: 2px solid #eee;
|
||
}
|
||
.coupon-modal {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background: rgba(0,0,0,0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
z-index: 1000;
|
||
}
|
||
.coupon-modal-content {
|
||
background: white;
|
||
padding: 20px;
|
||
border-radius: 8px;
|
||
width: 90%;
|
||
max-width: 400px;
|
||
}
|
||
.expand-btn {
|
||
background: #4CAF50;
|
||
color: white;
|
||
border: none;
|
||
padding: 8px 12px;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
font-size: 12px;
|
||
}
|
||
.expand-btn:hover {
|
||
background: #45a049;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="page-container">
|
||
<!-- 页面头部 -->
|
||
<div class="page-header">
|
||
<button class="back-btn" onclick="goBack()">←</button>
|
||
<div class="page-title" id="page-title">等级编辑</div>
|
||
</div>
|
||
|
||
<!-- 页面内容 -->
|
||
<div class="page-content">
|
||
<!-- 操作按钮 -->
|
||
<div style="margin-bottom: 15px;">
|
||
<button class="btn btn-secondary" onclick="goBack()">关闭</button>
|
||
<button class="btn btn-primary" onclick="submitEdit()">提交</button>
|
||
</div>
|
||
|
||
<!-- 等级编辑表格 -->
|
||
<table class="simple-table">
|
||
<thead>
|
||
<tr>
|
||
<th>等级</th>
|
||
<th>等级名称</th>
|
||
<th>等级详情</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="level-edit-table">
|
||
<!-- 数据将通过JavaScript动态填充 -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 优惠券弹窗 -->
|
||
<div id="coupon-modal" class="coupon-modal hidden" onclick="closeCouponModal(event)">
|
||
<div class="coupon-modal-content" onclick="event.stopPropagation()">
|
||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;">
|
||
<h3>添加优惠券</h3>
|
||
<button onclick="closeCouponModal()" style="background: none; border: none; font-size: 18px;">×</button>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label">优惠券名称</label>
|
||
<input type="text" id="coupon-name" class="form-input" value="生日优惠券">
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label">优惠券门槛金额</label>
|
||
<input type="number" id="coupon-threshold" class="form-input" value="10" min="0">
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label">优惠券减免金额</label>
|
||
<input type="number" id="coupon-discount" class="form-input" value="1" min="0">
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label">优惠券有效时间</label>
|
||
<select id="coupon-validity" class="form-select">
|
||
<option value="1">1天</option>
|
||
<option value="7">7天</option>
|
||
<option value="30">30天</option>
|
||
<option value="90">90天</option>
|
||
<option value="365">1年</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div style="text-align: right; margin-top: 20px;">
|
||
<button class="btn btn-secondary" onclick="closeCouponModal()">取消</button>
|
||
<button class="btn btn-primary" onclick="submitCoupon()">确认添加</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="../js/mobile-common.js"></script>
|
||
<script src="../js/pages/level-edit.js"></script>
|
||
</body>
|
||
</html> |