1.diy---header

master
sws 2024-09-25 11:01:54 +08:00
parent 797b34abae
commit 72ab207e9e
3 changed files with 17 additions and 8 deletions

View File

@ -148,7 +148,15 @@
//
is_tabs_type: true,
header_top: bar_height + 120,
// #ifdef MP
header_top: 'padding-top:' + (bar_height + 154) + 'rpx;',
// #endif
// #ifdef H5 || MP-TOUTIAO
header_top: 'padding-top:' + (bar_height + 158) + 'rpx;',
// #endif
// #ifdef APP
header_top: 'padding-top:' + (bar_height + 144) + 'rpx;',
// #endif
header_data: {},
footer_data: {},
@ -177,7 +185,7 @@
},
computed: {
diy_content_style() {
return `padding-top:${this.header_top}rpx;padding-bottom:${this.padding_footer_computer}rpx`;
return this.header_top + `padding-bottom:${this.padding_footer_computer}rpx;`;
},
},
created() {

View File

@ -1,6 +1,6 @@
<template>
<view class="header-container" :style="roll_style + position">
<view class="bg-white pf top-0 left-0 right-0 margin-bottom-sm" :style="top_content_style">
<view class="bg-white pf top-0 left-0 right-0 padding-bottom" :style="top_content_style">
<view class="header-content flex-row align-c">
<view class="model-top flex-1">
<view class="roll pr z-i">
@ -111,7 +111,8 @@
// #ifdef MP-WEIXIN || MP-BAIDU || MP-QQ || MP-KUAISHOU
const custom = uni.getMenuButtonBoundingClientRect();
menuButtonInfo = `max-width:calc(100% - ${custom.width + 130}rpx);`;
console.log(custom);
menuButtonInfo = `max-width:calc(100% - ${custom.width + 30}px);`;
// #endif
this.setData({
form: this.value,

View File

@ -4,7 +4,7 @@
<view class="flex-row gap-10 jc-sb align-c">
<view class="tabs flex-1 flex-width">
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true" :scroll-into-view="'one-nav-item-' + active_index" class="wh-auto">
<view class="flex-row" :style="'column-gap: ' + tabs_spacing + 'px;'">
<view class="flex-row" :style="'column-gap: ' + tabs_spacing + 'rpx;'">
<view v-for="(item, index) in tabs_list" :key="index" :id="'one-nav-item-' + index" class="item nowrap flex-col jc-c gap-4" :class="tabs_theme + (index == active_index ? ' active' : '')" :data-index="index" @tap="handle_event">
<image v-if="!isEmpty(item.img)" :src="item.img[0].url" class="img" mode="widthFix" />
<view class="title" :style="index == active_index ? tabs_theme_style.tabs_title_checked : tabs_theme_style.tabs_title">{{ item.title }}</view>
@ -104,11 +104,11 @@
};
//
const new_tabs_theme_style = {
tabs_title_checked: `font-weight: ${new_style.tabs_weight_checked};font-size: ${new_style.tabs_size_checked}px;color:${new_style.tabs_color_checked};` + (['2', '4'].includes(this.tabs_theme_index) ? this.tabs_check : ``),
tabs_title: `font-weight: ${new_style.tabs_weight};font-size: ${new_style.tabs_size}px;color:${new_style.tabs_color};`,
tabs_title_checked: `font-weight: ${new_style.tabs_weight_checked};font-size: ${new_style.tabs_size_checked * 2}rpx;color:${new_style.tabs_color_checked};` + (['2', '4'].includes(this.tabs_theme_index) ? this.tabs_check : ``),
tabs_title: `font-weight: ${new_style.tabs_weight};font-size: ${new_style.tabs_size * 2}rpx;color:${new_style.tabs_color};`,
};
this.setData({
tabs_spacing: new_style.tabs_spacing,
tabs_spacing: Number(new_style.tabs_spacing * 2),
tabs_list: new_content.tabs_list,
//
tabs_theme: this.get_tabs_theme(new_content),