ss002/RenyiXCX
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页优化完成

Browse Source
This commit is contained in:
lym
2026-03-29 00:52:05 +08:00
parent c93c946f13
commit ba8fef5edf
20 changed files with 143 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
pages/index/index.js
View File

@@ -29,6 +29,7 @@ var mp3data = null;
var mp3index = 0;
Page({
data: {
statusBarHeight: 0,
indicatorDots: true,
indicatorDots0: true,
ifxn: 0,
@@ -147,6 +148,16 @@ Page({
canIUseGetUserProfile: true
})
}
// 获取系统信息，用于标题位置适配
wx.getSystemInfo({
success: function (res) {
that.setData({
statusBarHeight: res.statusBarHeight
})
}
})
wx.setBackgroundColor({
backgroundColor: "#96C6F5",
})

3
pages/index/index.json
View File

@@ -1,3 +1,4 @@
{
"navigationStyle": "custom",
"navigationBarTitleText": "仁E森命"
}
}

14
pages/index/index.wxml
View File

@@ -1,7 +1,13 @@
<!--index.wxml-->
<import src="../../wxParse/wxParse.wxml" />
<view class="container">
<!-- 背景图层：覆盖整个页面，包括顶部状态栏区域 -->
<image class="bg-image" src="../../images/首页背景.png" mode="aspectFill"></image>
<view class="container-header">
<!-- 页面标题，替代原生导航栏标题 -->
<view class="page-title" style="padding-top: {{statusBarHeight}}px;">仁E森命</view>
<view class="header">
<!--<view class="searchbox2">
<view class="logobox"><image src="../../images/logo2.png" /></view>
@@ -60,7 +66,7 @@
<view>
<view wx:if='{{icon1===0}}' bindtap="onCategory" data-id="企业介绍">
<image src='../../images/mydata0_ico0.png'></image>
<image src='../../images/ry-02.png'></image>
<text>企业介绍</text>
</view>
<!--
@@ -71,11 +77,11 @@
-->
<view wx:if='{{icon2===0}}' bindtap="onCategory" data-id="操作教程">
<image src='../../images/mydata0_ico4.png'></image>
<image src='../../images/ry-03.png'></image>
<text>操作教程</text>
</view>
<view wx:if='{{icon3===0}}' bindtap="onCategory" data-id="发图素材">
<image src='../../images/mydata0_ico2.png'></image>
<image src='../../images/ry-04.png'></image>
<text>发图素材</text>
</view>
<view wx:if='{{icon4===0}}' bindtap="onCategory" data-id="健康知识">
@@ -83,7 +89,7 @@
<text>健康知识</text>
</view>
<view wx:if='{{icon5===0}}' bindtap="onCategory" data-id="客服专区">
<image src='../../images/mydata0_ico3.png'></image>
<image src='../../images/ry-05.png'></image>
<text>客服专区</text>
</view>
</view>

70
pages/index/index.wxss
View File

@@ -7,8 +7,30 @@ page{
min-height: 100%;
color: #000;
font-size:14px;
background: linear-gradient(180deg, #96C6F5 0%, #B8DAF8 30%, #E8F4FC 60%, #F5FAFF 100%);
}
.container-header{ background: linear-gradient(to bottom, #96C6F5, #B8DAF8);}
/* 背景图片：用 <image> 标签实现，覆盖整个页面容器 */
.bg-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}
/* 页面标题样式 */
.page-title {
position: relative;
z-index: 1;
color: #FFFFFF;
font-size: 18px;
font-weight: 600;
text-align: center;
padding: 10px 0;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
letter-spacing: 0.5px;
}
.container-header{ background: transparent; position: relative; overflow: visible; min-height: 300rpx; z-index: 1;}
.header{margin:0;width:100%; padding:0; padding-top: 0em; box-sizing: border-box;}
.searchbox2{ display: flex; z-index: 100; flex-direction: row; margin:0; margin-top:0.3em; width:70%; height:2.8em; padding:0; box-sizing: border-box;}
.searchbox2 .logobox{margin-left:0.7em;margin-right:0.35em;margin-top:0; width: 6em;height:1.6em; box-sizing:border-box;}
@@ -19,14 +41,14 @@ page{
.searchbox2 .icobox image{width: 1.5em; height:1.5em; margin-top: 0.4em; margin-left: 0.6em;}
.searchbox2 .icobox0{width:2.2em;height:2.2em; font-size:1em; box-sizing:border-box;margin-left: 0.6em;}
.searchbox2 .icobox0 image{width: 1.8em; height:1.8em; margin-top: 0.2em; margin-left: 0.4em;}
.searchbox{ display: flex; z-index: 100; flex-direction: row; margin:0;width:100%; padding:0.8em; padding-top: 0.5em; box-sizing: border-box; }
.searchbox{ display: flex; z-index: 100; flex-direction: row; margin:0;width:100%; padding:0 0.8em; box-sizing: border-box; background: transparent; border-radius: 12rpx;}
.searchbox .inpubox{flex-grow: 1;margin:0; height:2.2em; box-sizing:border-box;}
.searchbox .inpubox input{ margin:0; padding-left:2.3em; width: 100%; font-size:1em; height:2.2em; outline: none; text-indent:0;box-sizing:border-box;color:#333;border:1px solid #E0E0E0;border-radius:0.5em 0 0 0.5em; background-color:#FFFFFF;}
.searchbox .icobox{margin-right:-2.3em; width:2.2em;height:2.2em;box-sizing:border-box;z-index: 101;}
.searchbox .icobox image{width: 1.5em; height:1.5em; margin-top: 0.4em; margin-left: 0.6em;}
.searchbox .icobox0{margin:0; margin-left:0.5em; margin-top:0.2em; width:1.8em;height:1.8em; box-sizing:border-box;z-index: 101;border-radius:50%;}
.searchbox .icobox0{margin:0; margin-left:0.5em; margin-top:0.2em; width:1.8em;height:1.8em; box-sizing:border-box;z-index: 101;border-radius:50%; background:linear-gradient(to right, #6BA3F0, #8BBDF5); display: flex; align-items: center; justify-content: center;}
.searchbox .icobox0 image{width: 1.5em; height:1.5em; margin-top: 0.1em; margin-left: 0.1em;}
.searchbox .searchicobox{margin:0; margin-left:0em; width:3em;height:2.2em; line-height: 2.2em; box-sizing:border-box;z-index: 102;background:linear-gradient(to right, #6BA3F0, #8BBDF5); border:1px solid #6BA3F0; border-left:0; color:#fff; text-align: center; border-radius:0 0.5em 0.5em 0;}
.menu{display: flex; flex-direction: row; width: 100%;box-sizing: border-box;}
@@ -144,17 +166,20 @@ page{
overflow-y: scroll;
}
.container0{
margin-top: -0.8em;
padding: 0.8em;
margin-top: 1.2em;
padding: 0 0.8em;
box-sizing: border-box;
}
.swiper{
width:100%;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.95);
border-radius:0.5em;
padding: 0.8em;
padding: 0;
box-sizing: border-box;
box-shadow: 0 8px 30px rgba(107, 163, 240, 0.25);
backdrop-filter: blur(5px);
overflow: hidden;
}
.container1{
margin-top: 0em;
@@ -175,7 +200,9 @@ page{
}
.swiper_box {
width: 100%;
min-height: 14em;
min-height: 14em;
border-radius: 0.5em;
overflow: hidden;
}
swiper-item image {
@@ -279,7 +306,8 @@ swiper-item image {
flex-direction:column;
align-items: center;
width: 100%;
padding:0.4em 0.4em;
margin-top: 1.2em;
padding:0 0.8em;
box-sizing: border-box;
z-index: 10;
}
@@ -287,8 +315,12 @@ swiper-item image {
display: flex;
flex-direction:column;
width: 100%;
border-radius:0.5em;
background: linear-gradient(to bottom, #96C6F5, #B8DAF8);
border-radius:0.8em;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.98) 100%);
box-shadow: 0 -4px 20px rgba(107, 163, 240, 0.1), 0 4px 20px rgba(107, 163, 240, 0.2);
backdrop-filter: blur(25px);
border: 1px solid rgba(255, 255, 255, 0.8);
overflow: hidden;
}
.mydata_box0_bo view{
display: flex;
@@ -306,14 +338,14 @@ swiper-item image {
align-items: center;
justify-content: center;
box-sizing: border-box;
font-size:0.9em;
color:#fff;
font-size:1em;
color:#333;
}
.mydata_box0_bo view view image{
width: 3.5em;
height: 3.5em;
padding:0.5em 0;
width: 4em;
height: 4em;
padding:0.3em 0;
overflow: hidden;
}
.mydata_box0_bo view view view{
@@ -478,7 +510,11 @@ swiper-item image {
padding: 0.4em;
padding-bottom: 6em;
box-sizing:border-box;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, #FFFFFF 15%);
margin-top: -0.3em;
border-radius: 0.8em 0.8em 0 0;
position: relative;
z-index: 3;
}
.container_box_to{
display: flex;