微信小程序发布试用版本
This commit is contained in:
zhonghua1
@@ -10,15 +10,131 @@ const _sfc_main = {
|
||||
MaterialTab
|
||||
},
|
||||
data() {
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
const statusBarHeight = systemInfo.statusBarHeight || 20;
|
||||
const navbarHeight = 44;
|
||||
const statusBarHeightRpx = statusBarHeight * 2;
|
||||
const navbarHeightRpx = navbarHeight * 2;
|
||||
const totalNavbarHeight = statusBarHeightRpx + navbarHeightRpx;
|
||||
return {
|
||||
navbarTop: totalNavbarHeight + "rpx",
|
||||
// tab栏距离顶部的距离
|
||||
contentTop: totalNavbarHeight + 72 + "rpx",
|
||||
// 内容区域距离顶部的距离（tab栏高度72rpx）
|
||||
activeTab: "practice"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// 计算导航栏和内容区域的位置（使用计算属性确保响应式）
|
||||
computedNavbarTop() {
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
const statusBarHeight = systemInfo.statusBarHeight || 20;
|
||||
const navbarHeight = 44;
|
||||
const statusBarHeightRpx = statusBarHeight * 2;
|
||||
const navbarHeightRpx = navbarHeight * 2;
|
||||
const totalNavbarHeight = statusBarHeightRpx + navbarHeightRpx;
|
||||
return totalNavbarHeight + "rpx";
|
||||
},
|
||||
computedContentTop() {
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
const statusBarHeight = systemInfo.statusBarHeight || 20;
|
||||
const navbarHeight = 44;
|
||||
const statusBarHeightRpx = statusBarHeight * 2;
|
||||
const navbarHeightRpx = navbarHeight * 2;
|
||||
const totalNavbarHeight = statusBarHeightRpx + navbarHeightRpx;
|
||||
return totalNavbarHeight + 72 + "rpx";
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:144", "[FurnitureTopSales][onLoad] 页面加载");
|
||||
this.updateNavbarPosition();
|
||||
},
|
||||
onShow() {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:150", "[FurnitureTopSales][onShow] 页面显示");
|
||||
this.$nextTick(() => {
|
||||
this.updateNavbarPosition();
|
||||
setTimeout(() => {
|
||||
this.updateNavbarPosition();
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:158", "[FurnitureTopSales][onShow] 延迟更新后的位置:", {
|
||||
navbarTop: this.navbarTop,
|
||||
contentTop: this.contentTop
|
||||
});
|
||||
}, 50);
|
||||
});
|
||||
},
|
||||
onReady() {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:167", "[FurnitureTopSales][onReady] 页面渲染完成");
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:168", "[FurnitureTopSales][onReady] activeTab:", this.activeTab);
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:169", "[FurnitureTopSales][onReady] navbarTop:", this.navbarTop);
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:170", "[FurnitureTopSales][onReady] contentTop:", this.contentTop);
|
||||
this.updateNavbarPosition();
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:176", "[FurnitureTopSales][onReady] 系统信息:", {
|
||||
statusBarHeight: systemInfo.statusBarHeight,
|
||||
windowHeight: systemInfo.windowHeight,
|
||||
screenHeight: systemInfo.screenHeight
|
||||
});
|
||||
setTimeout(() => {
|
||||
const query = common_vendor.index.createSelectorQuery().in(this);
|
||||
query.select(".tabs").boundingClientRect((data) => {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:187", "[FurnitureTopSales][onReady] tab栏元素信息:", data);
|
||||
if (!data) {
|
||||
common_vendor.index.__f__("error", "at pages/furniture_top_sales/furniture_top_sales.vue:189", "[FurnitureTopSales][onReady] tab栏元素未找到！");
|
||||
} else {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:191", "[FurnitureTopSales][onReady] tab栏位置:", {
|
||||
top: data.top,
|
||||
left: data.left,
|
||||
width: data.width,
|
||||
height: data.height,
|
||||
expectedTop: this.navbarTop,
|
||||
isVisible: data.width > 0 && data.height > 0,
|
||||
isOnScreen: data.top >= 0 && data.top < systemInfo.windowHeight
|
||||
});
|
||||
if (data.width === 0 || data.height === 0 || data.top < 0) {
|
||||
common_vendor.index.__f__("warn", "at pages/furniture_top_sales/furniture_top_sales.vue:203", "[FurnitureTopSales][onReady] tab栏不可见，强制更新位置");
|
||||
this.updateNavbarPosition();
|
||||
this.$forceUpdate();
|
||||
}
|
||||
}
|
||||
}).exec();
|
||||
}, 100);
|
||||
},
|
||||
methods: {
|
||||
// 计算并更新导航栏和内容区域的位置
|
||||
updateNavbarPosition() {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:215", "[FurnitureTopSales][updateNavbarPosition] 开始更新导航栏位置");
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
const statusBarHeight = systemInfo.statusBarHeight || 20;
|
||||
const navbarHeight = 44;
|
||||
const statusBarHeightRpx = statusBarHeight * 2;
|
||||
const navbarHeightRpx = navbarHeight * 2;
|
||||
const totalNavbarHeight = statusBarHeightRpx + navbarHeightRpx;
|
||||
const navbarTop = totalNavbarHeight + "rpx";
|
||||
const contentTop = totalNavbarHeight + 72 + "rpx";
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:227", "[FurnitureTopSales][updateNavbarPosition] 更新导航栏位置:", {
|
||||
statusBarHeight,
|
||||
navbarHeight,
|
||||
totalNavbarHeight,
|
||||
navbarTop,
|
||||
contentTop,
|
||||
currentNavbarTop: this.navbarTop,
|
||||
currentContentTop: this.contentTop
|
||||
});
|
||||
this.$set(this, "navbarTop", navbarTop);
|
||||
this.$set(this, "contentTop", contentTop);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
goBack() {
|
||||
common_vendor.index.navigateBack();
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length <= 1) {
|
||||
common_vendor.index.__f__("log", "at pages/furniture_top_sales/furniture_top_sales.vue:252", "[FurnitureTopSales][goBack] 当前是第一个页面，无法返回");
|
||||
return;
|
||||
}
|
||||
common_vendor.index.navigateBack({
|
||||
fail: (err) => {
|
||||
common_vendor.index.__f__("error", "at pages/furniture_top_sales/furniture_top_sales.vue:257", "[FurnitureTopSales][goBack] 返回失败:", err);
|
||||
}
|
||||
});
|
||||
},
|
||||
switchTab(tab) {
|
||||
this.activeTab = tab;
|
||||
@@ -61,18 +177,25 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
h: common_vendor.o(($event) => $options.switchTab("quality")),
|
||||
i: $data.activeTab === "material" ? 1 : "",
|
||||
j: common_vendor.o(($event) => $options.switchTab("material")),
|
||||
k: $data.activeTab === "practice"
|
||||
k: $options.computedNavbarTop || $data.navbarTop,
|
||||
l: $data.activeTab === "practice"
|
||||
}, $data.activeTab === "practice" ? {
|
||||
l: common_vendor.o($options.handleSwitchToTraining)
|
||||
m: $options.computedContentTop || $data.contentTop,
|
||||
n: common_vendor.o($options.handleSwitchToTraining)
|
||||
} : {}, {
|
||||
m: $data.activeTab === "training"
|
||||
o: $data.activeTab === "training"
|
||||
}, $data.activeTab === "training" ? {
|
||||
n: common_vendor.o($options.handleRefreshTrainingList)
|
||||
p: $options.computedContentTop || $data.contentTop,
|
||||
q: common_vendor.o($options.handleRefreshTrainingList)
|
||||
} : {}, {
|
||||
o: $data.activeTab === "quality"
|
||||
}, $data.activeTab === "quality" ? {} : {}, {
|
||||
p: $data.activeTab === "material"
|
||||
}, $data.activeTab === "material" ? {} : {});
|
||||
r: $data.activeTab === "quality"
|
||||
}, $data.activeTab === "quality" ? {
|
||||
s: $options.computedContentTop || $data.contentTop
|
||||
} : {}, {
|
||||
t: $data.activeTab === "material"
|
||||
}, $data.activeTab === "material" ? {
|
||||
v: $options.computedContentTop || $data.contentTop
|
||||
} : {});
|
||||
}
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
|
||||
@@ -1 +1 @@
|
||||
<view class="page"><uni-nav-bar wx:if="{{b}}" bindclickLeft="{{a}}" u-i="1348b848-0" bind:__l="__l" u-p="{{b}}"></uni-nav-bar><view class="content"><view class="tabs"><view class="{{['tab-item', c && 'active']}}" bindtap="{{d}}"><text>场景</text></view><view class="{{['tab-item', e && 'active']}}" bindtap="{{f}}"><text>陪练</text></view><view class="{{['tab-item', g && 'active']}}" bindtap="{{h}}"><text>质检</text></view><view class="{{['tab-item', i && 'active']}}" bindtap="{{j}}"><text>素材</text></view></view><practice-tab wx:if="{{k}}" bindswitchToTraining="{{l}}" u-i="1348b848-1" bind:__l="__l"></practice-tab><training-tab wx:if="{{m}}" bindrefreshTrainingList="{{n}}" u-i="1348b848-2" bind:__l="__l"></training-tab><scroll-view wx:if="{{o}}" class="tab-content" scroll-y><view class="champion-card"><text class="champion-title">质检</text><text class="champion-desc">这里是质检相关的内容展示区域</text></view></scroll-view><material-tab wx:if="{{p}}" u-i="1348b848-3" bind:__l="__l"></material-tab></view></view>
|
||||
<view class="page"><uni-nav-bar wx:if="{{b}}" bindclickLeft="{{a}}" u-i="1348b848-0" bind:__l="__l" u-p="{{b}}"></uni-nav-bar><view class="content"><view class="tabs" style="{{'top:' + k}}"><view class="{{['tab-item', c && 'active']}}" bindtap="{{d}}"><text>场景</text></view><view class="{{['tab-item', e && 'active']}}" bindtap="{{f}}"><text>陪练</text></view><view class="{{['tab-item', g && 'active']}}" bindtap="{{h}}"><text>质检</text></view><view class="{{['tab-item', i && 'active']}}" bindtap="{{j}}"><text>素材</text></view></view><practice-tab wx:if="{{l}}" class="tab-content-container" style="{{'top:' + m}}" bindswitchToTraining="{{n}}" u-i="1348b848-1" bind:__l="__l"></practice-tab><training-tab wx:if="{{o}}" class="tab-content-container" style="{{'top:' + p}}" bindrefreshTrainingList="{{q}}" u-i="1348b848-2" bind:__l="__l"></training-tab><scroll-view wx:if="{{r}}" class="tab-content tab-content-container" style="{{'top:' + s}}" scroll-y><view class="champion-card"><text class="champion-title">质检</text><text class="champion-desc">这里是质检相关的内容展示区域</text></view></scroll-view><material-tab wx:if="{{t}}" class="tab-content-container" style="{{'top:' + v}}" u-i="1348b848-3" bind:__l="__l"></material-tab></view></view>
|
||||
@@ -20,16 +20,24 @@ page {
|
||||
|
||||
/* 标签页 */
|
||||
.tabs {
|
||||
display: flex;
|
||||
display: flex !important; /* 强制显示 */
|
||||
visibility: visible !important; /* 强制可见 */
|
||||
opacity: 1 !important; /* 强制不透明 */
|
||||
background-color: #FFFFFF;
|
||||
border-bottom: 1px solid #E0E0E0;
|
||||
padding: 0 16rpx;
|
||||
margin-top: 0;
|
||||
position: absolute;
|
||||
top: 88rpx; /* 导航栏高度 */
|
||||
position: fixed; /* 改为fixed定位，确保始终可见 */
|
||||
/* 导航栏高度：statusBar + navbar，动态计算 */
|
||||
/* 使用内联样式动态设置top值 */
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1;
|
||||
z-index: 999; /* 提高z-index确保在最上层 */
|
||||
height: 72rpx; /* 明确设置标签页高度 */
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
/* 确保tab栏始终可见 */
|
||||
will-change: top; /* 优化渲染性能 */
|
||||
}
|
||||
.tab-item {
|
||||
padding: 24rpx 32rpx;
|
||||
@@ -77,3 +85,19 @@ page {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* tab内容容器 */
|
||||
.tab-content-container {
|
||||
/* 使用绝对定位，从tab页底部开始，到底部导航栏结束 */
|
||||
position: absolute;
|
||||
/* top值通过内联样式动态设置 */
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 96rpx; /* 底部导航栏高度 */
|
||||
overflow-y: auto;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
.tab-content {
|
||||
padding: 24rpx 16rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user