chore(front): 对外平台官网样式外置到 platform.css + 护栏测试

This commit is contained in:
萝卜
2026-03-14 02:25:06 +00:00
parent 8c373b52dc
commit e1822e4389
4 changed files with 166 additions and 45 deletions

View File

@@ -4,40 +4,27 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SaaSShopSaaS 电商系统</title>
<style>
body{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; margin:0; background:#f6f7fb; color:#111827;}
.wrap{max-width: 980px; margin:0 auto; padding:24px;}
.card{background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:20px;}
.muted{color:#6b7280; font-size:14px; line-height:1.6;}
.grid{display:grid; grid-template-columns: 1fr 1fr; gap:16px; margin-top:16px;}
.btn{display:inline-block; padding:10px 14px; border-radius:8px; border:1px solid #111827; text-decoration:none; color:#111827; font-weight:600;}
.btn-primary{background:#111827; color:#fff;}
@media (max-width: 720px){.grid{grid-template-columns:1fr}}
</style>
<link rel="stylesheet" href="/css/platform.css">
</head>
<body>
<div class="wrap">
<div class="card">
<h1 style="margin:0 0 8px 0;">SaaSShopSaaS 电商系统</h1>
<h1 class="h1">SaaSShopSaaS 电商系统</h1>
<div class="muted">这是 SaaSShop 的对外介绍与开通入口(前期先做 A站点开通型。Blicense 授权码)后续在其它端能力更完整后再接入。</div>
<div style="margin-top:14px; display:flex; gap:10px; flex-wrap:wrap;">
<div class="mt-14 flex flex-wrap gap-10">
<a class="btn btn-primary" href="/platform/plans">查看套餐与功能</a>
<a class="btn" href="/admin/login">进入总台管理(运营/治理)</a>
</div>
</div>
<div class="grid">
<div class="grid-2">
<div class="card">
<h3 style="margin:0 0 8px 0;">四端结构</h3>
<div class="muted">
总台管理(平台治理/收费) 站点后台(站点管理员) 商家后台(商家运营) 买家端(交易体验)。
</div>
<h3 class="h3">四端结构</h3>
<div class="muted">总台管理(平台治理/收费) 站点后台(站点管理员) 商家后台(商家运营) 买家端(交易体验)。</div>
</div>
<div class="card">
<h3 style="margin:0 0 8px 0;">当前优先级</h3>
<div class="muted">
先把“套餐 订阅 平台订单 生效/同步/治理”跑成收费闭环;对外平台先做到可介绍、可看套餐、可引导开通。
</div>
<h3 class="h3">当前优先级</h3>
<div class="muted">先把“套餐 订阅 平台订单 生效/同步/治理”跑成收费闭环;对外平台先做到可介绍、可看套餐、可引导开通。</div>
</div>
</div>
</div>

View File

@@ -4,49 +4,37 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SaaSShop套餐与功能</title>
<style>
body{font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif; margin:0; background:#f6f7fb; color:#111827;}
.wrap{max-width: 980px; margin:0 auto; padding:24px;}
.top{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.muted{color:#6b7280; font-size:14px; line-height:1.6;}
.grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:16px;}
.card{background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:18px;}
.btn{display:inline-block; padding:8px 12px; border-radius:8px; border:1px solid #111827; text-decoration:none; color:#111827; font-weight:600;}
.btn-primary{background:#111827; color:#fff;}
.badge{display:inline-block; font-size:12px; padding:2px 8px; border-radius:999px; border:1px solid #e5e7eb; color:#374151;}
@media (max-width: 980px){.grid{grid-template-columns:1fr 1fr}}
@media (max-width: 720px){.grid{grid-template-columns:1fr}}
</style>
<link rel="stylesheet" href="/css/platform.css">
</head>
<body>
<div class="wrap">
<div class="top">
<div class="flex-between flex-wrap gap-10">
<div>
<h1 style="margin:0 0 6px 0;">套餐与功能</h1>
<h1 class="h1" style="margin-bottom:6px;">套餐与功能</h1>
<div class="muted">仅展示「已发布 + 启用中」套餐。开通入口A站点开通型将优先在此页面逐步接入。</div>
</div>
<div style="display:flex; gap:10px;">
<div class="flex gap-10 flex-wrap">
<a class="btn" href="/platform">返回首页</a>
<a class="btn" href="/admin/plans">运营管理套餐</a>
</div>
</div>
<div class="grid">
<div class="grid-3">
@forelse($plans as $p)
<div class="card">
<div style="display:flex; align-items:center; justify-content:space-between; gap:10px;">
<h3 style="margin:0;">{{ $p->name }}</h3>
<div class="flex-between" style="gap:10px;">
<h3 class="h3" style="margin:0;">{{ $p->name }}</h3>
<span class="badge">{{ $p->billing_cycle }}</span>
</div>
<div class="muted" style="margin-top:6px;">套餐编码:{{ $p->code }}</div>
<div style="margin-top:10px; font-size:22px; font-weight:700;">¥{{ number_format((float) $p->price, 2) }}</div>
<div class="muted mt-8">套餐编码:{{ $p->code }}</div>
<div class="price">¥{{ number_format((float) $p->price, 2) }}</div>
@if($p->description)
<div class="muted" style="margin-top:8px;">{{ $p->description }}</div>
<div class="muted mt-8">{{ $p->description }}</div>
@endif
<div style="margin-top:12px;">
<div class="mt-12">
<a class="btn btn-primary" href="/admin/platform-orders/create?plan_id={{ $p->id }}">我要开通/下单(暂由运营处理)</a>
</div>
<div class="muted" style="margin-top:8px;">提示:前期先跑通收费闭环与治理;自助开通会在后续版本接入。</div>
<div class="muted mt-8">提示:前期先跑通收费闭环与治理;自助开通会在后续版本接入。</div>
</div>
@empty
<div class="card" style="grid-column: 1 / -1;">