diff --git a/.env.production b/.env.production index 54ce69a..061c18a 100644 --- a/.env.production +++ b/.env.production @@ -1,6 +1,5 @@ VITE_MODE = production VITE_HOST = https://hd.xglpa.com -VITE_CDN = https://cdn.xglpa.com -VITE_FOLDER = /palc-lantern-cash/ +VITE_CDN = https://cdn.xglpa.com/xyyh-hhj/ VITE_API = /pingan-exchange-yx-2025 -VITE_ACTIVITY_URL = https://w.pingan.com.cn/lckj/pawm-mmo-activity-xgl-frontend/index.html \ No newline at end of file +VITE_ACTIVITY_URL = https://hd.xglpa.com/xyyh-hhj/index.html \ No newline at end of file diff --git a/deploy.config.js b/deploy.config.js index 3c23549..c1a20ea 100644 --- a/deploy.config.js +++ b/deploy.config.js @@ -11,14 +11,14 @@ export default { port: 22,//服务器端口 username: 'root',//服务器ssh登录用户名 password: 'JDhweh*63*03%3267',//服务器ssh登录密码 - serverpath: '/mnt/apps/palc-lantern-cash',//服务器web目录 切记不要加/ 当前目录不存在会创建目录并且当前目录所有文件会被清空重新部署前端项目 + serverpath: '/mnt/apps/xyyh-hhj',//服务器web目录 切记不要加/ 当前目录不存在会创建目录并且当前目录所有文件会被清空重新部署前端项目 }, "cdn": { host: '120.77.32.131',//8.135.39.87 port: 22,//服务器端口 username: 'root',//服务器ssh登录用户名 password: 'JDhweh*63*03%3267',//服务器ssh登录密码 - serverpath: '/mnt/cdn/palc-lantern-cash',//服务器web目录 切记不要加/ 当前目录不存在会创建目录并且当前目录所有文件会被清空重新部署前端项目 + serverpath: '/mnt/cdn/xyyh-hhj',//服务器web目录 切记不要加/ 当前目录不存在会创建目录并且当前目录所有文件会被清空重新部署前端项目 }, //...其他自定义环境 } \ No newline at end of file diff --git a/src/assets/images/index/arrow-icon.png b/src/assets/images/index/arrow-icon.png index 96907dd..26b04b4 100644 Binary files a/src/assets/images/index/arrow-icon.png and b/src/assets/images/index/arrow-icon.png differ diff --git a/src/assets/images/index/bg.jpg b/src/assets/images/index/bg.jpg index 01fc1d7..431a738 100644 Binary files a/src/assets/images/index/bg.jpg and b/src/assets/images/index/bg.jpg differ diff --git a/src/assets/images/index/boat-2.png b/src/assets/images/index/boat-2.png index 19d7be9..e776f15 100644 Binary files a/src/assets/images/index/boat-2.png and b/src/assets/images/index/boat-2.png differ diff --git a/src/assets/images/index/boat-3.png b/src/assets/images/index/boat-3.png index a98bfaa..3a8a488 100644 Binary files a/src/assets/images/index/boat-3.png and b/src/assets/images/index/boat-3.png differ diff --git a/src/assets/images/index/boat.png b/src/assets/images/index/boat.png index c9e4022..2da7e64 100644 Binary files a/src/assets/images/index/boat.png and b/src/assets/images/index/boat.png differ diff --git a/src/assets/images/index/bottom-bird-1.png b/src/assets/images/index/bottom-bird-1.png index e0bd648..27e25c2 100644 Binary files a/src/assets/images/index/bottom-bird-1.png and b/src/assets/images/index/bottom-bird-1.png differ diff --git a/src/assets/images/index/cloud-bottom.png b/src/assets/images/index/cloud-bottom.png index ac86fc9..465135e 100644 Binary files a/src/assets/images/index/cloud-bottom.png and b/src/assets/images/index/cloud-bottom.png differ diff --git a/src/assets/images/index/cls-btn.png b/src/assets/images/index/cls-btn.png new file mode 100644 index 0000000..0974f79 Binary files /dev/null and b/src/assets/images/index/cls-btn.png differ diff --git a/src/assets/images/index/crane-1.png b/src/assets/images/index/crane-1.png index a4abafc..32760cd 100644 Binary files a/src/assets/images/index/crane-1.png and b/src/assets/images/index/crane-1.png differ diff --git a/src/assets/images/index/crane-2.png b/src/assets/images/index/crane-2.png index 27eef2f..0c64e0a 100644 Binary files a/src/assets/images/index/crane-2.png and b/src/assets/images/index/crane-2.png differ diff --git a/src/assets/images/index/hhl-cloud.png b/src/assets/images/index/hhl-cloud.png index 73a7288..2874032 100644 Binary files a/src/assets/images/index/hhl-cloud.png and b/src/assets/images/index/hhl-cloud.png differ diff --git a/src/assets/images/index/line.png b/src/assets/images/index/line.png index e40070b..dc3288a 100644 Binary files a/src/assets/images/index/line.png and b/src/assets/images/index/line.png differ diff --git a/src/assets/images/index/location-bj.png b/src/assets/images/index/location-bj.png index 4bd2cf1..21c295d 100644 Binary files a/src/assets/images/index/location-bj.png and b/src/assets/images/index/location-bj.png differ diff --git a/src/assets/images/index/location-gz.png b/src/assets/images/index/location-gz.png index 0c6c973..ac3a7cd 100644 Binary files a/src/assets/images/index/location-gz.png and b/src/assets/images/index/location-gz.png differ diff --git a/src/assets/images/index/location-sh.png b/src/assets/images/index/location-sh.png index 4132286..c6266b7 100644 Binary files a/src/assets/images/index/location-sh.png and b/src/assets/images/index/location-sh.png differ diff --git a/src/assets/images/index/location-wh.png b/src/assets/images/index/location-wh.png index 280251d..964fbc5 100644 Binary files a/src/assets/images/index/location-wh.png and b/src/assets/images/index/location-wh.png differ diff --git a/src/assets/images/index/location-xa.png b/src/assets/images/index/location-xa.png index 607a094..2810a5a 100644 Binary files a/src/assets/images/index/location-xa.png and b/src/assets/images/index/location-xa.png differ diff --git a/src/assets/images/index/name-bj.png b/src/assets/images/index/name-bj.png index 0ecd583..d3d3262 100644 Binary files a/src/assets/images/index/name-bj.png and b/src/assets/images/index/name-bj.png differ diff --git a/src/assets/images/index/name-gz.png b/src/assets/images/index/name-gz.png index 4cd7b06..00a4112 100644 Binary files a/src/assets/images/index/name-gz.png and b/src/assets/images/index/name-gz.png differ diff --git a/src/assets/images/index/name-sh.png b/src/assets/images/index/name-sh.png index 1a4a87d..fd61a48 100644 Binary files a/src/assets/images/index/name-sh.png and b/src/assets/images/index/name-sh.png differ diff --git a/src/assets/images/index/name-wh.png b/src/assets/images/index/name-wh.png index f6ebec8..d200e6c 100644 Binary files a/src/assets/images/index/name-wh.png and b/src/assets/images/index/name-wh.png differ diff --git a/src/assets/images/index/name-xa.png b/src/assets/images/index/name-xa.png index 51c7232..123d7a7 100644 Binary files a/src/assets/images/index/name-xa.png and b/src/assets/images/index/name-xa.png differ diff --git a/src/assets/images/index/sign-icon.png b/src/assets/images/index/sign-icon.png index 609fa69..eb1a2d2 100644 Binary files a/src/assets/images/index/sign-icon.png and b/src/assets/images/index/sign-icon.png differ diff --git a/src/assets/images/index/tips.png b/src/assets/images/index/tips.png index 28c2626..86234be 100644 Binary files a/src/assets/images/index/tips.png and b/src/assets/images/index/tips.png differ diff --git a/src/assets/images/index/title-flower.png b/src/assets/images/index/title-flower.png index 3c7376f..9fbac11 100644 Binary files a/src/assets/images/index/title-flower.png and b/src/assets/images/index/title-flower.png differ diff --git a/src/assets/images/index/title.png b/src/assets/images/index/title.png index e2ff8a2..77e3c78 100644 Binary files a/src/assets/images/index/title.png and b/src/assets/images/index/title.png differ diff --git a/src/assets/images/index/top-bird-1.png b/src/assets/images/index/top-bird-1.png index 1dca7fc..ba68842 100644 Binary files a/src/assets/images/index/top-bird-1.png and b/src/assets/images/index/top-bird-1.png differ diff --git a/src/assets/images/index/top-bird-2.png b/src/assets/images/index/top-bird-2.png index 8290e64..0e79a49 100644 Binary files a/src/assets/images/index/top-bird-2.png and b/src/assets/images/index/top-bird-2.png differ diff --git a/src/assets/images/load/bar.png b/src/assets/images/load/bar.png index 9952aa8..8da999b 100644 Binary files a/src/assets/images/load/bar.png and b/src/assets/images/load/bar.png differ diff --git a/src/assets/images/load/bg.jpg b/src/assets/images/load/bg.jpg index 13dedf7..a53957b 100644 Binary files a/src/assets/images/load/bg.jpg and b/src/assets/images/load/bg.jpg differ diff --git a/src/assets/images/load/icon.png b/src/assets/images/load/icon.png index ae2a238..154fc8f 100644 Binary files a/src/assets/images/load/icon.png and b/src/assets/images/load/icon.png differ diff --git a/src/assets/images/share.jpg b/src/assets/images/share.jpg index 00c59b5..e83da64 100644 Binary files a/src/assets/images/share.jpg and b/src/assets/images/share.jpg differ diff --git a/src/components/Index.vue b/src/components/Index.vue index bf4d478..f357bbf 100644 --- a/src/components/Index.vue +++ b/src/components/Index.vue @@ -4,26 +4,26 @@
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
+
+
+
+
+
@@ -34,17 +34,22 @@
-
+
+ +
+
+
-
+
-
+
@@ -53,16 +58,23 @@ import gsap from 'gsap' import Plyr from 'plyr'; import 'plyr/dist/plyr.css'; // 导入 Plyr 样式 import ImageFramePlayer from 'image-frame-player'; +import {showSuccessToast} from "vant"; const playerRef = ref(null) const frame = ref(null) const imageFramePlayer = ref(null) -const locationId = ref(1) +const locationId = ref(0) +const isMarkList = ref([false, false, false, false, false]) +const isDone = ref(false) +const isShowDone = ref(false) // 视频库 const videoList = [ - new URL(`../assets/video/gz.mp4`, import.meta.url).href, new URL(`../assets/video/video.mp4`, import.meta.url).href, + new URL(`../assets/video/video.mp4`, import.meta.url).href, + new URL(`../assets/video/video.mp4`, import.meta.url).href, + new URL(`../assets/video/video.mp4`, import.meta.url).href, + new URL(`../assets/video/gz.mp4`, import.meta.url).href, ] // 帧图 @@ -83,9 +95,10 @@ onMounted(() => { autoplay: true, // 自动播放 mute: false, // 初始不静音 loop: { // 循环播放 - active: true + active: false }, }) + }) // 帧图初始化 @@ -93,7 +106,7 @@ const palyFrame = () => { imageFramePlayer.value = new ImageFramePlayer({ dom: document.getElementById("frameBox"), imgArr: frameList, - fps: 35, + fps: 25, useCanvas: true, loop: -1, yoyo: true @@ -105,29 +118,78 @@ const palyFrame = () => { // 播放事件 const playFn = (index) => { - gsap.to(".video-popup", { - autoAlpha: 1, - duration: 0.5 - }); - playerRef.value.source = { - type: 'video', - sources: [ - { - src: videoList[index], - type: 'video/mp4' + + if (locationId.value === 0 || locationId.value === index) { + locationId.value = index + playerRef.value.source = { + type: 'video', + sources: [ + { + src: videoList[locationId.value - 1], + type: 'video/mp4' + } + ] + }; + gsap.to(".xfl-icon", { + autoAlpha: 1, + duration: 0.5, + onComplete: () => { + gsap.to(".video-popup", { + autoAlpha: 1, + duration: 0.5 + }); } - ] - }; + }); + } else { + + gsap.to(".xfl-icon", { + autoAlpha: 0, + duration: 0.5, + onComplete: () => { + locationId.value = index + playerRef.value.source = { + type: 'video', + sources: [ + { + src: videoList[locationId.value - 1], + type: 'video/mp4' + } + ] + }; + gsap.to(".xfl-icon", { + autoAlpha: 1, + duration: 0.5, + onComplete: () => { + gsap.to(".video-popup", { + autoAlpha: 1, + duration: 0.5 + }); + } + }); + } + }); + } + + + // 标记已经去过的地点 + isMarkList.value[locationId.value - 1] = true + } // 关闭弹窗 const hideVideo = () => { + // playerRef.value.fullscreen.enter(); + playerRef.value.stop(); gsap.to(".video-popup", { autoAlpha: 0, duration: 0.5 }); - playerRef.value.pause(); + + if(isDone.value && !isShowDone.value){ + showSuccessToast('您已完成所有任务！') + isShowDone.value = true + } } @@ -135,12 +197,7 @@ const hideVideo = () => { const animationFn = () => { - const tl = gsap.timeline({}); - tl.from(".IndexPage", { - autoAlpha: 0, - scale: 1.2, - duration: 0.75, - ease: "power2.out", + const tl = gsap.timeline({ onComplete: () => { gsap.to(".title-flower", { rotation: 360, @@ -203,6 +260,23 @@ const animationFn = () => { repeat: -1, yoyo: true, }) + gsap.to(".click-tips", { + scale: ".7", + x: "-=10", + duration: 2, + repeat: -1, + yoyo: true, + ease: "bounce.out()", + }) + } + }); + tl.from(".IndexPage", { + autoAlpha: 0, + scale: 1.2, + duration: 0.75, + ease: "power2.out", + onComplete: () => { + } }) .from(".index-title", { @@ -241,6 +315,17 @@ const animationFn = () => { duration: 1, ease: "back.inOut(3)", }, 1.2) + .from(".index-line,.location-mark", { + autoAlpha: 0, + duration: 1, + ease: "back.inOut(3)", + }, 1.5) + .from(".click-tips,.tips-text", { + autoAlpha: 0, + x: 20, + duration: 1, + ease: "back.inOut(3)", + }) @@ -333,6 +418,8 @@ const animationFn = () => { .location-mark { .mark { @include bgSrc("index/sign-icon.png"); + // 灰色滤镜 + filter: grayscale(100%); } .mark-bj { @@ -354,6 +441,10 @@ const animationFn = () => { .mark-gz { @include pos(73px, 75px, 150px, 1558px); } + + .is-mark { + filter: grayscale(0%); + } } .top-bird-1 { @@ -411,13 +502,62 @@ const animationFn = () => { } .xfl-icon { - @include pos(163px, 153px, 245px, 679px); + pointer-events: none; + position: absolute; + width: 163px; + height: 153px; + // 以中心放大1.5倍 + transform: scale(1.5); #frameBox { width: 100%; height: 100%; } } + + .xfl-location-0 { + visibility: hidden; + } + + .xfl-location-1 { + left: 421px; + top: 512px; + } + + .xfl-location-2 { + left: 245px; + top: 679px; + } + + .xfl-location-3 { + left: 347px; + top: 929px; + transform: scaleX(-1) scale(1.5); + + } + + .xfl-location-4 { + left: 104px; + top: 1305px; + } + + .xfl-location-5 { + left: 104px; + top: 1513px; + transform: scaleX(-1) scale(1.5); + } + + .click-tips { + @include pos(58px, 71px, 556px, 500px); + @include bgSrc("index/arrow-icon.png"); + pointer-events: none; + } + + .tips-text { + @include pos(163px, 92px, 586px, 560px); + @include bgSrc("index/tips.png"); + pointer-events: none; + } } .video-popup { @@ -426,17 +566,23 @@ const animationFn = () => { background-color: rgba($color: #000000, $alpha: .6); visibility: hidden; + .cls-btn { + @include box(50px, 50px); + @include bgSrc("index/cls-btn.png"); + margin-top: 40px; + } + .video-box { width: 700px; - // height: 393.75px; border-radius: 12px; border: 1px solid #fff; - // margin-top: -200px; overflow: hidden; .plyr { - // @include box(100%,100%); + @include box(100%, 100%); } } } + + diff --git a/src/data/imgList.js b/src/data/imgList.js index 7d6e02f..5529b71 100644 --- a/src/data/imgList.js +++ b/src/data/imgList.js @@ -27,6 +27,8 @@ const page = [ "index/name-gz.png", "index/name-sh.png", "index/name-wh.png", + "index/cls-btn.png", + "share.jpg", "xlz/xfl_35.png", "xlz/xfl_1.png", diff --git a/src/page/Home/main.js b/src/page/Home/main.js index 0889e7f..bc46f0b 100644 --- a/src/page/Home/main.js +++ b/src/page/Home/main.js @@ -1,8 +1,8 @@ import { createApp } from 'vue' import App from './App.vue' import { wxShare } from '@/plugins/wxshare'; -import {isMobile} from '@/plugins' -import VConsole from 'vconsole'; +// import {isMobile} from '@/plugins' +// import VConsole from 'vconsole'; import 'vant/lib/index.css'; @@ -12,15 +12,15 @@ const app = createApp(App) // 微信分享配置 wxShare({ - title: '今夜宜赏灯，来测测你的专属元宵花灯', - desc: '赏花灯，赢惊喜，欢天喜地闹元宵！', - link: '/index.html' + title: '兴福龙 护航记', + desc: '趣味地图大探索，消保守护每一程', }) + // 测试环境开vconsole -if (isMobile()) { - // const vConsole = new VConsole(); -} +// if (isMobile()) { +// // const vConsole = new VConsole(); +// } app.mount('#app') console.log('Mode:', import.meta.env.VITE_MODE); diff --git a/src/plugins/wxshare.js b/src/plugins/wxshare.js index 3e40880..07affa0 100644 --- a/src/plugins/wxshare.js +++ b/src/plugins/wxshare.js @@ -36,7 +36,7 @@ export function wxShare(option) { link: linkUrl, // 分享链接 title: option.title, // 分享标题 desc: option.desc, // 分享描述 - imgUrl: imgUrl, // 分享图标 + imgUrl: new URL(`@/assets/images/share.jpg`, import.meta.url).href, // 分享图标 success() {// 用户成功分享后执行的回调函数 showToast('分享成功') }, @@ -45,7 +45,7 @@ export function wxShare(option) { link: linkUrl, // 分享链接 title: option.title, // 分享标题 desc: option.desc, // 分享描述 - imgUrl: imgUrl, // 分享图标 + imgUrl: new URL(`@/assets/images/share.jpg`, import.meta.url).href, // 分享图标 success() {// 用户成功分享后执行的回调函数 showToast('分享成功') diff --git a/vite.config.js b/vite.config.js index d09e022..ec68954 100644 --- a/vite.config.js +++ b/vite.config.js @@ -31,7 +31,7 @@ export default defineConfig(({ command, mode }) => { template: 'index.html', injectOptions: { data: { - title: '猜灯谜闹元宵', + title: '兴福龙 护航记', }, } }, @@ -105,7 +105,7 @@ export default defineConfig(({ command, mode }) => { }, }, // 公共基础路径：构建生产环境时自动载入cdn路径 - base: mode == 'production' ? env.VITE_CDN + env.VITE_FOLDER + '/' : './', + base: mode == 'production' ? env.VITE_CDN : './', // 打包配置 build: { assetsPublicPath: './',