update docs
This commit is contained in:
161
web-server/views/documents.ejs
Normal file
161
web-server/views/documents.ejs
Normal file
@@ -0,0 +1,161 @@
|
||||
<%- include('partials/page-start') %>
|
||||
|
||||
<section class="page">
|
||||
<div class="page-header">
|
||||
<div>
|
||||
<h1>Tài liệu</h1>
|
||||
<p>Lưu trữ và tra cứu tài liệu giới thiệu, hướng dẫn sử dụng, quy trình và tài liệu kỹ thuật.</p>
|
||||
</div>
|
||||
<div class="page-actions">
|
||||
<button class="btn btn-primary" type="button" data-modal-open="createDocumentModal">
|
||||
<span class="material-symbols-outlined">note_add</span>
|
||||
Thêm tài liệu
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-filters">
|
||||
<label class="filter-field">
|
||||
<span>Nhóm tài liệu</span>
|
||||
<select data-filter-select data-filter-column="category" data-filter-table="documentsTable">
|
||||
<option value="">Tất cả</option>
|
||||
<% documentCategories.forEach((category) => { %>
|
||||
<option value="<%= category.id %>"><%= category.label %></option>
|
||||
<% }) %>
|
||||
</select>
|
||||
</label>
|
||||
<label class="filter-field wide">
|
||||
<span>Tìm kiếm</span>
|
||||
<input type="search" placeholder="Tìm theo tiêu đề, mô tả, tác giả..." data-table-search="documentsTable">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<section class="table-panel">
|
||||
<div class="table-wrap">
|
||||
<table id="documentsTable" class="data-table documents-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Tài liệu</th>
|
||||
<th>Nhóm</th>
|
||||
<th>File đính kèm</th>
|
||||
<th>Cập nhật</th>
|
||||
<th>Người tạo</th>
|
||||
<th class="action-col">Thao tác</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% if (documents.length === 0) { %>
|
||||
<tr>
|
||||
<td colspan="6" class="table-empty">Chưa có tài liệu. Bấm Thêm tài liệu để tạo nội dung đầu tiên.</td>
|
||||
</tr>
|
||||
<% } %>
|
||||
<% documents.forEach((item) => { %>
|
||||
<tr
|
||||
data-search="<%= `${item.title} ${item.summary} ${item.createdBy} ${helpers.documentCategoryLabel(item.category)}`.toLowerCase() %>"
|
||||
data-category="<%= item.category %>"
|
||||
>
|
||||
<td class="document-title-cell">
|
||||
<a class="table-title" href="/documents/<%= item.id %>"><%= item.title %></a>
|
||||
<span class="table-subtitle"><%= item.summary || (item.hasContent ? 'Có nội dung đọc trực tiếp' : 'Tài liệu đính kèm') %></span>
|
||||
</td>
|
||||
<td><span class="badge badge-info"><%= helpers.documentCategoryLabel(item.category) %></span></td>
|
||||
<td>
|
||||
<% if (item.filePath) { %>
|
||||
<span class="document-file-name" title="<%= item.originalFileName %>"><%= item.originalFileName %></span>
|
||||
<span class="table-subtitle"><%= item.fileSize %></span>
|
||||
<% } else { %>
|
||||
<span class="table-subtitle">Không có file</span>
|
||||
<% } %>
|
||||
</td>
|
||||
<td><%= item.updatedAt %></td>
|
||||
<td><%= item.createdBy %></td>
|
||||
<td class="action-col">
|
||||
<div class="action-group">
|
||||
<a class="icon-button subtle" href="/documents/<%= item.id %>" title="Đọc tài liệu" aria-label="Đọc tài liệu <%= item.title %>">
|
||||
<span class="material-symbols-outlined">visibility</span>
|
||||
</a>
|
||||
<% if (item.filePath) { %>
|
||||
<a class="icon-button subtle" href="/documents/<%= item.id %>/file?download=1" title="Tải file" aria-label="Tải file <%= item.title %>">
|
||||
<span class="material-symbols-outlined">download</span>
|
||||
</a>
|
||||
<% } %>
|
||||
<form method="post" action="/documents/<%= item.id %>/delete" data-confirm-submit="Xóa tài liệu <%= item.title %> và file đính kèm?">
|
||||
<button class="icon-button danger" type="submit" title="Xóa tài liệu" aria-label="Xóa tài liệu <%= item.title %>">
|
||||
<span class="material-symbols-outlined">delete</span>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<% }) %>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="page-pager">
|
||||
<span>Hiển thị <%= documents.length %> tài liệu</span>
|
||||
<div>
|
||||
<button type="button" disabled>Trước</button>
|
||||
<span>Trang 1 / 1</span>
|
||||
<button type="button" disabled>Sau</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<div id="createDocumentModal" class="modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="createDocumentModalTitle">
|
||||
<div class="modal-content wide">
|
||||
<div class="modal-header">
|
||||
<div>
|
||||
<h3 id="createDocumentModalTitle">Thêm tài liệu</h3>
|
||||
<p>Nhập nội dung để đọc trực tiếp, đính kèm file, hoặc sử dụng cả hai.</p>
|
||||
</div>
|
||||
<button class="icon-button subtle" type="button" data-modal-close aria-label="Đóng">
|
||||
<span class="material-symbols-outlined">close</span>
|
||||
</button>
|
||||
</div>
|
||||
<form class="modal-form" method="post" action="/documents" enctype="multipart/form-data">
|
||||
<div class="form-stack">
|
||||
<div class="form-grid">
|
||||
<label class="form-field">
|
||||
<span>Tiêu đề</span>
|
||||
<input type="text" name="title" maxlength="200" required placeholder="Ví dụ: Hướng dẫn cài đặt Robot">
|
||||
</label>
|
||||
<label class="form-field">
|
||||
<span>Nhóm tài liệu</span>
|
||||
<select name="category" required>
|
||||
<% documentCategories.forEach((category) => { %>
|
||||
<option value="<%= category.id %>"><%= category.label %></option>
|
||||
<% }) %>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<label class="form-field">
|
||||
<span>Mô tả ngắn</span>
|
||||
<textarea name="summary" rows="3" maxlength="1000" placeholder="Nội dung chính và đối tượng sử dụng tài liệu này."></textarea>
|
||||
</label>
|
||||
<label class="form-field">
|
||||
<span>Nội dung đọc trực tiếp</span>
|
||||
<textarea name="content" rows="8" maxlength="500000" placeholder="Nhập nội dung hướng dẫn tại đây. Xuống dòng và khoảng trắng sẽ được giữ nguyên khi hiển thị."></textarea>
|
||||
</label>
|
||||
<label class="form-field">
|
||||
<span>File đính kèm</span>
|
||||
<input
|
||||
type="file"
|
||||
name="documentFile"
|
||||
accept=".pdf,.doc,.docx,.odt,.rtf,.txt,.md,.png,.jpg,.jpeg,.webp,.ppt,.pptx,.xls,.xlsx"
|
||||
>
|
||||
<small>Hỗ trợ PDF, Word, OpenDocument, text/Markdown, ảnh, PowerPoint và Excel; tối đa 50 MB mặc định.</small>
|
||||
</label>
|
||||
</div>
|
||||
<div class="modal-actions">
|
||||
<button class="btn btn-secondary" type="button" data-modal-close>Hủy</button>
|
||||
<button class="btn btn-primary" type="submit">
|
||||
<span class="material-symbols-outlined">save</span>
|
||||
Lưu tài liệu
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<%- include('partials/page-end') %>
|
||||
Reference in New Issue
Block a user