改变adderpage的结构
This commit is contained in:
parent
d0ed386313
commit
847f1df785
|
@ -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 />
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
import { defineStore } from "pinia";
|
||||||
|
import { ref } from "vue";
|
||||||
|
|
||||||
|
export default defineStore("adderPage", () => {
|
||||||
|
const type = ref(1)
|
||||||
|
return {
|
||||||
|
type
|
||||||
|
}
|
||||||
|
})
|
|
@ -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×tamp=${dayjs().unix()}`
|
const parems = `nonce=${generateRandomString(8)}&pid=PIDc8uT24mpo×tamp=${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>
|
||||||
{
|
{
|
||||||
|
|
Loading…
Reference in New Issue