import React, { useState, useEffect, useRef } from 'react'; export default function App() { const [mobileMenuOpen, setMobileMenuOpen] = useState(false); // --- Gemini API 相关状态 --- const [chatOpen, setChatOpen] = useState(false); const [chatMessages, setChatMessages] = useState([ { role: 'assistant', text: '你好！我是欧阳轩的专属 AI 助理 ✨。有关商业主持或内容运营的合作，随时问我！' } ]); const [chatInput, setChatInput] = useState(''); const [isChatTyping, setIsChatTyping] = useState(false); const chatScrollRef = useRef(null); const [contactMessage, setContactMessage] = useState(''); const [isDrafting, setIsDrafting] = useState(false); const [isSent, setIsSent] = useState(false); const apiKey = ""; // 执行环境将自动提供 // 自动滚动到聊天底部 useEffect(() => { if (chatScrollRef.current) { chatScrollRef.current.scrollTop = chatScrollRef.current.scrollHeight; } }, [chatMessages, isChatTyping]); // 通用的 Gemini API 调用函数 (含指数退避机制) const callGemini = async (prompt, sysInstruct) => { const url = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash-preview-09-2025:generateContent?key=${apiKey}`; const payload = { contents: [{ parts: [{ text: prompt }] }], systemInstruction: { parts: [{ text: sysInstruct }] } }; let retries = 5; let delay = 1000; while (retries > 0) { try { const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); if (!response.ok) throw new Error('API Request Failed'); const data = await response.json(); return data.candidates?.[0]?.content?.parts?.[0]?.text || "抱歉，AI 暂时无法响应。"; } catch (error) { retries--; if (retries === 0) return "网络不稳定，请稍后再试。"; await new Promise(resolve => setTimeout(resolve, delay)); delay *= 2; // 指数退避：1s, 2s, 4s, 8s, 16s } } }; // 处理发送聊天消息 const handleSendMessage = async (e) => { e.preventDefault(); if (!chatInput.trim() || isChatTyping) return; const userText = chatInput.trim(); setChatMessages(prev => [...prev, { role: 'user', text: userText }]); setChatInput(''); setIsChatTyping(true); const sysInstruct = `你是欧阳轩的专属AI助理。欧阳轩是一名资深主持人（擅长政府官方、庆典、媒体活动）以及内容运营专家（B站UP主，0粉起步累计738万+播放量，单支爆款276万+）。他毕业于南昌工学院播音与主持艺术专业，拥有普通话一级乙等及多项AI相关证书。 请以热情、专业、第一人称代言人的口吻回答问题。回答要简短精炼。`; const prompt = `访客提问: "${userText}"`; const reply = await callGemini(prompt, sysInstruct); setChatMessages(prev => [...prev, { role: 'assistant', text: reply }]); setIsChatTyping(false); }; // 处理 AI 留言润色 const handleDraftMessage = async () => { setIsDrafting(true); const keywords = contactMessage.trim() || "需要一名活动主持人，想聊聊合作细节。"; const sysInstruct = "你是一个专业的商务助理。请根据用户输入的关键词或简略意向，扩写、润色成一段礼貌、专业、得体的商务合作留言，用于发给资深主持人/内容运营专家欧阳轩。只需直接输出留言正文，无需任何问候或解释语。"; const prompt = `请帮我润色这段留言意向: ${keywords}`; const reply = await callGemini(prompt, sysInstruct); setContactMessage(reply); setIsDrafting(false); }; // --- API 逻辑结束 --- const navLinks = [ { name: '关于我', href: '#about' }, { name: '经历与成就', href: '#experience' }, { name: '主持风采', href: '#hosting' }, { name: '技能与证书', href: '#skills' }, { name: '联系我', href: '#contact' }, ]; return (
{/* 导航栏 */} {/* Hero 区域 */}

你好，我是
欧阳轩

内容运营专家 | 资深主持人

从百万播放量的B站UP主到专业严谨的舞台主持人，我致力于创造有价值、有影响力的内容体验。

合作洽谈
欧阳轩
{/* 关于我 */}

关于我

我是欧阳轩，毕业于南昌工学院播音与主持艺术专业。我是一位拥有敏锐“网感”和极强内容创意策划能力的运营人，同时也是一位风格稳重大气、专业严谨的主持人。我擅长从数据中提炼用户需求，反哺营销策略，实现从“声量曝光”到“交易转化”的业务闭环。

播音与主持艺术本科 普通话一级乙等 百万粉内容操盘手 数据驱动营销
{/* 经历与成就 */}

经历与成就

{/* 运营成就 */}

B站自媒体运营核心操盘手

2019.07 - 至今

  • • 零粉起步独立运营，累计斩获超 738万+ 播放量。
  • • 打造单支爆款视频，播放量突破 276万+。
  • • 独立负责账号定位、选题策划与数据复盘，通过精细化运营实现高转化。
  • • 深谙B站、小红书、抖音等主流平台算法机制与用户偏好。
{/* 创业与领导经历 */}

项目负责人 & 广播台总监

数码设备租赁创业 项目负责人

  • • 跑通“社媒引流-线下交付-售后风控”全链路，累计创收 4.5万元。

校园广播台 总监 | 2022.09 – 2024.06

  • • 统筹 30人团队 的日常运营与活动执行。
  • • 主导策划并落地 10余场校园大型活动。
{/* 主持风采 */}

资深主持人

主持风格：落落大方、稳重大气、专业严谨、掌控全局。
以最专业的职业素养对待每一场主持。

政府官方类大型活动

博览会 / 开幕式 / 高峰论坛 / 新闻发布会 / 启动仪式 / 文艺演出

庆典会议类活动

晚会 / 晚宴 / 年会庆典 / 颁奖盛典 / 签约仪式 / 发布会

电视台 & 媒体活动

综艺娱乐 / 节目主持 / 视频拍摄 / 直播互动 / 各类音乐节

房产与汽车品牌活动

开盘仪式 / 暖场活动 / 全国车展 / 上市发布会 / 试乘试驾

{/* 技能与证书 */}

技能与证书

{/* 专业技能 */}

💡 核心技能

内容策划与创意 95%
数据分析与复盘 90%
视听剪辑工具 85%
主持与表达能力 95%
团队统筹管理 85%
{/* 证书展示 */}

🏆 荣誉证书

AI编程证书

AI编程证书

AI人工智能证书

AI人工智能证书

人工智能证书

人工智能证书

🏅 普通话一级乙等
🚗 C1 驾照
{/* 联系我 */}

联系我

期待与您进行更深入的交流与合作。

电子邮箱

1833517115@qq.com

联系电话

18807055168

所在地

江西南昌

{/* ✨ AI 留言交互表单 */}

在线留言探讨合作

{isSent && (
发送成功！(演示前端效果)
)}
{/* 页脚 */} {/* ✨ AI 智能客服悬浮组件 */}
{chatOpen && (
{/* 头部 */}
欧阳轩的 AI 分身
{/* 消息区 */}
{chatMessages.map((msg, idx) => (
{msg.text}
))} {isChatTyping && (
)}
{/* 输入区 */}
setChatInput(e.target.value)} placeholder="有什么可以帮您？" className="flex-1 bg-gray-50 border border-gray-200 rounded-xl px-3.5 py-2.5 text-sm text-gray-800 placeholder:text-gray-400 focus:outline-none focus:border-blue-400 focus:ring-1 focus:ring-blue-400 transition-all" />
)} {/* 悬浮唤醒按钮 */}
); }