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

<template>
  <div class="ele-body">
    <el-card shadow="never">
      <el-form
        :model="formData"
        ref="formName"
        label-width="110px"
        :rules="rules"
      >
        <el-row :gutter="20">
          <!-- <el-col :span="8">
          <el-form-item label="出库单号" prop="bizNum">
            <el-input :value="formData.bizNum" disabled /></el-form-item
        ></el-col> -->
          <el-col :span="8">
            <el-form-item label="出库场景" prop="bizType">
              <el-select
                filterable
                placeholder="请选择"
                v-model="formData.bizType"
                clearable
                @change="handleBizSceneChange"
                :disabled="
                  !!(warehousingMaterialList && warehousingMaterialList.length)
                "
              >
                <el-option
                  v-for="item in outputSceneState"
                  :key="item.code"
                  :value="item.code + ''"
                  :label="item.label"
                ></el-option>
              </el-select> </el-form-item
          ></el-col>
          <el-col :span="8">
            <el-form-item
              :label="
                formData.bizType == 3
                  ? '销售发货单'
                  : formData.bizType == 4
                  ? '领料单'
                  : formData.bizType == 1
                  ? '采购退货单'
                  : '来源单据'
              "
              prop="sourceBizNo"
              :rules="[
                { required: true, message: '请选择来源单据', trigger: 'change' }
              ]"
              v-if="formData.extInfo.assetType == 7 && formData.bizType == 4"
            >
              <el-select
                filterable
                v-model="formData.sourceBizNo"
                :disabled="
                  !!(formData.sourceBizNo && warehousingMaterialList.length)
                "
                clearable
                placeholder="请输入"
                @change="handleDocumentSourceChange"
              >
                <el-option
                  v-for="item in options"
                  :key="item"
                  :label="item"
                  :value="item"
                >
                </el-option> </el-select
            ></el-form-item>
            <el-form-item
              :label="
                formData.bizType == 3
                  ? '销售发货单'
                  : formData.bizType == 4
                  ? '领料单'
                  : formData.bizType == 1
                  ? '采购退货单'
                  : '来源单据'
              "
              v-else
              prop="sourceBizNo"
            >
              <el-input
                @input="$forceUpdate()"
                placeholder="请输入"
                @change="handleDocumentSourceChange"
                v-model="formData.sourceBizNo"
                @click.native="
                  formData.bizType == 4
                    ? handlePickorder()
                    : formData.bizType == 3
                    ? handleEom()
                    : null
                "
              >
                <el-button
                  v-if="formData.bizType == 4 || formData.bizType == 3"
                  slot="append"
                  icon="el-icon-circle-close"
                  @click.stop="onClear"
                ></el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="出库物品类型" prop="extInfo.assetType">
              <!-- <DictSelection
                dictName="类型用途"
                :disabled="
                  !!(warehousingMaterialList && warehousingMaterialList.length)
                "
                clearable
                v-model="formData.extInfo.assetType"
                @itemChange="handleChange"
              /> -->
              <!-- <el-select
                :disabled="
                  !!(warehousingMaterialList && warehousingMaterialList.length)
                "
                clearable
                v-model="formData.extInfo.assetType"
                @change="handleChanges"
              >
                <el-option
                  v-for="(item, index) in codeList"
                  :key="index"
                  :label="item.dictValue"
                  :value="item.dictCode"
                ></el-option>
              </el-select> -->
              <selectTree
                ref="trees"
                class="form-ipt"
                :isBindPlan="
                  !!(warehousingMaterialList && warehousingMaterialList.length)
                "
                size="medium"
                style="width: 100%"
                clearable
                :options="codeList"
                :props="{
                  value: 'id',
                  label: 'name',
                  children: 'children'
                }"
                @getValue="codeListValue"
                :isAll="false"
              />
            </el-form-item>
          </el-col>

          <el-col :span="8" v-if="formData.bizType == 3">
            <el-form-item label="客户名称">
              <el-input
                placeholder="客户名称"
                disabled
                v-model="formData.clientName"
                clearable /></el-form-item
          ></el-col>
          <el-col :span="8" v-if="formData.bizType == 3">
            <el-form-item label="客户联系人">
              <el-input
                placeholder="客户联系人"
                disabled
                v-model="formData.clientUser"
                clearable /></el-form-item
          ></el-col>
          <el-col :span="8" v-if="formData.bizType == 3">
            <el-form-item label="客户电话">
              <el-input
                placeholder="客户电话"
                disabled
                v-model="formData.clientPhone"
                clearable /></el-form-item
          ></el-col>

          <el-col :span="8">
            <el-form-item label="权属部门" prop="deptName">
              <el-input
                placeholder="权属部门"
                disabled
                v-model="formData.extInfo.deptName"
                clearable
              />
            </el-form-item>

            <!-- <selectTree
              ref="tree"
              style="width: 100%"
              size="medium"
              :initStr="formData.deptName"
              clearable
              :options="treeList"
              :props="{
                value: 'code',
                label: 'name',
                children: 'children'
              }"
              @getValue="deptClick"
            /> -->
          </el-col>
          <el-col :span="8">
            <el-form-item label="出库登记人">
              <el-input
                placeholder="登记人"
                disabled
                v-model="formData.extInfo.createUserName"
                clearable /></el-form-item
          ></el-col>
          <!-- <el-col :span="8">
          <el-form-item label="出库时间" prop="outInTime">
            <el-date-picker
              v-model="formData.outInTime"
              clearable
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期"
            >
            </el-date-picker></el-form-item
        ></el-col> -->
          <el-col :span="8">
            <el-form-item label="领料人部门" prop="verifyDeptName">
              <selectTree
                ref="tree"
                class="form-ipt"
                size="medium"
                style="width: 100%"
                clearable
                :options="treeList"
                :props="{
                  value: 'code',
                  label: 'name',
                  children: 'children'
                }"
                @getValue="auditorDeptClick"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="领料人" prop="fromUser">
              <el-select
                v-model="formData.fromUser"
                filterable
                placeholder="请选择领料人"
              >
                <el-option
                  v-for="item in llrLsit"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                  @click.native="
                    () => (formData.extInfo.fromUserPhone = item.phone)
                  "
                >
                </el-option>
              </el-select> </el-form-item
          ></el-col>
          <el-col :span="8">
            <el-form-item label="领料人联系方式" prop="fromUserPhone">
              <el-input
                placeholder="请输入"
                disabled
                v-model="formData.extInfo.fromUserPhone"
                clearable /></el-form-item
          ></el-col>
          <!-- <el-col :span="8">
            <el-form-item label="紧急状态" prop="urgent">
              <el-select
                filterable
                placeholder="请选择"
                v-model="formData.extInfo.urgent"
                clearable
              >
                <el-option
                  v-for="item in emergencyState"
                  :key="item.code"
                  :value="item.code"
                  :label="item.label"
                ></el-option>
              </el-select> </el-form-item
          ></el-col> -->

          <!-- <el-col :span="8">
            <el-form-item label="审核人" prop="verifyId">
              <el-select
                filterable
                class="form-ipt"
                style="width: 100%"
                v-model="formData.verifyId"
                placeholder="请选择"
              >
                <el-option
                  v-for="item in staffList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                  @click.native="() => (formData.verifyName = item.name)"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <!-- <el-col :span="24">
            <el-form-item label="附件" prop="contentImage">
              <selectUpload @getImgs="upload" :initData="uploadList" />
            </el-form-item>
          </el-col> -->
          <el-col :span="24">
            <el-form-item label="备注" prop="remark">
              <el-input
                v-model="formData.remark"
                clearable
                type="textarea"
                placeholder="请详细说明"
                :rows="4"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <div class="material">
        <div style="width: 100%; text-align: right"
          ><el-button type="primary" @click="addStock">添加</el-button></div
        >
        <div v-if="dimension != 4">
          <div class="flex">
            <div><span class="red">*</span>物品清单</div>
            <div>
              <!-- <el-button type="primary" @click="addStock">添加</el-button> -->
            </div>
          </div>
          <div class="mt10 form-table">
            <el-form
              ref="warehousingMaterialListRef"
              :model="{ warehousingMaterialList: warehousingMaterialList }"
              :show-message="false"
            >
              <el-table
                ref="multipleTable"
                :data="warehousingMaterialList"
                tooltip-effect="dark"
                style="width: 100%"
                stripe
                :header-cell-style="{ background: '#EEEEEE', border: 'none' }"
              >
                <el-table-column label="序号" type="index" width="50">
                </el-table-column>
                <el-table-column
                  label="编码"
                  prop="assetCode"
                ></el-table-column>

                <el-table-column
                  label="名称"
                  prop="assetName"
                ></el-table-column>

                <el-table-column
                  v-for="(item, index) in tableHeader"
                  :key="index"
                  align="center"
                  :label="item.label"
                  width="150"
                  :prop="item.prop"
                >
                  <template slot-scope="{ row }">
                    <template v-if="item.formatter">{{
                      item.formatter(row)
                    }}</template>
                    <template v-else>{{ row[item.prop] }}</template>
                  </template>
                </el-table-column>
                <el-table-column
                  label="批次号"
                  prop="batchNo"
                ></el-table-column>
                <el-table-column label="最小包装单元" width="120">
                  <template slot-scope="{ row }">
                    {{ row.minPackingCount }}{{ row.measuringUnit }}/{{
                      row.minUnit
                    }}
                  </template>
                </el-table-column>
                <el-table-column label="包装数量" prop="availableCountBase">
                  <template slot-scope="{ row }">
                    {{ row.packingCountBase }}{{ row.minUnit }}
                  </template>
                </el-table-column>
                <el-table-column
                  label="计量数量"
                  prop="availableCountBase"
                ></el-table-column>
                <el-table-column
                  label="计量单位"
                  prop="measuringUnit"
                ></el-table-column>
                <el-table-column label="重量" prop="weight"></el-table-column>
                <el-table-column
                  label="重量单位"
                  prop="weightUnit"
                ></el-table-column>
                <el-table-column
                  label="仓库"
                  width="300"
                  prop="pathName"
                ></el-table-column>
                <!-- <el-table-column
                label="出库数量"
                prop=""
                align="center"
                width="350px"
              >
                <template slot-scope="{ row, $index }">
                  <el-row :gutter="4">
                    <el-col :span="9" v-if="!row.isUnpack">
                      <el-input type="text" disabled :value="row.outInNum">
                        <template slot="append">
                          {{ row.minPackUnit }}
                        </template>
                      </el-input>
                    </el-col>
                    <el-col :span="6">
                      <el-button type="text" @click="handleSetting(row, $index)"
                        >出库明细选择</el-button
                      ></el-col
                    >
                  </el-row>
                </template>
              </el-table-column> -->
                <el-table-column label="操作" width="200">
                  <template slot-scope="{ row, $index }">
                    <el-button type="text" @click="listDel(row, $index)"
                      >删除</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
            </el-form>
          </div>
          <div class="flex" style="margin-top: 20px">
            <div><span class="red">*</span>包装清单</div>
          </div>
          <div class="mt10 form-table">
            <BatchDetail
              :assetType="formData.extInfo.assetType"
              :data="batchDetailsVOList"
            />
          </div>
        </div>
        <!-- <div class="flex" style="margin-top: 20px">
          <div><span class="red">*</span>包装清单</div>
        </div>
        <div class="mt10 form-table">
          <BatchDetail
            :assetType="formData.extInfo.assetType"
            :codeObj="{ name: '包装编码', prop: 'code' }"
            :nameObj="{ name: '名称', prop: 'name' }"
          />
        </div> -->

        <div class="mt20">
          <el-tabs v-model="activeName" type="card">
            <el-tab-pane :label="`${title}明细`" name="a">
              <el-table
                ref="multipleTable"
                :data="materialCodeReqList"
                tooltip-effect="dark"
                style="width: 100%"
                stripe
                :header-cell-style="rowClass"
              >
                <el-table-column label="序号" type="index" width="50">
                </el-table-column>

                <el-table-column
                  :label="`编码`"
                  min-width="100"
                  prop="assetCode"
                ></el-table-column>
                <el-table-column label="名称" prop="name" width="50">
                </el-table-column>

                <el-table-column label="批次号" prop="batchNo">
                </el-table-column>
                <el-table-column
                  v-if="dimension == 4"
                  label="包装编码"
                  min-width="100"
                  prop="onlyCode"
                ></el-table-column>
                <el-table-column
                  v-for="(item, index) in tableHeader"
                  :key="index"
                  align="center"
                  :label="item.label"
                  width="150"
                  :prop="item.prop"
                >
                  <template slot-scope="{ row }">
                    <template v-if="item.formatter">{{
                      item.formatter(row)
                    }}</template>
                    <template v-else>{{ row[item.prop] }}</template>
                  </template>
                </el-table-column>
                <el-table-column
                  label="物料编码"
                  width="250"
                  prop="no"
                ></el-table-column>

                <!-- <el-table-column label="生产日期" width="200">
                  <template slot-scope="{ row }">
                    <span v-if="row.dateType === 2">
                      {{ row.produceTime }}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="采购日期" width="200">
                  <template slot-scope="{ row }">
                    <span v-if="row.dateType === 1">
                      {{ row.procureTime }}
                    </span>
                  </template>
                </el-table-column> -->
                <el-table-column label="计量数量" prop="">
                  <template slot-scope="{ row }">1</template>
                </el-table-column>
                <el-table-column
                  label="计量单位"
                  prop="measuringUnit"
                ></el-table-column>
                <el-table-column label="物料代号" prop="meterielCode">
                </el-table-column>
                <el-table-column
                  label="客户代号"
                  prop="clientCode"
                ></el-table-column>
                <el-table-column label="刻码" prop="engrave"></el-table-column>
                <el-table-column label="重量" prop="weight"></el-table-column>
                <el-table-column
                  label="重量单位"
                  prop="weightUnit"
                ></el-table-column>
                <!-- <el-table-column
                  label="货位"
                  prop="pathName"
                  show-overflow-tooltip
                >
                </el-table-column>
                <el-table-column label="转消耗" prop="">
                  <template slot-scope="{ row }">
                    <el-checkbox v-model="row.isTransferAsset"></el-checkbox>
                  </template>
                </el-table-column> -->
              </el-table>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
      <div class="center mt20">
        <el-button type="primary" @click="handleNewSave" :loading="saveLoading"
          >保存</el-button
        >
        <el-button @click="$router.go(-1)">返回</el-button>
      </div>
    </el-card>

    <AssetsDialog
      ref="assetsDialogRef"
      :title="title"
      :warehousingMaterialList="selectionList"
      :assetType="formData.extInfo.assetType"
      @detailData="detailData"
    />

    <!-- @selectTableData="onSelectTableData" -->

    <!-- 选桶号 -->
    <detailSelect
      ref="detailSelectRef"
      :title="title"
      :tableHeader="tableHeader"
    />

    <!--  转资产 -->
    <!-- <TurnToAsset ref="turnToAssetRef" /> -->
    <!-- 选择仓库 -->
    <WareHouseDailog ref="wareHouseDailogRef"></WareHouseDailog>

    <!-- 选领料单 -->
    <pickOrder ref="pickOrderRef" @success="pickOrderRow" />
    <!-- 销售订单 -->
    <eom ref="eomRef" @success="eomSuccess" />
  </div>
</template>

<script>
  import outin from '@/api/warehouseManagement/outin';
  import warehouseDefinition from '@/api/warehouseManagement/warehouseDefinition';
  import { getTreeByPid, getTreeByGroup } from '@/api/classifyManage';
  import selectUpload from '@/components/selectUpload';
  import upload from '@/components/uploadImg';
  import pickOrder from './components/pickOrder.vue';
  import {
    warehousingType,
    outputSceneState,
    emergencyState,
    materialType
  } from '@/utils/dict/index';

  import selectTree from '@/components/selectTree';
  import AssetsDialog from '../components/AssetsDialog.vue';
  import outputType from '../components/outputType.vue';
  // import TurnToAsset from '../components/TurnToAsset/index.vue'
  import WareHouseDailog from '../components/WareHouseDailog.vue';
  // import supplier from '@/api/main/supplier';
  // import org from '@/api/main/org';
  // import user from '@/api/main/user';
  import { tableHeader } from '../common';
  import detailSelect from './components/detailSelect';
  import eom from './components/eom.vue';

  import BatchDetail from './components/batchDetail.vue';
  export default {
    components: {
      BatchDetail,
      pickOrder,
      selectUpload,
      selectTree,
      AssetsDialog,
      WareHouseDailog,
      upload,
      detailSelect,
      // TurnToAsset,
      outputType,
      eom
    },
    data() {
      return {
        dimension: '3',
        llList: [],
        codeList: [],
        materialType,
        warehousingType,
        outputSceneState,
        emergencyState,
        saveLoading: false,
        title: '',
        tableData2: [],
        uploadList: [],
        fromUserList: [], //人员数组
        warehousingMaterialList: [],
        activeName: 'a',
        treeList: [],
        staffList: [],
        formData: {
          extInfo: {
            assetType: '', //物品类型
            deptCode: '', //部门code
            deptName: '', //部门名称
            verifyDeptCode: '', //审核部门编码
            verifyDeptName: '', //审核部门名称
            deliveryName: '', //送货人名称
            fromUserPhone: '', //送货人电话
            sourceBizNo: '', //销售订单
            urgent: '', //紧急状态
            supplierId: '', //供应商ID
            supplierName: '', //供应商名称
            createUserName: '', //创建人名字
            contentImage: [] //图片数组
          },
          fromUser: '', //送货人
          bizType: '', //物品类型
          verifyId: '', //审核人Id
          verifyName: '', //审核人名称

          createUserId: '',
          remark: ''
        },

        rules: {
          // 'extInfo.assetType': {
          //   required: true,
          //   message: '请选择出库产品类型',
          //   trigger: 'change'
          // },
          bizType: {
            required: true,
            message: '请选择出库场景',
            trigger: 'change'
          },
          fromUser: {
            required: true,
            message: '请选择领料人',
            trigger: 'change'
          }
          // verifyDeptName: {
          //   required: true,
          //   message: '请选择领料部门',
          //   trigger: 'blur'
          // }
        },
        llrLsit: [],
        options: [],
        loading: false,
        onSelectTableDataVal: [],
        batchDetailsVOList: [],
        materialCodeReqList: [],
        selectionList: [],
        // shouldTriggerPickorder: true,
        materialObj: {},
        wlParams: {}
      };
    },
    computed: {
      tableHeader() {
        return tableHeader(this.formData.extInfo.assetType);
      }
      // 条码信息
      // materialCodeReqList() {
      //   return this.warehousingMaterialList
      //     .map((i) => i.warehouseLedgerDetails || [])
      //     .flat();
      // }
    },
    created() {
      this.initData();
    },
    methods: {
      detailData(data, dimension) {
        this.dimension = dimension;
        console.log('总数居', data);
        this.onSelectTableDataVal = data.realTimeInventoryVOList;
        this.warehousingMaterialList = data.realTimeInventoryVOList.map(
          (next) => {
            delete next.updateTime;
            delete next.createTime;
            return {
              ...next,
              realInventoryAmount: 0,
              assetType: this.formData.extInfo.assetType,
              outInNum: '',
              assetCode: next.code,
              assetName: next.name,
              bizStatus: 2,
              contactCode: next.contactCode
            };
          }
        );
        // this.batchDetailsVOList = data.batchDetailsVOList;

        if (dimension == 4) {
          this.materialCodeReqList = data.wlList;
          this.selectionList = data.wlList;

          let params = {
            realTimeInventoryNewPOList: data.realTimeInventoryVOList
          };

          for (const item of params.realTimeInventoryNewPOList) {
            item.inventoryDetailsNewPOList = item.inventoryDetailsVOList;

            for (const detail of item.inventoryDetailsNewPOList) {
              detail.outInMaterialDetailsAddPOList = [];

              for (const wlItem of data.wlList) {
                if (detail.id === wlItem.recordId) {
                  detail.outInMaterialDetailsAddPOList.push({
                    ...wlItem
                  });
                }
              }
            }
          }
          this.wlParams = params;

          this.materialObj = data;
        } else if (dimension == 3) {
          //包装维度出库
          const list = data.realTimeInventoryVOList;
          //获取包装维度
          let packArr = [];
          for (const item of list) {
            if (item.inventoryDetailsVOList.length != 0) {
              for (const iterator of item.inventoryDetailsVOList) {
                packArr.push({ ...iterator, batchNo: iterator.batchNum });
              }
            }
          }
          this.batchDetailsVOList = packArr.map((item) => {
            return {
              ...item,
              packingCountBase:
                dimension == 4 || dimension == 3 ? 1 : item.packingCountBase,
              weight: 0
            };
          });
          //物料维度数据
          let meteArr = [];
          for (const item of packArr) {
            if (item.materialDetailsVOList.length != 0) {
              for (const iterator of item.materialDetailsVOList) {
                meteArr.push({
                  ...iterator
                });
              }
            }
          }
          this.materialCodeReqList = meteArr;
          //再次打开选择上
          this.selectionList = list;
          //send数据
          this.wlParams = { realTimeInventoryNewPOList: list };
          this.wlParams.realTimeInventoryNewPOList.forEach((item) => {
            item.inventoryDetailsNewPOList = item.inventoryDetailsVOList;
            item.inventoryDetailsNewPOList.forEach((ite) => {
              ite.weight = 0;
              ite.outInMaterialDetailsAddPOList = ite.materialDetailsVOList;
            });
          });
        } else {
          //   else if (dimension == 2) {
          //   this.batchDetailsVOList = data.wlList;
          //   this.selectionList = data.wlList;
          // }
          //物品维度出库
          const list = data.realTimeInventoryVOList;
          //获取包装维度
          let packArr = [];
          for (const item of list) {
            if (item.inventoryDetailsVOList.length != 0) {
              for (const iterator of item.inventoryDetailsVOList) {
                packArr.push({ ...iterator, batchNo: iterator.batchNum });
              }
            }
          }
          this.batchDetailsVOList = packArr.map((item) => {
            return {
              ...item,
              packingCountBase: dimension == 3 ? 1 : item.packingCountBase,
              weight: 0
            };
          });
          //物料维度数据
          let meteArr = [];
          for (const item of packArr) {
            if (item.materialDetailsVOList.length != 0) {
              for (const iterator of item.materialDetailsVOList) {
                meteArr.push({
                  ...iterator
                });
              }
            }
          }
          this.materialCodeReqList = meteArr;
          //再次打开选择上
          this.selectionList = list;
          //send数据
          this.wlParams = { realTimeInventoryNewPOList: list };
          this.wlParams.realTimeInventoryNewPOList.forEach((item) => {
            item.inventoryDetailsNewPOList = item.inventoryDetailsVOList;
            item.inventoryDetailsNewPOList.forEach((ite) => {
              ite.weight = 0;
              ite.outInMaterialDetailsAddPOList = ite.materialDetailsVOList;
            });
          });
        }
      },
      handleNewSave() {
        this.$refs.formName.validate(async (valid) => {
          if (valid) {
            if (!this.warehousingMaterialList?.length) {
              return this.$message.error('请添加出库明细！');
            }
            let obj = { ...this.formData, type: 2 };

            obj.extInfo.sourceBizNo = obj.sourceBizNo;
            // obj.fromId=
            obj.fromType = obj.type;
            this.saveLoading = true;
            obj = { ...obj, ...this.wlParams };
            if (this.dimension == 4) {
              obj.num = this.materialObj.wlList.length;
            } else {
              obj.num = this.materialCodeReqList.length;
            }
            console.log('2222', obj);

            try {
              const res = await outin.saveNew(obj);
              if (res.code == 0) {
                await await outin.outApprove({ outInId: res.data });
                this.$message.success('保存成功！');
              }
              this.$router.push('/warehouseManagement/outgoingManagement');
              if (res?.success) {
                this.$message.success('保存成功！');
                this.$router.go(-1);
              }
              this.saveLoading = false;
            } catch (error) {
              this.saveLoading = false;
            }
          }
        });
      },

      onClear() {
        this.formData.sourceBizNo = '';
        this.warehousingMaterialList = [];
        this.$refs.trees.valueTitle = '';
        this.formData.clientName = '';
        this.formData.clientUser = '';
        this.formData.clientPhone = '';
        this.title = '';
        this.$forceUpdate();
      },
      eomSuccess(row) {
        console.log(row);
        this.formData.extInfo.assetType = 9;
        this.$refs.trees.valueTitle = '产品';
        this.title = '产品';
        this.formData.sourceBizNo = row.orderNo;
        this.formData.sid = row.id;
        this.formData.fromId = row.id;
        this.formData.clientName = row.contactName;
        this.formData.clientUser = row.linkName;
        this.formData.clientPhone = row.linkPhone;
        this.onSelectTableData(row.tableData, 1);
        this.$forceUpdate();
      },
      pickOrderRow(row) {
        this.formData.sid = row.id;
        row.tableData = [];
        this.formData.sourceBizNo = row.code;
        for (const key in row.orderInfoList) {
          if (row.orderInfoList[key].bomDetailDTOS.length != 0) {
            for (const i in row.orderInfoList[key].bomDetailDTOS) {
              row.tableData.push({
                ...row.orderInfoList[key].bomDetailDTOS[i],
                code: row.orderInfoList[key].bomDetailDTOS[i].categoryCode,
                name: row.orderInfoList[key].bomDetailDTOS[i].categoryName,
                modelType: row.orderInfoList[key].bomDetailDTOS[i].model,
                id: row.orderInfoList[key].bomDetailDTOS[i].categoryId
              });
            }
          }
          if (row.orderInfoList[key].instanceList.length != 0) {
            for (const j in row.orderInfoList[key].instanceList) {
              row.tableData.push({
                ...row.orderInfoList[key].instanceList[j],
                code: row.orderInfoList[key].instanceList[j].categoryCode,
                name: row.orderInfoList[key].instanceList[j].categoryName,
                modelType: row.orderInfoList[key].instanceList[j].model,
                id: row.orderInfoList[key].instanceList[j].instanceId
              });
            }
          }
        }

        const uniqueItems = [];
        const uniqueIds = new Set();
        row.tableData.forEach((item) => {
          if (!uniqueIds.has(item.code)) {
            uniqueIds.add(item.code);
            uniqueItems.push(item);
          }
        });
        row.tableData = uniqueItems;
        console.log(row);
        this.onSelectTableData(row.tableData, 1);

        this.selectTop(row);
        this.$forceUpdate();
      },
      async selectTop(row) {
        let list = row.tableData;
        let arr = [];
        for (const it of list) {
          arr.push({
            categoryLevelId: it.rootCategoryLevelId,
            code: it.code,
            count: it.demandQuantity
          });
        }
        const data = await outin.getDetailByCode(arr);
        console.log('===', data);
      },
      handleEom() {
        this.$refs.eomRef.open();
      },
      handlePickorder() {
        this.$refs.pickOrderRef.open();
      },
      async handleDocumentSourceChange() {
        // this.formData.sourceBizNo = '';
        if (!this.formData.sourceBizNo) {
          if (this.formData.bizType == 4) {
            this.warehousingMaterialList = [];
          }
          return;
        }

        if (
          !(this.formData.extInfo.assetType == 7 && this.formData.bizType == 4)
        ) {
          return;
        }

        const loading = this.$loading({ fullscreen: true });

        const res = await getSparePartsInfo({
          code: this.formData.sourceBizNo
        });
        if (res?.success && res.data.length) {
          const curMap = {
            assetId: 'classificationId',
            assetCode: 'informationCode', //编码
            assetName: 'informationName', //名称
            materialId: 'classificationId',
            materialName: 'informationName',
            batchNo: '', //批次号
            unit: 'measuringUnit', //单位
            minPackUnit: 'packingUnit' //最小包装单位
          };

          res.data.forEach((item) => {
            let obj = {};
            for (const key in curMap) {
              obj[key] = curMap[key] ? item[curMap[key]] : '';
            }
            obj.curId =
              obj.assetCode +
              (obj.measurementUnit || '') +
              (obj.minPackUnit || '') +
              (obj.unit || '');
            console.log(obj.curId);
            const index = this.warehousingMaterialList.findIndex(
              (i) => i.curId === obj.curId
            );
            if (index === -1) {
              Object.assign(obj, item);
              obj.sparePartsNum = item.num;

              this.warehousingMaterialList.push(obj);
            } else {
              this.warehousingMaterialList[index].sparePartsNum = item.num;
            }
          });
        }
        loading.close();
      },
      // 备品备件来源单号
      async remoteMethod(code) {
        // if (code !== '') {
        //   this.loading = true

        const res = await getDocumentSource({ code });
        if (res?.success) {
          this.options = res.data;
        }
        //   this.loading = false
        // } else {
        //   this.options = []
        // }
      },
      rowClass({ row, column, rowIndex, columnIndex }) {
        if (rowIndex === 1) {
          return {
            display: 'none',
            background: '#EEEEEE',
            border: 'none'
          };
        }

        return { background: '#EEEEEE', border: 'none' };
      },
      // 部门 点击事件

      async auditorDeptClick(data) {
        console.log(data);
        this.formData.extInfo.verifyDeptCode = data?.id;
        this.formData.extInfo.verifyDeptName = data?.name;
        this.formData.verifyId = '';
        this.formData.verifyName = '';

        this.$refs.formName.validateField('verifyDeptName');
        if (data) {
          this.getStaffList(data);
        }
      },

      async getStaffList(data) {
        let res = await warehouseDefinition.getUserPage({
          groupId: data.id,
          size: 9999,
          page: 1
        });
        this.llrLsit = res.list;
      },
      // // 转资产
      // turnToAssets (row) {
      //   this.$refs.turnToAssetRef
      //     .open(row.transferCurVal)
      //     .then(({ code, name }) => {
      //       row.transferType = name

      //       row.materialId = code
      //       row.materialName = name.split('/').pop()
      //       row.transferType = name

      //       this.$set(row, 'transferCurVal', code)
      //     })
      // },
      handleSetting(row) {
        row.bizTypes = this.formData.bizType;
        row.type = this.formData.bizType == 3 ? 1 : 0;
        this.$refs.detailSelectRef
          .open(row, row.warehouseLedgerDetails || [])
          .then((res) => {
            console.log(res);
            console.log(row);
            this.$set(
              row,
              'warehouseLedgerDetails',
              (res || []).map((item) => {
                delete item.updateTime;
                delete item.createTime;
                this.$set(item, 'isTransferAsset', false);
                item.isUnpack = row.isUnpack;
                return item;
              })
            );
            this.$set(row, 'outInNum', res.length);
            this.$set(row, 'minPackUnit', res[0].minPackUnit);
            this.$set(
              row,
              'selfSum',
              row.warehouseLedgerDetails.reduce((sum, pre) => {
                if (row.isUnpack) {
                  return ++sum;
                }
                return sum + pre.measurementUnit;
              }, 0)
            );
          });
      },

      // 仓库编辑
      handleWareHouse(row) {
        this.$refs.wareHouseDailogRef.open(row);
      },
      // 出库操作
      listEdit(row) {
        this.$set(row, 'isSave', false);
      },

      //出库明细删除
      listDel(row, index) {
        this.warehousingMaterialList.splice(index, 1);
        if (this.warehousingMaterialList.length == 0) {
          this.formData.sourceBizNo = '';
          this.formData.extInfo.clientName = '';
          this.formData.extInfo.clientUser = '';
          this.formData.extInfo.clientUserPhone = '';
        }
        // 从 this.batchDetailsVOList 中删除满足条件的对象
        this.removeItemsFromArray(
          this.batchDetailsVOList,
          (item) => item.code.substr(0, 12) === row.code
        );

        // 从 this.materialCodeReqList 中删除满足条件的对象
        this.removeItemsFromArray(
          this.materialCodeReqList,
          (item) => item.assetCode === row.code
        );
      },
      // 删除数组中满足条件的对象
      removeItemsFromArray(arr, condition) {
        for (let i = arr.length - 1; i >= 0; i--) {
          if (condition(arr[i])) {
            arr.splice(i, 1);
          }
        }
      },
      // 出库明细生成条码信息
      async createMaterialCode(row) {
        let arr = [];
        const res = await getAssetNum({
          assetCode: row.assetCode,
          num: row.outInNum || 1
        });
        if (res?.success) {
          delete row.createTime;
          arr = Array.from(new Array(res.data.length), (val, idx) => ({
            ...row,
            num: res.data[idx],
            bizStatus: 2,
            isTransferAsset: false
          }));
        }
        return arr;
      },

      handleSave() {
        this.$refs.formName.validate(async (valid) => {
          if (valid) {
            if (!this.warehousingMaterialList?.length) {
              return this.$message.error('请添加出库明细！');
            } else if (
              this.warehousingMaterialList.some(
                (item) => !item.warehouseLedgerDetails?.length
              )
            ) {
              return this.$message.error('请完善出库明细数据！');
            }
            console.log('qqqq===>', this.warehousingMaterialList);
            let arr = this.warehousingMaterialList.map((item) => {
              return {
                batchNo: item.batchNo,
                categoryId: item.id,
                count: item.outInNum,
                num: item.outInNum,
                minPackingCount: item.selfSum,
                packingCount: item.outInNum,
                outInDetailRecordAddPOList: item.warehouseLedgerDetails,

                ...item
                // position: `${item.warehouseName}-${item.areaName}-${item.shelfCode}-${item.cargoSpaceCode}`,
                // // pathIds: item.categoryLevelPathId.toString(),

                // pathIds: `${item.warehouseId},${item.areaId},${item.shelfId},${item.cargoSpaceId}`,
                // totalMoney:
                //   item.outInNum * item.minPackingCount * item.univalence
              };
            });
            arr.forEach((item) => {
              item.warehouseId =
                item.warehouseLedgerDetails[0].pathIds.split(',')[0];
              delete item.id;
              delete item.warehouseLedgerDetails;
              if (item.outInDetailRecordAddPOList.length > 0) {
                let list = item.outInDetailRecordAddPOList.map((it) => {
                  return {
                    positionId: it.positionId,
                    code: it.sourceBizNo,
                    dateType: it.dateType,
                    dateValue: it.dateValue,
                    minUnit: it.minUnit,
                    batchNo: it.sourceBatchNo,
                    position: it.pathName,
                    // minPositionId: it.cargoSpaceId,
                    minPositionId: it.minPositionId,
                    name: it.name,
                    pathIds: it.pathIds,
                    unit: it.unit,
                    packageNo: it.packageNo,
                    minPackingCount: it.minPackingCount,
                    procureTime: it.procureTime,
                    produceTime: it.produceTime
                    // num: it.minPackingCount
                  };
                });
                item.outInDetailRecordAddPOList = list;
              }
            });
            let obj = { ...this.formData, type: 2 };
            for (const key in arr) {
              arr[key].count = arr[key].outInNum;
            }
            obj.outInDetailAddPOList = arr;
            obj.extInfo.sourceBizNo = obj.sourceBizNo;
            obj.fromType = obj.type;
            this.saveLoading = true;

            // console.log('明细', this.warehousingMaterialList);
            // const categoryLevelId = this.$refs.assetsDialogRef.materialType;
            // let newObj = {
            //   inOutAddPO: {
            //     ...this.formData,
            //     ...this.formData.extInfo,
            //     bizStatus: 2
            //   },
            //   warehouseLedgerInfos: this.handelArr(
            //     this.warehousingMaterialList,
            //     categoryLevelId
            //   )
            // };
            // delete newObj.inOutAddPO.extInfo;
            console.log('2222', obj);

            const res = await outin.save(obj);
            if (res.code == 0) {
              this.$message.success('保存成功！');
            }

            this.saveLoading = false;
            this.$router.push('/warehouseManagement/outgoingManagement');

            if (res?.success) {
              this.$message.success('保存成功！');
              this.$router.go(-1);
            }
          }
        });
      },
      handelArr(arr, id) {
        for (const key in arr) {
          arr[key].inLedgerId = arr[key].id;
          arr[key].categoryLevelId = id;
          for (const k in arr[key].warehouseLedgerDetails) {
            arr[key].warehouseLedgerDetails[k].ledgerDetailId =
              arr[key].warehouseLedgerDetails[k].id;
            arr[key].warehouseLedgerDetails[k].inDetailId = arr[key].inLedgerId;

            arr[key].warehouseLedgerDetails[k].isTransferAsset = arr[key]
              .warehouseLedgerDetails[k].isTransferAsset
              ? 1
              : 0;
            arr[key].warehouseLedgerDetails[k].bizStatus = 2;
          }
        }
        return arr;
        // let newArr = arr.map((item) => {
        //   return { ...item, ledgerId: item.id };
        // });
        // newArr.map((item) => {
        //   item.warehouseLedgerDetails.map((ite) => {
        //     return { ...ite, ledgerDetailId: ite.id, ledgerId: item.id };
        //   });
        // });
        // return newArr;
      },
      //添加明细
      onSelectTableData(val, e) {
        // if (e == 1) {
        //   this.llList = val;
        // } else {
        //   this.llList = [];
        // }
        // .concat(this.llList)
        // if (this.warehousingMaterialList.length != 0) {
        //   val = this.warehousingMaterialList.concat(val);
        // }
        this.onSelectTableDataVal = val;
        this.warehousingMaterialList = val.map((next) => {
          delete next.updateTime;
          delete next.createTime;

          return {
            ...next,
            realInventoryAmount: 0,
            // cargoSpaceCode: '', //货位编码
            // cargoSpaceId: '', //货位id
            // shelfId: '', //货架id
            // shelfCode: '', //货架名称
            // areaId: '', //库区id
            // areaName: '', //库区名称
            // warehouseId: '', //仓库id
            // warehouseName: '', //仓库名称
            assetType: this.formData.extInfo.assetType,
            outInNum: '',
            assetCode: next.code,
            assetName: next.name,
            bizStatus: 2,
            contactCode: next.contactCode
          };
        });
        console.log('sasasasa===>>>', this.warehousingMaterialList);
      },
      codeListValue(val) {
        console.log(val);
        this.formData.extInfo.assetType = val.id;
        this.$forceUpdate();
        this.title = val?.name;
        this.selectEquiType = val?.id;
        console.log(this.title);
      },
      async initData() {
        const { data } = await getTreeByGroup({ type: 1 });
        this.codeList = data;
        const res = await warehouseDefinition.tree();
        this.treeList = this.$util.toTreeData({
          data: res,
          idField: 'id',
          parentIdField: 'parentId'
        });

        let res22 = await warehouseDefinition.getUserPage({
          size: -1,
          page: 1
        });
        this.fromUserList = res22.list;

        // /
        // const res111 = await warehouseDefinition.list();
        // this.warehouseList = res111.list;
        // console.log('res=====', res);
        const info = JSON.parse(localStorage.getItem('info'));
        let obj = res.find(
          (item) => item.id === info.deptId[info.deptId.length - 1]
        );
        // console.log('obj=====', obj);
        this.formData.extInfo.deptName = obj.name;
        this.formData.extInfo.deptCode = obj.id;
        this.formData.extInfo.createUserName = info.name;
        this.formData.createUserId = info.userId;
      },
      addStock() {
        if (!this.title) return this.$message.error('请选择出库产品类型');
        if (!this.formData.bizType && this.formData.bizType !== 0)
          return this.$message.error('请选择出库场景');
        // if (this.formData.bizType == 4&& !this.formData.sourceBizNo) {
        //   return this.$message.error('请选择来源单据');
        // }

        this.$refs.assetsDialogRef.open();
      },
      handleChange(data) {
        this.title = data?.dictValue;
        if (this.formData.bizType == 4) {
          this.formData.sourceBizNo = '';
        }
      },
      handleChanges(code) {
        const data = this.codeList.find((item) => item.dictCode == code);
        this.title = data?.dictValue;
        this.selectEquiType = data?.dictCode;
        if (this.formData.bizType == 4) {
          this.formData.sourceBizNo = '';
        }
      },
      handleBizSceneChange() {
        if (this.formData.extInfo.assetType == 7) {
          this.formData.extInfo.sourceBizNo = '';
        }
        this.formData.sourceBizNo = '';
      },
      getSupplier() {
        return new Promise((resolve, reject) => {
          supplier.list({ page: 1, size: 999 }).then((res) => {
            if (res.success) {
              resolve(res);
            }
          });
        });
      },
      upload(data) {
        this.formData.contentImage = data;
        this.$refs.formName.validateField('contentImage');
      },
      deptClick(data) {
        this.formData.deptName = data?.name;
        this.formData.deptCode = data?.code;
      }
    }
  };
</script>

<style lang="scss" scoped>
  ::v-deep.form-table {
    .el-form-item {
      margin-bottom: 0;
    }
    .el-input__inner {
      padding: 0 10px;
    }
  }

  .p20 {
    padding: 20px;
  }
  .el-select,
  .el-date-editor {
    width: 100%;
  }
  .el-form-item {
    margin-bottom: 22px;
  }
  .material {
    margin-top: 20px;
    .flex {
      display: flex;
      justify-content: space-between;
      font-size: 14px;
      align-items: center;
      .red {
        color: #ff4949;
      }
    }
  }
  .mt10 {
    margin-top: 10px;
  }
  .mt20 {
    margin-top: 20px;
  }
  .center {
    text-align: center;
  }
</style>