mirror of
https://github.com/kuaifan/dootask.git
synced 2026-02-04 04:08:16 +00:00
perf: 优化缩略图
This commit is contained in:
parent
b8852f821c
commit
1a7591314f
38
resources/assets/js/functions/web.js
vendored
38
resources/assets/js/functions/web.js
vendored
@ -529,7 +529,7 @@ import {MarkdownPreview} from "../store/markdown";
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 图片尺寸比例超出
|
* 图片尺寸比例超出
|
||||||
* @param params {{src: *, width: (number|*), height: (number|*), crops: {percentage: string, ratio: number}, scaleSize: (number)}}
|
* @param params {{src: *, width: (number|*), height: (number|*), crops: {ratio?: number, size?: string, percentage?: string, cover?: string, contain?: string}, scaleSize: (number)}}
|
||||||
* src, // 原图地址
|
* src, // 原图地址
|
||||||
* width, // 原图宽度
|
* width, // 原图宽度
|
||||||
* height, // 原图高度
|
* height, // 原图高度
|
||||||
@ -537,24 +537,22 @@ import {MarkdownPreview} from "../store/markdown";
|
|||||||
* scaleSize, // 返回尺寸缩放最高尺寸
|
* scaleSize, // 返回尺寸缩放最高尺寸
|
||||||
*/
|
*/
|
||||||
imageRatioHandle(params) {
|
imageRatioHandle(params) {
|
||||||
if (!/\.(png|jpg|jpeg)$/.test(params.src)) {
|
|
||||||
return params
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!$A.isJson(params.crops)) {
|
if (!$A.isJson(params.crops)) {
|
||||||
return params
|
return params
|
||||||
}
|
}
|
||||||
|
|
||||||
params.src = $A.thumbRestore(params.src) + "/crop/" + Object.keys(params.crops).map(key => {
|
if ($A.imageRatioJudge(params.src)) {
|
||||||
return `${key}:${params.crops[key]}`
|
params.src = $A.thumbRestore(params.src) + "/crop/" + Object.keys(params.crops).map(key => {
|
||||||
}).join(",")
|
return `${key}:${params.crops[key]}`
|
||||||
|
}).join(",")
|
||||||
|
|
||||||
const ratio = $A.imageRatioExceed(params.width, params.height, params.crops.ratio)
|
const ratio = $A.imageRatioExceed(params.width, params.height, params.crops.ratio)
|
||||||
if (ratio > 0) {
|
if (ratio > 0) {
|
||||||
if (params.width > params.height) {
|
if (params.width > params.height) {
|
||||||
params.width = params.height * ratio;
|
params.width = params.height * ratio;
|
||||||
} else {
|
} else {
|
||||||
params.height = params.width * ratio;
|
params.height = params.width * ratio;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -567,6 +565,18 @@ import {MarkdownPreview} from "../store/markdown";
|
|||||||
return params;
|
return params;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断图片地址是否满足比例缩放
|
||||||
|
* @param url
|
||||||
|
* @returns {boolean}
|
||||||
|
*/
|
||||||
|
imageRatioJudge(url) {
|
||||||
|
if (!/\.(png|jpg|jpeg)$/.test(url)) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return $A.getDomain(url) == $A.getDomain($A.mainUrl());
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 图片尺寸比例超出
|
* 图片尺寸比例超出
|
||||||
* @param width
|
* @param width
|
||||||
|
|||||||
@ -52,7 +52,7 @@ export default {
|
|||||||
imageStyle({width, height, thumb}, type = 'style') {
|
imageStyle({width, height, thumb}, type = 'style') {
|
||||||
if (width && height) {
|
if (width && height) {
|
||||||
const ratioExceed = $A.imageRatioExceed(width, height, 3)
|
const ratioExceed = $A.imageRatioExceed(width, height, 3)
|
||||||
if (/\.(png|jpg|jpeg)$/.test(thumb) && ratioExceed > 0) {
|
if ($A.imageRatioJudge(thumb) && ratioExceed > 0) {
|
||||||
if (width > height) {
|
if (width > height) {
|
||||||
width = height * ratioExceed;
|
width = height * ratioExceed;
|
||||||
} else {
|
} else {
|
||||||
@ -91,7 +91,7 @@ export default {
|
|||||||
|
|
||||||
imageSrc({width, height, thumb}) {
|
imageSrc({width, height, thumb}) {
|
||||||
const ratioExceed = $A.imageRatioExceed(width, height, 3)
|
const ratioExceed = $A.imageRatioExceed(width, height, 3)
|
||||||
if (/\.(png|jpg|jpeg)$/.test(thumb) && ratioExceed > 0) {
|
if ($A.imageRatioJudge(thumb) && ratioExceed > 0) {
|
||||||
thumb = $A.thumbRestore(thumb) + `/crop/ratio:${ratioExceed},percentage:320x0`;
|
thumb = $A.thumbRestore(thumb) + `/crop/ratio:${ratioExceed},percentage:320x0`;
|
||||||
}
|
}
|
||||||
return thumb;
|
return thumb;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user