286 lines
13 KiB
HTML
286 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>SDK 生成器</title>
|
||
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🚀</text></svg>" />
|
||
<link rel="stylesheet" href="/static/css/style.css" />
|
||
</head>
|
||
<body>
|
||
|
||
<div class="container">
|
||
<!-- 头部 -->
|
||
<header class="header">
|
||
<h1>🚀 SDK 生成器</h1>
|
||
<p class="subtitle">管理 API 文档，自动生成 Go SDK 或服务端骨架</p>
|
||
</header>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 操作栏 -->
|
||
<!-- ============================================================ -->
|
||
<div class="toolbar">
|
||
<button class="btn-primary" id="addDocBtn">📄 添加文档实例</button>
|
||
<button class="btn-refresh" id="refreshListBtn">🔄 刷新</button>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 文档实例列表 -->
|
||
<!-- ============================================================ -->
|
||
<section class="list-section">
|
||
<div class="list-header">
|
||
<span class="list-title">📋 文档实例列表</span>
|
||
<span class="list-count" id="listCount">共 0 个</span>
|
||
</div>
|
||
<div class="list-body" id="docList">
|
||
<div class="list-empty">暂无文档实例，点击「添加文档实例」创建</div>
|
||
</div>
|
||
<div class="list-pagination" id="pagination" style="display:none;">
|
||
<button class="btn-page" id="prevPage">‹</button>
|
||
<span class="page-info" id="pageInfo">1 / 1</span>
|
||
<button class="btn-page" id="nextPage">›</button>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：添加文档实例 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="addDocModal" style="display:none;">
|
||
<div class="modal-content modal-lg">
|
||
<div class="modal-header">
|
||
<span class="modal-title">📄 添加文档实例</span>
|
||
<button class="modal-close" id="addDocModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form id="addDocForm">
|
||
<div class="form-group">
|
||
<label>文档文件 <span class="required">*</span></label>
|
||
<div class="upload-zone-small" id="addUploadZone">
|
||
<span class="upload-text-small">点击或拖拽上传文档</span>
|
||
<span class="upload-hint-small">支持 .md .txt .doc .docx .pdf</span>
|
||
<input type="file" id="addFileInput" accept=".md,.txt,.doc,.docx,.pdf" />
|
||
</div>
|
||
<div class="file-info-small" id="addFileInfo" style="display:none;">
|
||
<span id="addFileName"></span>
|
||
<button class="btn-remove-small" id="addRemoveFile">✕</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="addApiKey">API Key <span class="required">*</span></label>
|
||
<input type="password" id="addApiKey" placeholder="请输入 API Key" />
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="addBaseUrl">Base URL <span class="required">*</span></label>
|
||
<input type="text" id="addBaseUrl" placeholder="https://ark.cn-beijing.volces.com/api/v3" value="https://ark.cn-beijing.volces.com/api/v3" />
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="addModel">大模型 <span class="required">*</span></label>
|
||
<input type="text" id="addModel" placeholder="deepseek-v4-flash-260425" value="deepseek-v4-flash-260425" />
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="addDesc">文档备注</label>
|
||
<input type="text" id="addDesc" placeholder="例如：兴业银行对接文档" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-actions">
|
||
<button type="button" class="btn-cancel" id="addCancelBtn">取消</button>
|
||
<button type="submit" class="btn-submit" id="addSubmitBtn">
|
||
<span class="btn-text">📝 精炼并保存</span>
|
||
<span class="btn-spinner" style="display:none;">⟳</span>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：修改文档 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="editDocModal" style="display:none;">
|
||
<div class="modal-content modal-lg">
|
||
<div class="modal-header">
|
||
<span class="modal-title">✏️ 修改文档</span>
|
||
<span class="modal-subtitle" id="editInstanceId"></span>
|
||
<button class="modal-close" id="editDocModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form id="editDocForm">
|
||
<div class="form-group">
|
||
<label for="editDesc">文档备注</label>
|
||
<input type="text" id="editDesc" placeholder="文档备注" />
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label>接口列表（只读）</label>
|
||
<div class="interface-list-display" id="editInterfaceList">
|
||
<span style="color:#9ca3af;font-size:13px;">暂无接口</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;">
|
||
<label style="margin:0;">精炼文档内容</label>
|
||
<button type="button" class="btn-toggle" id="toggleMarkdownView">✏️ 修改</button>
|
||
</div>
|
||
<div id="editRefinedDocPreview" class="markdown-preview"></div>
|
||
<textarea id="editRefinedDocRaw" rows="15" placeholder="精炼文档内容" style="display:none;" class="markdown-editor"></textarea>
|
||
</div>
|
||
|
||
<div class="form-actions">
|
||
<button type="button" class="btn-cancel" id="editCancelBtn">取消</button>
|
||
<button type="submit" class="btn-submit" id="editSubmitBtn">
|
||
<span class="btn-text">💾 保存修改</span>
|
||
<span class="btn-spinner" style="display:none;">⟳</span>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：生成代码 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="generateModal" style="display:none;">
|
||
<div class="modal-content modal-md">
|
||
<div class="modal-header">
|
||
<span class="modal-title">🚀 生成代码</span>
|
||
<span class="modal-subtitle" id="genInstanceId"></span>
|
||
<button class="modal-close" id="generateModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form id="generateForm">
|
||
<input type="hidden" id="genInstanceIdHidden" />
|
||
|
||
<div class="form-group">
|
||
<label>实现接口列表（勾选需要生成的接口）</label>
|
||
<div id="genInterfacesList" class="interface-checkbox-list"></div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genSdkName">仓库名称 <span class="required">*</span></label>
|
||
<input type="text" id="genSdkName" placeholder="例如：marketing-sdk" />
|
||
<small>将作为代码仓库名称和包名</small>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genGenerateType">生成类型 <span class="required">*</span></label>
|
||
<select id="genGenerateType">
|
||
<option value="1">客户端 SDK（调用别人 API）</option>
|
||
<option value="2">服务端骨架（被别人调用）</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genCodeType">代码类型</label>
|
||
<input type="text" id="genCodeType" value="go" disabled style="background:#f3f4f6;cursor:not-allowed;" />
|
||
<small>固定为 go</small>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genApiKey">API Key <span class="required">*</span></label>
|
||
<input type="password" id="genApiKey" placeholder="请输入 API Key" />
|
||
</div>
|
||
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label for="genBaseUrl">Base URL <span class="required">*</span></label>
|
||
<input type="text" id="genBaseUrl" placeholder="https://ark.cn-beijing.volces.com/api/v3" value="https://ark.cn-beijing.volces.com/api/v3" />
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="genModel">大模型 <span class="required">*</span></label>
|
||
<input type="text" id="genModel" placeholder="deepseek-v4-flash-260425" value="deepseek-v4-flash-260425" />
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genMsgContent">通知内容（可选）</label>
|
||
<input type="text" id="genMsgContent" placeholder="生成完成后发送的通知内容" />
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="genMesSendToken">钉钉 Token（可选）</label>
|
||
<input type="text" id="genMesSendToken" placeholder="钉钉机器人 access_token" />
|
||
</div>
|
||
|
||
<div class="form-actions">
|
||
<button type="button" class="btn-cancel" id="genCancelBtn">取消</button>
|
||
<button type="submit" class="btn-submit" id="genSubmitBtn">
|
||
<span class="btn-text">🚀 生成代码</span>
|
||
<span class="btn-spinner" style="display:none;">⟳</span>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：历史任务列表 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="historyModal" style="display:none;">
|
||
<div class="modal-content modal-lg">
|
||
<div class="modal-header">
|
||
<span class="modal-title">📋 历史任务</span>
|
||
<span class="modal-subtitle" id="historyInstanceId"></span>
|
||
<button class="modal-close" id="historyModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="history-toolbar">
|
||
<button class="btn-refresh-small" id="refreshHistoryBtn">🔄 刷新</button>
|
||
</div>
|
||
<div class="history-list" id="historyList">
|
||
<div class="list-empty">暂无历史任务</div>
|
||
</div>
|
||
<div class="history-pagination" id="historyPagination" style="display:none;">
|
||
<button class="btn-page" id="historyPrevPage">‹</button>
|
||
<span class="page-info" id="historyPageInfo">1 / 1</span>
|
||
<button class="btn-page" id="historyNextPage">›</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：任务详情 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="taskDetailModal" style="display:none;">
|
||
<div class="modal-content modal-lg">
|
||
<div class="modal-header">
|
||
<span class="modal-title">📊 任务详情</span>
|
||
<span class="modal-subtitle" id="taskDetailId"></span>
|
||
<button class="modal-close" id="taskDetailModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="task-detail" id="taskDetailContent">
|
||
<div class="detail-loading">加载中...</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============================================================ -->
|
||
<!-- 弹窗：用量详情 -->
|
||
<!-- ============================================================ -->
|
||
<div class="modal-overlay" id="usageModal" style="display:none;">
|
||
<div class="modal-content modal-md">
|
||
<div class="modal-header">
|
||
<span class="modal-title">📊 Token 用量详情</span>
|
||
<button class="modal-close" id="usageModalClose">✕</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div id="usageContent"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="/static/js/app.js"></script>
|
||
</body>
|
||
</html> |