From 625852aadde2c00d9c6aacdeace47428523362dd Mon Sep 17 00:00:00 2001
From: hayu <1604366271@qq.com>
Date: Tue, 17 Jun 2025 18:12:48 +0800
Subject: [PATCH] =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/standardBox/codeView.vue |   3 +-
 src/pages/standardBox/index.vue    | 168 ++++++++++++++++++++---------
 2 files changed, 118 insertions(+), 53 deletions(-)

diff --git a/src/pages/standardBox/codeView.vue b/src/pages/standardBox/codeView.vue
index 2d625bd..c93d22e 100644
--- a/src/pages/standardBox/codeView.vue
+++ b/src/pages/standardBox/codeView.vue
@@ -73,7 +73,8 @@ const bmFileInfos = ref([])//请求图片参数
 const getCodeList = () => {
     console.log(boxInfo.value)
     let param = {
-        "boxId":boxInfo.value.boxId
+        "boxId":boxInfo.value.boxId,
+        "keyWord":searchValue.value
     }
     getAppBoxDetailListApi(param).then(res => { 
         console.log(res)
diff --git a/src/pages/standardBox/index.vue b/src/pages/standardBox/index.vue
index 69f9213..866e70c 100644
--- a/src/pages/standardBox/index.vue
+++ b/src/pages/standardBox/index.vue
@@ -1,19 +1,30 @@
 <template>
-    <view style="padding-top: 4vh;background-color: rgb(220, 244, 255);">
-        <uni-nav-bar left-icon="left" @clickLeft="leftClick" right-icon="scan" @clickRight="rightClick" title="标准箱管理" title-style="font-weight: bolder;"  backgroundColor="rgb(220, 244, 255)" :border="false" />
-    </view>
-    <!-- 新购入库 -->
-    <view class="page-container">  
-        <view class="complete-btn">
-            <view class="btn" @click="changeTab(1)">
-                <span>未录入</span>
-                <div v-if="active == 1" class="bt-line"></div>
-            </view>
-            <view class="btn" style="margin-left: 120rpx" @click="changeTab(2)">
-                <span>已完成</span>
-                <div v-if="active == 2" class="bt-line"></div>
-            </view>
+  <view>
+    <!-- 自定义导航栏 -->
+    <view class="custom-navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
+      <view class="nav-content">
+        <view class="left-icon" @click="leftClick">
+          <uni-icons type="left" size="24"></uni-icons>
         </view>
+        <view class="title">标准箱管理</view>
+        <view class="right-icon" @click="rightClick">
+          <uni-icons type="scan" size="24"></uni-icons>
+        </view>
+      </view>
+    </view>
+
+    <!-- 页面内容 -->
+    <view class="page-container">
+      <view class="complete-btn">
+        <view class="btn" @click="changeTab(1)">
+          <span>未录入</span>
+          <div v-if="active == 1" class="bt-line"></div>
+        </view>
+        <view class="btn" style="margin-left: 120rpx" @click="changeTab(2)">
+          <span>已完成</span>
+          <div v-if="active == 2" class="bt-line"></div>
+        </view>
+      </view>
         <uni-row :gutter="24" class="search-form">
             <uni-col :span="24">
                 <view>
@@ -85,20 +96,20 @@
             </view>
         </scroll-view>
     </view>
+    </view>
 </template>
 
 <script setup>
 import { ref,computed } from 'vue'
 import { onLoad, onShow } from '@dcloudio/uni-app'
 import { debounce } from 'lodash-es'
-import { getPurchaseList } from '@/services/purchase.js'
 import { getQrCodeBoxListApi } from '@/services/standard.js'
 
 const total = ref(0) //                 数据总量
 const active = ref(1) //                tap索引
 const tableList = ref([]) //            列表数据源
 const dateArray = ref([]) //            日期范围
-
+const statusBarHeight = ref(0)
 // 查询参数
 const queryParams = ref({
     startTime: '', //                   开始时间
@@ -109,6 +120,27 @@ const queryParams = ref({
     pageSize: 5,
 })
 
+// 初始化状态栏高度
+const initStatusBarHeight = () => {
+  uni.getSystemInfo({
+    success: (res) => {
+      statusBarHeight.value = res.statusBarHeight
+      // 设置CSS变量
+      document.documentElement.style.setProperty('--status-bar-height', `${res.statusBarHeight}px`)
+    }
+  })
+}
+
+onLoad(() => {
+  initStatusBarHeight()
+  getTableList(true)
+})
+
+onShow(() => {
+  tableList.value = []
+  getTableList(true)
+})
+
 // 日期 change 事件
 const onChangeDate = (val) => {
     const [val_1, val_2] = val
@@ -231,16 +263,6 @@ const rightClick = () => {
     uni.navigateTo({ url: `/pages/standardBox/addBox` })
 }
 
-// // 页面加载完毕
-// onLoad(() => {
-//     getTableList()
-// })
-
-onShow(() => {
-    tableList.value = []
-    getTableList(true)
-})
-
 // 判断数据是否加载完毕
 const finish = computed(() => {
     console.log('total.value',total.value)
@@ -250,16 +272,72 @@ const finish = computed(() => {
 
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
+/* 自定义导航栏样式 */
+.custom-navbar {
+  width: 100%;
+  background-color: rgb(220, 244, 255);
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 999;
+  height: calc(44px + var(--status-bar-height, 0px));
+  box-sizing: content-box;
+}
+
+.nav-content {
+  height: 44px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  padding: 0 15px;
+}
+
+.left-icon, .right-icon {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 24px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.left-icon {
+  left: 15px;
+}
+
+.right-icon {
+  right: 15px;
+}
+
+.title {
+  font-weight: bold;
+  font-size: 16px;
+  color: #000000;
+  text-align: center;
+  width: 60%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 页面内容容器 */
+.page-container {
+  margin-top: calc(44px + var(--status-bar-height, 0px));
+  height: calc(100vh - 44px - var(--status-bar-height, 0px));
+  overflow: auto;
+  background-color: #f7f8fa;
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+
 :deep(.uni-navbar__header-container-inner){
     font-weight: 600;
 }
-.page-container { 
-    display: flex;
-    height: 90vh;
-    flex-direction: column;
-    background-color: #f7f8fa;
-    padding: 24rpx; 
+
     .complete-btn {
         display: flex;
         padding: 28rpx 24rpx;
@@ -277,20 +355,11 @@ const finish = computed(() => {
             position: relative;
             transition: all 0.3s ease;
 
-            span {
-                font-size: 32rpx;
-                color: #8c8c8c;
-                font-weight: 500;
-
-                &.active {
-                    color: #3784fb;
-                    font-weight: 600;
-                    
-                    .second-active & {
-                        color: #fa8c16;
-                    }
-                }
-            }
+          span {
+            font-size: 32rpx;
+            color: #8c8c8c;
+            font-weight: 500;
+          }
 
             .bt-line {
                 width: 32rpx;
@@ -299,10 +368,6 @@ const finish = computed(() => {
                 margin-top: 12rpx;
                 border-radius: 6rpx;
                 transition: all 0.3s ease;
-                
-                .second-active & {
-                    background: #fa8c16;
-                }
             }
         }
     }
@@ -541,7 +606,6 @@ const finish = computed(() => {
             }
         }
     }
-}
 
 // 加载提示文字
 .loading-text {