改变adderpage的结构

This commit is contained in:
expdsn 2024-11-05 19:26:59 +08:00
parent d0ed386313
commit 847f1df785
3 changed files with 35 additions and 16 deletions

View File

@ -1,4 +1,4 @@
import { computed, defineComponent, provide, ref, type InjectionKey, type Ref } from 'vue' import { computed, defineComponent, inject, onMounted, onUnmounted, provide, ref, type InjectionKey, type Ref } from 'vue'
import useLayoutStore from '../useLayoutStore' import useLayoutStore from '../useLayoutStore'
import { OhVueIcon, addIcons } from 'oh-vue-icons' import { OhVueIcon, addIcons } from 'oh-vue-icons'
import { import {
@ -15,6 +15,7 @@ import { Form, Input, Select } from 'ant-design-vue'
import HotAdder from './HotAdder' import HotAdder from './HotAdder'
import GameAdder from './GameAdder' import GameAdder from './GameAdder'
import work_add_main_checked from '/tab/icons/work_add_main_checked.png' import work_add_main_checked from '/tab/icons/work_add_main_checked.png'
import useAdderPageStore from './useAdderPageStore'
addIcons(MdKeyboardcommandkey, FaCompass, FaPencilRuler, IoGameController) addIcons(MdKeyboardcommandkey, FaCompass, FaPencilRuler, IoGameController)
const ItemButton = defineComponent({ const ItemButton = defineComponent({
@ -67,13 +68,15 @@ const ItemButton = defineComponent({
}) })
export const AddToToken = Symbol('addTo') as InjectionKey<Ref<number>> export const AddToToken = Symbol('addTo') as InjectionKey<Ref<number>>
export default defineComponent(() => { export default defineComponent(() => {
const layout = useLayoutStore() const layout = useLayoutStore()
const isGame = computed(() => layout.state.current === 0) const isGame = computed(() => layout.state.current === 0)
const type = ref(1) const store = useAdderPageStore()
const addTo = ref(layout.state.currentPage) const addTo = ref(layout.state.currentPage)
provide(AddToToken, addTo) provide(AddToToken, addTo)
onUnmounted(()=> {
store.type = 1
})
return () => ( return () => (
<div <div
class={clsx( class={clsx(
@ -95,33 +98,33 @@ export default defineComponent(() => {
<ItemButton <ItemButton
name="md-keyboardcommandkey" name="md-keyboardcommandkey"
label="功能组件" label="功能组件"
active={type.value === 0} active={store.type === 0}
onClick={() => { onClick={() => {
type.value = 0 store.type = 0
}} }}
/> />
<ItemButton <ItemButton
name="fa-compass" name="fa-compass"
label="网站图标" label="网站图标"
active={type.value === 1} active={store.type === 1}
onClick={() => { onClick={() => {
type.value = 1 store.type = 1
}} }}
/> />
<ItemButton <ItemButton
name="fa-pencil-ruler" name="fa-pencil-ruler"
label="自定义网址" label="自定义网址"
active={type.value === 2} active={store.type === 2}
onClick={() => { onClick={() => {
type.value = 2 store.type = 2
}} }}
/> />
<ItemButton <ItemButton
name="io-game-controller" name="io-game-controller"
label="快游戏" label="快游戏"
active={type.value === 3} active={store.type === 3}
onClick={() => { onClick={() => {
type.value = 3 store.type = 3
}} }}
/> />
</div> </div>
@ -146,11 +149,11 @@ export default defineComponent(() => {
</Form> </Form>
<div class="w-full h-0 flex-grow p-6"> <div class="w-full h-0 flex-grow p-6">
<div class="w-full h-full relative"> <div class="w-full h-full relative">
{type.value === 0 ? ( {store.type === 0 ? (
<WidgetAdder /> <WidgetAdder />
) : type.value === 1 ? ( ) : store.type=== 1 ? (
<HotAdder /> <HotAdder />
) : type.value === 2 ? ( ) : store.type === 2 ? (
<CustomAdder /> <CustomAdder />
) : ( ) : (
<GameAdder /> <GameAdder />

View File

@ -0,0 +1,9 @@
import { defineStore } from "pinia";
import { ref } from "vue";
export default defineStore("adderPage", () => {
const type = ref(1)
return {
type
}
})

View File

@ -1,17 +1,20 @@
import { frontAddress, ossBase } from '@/config' import { frontAddress, ossBase } from '@/config'
import { DefautGameTypeList, SECRET, type GameType, type OtherGame } from '@/layout/adder/GameAdder' import { DefautGameTypeList, SECRET, type GameType, type OtherGame } from '@/layout/adder/GameAdder'
import useAdderPageStore from '@/layout/adder/useAdderPageStore'
import useRouterStore from '@/useRouterStore'
import request from '@/utils/request' import request from '@/utils/request'
import { generateRandomString } from '@/utils/tool' import { generateRandomString } from '@/utils/tool'
import clsx from 'clsx' import clsx from 'clsx'
import { MD5 } from 'crypto-js' import { MD5 } from 'crypto-js'
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { ref, watch } from 'vue' import { provide, ref, toRef, watch, type InjectionKey, type Ref } from 'vue'
import { defineComponent } from 'vue' import { defineComponent } from 'vue'
export default defineComponent(() => { export default defineComponent(() => {
const selectType = ref('fc') const selectType = ref('fc')
const appList = ref<GameType[]>([]) const appList = ref<GameType[]>([])
const hoverId = ref(0) const hoverId = ref(0)
const router = useRouterStore()
const loading = ref(false) const loading = ref(false)
const fetchGame = async (page: number) => { const fetchGame = async (page: number) => {
const parems = `nonce=${generateRandomString(8)}&pid=PIDc8uT24mpo&timestamp=${dayjs().unix()}` const parems = `nonce=${generateRandomString(8)}&pid=PIDc8uT24mpo&timestamp=${dayjs().unix()}`
@ -22,6 +25,7 @@ export default defineComponent(() => {
const res = await response.json() const res = await response.json()
return res.data.items return res.data.items
} }
watch( watch(
selectType, selectType,
(val) => { (val) => {
@ -97,7 +101,10 @@ export default defineComponent(() => {
)) ))
} }
</div> </div>
<span class={"text-[#ddd]/70 text-[14px]"}></span> <span class={"text-[#ddd]/70 text-[14px]"} onClick={() => {
router.go('global-adder')
useAdderPageStore().type = 3
}}></span>
</div> </div>
{ {