feat: 更多设置中增加在网页中预览的开关

Author: xream

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sub-store-front-end",
-  "version": "2.14.334",
+  "version": "2.14.335",
   "private": true,
   "scripts": {
     "dev": "vite --host",

src/components/PreviewPanel.vue

@@ -20,7 +20,7 @@
 
         <div class="actions">
           <a
-            :href="getUrl(platform.path, true)"
+            :href="getUrl(platform.path, appearanceSetting.displayPreviewInWebPage)"
             target="_blank"
           >
             <svg-icon
@@ -65,6 +65,12 @@
   import { useAppNotifyStore } from '@/store/appNotify';
   import SvgIcon from '@/components/SvgIcon.vue';
   import { useHostAPI } from '@/hooks/useHostAPI';
+  import { storeToRefs } from "pinia";
+  import { useSettingsStore } from '@/store/settings';
+
+  const settingsStore = useSettingsStore();
+  const { changeAppearanceSetting } = settingsStore;
+  const { appearanceSetting } = storeToRefs(settingsStore);
 
   const includeUnsupportedProxy = ref(false);
   const { copy, isSupported } = useClipboard();

src/locales/en.ts

@@ -897,6 +897,7 @@ export default {
     isSimpleShowRemarks: "Simple Mode Show items remarks",
     showFloatingRefreshButton: "Show floating refresh button",
     showFloatingAddButton: "Show floating add button",
+    displayPreviewInWebPage: 'Display preview in web page',
     tabBar: 'Hide "Sync" Page',
     tabBar2: 'Hide "File" Page',
     auto2: "MoreSetting Key",

src/locales/zh.ts

@@ -886,6 +886,7 @@ export default {
     isSimpleShowRemarks: '简洁模式列表展示备注',
     showFloatingRefreshButton: '显示悬浮刷新按钮',
     showFloatingAddButton: '显示悬浮添加按钮',
+    displayPreviewInWebPage: '在网页中预览',
     tabBar: '隐藏 "Gist 同步" 页',
     tabBar2: '隐藏 "文件" 页',
     auto2: '自定义设置 Key',

src/store/settings.ts

@@ -39,6 +39,7 @@ export const useSettingsStore = defineStore("settingsStore", {
         isSubItemMenuFold: true,
         showFloatingRefreshButton: false,
         showFloatingAddButton: false,
+        displayPreviewInWebPage: true,
         istabBar: false,
         istabBar2: false,
         subProgressStyle: "hidden",

src/types/store/settings.d.ts

@@ -34,6 +34,7 @@ interface SettingsPostData {
     isSubItemMenuFold?: boolean; // 订阅项菜单折叠
     showFloatingRefreshButton?: boolean; // 显示悬浮刷新按钮
     showFloatingAddButton?: boolean; // 显示悬浮添加按钮
+    displayPreviewInWebPage?: boolean; // 在网页中预览
     istabBar?: boolean; // 隐藏 "Gist 同步" 页
     istabBar2?: boolean; // 隐藏 "文件" 页
     subProgressStyle?: string; // 订阅进度样式

src/views/settings/moreSetting.vue

@@ -123,6 +123,16 @@
           />
         </template>
       </nut-cell>
+      <nut-cell :title="$t(`moreSettingPage.displayPreviewInWebPage`)" class="cell-item">
+        <template v-slot:link>
+          <nut-switch
+            class="my-switch"
+            v-model="awDisplayPreviewInWebPage"
+            size="mini"
+            @change="setDisplayPreviewInWebPage"
+          />
+        </template>
+      </nut-cell>
 
       <nut-cell :title="$t(`moreSettingPage.tabBar2`)" class="cell-item">
         <template v-slot:link>
@@ -282,6 +292,7 @@
   const awSimpleShowRemark = ref(false);
   const awShowFloatingRefreshButton = ref(false);
   const awShowFloatingAddButton = ref(true);
+  const awDisplayPreviewInWebPage = ref(true);
   const awtabBar = ref(true);
   const awtabBar2 = ref(true);
   // const isEditing = ref(false);
@@ -402,6 +413,13 @@
     changeAppearanceSetting({ appearanceSetting: data });
   };
 
+  const setDisplayPreviewInWebPage = (displayPreviewInWebPage: boolean) => {
+    const data = {
+      ...appearanceSetting.value,
+      displayPreviewInWebPage: displayPreviewInWebPage
+    }
+    changeAppearanceSetting({ appearanceSetting: data });
+  };
   const settabBar = (istabBar: boolean) => {
     // globalStore.settabBar(istabBar);
     const data = {
@@ -604,6 +622,7 @@
     awSimpleShowRemark.value = appearanceSetting.value.isSimpleShowRemark;
     awShowFloatingRefreshButton.value = appearanceSetting.value.showFloatingRefreshButton;
     awShowFloatingAddButton.value = appearanceSetting.value.showFloatingAddButton;
+    awDisplayPreviewInWebPage.value = appearanceSetting.value.displayPreviewInWebPage;
     awtabBar.value = appearanceSetting.value.istabBar;
     awtabBar2.value = appearanceSetting.value.istabBar2;
     subProgressStyleValue.value = [appearanceSetting.value.subProgressStyle];