sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改头部显示逻辑

master
于肖磊 2024-10-09 17:43:23 +08:00
parent c0be9db0b7
commit c931d0e952
1 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
components/diy/header.vue
View File

@ -1,6 +1,9 @@
<template>
<view v-if="(propValue || null) !== null" class="header-container">
<view class="header-around wh-auto header-z-3" :style="roll_style + position">
<view class="wh-auto ht-auto pa up_slide_bg" :style="up_slide_style">
<view class="wh-auto ht-auto" :style="up_slide_img_style"></view>
</view>
<view :style="top_content_style">
<view class="header-content flex-row align-s">
<view class="model-top flex-1 mt-1">
@ -127,21 +130,24 @@
// #endif
// 判断是否是沉浸模式
is_immersion_model: false,
up_slide_style: '',
up_slide_img_style: '',
};
},
watch: {
propScrollTop(newVal) {
if (this.header_background_type != 'color_image') {
if (newVal < this.header_top) {
this.setData({
// 20是大小误差
roll_style: this.roll_style + 'background: rgba(255,255,255,' + (newVal + 20 < this.header_top ? 0 : (newVal / this.header_top).toFixed(2)) + ');',
});
} else {
this.setData({
roll_style: this.roll_style + 'background: rgba(255,255,255,1);',
});
}
if (newVal < this.header_top) {
console.log(this.propValue);
const { up_slide_background_color_list, up_slide_background_direction, up_slide_background_img, up_slide_background_img_style } = this.propValue.style || {};
// 渐变
const gradient = { color_list: up_slide_background_color_list, direction: up_slide_background_direction };
// 背景图
const back = { background_img: up_slide_background_img, background_img_style: up_slide_background_img_style };
this.setData({
// 20是大小误差
up_slide_style: gradient_computer(gradient) + 'opacity:' + (newVal / (this.header_top + 33) > 1 ? 1 : (newVal / (this.header_top + 33)).toFixed(2)) + ';',
up_slide_img_style: background_computer(back),
});
}
},
propkey(val) {
@ -284,4 +290,7 @@
top: 0;
padding-left: 0;
}
.up_slide_bg {
z-index: -1;
}
</style>