dm-design/web/merchant/pages/member/level-settings.html

310 lines
21 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>大数集市商户端 - 等级设置</title>
<link rel="stylesheet" href="../../css/styles.css">
</head>
<body>
<div class="min-h-screen bg-gray-50">
<!-- Header -->
<header class="bg-green-700 text-white px-4 py-3 flex items-center justify-between">
<div class="flex items-center gap-4">
<button onclick="window.location.href='../../index.html'" class="text-white hover:bg-green-600 p-2 rounded-md transition-colors">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7" />
</svg>
</button>
<h1 class="text-lg font-medium">大数集市商户端</h1>
</div>
<div class="flex items-center gap-2">
<button class="text-white hover:bg-green-600 p-2 rounded-md transition-colors">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
</svg>
</button>
<button class="text-white hover:bg-green-600 p-2 rounded-md transition-colors">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z" />
</svg>
</button>
<button class="text-white hover:bg-green-600 p-2 rounded-md transition-colors">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
</svg>
</button>
<button class="text-white hover:bg-green-600 p-2 rounded-md transition-colors">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 13a3 3 0 11-6 0 3 3 0 016 0z" />
</svg>
</button>
<div class="h-8 w-8 rounded-full bg-green-600 text-white flex items-center justify-center text-xs">
用户
</div>
</div>
</header>
<div class="flex">
<!-- Sidebar -->
<aside class="w-48 bg-white border-r border-gray-200 min-h-[calc(100vh-60px)]">
<!-- Search -->
<div class="p-3 border-b border-gray-100">
<input type="text" placeholder="快速搜索菜单" class="w-full text-sm border border-gray-200 rounded-md px-3 py-2 focus:border-green-500 focus:outline-none">
</div>
<!-- Navigation Menu -->
<nav class="py-2">
<div class="space-y-1">
<!-- Home -->
<div class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer menu-item" data-menu="home" onclick="navigateToPage(getRelativePath('index.html'))">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
<polyline points="9,22 9,12 15,12 15,22" />
</svg>
<span>首页</span>
</div>
<!-- Operations Management -->
<div>
<div class="flex items-center justify-between px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" onclick="toggleMenu('operations')">
<div class="flex items-center gap-3">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13h8V3H3v10zm0 8h8V16H3v5zm10-8h8V3h-8v10zm0 8h8V16h-8v5z" />
</svg>
<span>运营管理</span>
</div>
<svg class="h-3 w-3 transition-transform" id="operations-arrow" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m6 9 6 6 6-6" />
</svg>
</div>
</div>
<!-- Data Center -->
<div class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer menu-item" data-menu="data-center" onclick="navigateToPage(getRelativePath('pages/data-center.html'))">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<ellipse cx="12" cy="5" rx="9" ry="3" />
<path d="m3 5 9 9 9-9" />
<path d="m3 12 9 9 9-9" />
<path d="m3 5v14c0 3 4 6 9 6s9-3 9-6V5" />
</svg>
<span>数据中心</span>
</div>
<!-- Coupon Marketing Tool Management -->
<div class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer menu-item" data-menu="coupon-marketing" onclick="navigateToPage(getRelativePath('pages/coupon-marketing.html'))">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4" />
</svg>
<span>优惠券营销工具管理</span>
</div>
<!-- Pre-sale Marketing Tool Management -->
<div class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 20V10M6 16l6-6 6 6" />
</svg>
<span>预售营销工具管理</span>
</div>
<!-- Member Management -->
<div>
<div class="flex items-center justify-between px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" onclick="toggleMenu('member')">
<div class="flex items-center gap-3">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
<circle cx="9" cy="7" r="4" />
<path d="m22 21-3-3m0 0a8 8 0 1 1-11.31-11.31 8 8 0 0 1 11.31 11.31z" />
</svg>
<span>会员管理</span>
</div>
<svg class="h-3 w-3 transition-transform" id="member-arrow" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m6 9 6 6 6-6" />
</svg>
</div>
<div class="bg-gray-50 border-l-2 border-green-500 ml-4 hidden" id="member-submenu">
<div class="flex items-center gap-3 px-6 py-2 text-sm text-gray-600 hover:bg-gray-100 cursor-pointer menu-item" data-menu="level-settings" onclick="openLevelSettingsTab()">
<span>等级设置</span>
</div>
<div class="flex items-center gap-3 px-6 py-2 text-sm text-gray-600 hover:bg-gray-100 cursor-pointer" onclick="openMemberListTab()">
<span>会员查看</span>
</div>
<div class="flex items-center gap-3 px-6 py-2 text-sm text-gray-600 hover:bg-gray-100 cursor-pointer">
<span>积分任务</span>
</div>
<div class="flex items-center gap-3 px-6 py-2 text-sm text-gray-600 hover:bg-gray-100 cursor-pointer">
<span>积分商品</span>
</div>
<div class="flex items-center gap-3 px-6 py-2 text-sm text-gray-600 hover:bg-gray-100 cursor-pointer">
<span>积分订单</span>
</div>
</div>
</div>
<!-- Wallet Management -->
<div>
<div class="flex items-center justify-between px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" onclick="toggleMenu('wallet')">
<div class="flex items-center gap-3">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 12V5a4 4 0 0 1 4-4h6a4 4 0 0 1 4 4v7" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 20h18M3 20a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2h18a2 2 0 0 1 2 2v4a2 2 0 0 1-2 2H3z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20v-6" />
</svg>
<span>钱包管理</span>
</div>
<svg class="h-3 w-3 transition-transform" id="wallet-arrow" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m6 9 6 6 6-6" />
</svg>
</div>
</div>
<!-- Shipping Management -->
<div>
<div class="flex items-center justify-between px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50 cursor-pointer" onclick="toggleMenu('shipping')">
<div class="flex items-center gap-3">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 18V6a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v11a1 1 0 0 0 1 1h2" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 18H9" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14" />
<circle cx="17" cy="18" r="2" />
<circle cx="7" cy="18" r="2" />
</svg>
<span>运费管理</span>
</div>
<svg class="h-3 w-3 transition-transform" id="shipping-arrow" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m6 9 6 6 6-6" />
</svg>
</div>
</div>
</div>
</nav>
</aside>
<!-- Main Content -->
<main class="flex-1 p-6">
<!-- Tab Container -->
<div id="tab-container" class="bg-white rounded-lg shadow-sm border border-gray-200">
<!-- Tab Navigation -->
<div class="border-b border-gray-200">
<div class="flex items-center space-x-0" id="tab-nav">
<!-- Tabs will be dynamically added here -->
</div>
</div>
<!-- Tab Content -->
<div id="tab-content-area">
<!-- Tab contents will be dynamically added here -->
</div>
</div>
</main>
</div>
</div>
<!-- 添加优惠券弹窗 -->
<div id="coupon-modal" class="fixed inset-0 bg-black bg-opacity-50 hidden z-50 flex items-center justify-center" onclick="closeCouponModal(event)">
<div class="bg-white rounded-lg w-96 max-w-md mx-4 modal-content" onclick="event.stopPropagation()">
<div class="flex items-center justify-between p-4 border-b border-gray-200">
<h3 class="text-lg font-medium text-gray-900">添加优惠券</h3>
<button onclick="closeCouponModal()" class="text-gray-400 hover:text-gray-600">
<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<form id="coupon-form" class="p-4 space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">
<span class="text-red-500">*</span> 优惠券名称
</label>
<input type="text" id="coupon-name" value="生日优惠券"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500"
placeholder="请输入优惠券名称" required>
</div>
<div class="flex gap-4">
<div class="flex-1">
<label class="block text-sm font-medium text-gray-700 mb-1">
<span class="text-red-500">*</span> 优惠券门槛金额
</label>
<div class="flex items-center">
<input type="number" id="coupon-threshold" value="10" min="0"
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500"
required>
<div class="flex flex-col ml-2">
<button type="button" onclick="adjustThreshold(1)" class="px-2 py-1 text-xs bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded-t">
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7" />
</svg>
</button>
<button type="button" onclick="adjustThreshold(-1)" class="px-2 py-1 text-xs bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded-b border-t-0">
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg>
</button>
</div>
</div>
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">
<span class="text-red-500">*</span> 优惠券减免金额
</label>
<div class="flex items-center">
<input type="number" id="coupon-discount" value="1" min="0"
class="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500"
required>
<div class="flex flex-col ml-2">
<button type="button" onclick="adjustDiscount(1)" class="px-2 py-1 text-xs bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded-t">
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7" />
</svg>
</button>
<button type="button" onclick="adjustDiscount(-1)" class="px-2 py-1 text-xs bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded-b border-t-0">
<svg class="h-3 w-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg>
</button>
</div>
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">
<span class="text-red-500">*</span> 优惠券有效时间
</label>
<select id="coupon-validity"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500"
required>
<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>
</form>
<div class="flex justify-end gap-3 p-4 border-t border-gray-200">
<button onclick="closeCouponModal()"
class="px-4 py-2 text-gray-700 bg-gray-100 rounded-md hover:bg-gray-200 transition-colors">
取消
</button>
<button onclick="submitCoupon()"
class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors">
确认添加
</button>
</div>
</div>
</div>
<script src="../../js/common.js"></script>
<script src="../../js/sidebar.js"></script>
<script src="../../js/member-tabs.js"></script>
<script src="../../js/pages/level-settings.js"></script>
</body>
</html>