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

1.顶部导航优化

master
sws 2024-10-17 10:50:29 +08:00
parent bc07456438
commit e7b67cfe0a
2 changed files with 22 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/diy/diy.vue
View File

@ -8,8 +8,8 @@
</view>
<view class="content flex-col" :style="'padding-top:' + (temp_is_header_top ? temp_header_top : '0')">
<view v-for="item in tabs_data" :key="item.key">
<componentDiyTabs v-if="item.key == 'tabs'" :propValue="item.com_data" :propTop="temp_sticky_top" :propNavIsTop="is_header_top" :propTabsIsTop="is_header_top ? is_header_top && temp_is_header_top : temp_is_header_top" @computer-height="tabs_height_event" @tabs-click="tabs_click_event"></componentDiyTabs>
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :propValue="item.com_data" :propTop="temp_sticky_top" :propNavIsTop="is_header_top" :propTabsIsTop="is_header_top ? is_header_top && temp_is_header_top : temp_is_header_top" @computer-height="tabs_height_event" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
<componentDiyTabs v-if="item.key == 'tabs'" :propValue="item.com_data" :propTop="temp_sticky_top" :propNavIsTop="is_header_top" :propTabsIsTop="temp_is_header_top" @computer-height="tabs_height_event" @tabs-click="tabs_click_event"></componentDiyTabs>
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :propValue="item.com_data" :propTop="temp_sticky_top" :propNavIsTop="is_header_top" :propTabsIsTop="temp_is_header_top" @computer-height="tabs_height_event" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
</view>
<template v-if="is_tabs_type">
<template v-if="diy_data.length > 0">
@ -123,7 +123,7 @@
import componentSearch from '@/components/search/search';
var system = app.globalData.get_system_info(null, null, true);
var sys_width = app.globalData.window_width_handle(system.windowWidth);
// 状态栏高度
var bar_height = parseInt(app.globalData.get_system_info('statusBarHeight', 0));
// #ifdef MP-TOUTIAO
@ -175,7 +175,7 @@
componentNoData,
componentBottomLine,
componentGoodsBuy,
componentSearch
componentSearch,
},
data() {
return {
@ -244,6 +244,8 @@
video_src: '',
popup_width: '0rpx',
popup_height: '0rpx',
// 顶部导航是否换行
is_search_alone_row: false,
};
},
watch: {
@ -289,6 +291,8 @@
is_header_top: parseInt(this.propValue.header.com_data.style.up_slide_display) == 1 ? true : false,
temp_sticky_top: this.sticky_top,
temp_header_top: this.header_top,
// 顶部导航高度是否变化--------------------------------------------------
is_search_alone_row: false,
});
// 缓存数据
@ -524,7 +528,7 @@
search_form: form,
hot_word_list: list,
search_hot_words_color: color,
is_focus: true
is_focus: true,
});
this.$refs.searchPopup.open();
},
@ -552,7 +556,7 @@
</script>
<style lang="scss" scoped>
.search-popup {
z-index: 100 !important;
}
.search-popup {
z-index: 100 !important;
}
</style>

16
components/diy/header.vue
View File

@ -9,7 +9,7 @@
<view class="header-content flex-row align-s">
<view class="model-top flex-1 mt-1">
<view class="roll pr z-i">
<view class="model-head pr flex-row align-c" :style="header_style">
<view class="model-head pr flex-col" :style="'height:' + (is_search_alone_row ? '132rpx' : '66rpx') + ';' + header_style">
<view class="model-head-content flex-row align-c jc-sb gap-16 wh-auto pr padding-left-main">
<view v-if="!is_tabbar_pages" class="z-i dis-inline-block margin-top-xs" @tap="top_nav_left_back_event">
<iconfont name="icon-arrow-left" size="40rpx" propContainerDisplay="flex" :color="form.style.left_back_btn_color || '#333'"></iconfont>
@ -22,7 +22,7 @@
</view>
</template>
<view v-if="['1', '2'].includes(form.content.theme)">{{ form.content.title }}</view>
<template v-if="['3', '5'].includes(form.content.theme)">
<template v-if="['3', '5'].includes(form.content.theme) && !is_search_alone_row">
<view class="flex-1">
<componentDiySearch :propValue="form" :propIsPageSettings="true"></componentDiySearch>
</view>
@ -33,7 +33,7 @@
<view class="flex-row align-c gap-2">
<component-choice-location :propBaseColor="form.style.position_color" :propTextDefaultName="form.content.positioning_name" :propIsIconArrow="form.content.is_arrows_show == '1'" :propTextMaxWidth="['4'].includes(form.content.theme) ? '300rpx' : '150rpx'" @onback="user_back_choice_location"></component-choice-location>
</view>
<template v-if="['5'].includes(form.content.theme)">
<template v-if="['5'].includes(form.content.theme) && !is_search_alone_row">
<view class="flex-1">
<componentDiySearch :propValue="form" :propIsPageSettings="true"></componentDiySearch>
</view>
@ -46,6 +46,9 @@
</view>
</view>
</view>
<view class="padding-horizontal-main">
<componentDiySearch :propValue="form" :propIsPageSettings="true"></componentDiySearch>
</view>
</view>
</view>
</view>
@ -135,6 +138,8 @@
up_slide_img_style: '',
// 当前页面是否在底部菜单中
is_tabbar_pages: app.globalData.is_tabbar_pages(),
// 判断header的查询是否独行
is_search_alone_row: false,
};
},
watch: {
@ -198,6 +203,8 @@
header_style: menu_button_info,
header_background_type: header_background_type,
is_immersion_model: header_background_type !== 'color_image' && immersive_style == '1',
// is_search_alone_row: new_content.is_search_alone_row == '1',
is_search_alone_row: true,
});
this.$emit('immersion-model-call-back', this.is_immersion_model);
},
@ -237,9 +244,6 @@
.header-around {
z-index: 4;
}
.header-content {
height: 66rpx;
}
.model-top {
.roll {
width: 100%;