hookehuyr

fix 显示细节调整

<!--
* @Date: 2024-04-07 10:15:55
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-04-18 14:02:53
* @LastEditTime: 2024-04-18 17:45:34
* @FilePath: /fxPark/src/views/fxPark/index.vue
* @Description: 首页
-->
......@@ -31,7 +31,7 @@
:style="{ zIndex: index + 2 }"
>
<img src="https://cdn.ipadbiz.cn/xfPark/index/bg.1713248259.jpg" class="img" style="z-index: 1;">
<div v-if="all_no_light" id="magnifying-glass-box">
<div v-if="no_light" id="magnifying-glass-box">
<div style="position: absolute; left: 0.5rem; bottom: -3rem; background-image: url('https://cdn.ipadbiz.cn/xfPark/index/word.1713418535.png'); background-size: 80% 80%; width: 12rem; height: 3rem; background-repeat: no-repeat;"></div>
</div>
</div>
......@@ -114,7 +114,7 @@ const offset = ref({ x: -10, y: 500 });
const data_list = ref([]);
const all_actived = ref(false); // 全部激活
const all_no_light = ref(true); // 全部未激活
const no_light = ref(false); // 存在未激活
const space_height = ref('10vh'); // 第一次进入没有导航栏
......@@ -127,7 +127,6 @@ onMounted(async () => {
const { code, data } = await getTreeAPI();
if (code) {
let index = data.findIndex(item => item.is_tree === 0); // 全点亮标识
let light_index = data.findIndex(item => item.is_light === '1'); // 点亮标识
data_list.value = data.filter(item => item.is_tree === 1); // 获取植物信息,提出最后一个非植物。
data_list.value.forEach(item => {
......@@ -136,9 +135,8 @@ onMounted(async () => {
if (index !== -1) { // 全点亮
all_actived.value = true;
}
if (light_index === -1) { // 全未点亮
all_no_light.value = true;
} else {
no_light.value = true; // 全未点亮
}
}
});
......
......@@ -4,6 +4,10 @@
<img src="https://cdn.ipadbiz.cn/xfPark/post/public/go-back-btn.1713241695.png" style="width: 2rem; height: 2rem;">
</div>
<div class="poster-contain-wrapper">
<div style="color: #975E4D; text-align: center; margin-bottom: 1rem;">
<span v-if="all_actived">请至园艺小站领取神秘礼物哦!</span>
<span v-else>还有{{ un_light_num }}个任务等待你寻找哦!</span>
</div>
<div v-if="flag" style="border: 1.5px solid #9C8882; box-shadow: 8px 8px 8px 0px rgba(156,136,130,1); height: 100%;">
<div ref="canvasRef" class="poster-contain" style="">
<div v-if="tree_data?.name" class="poster-text-boxer">
......@@ -76,6 +80,8 @@ const raw_data = ref([]);
const tree_data = ref({});
const posterIndex = ref(0);
const all_actived = ref(false); // 全部激活
const un_light_num = ref(0); // 点亮的数量
onMounted(async () => {
const { code, data } = await getTreeAPI();
......@@ -84,6 +90,8 @@ onMounted(async () => {
let index = raw_data.value.findIndex(item => item.revision == revision); // 植被信息index
tree_data.value = raw_data.value[index]; // 获取当前植被信息
imgSrc.value = tree_data.value.user_poster !== null ? tree_data.value.user_poster : tree_data.value.poster_pic;
all_actived.value = data.findIndex(item => item.is_tree === 0) !== -1 ? true : false;
un_light_num.value = data.filter(item => item.is_tree === 1).length - data.filter(item => item.is_light === '1').length;
}
nextTick(() => {
let canvasDom = canvasRef.value;
......