From d7681e5a3edcfdd1d6beca49e0459a9d98e314dc Mon Sep 17 00:00:00 2001
From: shenzhouyu <zhouyu.shen@xujiesoft.com>
Date: Tue, 29 Jul 2025 17:10:10 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A2=86=E6=96=99=E5=8F=91=E8=B4=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/modules/production-issue/pick.vue   |  410 +++--
 .../production-issue/productionIssuePda.vue   | 1425 ++---------------
 2 files changed, 347 insertions(+), 1488 deletions(-)

diff --git a/src/views/modules/production-issue/pick.vue b/src/views/modules/production-issue/pick.vue
index 7cf7165..2731c3d 100644
--- a/src/views/modules/production-issue/pick.vue
+++ b/src/views/modules/production-issue/pick.vue
@@ -1,187 +1,121 @@
 <template>
   <div class="pick-container">
-    <van-nav-bar title="生产拣料" left-arrow @click-left="$router.back()" />
-    
-    <!-- 订单信息 -->
-    <div class="order-info">
-      <div class="info-header">
-        <div class="order-no">{{ orderInfo.orderNo }}</div>
-        <div class="order-status">{{ getStatusText(orderInfo.status) }}</div>
+    <!-- 顶部栏 -->
+    <div class="header-bar">
+      <div class="header-left" @click="$router.back()">
+        <i class="el-icon-arrow-left"></i>
+        <span>拣货出库</span>
       </div>
-      <van-cell-group>
-        <van-cell title="产品编码" :value="orderInfo.productCode" />
-        <van-cell title="产品名称" :value="orderInfo.productName" />
-        <van-cell title="生产数量" :value="orderInfo.planQuantity" />
-        <van-cell title="工作中心" :value="orderInfo.workCenter" />
-      </van-cell-group>
-    </div>
-
-    <!-- 物料清单 -->
-    <div class="material-section">
-      <div class="section-title">物料清单</div>
-      <div
-        v-for="(item, index) in materialList"
-        :key="index"
-        class="material-item"
-      >
-        <div class="material-info">
-          <div class="material-name">{{ item.materialCode }} - {{ item.materialName }}</div>
-          <div class="material-spec">规格：{{ item.specification }}</div>
-          <div class="material-location">
-            <van-tag type="primary" size="small">{{ item.locationCode }}</van-tag>
-            <span class="stock-info">库存：{{ item.stock }}</span>
-          </div>
-          <div class="material-quantity">
-            需求：{{ item.requiredQuantity }} | 已发：{{ item.issuedQuantity }}
-          </div>
-        </div>
-        <div class="pick-input">
-          <van-stepper
-            v-model="item.currentPick"
-            :min="0"
-            :max="Math.min(item.requiredQuantity - item.issuedQuantity, item.stock)"
-            integer
-          />
-        </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
       </div>
     </div>
 
-    <!-- 批次信息 -->
-    <div class="batch-section">
-      <div class="section-title">批次信息</div>
-      <van-field
-        v-model="batchInfo.batchNo"
-        label="批次号"
-        placeholder="请输入或扫描批次号"
-      >
-        <template #right-icon>
-          <van-icon name="scan" @click="handleScanBatch" />
-        </template>
-      </van-field>
-      <van-field
-        v-model="batchInfo.workOrder"
-        label="工单号"
-        :value="orderInfo.orderNo"
-        disabled
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input
+        v-model="scanCode"
+        placeholder="请扫描标签条码"
+        clearable
+        @keyup.enter.native="handleAdd"
+        ref="scanInput"
       />
+      <el-button type="primary" @click="handleAdd" class="add-btn">添加</el-button>
     </div>
 
-    <!-- 备注 -->
-    <div class="remark-section">
-      <van-field
-        v-model="remark"
-        label="备注"
-        type="textarea"
-        placeholder="请输入发料备注"
-        rows="3"
-        autosize
-      />
+    <!-- 订单信息卡片 -->
+    <div class="order-card">
+      <div class="order-row">
+        <span class="label">出库单号</span>
+        <span class="value">{{ orderInfo.orderNo }}</span>
+      </div>
+      <div class="order-row">
+        <span class="label">关联单号</span>
+        <span class="value">{{ orderInfo.linkedNo }}</span>
+      </div>
+      <div class="order-row">
+        <span class="label">标签张数</span>
+        <span class="value success">{{ orderInfo.labelCount }}/{{ orderInfo.labelTotal }}</span>
+      </div>
+      <div class="order-row">
+        <span class="label">物料总数</span>
+        <span class="value success">{{ orderInfo.materialCount }}/{{ orderInfo.materialTotal }}</span>
+      </div>
+    </div>
+
+    <!-- 出库信息确认表格 -->
+    <div class="table-section">
+      <div class="table-title">出库信息确认</div>
+      <el-table :data="tableData" border style="width: 100%" class="pick-table">
+        <el-table-column prop="no" label="NO." align="center" />
+        <el-table-column prop="labelCode" label="标签条码" align="center" />
+        <el-table-column prop="materialCode" label="物料编码" align="center" />
+        <el-table-column prop="unit" label="单位" align="center" />
+        <el-table-column prop="labelCount" label="标签数量" align="center" />
+      </el-table>
     </div>
 
     <!-- 底部按钮 -->
     <div class="bottom-actions">
-      <van-button
-        type="primary"
-        block
-        :loading="submitting"
-        @click="handleSubmit"
-      >
-        确认发料
-      </van-button>
+      <el-button type="primary" @click="handleConfirm" :loading="submitting">确定</el-button>
+      <el-button @click="handleCancel">取消</el-button>
     </div>
   </div>
 </template>
 
 <script>
 export default {
-  name: 'ProductionIssuePick',
+  name: 'ProductionPickOut',
   data() {
     return {
+      scanCode: '',
+      submitting: false,
       orderInfo: {
-        orderNo: 'MO202401001',
-        productCode: 'PROD001',
-        productName: '成品A',
-        planQuantity: 100,
-        workCenter: '装配线1',
-        status: 0
-      },
-      materialList: [
-        {
-          materialCode: 'MAT001',
-          materialName: '原材料A',
-          specification: '100*50*20mm',
-          locationCode: 'A01-01-01',
-          stock: 500,
-          requiredQuantity: 200,
-          issuedQuantity: 0,
-          currentPick: 0
-        },
-        {
-          materialCode: 'MAT002',
-          materialName: '原材料B',
-          specification: '200*100*30mm',
-          locationCode: 'A01-02-01',
-          stock: 300,
-          requiredQuantity: 150,
-          issuedQuantity: 0,
-          currentPick: 0
-        }
-      ],
-      batchInfo: {
-        batchNo: '',
-        workOrder: ''
+        orderNo: 'W20250721001',
+        linkedNo: '20250723001-1',
+        labelCount: 10,
+        labelTotal: 20,
+        materialCount: 100,
+        materialTotal: 2000
       },
-      remark: '',
-      submitting: false
+      tableData: [
+        { no: 8, labelCode: '2025070002', materialCode: '2025070002', unit: '↑', labelCount: 2 },
+        { no: 7, labelCode: '2025070003', materialCode: '2025070003', unit: '↑', labelCount: 3 },
+        { no: 6, labelCode: '2025070004', materialCode: '2025070004', unit: '↑', labelCount: 4 },
+        { no: 5, labelCode: '2025070005', materialCode: '2025070005', unit: '↑', labelCount: 5 },
+        { no: 4, labelCode: '2025070006', materialCode: '2025070006', unit: '↑', labelCount: 6 },
+        { no: 3, labelCode: '2025070006', materialCode: '2025070006', unit: '↑', labelCount: 6 },
+        { no: 2, labelCode: '2025070006', materialCode: '2025070006', unit: '↑', labelCount: 6 },
+        { no: 1, labelCode: '2025070006', materialCode: '2025070006', unit: '↑', labelCount: 6 }
+      ]
     }
   },
-  mounted() {
-    this.loadOrderData()
-  },
   methods: {
-    loadOrderData() {
-      const orderNo = this.$route.params.orderNo
-      console.log('加载生产订单数据:', orderNo)
-    },
-    handleScanBatch() {
-      this.$toast('扫描批次功能开发中...')
+    handleAdd() {
+      if (!this.scanCode.trim()) return;
+      // 实际应调用接口或校验后添加到tableData
+      this.$message.success('添加成功（演示）');
+      this.scanCode = '';
+      this.$nextTick(() => {
+        if (this.$refs.scanInput) this.$refs.scanInput.focus();
+      });
     },
-    async handleSubmit() {
-      // 验证发料数量
-      const hasPick = this.materialList.some(item => item.currentPick > 0)
-      if (!hasPick) {
-        this.$toast('请输入发料数量')
-        return
-      }
-
-      // 检查库存
-      const insufficientStock = this.materialList.find(item => item.currentPick > item.stock)
-      if (insufficientStock) {
-        this.$toast(`${insufficientStock.materialName} 库存不足`)
-        return
-      }
-
-      this.submitting = true
-      
-      try {
-        await new Promise(resolve => setTimeout(resolve, 2000))
-        
-        this.$toast.success('发料成功')
-        this.$router.back()
-      } catch (error) {
-        this.$toast.fail('发料失败')
-      } finally {
-        this.submitting = false
-      }
+    handleConfirm() {
+      this.submitting = true;
+      setTimeout(() => {
+        this.submitting = false;
+        this.$message.success('出库成功');
+        this.$router.back();
+      }, 1000);
     },
-    getStatusText(status) {
-      const statusMap = {
-        0: '待发料',
-        1: '部分发料',
-        2: '已完成'
-      }
-      return statusMap[status] || '未知'
+    handleCancel() {
+      this.$router.back();
     }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      if (this.$refs.scanInput) this.$refs.scanInput.focus();
+    });
   }
 }
 </script>
@@ -192,106 +126,132 @@ export default {
   background-color: #f7f8fa;
   padding-bottom: 80px;
 }
-
-.order-info {
-  background: white;
-  margin-bottom: 10px;
-}
-
-.info-header {
+.header-bar {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 16px;
-  border-bottom: 1px solid #ebedf0;
+  padding: 8px 16px;
+  background: #17B3A3;
+  color: white;
+  height: 40px;
+  min-height: 40px;
 }
-
-.order-no {
-  font-size: 18px;
-  font-weight: bold;
-  color: #323233;
+.header-left {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-size: 16px;
+  font-weight: 500;
 }
-
-.order-status {
-  padding: 4px 8px;
-  border-radius: 4px;
-  font-size: 12px;
-  color: white;
-  background-color: #ff976a;
+.header-right {
+  cursor: pointer;
 }
-
-.material-section,
-.batch-section,
-.remark-section {
+.search-container {
+  display: flex;
+  align-items: center;
+  padding: 10px 16px;
   background: white;
-  margin-bottom: 10px;
+}
+.search-container .el-input {
+  flex: 1;
+}
+.add-btn {
+  margin-left: 10px;
+  background: #17B3A3;
+  color: #fff;
+  border: none;
+  border-radius: 16px;
+  height: 32px;
+  min-width: 56px;
+  font-size: 15px;
+  font-weight: 500;
+  box-shadow: none;
+  transition: background 0.2s;
+}
+.add-btn:hover, .add-btn:focus {
+  background: #13998c;
+  color: #fff;
 }
 
-.section-title {
+.order-card {
+  background: white;
+  margin: 16px;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
   padding: 16px;
-  font-size: 16px;
-  font-weight: bold;
-  color: #323233;
-  border-bottom: 1px solid #ebedf0;
+  margin-bottom: 10px;
 }
-
-.material-item {
+.order-row {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 16px;
-  border-bottom: 1px solid #ebedf0;
-}
-
-.material-item:last-child {
-  border-bottom: none;
+  font-size: 15px;
+  margin-bottom: 6px;
 }
-
-.material-info {
-  flex: 1;
+.label {
+  color: #969799;
 }
-
-.material-name {
-  font-size: 16px;
-  font-weight: bold;
+.value {
   color: #323233;
-  margin-bottom: 4px;
+  font-weight: 500;
 }
-
-.material-spec {
-  font-size: 12px;
-  color: #969799;
-  margin-bottom: 6px;
+.value.success {
+  color: #19be6b;
 }
-
-.material-location {
-  display: flex;
-  align-items: center;
-  margin-bottom: 4px;
+.table-section {
+  background: white;
+  margin: 0 16px 10px 16px;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+  padding: 16px 8px 8px 8px;
 }
-
-.stock-info {
-  font-size: 12px;
-  color: #646566;
+.table-title {
+  font-size: 15px;
+  color: #17B3A3;
+  font-weight: bold;
+  margin-bottom: 8px;
   margin-left: 8px;
 }
-
-.material-quantity {
+.pick-table {
   font-size: 14px;
-  color: #646566;
 }
-
-.pick-input {
-  margin-left: 16px;
-}
-
 .bottom-actions {
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
-  padding: 16px;
+  padding: 16px 0 24px 0;
   background: white;
   border-top: 1px solid #ebedf0;
+  display: flex;
+  justify-content: center;
+  gap: 32px;
+}
+.bottom-actions .el-button {
+  min-width: 120px;
+  height: 36px;
+  border-radius: 18px;
+  font-size: 16px;
+  font-weight: 500;
+  border: 1.5px solid #17B3A3;
+  color: #17B3A3;
+  background: #fff;
+  box-shadow: none;
+  transition: background 0.2s, color 0.2s;
+}
+.bottom-actions .el-button:hover, .bottom-actions .el-button:focus {
+  background: #17B3A3;
+  color: #fff;
+  border-color: #17B3A3;
+}
+.bottom-actions .el-button--primary {
+  background: #17B3A3;
+  color: #fff;
+  border-color: #17B3A3;
+}
+.bottom-actions .el-button--primary:hover, .bottom-actions .el-button--primary:focus {
+  background: #13998c;
+  color: #fff;
+  border-color: #13998c;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/modules/production-issue/productionIssuePda.vue b/src/views/modules/production-issue/productionIssuePda.vue
index 1c23fe1..3dedb41 100644
--- a/src/views/modules/production-issue/productionIssuePda.vue
+++ b/src/views/modules/production-issue/productionIssuePda.vue
@@ -1,1335 +1,234 @@
 <template>
-  <div>
-    <div class="pda-container">
-      <div class="status-bar">
-        <div class="goBack" @click="handleBack"><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="processFlag === 1">
-          <div class="function-card" @click="selectFunction('direct')">
-            <div class="function-icon">📦</div>
-            <div class="function-title">直接发料</div>
-            <div class="function-desc">输入工单号，扫描物料标签直接发料</div>
-          </div>
+      <div class="header-right" @click="$router.push({ path: '/' })">
+        首页
+      </div>
+    </div>
 
-          <div class="function-card" @click="selectFunction('picking')">
-            <div class="function-icon">🏗️</div>
-            <div class="function-title">拣选装托盘</div>
-            <div class="function-desc">基于申请单创建托盘，扫描箱卷绑定</div>
-          </div>
+    <!-- 搜索框 -->
+    <div class="search-container">
+      <el-input  clearable
+                 v-model="searchValue"
+                 placeholder="请输入生产订单号"
+                 @keyup.enter.native="handleSearch"
+                 ref="searchInput"
+      />
+    </div>
 
-          <div class="function-card" @click="selectFunction('request')">
-            <div class="function-icon">📋</div>
-            <div class="function-title">申请单发料</div>
-            <div class="function-desc">基于申请单扫描物料标签发料</div>
-          </div>
+    <!-- 订单列表 -->
+    <div class="content-area">
+      <div
+        v-for="item in filteredOrderList"
+        :key="item.id"
+        class="inbound-card"
+        @click="goToDetail(item)"
+      >
+        <div class="card-title">
+          <span class="title-label">订单号</span>
+          <span class="title-value">{{ item.orderNo }}</span>
         </div>
-
-        <!-- 直接发料 -->
-        <div class="direct-issue" v-if="processFlag === 2 && selectedFunction === 'direct'">
-          <!-- 工单输入 -->
-          <div class="input-section">
-            <div class="input-group">
-              <label>工单号</label>
-              <div class="input-with-scan">
-                <input v-model="directIssueForm.workOrderNo" placeholder="请输入或扫描工单号"
-                  @keyup.enter="loadWorkOrderMaterials" />
-                <button @click="loadWorkOrderMaterials" class="scan-btn">确认</button>
-              </div>
-            </div>
+        <div class="card-details">
+          <div class="detail-item">
+            <div class="detail-label">产品编码</div>
+            <div class="detail-value">{{ item.productCode }}</div>
           </div>
-
-          <!-- 物料列表 -->
-          <div class="materials-section" v-if="workOrderMaterials.length">
-            <div class="material-list">
-              <div v-for="(material, index) in workOrderMaterials" :key="index" class="material-item"
-                :class="{ selected: (selectedMaterial?selectedMaterial.partNo:'') === (material&&material.partNo?material.partNo:'') }"
-                @click="goToScanLabel(material)">
-                <div class="material-info">
-                  <div class="part-no">{{ material.partNo }}</div>
-                  <div class="part-desc">{{ material.partDesc }}</div>
-                  <div class="qty-info">
-                    需求: {{ material.requiredQty }} |
-                    已发: {{ material.issuedQty }} |
-                    剩余: {{ material.remainQty }}
-                  </div>
-                </div>
-                <div class="material-status">
-                  <span v-if="material.remainQty > 0" class="status-pending">待发料</span>
-                  <span v-else class="status-complete">已完成</span>
-                </div>
-              </div>
-            </div>
+          <div class="detail-item">
+            <div class="detail-label">产品名称</div>
+            <div class="detail-value">{{ item.productName }}</div>
           </div>
-        </div>
-
-        <!-- 拣选装托盘 -->
-        <div class="picking-pallet" v-if="processFlag === 2 && selectedFunction === 'picking'">
-          <!-- 申请单输入 -->
-          <div class="input-section" v-if="!currentPallet.palletId">
-            <div class="input-group">
-              <label>申请单号</label>
-              <div class="input-with-scan">
-                <input v-model="palletForm.notifyNo" placeholder="请输入申请单号" @keyup.enter="createPallet" />
-                <button @click="createPallet" class="scan-btn">创建托盘</button>
-              </div>
-            </div>
+          <div class="detail-item">
+            <div class="detail-label">计划数量</div>
+            <div class="detail-value">{{ item.planQuantity }}</div>
           </div>
-
-          <!-- 托盘信息 -->
-          <div class="pallet-info" v-if="currentPallet.palletId">
-            <div class="section-header">
-              <h3>托盘信息</h3>
-            </div>
-
-            <div class="info-card">
-              <div class="info-row">
-                <span class="label">托盘ID:</span>
-                <span class="value">{{ currentPallet.palletId }}</span>
-              </div>
-              <div class="info-row">
-                <span class="label">申请单号:</span>
-                <span class="value">{{ currentPallet.notifyNo }}</span>
-              </div>
-              <div class="info-row">
-                <span class="label">已绑定单元:</span>
-                <span class="value">{{ currentPallet.unitCount || 0 }}</span>
-              </div>
-            </div>
-
-            <!-- 扫描绑定 -->
-            <div class="scan-bind-section">
-              <div class="input-group">
-                <label>扫描箱/卷</label>
-                <div class="input-with-scan">
-                  <input v-model="scannedUnit" placeholder="请扫描处理单元条码" @keyup.enter="bindUnit" />
-                  <button @click="bindUnit" class="scan-btn">绑定</button>
-                </div>
-              </div>
-            </div>
-
-            <!-- 已绑定单元列表 -->
-            <div class="bound-units" v-if="currentPallet.scannedUnits.length">
-              <div class="section-header">
-                <h4>已绑定单元 ({{ currentPallet.scannedUnits.length }})</h4>
-              </div>
-              <div class="unit-list">
-                <div v-for="unit in currentPallet.scannedUnits" :key="unit" class="unit-item">
-                  {{ unit }}
-                </div>
-              </div>
-            </div>
-
-            <!-- 打印标签 -->
-            <div class="print-section">
-              <div class="input-group">
-                <label>打印机</label>
-                <select v-model="palletForm.printerName">
-                  <option value="">请选择打印机</option>
-                  <option value="PRINTER_01">打印机01</option>
-                  <option value="PRINTER_02">打印机02</option>
-                </select>
-              </div>
-
-              <button @click="printPalletLabel" class="print-btn" :disabled="!palletForm.printerName">
-                打印托盘标签
-              </button>
-            </div>
-          </div>
-        </div>
-
-        <!-- 申请单发料 -->
-        <div class="request-issue" v-if="processFlag === 2 && selectedFunction === 'request'">
-          <!-- 申请单输入 -->
-          <div class="input-section">
-            <div class="input-group">
-              <label>申请单号</label>
-              <div class="input-with-scan">
-                <input v-model="requestIssueForm.notifyNo" placeholder="请输入申请单号" @keyup.enter="loadRequestMaterials" />
-                <button @click="loadRequestMaterials" class="scan-btn">确认</button>
-              </div>
-            </div>
+          <div class="detail-item">
+            <div class="detail-label">发料进度</div>
+            <div class="detail-value">{{ item.issuedQuantity }}/{{ item.totalMaterialQuantity }}</div>
           </div>
-
-          <!-- 申请单物料列表 -->
-          <div class="materials-section" v-if="requestMaterials.length">
-
-            <div class="material-list">
-              <!-- 扫描标签和发料 -->
-              <!--  <div class="scan-section">
-                <div class="section-header">
-                  <h3>扫描物料标签</h3>
-                </div>
-
-                <div class="input-group">
-                  <div class="input-with-scan">
-                    <input v-model="scannedLabel" placeholder="请扫描物料标签" @keyup.enter="parseMaterialLabel" />
-                    <button @click="parseMaterialLabel" class="scan-btn">解析</button>
-                  </div>
-                </div> -->
-
-              <!-- 标签信息和发料确认 -->
-              <div class="label-info" v-if="labelInfo">
-                <div class="info-row">
-                  <span class="label">物料编码:</span>
-                  <span class="value">{{ labelInfo.partNo }}</span>
-                </div>
-                <div class="info-row">
-                  <span class="label">批次号:</span>
-                  <span class="value">{{ labelInfo.batchNo }}</span>
-                </div>
-                <div class="info-row">
-                  <span class="label">可用数量:</span>
-                  <span class="value">{{ labelInfo.availableQty }}</span>
-                </div>
-
-                <div class="qty-input">
-                  <div class="input-group">
-                    <label>发料数量</label>
-                    <input v-model="issueQty" type="number"
-                      :max="Math.min(selectedRequestMaterial.remainQty, labelInfo.availableQty)"
-                      placeholder="请输入发料数量" />
-                  </div>
-
-                  <div class="input-group">
-                    <label>备注</label>
-                    <div class="input-with-scan">
-                      <textarea v-model="requestIssueForm.remark" placeholder="可选" />
-                    </div>
-
-                  </div>
-
-                  <button @click="confirmRequestIssue" class="confirm-btn" :disabled="!issueQty">
-                    确认发料 (同步IFS)
-                  </button>
-                </div>
-              </div>
-            </div>
-            <div v-for="material in requestMaterials" :key="`${material.partNo}-${material.itemNo}`"
-              class="material-item" @click="selectRequestMaterial(material)">
-              <div class="material-info">
-                <div class="part-no">{{ material.partNo }}</div>
-                <div class="part-desc">{{ material.partDesc }}</div>
-                <div class="work-order">工单: {{ material.workOrderNo }}</div>
-                <div class="qty-info">
-                  申请: {{ material.requestQty }} |
-                  已发: {{ material.issuedQty }} |
-                  剩余: {{ material.remainQty }}
-                </div>
-              </div>
-              <div class="material-status">
-                <span v-if="material.remainQty > 0" class="status-pending">待发料</span>
-                <span v-else class="status-complete">已完成</span>
-              </div>
-            </div>
+          <div class="detail-item">
+            <div class="detail-label">状态</div>
+            <div class="detail-value">{{ getStatusText(item.status) }}</div>
           </div>
         </div>
-
       </div>
 
-      <!-- 加载提示 -->
-      <div class="loading" v-if="loading">
-        <div class="loading-spinner"></div>
-        <div class="loading-text">{{ loadingText }}</div>
+      <!-- 空状态 -->
+      <div v-if="filteredOrderList.length === 0 && !loading" class="empty-state">
+        <i class="el-icon-box"></i>
+        <p>暂无生产发料订单</p>
       </div>
 
-      <!-- 消息提示 -->
-      <div class="message" v-if="message" :class="messageType">
-        {{ message }}
-      </div>
-
-      <!-- 扫描标签页面 -->
-      <div v-if="processFlag === 3" class="scan-label-page">
-
-        <div class="input-section">
-          <button @click="confirmScanLabelIssue" class="confirm-btn">确认发料</button>
-          <div class="label-info" v-if="scanLabelData.labelInfo">
-            <div class="info-row"><span class="label">物料编码:</span><span
-                class="value">{{ scanLabelData.labelInfo.partNo }}</span></div>
-            <div class="info-row"><span class="label">批次号:</span><span
-                class="value">{{ scanLabelData.labelInfo.batchNo }}</span></div>
-            <div class="info-row"><span class="label">可用数量:</span><span
-                class="value">{{ scanLabelData.labelInfo.availableQty }}</span></div>
-          </div>
-          <!-- <div class="qty-input" v-if="scanLabelData.labelInfo">
-            <div class="input-group">
-              <label>发料数量</label>
-              <input v-model="scanLabelData.issueQty" type="number" :max="scanLabelData.labelInfo.availableQty"
-                placeholder="请输入发料数量" />
-            </div>
-            <div class="input-group">
-              <label>备注</label>
-              <el-input type="textarea" v-model="scanLabelData.remark" placeholder="可选" />
-            </div>
-           
-          </div> -->
-          <div class="input-group">
-            <div class="input-with-scan">
-              <input v-model="scanTableInput" placeholder="请扫描材料编号" @keyup.enter="handleScanTableInput" />
-              <button @click="handleScanTableInput" class="scan-btn">添加</button>
-            </div> 
-          </div>
-          <div class="input-group">
-            <el-table :data="scanTableData" border highlight-current-row ref="mainTable" style="width: 100%; ">
-              <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable"
-                :prop="item.columnProp" :header-align="item.headerAlign"
-                :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align"
-                :fixed="item.fixed==''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel">
-                <template slot-scope="scope">
-                  <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
-                  <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
-                      style="width: 100px; height: 80px" /></span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </div>
-
-          <div class="message" v-if="scanLabelData.message" :class="scanLabelData.messageType">
-            {{ scanLabelData.message }}</div>
-        </div>
-
+      <!-- 加载状态 -->
+      <div v-if="loading" class="loading-state">
+        <i class="el-icon-loading"></i>
+        <p>加载中...</p>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import {
-  getWorkOrderMaterials,
-  parseMaterialLabel,
-  directIssue,
-  getRequestMaterials,
-  requestIssue,
-  createPickingPallet,
-  bindUnitsToPallet,
-  printPalletLabel,
-  getPalletInfo,
-  scanMaterialLabel,
-} from '@/api/production/production-issue'
-
 export default {
-  name: 'ProductionIssuePDA',
   data() {
     return {
-      processFlag: 1, // 1=功能选择, 2=主表单, 3=物料列表, 4=扫描标签
-      selectedFunction: null,
+      searchValue: '',
       loading: false,
-      loadingText: '',
-      message: '',
-      messageType: 'info',
-
-      // 直接发料
-      directIssueForm: {
-        site: this.$store.state.user.site,
-        workOrderNo: '',
-        operatorName: 'PDA_USER',
-        remark: '',
-        selectedMaterials: [],
-      },
-      workOrderMaterials: [],
-      selectedMaterial: {
-        partNo: '',
-        partDesc: '',
-        requiredQty: 0,
-        issuedQty: 0,
-        remainQty: 0,
-      },
-
-      // 申请单发料
-      requestIssueForm: {
-        site: this.$store.state.user.site,
-        notifyNo: '',
-        workOrderNo: '',
-        operatorName: 'PDA_USER',
-        remark: '',
-        selectedMaterials: [],
-      },
-      requestMaterials: [],
-      selectedRequestMaterial: null,
-
-      // 托盘拣选
-      palletForm: {
-        site: this.$store.state.user.site,
-        notifyNo: '',
-        operatorName: 'PDA_USER',
-        printerName: '',
-        remark: '',
-      },
-      currentPallet: {},
-      scannedUnit: '',
-
-      // 通用
-      scannedLabel: '',
-      labelInfo: null,
-      issueQty: null,
-      showScanLabel: false,
-      scanLabelContext: {},
-      scanLabelData: {},
-      scanTableInput: '',
-      scanTableData: [],
-      columnList: [
+      orderList: [
         {
-          userId: this.$store.state.user.name,
-          functionId: 701002,
-          serialNumber: '701002Table1NotifyNo',
-          tableId: '701002Table1',
-          tableName: '生产入库申请主表',
-          columnProp: 'partNo',
-          headerAlign: 'center',
-          align: 'center',
-          columnLabel: '材料单号',
-          columnHidden: false,
-          columnImage: false,
-          columnSortable: false,
-          sortLv: 0,
-          status: true,
-          fixed: '',
-          columnWidth: 100,
+          id: 1,
+          orderNo: 'MO202401001',
+          productCode: 'PROD001',
+          productName: '成品A',
+          planQuantity: 100,
+          totalMaterialQuantity: 500,
+          issuedQuantity: 0,
+          status: 0
         },
         {
-          userId: this.$store.state.user.name,
-          functionId: 701002,
-          serialNumber: '701002Table1WorkShopName',
-          tableId: '701002Table1',
-          tableName: '生产入库申请主表',
-          columnProp: 'desc',
-          headerAlign: 'center',
-          align: 'center',
-          columnLabel: '材料描述',
-          columnHidden: false,
-          columnImage: false,
-          columnSortable: false,
-          sortLv: 0,
-          status: true,
-          fixed: '',
-          columnWidth: 100,
+          id: 2,
+          orderNo: 'MO202401002',
+          productCode: 'PROD002',
+          productName: '成品B',
+          planQuantity: 200,
+          totalMaterialQuantity: 800,
+          issuedQuantity: 400,
+          status: 1
         },
         {
-          userId: this.$store.state.user.name,
-          functionId: 701002,
-          serialNumber: '701002Table1WorkShopName',
-          tableId: '701002Table1',
-          tableName: '生产入库申请主表',
-          columnProp: 'qty',
-          headerAlign: 'center',
-          align: 'center',
-          columnLabel: '数量',
-          columnHidden: false,
-          columnImage: false,
-          columnSortable: false,
-          sortLv: 0,
-          status: true,
-          fixed: '',
-          columnWidth: 100,
-        },
-      ],
+          id: 3,
+          orderNo: 'MO202401003',
+          productCode: 'PROD003',
+          productName: '成品C',
+          planQuantity: 150,
+          totalMaterialQuantity: 600,
+          issuedQuantity: 600,
+          status: 2
+        }
+      ]
     }
   },
   computed: {
-    functionTitle() {
-      if (!this.selectedFunction) return '生产发料'
-      if (this.selectedFunction === 'direct') return '直接发料'
-      if (this.selectedFunction === 'picking') return '拣选装托盘'
-      if (this.selectedFunction === 'request') return '申请单发料'
-      return '生产发料'
-    },
+    filteredOrderList() {
+      let list = this.orderList;
+      if (this.searchValue.trim()) {
+        list = list.filter(item => item.orderNo.includes(this.searchValue.trim()));
+      }
+      return list;
+    }
   },
   methods: {
-    handleBack() {
-      if (this.processFlag === 3) {
-        this.processFlag = 2
-        this.showScanLabel = false
-      } else if (this.processFlag === 2) {
-        this.processFlag = 1
-        this.selectedFunction = null
-      } else if (this.processFlag === 1) {
-        this.$router.push('/')
-      }
-    },
-    selectFunction(func) {
-      this.selectedFunction = func
-      this.resetAll()
-      this.processFlag = 2
-    },
-    goToScanLabel(material) {
-      if (material.remainQty <= 0) {
-        this.showMessage('该物料已发料完成', 'warning')
-        return
-      }
-      this.scanLabelContext = {
-        type: 'direct',
-        workOrderNo: this.directIssueForm.workOrderNo,
-        partNo: material.partNo,
-        material,
-      }
-      this.scanLabelData = {
-        scannedLabel: '',
-        labelInfo: {
-          partNo: this.partNo,
-          batchNo: 'BATCH001',
-          availableQty: 100,
-        },
-        issueQty: null,
-        remark: '',
-        message: '',
-        messageType: 'info',
-      }
-      this.showScanLabel = true
-      this.processFlag = 3
-    },
-    selectRequestMaterial(material) {
-      if (material.remainQty <= 0) {
-        this.showMessage('该物料已发料完成', 'warning')
-        return
-      }
-      this.selectedRequestMaterial = material
-      this.requestIssueForm.workOrderNo = material.workOrderNo
-      this.scannedLabel = ''
-      this.labelInfo = null
-      this.issueQty = null
-      this.scanLabelContext = {
-        type: 'request',
-        notifyNo: this.requestIssueForm.notifyNo,
-        partNo: material.partNo,
-        material,
-      }
-      this.scanLabelData = {
-        scannedLabel: '',
-        labelInfo: {
-          partNo: this.partNo,
-          batchNo: 'BATCH001',
-          availableQty: 100,
-        },
-        issueQty: null,
-        remark: '',
-        message: '',
-        messageType: 'info',
-      }
-      this.showScanLabel = true
-      this.processFlag = 3
-    },
-    closeScanLabel() {
-      this.handleBack()
-    },
-    resetAll() {
-      this.workOrderMaterials = []
-      this.requestMaterials = []
-      this.selectedMaterial = null
-      this.selectedRequestMaterial = null
-      this.currentPallet = {}
-      this.scannedLabel = ''
-      this.labelInfo = null
-      this.issueQty = null
-      this.message = ''
-    },
-
-    // 直接发料相关方法
-    async loadWorkOrderMaterials() {
-      if (!this.directIssueForm.workOrderNo) {
-        this.$message.error('请输入工单号', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '加载工单物料...'
-
-      try {
-        const response = await getWorkOrderMaterials({
-          site: this.directIssueForm.site,
-          workOrderNo: this.directIssueForm.workOrderNo,
-        })
-
-        if (response.data.code === 0) {
-          this.workOrderMaterials = response.data.materials || []
-          if (this.workOrderMaterials.length === 0) {
-            this.showMessage('该工单没有物料需求', 'warning')
-          }
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('加载工单物料失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async confirmDirectIssue() {
-      if (!this.issueQty || this.issueQty <= 0) {
-        this.showMessage('请输入有效的发料数量', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '发料中...'
-
-      try {
-        const issueData = {
-          ...this.directIssueForm,
-          selectedMaterials: [
-            {
-              ...this.selectedMaterial,
-              issueQty: this.issueQty,
-            },
-          ],
-          scannedLabel: this.scannedLabel,
-        }
-
-        const response = await directIssue(issueData)
-
-        if (response.data.code === 0) {
-          this.showMessage('发料成功', 'success')
-          // 刷新物料列表
-          await this.loadWorkOrderMaterials()
-          // 重置选择
-          this.selectedMaterial = null
-          this.scannedLabel = ''
-          this.labelInfo = null
-          this.issueQty = null
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('发料失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 申请单发料相关方法
-    async loadRequestMaterials() {
-      /* if (!this.requestIssueForm.notifyNo) {
-        this.showMessage('请输入申请单号', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '加载申请单物料...'
-
-      try {
-        const response = await getRequestMaterials({
-          site: this.requestIssueForm.site,
-          notifyNo: this.requestIssueForm.notifyNo,
-        })
-
-        if (response.data.code === 0) {
-          this.requestMaterials = response.data.materials || []
-          if (this.requestMaterials.length === 0) {
-            this.showMessage('该申请单没有物料需求', 'warning')
-          }
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('加载申请单物料失败', 'error')
-      } finally {
-        this.loading = false
-      } */
-
-      let materials = [
-        {
-          partNo: 'PART001',
-          partDesc: '物料描述1',
-          workOrderNo: 'WO001',
-          requestQty: 100,
-          issuedQty: 50,
-          remainQty: 50,
-          itemNo: 'ITEM001',
-        },
-        {
-          partNo: 'PART002',
-          partDesc: '物料描述2',
-          workOrderNo: 'WO002',
-          requestQty: 200,
-          issuedQty: 100,
-          remainQty: 100,
-          itemNo: 'ITEM002',
-        },
-      ]
-
-      //this.requestMaterials = materials
-      this.$set(this, 'requestMaterials', materials)
-    },
-
-    async confirmRequestIssue() {
-      if (!this.issueQty || this.issueQty <= 0) {
-        this.showMessage('请输入有效的发料数量', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '发料中，同步IFS...'
-
-      try {
-        const issueData = {
-          ...this.requestIssueForm,
-          selectedMaterials: [
-            {
-              ...this.selectedRequestMaterial,
-              issueQty: this.issueQty,
-            },
-          ],
-          scannedLabel: this.scannedLabel,
-        }
-
-        const response = await requestIssue(issueData)
-
-        if (response.data.code === 0) {
-          this.showMessage('发料成功，已同步到IFS', 'success')
-          // 刷新物料列表
-          await this.loadRequestMaterials()
-          // 重置选择
-          this.selectedRequestMaterial = null
-          this.scannedLabel = ''
-          this.labelInfo = null
-          this.issueQty = null
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('发料失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 托盘拣选相关方法
-    async createPallet() {
-      /* if (!this.palletForm.notifyNo) {
-        this.showMessage('请输入申请单号', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '创建托盘...'
-
-      try {
-        const response = await createPickingPallet({
-          ...this.palletForm,
-          palletType: 'PALLET',
-        })
-
-        if (response.data.code === 0) {
-          this.currentPallet = {
-            palletId: response.data.palletId,
-            notifyNo: this.palletForm.notifyNo,
-            scannedUnits: [],
-            unitCount: 0,
-          }
-          this.showMessage('托盘创建成功: ' + response.data.palletId, 'success')
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('创建托盘失败', 'error')
-      } finally {
-        this.loading = false
-      } */
-      this.currentPallet = {
-        palletId: 'qeqweqeqweq',
-        notifyNo: 'SOIA00000035',
-        scannedUnits: [],
-        unitCount: 0,
-      }
-    },
-
-    async bindUnit() {
-      if (!this.scannedUnit) {
-        this.showMessage('请扫描处理单元条码', 'error')
-        return
-      }
-
-      if (this.currentPallet.scannedUnits.includes(this.scannedUnit)) {
-        this.showMessage('该处理单元已绑定', 'warning')
-        this.scannedUnit = ''
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '绑定处理单元...'
-
-      try {
-        const response = await bindUnitsToPallet({
-          site: this.palletForm.site,
-          palletId: this.currentPallet.palletId,
-          scannedUnits: [this.scannedUnit],
-        })
-
-        if (response.data.code === 0) {
-          this.currentPallet.scannedUnits.push(this.scannedUnit)
-          this.currentPallet.unitCount = this.currentPallet.scannedUnits.length
-          this.showMessage('绑定成功', 'success')
-          this.scannedUnit = ''
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('绑定失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    async printPalletLabel() {
-      if (!this.palletForm.printerName) {
-        this.showMessage('请选择打印机', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '打印标签...'
-
-      try {
-        const response = await printPalletLabel({
-          site: this.palletForm.site,
-          palletId: this.currentPallet.palletId,
-          printerName: this.palletForm.printerName,
-        })
-
-        if (response.data.code === 0) {
-          this.showMessage('标签打印成功', 'success')
-        } else {
-          this.showMessage(response.data.msg, 'error')
-        }
-      } catch (error) {
-        this.showMessage('打印失败', 'error')
-      } finally {
-        this.loading = false
-      }
-    },
-
-    // 通用方法
-    async parseMaterialLabel() {
-      /* if (!this.scannedLabel) {
-        this.showMessage('请扫描物料标签', 'error')
-        return
-      }
-
-      this.loading = true
-      this.loadingText = '解析标签...'
-
-      try {
-        const response = await parseMaterialLabel({
-          site: this.directIssueForm.site || this.requestIssueForm.site,
-          scannedLabel: this.scannedLabel
-        })
-
-        if (response.data.code === 0 && response.data.labelInfo) {
-          this.labelInfo = response.data.labelInfo
-          this.issueQty = null // 重置发料数量
-          this.showMessage('标签解析成功', 'success')
-        } else {
-          this.showMessage('无法解析标签或标签无效', 'error')
-          this.labelInfo = null
-        }
-      } catch (error) {
-        this.showMessage('标签解析失败', 'error')
-        this.labelInfo = null
-      } finally {
-        this.loading = false
-      } */
-      this.labelInfo = {
-        partNo: this.selectedMaterial.partNo,
-        batchNo: 'BATCH001',
-        availableQty: 100,
-      }
-      this.issueQty = null // 重置发料数量
-      this.showMessage('标签解析成功', 'success')
-    },
-
-    showMessage(text, type = 'info') {
-      this.message = text
-      this.messageType = type
-      setTimeout(() => {
-        this.message = ''
-      }, 3000)
-    },
-
-    async confirmScanLabelIssue() {
-      if (!this.scanLabelData.issueQty || this.scanLabelData.issueQty <= 0) {
-        this.scanLabelData.message = '请输入有效的发料数量'
-        this.scanLabelData.messageType = 'error'
-        return
-      }
-      this.loading = true
-      this.scanLabelData.message = ''
-      try {
-        if (this.scanLabelContext.type === 'direct') {
-          // 直接发料
-          const issueData = {
-            ...this.directIssueForm,
-            selectedMaterials: [
-              {
-                ...this.scanLabelContext.material,
-                issueQty: this.scanLabelData.issueQty,
-              },
-            ],
-            scannedLabel: this.scanLabelData.scannedLabel,
-            remark: this.scanLabelData.remark,
-          }
-          const response = await directIssue(issueData)
-          if (response.data.code === 0) {
-            this.scanLabelData.message = '发料成功'
-            this.scanLabelData.messageType = 'success'
-            await this.loadWorkOrderMaterials()
-            setTimeout(() => {
-              this.showScanLabel = false
-              this.processFlag = 2
-            }, 1000)
-          } else {
-            this.scanLabelData.message = response.data.msg || '发料失败'
-            this.scanLabelData.messageType = 'error'
-          }
-        } else if (this.scanLabelContext.type === 'request') {
-          // 申请单发料
-          const issueData = {
-            ...this.requestIssueForm,
-            selectedMaterials: [
-              {
-                ...this.scanLabelContext.material,
-                issueQty: this.scanLabelData.issueQty,
-              },
-            ],
-            scannedLabel: this.scanLabelData.scannedLabel,
-            remark: this.scanLabelData.remark,
-          }
-          const response = await requestIssue(issueData)
-          if (response.data.code === 0) {
-            this.scanLabelData.message = '发料成功'
-            this.scanLabelData.messageType = 'success'
-            await this.loadRequestMaterials()
-            setTimeout(() => {
-              this.showScanLabel = false
-              this.processFlag = 2
-            }, 1000)
-          } else {
-            this.scanLabelData.message = response.data.msg || '发料失败'
-            this.scanLabelData.messageType = 'error'
-          }
-        }
-      } catch (error) {
-        this.scanLabelData.message = '发料异常'
-        this.scanLabelData.messageType = 'error'
-      } finally {
-        this.loading = false
-      }
-    },
-    handleScanTableInput() {
-      if (!this.scanTableInput) return
-      // 假设扫描内容为材料编号，自动生成描述（实际可根据业务查接口）
-      let params = {
-        scanTableInput: this.scanTableInput,
-      }
-      scanMaterialLabel(params).then(({data}) => {
-        if (data.code === 0) {
-          let material = {
-            partNo: data.labelInfo.partNo ,
-            desc: data.labelInfo.partDesc || '材料描述-' + this.scanTableInput,
-            qty: 1, // 默认数量为1
-          }
-          this.scanTableData.push(material)
-          this.scanTableInput = ''
-        } else {
-          this.$message.error(data.msg || '扫描失败')
-          return
-        }
-      }).catch(error => {
-        this.$message.error('扫描异常: ' + error.message)
-        return
-      })
-
-      
-    },
+    handleSearch() {
+      // 实际应调用接口
+    },
+    goToDetail(item) {
+      this.$router.push({ name: 'ProductionIssuePick', params: { orderNo: item.orderNo } });
+    },
+    getStatusText(status) {
+      const statusMap = {
+        0: '待发料',
+        1: '部分发料',
+        2: '已完成'
+      };
+      return statusMap[status] || '未知';
+    }
   },
+  mounted() {
+    this.$nextTick(() => {
+      if (this.$refs.searchInput) {
+        this.$refs.searchInput.focus();
+      }
+    });
+  }
 }
 </script>
 
 <style scoped>
-.production-issue-pda {
-  padding: 10px;
-  font-family: Arial, sans-serif;
-  background-color: #f5f5f5;
-  min-height: 100vh;
-}
-
-/* 功能选择 */
-.function-selector {
+.pda-container {
+  width: 100vw;
+  height: 100vh;
   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);
-}
-
-.function-icon {
-  font-size: 48px;
-  margin-bottom: 10px;
-}
-
-.function-title {
-  font-size: 18px;
-  font-weight: bold;
-  margin-bottom: 8px;
-  color: #333;
+  background: #f5f5f5;
 }
-
-.function-desc {
-  font-size: 14px;
-  color: #666;
-}
-
-/* 输入区域 */
-.input-section,
-.materials-section,
-.scan-section,
-.pallet-info,
-.print-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 {
-  flex: 1;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
-  font-size: 16px;
-}
-
-.scan-btn,
-.confirm-btn,
-.print-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;
-}
-
-.confirm-btn:disabled,
-.print-btn:disabled {
-  background: #6c757d;
-  cursor: not-allowed;
-}
-
-/* 物料列表 */
-.material-list {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
+  height: 40px;
+  min-height: 40px;
 }
-
-.material-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 {
-  border-color: #007bff;
-  background-color: #f8f9fa;
-}
-
-.material-item.selected {
-  border-color: #007bff;
-  background-color: #e3f2fd;
-}
-
-.material-info {
-  flex: 1;
-}
-
-.part-no {
-  font-weight: bold;
   font-size: 16px;
-  color: #333;
-  margin-bottom: 4px;
+  font-weight: 500;
 }
-
-.part-desc {
-  color: #666;
-  font-size: 14px;
-  margin-bottom: 4px;
-}
-
-.work-order {
-  color: #007bff;
-  font-size: 12px;
-  margin-bottom: 4px;
-}
-
-.qty-info {
-  font-size: 12px;
-  color: #666;
+.header-right {
+  cursor: pointer;
 }
-
-.material-status {
-  text-align: right;
+.search-container {
+  padding: 10px 16px;
+  background: white;
 }
-
-.status-pending {
-  background: #ffc107;
-  color: #212529;
-  padding: 4px 8px;
-  border-radius: 12px;
-  font-size: 12px;
+.tab-container {
+  background: white;
+  border-bottom: 1px solid #ebedf0;
 }
-
-.status-complete {
-  background: #28a745;
-  color: white;
-  padding: 4px 8px;
-  border-radius: 12px;
-  font-size: 12px;
+.content-area {
+  flex: 1;
+  overflow-y: auto;
+  padding: 10px 0;
 }
-
-/* 标签信息 */
-.label-info,
-.info-card {
-  background: #f8f9fa;
-  border-radius: 6px;
-  padding: 15px;
-  margin-bottom: 15px;
+.inbound-card {
+  background: white;
+  margin: 10px 16px;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  padding: 16px;
+  cursor: pointer;
+  margin-bottom: 10px;
 }
-
-.info-row {
+.card-title {
   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;
-}
-
-/* 数量输入 */
-.qty-input {
-  margin-top: 15px;
-}
-
-.qty-input input[type='number'] {
-  width: 100%;
-  padding: 10px;
-  border: 1px solid #ddd;
-  border-radius: 4px;
+  align-items: center;
   font-size: 16px;
+  font-weight: bold;
+  margin-bottom: 8px;
 }
-
-/* 托盘相关 */
-.scan-bind-section {
-  margin: 20px 0;
-}
-
-.bound-units {
-  margin-top: 20px;
-}
-
-.unit-list {
+.card-details {
   display: flex;
-  flex-direction: column;
-  gap: 8px;
-  max-height: 200px;
-  overflow-y: auto;
+  flex-wrap: wrap;
+  gap: 10px 24px;
 }
-
-.unit-item {
-  background: #e9ecef;
-  padding: 10px;
-  border-radius: 4px;
-  font-family: monospace;
+.detail-item {
+  min-width: 120px;
   font-size: 14px;
 }
-
-/* 加载和消息 */
-.loading {
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  background: rgba(0, 0, 0, 0.8);
-  color: white;
-  padding: 20px;
-  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;
+.detail-label {
+  color: #969799;
 }
-
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
+.detail-value {
+  color: #323233;
+  font-weight: 500;
 }
-
-.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%;
+.empty-state {
   text-align: center;
+  color: #aaa;
+  margin-top: 40px;
 }
-
-.message.success {
-  background: #d4edda;
-  color: #155724;
-  border: 1px solid #c3e6cb;
-}
-
-.message.error {
-  background: #f8d7da;
-  color: #721c24;
-  border: 1px solid #f5c6cb;
-}
-
-.message.warning {
-  background: #fff3cd;
-  color: #856404;
-  border: 1px solid #ffeaa7;
-}
-
-.message.info {
-  background: #d1ecf1;
-  color: #0c5460;
-  border: 1px solid #bee5eb;
-}
-
-/* 响应式设计 */
-@media (max-width: 768px) {
-  .production-issue-pda {
-    padding: 5px;
-  }
-
-  .function-card {
-    padding: 15px;
-  }
-
-  .function-icon {
-    font-size: 36px;
-  }
-
-  .input-with-scan {
-    flex-direction: column;
-  }
-
-  .material-item {
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 10px;
-  }
-
-  .material-status {
-    align-self: flex-end;
-  }
-}
-.confirm-btn {
-  width: 100%;
+.loading-state {
+  text-align: center;
+  color: #17B3A3;
+  margin-top: 40px;
 }
 </style>