86 lines
3.3 KiB
Smarty
86 lines
3.3 KiB
Smarty
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>临时文件上传 · TTL 24h</title>
|
|
<link rel="stylesheet" href="/static/app.css" />
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>临时文件传输<span class="badge">TTL 24h</span></h1>
|
|
<div class="subtitle">上传后 24 小时内有效 · 被下载会自动续期 · 自动清理</div>
|
|
</header>
|
|
|
|
<div class="card">
|
|
<div class="dropzone" id="dropzone" tabindex="0" role="button" aria-label="选择或拖拽文件上传">
|
|
<div class="icon">⬆</div>
|
|
<div><strong>点击选择文件</strong> 或将文件拖拽到此处</div>
|
|
<div class="hint">支持多文件 · 受配额限制</div>
|
|
</div>
|
|
<input type="file" id="fileInput" multiple hidden />
|
|
|
|
<div class="progress-list" id="progressList"></div>
|
|
|
|
<div class="btn-row" id="actionRow" style="display:none">
|
|
<div class="total-progress" id="totalProgress" style="display:none"><div></div></div>
|
|
<span class="total-label" id="totalLabel" style="display:none"></span>
|
|
<button class="btn" id="uploadBtn">开始上传</button>
|
|
<button class="btn ghost" id="clearBtn">清空</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div class="files-header">
|
|
<h2>文件列表</h2>
|
|
<div class="files-header-right">
|
|
<label class="check-all-wrap" id="checkAllWrap" style="display:none">
|
|
<input type="checkbox" id="checkAll" />
|
|
<span>全选</span>
|
|
</label>
|
|
<span class="meta" id="filesMeta">加载中...</span>
|
|
<button class="btn ghost batch-btn" id="batchBtn" style="display:none">批量下载 (<span id="batchCount">0</span>)</button>
|
|
<button class="btn ghost batch-btn danger" id="batchDeleteBtn" style="display:none">批量删除 (<span id="batchDeleteCount">0</span>)</button>
|
|
</div>
|
|
</div>
|
|
<div class="quota-wrap" id="quotaWrap" style="display:none">
|
|
<div class="quota-row">
|
|
<span class="quota-text" id="quotaText">--</span>
|
|
<span id="quotaPercent">--</span>
|
|
</div>
|
|
<div class="quota-bar" id="quotaBar"><div></div></div>
|
|
</div>
|
|
<div id="filesList">
|
|
<div class="skeleton"></div>
|
|
<div class="skeleton"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer>每个文件 TTL 默认 24 小时, 后台每小时扫描清理 · 每次下载会重置过期时间</footer>
|
|
</div>
|
|
|
|
<div class="toast" id="toast"></div>
|
|
|
|
<!-- 文件预览弹窗 (CDN 资源经后端 /file-viewer/*filepath 缓存代理, 避免运行时 unpkg 依赖) -->
|
|
<div class="preview-modal" id="previewModal" hidden>
|
|
<div class="preview-backdrop" id="previewBackdrop"></div>
|
|
<div class="preview-panel">
|
|
<div class="preview-header">
|
|
<span class="preview-title" id="previewTitle"></span>
|
|
<div class="preview-actions">
|
|
<a class="icon-btn" id="previewDownload" title="下载" download>↓</a>
|
|
<button class="icon-btn" id="previewClose" title="关闭" aria-label="关闭预览">✕</button>
|
|
</div>
|
|
</div>
|
|
<div class="preview-body" id="previewBody"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/file-viewer/dist/flyfish-file-viewer-web-full.iife.js"></script>
|
|
<script src="/static/app.js"></script>
|
|
<script src="/static/helpers.js"></script>
|
|
<script src="/static/batch.js"></script>
|
|
</body>
|
|
</html>
|