175 lines
7.9 KiB
HTML
175 lines
7.9 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>内容库 - 参数数据自动化管理系统</title>
|
|
<link rel="stylesheet" href="/static/css/style.css">
|
|
<link rel="stylesheet" href="/static/css/library.css">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/remixicon@3.5.0/fonts/remixicon.css">
|
|
</head>
|
|
<body>
|
|
<div class="library-container">
|
|
<!-- 头部 -->
|
|
<header class="library-header">
|
|
<div class="header-left">
|
|
<a href="/" class="back-link">
|
|
<i class="ri-arrow-left-line"></i> 返回主页
|
|
</a>
|
|
<h1><i class="ri-folder-line"></i> 内容库</h1>
|
|
</div>
|
|
<div class="header-right">
|
|
<div class="stats-info">
|
|
<span id="total-count">0 篇文章</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- 工具栏 -->
|
|
<div class="toolbar">
|
|
<div class="toolbar-left">
|
|
<div class="search-box">
|
|
<i class="ri-search-line"></i>
|
|
<input type="text" id="search-input" placeholder="搜索标题、内容、来源...">
|
|
</div>
|
|
<select id="category-filter" class="category-select">
|
|
<option value="">全部分类</option>
|
|
</select>
|
|
<select id="page-size" class="page-size-select" onchange="changePageSize()">
|
|
<option value="20" selected>每页 20 条</option>
|
|
<option value="50">每页 50 条</option>
|
|
<option value="100">每页 100 条</option>
|
|
<option value="200">每页 200 条</option>
|
|
<option value="500">每页 500 条</option>
|
|
</select>
|
|
</div>
|
|
<div class="toolbar-right">
|
|
<button onclick="showAddModal()" class="btn btn-primary">
|
|
<i class="ri-add-line"></i> 添加文章
|
|
</button>
|
|
<button onclick="exportArticles()" class="btn btn-secondary">
|
|
<i class="ri-download-line"></i> 导出
|
|
</button>
|
|
<button onclick="refreshList()" class="btn btn-secondary">
|
|
<i class="ri-refresh-line"></i> 刷新
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 文章列表 -->
|
|
<div class="articles-section">
|
|
<div class="articles-header">
|
|
<label class="checkbox-wrapper">
|
|
<input type="checkbox" id="select-all" onchange="toggleSelectAll()">
|
|
<span>全选</span>
|
|
</label>
|
|
<div class="batch-actions" id="batch-actions" style="display: none;">
|
|
<span id="selected-count">已选 0 篇</span>
|
|
<button onclick="batchDelete()" class="btn btn-danger btn-sm">
|
|
<i class="ri-delete-bin-line"></i> 批量删除
|
|
</button>
|
|
</div>
|
|
<!-- 上部分页 -->
|
|
<div class="pagination-top" id="pagination-top">
|
|
<button onclick="prevPage()" class="btn btn-secondary btn-sm" id="prev-btn-top">上一页</button>
|
|
<span id="page-info-top">第 1 页</span>
|
|
<button onclick="nextPage()" class="btn btn-secondary btn-sm" id="next-btn-top">下一页</button>
|
|
</div>
|
|
</div>
|
|
<div class="articles-body">
|
|
<div id="articles-list" class="articles-list">
|
|
<div class="loading-text">加载中...</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 分页 -->
|
|
<div class="pagination" id="pagination">
|
|
<button onclick="prevPage()" class="btn btn-secondary btn-sm" id="prev-btn">上一页</button>
|
|
<span id="page-info">第 1 页</span>
|
|
<button onclick="nextPage()" class="btn btn-secondary btn-sm" id="next-btn">下一页</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 添加/编辑文章模态框 -->
|
|
<div id="article-modal" class="modal">
|
|
<div class="modal-content large">
|
|
<div class="modal-header">
|
|
<h3 id="modal-title"><i class="ri-file-add-line"></i> 添加文章</h3>
|
|
<button onclick="closeModal('article-modal')" class="close-btn">
|
|
<i class="ri-close-line"></i>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="article-form">
|
|
<input type="hidden" id="article-id">
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>产品名称 *（多个用逗号分隔）</label>
|
|
<input type="text" id="article-products" required placeholder="GPT-4o, Claude 3">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>分类</label>
|
|
<input type="text" id="article-category" placeholder="AI模型">
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>关键词（多个用逗号分隔）</label>
|
|
<input type="text" id="article-keywords" placeholder="大模型, 多模态">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>摘要总结 *</label>
|
|
<textarea id="article-summary" rows="3" required placeholder="文章简要总结..."></textarea>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>具体内容 *</label>
|
|
<textarea id="article-content" rows="12" required placeholder="文章详细内容..."></textarea>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>来源 *</label>
|
|
<input type="text" id="article-source" required placeholder="官方网站">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>URL</label>
|
|
<input type="url" id="article-url" placeholder="https://...">
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button onclick="closeModal('article-modal')" class="btn btn-secondary">取消</button>
|
|
<button onclick="saveArticle()" class="btn btn-primary">保存</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 文章详情模态框 -->
|
|
<div id="detail-modal" class="modal">
|
|
<div class="modal-content large">
|
|
<div class="modal-header">
|
|
<h3><i class="ri-file-text-line"></i> 文章详情</h3>
|
|
<button onclick="closeModal('detail-modal')" class="close-btn">
|
|
<i class="ri-close-line"></i>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body" id="detail-body">
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button onclick="closeModal('detail-modal')" class="btn btn-secondary">关闭</button>
|
|
<button onclick="editCurrentArticle()" class="btn btn-primary">
|
|
<i class="ri-edit-line"></i> 编辑
|
|
</button>
|
|
<button onclick="deleteCurrentArticle()" class="btn btn-danger">
|
|
<i class="ri-delete-bin-line"></i> 删除
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 提示消息 -->
|
|
<div id="toast" class="toast"></div>
|
|
|
|
<script src="/static/js/library.js"></script>
|
|
</body>
|
|
</html> |