1

647556386

3 天以前 3c506974e141024ed26a0c348d896c70ea42891b

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

@@ -14,23 +14,26 @@
              <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
              >
              <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
@@ -38,18 +41,26 @@
              <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-col>
          </el-row>
        </el-alert>
      </div>
      <div class="box-table" style="margin-top: 1%">
        <el-table
          ref="singleTable"
          :data="tableData"
          :data="groupedTableData"
          style="width: 100%; height: 100%"
          highlight-current-row
          @current-change="handleCurrentChange"
@@ -66,33 +77,127 @@
            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"
            prop="materielCode"
            label="物料编号"
            width="120"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="materielName"
            label="物料名称"
            width="150"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="batchNo"
            label="批次号"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="supplyCode"
            label="供应商编号"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="orderQuantity"
            label="单据数量"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="lockQuantity"
            label="锁定数量"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="overOutQuantity"
            label="已出数量"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="moveQty"
            label="挪料数量"
            width="90"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="unit"
            label="单位"
            width="80"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="orderDetailStatus"
            label="订单明细状态"
            width="90"
            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>
              </div>

              <div v-else-if="item.type == 'tag'">
                <el-tag size="small">
                  {{ getDictionary(scoped.row, item) }}
                </el-tag>
              </div>
              <el-tag size="small">
                {{ getDictionaryForGroup(scoped.row) }}
              </el-tag>
            </template>
          </el-table-column>
          <el-table-column
            prop="assignStock"
            label="指定库存"
            width="90"
            align="center"
            :hidden="mainBusinessType !== '22'"
          >
            <template #default="scoped">
              <el-tooltip
                class="item"
                effect="dark"
                content="指定库存"
                placement="bottom"
              >
                <el-link
                  type="primary"
                  :disabled="getButtonEnable('assignStock', scoped.row)"
                  @click="handleAssignStock(scoped.row)"
                >
                  <i class="el-icon-s-grid" style="font-size: 22px"></i>
                </el-link>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column
            prop="viewDetail"
            label="出库详细"
            width="90"
            align="center"
          >
            <template #default="scoped">
              <el-tooltip
                class="item"
                effect="dark"
                content="查看出库详细"
                placement="bottom"
              >
                <el-link
                  type="primary"
                  @click="handleViewDetail(scoped.row)"
                >
                  <i class="el-icon-s-operation" style="font-size: 22px"></i>
                </el-link>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column
            prop="detailCount"
            label="明细数量"
            width="80"
            align="center"
          >
            <template #default="scoped">
              <el-tag type="info" size="small">
                {{ scoped.row.detailCount }}
              </el-tag>
            </template>
          </el-table-column>
        </el-table>
@@ -103,147 +208,48 @@
      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 { h,createVNode, render,reactive  } from 'vue';
import { ElDialog , ElForm, ElFormItem, ElSelect,ElOption, ElButton, ElMessage } from 'element-plus';
import NoStockOut from "./NoStockOut.vue";
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 },
  components: { VolBox, VolForm, StockSelect, SelectedStock, NoStockOut },
  data() {
    return {
      row: null,
      isBatch: 0,
      showDetialBox: false,
      flag: false,
      currentRow: null,
      selection: [],
      tableData: [],
      tableColumns: [
        {
          prop: "id",
          title: "Id",
          type: "int",
          width: 90,
          hidden: true,
        },
        {
          prop: "orderId",
          title: "出库单主键",
          type: "string",
          width: 90,
          hidden: true,
        },
        {
          prop: "materielCode",
          title: "物料编号",
          type: "string",
          width: 150,
        },
        {
          prop: "materielName",
          title: "物料名称",
          type: "string",
          width: 150,
        },
        {
          prop: "batchNo",
          title: "批次号",
          type: "string",
          width: 90,
        },
        {
          prop: "supplyCode",
          title: "供应商编号",
          type: "string",
          width: 150,
        },
        {
          prop: "orderQuantity",
          title: "单据数量",
          type: "string",
          width: 90,
        },
        {
          prop: "lockQuantity",
          title: "锁定数量",
          type: "int",
          width: 90,
        },
        {
          prop: "overOutQuantity",
          title: "已出数量",
          type: "string",
          width: 90,
        },
        {
          prop: "unit",
          title: "单位",
          type: "string",
          width: 90,
        },
        {
          prop: "orderDetailStatus",
          title: "订单明细状态",
          type: "tag",
          width: 180,
          bindKey: "orderDetailStatusEnum",
        },
        {
          prop: "assignStock",
          title: "指定库存",
          type: "icon",
          width: 90,
          icon: "el-icon-s-grid",
        },
        {
          prop: "viewDetail",
          title: "出库详细",
          type: "icon",
          width: 90,
          icon: "el-icon-s-operation",
        },
        {
          prop: "creater",
          title: "创建人",
          type: "string",
          width: 90,
        },
        {
          prop: "createDate",
          title: "创建时间",
          type: "datetime",
          width: 160,
        },
        {
          prop: "modifier",
          title: "修改人",
          type: "string",
          width: 100,
        },
        {
          prop: "modifyDate",
          title: "修改时间",
          type: "datetime",
          width: 160,
        },
        {
          prop: "remark",
          title: "备注",
          type: "string",
        },
      ],
      tableData: [], // åŽŸå§‹æ•°æ®
      groupedTableData: [], // åˆ†ç»„后的数据
      mainBusinessType: null, // å­˜å‚¨ä¸»å•æ®çš„businessType
      paginations: {
        sort: "id",
        order: "desc",
        Foots: "",
        total: 0,
        // 2020.08.29增加自定义分页条大小
        sizes: [30, 60, 100, 120],
        size: 30, // é»˜è®¤åˆ†é¡µå¤§å°
        size: 30,
        Wheres: [],
        page: 1,
        rows: 30,
@@ -280,12 +286,60 @@
    };
  },
  methods: {
    // æ ¹æ®ç‰©æ–™ç¼–号、批次、供应商分组数据
    groupDataByMaterial() {
      const groups = {};
      
      this.tableData.forEach(item => {
        // æž„建分组键，批次和供应商可以为空
        const groupKey = `${item.materielCode}_${item.batchNo || ''}_${item.supplyCode || ''}`;
        
        if (!groups[groupKey]) {
          // åˆ›å»ºæ–°åˆ†ç»„
          groups[groupKey] = {
            materielCode: item.materielCode,
            materielName: item.materielName,
            batchNo: item.batchNo || '-',
            supplyCode: item.supplyCode || '-',
            orderQuantity: 0,
            lockQuantity: 0,
            overOutQuantity: 0,
            moveQty: 0,
            unit: item.unit,
            orderDetailStatus: item.orderDetailStatus,
            detailCount: 0,
            originalDetails: [] // ä¿å­˜åŽŸå§‹æ˜Žç»†æ•°æ®
          };
        }
        
        // ç´¯åŠ æ•°é‡
        groups[groupKey].orderQuantity += item.orderQuantity || 0;
        groups[groupKey].lockQuantity += item.lockQuantity || 0;
        groups[groupKey].overOutQuantity += item.overOutQuantity || 0;
        groups[groupKey].moveQty += item.moveQty || 0;
        groups[groupKey].detailCount += 1;
        groups[groupKey].originalDetails.push(item);
        
        // å¦‚果状态不同，可以用第一个状态或特殊处理
        // è¿™é‡Œä½¿ç”¨ç¬¬ä¸€ä¸ªæ˜Žç»†çš„状态
      });
      
      // è½¬æ¢ä¸ºæ•°ç»„
      this.groupedTableData = Object.values(groups);
      
      console.log('分组后的数据:', this.groupedTableData);
    },
    
    open(row) {
      this.row = row;
      this.showDetialBox = true;
      console.log("主单据数据：", this.row);
      this.isBatch = row.isBatch;
      this.mainBusinessType = row.businessType;
      this.getDictionaryData();
      this.getData();
    },
    
    getData() {
      var wheres = [{ name: "orderId", value: this.row.id }];
      var param = {
@@ -293,29 +347,72 @@
        rows: this.paginations.rows,
        sort: this.paginations.sort,
        order: this.paginations.order,
        wheres: JSON.stringify(wheres), // æŸ¥è¯¢æ¡ä»¶ï¼Œæ ¼å¼ä¸º[{ name: "字段", value: "xx" }]
        wheres: JSON.stringify(wheres),
      };
      this.http
        .post("api/OutboundOrderDetail/GetPageData", param, "查询中")
        .then((x) => {
          this.tableData = x.rows;
          // åˆ†ç»„数据
          this.groupDataByMaterial();
        });
    },
    tableButtonClick(row, column) {
      if (column.prop == "assignStock") {
        this.$refs.child.open(row);
    
    // é‡ç‚¹ä¿®æ”¹ï¼šå¤„理指定库存点击事件 - ä¼ é€’完整的分组明细信息
    handleAssignStock(row) {
      // ä¼ é€’完整的分组明细数据（包含所有原始明细ID和物料信息）
      if (row.originalDetails && row.originalDetails.length > 0) {
        this.$refs.child.open({
          // ç‰©æ–™åŸºæœ¬ä¿¡æ¯ï¼ˆå–第一个明细的信息）
          materielCode: row.originalDetails[0].materielCode,
          materielName: row.originalDetails[0].materielName,
          // åˆ†ç»„后的总需求数量
          qty: row.orderQuantity,
          // ä¸»å•æ®ç¼–号
          upperOrderNo: this.row.upperOrderNo,
          // å…³é”®ï¼šå½“前分组的所有明细ID集合
          detailIds: row.originalDetails.map(detail => detail.id),
          // ä¸»å•æ®ID
          mainOrderId: this.row.id,
          // å®Œæ•´åˆ†ç»„行信息（备用）
          groupRow: row
        });
      } else {
        //点击打开出库详情
        this.$refs.selectedStock.open(row);
        ElMessage.warning("该分组没有明细数据，无法指定库存");
      }
    },
    
    handleViewDetail(row) {
      // æŸ¥çœ‹åˆ†ç»„明细的详细信息
      if (row.originalDetails && row.originalDetails.length > 0) {
        // è¿™é‡Œå¯ä»¥æ‰“开一个新的弹窗显示所有明细，或者使用第一个明细
        this.$refs.selectedStock.open(row.originalDetails[0]);
      }
    },
    
    lockstocks() {
      if (this.selection.length === 0) {
        return this.$message.error("请选择单据明细");
      }
      var keys = this.selection.map((item) => item.id); // èŽ·å–选中行的id
      
      // èŽ·å–所有选中分组的原始明细ID
      const detailIds = [];
      this.selection.forEach(group => {
        if (group.originalDetails && group.originalDetails.length > 0) {
          group.originalDetails.forEach(detail => {
            if (detail.id) {
              detailIds.push(detail.id);
            }
          });
        }
      });
      
      if (detailIds.length === 0) {
        return this.$message.error("没有找到可锁定的明细");
      }
      
      this.http
        .post("api/OutboundOrderDetail/LockOutboundStocks", keys, "数据处理中")
        .post("api/OutboundOrderDetail/LockOutboundStocks", detailIds, "数据处理中")
        .then((x) => {
          if (!x.status) return this.$message.error(x.message);
          this.$message.success("操作成功");
@@ -325,193 +422,419 @@
          });
        });
    },
    // æ‰“开拣选页面
   handleOpenPicking() {
    
    handleOpenPicking() {
      this.$router.push({
        path: '/outbound/picking',
        query: { orderId: this.row.id ,orderNo:this.row.orderNo}
      })
        path: "/outbound/picking",
        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 },
      });
    },
    
    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');
      
      // èŽ·å–所有选中分组的原始明细ID
      const detailIds = [];
      this.selection.forEach(group => {
        if (group.originalDetails && group.originalDetails.length > 0) {
          group.originalDetails.forEach(detail => {
            if (detail.id) {
              detailIds.push(detail.id);
            }
          });
        }
      });
      
      if (detailIds.length === 0) {
        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
        selectedPlatform: platformOptions[0].value,
      });

      // 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: "请选择出库站台",
                    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 requestParams = {
                        taskIds: detailIds,
                        outboundPlatform: formData.selectedPlatform,
                      };

                // 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/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",
                    },
                  }, "确定出库"),
                ]),
              ]),
        }
      );

      // ç»‘定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 selectedGroup = this.selection[0];
      if (!selectedGroup.originalDetails || selectedGroup.originalDetails.length === 0) {
        return this.$message.error("没有找到明细数据");
      }
      
      // åˆ†æ‰¹å‡ºåº“通常针对单个明细
      // è¿™é‡Œä½¿ç”¨ç¬¬ä¸€ä¸ªæ˜Žç»†
      const selectedDetail = selectedGroup.originalDetails[0];
      
      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);
            }
          },
          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: "请选择出库站台",
                    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,
                    max: selectedDetail.orderQuantity - selectedDetail.overOutQuantity - selectedDetail.lockQuantity - selectedDetail.moveQty,
                  }),
                ]),
                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 requestParams = {
                        orderDetailId: selectedDetail.id,
                        outboundPlatform: formData.selectedPlatform,
                        batchQuantity: formData.outboundDecimal,
                      };

                      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",
                    },
                  }, "确定分批出库"),
                ]),
              ]),
        }
      );

      vnode.appContext = this.$appContext;
      render(vnode, mountNode);
    },
    
    setCurrent(row) {
      this.$refs.singleTable.setCurrentRow(row);
    },
    
    handleCurrentChange(val) {
      this.currentRow = val;
    },
    
    getButtonEnable(propName, row) {
      if (propName == "assignStock") {
        if (
          row.orderDetailStatus !== 0 &&
          row.orderDetailStatus !== 60 &&
          row.orderDetailStatus !== 70 &&
          row.orderDetailStatus !== 80
          row.orderDetailStatus !== 70 
        ) {
          return true;
        } else {
          return false;
        } else {
          return true;
        }
      }
      return false;
    },
    
    parentCall(fun) {
      if (typeof fun != "function") {
        return console.log("扩展组件需要传入一个回调方法才能获取父级Vue对象");
      }
      fun(this);
    },
    
    handleRowClick(row) {
      this.$refs.singleTable.toggleRowSelection(row);
    },
    
    handleSelectionChange(val) {
      this.selection = val;
    },
    
    getDictionaryData() {
      if (this.dictionaryList) {
        return;
      }
      var param = [];
      this.tableColumns.forEach((x) => {
        if (x.type == "tag" && x.bindKey != "") {
          param.push(x.bindKey);
        }
      });
      var param = ["orderDetailStatusEnum"];
      this.http
        .post("api/Sys_Dictionary/GetVueDictionary", param, "查询中")
        .then((x) => {
@@ -520,25 +843,27 @@
          }
        });
    },
    getDictionary(row, column) {
    
    getDictionaryForGroup(row) {
      if (this.dictionaryList) {
        var item = this.dictionaryList.find((x) => x.dicNo == column.bindKey);
        var item = this.dictionaryList.find((x) => x.dicNo == "orderDetailStatusEnum");
        if (item) {
          var dicItem = item.data.find((x) => x.key == row[column.prop]);
          console.log(dicItem);
          var dicItem = item.data.find((x) => x.key == row.orderDetailStatus);
          if (dicItem) {
            return dicItem.value;
          } else {
            return row[column.prop];
            return row.orderDetailStatus;
          }
        } else {
          return row[column.prop];
          return row.orderDetailStatus;
        }
      }
      return row.orderDetailStatus;
    },
  },
};
</script>

<style scoped>
.text-button {
  border: 0px;
@@ -556,12 +881,10 @@

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

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

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