diff --git a/apps/web/src/styles.css b/apps/web/src/styles.css index 9723c8a..bd51860 100644 --- a/apps/web/src/styles.css +++ b/apps/web/src/styles.css @@ -92,11 +92,44 @@ input:focus-visible { .top-actions { display: grid; - grid-template-columns: 56px 1fr 40px; + grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 10px; } +.header-right-actions { + display: flex; + align-items: center; + justify-content: flex-end; + gap: 6px; +} + +.currency-display-toggle { + height: 32px; + display: inline-flex; + align-items: stretch; + border: 1px solid rgba(255, 255, 255, 0.28); + border-radius: 7px; + padding: 2px; + background: rgba(0, 0, 0, 0.12); +} + +.currency-display-toggle button { + min-width: 32px; + border: 0; + border-radius: 5px; + padding: 0 6px; + background: transparent; + color: rgba(255, 255, 255, 0.72); + font-size: 11px; + font-weight: 700; +} + +.currency-display-toggle button.active { + background: rgba(255, 255, 255, 0.92); + color: #24766d; +} + .participant-avatars { width: 56px; height: 40px; diff --git a/apps/web/src/views/LedgerView.vue b/apps/web/src/views/LedgerView.vue index 15ecfb8..f8e3772 100644 --- a/apps/web/src/views/LedgerView.vue +++ b/apps/web/src/views/LedgerView.vue @@ -32,6 +32,7 @@ const store = useEntryStore(); const ledgerStore = useLedgerStore(); const router = useRouter(); const moreMenuOpen = ref(false); +const showBaseCurrency = ref(true); const participantOpen = ref(false); const shareOpen = ref(false); const shareFeedback = ref(""); @@ -435,9 +436,15 @@ async function shareLedger() { {{ ledgerStore.currentLedger?.name ?? "选择账本" }} - +
+
+ + +
+ +
@@ -554,13 +561,11 @@ async function shareLedger() {
- {{ entry.type === "expense" ? "−" : "+" }}{{ entry.baseAmount === null - ? formatCurrencyAmount(entry.amount, entry.currency) - : `¥${formatMoney(entry.baseAmount)}` }} + {{ entry.type === "expense" ? "−" : "+" }}{{ showBaseCurrency && entry.baseAmount !== null + ? `¥${formatMoney(entry.baseAmount)}` + : formatCurrencyAmount(entry.amount, entry.currency) }} - {{ entry.currency === "CNY" || entry.baseAmount === null - ? formatTime(entry.occurredAt) - : formatCurrencyAmount(entry.amount, entry.currency) }} + {{ formatTime(entry.occurredAt) }}