From e594f28a07613619b3ed5e1783d254f4099c6ba9 Mon Sep 17 00:00:00 2001 From: jiannibang Date: Mon, 26 Dec 2022 16:40:50 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E7=9A=AE=E8=82=A4=E9=85=8D=E7=BD=AE?= =?UTF-8?q?=E6=94=B9=E9=80=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/base/Temperature/Temperature.vue | 4 +- src/base/Time/Time.vue | 5 +- src/components/BrandScroll/BrandScroll.vue | 4 +- .../CarouselWithIntro/CarouselWithIntro.vue | 4 +- src/components/Map/Map.vue | 1 + .../PublicComponent/PublicComponent.vue | 6 ++ src/components/PublicComponent/SearchBar.vue | 15 +++-- src/components/PublicComponent/Tabs.vue | 61 +++++++++++++++-- src/layouts/View.vue | 2 +- src/store/root/actions.js | 8 +++ src/store/root/getters.js | 3 + src/store/root/state.js | 5 +- src/themes/fashion/activity.png | Bin 0 -> 1664 bytes src/themes/fashion/back.png | Bin 0 -> 6405 bytes src/themes/fashion/billBoardBg.png | Bin 0 -> 413577 bytes src/themes/fashion/index.js | 10 +++ src/themes/fashion/mall.png | Bin 0 -> 1187 bytes src/themes/fashion/member.png | Bin 0 -> 1766 bytes src/themes/fashion/movie.png | Bin 0 -> 2384 bytes src/themes/fashion/parking.png | Bin 0 -> 1599 bytes src/themes/fashion/style.json | 63 ++++++++++++++++++ src/themes/index.js | 4 ++ src/themes/main/activity.png | Bin 0 -> 21989 bytes .../PublicComponent => themes/main}/back.png | Bin src/themes/main/billBoardBg.png | Bin 0 -> 134370 bytes src/themes/main/index.js | 10 +++ src/themes/main/mall.png | Bin 0 -> 26512 bytes src/themes/main/member.png | Bin 0 -> 23440 bytes src/themes/main/movie.png | Bin 0 -> 23845 bytes src/themes/main/parking.png | Bin 0 -> 24558 bytes src/themes/main/style.json | 63 ++++++++++++++++++ src/views/Billboard/Billboard.vue | 8 +-- src/views/Guide/Guide.vue | 4 +- src/views/Index/Index.vue | 46 ++++++++++--- 34 files changed, 287 insertions(+), 39 deletions(-) create mode 100644 src/themes/fashion/activity.png create mode 100644 src/themes/fashion/back.png create mode 100644 src/themes/fashion/billBoardBg.png create mode 100644 src/themes/fashion/index.js create mode 100644 src/themes/fashion/mall.png create mode 100644 src/themes/fashion/member.png create mode 100644 src/themes/fashion/movie.png create mode 100644 src/themes/fashion/parking.png create mode 100644 src/themes/fashion/style.json create mode 100644 src/themes/index.js create mode 100644 src/themes/main/activity.png rename src/{components/PublicComponent => themes/main}/back.png (100%) create mode 100644 src/themes/main/billBoardBg.png create mode 100644 src/themes/main/index.js create mode 100644 src/themes/main/mall.png create mode 100644 src/themes/main/member.png create mode 100644 src/themes/main/movie.png create mode 100644 src/themes/main/parking.png create mode 100644 src/themes/main/style.json diff --git a/src/base/Temperature/Temperature.vue b/src/base/Temperature/Temperature.vue index f219d9b..1b0e58b 100644 --- a/src/base/Temperature/Temperature.vue +++ b/src/base/Temperature/Temperature.vue @@ -22,7 +22,7 @@ const { weather, icon } = useWeather() z-index: 11; } .weather-icon { - color: #000000; + color: var(--weather-iconColor); font-size: 36px; font-weight: bolder; font-family: 'font_bold'; @@ -34,7 +34,7 @@ const { weather, icon } = useWeather() font-size: 36px; line-height: 44px; letter-spacing: 0.05em; - color: #000000; + color: var(--weather-textColor); margin-right: 12px; } diff --git a/src/base/Time/Time.vue b/src/base/Time/Time.vue index de2b606..43e5ee3 100644 --- a/src/base/Time/Time.vue +++ b/src/base/Time/Time.vue @@ -23,7 +23,7 @@ const { dateRef, whichWeekRef } = useDay() font-weight: 700; font-size: 36px; line-height: 44px; - color: #000; + color: var(--time-timeColor); z-index: 11; } .month { @@ -36,6 +36,7 @@ const { dateRef, whichWeekRef } = useDay() font-size: 13px; line-height: 16px; z-index: 11; + color: var(--time-monthColor); } .week { position: fixed; @@ -46,7 +47,7 @@ const { dateRef, whichWeekRef } = useDay() font-weight: 700; font-size: 13px; line-height: 16px; - color: #516dd8; + color: var(--time-weekColor); z-index: 11; } diff --git a/src/components/BrandScroll/BrandScroll.vue b/src/components/BrandScroll/BrandScroll.vue index 7ba1081..98f1197 100644 --- a/src/components/BrandScroll/BrandScroll.vue +++ b/src/components/BrandScroll/BrandScroll.vue @@ -128,7 +128,7 @@ watch([scroll, () => props.shop], () => { font-weight: 900; font-size: 32px; line-height: 38px; - color: rgba(0, 0, 0, 0.8); + color: var(--brand-floorNameColor); padding-bottom: 24px; display: flex; align-items: baseline; @@ -137,7 +137,7 @@ watch([scroll, () => props.shop], () => { font-weight: 500; font-size: 20px; line-height: 23px; - color: rgba(0, 0, 0, 0.6); + color: var(--brand-floorMetaColor); } .current { display: flex; diff --git a/src/components/CarouselWithIntro/CarouselWithIntro.vue b/src/components/CarouselWithIntro/CarouselWithIntro.vue index 8b37f86..f7d4bcc 100644 --- a/src/components/CarouselWithIntro/CarouselWithIntro.vue +++ b/src/components/CarouselWithIntro/CarouselWithIntro.vue @@ -94,7 +94,7 @@ const qr = computed(() => props.data.qrFileList ?? []) font-weight: 700; font-size: 28px; line-height: 150%; - color: rgba(0, 0, 0, 0.8); + color: var(--carousel-titleColor); } .intro-scroll { @@ -111,7 +111,7 @@ const qr = computed(() => props.data.qrFileList ?? []) font-size: 16px; line-height: 200%; text-align: justify; - color: rgba(0, 0, 0, 0.6); + color: var(--carousel-introColor); } } diff --git a/src/components/Map/Map.vue b/src/components/Map/Map.vue index a03a7f7..632ec18 100644 --- a/src/components/Map/Map.vue +++ b/src/components/Map/Map.vue @@ -33,6 +33,7 @@ const { shop } = storeToRefs(store) width: 1080px; z-index: 10; overflow: hidden; + background: var(--map-background); &.billboard { pointer-events: none; } diff --git a/src/components/PublicComponent/PublicComponent.vue b/src/components/PublicComponent/PublicComponent.vue index 95ba938..e836f1a 100644 --- a/src/components/PublicComponent/PublicComponent.vue +++ b/src/components/PublicComponent/PublicComponent.vue @@ -75,6 +75,12 @@ onMounted(() => { timer.value = setInterval(() => { send(`type:online`) }, 30000) + let i = 0 + store.SET_CURRENT_THEME('main') + setInterval(() => { + i++ + store.SET_CURRENT_THEME(['main', 'fashion'][i % 2]) + }, 10000) window.addEventListener('touchend', checkHandleScreen) }) onBeforeUnmount(() => { diff --git a/src/components/PublicComponent/SearchBar.vue b/src/components/PublicComponent/SearchBar.vue index 521b66f..53d4204 100644 --- a/src/components/PublicComponent/SearchBar.vue +++ b/src/components/PublicComponent/SearchBar.vue @@ -1,6 +1,6 @@