diff --git a/public/bg/change_constellation.png b/public/bg/change_constellation.png new file mode 100644 index 0000000..6155317 Binary files /dev/null and b/public/bg/change_constellation.png differ diff --git a/public/bg/gameDiscount__back.png b/public/bg/gameDiscount__back.png new file mode 100644 index 0000000..e21d2a5 Binary files /dev/null and b/public/bg/gameDiscount__back.png differ diff --git a/public/bg/xingzuo_bg.png b/public/bg/xingzuo_bg.png new file mode 100644 index 0000000..82413f7 Binary files /dev/null and b/public/bg/xingzuo_bg.png differ diff --git a/public/bg/xingzuo_bg_main.png b/public/bg/xingzuo_bg_main.png new file mode 100644 index 0000000..859201b Binary files /dev/null and b/public/bg/xingzuo_bg_main.png differ diff --git a/public/icons/change_constellation.png b/public/icons/change_constellation.png new file mode 100644 index 0000000..6155317 Binary files /dev/null and b/public/icons/change_constellation.png differ diff --git a/public/icons/constellation/双子座_big.png b/public/icons/constellation/双子座_big.png new file mode 100644 index 0000000..fae22dd Binary files /dev/null and b/public/icons/constellation/双子座_big.png differ diff --git a/public/icons/constellation/双鱼座_big.png b/public/icons/constellation/双鱼座_big.png new file mode 100644 index 0000000..845e11b Binary files /dev/null and b/public/icons/constellation/双鱼座_big.png differ diff --git a/public/icons/constellation/处女座_big.png b/public/icons/constellation/处女座_big.png new file mode 100644 index 0000000..4469de2 Binary files /dev/null and b/public/icons/constellation/处女座_big.png differ diff --git a/public/icons/constellation/天秤座_big.png b/public/icons/constellation/天秤座_big.png new file mode 100644 index 0000000..c5c8809 Binary files /dev/null and b/public/icons/constellation/天秤座_big.png differ diff --git a/public/icons/constellation/天蝎座_big.png b/public/icons/constellation/天蝎座_big.png new file mode 100644 index 0000000..98445f9 Binary files /dev/null and b/public/icons/constellation/天蝎座_big.png differ diff --git a/public/icons/constellation/射手座_big.png b/public/icons/constellation/射手座_big.png new file mode 100644 index 0000000..74d7bec Binary files /dev/null and b/public/icons/constellation/射手座_big.png differ diff --git a/public/icons/constellation/巨蟹座_big.png b/public/icons/constellation/巨蟹座_big.png new file mode 100644 index 0000000..8f46f43 Binary files /dev/null and b/public/icons/constellation/巨蟹座_big.png differ diff --git a/public/icons/constellation/摩羯座_big.png b/public/icons/constellation/摩羯座_big.png new file mode 100644 index 0000000..6d36335 Binary files /dev/null and b/public/icons/constellation/摩羯座_big.png differ diff --git a/public/icons/constellation/水瓶座_big.png b/public/icons/constellation/水瓶座_big.png new file mode 100644 index 0000000..0c27323 Binary files /dev/null and b/public/icons/constellation/水瓶座_big.png differ diff --git a/public/icons/constellation/狮子座_big.png b/public/icons/constellation/狮子座_big.png new file mode 100644 index 0000000..1e64204 Binary files /dev/null and b/public/icons/constellation/狮子座_big.png differ diff --git a/public/icons/constellation/白羊座_big.png b/public/icons/constellation/白羊座_big.png new file mode 100644 index 0000000..bafa888 Binary files /dev/null and b/public/icons/constellation/白羊座_big.png differ diff --git a/public/icons/constellation/金牛座_big.png b/public/icons/constellation/金牛座_big.png new file mode 100644 index 0000000..1f90773 Binary files /dev/null and b/public/icons/constellation/金牛座_big.png differ diff --git a/public/icons/discounts_icon.png b/public/icons/discounts_icon.png new file mode 100644 index 0000000..a306aef Binary files /dev/null and b/public/icons/discounts_icon.png differ diff --git a/public/icons/gameDiscount__icon.png b/public/icons/gameDiscount__icon.png new file mode 100644 index 0000000..56145ee Binary files /dev/null and b/public/icons/gameDiscount__icon.png differ diff --git a/public/icons/stared.png b/public/icons/stared.png new file mode 100644 index 0000000..9ec9d87 Binary files /dev/null and b/public/icons/stared.png differ diff --git a/public/icons/starun.png b/public/icons/starun.png new file mode 100644 index 0000000..48bbc2d Binary files /dev/null and b/public/icons/starun.png differ diff --git a/public/icons/xingzuo_icon_bg.png b/public/icons/xingzuo_icon_bg.png new file mode 100644 index 0000000..3e65a15 Binary files /dev/null and b/public/icons/xingzuo_icon_bg.png differ diff --git a/src/GlobalModal.tsx b/src/GlobalModal.tsx index f6d1aa7..fcdb320 100644 --- a/src/GlobalModal.tsx +++ b/src/GlobalModal.tsx @@ -52,7 +52,7 @@ export default defineComponent(() => {
{ router.back() @@ -65,7 +65,7 @@ export default defineComponent(() => { {/* 全屏按钮 */} {!fullList.includes(router.path) ? null : (
{ full.value = !full.value }} diff --git a/src/widgets/constellation/Large.tsx b/src/widgets/constellation/Large.tsx new file mode 100644 index 0000000..b83de91 --- /dev/null +++ b/src/widgets/constellation/Large.tsx @@ -0,0 +1,9 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ large +
+ ) +}) diff --git a/src/widgets/constellation/Middle.tsx b/src/widgets/constellation/Middle.tsx new file mode 100644 index 0000000..53edc23 --- /dev/null +++ b/src/widgets/constellation/Middle.tsx @@ -0,0 +1,10 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + + return () => ( +
+ middle +
+ ) +}) diff --git a/src/widgets/constellation/Modal.tsx b/src/widgets/constellation/Modal.tsx new file mode 100644 index 0000000..444f624 --- /dev/null +++ b/src/widgets/constellation/Modal.tsx @@ -0,0 +1,246 @@ +import { defineComponent, ref } from 'vue' +import { useConstellationStore, zodiacDateMap, zodiacMap } from './useConstellationStore' +import dayjs from 'dayjs' + +export default defineComponent(() => { + const store = useConstellationStore() + const open = ref(false) + const page = ref(1) + return () => ( +
+
+
+
+
+ +
+
+ {zodiacMap.get(store.state.selectCode)} + { + open.value = true + }} + > + {open.value && ( +
+
+ {Array.from(zodiacMap) + .filter((_, index) => index < page.value * 6) + .map(([key, value]) => ( +
+
{ + store.state.selectCode = key + open.value = false + }} + > + +
+ + {value} + + + {zodiacDateMap.get(value)} + +
+ ))} +
+
+ )} +
+
+
+
+ 财富运势 +
+ {Array.from({ length: 5 }).map((_, index) => ( + index + ? '/icons/stared.png' + : '/icons/starun.png' + } + class={'w-[20px] h-[20px]'} + > + ))} +
+
+
+ 爱情运势 +
+ {Array.from({ length: 5 }).map((_, index) => ( + index + ? '/icons/stared.png' + : '/icons/starun.png' + } + class={'w-[20px] h-[20px]'} + > + ))} +
+
+
+ 综合运势 +
+ {Array.from({ length: 5 }).map((_, index) => ( + index + ? '/icons/stared.png' + : '/icons/starun.png' + } + class={'w-[20px] h-[20px]'} + > + ))} +
+
+
+
+
+
+ 幸运时间： + + {store.data?.today.lucky_time} + +
+
+ 幸运数字： + + {store.data?.today.lucky_num} + +
+
+ 幸运颜色： + + {store.data?.today.lucky_color} + +
+
+ 速配星座： + + {store.data?.today.grxz} + +
+
+ 今日提醒： + + {store.data?.today.day_notice} + +
+
+
+
+
+
+
+
+ 综合运势 +
+
+ + + {store.data?.today.exponents.zonghe.content} + +
+
+
+
+ 财富运势 +
+
+ + + {store.data?.today.exponents.caiyun.content} + +
+
+
+
+ 爱情运势 +
+
+ + + {store.data?.today.exponents.aiqing.content} + +
+
+
+
+ 今日运势 + {dayjs().format('YYYY-MM-DD')} +
+
+
+
+ ) +}) diff --git a/src/widgets/constellation/Small.tsx b/src/widgets/constellation/Small.tsx new file mode 100644 index 0000000..bf0a763 --- /dev/null +++ b/src/widgets/constellation/Small.tsx @@ -0,0 +1,14 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ +
+ ) +}) diff --git a/src/widgets/constellation/index.ts b/src/widgets/constellation/index.ts new file mode 100644 index 0000000..3c76508 --- /dev/null +++ b/src/widgets/constellation/index.ts @@ -0,0 +1,30 @@ +import asyncLoader from '@/utils/asyncLoader' +import type { Widget } from '..' + +export default { + name: 'constellation', + label: '星座运势', + description: '你可查看星座运势', + icon: '/icons/constellation_icon.png', + modal: asyncLoader(() => import('./Modal')), + list: [ + { + w: 2, + h: 1, + label: '小', + component: asyncLoader(() => import('./Small')) + }, + { + w: 2, + h: 2, + label: '中', + component: asyncLoader(() => import('./Middle')) + }, + { + w: 4, + h: 2, + label: '大', + component: asyncLoader(() => import('./Large')) + } + ] +} as Widget diff --git a/src/widgets/constellation/useConstellationStore.ts b/src/widgets/constellation/useConstellationStore.ts new file mode 100644 index 0000000..a121a85 --- /dev/null +++ b/src/widgets/constellation/useConstellationStore.ts @@ -0,0 +1,113 @@ +import request from "@/utils/request"; +import { defineStore } from "pinia"; +import { reactive, ref, watch } from "vue"; +interface ConstellationType { + date: string; + star: string; // 星座 + this_month: HoroscopePeriod; + this_week: HoroscopePeriod & { + lucky_color: string; + lucky_day: string; + lucky_num: string; + week_notice: string; + }; + this_year: { + general: { + general_index: string; + general_txt: string; + }; + health: { + health_txt: string; + }; + love: { + love_index: string; + love_txt: string; + }; + money: { + money_index: string; + money_txt: string; + }; + oneword: string; + time: string; + work: { + work_index: string; + work_txt: string; + }; + }; + today: DailyHoroscope; + tomorrow: DailyHoroscope; +}; +type HoroscopePeriod = { + exponents: Exponents; + grxz: string; // 贵人星座 +}; + +type DailyHoroscope = HoroscopePeriod & { + day_notice: string; + lucky_color: string; + lucky_num: string; + lucky_time: string; +}; + +type Exponents = { + aiqing: HoroscopeAspect; + caiyun: HoroscopeAspect; + gongzuo: HoroscopeAspect; + zonghe: HoroscopeAspect; +}; + +type HoroscopeAspect = { + content: string; + star: number; // 星级 +}; +export const zodiacDateMap = new Map([ + ['白羊座', '3.21-4.19'], + ['金牛座', '4.20-5.20'], + ['双子座', '5.21-6.21'], + ['巨蟹座', '6.22-7.22'], + ['狮子座', '7.23-8.22'], + ['处女座', '8.23-9.22'], + ['天秤座', '9.23-10.23'], + ['天蝎座', '10.24-11.22'], + ['射手座', '11.23-12.21'], + ['摩羯座', '12.22-1.19'], + ['水瓶座', '1.20-2.18'], + ['双鱼座', '2.19-3.20'] +]); + +export const zodiacMap = new Map([ + [101, "白羊座"], + [102, "金牛座"], + [103, "双子座"], + [104, "巨蟹座"], + [105, "狮子座"], + [106, "处女座"], + [107, "天秤座"], + [108, "天蝎座"], + [109, "射手座"], + [110, "魔羯座"], + [111, "水瓶座"], + [112, "双鱼座"] +]); + +export const useConstellationStore = defineStore("constellation", () => { + const data = ref(null) + const state = reactive({ + selectCode: 103 + }) + watch(() => [state.selectCode], (newVal) => { + getConstellation(newVal[0]) + }) + const getConstellation = async (code: number) => { + const res = await request<{ + data: ConstellationType; + }>('GET', `/api/constellation?code=${code}`) + data.value = res.data + } + getConstellation(state.selectCode) + + return { + state, + data + } +}) \ No newline at end of file diff --git a/src/widgets/discount/Large.tsx b/src/widgets/discount/Large.tsx new file mode 100644 index 0000000..b83de91 --- /dev/null +++ b/src/widgets/discount/Large.tsx @@ -0,0 +1,9 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ large +
+ ) +}) diff --git a/src/widgets/discount/Middle.tsx b/src/widgets/discount/Middle.tsx new file mode 100644 index 0000000..53edc23 --- /dev/null +++ b/src/widgets/discount/Middle.tsx @@ -0,0 +1,10 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + + return () => ( +
+ middle +
+ ) +}) diff --git a/src/widgets/discount/Modal.tsx b/src/widgets/discount/Modal.tsx new file mode 100644 index 0000000..4006149 --- /dev/null +++ b/src/widgets/discount/Modal.tsx @@ -0,0 +1,85 @@ +import { defineComponent, ref, watch, type VNodeRef } from 'vue' +import useGameNews from './useDiscountStore' +import { RiTimeLine } from 'oh-vue-icons/icons' +import { addIcons, OhVueIcon } from 'oh-vue-icons' +import dayjs from 'dayjs' +addIcons(RiTimeLine) +export default defineComponent(() => { + const store = useGameNews() + const containerRef = ref(null as VNodeRef | null) + + const handleScroll = () => { + const container = containerRef.value + console.log(container) + + if (container.scrollTop + container.clientHeight >= container.scrollHeight - 50) { + console.log('到底了') + + store.getNews() + } + } + return () => ( +
+
+ +
+
+
+
+ {store.list.map((item, index) => { + return ( +
{ + }} + key={index} + > + +
+ + {item.gameid} + + + {item.name} + +
+ +
+
+
+ ) + })} +
+ {store.loading && ( +
加载中...
+ )} + {store.noMoreData && ( +
无更多数据
+ )} +
+
+
+ ) +}) diff --git a/src/widgets/discount/Small.tsx b/src/widgets/discount/Small.tsx new file mode 100644 index 0000000..d759fd7 --- /dev/null +++ b/src/widgets/discount/Small.tsx @@ -0,0 +1,28 @@ + +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ +
+
+ 游戏折扣 +
+ 立即查看 +
+ +
+
+
+
+
+ ) +}) + diff --git a/src/widgets/discount/index.ts b/src/widgets/discount/index.ts new file mode 100644 index 0000000..1bac048 --- /dev/null +++ b/src/widgets/discount/index.ts @@ -0,0 +1,30 @@ +import asyncLoader from '@/utils/asyncLoader' +import type { Widget } from '..' + +export default { + name: 'discount', + label: '游戏折扣', + description: '游戏折扣', + icon: '/icons/discounts_icon.png', + modal: asyncLoader(() => import('./Modal')), + list: [ + { + w: 2, + h: 1, + label: '小', + component: asyncLoader(() => import('./Small')) + }, + { + w: 2, + h: 2, + label: '中', + component: asyncLoader(() => import('./Middle')) + }, + { + w: 4, + h: 2, + label: '大', + component: asyncLoader(() => import('./Large')) + } + ] +} as Widget diff --git a/src/widgets/discount/useDiscountStore.ts b/src/widgets/discount/useDiscountStore.ts new file mode 100644 index 0000000..f681ec3 --- /dev/null +++ b/src/widgets/discount/useDiscountStore.ts @@ -0,0 +1,56 @@ +import request from "@/utils/request"; +import { defineStore } from "pinia"; +import { ref, type VNodeRef } from "vue"; + + +export interface GameDiscount { + gameid: string; + status: number; + typeid: string; + typename: string; + name: string; +} +export default defineStore("gameDiscount", () => { + const list = ref([]) + const page = ref(1) + const loading = ref(false) + const noMoreData = ref(false) + const containerRef = ref(null) + + const getList = async () => { + const res = await request<{ + data: GameDiscount[]; + }>('GET', `/api/gameDiscount?page=${page.value}&page_size=16`) + return res.data + } + const getNews = async () => { + + if (loading.value || noMoreData.value) return; + loading.value = true; + + try { + const data = await getList() + + if (data.length === 0) { + noMoreData.value = true; + } else { + list.value.push(...data); + page.value++; + } + } catch (e) { + console.log(e); + + } finally { + loading.value = false; + } + } + + getNews() + return { + list, + loading, + noMoreData, + getNews, + containerRef + } +}) \ No newline at end of file diff --git a/src/widgets/hotspot/Large.tsx b/src/widgets/hotspot/Large.tsx new file mode 100644 index 0000000..b83de91 --- /dev/null +++ b/src/widgets/hotspot/Large.tsx @@ -0,0 +1,9 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ large +
+ ) +}) diff --git a/src/widgets/hotspot/Middle.tsx b/src/widgets/hotspot/Middle.tsx new file mode 100644 index 0000000..53edc23 --- /dev/null +++ b/src/widgets/hotspot/Middle.tsx @@ -0,0 +1,10 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + + return () => ( +
+ middle +
+ ) +}) diff --git a/src/widgets/hotspot/Modal.tsx b/src/widgets/hotspot/Modal.tsx new file mode 100644 index 0000000..9890740 --- /dev/null +++ b/src/widgets/hotspot/Modal.tsx @@ -0,0 +1,12 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ ) +}) diff --git a/src/widgets/hotspot/Small.tsx b/src/widgets/hotspot/Small.tsx new file mode 100644 index 0000000..bf0a763 --- /dev/null +++ b/src/widgets/hotspot/Small.tsx @@ -0,0 +1,14 @@ +import { defineComponent } from 'vue' + +export default defineComponent(() => { + return () => ( +
+ +
+ ) +}) diff --git a/src/widgets/hotspot/index.ts b/src/widgets/hotspot/index.ts new file mode 100644 index 0000000..3a774a8 --- /dev/null +++ b/src/widgets/hotspot/index.ts @@ -0,0 +1,30 @@ +import asyncLoader from '@/utils/asyncLoader' +import type { Widget } from '..' + +export default { + name: 'hotspot', + label: '热点资讯', + description: '热点信息尽在此处', + icon: '/icons/hot_information_icon.png', + modal: asyncLoader(() => import('./Modal')), + list: [ + { + w: 2, + h: 1, + label: '小', + component: asyncLoader(() => import('./Small')) + }, + { + w: 2, + h: 2, + label: '中', + component: asyncLoader(() => import('./Middle')) + }, + { + w: 4, + h: 2, + label: '大', + component: asyncLoader(() => import('./Large')) + } + ] +} as Widget diff --git a/src/widgets/index.ts b/src/widgets/index.ts index 7a008ca..3afb210 100644 --- a/src/widgets/index.ts +++ b/src/widgets/index.ts @@ -4,6 +4,9 @@ import weather from './weather' import weApply from './weApply' import gameNews from './gameNews' import eat from './eat' +import discount from './discount' +import hotspot from './hotspot' +import constellation from './constellation' export interface Widget { name: string // 小组件类型唯一标识 label: string // 小组件名称 @@ -18,4 +21,4 @@ export interface Widget { }[] // 不同尺寸小组件块 } -export default [calendar, weather, weApply, gameNews, eat] as Widget[] +export default [calendar, weather, weApply, gameNews, eat, discount, hotspot, constellation] as Widget[] diff --git a/src/widgets/video/useVideoStore.tsx b/src/widgets/video/useVideoStore.tsx new file mode 100644 index 0000000..67969b9 --- /dev/null +++ b/src/widgets/video/useVideoStore.tsx @@ -0,0 +1,8 @@ +import { defineStore } from "pinia"; + +export default defineStore('video', () => { + + return { + + } +}) \ No newline at end of file