涔︾瀵艰埅 - 鐜颁唬鍖栦功绛剧鐞?/title> <meta name="description" content="现代化的书签导航网站，支持分类管理、搜索和排序，基于 Cloudflare 架构。"> <link rel="stylesheet" href="/css/styles.css"> <link rel="stylesheet" href="/css/bookmarks-enhanced.css"> <link rel="stylesheet" href="/css/wiki-layout.css"> <link rel="icon" type="image/x-icon" href="/favicon.ico"> </head> <body>  <div class="container">  <header class="header"> <div class="header-content"> <div class="logo"> <span class="logo-icon">B</span> <h1 class="logo-text">涔︾瀵艰埅</h1> </div>  <div class="header-actions">  <div class="action-group primary-actions"> <button id="searchToggle" class="action-btn-icon" title="鎼滅储涔︾"> <span class="btn-icon">S</span> </button> <button id="addBookmarkBtn" class="action-btn-icon primary" title="娣诲姞鏂颁功绛?> <span class="btn-icon">+</span> </button> </div>  <div class="action-group tools-menu"> <button id="toolsMenuToggle" class="action-btn-icon menu-toggle" title="宸ュ叿鑿滃崟"> <span class="btn-icon">...</span> <span class="dropdown-arrow">v</span> </button> <div id="toolsDropdown" class="dropdown-menu"> <a href="/token.html" class="dropdown-item"> <span class="item-icon">API</span> <div class="item-content"> <span class="item-text">API浠ょ墝</span> <span class="item-desc">绠＄悊璁块棶浠ょ墝</span> </div> </a> <a href="/link-checker.html" class="dropdown-item"> <span class="item-icon">CHK</span> <div class="item-content"> <span class="item-text">链接检查</span> <span class="item-desc">检查链接是否可访问</span> </div> </a> <a href="/deleted-bookmarks" class="dropdown-item"> <span class="item-icon">DEL</span> <div class="item-content"> <span class="item-text">鍒犻櫎璁板綍</span> <span class="item-desc">鏌ョ湅鍜屾仮澶嶅垹闄ょ殑涔︾</span> </div> </a> <a href="/notifications.html" class="dropdown-item"> <span class="item-icon">MSG</span> <div class="item-content"> <span class="item-text">閫氱煡涓績</span> <span class="item-desc">鏌ョ湅绯荤粺閫氱煡</span> </div> </a> <a href="/ai-settings.html" class="dropdown-item"> <span class="item-icon">AI</span> <div class="item-content"> <span class="item-text">AI Settings</span> <span class="item-desc">Manage AI endpoint and model</span> </div> </a> <div class="dropdown-divider"></div> <button id="changePasswordBtn" class="dropdown-item"> <span class="item-icon">PWD</span> <div class="item-content"> <span class="item-text">淇敼瀵嗙爜</span> <span class="item-desc">更新管理员密码</span> </div> </button> <button id="settingsToggle" class="dropdown-item"> <span class="item-icon">鈿欙笍</span> <div class="item-content"> <span class="item-text">绯荤粺璁剧疆</span> <span class="item-desc">閰嶇疆绯荤粺閫夐」</span> </div> </button> </div> </div> </div> </div> </header>  <div id="searchContainer" class="search-container hidden"> <div class="search-box"> <input type="text" id="searchInput" placeholder="鎼滅储涔︾鏍囬銆佹弿杩版垨URL..." class="search-input"> <button id="searchBtn" class="search-btn"> <span class="icon">S</span> </button> <button id="clearSearchBtn" class="search-btn clear-btn"> <span class="icon">鉁栵笍</span> </button> </div> </div>  <div class="controls-bar"> <div class="filter-controls"> <select id="categoryFilter" class="filter-select"> <option value="">所有分类</option> </select> <select id="sortSelect" class="filter-select"> <option value="created_at:desc">最新添加</option> <option value="popularity:desc">热门书签</option> <option value="visit_count:desc">访问最多</option> <option value="last_visited:desc">最近访问</option> <option value="title:asc">鏍囬 A-Z</option> <option value="title:desc">鏍囬 Z-A</option> <option value="updated_at:desc">最近更新</option> <option value="created_at:asc">最早添加</option> </select> </div> <div class="view-controls"> <button id="gridViewBtn" class="view-btn active" title="缃戞牸瑙嗗浘"> <span class="icon">#</span> </button> <button id="listViewBtn" class="view-btn" title="鍒楄〃瑙嗗浘"> <span class="icon">=</span> </button> </div> </div>  <div class="stats-bar"> <div class="stats-item"> <span class="stats-label">鎬昏:</span> <span id="totalCount" class="stats-value">0</span> </div> <div class="stats-item"> <span class="stats-label">褰撳墠椤?</span> <span id="currentPageInfo" class="stats-value">0</span> </div> </div>  <main class="main-content"> <div class="wiki-layout" id="wikiLayout"> <aside class="wiki-sidebar"> <div class="sidebar-section sidebar-search-section"> <div class="sidebar-search-box"> <input type="text" id="wikiSearchInput" placeholder="像查 Wiki 一样搜索书签..."> <button id="openCommandPalette" class="ghost-btn" title="Command Palette"> Ctrl + K </button> </div> <p class="sidebar-hint">瀹炴椂杩囨护 + 鍛戒护闈㈡澘锛屽揩閫熷畾浣嶄换鎰忔敹钘?/p> </div> <div class="sidebar-section"> <div class="section-heading"> <h3>鐩綍</h3> <span id="wikiCategoryCount" class="section-meta">0</span> </div> <nav id="wikiToc" class="wiki-toc"></nav> </div> <div class="sidebar-section"> <div class="section-heading"> <h3>甯哥敤 / 缃《</h3> </div> <div id="wikiPinned" class="wiki-pinned-list"></div> </div> </aside> <section class="wiki-content-panel"> <header class="wiki-hero"> <div> <p class="hero-eyebrow">涔︾鐭ヨ瘑搴?/p> <h2>像浏览 Wiki 一样查看你的收藏</h2> <p class="hero-subtitle"> <span id="wikiSummaryCount">0</span> 鏉′功绛?路鍗虫椂鎼滅储路鎸夊垎绫荤敓鎴愮珷鑺?& 鐩綍 </p> <p class="wiki-ai-status" id="wikiAiStatus">AI 瑙嗗浘锛氬皻鏈敓鎴?/p> </div> <div class="wiki-hero-actions"> <button id="generateAiWikiBtn" class="primary-btn">AI 鑷姩鏁寸悊</button> <button id="toggleWikiModeBtn" class="ghost-btn" type="button">浣跨敤鏈湴瑙嗗浘</button> <button id="openQuickSearch" class="ghost-btn" type="button">鎵撳紑鎸囦护闈㈡澘</button> <button id="scrollTopBtn" class="ghost-btn" type="button">杩斿洖椤堕儴</button> </div> </header> <div id="wikiContent" class="wiki-content"></div> <div id="wikiEmptyState" class="wiki-empty hidden"> <p>杩樻病鏈夊尮閰嶇殑涔︾锛屽皾璇曟崲涓叧閿瘝?</p> </div> </section> </div> <div id="bookmarksGrid" class="bookmarks-grid hidden" aria-hidden="true">  </div>  <div id="loadingState" class="loading-state"> <div class="loading-spinner"></div> <p>鍔犺浇涓?..</p> </div>  <div id="emptyState" class="empty-state hidden"> <div class="empty-icon">B</div> <h3>鏆傛棤涔︾</h3> <p>鐐瑰嚮鍙充笂瑙掔殑鉃?鎸夐挳娣诲姞鎮ㄧ殑绗竴涓功绛?/p> </div>  <div id="errorState" class="error-state hidden"> <div class="error-icon">鈿狅笍</div> <h3>鍔犺浇澶辫触</h3> <p id="errorMessage">缃戠粶杩炴帴寮傚父锛岃绋嶅悗閲嶈瘯</p> <button id="retryBtn" class="btn btn-primary">閲嶈瘯</button> </div> </main>  <div id="paginationContainer" class="pagination-container hidden" aria-hidden="true"> <div class="pagination"> <button id="prevPageBtn" class="pagination-btn" disabled> <span class="icon"><</span> 涓婁竴椤? </button> <div id="pageNumbers" class="page-numbers">  </div> <button id="nextPageBtn" class="pagination-btn" disabled> 涓嬩竴椤? <span class="icon">></span> </button> </div> </div> </div>  <div id="bookmarkModal" class="modal hidden"> <div class="modal-content"> <div class="modal-header"> <h3 id="modalTitle">娣诲姞涔︾</h3> <button id="closeModalBtn" class="btn-close">脳</button> </div> <form id="bookmarkForm" class="modal-body"> <div class="form-group"> <label for="bookmarkTitle">鏍囬 *</label> <input type="text" id="bookmarkTitle" required class="form-input"> </div> <div class="form-group"> <label for="bookmarkUrl">URL *</label> <input type="url" id="bookmarkUrl" required class="form-input"> </div> <div class="form-group"> <label for="bookmarkDescription">鎻忚堪</label> <textarea id="bookmarkDescription" class="form-textarea" rows="3"></textarea> </div> <div class="form-group"> <label for="bookmarkCategory">鍒嗙被</label> <select id="bookmarkCategory" class="form-select"> <option value="">无分类</option> </select> </div> <div class="modal-actions"> <button type="button" id="cancelBtn" class="btn btn-secondary">鍙栨秷</button> <button type="submit" id="saveBtn" class="btn btn-primary">淇濆瓨</button> </div> </form> </div> </div>  <div id="settingsPanel" class="settings-panel hidden"> <div class="panel-header"> <h3>鈿欙笍璁剧疆</h3> <button id="settingsClose" class="btn-close">脳</button> </div> <div class="panel-content"> <div class="settings-section"> <h4>璐︽埛绠＄悊</h4> <button id="logoutBtn" class="btn btn-outline">退出登录</button> </div> <div class="settings-section"> <h4>鏁版嵁绠＄悊</h4> <div class="export-buttons"> <button id="exportBtn" class="btn btn-outline">瀵煎嚭涓篐TML</button> <button id="exportJSONBtn" class="btn btn-outline">瀵煎嚭涓篔SON</button> </div> <div class="backup-buttons"> <button id="fullBackupJSONBtn" class="btn btn-primary">完整备份 (JSON)</button> <button id="fullBackupHTMLBtn" class="btn btn-primary">完整备份 (HTML)</button> </div> <button id="importBtn" class="btn btn-outline">瀵煎叆涔︾</button> </div> <div class="settings-section"> <h4>AI 閰嶇疆</h4> <p class="settings-info">鑷畾涔?AI 鎺ュ彛涓庢ā鍨嬶紝杩愯 AI Wiki 鍓嶈纭繚瀵嗛挜鏈夋晥銆?/p> <form id="aiSettingsForm" class="settings-form"> <div class="form-group"> <label for="aiEndpointInput">AI 鎺ュ彛 URL</label> <input type="url" id="aiEndpointInput" class="form-input" placeholder="https://api.openai.com/v1/chat/completions"> <small>鐣欑┖鏃朵娇鐢ㄧ幆澧冨彉閲?AI_API_ENDPOINT</small> </div> <div class="form-group"> <label for="aiModelInput">榛樿妯″瀷</label> <input type="text" id="aiModelInput" class="form-input" placeholder="gpt-4o-mini"> <small>鐣欑┖鏃朵娇鐢ㄧ幆澧冨彉閲?AI_MODEL</small> </div> <button type="submit" class="btn btn-primary">淇濆瓨 AI 閰嶇疆</button> </form> </div> <div class="settings-section"> <h4>鍏充簬</h4> <p class="settings-info">涔︾瀵艰埅 v1.0.0</p> <p class="settings-info">鍩轰簬 Cloudflare Pages + D1</p> </div> </div> </div>  <div id="messageContainer" class="message-container hidden"> <div id="messageText" class="message-text"></div> </div>  <div id="changePasswordModal" class="modal hidden"> <div class="modal-content"> <div class="modal-header"> <h3>修改密码</h3> <button id="closePasswordModal" class="btn-close">×</button> </div> <div class="modal-body"> <form id="changePasswordForm"> <div class="form-group"> <label for="currentPassword">褰撳墠瀵嗙爜</label> <input type="password" id="currentPassword" required> </div> <div class="form-group"> <label for="newPassword">新密码</label> <input type="password" id="newPassword" required minlength="6"> <small>瀵嗙爜闀垮害鑷冲皯6浣?/small> </div> <div class="form-group"> <label for="confirmPassword">确认新密码</label> <input type="password" id="confirmPassword" required minlength="6"> </div> <div class="form-actions"> <button type="button" id="cancelPasswordChange" class="btn btn-secondary">鍙栨秷</button> <button type="submit" class="btn btn-primary">纭淇敼</button> </div> </form> </div> </div> </div> <div id="commandPalette" class="command-palette hidden" role="dialog" aria-modal="true"> <div class="command-panel"> <div class="command-header"> <span class="command-icon">></span> <input type="text" id="paletteInput" placeholder="鎼滅储涔︾銆佸垎绫绘垨杈撳叆鍏抽敭璇?.." autocomplete="off"> <button id="commandCloseBtn" class="ghost-btn" type="button">脳</button> </div> <div id="paletteResults" class="command-results"></div> </div> </div>  <script src="/js/utils/storage.js"></script> <script src="/js/utils/api.js"></script> <script src="/js/utils/sorting.js"></script> <script src="/js/utils/dom-helper.js"></script> <script src="/js/utils/ui-helper.js"></script> <script src="/js/wiki-view.js"></script> <script src="/js/auth.js"></script> <script src="/js/bookmarks.js"></script> <script src="/js/ui-enhancements.js"></script> <script src="/js/app.js"></script> </body> </html>