blackteay/ThinkAdmin
1
0
Fork 0
mirror of https://gitee.com/zoujingli/ThinkAdmin.git synced 2025-04-05 19:41:44 +08:00
Code Issues Projects Releases Wiki Activity

修改后台样式及文件上传

Browse Source
This commit is contained in:
Anyon 2022-06-30 12:09:39 +08:00
parent 1f780e714c
commit 3666b1c443
6 changed files with 54 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/admin/view/api/upload.js
View File

@ -188,7 +188,7 @@ define(['md5', 'notify'], function (SparkMD5, Notify, allowMime) {
$(this.option.elem.data('input')).val(file.xurl).trigger('change', file);
}
// 文件上传成功事件
this.event('upload.done', {file: file, data: ret}, file, message);
this.event('choose', file.xurl).event('upload.done', {file: file, data: ret}, file, message);
/*! 所有文件上传完成后结果处理 */
if (this.count.success + this.count.error >= this.count.total) {
this.option.hide || $.msg.close(this.loader);
@ -196,7 +196,7 @@ define(['md5', 'notify'], function (SparkMD5, Notify, allowMime) {
var urls = this.option.elem.data('input').value || [];
if (typeof urls === 'string') urls = urls.split('|');
for (var i in this.files) urls.push(this.files[i].xurl);
$(this.option.elem.data('input')).val(urls.join('|')).trigger('change', files);
$(this.option.elem.data('input')).val(urls.join('|')).trigger('change', this.files);
}
this.event('upload.complete', {file: this.files}, file).init().uploader && this.uploader.reload();
}

2
app/admin/view/api/upload/image.html
View File

@ -99,7 +99,7 @@
},
// 设置选择数据
setValue: function (url) {
this.$btn.trigger('choose', url);
this.$btn.triggerHandler('choose', url);
if (this.$btn.data('input')) $(this.$btn.data('input')).val(url).trigger('change', url);
$('#ImageDialog').parents('.layui-layer-content').next().find('.layui-layer-close').trigger('click');
},

29
public/static/admin.js
View File

@ -564,7 +564,7 @@ $(function () {
return data;
};
/*! 全局文件上传插件 */
/*! 全局文件上传 */
$.fn.uploadFile = function (callable, initialize) {
return this.each(function () {
if ($(this).data('inited')) return false;
@ -593,13 +593,15 @@ $(function () {
$.fn.uploadOneImage = function () {
return this.each(function () {
if ($(this).data('inited')) return true; else $(this).data('inited', true);
var $in = $(this), $bt = $('<a data-file="image" class="uploadimage transition"><span class="layui-icon">&#x1006;</span><span class="layui-icon">&#xe615;</span></a>').data('input', this);
$bt.attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'png,jpg,gif,jpeg').find('span').on('click', function (event) {
event.stopPropagation();
if ($(this).index() === 0) $bt.attr('style', ''), $in.val(''); else $in.val() && $.previewImage(encodeURI($in.val()));
}), $in.on('change', function () {
var $bt = $('<div class="uploadimage transition"><span><a data-file class="layui-icon layui-icon-upload-drag"></a><i class="layui-icon layui-icon-search"></i><i class="layui-icon layui-icon-close"></i></span><span data-file="image"></span></div>');
var $in = $(this).on('change', function () {
if (this.value) $bt.css('backgroundImage', 'url(' + encodeURI(this.value) + ')');
}).after($bt).trigger('change');
$bt.on('click', 'i.layui-icon-search', function (event) {
event.stopPropagation(), $in.val() && $.previewImage(encodeURI($in.val()));
}).on('click', 'i.layui-icon-close', function (event) {
event.stopPropagation(), $bt.attr('style', ''), $in.val('');
}).find('[data-file]').data('input', this).attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'png,jpg,gif,jpeg');
});
};
@ -607,10 +609,11 @@ $(function () {
$.fn.uploadMultipleImage = function () {
return this.each(function () {
if ($(this).data('inited')) return true; else $(this).data('inited', true);
var $in = $(this), $bt = $('<a data-file="mul" class="uploadimage"></a>'), imgs = this.value ? this.value.split('|') : []
$in.after($bt.attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'gif,png,jpg,jpeg').uploadFile(function (src) {
imgs.push(src), $in.val(imgs.join('|')), showImageContainer([src]);
})), (imgs.length > 0 && showImageContainer(imgs));
var $bt = $('<div class="uploadimage"><span><a data-file="mul" class="layui-icon layui-icon-upload-drag"></a></span><span data-file="images"></span></div>');
var ims = this.value ? this.value.split('|') : [], $in = $(this).after($bt);
$bt.find('[data-file]').attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'gif,png,jpg,jpeg').data('input', this).on('choose', function (evt, src) {
ims.push(src), $in.val(ims.join('|')), showImageContainer([src]);
}) && (ims.length > 0 && showImageContainer(ims))
function showImageContainer(srcs) {
$(srcs).each(function (idx, src, $image) {
@ -618,10 +621,10 @@ $(function () {
$image.attr('data-tips-image', encodeURI(src)).css('backgroundImage', 'url(' + encodeURI(src) + ')').on('click', 'a', function (event, index, prevs, $item) {
event.stopPropagation(), $item = $(this).parent().parent(), index = $(this).index();
if (index === 2 && $item.index() !== $bt.prevAll('div.uploadimage').length) $item.next().after($item); else if (index === 0 && $item.index() > 1) $item.prev().before($item); else if (index === 1) $item.remove();
imgs = [], $bt.prevAll('.uploadimage').map(function () {
imgs.push($(this).attr('data-tips-image'));
ims = [], $bt.prevAll('.uploadimage').map(function () {
ims.push($(this).attr('data-tips-image'));
});
imgs.reverse(), $in.val(imgs.join('|'));
ims.reverse(), $in.val(ims.join('|'));
}), $bt.before($image);
});
}

53
public/static/theme/css/_custom.less
View File

@ -804,32 +804,46 @@ input:not(.layui-hide,[type=hidden]) {
background-image: url('../img/upvideo.png');
}
span.layui-icon {
color: #fff;
width: 20px;
> span:first-child {
right: 0;
height: 20px;
z-index: 3;
display: none;
position: absolute;
text-align: center;
line-height: 22px;
box-shadow: @ShadowOuterMin;
background: rgba(0, 0, 0, .8);
.layui-icon {
color: #fff;
width: 22px;
height: 20px;
text-align: center;
line-height: 22px;
display: inline-block;
background: rgba(0, 0, 0, .8);
}
.layui-icon:first-child {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.layui-icon:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
}
span.layui-icon:first-child {
right: 0;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
> span:last-child {
width: 100%;
height: 100%;
display: block;
position: absolute;
z-index: 2;
}
span.layui-icon:last-child {
right: 21px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
&:hover span.layui-icon {
display: inline-block;
&:hover > span:first-child {
display: block;
}
}
@ -844,10 +858,9 @@ input:not(.layui-hide,[type=hidden]) {
a {
color: #EEE;
width: 20px;
width: 22px;
height: 20px;
display: inline-block;
margin-left: 1px;
box-shadow: @ShadowOuterMin;
text-align: center;
line-height: 20px;

2
public/static/theme/css/console.css
View File

File diff suppressed because one or more lines are too long

2
public/static/theme/css/console.css.map
View File

File diff suppressed because one or more lines are too long