176 lines
8.4 KiB
HTML
176 lines
8.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
|
|
<meta name="apple-touch-fullscreen" content="yes"/>
|
|
<meta name="format-detection" content="email=no" />
|
|
<meta name="wap-font-scale" content="no" />
|
|
<meta name="viewport" content="user-scalable=no, width=device-width" />
|
|
<meta content="telephone=no" name="format-detection" />
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<title>文件列表</title>
|
|
|
|
<link th:href="@{/axui-v2.1.1/css/ax.css}" rel="stylesheet" type="text/css" >
|
|
<link th:href="@{/axui-v2.1.1/css/ax-response.css}" rel="stylesheet" type="text/css" >
|
|
</head>
|
|
<body>
|
|
<header class="ax-header">
|
|
<div class="ax-row">
|
|
<div class="ax-col">
|
|
<a th:href="@{/download/index}" class="ax-logo">
|
|
<img th:src="@{/common/images/logo.png}" alt="File Management"/>
|
|
</a>
|
|
</div>
|
|
<div class="ax-nav">
|
|
<div class="ax-search">
|
|
<form name="search">
|
|
<label for="keyboard"></label>
|
|
<input name="keyboard" id="keyboard" placeholder="关键字..." th:value="${keyboard}" type="text">
|
|
<a href="javascript:void(0);" id="search" class="ax-iconfont ax-icon-search"></a>
|
|
</form>
|
|
</div>
|
|
<div class="ax-item ax-selected">
|
|
<a th:href="@{/download/index}" class="ax-text">文件列表</a>
|
|
<span class="ax-line"></span>
|
|
</div>
|
|
<div class="ax-item">
|
|
<a th:href="@{/upload/index}" class="ax-text">文件上传</a>
|
|
<span class="ax-line"></span>
|
|
</div>
|
|
<div class="ax-item">
|
|
<a th:href="@{/logging/index}" class="ax-text">在线日志</a>
|
|
<span class="ax-line"></span>
|
|
</div>
|
|
<div class="ax-item">
|
|
<a th:href="@{/system/index}" class="ax-text">系统设置</a>
|
|
<span class="ax-line"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<div class="ax-space-header"></div>
|
|
<div class="ax-border ax-margin ax-radius-md" axCheckAll="checkDom:'#checkBtn',clearDom:'#clearBtn'">
|
|
<div th:if="${#lists.isEmpty(files)} eq false" th:each="file,fileStat:${files}">
|
|
<label class="ax-checkbox ax-bulletin">
|
|
<input name="apple" th:value="${file.filename}" type="checkbox">
|
|
<i class="ax-iconfont ax-icon-file" legend></i>
|
|
<span class="ax-bulletin-body">
|
|
<i caption><span th:text="${file.filename}"></span></i>
|
|
</span>
|
|
<i count class="ax-margin-right">
|
|
<span th:text="${file.filetime}"></span>
|
|
</i>
|
|
<i count class="ax-margin-right">
|
|
<span th:text="${file.filesize}"></span>MB
|
|
</i>
|
|
<a href="javascript:void(0);" onclick="fileDel(this);"
|
|
th:value="${file.filepath}" class="ax-btn ax-sm ax-margin-right">
|
|
<span class="ax-iconfont ax-icon-trash-alt"></span>删除
|
|
</a>
|
|
<a href="javascript:void(0);" onclick="fileDown(this);"
|
|
th:name="${file.filename}" th:value="${file.filepath}" class="ax-btn ax-sm">
|
|
<span class="ax-iconfont ax-icon-arrow-down-o"></span>下载
|
|
</a>
|
|
</label>
|
|
<hr class="ax-margin-lr"/>
|
|
</div>
|
|
<div th:if="${#lists.isEmpty(files)} eq true">
|
|
<div class="ax-empty">
|
|
<div class="ax-icon"><span class="ax-iconfont ax-icon-empty"></span></div>
|
|
<div class="ax-title">暂无文件,请去上传!</div>
|
|
</div>
|
|
</div>
|
|
<div class="ax-break"></div>
|
|
<a href="###" class="ax-btn ax-margin-left" id="checkBtn">全选</a>
|
|
<a href="###" class="ax-btn" id="clearBtn">取消全选</a>
|
|
<a href="###" class="ax-btn" id="zipDownBtn">打包下载</a>
|
|
<a href="###" class="ax-btn" id="batchDelBtn">批量删除</a>
|
|
<div class="ax-break"></div>
|
|
</div>
|
|
<script th:src="@{/axui-v2.1.1/js/ax.js}" type="text/javascript" charset="utf-8"></script>
|
|
<script th:src="@{/common/js/basic.js}" type="text/javascript" charset="utf-8"></script>
|
|
<script type="text/javascript" th:inline="javascript" charset="utf-8">
|
|
const fileDel = (obj) => {
|
|
const path = obj.getAttribute("value");
|
|
const options = {
|
|
url: Fmt.ctx() + '/download/delete',
|
|
data: {path: path},
|
|
method: 'post'
|
|
};
|
|
Fmt.axios(options).then((result) => {
|
|
window.location.href = Fmt.ctx() + '/download/index';
|
|
}).catch((err) => {
|
|
new axMessage({content: err, result: 'error', iconShow: true}).show();
|
|
});
|
|
}
|
|
|
|
const fileDown = (obj) => {
|
|
const path = obj.getAttribute("value");
|
|
window.open(Fmt.ctx() + '/download/file?path=' + encodeURIComponent(path) + '&temp=' + false);
|
|
};
|
|
|
|
window.onload = () => {
|
|
document.getElementById("search").onclick = () => {
|
|
const keyboard = document.getElementById("keyboard").value;
|
|
window.location.href = Fmt.ctx() + '/download/index?keyboard=' + keyboard;
|
|
}
|
|
|
|
document.getElementById("zipDownBtn").onclick = () => {
|
|
const list = document.getElementsByName("apple");
|
|
const filenames = [];
|
|
for (let key in list) {
|
|
if(list[key].checked){
|
|
const filename = list[key].getAttribute("value");
|
|
filenames.push(filename);
|
|
}
|
|
}
|
|
if(filenames.length === 0){
|
|
new axMessage({content: '请选择要下载的文件',result: 'warning',iconShow: true}).show();
|
|
return false;
|
|
}
|
|
let message = new axMessage({content: '',result: 'success',iconShow: true});
|
|
message.update({content: '正在根据所选文件创建压缩包......', result: 'success'}).show();
|
|
const options = {
|
|
url: Fmt.ctx() + '/download/packZip',
|
|
data: {filenames: filenames.join(",")},
|
|
method: 'post'
|
|
};
|
|
Fmt.axios(options).then((result) => {
|
|
message.update({content: '压缩包' + result.filename + "创建完成,准备下载文件......", result: 'success'}).show();
|
|
window.open(Fmt.ctx() + '/download/file?path=' + encodeURIComponent(result.path) + '&temp=' + true);
|
|
}).catch((err) => {
|
|
console.log(err);
|
|
new axMessage({content: err, result: 'error', iconShow: true}).show();
|
|
});
|
|
}
|
|
|
|
document.getElementById("batchDelBtn").onclick = () => {
|
|
const list = document.getElementsByName("apple");
|
|
const filenames = [];
|
|
for (let key in list) {
|
|
if(list[key].checked){
|
|
const filename = list[key].getAttribute("value");
|
|
filenames.push(filename);
|
|
}
|
|
}
|
|
if(filenames.length === 0){
|
|
new axMessage({content: '请选择要删除的文件',result: 'warning',iconShow: true}).show();
|
|
return false;
|
|
}
|
|
const options = {
|
|
url: Fmt.ctx() + '/download/batchDel',
|
|
data: {filenames: filenames.join(",")},
|
|
method: 'post'
|
|
};
|
|
Fmt.axios(options).then((result) => {
|
|
window.location.href = Fmt.ctx() + '/download/index';
|
|
}).catch((err) => {
|
|
new axMessage({content: err, result: 'error', iconShow: true}).show();
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |