@pisell/materials 6.11.223 → 6.11.225

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/PisellRecordBoardResourceWallView.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { RecordBoardResourceWallProps } from '../../types';
+import './ResourceWallViewport.less';
+/** 与 {@link RecordBoardResourceWallProps.filterFieldKey} 默认一致 */
+export declare const DEFAULT_RESOURCE_WALL_FILTER_FIELD_KEY = "resource_wall_resource_ids";
+/**
+ * RecordBoard 大屏资源墙主视口：`cards` 提供全量卡数据；可见列表由
+ * `searchParams.filter.values[filterFieldKey]` 中的资源 id 与 `cards` 交集决定。
+ * 若 ToolBar `searchParams.sort` 指向状态列（默认字段名 `status`），则按占用态重排展示顺序。
+ * 支持网格分页轮播、浅深外观、伪全屏与控制台（布局 / 配色 / 选中资源）。
+ */
+export declare const PisellRecordBoardResourceWallView: React.FC<RecordBoardResourceWallProps>;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/RecordBoardResourceWall.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { RecordBoardResourceWallProps } from '../../types';
+/**
+ * RecordBoard 大屏资源墙槽位：仅在 PisellRecordBoard.ShellFrame 内使用，本身不渲染 DOM。
+ * 与 GridLayout / FloorMap / Calendar 并存时出现视图切换。
+ */
+declare const RecordBoardResourceWall: React.FC<RecordBoardResourceWallProps>;
+export default RecordBoardResourceWall;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/ResourceWallControlPanel.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+import { type VenueWallStatusToneOverrides } from './venueWallUtils';
+export declare type ResourceWallLayoutPreset = {
+    key: string;
+    label: string;
+    cols: number;
+    rows: number;
+};
+export declare type ResourceWallControlPanelApplyPayload = {
+    resourceIds: string[];
+    layoutKey: string;
+    customCols: number;
+    customRows: number;
+    pageDurationSec: number;
+    occupiedCardColor: string;
+    availableCardColor: string;
+    boardingSoonBeforeMin: number;
+    statusToneOverrides: VenueWallStatusToneOverrides;
+    /** 与 test.tsx「主文案基准宽度占比」对接，写入 {@link VenueWallCard} */
+    heroMaxWidthRatio: number;
+};
+export interface ResourceWallControlPanelProps {
+    open: boolean;
+    onClose: () => void;
+    isDark: boolean;
+    layoutPresets: readonly ResourceWallLayoutPreset[];
+    layoutKey: string;
+    customCols: number;
+    customRows: number;
+    pageDurationSec: number;
+    occupiedCardColor: string;
+    availableCardColor: string;
+    boardingSoonBeforeMin: number;
+    statusToneOverrides: VenueWallStatusToneOverrides | undefined;
+    selectedResourceIds: string[];
+    onApply: (payload: ResourceWallControlPanelApplyPayload) => void;
+    /** 与 test.tsx「当前分页 / 倒计时」展示一致（1-based current） */
+    carouselPager: {
+        currentPage: number;
+        totalPages: number;
+    };
+    /** 主文案宽度占比初值，与 {@link VenueWallCardProps.heroMaxWidthRatio} 一致 */
+    heroMaxWidthRatio?: number;
+}
+/**
+ * 资源墙管理台（Portal）：选资源、网格预设/自定义行列、翻页秒数、占用/空闲色、六态说明与色值；
+ * `onApply` 回传负载中含 `diffVenueWallStatusToneOverrides` 压缩结果。
+ * 源自 test `showAdmin` 对接；关闭（Close / Escape / 遮罩）时提交草稿并关闭。
+ */
+export declare const ResourceWallControlPanel: React.FC<ResourceWallControlPanelProps>;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/ResourceWallControlPanelColorTab.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { type VenueWallStatusKey, type VenueWallStatusTone } from './venueWallUtils';
+export interface ResourceWallControlPanelColorTabProps {
+    adminSectionBg: string;
+    adminInputBg: string;
+    headerText: string;
+    mutedText: string;
+    divider: string;
+    draftOcc: string;
+    setDraftOcc: (v: string) => void;
+    draftAvail: string;
+    setDraftAvail: (v: string) => void;
+    draftTones: Record<VenueWallStatusKey, VenueWallStatusTone>;
+    setDraftTones: React.Dispatch<React.SetStateAction<Record<VenueWallStatusKey, VenueWallStatusTone>>>;
+}
+/** 控制台「外观 / 颜色」分页：占用/空闲底色与六态表格 */
+export declare const ResourceWallControlPanelColorTab: React.FC<ResourceWallControlPanelColorTabProps>;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/ResourceWallControlPanelLayoutTab.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+export interface ResourceWallControlPanelLayoutTabProps {
+    adminSectionBg: string;
+    adminInputBg: string;
+    headerText: string;
+    mutedText: string;
+    layoutPresets: readonly {
+        key: string;
+        label: string;
+        cols: number;
+        rows: number;
+    }[];
+    draftLayoutKey: string;
+    setDraftLayoutKey: (v: string) => void;
+    draftCustomCols: number;
+    setDraftCustomCols: (v: number) => void;
+    draftCustomRows: number;
+    setDraftCustomRows: (v: number) => void;
+    draftPageSec: number;
+    setDraftPageSec: (v: number) => void;
+    draftHeroRatio: number;
+    setDraftHeroRatio: (v: number) => void;
+    carouselCur: number;
+    carouselTot: number;
+    isDark: boolean;
+}
+/** 控制台「资源 / 布局」分页：预设、自定义行列、翻页停留、主文案宽度 */
+export declare const ResourceWallControlPanelLayoutTab: React.FC<ResourceWallControlPanelLayoutTabProps>;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/ResourceWallViewportToolbar.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+export interface ResourceWallViewportToolbarProps {
+    now: Date;
+    appearanceMode: 'light' | 'dark';
+    onAppearanceModeChange: (m: 'light' | 'dark') => void;
+    pseudoFullscreen: boolean;
+    onTogglePseudoFullscreen: () => void;
+    onOpenControlPanel: () => void;
+    headerBorder: string;
+    headerBg: string;
+    clockColor: string;
+    mutedText: string;
+    toolbarBtnBorder: string;
+    toolbarBtnBg: string;
+    toolbarBtnBgActive: string;
+}
+/** 资源墙顶栏：时钟、浅深切换、伪全屏、控制台入口 */
+export declare const ResourceWallViewportToolbar: React.FC<ResourceWallViewportToolbarProps>;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/VenueWallCard.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import type { RecordBoardResourceWallCardModel } from '../../types';
+import { type VenueWallStatusKey, type VenueWallStatusTone } from './venueWallUtils';
+import './VenueWallCard.less';
+export interface VenueWallCardProps {
+    card: RecordBoardResourceWallCardModel;
+    /** 与 PisellRecordBoardResourceWallView 顶栏同源墙钟毫秒时间戳（唯一定时器驱动） */
+    wallNowMs: number;
+    /** boardingSoon：用于进度条分母（分钟）；与「距结束」快结束窗口对称 */
+    boardingSoonBeforeMin?: number;
+    occupiedCardColor?: string;
+    availableCardColor?: string;
+    heroMaxWidthRatio?: number;
+    /** 合并后的六态配色与文案；不传则用默认 map */
+    statusToneMap?: Record<VenueWallStatusKey, VenueWallStatusTone>;
+    /** 非占用态主/辅文案色在暗色外壳下的对比度 */
+    appearance?: 'light' | 'dark';
+}
+declare function VenueWallCardInner({ card, wallNowMs, boardingSoonBeforeMin, occupiedCardColor, availableCardColor, statusToneMap: statusToneMapProp, appearance, }: VenueWallCardProps): JSX.Element;
+/** 单块场地大屏卡：漂移与文案由 {@link buildVenueWallCardPresentation} 统一计算 */
+export declare const VenueWallCard: React.MemoExoticComponent<typeof VenueWallCardInner>;
+export {};

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/resourceWallConstants.d.ts

@@ -0,0 +1,2 @@
+/** 说明文案超过该长度时用跑马灯（与 NoteTicker / VenueWallCard 共用） */
+export declare const RESOURCE_WALL_NOTE_MARQUEE_MIN_CHARS = 32;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/venueWallCardPresentation.d.ts

@@ -0,0 +1,58 @@
+import type { RecordBoardResourceWallCardModel } from '../../types';
+import { type VenueWallStatusKey, type VenueWallStatusTone } from './venueWallUtils';
+/** 与平面图 empty / reserved / occupied 对齐的三种大屏展示态 */
+export declare type VenueWallFloorLikeStatus = 'empty' | 'reserved' | 'occupied';
+/**
+ * 标题胶囊 5 态：在 floorLike 三大类基础上，把 `late` 与 `expired` 拆出独立色与文案，
+ * 与当前区一档强调色（红）对齐。
+ */
+export declare type VenueWallHeaderStatusKey = 'empty' | 'reserved' | 'late' | 'occupied' | 'expired';
+/** 由 {@link buildVenueWallCardPresentation} 产出，供 VenueWallCard 渲染层使用 */
+export declare type VenueWallCardPresentation = {
+    statusKey: VenueWallStatusKey;
+    floorLikeStatus: VenueWallFloorLikeStatus;
+    /** 标题栏右侧 5 态键，决定胶囊样式（描边/底色变体） */
+    headerStatusKey: VenueWallHeaderStatusKey;
+    /** 标题栏右侧：空闲 / 预约中 / 迟到 / 占用中 / 超时 */
+    headerStatusLabel: string;
+    /** 标题胶囊主色（迟到/超时为红，与一档强调色对齐） */
+    headerStatusColor: string;
+    /** 紫色渐变占用卡 vs 浅色强调卡 */
+    cardVariant: 'occupied' | 'accent';
+    mainColor: string;
+    subColor: string;
+    surfaceAccentColor: string;
+    /** 当前区一档：剩余时间 / 距开始 / 结束提示等（非布局「块」） */
+    primaryEmphasisLine: string;
+    primaryEmphasisColor: string;
+    /** 二档：预约时段文案 */
+    timeRangeLine: string;
+    /** 二档：联系人（「Available to Book」等占位已剥离） */
+    contactLine: string;
+    showProgress: boolean;
+    progress: number;
+    progressColor: string;
+    showEndingSoonMarquee: boolean;
+    marqueeText: string;
+    marqueeColor: string;
+    /** 跑马灯胶囊底：与 {@link primaryEmphasisColor} 同一强调色（半透明叠底） */
+    marqueeShellBackground: string;
+};
+/**
+ * 纯函数：三态大屏文案 + 进度 + 条件跑马灯。
+ * 右上角标题栏仅保留 empty/reserved/occupied；迟到/超时只出现在当前区一档主提示。
+ */
+export declare function buildVenueWallCardPresentation(args: {
+    card: RecordBoardResourceWallCardModel;
+    toneMap: Record<VenueWallStatusKey, VenueWallStatusTone>;
+    wallNowMs: number;
+    liveRemainingMin: number;
+    liveRemainingPreciseMin: number;
+    liveStartsInMin: number;
+    liveLateMin: number;
+    boardingSoonBeforeMin: number;
+    idleMain: string;
+    idleSub: string;
+    occupiedCardColor: string;
+    availableCardColor: string;
+}): VenueWallCardPresentation;

package/lib/components/pisellRecordBoard/shellFrame/ResourceWall/venueWallUtils.d.ts

@@ -0,0 +1,64 @@
+/**
+ * 资源墙（Venue Wall）共用工具：六态键、默认色板、倒计时文案、卡片状态推导、配色合并与 diff。
+ */
+import type { RecordBoardResourceWallCardModel } from '../../types';
+export declare type VenueWallStatusKey = 'inUse' | 'endingSoon' | 'expired' | 'available' | 'boardingSoon' | 'late';
+/** 单态展示配置（与 {@link VENUE_WALL_STATUS_COLOR_MAP} 值同形） */
+export declare type VenueWallStatusTone = {
+    key: VenueWallStatusKey;
+    label: string;
+    note: string;
+    color: string;
+    noteBg: string;
+};
+/** 仅覆盖部分字段；用于 Control Panel / localStorage */
+export declare type VenueWallStatusToneOverrides = Partial<Record<VenueWallStatusKey, Partial<VenueWallStatusTone>>>;
+/** 单外观（浅 / 深）下的占用/空闲色与六态覆盖；持久化时 light、dark 各存一份 */
+export declare type VenueWallAppearanceSlot = {
+    occupiedCardColor?: string;
+    availableCardColor?: string;
+    statusToneOverrides?: VenueWallStatusToneOverrides;
+};
+export declare type VenueWallAppearanceTheme = {
+    light?: VenueWallAppearanceSlot;
+    dark?: VenueWallAppearanceSlot;
+};
+export declare const VENUE_WALL_STATUS_KEYS: VenueWallStatusKey[];
+/**
+ * 六态默认色与占位英文；`getVenueWallStatusToneMap` 会将 label/note 换为 i18n，此处仅作 merge 基底。
+ */
+export declare const VENUE_WALL_STATUS_COLOR_MAP: Record<VenueWallStatusKey, VenueWallStatusTone>;
+/** 将 `#RGB` / `#RRGGBB` 转为 `rgba(...)`，供渐变与半透明底 */
+export declare function alphaColor(hex: string, alpha: number): string;
+/** 将数值限制在 [min, max]（布局行列、主文案比例等） */
+export declare const clamp: (value: number, min: number, max: number) => number;
+/** 由卡片字段推导状态键（与演示页 test.tsx 规则一致） */
+export declare function deriveVenueWallStatus(card: RecordBoardResourceWallCardModel): VenueWallStatusKey;
+/**
+ * ToolBar Sort 写入的 `searchParams.sort`（如 `status:asc:string`）拆出字段名与升降序。
+ */
+export declare function parseRecordBoardToolbarSortParam(sort: unknown): {
+    field: string;
+    dir: 'asc' | 'desc';
+} | null;
+/** 当 Sort 字段名匹配这些 key（忽略大小写）时，资源墙按占用态重排卡片 */
+export declare const DEFAULT_RESOURCE_WALL_STATUS_SORT_FIELD_KEYS: string[];
+export declare function matchesResourceWallStatusSortField(sortField: string, keys: readonly string[]): boolean;
+/**
+ * 用于资源墙排序：占用/将结/已结束为 1，其余为 0（与 {@link deriveVenueWallStatus} 一致）。
+ * asc → 空闲侧在前；desc → 占用侧在前。
+ */
+export declare function venueWallOccupiedSortRank(card: RecordBoardResourceWallCardModel): 0 | 1;
+export declare function formatDurationHM(minAbs: number): string;
+/**
+ * 将「剩余/超支分钟数」格式化为跑码条/主副标题用短文案（走 i18n 模板，负值表示 overtime）。
+ */
+export declare function formatVenueWallCountdown(min: number): string;
+/**
+ * 合并默认六态配色与业务覆盖，供 {@link VenueWallCard} 与 Control Panel 表单初值共用。
+ */
+export declare function getVenueWallStatusToneMap(overrides?: VenueWallStatusToneOverrides | null): Record<VenueWallStatusKey, VenueWallStatusTone>;
+/**
+ * 将编辑后的完整六态表压成「相对默认」的 overrides，便于持久化与 props 传递。
+ */
+export declare function diffVenueWallStatusToneOverrides(draft: Record<VenueWallStatusKey, VenueWallStatusTone>): VenueWallStatusToneOverrides;

package/lib/components/pisellRecordBoard/shellFrame/Search/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface RecordBoardSearchProps {
+    [key: string]: any;
+}
+/**
+ * RecordBoard 下的独立搜索槽：使用 PisellFind，绑定 context.searchParams.keyword 与 onSearch。
+ * 可通过 childComponentProps.search 透传 PisellFind 的 props。
+ */
+declare const RecordBoardSearch: React.FC<RecordBoardSearchProps>;
+export default RecordBoardSearch;

package/lib/components/pisellRecordBoard/shellFrame/ShellBodyMetaContext.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import type { RecordBoardFloorMapProps, RecordBoardCalendarProps, RecordBoardResourceWallProps } from '../types';
+/**
+ * ShellFrame 解析子节点后的元信息，供 ToolBar 等判断是否需要「表格 / 平面图 / 日历」Segmented。
+ * 未处于 ShellFrame.Provider 内时为 undefined（如单独挂载 ToolBar）。
+ */
+export interface RecordBoardShellBodyMeta {
+    /** 子组件 FloorMap props 与根级 floorMap 合并后的结果（子优先） */
+    effectiveFloorMapProps?: RecordBoardFloorMapProps;
+    /** 子组件 Calendar props 与根级 calendar 合并后的结果（子优先） */
+    effectiveCalendarProps?: RecordBoardCalendarProps;
+    /** ShellFrame 内是否存在 GridLayout / CardLayout 等非 FloorMap 子节点 */
+    hasGridContent: boolean;
+    /** 合并后是否存在可渲染的平面图配置 */
+    hasFloorMapSlot: boolean;
+    /** 合并后是否存在可渲染的日历配置 */
+    hasCalendarSlot: boolean;
+    /** 子组件 ResourceWall props 与根级 resourceWall 合并后的结果（子优先） */
+    effectiveResourceWallProps?: RecordBoardResourceWallProps;
+    /** 合并后是否存在大屏资源墙槽（根级或子节点声明即 true） */
+    hasResourceWallSlot: boolean;
+}
+export declare const RecordBoardShellBodyMetaContext: React.Context<RecordBoardShellBodyMeta | undefined>;
+export declare function useRecordBoardShellBodyMeta(): RecordBoardShellBodyMeta | undefined;

package/lib/components/pisellRecordBoard/shellFrame/ToolBar/recordBoardToolBarConstants.d.ts

@@ -0,0 +1,8 @@
+/** 与 RecordBoard ToolBar 行为绑定的 searchParams 字段名 */
+export declare const DEFAULT_SEARCH_FIELD = "keyword";
+/** 筛选在 searchParams 中的字段名 */
+export declare const FILTER_PARAMS_FIELD = "filter";
+/** 排序在 searchParams 中的字段名 */
+export declare const SORT_PARAMS_FIELD = "sort";
+/** 与 ResourceWall 默认 `filterFieldKey` 一致 */
+export declare const RESOURCE_WALL_QUICK_FILTER_KEY = "resource_wall_resource_ids";