✨ 分享图生成阈值自定义

src/pages/common/PageConfig.vue

@@ -59,6 +59,23 @@
           />
         </template>
       </v-list-item>
+      <v-list-item title="分享设置">
+        <template #subtitle>
+          {{
+            appStore.shareDefaultFile === true
+              ? "默认保存到文件"
+              : `默认保存到剪贴板，超过${appStore.shareDefaultFile}MB时保存到文件`
+          }}
+        </template>
+        <template #prepend>
+          <div class="config-icon">
+            <v-icon>mdi-share-variant</v-icon>
+          </div>
+        </template>
+        <template #append>
+          <v-icon @click="confirmShare()">mdi-cog</v-icon>
+        </template>
+      </v-list-item>
       <v-list-item>
         <template #prepend>
           <div class="config-icon">
@@ -231,6 +248,45 @@ async function confirmUpdate(title?: string): Promise<void> {
   window.location.reload();
 }
 
+// 分享设置
+async function confirmShare(): Promise<void> {
+  const input = await showDialog.input(
+    "请输入分享文件大小阈值(MB)",
+    "阈值：",
+    appStore.shareDefaultFile.toString(),
+  );
+  if (input === null) {
+    showSnackbar.cancel("已取消修改分享设置");
+    return;
+  }
+  if (input === "") {
+    showSnackbar.error("阈值不能为空!");
+    return;
+  }
+  if (isNaN(Number(input))) {
+    showSnackbar.error("阈值必须为数字!");
+    return;
+  }
+  if (Number(input) === appStore.shareDefaultFile) {
+    showSnackbar.cancel("未修改分享设置");
+    return;
+  }
+  if (Number(input) > 2000) {
+    showSnackbar.error("阈值不能大于2000MB!");
+    return;
+  }
+  const check = await showDialog.check(
+    "确认修改分享设置吗？",
+    `新阈值为${input}MB，超过将保存到文件`,
+  );
+  if (!check) {
+    showSnackbar.cancel("已取消修改分享设置");
+    return;
+  }
+  appStore.shareDefaultFile = Number(input);
+  showSnackbar.success(`成功修改分享设置!新阈值为${input}MB`);
+}
+
 // 更新设备信息
 async function confirmUpdateDevice(force?: boolean): Promise<void> {
   if (force !== undefined && force) {

src/store/modules/app.ts

@@ -1,7 +1,7 @@
 /**
  * @file store/modules/app.ts
  * @description App store module
- * @since Beta v0.6.0
+ * @since Beta v0.6.4
  */
 
 import { path } from "@tauri-apps/api";
@@ -24,10 +24,7 @@ export const useAppStore = defineStore(
     // 应用打包时间
     const buildTime = ref("");
     // 侧边栏设置
-    const sidebar = reactive({
+    const sidebar = reactive({ collapse: true });
-      // 是否折叠
-      collapse: true,
-    });
     // 开发者模式
     const devMode = ref<boolean>(false);
     // 应用主题
@@ -52,6 +49,8 @@ export const useAppStore = defineStore(
     const recentNewsType = ref<string>("notice");
     // 是否开启分辨率回正
     const needResize = ref<string>("true");
+    // 分享图生成默认设置，为0表示默认保存到文件，为数字表示当大小超过xMB时保存到文件，否则保存到剪贴板
+    const shareDefaultFile = ref<number>(10);
 
     // 初始化
     function init(): void {
@@ -64,6 +63,7 @@ export const useAppStore = defineStore(
       recentNewsType.value = "notice";
       needResize.value = "true";
       gameDir.value = "未设置";
+      shareDefaultFile.value = 10;
       initDevice();
     }
 
@@ -91,6 +91,7 @@ export const useAppStore = defineStore(
       recentNewsType,
       needResize,
       gameDir,
+      shareDefaultFile,
       init,
       changeTheme,
     };
@@ -105,7 +106,7 @@ export const useAppStore = defineStore(
       {
         key: "app",
         storage: window.localStorage,
-        pick: ["devMode", "loading", "buildTime", "isLogin", "needResize"],
+        pick: ["devMode", "loading", "buildTime", "isLogin", "needResize", "shareDefaultFile"],
       },
       {
         key: "sidebar",

src/utils/TGShare.ts

@@ -1,16 +1,17 @@
 /**
  * @file utils/TGShare.ts
  * @description 生成分享截图并保存到本地
- * @since Beta v0.6.2
+ * @since Beta v0.6.4
  */
 
 import { path } from "@tauri-apps/api";
 import { save } from "@tauri-apps/plugin-dialog";
 import { writeFile } from "@tauri-apps/plugin-fs";
 import html2canvas from "html2canvas";
+import { storeToRefs } from "pinia";
 
-import showDialog from "../components/func/dialog.js";
 import showSnackbar from "../components/func/snackbar.js";
+import { useAppStore } from "../store/modules/app.js";
 
 import TGHttp from "./TGHttp.js";
 import TGLogger from "./TGLogger.js";
@@ -18,7 +19,7 @@ import { bytesToSize } from "./toolFunc.js";
 
 /**
  * @description 保存图片-canvas
- * @since Beta v0.6.2
+ * @since Beta v0.6.4
  * @param {Uint8Array} buffer - 图片数据
  * @param {string} filename - 文件名
  * @param {string} format - 文件格式
@@ -42,7 +43,7 @@ export async function saveCanvasImg(
   }
   await writeFile(res, buffer);
   await TGLogger.Info(`[saveCanvasImg][${filename}] 已将图像保存到本地`);
-  showSnackbar.success(`已将 ${filename} 保存到本地`);
+  showSnackbar.success(`已将 ${filename} 保存到本地，大小为 ${bytesToSize(buffer.length)}`);
 }
 
 /**
@@ -88,7 +89,7 @@ function getShareImgBgColor(): string {
 
 /**
  * @description 生成分享截图
- * @since Beta v0.6.0
+ * @since Beta v0.6.4
  * @param {string} fileName - 文件名
  * @param {HTMLElement} element - 元素
  * @param {number} scale - 缩放比例
@@ -131,19 +132,28 @@ export async function generateShareImg(
   const size = buffer.length;
   const sizeStr = bytesToSize(size);
   await TGLogger.Info(`[generateShareImg][${fileName}] 图像大小为 ${sizeStr}`);
-  if (size > 80000000) {
+  const { shareDefaultFile } = storeToRefs(useAppStore());
-    showSnackbar.warn(`图像过大(${sizeStr})，无法保存`, 3000);
+  if (shareDefaultFile.value === 0) {
+    await saveCanvasImg(buffer, fileName);
     return;
   }
-  if (size > 20000000) {
+  if (typeof shareDefaultFile.value === "number" && size > shareDefaultFile.value * 1000000) {
-    const sizeStr = bytesToSize(size);
+    await saveCanvasImg(buffer, fileName);
-    const saveCheck = await showDialog.check("图像过大", `图像大小为 ${sizeStr}，是否保存到文件？`);
+    return;
-    if (saveCheck === true) {
-      await saveCanvasImg(buffer, fileName);
-      return;
-    }
-    showSnackbar.warn("将尝试保存到剪贴板");
   }
+  // if (size > 80000000) {
+  //   showSnackbar.warn(`图像过大(${sizeStr})，无法保存`, 3000);
+  //   return;
+  // }
+  // if (size > 20000000) {
+  //   const sizeStr = bytesToSize(size);
+  //   const saveCheck = await showDialog.check("图像过大", `图像大小为 ${sizeStr}，是否保存到文件？`);
+  //   if (saveCheck === true) {
+  //     await saveCanvasImg(buffer, fileName);
+  //     return;
+  //   }
+  //   showSnackbar.warn("将尝试保存到剪贴板");
+  // }
   try {
     await copyToClipboard(buffer);
     showSnackbar.success(`已将 ${fileName} 复制到剪贴板，大小为 ${sizeStr}`);