refactor(app): 优化图片加载和格式化

- 在 ItemList 组件中,使用 OSS 图片处理功能调整图片尺寸和格式,提高加载速度
- 在 tangPopup 组件中,应用相同的图片优化处理
- 移除了未使用的 formatNumber 函数,简化了代码
This commit is contained in:
xingyy 2025-03-07 10:06:05 +08:00
parent 4caa3fb0da
commit d18dcfd8f9
2 changed files with 5 additions and 24 deletions

View File

@ -41,27 +41,6 @@ const openShow = async (item) => {
localState.value.showDetail = true
currentItem.value = item
}
/**
* 将数字格式化为"250XX"格式其中XX是两位数
* @param {number} num - 要格式化的数字
* @return {string} - 格式化后的字符串
*/
function formatNumber(num) {
//
if (typeof num !== 'number' && isNaN(Number(num))) {
throw new Error('输入必须是有效数字');
}
// ()
const number = Number(num);
// 0
const formattedNum = number.toString().padStart(2, '0');
// "250"
return `250${formattedNum}`;
}
</script>
<template>
@ -90,13 +69,15 @@ function formatNumber(num) {
>
<div class="relative w-full">
<img
:src="item.artwork?.hdPic"
:src="item.artwork?.hdPic + '?x-oss-process=image/resize,w_500,h_500/format,webp/quality,q_80'"
class="w-full object-cover rounded-4px"
loading="lazy"
/>
<div
class="absolute rounded-2px overflow-hidden line-height-12px left-[8px] top-[8px] h-[17px] w-[60px] flex items-center justify-center bg-[#2b53ac] text-[12px] text-[#fff]"
>
Lot{{ formatNumber(item.index) }}
Lot{{ item.index+25000 }}
</div>
</div>
<div class="pt-[8px]">

View File

@ -124,7 +124,7 @@ watch(()=>props.show,async (newValue)=>{
<xImage
:preview="false"
class="w-80px h-80px"
:src="item.artwork?.hdPic"
:src="item.artwork?.hdPic+'?x-oss-process=image/resize,w_280,h_280/format,webp/quality,q_80'"
:alt="item?.artworkTitle"
loading="lazy"
/>