Connect partnership form to email

2026-07-21 13:00:44 +02:00
parent 1b741bbe0b
commit 4cdf50c27b
2 changed files with 31 additions and 3 deletions
@@ -1,3 +1,29 @@
-"use client";import { FormEvent,useState } from "react";
-const interests=["真人授权 AI 分身","年轻时期 AI 分身","原创数字人 IP","内容增长","评论与私聊运营","粉丝变现","MCN / Agency 合作"];
-export function ContactForm(){const [sent,setSent]=useState(false);function submit(e:FormEvent){e.preventDefault();setSent(true)}if(sent)return <div className="success" role="status"><i>✓</i><p className="eyebrow">INQUIRY SAVED</p><h2>合作意向已记录。</h2><p>这是网站原型的交互演示。正式上线时，可将表单接入邮箱、CRM 或企业协作工具。</p><button className="link" type="button" onClick={()=>setSent(false)}>继续填写一份 <b>→</b></button></div>;return <form className="form" onSubmit={submit}><div className="form-row"><label>你的称呼<input required placeholder="怎么称呼你"/></label><label>合作身份<select required defaultValue=""><option value="" disabled>请选择</option><option>个人创作者</option><option>艺人 / 经纪团队</option><option>原创数字人 IP / 项目方</option><option>MCN / Agency</option><option>品牌或平台</option></select></label></div><label>主要账号或作品链接<input required type="url" placeholder="https://"/></label><div className="form-row"><label>主要平台<select required defaultValue=""><option value="" disabled>请选择</option><option>Facebook</option><option>Instagram</option><option>TikTok</option><option>YouTube</option><option>其他</option></select></label><label>粉丝规模<select required defaultValue=""><option value="" disabled>请选择</option><option>尚未创建</option><option>1 万以下</option><option>1–10 万</option><option>10–100 万</option><option>100 万以上</option></select></label></div><fieldset><legend>感兴趣的合作方向</legend><div className="checks">{interests.map(x=><label key={x}><input type="checkbox"/><span>{x}</span></label>)}</div></fieldset><label>你现在最想解决的问题<textarea rows={5} placeholder="例如：想从零打造一个面向拉美市场的原创数字人 IP……"/></label><label className="consent"><input required type="checkbox"/><span>我同意团队仅为评估本次合作而使用以上信息。</span></label><button className="btn primary submit" type="submit">提交合作意向 <b>→</b></button><p className="note">原型演示：当前不会向外部系统发送数据。</p></form>}
+"use client";
+
+import { useEffect, useState } from "react";
+
+const interests = ["真人当前形象 AI 分身","年轻时期 AI 分身","原创数字人 IP","内容增长","评论与私信运营","粉丝变现","全链路转化分析"];
+const returnUrl = "https://ai-creator-partnership.liuxiaorong2025.chatgpt.site/contact?sent=1";
+
+export function ContactForm(){
+  const [sent,setSent]=useState(false);
+  useEffect(()=>{if(new URLSearchParams(window.location.search).get("sent")==="1")setSent(true)},[]);
+
+  if(sent)return <div className="success" role="status"><i>✓</i><p className="eyebrow">INQUIRY SENT</p><h2>合作意向已发送。</h2><p>信息已提交至合作团队邮箱。我们会评估你的账号基础与合作目标，并在有合作空间时与你联系。</p><button className="link" type="button" onClick={()=>{window.history.replaceState({},"","/contact");setSent(false)}}>继续填写一份 <b>→</b></button></div>;
+
+  return <form className="form" action="https://formsubmit.co/liuxiaorong2018@gmail.com" method="POST">
+    <input type="hidden" name="_subject" value="COZCREATOR：收到新的创作者合作意向"/>
+    <input type="hidden" name="_template" value="table"/>
+    <input type="hidden" name="_next" value={returnUrl}/>
+    <input type="text" name="_honey" className="form-honey" tabIndex={-1} autoComplete="off"/>
+    <div className="form-row"><label>你的称呼<input name="称呼" required placeholder="怎么称呼你"/></label><label>合作身份<select name="合作身份" required defaultValue=""><option value="" disabled>请选择</option><option>个人创作者</option><option>艺人 / 经纪团队</option><option>原创数字人 IP / 项目方</option><option>MCN / Agency</option><option>品牌或平台</option></select></label></div>
+    <label>联系邮箱或 WhatsApp<input name="联系方式" required placeholder="方便我们与你联系"/></label>
+    <label>主要账号或作品链接<input name="账号或作品链接" required type="url" placeholder="https://"/></label>
+    <div className="form-row"><label>主要平台<select name="主要平台" required defaultValue=""><option value="" disabled>请选择</option><option>Facebook</option><option>Instagram</option><option>TikTok</option><option>YouTube</option><option>其他</option></select></label><label>粉丝规模<select name="粉丝规模" required defaultValue=""><option value="" disabled>请选择</option><option>尚未创建</option><option>1 万以下</option><option>1–10 万</option><option>10–100 万</option><option>100 万以上</option></select></label></div>
+    <fieldset><legend>感兴趣的合作方向</legend><div className="checks">{interests.map(x=><label key={x}><input name="合作方向" value={x} type="checkbox"/><span>{x}</span></label>)}</div></fieldset>
+    <label>你现在最想解决的问题<textarea name="合作需求" rows={5} placeholder="例如：想从零打造一个面向拉美市场的原创数字人 IP……"/></label>
+    <label className="consent"><input required type="checkbox"/><span>我同意团队仅为评估本次合作而使用以上信息。</span></label>
+    <button className="btn primary submit" type="submit">提交合作意向 <b>→</b></button>
+    <p className="note">提交后，合作意向将发送至团队邮箱。</p>
+  </form>
+}