save

src/App.vue

@@ -32,52 +32,52 @@ const layout = useLayoutStore()
 </script>
 <template>
   <!-- <ConfigProvider :locale="zhCN"> -->
-    <div class="fixed left-0 top-0 w-full h-screen style-root" @contextmenu.prevent>
+  <div class="fixed left-0 top-0 w-full h-screen style-root" @contextmenu.prevent>
-      <Header />
+    <Header />
-      <Background
+    <Background
-        @dblclick="
+      @dblclick="
-          () => {
+        () => {
-            layout.state.simple = !layout.state.simple
+          layout.state.simple = !layout.state.simple
-          }
+        }
-        "
+      "
-      />
+    />
-      <GLobalModal />
+    <GLobalModal />
-      <SettingsOverlay />
+    <SettingsOverlay />
-      <SettingsButton />
+    <SettingsButton />
 
-      <Sider
+    <Sider
-        v-if="
+      v-if="
-          !layout.state.simple ||
+        !layout.state.simple ||
-          (layout.state.simple && settings.state.simpleModeShowString.includes('showSider'))
+        (layout.state.simple && settings.state.simpleModeShowString.includes('showSider'))
-        "
+      "
-      />
+    />
-      <LoginModal v-if="router.path === 'global-login'" />
+    <LoginModal v-if="router.path === 'global-login'" />
-      <Transition>
+    <Transition>
-        <Grid v-if="layout.ready && !layout.state.simple" />
+      <Grid v-if="layout.ready && !layout.state.simple" />
-      </Transition>
+    </Transition>
-      <Dock
+    <Dock
-        v-if="
+      v-if="
-          !layout.state.simple ||
+        !layout.state.simple ||
-          (layout.state.simple && settings.state.simpleModeShowString.includes('showDock'))
+        (layout.state.simple && settings.state.simpleModeShowString.includes('showDock'))
-        "
+      "
-      />
+    />
-      <div
+    <div
-        class="fixed z-40 right-[14%] top-8"
+      class="fixed z-40 right-[14%] top-8"
-        v-if="
+      v-if="
-          !layout.state.simple ||
+        (!layout.state.simple && settings.state.showPet) ||
-          (layout.state.simple && settings.state.simpleModeShowString.includes('showPet'))
+        (layout.state.simple && settings.state.simpleModeShowString.includes('showPet'))
-        "
+      "
-      >
+    >
-        <Fox />
+      <Fox />
-      </div>
-      <DirModal />
-      <GlobalMenu />
-      <WelcomePage></WelcomePage>
-      <TomatoPage></TomatoPage>
-
-      <BackupRecovery v-if="router.path === 'global-backup'"></BackupRecovery>
     </div>
-    <ModalPgae />
+    <DirModal />
+    <GlobalMenu />
+    <WelcomePage></WelcomePage>
+    <TomatoPage></TomatoPage>
+
+    <BackupRecovery v-if="router.path === 'global-backup'"></BackupRecovery>
+  </div>
+  <ModalPgae />
   <!-- </ConfigProvider> -->
 </template>
 

src/layout/grid/AiSetting.tsx

@@ -0,0 +1,157 @@
+import SettingItem from '@/settings/SettingItem'
+import useSettingsStore from '@/settings/useSettingsStore'
+import { Radio, Switch } from 'ant-design-vue'
+import clsx from 'clsx'
+import { defineComponent, watch } from 'vue'
+import useLayoutStore from '../useLayoutStore'
+import { sendParent } from '@/utils/parent'
+
+export default defineComponent({
+  setup() {
+    const settings = useSettingsStore()
+    const layout = useLayoutStore()
+    watch(
+      () => ({
+        autoSearch: settings.state.autoUseAi === 'show',
+        showTabButton: settings.state.showPetOnTab,
+        isSearch: settings.state.autoUseAi === ''
+      }),
+      (val) => {
+        console.log(val)
+        sendParent([
+          'configAI',
+          {
+            autoSearch: val.autoSearch,
+            showTabButton: val.showTabButton,
+            isSearch: val.isSearch
+          }
+        ])
+      },
+      {
+        immediate: true
+      }
+    )
+    return () => (
+      <div class="p-4 flex flex-col  ">
+        <div class={'flex flex-col'}>
+          <span
+            class={clsx(
+              'text-[14px] font-bold',
+              useLayoutStore().state.current === 0 ? 'text-white' : ' text-[#333]'
+            )}
+          >
+            AI助手
+          </span>
+          <span class={'text-[13px] text-[#666] '}>设置AI助手样式</span>
+          <div
+            class={clsx(
+              'w-full h-[1px] bg-black/10 mt-1 mb-2',
+              useLayoutStore().state.current === 0 ? 'bg-white/10' : ' bg-black/10'
+            )}
+          ></div>
+        </div>
+        <span
+          class={clsx(
+            'text-[14px] font-bold my-2',
+            useLayoutStore().state.current === 0 ? 'text-white' : 'text-[#333]'
+          )}
+        >
+          功能开关
+        </span>
+        <SettingItem
+          v-slots={{
+            label: () => <div>标签页助手</div>
+          }}
+          noRoundedB
+          desc="fatfox标签页内的小助手"
+        >
+          <Switch
+            checked={settings.state.showPet}
+            onUpdate:checked={(e) => {
+              if (e) settings.state.showPet = true
+              else settings.state.showPet = false
+            }}
+          />
+        </SettingItem>
+        <SettingItem
+          v-slots={{
+            label: () => <div>标签页助手</div>
+          }}
+          desc="fatfox标签页内的小助手"
+          noRoundedT
+        >
+          <Switch
+            checked={settings.state.showPetOnTab}
+            onUpdate:checked={(e) => {
+              if (e) settings.state.showPetOnTab = true
+              else settings.state.showPetOnTab = false
+            }}
+          />
+        </SettingItem>
+        <span
+          class={clsx(
+            'text-[14px] font-bold my-2',
+            useLayoutStore().state.current === 0 ? 'text-white' : 'text-[#333]'
+          )}
+        >
+          结果增强
+        </span>
+        <SettingItem
+          v-slots={{
+            label: () => <div>结果增强开关</div>
+          }}
+          desc="使用搜索引擎时，Fatfox会给您更多有效的结果"
+        >
+          <Switch
+            checked={settings.state.autoUseAi !== ''}
+            onUpdate:checked={(e) => {
+              if (e) settings.state.autoUseAi = 'show'
+              else settings.state.autoUseAi = ''
+            }}
+          />
+        </SettingItem>
+
+        <div
+          class={clsx('flex  w-full py-2 px-3 rounded-lg flex-col', {
+            'bg-black/5': useLayoutStore().state.current !== 0,
+            'bg-white/10': useLayoutStore().state.current === 0
+          })}
+        >
+          <span>何时使用结果增强</span>
+          <SettingItem
+            v-slots={{
+              label: () => <div>每次询问</div>
+            }}
+            noBg
+            desc="每次搜索直接询问fatfox"
+          >
+            <Radio
+              checked={settings.state.autoUseAi === 'show'}
+              onClick={() => {
+                settings.state.autoUseAi = 'show'
+              }}
+              onUpdate:checked={(e) => {
+                if (e) settings.state.showSider = 'auto'
+                else settings.state.showSider = 'show'
+              }}
+            />
+          </SettingItem>
+          <SettingItem
+            v-slots={{
+              label: () => <div>手动询问</div>
+            }}
+            noBg
+            desc="每次搜索，提示您进行手动查询"
+          >
+            <Radio
+              checked={settings.state.autoUseAi === 'auto'}
+              onClick={() => {
+                settings.state.autoUseAi = 'auto'
+              }}
+            />
+          </SettingItem>
+        </div>
+      </div>
+    )
+  }
+})

src/settings/SettingItem.tsx

@@ -15,6 +15,9 @@ export default defineComponent({
     noBg: {
       type: Boolean,
       default: false
+    },
+    desc: {
+      type: String
     }
   },
   slots: {} as SlotsType<{
@@ -39,8 +42,17 @@ export default defineComponent({
           marginBottom: props.noRoundedB ? 0 : '12px'
         }}
       >
-        <div class={clsx('text-sm  mr-4', isGame.value ? 'text-white' : 'text-black/60')}>
+        <div
-          {ctx.slots.label?.()}
+          class={clsx('text-sm  mr-4 flex flex-col', isGame.value ? 'text-white' : 'text-black/60')}
+        >
+          <span> {ctx.slots.label?.()}</span>
+          {props.desc ? (
+            <span
+              class={clsx('text-[12px] ', isGame.value ? 'text-white opacity-50 ' : 'text-black/60')}
+            >
+              {props.desc}
+            </span>
+          ) : null}
         </div>
         <div class="">{ctx.slots.default?.()}</div>
         {/* {ctx.slots.end?.()} */}

src/settings/SettingsOverlayContent.tsx

@@ -10,6 +10,7 @@ import SiderSetting from '@/layout/grid/SiderSetting'
 import DockSetting from '@/layout/grid/DockSetting'
 import Feedback from '@/layout/grid/Feedback'
 import Reset from '@/layout/grid/Reset'
+import AiSetting from '@/layout/grid/AiSetting'
 
 export default defineComponent(() => {
   const router = useRouterStore()
@@ -35,6 +36,8 @@ export default defineComponent(() => {
           <Reset />
         ) : router.path === 'settings-fallback' ? (
           <Feedback />
+        ) : router.path === 'settings-ai' ? (
+          <AiSetting />
         ) : null}
       </ThemeProvider>
     </div>

src/settings/useSettingsStore.ts

@@ -40,7 +40,9 @@ export default defineStore(
       // 显示隐藏
       showSider: 'show' as VisibleState,
       showDock: 'show' as VisibleState,
-      showPet: 'show' as VisibleState,
+      showPet: true,
+      showPetOnTab: true,
+      autoUseAi: 'show' as VisibleState,
       showTop: 'show' as VisibleState,
       showTime: true,
       timeOptions: ['date', 'week', '12hour', 'lunal', 'second'] as TimeUnit[],

src/utils/parent.ts

@@ -7,8 +7,9 @@ export function sendParent(
     | [
         'configAI',
         {
-          autoSearch: true
+          autoSearch: boolean
-          showTabButton: true
+          showTabButton: boolean
+          isSearch: boolean
         }
       ]
 ) {

src/widgets/discount/Modal.tsx

@@ -29,10 +29,13 @@ export default defineComponent(() => {
   }, 500) //
   watch(searchText, (newValue) => {
     debouncedHandler(newValue)
+  }, {
+    immediate: true
   })
   onMounted(() => {
     store.state.pageIndex = 1
     store.getNews()
+    searchText.value = ''
   })
   return () => (
     <div
@@ -59,6 +62,10 @@ export default defineComponent(() => {
             }}
           ></input>
           <div
+            onClick={(e) => {
+              e.stopPropagation()
+              searchText.value = ''
+            }}
             class={
               'absolute cursor-pointer hidden group-hover:block right-3 top-1/2 -translate-y-1/2'
             }