cms-SiteForge/app/templates/workspace.html

<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<title>SiteForge · 网站工作台</title><meta name="description" content="统一管理网站、内容、设计、迁移和构建。">
<link rel="icon" href="/favicon.ico"><link rel="stylesheet" href="/ui/workspace.css"><script defer src="/ui/workspace-guide.js"></script><script defer src="/ui/workspace-launch.js"></script><script defer src="/ui/workspace.js"></script></head>
<body>
<div class="app-shell">
 <aside class="nav-side" id="sideMenu">
  <a href="/" class="brand" aria-label="SiteForge 工作台"><span class="brand-icon">S</span><span><strong>SiteForge</strong><small>网站生产工厂</small></span></a>
  <div class="nav-group"><div class="nav-label">工作空间</div>
   <button data-view="home" class="nav-item active"><span class="nav-ico">▦</span><span>工作台</span></button>
   <button data-view="sites" class="nav-item"><span class="nav-ico">▤</span><span>我的网站</span></button>
  </div>
  <div class="nav-group" id="websiteGroup"><div class="nav-label">当前网站</div><div id="sideSiteName" class="site-mini">请先选择网站</div>
   <button data-view="overview" class="nav-item"><span class="nav-ico">◎</span><span>网站概览</span></button>
   <button data-view="guide" class="nav-item"><span class="nav-ico">✓</span><span>建站操作指引</span></button>
   <button data-view="content" class="nav-item"><span class="nav-ico">▧</span><span>内容与页面</span></button>
   <button data-view="design" class="nav-item"><span class="nav-ico">◈</span><span>外观与设计</span></button>
   <button data-view="import" class="nav-item"><span class="nav-ico">⇩</span><span>导入与迁移</span></button>
   <button data-view="build" class="nav-item"><span class="nav-ico">◴</span><span>生成与预览</span></button>
   <button data-view="launch" class="nav-item"><span class="nav-ico">↗</span><span>检查并上线</span></button>
   <button data-view="languages" class="nav-item"><span class="nav-ico">文</span><span>多语言管理</span></button>
   <button data-view="settings" class="nav-item"><span class="nav-ico">⚙</span><span>网站设置</span></button>
  </div>
  <details class="advanced"><summary><span class="nav-ico">⌘</span>高级工具 <span class="chevron">⌄</span></summary>
   <a href="/production-v8" class="nav-sub">数据导入与模板管理</a>
   <a href="/operations" class="nav-sub">迁移复核与发布审批</a>
   <a href="/theme-gallery" class="nav-sub">完整主题预览</a>
   <a href="/factory-studio" class="nav-sub">高级网站设计</a>
   <a href="/classic" class="nav-sub">旧版管理功能</a>
  </details>
  <div class="side-foot"><span class="side-indicator"></span><span><strong>系统运行中</strong><small id="appVersion">读取版本…</small></span></div>
 </aside>
 <div class="content-shell">
  <header class="topbar">
   <div class="top-left"><button class="hamburger" id="menuToggle" aria-label="展开菜单" aria-expanded="false">☰</button><div class="breadcrumbs"><span>工作空间</span><span class="crumb-divider">/</span><strong id="breadcrumbTitle">工作台</strong></div></div>
   <div class="top-right"><label class="site-picker-wrap"><span>正在管理</span><select id="sitePicker" aria-label="选择当前网站"><option value="">请选择网站</option></select></label><button id="newSiteTop" class="btn btn-primary">＋ 创建网站</button><button class="logout" id="logoutBtn" title="退出登录" aria-label="退出登录">↪</button></div>
  </header>
  <main class="main-content" id="mainContent" tabindex="-1"><div class="skeleton">正在读取工作空间…</div></main>
  <footer class="app-footer"><span>SiteForge · 让网站制作有清晰的下一步</span><span>正式发布前请完成内容与 SEO 检查</span></footer>
 </div>
</div>
<div class="mobile-backdrop" id="mobileBackdrop"></div><div id="toast" class="toast" role="status" aria-live="polite"></div>
<dialog id="siteModal" class="modal sf-create-dialog"><form id="siteForm" class="modal-inner" novalidate>
<div class="modal-top"><div><p class="overline">开始建立网站</p><h2>创建新网站</h2><p class="subtle" id="createProgressText" aria-live="polite">第 1 步，共 3 步 · 选择建站方式</p></div><button type="button" data-close="siteModal" class="x-btn" aria-label="关闭创建窗口">×</button></div>
<ol class="sf-create-progress" aria-label="创建网站进度"><li data-create-indicator="0" aria-current="step">基本信息</li><li data-create-indicator="1">选择风格</li><li data-create-indicator="2">确认创建</li></ol>
<section class="sf-create-step" data-create-step="0"><h3>你想制作什么网站？</h3><p class="sf-guide-desc">先选目的，再填名称，后续内容都能修改。</p>
<div class="form-fields"><label class="full">网站名称 <span class="sf-required">必填</span><input name="name" required maxlength="150" placeholder="例如：HESU Auto 全球官网"></label>
<label class="full">建站方式<select name="mode"><option value="new">全新制作网站</option><option value="migration">迁移已有 WordPress 网站</option><option value="hybrid">在旧内容基础上重新设计</option></select></label></div></section>
<section class="sf-create-step" data-create-step="1" hidden><h3>选择一种网站风格</h3><p class="sf-guide-desc">这里只是起始模板，建好网站仍可以更换。</p>
<div class="form-fields"><label class="full">行业主题<select name="theme"><option value="automotive">汽车与出行</option><option value="industrial">工业与制造</option><option value="corporate" selected>企业品牌</option><option value="minimal">极简展示</option><option value="trade-pro">Trade Pro · 外贸 B2B（英文）</option></select></label>
<label class="full">一句话介绍 <span class="optional">选填</span><input name="tagline" placeholder="例如：全球汽车出口与服务"></label></div></section>
<section class="sf-create-step" data-create-step="2" hidden><h3>确认网站信息</h3><p class="sf-guide-desc">创建只会生成一个网站项目，不会自动发布到互联网。</p>
<div class="sf-create-summary" id="createSummary"></div>
<div class="form-fields"><label class="full">正式域名 <span class="optional">可稍后设置</span><input name="domain" type="url" placeholder="https://www.example.com"></label></div>
<div class="sf-guide-safety">创建完成后建议先添加真实内容，再编辑页面，最后预览、检查和发布。</div></section>
<p id="createError" class="sf-create-error" role="alert" hidden></p>
<div class="modal-actions"><button type="button" data-close="siteModal" class="btn btn-muted">取消</button><button type="button" id="createBack" class="btn btn-muted" hidden>上一步</button><button type="button" id="createNext" class="btn btn-primary">下一步：选择风格 →</button><button type="submit" id="createSubmit" class="btn btn-primary" hidden>确认创建网站</button></div>
</form></dialog>
<dialog id="entryModal" class="modal"><form id="entryForm" class="modal-inner"><div class="modal-top"><div><p class="overline">SITE CONTENT</p><h2 id="entryModalTitle">添加内容</h2><p class="subtle">按业务填写信息即可。详细布局可以进入可视化编辑器修改。</p></div><button type="button" data-close="entryModal" class="x-btn" aria-label="关闭">×</button></div><input type="hidden" name="entry_id"><div class="form-fields"><label>内容类型<select name="type"><option value="page">网站页面</option><option value="product">产品</option><option value="vehicle">车型</option><option value="post">新闻文章</option><option value="brand">品牌</option><option value="case">案例</option><option value="service">服务项目</option></select></label><label>状态<select name="status"><option value="published">可参与网站构建</option><option value="draft">内容草稿</option></select></label><label class="full">标题<input name="title" required maxlength="250" placeholder="输入页面或产品标题"></label><label class="full">页面地址 <span class="optional">新内容可留空</span><input name="route" placeholder="/products/example/"></label><label class="full">简短介绍<textarea name="summary" rows="2" placeholder="显示在列表和摘要中的介绍"></textarea></label><label class="full">正文内容 <span class="optional">可选</span><textarea name="body" rows="5" placeholder="填写业务正文，复杂排版请使用可视化设计器"></textarea></label><details class="form-expand full"><summary>SEO 设置（进阶）</summary><div class="form-fields"><label class="full">SEO 标题<input name="seo_title" placeholder="默认使用内容标题"></label><label class="full">Meta 描述<textarea name="seo_description" rows="2"></textarea></label></div></details></div><div class="modal-actions"><button type="button" data-close="entryModal" class="btn btn-muted">取消</button><button type="submit" class="btn btn-primary">保存内容</button></div></form></dialog>
</body></html>