- A01~A05 hero 다섯 벌 · 구역 제목 복제 CSS 걷고 공개 화면 틀 한 벌(wide 옵션 · 구역 제목 가운데 · 머리 아랫줄은 자리 안 먹는 그림자) - 카드 = 카드 부품(로그인 · 가입 · 지원 · 약관 · 기능 카드 · 소식 줄 · B11 단계 카드) · 지원 성공 · B10 안내 = 띠 알림 · 태그 = 배지 - A07 약관 날 체크 · 날 details = 체크 + 접이 부품 · A08 날 textarea = 입력 여러 줄 · 빈 소식 = 빈 상태 - 죽은 A07_Register_UI_Page · 쓰이지 않는 CSS 걷음 · 띠 알림 hidden 받음 - 지킴 시험 test_553_7_public_pages Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
46 lines
1.8 KiB
TypeScript
46 lines
1.8 KiB
TypeScript
import { createBadge } from "@ui/ui_template_badge";
|
|
import { createBanner } from "@ui/ui_template_banner";
|
|
import { createButton } from "@ui/ui_template_elements";
|
|
import { section, table, text } from "@ui/ui_template_general_blocks";
|
|
import { createGeneralLayout } from "@ui/ui_template_general_layout";
|
|
import { currentLanguageIndex, ui_locales } from "@ui/ui_template_locale";
|
|
import "./B10_Payment_UI_Style.css";
|
|
|
|
function L(key: keyof typeof ui_locales): string {
|
|
return ui_locales[key][currentLanguageIndex];
|
|
}
|
|
|
|
export function renderB10Payment(root: HTMLElement): void {
|
|
const invoiceBody = document.createElement("div");
|
|
invoiceBody.className = "b10-payment__summary";
|
|
const invoiceDescription = document.createElement("p");
|
|
invoiceDescription.textContent = L("B10_Payment_Invoice_Description");
|
|
invoiceBody.append(invoiceDescription, createBadge(L("B10_Payment_Invoice_Status"), "neutral"));
|
|
|
|
const invoiceSection = section(L("B10_Payment_Invoice_Title"), invoiceBody, true, [
|
|
createButton({ label: L("B10_Payment_Invoice_Request"), disabled: true }),
|
|
]);
|
|
|
|
const depositNote = createBanner({ tone: "info", text: L("B10_Payment_Deposit_Note") });
|
|
const depositBody = document.createElement("div");
|
|
depositBody.className = "b10-payment__summary";
|
|
depositBody.append(
|
|
table(
|
|
[],
|
|
[
|
|
[text(L("B10_Payment_Deposit_Account")), text(L("B10_Payment_Deposit_Pending"))],
|
|
[text(L("B10_Payment_Deposit_Amount")), text(L("B10_Payment_Deposit_Pending"))],
|
|
],
|
|
),
|
|
depositNote,
|
|
);
|
|
|
|
const layout = createGeneralLayout({
|
|
pageClass: "b10-payment",
|
|
title: L("B10_Payment_Title"),
|
|
subtitle: L("B10_Payment_Subtitle"),
|
|
content: [invoiceSection, section(L("B10_Payment_Deposit_Title"), depositBody, true)],
|
|
});
|
|
root.replaceChildren(layout.root);
|
|
}
|