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

增加图片裁剪参数

Browse Source 
data-cut-width
data-cut-height
This commit is contained in:
Anyon 2022-07-11 19:23:45 +08:00
parent 77641b101c
commit 43a2e04f03
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -15,6 +15,8 @@ define(['md5', 'notify'], function (SparkMD5, Notify, allowMime) {
this.option.quality = parseFloat(this.option.elem.data('quality') || '1.0');
this.option.maxWidth = parseInt(this.option.elem.data('max-width') || '0');
this.option.maxHeight = parseInt(this.option.elem.data('max-height') || '0');
this.option.cutHeight = parseInt(this.option.elem.data('cut-height') || '0');
this.option.cutHeight = parseInt(this.option.elem.data('cut-height') || '0');
/*! 查找表单元素, 如果没有找到将不会自动写值 */
if (!this.option.elem.data('input') && this.option.elem.data('field')) {
@ -36,6 +38,8 @@ define(['md5', 'notify'], function (SparkMD5, Notify, allowMime) {
file.quality = that.option.quality;
file.maxWidth = that.option.maxWidth;
file.maxHeight = that.option.maxHeight;
file.cutWidth = that.option.cutWidth;
file.cutHeight = that.option.cutHeight;
});
that.adapter.event('upload.choose', obj.items);
that.adapter.upload(obj.items, done);
@ -75,10 +79,10 @@ define(['md5', 'notify'], function (SparkMD5, Notify, allowMime) {
// 禁传异常状态文件
if (typeof file.xstate === 'number' && file.xstate === -1) return;
// 图片限宽限高压缩
if (/^image\//.test(file.type) && (file.maxWidth > 0 || file.maxHeight > 0 || file.quality !== 1)) {
if (/^image\//.test(file.type) && (file.maxWidth + file.maxHeight + file.cutWidth + file.cutHeight > 0 || file.quality !== 1)) {
require(['compressor'], function (Compressor) {
new Compressor(file, {
quality: file.quality, maxWidth: file.maxWidth, maxHeight: file.maxHeight, success(blob) {
quality: file.quality, resize: 'cover', width: file.cutWidth || 0, height: file.cutHeight || 0, maxWidth: file.maxWidth, maxHeight: file.maxHeight, success(blob) {
files[index] = blob, blob.index = file.index, files[index].notify = file.notify;
that.hash(files[index]).then(function (file) {
that.event('upload.hash', file).request(file, done);

12
public/static/admin.js
View File

@ -584,11 +584,7 @@ $(function () {
return this.each(function () {
if ($(this).data('inited')) return true; else $(this).data('inited', true);
var $in = $(this), $bt = $('<a data-file class="uploadimage uploadvideo"><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') || 'mp4')
.attr('data-max-width', $in.data('max-width'))
.attr('data-max-height', $in.data('max-height'))
.find('span').on('click', function (event) {
$bt.attr('data-size', $in.data('size') || 0).attr('data-type', $in.data('type') || 'mp4').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 () {
@ -611,7 +607,8 @@ $(function () {
event.stopPropagation(), $bt.attr('style', ''), $in.val('');
}).find('[data-file]').data('input', this).attr({
'data-size': $in.data('size') || 0, 'data-type': $in.data('type') || 'gif,png,jpg,jpeg',
'data-max-width': $in.data('max-width') || 0, 'data-max-height': $in.data('max-height') || 0
'data-max-width': $in.data('max-width') || 0, 'data-max-height': $in.data('max-height') || 0,
'data-cut-width': $in.data('cut-width') || 0, 'data-cut-height': $in.data('cut-height') || 0,
});
});
};
@ -624,7 +621,8 @@ $(function () {
var ims = this.value ? this.value.split('|') : [], $in = $(this).after($bt);
$bt.find('[data-file]').attr({
'data-size': $in.data('size') || 0, 'data-type': $in.data('type') || 'gif,png,jpg,jpeg',
'data-max-width': $in.data('max-width') || 0, 'data-max-height': $in.data('max-height') || 0
'data-max-width': $in.data('max-width') || 0, 'data-max-height': $in.data('max-height') || 0,
'data-cut-width': $in.data('cut-width') || 0, 'data-cut-height': $in.data('cut-height') || 0,
}).on('push', function (evt, src) {
ims.push(src), $in.val(ims.join('|')), showImageContainer([src]);
}) && (ims.length > 0 && showImageContainer(ims));