- {safeResults.improvementSuggestions.actionPlan.map((action, index) => (
+ {safeResults.improvementSuggestions.actionPlan.map((action: any, index: number) => (
{index + 1}
@@ -608,6 +664,14 @@ export default function ResultsPage() {
+
+ {/* Share Modal */}
+
setIsShareModalOpen(false)}
+ evaluationId={searchParams.get('id') || undefined}
+ projectTitle={safeResults.projectTitle}
+ />
)
}
diff --git a/components/share-modal.tsx b/components/share-modal.tsx
new file mode 100644
index 0000000..d77bccf
--- /dev/null
+++ b/components/share-modal.tsx
@@ -0,0 +1,296 @@
+"use client"
+
+import { useState, useEffect } from "react"
+import { Copy, Check, Share2, QrCode, Mail } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog"
+import { useToast } from "@/hooks/use-toast"
+import { generateShareUrl, getCurrentUrl } from "@/lib/config"
+import QRCode from "qrcode"
+
+interface ShareModalProps {
+ isOpen: boolean
+ onClose: () => void
+ evaluationId?: string
+ projectTitle?: string
+}
+
+export function ShareModal({ isOpen, onClose, evaluationId, projectTitle }: ShareModalProps) {
+ const [qrCodeUrl, setQrCodeUrl] = useState
("")
+ const [isGeneratingQR, setIsGeneratingQR] = useState(false)
+ const [copiedLink, setCopiedLink] = useState(false)
+ const [copiedQR, setCopiedQR] = useState(false)
+ const { toast } = useToast()
+
+ // 生成分享連結
+ const shareUrl = evaluationId
+ ? generateShareUrl(evaluationId)
+ : getCurrentUrl()
+
+ // 生成 QR Code
+ useEffect(() => {
+ if (isOpen && shareUrl) {
+ setIsGeneratingQR(true)
+ QRCode.toDataURL(shareUrl, {
+ width: 160,
+ margin: 2,
+ color: {
+ dark: '#000000',
+ light: '#FFFFFF'
+ }
+ })
+ .then(url => {
+ setQrCodeUrl(url)
+ setIsGeneratingQR(false)
+ })
+ .catch(err => {
+ console.error('生成 QR Code 失敗:', err)
+ setIsGeneratingQR(false)
+ toast({
+ title: "錯誤",
+ description: "生成 QR Code 失敗，請稍後再試",
+ variant: "destructive",
+ })
+ })
+ }
+ }, [isOpen, shareUrl, toast])
+
+ // 複製連結
+ const copyLink = async () => {
+ try {
+ await navigator.clipboard.writeText(shareUrl)
+ setCopiedLink(true)
+ toast({
+ title: "成功",
+ description: "連結已複製到剪貼板",
+ })
+ setTimeout(() => setCopiedLink(false), 2000)
+ } catch (err) {
+ console.error('複製失敗:', err)
+ toast({
+ title: "錯誤",
+ description: "複製失敗，請手動複製連結",
+ variant: "destructive",
+ })
+ }
+ }
+
+ // 複製 QR Code
+ const copyQRCode = async () => {
+ if (!qrCodeUrl) return
+
+ try {
+ // 將 base64 轉換為 blob
+ const response = await fetch(qrCodeUrl)
+ const blob = await response.blob()
+
+ // 複製到剪貼板
+ await navigator.clipboard.write([
+ new ClipboardItem({
+ [blob.type]: blob
+ })
+ ])
+
+ setCopiedQR(true)
+ toast({
+ title: "成功",
+ description: "QR Code 已複製到剪貼板",
+ })
+ setTimeout(() => setCopiedQR(false), 2000)
+ } catch (err) {
+ console.error('複製 QR Code 失敗:', err)
+ toast({
+ title: "錯誤",
+ description: "複製 QR Code 失敗，請截圖保存",
+ variant: "destructive",
+ })
+ }
+ }
+
+ // 分享到社群媒體
+ const shareToSocial = (platform: string) => {
+ const encodedUrl = encodeURIComponent(shareUrl)
+ const encodedTitle = encodeURIComponent(`評審結果 - ${projectTitle || 'AI 智能評審系統'}`)
+
+ let shareUrl_template = ""
+
+ switch (platform) {
+ case 'line':
+ shareUrl_template = `https://social-plugins.line.me/lineit/share?url=${encodedUrl}&text=${encodedTitle}`
+ break
+ case 'facebook':
+ shareUrl_template = `https://www.facebook.com/sharer/sharer.php?u=${encodedUrl}`
+ break
+ case 'email':
+ const emailBody = encodeURIComponent(`您好，\n\n我想與您分享這個評審結果：\n\n${projectTitle || 'AI 智能評審系統'}\n\n請點擊以下連結查看詳細報告：\n${shareUrl}\n\n感謝！`)
+ shareUrl_template = `mailto:?subject=${encodedTitle}&body=${emailBody}`
+ break
+ default:
+ return
+ }
+
+ if (platform === 'email') {
+ window.location.href = shareUrl_template
+ } else {
+ window.open(shareUrl_template, '_blank', 'width=600,height=400')
+ }
+ }
+
+ return (
+
+ )
+}
diff --git a/components/ui/alert-dialog.tsx b/components/ui/alert-dialog.tsx
new file mode 100644
index 0000000..25e7b47
--- /dev/null
+++ b/components/ui/alert-dialog.tsx
@@ -0,0 +1,141 @@
+"use client"
+
+import * as React from "react"
+import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"
+
+import { cn } from "@/lib/utils"
+import { buttonVariants } from "@/components/ui/button"
+
+const AlertDialog = AlertDialogPrimitive.Root
+
+const AlertDialogTrigger = AlertDialogPrimitive.Trigger
+
+const AlertDialogPortal = AlertDialogPrimitive.Portal
+
+const AlertDialogOverlay = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName
+
+const AlertDialogContent = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+
+
+
+))
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName
+
+const AlertDialogHeader = ({
+ className,
+ ...props
+}: React.HTMLAttributes) => (
+
+)
+AlertDialogHeader.displayName = "AlertDialogHeader"
+
+const AlertDialogFooter = ({
+ className,
+ ...props
+}: React.HTMLAttributes) => (
+
+)
+AlertDialogFooter.displayName = "AlertDialogFooter"
+
+const AlertDialogTitle = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName
+
+const AlertDialogDescription = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+AlertDialogDescription.displayName =
+ AlertDialogPrimitive.Description.displayName
+
+const AlertDialogAction = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName
+
+const AlertDialogCancel = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName
+
+export {
+ AlertDialog,
+ AlertDialogPortal,
+ AlertDialogOverlay,
+ AlertDialogTrigger,
+ AlertDialogContent,
+ AlertDialogHeader,
+ AlertDialogFooter,
+ AlertDialogTitle,
+ AlertDialogDescription,
+ AlertDialogAction,
+ AlertDialogCancel,
+}
diff --git a/components/ui/dialog.tsx b/components/ui/dialog.tsx
new file mode 100644
index 0000000..89c8ac7
--- /dev/null
+++ b/components/ui/dialog.tsx
@@ -0,0 +1,122 @@
+"use client"
+
+import * as React from "react"
+import * as DialogPrimitive from "@radix-ui/react-dialog"
+import { X } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const Dialog = DialogPrimitive.Root
+
+const DialogTrigger = DialogPrimitive.Trigger
+
+const DialogPortal = DialogPrimitive.Portal
+
+const DialogClose = DialogPrimitive.Close
+
+const DialogOverlay = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName
+
+const DialogContent = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, children, ...props }, ref) => (
+
+
+
+ {children}
+
+
+ 關閉
+
+
+
+))
+DialogContent.displayName = DialogPrimitive.Content.displayName
+
+const DialogHeader = ({
+ className,
+ ...props
+}: React.HTMLAttributes) => (
+
+)
+DialogHeader.displayName = "DialogHeader"
+
+const DialogFooter = ({
+ className,
+ ...props
+}: React.HTMLAttributes) => (
+
+)
+DialogFooter.displayName = "DialogFooter"
+
+const DialogTitle = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+DialogTitle.displayName = DialogPrimitive.Title.displayName
+
+const DialogDescription = React.forwardRef<
+ React.ElementRef,
+ React.ComponentPropsWithoutRef
+>(({ className, ...props }, ref) => (
+
+))
+DialogDescription.displayName = DialogPrimitive.Description.displayName
+
+export {
+ Dialog,
+ DialogPortal,
+ DialogOverlay,
+ DialogClose,
+ DialogTrigger,
+ DialogContent,
+ DialogHeader,
+ DialogFooter,
+ DialogTitle,
+ DialogDescription,
+}
diff --git a/components/ui/toaster.tsx b/components/ui/toaster.tsx
new file mode 100644
index 0000000..f6adb95
--- /dev/null
+++ b/components/ui/toaster.tsx
@@ -0,0 +1,35 @@
+"use client"
+
+import {
+ Toast,
+ ToastClose,
+ ToastDescription,
+ ToastProvider,
+ ToastTitle,
+ ToastViewport,
+} from "@/components/ui/toast"
+import { useToast } from "@/hooks/use-toast"
+
+export function Toaster() {
+ const { toasts } = useToast()
+
+ return (
+
+ {toasts.map(function ({ id, title, description, action, ...props }) {
+ return (
+
+
+ {title && {title}}
+ {description && (
+ {description}
+ )}
+
+ {action}
+
+
+ )
+ })}
+
+
+ )
+}
diff --git a/env.example b/env.example
new file mode 100644
index 0000000..047ce7f
--- /dev/null
+++ b/env.example
@@ -0,0 +1,15 @@
+# 應用配置
+NEXT_PUBLIC_APP_URL=http://localhost:12024
+NEXT_PUBLIC_APP_NAME=AI 智能評審系統
+
+# 資料庫配置
+DB_HOST=mysql.theaken.com
+DB_PORT=33306
+DB_NAME=db_AI_scoring
+DB_USER=root
+DB_PASSWORD=zh6161168
+
+# AI 配置
+GEMINI_API_KEY=AIzaSyAN3pEJr_Vn2xkCidGZAq9eQqsMVvpj8g4
+GEMINI_MODEL=gemini-1.5-pro
+GEMINI_MAX_TOKENS=8192
diff --git a/lib/config.ts b/lib/config.ts
new file mode 100644
index 0000000..c1d6c22
--- /dev/null
+++ b/lib/config.ts
@@ -0,0 +1,89 @@
+/**
+ * 應用配置工具類
+ * 用於管理環境變量和應用設置
+ */
+
+// 資料庫配置
+export const dbConfig = {
+ host: process.env.DB_HOST || 'mysql.theaken.com',
+ port: parseInt(process.env.DB_PORT || '33306'),
+ user: process.env.DB_USER || 'root',
+ password: process.env.DB_PASSWORD || 'zh6161168',
+ database: process.env.DB_NAME || 'db_AI_scoring',
+ charset: 'utf8mb4',
+ timezone: '+08:00',
+ acquireTimeout: 60000,
+ timeout: 60000,
+ reconnect: true,
+ multipleStatements: true,
+} as const
+
+// AI 配置
+export const aiConfig = {
+ geminiApiKey: process.env.GEMINI_API_KEY || 'AIzaSyAN3pEJr_Vn2xkCidGZAq9eQqsMVvpj8g4',
+ modelName: process.env.GEMINI_MODEL || 'gemini-1.5-pro',
+ maxTokens: parseInt(process.env.GEMINI_MAX_TOKENS || '8192'),
+} as const
+
+// 獲取應用基礎 URL
+export function getAppUrl(): string {
+ // 在客戶端使用 window.location.origin
+ if (typeof window !== 'undefined') {
+ return window.location.origin
+ }
+
+ // 在服務端使用環境變量，如果沒有設置則使用 localhost:12024
+ return process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:12024'
+}
+
+// 獲取應用名稱
+export function getAppName(): string {
+ return process.env.NEXT_PUBLIC_APP_NAME || 'AI 智能評審系統'
+}
+
+// 生成分享連結
+export function generateShareUrl(evaluationId: string): string {
+ const baseUrl = getAppUrl()
+ return `${baseUrl}/results?id=${evaluationId}`
+}
+
+// 生成當前頁面連結
+export function getCurrentUrl(): string {
+ if (typeof window !== 'undefined') {
+ return window.location.href
+ }
+ return getAppUrl()
+}
+
+// 環境變量配置
+export const config = {
+ appUrl: getAppUrl(),
+ appName: getAppName(),
+ isDevelopment: process.env.NODE_ENV === 'development',
+ isProduction: process.env.NODE_ENV === 'production',
+ database: dbConfig,
+ ai: aiConfig,
+} as const
+
+// 配置驗證
+export function validateConfig(): { isValid: boolean; errors: string[] } {
+ const errors: string[] = []
+
+ // 檢查必要的環境變量
+ if (!process.env.GEMINI_API_KEY) {
+ errors.push('GEMINI_API_KEY 環境變量未設置')
+ }
+
+ if (!process.env.DB_HOST) {
+ errors.push('DB_HOST 環境變量未設置')
+ }
+
+ if (!process.env.DB_NAME) {
+ errors.push('DB_NAME 環境變量未設置')
+ }
+
+ return {
+ isValid: errors.length === 0,
+ errors
+ }
+}
diff --git a/lib/database.ts b/lib/database.ts
index 8c0df39..f036ff4 100644
--- a/lib/database.ts
+++ b/lib/database.ts
@@ -1,19 +1,5 @@
import mysql from 'mysql2/promise';
-
-// 資料庫配置
-const dbConfig = {
- host: process.env.DB_HOST || 'mysql.theaken.com',
- port: parseInt(process.env.DB_PORT || '33306'),
- user: process.env.DB_USER || 'root',
- password: process.env.DB_PASSWORD || 'zh6161168',
- database: process.env.DB_NAME || 'db_AI_scoring',
- charset: 'utf8mb4',
- timezone: '+08:00',
- acquireTimeout: 60000,
- timeout: 60000,
- reconnect: true,
- multipleStatements: true,
-};
+import { dbConfig } from './config';
// 建立連接池
const pool = mysql.createPool({
diff --git a/lib/services/gemini.ts b/lib/services/gemini.ts
index d12d240..587a371 100644
--- a/lib/services/gemini.ts
+++ b/lib/services/gemini.ts
@@ -1,7 +1,7 @@
import { GoogleGenerativeAI } from '@google/generative-ai';
+import { aiConfig } from '../config';
-const API_KEY = 'AIzaSyAN3pEJr_Vn2xkCidGZAq9eQqsMVvpj8g4';
-const genAI = new GoogleGenerativeAI(API_KEY);
+const genAI = new GoogleGenerativeAI(aiConfig.geminiApiKey);
export interface CriteriaItem {
id: string;
diff --git a/lib/utils/html-pdf-generator.ts b/lib/utils/html-pdf-generator.ts
new file mode 100644
index 0000000..6c291ec
--- /dev/null
+++ b/lib/utils/html-pdf-generator.ts
@@ -0,0 +1,504 @@
+import puppeteer from 'puppeteer';
+
+export interface PDFReportData {
+ projectTitle: string;
+ overallScore: number;
+ totalPossible: number;
+ grade: string;
+ analysisDate: string;
+ criteria: Array<{
+ name: string;
+ score: number;
+ maxScore: number;
+ weight: number;
+ weightedScore: number;
+ percentage: number;
+ feedback: string;
+ strengths: string[];
+ improvements: string[];
+ }>;
+ overview: {
+ excellentItems: number;
+ improvementItems: number;
+ overallPerformance: number;
+ };
+ improvementSuggestions: {
+ overallSuggestions: string;
+ maintainStrengths: Array<{
+ title: string;
+ description: string;
+ }>;
+ keyImprovements: Array<{
+ title: string;
+ subtitle?: string;
+ description?: string;
+ suggestions: string[];
+ }>;
+ actionPlan: Array<{
+ phase: string;
+ description: string;
+ }>;
+ };
+}
+
+export class HTMLPDFGenerator {
+ private generateHTML(data: PDFReportData): string {
+ return `
+
+
+
+
+
+ AI 智能評審報告
+
+
+
+
+
+
+
總評結果
+
+
${data.overallScore}/${data.totalPossible}
+
${data.grade}
+
+
+
統計概覽
+
+
+
${data.overview.excellentItems}
+
優秀項目
+
+
+
${data.overview.improvementItems}
+
待改進項目
+
+
+
${data.overview.overallPerformance}%
+
整體表現
+
+
+
+
評分明細
+
+
+
+ | 評分項目 |
+ 得分 |
+ 權重 |
+ 加權分 |
+
+
+
+ ${data.criteria.map(item => `
+
+ | ${item.name} |
+ ${item.score}/${item.maxScore} |
+ ${item.weight}% |
+ ${item.weightedScore.toFixed(1)} |
+
+ `).join('')}
+
+
+
+
詳細分析
+ ${data.criteria.map(item => `
+
+
${item.name}
+
得分：${item.score}/${item.maxScore} (${item.percentage.toFixed(1)}%)
+
+ AI 評語：${item.feedback}
+
+ ${item.strengths.length > 0 ? `
+
+
優點：
+
+ ${item.strengths.map(strength => `- ${strength}
`).join('')}
+
+
+ ` : ''}
+ ${item.improvements.length > 0 ? `
+
+
改進建議：
+
+ ${item.improvements.map(improvement => `- ${improvement}
`).join('')}
+
+
+ ` : ''}
+
+ `).join('')}
+
+
整體改進建議
+
+
${data.improvementSuggestions.overallSuggestions}
+
+
+
繼續保持的優勢
+
+ ${data.improvementSuggestions.maintainStrengths.map(strength => `
+
+
${strength.title}
+
${strength.description}
+
+ `).join('')}
+
+
+
重點改進方向
+
+ ${data.improvementSuggestions.keyImprovements.map(improvement => `
+
+
${improvement.title}
+ ${improvement.description ? `
${improvement.description}
` : ''}
+ ${improvement.suggestions.length > 0 ? `
+
+
+ ${improvement.suggestions.map(suggestion => `- ${suggestion}
`).join('')}
+
+
+ ` : ''}
+
+ `).join('')}
+
+
+
下一步行動計劃
+
+ ${data.improvementSuggestions.actionPlan.map((action, index) => `
+
+
${index + 1}
+
+
${action.phase}
+
${action.description}
+
+
+ `).join('')}
+
+