feat: 优化 CacheImage 组件，记录文件大小及时间戳，以及计算缓存大小和清理功能

src/components/CacheImage/index.ts

+import { convertKB } from '@/utils/file'
+
+/**
+ * 图片 Hash 缓存标识前缀
+ */
+export const CACHE_PREFIX = 'G_CACHE_IMAGE__'
+
+/**
+ * 计算缓存大小
+ * @returns 字节
+ */
+export function calculateCacheSize() {
+    const storage = uni.getStorageInfoSync()
+    return storage.keys
+        .filter((key) => key.startsWith(CACHE_PREFIX))
+        .reduce((total, key) => {
+            try {
+                const cache = uni.getStorageSync(key)
+                const result = JSON.parse(cache)
+                total += result.size
+            } catch (_) {}
+
+            return total
+        }, 0)
+}
+
+/**
+ * 计算缓存大小格式化
+ * @returns 格式化后的缓存大小
+ * @example 1.2MB
+ * @see {@link calculateCacheSize}
+ * @see {@link convertKB}
+ * @see {@link CACHE_PREFIX}
+ */
+export function calculateCacheSizeFormat() {
+    const cacheSize = calculateCacheSize()
+    const { size, unit } = convertKB(cacheSize)
+    return `${size}${unit}`
+}
+
+/**
+ * 清理缓存
+ */
+export function cleanCache() {
+    const storage = uni.getStorageInfoSync()
+    const promises = storage.keys
+        .filter((key) => key.startsWith(CACHE_PREFIX))
+        .map((key) => {
+            return new Promise((resolve, reject) => {
+                try {
+                    const cache = uni.getStorageSync(key)
+                    const result = JSON.parse(cache)
+                    uni.removeSavedFile({
+                        filePath: result.url,
+                        complete: resolve,
+                    })
+                } catch (e) {
+                    console.error(e)
+                    reject(e)
+                } finally {
+                    uni.removeStorageSync(key)
+                }
+            })
+        })
+
+    return Promise.allSettled(promises)
+}

src/components/CacheImage/index.vue

 <script setup lang="ts">
     import md5 from 'crypto-js/md5'
+    import { CACHE_PREFIX } from './index'
 
     const props = defineProps({
         width: {
@@ -60,27 +61,53 @@
         // 如果是网络图片，则缓存到本地
         if (url.startsWith('http')) {
             // #ifdef APP-PLUS
-            const hash = md5(url).toString()
-            hashCacheKey.value = `G_CACHE_IMAGE_${hash}`
-            if (uni.getStorageSync(hashCacheKey.value)) {
+            const hash = md5(url).toString().toUpperCase()
+            hashCacheKey.value = `${CACHE_PREFIX}${hash}`
+            const cache = uni.getStorageSync(hashCacheKey.value)
+            if (cache) {
                 log('cache hit', url)
-                url = uni.getStorageSync(hashCacheKey.value)
+                try {
+                    const result = JSON.parse(cache)
+                    url = result.url
+                } catch (_) {
+                    url = cache
+                }
             } else {
                 log('cache miss', url)
                 try {
                     const res = await uni.downloadFile({ url })
                     if (res.statusCode === 200) {
-                        const { savedFilePath } = await new Promise<UniApp.SaveFileSuccess>((resolve, reject) => {
-                            uni.saveFile({
-                                tempFilePath: res.tempFilePath,
-                                success: (res) => resolve(res),
-                                fail: (err) => reject(err),
-                            })
-                        })
+                        const { savedFilePath, size } = await new Promise<{ savedFilePath: string; size: number }>(
+                            (resolve, reject) => {
+                                uni.saveFile({
+                                    tempFilePath: res.tempFilePath,
+                                    success: (res) => {
+                                        const filePath = res.savedFilePath
+                                        uni.getFileInfo({
+                                            filePath,
+                                            success: (res) =>
+                                                resolve({
+                                                    savedFilePath: filePath,
+                                                    size: res.size,
+                                                }),
+                                            fail: (err) => reject(err),
+                                        })
+                                    },
+                                    fail: (err) => reject(err),
+                                })
+                            },
+                        )
                         url = `${savedFilePath}`
 
                         // 缓存图片本地地址
-                        uni.setStorageSync(hashCacheKey.value, url)
+                        uni.setStorageSync(
+                            hashCacheKey.value,
+                            JSON.stringify({
+                                url,
+                                size,
+                                timestamp: Date.now(),
+                            }),
+                        )
                     } else {
                         log('cache error', url, res)
                         url = props.src
@@ -97,6 +124,7 @@
     }
 
     const hasError = ref(false)
+
     function onError() {
         if (hasError.value) {
             return

src/utils/file/index.ts

+// 将 KB 转换为其他单位
+export function convertKB(kb: number) {
+    const bytes = kb * 1024
+    const units = ['B', 'KB', 'MB', 'GB', 'TB']
+    let size = bytes
+    let unitIndex = 0
+
+    while (size >= 1024 && unitIndex < units.length - 1) {
+        size /= 1024
+        unitIndex++
+    }
+
+    return { size: size.toFixed(2), unit: units[unitIndex] }
+}