xyyd
/
xyyd-fatfox
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/tomato'

This commit is contained in:
plightfield 2024-11-12 16:37:17 +08:00
parent 06f06a5b24 d89f7f3d8c
commit b65584e4af
14 changed files with 239 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/App.vue
View File

@ -34,13 +34,24 @@ const layout = useLayoutStore()
<SettingsOverlay />
<SettingsButton />
<Sider v-if="!layout.state.simple" />
<Sider
v-if="
!layout.state.simple ||
(layout.state.simple && settings.state.simpleModeShowString.includes('showSider'))
"
/>
<LoginModal v-if="router.path === 'global-login'" />
<Transition>
<Grid v-if="layout.ready && !layout.state.simple" />
</Transition>
<Dock v-if="!layout.state.simple" />
<div class="fixed z-40 right-[14%] top-8" v-if="!layout.state.simple">
<Dock
v-if="
!layout.state.simple ||
(layout.state.simple && settings.state.simpleModeShowString.includes('showDock'))
"
/>
<div class="fixed z-40 right-[14%] top-8" v-if="!layout.state.simple ||
(layout.state.simple && settings.state.simpleModeShowString.includes('showPet'))">
<Fox />
</div>
<DirModal />

7
src/GlobalModal.tsx
View File

@ -24,9 +24,10 @@ export default defineComponent(() => {
watch(router, () => {
full.value = false
})
return () => (
<div
class="fixed left-0 top-0 z-50 w-full"
class="fixed left-0 top-0 z-50 w-full"
onContextmenu={(e) => e.stopPropagation()}
onKeydown={(e) => e.stopPropagation()}
>
@ -42,10 +43,10 @@ export default defineComponent(() => {
)}
</Transition>
{/* 弹框主体 */}
<Transition name="modal">
<Transition >
{show.value && (
<div
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden transition-all"
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden "
style={{
width: full.value ? '100%' : '984px',
height: full.value ? '100vh' : '580px',

2
src/config.ts
View File

@ -15,7 +15,7 @@ export const ossCdnBase = import.meta.env.PROD ? ossBase : ossBase
// 后端地址
export const apiBase = import.meta.env.PROD
? 'http://106.15.37.113:8300'
? 'https://goosetab.com/api'
: 'http://192.168.110.28:8300'
// 后端 cdn 加速地址

89
src/layout/header/GlobalTime.tsx
View File

@ -44,40 +44,73 @@ export default defineComponent({
color: 'white',
transitionDuration: '.4s',
left: layout.isCompact ? '20px' : '50%',
top: layout.isCompact ? '20px' : layout.state.simple?'100px':'50px',
top: layout.isCompact ? '20px' : layout.state.simple ? '100px' : '50px',
transform: layout.isCompact ? '' : 'translate(-50%,0)'
}}
>
<Transition>
{settings.state.showTime && (
<div
class={
'transition-all ' +
(layout.isCompact ? 'text-[1.4rem] leading-[1.4rem]' : 'text-[8vh] leading-[4rem]')
}
>
{text.value.timeStr}
</div>
)}
{
layout.state.simple ?
settings.state.simpleModeShowString.includes('showTime') &&
<div
class={
'transition-all ' +
(layout.isCompact ? 'text-[1.4rem] leading-[1.4rem]' : 'text-[8vh] leading-[4rem]')
}
>
{text.value.timeStr}
</div>
:
settings.state!.showTime &&
<div
class={
'transition-all ' +
(layout.isCompact ? 'text-[1.4rem] leading-[1.4rem]' : 'text-[8vh] leading-[4rem]')
}
>
{text.value.timeStr}
</div>
}
</Transition>
<Transition>
{settings.state.showTime && (
<div
class={'flex items-center gap-4 mt-4 ' + (layout.isCompact ? '' : 'justify-center')}
>
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('week') && (
<div>星期{info.value.dayWeek}</div>
)}
</Transition>
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
<div>{info.value.day}</div>
)}
</Transition>
</div>
)}
{
layout.state.simple ?
settings.state.simpleModeShowString.includes('showDate') &&
<div
class={'flex items-center gap-4 mt-4 ' + (layout.isCompact ? '' : 'justify-center')}
>
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('week') && (
<div>星期{info.value.dayWeek}</div>
)}
</Transition>
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
<div>{info.value.day}</div>
)}
</Transition>
</div>
:
settings.state!.showTime &&
<div
class={'flex items-center gap-4 mt-4 ' + (layout.isCompact ? '' : 'justify-center')}
>
{settings.state.timeOptions.includes('date') && <div>{text.value.dateStr}</div>}
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('week') && (
<div>星期{info.value.dayWeek}</div>
)}
</Transition>
<Transition>
{!layout.isCompact && settings.state.timeOptions.includes('lunal') && (
<div>{info.value.day}</div>
)}
</Transition>
</div>
}
</Transition>
</div>
)

94
src/layout/header/ModeChange.tsx
View File

@ -1,16 +1,50 @@
import { addIcons, OhVueIcon } from "oh-vue-icons";
import { defineComponent, ref } from "vue";
import { BiEyeFill } from "oh-vue-icons/icons";
import { BiEyeSlashFill } from "oh-vue-icons/icons";
import { BiEyeSlashFill, MdMorevert } from "oh-vue-icons/icons";
import useLayoutStore from "../useLayoutStore";
import clsx from "clsx";
import useSettingsStore from "@/settings/useSettingsStore";
addIcons(BiEyeFill, BiEyeSlashFill)
import useSettingsStore, { SimpleShowStringType } from "@/settings/useSettingsStore";
import { Dropdown, type MenuProps } from "ant-design-vue";
addIcons(BiEyeFill, BiEyeSlashFill, MdMorevert)
const items: MenuProps['items'] = [
{
key: '1',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.antgroup.com">
1st menu item
</a>
),
},
{
key: '2',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.aliyun.com">
2nd menu item (disabled)
</a>
),
disabled: true,
},
{
key: '3',
label: (
<a target="_blank" rel="noopener noreferrer" href="https://www.luohanacademy.com">
3rd menu item (disabled)
</a>
),
disabled: true,
},
{
key: '4',
danger: true,
label: 'a danger item',
},
];
export default defineComponent(() => {
const layoutStore = useLayoutStore()
const settingStore = useSettingsStore()
const show = ref(false)
const showOptions = ref(false)
return () => (
<div class={"fixed w-[200px] h-[50px] text-white right-0 top-0 z-10 "}
@ -28,11 +62,53 @@ export default defineComponent(() => {
: '-top-[30px]'
: 'top-5'
)}>
<span class={"px-2 py-1 hover:bg-black/20 rounded cursor-pointer"}
onClick={() => {
layoutStore.state.simple = !layoutStore.state.simple
}}
>{layoutStore.state.simple ? '极简' : '常规'}</span>
<div class={"hover:bg-black/30 p-1 rounded"}>
<span class={"cursor-pointer relative"} onClick={(e) => {
e.stopPropagation()
showOptions.value = !showOptions.value
}}>
{
layoutStore.state.simple &&
<OhVueIcon name={MdMorevert.name} fill="white" class={"opacity-60"}></OhVueIcon>
}
{
showOptions.value
&&
<div class={"z-[100] bg-white/50 backdrop-blur-md p-2 w-[140px] absolute flex flex-col right-5 top-0 rounded-lg gap-y-1"}
v-outside-click={() => {
showOptions.value = false
}}>
{
SimpleShowStringType.map(item => (
<div class={clsx("flex items-center whitespace-nowrap py-1 rounded hover:text-[#333] justify-center",
settingStore.state.simpleModeShowString.includes(item.value) ?
"bg-black/20 text-[#333] " : "text-[#666]"
)}
onClick={(e) => {
e.stopPropagation()
settingStore.state.simpleModeShowString.includes(item.value) ?
settingStore.state.simpleModeShowString = settingStore.state.simpleModeShowString.filter(el => el !== item.value)
:
settingStore.state.simpleModeShowString.push(item.value)
}}
>
<span class={""}>{item.label}</span>
</div>
))
}
</div>
}
</span>
<span class={"px-2 py-[7px] hover:bg-black/20 opacity-60 rounded cursor-pointer"}
onClick={() => {
layoutStore.state.simple = !layoutStore.state.simple
}}
>{layoutStore.state.simple ? '极简' : '常规'}</span>
</div>
<div onClick={() => {
settingStore.state.showTop = settingStore.state.showTop === 'auto' ? 'show' : 'auto'
}}>

9
src/layout/header/search/SearchHistory.tsx
View File

@ -1,11 +1,10 @@
import { defineComponent } from 'vue'
import { OhVueIcon, addIcons } from 'oh-vue-icons'
import { MdHistory, MdRemove } from 'oh-vue-icons/icons'
import { MdHistory, MdRemove, RiCloseCircleLine } from 'oh-vue-icons/icons'
import useSearchConfigStore from './useSearchConfigStore'
import jump from '@/utils/jump'
import useSettingsStore from '@/settings/useSettingsStore'
addIcons(MdHistory)
addIcons(MdRemove)
addIcons(MdHistory, RiCloseCircleLine)
export default defineComponent(() => {
const searchConfig = useSearchConfigStore()
const settings = useSettingsStore()
@ -15,7 +14,7 @@ export default defineComponent(() => {
{searchConfig.history.map((item, idx) => (
<div
key={idx}
class="flex justify-between items-center text-black/80 cursor-pointer hover:bg-white/40 py-1 px-2 rounded transition-all"
class="flex justify-between hover:pl-[20px] duration-300 items-center text-black/80 cursor-pointer hover:bg-white/40 py-1 px-2 rounded transition-all"
onMousedown={() => {
jump(searchConfig.current.url + item)
}}
@ -34,7 +33,7 @@ export default defineComponent(() => {
searchConfig.removeHistory(idx)
}}
>
<OhVueIcon name="md-remove" />
<OhVueIcon name={RiCloseCircleLine.name} />
</div>
</div>
))}

17
src/layout/header/search/SearchSuggestion.tsx
View File

@ -23,7 +23,7 @@ export const Item = defineComponent({
return () => (
<div
class={
'flex justify-between items-center text-black/80 cursor-pointer py-1 px-2 rounded transition-all ' +
'flex justify-between hover:pl-[20px] duration-300 mt-1 items-center text-black/80 cursor-pointer py-1 px-2 rounded transition-all ' +
(props.current === props.num ? 'bg-white/40' : 'hover:bg-white/40')
}
onClick={() => {
@ -46,12 +46,12 @@ export default defineComponent(() => {
const searchConfig = useSearchConfigStore()
return () => (
<div class="absolute left-0 -bottom-2 translate-y-full w-full rounded-lg bg-white/60 backdrop-blur shadow-lg p-4">
<div class="absolute left-0 -bottom-2 translate-y-full w-full rounded-lg bg-[#fffc] backdrop-blur-[10px] shadow-lg p-4">
<Item
prefix={aIUrl}
path={search.searchStr}
label="AI搜索："
icon={<img class="w-4 h-4" src="/searchIcons/mita.jpg" alt="mita" />}
icon={<img class="w-4 h-4" src="/tab/searchIcons/mita.jpg" alt="mita" />}
current={search.current}
num={0}
/>
@ -59,10 +59,19 @@ export default defineComponent(() => {
prefix={translateUrl}
path={search.searchStr}
label="AI翻译："
icon={<img class="w-4 h-4" src="/searchIcons/translate.png" alt="translate" />}
icon={<img class="w-4 h-4" src="/tab/searchIcons/translate.png" alt="translate" />}
current={search.current}
num={1}
/>
{
search.addList.map((el, idx) => (
<div class={"flex justify-start mt-1 gap-x-2 cursor-pointer items-center w-full bg-white py-[5px] px-2 rounded-lg transition-all"} key={idx}>
<img src={el.icon} alt='icon' class={"w-[20px] h-[20px] "}></img>
<span class={"whitespace-nowrap text-[12px] text-[#333] w-0 flex-1 overflow-hidden text-ellipsis"}>{el.name}</span>
<button class={"flex items-center justify-center bg-[#337aff] w-[72px] h-[26px] text-white rounded text-[14px]"}>立即打开</button>
</div>
))
}
{search.sugList.map((el, idx) => (
<Item
key={idx}

8
src/layout/header/search/useSearchConfigStore.ts
View File

@ -12,25 +12,25 @@ const defaultSearchList: SearchInfo[] = [
{
name: '百度',
url: 'https://www.baidu.com/s?wd=',
icon: 'tab/searchIcons/baidu.png',
icon: import.meta.env.PROD ? '/tab/searchIcons/baidu.png' : 'tab/searchIcons/baidu.png',
show: true
},
{
name: '必应',
url: 'https://cn.bing.com/search?q=',
icon: 'tab/searchIcons/bing.png',
icon: import.meta.env.PROD ? '/tab/searchIcons/bing.png' : 'tab/searchIcons/bing.png',
show: true
},
{
name: '谷歌',
url: 'https://www.google.com/search?q=',
icon: 'tab/searchIcons/google.png',
icon: import.meta.env.PROD ? '/tab/searchIcons/google.png' : 'tab/searchIcons/google.png',
show: true
},
{
name: '360',
url: 'https://www.so.com/s?q=',
icon: 'tab/searchIcons/360.png',
icon: import.meta.env.PROD ? '/tab/searchIcons/360.png' : 'tab/searchIcons/360.png',
show: true
}

7
src/layout/header/search/useSearchStore.ts
View File

@ -55,8 +55,10 @@ export default defineStore('search', () => {
)
const debouncedHandler = debounce((newValue) => {
console.log('数值改变并已防抖处理:', newValue)
request<SearchAdType[]>("GET", `/api/app/searchBars`).then((res) => {
request<SearchAdType[]>("GET", `/api/app/searchBars?keyword=${newValue || 'undefine'}`).then((res) => {
addList.value = res
console.log(addList.value);
})
}, 500) //
watch(searchStr, (newValue) => {
@ -111,6 +113,7 @@ export default defineStore('search', () => {
focus,
showSearchConfig,
current,
sugList
sugList, addList
}
})

7
src/main.css
View File

@ -163,19 +163,16 @@ body {
.modal-enter-active,
.modal-leave-active {
transition:
transform 0.3s ease-in-out,
opacity 0.3s ease-in-out;
transform 2s ease-in-out,
opacity 2s ease-in-out;
}
.modal-enter-from {
transform: translate(-50%, -60%);
opacity: 0;
}
.modal-leave-to {
transform: translate(-50%, -40%);
opacity: 0;
}
/* 设置框动画 */
.settings-enter-active,
.settings-leave-active {

9
src/settings/SettingsOverlay.tsx
View File

@ -100,12 +100,17 @@ export default defineComponent(() => {
</div>
) : (
<div
class={'px-7 py-2 rounded-md cursor-pointer'}
class={'px-7 py-2 rounded-md text-white cursor-pointer'}
style={{
background: 'linear-gradient(180deg,#ffaa4e 0%,#ff6227 100%)'
}}
onClick={() => {
router.go('settings-user')
if (profile.id) {
router.go('settings-user')
}else {
router.go('global-login')
}
// router.go('settings-user')
}}
>
登录注册

30
src/settings/useSettingsStore.ts
View File

@ -3,6 +3,32 @@ import { computed, reactive } from 'vue'
export type VisibleState = 'show' | 'auto' | ''
export type TimeUnit = 'date' | 'week' | '12hour' | 'lunal' | 'second'
export const SimpleShowStringType = [{
label: "侧边栏",
value: 'showSider',
},
{
label: "底部栏",
value: 'showDock',
},
{
label: "时间",
value: 'showTime',
}, {
label: "日期",
value: 'showDate',
}, {
label: "AI助手",
value: 'showPet',
}
]
type SimpleValueType = typeof SimpleShowStringType[number]['value'];
export default defineStore(
'settings',
() => {
@ -33,7 +59,9 @@ export default defineStore(
// 侧边栏
siderDirection: 'left' as 'left' | 'right',
// 禁用快捷键
disabledShortcut: false
disabledShortcut: false,
// 极简模式显式
simpleModeShowString: ['showTime', 'showDate'] as SimpleValueType[]
})
return { state, blockInner: computed(() => state.blockSize - 2 * state.blockPadding) }
},

1
src/widgets/discount/Middle.tsx
View File

@ -14,6 +14,7 @@ export default defineComponent(() => {
idx.value = 0
}
}, 5000)
})
return () => (
<div class="w-full h-full bg-[#ecfbff] flex flex-col" style={{

18
src/widgets/work/useTomatoStore.ts
View File

@ -51,9 +51,7 @@ export default defineStore("work", () => {
const audio = new Audio()
const time = useTimeStore()
const remainingTime = computed(() => {
if (!state.isStart) {
return 0
}
return dayjs(state.beginTime).add(1, 'minute').diff(dayjs(time.date), 'second')
})
@ -61,11 +59,7 @@ export default defineStore("work", () => {
state.isStart = false
state.beginTime = -1
stopMusic()
if (remainingTime.value <= 0) {
state.timeList.push(
dayjs().valueOf()
)
}
}
const togglePlay = () => {
if (state.isPlaying) {
@ -97,10 +91,16 @@ export default defineStore("work", () => {
}
watch(remainingTime, (val) => {
if (val <= 0) {
if (val < 0) {
stopTomatoTime()
}
if (remainingTime.value === 0) {
state.timeList.push(
dayjs().valueOf()
)
}
})
const openShowModel = ref<undefined | null | TomatoTarget>()
const openFullscreen = ref(false)