Implement compression quota refunds and admin manual subscription

frontend/src/pages/DocsPage.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="space-y-6">
+    <div class="space-y-1">
+      <h1 class="text-2xl font-semibold tracking-tight text-slate-900">开发者</h1>
+      <p class="text-sm text-slate-600">对外 API + 计费 + 额度（硬配额）一体化。</p>
+    </div>
+
+    <div class="rounded-xl border border-slate-200 bg-white p-5 text-sm text-slate-700">
+      <div class="font-medium text-slate-900">快速开始</div>
+      <ol class="mt-2 list-decimal space-y-1 pl-5">
+        <li>登录后，在控制台创建 API Key（仅 Pro/Business）。</li>
+        <li>调用 <code>POST /api/v1/compress/direct</code> 获得二进制输出。</li>
+        <li>配额不足返回 <code>402 QUOTA_EXCEEDED</code>，请升级或等待周期重置。</li>
+      </ol>
+    </div>
+
+    <div class="rounded-xl border border-slate-200 bg-white p-5 text-sm text-slate-700">
+      <div class="font-medium text-slate-900">示例（curl）</div>
+      <pre class="mt-3 overflow-auto rounded-lg bg-slate-950 p-4 text-xs text-slate-100"><code>curl -X POST \\
+  -H \"X-API-Key: if_live_xxx\" \\
+  -F \"file=@./demo.png\" \\
+  -F \"compression_rate=70\" \\
+  https://your-domain.com/api/v1/compress/direct -o out.png</code></pre>
+    </div>
+
+    <div class="text-sm text-slate-600">
+      更完整的接口说明请查看仓库内文档：<code>docs/api.md</code>。
+    </div>
+  </div>
+</template>