图片优化

pages/other/splash/splash.vue

@@ -8,10 +8,10 @@
 		<view class="button-container">
 			<button class="btn-save-image" @click="saveImage">保存图片</button>
 		</view>
-		<l-painter isCanvasToTempFilePath @success="successImage" @progress="progress" hidden
+		<l-painter isCanvasToTempFilePath @success="successImage" @progress="progress" hidden v-if="data.bgImage"
 			:css="`width:${data.width}px;height:${data.width / 4 * 3}px;`">
 			<l-painter-view
-				:css="`position: relative;width:${data.width}px;height:${data.width / 4 * 3}px;background-image: url('/static/image/other/gzd.png');`">
+				:css="`position: relative;width:${data.width}px;height:${data.width / 4 * 3}px;background-image: url('${data.bgImage}');`">
 				<!-- 头部年月 -->
 				<l-painter-view :css="`position: absolute;left:480px;top:336px;`">
 					<l-painter-text :css="data.textCssTime" :text="data.form.year" />
@@ -183,7 +183,7 @@
 <script setup>
 // 自定义头部
 import ZdyNavbar from "@/components/nav-bar/nav-bar.vue"
-
+import { imgLocal  } from '@/utils/common.js';
 import {
 	ref,
 	reactive,
@@ -207,6 +207,7 @@ const data = reactive({
 		title: "工资条",
 		bgColor: '#EDEDED',
 	},
+	bgImage:'',
 	width: 375,
 	height: 495,
 	code: '',
@@ -248,7 +249,7 @@ function progress(e){
 	if(e==1){
 		uni.hideLoading()
 	}
-	console.log(e)
+	// console.log(e)
 }
 // 打开编辑弹窗
 function edit() {
@@ -437,7 +438,7 @@ function saveImage() {
 	}
 }
 
-onLoad((option) => {
+onLoad(async(option) => {
 	// 进入工资单页面埋点
 	proxy.$apiUserEvent('all', {
 		type: 'event',
@@ -445,6 +446,9 @@ onLoad((option) => {
 		prefix: '.uni.other.',
 		value: "工资单"
 	})
+
+	data.bgImage = await imgLocal.getLocalImage('other/gzd.png');
+	console.log(data.bgImage)
 })
 onReady(() => {
 

utils/common.js

@@ -619,7 +619,72 @@ export const randomUtil = {
 	}
 };
 
+export const imgLocal = {
+	simpleHash(str) {
+		let hash = 0;
+		for (let i = 0; i < str.length; i++) {
+			hash = (hash << 5) - hash + str.charCodeAt(i);
+			hash |= 0;
+		}
+		return Math.abs(hash).toString(36);
+	},
+	getLocalImage(url) {
+		return new Promise((resolve, reject) => {
+			if (!url) return reject('url不能为空');
 			
+			const CACHE_KEY = 'IMG_CACHE_MAP';
+			const cache = uni.getStorageSync(CACHE_KEY) || {};
+
+			// 🔥 1. 用简单 hash 作为 key（避免超长 URL）
+			const key = this.simpleHash(url);
+
+			// 2. 命中缓存
+			if (cache[key]) {
+				return resolve(cache[key]);
+			}
+			const config = uni.getStorageSync('config')
+			let imgConfig = config.config['client.uniapp.img_path']?.alipay||'http://cdn.u8t.cn/flaunt/uni_mp/img/alipay/static/image/'
+			url=imgConfig+url
+			// #ifdef APP-PLUS
+			const filename = `_doc/img_cache/${key}.jpg`;
+
+			const task = plus.downloader.createDownload(
+				url, {
+					filename
+				},
+				(download, status) => {
+					if (status === 200) {
+						const localPath = plus.io.convertLocalFileSystemURL(download.filename);
+
+						cache[key] = localPath;
+						uni.setStorageSync(CACHE_KEY, cache);
+
+						resolve(localPath);
+					} else {
+						reject('下载失败：' + status);
+					}
+				}
+			);
+
+			task.start();
+			// #endif
+
+			// #ifndef APP-PLUS
+			uni.downloadFile({
+				url,
+				success: (res) => {
+					if (res.statusCode === 200) {
+						resolve(res.tempFilePath);
+					} else {
+						reject('失败');
+					}
+				},
+				fail: reject
+			});
+			// #endif
+		});
+	}
+}
 
 
 // 默认导出所有工具方法
@@ -630,5 +695,6 @@ export default {
 	...deviceUtil,
 	...uiUtil,
 	...util,
-  ...randomUtil
+	...randomUtil,
+	...imgLocal
 };