jacy/dukang
1
0
Fork 0
Code Issues Pull Requests Actions 8 Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Jacy
2026-06-30 10:33:56 +08:00
commit 6e047dc0a5
607 changed files with 65966 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/shop/10_门店核销记录页_S_02_493d65d2/code.html
+209
View File
@@ -0,0 +1,209 @@
<!DOCTYPE html><html lang="zh-CN"><head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" name="viewport">
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700&amp;family=Be+Vietnam+Pro:wght@400;500&amp;family=Inter:wght@400;500;600&amp;display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet">
<!-- Theme Configuration -->
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
"colors": {
"primary-fixed-dim": "#ffb3ae",
"on-tertiary-fixed": "#141e19",
"secondary-container": "#fed65b",
"surface-dim": "#dadad8",
"surface-container-high": "#e9e8e6",
"subtle-gray": "#999999",
"tertiary-container": "#4e5852",
"on-primary-fixed-variant": "#910817",
"on-tertiary-fixed-variant": "#3f4943",
"status-blue": "#2A6EBB",
"tertiary-fixed": "#dae5dd",
"inverse-primary": "#ffb3ae",
"outline-variant": "#e2bebc",
"on-secondary-fixed": "#241a00",
"surface-container-highest": "#e3e2e0",
"on-surface": "#1a1c1b",
"on-secondary-fixed-variant": "#574500",
"on-error-container": "#93000a",
"error-container": "#ffdad6",
"on-background": "#1a1c1b",
"tertiary-fixed-dim": "#bec9c2",
"surface-container-lowest": "#ffffff",
"on-secondary": "#ffffff",
"on-primary": "#ffffff",
"secondary-fixed-dim": "#e9c349",
"inverse-on-surface": "#f1f1ef",
"on-primary-fixed": "#410004",
"tertiary": "#37413b",
"primary-container": "#a61d24",
"surface": "#faf9f7",
"on-tertiary-container": "#c2cdc6",
"on-error": "#ffffff",
"heritage-red": "#A61D24",
"primary": "#820012",
"on-tertiary": "#ffffff",
"secondary-fixed": "#ffe088",
"secondary": "#735c00",
"aged-amber": "#FFBF00",
"ink-black": "#1A1A1A",
"error": "#ba1a1a",
"success-green": "#2D6A4F",
"primary-fixed": "#ffdad7",
"surface-variant": "#e3e2e0",
"inverse-surface": "#2f3130",
"surface-container": "#efeeec",
"outline": "#8d706e",
"surface-container-low": "#f4f3f1",
"background": "#faf9f7",
"surface-bright": "#faf9f7",
"on-primary-container": "#ffb9b4",
"on-surface-variant": "#5a413f"
},
"borderRadius": {
"DEFAULT": "0.25rem",
"lg": "0.5rem",
"xl": "0.75rem",
"full": "9999px"
},
"spacing": {
"stack-md": "16px",
"base": "8px",
"stack-sm": "4px",
"stack-lg": "32px",
"margin-page": "20px",
"gutter-card": "12px"
},
"fontFamily": {
"headline-xl": ["Manrope"],
"headline-md": ["Manrope"],
"coupon-amount": ["Manrope"],
"body-md": ["Be Vietnam Pro"],
"headline-lg-mobile": ["Manrope"],
"body-lg": ["Be Vietnam Pro"],
"headline-lg": ["Manrope"],
"label-md": ["Inter"]
},
"fontSize": {
"headline-xl": ["32px", {"lineHeight": "40px", "letterSpacing": "-0.02em", "fontWeight": "700"}],
"headline-md": ["18px", {"lineHeight": "26px", "fontWeight": "600"}],
"coupon-amount": ["28px", {"lineHeight": "28px", "fontWeight": "700"}],
"body-md": ["14px", {"lineHeight": "20px", "fontWeight": "400"}],
"headline-lg-mobile": ["20px", {"lineHeight": "28px", "fontWeight": "600"}],
"body-lg": ["16px", {"lineHeight": "24px", "fontWeight": "400"}],
"headline-lg": ["24px", {"lineHeight": "32px", "fontWeight": "600"}],
"label-md": ["12px", {"lineHeight": "16px", "letterSpacing": "0.05em", "fontWeight": "500"}]
}
}
}
}
</script>
<style>
.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.active-tab::after {
content: '';
position: absolute;
bottom: 0;
left: 20%;
right: 20%;
height: 3px;
background-color: #A61D24;
border-radius: 2px;
}
body {
background-color: #faf9f7;
-webkit-tap-highlight-color: transparent;
}
.summary-card-glow {
box-shadow: 0px 4px 20px rgba(166, 29, 29, 0.08);
}
.glass-header {
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
</style>
</head>
<body class="font-body-md text-on-surface antialiased">
<!-- TopAppBar -->
<header class="fixed top-0 left-0 w-full z-50 bg-surface/80 glass-header flex items-center px-margin-page h-14">
<button class="flex items-center justify-center w-8 h-8 active:opacity-70 transition-opacity duration-200">
<span class="material-symbols-outlined text-primary" data-icon="arrow_back">arrow_back</span>
</button>
<h1 class="flex-1 text-center font-headline-md text-headline-md font-bold text-heritage-red ml-[-32px]">核销记录</h1>
</header>
<main class="pt-14 pb-24">
<!-- FilterBar (Sticky) -->
<nav class="sticky top-14 z-40 bg-surface flex border-b border-surface-container-high overflow-x-auto no-scrollbar"><div class="flex flex-col w-full bg-surface border-b border-surface-container-high"><div class="flex border-b border-surface-container-high/50"><button class="relative flex-1 py-3 text-center font-label-md text-label-md text-primary font-bold active-tab" onclick="switchTab(this)">今日</button><button class="relative flex-1 py-3 text-center font-label-md text-label-md text-subtle-gray active:opacity-70" onclick="switchTab(this)">近7日</button><button class="relative flex-1 py-3 text-center font-label-md text-label-md text-subtle-gray active:opacity-70" onclick="switchTab(this)">近30日</button></div><div class="flex px-4 py-2 space-x-2 overflow-x-auto no-scrollbar"><button class="px-4 py-1 rounded-full bg-primary text-white text-[12px] font-medium">全部</button><button class="px-4 py-1 rounded-full bg-surface-container-high text-on-surface-variant text-[12px]">待打款</button><button class="px-4 py-1 rounded-full bg-surface-container-high text-on-surface-variant text-[12px]">已打款</button></div></div></nav>
<!-- SummaryCard -->
<section class="px-margin-page mt-stack-md">
<div class="bg-primary-fixed/30 p-margin-page rounded-xl border border-primary-fixed-dim/20 summary-card-glow relative overflow-hidden">
<!-- Atmospheric background element -->
<div class="absolute -right-4 -top-4 w-24 h-24 bg-primary/5 rounded-full blur-2xl"></div>
<div class="flex flex-col space-y-stack-sm"><div class="grid grid-cols-2 gap-4"><div class="flex flex-col"><span class="font-label-md text-label-md text-primary/70">期间核销总额</span><div class="flex items-baseline space-x-1"><span class="font-headline-md text-headline-md text-primary">¥</span><span class="font-headline-md text-headline-md text-primary tracking-tight">2,000.00</span></div></div><div class="flex flex-col"><span class="font-label-md text-label-md text-primary/70">期间到账总额</span><div class="flex items-baseline space-x-1"><span class="font-headline-md text-headline-md text-primary">¥</span><span class="font-headline-md text-headline-md text-primary tracking-tight">1,200.00</span></div></div></div><div class="flex items-center space-x-2 pt-2 border-t border-primary/10"><span class="material-symbols-outlined text-[16px] text-success-green" style="font-variation-settings: 'FILL' 1;">check_circle</span><span class="font-body-md text-body-md text-on-surface-variant">结算比例: 60% (按6折结算)</span></div></div>
</div>
</section>
<!-- RecordList -->
<section class="px-margin-page mt-stack-lg">
<div class="flex justify-between items-center mb-stack-md">
<h3 class="font-headline-md text-headline-md text-on-surface">交易详情</h3>
<span class="font-label-md text-label-md text-subtle-gray">共 2 笔记录</span>
</div>
<div class="space-y-4"><div class="bg-surface-container-lowest p-4 rounded-xl shadow-[0px_4px_20px_rgba(166,29,36,0.05)] border border-surface-container-high space-y-3"><div class="flex justify-between items-start"><div class="space-y-1"><div class="flex items-center space-x-2"><span class="font-label-md text-label-md text-subtle-gray">订单号</span><span class="font-body-md text-body-md text-on-surface font-medium">DK772839401</span></div><p class="font-label-md text-label-md text-subtle-gray">核销时间: 2023-10-24 15:45</p></div><span class="bg-success-green/10 text-success-green px-2 py-0.5 rounded text-[10px] font-bold">已打款</span></div><div class="grid grid-cols-2 gap-2 py-2 bg-surface/50 rounded-lg px-3"><div class="flex flex-col"><span class="text-[10px] text-subtle-gray">核销金额(券面)</span><span class="text-body-md font-bold text-on-surface">¥166.67</span></div><div class="flex flex-col"><span class="text-[10px] text-subtle-gray">到账金额(6折)</span><span class="text-body-md font-bold text-heritage-red">¥100.00</span></div></div><div class="flex justify-between items-center text-[11px] text-subtle-gray"><p class="">打款时间: 2023-10-24 18:00</p><div class="flex items-center text-on-surface-variant"><span class="material-symbols-outlined text-[12px] mr-1">restaurant</span>杜康·御享联名餐厅</div></div></div><div class="bg-surface-container-lowest p-4 rounded-xl shadow-[0px_4px_20px_rgba(166,29,36,0.05)] border border-surface-container-high space-y-3"><div class="flex justify-between items-start"><div class="space-y-1"><div class="flex items-center space-x-2"><span class="font-label-md text-label-md text-subtle-gray">订单号</span><span class="font-body-md text-body-md text-on-surface font-medium">DK772839395</span></div><p class="font-label-md text-label-md text-subtle-gray">核销时间: 2023-10-24 14:20</p></div><span class="bg-aged-amber/10 text-aged-amber px-2 py-0.5 rounded text-[10px] font-bold">待打款</span></div><div class="grid grid-cols-2 gap-2 py-2 bg-surface/50 rounded-lg px-3"><div class="flex flex-col"><span class="text-[10px] text-subtle-gray">核销金额(券面)</span><span class="text-body-md font-bold text-on-surface">¥333.33</span></div><div class="flex flex-col"><span class="text-[10px] text-subtle-gray">到账金额(6折)</span><span class="text-body-md font-bold text-heritage-red">¥200.00</span></div></div><div class="flex justify-between items-center text-[11px] text-subtle-gray"><p class="">预计打款: T+1工作日</p><div class="flex items-center text-on-surface-variant"><span class="material-symbols-outlined text-[12px] mr-1">restaurant</span>杜康·御享联名餐厅</div></div></div></div>
</section>
<!-- No More Data Footer -->
<div class="py-stack-lg flex flex-col items-center">
<div class="w-12 h-[1px] bg-surface-container-highest mb-2"></div>
<p class="font-label-md text-label-md text-subtle-gray">已显示全部核销记录</p>
</div>
</main>
<!-- BottomNavBar -->
<nav class="fixed bottom-0 left-0 w-full z-50 flex justify-around items-center pt-2 pb-safe px-4 bg-surface rounded-t-xl shadow-[0px_-4px_20px_rgba(166,29,36,0.05)]" style="padding-bottom: env(safe-area-inset-bottom);">
<a class="flex flex-col items-center justify-center text-subtle-gray active:bg-surface-container-low transition-transform duration-150 scale-95" href="#">
<span class="material-symbols-outlined" data-icon="home">home</span>
<span class="font-label-md text-label-md mt-1">首页</span>
</a>
<a class="flex flex-col items-center justify-center text-primary font-bold active:bg-surface-container-low transition-transform duration-150 scale-95" href="#">
<span class="material-symbols-outlined" data-icon="receipt_long" style="font-variation-settings: 'FILL' 1;">receipt_long</span>
<span class="font-label-md text-label-md mt-1">核销记录</span>
</a>
<a class="flex flex-col items-center justify-center text-subtle-gray active:bg-surface-container-low transition-transform duration-150 scale-95" href="#">
<span class="material-symbols-outlined" data-icon="person">person</span>
<span class="font-label-md text-label-md mt-1">我的</span>
</a>
</nav>
<script>
function switchTab(element) {
// Remove active classes from all siblings
const parent = element.parentElement;
const tabs = parent.querySelectorAll('button');
tabs.forEach(tab => {
tab.classList.remove('active-tab', 'text-primary', 'font-bold');
tab.classList.add('text-subtle-gray');
});
// Add active classes to current
element.classList.add('active-tab', 'text-primary', 'font-bold');
element.classList.remove('text-subtle-gray');
// Add a slight haptic feel
if (window.navigator.vibrate) {
window.navigator.vibrate(10);
}
}
// Handle Safe Area for mobile
function handleSafeArea() {
const pbSafe = 'padding-bottom: env(safe-area-inset-bottom);';
document.querySelector('.pb-safe').style = pbSafe;
}
window.addEventListener('load', handleSafeArea);
</script>
</body></html>
pages/shop/10_门店核销记录页_S_02_493d65d2/meta.json
+6
View File
@@ -0,0 +1,6 @@
{
"title": "门店核销记录页 (S-02)",
"screenId": "493d65d221044751b2c9167d2af85c3d",
"category": "shop",
"syncedAt": "2026-06-29T02:35:13.102Z"
}
pages/shop/10_门店核销记录页_S_02_493d65d2/screen.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB