mirror of
https://gitee.com/lakernote/easy-admin.git
synced 2026-09-03 05:33:47 +08:00
161 lines
5.3 KiB
HTML
161 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title></title>
|
||
<link href="../../component/pear/css/pear.css" rel="stylesheet"/>
|
||
</head>
|
||
<body class="pear-container">
|
||
<div class="layui-card">
|
||
<div class="layui-card-body">
|
||
<form class="layui-form" action="">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">关键字</label>
|
||
<div class="layui-input-inline">
|
||
<input type="text" name="keyWord" placeholder="文件名称" class="layui-input">
|
||
</div>
|
||
<button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="query">
|
||
<i class="layui-icon layui-icon-search"></i>
|
||
查询
|
||
</button>
|
||
<button type="reset" class="pear-btn pear-btn-md">
|
||
<i class="layui-icon layui-icon-refresh"></i>
|
||
重置
|
||
</button>
|
||
</div>
|
||
</form>
|
||
|
||
<button type="button" class="layui-btn" id="upload1"><i class="layui-icon"></i>上传文件</button>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="layui-card">
|
||
<div class="layui-card-body">
|
||
<table id="table" lay-filter="table-filter"></table>
|
||
</div>
|
||
</div>
|
||
|
||
</body>
|
||
|
||
<script type="text/html" id="record-toolbar">
|
||
<button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove">
|
||
<i class="layui-icon layui-icon-delete"></i>
|
||
</button>
|
||
</script>
|
||
|
||
<script type="text/html" id="table-toolbar">
|
||
<button class="pear-btn pear-btn-danger pear-btn-md" lay-event="batchRemove">
|
||
<i class="layui-icon layui-icon-delete"></i>
|
||
删除
|
||
</button>
|
||
|
||
</script>
|
||
|
||
<script src="../../component/layui/layui.js"></script>
|
||
<script src="../../component/pear/pear.js"></script>
|
||
<script>
|
||
layui.use(['easyAdmin', 'upload'], function () {
|
||
let easyAdmin = layui.easyAdmin;
|
||
let upload = layui.upload;
|
||
let cols = [
|
||
[{
|
||
type: 'checkbox'
|
||
}, {
|
||
title: '文件名称',
|
||
field: 'fileName',
|
||
align: 'left',
|
||
width: 300
|
||
},
|
||
{
|
||
title: '文件路径',
|
||
field: 'filePath',
|
||
align: 'left'
|
||
}, {
|
||
field: 'url',
|
||
title: '照片缩略图',
|
||
width: 100,
|
||
align: 'center',
|
||
templet: function (d) {
|
||
//return "<img src='"+datum.formatUrl(d.url)+"' style='height:50px;'";
|
||
var url = d.filePath;
|
||
return '<a href="' + url + '" target="_blank " title="点击查看">' +
|
||
'<img src="' + url + '" style="height:20px;" />' +
|
||
'</a>';
|
||
}
|
||
},
|
||
{
|
||
title: '创建人',
|
||
field: 'nickName',
|
||
align: 'left', width: 100
|
||
},
|
||
|
||
|
||
{
|
||
title: '创建时间',
|
||
field: 'createTime',
|
||
align: 'left', width: 180
|
||
},
|
||
{
|
||
title: '操作',
|
||
toolbar: '#record-toolbar',
|
||
align: 'left', width: 180
|
||
}
|
||
]
|
||
]
|
||
;
|
||
|
||
|
||
let module = "file";
|
||
let uri = "/sys/" + module;
|
||
easyAdmin.tableRender({
|
||
url: uri,
|
||
cols: cols
|
||
});
|
||
|
||
easyAdmin.TableTool(uri, module);
|
||
easyAdmin.TableToolBar(uri, module);
|
||
easyAdmin.FormQuery();
|
||
// 配置服务端地址
|
||
const adminServerUrl = layui.data('easyAdmin').serverUrl;
|
||
const user = layui.data('user');
|
||
// 用于判断未登录跳转到登录页
|
||
if (JSON.stringify(user) === "{}") {
|
||
console.log("当前浏览器存储中没有用户信息，讲跳转到login.html")
|
||
location.href = "login.html";
|
||
}
|
||
const tokenName = user.token.name;
|
||
const tokenValue = user.token.value;
|
||
//指定允许上传的文件类型
|
||
const headers = {};
|
||
headers[tokenName] = tokenValue;
|
||
upload.render({
|
||
elem: '#upload1'
|
||
, url: adminServerUrl + uri + '/upload' //此处配置你自己的上传接口即可
|
||
, accept: 'images' //图片类型
|
||
, acceptMime: 'image/jpeg, image/png'
|
||
, exts: 'jpg|png|jpeg' // 限制后缀
|
||
, data: {
|
||
id: 1,
|
||
name: 'laker'
|
||
},
|
||
// headers: {token: 'sasasas'}
|
||
headers: headers
|
||
, done: function (result) {
|
||
// layer.msg('上传成功');
|
||
easyAdmin.TableRefresh();
|
||
if (!result.success) {
|
||
layer.msg(result.msg, {
|
||
icon: 2,
|
||
time: 1000,
|
||
area: ['260px', '65px']
|
||
});
|
||
}
|
||
}, error: function () {
|
||
//请求异常回调
|
||
layer.msg('上传失败');
|
||
}
|
||
});
|
||
})
|
||
</script>
|
||
</html>
|