1

647556386

2025-12-18 b6da87d49bb06cd0be0db4b44434afc088ebcad2

1

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/inbound/Dt_AllocateOrder.js

@@ -4,10 +4,11 @@
import { h,createVNode, render,reactive,ref  } from 'vue';
import { ElDialog , ElForm, ElFormItem, ElInput, ElButton, ElMessage ,ElSelect ,ElOption } from 'element-plus'; // å¼•å…¥ElMessage，解决提示无反应
import gridBody from './extend/allocateOrderDetail.vue'
import gridHeader from './extend/Pallet.vue'
let extension = {
    components: {
      //查询界面扩展组件
      gridHeader: '',
      gridHeader:gridHeader,
      gridBody: gridBody,
      gridFooter: '',
      //新建、编辑弹出框扩展组件
@@ -17,32 +18,32 @@
    },
    tableAction: '', //指定某张表的权限(这里填写表名,默认不用填写)
    buttons: { view: [
       {
        name: '组盘',
        type: 'primary',
        value: '组盘',
        onClick: function () { // ä¿®å¤1：移除无用row参数，加日志调试
          console.log('组盘按钮被点击，开始校验');
          const selectedRows = this.$refs.table.getSelected();
      //  {
      //   name: '组盘',
      //   type: 'primary',
      //   value: '组盘',
      //   onClick: function () { // ä¿®å¤1：移除无用row参数，加日志调试
      //     console.log('组盘按钮被点击，开始校验');
      //     const selectedRows = this.$refs.table.getSelected();

          // æ ¡éªŒ1：是否选中行
          if (selectedRows.length === 0) {
            console.log('校验不通过：未选中任何单据');
            ElMessage.warning('请选择一条单据');
            return;
          }
          // æ ¡éªŒ2：是否选中单行
          if (selectedRows.length > 1) {
            console.log('校验不通过：选中多行单据');
            ElMessage.warning('只能选择一条单据');
            return;
          }
      //     // æ ¡éªŒ1：是否选中行
      //     if (selectedRows.length === 0) {
      //       console.log('校验不通过：未选中任何单据');
      //       ElMessage.warning('请选择一条单据');
      //       return;
      //     }
      //     // æ ¡éªŒ2：是否选中单行
      //     if (selectedRows.length > 1) {
      //       console.log('校验不通过：选中多行单据');
      //       ElMessage.warning('只能选择一条单据');
      //       return;
      //     }

          const targetRow = selectedRows[0];
      //     const targetRow = selectedRows[0];
     
          this.$emit('openPalletDialog', targetRow.orderNo);
        }
      },
      //     this.$emit('openPalletDialog', targetRow.orderNo);
      //   }
      // },
      {
                name: '撤销组盘',
                type: 'primary',
@@ -421,7 +422,18 @@
          this.$refs.gridBody.open(row);
        }
      });

      var GroupPalletBtn = this.buttons.find(x => x.value == "GroupPallet");
        if (GroupPalletBtn != null) {
          GroupPalletBtn.onClick = () => {
              // console.log(this.$refs)
               this.$refs.gridHeader.open();
            }
        }


      },
      
      onInited() {
        
        //框架初始化配置后

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/inbound/extend/AllcatedPallet.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1124 @@
<template>
  <vol-box v-model="show" :title="'组盘操作 - å•æ®å·ï¼š' + orderNo" :height="1000" :width="1100" :padding="20" :modal="true">
    <div class="barcode-scanner-container">

      <!-- ä»“库选择 - ç´§å‡‘布局 -->
      <div class="location-section compact">
        <el-form :model="form" :rules="rules" ref="locationForm" class="compact-form">
          <el-form-item label="入库仓库" prop="warehouseType" class="location-select compact-item">
            <el-select v-model="form.warehouseType" placeholder="请选择仓库" clearable filterable
              @change="handleWarehouseChange" style="width: 100%" :loading="warehouseLoading" size="medium">
              <el-option v-for="item in warehouseTypes" :key="item.warehouseType" :label="item.warehouseTypeDesc"
                :value="item.warehouseType" />
            </el-select>
          </el-form-item>
        </el-form>
      </div>

      <!-- ä»“库区域选择 - ç´§å‡‘布局 -->
      <div class="location-section compact">
        <el-form :model="form" :rules="rules" ref="locationForm" class="compact-form">
          <el-form-item label="仓库区域" prop="locationType" class="location-select compact-item">
            <el-select v-model="form.locationType" placeholder="请先选择仓库" clearable filterable
              @change="handleLocationChange" style="width: 100%" :loading="locationLoading" size="medium">
              <el-option v-for="item in locationTypes" :key="item.locationType" :label="item.locationTypeDesc"
                :value="item.locationType" />
            </el-select>
          </el-form-item>
        </el-form>
      </div>

      <!-- æ‰˜ç›˜ä¿¡æ¯æ˜¾ç¤º - ç´§å‡‘布局 -->
      <div class="tray-info compact" v-if="trayBarcode">
        <i class="el-icon-s-management"></i> å½“前料箱: {{ trayBarcode }}
        <span class="location-info" v-if="form.warehouseType">
          | ä»“库: {{ currentWarehouseName }}
        </span>
        <span class="location-info" v-if="form.locationType">
          | ä»“库区域: {{ currentLocationDesc }}
        </span>
      </div>

      <!-- æ‰«ç åŒºåŸŸ - ç´§å‡‘布局 -->
      <div class="input-section compact">
        <el-card shadow="hover" class="compact-card">
          <div slot="header" class="compact-header">
            <span><i class="el-icon-scanner"></i> æ‰«ç åŒºåŸŸ</span>
            <span class="scan-status">
              <span class="scan-indicator"></span>
              {{ form.locationType && form.warehouseType ? '扫码就绪' : '请先选择仓库和仓库区域' }}
            </span>
          </div>

          <!-- æ‰˜ç›˜æ¡ç è¾“å…¥ -->
          <div class="input-wrapper custom-input-group compact-input">
            <div class="input-label">托盘条码</div>
            <el-input ref="trayInput" v-model="trayBarcode" placeholder="请扫描或输入料箱码后按回车键" clearable
              :disabled="!form.locationType || !form.warehouseType" @keyup.enter.native="handleTraySubmit"
              @clear="handleTrayClear" @input="handleTrayInput" class="custom-input" size="medium">
              <template slot="append">
                <el-button @click="handleTraySubmit" type="primary" icon="el-icon-position"
                  :disabled="!form.locationType || !trayBarcode || !form.warehouseType" size="medium">
                  ç¡®è®¤
                </el-button>
              </template>
            </el-input>
          </div>

          <!-- ç‰©æ–™æ¡ç è¾“å…¥ -->
          <div class="input-wrapper custom-input-group compact-input">
            <div class="input-label">物料条码</div>
            <el-input ref="barcodeInput" v-model="barcode" placeholder="请扫描或输入物料条码后按回车键" clearable
              :disabled="!form.locationType || !trayBarcode || !form.warehouseType"
              @keyup.enter.native="handleBarcodeSubmit" @clear="handleClear" @input="handleBarcodeInput"
              class="custom-input" size="medium">
              <template slot="append">
                <el-button :loading="loading" @click="handleBarcodeSubmit" type="primary" icon="el-icon-search"
                  :disabled="!form.locationType || !trayBarcode || !barcode || !from.warehouseType" size="medium">
                  {{ loading ? '查询中...' : '查询' }}
                </el-button>
              </template>
            </el-input>
          </div>

          <div class="input-tips compact-tips">
            <p>提示：请先选择仓库 â†’ é€‰æ‹©ä»“库区域 â†’ è¾“入料箱码 â†’ è¾“入物料条码</p>
            <p v-if="!form.warehouseType" class="warning-text">⚠️ è¯·å…ˆé€‰æ‹©ä»“库</p>
            <p v-if="!form.locationType && !form.warehouseType" class="warning-text">⚠️ è¯·å…ˆé€‰æ‹©ä»“库区域</p>
            <p v-if="form.warehouseType && form.locationType && !trayBarcode" class="warning-text">⚠️ è¯·å…ˆè¾“入料箱码</p>
          </div>

        </el-card>
      </div>

      <!-- åŠ è½½çŠ¶æ€ -->
      <div v-if="loading" class="loading compact">
        <el-progress :percentage="100" status="success" :show-text="false" />
        <p>正在查询物料信息...</p>
      </div>

      <!-- é”™è¯¯æç¤º -->
      <div v-if="error" class="error-message compact">
        <el-alert :title="error" type="error" show-icon closable @close="error = ''" />
      </div>

      <!-- æœªç»„盘列表 -->
      <div class="unpallet-section compact">
        <el-card shadow="hover" class="compact-card unpallet-card">
          <div slot="header" class="compact-header">
            <span><i class="el-icon-tickets"></i> æœªç»„盘条码</span>
            <span class="list-actions">
              <el-tag type="primary" size="small">未组盘 {{ totalStockCount }}</el-tag>
            </span>
          </div>


          <div class="table-container">
            <el-table :data="unpalletMaterials" stripe style="width: 100%" height="100%" size="small"
              v-loading="unpalletBarcodesLoading">
              <el-table-column type="index" label="序号" width="60" align="center"></el-table-column>
              <el-table-column prop="barcode" label="条码" min-width="140" show-overflow-tooltip></el-table-column>
              <el-table-column prop="materielCode" label="物料编码" min-width="150" show-overflow-tooltip></el-table-column>
              <el-table-column prop="batchNo" label="批次" min-width="150" show-overflow-tooltip></el-table-column>
              <el-table-column prop="orderQuantity" label="数量" min-width="130" align="right"></el-table-column>
              <el-table-column prop="unit" label="单位" width="80" align="center"></el-table-column>
              <el-table-column prop="supplyCode" label="供应商" min-width="130" show-overflow-tooltip></el-table-column>
            </el-table>
          </div>
        </el-card>

      </div>

      <!-- ç‰©æ–™åˆ—表 - å›ºå®šé«˜åº¦å¸¦æ»šåŠ¨æ¡ -->
      <div class="material-list compact">
        <el-card shadow="hover" class="compact-card">
          <div slot="header" class="compact-header">
            <span><i class="el-icon-tickets"></i> ç»„盘数据</span>
            <span class="list-actions">
              <el-tag type="primary" size="small">共 {{ materials.length }} æ¡</el-tag>
              <el-tag type="primary" size="small">未入库数量 {{ totalStockSum }}{{ uniqueUnit }}</el-tag>
              <el-tag v-if="trayBarcode" type="success" size="small">托盘: {{ trayBarcode }}</el-tag>
              <el-tag v-if="form.warehouseType" type="info" size="small">仓库: {{ currentWarehouseName }}</el-tag>
              <el-tag v-if="form.locationType" type="info" size="small">区域: {{ currentLocationDesc }}</el-tag>
            </span>
          </div>

          <div v-if="materials.length === 0" class="empty-state compact">
            <i class="el-icon-document"></i>
            <p v-if="!form.warehouseType">请先选择仓库</p>
            <p v-if="!form.locationType">请先选择仓库区域</p>
            <p v-else-if="!trayBarcode">请先输入料箱条码</p>
            <p v-else>暂无物料数据，请扫描或输入物料条码</p>
          </div>

          <div class="table-container" v-else>
            <el-table :data="materials" stripe style="width: 100%" height="100%" size="small">
              <el-table-column type="index" label="序号" width="60" align="center"></el-table-column>
              <el-table-column prop="barcode" label="条码" min-width="140" show-overflow-tooltip></el-table-column>
              <el-table-column prop="materielCode" label="物料编码" min-width="150" show-overflow-tooltip></el-table-column>
              <el-table-column prop="batchNo" label="批次" min-width="150" show-overflow-tooltip></el-table-column>
              <el-table-column prop="stockQuantity" label="数量" min-width="130" align="right"></el-table-column>
              <el-table-column prop="unit" label="单位" width="80" align="center"></el-table-column>
              <el-table-column prop="supplyCode" label="供应商" min-width="130" show-overflow-tooltip></el-table-column>
              <el-table-column prop="warehouseType" label="仓库" min-width="120" show-overflow-tooltip></el-table-column>
            </el-table>
          </div>
        </el-card>
      </div>
    </div>
    <template #footer>
      <el-button type="danger" size="small" @click="handleDialogClose()">关闭</el-button>
    </template>
  </vol-box>
</template>
<script>
import http from '@/api/http.js';
import VolBox from '@/components/basic/VolBox.vue';

export default {
  components: { VolBox },
  data() {
    return {
      show: false,
      orderNo: "",
      palletVisible: this.visible,
      trayBarcodeReg: /^[A-Z]\d{9}$/,
      trayBarcode: '',
      barcode: '',
      materials: [],
      loading: false,
      error: '',
      debugMode: false,
      currentFocus: 'warehouse',

      unpalletBarcodes: [],
      unpalletBarcodesLoading: false,
      unpalletMaterials: [], // æœªç»„盘详细数据列表

      // æ‰«ç æžªç›¸å…³å˜é‡
      scanCode: '',
      lastKeyTime: null,
      isManualInput: false,
      isScanning: false,
      scanTimer: null,
      manualInputTimer: null,
      scanTarget: 'tray', // å½“前扫码目标: tray æˆ– material

      // åº“存统计相关变量
      totalStockSum: 0,
      totalStockCount: 0,
      uniqueUnit: '',
      sumLoading: false,
      sumError: '',
      // ä»“库相关变量
      warehouseTypes: [],
      warehouseLoading: false,
      // ä»“库区域相关变量
      locationTypes: [],
      locationLoading: false,
      form: {
        warehouseType: null,
        locationType: null
      },
      rules: {
        locationType: [
          {
            validator: this.validateLocationType,
            trigger: 'change'
          }
        ],
        trayBarcode: [
          {
            pattern: this.trayBarcodeReg,
            message: '托盘号格式错误（需为1个大写字母+9个数字，如A000008024）',
            trigger: 'blur'
          }
        ],
        warehouseType: [
          {
            message: '请选择仓库',
            trigger: 'change'
          }
        ]
      }
    }
  },

  computed: {
    // å½“前选择的仓库名称
    currentWarehouseName() {
      const warehouse = this.warehouseTypes.find(item => item.warehouseType === this.form.warehouseType);
      return warehouse ? warehouse.warehouseTypeDesc : '';
    },
    // å½“前选择的仓库区域描述
    currentLocationDesc() {
      const location = this.locationTypes.find(item => item.locationType === this.form.locationType)
      return location ? location.locationTypeDesc : ''
    }
  },
  watch: {
    visible(newVal, oldVal) {
      this.palletVisible = newVal;

      // å½“从 false å˜ä¸º true æ—¶ï¼Œè¡¨ç¤ºå¼¹æ¡†æ‰“å¼€
      if (newVal === true && oldVal === false) {
        console.log('弹框打开，重置数据');
        this.resetData();
        this.$nextTick(() => {
          setTimeout(() => {
            this.fetchUnpalletMaterialDetails();
          }, 300);
        });
      }

      // å½“从 true å˜ä¸º false æ—¶ï¼Œè¡¨ç¤ºå¼¹æ¡†å…³é—­
      if (newVal === false && oldVal === true) {
        console.log('弹框关闭，重置数据');
        this.resetData();
      }
    },
    palletVisible(newVal) {
      this.$emit('update:visible', newVal);
    },
    docNo(newVal) {
      if (newVal) {
        this.palletForm = { palletCode: '', barcode: '' };
        this.backData = [];
        this.$refs.palletForm?.reset();
        this.fetchUnpalletMaterialDetails();
      }
    }
  },
  mounted() {
    document.addEventListener('keypress', this.handleKeyPress);
  },
  beforeDestroy() {
    document.removeEventListener('keypress', this.handleKeyPress);
    this.clearAllTimers();
  },
  methods: {
    open() {
      this.show = true;
      this.orderNo = "";
      this.resetData();
      this.initLocationTypes();
      this.initwarehouseTypes();
      this.fetchUnpalletMaterialDetails();
    },
    validateLocationType(rule, value, callback) {
      if (!this.form.warehouseType) {
        callback(new Error('请先选择仓库'));
      } else if (value === null || value === undefined || value === '') {
        callback(new Error('请选择仓库区域'));
      } else {
        callback();
      }
    },

    // æ ¹æ®æ¡ç åˆ—表获取详细数据
    async fetchUnpalletMaterialDetails() {
      try {
        const response = await http.post('/api/InboundOrder/UnPalletGroupBarcode?orderNo=' + this.orderNo, {});
        if (response.status && Array.isArray(response.data)) {
          this.unpalletMaterials = response.data;
          this.unpalletBarcodes = response.data.map(item => item.barcode || '');
          this.totalStockCount = response.data.length;
        } else {
          this.unpalletMaterials = [];
        }
      } catch (err) {
        this.unpalletMaterials = this.unpalletBarcodes.map(barcode => ({
          barcode: barcode,
          materielCode: '-',
          batchNo: '-',
          stockQuantity: '-',
          unit: '-',
          supplyCode: '-',
          warehouseType: '-'
        }));
      }
    },
    async initLocationTypes() {
      try {
        const { data } = await this.http.post("api/LocationInfo/GetLocationTypes")
        this.locationTypes = data
      } catch (e) {
        this.$message.error('获取区域类型失败')
      }
    },
    async initwarehouseTypes() {
      try {
        const { data } = await this.http.post("api/Warehouse/GetwarehouseTypes")
        this.warehouseTypes = data
      } catch (e) {
        this.$message.error('获取区域类型失败')
      }
    },

    async fetchStockStatistics(orderNo) {
      // å•æ®å·ä¸ºç©ºæ—¶ä¸æŸ¥è¯¢
      if (!orderNo) {
        this.sumError = '单据号为空，无法统计';
        return;
      }

      this.sumLoading = true;
      this.sumError = '';
      try {
        const response = await http.post('/api/InboundOrder/UnPalletQuantity?orderNo=' + orderNo, {});
        if (response.data) {
          this.totalStockSum = response.data.stockSumQuantity || 0;
          this.totalStockCount = response.data.stockCount || 0;
          this.uniqueUnit = response.data.uniqueUnit || '';
        }
      } catch (err) {
        this.sumError = '统计加载失败';
        this.totalStockSum = 0;
        this.totalStockCount = 0;
      } finally {
        this.sumLoading = false;
      }
    },

    async validateForm() {
      return new Promise((resolve) => {
        if (!this.$refs.locationForm) {
          this.error = '表单未初始化';
          this.$message.warning('请先选择仓库区域');
          resolve(false);
          return;
        }

        this.$refs.locationForm.validate((valid) => {
          if (valid) {
            this.error = '';
            resolve(true);
          } else {
            if (!this.from.warehouseType) {
              this.error = '请先选择仓库';
            }
            else if (this.form.locationType === null || this.form.locationType === undefined || this.form.locationType === '') {
              this.error = '请先选择仓库区域';
            } else {
              this.error = '请检查表单填写是否正确';
            }
            resolve(false);
          }
        });
      });
    },
    // èšç„¦åˆ°æ‰˜ç›˜è¾“入框
    focusTrayInput() {
      if (this.$refs.trayInput && this.$refs.trayInput.$el) {
        const inputEl = this.$refs.trayInput.$el.querySelector('input');
        if (inputEl) {
          inputEl.focus();
          this.currentFocus = 'tray';
          this.scanTarget = 'tray';
          inputEl.select();
        }
      }
    },

    // èšç„¦åˆ°ç‰©æ–™è¾“入框
    focusBarcodeInput() {
      if (this.$refs.barcodeInput && this.$refs.barcodeInput.$el) {
        const inputEl = this.$refs.barcodeInput.$el.querySelector('input');
        if (inputEl) {
          inputEl.focus();
          this.currentFocus = 'material';
          this.scanTarget = 'material';
          inputEl.select();
        }
      }
    },
    // é‡ç½®æ‰€æœ‰æ•°æ®
    resetData() {
      this.trayBarcode = '';
      this.barcode = '';
      this.materials = [];
      this.unpalletBarcodes = [];
      this.unpalletMaterials = [];
      this.loading = false;
      this.error = '';
      this.scanCode = '';
      this.lastKeyTime = null;
      this.isManualInput = false;
      this.isScanning = false;
      this.currentFocus = 'warehouse';
      this.scanTarget = 'tray';
      this.clearAllTimers();
      this.totalStockSum = 0;
      this.totalStockCount = 0;
      this.sumLoading = false;
      this.sumError = '';
      this.form = {
        warehouseType: null,
        locationType: null
      }
      this.warehouseTypes = [];
      this.locationTypes = [];
      // æ¸…除表单验证状态
      this.$nextTick(() => {
        if (this.$refs.locationForm) {
          this.$refs.locationForm.clearValidate();
        }
      });
    },

    // æ¸…除所有计时器
    clearAllTimers() {
      if (this.manualInputTimer) {
        clearTimeout(this.manualInputTimer);
        this.manualInputTimer = null;
      }
      if (this.scanTimer) {
        clearTimeout(this.scanTimer);
        this.scanTimer = null;
      }
    },
    handleDialogClose() {
      this.show = false;
      this.resetData();
    },

    // ç¡®è®¤æŒ‰é’®
    async handleConfirm() {
      if (!await this.validateForm()) return;

      if (this.materials.length === 0) {
        this.$message.warning('请至少添加一个物料');
        return;
      }

      if (!this.trayBarcode) {
        this.$message.warning('请输入托盘条码');
        return;
      }

      const result = {
        warehouseType: this.form.warehouseType,
        warehouseName: this.currentWarehouseName,
        locationType: this.form.locationType,
        locationDesc: this.currentLocationDesc,
        trayBarcode: this.trayBarcode,
        materials: this.materials,
        docNo: this.docNo
      };

      // è§¦å‘父组件的 back-success äº‹ä»¶
      this.$emit('back-success', result);
      this.palletVisible = false;
    },
    // å¤„理托盘输入
    handleTrayInput() {
      // æ ‡è®°ä¸ºæ‰‹åŠ¨è¾“入模式
      this.isManualInput = true;
      this.isScanning = false;

      // æ¸…除之前的计时器
      if (this.manualInputTimer) {
        clearTimeout(this.manualInputTimer);
      }

      // è®¾ç½®è®¡æ—¶å™¨ï¼Œå¦‚果一段时间内没有输入，则重置为扫码模式
      this.manualInputTimer = setTimeout(() => {
        this.isManualInput = false;
      }, 1000);
    },

    // å¤„理物料输入
    handleBarcodeInput() {
      // æ ‡è®°ä¸ºæ‰‹åŠ¨è¾“入模式
      this.isManualInput = true;
      this.isScanning = false;

      // æ¸…除之前的计时器
      if (this.manualInputTimer) {
        clearTimeout(this.manualInputTimer);
      }

      // è®¾ç½®è®¡æ—¶å™¨ï¼Œå¦‚果一段时间内没有输入，则重置为扫码模式
      this.manualInputTimer = setTimeout(() => {
        this.isManualInput = false;
      }, 1000);
    },

    // å¤„理托盘条码提交
    async handleTraySubmit() {
      // å…ˆç›´æŽ¥æ£€æŸ¥locationType，避免表单验证的异步问题
      if (!this.form.warehouseType) {
        this.error = '请先选择仓库';
        return;
      }
      if (!this.form.locationType) {
        this.error = '请先选择仓库区域';
        //this.$message.warning('请先选择仓库区域');
        return;
      }

      // ç„¶åŽå†è¿›è¡Œå®Œæ•´çš„表单验证
      if (!await this.validateForm()) return;

      const currentTrayBarcode = this.trayBarcode.trim();

      if (!currentTrayBarcode) {
        this.error = '请输入或扫描托盘条码';
        return;
      }

      this.error = '';

      if (!this.trayBarcodeReg.test(currentTrayBarcode)) {
        // ElMessage.warning({
        //   message: '托盘号格式错误',
        //   type: 'warning',
        //   duration: 3000
        // })
        this.$message("托盘号格式错误");
        this.focusTrayInput();
        return;
      }

      // è®¾ç½®æ‰˜ç›˜æ¡ç åŽï¼Œè‡ªåŠ¨èšç„¦åˆ°ç‰©æ–™è¾“入框
      this.focusBarcodeInput();

      // this.$message({
      //   message: `托盘条码已设置: ${currentTrayBarcode}`,
      //   type: 'success',
      //   duration: 2000
      // });
      this.$message.success(`托盘条码已设置: ${currentTrayBarcode}`);
    },

    // æ¸…除托盘
    clearTray() {
      this.trayBarcode = '';
      this.materials = [];
      this.focusTrayInput();
      this.$message({
        message: '托盘条码已清除',
        type: 'info',
        duration: 2000
      });
    },

    // æ¸…空托盘输入
    handleTrayClear() {
      this.error = '';
    },

    // æ¸…空输入
    handleClear() {
      this.error = '';
      this.scanCode = '';
      this.isManualInput = false;
      this.isScanning = false;
    },


    // å¤„理物料条码提交
    async handleBarcodeSubmit() {
      if (!await this.validateForm()) return;
      const currentBarcode = this.barcode.trim();

      if (!this.trayBarcode) {
        this.error = '请先输入托盘条码';
        this.focusTrayInput();
        return;
      }

      if (!currentBarcode) {
        this.error = '请输入或扫描物料条码';
        return;
      }

      this.focusBarcodeInput();
      this.error = '';
      this.loading = true;

      try {
        // è°ƒç”¨API查询物料信息
        const materialData = await this.fetchMaterialData(currentBarcode);
        if (!materialData || materialData.length === 0) {
          return;
        }

        this.materials = [];
        materialData.forEach(item => {
          this.materials.push({
            ...item,
            trayCode: this.trayBarcode,
            locationType: this.form.locationType,
            locationDesc: this.currentLocationDesc,
            scanTime: this.formatTime(new Date())
          });
        });
        this.orderNo = materialData[0].orderNo;
        await this.fetchStockStatistics(materialData[0].orderNo);
        await this.fetchUnpalletMaterialDetails();
        // æ¸…空物料输入框并保持聚焦
        this.barcode = '';
        this.scanCode = ''; // æ¸…空扫码缓存
        this.isScanning = false;

        setTimeout(() => {
          this.focusBarcodeInput();
        }, 100);
      } catch (err) {
        this.error = err.message || '查询条码信息失败，请重试';
        this.focusBarcodeInput();
        setTimeout(() => {
          // é€‰ä¸­è¾“入框内的错误内容（确保focus完成后执行）
          const inputEl = this.$refs.barcodeInput?.$el?.querySelector('input');
          if (inputEl) inputEl.select();
        }, 100);
      } finally {
        this.loading = false;
      }
    },

    // API请求 - æ›¿æ¢ä¸ºå®žé™…çš„API调用
    async fetchMaterialData(barcode) {
      try {
        const response = await http.post('/api/Inbound/GroupPallet',
          {
            palletCode: this.trayBarcode,
            barcode: barcode,
            locationTypeDesc: this.currentLocationDesc,
            locationType: this.form.locationType, // æ·»åŠ ä»“库区域信息
            warehouseType: this.form.warehouseType
          }
        );
        let materialData;

        if (typeof response.data === 'string') {

          try {
            materialData = JSON.parse(response.data);
          } catch (e) {

          }
        } else {
          materialData = response.data;
        }
        if (!response.status) {
          this.error = response.message || '查询条码信息失败，请重试';
        }

        return materialData;

      } catch (error) {
        console.error('API调用失败:', error);
      }
    },

    // å¤„理扫码枪输入
    handleKeyPress(event) {
      // å¦‚果是手动输入模式，不处理扫码枪逻辑
      if (this.isManualInput) {
        return;
      }

      const key = event.key;
      const currentTime = new Date().getTime();

      // å¿½ç•¥ç›´æŽ¥æŒ‰ä¸‹çš„回车键（由handleBarcodeSubmit处理）
      if (key === 'Enter') {
        if (this.scanCode.length > 0) {
          // é˜»æ­¢é»˜è®¤å›žè½¦è¡Œä¸ºï¼Œé¿å…è¡¨å•æäº¤
          event.preventDefault();

          // æ‰«ç å®Œæˆï¼Œè‡ªåŠ¨è§¦å‘查询
          this.isScanning = false;

          // æ ¹æ®å½“前扫码目标设置相应的输入框值
          if (this.scanTarget === 'tray') {
            this.trayBarcode = this.scanCode;
            this.handleTraySubmit();
          } else if (this.scanTarget === 'material') {
            this.barcode = this.scanCode;
            this.handleBarcodeSubmit();
          }
        }
        this.scanCode = '';
        this.lastKeyTime = null;
        return;
      }

      // æž„建扫码内容（快速连续输入视为扫码）
      if (this.lastKeyTime && currentTime - this.lastKeyTime < 50) {
        this.scanCode += key;
        this.isScanning = true;
      } else {
        this.scanCode = key;
        this.isScanning = true;
      }

      // è®¾ç½®è®¡æ—¶å™¨ï¼Œå¦‚果一段时间内没有输入，则重置扫描状态
      if (this.scanTimer) {
        clearTimeout(this.scanTimer);
      }
      this.scanTimer = setTimeout(() => {
        this.isScanning = false;
      }, 100);

      this.lastKeyTime = currentTime;
    },

    // æ ¼å¼åŒ–时间
    formatTime(date) {
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, '0');
      const day = String(date.getDate()).padStart(2, '0');
      const hours = String(date.getHours()).padStart(2, '0');
      const minutes = String(date.getMinutes()).padStart(2, '0');
      const seconds = String(date.getSeconds()).padStart(2, '0');

      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    }
  }
}
</script>

<style scoped>
.barcode-scanner-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px;
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 8px;
}

/* ç´§å‡‘布局样式 */
.compact {
  margin-bottom: 0;
}

.compact-form {
  margin-bottom: 0;
}

.compact-item {
  margin-bottom: 0;
}

.compact-card {
  margin-bottom: 0;
}

.compact-card>>>.el-card__body {
  padding: 12px;
}

.compact-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 !important;
}

.compact-header>>>.el-card__header {
  padding: 8px 12px;
}

.compact-input {
  margin: 8px 0;
}

.compact-tips {
  margin-top: 8px;
  font-size: 11px;
}

/* ä»“库区域选择 - ç´§å‡‘ */
.location-section.compact {
  margin-bottom: 8px;
}

.location-section.compact>>>.el-form-item {
  margin-bottom: 0;
}

/* æ‰˜ç›˜ä¿¡æ¯ - ç´§å‡‘ */
.tray-info.compact {
  padding: 6px 10px;
  margin-bottom: 8px;
  font-size: 13px;
}

/* æ‰«ç åŒºåŸŸ - ç´§å‡‘ */
.input-section.compact {
  margin-bottom: 8px;
  flex-shrink: 0;
}

/* ç‰©æ–™åˆ—表 - å›ºå®šé«˜åº¦å¸¦æ»šåŠ¨ */
.material-list.compact {
  flex: 1;
  min-height: 0;
  /* é‡è¦ï¼šå…è®¸flex子项收缩 */
  display: flex;
  flex-direction: column;
}

.material-list.compact>>>.el-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.material-list.compact>>>.el-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0;
  min-height: 0;
}

.table-container {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.material-list.compact>>>.el-table {
  flex: 1;
}

.material-list.compact>>>.el-table__body-wrapper {
  overflow-y: auto;
}

/* ç´§å‡‘的空状态 */
.empty-state.compact {
  padding: 20px 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.empty-state.compact i {
  font-size: 36px;
  margin-bottom: 8px;
}

.empty-state.compact p {
  font-size: 13px;
}

/* å…¶ä»–原有样式调整 */
.page-title {
  text-align: center;
  margin-bottom: 15px;
}

.scan-status {
  font-size: 12px;
  color: #67C23A;
}

.scan-indicator {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #67C23A;
  margin-right: 5px;
  animation: pulse 1.5s infinite;
}

@keyframes pulse {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.4;
  }

  100% {
    opacity: 1;
  }
}

.input-wrapper {
  position: relative;
}

.input-tips {
  margin-top: 6px;
  color: #909399;
}

.warning-text {
  color: #E6A23C;
  font-weight: bold;
}

.loading.compact {
  text-align: center;
  margin: 10px 0;
  padding: 5px;
}

.loading.compact p {
  margin-top: 5px;
  color: #409EFF;
  font-size: 12px;
}

.error-message.compact {
  margin: 5px 0;
}

.error-message.compact>>>.el-alert {
  padding: 6px 12px;
}

.list-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}

.list-actions>>>.el-tag {
  height: 24px;
  line-height: 22px;
  padding: 0 6px;
}

.clear-all-btn {
  margin-left: 8px;
}

.material-code {
  font-family: 'Courier New', monospace;
  font-weight: bold;
  color: #409EFF;
}

.location-info {
  color: #606266;
  font-weight: normal;
}

.debug-info {
  background: #f5f7fa;
  padding: 8px;
  border-radius: 4px;
  margin-top: 8px;
  font-size: 11px;
  color: #909399;
}

.small-button {
  padding: 6px 8px;
  font-size: 11px;
}

/* è¾“入框组样式调整 */
.custom-input-group {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 8px 0;
  border: 1px solid #DCDFE6;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}

.input-label {
  padding: 0 12px;
  background: #F5F7FA;
  border-right: 1px solid #DCDFE6;
  color: #606266;
  font-size: 13px;
  white-space: nowrap;
  height: 36px;
  line-height: 36px;
  flex-shrink: 0;
  min-width: 70px;
  text-align: center;
}

.input-container {
  display: flex;
  flex: 1;
  align-items: center;
}

.custom-input {
  flex: 1;
}

.custom-input>>>.el-input__inner {
  border: none;
  border-radius: 0;
  height: 36px;
  line-height: 36px;
  font-size: 13px;
}

/* å“åº”式调整 */
@media (max-width: 768px) {
  .barcode-scanner-container {
    padding: 5px;
  }

  .custom-input-group {
    flex-direction: column;
    border: none;
  }

  .input-label {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #DCDFE6;
    margin-bottom: 5px;
  }

  .input-container {
    width: 100%;
    border: 1px solid #DCDFE6;
    border-radius: 4px;
  }

  .unpallet-section.compact {
    margin-bottom: 8px;
    flex-shrink: 0;
  }

  .unpallet-card {
    flex-shrink: 0;
  }

  .unpallet-barcode-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 0;
    max-height: 180px;
    overflow-y: auto;
  }

  .unpallet-barcode-list>>>.el-tag {
    cursor: pointer;
    max-width: calc(33.333% - 4px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  @media (max-width: 768px) {
    .unpallet-barcode-list>>>.el-tag {
      max-width: calc(50% - 4px);
    }
  }
}
</style>

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/inbound/extend/allocateOrderDetail.vue

@@ -1,12 +1,6 @@
<template>
  <div> 
    <vol-box
      v-model="showDetialBox"
      :lazy="true"
      width="75%"
      height="80%"
      title="单据明细信息"
    >
  <div>
    <vol-box v-model="showDetialBox" :lazy="true" width="75%" :padding="15" title="单据明细信息">
      <div class="box-head">
        <el-alert :closable="false" style="width: 100%">
          <el-row>
@@ -14,84 +8,44 @@
              <span>已选中 {{ selection.length }} é¡¹</span>
            </el-col>
            <el-col :span="8">
          <!--     <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px"
                @click="lockstocks"
                >锁定库存</el-link> -->

              <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px"
                @click="handleOpenPicking"
                >拣选</el-link>
                 
  <!--             <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px; margin-right: 10px"
                @click="outbound"
                >直接出库</el-link
              > -->
              <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px; margin-right: 10px"
                @click="getData"
                >刷新</el-link
              ></el-col
            >
              <el-link type="primary" size="small" v-if="isBatch === 0" style="float: right; height: 20px"
                @click="handleOpenPicking">拣选</el-link>
              <el-link type="primary" size="small" style="float: right; height: 20px; margin-right: 10px"
                v-if="isBatch === 1" @click="handleOpenBatchPicking">分批拣选</el-link>
              <el-link type="primary" size="small" v-if="isBatch === 0"
                style="float: right; height: 20px; margin-right: 10px" @click="outbound">直接出库</el-link>
              <el-link type="primary" size="small" v-if="isBatch === 1"
                style="float: right; height: 20px; margin-right: 10px" @click="outboundbatch">分批出库</el-link>
              <el-link type="primary" size="small" style="float: right; height: 20px; margin-right: 10px"
                @click="getData">刷新</el-link>
            </el-col>
          </el-row>
        </el-alert>
      </div>
      <div class="box-table" style="margin-top: 1%">
        <el-table
          ref="singleTable"
          :data="tableData"
          style="width: 100%; height: 100%"
          highlight-current-row
          @current-change="handleCurrentChange"
          height="500px"
          @row-click="handleRowClick"
          @selection-change="handleSelectionChange"
        >
        <el-table ref="singleTable" :data="tableData" style="width: 100%; height: 100%" highlight-current-row
          @current-change="handleCurrentChange" height="500px" @row-click="handleRowClick"
          @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55"> </el-table-column>
          <el-table-column
            label="序号"
            type="index"
            fixed="left"
            width="55"
            align="center"
          ></el-table-column>
          <el-table-column
            v-for="(item, index) in tableColumns.filter((x) => !x.hidden)"
            :key="index"
            :prop="item.prop"
            :label="item.title"
            :width="item.width"
            align="center"
          >
          <el-table-column label="序号" type="index" fixed="left" width="55" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in tableColumns.filter((x) => !x.hidden)" :key="index" :prop="item.prop"
            :label="item.title" :width="item.width" align="center">
            <template #default="scoped">
              <div v-if="item.type == 'icon'">
                <el-tooltip
                  class="item"
                  effect="dark"
                  :content="item.title"
                  placement="bottom"
                  ><el-link
                    type="primary"
                    :disabled="getButtonEnable(item.prop, scoped.row)"
                    @click="tableButtonClick(scoped.row, item)"
                    ><i :class="item.icon" style="font-size: 22px"></i></el-link
                ></el-tooltip>
                <el-tooltip class="item" effect="dark" :content="item.title" placement="bottom">
                  <el-link type="primary" :disabled="getButtonEnable(item.prop, scoped.row)"
                    @click="tableButtonClick(scoped.row, item)">
                    <i :class="item.icon" style="font-size: 22px"></i>
                  </el-link>
                </el-tooltip>
              </div>

              <div v-else-if="item.type == 'tag'">
                <el-tag size="small">
                  {{ getDictionary(scoped.row, item) }}
                </el-tag>
              </div>
              <div v-else>
                {{ scoped.row[item.prop] }}
              </div>
            </template>
          </el-table-column>
@@ -99,30 +53,39 @@
      </div>
    </vol-box>
    <stock-select ref="child" @parentCall="parentCall"></stock-select>
    <selected-stock
      ref="selectedStock"
      @parentCall="parentCall"
    ></selected-stock>
    <selected-stock ref="selectedStock" @parentCall="parentCall"></selected-stock>
  </div>
</template>

<script>
import VolBox from "@/components/basic/VolBox.vue";
import VolForm from "@/components/basic/VolForm.vue";
import StockSelect from "./AllocateStockSelect.vue";
import StockSelect from "./StockSelect.vue";
import SelectedStock from "./SelectedStock.vue";
import { h,createVNode, render,reactive  } from 'vue';
import { ElDialog , ElForm, ElFormItem, ElSelect,ElOption, ElButton, ElMessage } from 'element-plus';
import { stationManager, STATION_STORAGE_KEY } from "@/../src/uitils/stationManager";
import { h, createVNode, render, reactive } from "vue";
import {
  ElDialog,
  ElForm,
  ElFormItem,
  ElSelect,
  ElOption,
  ElButton,
  ElInput,
  ElMessage,
} from "element-plus";

export default {
  components: { VolBox, VolForm, StockSelect, SelectedStock },
  data() {
    return {
      row: null,
      isBatch: 0,
      showDetialBox: false,
      flag: false,
      currentRow: null,
      selection: [],
      tableData: [],
      mainBusinessType: null, // æ–°å¢žï¼šå­˜å‚¨ä¸»å•æ®çš„businessType
      tableColumns: [
        {
          prop: "id",
@@ -142,7 +105,7 @@
          prop: "materielCode",
          title: "物料编号",
          type: "string",
          width: 150,
          width: 120,
        },
        {
          prop: "materielName",
@@ -160,7 +123,7 @@
          prop: "supplyCode",
          title: "供应商编号",
          type: "string",
          width: 150,
          width: 90,
        },
        {
          prop: "orderQuantity",
@@ -181,25 +144,25 @@
          width: 90,
        },
        {
          prop: "moveQty",
          title: "挪料数量",
          type: "string",
          width: 90,
        },
        {
          prop: "unit",
          title: "单位",
          type: "string",
          width: 90,
          width: 80,
        },
        {
          prop: "orderDetailStatus",
          title: "订单明细状态",
          type: "tag",
          width: 180,
          width: 90,
          bindKey: "orderDetailStatusEnum",
        },
        {
          prop: "assignStock",
          title: "指定库存",
          type: "icon",
          width: 90,
          icon: "el-icon-s-grid",
        },
        
        {
          prop: "viewDetail",
          title: "出库详细",
@@ -242,9 +205,8 @@
        order: "desc",
        Foots: "",
        total: 0,
        // 2020.08.29增加自定义分页条大小
        sizes: [30, 60, 100, 120],
        size: 30, // é»˜è®¤åˆ†é¡µå¤§å°
        size: 30,
        Wheres: [],
        page: 1,
        rows: 30,
@@ -281,14 +243,27 @@
    };
  },
  methods: {
    toggleAssignStockColumn() {
      const assignStockColumn = this.tableColumns.find(
        (item) => item.prop === "assignStock"
      );
      if (assignStockColumn) {
        // businessType为22时显示，否则隐藏
        assignStockColumn.hidden = this.mainBusinessType !== '22';
      }
    },
    open(row) {
      this.row = row;
      this.showDetialBox = true;
      console.log("主单据数据：", this.row);
      this.isBatch = row.isBatch;
      this.mainBusinessType = row.businessType;
      this.getDictionaryData();
      this.getData();
      this.toggleAssignStockColumn();
    },
    getData() {
            var wheres = [{ name: "orderId", value: this.row.id }];
      var wheres = [{ name: "orderId", value: this.row.id }];
      var param = {
        page: this.paginations.page,
        rows: this.paginations.rows,
@@ -305,8 +280,9 @@
    tableButtonClick(row, column) {
      if (column.prop == "assignStock") {
        this.$refs.child.open(row);
      } else if (column.prop == "NoStockOut") {
        this.$refs.NoStockOut.open(row);
      } else {
        //点击打开
        this.$refs.selectedStock.open(row);
      }
    },
@@ -314,9 +290,9 @@
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      var keys = this.selection.map((item) => item.id); // èŽ·å–选中行的id
      var keys = this.selection.map((item) => item.id);
      this.http
        .post("api/AllocateOrderDetail/LockOutboundStocks", keys, "数据处理中")
        .post("api/OutboundOrderDetail/LockOutboundStocks", keys, "数据处理中")
        .then((x) => {
          if (!x.status) return this.$message.error(x.message);
          this.$message.success("操作成功");
@@ -326,152 +302,348 @@
          });
        });
    },
    // æ‰“开拣选页面
   handleOpenPicking() {
    handleOpenPicking() {
      this.$router.push({
        path: '/outbound/picking',
        query: { orderId: this.row.id ,orderNo:this.row.orderNo}
      })
        path: "/outbound/outPicking",
        query: { orderId: this.row.id, orderNo: this.row.orderNo },
      });
    },
    handleOpenBatchPicking() {
      this.$router.push({
        path: "/outbound/outPicking",
        query: { orderId: this.row.id, orderNo: this.row.orderNo },
      });
    },
    outbound() {
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      const platformOptions = [{label:'站台2',value:'2-1'},{label:'站台3',value:'3-1'}];
      const mountNode = document.createElement('div');
      const platformOptions = [
        { label: "站台2", value: "2-1" },
        { label: "站台3", value: "3-1" },
      ];
      const mountNode = document.createElement("div");
      document.body.appendChild(mountNode);

      // 2. è¡¨å•æ•°æ®ï¼ˆé»˜è®¤é€‰ä¸­ç«™å°3）
      const formData = reactive({
        selectedPlatform: platformOptions[0].value // é»˜è®¤ç»‘定「站台3」的value
        selectedPlatform: platformOptions[0].value,
      });
      const savedStation = stationManager.getStation();
      console.log(savedStation);
      if (savedStation) {
        formData.selectedPlatform = savedStation;
      } 

      // 3. åŠ¨æ€åˆ›å»ºå¼¹çª—组件
      const vnode = createVNode(ElDialog, {
        title: '出库操作 - é€‰æ‹©å‡ºåº“站台',
        width: '500px',
        modelValue: true,
        appendToBody: true,
        'onUpdate:modelValue': (isVisible) => {
          if (!isVisible) {
            render(null, mountNode);
            document.body.removeChild(mountNode);
          }
        }, 
        style: {
          padding: '20px 0',
          borderRadius: '8px'
        }
      }, {
        default: () => h(ElForm, {
          model: formData00,
          rules: {
            selectedPlatform: [
              { required: true, message: '请选择出库站台', trigger: 'change' }
            ]
      const vnode = createVNode(
        ElDialog,
        {
          title: "出库操作 - é€‰æ‹©å‡ºåº“站台",
          width: "500px",
          modelValue: true,
          appendToBody: true,
          "onUpdate:modelValue": (isVisible) => {
            if (!isVisible) {
              render(null, mountNode);
              document.body.removeChild(mountNode);
            }
          },
          ref: 'outboundForm',
          labelWidth: '100px',
          style: {
            padding: '0 30px'
          }
        }, [
          // å‡ºåº“站台选择项（核心表单项）
          h(ElFormItem, {
            label: '出库站台',
            prop: 'selectedPlatform',
            style: {
              marginBottom: '24px'
            }
          }, [
            h(ElSelect, {
              placeholder: '请选择出库站台（3-12）',
              modelValue: formData.selectedPlatform,
              'onUpdate:modelValue': (val) => {
                formData.selectedPlatform = val;
            padding: "20px 0",
            borderRadius: "8px",
          },
        },
        {
          default: () =>
            h(
              ElForm,
              {
                model: formData,
                rules: {
                  selectedPlatform: [
                    { required: true, message: "请选择出库站台", trigger: "change" },
                  ],
                },
                ref: "outboundForm",
                labelWidth: "100px",
                style: {
                  padding: "0 30px",
                },
              },
              style: {
                width: '100%',
                height: '40px',
                borderRadius: '4px',
                borderColor: '#dcdfe6'
              }
            }, platformOptions.map(platform => 
              h(ElOption, { label: platform.label, value: platform.value })
            ))
          ]),
          // åº•éƒ¨æŒ‰é’®åŒº
          h('div', {
            style: {
              textAlign: 'right',
              marginTop: '8px',
              paddingRight: '4px'
            }
          }, [
            h(ElButton, {
              type: 'text',
              onClick: () => {
                render(null, mountNode);
                document.body.removeChild(mountNode);
                ElMessage.info('取消出库操作');
              },
              style: {
                marginRight: '8px',
                color: '#606266'
              }
            }, '取消'),
            h(ElButton, {
              type: 'primary',
              onClick: async () => {
                const formRef = vnode.component.refs.outboundForm;
                try {
                  // è¡¨å•æ ¡éªŒ
                  await formRef.validate();
                } catch (err) {
                  return;
                }
              [
                h(ElFormItem, {
                  label: "出库站台",
                  prop: "selectedPlatform",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElSelect, {
                    placeholder: "请选择出库站台（3-12）",
                    modelValue: formData.selectedPlatform,
                    "onUpdate:modelValue": (val) => {
                      formData.selectedPlatform = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                  }, platformOptions.map((platform) =>
                    h(ElOption, { label: platform.label, value: platform.value })
                  )),
                ]),
                h("div", {
                  style: {
                    textAlign: "right",
                    marginTop: "8px",
                    paddingRight: "4px",
                  },
                }, [
                  h(ElButton, {
                    type: "text",
                    onClick: () => {
                      render(null, mountNode);
                      document.body.removeChild(mountNode);
                      ElMessage.info("取消出库操作");
                    },
                    style: {
                      marginRight: "8px",
                      color: "#606266",
                    },
                  }, "取消"),
                  h(ElButton, {
                    type: "primary",
                    onClick: async () => {
                      const formRef = vnode.component.refs.outboundForm;
                      try {
                        await formRef.validate();
                      } catch (err) {
                        return;
                      }

                // 4. æž„造请求参数（选中单据ID + é€‰æ‹©çš„出库站台）
                const keys = this.selection.map((item) => item.id);
                const requestParams = {
                  taskIds: keys,
                  outboundPlatform: formData.selectedPlatform // å‡ºåº“站台
                };
                      const keys = this.selection.map((item) => item.id);
                      const requestParams = {
                        detailIds: keys,
                        outboundTargetLocation: formData.selectedPlatform,
                        outboundQuantity: 1,
                        operator: "",
                        orderNo: this.row.orderNo,
                      };

                // 5. è°ƒç”¨å‡ºåº“接口
                this.http
                  .post("api/Task/GenerateOutboundTasks", requestParams, "数据处理中")
                  .then((x) => {
                    if (!x.status) return ElMessage.error(x.message);
                    
                    ElMessage.success("操作成功");
                    this.showDetialBox = false; // å…³é—­è¯¦æƒ…框
                    this.$emit("parentCall", ($vue) => {
                      $vue.getData(); // é€šçŸ¥çˆ¶ç»„件刷新
                    });
                    // å…³é—­å¼¹çª—
                    render(null, mountNode);
                    document.body.removeChild(mountNode);
                  })
                  .catch(() => {
                    ElMessage.error('请求失败，请稍后重试');
                  });
              },
              style: {
                borderRadius: '4px',
                padding: '8px 20px'
              }
            }, '确定出库')
          ])
        ])
                      this.http
                        .post(
                          "api/Outbound/ProcessPickingOutbound",
                          requestParams,
                          "数据处理中"
                        )
                        .then((x) => {
                          if (!x.status) return ElMessage.error(x.message);
                          ElMessage.success("操作成功");
                          this.showDetialBox = false;
                          this.$emit("parentCall", ($vue) => {
                            $vue.getData();
                          });
                          render(null, mountNode);
                          document.body.removeChild(mountNode);
                        })
                      // .catch(() => {
                      //   ElMessage.error("请求失败，请稍后重试");
                      // });
                    },
                    style: {
                      borderRadius: "4px",
                      padding: "8px 20px",
                    },
                  }, "确定出库"),
                ]),
              ]),
        }
      );

      vnode.appContext = this.$.appContext;
      render(vnode, mountNode);
    },
    outboundbatch() {
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      if (this.selection.length > 1) {
        return this.$message.error("只能选择一条单据明细进行分批出库");
      }
      const platformOptions = [
        { label: "站台2", value: "2-1" },
        { label: "站台3", value: "3-1" },
      ];
      const mountNode = document.createElement("div");
      document.body.appendChild(mountNode);

      const formData = reactive({
        selectedPlatform: platformOptions[0].value,
        outboundDecimal: "",
      });

      // ç»‘定app上下文，确保El组件正常工作
      const vnode = createVNode(
        ElDialog,
        {
          title: "出库操作 - é€‰æ‹©å‡ºåº“站台",
          width: "500px",
          modelValue: true,
          appendToBody: true,
          "onUpdate:modelValue": (isVisible) => {
            if (!isVisible) {
              render(null, mountNode);
              document.body.removeChild(mountNode);
            }
          },
          style: {
            padding: "20px 0",
            borderRadius: "8px",
          },
        },
        {
          default: () =>
            h(
              ElForm,
              {
                model: formData,
                rules: {
                  selectedPlatform: [
                    { required: true, message: "请选择出库站台", trigger: "change" },
                  ],
                  outboundDecimal: [
                    { required: true, message: "请输入小数数值", trigger: "blur" },
                    {
                      validator: (rule, value, callback) => {
                        const decimalReg = /^(([1-9]\d*)|0)(\.\d{1,2})?$/;
                        if (value && !decimalReg.test(value)) {
                          callback(new Error("请输入有效的小数（正数，最多2位小数）"));
                        } else {
                          callback();
                        }
                      },
                      trigger: "blur",
                    },
                  ],
                },
                ref: "outboundForm",
                labelWidth: "100px",
                style: {
                  padding: "0 30px",
                },
              },
              [
                h(ElFormItem, {
                  label: "出库站台",
                  prop: "selectedPlatform",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElSelect, {
                    placeholder: "请选择出库站台（3-12）",
                    modelValue: formData.selectedPlatform,
                    "onUpdate:modelValue": (val) => {
                      formData.selectedPlatform = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                  }, platformOptions.map((platform) =>
                    h(ElOption, { label: platform.label, value: platform.value })
                  )),
                ]),
                h(ElFormItem, {
                  label: "出库数",
                  prop: "outboundDecimal",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElInput, {
                    type: "number",
                    placeholder: "请输入小数数值（最多2位小数）",
                    modelValue: formData.outboundDecimal,
                    "onUpdate:modelValue": (val) => {
                      formData.outboundDecimal = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                    step: "0.01",
                    precision: 2,
                    min: 0.01,
                  }),
                ]),
                h("div", {
                  style: {
                    textAlign: "right",
                    marginTop: "8px",
                    paddingRight: "4px",
                  },
                }, [
                  h(ElButton, {
                    type: "text",
                    onClick: () => {
                      render(null, mountNode);
                      document.body.removeChild(mountNode);
                      ElMessage.info("取消分批出库操作");
                    },
                    style: {
                      marginRight: "8px",
                      color: "#606266",
                    },
                  }, "取消"),
                  h(ElButton, {
                    type: "primary",
                    onClick: async () => {
                      const formRef = vnode.component.refs.outboundForm;
                      try {
                        await formRef.validate();
                      } catch (err) {
                        return;
                      }

                      const keys = this.selection.map((item) => item.id);
                      const requestParams = {
                        detailIds: keys,
                        outboundTargetLocation: formData.selectedPlatform,
                        outboundQuantity: formData.outboundDecimal,
                        operator: "",
                        orderNo: this.row.orderNo,
                      };

                      this.http
                        .post(
                          "api/Outbound/ProcessPickingOutbound",
                          requestParams,
                          "数据处理中"
                        )
                        .then((x) => {
                          if (!x.status) return ElMessage.error(x.message);
                          ElMessage.success("操作成功");
                          this.showDetialBox = false;
                          this.$emit("parentCall", ($vue) => {
                            $vue.getData();
                          });
                          render(null, mountNode);
                          document.body.removeChild(mountNode);
                        })
                        .catch(() => {
                          ElMessage.error("请求失败，请稍后重试");
                        });
                    },
                    style: {
                      borderRadius: "4px",
                      padding: "8px 20px",
                    },
                  }, "确定分批出库"),
                ]),
              ]),
        }
      );

      vnode.appContext = this.$.appContext;
      render(vnode, mountNode);
    },
@@ -531,7 +703,6 @@
        var item = this.dictionaryList.find((x) => x.dicNo == column.bindKey);
        if (item) {
          var dicItem = item.data.find((x) => x.key == row[column.prop]);
          console.log(dicItem);
          if (dicItem) {
            return dicItem.value;
          } else {
@@ -541,10 +712,12 @@
          return row[column.prop];
        }
      }
      return row[column.prop];
    },
  },
};
</script>

<style scoped>
.text-button {
  border: 0px;
@@ -560,14 +733,12 @@
  background: oldlace;
}

.box-table .el-table tbody tr:hover > td {
.box-table .el-table tbody tr:hover>td {
  background-color: #d8e0d4 !important;
  /* color: #ffffff; */
}

.box-table .el-table tbody tr.current-row > td {
.box-table .el-table tbody tr.current-row>td {
  background-color: #f0f9eb !important;
  /* color: #ffffff; */
}

.el-table .success-row {
@@ -577,4 +748,4 @@
.box-table .el-table {
  border: 1px solid #ebeef5;
}
</style>
</style>

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/inbound/inboundOrder.js

@@ -1,6 +1,6 @@
//此js文件是用来自定义扩展业务代码，可以扩展一些自定义页面或者重新配置生成的代码
import gridHeader from './extend/EmptyTrayInbound.vue'
import gridBody from './extend/Pallet.vue'
import gridBody from './extend/AllcatedPallet.vue'
let extension = {
  components: {
    //查询界面扩展组件

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/outbound/extend/newAllocateOrderDetail.vue

@@ -1,12 +1,6 @@
<template>
  <div>
    <vol-box
      v-model="showDetialBox"
      :lazy="true"
      width="75%"
      :padding="15"
      title="单据明细信息"
    >
    <vol-box v-model="showDetialBox" :lazy="true" width="75%" :padding="15" title="单据明细信息">
      <div class="box-head">
        <el-alert :closable="false" style="width: 100%">
          <el-row>
@@ -14,100 +8,44 @@
              <span>已选中 {{ selection.length }} é¡¹</span>
            </el-col>
            <el-col :span="8">
          <!--     <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px"
                @click="lockstocks"
                >锁定库存</el-link> -->

              <el-link
                type="primary"
                size="small"
                    v-if="isBatch === 0"
                style="float: right; height: 20px"
                @click="handleOpenPicking"
                >拣选</el-link>
                        <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px; margin-right: 10px"
                  v-if="isBatch === 1"
                @click="handleOpenBatchPicking"
                >分批拣选</el-link>
              <el-link
                type="primary"
                size="small"
                   v-if="isBatch === 0"
                style="float: right; height: 20px; margin-right: 10px"
                @click="outbound"
                >直接出库</el-link
              >
               <el-link
                type="primary"
                size="small"
                 v-if="isBatch === 1"
                style="float: right; height: 20px; margin-right: 10px"
                @click="outboundbatch"
                >分批出库</el-link
              >
              <el-link
                type="primary"
                size="small"
                style="float: right; height: 20px; margin-right: 10px"
                @click="getData"
                >刷新</el-link
              ></el-col
            >
              <el-link type="primary" size="small" v-if="isBatch === 0" style="float: right; height: 20px"
                @click="handleOpenPicking">拣选</el-link>
              <el-link type="primary" size="small" style="float: right; height: 20px; margin-right: 10px"
                v-if="isBatch === 1" @click="handleOpenBatchPicking">分批拣选</el-link>
              <el-link type="primary" size="small" v-if="isBatch === 0"
                style="float: right; height: 20px; margin-right: 10px" @click="outbound">直接出库</el-link>
              <el-link type="primary" size="small" v-if="isBatch === 1"
                style="float: right; height: 20px; margin-right: 10px" @click="outboundbatch">分批出库</el-link>
              <el-link type="primary" size="small" style="float: right; height: 20px; margin-right: 10px"
                @click="getData">刷新</el-link>
            </el-col>
          </el-row>
        </el-alert>
      </div>
      <div class="box-table" style="margin-top: 1%">
        <el-table
          ref="singleTable"
          :data="tableData"
          style="width: 100%; height: 100%"
          highlight-current-row
          @current-change="handleCurrentChange"
          height="500px"
          @row-click="handleRowClick"
          @selection-change="handleSelectionChange"
        >
        <el-table ref="singleTable" :data="tableData" style="width: 100%; height: 100%" highlight-current-row
          @current-change="handleCurrentChange" height="500px" @row-click="handleRowClick"
          @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55"> </el-table-column>
          <el-table-column
            label="序号"
            type="index"
            fixed="left"
            width="55"
            align="center"
          ></el-table-column>
          <el-table-column
            v-for="(item, index) in tableColumns.filter((x) => !x.hidden)"
            :key="index"
            :prop="item.prop"
            :label="item.title"
            :width="item.width"
            align="center"
          >
          <el-table-column label="序号" type="index" fixed="left" width="55" align="center"></el-table-column>
          <el-table-column v-for="(item, index) in tableColumns.filter((x) => !x.hidden)" :key="index" :prop="item.prop"
            :label="item.title" :width="item.width" align="center">
            <template #default="scoped">
              <div v-if="item.type == 'icon'">
                <el-tooltip
                  class="item"
                  effect="dark"
                  :content="item.title"
                  placement="bottom"
                  ><el-link
                    type="primary"
                    :disabled="getButtonEnable(item.prop, scoped.row)"
                    @click="tableButtonClick(scoped.row, item)"
                    ><i :class="item.icon" style="font-size: 22px"></i></el-link
                ></el-tooltip>
                <el-tooltip class="item" effect="dark" :content="item.title" placement="bottom">
                  <el-link type="primary" :disabled="getButtonEnable(item.prop, scoped.row)"
                    @click="tableButtonClick(scoped.row, item)">
                    <i :class="item.icon" style="font-size: 22px"></i>
                  </el-link>
                </el-tooltip>
              </div>

              <div v-else-if="item.type == 'tag'">
                <el-tag size="small">
                  {{ getDictionary(scoped.row, item) }}
                </el-tag>
              </div>
              <div v-else>
                {{ scoped.row[item.prop] }}
              </div>
            </template>
          </el-table-column>
@@ -115,35 +53,41 @@
      </div>
    </vol-box>
    <stock-select ref="child" @parentCall="parentCall"></stock-select>
    <selected-stock
      ref="selectedStock"
      @parentCall="parentCall"
    ></selected-stock>
    <selected-stock ref="selectedStock" @parentCall="parentCall"></selected-stock>
    <NoStockOut ref="NoStockOut" @parentCall="parentCall"></NoStockOut>
  </div>
</template>

<script>
import VolBox from "@/components/basic/VolBox.vue";
import VolForm from "@/components/basic/VolForm.vue";
import StockSelect from "./StockSelect.vue";
import SelectedStock from "./SelectedStock.vue";
import NoStockOut from "./NoStockOut.vue";
import { h,createVNode, render,reactive  } from 'vue';
import { ElDialog , ElForm, ElFormItem, ElSelect,ElOption, ElButton, ElInput, ElMessage } from 'element-plus';
import { th } from 'element-plus/es/locale';
import { stationManager, STATION_STORAGE_KEY } from "@/../src/uitils/stationManager";
import { h, createVNode, render, reactive } from "vue";
import {
  ElDialog,
  ElForm,
  ElFormItem,
  ElSelect,
  ElOption,
  ElButton,
  ElInput,
  ElMessage,
} from "element-plus";

export default {
  components: { VolBox, VolForm, StockSelect, SelectedStock,NoStockOut},
  components: { VolBox, VolForm, StockSelect, SelectedStock, NoStockOut },
  data() {
    return {
      row: null,
      isBatch :0,
      isBatch: 0,
      showDetialBox: false,
      flag: false,
      currentRow: null,
      selection: [],
      tableData: [],
      mainBusinessType: null, // æ–°å¢žï¼šå­˜å‚¨ä¸»å•æ®çš„businessType
      tableColumns: [
        {
          prop: "id",
@@ -163,7 +107,7 @@
          prop: "materielCode",
          title: "物料编号",
          type: "string",
          width: 150,
          width: 120,
        },
        {
          prop: "materielName",
@@ -181,7 +125,7 @@
          prop: "supplyCode",
          title: "供应商编号",
          type: "string",
          width: 150,
          width: 90,
        },
        {
          prop: "orderQuantity",
@@ -211,7 +155,7 @@
          prop: "unit",
          title: "单位",
          type: "string",
          width: 90,
          width: 80,
        },
        {
          prop: "orderDetailStatus",
@@ -225,7 +169,7 @@
          title: "指定库存",
          type: "icon",
          width: 90,
          hidden:true,
          hidden: true, // é»˜è®¤éšè—
          icon: "el-icon-s-grid",
        },
        {
@@ -270,9 +214,8 @@
        order: "desc",
        Foots: "",
        total: 0,
        // 2020.08.29增加自定义分页条大小
        sizes: [30, 60, 100, 120],
        size: 30, // é»˜è®¤åˆ†é¡µå¤§å°
        size: 30,
        Wheres: [],
        page: 1,
        rows: 30,
@@ -309,13 +252,24 @@
    };
  },
  methods: {
    toggleAssignStockColumn() {
      const assignStockColumn = this.tableColumns.find(
        (item) => item.prop === "assignStock"
      );
      if (assignStockColumn) {
        // businessType为22时显示，否则隐藏
        assignStockColumn.hidden = this.mainBusinessType !== '22';
      }
    },
    open(row) {
      this.row = row;
      this.showDetialBox = true;
      console.log(this.row);  
      console.log("主单据数据：", this.row);
      this.isBatch = row.isBatch;
      this.mainBusinessType = row.businessType;
      this.getDictionaryData();
      this.getData();
      this.toggleAssignStockColumn();
    },
    getData() {
      var wheres = [{ name: "orderId", value: this.row.id }];
@@ -337,8 +291,7 @@
        this.$refs.child.open(row);
      } else if (column.prop == "NoStockOut") {
        this.$refs.NoStockOut.open(row);
      }else{
          //点击打开出库详情
      } else {
        this.$refs.selectedStock.open(row);
      }
    },
@@ -346,7 +299,7 @@
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      var keys = this.selection.map((item) => item.id); // èŽ·å–选中行的id
      var keys = this.selection.map((item) => item.id);
      this.http
        .post("api/OutboundOrderDetail/LockOutboundStocks", keys, "数据处理中")
        .then((x) => {
@@ -358,344 +311,351 @@
          });
        });
    },
    // æ‰“开拣选页面
   handleOpenPicking() {
    handleOpenPicking() {
      this.$router.push({
        path: '/outbound/picking',
        query: { orderId: this.row.id ,orderNo:this.row.orderNo}
      })
        path: "/outbound/outPicking",
        query: { orderId: this.row.id, orderNo: this.row.orderNo },
      });
    },
    handleOpenBatchPicking() {
      this.$router.push({ 
        path: '/outbound/batchpicking',
        query: { orderId: this.row.id ,orderNo:this.row.orderNo}})
      this.$router.push({
        path: "/outbound/outPicking",
        query: { orderId: this.row.id, orderNo: this.row.orderNo },
      });
    },
    outbound() {
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      const platformOptions = [{label:'站台2',value:'2-1'},{label:'站台3',value:'3-1'}];
      const mountNode = document.createElement('div');
      const platformOptions = [
        { label: "站台2", value: "2-1" },
        { label: "站台3", value: "3-1" },
      ];
      const mountNode = document.createElement("div");
      document.body.appendChild(mountNode);

      // 2. è¡¨å•æ•°æ®ï¼ˆé»˜è®¤é€‰ä¸­ç«™å°3）
      const formData = reactive({
        selectedPlatform: platformOptions[0].value // é»˜è®¤ç»‘定「站台3」的value
        selectedPlatform: platformOptions[0].value,
      });
     const savedStation = stationManager.getStation();  
      if (savedStation) {
        formData.selectedPlatform = savedStation;
      }
      // 3. åŠ¨æ€åˆ›å»ºå¼¹çª—组件
      const vnode = createVNode(ElDialog, {
        title: '出库操作 - é€‰æ‹©å‡ºåº“站台',
        width: '500px',
        modelValue: true,
        appendToBody: true,
        'onUpdate:modelValue': (isVisible) => {
          if (!isVisible) {
            render(null, mountNode);
            document.body.removeChild(mountNode);
          }
        }, 
        style: {
          padding: '20px 0',
          borderRadius: '8px'
        }
      }, {
        default: () => h(ElForm, {
          model: formData,
          rules: {
            selectedPlatform: [
              { required: true, message: '请选择出库站台', trigger: 'change' }
            ]

      const vnode = createVNode(
        ElDialog,
        {
          title: "出库操作 - é€‰æ‹©å‡ºåº“站台",
          width: "500px",
          modelValue: true,
          appendToBody: true,
          "onUpdate:modelValue": (isVisible) => {
            if (!isVisible) {
              render(null, mountNode);
              document.body.removeChild(mountNode);
            }
          },
          ref: 'outboundForm',
          labelWidth: '100px',
          style: {
            padding: '0 30px'
          }
        }, [
          // å‡ºåº“站台选择项（核心表单项）
          h(ElFormItem, {
            label: '出库站台',
            prop: 'selectedPlatform',
            style: {
              marginBottom: '24px'
            }
          }, [
            h(ElSelect, {
              placeholder: '请选择出库站台（3-12）',
              modelValue: formData.selectedPlatform,
              'onUpdate:modelValue': (val) => {
                formData.selectedPlatform = val;
            padding: "20px 0",
            borderRadius: "8px",
          },
        },
        {
          default: () =>
            h(
              ElForm,
              {
                model: formData,
                rules: {
                  selectedPlatform: [
                    { required: true, message: "请选择出库站台", trigger: "change" },
                  ],
                },
                ref: "outboundForm",
                labelWidth: "100px",
                style: {
                  padding: "0 30px",
                },
              },
              style: {
                width: '100%',
                height: '40px',
                borderRadius: '4px',
                borderColor: '#dcdfe6'
              }
            }, platformOptions.map(platform => 
              h(ElOption, { label: platform.label, value: platform.value })
            ))
          ]),
          // åº•éƒ¨æŒ‰é’®åŒº
          h('div', {
            style: {
              textAlign: 'right',
              marginTop: '8px',
              paddingRight: '4px'
            }
          }, [
            h(ElButton, {
              type: 'text',
              onClick: () => {
                render(null, mountNode);
                document.body.removeChild(mountNode);
                ElMessage.info('取消出库操作');
              },
              style: {
                marginRight: '8px',
                color: '#606266'
              }
            }, '取消'),
            h(ElButton, {
              type: 'primary',
              onClick: async () => {
                const formRef = vnode.component.refs.outboundForm;
                try {
                  // è¡¨å•æ ¡éªŒ
                  await formRef.validate();
                } catch (err) {
                  return;
                }
              [
                h(ElFormItem, {
                  label: "出库站台",
                  prop: "selectedPlatform",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElSelect, {
                    placeholder: "请选择出库站台（3-12）",
                    modelValue: formData.selectedPlatform,
                    "onUpdate:modelValue": (val) => {
                      formData.selectedPlatform = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                  }, platformOptions.map((platform) =>
                    h(ElOption, { label: platform.label, value: platform.value })
                  )),
                ]),
                h("div", {
                  style: {
                    textAlign: "right",
                    marginTop: "8px",
                    paddingRight: "4px",
                  },
                }, [
                  h(ElButton, {
                    type: "text",
                    onClick: () => {
                      render(null, mountNode);
                      document.body.removeChild(mountNode);
                      ElMessage.info("取消出库操作");
                    },
                    style: {
                      marginRight: "8px",
                      color: "#606266",
                    },
                  }, "取消"),
                  h(ElButton, {
                    type: "primary",
                    onClick: async () => {
                      const formRef = vnode.component.refs.outboundForm;
                      try {
                        await formRef.validate();
                      } catch (err) {
                        return;
                      }

                // 4. æž„造请求参数（选中单据ID + é€‰æ‹©çš„出库站台）
                const keys = this.selection.map((item) => item.id);
                const requestParams = {
                  taskIds: keys,
                  outboundPlatform: formData.selectedPlatform // å‡ºåº“站台
                };
                      const keys = this.selection.map((item) => item.id);
                      const requestParams = {
                        detailIds: keys,
                        outboundTargetLocation: formData.selectedPlatform,
                        outboundQuantity: 1,
                        operator: "",
                        orderNo: this.row.orderNo,
                      };

                // 5. è°ƒç”¨å‡ºåº“接口
                this.http
                  .post("api/Task/GenerateOutboundTasks", requestParams, "数据处理中")
                  .then((x) => {
                    if (!x.status) return ElMessage.error(x.message);
                    
                    ElMessage.success("操作成功");
                    this.showDetialBox = false; // å…³é—­è¯¦æƒ…框
                    this.$emit("parentCall", ($vue) => {
                      $vue.getData(); // é€šçŸ¥çˆ¶ç»„件刷新
                    });
                    // å…³é—­å¼¹çª—
                    render(null, mountNode);
                    document.body.removeChild(mountNode);
                  })
                  .catch(() => {
                    ElMessage.error('请求失败，请稍后重试');
                  });
              },
              style: {
                borderRadius: '4px',
                padding: '8px 20px'
              }
            }, '确定出库')
          ])
        ])
      });
                      this.http
                        .post(
                          "api/Outbound/ProcessPickingOutbound",
                          requestParams,
                          "数据处理中"
                        )
                        .then((x) => {
                          if (!x.status) return ElMessage.error(x.message);
                          ElMessage.success("操作成功");
                          this.showDetialBox = false;
                          this.$emit("parentCall", ($vue) => {
                            $vue.getData();
                          });
                          render(null, mountNode);
                          document.body.removeChild(mountNode);
                        })
                      // .catch(() => {
                      //   ElMessage.error("请求失败，请稍后重试");
                      // });
                    },
                    style: {
                      borderRadius: "4px",
                      padding: "8px 20px",
                    },
                  }, "确定出库"),
                ]),
              ]),
        }
      );

      // ç»‘定app上下文，确保El组件正常工作
      vnode.appContext = this.$.appContext;
      render(vnode, mountNode);
    },
    outboundbatch() {
  if (this.selection.length === 0) {
    return this.$message.error("请选择单据明细");
  }
    if (this.selection.length>1) {
    return this.$message.error("只能选择一条单据明细进行分批出库");
  }
  const platformOptions = [{label:'站台2',value:'2-1'},{label:'站台3',value:'3-1'}];
  const mountNode = document.createElement('div');
  document.body.appendChild(mountNode);

  // 2. è¡¨å•æ•°æ®ï¼ˆé»˜è®¤é€‰ä¸­ç«™å°3，新增小数字段）
  const formData = reactive({
    selectedPlatform: platformOptions[0].value, // é»˜è®¤ç»‘定「站台3」的value
    outboundDecimal: '' // æ–°å¢žï¼šå°æ•°è¾“入框字段
  });

  // 3. åŠ¨æ€åˆ›å»ºå¼¹çª—组件
  const vnode = createVNode(ElDialog, {
    title: '出库操作 - é€‰æ‹©å‡ºåº“站台',
    width: '500px',
    modelValue: true,
    appendToBody: true,
    'onUpdate:modelValue': (isVisible) => {
      if (!isVisible) {
        render(null, mountNode);
        document.body.removeChild(mountNode);
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
    }, 
    style: {
      padding: '20px 0',
      borderRadius: '8px'
    }
  }, {
    default: () => h(ElForm, {
      model: formData,
      rules: {
        selectedPlatform: [
          { required: true, message: '请选择出库站台', trigger: 'change' }
        ],
        // æ–°å¢žï¼šå°æ•°å­—段验证规则（必填 + æœ‰æ•ˆå°æ•°æ ¼å¼ï¼‰
        outboundDecimal: [
          { required: true, message: '请输入小数数值', trigger: 'blur' },
          { 
            validator: (rule, value, callback) => {
              // éªŒè¯è§„则：正数、支持小数点后最多2位（可根据需求调整小数位数）
              const decimalReg = /^(([1-9]\d*)|0)(\.\d{1,2})?$/;
              if (value && !decimalReg.test(value)) {
                callback(new Error('请输入有效的小数（正数，最多2位小数）'));
              } else {
                callback();
              }
            },
            trigger: 'blur'
          }
        ]
      },
      ref: 'outboundForm',
      labelWidth: '100px',
      style: {
        padding: '0 30px'
      if (this.selection.length > 1) {
        return this.$message.error("只能选择一条单据明细进行分批出库");
      }
    }, [
      // å‡ºåº“站台选择项（核心表单项）
      h(ElFormItem, {
        label: '出库站台',
        prop: 'selectedPlatform',
        style: {
          marginBottom: '24px'
        }
      }, [
        h(ElSelect, {
          placeholder: '请选择出库站台（3-12）',
          modelValue: formData.selectedPlatform,
          'onUpdate:modelValue': (val) => {
            formData.selectedPlatform = val;
          },
          style: {
            width: '100%',
            height: '40px',
            borderRadius: '4px',
            borderColor: '#dcdfe6'
          }
        }, platformOptions.map(platform => 
          h(ElOption, { label: platform.label, value: platform.value })
        ))
      ]),
      // æ–°å¢žï¼šå°æ•°è¾“入框表单项
      h(ElFormItem, {
        label: '出库数', // å¯æ ¹æ®ä¸šåŠ¡éœ€æ±‚修改标签名（如“出库数量”“重量”等）
        prop: 'outboundDecimal',
        style: {
          marginBottom: '24px'
        }
      }, [
        h(ElInput, {
          type: 'number', // æ•°å­—类型，原生支持小数输入
          placeholder: '请输入小数数值（最多2位小数）',
          modelValue: formData.outboundDecimal,
          'onUpdate:modelValue': (val) => {
            formData.outboundDecimal = val;
          },
          style: {
            width: '100%',
            height: '40px',
            borderRadius: '4px',
            borderColor: '#dcdfe6'
          },
          step: '0.01', // æ­¥é•¿0.01，点击上下箭头时按0.01增减
          precision: 2, // é™åˆ¶æœ€å¤šè¾“å…¥2位小数（Element Plus属性）
          min: 0.01, // å¯é€‰ï¼šé™åˆ¶æœ€å°å€¼ä¸º0.01，避免输入0或负数
        })
      ]),
      // åº•éƒ¨æŒ‰é’®åŒº
      h('div', {
        style: {
          textAlign: 'right',
          marginTop: '8px',
          paddingRight: '4px'
        }
      }, [
        h(ElButton, {
          type: 'text',
          onClick: () => {
            render(null, mountNode);
            document.body.removeChild(mountNode);
            ElMessage.info('取消分批出库操作');
          },
          style: {
            marginRight: '8px',
            color: '#606266'
          }
        }, '取消'),
        h(ElButton, {
          type: 'primary',
          onClick: async () => {
            const formRef = vnode.component.refs.outboundForm;
            try {
              // è¡¨å•æ ¡éªŒï¼ˆä¼šåŒæ—¶æ ¡éªŒå‡ºåº“站台和小数字段）
              await formRef.validate();
            } catch (err) {
              return;
      const platformOptions = [
        { label: "站台2", value: "2-1" },
        { label: "站台3", value: "3-1" },
      ];
      const mountNode = document.createElement("div");
      document.body.appendChild(mountNode);

      const formData = reactive({
        selectedPlatform: platformOptions[0].value,
        outboundDecimal: "",
      });

      const vnode = createVNode(
        ElDialog,
        {
          title: "出库操作 - é€‰æ‹©å‡ºåº“站台",
          width: "500px",
          modelValue: true,
          appendToBody: true,
          "onUpdate:modelValue": (isVisible) => {
            if (!isVisible) {
              render(null, mountNode);
              document.body.removeChild(mountNode);
            }
console.log(this.selection);
            // 4. æž„造请求参数（新增小数字段）
            const keys = this.selection.map((item) => item.id);
            const requestParams = {
              orderDetailId: keys[0], // åˆ†æ‰¹å‡ºåº“仅支持单条明细
              outboundPlatform: formData.selectedPlatform, // å‡ºåº“站台
              batchQuantity: formData.outboundDecimal // æ–°å¢žï¼šå°æ•°å­—段传给后端
            };

            // 5. è°ƒç”¨å‡ºåº“接口
            this.http
              .post("api/Task/GenerateOutboundBatchTasks", requestParams, "数据处理中")
              .then((x) => {
                if (!x.status) return ElMessage.error(x.message);
                
                ElMessage.success("操作成功");
                this.showDetialBox = false; // å…³é—­è¯¦æƒ…框
                this.$emit("parentCall", ($vue) => {
                  $vue.getData(); // é€šçŸ¥çˆ¶ç»„件刷新
                });
                // å…³é—­å¼¹çª—
                render(null, mountNode);
                document.body.removeChild(mountNode);
              })
              .catch(() => {
                ElMessage.error('请求失败，请稍后重试');
              });
          },
          style: {
            borderRadius: '4px',
            padding: '8px 20px'
          }
        }, '确定分批出库')
      ])
    ])
  });
            padding: "20px 0",
            borderRadius: "8px",
          },
        },
        {
          default: () =>
            h(
              ElForm,
              {
                model: formData,
                rules: {
                  selectedPlatform: [
                    { required: true, message: "请选择出库站台", trigger: "change" },
                  ],
                  outboundDecimal: [
                    { required: true, message: "请输入小数数值", trigger: "blur" },
                    {
                      validator: (rule, value, callback) => {
                        const decimalReg = /^(([1-9]\d*)|0)(\.\d{1,2})?$/;
                        if (value && !decimalReg.test(value)) {
                          callback(new Error("请输入有效的小数（正数，最多2位小数）"));
                        } else {
                          callback();
                        }
                      },
                      trigger: "blur",
                    },
                  ],
                },
                ref: "outboundForm",
                labelWidth: "100px",
                style: {
                  padding: "0 30px",
                },
              },
              [
                h(ElFormItem, {
                  label: "出库站台",
                  prop: "selectedPlatform",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElSelect, {
                    placeholder: "请选择出库站台（3-12）",
                    modelValue: formData.selectedPlatform,
                    "onUpdate:modelValue": (val) => {
                      formData.selectedPlatform = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                  }, platformOptions.map((platform) =>
                    h(ElOption, { label: platform.label, value: platform.value })
                  )),
                ]),
                h(ElFormItem, {
                  label: "出库数",
                  prop: "outboundDecimal",
                  style: {
                    marginBottom: "24px",
                  },
                }, [
                  h(ElInput, {
                    type: "number",
                    placeholder: "请输入小数数值（最多2位小数）",
                    modelValue: formData.outboundDecimal,
                    "onUpdate:modelValue": (val) => {
                      formData.outboundDecimal = val;
                    },
                    style: {
                      width: "100%",
                      height: "40px",
                      borderRadius: "4px",
                      borderColor: "#dcdfe6",
                    },
                    step: "0.01",
                    precision: 2,
                    min: 0.01,
                  }),
                ]),
                h("div", {
                  style: {
                    textAlign: "right",
                    marginTop: "8px",
                    paddingRight: "4px",
                  },
                }, [
                  h(ElButton, {
                    type: "text",
                    onClick: () => {
                      render(null, mountNode);
                      document.body.removeChild(mountNode);
                      ElMessage.info("取消分批出库操作");
                    },
                    style: {
                      marginRight: "8px",
                      color: "#606266",
                    },
                  }, "取消"),
                  h(ElButton, {
                    type: "primary",
                    onClick: async () => {
                      const formRef = vnode.component.refs.outboundForm;
                      try {
                        await formRef.validate();
                      } catch (err) {
                        return;
                      }

  // ç»‘定app上下文，确保El组件正常工作
  vnode.appContext = this.$.appContext;
  render(vnode, mountNode);
},
      
                      const keys = this.selection.map((item) => item.id);
                      const requestParams = {
                        detailIds: keys,
                        outboundTargetLocation: formData.selectedPlatform,
                        outboundQuantity: formData.outboundDecimal,
                        operator: "",
                        orderNo: this.row.orderNo,
                      };

                      this.http
                        .post(
                          "api/Outbound/ProcessPickingOutbound",
                          requestParams,
                          "数据处理中"
                        )
                        .then((x) => {
                          if (!x.status) return ElMessage.error(x.message);
                          ElMessage.success("操作成功");
                          this.showDetialBox = false;
                          this.$emit("parentCall", ($vue) => {
                            $vue.getData();
                          });
                          render(null, mountNode);
                          document.body.removeChild(mountNode);
                        })
                        .catch(() => {
                          ElMessage.error("请求失败，请稍后重试");
                        });
                    },
                    style: {
                      borderRadius: "4px",
                      padding: "8px 20px",
                    },
                  }, "确定分批出库"),
                ]),
              ]),
        }
      );

      vnode.appContext = this.$.appContext;
      render(vnode, mountNode);
    },
    setCurrent(row) {
      this.$refs.singleTable.setCurrentRow(row);
    },
@@ -752,7 +712,6 @@
        var item = this.dictionaryList.find((x) => x.dicNo == column.bindKey);
        if (item) {
          var dicItem = item.data.find((x) => x.key == row[column.prop]);
          console.log(dicItem);
          if (dicItem) {
            return dicItem.value;
          } else {
@@ -762,10 +721,12 @@
          return row[column.prop];
        }
      }
      return row[column.prop];
    },
  },
};
</script>

<style scoped>
.text-button {
  border: 0px;
@@ -781,14 +742,12 @@
  background: oldlace;
}

.box-table .el-table tbody tr:hover > td {
.box-table .el-table tbody tr:hover>td {
  background-color: #d8e0d4 !important;
  /* color: #ffffff; */
}

.box-table .el-table tbody tr.current-row > td {
.box-table .el-table tbody tr.current-row>td {
  background-color: #f0f9eb !important;
  /* color: #ffffff; */
}

.el-table .success-row {
@@ -798,4 +757,4 @@
.box-table .el-table {
  border: 1px solid #ebeef5;
}
</style>
</style>

 ÏîÄ¿´úÂë/WMSÎÞ²Ö´¢°æ/WIDESEA_WMSServer/WIDESEA_OutboundService/OutboundService.cs

@@ -1583,6 +1583,8 @@
                Unit = stockDetail.Unit,
                InboundOrderRowNo = stockDetail.InboundOrderRowNo,
                SupplyCode = stockDetail.SupplyCode,
                Creater = stockDetail.Creater,
                CreateDate = stockDetail.CreateDate,
                FactoryArea = stockDetail.FactoryArea,
                WarehouseCode = stockDetail.WarehouseCode,
                Remark = $"拆包前原始记录，出库单号：{orderNo}，出库单主键：{orderId}，原条码：{request.Barcode}，原数量：{stockDetail.StockQuantity}，出库数量：{actualOutboundQuantity}，操作者：{request.Operator}"
@@ -1652,6 +1654,8 @@
                InboundOrderRowNo = stockDetail.InboundOrderRowNo,
                SupplyCode = stockDetail.SupplyCode,
                FactoryArea = stockDetail.FactoryArea,
                Creater = stockDetail.Creater,
                CreateDate = stockDetail.CreateDate,
                WarehouseCode = stockDetail.WarehouseCode,
                Remark = $"出库完成删除，条码：{request.Barcode}，原数量：{stockDetail.StockQuantity}，出库数量：{actualOutboundQuantity}，操作者：{request.Operator}"
            };