FastAdmin 修改上傳元件預覽方式
阿新 • • 發佈:2022-03-07
在\public\assets\js\backend-init.js中新增以下函式
$('body').on('click', '[data-tips-image]', function () { var img = new Image(); var imgWidth = this.getAttribute('data-width') || '480px'; img.onload = function () { var $content = $(img).appendTo('body').css({background: '#fff', width: imgWidth, height: 'auto'}); Layer.open({ type:1, area: imgWidth, title: false, closeBtn: 1, skin: 'layui-layer-nobg', shadeClose: true, content: $content, end: function () { $(img).remove(); }, success: function () { } }); }; img.onerror= function (e) { }; img.src = this.getAttribute('data-url') || this.src; });
在\public\assets\js\require-upload.js中修改以下內容
previewtpl: '<li class="col-xs-3"><a href="javascript:void(0)" data-tips-image data-url="<%=url%>" class="thumbnail"><img src="<%=fullurl%>" onerror="this.src=\'' + Fast.api.fixurl("ajax/icon") + '?suffix=<%=suffix%>\';this.onerror=null;" class="img-responsive"></a><a href="javascript:;" class="btn btn-danger btn-xs btn-trash"><i class="fa fa-trash"></i></a></li>',//previewtpl: '<li class="col-xs-3"><a href="<%=fullurl%>" data-url="<%=url%>" target="_blank" class="thumbnail"><img src="<%=fullurl%>" onerror="this.src=\'' + Fast.api.fixurl("ajax/icon") + '?suffix=<%=suffix%>\';this.onerror=null;" class="img-responsive"></a><a href="javascript:;" class="btn btn-danger btn-xs btn-trash"><i class="fa fa-trash"></i></a></li>',