设置-缺少重置功能
This commit is contained in:
expdsn
parent
6dc7b86370
commit
b3fa5b1e91
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
|
|
@ -1,4 +1,4 @@
|
|||
import { Button, Select, Slider } from 'ant-design-vue'
|
||||
import { Button, Slider } from 'ant-design-vue'
|
||||
import { defineComponent, ref, Transition, watch } from 'vue'
|
||||
import useLayoutStore from '../useLayoutStore'
|
||||
import { DownloadOutlined, EyeInvisibleOutlined, SwapOutlined } from '@ant-design/icons-vue'
|
||||
|
|
@ -23,7 +23,7 @@ export default defineComponent(() => {
|
|||
const settings = useSettingsStore()
|
||||
return () => (
|
||||
<div class="absolute left-0 top-0 w-full h-full p-4 overflow-y-auto scrollbar-hide">
|
||||
<SettingItem
|
||||
{/* <SettingItem
|
||||
noBg
|
||||
v-slots={{
|
||||
label: () => <div>所属模式</div>
|
||||
|
|
@ -38,7 +38,7 @@ export default defineComponent(() => {
|
|||
]}
|
||||
v-model:value={selected.value}
|
||||
/>
|
||||
</SettingItem>
|
||||
</SettingItem> */}
|
||||
<div class="px-4">
|
||||
<div class="h-[180px]">
|
||||
{layout.background.video && layout.background.type !== 'own' ? (
|
||||
|
|
|
|||
|
|
@ -1,23 +1,65 @@
|
|||
import SettingItem from '@/settings/SettingItem'
|
||||
import useSettingsStore from '@/settings/useSettingsStore'
|
||||
import { Button, Switch } from 'ant-design-vue'
|
||||
import { Button, Modal, Switch } from 'ant-design-vue'
|
||||
import clsx from 'clsx'
|
||||
import { defineComponent } from 'vue'
|
||||
import { computed, defineComponent, ref } from 'vue'
|
||||
import useLayoutStore from '../useLayoutStore'
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const settings = useSettingsStore()
|
||||
const open = ref(false)
|
||||
const layout = useLayoutStore()
|
||||
const isGame = computed(() => {
|
||||
return layout.state.current === 0
|
||||
})
|
||||
return () => (
|
||||
<div class="p-4 flex flex-col ">
|
||||
<SettingItem
|
||||
v-slots={{
|
||||
label: () => <div>重置</div>
|
||||
label: () => <div >重置</div>
|
||||
}}
|
||||
>
|
||||
<Button type="primary">立即重置</Button>
|
||||
<Button type="primary" onClick={() => {
|
||||
open.value = true
|
||||
}}>立即重置</Button>
|
||||
</SettingItem>
|
||||
<p class={'text-[#666] text-[12px]'}>将会把您的历史调整清空，恢复成最初的样式</p>
|
||||
{
|
||||
open.value &&
|
||||
<div class={"w-[300px] h-[210px] absolute rounded-2xl right-[-310px] z-10 bg-[#2c2e3e]"} style={
|
||||
isGame.value ?
|
||||
{
|
||||
backgroundImage: `url('/tab/bg/addBorder.png')`,
|
||||
backgroundSize: '100% 100%',
|
||||
backgroundColor: '#2c2e3e'
|
||||
} : {}}>
|
||||
|
||||
<div class={"flex flex-col w-full h-full p-7 border-b-[1px] items-center justify-between"}>
|
||||
<span class={isGame.value ? "" : ""}>恢复提醒</span>
|
||||
<div class={clsx("w-full h-[1px]", isGame.value ? " bg-white/20" : "bg-black/20")}></div>
|
||||
<span class={clsx("text-[14px] leading-[20px] mb-2 text-center", isGame.value ? "text-[#fff9]" : "")}>此操作会将您的历史调整的数据清空，为防止您的误操作，请再次确认是否要进行重置</span>
|
||||
<div class={"flex justify-between w-full"}>
|
||||
<button
|
||||
onClick={() => {
|
||||
layout.resetAll()
|
||||
|
||||
open.value = false
|
||||
}}
|
||||
class={clsx("w-[118px] rounded-lg py-1 flex justify-center", isGame.value ? "bg-white/20" : "")}>重置</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
open.value = false
|
||||
|
||||
}}
|
||||
class={clsx("w-[118px] rounded-lg py-1 flex justify-center", isGame.value ? "bg-[#ff7372]" : "")}>取消</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div >
|
||||
)
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ const defaultLayout: Layout = {
|
|||
export default defineStore('layout', () => {
|
||||
const settings = useSettingsStore()
|
||||
const user = useUserStore()
|
||||
const state = reactive(defaultLayout)
|
||||
const state = reactive({ ...defaultLayout })
|
||||
const ready = ref(false)
|
||||
|
||||
db.getItem<Layout>('layout').then((res) => {
|
||||
|
|
@ -112,7 +112,17 @@ export default defineStore('layout', () => {
|
|||
}
|
||||
return block.label || ''
|
||||
}
|
||||
const resetAll = () => {
|
||||
request('GET', '/api/app/desktop').then((res: any) => {
|
||||
if (!res) return
|
||||
state.dir = res.dir
|
||||
state.content = res.content
|
||||
|
||||
}).catch(() => {
|
||||
Object.assign(state, defaultLayout)
|
||||
|
||||
})
|
||||
}
|
||||
const changeBackground = (url: string) => {
|
||||
state.content[state.current].background = url
|
||||
}
|
||||
|
|
@ -161,6 +171,7 @@ export default defineStore('layout', () => {
|
|||
openDir,
|
||||
checkDir,
|
||||
getLabel,
|
||||
changeBackground
|
||||
changeBackground,
|
||||
resetAll
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ import useUserStore from '@/user/useUserStore'
|
|||
import useRouterStore from '@/useRouterStore'
|
||||
import asyncLoader from '@/utils/asyncLoader'
|
||||
import clsx from 'clsx'
|
||||
import { OhVueIcon } from 'oh-vue-icons'
|
||||
import { computed, defineComponent, Transition } from 'vue'
|
||||
import SettingLineImg from '~/icons/settingLine.png'
|
||||
const Content = asyncLoader(() => import('./SettingsOverlayContent'))
|
||||
|
|
@ -58,7 +57,7 @@ export default defineComponent(() => {
|
|||
return layout.state.current === 0
|
||||
})
|
||||
return () => (
|
||||
<div class="fixed left-0 bottom-0 z-40 w-full">
|
||||
<div class="fixed left-0 bottom-0 z-40 w-full rounded-lg">
|
||||
{/* 背景遮罩 */}
|
||||
{show.value && (
|
||||
<div
|
||||
|
|
@ -73,13 +72,20 @@ export default defineComponent(() => {
|
|||
{show.value && (
|
||||
<div
|
||||
class={clsx(
|
||||
'absolute left-6 bottom-10 w-[660px] h-[580px] rounded-lg overflow-hidden shadow-2xl flex',
|
||||
'absolute left-6 bottom-10 w-[660px] h-[580px] rounded-2xl shadow-2xl flex',
|
||||
isGame.value ? 'bg-[#2c2e3e] text-white' : 'text-[#000] bg-white'
|
||||
)}
|
||||
style={
|
||||
isGame.value &&
|
||||
{
|
||||
backgroundImage: `url('/tab/bg/gameModel.png')`,
|
||||
backgroundSize: '100% 100%',
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
class={clsx(
|
||||
'w-[200px] p-4 h-full backdrop-blur flex flex-col',
|
||||
'w-[200px] p-4 h-full flex flex-col rounded-lg',
|
||||
isGame.value ? 'bg-[#fff]/10 text-white ' : 'bg-[#ebebeb]'
|
||||
)}
|
||||
>
|
||||
|
|
@ -107,7 +113,7 @@ export default defineComponent(() => {
|
|||
onClick={() => {
|
||||
if (profile.id) {
|
||||
router.go('settings-user')
|
||||
}else {
|
||||
} else {
|
||||
router.go('global-login')
|
||||
}
|
||||
// router.go('settings-user')
|
||||
|
|
@ -135,7 +141,10 @@ export default defineComponent(() => {
|
|||
<SettingsTab label="问题反馈" path="settings-fallback" />
|
||||
</div>
|
||||
</div>
|
||||
<div class={"flex-1 w-0 h-full relative"}>
|
||||
<Content />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Transition>
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export default defineComponent(() => {
|
|||
const router = useRouterStore()
|
||||
|
||||
return () => (
|
||||
<div class="w-0 h-full flex-grow backdrop-blur">
|
||||
<div class="w-full h-full rounded-xl">
|
||||
<ThemeProvider>
|
||||
{router.path === 'settings-user' ? (
|
||||
<UserPage />
|
||||
|
|
|
|||
Loading…
Reference in New Issue