ulthon/ulthon_admin
1
0
Fork 0
mirror of https://gitee.com/ulthon/ulthon_admin.git synced 2026-07-01 15:32:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(upload): 为上传组件添加文件名显示和拖拽排序功能

Browse Source
This commit is contained in:
augushong
2026-01-09 22:35:05 +08:00
parent 23826cd06e
commit ea7ae41e71
1 changed files with 37 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
public/static/plugs/ulthon-admin/ulthon-admin.js
View File

@@ -2545,7 +2545,7 @@
}
return dataField;
},
upload: function () {
upload: function () {
var uploadList = document.querySelectorAll("[data-upload]");
var uploadSelectList = document.querySelectorAll("[data-upload-select]");
@@ -2624,26 +2624,60 @@
if (urlString.length > 0) {
var parant = $(this).parent('div');
var liHtml = '';
var filenameArray = [];
if (uploadFilenameField) {
var filenameVal = $(elemFilenameField).val() || '';
if (filenameVal) {
filenameArray = filenameVal.split(uploadSign);
}
}
$.each(urlArray, function (i, v) {
// 获取链接扩展名
var ext = v.substr(v.lastIndexOf('.') + 1);
var currentFilename = filenameArray[i] || '';
currentFilename = currentFilename.replace(/"/g, '"');
if (extGroup.image.indexOf(ext) != -1) {
// 是图片
liHtml += '<li><a title="点击预览"><img src="' + v + '" data-images onerror="this.src=\'/static/admin/images/upload-icons/image-error.png\';this.onerror=null"></a><small class="uploads-delete-tip bg-red badge" data-upload-delete="' + uploadName + '" data-upload-filename-field="' + uploadFilenameField + '" data-upload-url="' + v + '" data-upload-sign="' + uploadSign + '">×</small></li>\n';
liHtml += '<li><a title="点击预览"><img src="' + v + '" data-images onerror="this.src=\'/static/admin/images/upload-icons/image-error.png\';this.onerror=null"></a><small class="uploads-delete-tip bg-red badge" data-upload-delete="' + uploadName + '" data-upload-filename-field="' + uploadFilenameField + '" data-upload-url="' + v + '" data-upload-sign="' + uploadSign + '" data-upload-filename="' + currentFilename + '">×</small></li>\n';
} else {
// 不是图片
// 遍历extGroup数组找到扩展名所在的索引
uploadIcon = admin.getExtGroupName(ext);
liHtml += '<li><a title="点击打开文件" target="_blank" href="' + v + '" ><img src="/static/admin/images/upload-icons/' + uploadIcon + '.png"></a><small class="uploads-delete-tip bg-red badge" data-upload-delete="' + uploadName + '" data-upload-filename-field="' + uploadFilenameField + '" data-upload-url="' + v + '" data-upload-sign="' + uploadSign + '">×</small></li>\n';
liHtml += '<li><a title="点击打开文件" target="_blank" href="' + v + '" ><img src="/static/admin/images/upload-icons/' + uploadIcon + '.png"></a><small class="uploads-delete-tip bg-red badge" data-upload-delete="' + uploadName + '" data-upload-filename-field="' + uploadFilenameField + '" data-upload-url="' + v + '" data-upload-sign="' + uploadSign + '" data-upload-filename="' + currentFilename + '">×</small></li>\n';
}
});
parant.after('<ul id="bing-' + uploadNameKey + '" class="layui-input-block layuimini-upload-show">\n' + liHtml + '</ul>');
var initSortable = function () {
var el = document.getElementById('bing-' + uploadNameKey);
if (el) {
new Sortable(el, {
animation: 150,
onEnd: function (evt) {
var newUrls = [];
var newFilenames = [];
$(el).find('.uploads-delete-tip').each(function () {
newUrls.push($(this).attr('data-upload-url'));
newFilenames.push($(this).attr('data-upload-filename'));
});
$(elem).val(newUrls.join(uploadSign));
if (uploadFilenameField) {
$(elemFilenameField).val(newFilenames.join(uploadSign));
}
$(elem).trigger("input");
}
});
}
};
initSortable();
}
});