| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 |
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>ChatGPT-like Clone</title>
- <link rel="stylesheet" href="/static/styles.css">
- </head>
- <body>
- <div class="app-shell">
- <aside class="sidebar">
- <div class="sidebar-scroll">
- <section class="sidebar-section">
- <label for="model-select" class="sidebar-label">选择模型</label>
- <select id="model-select" class="sidebar-input"></select>
- </section>
- <section class="sidebar-section">
- <label for="output-mode" class="sidebar-label">选择输出模式</label>
- <select id="output-mode" class="sidebar-input"></select>
- </section>
- <section class="sidebar-section">
- <label for="search-input" class="sidebar-label">搜索当前对话内容</label>
- <input id="search-input" type="text" class="sidebar-input" placeholder="输入关键字...">
- <div id="search-feedback" class="sidebar-help">无匹配。</div>
- </section>
- <section class="sidebar-section">
- <label for="history-range" class="sidebar-label" id="history-range-label">选择使用的历史消息数量</label>
- <input id="history-range" type="range" min="0" max="0" value="0" class="sidebar-range">
- <div id="history-range-value" class="sidebar-help">您选择的历史消息数量是: 0</div>
- </section>
- <section class="sidebar-section sidebar-actions">
- <button id="new-chat-btn" class="primary-button">New Chat</button>
- </section>
- </div>
- <div class="sidebar-history" aria-label="历史聊天记录">
- <div class="sidebar-history-header">
- <h3 class="sidebar-heading">历史聊天记录</h3>
- <span id="history-count" class="history-count" aria-live="polite"></span>
- </div>
- <div id="history-list" class="history-list" role="list"></div>
- <div class="history-pagination">
- <button id="history-prev" class="secondary-button">上一页</button>
- <button id="history-next" class="secondary-button">下一页</button>
- </div>
- </div>
- </aside>
- <main class="main-panel">
- <header class="app-header">
- <h1>ChatGPT-like Clone</h1>
- </header>
- <section id="chat-messages" class="chat-messages"></section>
- <form id="chat-form" class="chat-form">
- <textarea id="chat-input" placeholder="What is up?" rows="3" class="chat-textarea"></textarea>
- <div class="chat-form-footer">
- <label for="file-input" class="file-input-label">选择文件</label>
- <input id="file-input" type="file" multiple accept=".jpg,.jpeg,.png,.txt,.pdf,.doc,.docx" class="file-input">
- <button type="submit" id="send-btn" class="primary-button">发送</button>
- </div>
- <div id="chat-status" class="chat-status" aria-live="polite"></div>
- </form>
- </main>
- </div>
- <div id="toast" class="toast hidden"></div>
- <script defer src="/static/app.js"></script>
- </body>
- </html>
|
