kd-aiot-frontend-wms/src/views/warehouseManagement/picking/add.vue

<template>
  <div id="inventoryAllocate">
    <el-card class="box-card">
      <header-title title="基本信息"></header-title>
      <el-form
        label-width="90px"
        :model="params"
        :rules="rules"
        label-position="left"
        class="ele-form-search"
      >
        <el-row :gutter="15">
          <el-col :span="8" class="col_height">
            <el-form-item label="拣货单:" prop="code">
              <template>
                <el-input :disabled="true" v-model="params.code"></el-input>
              </template>
            </el-form-item>
          </el-col>
          <el-col :span="8" class="col_height">
            <el-form-item label="拣货名称:" prop="name">
              <template>
                <el-input
                  v-model="params.name"
                  placeholder="请输入内容"
                ></el-input>
              </template>
            </el-form-item>
          </el-col>
          <el-col :span="8" class="col_height">
            <el-form-item label="关联领料单:" prop="sourceBizNo">
              <template>
                <el-input
                  placeholder="请选择"
                  v-model="params.sourceBizNo"
                  @click.native="openDocumentSourceDialog"
                >
                </el-input>
              </template>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="receiveBox">
        <div class="productsList">
          <header-title title="领料产品清单"></header-title>
          <el-table
            ref="table"
            :data="receiveList"
            row-key="id"
            :max-height="300"
            tooltip-effect="dark"
            border
          >
            <!-- <el-table-column
              align="center"
              width="50"
              :reserve-selection="true"
              :selectable="checkSelectable"
              type="selection"
            ></el-table-column> -->
            <el-table-column width="55" align="center">
              <template slot-scope="scope">
                <el-radio
                  class="radio"
                  @input="receiveListSelect(scope.row)"
                  :disabled="scope.row.isConfig"
                  :label="scope.row.id"
                  v-model="radioValue"
                  >&emsp;&emsp;&emsp;</el-radio
                >
              </template>
            </el-table-column>
            <el-table-column label="序号" type="index" width="50">
            </el-table-column>
            <el-table-column
              label="物品编码"
              width="150"
              prop="categoryCode"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="物品名称"
              prop="categoryName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="批次号"
              prop="batchNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="牌号"
              prop="brandNum"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="型号"
              prop="categoryModel"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="规格"
              prop="specification"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="包装编码"
              prop="packageNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装数量"
              prop="packingQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装单位"
              prop="packingUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量数量"
              prop="measureQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量单位"
              prop="measuringUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量"
              prop="weight"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量单位"
              prop="weightUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="仓库"
              width="200"
              prop="warehouseName"
              :show-overflow-tooltip="true"
            ></el-table-column>
          </el-table>
        </div>
      </div>
      <div class="productBox">
        <div class="productsList">
          <header-title title="库存台账"></header-title>
          <el-form
            label-position="left"
            class="ele-form-search"
            @keyup.enter.native="search"
            @submit.native.prevent
          >
            <el-row :gutter="10">
              <el-col :span="6">
                <el-form-item label="列表维度:" prop="dimension">
                  <template>
                    <el-select
                      @change="getProductList"
                      v-model="dimension"
                      placeholder="请选择"
                    >
                      <el-option label="批次维度" value="2"> </el-option>
                      <el-option label="包装维度" value="3"> </el-option>
                    </el-select>
                  </template>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item
                  label-width="65px"
                  label="拣货策略:"
                  prop="warehouseId"
                >
                  <template>
                    <el-button type="primary" @click="automatic"
                      >按件</el-button
                    >
                    <el-button type="primary" @click="automatic"
                      >按批</el-button
                    >
                    <!-- <el-button type="primary" @click="automatic">手动</el-button> -->
                  </template>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <div class="flex-right">
                  <el-button type="primary" @click="disposal('拆包')"
                    >拆包</el-button
                  >
                  <el-button type="primary" @click="disposal('打包')"
                    >打包</el-button
                  >
                  <el-button type="primary" @click="confirm">确认</el-button>
                </div>
              </el-col>
            </el-row>
          </el-form>
          <!-- <el-form
            label-position="left"
            class="ele-form-search"
            @keyup.enter.native="search"
            @submit.native.prevent
          >
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item
                  label-width="65px"
                  label="所属工厂:"
                  prop="factoryId"
                >
                  <el-select
                    :disabled="isEdit"
                    style="width: 100%"
                    @change="factoryChange"
                    v-model="factoryId"
                    placeholder="请选择工厂"
                  >
                    <el-option
                      v-for="item in factoryList"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label-width="65px"
                  label="仓库:"
                  prop="warehouseId"
                >
                  <template>
                    <el-select
                      :disabled="isEdit"
                      style="width: 100%"
                      @change="outWarehouseChange"
                      v-model="params.warehouseId"
                      placeholder="请选择"
                    >
                      <el-option
                        v-for="item in warehouseList"
                        :disabled="item.hiden"
                        :label="item.name"
                        :value="item.id"
                        :key="item.name"
                      >
                      </el-option>
                    </el-select>
                  </template>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="15">
              <el-col :span="18">
                <el-input
                  placeholder="请输入名称/编码/批次号/型号/规格/客户代号/刻码"
                  v-model="query.keyWord"
                  class="input-with-select"
                >
                  <el-button
                    slot="append"
                    icon="el-icon-search"
                    type="primary"
                    @click="getProductList"
                    >搜索</el-button
                  >
                </el-input>
              </el-col>
              <el-col :span="6">
                <div
                  style="
                    display: flex;
                    justify-content: flex-end;
                    margin-bottom: 10px;
                  "
                >
                  <el-button
                    @click="queryReset"
                    icon="el-icon-refresh-left"
                    size="small"
                    type="primary"
                    >重置</el-button
                  >
                  <el-button type="primary" @click="merge">{{
                    typeName
                  }}</el-button>
                </div>
              </el-col>
            </el-row>
          </el-form> -->
          <el-table
            ref="productListTable"
            :max-height="300"
            :data="productList"
            row-key="id"
            @selection-change="selecctedRow"
            tooltip-effect="dark"
            border
          >
            <el-table-column
              v-if="dimension == 3"
              align="center"
              width="50"
              :reserve-selection="true"
              :selectable="checkSelectable"
              type="selection"
            ></el-table-column>
            <el-table-column label="序号" type="index" width="50">
            </el-table-column>
            <el-table-column
              label="物品编码"
              prop="categoryCode"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="物品名称"
              prop="categoryName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="批次号"
              prop="batchNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="牌号"
              prop="brandNum"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="型号"
              prop="categoryModel"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="规格"
              prop="specification"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="包装编码"
              prop="packageNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装数量"
              prop="packingQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装单位"
              prop="packingUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量数量"
              prop="measureQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量单位"
              prop="measureUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量"
              prop="weight"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量单位"
              prop="weightUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="仓库"
              prop="warehouseName"
              :show-overflow-tooltip="true"
            ></el-table-column>
          </el-table>
          <el-pagination
            background
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
            :page-sizes="[10, 20, 50, 100]"
            :page-size.sync="query.size"
            :current-page.sync="query.pageNum"
            @current-change="getProductList"
            @size-change="getProductList"
          >
          </el-pagination>
        </div>
        <!-- <div class="allocateDetails">
          <header-title :title="`${typeName}明细`"></header-title>
          <el-table
            :max-height="627"
            ref="detailTable"
            :data="tableData"
            tooltip-effect="dark"
            border
          >
            <el-table-column label="序号" type="index" width="50">
            </el-table-column>
            <el-table-column
              label="物品编码"
              prop="categoryCode"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="物品名称"
              prop="categoryName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="批次号"
              prop="batchNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="牌号"
              prop="brandNum"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="型号"
              prop="categoryModel"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="规格"
              prop="specification"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="包装编码"
              prop="packageNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装数量"
              prop="packingQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装单位"
              prop="packingUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量数量"
              prop="measureQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量单位"
              prop="measureUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量"
              prop="weight"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量单位"
              prop="weightUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="仓库"
              prop="warehouseName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="货区"
              prop="areaName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="货架"
              prop="goodsAllocationName"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="货位"
              prop="goodsShelfName"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="生产日期"
              prop="productionDate"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="采购日期"
              prop="purchaseDate"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="发货条码"
              prop="barcodes"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="客户代号"
              prop="clientCode"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="刻码"
              prop="engrave"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="物料代号"
              prop="materielDesignation"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
          </el-table>
          <div class="submit_item">
            <el-button type="primary" @click="submit">保存</el-button></div
          >
        </div> -->
      </div>
      <div class="pickingBox">
        <div class="productsList">
          <header-title title="拣货清单"></header-title>
          <el-table
            ref="table"
            :data="pickingList"
            row-key="id"
            @selection-change="selecctedRow"
            tooltip-effect="dark"
            border
          >
            <el-table-column label="序号" type="index" width="50">
            </el-table-column>
            <el-table-column
              label="物品编码"
              width="150"
              prop="categoryCode"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="物品名称"
              prop="categoryName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="批次号"
              prop="batchNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="牌号"
              prop="brandNum"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="型号"
              prop="categoryModel"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="规格"
              prop="specification"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="包装编码"
              prop="packageNo"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装数量"
              prop="packingQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="包装单位"
              prop="packingUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量数量"
              prop="measureQuantity"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="计量单位"
              prop="measureUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量"
              prop="weight"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="重量单位"
              prop="weightUnit"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="仓库"
              width="200"
              prop="warehouseName"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column label="操作">
              <template v-slot="{ row, $index }">
                <el-button size="mini" type="text" @click="deleted(row, $index)"
                  >删除</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="control">
        <el-button type="primary" v-if="type == '新增'" @click="save(true)"
          >保存</el-button
        >
        <el-button type="primary" v-else @click="save(false)">修改</el-button>
        <el-button type="primary" v-if="type == '新增'" @click="config(true)"
          >提交</el-button
        >
        <el-button type="primary" v-else @click="config(false)">提交</el-button>
      </div>
    </el-card>
    <outboundRequisitionDialog
      ref="outboundRequisitionDialogRef"
      @detailData="outboundRequisitionSelection"
      type="2"
    />
    <disassembleDialog ref="disassembleDialogRef" @flushed="reFlushed" />
  </div>
</template>
<script>
  import outboundRequisitionDialog from './components/outboundRequisitionDialog.vue';
  import storageApi from '@/api/warehouseManagement/index.js';
  import { getCode } from '@/api/codeManagement/index.js';
  import { getWarehouseList } from '@/api/classifyManage/itemInformation';
  import warehouseDefinition from '@/api/warehouseManagement/warehouseDefinition';
  import disassembleDialog from './components/disassembleDialog.vue';
  export default {
    components: {
      outboundRequisitionDialog,
      disassembleDialog
    },
    data() {
      return {
        query: {
          warehouseId: '',
          categoryCode: '',
          pageNum: 1,
          size: 10
        },
        dimension: '3',
        typeOptions: [
          {
            label: '拆包',
            value: 1
          },
          {
            label: '打包',
            value: 2
          }
        ],
        radioValue: '',
        pickingList: [],
        receiveList: [],
        warehouseList: [],
        inTreeList: [],
        selectionIds: [],
        selection: [],
        tableData: [],
        productList: [],
        typeId: 1,
        typeName: '拆包',
        currentPullAreaId: '',
        currentPullAreaName: '',
        currentTuneAreaId: '',
        currentTuneAreaName: '',
        pullLibrary: [], // 调出库
        tuneLibrary: [], // 调入库
        outWarehouseList: [],
        inWarehouseList: [],
        rules: {
          name: [
            { required: true, message: '拣货名称不能为空', trigger: 'blur' }
          ],
          sourceBizNo: [
            {
              required: true,
              message: '关联领料单不能为空',
              trigger: ['blur', 'change']
            }
          ]
        },
        params: {
          code: '',
          name: '',
          sourceBizNo: '', // 领料单
          warehouseId: '', // 仓库ID
          warehouseName: '' // 仓库名称
        },
        queryList: {},
        outCargoAreaList: [], // 调出库区列表
        outShelvesList: [], // 调出货架列表
        outFreightList: [], // 调出货位列表
        inCargoAreaList: [], // 调入库区列表
        inShelvesList: [], // 调入货架列表
        inFreightList: [], // 调入货位列表
        treeLoading: false,
        currentObj: {},
        factoryList: [],
        isEdit: false,
        isView: false,
        factoryId: '', // 工厂ID
        transferOrderId: '', // 调拨单ID
        type: '', // 类型
        page: 1,
        size: 10,
        total: 0
      };
    },
    async created() {
      this.type = this.$route.query.type;
      if (this.$route.query.type == '新增') {
        const code = await getCode('transfer_no');
        this.params.code = code;
      } else {
        if (this.$route.query.type == '详情') {
          this.isView = true;
        }
        this.getEditInfo(this.$route.query.id);
      }
    },
    methods: {
      deleted(row, index) {
        this.pickingList.splice(index, 1);
        this.radioValue = '';
        this.receiveList = this.receiveList.map((item) => {
          if (item.categoryId == row.categoryId) {
            return {
              ...item,
              isConfig: false
            };
          }
          return item;
        });
      },
      automatic() {
        if (this.radioValue) {
          this.$message.error('库存台账不满足策略,请手动进行选择操作');
        } else {
          this.$message.error('请选择领料产品清单物品');
        }
      },
      async save(isSave) {
        console.log(isSave);
        if (!this.params.name) {
          return this.$message.error('请输入拣货名称');
        }
        if (!this.params.sourceBizNo) {
          return this.$message.error('请选择关联领料单');
        }
        if (this.pickingList.length > 0) {
          if (isSave) {
            console.log('新增保存');
            try {
              await storageApi.savePickgoods({
                code: this.params.code,
                name: this.params.name,
                sourceNo: this.params.sourceBizNo,
                warehouseId: this.pickingList[0].warehouseId,
                warehouseName: this.pickingList[0].warehouseName,
                status: 0, // 拣货中
                info: this.pickingList
              });
              this.$message.success('保存成功');
              this.$router.go(-1);
            } catch (error) {
              this.$message.error('保存失败');
            }
          } else {
            console.log('新增修改');
            try {
              await storageApi.updatePickgoods({
                id: this.params.id,
                code: this.params.code,
                name: this.params.name,
                sourceNo: this.params.sourceBizNo,
                warehouseId: this.pickingList[0].warehouseId,
                warehouseName: this.pickingList[0].warehouseName,
                status: 0, // 拣货中
                info: this.pickingList
              });
              this.$message.success('修改成功');
              this.$router.go(-1);
            } catch (error) {
              this.$message.error('修改失败');
            }
          }
        } else {
          this.$message.error('拣货清单不能为空');
        }
      },
      async confirm() {
        if (this.selection.length == 1) {
          let currentPackingUnit = this.receiveList.filter(
            (item) => item.id == this.radioValue
          )[0].packingUnit;
          if (currentPackingUnit == this.selection[0].packingUnit) {
            this.pickingList = this.pickingList.concat(this.selection);
            this.receiveList = this.receiveList.map((item) => {
              if (item.id == this.radioValue) {
                return {
                  ...item,
                  isConfig: true
                };
              } else {
                return {
                  ...item
                };
              }
            });
            this.productList = [];
            this.selection = [];
            this.total = 0;
            this.$refs.productListTable.clearSelection();
            console.log(this.receiveList);
          } else {
            return this.$message.error('所选物品与清单包装单位不一致');
          }
        } else {
          this.$message.error('请选选择对应包装规格数量的拣货的物品');
        }
      },
      disposal(typeName) {
        console.log(typeName);
        if (this.selection.length > 0) {
          this.$refs.disassembleDialogRef.open(this.selection, typeName);
        } else {
          this.$message.error(`请选择需要${typeName}的物品`);
        }
      },
      receiveListSelect(data) {
        console.log(data);
        this.selection = [];
        this.$refs.productListTable.clearSelection();
        this.query.warehouseId = data.warehouseId;
        this.query.categoryCode = data.categoryCode;
        this.getProductList();
      },
      async config(isSave) {
        console.log(isSave);
        if (!this.params.name) {
          return this.$message.error('请输入拣货名称');
        }
        if (!this.params.sourceBizNo) {
          return this.$message.error('请选择关联领料单');
        }
        if (this.receiveList.length === this.pickingList.length) {
          if (isSave) {
            console.log('提交保存');
            try {
              await storageApi.savePickgoods({
                code: this.params.code,
                name: this.params.name,
                sourceNo: this.params.sourceBizNo,
                warehouseId: this.pickingList[0].warehouseId,
                warehouseName: this.pickingList[0].warehouseName,
                status: 2, // 出库
                info: this.pickingList
              });
              this.$message.success('出库成功');
              this.$router.go(-1);
            } catch (error) {
              this.$message.error('出库失败');
            }
          } else {
            console.log('提交修改');
            try {
              await storageApi.updatePickgoods({
                id: this.params.id,
                code: this.params.code,
                name: this.params.name,
                sourceNo: this.params.sourceBizNo,
                warehouseId: this.pickingList[0].warehouseId,
                warehouseName: this.pickingList[0].warehouseName,
                status: 2, // 出库
                info: this.pickingList
              });
              this.$message.success('出库成功');
              this.$router.go(-1);
            } catch (error) {
              this.$message.error('出库失败');
            }
          }
        } else {
          this.$message.error('请核对拣货清单是否与领料单是否一致');
        }
      },
      outboundRequisitionSelection(data, sourceBizNo) {
        this.params.sourceBizNo = sourceBizNo;
        this.receiveList = data.map((item) => {
          return {
            ...item,
            isConfig: false
          };
        });
        // 清空
        this.productList = [];
        this.pickingList = [];
        this.selection = [];
        this.$refs.productListTable.clearSelection();
      },
      reFlushed() {
        this.selection = [];
        this.$refs.productListTable.clearSelection();
        this.getProductList();
      },
      clearDocumentSource() {
        this.params.sourceBizNo = '';
      },
      // 打开单据来源弹窗
      openDocumentSourceDialog() {
        this.$refs.outboundRequisitionDialogRef.open();
      },
      async getEditInfo(id) {
        storageApi.getPickgoodsDetails(id).then((data) => {
          console.log(data);
          this.params.id = data.id;
          this.params.sourceBizNo = data.sourceNo;
          this.params.code = data.code;
          this.params.name = data.name;
          this.pickingList = data.info;
          let categoryCodeList = data.info.map((item) => item.categoryCode);
          this.receiveList = data.list.map((item) => {
            return {
              ...item,
              isConfig: categoryCodeList.includes(item.categoryCode)
            };
          });
        });
      },
      factoryChange() {
        this.reset();
        this.getTreeData();
      },
      search() {
        this.getProductList();
      },
      reset() {
        this.params = {
          ...this.params
        };
        this.total = 0;
        this.productList = [];
        this.selection = [];
        this.selectionIds = [];
      },
      queryReset() {
        if (this.params.warehouseId) {
          this.query = {};
          this.getProductList();
        }
      },
      //获取工厂列表
      async getFactoryList() {
        const res = await warehouseDefinition.getFactoryarea({
          pageNum: 1,
          size: 9999,
          type: 1
        });
        this.factoryList = res.list;
      },
      async outWarehouseChange(val) {
        this.outCargoAreaList = this.warehouseList.filter(
          (item) => item.id == val
        )[0].children;
        this.params.warehouseName = this.warehouseList.filter(
          (item) => item.id == val
        )[0].name;
        this.productList = [];
        this.tableData = [];
        this.selection = [];
        this.selectionIds = [];
        await this.getProductList();
      },
      async getProductList() {
        let data = null;
        if (this.dimension == 2) {
          // 批次维度
          data = await storageApi.getBatchList(this.query);
        } else {
          // 包装维度
          data = await storageApi.getPackingList(this.query);
        }
        this.total = data.count;
        this.productList = data.list;
      },
      async getTreeData() {
        try {
          this.treeLoading = true;
          let res = await storageApi.getWarehouseTrees({
            factoriesId: this.factoryId
          });
          this.treeLoading = false;
          if (res?.code === '0') {
            this.warehouseList = res.data;
          }
        } catch (error) {
          console.log(error);
        }
        this.treeLoading = false;
      },
      // deleted(row, index) {
      //   this.tableData.splice(index, 1);
      //   console.log(this.selectionIds);
      //   this.selectionIds = this.selectionIds.filter((item) => item !== row.id);
      // },
      submit() {
        if (this.tableData.length > 0) {
        } else {
          this.$message.error('请调入相关数据');
        }
      },
      checkSelectable(row) {
        return !this.selectionIds.includes(row.id);
      },
      allocateChange(val) {
        this.typeId = val;
        this.typeName = this.typeOptions.filter(
          (item) => item.value == val
        )[0].label;
        this.total = 0;
        this.productList = [];
        this.selectionIds = [];
        this.selection = [];
        this.tableData = [];
        this.params.warehouseId = '';
        this.$refs.table.clearSelection();
        this.getTreeData();
      },
      selecctedRow(val) {
        this.selection = val;
      },
      async getWarehouseOptions() {
        const { data } = await storageApi.getWarehouseTrees();
        this.outWarehouseList = data;
        this.inWarehouseList = data;
      },
      async merge() {
        if (this.selection.length > 0) {
          console.log(this.selection);
          console.log(this.selectionIds);
          let boolen = this.selection.every((item) =>
            this.selectionIds.includes(item.id)
          );
          if (this.selection.length > 0 && !boolen) {
            this.selection = this.selection.filter(
              (item) => !this.selectionIds.includes(item.id)
            );

            console.log('this.selection---------', this.selection);
            console.log('this.selectionIds---', this.selectionIds);
            if (this.typeName == '拆包') {
              // 拆包
              // 获取包装维度
              let packingSpecification =
                await storageApi.getCategoryPackageDisposition({
                  categoryIds: this.selection.map((item) => item.categoryId)
                });
              let packingSpecificationOption = this.selection.map((item) => {
                return packingSpecification
                  .filter((ite) => item.categoryId == ite.categoryId)
                  .sort((a, b) => a.sort - b.sort);
              });
              let isBoolen = this.selection.every(
                (item, index) =>
                  item.packingUnit !==
                  packingSpecificationOption[index][0].packageUnit
              );
              if (isBoolen) {
                let list = this.selection.map((item, index) => {
                  let splitIndex = packingSpecificationOption[index].findIndex(
                    (ite) =>
                      ite.conversionUnit != ite.packageUnit &&
                      item.packingUnit == ite.conversionUnit
                  );
                  // 计算最小计量数量和数量
                  let measureQuantity = 1;
                  let reduceIndex = splitIndex;
                  for (; reduceIndex > 0; reduceIndex--) {
                    measureQuantity = this.$math.format(
                      measureQuantity *
                        packingSpecificationOption[index][reduceIndex - 1]
                          .packageCell,
                      14
                    );
                  }
                  return {
                    ...item,
                    packingQuantity: 1,
                    packingUnit:
                      packingSpecificationOption[index][splitIndex].packageUnit,
                    num: packingSpecificationOption[index][splitIndex]
                      .packageCell,
                    measureUnit:
                      packingSpecificationOption[index][1].packageUnit,
                    measureQuantity,
                    weight: this.$math.format(
                      item.weight /
                        packingSpecificationOption[index][splitIndex]
                          .packageCell,
                      14
                    )
                  };
                });
                list.forEach((item) => {
                  for (let i = 0; i < item.num; i++) {
                    this.tableData.push({ ...item });
                  }
                });
                console.log(list);
              } else {
                return this.$message.error(
                  `请选择需要正确${this.typeName}选项`
                );
              }
              console.log(
                'packingSpecificationOption-----',
                packingSpecificationOption
              );
            } else {
              // 打包
              let isBoolen = this.selection.every(
                (item) =>
                  item.categoryId == this.selection[0].categoryId &&
                  item.packingUnit == this.selection[0].packingUnit
              );
              if (isBoolen) {
                let packingSpecification =
                  await storageApi.getCategoryPackageDisposition({
                    categoryIds: [this.selection[0].categoryId]
                  });
                let packingSpecificationOption = packingSpecification.sort(
                  (a, b) => a.sort - b.sort
                );
                let splitIndex = packingSpecificationOption.findIndex(
                  (ite) =>
                    ite.conversionUnit != ite.packageUnit &&
                    this.selection[0].packingUnit == ite.packageUnit
                );
                console.log(packingSpecificationOption);
                console.log(splitIndex);
                if (splitIndex < 0) {
                  return this.$message.error(
                    '已经为最大包装维度，不能进行打包'
                  );
                }
                if (
                  this.selection.length <=
                  packingSpecificationOption[splitIndex].packageCell
                ) {
                  this.tableData.push({
                    ...this.selection[0],
                    packingQuantity: 1,
                    packingUnit:
                      packingSpecificationOption[splitIndex].conversionUnit,
                    measureQuantity: this.selection.reduce(
                      (a, b) =>
                        this.$math.format(
                          Number(a) + Number(b.measureQuantity),
                          14
                        ),
                      0
                    ),
                    weight: this.selection.reduce(
                      (a, b) =>
                        this.$math.format(Number(a) + Number(b.weight), 14),
                      0
                    )
                  });
                } else {
                  return this.$message.error('打包数量超出最大包装数量');
                }
              } else {
                return this.$message.error(
                  `请选择需要正确${this.typeName}选项`
                );
              }
            }
            this.selectionIds = this.selectionIds.concat(
              this.selection.map((item) => item.id)
            );
          } else {
            this.$message.error('请选择正确的行');
          }
        } else {
          this.$message.error('请选择调出物品信息');
        }
      }
    }
  };
</script>
<style lang="scss" scoped>
  #inventoryAllocate {
    height: 1000px;
    .submit_item {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      margin-top: 8px;
      height: 40px;
    }
    :deep(.el-form-item__label) {
      padding-right: 5px !important;
    }
    :deep(.el-card) {
      height: 100%;
      .el-card__body {
        height: 100%;
        box-sizing: border-box;
        overflow: hidden;
        display: flex;
        flex-direction: column;
      }
    }
    .col_height {
      height: 45px !important;
    }
    .receiveBox,
    .pickingBox {
      display: flex;
      flex: 2;
      > div {
        flex: 1;
        overflow: hidden;
      }
    }
    .productBox {
      display: flex;
      flex: 3;
      > div {
        flex: 1;
        overflow: hidden;
      }
    }
    .selectBox {
      padding: 20px;
    }
    .box-card {
      margin: 20px;
    }
    .flex-right {
      display: flex;
      justify-content: flex-end;
    }
    .productsList {
      margin-right: 10px;
      display: flex;
      flex-direction: column;
      :deep(.el-table) {
        flex: 1;
        display: flex;
        flex-direction: column;
        .el-table__body-wrapper {
          flex: 1 0 auto;
          height: 0;
        }
      }
    }
    .allocateDetails {
      display: flex;
      flex-direction: column;
      :deep(.el-table) {
        flex: 1;
        display: flex;
        flex-direction: column;
        .el-table__body-wrapper {
          flex: 1;
        }
      }
    }
    .control {
      display: flex;
      justify-content: flex-end;
      padding: 10px 10px 0 10px;
      box-sizing: border-box;
    }
    :deep(.el-radio__input.is-disabled .el-radio__inner) {
      background-color: #1890ff !important;
      border-color: #1890ff !important;
    }
    :deep(.el-radio__input.is-disabled.is-checked .el-radio__inner::after) {
      background-color: #1890ff !important;
    }
  }
</style>