feat(settlement, admin): introduce new types and functions for downline share and settlement period hints

Added new types for downline share breakdown and settlement period open hints to enhance the agent settlement API. Updated the admin console components to support these new features, improving the user experience with better data presentation and interaction. Additionally, refined the date range field to accommodate new calendar markers and hints, ensuring a more intuitive interface for managing settlement periods.

src/modules/settlement/settlement-center-period-detail.tsx

@@ -8,6 +8,7 @@ import type { SettlementPeriodRow } from "@/api/admin-agent-settlement";
 import { AdminStatusBadge } from "@/components/admin/admin-status-badge";
 import { SettlementCreditLedgerPanel } from "@/modules/settlement/settlement-credit-ledger-panel";
 import { SettlementMainPanel } from "@/modules/settlement/settlement-main-panel";
+import { SettlementOperationsPanel } from "@/modules/settlement/settlement-operations-panel";
 import {
   settlementCenterListHref,
   settlementPeriodViewHref,
@@ -25,6 +26,7 @@ type SettlementCenterPeriodDetailProps = {
   adminSiteId: number;
   currencyCode: string;
   canOperateBills: boolean;
+  boundAgentId?: number | null;
   refreshKey: number;
   onOpenBillDetail: (billId: number) => void;
 };
@@ -35,6 +37,7 @@ export function SettlementCenterPeriodDetail({
   adminSiteId,
   currencyCode,
   canOperateBills,
+  boundAgentId = null,
   refreshKey,
   onOpenBillDetail,
 }: SettlementCenterPeriodDetailProps): React.ReactElement {
@@ -42,6 +45,7 @@ export function SettlementCenterPeriodDetail({
 
   const subViews: { key: SettlementPeriodView; label: string }[] = [
     { key: "bills", label: t("nav.bills", { defaultValue: "账单" }) },
+    { key: "operations", label: t("nav.operations", { defaultValue: "收付与调账" }) },
     { key: "ledger", label: t("nav.ledger", { defaultValue: "账务流水" }) },
   ];
 
@@ -53,7 +57,7 @@ export function SettlementCenterPeriodDetail({
       <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
         <div className="flex min-w-0 flex-col gap-2">
           <Link
-            href={settlementCenterListHref()}
+            href={settlementCenterListHref(adminSiteId)}
             className={cn(buttonVariants({ variant: "ghost", size: "sm" }), "h-8 w-fit px-2")}
           >
             <ArrowLeft className="size-4" aria-hidden />
@@ -74,7 +78,7 @@ export function SettlementCenterPeriodDetail({
         {subViews.map((item) => (
           <AdminSubnavLink
             key={item.key}
-            href={settlementPeriodViewHref(period.id, item.key)}
+            href={settlementPeriodViewHref(period.id, item.key, adminSiteId)}
             active={view === item.key}
           >
             {item.label}
@@ -93,6 +97,18 @@ export function SettlementCenterPeriodDetail({
           pendingConfirm={pendingConfirm}
           awaitingPayment={awaitingPayment}
           selectedPeriodStatus={period.status}
+          boundAgentId={boundAgentId}
+        />
+      ) : null}
+
+      {view === "operations" ? (
+        <SettlementOperationsPanel
+          key={`${adminSiteId}-${period.id}-${refreshKey}-ops`}
+          adminSiteId={adminSiteId}
+          settlementPeriodId={period.id}
+          currencyCode={currencyCode}
+          refreshKey={refreshKey}
+          onOpenBill={onOpenBillDetail}
         />
       ) : null}