From 6f94a226e627480b01a84a517e0bc1a01c1fa9e8 Mon Sep 17 00:00:00 2001
From: shenzhouyu <zhouyu.shen@xujiesoft.com>
Date: Fri, 29 Aug 2025 10:34:28 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A2=86=E6=96=99=E9=A1=B5=E9=9D=A2=E6=8F=90?=
 =?UTF-8?q?=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/production/production-inbound.js      |   11 +
 src/api/purchase/purchase-return.js           |   12 +
 src/router/index.js                           |   18 +-
 src/views/main.vue                            |    4 +-
 .../production-inbound/inboundRegister.vue    |  387 +++++
 .../inboundRegisterDetail.vue                 | 1027 ++++++++++++
 .../modules/production-inbound/index.vue      | 1373 ++---------------
 .../modules/production-inbound/production.vue |  166 ++
 .../production-inbound/productionPick.vue     |  387 +++++
 .../productionPickingDetail.vue               |  982 ++++++++++++
 .../modules/production-issue/production.vue   |   38 +-
 .../pick.vue                                  |    0
 .../modules/production-return/production.vue  |  169 ++
 .../productionReturnPDA.vue                   |    0
 .../productionReturnPicking.vue               |  440 ++++++
 .../productionReturnPickingDetail.vue         | 1128 ++++++++++++++
 src/views/modules/purchase-return/index.vue   |  165 ++
 .../purchase-return/purchaseReturnPicking.vue |  387 +++++
 .../purchaseReturnPickingDetail.vue           |  982 ++++++++++++
 19 files changed, 6384 insertions(+), 1292 deletions(-)
 create mode 100644 src/api/purchase/purchase-return.js
 create mode 100644 src/views/modules/production-inbound/inboundRegister.vue
 create mode 100644 src/views/modules/production-inbound/inboundRegisterDetail.vue
 create mode 100644 src/views/modules/production-inbound/production.vue
 create mode 100644 src/views/modules/production-inbound/productionPick.vue
 create mode 100644 src/views/modules/production-inbound/productionPickingDetail.vue
 rename src/views/modules/{production-issue => production-return}/pick.vue (100%)
 create mode 100644 src/views/modules/production-return/production.vue
 rename src/views/modules/{production-issue => production-return}/productionReturnPDA.vue (100%)
 create mode 100644 src/views/modules/production-return/productionReturnPicking.vue
 create mode 100644 src/views/modules/production-return/productionReturnPickingDetail.vue
 create mode 100644 src/views/modules/purchase-return/index.vue
 create mode 100644 src/views/modules/purchase-return/purchaseReturnPicking.vue
 create mode 100644 src/views/modules/purchase-return/purchaseReturnPickingDetail.vue

diff --git a/src/api/production/production-inbound.js b/src/api/production/production-inbound.js
index 00334f4..133f274 100644
--- a/src/api/production/production-inbound.js
+++ b/src/api/production/production-inbound.js
@@ -20,3 +20,14 @@ export const getInboundRecords = data => createAPI(`/production/inbound/getInbou
 export const returnStock = data => createAPI(`/production/inbound/returnStock`,'post',data)
 // 扫描单元获取退库信息
 export const scanUnitForReturn = data => createAPI(`/production/inbound/scanUnitForReturn`,'post',data)
+
+// 获取入库通知单信息
+export const getInboundNotifyByNo = data => createAPI(`/production/inbound/getInboundNotifyByNo`,'post',data)
+// 获取入库通知单列表
+export const getInboundNotifyListByNo = data => createAPI(`/production/inbound/getInboundNotifyListByNo`,'post',data)
+// 扫描物料标签
+export const scanMaterialLabel = data => createAPI(`/production/inbound/scanMaterialLabel`,'post',data)
+// 获取申请物料清单
+export const getRequestMaterials = data => createAPI(`/production/inbound/getRequestMaterials`,'post',data)
+// 确认生产入库
+export const confirmProductionInbound = data => createAPI(`/production/inbound/confirmProductionInbound`,'post',data)
diff --git a/src/api/purchase/purchase-return.js b/src/api/purchase/purchase-return.js
new file mode 100644
index 0000000..cff1571
--- /dev/null
+++ b/src/api/purchase/purchase-return.js
@@ -0,0 +1,12 @@
+import { createAPI } from "@/utils/httpRequest.js";
+
+// 获取采购退库通知单信息
+export const getPurchaseReturnNotifyByNo = data => createAPI(`/purchase/return/getPurchaseReturnNotifyByNo`,'post',data)
+// 获取采购退库通知单列表
+export const getPurchaseReturnNotifyListByNo = data => createAPI(`/purchase/return/getPurchaseReturnNotifyListByNo`,'post',data)
+// 扫描物料标签
+export const scanMaterialLabel = data => createAPI(`/purchase/return/scanMaterialLabel`,'post',data)
+// 获取退库物料清单
+export const getReturnMaterials = data => createAPI(`/purchase/return/getReturnMaterials`,'post',data)
+// 确认采购退库
+export const confirmPurchaseReturn = data => createAPI(`/purchase/return/confirmPurchaseReturn`,'post',data)
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 965e329..3e99e42 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -25,6 +25,11 @@ const globalRoutes = [
   // 采购入库
   {path: "/porecv",name: "porecv", component: resolve => require(["@/views/modules/recv/po-recv.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
   {path: "/recv",name: "recv", component: resolve => require(["@/views/modules/recv/recv.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+
+  // 采购退库
+  {path: "/purchasereturn",name: "purchaseReturn", component: resolve => require(["@/views/modules/purchase-return/index.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/purchaseReturnPicking",name: "purchaseReturnPicking", component: resolve => require(["@/views/modules/purchase-return/purchaseReturnPicking.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/purchaseReturnPickingDetail/:returnNo",name: "purchaseReturnPickingDetail", component: resolve => require(["@/views/modules/purchase-return/purchaseReturnPickingDetail.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
   {path: "/qualifiedStorage",name: "qualifiedStorage", component: resolve => require(["@/views/modules/recv/qualifiedStorage.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
   {path: "/inspectionResults",name: "inspectionResults",
     component: resolve => require(["@/views/modules/recv/inspectionResults.vue"], resolve),
@@ -38,12 +43,17 @@ const globalRoutes = [
   { path: "/productionPicking", name: "productionPicking", component: resolve => require(["@/views/modules/production-issue/productionPicking.vue"], resolve), meta: { transition: 'instant', preload: true, keepAlive: true } },
   { path: "/productionPickingDetail/:outboundNo", name: "productionPickingDetail", component: resolve => require(["@/views/modules/production-issue/productionPickingDetail.vue"], resolve), meta: { transition: 'instant', preload: true, keepAlive: true } },
 //生产退料  
-  {path: "/productionreturn",name: "productionreturn", component: resolve => require(["@/views/modules/production-issue/productionReturnPDA.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
-  {path: '/production-issue/pick/:orderNo',
-    name: 'ProductionIssuePick',component: resolve => require(["@/views/modules/production-issue/pick.vue"], resolve),
+  {path: "/productionreturn",name: "productionreturn", component: resolve => require(["@/views/modules/production-return/production.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/productionReturnPicking", name: "productionReturnPicking", component: resolve => require(["@/views/modules/production-return/productionReturnPicking.vue"], resolve), meta: { transition: 'instant', preload: true, keepAlive: true } },
+  {path: '/production-return/pick/:orderNo',
+    name: 'ProductionIssuePick',component: resolve => require(["@/views/modules/production-return/pick.vue"], resolve),
     meta: { transition: 'instant' ,preload: true,keepAlive: true}},
   // 生产入库
-  {path: "/productionInbound",name: "productionInbound", component: resolve => require(["@/views/modules/production-inbound/index.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/productionInboundProduction",name: "productionInboundProduction", component: resolve => require(["@/views/modules/production-inbound/production.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/productionPick",name: "productionPick", component: resolve => require(["@/views/modules/production-inbound/productionPick.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/productionInboundDetail/:inboundNo",name: "productionInboundDetail", component: resolve => require(["@/views/modules/production-inbound/productionPickingDetail.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/inboundRegister",name: "inboundRegister", component: resolve => require(["@/views/modules/production-inbound/inboundRegister.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
+  {path: "/inboundRegisterDetail/:inboundNo",name: "inboundRegisterDetail", component: resolve => require(["@/views/modules/production-inbound/inboundRegisterDetail.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
 
   // 委外
   {path: "/outsource",name: "outsource", component: resolve => require(["@/views/modules/outsourcing-issue/index.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
diff --git a/src/views/main.vue b/src/views/main.vue
index d63f77e..09ad835 100644
--- a/src/views/main.vue
+++ b/src/views/main.vue
@@ -32,7 +32,7 @@
             </div>
             <div class="menu-text">生产退仓</div>
           </div>
-          <div class="menu-item" @click="$router.push('productionInbound')">
+          <div class="menu-item" @click="$router.push('productionInboundProduction')">
             <div class="menu-icon production-inbound">
               <van-icon name="cart" size="24" />
             </div>
@@ -54,7 +54,7 @@
           <span class="section-title">拣货出库</span>
         </div>
         <div class="button-grid">
-          <div class="menu-item" @click="$router.push('poreturn')">
+          <div class="menu-item" @click="$router.push('purchaseReturn')">
             <div class="menu-icon purchase-return">
               <van-icon name="shopping-cart-o" size="24" />
             </div>
diff --git a/src/views/modules/production-inbound/inboundRegister.vue b/src/views/modules/production-inbound/inboundRegister.vue
new file mode 100644
index 0000000..49135ff
--- /dev/null
+++ b/src/views/modules/production-inbound/inboundRegister.vue
@@ -0,0 +1,387 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>入库登记</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable
+                v-model="searchCode"
+                placeholder="请输入入库申请单单号"
+                prefix-icon="el-icon-search"
+                @keyup.enter.native="handleSearch"
+                ref="searchInput"
+      />
+    </div>
+
+    <!-- 入库申请单列表 -->
+    <div class="content-area">
+      <div
+        v-for="(item, index) in inboundList"
+        :key="index"
+        class="inbound-card"
+        @click="goToRegisterPage(item)"
+      >
+        <div class="card-title">
+          <span class="title-label">入库申请单号</span>
+          <span class="title-value">{{ item.notifyNo }}</span>
+        </div>
+
+        <div class="card-details">
+          <div class="detail-item">
+            <div class="detail-label">关联单号</div>
+            <div class="detail-value">{{ item.workOrderNo }}</div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">箱子数量</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.registeredBoxes }}</span><span class="total">{{ item.totalBoxes }}</span>
+            </div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">物料总数</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.registeredQty }}</span><span class="total">{{ item.totalQty }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="inboundList.length === 0 && !loading" class="empty-state">
+        <i class="el-icon-box"></i>
+        <p>暂无待登记入库申请单</p>
+      </div>
+
+      <!-- 加载状态 -->
+      <div v-if="loading" class="loading-state">
+        <i class="el-icon-loading"></i>
+        <p>加载中...</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getInboundNotifyByNo,
+  getInboundNotifyListByNo,
+} from '@/api/production/production-inbound'
+import { getCurrentWarehouse } from '@/utils'
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      searchCode: '',
+      inboundList: [],
+      loading: false
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理搜索
+    handleSearch() {
+      if (this.searchCode.trim()) {
+        this.searchInboundList(this.searchCode.trim());
+      } else {
+        this.loadInboundList();
+      }
+    },
+
+    // 加载生产入库申请单列表
+    loadInboundList() {
+      this.loading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        status: '待登记',
+      }
+      console.log('params', params);
+      
+      getInboundNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          this.inboundList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '获取数据失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        console.error('获取生产入库申请单列表失败:', error);
+        this.$message.error('获取数据失败');
+      });
+    },
+
+    // 搜索特定入库申请单
+    searchInboundList(searchCode) {
+      this.loading = true;
+      const params = {
+        notifyNo: searchCode,
+        site: this.$store.state.user.site,
+        status: 'REGISTER'
+      };
+
+      getInboundNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          if (data.list.length === 0) {
+            this.$message.warning('未找到匹配的入库申请单');
+          }
+          this.inboundList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '查询失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        this.$message.error('查询失败');
+      });
+    },
+
+    // 跳转到入库登记页面
+    goToRegisterPage(item) {
+      this.$router.push({
+        name: 'inboundRegisterDetail',
+        params: {
+          inboundNo: item.notifyNo,
+        }
+      });
+    }
+  },
+
+  mounted() {
+    // 聚焦搜索框
+    this.$nextTick(() => {
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.focus();
+      }
+    });
+
+    // 加载数据
+    this.loadInboundList();
+  }
+};
+</script>
+
+<style scoped>
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+}
+
+/* 内容区域 */
+.content-area {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px 16px;
+}
+
+/* 入库卡片 */
+.inbound-card {
+  background: white;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 16px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.inbound-card:hover {
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  transform: translateY(-1px);
+}
+
+.inbound-card:active {
+  transform: translateY(0);
+}
+
+/* 卡片标题 */
+.card-title {
+  margin-bottom: 12px;
+}
+
+.title-label {
+  font-size: 12px;
+  color: #666;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.title-value {
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+  margin-left: 20px;
+}
+
+/* 卡片详情 */
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #666;
+  margin-bottom: 4px;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 空状态 */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-state i {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.empty-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 加载状态 */
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #17B3A3;
+}
+
+.loading-state i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.loading-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .content-area {
+    padding: 8px 12px;
+  }
+
+  .inbound-card {
+    padding: 12px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-inbound/inboundRegisterDetail.vue b/src/views/modules/production-inbound/inboundRegisterDetail.vue
new file mode 100644
index 0000000..0582be1
--- /dev/null
+++ b/src/views/modules/production-inbound/inboundRegisterDetail.vue
@@ -0,0 +1,1027 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>入库登记</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 库位输入 -->
+    <div class="location-container">
+      <el-input clearable
+                v-model="locationId"
+                placeholder="请指定库位"
+                prefix-icon="el-icon-location"
+                ref="locationInput"
+      />
+    </div>
+
+    <!-- 扫描框 -->
+    <div class="search-container">
+      <el-input clearable class="compact-input"
+        v-model="scanCode"
+        placeholder="请扫描箱二维码"
+        prefix-icon="el-icon-search"
+        @keyup.enter.native="handleScan"
+        ref="scanInput"
+      />
+      <div class="mode-switch">
+        <el-switch
+          class="custom-switch"
+          v-model="isRemoveMode"
+          active-color="#ff4949"
+          inactive-color="#13ce66">
+        </el-switch>
+        <span v-if="isRemoveMode" class="switch-text">{{ '移除' }}</span>
+        <span v-else class="switch-text2">{{ '添加' }}</span>
+      </div>
+    </div>
+
+    <!-- 入库申请单信息卡片 -->
+    <div class="material-info-card" v-if="inboundInfo.inboundNo">
+      <div class="card-title">
+        <span class="title-label">入库申请单号</span>
+        <span class="title-value">{{ inboundInfo.inboundNo }}</span>
+      </div>
+
+      <div class="card-details">
+        <div class="detail-item">
+          <div class="detail-label">关联单号</div>
+          <div class="detail-value">{{ inboundInfo.relatedNo }}</div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">箱子数量</div>
+          <div class="detail-value">
+            <span class="qualified">{{ scannedBoxes.length }}</span><span class="total">{{ inboundInfo.totalBoxes }}</span>
+          </div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">物料总数</div>
+          <div class="detail-value">
+            <span class="qualified">{{ getTotalScannedQty() }}</span><span class="total">{{ inboundInfo.totalQty }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 入库登记确认标题 -->
+    <div class="section-title">
+      <div class="title-left">
+        <i class="el-icon-circle-check"></i>
+        <span>入库登记确认</span>
+      </div>
+      <div class="title-right">
+        <span class="material-list-link" @click="showMaterialListDialog">物料清单</span>
+      </div>
+    </div>
+
+    <!-- 箱子列表 -->
+    <div class="box-list">
+      <div class="list-header">
+        <div class="col-no">NO.</div>
+        <div class="col-box">箱子编码</div>
+        <div class="col-part">物料编码</div>
+        <div class="col-qty">数量</div>
+        <div class="col-location">库位</div>
+      </div>
+
+      <div
+        v-for="(box, index) in scannedBoxes"
+        :key="box.id"
+        class="list-item"
+      >
+        <div class="col-no">{{ scannedBoxes.length - index }}</div>
+        <div class="col-box">{{ box.boxCode }}</div>
+        <div class="col-part">{{ box.partNo }}</div>
+        <div class="col-qty">{{ box.quantity }}</div>
+        <div class="col-location">{{ box.locationId || locationId }}</div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="scannedBoxes.length === 0" class="empty-boxes">
+        <p>暂无扫描箱子</p>
+      </div>
+    </div>
+
+    <!-- 底部操作按钮 -->
+    <div class="bottom-actions">
+      <button class="action-btn secondary" @click="confirmRegister" :disabled="!locationId || scannedBoxes.length === 0">
+        确定登记
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="printLabels">
+        打印
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="cancelRegister">
+        取消
+      </button>
+    </div>
+
+    <!-- 物料清单弹窗 -->
+    <div v-if="showMaterialDialog" class="material-overlay">
+      <div class="material-modal">
+        <div class="modal-header">
+          <span class="modal-title">物料清单</span>
+          <i class="el-icon-close close-btn" @click="closeMaterialDialog"></i>
+        </div>
+
+        <div class="modal-body">
+          <!-- 加载状态 -->
+          <div v-if="materialListLoading" class="loading-container">
+            <i class="el-icon-loading"></i>
+            <span>加载中...</span>
+          </div>
+
+          <!-- 物料表格 -->
+          <div v-else-if="materialList.length > 0" class="material-table">
+            <div class="table-header">
+              <div class="col-no">NO.</div>
+              <div class="col-material-code">物料编码</div>
+              <div class="col-required-qty">需求数量</div>
+              <div class="col-registered-qty">已登记数量</div>
+            </div>
+
+            <div class="table-body">
+              <div
+                v-for="(item, index) in materialList"
+                :key="index"
+                class="table-row"
+              >
+                <div class="col-no">{{ index + 1 }}</div>
+                <div class="col-material-code">{{ item.materialCode || item.partNo }}</div>
+                <div class="col-required-qty">{{ item.requiredQty || 0 }}</div>
+                <div class="col-registered-qty">{{ item.registeredQty || 0 }}</div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 空数据状态 -->
+          <div v-else class="empty-material">
+            <i class="el-icon-document"></i>
+            <p>暂无物料数据</p>
+          </div>
+        </div>
+
+        <div class="modal-footer">
+          <button class="btn-close" @click="closeMaterialDialog">关闭</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { scanPackage, getRequestMaterials, inboundRegister } from '@/api/production/production-inbound';
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      scanCode: '',
+      locationId: '',
+      inboundInfo: {},
+      scannedBoxes: [],
+      inboundNo: '',
+      showMaterialDialog: false,
+      materialList: [],
+      materialListLoading: false,
+      isRemoveMode: false // 默认为添加模式
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    
+    // 计算已扫描总数量
+    getTotalScannedQty() {
+      return this.scannedBoxes.reduce((total, box) => total + (box.quantity || 0), 0);
+    },
+
+    // 处理扫描
+    handleScan() {
+      if (!this.scanCode.trim()) {
+        return;
+      }
+
+      if (!this.locationId.trim()) {
+        this.$message.warning('请先指定库位');
+        return;
+      }
+ 
+      if (this.isRemoveMode) {
+        this.removeBoxByCode(this.scanCode.trim());
+      } else {
+        this.validateAndAddBox(this.scanCode.trim());
+      }
+      this.scanCode = '';
+    },
+
+    // 验证箱子并添加到列表
+    validateAndAddBox(boxCode) {
+      const params = {
+        boxCode: boxCode,
+        notifyNo: this.inboundNo,
+        site: this.$store.state.user.site,
+      };
+      
+      scanPackage(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          // 检查是否已经扫描过
+          const exists = this.scannedBoxes.find(item => item.boxCode === boxCode);
+          if (exists) {
+            this.$message.warning('该箱子已扫描，请勿重复扫描');
+            return;
+          }
+
+          // 添加到列表
+          this.scannedBoxes.push({
+            id: Date.now(),
+            boxCode: boxCode,
+            partNo: data.boxInfo.partNo,
+            quantity: data.boxInfo.quantity,
+            batchNo: data.boxInfo.batchNo,
+            locationId: this.locationId
+          });
+
+          this.$message.success('操作成功');
+        } else {
+          this.$message.error(data.msg || '该箱子与入库申请单不符，请检查');
+        }
+      }).catch(error => {
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 通过条码移除箱子
+    removeBoxByCode(boxCode) {
+      const index = this.scannedBoxes.findIndex(item => item.boxCode === boxCode);
+      if (index !== -1) {
+        this.scannedBoxes.splice(index, 1);
+        this.$message.success('操作成功');
+      } else {
+        this.$message.warning('未找到该箱子');
+      }
+    },
+
+    // 确认入库登记
+    confirmRegister() {
+      if (!this.locationId.trim()) {
+        this.$message.warning('请指定库位');
+        return;
+      }
+
+      if (this.scannedBoxes.length === 0) {
+        this.$message.warning('请先扫描箱子');
+        return;
+      }
+
+      this.$confirm('确认进行入库登记操作？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const params = {
+          site: this.$store.state.user.site,
+          inboundNo: this.inboundNo,
+          locationId: this.locationId,
+          boxes: this.scannedBoxes.map(box => ({
+            boxCode: box.boxCode,
+            quantity: box.quantity,
+            batchNo: box.batchNo,
+            partNo: box.partNo,
+            locationId: box.locationId
+          }))
+        };
+
+        inboundRegister(params).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message.success('入库登记成功，已产生入库单并调用IFS入库接口');
+            this.$router.back();
+          } else {
+            this.$message.error(data.msg || '入库登记失败');
+          }
+        }).catch(error => {
+          console.error('入库登记失败:', error);
+          this.$message.error('入库登记失败');
+        });
+      }).catch(() => {
+        // 用户取消操作
+      });
+    },
+
+    // 打印标签
+    printLabels() {
+      if (this.scannedBoxes.length === 0) {
+        this.$message.warning('暂无箱子可打印');
+        return;
+      }
+
+      this.$message.warning('打印功能开发中...');
+    },
+
+    // 取消登记
+    cancelRegister() {
+      if (this.scannedBoxes.length > 0) {
+        this.$confirm('取消后将清空已扫描的箱子，确定取消吗？', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '继续操作',
+          type: 'warning'
+        }).then(() => {
+          this.$router.back();
+        }).catch(() => {
+          // 用户选择继续操作
+        });
+      } else {
+        this.$router.back();
+      }
+    },
+
+    // 显示物料清单弹窗
+    showMaterialListDialog() {
+      this.showMaterialDialog = true;
+      this.loadMaterialList();
+    },
+
+    // 加载物料清单
+    loadMaterialList() {
+      console.log('加载物料清单', this.inboundInfo, this.inboundNo);
+      
+      if (!this.$store.state.user.site || !this.inboundNo) {
+        this.$message.error('缺少必要参数，无法获取物料清单');
+        return;
+      }
+
+      this.materialListLoading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        inboundNo: this.inboundNo
+      };
+
+      getRequestMaterials(params).then(({ data }) => {      
+        this.materialListLoading = false;
+        if (data && data.code === 0) {
+          this.materialList = data.materials || [];
+        } else {
+          this.$message.error(data.msg || '获取物料清单失败');
+          this.materialList = [];
+        }
+      }).catch(error => {
+        this.materialListLoading = false;
+        this.$message.error('获取物料清单失败');
+        this.materialList = [];
+      });
+    },
+
+    // 关闭物料清单弹窗
+    closeMaterialDialog() {
+      this.showMaterialDialog = false;
+    },
+
+    // 加载入库申请单详情
+    loadInboundDetails() {
+      // 模拟数据，实际应该从API获取
+      this.inboundInfo = {
+        inboundNo: this.inboundNo,
+        relatedNo: 'WO202412001',
+        totalBoxes: 10,
+        totalQty: 1000
+      };
+    }
+  },
+
+  mounted() {
+    // 获取路由参数 
+    this.inboundNo = this.$route.params.inboundNo;
+    console.log("入库申请单号:", this.inboundNo);
+    
+    if (!this.inboundNo) {
+      this.$message.error('参数错误');
+      this.$router.back();
+      return;
+    }
+
+    // 聚焦库位输入框
+    this.$nextTick(() => {
+      if (this.$refs.locationInput) {
+        this.$refs.locationInput.focus();
+      }
+    });
+
+    // 加载入库申请单详情
+    this.loadInboundDetails();
+  }
+};
+</script>
+
+<style scoped>
+/* 复用生产领料页面的样式，只修改必要的部分 */
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 库位容器 */
+.location-container {
+  padding: 12px 16px;
+  background: white;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.search-container .el-input {
+  width: 240px;
+  margin-right: 12px;
+}
+
+/* 紧凑型输入框样式 */
+.compact-input ::v-deep .el-input__inner {
+  height: 36px;
+  padding: 0 12px 0 35px;
+  font-size: 14px;
+}
+
+.compact-input ::v-deep .el-input__prefix {
+  left: 10px;
+}
+
+.compact-input ::v-deep .el-input__suffix {
+  right: 30px;
+}
+
+/* 模式切换开关 */
+.mode-switch {
+  position: relative;
+  display: inline-block;
+}
+
+.custom-switch {
+  transform: scale(1.3);
+}
+
+/* 中间文字 */
+.switch-text {
+  position: absolute;
+  left: 25%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+.switch-text2 {
+  position: absolute;
+  left: 75%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+/* 调整 switch 尺寸以便容纳文字 */
+.custom-switch ::v-deep .el-switch__core {
+  width: 60px;
+  height: 28px;
+}
+
+/* 物料信息卡片 */
+.material-info-card {
+  background: white;
+  margin: 4px 16px;
+  padding: 6px 20px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  border: 1px solid #f0f0f0;
+}
+
+.card-title {
+  margin-bottom: 16px;
+}
+
+.title-label {
+  font-size: 11px;
+  color: #999;
+  display: block;
+  margin-bottom: 6px;
+  font-weight: normal;
+}
+
+.title-value {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.2;
+  margin-left: 20px;
+}
+
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #999;
+  margin-bottom: 6px;
+  font-weight: normal;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 区域标题 */
+.section-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  background: white;
+  margin: 0 16px;
+  margin-top: 4px;
+  border-radius: 8px 8px 0 0;
+  border-bottom: 2px solid #17B3A3;
+}
+
+.title-left {
+  display: flex;
+  align-items: center;
+}
+
+.title-left i {
+  color: #17B3A3;
+  font-size: 16px;
+  margin-right: 8px;
+}
+
+.title-left span {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.title-right {
+  display: flex;
+  align-items: center;
+}
+
+.material-list-link {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  text-decoration: underline;
+  transition: color 0.2s ease;
+}
+
+.material-list-link:hover {
+  color: #0d8f7f;
+}
+
+/* 箱子列表 */
+.box-list {
+  background: white;
+  margin: 0 16px 12px;
+  border-radius: 0 0 8px 8px;
+  overflow: hidden;
+}
+
+.list-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 12px 8px;
+  border-bottom: 1px solid #e0e0e0;
+  font-size: 12px;
+  color: #666;
+  font-weight: 500;
+}
+
+.list-item {
+  display: flex;
+  padding: 12px 8px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+}
+
+.list-item:last-child {
+  border-bottom: none;
+}
+
+.col-no {
+  width: 20px;
+  text-align: center;
+}
+
+.col-box {
+  flex: 2;
+  text-align: center;
+}
+
+.col-part {
+  flex: 2;
+  text-align: center;
+}
+
+.col-qty {
+  width: 50px;
+  text-align: center;
+}
+
+.col-location {
+  width: 60px;
+  text-align: center;
+}
+
+.empty-boxes {
+  padding: 40px 20px;
+  text-align: center;
+  color: #999;
+}
+
+.empty-boxes p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 底部操作按钮 */
+.bottom-actions {
+  display: flex;
+  padding: 16px;
+  gap: 20px;
+  background: white;
+  margin-top: auto;
+}
+
+.action-btn {
+  flex: 1;
+  padding: 12px;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+  border-radius: 20px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.action-btn:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+.action-btn:active {
+  transform: scale(0.98);
+}
+
+.action-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.action-btn:disabled:hover {
+  background: white;
+  color: #17B3A3;
+}
+
+/* 物料清单弹窗样式 */
+.material-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.material-modal {
+  background: white;
+  border-radius: 12px;
+  width: 100%;
+  max-width: 800px;
+  max-height: 80vh;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.material-modal .modal-header {
+  background: #17B3A3;
+  color: white;
+  padding: 5px 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  min-height: 28px;
+}
+
+.close-btn {
+  font-size: 16px;
+  cursor: pointer;
+  color: white;
+  transition: color 0.2s ease;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.close-btn:hover {
+  color: #e0e0e0;
+}
+
+.material-modal .modal-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin: 0;
+  line-height: 1.2;
+}
+
+.material-modal .modal-body {
+  flex: 1;
+  overflow: auto;
+  padding: 0;
+}
+
+.material-table {
+  width: 100%;
+}
+
+.table-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 10px 6px;
+  border-bottom: 2px solid #17B3A3;
+  font-size: 12px;
+  color: #333;
+  font-weight: 600;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+.table-body {
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.table-row {
+  display: flex;
+  padding: 10px 6px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+  transition: background-color 0.2s ease;
+}
+
+.table-row:hover {
+  background-color: #f8f9fa;
+}
+
+.table-row:last-child {
+  border-bottom: none;
+}
+
+.material-table .col-no {
+  width: 25px;
+  text-align: center;
+  flex-shrink: 0;
+  font-size: 12px;
+}
+
+.material-table .col-material-code {
+  flex: 1.8;
+  text-align: center;
+  min-width: 100px;
+  font-size: 12px;
+  word-break: break-all;
+}
+
+.material-table .col-required-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-table .col-registered-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-modal .modal-footer {
+  padding: 15px 20px;
+  display: flex;
+  justify-content: center;
+  border-top: 1px solid #f0f0f0;
+}
+
+.btn-close {
+  padding: 10px 20px;
+  border-radius: 6px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+}
+
+.btn-close:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+/* 加载状态样式 */
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #666;
+}
+
+.loading-container i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  color: #17B3A3;
+}
+
+.loading-container span {
+  font-size: 14px;
+}
+
+/* 空数据状态样式 */
+.empty-material {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-material i {
+  font-size: 48px;
+  margin-bottom: 16px;
+  color: #ddd;
+}
+
+.empty-material p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .location-container, .search-container {
+    padding: 8px 12px;
+  }
+
+  .material-info-card {
+    margin: 4px 12px;
+    padding: 6px 16px;
+  }
+
+  .section-title {
+    margin: 0 12px;
+    margin-top: 4px;
+  }
+
+  .box-list {
+    margin: 0 12px 8px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+
+  .list-header, .list-item {
+    font-size: 11px;
+  }
+
+  .col-box, .col-part {
+    flex: 1.5;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-inbound/index.vue b/src/views/modules/production-inbound/index.vue
index 60d0a56..1245b42 100644
--- a/src/views/modules/production-inbound/index.vue
+++ b/src/views/modules/production-inbound/index.vue
@@ -1,397 +1,28 @@
 <template>
-  <div>
-    <div class="pda-container">
-      <div class="status-bar">
-        <div class="goBack" @click="goBack"><i class="el-icon-arrow-left"></i>上一页</div>
-        <div class="goBack">{{ functionTitle }}</div>
-        <div class="network" style="color: #fff" @click="$router.push({ path: '/' })">🏠首页</div>
+  <div class="pda-container">
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产订单入库</span>
       </div>
-      <div style="overflow-y: auto">
-        <!-- 功能选择 -->
-        <div class="function-selector" v-if="!selectedFunction">
-          <div class="function-card" @click="selectFunction('package')">
-            <div class="function-icon">📦</div>
-            <div class="function-title">包装创建</div>
-            <div class="function-desc">扫描通知单，创建生产入库包装</div>
-          </div>
-
-          <div class="function-card" @click="selectFunction('pallet')">
-            <div class="function-icon">🏗️</div>
-            <div class="function-title">装托盘</div>
-            <div class="function-desc">扫描包装，装载到托盘</div>
-          </div>
-
-          <div class="function-card" @click="selectFunction('register')">
-            <div class="function-icon">📋</div>
-            <div class="function-title">入库登记</div>
-            <div class="function-desc">扫描包装，完成入库登记</div>
-          </div>
-
-          <div class="function-card" @click="selectFunction('return')">
-            <div class="function-icon">↩️</div>
-            <div class="function-title">退库操作</div>
-            <div class="function-desc">扫描单元，执行退库操作</div>
-          </div>
-        </div>
-
-        <!-- 包装创建 -->
-        <div class="package-create" v-if="selectedFunction === 'package'">
-          <!-- 通知单输入 -->
-          <div class="input-section" v-if="!notifyInfo.notifyNo">
-            <div class="input-group">
-              <label>通知单号</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="packageForm.notifyNo"
-                  placeholder="请输入或扫描通知单号"
-                  @keyup.enter="loadNotifyInfo"
-                />
-                <button @click="loadNotifyInfo" class="scan-btn">确认</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 通知单信息 -->
-          <div class="notify-info" v-if="notifyInfo.notifyNo">
-            <div class="section-header">
-              <h3>通知单信息</h3>
-              <button @click="resetNotify" class="reset-btn">重新选择</button>
-            </div>
-            <div class="info-card">
-              <div class="info-row">
-                <span class="label">通知单号:</span>
-                <span class="value">{{ notifyInfo.notifyNo }}</span>
-              </div>
-              <div class="info-row">
-                <span class="label">站点:</span>
-                <span class="value">{{ notifyInfo.site }}</span>
-              </div>
-              <div class="info-row">
-                <span class="label">申请人:</span>
-                <span class="value">{{ notifyInfo.userName }}</span>
-              </div>
-              <div class="info-row">
-                <span class="label">状态:</span>
-                <span class="value">{{ notifyInfo.status }}</span>
-              </div>
-            </div>
-
-            <!-- 物料清单 -->
-            <div class="materials-section" v-if="materialList.length">
-              <div class="section-header">
-                <h4>物料清单</h4>
-              </div>
-              <div class="material-list">
-                <div v-for="material in materialList" :key="material.partNo" class="material-item">
-                  <div class="material-info">
-                    <div class="part-no">{{ material.partNo }}</div>
-                    <div class="part-desc">{{ material.partDesc }}</div>
-                    <div class="qty-info">
-                      需求: {{ material.requireQty }} |
-                      已入库: {{ material.inboundQty }} |
-                      待入库: {{ material.pendingQty }}
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <!-- 包装创建表单 -->
-            <div class="create-form">
-              <div class="section-header">
-                <h4>创建包装</h4>
-              </div>
-              <div class="input-group">
-                <label>物料编码</label>
-                <input v-model="packageForm.partNo" placeholder="请输入物料编码" />
-              </div>
-              <div class="input-group">
-                <label>包装数量</label>
-                <input v-model="packageForm.qty" type="number" placeholder="请输入包装数量" />
-              </div>
-              <div class="input-group">
-                <label>批次号</label>
-                <input v-model="packageForm.batchNo" placeholder="请输入批次号（可选）" />
-              </div>
-              <button @click="createPackage" class="confirm-btn" :disabled="!packageForm.partNo || !packageForm.qty">
-                创建包装
-              </button>
-            </div>
-
-            <!-- 已创建包装列表 -->
-            <div class="created-packages" v-if="createdPackages.length">
-              <div class="section-header">
-                <h4>已创建包装 ({{ createdPackages.length }})</h4>
-              </div>
-              <div class="package-list">
-                <div v-for="pkg in createdPackages" :key="pkg.unitId" class="package-item">
-                  <div class="package-info">
-                    <div class="unit-id">{{ pkg.unitId }}</div>
-                    <div class="part-info">{{ pkg.partNo }} - {{ pkg.partDesc }}</div>
-                    <div class="qty-info">数量: {{ pkg.qty }}</div>
-                  </div>
-                  <div class="package-actions">
-                    <button @click="printLabel(pkg)" class="print-btn">打印</button>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <!-- 装托盘 -->
-        <div class="pallet-pack" v-if="selectedFunction === 'pallet'">
-          <!-- 托盘输入 -->
-          <div class="input-section">
-            <div class="input-group">
-              <label>托盘编码</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="palletForm.palletUnitId"
-                  placeholder="请扫描托盘编码"
-                />
-                <button @click="scanPallet" class="scan-btn">扫描</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 包装扫描 -->
-          <div class="scan-section">
-            <div class="section-header">
-              <h3>扫描包装</h3>
-            </div>
-            <div class="input-group">
-              <label>包装编码</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="scannedPackageId"
-                  placeholder="请扫描包装编码"
-                  @keyup.enter="scanPackageForPallet"
-                />
-                <button @click="scanPackageForPallet" class="scan-btn">扫描</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 已扫描包装列表 -->
-          <div class="scanned-packages" v-if="scannedPackages.length">
-            <div class="section-header">
-              <h4>已扫描包装 ({{ scannedPackages.length }})</h4>
-            </div>
-            <div class="package-list">
-              <div v-for="(pkg, index) in scannedPackages" :key="pkg.unitId" class="package-item">
-                <div class="package-info">
-                  <div class="unit-id">{{ pkg.unitId }}</div>
-                  <div class="part-info">{{ pkg.partNo }} - {{ pkg.partDesc }}</div>
-                  <div class="qty-info">数量: {{ pkg.qty }}</div>
-                </div>
-                <div class="package-actions">
-                  <button @click="removePackage(index)" class="remove-btn">移除</button>
-                </div>
-              </div>
-            </div>
-
-            <button @click="confirmPackToPallet" class="confirm-btn" :disabled="!palletForm.palletUnitId">
-              确认装托盘
-            </button>
-          </div>
-        </div>
-
-        <!-- 入库登记 -->
-        <div class="inbound-register" v-if="selectedFunction === 'register'">
-          <!-- 通知单输入 -->
-          <div class="input-section" v-if="!registerForm.notifyNo">
-            <div class="input-group">
-              <label>通知单号</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="tempNotifyNo"
-                  placeholder="请输入通知单号"
-                  @keyup.enter="setNotifyForRegister"
-                />
-                <button @click="setNotifyForRegister" class="scan-btn">确认</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 库位输入 -->
-          <div class="input-section" v-if="registerForm.notifyNo">
-            <div class="input-group">
-              <label>库位</label>
-              <input v-model="registerForm.locationId" placeholder="请输入库位" />
-            </div>
-          </div>
-
-          <!-- 包装扫描 -->
-          <div class="scan-section" v-if="registerForm.notifyNo">
-            <div class="section-header">
-              <h3>扫描包装</h3>
-            </div>
-            <div class="input-group">
-              <label>包装编码</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="scannedPackageId"
-                  placeholder="请扫描包装编码"
-                  @keyup.enter="scanPackageForRegister"
-                />
-                <button @click="scanPackageForRegister" class="scan-btn">扫描</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 已扫描包装列表 -->
-          <div class="scanned-packages" v-if="scannedPackages.length">
-            <div class="section-header">
-              <h4>待入库包装 ({{ scannedPackages.length }})</h4>
-            </div>
-            <div class="package-list">
-              <div v-for="(pkg, index) in scannedPackages" :key="pkg.unitId" class="package-item">
-                <div class="package-info">
-                  <div class="unit-id">{{ pkg.unitId }}</div>
-                  <div class="part-info">{{ pkg.partNo }} - {{ pkg.partDesc }}</div>
-                  <div class="qty-info">数量: {{ pkg.qty }}</div>
-                </div>
-                <div class="package-actions">
-                  <button @click="removePackage(index)" class="remove-btn">移除</button>
-                </div>
-              </div>
-            </div>
-
-            <button @click="confirmInboundRegister" class="confirm-btn" :disabled="!registerForm.locationId">
-              确认入库
-            </button>
-          </div>
-        </div>
-
-        <!-- 退库操作 -->
-        <div class="return-operation" v-if="selectedFunction === 'return'">
-          <!-- 通知单输入 -->
-          <div class="input-section" v-if="!returnForm.notifyNo">
-            <div class="input-group">
-              <label>通知单号</label>
-              <div class="input-with-scan">
-                <input
-                  v-model="tempNotifyNo"
-                  placeholder="请输入通知单号"
-                  @keyup.enter="loadInboundRecords"
-                />
-                <button @click="loadInboundRecords" class="scan-btn">查询</button>
-              </div>
-            </div>
-          </div>
-
-          <!-- 入库记录选择 -->
-          <div class="records-section" v-if="inboundRecords.length">
-            <div class="section-header">
-              <h3>选择入库记录</h3>
-            </div>
-            <div class="record-list">
-              <div v-for="record in inboundRecords" :key="record.transNo"
-                   class="record-item"
-                   :class="{ selected: selectedRecord === record.transNo }"
-                   @click="selectRecord(record)">
-                <div class="record-info">
-                  <div class="trans-no">{{ record.transNo }}</div>
-                  <div class="trans-date">{{ record.transDate | formatDate }}</div>
-                  <div class="qty-info">
-                    入库: {{ record.inboundQty }} |
-                    已退: {{ record.returnedQty }} |
-                    可退: {{ record.availableReturnQty }}
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <!-- 退库方式选择 -->
-          <div class="return-type-section" v-if="selectedRecord">
-            <div class="section-header">
-              <h4>退库方式</h4>
-            </div>
-            <div class="radio-group">
-              <label class="radio-item">
-                <input type="radio" v-model="returnType" value="quantity" />
-                <span>按数量退库</span>
-              </label>
-              <label class="radio-item">
-                <input type="radio" v-model="returnType" value="unit" />
-                <span>按单元退库</span>
-              </label>
-            </div>
-          </div>
-
-          <!-- 按数量退库 -->
-          <div class="quantity-return" v-if="returnType === 'quantity'">
-            <div class="input-group">
-              <label>退库数量</label>
-              <input v-model="returnForm.returnQty" type="number" placeholder="请输入退库数量" />
-            </div>
-            <div class="input-group">
-              <label>退库原因</label>
-              <input v-model="returnForm.returnReason" placeholder="请输入退库原因" />
-            </div>
-            <button @click="confirmReturn" class="confirm-btn" :disabled="!returnForm.returnQty || !returnForm.returnReason">
-              确认退库
-            </button>
-          </div>
-
-          <!-- 按单元退库 -->
-          <div class="unit-return" v-if="returnType === 'unit'">
-            <div class="scan-section">
-              <div class="input-group">
-                <label>单元编码</label>
-                <div class="input-with-scan">
-                  <input
-                    v-model="scannedUnitId"
-                    placeholder="请扫描单元编码"
-                    @keyup.enter="scanUnitForReturn"
-                  />
-                  <button @click="scanUnitForReturn" class="scan-btn">扫描</button>
-                </div>
-              </div>
-            </div>
-
-            <!-- 已扫描单元列表 -->
-            <div class="scanned-units" v-if="scannedUnits.length">
-              <div class="section-header">
-                <h4>已扫描单元 ({{ scannedUnits.length }})</h4>
-              </div>
-              <div class="unit-list">
-                <div v-for="(unit, index) in scannedUnits" :key="unit.unitId" class="unit-item">
-                  <div class="unit-info">
-                    <div class="unit-id">{{ unit.unitId }}</div>
-                    <div class="part-info">{{ unit.partNo }} - {{ unit.partDesc }}</div>
-                    <div class="qty-info">数量: {{ unit.qty }}</div>
-                  </div>
-                  <div class="unit-actions">
-                    <button @click="removeUnit(index)" class="remove-btn">移除</button>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div class="input-group">
-              <label>退库原因</label>
-              <input v-model="returnForm.returnReason" placeholder="请输入退库原因" />
-            </div>
-
-            <button @click="confirmReturn" class="confirm-btn" :disabled="!scannedUnits.length || !returnForm.returnReason">
-              确认退库
-            </button>
-          </div>
-        </div>
-
-        <!-- 加载提示 -->
-        <div class="loading" v-if="loading">
-          <div class="loading-spinner"></div>
-          <div class="loading-text">{{ loadingText }}</div>
-        </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
 
-        <!-- 消息提示 -->
-        <div class="message" v-if="message" :class="messageType">
-          {{ message }}
+    <!-- 功能菜单 -->
+    <div class="menu-grid">
+      <div
+        class="menu-item"
+        v-for="(btn, index) in buttons"
+        :key="index"
+        :class="{ 'disabled': btn.disabled }"
+        @click="handleButtonClick(btn)"
+      >
+        <div class="menu-icon" :class="btn.iconClass">
+          <van-icon :name="btn.icon" size="24" />
         </div>
+        <div class="menu-text">{{ btn.label }}</div>
       </div>
     </div>
   </div>
@@ -399,939 +30,137 @@
 
 <script>
 export default {
-  name: 'ProductionInboundPDA',
   data() {
     return {
-      selectedFunction: null,
-      loading: false,
-      loadingText: '',
-      message: '',
-      messageType: 'info',
-
-      // 通知单信息
-      notifyInfo: {},
-      materialList: [],
-
-      // 包装创建
-      packageForm: {
-        site: 'MAIN',
-        notifyNo: '',
-        partNo: '',
-        qty: null,
-        batchNo: '',
-        operator: 'PDA_USER'
-      },
-      createdPackages: [],
-
-      // 装托盘
-      palletForm: {
-        site: 'MAIN',
-        palletUnitId: '',
-        operator: 'PDA_USER'
-      },
-
-      // 入库登记
-      registerForm: {
-        site: 'MAIN',
-        notifyNo: '',
-        locationId: '',
-        operator: 'PDA_USER'
-      },
-      tempNotifyNo: '',
-
-      // 退库
-      returnForm: {
-        site: 'MAIN',
-        notifyNo: '',
-        transNo: '',
-        returnQty: null,
-        returnReason: '',
-        operator: 'PDA_USER'
-      },
-      inboundRecords: [],
-      selectedRecord: '',
-      returnType: 'quantity',
-
-      // 通用扫描
-      scannedPackageId: '',
-      scannedPackages: [],
-      scannedUnitId: '',
-      scannedUnits: []
-    }
-  },
-  computed: {
-    functionTitle() {
-      if (!this.selectedFunction) return '生产入库';
-      if (this.selectedFunction === 'package') return '包装创建';
-      if (this.selectedFunction === 'pallet') return '装托盘';
-      if (this.selectedFunction === 'register') return '入库登记';
-      if (this.selectedFunction === 'return') return '退库操作';
-      return '生产入库';
+      buttons: [
+        { icon: 'scan', label: '包装', iconClass: 'purchase', to: 'productionPick', disabled: false },
+        { icon: 'records', label: '装托盘', iconClass: 'qualified', to: 'productionPick', disabled: true },
+        { icon: 'box', label: '入库登记', iconClass: 'inspection', to: 'inboundRegister', disabled: false },
+      ]
     }
   },
   methods: {
-    selectFunction(func) {
-      this.selectedFunction = func
-      this.resetAll()
-    },
-
-    goBack() {
-      if (!this.selectedFunction) {
-        this.$router.push('/')
+    handleButtonClick(btn) {
+      if (btn.disabled) {
+        this.$message.warning('正在开发中，敬请期待...');
       } else {
-        this.selectedFunction = null
-        this.resetAll()
-      }
-    },
-
-    resetAll() {
-      this.notifyInfo = {}
-      this.materialList = []
-      this.createdPackages = []
-      this.scannedPackages = []
-      this.scannedUnits = []
-      this.inboundRecords = []
-      this.selectedRecord = ''
-      this.packageForm = {
-        site: 'MAIN',
-        notifyNo: '',
-        partNo: '',
-        qty: null,
-        batchNo: '',
-        operator: 'PDA_USER'
-      }
-      this.palletForm = {
-        site: 'MAIN',
-        palletUnitId: '',
-        operator: 'PDA_USER'
-      }
-      this.registerForm = {
-        site: 'MAIN',
-        notifyNo: '',
-        locationId: '',
-        operator: 'PDA_USER'
-      }
-      this.returnForm = {
-        site: 'MAIN',
-        notifyNo: '',
-        transNo: '',
-        returnQty: null,
-        returnReason: '',
-        operator: 'PDA_USER'
-      }
-      this.tempNotifyNo = ''
-      this.scannedPackageId = ''
-      this.scannedUnitId = ''
-      this.message = ''
-    },
-
-    // 包装创建相关方法
-    async loadNotifyInfo() {
-      if (!this.packageForm.notifyNo) {
-        this.showMessage('请输入通知单号', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '加载通知单信息...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/notify/info'),
-          method: 'get',
-          params: { notifyNo: this.packageForm.notifyNo }
-        })
-
-        if (response.data.code === 0) {
-          this.notifyInfo = response.data.data
-          this.packageForm.site = this.notifyInfo.site
-          await this.loadMaterials()
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('加载通知单信息失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async loadMaterials() {
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/notify/materials'),
-          method: 'get',
-          params: { notifyNo: this.packageForm.notifyNo }
-        })
-
-        if (response.data.code === 0) {
-          this.materialList = response.data.data || []
-        }
-      } catch (error) {
-        console.error('加载物料清单失败', error)
-      }
-    },
-
-    resetNotify() {
-      this.packageForm.notifyNo = ''
-      this.notifyInfo = {}
-      this.materialList = []
-      this.createdPackages = []
-    },
-
-    async createPackage() {
-      if (!this.packageForm.partNo || !this.packageForm.qty) {
-        this.showMessage('请填写完整的包装信息', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '创建包装中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/package/create'),
-          method: 'post',
-          data: this.packageForm
-        })
-
-        if (response.data.code === 0) {
-          this.createdPackages.push(response.data.data)
-          this.showMessage('包装创建成功', 'success')
-          // 重置表单
-          this.packageForm.partNo = ''
-          this.packageForm.qty = null
-          this.packageForm.batchNo = ''
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('创建包装失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async printLabel(pkg) {
-      this.loading = true
-      this.loadingText = '打印标签中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/package/print'),
-          method: 'post',
-          data: {
-            unitId: pkg.unitId,
-            printerName: 'default'
-          }
-        })
-
-        if (response.data.code === 0) {
-          this.showMessage('标签打印成功', 'success')
-          console.log('ZPL数据:', response.data.labelData)
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('打印标签失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 装托盘相关方法
-    scanPallet() {
-      // 这里可以集成扫描设备
-      this.$prompt('请输入托盘编码', '扫描托盘', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消'
-      }).then(({ value }) => {
-        this.palletForm.palletUnitId = value
-      })
-    },
-
-    async scanPackageForPallet() {
-      if (!this.scannedPackageId) {
-        this.showMessage('请输入包装编码', 'error')
-        return
-      }
-
-      // 检查是否已经扫描过
-      const exists = this.scannedPackages.find(pkg => pkg.unitId === this.scannedPackageId)
-      if (exists) {
-        this.showMessage('该包装已经扫描过了', 'warning')
-        this.scannedPackageId = ''
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '扫描包装中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/package/scan'),
-          method: 'get',
-          params: { unitId: this.scannedPackageId }
-        })
-
-        if (response.data.code === 0) {
-          this.scannedPackages.push(response.data.data)
-          this.scannedPackageId = ''
-          this.showMessage('扫描成功', 'success')
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('扫描包装失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async confirmPackToPallet() {
-      if (!this.palletForm.palletUnitId) {
-        this.showMessage('请输入托盘编码', 'error')
-        return
-      }
-
-      if (this.scannedPackages.length === 0) {
-        this.showMessage('请先扫描包装', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '装托盘中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/pallet/pack'),
-          method: 'post',
-          data: {
-            ...this.palletForm,
-            packageUnitIds: this.scannedPackages.map(pkg => pkg.unitId)
-          }
-        })
-
-        if (response.data.code === 0) {
-          this.showMessage('装托盘成功', 'success')
-          this.palletForm.palletUnitId = ''
-          this.scannedPackages = []
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('装托盘失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 入库登记相关方法
-    setNotifyForRegister() {
-      if (!this.tempNotifyNo) {
-        this.showMessage('请输入通知单号', 'error')
-        return
-      }
-      this.registerForm.notifyNo = this.tempNotifyNo
-    },
-
-    async scanPackageForRegister() {
-      if (!this.scannedPackageId) {
-        this.showMessage('请输入包装编码', 'error')
-        return
+        this.$router.push(btn.to);
       }
-
-      // 检查是否已经扫描过
-      const exists = this.scannedPackages.find(pkg => pkg.unitId === this.scannedPackageId)
-      if (exists) {
-        this.showMessage('该包装已经扫描过了', 'warning')
-        this.scannedPackageId = ''
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '扫描包装中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/package/scan'),
-          method: 'get',
-          params: { unitId: this.scannedPackageId }
-        })
-
-        if (response.data.code === 0) {
-          this.scannedPackages.push(response.data.data)
-          this.scannedPackageId = ''
-          this.showMessage('扫描成功', 'success')
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('扫描包装失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async confirmInboundRegister() {
-      if (!this.registerForm.locationId) {
-        this.showMessage('请输入库位', 'error')
-        return
-      }
-
-      if (this.scannedPackages.length === 0) {
-        this.showMessage('请先扫描包装', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '入库登记中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/register'),
-          method: 'post',
-          data: {
-            ...this.registerForm,
-            unitIds: this.scannedPackages.map(pkg => pkg.unitId)
-          }
-        })
-
-        if (response.data.code === 0) {
-          this.showMessage('入库登记成功', 'success')
-          this.registerForm.locationId = ''
-          this.scannedPackages = []
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('入库登记失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 退库相关方法
-    async loadInboundRecords() {
-      if (!this.tempNotifyNo) {
-        this.showMessage('请输入通知单号', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '加载入库记录...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/records'),
-          method: 'get',
-          params: { notifyNo: this.tempNotifyNo }
-        })
-
-        if (response.data.code === 0) {
-          this.inboundRecords = response.data.data || []
-          this.returnForm.notifyNo = this.tempNotifyNo
-          if (this.inboundRecords.length === 0) {
-            this.showMessage('没有找到入库记录', 'warning')
-          }
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('加载入库记录失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    selectRecord(record) {
-      this.selectedRecord = record.transNo
-      this.returnForm.transNo = record.transNo
-    },
-
-    async scanUnitForReturn() {
-      if (!this.scannedUnitId) {
-        this.showMessage('请输入单元编码', 'error')
-        return
-      }
-
-      // 检查是否已经扫描过
-      const exists = this.scannedUnits.find(unit => unit.unitId === this.scannedUnitId)
-      if (exists) {
-        this.showMessage('该单元已经扫描过了', 'warning')
-        this.scannedUnitId = ''
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '扫描单元中...'
-
-      try {
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/return/scan'),
-          method: 'get',
-          params: { unitId: this.scannedUnitId }
-        })
-
-        if (response.data.code === 0) {
-          const unitInfo = response.data.data
-          if (unitInfo.canReturn === 'Y') {
-            this.scannedUnits.push(unitInfo)
-            this.scannedUnitId = ''
-            this.showMessage('扫描成功', 'success')
-          } else {
-            this.showMessage('该单元不可退库', 'error')
-          }
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('扫描单元失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async confirmReturn() {
-      if (!this.selectedRecord) {
-        this.showMessage('请先选择入库记录', 'error')
-        return
-      }
-
-      if (!this.returnForm.returnReason) {
-        this.showMessage('请输入退库原因', 'error')
-        return
-      }
-
-      if (this.returnType === 'quantity' && (!this.returnForm.returnQty || this.returnForm.returnQty <= 0)) {
-        this.showMessage('请输入有效的退库数量', 'error')
-        return
-      }
-
-      if (this.returnType === 'unit' && this.scannedUnits.length === 0) {
-        this.showMessage('请先扫描单元', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '退库中...'
-
-      try {
-        const returnData = {
-          ...this.returnForm
-        }
-
-        if (this.returnType === 'unit') {
-          returnData.unitIds = this.scannedUnits.map(unit => unit.unitId)
-        }
-
-        const response = await this.$http({
-          url: this.$http.adornUrl('/production/inbound/return'),
-          method: 'post',
-          data: returnData
-        })
-
-        if (response.data.code === 0) {
-          this.showMessage('退库成功', 'success')
-          this.resetReturnForm()
-          await this.loadInboundRecords()
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('退库失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    resetReturnForm() {
-      this.returnForm.returnQty = null
-      this.returnForm.returnReason = ''
-      this.scannedUnits = []
-      this.scannedUnitId = ''
-      this.selectedRecord = ''
-    },
-
-    // 通用方法
-    removePackage(index) {
-      this.scannedPackages.splice(index, 1)
-    },
-
-    removeUnit(index) {
-      this.scannedUnits.splice(index, 1)
-    },
-
-    showMessage(text, type = 'info') {
-      this.message = text
-      this.messageType = type
-      setTimeout(() => {
-        this.message = ''
-      }, 3000)
-    }
-  },
-  filters: {
-    formatDate(date) {
-      if (!date) return ''
-      return new Date(date).toLocaleDateString()
     }
   }
 }
 </script>
 
-<style scoped>
-.production-inbound-pda {
-  padding: 10px;
-  font-family: Arial, sans-serif;
-  background-color: #f5f5f5;
-  min-height: 100vh;
-}
-
-/* 功能选择 */
-.function-selector {
-  display: flex;
-  flex-direction: column;
-  gap: 15px;
-  padding: 20px 0;
-}
-
-.function-card {
-  background: white;
-  border-radius: 8px;
-  padding: 20px;
-  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-  cursor: pointer;
-  transition: all 0.3s;
-  text-align: center;
-}
-
-.function-card:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
+<style>
+:root {
+  --columns: 3;
+  --button-size: calc(100vw / var(--columns) - 20px);
 }
 
-.function-icon {
-  font-size: 48px;
-  margin-bottom: 10px;
-}
-
-.function-title {
-  font-size: 18px;
-  font-weight: bold;
-  margin-bottom: 8px;
-  color: #333;
-}
-
-.function-desc {
-  font-size: 14px;
-  color: #666;
-}
-
-/* 输入区域 */
-.input-section, .notify-info, .scan-section, .records-section, .return-type-section {
-  background: white;
-  border-radius: 8px;
-  padding: 15px;
-  margin-bottom: 15px;
-  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-}
-
-.section-header {
+/* 头部栏 */
+.header-bar {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  margin-bottom: 15px;
-  padding-bottom: 10px;
-  border-bottom: 1px solid #eee;
-}
-
-.section-header h3, .section-header h4 {
-  margin: 0;
-  color: #333;
-}
-
-.reset-btn {
-  background: #17b3a3;
-  color: white;
-  border: none;
-  padding: 6px 12px;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 12px;
-}
-
-.input-group {
-  margin-bottom: 15px;
-}
-
-.input-group label {
-  display: block;
-  margin-bottom: 5px;
-  font-weight: bold;
-  color: #333;
-}
-
-.input-with-scan {
-  display: flex;
-  gap: 10px;
-}
-
-.input-with-scan input, .input-group input {
-  flex: 1;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  font-size: 16px;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.scan-btn, .confirm-btn, .print-btn, .remove-btn {
-  background: #17b3a3;
+  padding: 8px 16px;
+  background: #17B3A3;
   color: white;
-  border: none;
-  padding: 10px 15px;
-  border-radius: 4px;
-  cursor: pointer;
-  font-size: 14px;
-  white-space: nowrap;
-}
-
-.scan-btn:hover, .confirm-btn:hover, .print-btn:hover {
-  background: #13998c;
-}
-
-.remove-btn {
-  background: #dc3545;
-  padding: 6px 10px;
-  font-size: 12px;
-}
-
-.remove-btn:hover {
-  background: #c82333;
-}
-
-.confirm-btn:disabled, .print-btn:disabled {
-  background: #6c757d;
-  cursor: not-allowed;
-}
-
-/* 信息卡片 */
-.info-card {
-  background: #f8f9fa;
-  border-radius: 6px;
-  padding: 15px;
-  margin-bottom: 15px;
-}
-
-.info-row {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 8px;
-  padding: 5px 0;
-  border-bottom: 1px solid #eee;
-}
-
-.info-row:last-child {
-  border-bottom: none;
-  margin-bottom: 0;
-}
-
-.info-row .label {
-  font-weight: bold;
-  color: #666;
-}
-
-.info-row .value {
-  color: #333;
-}
-
-/* 物料列表 */
-.material-list, .package-list, .record-list, .unit-list {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
+  height: 40px;
+  min-height: 40px;
+  max-height: 40px;
 }
 
-.material-item, .package-item, .record-item, .unit-item {
+.header-left {
   display: flex;
-  justify-content: space-between;
   align-items: center;
-  padding: 15px;
-  border: 1px solid #ddd;
-  border-radius: 6px;
   cursor: pointer;
-  transition: all 0.3s;
-}
-
-.material-item:hover, .package-item:hover, .record-item:hover, .unit-item:hover {
-  border-color: #007bff;
-  background-color: #f8f9fa;
-}
-
-.record-item.selected {
-  border-color: #007bff;
-  background-color: #e3f2fd;
-}
-
-.material-info, .package-info, .record-info, .unit-info {
-  flex: 1;
-}
-
-.part-no, .unit-id, .trans-no {
-  font-weight: bold;
   font-size: 16px;
-  color: #333;
-  margin-bottom: 4px;
+  font-weight: 500;
 }
 
-.part-desc, .part-info {
-  color: #666;
-  font-size: 14px;
-  margin-bottom: 4px;
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
 }
 
-.qty-info, .trans-date {
-  font-size: 12px;
-  color: #666;
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
 }
 
-.package-actions, .unit-actions {
-  display: flex;
-  gap: 5px;
+.menu-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 15px;
+  padding: 20px;
+  justify-content: center; /* 水平居中 */
+  align-content: center; /* 垂直居中 */
+  width: 100%; /* 确保占满容器宽度 */
 }
 
-/* 表单区域 */
-.create-form, .quantity-return, .unit-return {
+.menu-item {
   background: white;
-  border-radius: 8px;
-  padding: 15px;
-  margin-bottom: 15px;
-  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-}
-
-/* 单选按钮组 */
-.radio-group {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.radio-item {
-  display: flex;
-  align-items: center;
-  gap: 8px;
+  border-radius: 12px;
+  padding: 12px 6px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: transform 0.2s;
   cursor: pointer;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  transition: all 0.3s;
 }
 
-.radio-item:hover {
-  background-color: #f8f9fa;
+.menu-item:active {
+  transform: scale(0.95);
 }
 
-.radio-item input[type="radio"] {
-  margin: 0;
+.menu-item.disabled {
+  opacity: 0.6;
+  position: relative;
 }
 
-/* 加载和消息 */
-.loading {
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  background: rgba(0,0,0,0.8);
+.menu-item.disabled::after {
+  content: '开发中';
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  background: #ff9500;
   color: white;
-  padding: 20px;
+  font-size: 8px;
+  padding: 2px 4px;
   border-radius: 8px;
-  text-align: center;
-  z-index: 1000;
-}
-
-.loading-spinner {
-  width: 40px;
-  height: 40px;
-  border: 4px solid #f3f3f3;
-  border-top: 4px solid #007bff;
-  border-radius: 50%;
-  animation: spin 1s linear infinite;
-  margin: 0 auto 10px;
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
-}
-
-.loading-text {
-  font-size: 14px;
-}
-
-.message {
-  position: fixed;
-  top: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  padding: 12px 20px;
-  border-radius: 6px;
   font-weight: bold;
-  z-index: 1001;
-  max-width: 90%;
-  text-align: center;
 }
 
-.message.success {
-  background: #d4edda;
-  color: #155724;
-  border: 1px solid #c3e6cb;
+.menu-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 6px;
+  color: white;
 }
 
-.message.error {
-  background: #f8d7da;
-  color: #721c24;
-  border: 1px solid #f5c6cb;
+.menu-icon.purchase {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
 }
 
-.message.warning {
-  background: #fff3cd;
-  color: #856404;
-  border: 1px solid #ffeaa7;
+.menu-icon.inspection {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
 }
 
-.message.info {
-  background: #d1ecf1;
-  color: #0c5460;
-  border: 1px solid #bee5eb;
+.menu-icon.qualified {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
 }
 
-/* 响应式设计 */
-@media (max-width: 768px) {
-  .production-inbound-pda {
-    padding: 5px;
-  }
-
-  .function-card {
-    padding: 15px;
-  }
-
-  .function-icon {
-    font-size: 36px;
-  }
-
-  .input-with-scan {
-    flex-direction: column;
-  }
-
-  .material-item, .package-item, .record-item, .unit-item {
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 10px;
-  }
-
-  .package-actions, .unit-actions {
-    align-self: flex-end;
-  }
+.menu-text {
+  font-size: 10px;
+  color: #333;
+  font-weight: bold; /* 加粗字体 */
+  white-space: nowrap; /* 防止文字换行 */
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-inbound/production.vue b/src/views/modules/production-inbound/production.vue
new file mode 100644
index 0000000..1245b42
--- /dev/null
+++ b/src/views/modules/production-inbound/production.vue
@@ -0,0 +1,166 @@
+<template>
+  <div class="pda-container">
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产订单入库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 功能菜单 -->
+    <div class="menu-grid">
+      <div
+        class="menu-item"
+        v-for="(btn, index) in buttons"
+        :key="index"
+        :class="{ 'disabled': btn.disabled }"
+        @click="handleButtonClick(btn)"
+      >
+        <div class="menu-icon" :class="btn.iconClass">
+          <van-icon :name="btn.icon" size="24" />
+        </div>
+        <div class="menu-text">{{ btn.label }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      buttons: [
+        { icon: 'scan', label: '包装', iconClass: 'purchase', to: 'productionPick', disabled: false },
+        { icon: 'records', label: '装托盘', iconClass: 'qualified', to: 'productionPick', disabled: true },
+        { icon: 'box', label: '入库登记', iconClass: 'inspection', to: 'inboundRegister', disabled: false },
+      ]
+    }
+  },
+  methods: {
+    handleButtonClick(btn) {
+      if (btn.disabled) {
+        this.$message.warning('正在开发中，敬请期待...');
+      } else {
+        this.$router.push(btn.to);
+      }
+    }
+  }
+}
+</script>
+
+<style>
+:root {
+  --columns: 3;
+  --button-size: calc(100vw / var(--columns) - 20px);
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+  max-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.menu-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 15px;
+  padding: 20px;
+  justify-content: center; /* 水平居中 */
+  align-content: center; /* 垂直居中 */
+  width: 100%; /* 确保占满容器宽度 */
+}
+
+.menu-item {
+  background: white;
+  border-radius: 12px;
+  padding: 12px 6px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: transform 0.2s;
+  cursor: pointer;
+}
+
+.menu-item:active {
+  transform: scale(0.95);
+}
+
+.menu-item.disabled {
+  opacity: 0.6;
+  position: relative;
+}
+
+.menu-item.disabled::after {
+  content: '开发中';
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  background: #ff9500;
+  color: white;
+  font-size: 8px;
+  padding: 2px 4px;
+  border-radius: 8px;
+  font-weight: bold;
+}
+
+.menu-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 6px;
+  color: white;
+}
+
+.menu-icon.purchase {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.inspection {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.qualified {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-text {
+  font-size: 10px;
+  color: #333;
+  font-weight: bold; /* 加粗字体 */
+  white-space: nowrap; /* 防止文字换行 */
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-inbound/productionPick.vue b/src/views/modules/production-inbound/productionPick.vue
new file mode 100644
index 0000000..e807640
--- /dev/null
+++ b/src/views/modules/production-inbound/productionPick.vue
@@ -0,0 +1,387 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产订单入库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable
+                v-model="searchCode"
+                placeholder="请输入入库申请单单号"
+                prefix-icon="el-icon-search"
+                @keyup.enter.native="handleSearch"
+                ref="searchInput"
+      />
+    </div>
+
+    <!-- 入库申请单列表 -->
+    <div class="content-area">
+      <div
+        v-for="(item, index) in inboundList"
+        :key="index"
+        class="inbound-card"
+        @click="goToInboundPage(item)"
+      >
+        <div class="card-title">
+          <span class="title-label">入库申请单号</span>
+          <span class="title-value">{{ item.notifyNo }}</span>
+        </div>
+
+        <div class="card-details">
+          <div class="detail-item">
+            <div class="detail-label">关联单号</div>
+            <div class="detail-value">{{ item.workOrderNo }}</div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">标签张数</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.createdLabels }}</span><span class="total">{{ item.totalLabels }}</span>
+            </div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">物料总数</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.inboundQty }}</span><span class="total">{{ item.totalQty }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="inboundList.length === 0 && !loading" class="empty-state">
+        <i class="el-icon-box"></i>
+        <p>暂无待入库申请单</p>
+      </div>
+
+      <!-- 加载状态 -->
+      <div v-if="loading" class="loading-state">
+        <i class="el-icon-loading"></i>
+        <p>加载中...</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getInboundNotifyByNo,
+  getInboundNotifyListByNo,
+} from '@/api/production/production-inbound'
+import { getCurrentWarehouse } from '@/utils'
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      searchCode: '',
+      inboundList: [],
+      loading: false
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理搜索
+    handleSearch() {
+      if (this.searchCode.trim()) {
+        this.searchInboundList(this.searchCode.trim());
+      } else {
+        this.loadInboundList();
+      }
+    },
+
+    // 加载生产入库申请单列表
+    loadInboundList() {
+      this.loading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        status: '待入库',
+      }
+      console.log('params', params);
+      
+      getInboundNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          this.inboundList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '获取数据失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        console.error('获取生产入库申请单列表失败:', error);
+        this.$message.error('获取数据失败');
+      });
+    },
+
+    // 搜索特定入库申请单
+    searchInboundList(searchCode) {
+      this.loading = true;
+      const params = {
+        notifyNo: searchCode,
+        site: this.$store.state.user.site,
+        status: 'INBOUND'
+      };
+
+      getInboundNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          if (data.list.length === 0) {
+            this.$message.warning('未找到匹配的入库申请单');
+          }
+          this.inboundList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '查询失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        this.$message.error('查询失败');
+      });
+    },
+
+    // 跳转到入库页面
+    goToInboundPage(item) {
+      this.$router.push({
+        name: 'productionInboundDetail',
+        params: {
+          inboundNo: item.notifyNo,
+        }
+      });
+    }
+  },
+
+  mounted() {
+    // 聚焦搜索框
+    this.$nextTick(() => {
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.focus();
+      }
+    });
+
+    // 加载数据
+    this.loadInboundList();
+  }
+};
+</script>
+
+<style scoped>
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+}
+
+/* 内容区域 */
+.content-area {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px 16px;
+}
+
+/* 入库卡片 */
+.inbound-card {
+  background: white;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 16px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.inbound-card:hover {
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  transform: translateY(-1px);
+}
+
+.inbound-card:active {
+  transform: translateY(0);
+}
+
+/* 卡片标题 */
+.card-title {
+  margin-bottom: 12px;
+}
+
+.title-label {
+  font-size: 12px;
+  color: #666;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.title-value {
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+  margin-left: 20px;
+}
+
+/* 卡片详情 */
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #666;
+  margin-bottom: 4px;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 空状态 */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-state i {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.empty-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 加载状态 */
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #17B3A3;
+}
+
+.loading-state i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.loading-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .content-area {
+    padding: 8px 12px;
+  }
+
+  .inbound-card {
+    padding: 12px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-inbound/productionPickingDetail.vue b/src/views/modules/production-inbound/productionPickingDetail.vue
new file mode 100644
index 0000000..75b10f6
--- /dev/null
+++ b/src/views/modules/production-inbound/productionPickingDetail.vue
@@ -0,0 +1,982 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产订单入库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable class="compact-input"
+        v-model="scanCode"
+        placeholder="请扫描箱二维码"
+        prefix-icon="el-icon-search"
+        @keyup.enter.native="handleScan"
+        ref="scanInput"
+      />
+      <div class="mode-switch">
+        <el-switch
+          class="custom-switch"
+          v-model="isRemoveMode"
+          active-color="#ff4949"
+          inactive-color="#13ce66">
+        </el-switch>
+        <span v-if="isRemoveMode" class="switch-text">{{ '移除' }}</span>
+        <span v-else class="switch-text2">{{ '添加' }}</span>
+      </div>
+    </div>
+
+    <!-- 入库申请单信息卡片 -->
+    <div class="material-info-card" v-if="inboundInfo.inboundNo">
+      <div class="card-title">
+        <span class="title-label">入库申请单号</span>
+        <span class="title-value">{{ inboundInfo.inboundNo }}</span>
+      </div>
+
+      <div class="card-details">
+        <div class="detail-item">
+          <div class="detail-label">关联单号</div>
+          <div class="detail-value">{{ inboundInfo.relatedNo }}</div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">标签张数</div>
+          <div class="detail-value">
+            <span class="qualified">{{ inboundInfo.createdLabels }}</span><span class="total">{{ inboundInfo.totalLabels }}</span>
+          </div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">物料总数</div>
+          <div class="detail-value">
+            <span class="qualified">{{ inboundInfo.inboundQty }}</span><span class="total">{{ inboundInfo.totalQty }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 入库信息确认标题 -->
+    <div class="section-title">
+      <div class="title-left">
+        <i class="el-icon-circle-check"></i>
+        <span>入库信息确认</span>
+      </div>
+      <div class="title-right">
+        <span class="material-list-link" @click="showMaterialListDialog">物料清单</span>
+      </div>
+    </div>
+
+    <!-- 标签列表 -->
+    <div class="label-list">
+      <div class="list-header">
+        <div class="col-no">NO.</div>
+        <div class="col-label">标签条码</div>
+        <div class="col-part">物料编码</div>
+        <div class="col-unit">单位</div>
+        <div class="col-qty">标签数量</div>
+      </div>
+
+      <div
+        v-for="(label, index) in labelList"
+        :key="label.id"
+        class="list-item"
+      >
+        <div class="col-no">{{ labelList.length - index }}</div>
+        <div class="col-label">{{ label.labelCode }}</div>
+        <div class="col-part">{{ label.partNo }}</div>
+        <div class="col-unit">{{ label.unit || '个' }}</div>
+        <div class="col-qty">{{ label.quantity }}</div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="labelList.length === 0" class="empty-labels">
+        <p>暂无扫描标签</p>
+      </div>
+    </div>
+
+    <!-- 底部操作按钮 -->
+    <div class="bottom-actions">
+      <button class="action-btn secondary" @click="confirmInbound">
+        确定
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="printLabels">
+        打印
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="cancelInbound">
+        取消
+      </button>
+    </div>
+
+    <!-- 物料清单弹窗 -->
+    <div v-if="showMaterialDialog" class="material-overlay">
+      <div class="material-modal">
+        <div class="modal-header">
+          <span class="modal-title">物料清单</span>
+          <i class="el-icon-close close-btn" @click="closeMaterialDialog"></i>
+        </div>
+
+        <div class="modal-body">
+          <!-- 加载状态 -->
+          <div v-if="materialListLoading" class="loading-container">
+            <i class="el-icon-loading"></i>
+            <span>加载中...</span>
+          </div>
+
+          <!-- 物料表格 -->
+          <div v-else-if="materialList.length > 0" class="material-table">
+            <div class="table-header">
+              <div class="col-no">NO.</div>
+              <div class="col-material-code">物料编码</div>
+              <div class="col-required-qty">需求数量</div>
+              <div class="col-inbound-qty">已入库数量</div>
+            </div>
+
+            <div class="table-body">
+              <div
+                v-for="(item, index) in materialList"
+                :key="index"
+                class="table-row"
+              >
+                <div class="col-no">{{ index + 1 }}</div>
+                <div class="col-material-code">{{ item.materialCode || item.partNo }}</div>
+                <div class="col-required-qty">{{ item.requiredQty || 0 }}</div>
+                <div class="col-inbound-qty">{{ item.inboundQty || 0 }}</div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 空数据状态 -->
+          <div v-else class="empty-material">
+            <i class="el-icon-document"></i>
+            <p>暂无物料数据</p>
+          </div>
+        </div>
+
+        <div class="modal-footer">
+          <button class="btn-close" @click="closeMaterialDialog">关闭</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { scanMaterialLabel, getRequestMaterials } from '@/api/production/production-inbound';
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      scanCode: '',
+      inboundInfo: {},
+      labelList: [],
+      inboundNo: '',
+      buNo: '',
+      showMaterialDialog: false,
+      materialList: [],
+      materialListLoading: false,
+      isRemoveMode: false // 默认为添加模式
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理扫描
+    handleScan() {
+      if (!this.scanCode.trim()) {
+        return;
+      }
+ 
+      if (this.isRemoveMode) {
+        this.removeLabelByCode(this.scanCode.trim());
+      } else {
+        this.validateAndAddLabel(this.scanCode.trim());
+      }
+      this.scanCode = '';
+    },
+
+    // 验证标签并添加到列表
+    validateAndAddLabel(labelCode) {
+      const params = {
+        labelCode: labelCode,
+        notifyNo: this.inboundNo,
+        site: this.$store.state.user.site,
+      };
+      
+      scanMaterialLabel(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          // 检查是否已经扫描过
+          const exists = this.labelList.find(item => item.labelCode === labelCode);
+          if (exists) {
+            this.$message.warning('该标签已扫描，请勿重复扫描');
+            return;
+          }
+
+          // 添加到列表
+          this.labelList.push({
+            id: Date.now(),
+            labelCode: labelCode,
+            partNo: data.labelInfo.partNo,
+            quantity: data.labelInfo.quantity,
+            unit: data.labelInfo.unit,
+            batchNo: data.labelInfo.batchNo
+          });
+
+          this.$message.success('操作成功');
+        } else {
+          this.$message.error(data.msg || '该标签与入库申请单不符，请检查');
+        }
+      }).catch(error => {
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 通过条码移除标签
+    removeLabelByCode(labelCode) {
+      const index = this.labelList.findIndex(item => item.labelCode === labelCode);
+      if (index !== -1) {
+        this.labelList.splice(index, 1);
+        this.$message.success('操作成功');
+      } else {
+        this.$message.warning('未找到该标签');
+      }
+    },
+
+    // 确认入库
+    confirmInbound() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('请先扫描标签');
+        return;
+      }
+
+      const params = {
+        site: this.inboundInfo.site,
+        inboundNo: this.inboundNo,
+        labels: this.labelList.map(label => ({
+          labelCode: label.labelCode,
+          quantity: label.quantity,
+          batchNo: label.batchNo,
+          partNo: label.partNo
+        }))
+      };
+
+      confirmProductionInbound(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.$message.success('操作成功');
+          this.$router.back();
+        } else {
+          this.$message.error(data.msg || '操作失败');
+        }
+      }).catch(error => {
+        console.error('入库确认失败:', error);
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 打印标签
+    printLabels() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('暂无标签可打印');
+        return;
+      }
+
+      this.$message.warning('打印功能开发中...');
+    },
+
+    // 取消入库
+    cancelInbound() {
+      if (this.labelList.length > 0) {
+        this.$confirm('取消后将清空已扫描的标签，确定取消吗？', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '继续操作',
+          type: 'warning'
+        }).then(() => {
+          this.$router.back();
+        }).catch(() => {
+          // 用户选择继续操作
+        });
+      } else {
+        this.$router.back();
+      }
+    },
+
+    // 显示物料清单弹窗
+    showMaterialListDialog() {
+      this.showMaterialDialog = true;
+      this.loadMaterialList();
+    },
+
+    // 加载物料清单
+    loadMaterialList() {
+      console.log('加载物料清单', this.inboundInfo, this.inboundNo);
+      
+      if (!this.$store.state.user.site || !this.inboundNo) {
+        this.$message.error('缺少必要参数，无法获取物料清单');
+        return;
+      }
+
+      this.materialListLoading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        inboundNo: this.inboundNo
+      };
+
+      getRequestMaterials(params).then(({ data }) => {      
+        this.materialListLoading = false;
+        if (data && data.code === 0) {
+          this.materialList = data.materials || [];
+        } else {
+          this.$message.error(data.msg || '获取物料清单失败');
+          this.materialList = [];
+        }
+      }).catch(error => {
+        this.materialListLoading = false;
+        this.$message.error('获取物料清单失败');
+        this.materialList = [];
+      });
+    },
+
+    // 关闭物料清单弹窗
+    closeMaterialDialog() {
+      this.showMaterialDialog = false;
+    },
+
+    // 加载入库申请单详情
+    loadInboundDetails() {
+      const params = {
+        inboundNo: this.inboundNo,
+        site: this.$store.state.user.site,
+      };
+      console.log('加载入库申请单详情参数:', params);
+      
+      /* getInboundDetails(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.inboundInfo = data.data;
+        } else {
+          this.$message.error(data.msg || '获取入库申请单详情失败');
+        }
+      }).catch(error => {
+        console.error('获取入库申请单详情失败:', error);
+        this.$message.error('获取入库申请单详情失败');
+      }); */
+    }
+  },
+
+  mounted() {
+    // 获取路由参数 
+    this.inboundNo = this.$route.params.inboundNo;
+    console.log("入库申请单号:", this.inboundNo);
+    
+    if (!this.inboundNo) {
+      this.$message.error('参数错误');
+      this.$router.back();
+      return;
+    }
+
+    // 聚焦扫描框
+    this.$nextTick(() => {
+      if (this.$refs.scanInput) {
+        this.$refs.scanInput.focus();
+      }
+    });
+
+    // 加载入库申请单详情
+    this.loadInboundDetails();
+  }
+};
+</script>
+
+<style scoped>
+/* 复用生产领料页面的样式，只修改必要的部分 */
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.search-container .el-input {
+  width: 240px;
+  margin-right: 12px;
+}
+
+/* 紧凑型输入框样式 */
+.compact-input ::v-deep .el-input__inner {
+  height: 36px;
+  padding: 0 12px 0 35px;
+  font-size: 14px;
+}
+
+.compact-input ::v-deep .el-input__prefix {
+  left: 10px;
+}
+
+.compact-input ::v-deep .el-input__suffix {
+  right: 30px;
+}
+
+/* 模式切换开关 */
+.mode-switch {
+  position: relative;
+  display: inline-block;
+}
+
+.custom-switch {
+  transform: scale(1.3);
+}
+/* 中间文字 */
+.switch-text {
+  position: absolute;
+  left: 25%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+.switch-text2 {
+  position: absolute;
+  left: 75%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+/* 调整 switch 尺寸以便容纳文字 */
+.custom-switch ::v-deep .el-switch__core {
+  width: 60px;
+  height: 28px;
+}
+
+/* 物料信息卡片 */
+.material-info-card {
+  background: white;
+  margin: 4px 16px;
+  padding: 6px 20px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  border: 1px solid #f0f0f0;
+}
+
+.card-title {
+  margin-bottom: 16px;
+}
+
+.title-label {
+  font-size: 11px;
+  color: #999;
+  display: block;
+  margin-bottom: 6px;
+  font-weight: normal;
+}
+
+.title-value {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.2;
+  margin-left: 20px;
+}
+
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #999;
+  margin-bottom: 6px;
+  font-weight: normal;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 区域标题 */
+.section-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  background: white;
+  margin: 0 16px;
+  margin-top: 4px;
+  border-radius: 8px 8px 0 0;
+  border-bottom: 2px solid #17B3A3;
+}
+
+.title-left {
+  display: flex;
+  align-items: center;
+}
+
+.title-left i {
+  color: #17B3A3;
+  font-size: 16px;
+  margin-right: 8px;
+}
+
+.title-left span {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.title-right {
+  display: flex;
+  align-items: center;
+}
+
+.material-list-link {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  text-decoration: underline;
+  transition: color 0.2s ease;
+}
+
+.material-list-link:hover {
+  color: #0d8f7f;
+}
+
+/* 标签列表 */
+.label-list {
+  background: white;
+  margin: 0 16px 12px;
+  border-radius: 0 0 8px 8px;
+  overflow: hidden;
+}
+
+.list-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 12px 8px;
+  border-bottom: 1px solid #e0e0e0;
+  font-size: 12px;
+  color: #666;
+  font-weight: 500;
+}
+
+.list-item {
+  display: flex;
+  padding: 12px 8px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+}
+
+.list-item:last-child {
+  border-bottom: none;
+}
+
+.col-no {
+  width: 20px;
+  text-align: center;
+}
+
+.col-label {
+  flex: 2;
+  text-align: center;
+}
+
+.col-part {
+  flex: 2;
+  text-align: center;
+}
+
+.col-unit {
+  width: 40px;
+  text-align: center;
+}
+
+.col-qty {
+  width: 60px;
+  text-align: center;
+}
+
+.empty-labels {
+  padding: 40px 20px;
+  text-align: center;
+  color: #999;
+}
+
+.empty-labels p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 底部操作按钮 */
+.bottom-actions {
+  display: flex;
+  padding: 16px;
+  gap: 20px;
+  background: white;
+  margin-top: auto;
+}
+
+.action-btn {
+  flex: 1;
+  padding: 12px;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+  border-radius: 20px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.action-btn:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+.action-btn:active {
+  transform: scale(0.98);
+}
+
+/* 物料清单弹窗样式 */
+.material-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.material-modal {
+  background: white;
+  border-radius: 12px;
+  width: 100%;
+  max-width: 800px;
+  max-height: 80vh;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.material-modal .modal-header {
+  background: #17B3A3;
+  color: white;
+  padding: 5px 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  min-height: 28px;
+}
+
+.close-btn {
+  font-size: 16px;
+  cursor: pointer;
+  color: white;
+  transition: color 0.2s ease;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.close-btn:hover {
+  color: #e0e0e0;
+}
+
+.material-modal .modal-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin: 0;
+  line-height: 1.2;
+}
+
+.material-modal .modal-body {
+  flex: 1;
+  overflow: auto;
+  padding: 0;
+}
+
+.material-table {
+  width: 100%;
+}
+
+.table-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 10px 6px;
+  border-bottom: 2px solid #17B3A3;
+  font-size: 12px;
+  color: #333;
+  font-weight: 600;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+.table-body {
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.table-row {
+  display: flex;
+  padding: 10px 6px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+  transition: background-color 0.2s ease;
+}
+
+.table-row:hover {
+  background-color: #f8f9fa;
+}
+
+.table-row:last-child {
+  border-bottom: none;
+}
+
+.material-table .col-no {
+  width: 25px;
+  text-align: center;
+  flex-shrink: 0;
+  font-size: 12px;
+}
+
+.material-table .col-material-code {
+  flex: 1.8;
+  text-align: center;
+  min-width: 100px;
+  font-size: 12px;
+  word-break: break-all;
+}
+
+.material-table .col-required-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-table .col-inbound-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-modal .modal-footer {
+  padding: 15px 20px;
+  display: flex;
+  justify-content: center;
+  border-top: 1px solid #f0f0f0;
+}
+
+.btn-close {
+  padding: 10px 20px;
+  border-radius: 6px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+}
+
+.btn-close:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+/* 加载状态样式 */
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #666;
+}
+
+.loading-container i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  color: #17B3A3;
+}
+
+.loading-container span {
+  font-size: 14px;
+}
+
+/* 空数据状态样式 */
+.empty-material {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-material i {
+  font-size: 48px;
+  margin-bottom: 16px;
+  color: #ddd;
+}
+
+.empty-material p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .material-info-card {
+    margin: 4px 12px;
+    padding: 6px 16px;
+  }
+
+  .section-title {
+    margin: 0 12px;
+    margin-top: 4px;
+  }
+
+  .label-list {
+    margin: 0 12px 8px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+
+  .list-header, .list-item {
+    font-size: 11px;
+  }
+
+  .col-label, .col-part {
+    flex: 1.5;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-issue/production.vue b/src/views/modules/production-issue/production.vue
index 26fb3fc..0d37328 100644
--- a/src/views/modules/production-issue/production.vue
+++ b/src/views/modules/production-issue/production.vue
@@ -5,9 +5,7 @@
         <i class="el-icon-arrow-left"></i>
         <span>生产领料</span>
       </div>
-      <div class="header-right" @click="$router.push({ path: '/' })">
-        首页
-      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">首页</div>
     </div>
 
     <!-- 功能菜单 -->
@@ -16,7 +14,7 @@
         class="menu-item"
         v-for="(btn, index) in buttons"
         :key="index"
-        :class="{ 'disabled': btn.disabled }"
+        :class="{ disabled: btn.disabled }"
         @click="handleButtonClick(btn)"
       >
         <div class="menu-icon" :class="btn.iconClass">
@@ -33,21 +31,33 @@ export default {
   data() {
     return {
       buttons: [
-        { icon: 'scan', label: '直接领料', iconClass: 'purchase', to: 'productionPicking', disabled: true },
-        { icon: 'records', label: '申请单领料', iconClass: 'qualified', to: 'productionPicking', disabled: false },
-      ]
-    }
+        {
+          icon: "scan",
+          label: "直接领料",
+          iconClass: "purchase",
+          to: "productionPicking",
+          disabled: true,
+        },
+        {
+          icon: "records",
+          label: "申请单领料",
+          iconClass: "qualified",
+          to: "productionPicking",
+          disabled: false,
+        },
+      ],
+    };
   },
   methods: {
     handleButtonClick(btn) {
       if (btn.disabled) {
-        this.$message.warning('正在开发中，敬请期待...');
+        this.$message.warning("正在开发中，敬请期待...");
       } else {
         this.$router.push(btn.to);
       }
-    }
-  }
-}
+    },
+  },
+};
 </script>
 
 <style>
@@ -62,7 +72,7 @@ export default {
   justify-content: space-between;
   align-items: center;
   padding: 8px 16px;
-  background: #17B3A3;
+  background: #17b3a3;
   color: white;
   height: 40px;
   min-height: 40px;
@@ -118,7 +128,7 @@ export default {
 }
 
 .menu-item.disabled::after {
-  content: '开发中';
+  content: "开发中";
   position: absolute;
   top: 8px;
   right: 8px;
diff --git a/src/views/modules/production-issue/pick.vue b/src/views/modules/production-return/pick.vue
similarity index 100%
rename from src/views/modules/production-issue/pick.vue
rename to src/views/modules/production-return/pick.vue
diff --git a/src/views/modules/production-return/production.vue b/src/views/modules/production-return/production.vue
new file mode 100644
index 0000000..7ce0168
--- /dev/null
+++ b/src/views/modules/production-return/production.vue
@@ -0,0 +1,169 @@
+<template>
+  <div class="pda-container">
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产退仓</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">首页</div>
+    </div>
+
+    <!-- 功能菜单 -->
+    <div class="menu-grid">
+      <div
+        class="menu-item"
+        v-for="(btn, index) in buttons"
+        :key="index"
+        :class="{ 'disabled': btn.disabled }"
+        @click="handleButtonClick(btn)"
+      >
+        <div class="menu-icon" :class="btn.iconClass">
+          <van-icon :name="btn.icon" size="24" />
+        </div>
+        <div class="menu-text">{{ btn.label }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      buttons: [
+        { icon: 'scan', label: '直接退料', iconClass: 'direct', to: 'productionReturnPicking', disabled: false },
+        { icon: 'records', label: '申请单退料', iconClass: 'request', to: 'productionReturnPicking', disabled: false },
+        { icon: 'logistics', label: '移库退料', iconClass: 'move', to: 'productionReturnPicking', disabled: true },
+        { icon: 'revoke', label: '退料撤销', iconClass: 'cancel', to: 'productionReturnPicking', disabled: true },
+      ]
+    }
+  },
+  methods: {
+    handleButtonClick(btn) {
+      if (btn.disabled) {
+        this.$message.warning('正在开发中，敬请期待...');
+      } else {
+        this.$router.push(btn.to);
+      }
+    }
+  }
+}
+</script>
+
+<style>
+:root {
+  --columns: 3;
+  --button-size: calc(100vw / var(--columns) - 20px);
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+  max-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.menu-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 15px;
+  padding: 20px;
+  justify-content: center;
+  align-content: center;
+  width: 100%;
+}
+
+.menu-item {
+  background: white;
+  border-radius: 12px;
+  padding: 12px 6px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: transform 0.2s;
+  cursor: pointer;
+}
+
+.menu-item:active {
+  transform: scale(0.95);
+}
+
+.menu-item.disabled {
+  opacity: 0.6;
+  position: relative;
+}
+
+.menu-item.disabled::after {
+  content: '开发中';
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  background: #ff9500;
+  color: white;
+  font-size: 8px;
+  padding: 2px 4px;
+  border-radius: 8px;
+  font-weight: bold;
+}
+
+.menu-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 6px;
+  color: white;
+}
+
+.menu-icon.direct {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.request {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.move {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.cancel {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-text {
+  font-size: 10px;
+  color: #333;
+  font-weight: bold;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-issue/productionReturnPDA.vue b/src/views/modules/production-return/productionReturnPDA.vue
similarity index 100%
rename from src/views/modules/production-issue/productionReturnPDA.vue
rename to src/views/modules/production-return/productionReturnPDA.vue
diff --git a/src/views/modules/production-return/productionReturnPicking.vue b/src/views/modules/production-return/productionReturnPicking.vue
new file mode 100644
index 0000000..5f4f878
--- /dev/null
+++ b/src/views/modules/production-return/productionReturnPicking.vue
@@ -0,0 +1,440 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产退仓</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input  clearable
+                 v-model="searchCode"
+                 placeholder="请扫描工单号或退料申请单号"
+                 prefix-icon="el-icon-search"
+                 @keyup.enter.native="handleSearch"
+                 ref="searchInput"
+      />
+    </div>
+
+    <!-- 退料单列表 -->
+    <div class="content-area">
+      <div
+        v-for="(item, index) in returnList"
+        :key="index"
+        class="return-card"
+        @click="goToReturnPage(item)"
+      >
+        <div class="card-title">
+          <span class="title-label">{{ item.type === 'workOrder' ? '工单号' : '退料申请单号' }}</span>
+          <span class="title-value">{{ item.orderNo }}</span>
+        </div>
+
+        <div class="card-details">
+          <div class="detail-item">
+            <div class="detail-label">{{ item.type === 'workOrder' ? '产品编码' : '关联工单' }}</div>
+            <div class="detail-value">{{ item.relatedNo }}</div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">退料物料</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.returnedMaterials }}</span><span class="total">{{ item.totalMaterials }}</span>
+            </div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">退料数量</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.returnedQty }}</span><span class="total">{{ item.totalQty }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="returnList.length === 0 && !loading" class="empty-state">
+        <i class="el-icon-box"></i>
+        <p>暂无待退料订单</p>
+      </div>
+
+      <!-- 加载状态 -->
+      <div v-if="loading" class="loading-state">
+        <i class="el-icon-loading"></i>
+        <p>加载中...</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getWorkOrderMaterials, getReturnRequestMaterials } from '@/api/production/production-return'
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      searchCode: '',
+      returnList: [],
+      loading: false
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理搜索
+    handleSearch() {
+      if (this.searchCode.trim()) {
+        this.searchReturnList(this.searchCode.trim());
+      } else {
+        this.loadReturnList();
+      }
+    },
+
+    // 加载生产退料单列表
+    loadReturnList() {
+      this.loading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        status: '待退料',
+      }
+      console.log('params', params);
+      
+      // 模拟获取退料数据
+      this.simulateReturnList(params).then((data) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          this.returnList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '获取数据失败');
+        }
+      }).catch(() => {
+        this.loading = false;
+        this.$message.error('获取数据失败');
+      });
+    },
+
+    // 搜索特定退料单
+    searchReturnList(searchCode) {
+      this.loading = true;
+      const params = {
+        orderNo: searchCode,
+        site: this.$store.state.user.site,
+        status: '待退料'
+      };
+
+      this.simulateReturnList(params).then((data) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          if (data.list.length === 0) {
+            this.$message.warning('未找到匹配的退料订单');
+          }
+          this.returnList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '查询失败');
+        }
+      }).catch(() => {
+        this.loading = false;
+        this.$message.error('查询失败');
+      });
+    },
+
+    // 模拟退料列表API
+    simulateReturnList(params) {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          const mockData = [
+            {
+              orderNo: 'WO202401001',
+              type: 'workOrder',
+              relatedNo: 'PROD001',
+              returnedMaterials: 2,
+              totalMaterials: 5,
+              returnedQty: 150,
+              totalQty: 500,
+              status: '待退料'
+            },
+            {
+              orderNo: 'RT202401001',
+              type: 'returnRequest',
+              relatedNo: 'WO202401002',
+              returnedMaterials: 0,
+              totalMaterials: 3,
+              returnedQty: 0,
+              totalQty: 200,
+              status: '待退料'
+            },
+            {
+              orderNo: 'WO202401003',
+              type: 'workOrder',
+              relatedNo: 'PROD003',
+              returnedMaterials: 1,
+              totalMaterials: 4,
+              returnedQty: 80,
+              totalQty: 300,
+              status: '待退料'
+            }
+          ];
+
+          // 如果有搜索条件，过滤数据
+          let filteredData = mockData;
+          if (params.orderNo) {
+            filteredData = mockData.filter(item => 
+              item.orderNo.includes(params.orderNo) || 
+              item.relatedNo.includes(params.orderNo)
+            );
+          }
+
+          resolve({
+            code: 0,
+            list: filteredData,
+            msg: '成功'
+          });
+        }, 500);
+      });
+    },
+
+    // 跳转到退料页面
+    goToReturnPage(item) {
+      this.$router.push({
+        name: 'productionReturnPickingDetail',
+        params: {
+          orderNo: item.orderNo,
+          orderType: item.type
+        }
+      });
+    }
+  },
+
+  mounted() {
+    // 聚焦搜索框
+    this.$nextTick(() => {
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.focus();
+      }
+    });
+
+    // 加载数据
+    this.loadReturnList();
+  }
+};
+</script>
+
+<style scoped>
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+}
+
+/* 内容区域 */
+.content-area {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px 16px;
+}
+
+/* 退料卡片 */
+.return-card {
+  background: white;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 16px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s ease;
+  border-left: 4px solid #17B3A3;
+}
+
+.return-card:hover {
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  transform: translateY(-1px);
+}
+
+.return-card:active {
+  transform: translateY(0);
+}
+
+/* 卡片标题 */
+.card-title {
+  margin-bottom: 12px;
+}
+
+.title-label {
+  font-size: 12px;
+  color: #666;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.title-value {
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+  margin-left: 20px;
+}
+
+/* 卡片详情 */
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #666;
+  margin-bottom: 4px;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 空状态 */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-state i {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.empty-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 加载状态 */
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #17B3A3;
+}
+
+.loading-state i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.loading-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .content-area {
+    padding: 8px 12px;
+  }
+
+  .return-card {
+    padding: 12px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/production-return/productionReturnPickingDetail.vue b/src/views/modules/production-return/productionReturnPickingDetail.vue
new file mode 100644
index 0000000..bdcfb69
--- /dev/null
+++ b/src/views/modules/production-return/productionReturnPickingDetail.vue
@@ -0,0 +1,1128 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>生产退仓</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable class="compact-input"
+        v-model="scanCode"
+        placeholder="请扫描物料标签或批次号"
+        prefix-icon="el-icon-search"
+        @keyup.enter.native="handleScan"
+        ref="scanInput"
+      />
+      <div class="mode-switch">
+        <el-switch
+          class="custom-switch"
+          v-model="isRemoveMode"
+          active-color="#ff4949"
+          inactive-color="#13ce66">
+        </el-switch>
+        <span v-if="isRemoveMode" class="switch-text">{{ '移除' }}</span>
+        <span v-else class="switch-text2">{{ '添加' }}</span>
+      </div>
+    </div>
+
+    <!-- 订单信息卡片 -->
+    <div class="material-info-card" v-if="orderInfo.orderNo">
+      <div class="card-title">
+        <span class="title-label">{{ orderInfo.type === 'workOrder' ? '工单号' : '退料申请单号' }}</span>
+        <span class="title-value">{{ orderInfo.orderNo }}</span>
+      </div>
+
+      <div class="card-details">
+        <div class="detail-item">
+          <div class="detail-label">{{ orderInfo.type === 'workOrder' ? '产品编码' : '关联工单' }}</div>
+          <div class="detail-value">{{ orderInfo.relatedNo }}</div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">退料物料</div>
+          <div class="detail-value">
+            <span class="qualified">{{ orderInfo.returnedMaterials }}</span><span class="total">{{ orderInfo.totalMaterials }}</span>
+          </div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">退料数量</div>
+          <div class="detail-value">
+            <span class="qualified">{{ orderInfo.returnedQty }}</span><span class="total">{{ orderInfo.totalQty }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 退料信息确认标题 -->
+    <div class="section-title">
+      <div class="title-left">
+        <i class="el-icon-circle-check"></i>
+        <span>退料信息确认</span>
+      </div>
+      <div class="title-right">
+        <span class="material-list-link" @click="showMaterialListDialog">物料清单</span>
+      </div>
+    </div>
+
+    <!-- 退料标签列表 -->
+    <div class="label-list">
+      <div class="list-header">
+        <div class="col-no">NO.</div>
+        <div class="col-label">物料标签</div>
+        <div class="col-part">物料编码</div>
+        <div class="col-batch">批次号</div>
+        <div class="col-qty">退料数量</div>
+      </div>
+
+      <div
+        v-for="(label, index) in labelList"
+        :key="label.id"
+        class="list-item"
+      >
+        <div class="col-no">{{ labelList.length - index }}</div>
+        <div class="col-label">{{ label.labelCode }}</div>
+        <div class="col-part">{{ label.partNo }}</div>
+        <div class="col-batch">{{ label.batchNo }}</div>
+        <div class="col-qty">{{ label.quantity }}</div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="labelList.length === 0" class="empty-labels">
+        <p>暂无扫描标签</p>
+      </div>
+    </div>
+
+    <!-- 退料原因选择 -->
+    <div class="return-reason-section">
+      <div class="reason-title">退料原因</div>
+      <el-select v-model="returnReason" placeholder="请选择退料原因" style="width: 100%">
+        <el-option label="质量问题" value="QUALITY_ISSUE"></el-option>
+        <el-option label="超发退料" value="OVER_ISSUE"></el-option>
+        <el-option label="错误物料" value="WRONG_MATERIAL"></el-option>
+        <el-option label="生产变更" value="PRODUCTION_CHANGE"></el-option>
+        <el-option label="其他原因" value="OTHER"></el-option>
+      </el-select>
+    </div>
+
+    <!-- 底部操作按钮 -->
+    <div class="bottom-actions">
+      <button class="action-btn primary" @click="confirmReturn">
+        确定退料
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="printLabels">
+        打印
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="cancelReturn">
+        取消
+      </button>
+    </div>
+
+    <!-- 物料清单弹窗 -->
+    <div v-if="showMaterialDialog" class="material-overlay">
+      <div class="material-modal">
+        <div class="modal-header">
+          <span class="modal-title">物料清单</span>
+          <i class="el-icon-close close-btn" @click="closeMaterialDialog"></i>
+        </div>
+
+        <div class="modal-body">
+          <!-- 加载状态 -->
+          <div v-if="materialListLoading" class="loading-container">
+            <i class="el-icon-loading"></i>
+            <span>加载中...</span>
+          </div>
+
+          <!-- 物料表格 -->
+          <div v-else-if="materialList.length > 0" class="material-table">
+            <div class="table-header">
+              <div class="col-no">NO.</div>
+              <div class="col-material-code">物料编码</div>
+              <div class="col-returnable-qty">可退数量</div>
+              <div class="col-returned-qty">已退数量</div>
+            </div>
+
+            <div class="table-body">
+              <div
+                v-for="(item, index) in materialList"
+                :key="index"
+                class="table-row"
+              >
+                <div class="col-no">{{ index + 1 }}</div>
+                <div class="col-material-code">{{ item.materialCode || item.partNo }}</div>
+                <div class="col-returnable-qty">{{ item.returnableQty || 0 }}</div>
+                <div class="col-returned-qty">{{ item.returnedQty || 0 }}</div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 空数据状态 -->
+          <div v-else class="empty-material">
+            <i class="el-icon-document"></i>
+            <p>暂无物料数据</p>
+          </div>
+        </div>
+
+        <div class="modal-footer">
+          <button class="btn-close" @click="closeMaterialDialog">关闭</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getWorkOrderMaterials, parseMaterialLabel, directReturn } from '@/api/production/production-return';
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      scanCode: '',
+      orderInfo: {},
+      labelList: [],
+      orderNo: '',
+      orderType: '',
+      showMaterialDialog: false,
+      materialList: [],
+      materialListLoading: false,
+      isRemoveMode: false, // 默认为添加模式
+      returnReason: ''
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理扫描
+    handleScan() {
+      if (!this.scanCode.trim()) {
+        return;
+      }
+ 
+      if (this.isRemoveMode) {
+        this.removeLabelByCode(this.scanCode.trim());
+      } else {
+        this.validateAndAddLabel(this.scanCode.trim());
+      }
+      this.scanCode = '';
+    },
+
+    // 验证标签并添加到列表（保留生产退仓功能）
+    validateAndAddLabel(labelCode) {
+      const params = {
+        labelCode: labelCode,
+        orderNo: this.orderNo,
+        orderType: this.orderType,
+        site: this.$store.state.user.site,
+      };
+      
+      // 模拟生产退料标签验证
+      this.simulateReturnLabelScan(params).then((result) => {
+        if (result.success) {
+          // 检查是否已经扫描过
+          const exists = this.labelList.find(item => item.labelCode === labelCode);
+          if (exists) {
+            this.$message.warning('该标签已扫描，请勿重复扫描');
+            return;
+          }
+
+          // 添加到列表
+          this.labelList.push({
+            id: Date.now(),
+            labelCode: labelCode,
+            partNo: result.data.partNo,
+            quantity: result.data.quantity,
+            batchNo: result.data.batchNo,
+            returnReason: result.data.returnReason
+          });
+
+          this.$message.success('操作成功');
+        } else {
+          this.$message.error(result.message || '该标签不符合退料要求，请检查');
+        }
+      }).catch(() => {
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 模拟生产退料标签扫描API
+    simulateReturnLabelScan() {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          // 模拟成功响应
+          resolve({
+            success: true,
+            data: {
+              partNo: 'MAT' + Math.floor(Math.random() * 1000),
+              quantity: Math.floor(Math.random() * 50) + 1,
+              batchNo: 'BATCH' + Math.floor(Math.random() * 100),
+              returnReason: 'QUALITY_ISSUE'
+            }
+          });
+        }, 500);
+      });
+    },
+
+    // 通过条码移除标签
+    removeLabelByCode(labelCode) {
+      const index = this.labelList.findIndex(item => item.labelCode === labelCode);
+      if (index !== -1) {
+        this.labelList.splice(index, 1);
+        this.$message.success('操作成功');
+      } else {
+        this.$message.warning('未找到该标签');
+      }
+    },
+
+    // 确认生产退料
+    confirmReturn() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('请先扫描退料标签');
+        return;
+      }
+
+      if (!this.returnReason) {
+        this.$message.warning('请选择退料原因');
+        return;
+      }
+
+      const returnParams = {
+        site: this.orderInfo.site,
+        orderNo: this.orderNo,
+        orderType: this.orderType,
+        returnReason: this.returnReason,
+        labels: this.labelList.map(label => ({
+          labelCode: label.labelCode,
+          quantity: label.quantity,
+          batchNo: label.batchNo,
+          partNo: label.partNo
+        }))
+      };
+
+      // 模拟生产退料确认API
+      this.simulateReturnConfirm(returnParams).then((result) => {
+        if (result.success) {
+          this.$message.success('生产退料成功');
+          this.$router.back();
+        } else {
+          this.$message.error(result.message || '操作失败');
+        }
+      }).catch(() => {
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 模拟生产退料确认API
+    simulateReturnConfirm() {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          resolve({
+            success: true,
+            message: '生产退料成功'
+          });
+        }, 1000);
+      });
+    },
+
+    // 打印标签
+    printLabels() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('暂无标签可打印');
+        return;
+      }
+
+      this.$message.warning('打印功能开发中...');
+    },
+
+    // 取消退料
+    cancelReturn() {
+      if (this.labelList.length > 0) {
+        this.$confirm('取消后将清空已扫描的标签，确定取消吗？', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '继续操作',
+          type: 'warning'
+        }).then(() => {
+          this.$router.back();
+        }).catch(() => {
+          // 用户选择继续操作
+        });
+      } else {
+        this.$router.back();
+      }
+    },
+
+    // 显示物料清单弹窗
+    showMaterialListDialog() {
+      this.showMaterialDialog = true;
+      this.loadMaterialList();
+    },
+
+    // 加载物料清单
+    loadMaterialList() {
+      console.log('加载退料物料清单', this.orderInfo, this.orderNo);
+      
+      if (!this.$store.state.user.site || !this.orderNo) {
+        this.$message.error('缺少必要参数，无法获取物料清单');
+        return;
+      }
+
+      this.materialListLoading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        orderNo: this.orderNo,
+        orderType: this.orderType
+      };
+
+      // 模拟获取物料清单
+      this.simulateMaterialList(params).then((data) => {      
+        this.materialListLoading = false;
+        if (data && data.code === 0) {
+          this.materialList = data.materials || [];
+        } else {
+          this.$message.error(data.msg || '获取物料清单失败');
+          this.materialList = [];
+        }
+      }).catch(() => {
+        this.materialListLoading = false;
+        this.$message.error('获取物料清单失败');
+        this.materialList = [];
+      });
+    },
+
+    // 模拟物料清单API
+    simulateMaterialList() {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          const mockMaterials = [
+            {
+              materialCode: 'MAT001',
+              partNo: 'MAT001',
+              returnableQty: 100,
+              returnedQty: 20
+            },
+            {
+              materialCode: 'MAT002',
+              partNo: 'MAT002',
+              returnableQty: 200,
+              returnedQty: 50
+            },
+            {
+              materialCode: 'MAT003',
+              partNo: 'MAT003',
+              returnableQty: 150,
+              returnedQty: 0
+            }
+          ];
+
+          resolve({
+            code: 0,
+            materials: mockMaterials
+          });
+        }, 500);
+      });
+    },
+
+    // 关闭物料清单弹窗
+    closeMaterialDialog() {
+      this.showMaterialDialog = false;
+    },
+
+    // 加载订单详情
+    loadOrderDetails() {
+      const params = {
+        orderNo: this.orderNo,
+        orderType: this.orderType,
+        site: this.$store.state.user.site,
+      };
+      console.log('加载订单详情参数:', params);
+      
+      // 模拟获取订单详情
+      this.simulateOrderDetails(params).then((data) => {
+        if (data && data.code === 0) {
+          this.orderInfo = data.data;
+        } else {
+          this.$message.error(data.msg || '获取订单详情失败');
+        }
+      }).catch(() => {
+        this.$message.error('获取订单详情失败');
+      });
+    },
+
+    // 模拟订单详情API
+    simulateOrderDetails() {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          resolve({
+            code: 0,
+            data: {
+              orderNo: this.orderNo,
+              type: this.orderType,
+              relatedNo: this.orderType === 'workOrder' ? 'PROD001' : 'WO202401001',
+              returnedMaterials: 2,
+              totalMaterials: 5,
+              returnedQty: 150,
+              totalQty: 500,
+              site: this.$store.state.user.site
+            }
+          });
+        }, 500);
+      });
+    }
+  },
+
+  mounted() {
+    // 获取路由参数 
+    this.orderNo = this.$route.params.orderNo;
+    this.orderType = this.$route.params.orderType || 'workOrder';
+    console.log("订单号:", this.orderNo, "订单类型:", this.orderType);
+    
+    if (!this.orderNo) {
+      this.$message.error('参数错误');
+      this.$router.back();
+      return;
+    }
+
+    // 聚焦扫描框
+    this.$nextTick(() => {
+      if (this.$refs.scanInput) {
+        this.$refs.scanInput.focus();
+      }
+    });
+
+    // 加载订单详情
+    this.loadOrderDetails();
+  }
+};
+</script>
+
+<style scoped>
+/* 复用生产领料页面的样式，只修改必要的部分 */
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.search-container .el-input {
+  width: 240px;
+  margin-right: 12px;
+}
+
+/* 紧凑型输入框样式 */
+.compact-input ::v-deep .el-input__inner {
+  height: 36px;
+  padding: 0 12px 0 35px;
+  font-size: 14px;
+}
+
+.compact-input ::v-deep .el-input__prefix {
+  left: 10px;
+}
+
+.compact-input ::v-deep .el-input__suffix {
+  right: 30px;
+}
+
+/* 模式切换开关 */
+.mode-switch {
+  position: relative;
+  display: inline-block;
+}
+
+.custom-switch {
+  transform: scale(1.3);
+}
+
+/* 中间文字 */
+.switch-text {
+  position: absolute;
+  left: 25%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+.switch-text2 {
+  position: absolute;
+  left: 75%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+/* 调整 switch 尺寸以便容纳文字 */
+.custom-switch ::v-deep .el-switch__core {
+  width: 60px;
+  height: 28px;
+}
+
+/* 物料信息卡片 */
+.material-info-card {
+  background: white;
+  margin: 4px 16px;
+  padding: 6px 20px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  border: 1px solid #f0f0f0;
+  border-left: 4px solid #17B3A3;
+}
+
+.card-title {
+  margin-bottom: 16px;
+}
+
+.title-label {
+  font-size: 11px;
+  color: #999;
+  display: block;
+  margin-bottom: 6px;
+  font-weight: normal;
+}
+
+.title-value {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.2;
+  margin-left: 20px;
+}
+
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #999;
+  margin-bottom: 6px;
+  font-weight: normal;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 区域标题 */
+.section-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  background: white;
+  margin: 0 16px;
+  margin-top: 4px;
+  border-radius: 8px 8px 0 0;
+  border-bottom: 2px solid #17B3A3;
+}
+
+.title-left {
+  display: flex;
+  align-items: center;
+}
+
+.title-left i {
+  color: #17B3A3;
+  font-size: 16px;
+  margin-right: 8px;
+}
+
+.title-left span {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.title-right {
+  display: flex;
+  align-items: center;
+}
+
+.material-list-link {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  text-decoration: underline;
+  transition: color 0.2s ease;
+}
+
+.material-list-link:hover {
+  color: #0d8f7f;
+}
+
+/* 标签列表 */
+.label-list {
+  background: white;
+  margin: 0 16px 12px;
+  border-radius: 0 0 8px 8px;
+  overflow: hidden;
+}
+
+.list-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 12px 8px;
+  border-bottom: 1px solid #e0e0e0;
+  font-size: 12px;
+  color: #666;
+  font-weight: 500;
+}
+
+.list-item {
+  display: flex;
+  padding: 12px 8px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+}
+
+.list-item:last-child {
+  border-bottom: none;
+}
+
+.col-no {
+  width: 20px;
+  text-align: center;
+}
+
+.col-label {
+  flex: 2;
+  text-align: center;
+}
+
+.col-part {
+  flex: 1.5;
+  text-align: center;
+}
+
+.col-batch {
+  flex: 1.5;
+  text-align: center;
+}
+
+.col-qty {
+  width: 60px;
+  text-align: center;
+}
+
+.empty-labels {
+  padding: 40px 20px;
+  text-align: center;
+  color: #999;
+}
+
+.empty-labels p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 退料原因选择 */
+.return-reason-section {
+  background: white;
+  margin: 0 16px 12px;
+  padding: 16px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.reason-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: #333;
+  margin-bottom: 8px;
+}
+
+/* 底部操作按钮 */
+.bottom-actions {
+  display: flex;
+  padding: 16px;
+  gap: 20px;
+  background: white;
+  margin-top: auto;
+}
+
+.action-btn {
+  flex: 1;
+  padding: 12px;
+  border-radius: 20px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.action-btn.primary {
+  border: 1px solid #17B3A3;
+  background: #17B3A3;
+  color: white;
+}
+
+.action-btn.primary:hover {
+  background: #13998c;
+  border-color: #13998c;
+}
+
+.action-btn.secondary {
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+}
+
+.action-btn.secondary:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+.action-btn:active {
+  transform: scale(0.98);
+}
+
+/* 物料清单弹窗样式 */
+.material-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.material-modal {
+  background: white;
+  border-radius: 12px;
+  width: 100%;
+  max-width: 800px;
+  max-height: 80vh;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.material-modal .modal-header {
+  background: #17B3A3;
+  color: white;
+  padding: 5px 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  min-height: 28px;
+}
+
+.close-btn {
+  font-size: 16px;
+  cursor: pointer;
+  color: white;
+  transition: color 0.2s ease;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.close-btn:hover {
+  color: #e0e0e0;
+}
+
+.material-modal .modal-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin: 0;
+  line-height: 1.2;
+}
+
+.material-modal .modal-body {
+  flex: 1;
+  overflow: auto;
+  padding: 0;
+}
+
+.material-table {
+  width: 100%;
+}
+
+.table-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 10px 6px;
+  border-bottom: 2px solid #17B3A3;
+  font-size: 12px;
+  color: #333;
+  font-weight: 600;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+.table-body {
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.table-row {
+  display: flex;
+  padding: 10px 6px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+  transition: background-color 0.2s ease;
+}
+
+.table-row:hover {
+  background-color: #f8f9fa;
+}
+
+.table-row:last-child {
+  border-bottom: none;
+}
+
+.material-table .col-no {
+  width: 25px;
+  text-align: center;
+  flex-shrink: 0;
+  font-size: 12px;
+}
+
+.material-table .col-material-code {
+  flex: 1.8;
+  text-align: center;
+  min-width: 100px;
+  font-size: 12px;
+  word-break: break-all;
+}
+
+.material-table .col-returnable-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-table .col-returned-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-modal .modal-footer {
+  padding: 15px 20px;
+  display: flex;
+  justify-content: center;
+  border-top: 1px solid #f0f0f0;
+}
+
+.btn-close {
+  padding: 10px 20px;
+  border-radius: 6px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+}
+
+.btn-close:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+/* 加载状态样式 */
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #666;
+}
+
+.loading-container i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  color: #17B3A3;
+}
+
+.loading-container span {
+  font-size: 14px;
+}
+
+/* 空数据状态样式 */
+.empty-material {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-material i {
+  font-size: 48px;
+  margin-bottom: 16px;
+  color: #ddd;
+}
+
+.empty-material p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .material-info-card {
+    margin: 4px 12px;
+    padding: 6px 16px;
+  }
+
+  .section-title {
+    margin: 0 12px;
+    margin-top: 4px;
+  }
+
+  .label-list {
+    margin: 0 12px 8px;
+  }
+
+  .return-reason-section {
+    margin: 0 12px 8px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+
+  .list-header, .list-item {
+    font-size: 11px;
+  }
+
+  .col-label, .col-part, .col-batch {
+    flex: 1.2;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/purchase-return/index.vue b/src/views/modules/purchase-return/index.vue
new file mode 100644
index 0000000..b0aa39c
--- /dev/null
+++ b/src/views/modules/purchase-return/index.vue
@@ -0,0 +1,165 @@
+<template>
+  <div class="pda-container">
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>采购退库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 功能菜单 -->
+    <div class="menu-grid">
+      <div
+        class="menu-item"
+        v-for="(btn, index) in buttons"
+        :key="index"
+        :class="{ 'disabled': btn.disabled }"
+        @click="handleButtonClick(btn)"
+      >
+        <div class="menu-icon" :class="btn.iconClass">
+          <van-icon :name="btn.icon" size="24" />
+        </div>
+        <div class="menu-text">{{ btn.label }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      buttons: [
+        { icon: 'scan', label: '直接退库', iconClass: 'purchase', to: 'purchaseReturnPicking', disabled: true },
+        { icon: 'records', label: '申请单退库', iconClass: 'qualified', to: 'purchaseReturnPicking', disabled: false },
+      ]
+    }
+  },
+  methods: {
+    handleButtonClick(btn) {
+      if (btn.disabled) {
+        this.$message.warning('正在开发中，敬请期待...');
+      } else {
+        this.$router.push(btn.to);
+      }
+    }
+  }
+}
+</script>
+
+<style>
+:root {
+  --columns: 3;
+  --button-size: calc(100vw / var(--columns) - 20px);
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+  max-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.menu-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 15px;
+  padding: 20px;
+  justify-content: center; /* 水平居中 */
+  align-content: center; /* 垂直居中 */
+  width: 100%; /* 确保占满容器宽度 */
+}
+
+.menu-item {
+  background: white;
+  border-radius: 12px;
+  padding: 12px 6px;
+  text-align: center;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: transform 0.2s;
+  cursor: pointer;
+}
+
+.menu-item:active {
+  transform: scale(0.95);
+}
+
+.menu-item.disabled {
+  opacity: 0.6;
+  position: relative;
+}
+
+.menu-item.disabled::after {
+  content: '开发中';
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  background: #ff9500;
+  color: white;
+  font-size: 8px;
+  padding: 2px 4px;
+  border-radius: 8px;
+  font-weight: bold;
+}
+
+.menu-icon {
+  width: 38px;
+  height: 38px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 0 auto 6px;
+  color: white;
+}
+
+.menu-icon.purchase {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.inspection {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-icon.qualified {
+  background: linear-gradient(135deg, #17b3a3 0%, #1dc5ef 100%);
+}
+
+.menu-text {
+  font-size: 10px;
+  color: #333;
+  font-weight: bold; /* 加粗字体 */
+  white-space: nowrap; /* 防止文字换行 */
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-top: 2px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/purchase-return/purchaseReturnPicking.vue b/src/views/modules/purchase-return/purchaseReturnPicking.vue
new file mode 100644
index 0000000..3da838e
--- /dev/null
+++ b/src/views/modules/purchase-return/purchaseReturnPicking.vue
@@ -0,0 +1,387 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>采购退库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable
+                v-model="searchCode"
+                placeholder="请扫描退库单或关联单号"
+                prefix-icon="el-icon-search"
+                @keyup.enter.native="handleSearch"
+                ref="searchInput"
+      />
+    </div>
+
+    <!-- 退库单列表 -->
+    <div class="content-area">
+      <div
+        v-for="(item, index) in returnList"
+        :key="index"
+        class="return-card"
+        @click="goToReturnPage(item)"
+      >
+        <div class="card-title">
+          <span class="title-label">退库单号</span>
+          <span class="title-value">{{ item.returnNo }}</span>
+        </div>
+
+        <div class="card-details">
+          <div class="detail-item">
+            <div class="detail-label">关联单号</div>
+            <div class="detail-value">{{ item.purchaseOrderNo }}</div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">标签张数</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.returnedLabels }}</span><span class="total">{{ item.totalLabels }}</span>
+            </div>
+          </div>
+          <div class="detail-item">
+            <div class="detail-label">物料总数</div>
+            <div class="detail-value">
+              <span class="qualified">{{ item.returnedQty }}</span><span class="total">{{ item.totalQty }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="returnList.length === 0 && !loading" class="empty-state">
+        <i class="el-icon-box"></i>
+        <p>暂无待退库申请单</p>
+      </div>
+
+      <!-- 加载状态 -->
+      <div v-if="loading" class="loading-state">
+        <i class="el-icon-loading"></i>
+        <p>加载中...</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getPurchaseReturnNotifyByNo,
+  getPurchaseReturnNotifyListByNo,
+} from '@/api/purchase/purchase-return'
+import { getCurrentWarehouse } from '@/utils'
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      searchCode: '',
+      returnList: [],
+      loading: false
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理搜索
+    handleSearch() {
+      if (this.searchCode.trim()) {
+        this.searchReturnList(this.searchCode.trim());
+      } else {
+        this.loadReturnList();
+      }
+    },
+
+    // 加载采购退库单列表
+    loadReturnList() {
+      this.loading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        status: '待退库',
+      }
+      console.log('params', params);
+      
+      getPurchaseReturnNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          this.returnList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '获取数据失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        console.error('获取采购退库单列表失败:', error);
+        this.$message.error('获取数据失败');
+      });
+    },
+
+    // 搜索特定退库单
+    searchReturnList(searchCode) {
+      this.loading = true;
+      const params = {
+        returnNo: searchCode,
+        site: this.$store.state.user.site,
+        status: 'RETURN'
+      };
+
+      getPurchaseReturnNotifyListByNo(params).then(({ data }) => {
+        this.loading = false;
+        if (data && data.code === 0) {
+          if (data.list.length === 0) {
+            this.$message.warning('未找到匹配的退库单');
+          }
+          this.returnList = data.list || [];
+        } else {
+          this.$message.error(data.msg || '查询失败');
+        }
+      }).catch(error => {
+        this.loading = false;
+        this.$message.error('查询失败');
+      });
+    },
+
+    // 跳转到退库页面
+    goToReturnPage(item) {
+      this.$router.push({
+        name: 'purchaseReturnPickingDetail',
+        params: {
+          returnNo: item.returnNo,
+        }
+      });
+    }
+  },
+
+  mounted() {
+    // 聚焦搜索框
+    this.$nextTick(() => {
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.focus();
+      }
+    });
+
+    // 加载数据
+    this.loadReturnList();
+  }
+};
+</script>
+
+<style scoped>
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+}
+
+/* 内容区域 */
+.content-area {
+  flex: 1;
+  overflow-y: auto;
+  padding: 12px 16px;
+}
+
+/* 退库卡片 */
+.return-card {
+  background: white;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  padding: 16px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.return-card:hover {
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+  transform: translateY(-1px);
+}
+
+.return-card:active {
+  transform: translateY(0);
+}
+
+/* 卡片标题 */
+.card-title {
+  margin-bottom: 12px;
+}
+
+.title-label {
+  font-size: 12px;
+  color: #666;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.title-value {
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+  margin-left: 20px;
+}
+
+/* 卡片详情 */
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #666;
+  margin-bottom: 4px;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 空状态 */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-state i {
+  font-size: 48px;
+  margin-bottom: 16px;
+}
+
+.empty-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 加载状态 */
+.loading-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #17B3A3;
+}
+
+.loading-state i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.loading-state p {
+  font-size: 14px;
+  margin: 0;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .content-area {
+    padding: 8px 12px;
+  }
+
+  .return-card {
+    padding: 12px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/modules/purchase-return/purchaseReturnPickingDetail.vue b/src/views/modules/purchase-return/purchaseReturnPickingDetail.vue
new file mode 100644
index 0000000..ca76122
--- /dev/null
+++ b/src/views/modules/purchase-return/purchaseReturnPickingDetail.vue
@@ -0,0 +1,982 @@
+<template>
+  <div class="pda-container">
+    <!-- 头部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>采购退库</span>
+      </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
+
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input clearable class="compact-input"
+        v-model="scanCode"
+        placeholder="请扫描标签条码"
+        prefix-icon="el-icon-search"
+        @keyup.enter.native="handleScan"
+        ref="scanInput"
+      />
+      <div class="mode-switch">
+        <el-switch
+          class="custom-switch"
+          v-model="isRemoveMode"
+          active-color="#ff4949"
+          inactive-color="#13ce66">
+        </el-switch>
+        <span v-if="isRemoveMode" class="switch-text">{{ '移除' }}</span>
+        <span v-else class="switch-text2">{{ '添加' }}</span>
+      </div>
+    </div>
+
+    <!-- 退库单信息卡片 -->
+    <div class="material-info-card" v-if="returnInfo.returnNo">
+      <div class="card-title">
+        <span class="title-label">退库单号</span>
+        <span class="title-value">{{ returnInfo.returnNo }}</span>
+      </div>
+
+      <div class="card-details">
+        <div class="detail-item">
+          <div class="detail-label">关联单号</div>
+          <div class="detail-value">{{ returnInfo.relatedNo }}</div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">标签张数</div>
+          <div class="detail-value">
+            <span class="qualified">{{ returnInfo.returnedLabels }}</span><span class="total">{{ returnInfo.totalLabels }}</span>
+          </div>
+        </div>
+        <div class="detail-item">
+          <div class="detail-label">物料总数</div>
+          <div class="detail-value">
+            <span class="qualified">{{ returnInfo.returnedQty }}</span><span class="total">{{ returnInfo.totalQty }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 退库信息确认标题 -->
+    <div class="section-title">
+      <div class="title-left">
+        <i class="el-icon-circle-check"></i>
+        <span>退库信息确认</span>
+      </div>
+      <div class="title-right">
+        <span class="material-list-link" @click="showMaterialListDialog">物料清单</span>
+      </div>
+    </div>
+
+    <!-- 标签列表 -->
+    <div class="label-list">
+      <div class="list-header">
+        <div class="col-no">NO.</div>
+        <div class="col-label">标签条码</div>
+        <div class="col-part">物料编码</div>
+        <div class="col-unit">单位</div>
+        <div class="col-qty">标签数量</div>
+      </div>
+
+      <div
+        v-for="(label, index) in labelList"
+        :key="label.id"
+        class="list-item"
+      >
+        <div class="col-no">{{ labelList.length - index }}</div>
+        <div class="col-label">{{ label.labelCode }}</div>
+        <div class="col-part">{{ label.partNo }}</div>
+        <div class="col-unit">{{ label.unit || '个' }}</div>
+        <div class="col-qty">{{ label.quantity }}</div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-if="labelList.length === 0" class="empty-labels">
+        <p>暂无扫描标签</p>
+      </div>
+    </div>
+
+    <!-- 底部操作按钮 -->
+    <div class="bottom-actions">
+      <button class="action-btn secondary" @click="confirmReturn">
+        确定
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="printLabels">
+        打印
+      </button>
+      <button class="action-btn secondary" style="margin-left: 10px;" @click="cancelReturn">
+        取消
+      </button>
+    </div>
+
+    <!-- 物料清单弹窗 -->
+    <div v-if="showMaterialDialog" class="material-overlay">
+      <div class="material-modal">
+        <div class="modal-header">
+          <span class="modal-title">物料清单</span>
+          <i class="el-icon-close close-btn" @click="closeMaterialDialog"></i>
+        </div>
+
+        <div class="modal-body">
+          <!-- 加载状态 -->
+          <div v-if="materialListLoading" class="loading-container">
+            <i class="el-icon-loading"></i>
+            <span>加载中...</span>
+          </div>
+
+          <!-- 物料表格 -->
+          <div v-else-if="materialList.length > 0" class="material-table">
+            <div class="table-header">
+              <div class="col-no">NO.</div>
+              <div class="col-material-code">物料编码</div>
+              <div class="col-required-qty">需退数量</div>
+              <div class="col-returned-qty">已退数量</div>
+            </div>
+
+            <div class="table-body">
+              <div
+                v-for="(item, index) in materialList"
+                :key="index"
+                class="table-row"
+              >
+                <div class="col-no">{{ index + 1 }}</div>
+                <div class="col-material-code">{{ item.materialCode || item.partNo }}</div>
+                <div class="col-required-qty">{{ item.requiredQty || 0 }}</div>
+                <div class="col-returned-qty">{{ item.returnedQty || 0 }}</div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 空数据状态 -->
+          <div v-else class="empty-material">
+            <i class="el-icon-document"></i>
+            <p>暂无物料数据</p>
+          </div>
+        </div>
+
+        <div class="modal-footer">
+          <button class="btn-close" @click="closeMaterialDialog">关闭</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { scanMaterialLabel, getReturnMaterials, confirmPurchaseReturn } from '@/api/purchase/purchase-return';
+import moment from 'moment';
+
+export default {
+  data() {
+    return {
+      scanCode: '',
+      returnInfo: {},
+      labelList: [],
+      returnNo: '',
+      buNo: '',
+      showMaterialDialog: false,
+      materialList: [],
+      materialListLoading: false,
+      isRemoveMode: false // 默认为添加模式
+    };
+  },
+  methods: {
+    formatDate(date) {
+      return date ? moment(date).format('YYYY-MM-DD') : '';
+    },
+    // 处理扫描
+    handleScan() {
+      if (!this.scanCode.trim()) {
+        return;
+      }
+ 
+      if (this.isRemoveMode) {
+        this.removeLabelByCode(this.scanCode.trim());
+      } else {
+        this.validateAndAddLabel(this.scanCode.trim());
+      }
+      this.scanCode = '';
+    },
+
+    // 验证标签并添加到列表
+    validateAndAddLabel(labelCode) {
+      const params = {
+        labelCode: labelCode,
+        returnNo: this.returnNo,
+        site: this.$store.state.user.site,
+      };
+      
+      scanMaterialLabel(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          // 检查是否已经扫描过
+          const exists = this.labelList.find(item => item.labelCode === labelCode);
+          if (exists) {
+            this.$message.warning('该标签已扫描，请勿重复扫描');
+            return;
+          }
+
+          // 添加到列表
+          this.labelList.push({
+            id: Date.now(),
+            labelCode: labelCode,
+            partNo: data.labelInfo.partNo,
+            quantity: data.labelInfo.quantity,
+            unit: data.labelInfo.unit,
+            batchNo: data.labelInfo.batchNo
+          });
+
+          this.$message.success('操作成功');
+        } else {
+          this.$message.error(data.msg || '该标签与退库单不符，请检查');
+        }
+      }).catch(error => {
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 通过条码移除标签
+    removeLabelByCode(labelCode) {
+      const index = this.labelList.findIndex(item => item.labelCode === labelCode);
+      if (index !== -1) {
+        this.labelList.splice(index, 1);
+        this.$message.success('操作成功');
+      } else {
+        this.$message.warning('未找到该标签');
+      }
+    },
+
+    // 确认退库
+    confirmReturn() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('请先扫描标签');
+        return;
+      }
+
+      const params = {
+        site: this.returnInfo.site,
+        returnNo: this.returnNo,
+        labels: this.labelList.map(label => ({
+          labelCode: label.labelCode,
+          quantity: label.quantity,
+          batchNo: label.batchNo,
+          partNo: label.partNo
+        }))
+      };
+
+      confirmPurchaseReturn(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.$message.success('操作成功');
+          this.$router.back();
+        } else {
+          this.$message.error(data.msg || '操作失败');
+        }
+      }).catch(error => {
+        console.error('退库确认失败:', error);
+        this.$message.error('操作失败');
+      });
+    },
+
+    // 打印标签
+    printLabels() {
+      if (this.labelList.length === 0) {
+        this.$message.warning('暂无标签可打印');
+        return;
+      }
+
+      this.$message.warning('打印功能开发中...');
+    },
+
+    // 取消退库
+    cancelReturn() {
+      if (this.labelList.length > 0) {
+        this.$confirm('取消后将清空已扫描的标签，确定取消吗？', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '继续操作',
+          type: 'warning'
+        }).then(() => {
+          this.$router.back();
+        }).catch(() => {
+          // 用户选择继续操作
+        });
+      } else {
+        this.$router.back();
+      }
+    },
+
+    // 显示物料清单弹窗
+    showMaterialListDialog() {
+      this.showMaterialDialog = true;
+      this.loadMaterialList();
+    },
+
+    // 加载物料清单
+    loadMaterialList() {
+      console.log('加载物料清单', this.returnInfo, this.returnNo);
+      
+      if (!this.$store.state.user.site || !this.returnNo) {
+        this.$message.error('缺少必要参数，无法获取物料清单');
+        return;
+      }
+
+      this.materialListLoading = true;
+      const params = {
+        site: this.$store.state.user.site,
+        returnNo: this.returnNo
+      };
+
+      getReturnMaterials(params).then(({ data }) => {      
+        this.materialListLoading = false;
+        if (data && data.code === 0) {
+          this.materialList = data.materials || [];
+        } else {
+          this.$message.error(data.msg || '获取物料清单失败');
+          this.materialList = [];
+        }
+      }).catch(error => {
+        this.materialListLoading = false;
+        this.$message.error('获取物料清单失败');
+        this.materialList = [];
+      });
+    },
+
+    // 关闭物料清单弹窗
+    closeMaterialDialog() {
+      this.showMaterialDialog = false;
+    },
+
+    // 加载退库单详情
+    loadReturnDetails() {
+      const params = {
+        returnNo: this.returnNo,
+        site: this.$store.state.user.site,
+      };
+      console.log('加载退库单详情参数:', params);
+      
+      /* getReturnDetails(params).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.returnInfo = data.data;
+        } else {
+          this.$message.error(data.msg || '获取退库单详情失败');
+        }
+      }).catch(error => {
+        console.error('获取退库单详情失败:', error);
+        this.$message.error('获取退库单详情失败');
+      }); */
+    }
+  },
+
+  mounted() {
+    // 获取路由参数 
+    this.returnNo = this.$route.params.returnNo;
+    console.log("退库单号:", this.returnNo);
+    
+    if (!this.returnNo) {
+      this.$message.error('参数错误');
+      this.$router.back();
+      return;
+    }
+
+    // 聚焦扫描框
+    this.$nextTick(() => {
+      if (this.$refs.scanInput) {
+        this.$refs.scanInput.focus();
+      }
+    });
+
+    // 加载退库单详情
+    this.loadReturnDetails();
+  }
+};
+</script>
+
+<style scoped>
+/* 复用生产领料页面的样式，只修改必要的部分 */
+.pda-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #f5f5f5;
+}
+
+/* 头部栏 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.header-left i {
+  margin-right: 8px;
+  font-size: 18px;
+}
+
+.header-right {
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+/* 搜索容器 */
+.search-container {
+  padding: 12px 16px;
+  background: white;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.search-container .el-input {
+  width: 240px;
+  margin-right: 12px;
+}
+
+/* 紧凑型输入框样式 */
+.compact-input ::v-deep .el-input__inner {
+  height: 36px;
+  padding: 0 12px 0 35px;
+  font-size: 14px;
+}
+
+.compact-input ::v-deep .el-input__prefix {
+  left: 10px;
+}
+
+.compact-input ::v-deep .el-input__suffix {
+  right: 30px;
+}
+
+/* 模式切换开关 */
+.mode-switch {
+  position: relative;
+  display: inline-block;
+}
+
+.custom-switch {
+  transform: scale(1.3);
+}
+/* 中间文字 */
+.switch-text {
+  position: absolute;
+  left: 25%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+.switch-text2 {
+  position: absolute;
+  left: 75%;
+  transform: translateX(-50%);
+  top: 50%;
+  transform: translateY(-50%) translateX(-50%);
+  font-size: 12px;
+  font-weight: 500;
+  color: #606266;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: 1;
+  top: 53%;
+  transform: translate(-50%, -50%);
+  font-size: 12px;
+  font-weight: bold;
+  color: white;
+  pointer-events: none;
+  z-index: 2;
+}
+
+/* 调整 switch 尺寸以便容纳文字 */
+.custom-switch ::v-deep .el-switch__core {
+  width: 60px;
+  height: 28px;
+}
+
+/* 物料信息卡片 */
+.material-info-card {
+  background: white;
+  margin: 4px 16px;
+  padding: 6px 20px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  border: 1px solid #f0f0f0;
+}
+
+.card-title {
+  margin-bottom: 16px;
+}
+
+.title-label {
+  font-size: 11px;
+  color: #999;
+  display: block;
+  margin-bottom: 6px;
+  font-weight: normal;
+}
+
+.title-value {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  line-height: 1.2;
+  margin-left: 20px;
+}
+
+.card-details {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  gap: 4px;
+}
+
+.detail-item {
+  flex: 1;
+  text-align: center;
+  min-width: 60px;
+  max-width: 60px;
+}
+
+.detail-label {
+  font-size: 11px;
+  color: #999;
+  margin-bottom: 6px;
+  font-weight: normal;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value {
+  font-size: 13px;
+  color: #333;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-left: -12px;
+}
+
+.detail-value .qualified {
+  color: #17B3A3;
+  font-weight: 500;
+}
+
+.detail-value .total {
+  color: #333;
+  font-weight: 500;
+}
+
+.detail-value .total::before {
+  content: '/';
+  color: #333;
+}
+
+/* 区域标题 */
+.section-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  background: white;
+  margin: 0 16px;
+  margin-top: 4px;
+  border-radius: 8px 8px 0 0;
+  border-bottom: 2px solid #17B3A3;
+}
+
+.title-left {
+  display: flex;
+  align-items: center;
+}
+
+.title-left i {
+  color: #17B3A3;
+  font-size: 16px;
+  margin-right: 8px;
+}
+
+.title-left span {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.title-right {
+  display: flex;
+  align-items: center;
+}
+
+.material-list-link {
+  color: #17B3A3;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  text-decoration: underline;
+  transition: color 0.2s ease;
+}
+
+.material-list-link:hover {
+  color: #0d8f7f;
+}
+
+/* 标签列表 */
+.label-list {
+  background: white;
+  margin: 0 16px 12px;
+  border-radius: 0 0 8px 8px;
+  overflow: hidden;
+}
+
+.list-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 12px 8px;
+  border-bottom: 1px solid #e0e0e0;
+  font-size: 12px;
+  color: #666;
+  font-weight: 500;
+}
+
+.list-item {
+  display: flex;
+  padding: 12px 8px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+}
+
+.list-item:last-child {
+  border-bottom: none;
+}
+
+.col-no {
+  width: 20px;
+  text-align: center;
+}
+
+.col-label {
+  flex: 2;
+  text-align: center;
+}
+
+.col-part {
+  flex: 2;
+  text-align: center;
+}
+
+.col-unit {
+  width: 40px;
+  text-align: center;
+}
+
+.col-qty {
+  width: 60px;
+  text-align: center;
+}
+
+.empty-labels {
+  padding: 40px 20px;
+  text-align: center;
+  color: #999;
+}
+
+.empty-labels p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 底部操作按钮 */
+.bottom-actions {
+  display: flex;
+  padding: 16px;
+  gap: 20px;
+  background: white;
+  margin-top: auto;
+}
+
+.action-btn {
+  flex: 1;
+  padding: 12px;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+  border-radius: 20px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.action-btn:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+.action-btn:active {
+  transform: scale(0.98);
+}
+
+/* 物料清单弹窗样式 */
+.material-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.material-modal {
+  background: white;
+  border-radius: 12px;
+  width: 100%;
+  max-width: 800px;
+  max-height: 80vh;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.material-modal .modal-header {
+  background: #17B3A3;
+  color: white;
+  padding: 5px 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  min-height: 28px;
+}
+
+.close-btn {
+  font-size: 16px;
+  cursor: pointer;
+  color: white;
+  transition: color 0.2s ease;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.close-btn:hover {
+  color: #e0e0e0;
+}
+
+.material-modal .modal-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin: 0;
+  line-height: 1.2;
+}
+
+.material-modal .modal-body {
+  flex: 1;
+  overflow: auto;
+  padding: 0;
+}
+
+.material-table {
+  width: 100%;
+}
+
+.table-header {
+  display: flex;
+  background: #f8f9fa;
+  padding: 10px 6px;
+  border-bottom: 2px solid #17B3A3;
+  font-size: 12px;
+  color: #333;
+  font-weight: 600;
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+.table-body {
+  max-height: 400px;
+  overflow-y: auto;
+}
+
+.table-row {
+  display: flex;
+  padding: 10px 6px;
+  border-bottom: 1px solid #f0f0f0;
+  font-size: 12px;
+  color: #333;
+  transition: background-color 0.2s ease;
+}
+
+.table-row:hover {
+  background-color: #f8f9fa;
+}
+
+.table-row:last-child {
+  border-bottom: none;
+}
+
+.material-table .col-no {
+  width: 25px;
+  text-align: center;
+  flex-shrink: 0;
+  font-size: 12px;
+}
+
+.material-table .col-material-code {
+  flex: 1.8;
+  text-align: center;
+  min-width: 100px;
+  font-size: 12px;
+  word-break: break-all;
+}
+
+.material-table .col-required-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-table .col-returned-qty {
+  flex: 0.8;
+  text-align: center;
+  min-width: 65px;
+  font-size: 12px;
+}
+
+.material-modal .modal-footer {
+  padding: 15px 20px;
+  display: flex;
+  justify-content: center;
+  border-top: 1px solid #f0f0f0;
+}
+
+.btn-close {
+  padding: 10px 20px;
+  border-radius: 6px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.2s;
+  border: 1px solid #17B3A3;
+  background: white;
+  color: #17B3A3;
+}
+
+.btn-close:hover {
+  background: #17B3A3;
+  color: white;
+}
+
+/* 加载状态样式 */
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #666;
+}
+
+.loading-container i {
+  font-size: 24px;
+  margin-bottom: 12px;
+  color: #17B3A3;
+}
+
+.loading-container span {
+  font-size: 14px;
+}
+
+/* 空数据状态样式 */
+.empty-material {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 20px;
+  color: #999;
+}
+
+.empty-material i {
+  font-size: 48px;
+  margin-bottom: 16px;
+  color: #ddd;
+}
+
+.empty-material p {
+  margin: 0;
+  font-size: 14px;
+}
+
+/* 响应式设计 */
+@media (max-width: 360px) {
+  .header-bar {
+    padding: 8px 12px;
+  }
+
+  .search-container {
+    padding: 8px 12px;
+  }
+
+  .material-info-card {
+    margin: 4px 12px;
+    padding: 6px 16px;
+  }
+
+  .section-title {
+    margin: 0 12px;
+    margin-top: 4px;
+  }
+
+  .label-list {
+    margin: 0 12px 8px;
+  }
+
+  .card-details {
+    flex-wrap: wrap;
+    gap: 6px;
+  }
+
+  .detail-item {
+    flex: 0 0 48%;
+    margin-bottom: 6px;
+    min-width: 50px;
+  }
+
+  .list-header, .list-item {
+    font-size: 11px;
+  }
+
+  .col-label, .col-part {
+    flex: 1.5;
+  }
+}
+</style>
\ No newline at end of file