71 lines
2.0 KiB
React
Raw Normal View History

/*
Copyright (C) 2025 QuantumNous
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as
published by the Free Software Foundation, either version 3 of the
License, or (at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
For commercial licensing, please contact support@quantumnous.com
*/
🎨 refactor(model-pricing/header): unify header design, extract SearchActions, and improve skeleton - Extract SearchActions.jsx and replace inline renderSearchActions in PricingVendorIntro.jsx for reuse - Refactor PricingVendorIntro.jsx: - Introduce renderHeaderCard(), tagStyle, getCoverStyle(), and MAX_VISIBLE_AVATARS constant - Standardize vendor header cover (gradient + background image) and tag contrast - Use border instead of ring for vendor badges; unify visuals and remove Tailwind ring dependency - Rotate vendors every 2s only when filterVendor === 'all' and vendor count > 3 - Remove unused imports; keep prop surface minimal; pass setShowFilterModal downward only - Refactor PricingVendorIntroSkeleton.jsx: - Add getCoverStyle() and rect() helpers; rebuild skeleton to match final UI - Replace invalid Skeleton.Input usage; add missing keys; unify colors/borders/radius - Update PricingTopSection.jsx: - Manage filter modal locally; drop redundant prop passing - Update PricingVendorIntroWithSkeleton.jsx: - Align prop interface; forward only required props and keep useMinimumLoadingTime - Add: web/src/components/table/model-pricing/layout/header/SearchActions.jsx - Lint: all files pass; no dark:* classes present in this scope Files touched: - web/src/components/table/model-pricing/layout/header/PricingTopSection.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntro.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntroWithSkeleton.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntroSkeleton.jsx - web/src/components/table/model-pricing/layout/header/SearchActions.jsx (new)
2025-08-23 21:11:40 +08:00
import React, { useState } from 'react';
import PricingFilterModal from '../../modal/PricingFilterModal';
🏗️ refactor: Replace model categories with vendor-based filtering and optimize data structure - **Backend Changes:** - Refactor pricing API to return separate vendors array with ID-based model references - Remove redundant vendor_name/vendor_icon fields from pricing records, use vendor_id only - Add vendor_description to pricing response for frontend display - Maintain 1-minute cache protection for pricing endpoint security - **Frontend Data Flow:** - Update useModelPricingData hook to build vendorsMap from API response - Enhance model records with vendor info during data processing - Pass vendorsMap through component hierarchy for consistent vendor data access - **UI Component Replacements:** - Replace PricingCategories with PricingVendors component for vendor-based filtering - Replace PricingCategoryIntro with PricingVendorIntro in header section - Remove all model category related components and logic - **Header Improvements:** - Implement vendor intro with real backend data (name, icon, description) - Add text collapsible feature (2-line limit with expand/collapse functionality) - Support carousel animation for "All Vendors" view with vendor icon rotation - **Model Detail Modal Enhancements:** - Update ModelHeader to use real vendor icons via getLobeHubIcon() - Move tags from header to ModelBasicInfo content area to avoid SideSheet title width constraints - Display only custom tags from backend with stringToColor() for consistent styling - Use Space component with wrap property for proper tag layout - **Table View Optimizations:** - Integrate RenderUtils for description and tags columns - Implement renderLimitedItems for tags (max 3 visible, +x popover for overflow) - Use renderDescription for text truncation with tooltip support - **Filter Logic Updates:** - Vendor filter shows disabled options instead of hiding when no models match - Include "Unknown Vendor" category for models without vendor information - Remove all hardcoded vendor descriptions, use real backend data - **Code Quality:** - Fix import paths after component relocation - Remove unused model category utilities and hardcoded mappings - Ensure consistent vendor data usage across all pricing views - Maintain backward compatibility with existing pricing calculation logic This refactor provides a more scalable vendor-based architecture while eliminating data redundancy and improving user experience with real-time backend data integration.
2025-08-04 21:36:31 +08:00
import PricingVendorIntroWithSkeleton from './PricingVendorIntroWithSkeleton';
const PricingTopSection = ({
selectedRowKeys,
copyText,
handleChange,
handleCompositionStart,
handleCompositionEnd,
isMobile,
🏗️ refactor: Replace model categories with vendor-based filtering and optimize data structure - **Backend Changes:** - Refactor pricing API to return separate vendors array with ID-based model references - Remove redundant vendor_name/vendor_icon fields from pricing records, use vendor_id only - Add vendor_description to pricing response for frontend display - Maintain 1-minute cache protection for pricing endpoint security - **Frontend Data Flow:** - Update useModelPricingData hook to build vendorsMap from API response - Enhance model records with vendor info during data processing - Pass vendorsMap through component hierarchy for consistent vendor data access - **UI Component Replacements:** - Replace PricingCategories with PricingVendors component for vendor-based filtering - Replace PricingCategoryIntro with PricingVendorIntro in header section - Remove all model category related components and logic - **Header Improvements:** - Implement vendor intro with real backend data (name, icon, description) - Add text collapsible feature (2-line limit with expand/collapse functionality) - Support carousel animation for "All Vendors" view with vendor icon rotation - **Model Detail Modal Enhancements:** - Update ModelHeader to use real vendor icons via getLobeHubIcon() - Move tags from header to ModelBasicInfo content area to avoid SideSheet title width constraints - Display only custom tags from backend with stringToColor() for consistent styling - Use Space component with wrap property for proper tag layout - **Table View Optimizations:** - Integrate RenderUtils for description and tags columns - Implement renderLimitedItems for tags (max 3 visible, +x popover for overflow) - Use renderDescription for text truncation with tooltip support - **Filter Logic Updates:** - Vendor filter shows disabled options instead of hiding when no models match - Include "Unknown Vendor" category for models without vendor information - Remove all hardcoded vendor descriptions, use real backend data - **Code Quality:** - Fix import paths after component relocation - Remove unused model category utilities and hardcoded mappings - Ensure consistent vendor data usage across all pricing views - Maintain backward compatibility with existing pricing calculation logic This refactor provides a more scalable vendor-based architecture while eliminating data redundancy and improving user experience with real-time backend data integration.
2025-08-04 21:36:31 +08:00
filterVendor,
models,
filteredModels,
loading,
searchValue,
t
}) => {
const [showFilterModal, setShowFilterModal] = useState(false);
return (
<>
🎨 refactor(model-pricing/header): unify header design, extract SearchActions, and improve skeleton - Extract SearchActions.jsx and replace inline renderSearchActions in PricingVendorIntro.jsx for reuse - Refactor PricingVendorIntro.jsx: - Introduce renderHeaderCard(), tagStyle, getCoverStyle(), and MAX_VISIBLE_AVATARS constant - Standardize vendor header cover (gradient + background image) and tag contrast - Use border instead of ring for vendor badges; unify visuals and remove Tailwind ring dependency - Rotate vendors every 2s only when filterVendor === 'all' and vendor count > 3 - Remove unused imports; keep prop surface minimal; pass setShowFilterModal downward only - Refactor PricingVendorIntroSkeleton.jsx: - Add getCoverStyle() and rect() helpers; rebuild skeleton to match final UI - Replace invalid Skeleton.Input usage; add missing keys; unify colors/borders/radius - Update PricingTopSection.jsx: - Manage filter modal locally; drop redundant prop passing - Update PricingVendorIntroWithSkeleton.jsx: - Align prop interface; forward only required props and keep useMinimumLoadingTime - Add: web/src/components/table/model-pricing/layout/header/SearchActions.jsx - Lint: all files pass; no dark:* classes present in this scope Files touched: - web/src/components/table/model-pricing/layout/header/PricingTopSection.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntro.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntroWithSkeleton.jsx - web/src/components/table/model-pricing/layout/header/PricingVendorIntroSkeleton.jsx - web/src/components/table/model-pricing/layout/header/SearchActions.jsx (new)
2025-08-23 21:11:40 +08:00
{/* 供应商介绍区域(包含搜索功能) */}
<PricingVendorIntroWithSkeleton
loading={loading}
filterVendor={filterVendor}
models={filteredModels}
allModels={models}
t={t}
selectedRowKeys={selectedRowKeys}
copyText={copyText}
handleChange={handleChange}
handleCompositionStart={handleCompositionStart}
handleCompositionEnd={handleCompositionEnd}
isMobile={isMobile}
searchValue={searchValue}
setShowFilterModal={setShowFilterModal}
/>
{/* 移动端筛选Modal */}
{isMobile && (
<PricingFilterModal
visible={showFilterModal}
onClose={() => setShowFilterModal(false)}
t={t}
/>
)}
</>
);
};
export default PricingTopSection;