487 lines
19 KiB
JavaScript
Executable File
487 lines
19 KiB
JavaScript
Executable File
let insUp;
|
||
let CurrentTools = {
|
||
getInsUp: function () {
|
||
return insUp;
|
||
},
|
||
setInsUp: function (ins) {
|
||
insUp = ins;
|
||
}
|
||
}
|
||
layui.use(['jquery', 'laytpl', 'table', 'miniTab', 'upload', 'layer'], function () {
|
||
let $ = layui.jquery,
|
||
table = layui.table,
|
||
layer = layui.layer,
|
||
upload = layui.upload,
|
||
miniTab = layui.miniTab;
|
||
|
||
miniTab.listen();
|
||
|
||
/**** index begin ***/
|
||
//index页面
|
||
if ($('.location-index-page').length > 0) {
|
||
// 渲染表格
|
||
let listUrl = $('#table-container').data('url');
|
||
let insTb = table.render({
|
||
elem: '#table-container',
|
||
toolbar: '#toolbar-tpl',
|
||
defaultToolbar: [],
|
||
url: listUrl,
|
||
skin: 'line',
|
||
method: 'post',
|
||
request: {
|
||
pageName: 'page',
|
||
limitName: 'size',
|
||
},
|
||
parseData: function (res) {
|
||
return {
|
||
"code": res.code, //解析接口状态
|
||
"msg": res.msg, //解析提示文本
|
||
"count": res.data.total, //解析数据长度
|
||
"path": res.data.path, //解析路径
|
||
"data": res.data.list //解析数据列表
|
||
};
|
||
},
|
||
cols: [[
|
||
{type: 'checkbox'},
|
||
{templet: '#row-type', width: 100, title: '类型'},
|
||
{templet: '#row-src', minWidth:150, title: '轮播图', style: 'height: 60px;'},
|
||
{field: 'name', minWidth: 250, title: '名称', edit: 'text'},
|
||
{templet: '#row-size', width: 150, title: '大小'},
|
||
{templet: '#row-operate', minWidth: 200, fixed: 'right', align: 'center', title: '操作'}
|
||
]],
|
||
done: function (res) {
|
||
layer.closeAll('loading');
|
||
Tools.setInsTb(insTb);
|
||
if (res.code === 0) {
|
||
$('.dir-path').html(res.path);
|
||
|
||
let folder = $('.add-folder');
|
||
let href = folder.data('href') + '?path=' + res.path;
|
||
folder.data('href', href);
|
||
}
|
||
}
|
||
});
|
||
|
||
initUpload();
|
||
|
||
//监听行工具条
|
||
table.on('tool(table-container-image)', function (obj) {
|
||
let data = obj.data;
|
||
let layEvent = obj.event;
|
||
let that = $($(this).context);
|
||
let url = $($(this).context).data('href');
|
||
let title = $($(this).context).data('title');
|
||
switch (layEvent) {
|
||
// 行 进入目录
|
||
case 'enter':
|
||
$('#upload-path').val(data.path + data.name);//目录变更时 一定要更新此数据
|
||
CurrentTools.getInsUp().reload({
|
||
data: {path: $('#upload-path').val()}
|
||
});
|
||
//执行重载
|
||
table.reload('table-container', {
|
||
where: {
|
||
path: data.path + data.name
|
||
}
|
||
});
|
||
return false;
|
||
// 行 打开文件
|
||
case 'show':
|
||
let content = data.src;
|
||
let oss = $('#oss-url').data('url');
|
||
content = data.is_oss ? oss + content : content;
|
||
// console.log(content);
|
||
if (data.type === 'video' || data.type === 'image') {
|
||
layer.open({
|
||
type: 2,
|
||
title: false,
|
||
area: ['50%', '50%'],
|
||
shade: 0.8,
|
||
closeBtn: 0,
|
||
shadeClose: true,
|
||
content: [content]
|
||
});
|
||
}
|
||
return false;
|
||
// 行 统计文件夹大小
|
||
case 'count':
|
||
//执行重载
|
||
let idx = layer.load(2)
|
||
let type = $($(this).context).data('type');
|
||
|
||
$.post(url, {path: data.path + data.name, type: type.split(',')}, function (res) {
|
||
layer.close(idx)
|
||
if (res.code === 0) {
|
||
that.parent().html(res.data)
|
||
}
|
||
})
|
||
return false;
|
||
// 行 选择
|
||
case 'select':
|
||
selectOne(data);
|
||
return false;
|
||
//其他 默认为打开弹出层
|
||
default:
|
||
openLayer(url, title);
|
||
return false;
|
||
}
|
||
});
|
||
|
||
//监听工具条 注意区别toolbar和tool toolbar是表头上的工具条 tool是行中的工具条
|
||
table.on('toolbar(table-container-image)', function (obj) {
|
||
let layEvent = obj.event;
|
||
let insTb = Tools.getInsTb();
|
||
let url = $($(this).context).data('href')
|
||
let title = $($(this).context).data('title')
|
||
let width = $($(this).context).data('width') ? $($(this).context).data('width') : '100%';
|
||
let height = $($(this).context).data('height') ? $($(this).context).data('height') : '100%';
|
||
|
||
switch (layEvent) {
|
||
// toolbar 删除
|
||
case 'del':
|
||
let checkStatus = table.checkStatus('table-container');
|
||
if (checkStatus.data.length <= 0) {
|
||
layer.msg('请先选择数据');
|
||
return false;
|
||
}
|
||
let selected = checkStatus.data;
|
||
let ids = [];
|
||
|
||
$.each(selected, function (index, val) {
|
||
ids.push(val.id);
|
||
})
|
||
delRow(url, ids, insTb);
|
||
return false;
|
||
// toolbar 刷新
|
||
case 'refresh':
|
||
refreshTab(insTb);
|
||
return false;
|
||
// toolbar 上传
|
||
case 'upload':
|
||
$('#upload-btn-div').trigger('click');
|
||
return false;
|
||
// toolbar 搜索
|
||
case 'search':
|
||
let search = $('.table-search-fieldset');
|
||
if (search.hasClass('div-show')) {
|
||
search.css('display', 'none').removeClass('div-show');
|
||
} else {
|
||
search.css('display', 'block').addClass('div-show');
|
||
}
|
||
return false;
|
||
case 'multiple':
|
||
batchSelect();
|
||
return false;
|
||
// 其他 默认为打开弹出层
|
||
default:
|
||
openLayer(url, title, width, height);
|
||
return false;
|
||
}
|
||
});
|
||
|
||
// 返回上级
|
||
$('.back-to-previous').on('click', function () {
|
||
let path = $('.dir-path').text();
|
||
path = path.replace(/(^\/)|(\/$)/g, '');//去除首尾/
|
||
let arr = path.split('/');
|
||
if (arr.length > 1) {
|
||
arr.pop();
|
||
}
|
||
|
||
path = '/' + arr.join('/') + '/';
|
||
$('#upload-path').val(path);//目录变更时 一定要更新此数据
|
||
table.reload('table-container', {
|
||
where: {
|
||
path: path
|
||
}
|
||
});
|
||
})
|
||
}
|
||
/*** index end ***/
|
||
|
||
//file页面
|
||
if ($('.location-file-page').length > 0) {
|
||
// 渲染表格
|
||
let listUrl = $('#table-container').data('url');
|
||
let insTb = table.render({
|
||
elem: '#table-container',
|
||
toolbar: '#toolbar-tpl',
|
||
defaultToolbar: [{ //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
|
||
title: '搜索'
|
||
, layEvent: 'search'
|
||
, icon: 'layui-icon-search'
|
||
}],
|
||
url: listUrl,
|
||
skin: 'line',
|
||
page: true,
|
||
method: 'post',
|
||
request: {
|
||
pageName: 'page',
|
||
limitName: 'size',
|
||
},
|
||
parseData: function (res) {
|
||
return {
|
||
"code": res.code, //解析接口状态
|
||
"msg": res.msg, //解析提示文本
|
||
"count": res.data.total, //解析数据长度
|
||
"path": res.data.path, //解析路径
|
||
"data": res.data.list //解析数据列表
|
||
};
|
||
},
|
||
cols: [[
|
||
{type: 'checkbox'},
|
||
{templet: '#row-type', width: 100, title: '类型'},
|
||
{templet: '#row-cover', title: '封面', style: 'height: 60px;'},
|
||
{field: 'name', title: '名称', edit: 'text'},
|
||
{field: 'size_text', title: '大小'},
|
||
{field: 'path', align: 'left',title: '路径'},
|
||
// {templet: '#row-oss', width: 150, title: '是否OSS'},
|
||
// {templet: '#row-local', width: 150, title: '文件失效'},
|
||
// {field: 'updated_at', width: 180, title: '最近操作时间'},
|
||
{templet: '#row-operate', minWidth: 150, align: 'center', title: '操作'}
|
||
]],
|
||
done: function (res) {
|
||
Tools.setInsTb(insTb);
|
||
}
|
||
});
|
||
|
||
//监听行工具条
|
||
table.on('tool(table-container-filter)', function (obj) {
|
||
let data = obj.data;
|
||
let layEvent = obj.event;
|
||
let url = $($(this).context).data('href');
|
||
let title = $($(this).context).data('title');
|
||
let width = $($(this).context).data('width') ? $($(this).context).data('width') : '100%';
|
||
let height = $($(this).context).data('height') ? $($(this).context).data('height') : '100%';
|
||
let insTb = Tools.getInsTb();
|
||
|
||
switch (layEvent) {
|
||
// 行 删除
|
||
case 'del':
|
||
let ids = [data.id];
|
||
delRow(url, ids, insTb);
|
||
return false;
|
||
// 行 选择
|
||
case 'select':
|
||
selectOne(data);
|
||
return false;
|
||
//其他 默认为打开弹出层
|
||
default:
|
||
openLayer(url, title, width, height);
|
||
return false;
|
||
}
|
||
});
|
||
|
||
//监听工具条 注意区别toolbar和tool toolbar是表头上的工具条 tool是行中的工具条
|
||
table.on('toolbar(table-container-filter)', function (obj) {
|
||
let layEvent = obj.event;
|
||
let insTb = Tools.getInsTb();
|
||
let url = $($(this).context).data('href')
|
||
let title = $($(this).context).data('title')
|
||
let width = $($(this).context).data('width') ? $($(this).context).data('width') : '100%';
|
||
let height = $($(this).context).data('height') ? $($(this).context).data('height') : '100%';
|
||
|
||
switch (layEvent) {
|
||
// toolbar 删除
|
||
case 'del':
|
||
let checkStatus = table.checkStatus('table-container');
|
||
let selected = checkStatus.data;
|
||
if (checkStatus.data.length <= 0) {
|
||
layer.msg('请先选择数据');
|
||
return false;
|
||
}
|
||
let ids = [];
|
||
|
||
$.each(selected, function (index, val) {
|
||
ids.push(val.id);
|
||
})
|
||
delRow(url, ids, insTb);
|
||
return false;
|
||
// toolbar 刷新
|
||
case 'refresh':
|
||
refreshTab(insTb);
|
||
return false;
|
||
// toolbar 上传
|
||
case 'upload':
|
||
$('.upload-btn').trigger('click');
|
||
return false;
|
||
// 本地文件一键上传到OSS
|
||
case 'oss':
|
||
let idx = layer.load(2);
|
||
$.post('/manager/attachment/to-oss', function (res) {
|
||
layer.close(idx);
|
||
if (res.code === 0) {
|
||
layer.alert('操作成功！总共' + res.data.total + '条 ' + res.data.none + '条不存在 已完成' + res.data.done + '条', {icon: 6});
|
||
} else {
|
||
layer.msg(res.msg);
|
||
}
|
||
})
|
||
return false;
|
||
// 多选择
|
||
case 'multiple':
|
||
batchSelect();
|
||
return false;
|
||
// 一键删除失效文件
|
||
case 'lost':
|
||
let lostIdx = layer.load(2);
|
||
$.post('/manager/attachment/del-lost-file', function (res) {
|
||
layer.close(lostIdx);
|
||
if (res.code === 0) {
|
||
layer.alert('操作成功！删除成功' + res.data.total + '条记录', {icon: 6});
|
||
} else {
|
||
layer.msg(res.msg);
|
||
}
|
||
})
|
||
return false;
|
||
// toolbar 搜索
|
||
case 'search':
|
||
let search = $('.table-search-fieldset');
|
||
if (search.hasClass('div-show')) {
|
||
search.css('display', 'none').removeClass('div-show');
|
||
} else {
|
||
search.css('display', 'block').addClass('div-show');
|
||
}
|
||
return false;
|
||
// 其他 默认为打开弹出层
|
||
default:
|
||
openLayer(url, title, width, height);
|
||
return false;
|
||
}
|
||
});
|
||
}
|
||
});
|
||
|
||
function selectOne(data) {
|
||
layui.use(['jquery'], function () {
|
||
let $ = layui.jquery;
|
||
|
||
let index = parent.layer.getFrameIndex(window.name); //获取窗口索引
|
||
let multiple = parent.layui.$(".choose-open").data('multiple'); //是否多选
|
||
// 获取选中
|
||
let inputValue = '';
|
||
// 是否追加
|
||
if (multiple) {
|
||
inputValue = parent.layui.$(".choose-open").parents('.upload-file-div').find('.upload-file-value').val()+',';
|
||
}
|
||
inputValue += data.src;
|
||
|
||
//去除首尾逗号
|
||
inputValue = inputValue.replace(/(^\,*)|(\,*$)/g, "");
|
||
parent.layui.$(".choose-open").parents('.upload-file-div').find('.upload-file-value').val(inputValue);
|
||
parent.initPreviewList();
|
||
parent.layer.close(index);
|
||
})
|
||
}
|
||
|
||
function batchSelect() {
|
||
layui.use(['jquery', 'table'], function () {
|
||
let $ = layui.jquery, table = layui.table;
|
||
|
||
let checkStatus = table.checkStatus('table-container');
|
||
let selected = checkStatus.data;
|
||
let index = parent.layer.getFrameIndex(window.name); //获取窗口索引
|
||
let multiple = parent.layui.$(".choose-open").data('multiple'); //是否多选
|
||
// 获取选中
|
||
if (selected.length <= 0) {
|
||
layer.msg('请先选择数据');
|
||
return false;
|
||
}
|
||
|
||
if (!multiple && selected.length > 1) {
|
||
layer.msg('选择记录过多');
|
||
return false;
|
||
}
|
||
|
||
let inputValue = '';
|
||
|
||
if (multiple) {
|
||
inputValue = parent.layui.$(".choose-open").parents('.upload-file-div').find('.upload-file-value').val();
|
||
}
|
||
|
||
let hasDir = false;
|
||
$.each(selected, function (index, item) {
|
||
if (item.type === 'dir') {
|
||
hasDir = true;
|
||
}
|
||
inputValue += ','+item.src;
|
||
})
|
||
if (hasDir) {
|
||
layer.msg('不能选择文件夹');
|
||
return false;
|
||
}
|
||
|
||
// 去除首尾,
|
||
inputValue = inputValue.replace(/(^\,*)|(\,*$)/g, "");
|
||
|
||
parent.layui.$(".choose-open").parents('.upload-file-div').find('.upload-file-value').val(inputValue);
|
||
parent.initPreviewList();
|
||
parent.layer.close(index);
|
||
})
|
||
}
|
||
|
||
function initUpload() {
|
||
layui.use(['jquery', 'upload', 'layer'], function () {
|
||
let $ = layui.jquery, upload = layui.upload, layer = layui.layer;
|
||
let that = $('#upload-btn-div');
|
||
let url = that.data('url') ? that.data('url') : '/manager/upload/image';
|
||
let field = that.data('field') ? that.data('field') : 'image_image';
|
||
let multiple = that.data('multiple') ? that.data('multiple') : false;
|
||
let accept = that.data('accept') ? that.data('accept') : 'images'; //images（图片）、file（所有文件）、video（视频）、audio（音频）
|
||
let acceptMime = that.data('mimetype') ? that.data('mimetype') : 'images/*';
|
||
let exts = that.data('exts') ? that.data('exts') : 'jpg|png|gif|bmp|jpeg';
|
||
let maxSize = that.data('size') ? that.data('size') : 50 * 1204; //KB
|
||
let size = maxSize; //size KB
|
||
let number = that.data('number') ? that.data('number') : 0;
|
||
let path = that.data('path')? that.data('path') : '';
|
||
let up = upload.render({
|
||
elem: '#upload-btn-div'
|
||
, url: url
|
||
, auto: true
|
||
, field: field
|
||
, accept: accept
|
||
, acceptMime: acceptMime
|
||
, exts: exts
|
||
, size: size
|
||
, number: number
|
||
, multiple: multiple
|
||
, data: {
|
||
path: path.length > 0 ? path : $('#upload-path').val() //指定上传目录 基于public下 为空则默认
|
||
}
|
||
, before: function (obj) {
|
||
layer.load(2);
|
||
}
|
||
, done: function (res, index, upload) { //每个文件提交一次触发一次。详见“请求成功的回调”
|
||
layer.closeAll('loading'); //关闭loading
|
||
let item = this.item;
|
||
let div = item.parents('.upload-file-div');
|
||
let existsNotice = item.data('notice-exists');//已存在文件是否提示 默认不提示
|
||
let callback = item.data('callback');//上传成功执行函数
|
||
if (callback) {
|
||
eval(callback);
|
||
}
|
||
|
||
// 200=已存在文件 0=新上传成功
|
||
if (res.code === 0 || res.code === 200) {
|
||
let inputValue = '';
|
||
// 如果是多文件上传 则追加 否则 替换
|
||
if (multiple) {
|
||
inputValue = $(div).find('.upload-file-value').val();
|
||
if (inputValue.length > 0) {
|
||
inputValue += ',';
|
||
}
|
||
}
|
||
inputValue += res.data.src;
|
||
|
||
$(div).find('.upload-file-value').val(inputValue);
|
||
initPreviewList();
|
||
if (existsNotice && res.code === 200) {
|
||
layer.alert(res.msg);
|
||
}
|
||
} else {
|
||
layer.msg(res.msg);
|
||
}
|
||
}
|
||
});
|
||
CurrentTools.setInsUp(up);
|
||
})
|
||
} |