合并分支 '3.x' 到 'main'

3.x

查看合并请求 !21

package.json

@@ -57,7 +57,7 @@
         "lint:stylelint": "stylelint --cache --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
         "lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js",
         "log": "conventional-changelog -p angular -i CHANGELOG.md -s",
-        "up": "pnpx @dcloudio/uvm alpha",
+        "u": "pnpx @dcloudio/uvm vue3",
         "prepare": "husky install"
     },
     "config": {
@@ -107,7 +107,7 @@
         "@dcloudio/uni-helper-json": "^1.0.13",
         "@dcloudio/uni-stacktracey": "3.0.0-alpha-3071220230324001",
         "@dcloudio/vite-plugin-uni": "3.0.0-alpha-3071220230324001",
-        "@iconify/json": "^2.2.41",
+        "@iconify/json": "^2.2.42",
         "@types/crypto-js": "^4.1.1",
         "@types/lodash-es": "^4.17.7",
         "@types/node": "^18.15.11",
@@ -150,13 +150,13 @@
         "stylelint-config-standard": "^29.0.0",
         "stylelint-order": "^5.0.0",
         "terser": "^5.16.8",
-        "typescript": "^5.0.2",
+        "typescript": "^5.0.3",
         "unocss": "^0.50.6",
         "unocss-preset-weapp": "^0.5.2",
         "unplugin-auto-import": "^0.15.2",
         "unplugin-vue-components": "^0.24.1",
         "vite": "^4.2.1",
-        "vue-eslint-parser": "^9.1.0"
+        "vue-eslint-parser": "^9.1.1"
     },
     "engines": {
         "node": ">=16"

src/components/CacheImage/index.vue

@@ -18,6 +18,10 @@
             type: String,
             default: 'scaleToFill',
         },
+        background: {
+            type: String,
+            default: '#F7F7F7',
+        },
         src: {
             type: String,
             required: true,
@@ -38,10 +42,10 @@
         const hash = md5(url).toString()
         hashCacheKey.value = `G_CACHE_IMAGE_${hash}`
         if (uni.getStorageSync(hashCacheKey.value)) {
-            console.log('CacheImage cache hit')
+            console.debug('CacheImage cache hit')
             url = uni.getStorageSync(hashCacheKey.value)
         } else {
-            console.log('CacheImage cache miss')
+            console.debug('CacheImage cache miss')
             try {
                 const res = await uni.downloadFile({ url })
                 if (res.statusCode === 200) {
@@ -61,7 +65,7 @@
                 console.error(e)
             }
         }
-        console.log(props.src, '=>', url, hash, hashCacheKey.value)
+        console.debug(props.src, '=>', url, hash, hashCacheKey.value)
         // #endif
 
         src.value = url
@@ -87,7 +91,10 @@
         :width="props.width"
         :height="props.height"
         :radius="props.radius"
+        :background="props.background"
         :src="src"
         @error="onError"
-    />
+    >
+        <slot></slot>
+    </fui-lazyload>
 </template>

src/components/ThumbnailPreview/index.vue

 <script lang="ts" setup>
     import type { PropType } from 'vue'
+    import md5 from 'crypto-js/md5'
     import { nanoid } from 'nanoid'
     import { getPoster, isImage, isVideo } from './utils'
+    import CacheImage from '@/components/CacheImage/index.vue'
 
     type Asset = Recordable & { url: string }
     const props = defineProps({
@@ -35,7 +37,17 @@
     // 预览图片
     const preview = (index: number) => {
         uni.previewImage({
-            urls: images.value.map((item) => item.url),
+            urls: images.value.map((item) => {
+                // #ifdef APP-PLUS
+                const hash = md5(item.url).toString()
+                const key = `G_CACHE_IMAGE_${hash}`
+                if (uni.getStorageSync(key)) {
+                    return uni.getStorageSync(key)
+                }
+                // #endif
+
+                return item.url
+            }),
             current: index,
         })
     }
@@ -67,7 +79,7 @@
 <template>
     <view class="preview-wrap">
         <!-- 视频预览 -->
-        <fui-lazyload
+        <CacheImage
             class="preview-video"
             :background="props.background"
             :mode="props.mode"
@@ -82,10 +94,10 @@
             <view class="icon-wrap" :style="{ width: props.width, height: props.height }">
                 <fui-icon class="video-play-icon" name="suspend" size="40" color="#fff" />
             </view>
-        </fui-lazyload>
+        </CacheImage>
 
         <!-- 图片预览 -->
-        <fui-lazyload
+        <CacheImage
             class="preview-image"
             :background="props.background"
             :mode="props.mode"