推荐优化

2024-03-18 19:42:31 +08:00
parent 2ba841c8f2
commit 1d2b708682
4 changed files with 69 additions and 43 deletions
--- a/public/openai-up.ico
+++ b/public/openai-up.ico
--- a/src/biz/Body.tsx
+++ b/src/biz/Body.tsx
@@ -18,6 +18,7 @@ import {
  AiOutlineCloseCircle,
  BsDashSquare,
  BsPlusSquare,
+  FaGripfire,
  FaQuestion,
  FaRegArrowAltCircleDown,
  IoWarning,
@@ -71,7 +72,7 @@ const Body = () => {
  const title = useAppSelector(state => state.env.title)
  const fontSize = useAppSelector(state => state.env.envData.fontSize)
  const searchText = useAppSelector(state => state.env.searchText)
-  const recommendIdx = useMemo(() => random(0, 2), [])
+  const recommendIdx = useMemo(() => random(0, 3), [])
  const showSearchInput = useMemo(() => {
    return (segments != null && segments.length > 0) && (envData.searchEnabled ? envData.searchEnabled : (envData.askEnabled ?? ASK_ENABLED_DEFAULT))
  }, [envData.askEnabled, envData.searchEnabled, segments])
@@ -209,7 +210,7 @@ const Body = () => {
  // 自动滚动
  useEffect(() => {
    if (checkAutoScroll && curOffsetTop && autoScroll && !needScroll) {
-      if (bodyRef.current.scrollTop <= curOffsetTop - bodyRef.current.offsetTop - (totalHeight-120) + (floatKeyPointsSegIdx != null ? 100 : 0) ||
+      if (bodyRef.current.scrollTop <= curOffsetTop - bodyRef.current.offsetTop - (totalHeight-160) + (floatKeyPointsSegIdx != null ? 100 : 0) ||
        bodyRef.current.scrollTop >= curOffsetTop - bodyRef.current.offsetTop - 40 - 10
      ) {
        dispatch(setNeedScroll(true))
@@ -348,6 +349,11 @@ const Body = () => {
                 e.preventDefault()
                 openUrl('https://microsoftedge.microsoft.com/addons/detail/galeejdehabppfgooagmkclpppnbccpc')
               }} className='link text-sm text-accent'>Edge商店</a>
+            <a title='Crx搜搜(国内可访问)' href='https://www.crxsoso.com/webstore/detail/fiaeclpicddpifeflpmlgmbjgaedladf'
+               onClick={(e) => {
+                 e.preventDefault()
+                 openUrl('https://www.crxsoso.com/webstore/detail/fiaeclpicddpifeflpmlgmbjgaedladf')
+               }} className='link text-sm text-accent'>Crx搜搜(国内可访问)</a>
          </div>
        </div>
        <div className='flex flex-col items-center text-center py-2 mx-4 border-t border-t-base-300'>
@@ -362,6 +368,12 @@ const Body = () => {
                 e.preventDefault()
                 openUrl('https://chromewebstore.google.com/detail/mcijpllinkhflgpkggimnafkbmpiijah')
               }} className='link text-sm text-accent'>Chrome商店</a>
+            <a title='Crx搜搜(国内可访问)'
+               href='https://www.crxsoso.com/webstore/detail/mcijpllinkhflgpkggimnafkbmpiijah'
+               onClick={(e) => {
+                 e.preventDefault()
+                 openUrl('https://www.crxsoso.com/webstore/detail/mcijpllinkhflgpkggimnafkbmpiijah')
+               }} className='link text-sm text-accent'>Crx搜搜(国内可访问)</a>
          </div>
        </div>
      </div>}
@@ -371,7 +383,7 @@ const Body = () => {
    <div className='p-0.5' style={{
      height: `${RECOMMEND_HEIGHT}px`
    }}>
-      {recommendIdx === 0 && <div className='flex items-center gap-1 rounded shadow-sm bg-base-200/10'>
+      {recommendIdx === 0 && <div className='flex items-center gap-1.5 rounded shadow-sm bg-base-200/10'>
        <a className='link link-accent link-hover font-semibold text-sm flex items-center' onClick={(e) => {
          e.preventDefault()
          openUrl('https://bibigpt.co/r/bilibili')
@@ -398,6 +410,15 @@ const Body = () => {
                className='w-8 h-8'/>Immersive Summary</a>
        <span className='text-sm desc'>沉浸式总结网页文章。</span>
      </div>}
+      {recommendIdx === 3 && <div className='flex items-center gap-1 rounded shadow-sm bg-base-200/10'>
+        <a className='link link-accent link-hover font-semibold text-sm flex items-center' onClick={(e) => {
+          e.preventDefault()
+          openUrl('https://api.openai-up.com/register?aff=varM')
+        }}><img src='/openai-up.ico'
+                alt='Openai Up logo'
+                className='w-8 h-8'/>Openai代理</a>
+        <span className='text-sm desc flex items-center'>目前价格不到官方的6折<FaGripfire className='text-amber-600'/></span>
+      </div>}
    </div>
  </div>
 }
--- a/src/biz/Settings.tsx
+++ b/src/biz/Settings.tsx
@@ -13,7 +13,6 @@ import {
  PAGE_MAIN,
  PROMPT_DEFAULTS,
  PROMPT_TYPES,
-  SERVER_URL_THIRD,
  SUMMARIZE_LANGUAGE_DEFAULT,
  TRANSLATE_FETCH_DEFAULT,
  TRANSLATE_FETCH_MAX,
@@ -21,7 +20,7 @@ import {
  TRANSLATE_FETCH_STEP,
  WORDS_RATE,
 } from '../const'
-import {IoWarning} from 'react-icons/all'
+import {FaGripfire, IoWarning} from 'react-icons/all'
 import classNames from 'classnames'
 import toast from 'react-hot-toast'
 import {useBoolean, useEventTarget} from 'ahooks'
@@ -210,7 +209,7 @@ const Settings = () => {
            <button onClick={onSelFontSize2} className={classNames('btn btn-xs no-animation', fontSizeValue === 'large'?'btn-active':'')}>加大</button>
          </div>
        </FormItem>
-        <FormItem title='AI类型' tip='不同AI质量可能有差异'>
+        <FormItem title='AI类型' tip='OPENAI质量更高'>
          <div className="btn-group">
            <button onClick={onSelOpenai} className={classNames('btn btn-xs no-animation', (!aiTypeValue || aiTypeValue === 'openai')?'btn-active':'')}>OpenAI</button>
            <button onClick={onSelGemini} className={classNames('btn btn-xs no-animation', aiTypeValue === 'gemini'?'btn-active':'')}>Gemini</button>
@@ -220,35 +219,41 @@ const Settings = () => {

      {(!aiTypeValue || aiTypeValue === 'openai') && <Section title='openai配置'>
        <FormItem title='ApiKey' htmlFor='apiKey'>
-          <input id='apiKey' type='text' className='input input-sm input-bordered w-full' placeholder='sk-xxx' value={apiKeyValue} onChange={onChangeApiKeyValue}/>
+          <input id='apiKey' type='text' className='input input-sm input-bordered w-full' placeholder='sk-xxx'
+                 value={apiKeyValue} onChange={onChangeApiKeyValue}/>
        </FormItem>
        <FormItem title='服务器' htmlFor='serverUrl'>
-          <input id='serverUrl' type='text' className='input input-sm input-bordered w-full' placeholder='服务器地址,默认使用官方地址' value={serverUrlValue} onChange={e => setServerUrlValue(e.target.value)}/>
+          <input id='serverUrl' type='text' className='input input-sm input-bordered w-full'
+                 placeholder='默认使用官方地址' value={serverUrlValue}
+                 onChange={e => setServerUrlValue(e.target.value)}/>
        </FormItem>
-        <div className='flex justify-center'>
-          <a className='link text-xs' onClick={toggleMoreFold}>{moreFold?'点击查看说明':'点击折叠说明'}</a>
+        <div>
+          <div className='desc text-xs text-center'>
+            <div className='flex justify-center font-semibold'>【官方地址】</div>
+            <div>官方网址：<a className='link link-primary' href='https://platform.openai.com/' target='_blank'
+                             rel="noreferrer">点击访问</a></div>
+            <div>服务器地址：<a className='link link-primary'
+                               onClick={() => setServerUrlValue('https://api.openai.com')}
+                               rel='noreferrer'>点击设置</a></div>
+            <div className='flex justify-center font-semibold'>【第三方代理】</div>
+            <div>代理网址：<a className='link link-primary' href='https://api.openai-up.com/register?aff=varM'
+                             target='_blank'
+                             rel="noreferrer">点击访问</a></div>
+            <div>服务器地址：<a className='link link-primary'
+                               onClick={() => setServerUrlValue('https://api.openai-up.com')}
+                               rel='noreferrer'>点击设置</a></div>
+            <div className='text-amber-600 flex justify-center items-center'><FaGripfire/>目前价格不到官方价格的6折<FaGripfire/></div>
+          </div>
        </div>
-        {!moreFold && <div>
-          <ul className='pl-3 list-decimal desc text-xs'>
-            <li>官方服务器需要科学上网才能访问</li>
-            <li>官方网址：<a className='link' href='https://platform.openai.com/' target='_blank' rel="noreferrer">openai.com</a></li>
-            <li>支持官方代理(使用官方ApiKey)：<a className='link' onClick={() => setServerUrlValue(SERVER_URL_THIRD)} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://api2d.com/' target='_blank' rel="noreferrer">api2d</a> | <a className='link' onClick={() => setServerUrlValue('https://openai.api2d.net')} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://openaimax.com/' target='_blank' rel="noreferrer">OpenAI-Max</a> | <a className='link' onClick={() => setServerUrlValue('https://api.openaimax.com')} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://openai-sb.com/' target='_blank' rel="noreferrer">OpenAI-SB</a> | <a className='link' onClick={() => setServerUrlValue('https://api.openai-sb.com')} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://www.ohmygpt.com/' target='_blank' rel="noreferrer">OhMyGPT</a> | <a className='link' onClick={() => setServerUrlValue('https://api.ohmygpt.com')} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://aiproxy.io/' target='_blank' rel="noreferrer">AIProxy</a> | <a className='link' onClick={() => setServerUrlValue('https://api.aiproxy.io')} rel='noreferrer'>点击设置</a></li>
-            <li>支持代理(配合ApiKey)：<a className='link' href='https://key-rental.bowen.cool/' target='_blank' rel="noreferrer">Key Rental</a> | <a className='link' onClick={() => setServerUrlValue('https://key-rental-api.bowen.cool/openai')} rel='noreferrer'>点击设置</a></li>
-            <li>支持其他第三方代理，有问题可加群交流</li>
-          </ul>
-        </div>}
        <FormItem title='模型选择' htmlFor='modelSel' tip='注意，不同模型有不同价格与token限制'>
-          <select id='modelSel' className="select select-sm select-bordered" value={modelValue} onChange={onChangeModelValue}>
+          <select id='modelSel' className="select select-sm select-bordered" value={modelValue}
+                  onChange={onChangeModelValue}>
            {MODELS.map(model => <option key={model.code} value={model.code}>{model.name}</option>)}
          </select>
        </FormItem>
        <div className='flex justify-center'>
-          <a className='link text-xs' onClick={togglePromptsFold}>{promptsFold?'点击查看提示词':'点击折叠提示词'}</a>
+          <a className='link text-xs'
+             onClick={togglePromptsFold}>{promptsFold ? '点击查看提示词' : '点击折叠提示词'}</a>
        </div>
        {!promptsFold && <div>
          {PROMPT_TYPES.map((item, idx) => <FormItem key={item.type} title={<div>
@@ -257,16 +262,18 @@ const Settings = () => {
              setPromptsValue({
                ...promptsValue,
                // @ts-expect-error
-                [item.type]: PROMPT_DEFAULTS[item.type]??''
+                [item.type]: PROMPT_DEFAULTS[item.type] ?? ''
              })
-            }}>点击填充默认</div>
+            }}>点击填充默认
+            </div>
          </div>} htmlFor={`prompt-${item.type}`}>
-            <textarea id={`prompt-${item.type}`} className='mt-2 textarea input-bordered w-full' placeholder='留空使用默认提示词' value={promptsValue[item.type]??''} onChange={(e) => {
-              setPromptsValue({
-                ...promptsValue,
-                [item.type]: e.target.value
-              })
-            }}/>
+            <textarea id={`prompt-${item.type}`} className='mt-2 textarea input-bordered w-full'
+                      placeholder='留空使用默认提示词' value={promptsValue[item.type] ?? ''} onChange={(e) => {
+                        setPromptsValue({
+                          ...promptsValue,
+                          [item.type]: e.target.value
+                        })
+                      }}/>
          </FormItem>)}
        </div>}
      </Section>}
@@ -276,15 +283,14 @@ const Settings = () => {
          <input id='geminiApiKey' type='text' className='input input-sm input-bordered w-full' placeholder='xxx'
                 value={geminiApiKeyValue} onChange={onChangeGeminiApiKeyValue}/>
        </FormItem>
-        <div className='flex justify-center'>
-          <a className='link text-xs' onClick={toggleMoreFold}>{moreFold ? '点击查看说明' : '点击折叠说明'}</a>
+        <div>
+          <div className='desc text-xs'>
+            <div>官方网址：<a className='link link-primary' href='https://makersuite.google.com/app/apikey' target='_blank'
+                            rel="noreferrer">Google AI Studio</a> (目前免费)
+            </div>
+            <div className='text-xs text-error flex items-center'><IoWarning className='text-sm text-warning'/>谷歌模型安全要求比较高，有些视频可能无法生成总结!</div>
+          </div>
        </div>
-        {!moreFold && <div>
-          <ul className='pl-3 list-decimal desc text-xs'>
-            <li>官方网址：<a className='link' href='https://makersuite.google.com/app/apikey' target='_blank'
-                            rel="noreferrer">Google AI Studio</a> (目前免费)</li>
-          </ul>
-        </div>}
        <div className='flex justify-center'>
          <a className='link text-xs'
             onClick={togglePromptsFold}>{promptsFold ? '点击查看提示词' : '点击折叠提示词'}</a>
--- a/src/const.tsx
+++ b/src/const.tsx
@@ -170,7 +170,6 @@ export const SUMMARIZE_LANGUAGE_DEFAULT = 'cn'
 export const SUMMARIZE_ALL_THRESHOLD = 5
 export const ASK_ENABLED_DEFAULT = true
 export const SERVER_URL_OPENAI = 'https://api.openai.com'
-export const SERVER_URL_THIRD = 'https://op.kongkongye.com'

 export const MODELS = [{
  code: 'gpt-3.5-turbo',