From 59730f4fa16194df287af4d2089e8e5a21630260 Mon Sep 17 00:00:00 2001 From: kimjaehyeon0101 <47347352-kimjaehyeon0101@users.noreply.replit.com> Date: Tue, 30 Sep 2025 00:38:12 +0000 Subject: [PATCH] Add animated auction guide overlay to media platform Integrates a new `Sheet` component for displaying auction guidance with smooth opening and closing animations. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 069d4324-6c40-4355-955e-c714a50de1ea Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/069d4324-6c40-4355-955e-c714a50de1ea/yHCvWBg --- client/src/pages/Auctions.tsx | 177 +++++++++++++++++++++++++++++++++- 1 file changed, 172 insertions(+), 5 deletions(-) diff --git a/client/src/pages/Auctions.tsx b/client/src/pages/Auctions.tsx index 76b72b9..f5a320e 100644 --- a/client/src/pages/Auctions.tsx +++ b/client/src/pages/Auctions.tsx @@ -6,6 +6,13 @@ import { Card, CardContent } from "@/components/ui/card"; import { Input } from "@/components/ui/input"; import { Badge } from "@/components/ui/badge"; import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"; +import { + Sheet, + SheetContent, + SheetDescription, + SheetHeader, + SheetTitle, +} from "@/components/ui/sheet"; import { useAuth } from "@/hooks/useAuth"; import { useToast } from "@/hooks/use-toast"; import { apiRequest } from "@/lib/queryClient"; @@ -35,6 +42,7 @@ export default function Auctions() { qualityScore: "" }); const [isLoginModalOpen, setIsLoginModalOpen] = useState(false); + const [isGuideOpen, setIsGuideOpen] = useState(false); const [theme, setTheme] = useState(() => localStorage.getItem('theme') || 'light'); const [language, setLanguage] = useState(() => localStorage.getItem('language') || 'en'); @@ -249,11 +257,14 @@ export default function Auctions() {
- - - + {isAuthenticated && user ? ( <> @@ -601,6 +612,162 @@ export default function Auctions() { onClose={() => setIsLoginModalOpen(false)} /> + {/* Auction Guide Sheet */} + + + + Media Outlet Auction System Guide + + Advertising Bidding Method Based + + + +
+ {/* 1. System Overview */} + + +

+ 1 + System Overview +

+

+ This platform applies the advertising bidding method to media management rights auctions. +

+
+
+ Vickrey Auction: + Highest total score wins +
+
+ Second-Price: + Winner pays 2nd place bid +
+
+ Hybrid Scoring: + Bid × Quality Score +
+
+ + + + {/* 2. Core Mechanism */} + + +

+ 2 + Ranking Calculation +

+
+
+ Ranking Score = Bid Amount × (Quality Score ÷ 100) +
+
+
+
+ Bid Range: + $100 - $100,000 +
+
+ Management Period: + 30 days (default) +
+
+ Quality Score: + 1-100 points +
+
+ + + + {/* 3. Quality Score Guide */} + + +

+ 3 + Quality Score Levels +

+
+
+
71-100 pts: High Quality
+
Higher rank with lower bids, increased exposure
+
+
+
41-70 pts: Average Quality
+
Meets standard criteria, stable content
+
+
+
1-40 pts: Low Quality
+
Below standards, low engagement
+
+
+ + + + {/* 4. Auction Types */} + + +

+ 4 + Media Outlet Types +

+
+
+
+ People + (24 outlets) +
+ Min $500 +
+
+
+ Topics + (20 outlets) +
+ Min $300 +
+
+
+ Companies + (27 outlets) +
+ Min $1,000 +
+
+ + + + {/* 5. Bidding Tips */} + + +

+ 5 + Bidding Strategy +

+
+
+

💡 Effective Tips

+
    +
  • • Prioritize quality score improvement
    • +
  • • Analyze competition patterns
    • +
  • • Bid gradually, not in large jumps
    • +
  • • Consider auction closing timing
    • +
+
+
+

⚠️ Avoid These Mistakes

+
    +
  • • Don't ignore quality score
    • +
  • • Avoid emotional bidding
    • +
  • • Don't neglect profitability analysis
    • +
+
+
+ + +
+ + +
);