header修改

src/pages/account/userinfo.vue

 <template>
-    <van-nav-bar title="用户中心" :left-arrow="true" border fixed placeholder safe-area-inset-top
-        @click-left="router.go(-1)" />
+    <Header :show="false" backgroundBox="white">
+        <van-nav-bar title="用户中心" :left-arrow="true" border fixed placeholder safe-area-inset-top
+            @click-left="router.go(-1)" />
+    </Header>
     <div class="container">
         <div class="content">
             <div class="item">

src/pages/classify/index.vue

 <template>
     <Header backgroundBox="#D2E4FF">
-            <div class="header">
-                <div class="title">分类</div>
-                <div class="search">
-                    <div class="s-box">
-                        <van-icon name="search" color="#303030" />
-                        <input class="placeholder" placeholder="请输入关键词" v-model="queryParams.classifyType" @confirm="handleRefresh"/>
-                    </div>
-                    <van-icon v-if="queryParams.classifyType" name="clear" color="#969696" @tap="clear" />
+        <div class="header">
+            <div class="title">分类</div>
+            <div class="search">
+                <div class="s-box">
+                    <van-icon name="search" color="#303030" />
+                    <input class="placeholder" placeholder="请输入关键词" v-model="queryParams.classifyType"
+                        @confirm="handleRefresh" />
                 </div>
+                <van-icon v-if="queryParams.classifyType" name="clear" color="#969696" @tap="clear" />
             </div>
-        </Header>
+        </div>
+    </Header>
     <div class="bg">
-        
-        <!-- <van-sticky>
-            
-        </van-sticky> -->
         <div class="content">
             <van-pull-refresh v-model="refreshing" @refresh="handleRefresh">
-                <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" :offset="50"
+                <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" :offset="contentHeight"
                     @load="getList" v-if="dataList.length">
                     <div class="list">
                         <div class="item" v-for="(item, index) in dataList" :key="index"
@@ -48,8 +45,14 @@ const fileDomain = import.meta.env.VITE_APP_FILE_URL
 import { useInitScroll } from '@/hooks/useScroll'
 useInitScroll()
 
+const contentHeight = ref(50)
 onLoad(() => {
     getList()
+    xma.xh.getMenuButtonBoundingClientRect({
+      success(res) {
+        contentHeight.value = (res.top + res.bottom) / 2 + 25;
+      },
+    });
 })
 
 const page = reactive({
@@ -95,48 +98,49 @@ const clear = () => {
 
 <style scoped lang="scss">
 .header {
+    display: flex;
+    align-items: center;
+    padding: 0 20px;
+    height: 50px;
+    gap: 15px;
+    background-color: #D2E4FF;
+
+    .title {
+        font-size: 18px;
+        font-weight: bold;
+    }
+
+    .search {
+        width: 45%;
+        background-color: #F7F8FA;
+        border-radius: 20px;
         display: flex;
         align-items: center;
-        padding: 0 20px;
-        height: 50px;
-        gap: 15px;
-        background-color: #D2E4FF;
-
-        .title {
-            font-size: 18px;
-            font-weight: bold;
-        }
+        justify-content: space-between;
+        height: 32px;
+        opacity: 0.7;
+        padding: 0 10px;
 
-        .search {
-            width: 45%;
-            background-color: #F7F8FA;
-            border-radius: 20px;
+        .s-box {
             display: flex;
             align-items: center;
-            justify-content: space-between;
-            height: 32px;
-            opacity: 0.7;
-            padding: 0 10px;
-
-            .s-box {
-                display: flex;
-                align-items: center;
-                gap: 5px;
-
-                .placeholder {
-                    color: #303030;
-                    font-size: 14px;
-                }
+            gap: 5px;
+
+            .placeholder {
+                color: #303030;
+                font-size: 14px;
             }
+        }
 
 
-        }
     }
+}
+
 .bg {
     height: 100vh;
     background: linear-gradient(to bottom, #D2E4FF 5%, #fff 25%);
 
-    
+
 
     .content {
         padding: 10px 10px 0 10px;

src/pages/classify/list.vue

 <template>
-     <van-sticky>
+    <Header backgroundBox="#ffffff">
         <div class="header">
             <div class="tools">
                 <van-search v-model="queryParams.materialTitle" shape="round" placeholder="请输入搜索关键词"
-                    @search="handleRefresh" @clear="handleRefresh" />
+                    @search="handleRefresh" @clear="clear" />
             </div>
         </div>
-    </van-sticky>
+    </Header>
     <div class="content">
         <van-pull-refresh v-model="refreshing" @refresh="handleRefresh">
             <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" :offset="50" @load="getList"
@@ -85,13 +85,25 @@ const setDataList = (res) => {
     finished.value = dataList.value.length >= res.data.total
     refreshing.value = false
 }
+
+const handleRefresh = () => {
+    refreshing.value = true
+    page.pageNum = 0
+    getList()
+}
+
+const clear = (e) => {
+    console.log(e)
+    console.log(111111)
+}
 </script>
 
 <style scoped lang="scss">
 .header {
     padding: 10px;
-    background-color: #ffffff;
-    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
+    margin-left: 20rpx;
+    // background-color: #ffffff;
+    // box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
 
     .tools {
 

src/pages/components/Header/index.vue

@@ -54,12 +54,12 @@
     });
     xma.xh.getMenuButtonBoundingClientRect({
       success(res) {
-        console.log('宽度', res.width); // 宽度，单位：px
-        console.log('高度', res.height); // 高度，单位：px
-        console.log('上边界坐标', res.top); // 上边界坐标，单位：px
-        console.log('右边界坐标', res.right); // 右边界坐标，单位：px
-        console.log('下边界坐标', res.bottom); // 下边界坐标，单位：px
-        console.log('左边界坐标', res.left);
+        // console.log('宽度', res.width); // 宽度，单位：px
+        // console.log('高度', res.height); // 高度，单位：px
+        // console.log('上边界坐标', res.top); // 上边界坐标，单位：px
+        // console.log('右边界坐标', res.right); // 右边界坐标，单位：px
+        // console.log('下边界坐标', res.bottom); // 下边界坐标，单位：px
+        // console.log('左边界坐标', res.left);
         contentHeight.value = (res.top + res.bottom) / 2 + 25 + 'px';
         // contentHeight.value = res.bottom * 2 + 10 + 'rpx'; // 左边界坐标，单位：px
       },

src/pages/home/content.vue

 <template>
+    <Header backgroundBox="white" :showTitle="true" title="图组详情"></Header>
     <!-- <van-nav-bar title="图组详情" :left-arrow="true" fixed placeholder safe-area-inset-top @click-left="router.go(-1)" /> -->
     <div class="container" v-if="catalog">
         <div class="info">

src/pages/home/index.vue

@@ -9,7 +9,7 @@
             </div>
         </div>
     </Header>
-    <van-sticky :offset-top="50">
+    <van-sticky :offset-top="contentHeight">
         <div class="header">
             <!-- <div class="tools">
                 <van-search v-model="catalog.materialTitle" shape="round" placeholder="请输入搜索关键词" @search="handleRefresh"
@@ -91,6 +91,16 @@ import dayjs from 'dayjs'
 import { useInitScroll } from '@/hooks/useScroll'
 
 useInitScroll()
+
+const contentHeight = ref(50)
+onLoad(() => {
+    xma.xh.getMenuButtonBoundingClientRect({
+      success(res) {
+        contentHeight.value = (res.top + res.bottom) / 2 + 25;
+      },
+    });
+})
+
 const router = useRouter()
 const tabsActive = ref(0)
 const refreshing = ref(false)

src/pages/mine/index.vue

 <template>
-    <!-- <Header  backgroundBox="#f8f8f8" :show="false"></Header> -->
+    <Header  backgroundBox="#f8f8f8" :show="false"></Header>
     <div class="container" v-if="userStore.isLogin">
         <div class="userinfo">
             <img class="avatar" mode="aspectFill"
@@ -46,7 +46,7 @@
             </div>
         </div>
         <div class="content">
-            <van-tabs v-model:active="active" background="#f8f8f8" animated swipeable sticky>
+            <van-tabs v-model:active="active" background="#f8f8f8" animated swipeable sticky :offset-top="contentHeight">
                 <van-tab title="待发布">
                     <picture-list ref="waitingPublishPicture" :active="0" @total="setTotal" @refresh="handleRefreshPublishPicture" @publish="handlePublishPicture"></picture-list>
                 </van-tab>
@@ -83,6 +83,15 @@ const total = reactive({
     2: 0
 })
 
+const contentHeight = ref(50)
+onLoad(() => {
+    // xma.xh.getMenuButtonBoundingClientRect({
+    //   success(res) {
+    //     contentHeight.value = (res.top + res.bottom) / 2 + 25;
+    //   },
+    // });
+})
+
 onShow(() => {
     toLogin()
 })

src/pages/prefecture/index.vue

 <template>
-    <van-sticky>
+    <Header backgroundBox="#ffffff">
+        <div class="tools">
+            <van-search v-model="queryParams.materialTitle" shape="round" placeholder="请输入搜索关键词" @search="handleRefresh"
+                @clear="handleRefresh" />
+        </div>
+    </Header>
+    <van-sticky :offset-top="contentHeight">
         <div class="header">
-            <div class="tools">
-                <van-search v-model="queryParams.materialTitle" shape="round" placeholder="请输入搜索关键词"
-                    @search="handleRefresh" @clear="handleRefresh" />
-            </div>
             <div class="menu">
                 <div class="organization" @click="openOrganizationPopup">
                     <img src="../../static/image/prefecture-logo1.png">
@@ -76,6 +78,16 @@ import { selectPrefecturetList } from '@/api/prefecture'
 import { useInitScroll } from '@/hooks/useScroll'
 
 useInitScroll()
+
+const contentHeight = ref(50)
+onLoad(() => {
+    xma.xh.getMenuButtonBoundingClientRect({
+      success(res) {
+        contentHeight.value = (res.top + res.bottom) / 2 + 25;
+      },
+    });
+})
+
 const router = useRouter()
 const refreshing = ref(false)
 const loading = ref(false)
@@ -171,21 +183,24 @@ const confirmOrganizationPopup = (item) => {
 }
 </script>
 <style lang="scss" scoped>
+.tools {
+    margin-left: 40rpx;
+
+    :deep(.van-search) {
+        flex: 1;
+        padding: 0;
+
+
+    }
+}
+
 .header {
-    padding: 10px;
+    padding: 0px 10px 0;
     background-color: #ffffff;
     box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
 
-    .tools {
-
-        :deep(.van-search) {
-            flex: 1;
-            padding: 0;
 
 
-        }
-    }
-
     .menu {
         display: flex;
         justify-content: space-between;

src/pages/publish/index.vue

 <template>
-    <van-nav-bar title="图组" :left-arrow="true" fixed placeholder safe-area-inset-top @click-left="router.go(-1)" />
+    <Header :show="false" backgroundBox="white">
+        <van-nav-bar title="图组" :left-arrow="true" fixed placeholder safe-area-inset-top @click-left="router.go(-1)" />
+    </Header>
     <div class="container">
         <div class="steps-placeholder" :style="{ height: `${stepsRef?.offsetHeight}px` }">
             <div ref="stepsRef" class="steps-container">

src/pages/publish/result.vue

 <template>
-    <van-nav-bar title="结果" :left-arrow="true" fixed placeholder safe-area-inset-top @click-left="router.go(-1)" />
+    <Header :show="false" backgroundBox="white">
+        <van-nav-bar title="结果" :left-arrow="true" fixed placeholder safe-area-inset-top @click-left="router.go(-1)" />
+    </Header>
     <div class="container">
         <div class="info">
             <img src="../../static/image/result-success.png">
             <div class="title">提交成功</div>
             <div class="desc">注：请前往“我的-待发布图组”进行图组发布</div>
         </div>
-        <van-button type="primary" @click="router.pushTab({name:'mine'})">前往待发布图组</van-button>
+        <van-button type="primary" @click="router.pushTab({ name: 'mine' })">前往待发布图组</van-button>
     </div>
 </template>
 <script setup>
-const router=useRouter()
+const router = useRouter()
 </script>
 <style lang="scss" scoped>
 .container {
@@ -26,15 +28,18 @@ const router=useRouter()
         justify-content: center;
         gap: 10px;
         margin-top: 20vh;
-        .title{
+
+        .title {
             font-size: 20px;
         }
-        .desc{
+
+        .desc {
             color: #9f9f9f;
             font-size: 16px;
         }
     }
-    .van-button{
+
+    .van-button {
         width: 150px;
     }
 }

src/pages/subject/index.vue

 <template>
-    <div class="container">
+    <Header backgroundBox="#ffffff">
         <div class="header">
             <van-search shape="round" placeholder="请输入专题关键字" />
         </div>
+    </Header>
+    <div class="container">
+        
         <div class="content">
             <div class="c-title">热门专题</div>
             <div class="list">