Hooke / fxPark

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
a53b8f64 1 parent b10048f2

fix 细节调整

Inline Side-by-side
Showing 11 changed files with 16 additions and 10 deletions
1 <!-- 1 <!--
2 * @Date: 2024-04-10 15:08:08 2 * @Date: 2024-04-10 15:08:08
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-04-12 13:13:50 4 + * @LastEditTime: 2024-04-16 14:08:28
5 * @FilePath: /fxPark/src/views/fxPark/audio.vue 5 * @FilePath: /fxPark/src/views/fxPark/audio.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 <van-icon v-if="audioStatus === 'pause'" name="play" size="1.5rem" @click="handelPlay" /> 25 <van-icon v-if="audioStatus === 'pause'" name="play" size="1.5rem" @click="handelPlay" />
26 <van-icon v-if="audioStatus === 'play'" name="pause" size="1.5rem" @click="handlePause" /> 26 <van-icon v-if="audioStatus === 'play'" name="pause" size="1.5rem" @click="handlePause" />
27 <van-icon @click="audioNext" name="arrow" size="1.5rem" /> 27 <van-icon @click="audioNext" name="arrow" size="1.5rem" />
28 + <van-icon @click="showList" name="arrow-down" size="1.5rem" />
28 </div> 29 </div>
29 </div> 30 </div>
30 </van-col> 31 </van-col>
...@@ -44,10 +45,10 @@ ...@@ -44,10 +45,10 @@
44 </div> 45 </div>
45 </div> --> 46 </div> -->
46 <div> 47 <div>
47 - <audio ref="audioPlayer" loop="loop" id="audios" :src="audio_list[audioIndex]?.audio_url" preoload></audio> 48 + <audio ref="audioPlayer" loop="loop" id="audios" :src="audio_list[audioIndex]?.audio_url" preload></audio>
48 </div> 49 </div>
49 </div> 50 </div>
50 - <div style="width: 75vw; height: 15rem; border: 1px solid #fff;"> 51 + <div v-if="show_audio_list" style="width: 100%; height: 15rem; border: 1px solid #fff;">
51 <div @click="audioPlay(index)" v-for="(item, index) in audio_list" :key="index">{{ item.audio_name }}</div> 52 <div @click="audioPlay(index)" v-for="(item, index) in audio_list" :key="index">{{ item.audio_name }}</div>
52 </div> 53 </div>
53 </div> 54 </div>
...@@ -143,6 +144,11 @@ const audioNext = () => { ...@@ -143,6 +144,11 @@ const audioNext = () => {
143 }); 144 });
144 }; 145 };
145 146
147 +const show_audio_list = ref(false);
148 +const showList = () => {
149 + show_audio_list.value = !show_audio_list.value;
150 +};
151 +
146 </script> 152 </script>
147 153
148 <style lang="less" scoped> 154 <style lang="less" scoped>
......
1 <!-- 1 <!--
2 * @Date: 2024-04-07 10:15:55 2 * @Date: 2024-04-07 10:15:55
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-04-15 14:09:39 4 + * @LastEditTime: 2024-04-16 14:19:41
5 * @FilePath: /fxPark/src/views/fxPark/index.vue 5 * @FilePath: /fxPark/src/views/fxPark/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
30 class="img" 30 class="img"
31 :style="{ zIndex: index + 2 }" 31 :style="{ zIndex: index + 2 }"
32 > 32 >
33 - <img src="https://cdn.ipadbiz.cn/xfPark/index/bg.1713145862.jpg" class="img" style="z-index: 1;"> 33 + <img src="https://cdn.ipadbiz.cn/xfPark/index/bg.1713248259.jpg" class="img" style="z-index: 1;">
34 <div v-if="all_no_light" id="magnifying-glass-box"></div> 34 <div v-if="all_no_light" id="magnifying-glass-box"></div>
35 </div> 35 </div>
36 36
......
1 <!-- 1 <!--
2 * @Date: 2024-04-10 16:08:09 2 * @Date: 2024-04-10 16:08:09
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-04-16 10:30:59 4 + * @LastEditTime: 2024-04-16 14:23:06
5 * @FilePath: /fxPark/src/views/fxPark/intro.vue 5 * @FilePath: /fxPark/src/views/fxPark/intro.vue
6 * @Description: 植被介绍页 6 * @Description: 植被介绍页
7 --> 7 -->
...@@ -10,12 +10,12 @@ ...@@ -10,12 +10,12 @@
10 <div class="audio-wrapper" @click="handleAudio"> 10 <div class="audio-wrapper" @click="handleAudio">
11 <img 11 <img
12 :class="[audioStatus === 'play' ? 'play' : 'pause']" 12 :class="[audioStatus === 'play' ? 'play' : 'pause']"
13 - :src="audioStatus === 'play' ? 'https://cdn.ipadbiz.cn/xfPark/intro/close-music-btn.1713232270.png' : 'https://cdn.ipadbiz.cn/xfPark/intro/open-music-btn.1713232270.png'" 13 + :src="audioStatus === 'play' ? 'https://cdn.ipadbiz.cn/xfPark/intro/public/close-music-btn.1713232270.png' : 'https://cdn.ipadbiz.cn/xfPark/intro/public/open-music-btn.1713232270.png'"
14 > 14 >
15 <audio ref="audioPlayer" loop="loop" id="audios" :src="audio_list[audioIndex]?.audio_url" preload></audio> 15 <audio ref="audioPlayer" loop="loop" id="audios" :src="audio_list[audioIndex]?.audio_url" preload></audio>
16 </div> 16 </div>
17 <div class="go-back-wrapper" @click="goToIndex"> 17 <div class="go-back-wrapper" @click="goToIndex">
18 - <img src="https://cdn.ipadbiz.cn/xfPark/intro/go-back-btn.1713232270.png"> 18 + <img src="https://cdn.ipadbiz.cn/xfPark/intro/public/go-back-btn.1713232270.png">
19 </div> 19 </div>
20 <div class="intro-img-wrapper"> 20 <div class="intro-img-wrapper">
21 <img :src="INTRO_IMG[revision][0]"> 21 <img :src="INTRO_IMG[revision][0]">
...@@ -23,8 +23,8 @@ ...@@ -23,8 +23,8 @@
23 </div> 23 </div>
24 <div class="go-poster-wrapper" @click="goToPoster"> 24 <div class="go-poster-wrapper" @click="goToPoster">
25 <!-- <div style="background-color: #F68015; display: inline-block; padding: 0.7rem 2rem; border-radius: 1.5rem;">完成“碳寻”任务</div> --> 25 <!-- <div style="background-color: #F68015; display: inline-block; padding: 0.7rem 2rem; border-radius: 1.5rem;">完成“碳寻”任务</div> -->
26 - <img src="https://cdn.ipadbiz.cn/xfPark/intro/gongxi.1713232270.png" style="pointer-events:none;display: block; width: 50%; margin-bottom: 1.5rem;"> 26 + <img src="https://cdn.ipadbiz.cn/xfPark/intro/public/gongxi.1713232270.png" style="pointer-events:none;display: block; width: 50%; margin-bottom: 1.5rem;">
27 - <img src="https://cdn.ipadbiz.cn/xfPark/intro/finish-btn.1713232270.png" style="pointer-events:none;display: block; width: 50%;"> 27 + <img src="https://cdn.ipadbiz.cn/xfPark/intro/public/finish-btn.1713232270.png" style="pointer-events:none;display: block; width: 50%;">
28 </div> 28 </div>
29 <!-- <div style="margin: 1rem;"> 29 <!-- <div style="margin: 1rem;">
30 <div style="margin-bottom: 1rem;"> 30 <div style="margin-bottom: 1rem;">
......