logpm_page/src/views/distribution/inventory/distributionStockArticleDetails.vue

<template>
  <basic-container v-loading="loadingObj.pageLoading">
    <div class="avue-crud">
      <el-row v-if="!search">
        <!-- 列表模块 -->
        <el-table
          ref="table"
          v-loading="loading"
          :data="data"
          style="width: 100%"
          :border="option.border"
        >
          <!--          <el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>-->
          <!--          <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>-->
          <!--          <el-table-column v-if="option.index" label="序号" type="index" width="60" align="center">-->
          <!--          </el-table-column>-->
          <template v-for="(item, index) in option.columnBasic">
            <!-- table字段 -->
            <el-table-column
              v-if="item.hide !== true"
              :prop="item.prop"
              :label="item.label"
              :width="item.width"
              :key="index"
            >
            </el-table-column>
          </template>
        </el-table>
      </el-row>
      <el-row style="margin-bottom: 1%">
        <!-- 列表模块 -->
        <el-table
          ref="table"
          v-loading="loading"
          @selection-change="selectionChange"
          :data="data"
          style="width: 100%"
          :border="option.border"
        >
          <!--          <el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>-->
          <!--          <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>-->
          <!--          <el-table-column v-if="option.index" label="序号" type="index" width="60" align="center">-->
          <!--          </el-table-column>-->
          <template v-for="(item, index) in option.columnTakeOver">
            <!-- table字段 -->
            <el-table-column
              v-if="item.hide !== true"
              :prop="item.prop"
              :label="item.label"
              :width="item.width"
              :key="index"
            >
            </el-table-column>
          </template>
          <!-- 操作栏模块 -->
          <el-table-column prop="menu" label="操作" :width="220" align="center">
            <template #="{ row }">
              <!--              <el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>-->
              <el-button
                type="primary"
                text
                icon="el-icon-edit"
                @click="handleCallDelivery('3', row)"
                >编辑</el-button
              >
              <!--              <el-button type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>-->
            </template>
          </el-table-column>
        </el-table>
      </el-row>
      <el-row style="margin-bottom: 1%">
        <!-- 列表模块 -->
        <el-table
          ref="table"
          v-loading="loading"
          @selection-change="selectionChange"
          :data="data"
          style="width: 100%"
          :border="option.border"
        >
          <!--          <el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>-->
          <!--          <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>-->
          <!--          <el-table-column v-if="option.index" label="序号" type="index" width="60" align="center">-->
          <!--          </el-table-column>-->
          <template v-for="(item, index) in option.columnTakeClice">
            <!-- table字段 -->
            <el-table-column
              v-if="item.hide !== true"
              :prop="item.prop"
              :label="item.label"
              :width="item.width"
              :key="index"
            >
            </el-table-column>
          </template>
          <el-table-column prop="menu" label="操作" :width="220" align="center">
            <template #="{ row }">
              <!--              <el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>-->
              <el-button
                type="primary"
                text
                icon="el-icon-edit"
                @click="Modifywaybillrecipient(row)"
                >编辑</el-button
              >
              <!--              <el-button type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>-->
            </template>
          </el-table-column>
          <!--          &lt;!&ndash; 操作栏模块 &ndash;&gt;-->
          <!--          <el-table-column prop="menu" label="操作" :width="220" align="center">-->
          <!--            <template #="{row}">-->
          <!--&lt;!&ndash;              <el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>&ndash;&gt;-->
          <!--              <el-button type="primary" text icon="el-icon-edit" @click="handleCallDelivery('3',row)">编辑</el-button>-->
          <!--              &lt;!&ndash;              <el-button type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>&ndash;&gt;-->
          <!--            </template>-->
          <!--          </el-table-column>-->
        </el-table>
      </el-row>
      <!-- 零担数据没有该模块 -->
      <template v-if="Number($route.query.isZero) === 0">
        <h3>包件信息</h3>
        <div class="plck">
          <el-button type="primary" @click="allhandleQRCode">批量查看二维码</el-button>
          <el-button type="primary" @click="handleMaterialList()">补充物料信息</el-button>
        </div>
        <!-- 列表模块 -->
        <tablecmt
          :columnList="columnList"
          :tableData="dataPare"
          :loading="loadingObj.tableLoading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
            <!--            <el-button type="primary" text icon="el-icon-view" @click="handleView(slotProps.scope)">查看</el-button>-->
            <!--            <el-button type="primary" text icon="el-icon-edit" @click="handleCallDeliveryOwn(slotProps.scope)">修改客户信息</el-button>-->
            <el-text
              type="primary"
              text
              icon="el-icon-view"
              @click="handleTrajectory(slotProps.scope.row)"
              >查看轨迹</el-text
            >
            <el-text
              type="primary"
              text
              icon="el-icon-view"
              @click="handleQRCode(slotProps.scope.row)"
              >查看二维码</el-text
            >
            <el-text
              type="primary"
              text
              icon="el-icon-view"
              v-if="!slotProps.scope.row.materialId"
              @click="handleMaterial(slotProps.scope.row, '1')"
              >补充物料信息</el-text
            >
            <el-text
              type="primary"
              text
              icon="el-icon-view"
              v-if="slotProps.scope.row.materialId"
              @click="handleMaterial(slotProps.scope.row, '2')"
              >修改物料信息</el-text
            >
          </template>
        </tablecmt>
        <el-row>
          <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
            <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
            <!-- 分页模块 -->
            <el-pagination
              align="right"
              background
              @size-change="sizeChange"
              @current-change="currentChange"
              :current-page="page.currentPage"
              :page-sizes="[30, 50, 80, 120]"
              :page-size="page.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="page.total"
            >
            </el-pagination>
          </div>
        </el-row>
      </template>
      <!-- 物料选择模块 -->
      <el-dialog
        :title="titleMaterial"
        v-model="materialBox"
        width="70%"
        :before-close="beforeClose"
        append-to-body
      >
        <el-form :disabled="view" ref="form" :model="formMaterial" label-width="80px">
          <el-form-item label="物料名称" prop="typeService">
            <el-select
              v-model="formMaterial.materialId"
              filterable
              remote
              reserve-keyword
              placeholder="请输入物料名称"
              remote-show-suffix
              :remote-method="remoteMethodName"
              @change="getMethodName($event, '1')"
              :loading="loading"
            >
              <el-option
                v-for="item in optionsName"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="物料编码" prop="serviceNumber">
            <el-select
              v-model="formMaterial.materialCode"
              filterable
              remote
              reserve-keyword
              placeholder="请输入物料编码"
              remote-show-suffix
              :remote-method="remoteMethodCode"
              @change="getMethodName($event, '2')"
              :loading="loading"
            >
              <el-option
                v-for="item in optionsCode"
                :key="item.id"
                :label="item.productCode"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="物料单位" prop="orderCode">
            <!--            <el-input v-model="formMaterial.unit" placeholder="请输入物料单位"/>-->
            <el-select v-model="formMaterial.materialUnit" clearable placeholder="请选择单位">
              <el-option
                v-for="item in logpmUnit"
                :key="item.dictKey"
                :label="item.dictValue"
                :value="item.dictKey"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="SKU" prop="mallName">
            <el-input v-model="formMaterial.sku" placeholder="请输入SKU" />
          </el-form-item>
        </el-form>
        <!-- 表单按钮 -->
        <template #footer>
          <span v-if="!view" class="dialog-footer">
            <el-button type="primary" icon="el-icon-circle-check" @click="handleSubmitMethod"
              >提 交</el-button
            >
            <el-button icon="el-icon-circle-close" @click="materialBox = false">取 消</el-button>
          </span>
        </template>
      </el-dialog>
      <el-dialog v-model="dialogFormCustomer" title="修改客户信息">
        <el-form :model="formCustomer">
          <el-form-item label="姓名" :label-width="formLabelWidth">
            <el-input v-model="formCustomer.name" autocomplete="off" />
          </el-form-item>
          <el-form-item label="电话" :label-width="formLabelWidth">
            <el-input v-model="formCustomer.phone" autocomplete="off" />
          </el-form-item>
          <el-form-item label="地址" :label-width="formLabelWidth">
            <el-input
              v-model="formCustomer.address"
              :rows="2"
              type="textarea"
              placeholder="请填写地址"
            />
          </el-form-item>
        </el-form>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="dialogFormCustomer = false">取消</el-button>
            <!--        <el-button type="primary" @click="dialogFormVisible = false"> 确定 </el-button>-->
            <el-button type="primary" @click="callFordelivery('3')"> 确定 </el-button>
          </span>
        </template>
      </el-dialog>

      <el-dialog title="二维码" :visible.sync="dialogVisible" width="780px" v-model="dialogVisible">
        <div class="print_QRCode">
          <div v-html="html"></div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" icon="Printer" @click="printTemplate">打 印</el-button>
        </span>
      </el-dialog>
    </div>

    <el-dialog v-model="waybillrecipient" title="修改运单收货人">
      <el-form
        v-loading="loadingwaybillrecipient"
        :model="waybillrecipientForm"
        ref="waybillrecipientForm"
        :rules="loginRules"
      >
        <el-form-item label="收货人名称" prop="consigneePerson" :label-width="formLabelWidth">
          <el-input
            v-model="waybillrecipientForm.consigneePerson"
            placeholder="请填写收货人名称"
            autocomplete="off"
          />
        </el-form-item>
        <el-form-item label="收货人电话" prop="consigneeMobile" :label-width="formLabelWidth">
          <el-input
            v-model="waybillrecipientForm.consigneeMobile"
            placeholder="请填写收货人电话"
            autocomplete="off"
          />
        </el-form-item>
        <el-form-item label="收货人地址" prop="consigneeAddress" :label-width="formLabelWidth">
          <el-input
            v-model="waybillrecipientForm.consigneeAddress"
            :rows="2"
            type="textarea"
            placeholder="请填写收货人地址"
          />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="waybillrecipient = false">取消</el-button>
          <!--        <el-button type="primary" @click="dialogFormVisible = false"> 确定 </el-button>-->
          <el-button type="primary" @click="waybillrecipientClick"> 确定 </el-button>
        </span>
      </template>
    </el-dialog>
  </basic-container>
  <edittablehead
    @setcolum="setnewcolum"
    @closce="showdrawer"
    :drawerShow="drawerShow"
    :columnList="columnList"
  ></edittablehead>
</template>

<script>
import { Search } from '@element-plus/icons-vue';

import {
  getList,
  getDetail,
  add,
  update,
  remove,
  addStock,
  showOrderPackgeCode,
  $_Modifywaybillrecipient,
} from '@/api/distribution/distributionStockArticle';
import { getListOwn, updateParcelList } from '@/api/distribution/distributionParcelList';
import { addCallDelivery } from '@/api/distribution/distrilbutionCallDelivery';
import { addClient } from '@/api/distribution/distributionClientMessage';
import { addService } from '@/api/distribution/distributionServiceLog';
import option from '@/option/distribution/distributionStockArticle';
import { mapGetters } from 'vuex';
import { getDictionaryBiz } from '@/api/system/dict';
import { getListMaterial } from '@/api/basic/basicMaterial';
import { getLodop } from '@/utils/LodopFuncs';
import { getStockTemplate } from '@/api/distribution/distributionStockArticle';
import dayjs from 'dayjs';
import print from '@/utils/print';
import { ElMessage } from 'element-plus';
import { hanleTextLineFeed } from '@/utils/util';
export default {
  data() {
    return {
      height: 0,
      // 弹框标题
      title: '',
      // 是否展示弹框
      box: false,
      // 是否显示查询
      search: true,
      // 加载中
      loading: true,
      // 是否为查看模式
      view: false,
      waybillrecipientForm: {},
      loadingwaybillrecipient: false,
      waybillrecipient: false,
      // 查询信息
      query: {},
      loginRules: {
        consigneeAddress: [{ required: true, message: '请输入收货人地址', trigger: 'blur' }],
        consigneeMobile: [
          { required: true, message: '请输入收货人电话', trigger: 'blur' },
          { min: 11, max: 11, message: '请输入11位电话号码', trigger: 'blur' },
        ],
        consigneePerson: [{ required: true, message: '请输入收货人名称', trigger: 'blur' }],
      },
      queryPage: {},
      // 弹框标题
      titleMaterial: '',
      optionsName: [],
      optionsCode: [],
      logpmUnit: [],
      // 是否展示弹框
      materialBox: false,
      // 分页信息
      page: {
        currentPage: 1,
        pageSize: 30,
        total: 40,
      },
      // 表单数据
      form: {},
      formMaterial: {},
      formCall: {}, // 通知
      formService: {}, // 服务
      formCustomer: {}, // 客户
      materialQRCode: {}, // 客户
      // 选择行
      selectionList: [],
      // 表单配置
      option: option,
      // 表单列表
      data: [],
      dataPare: [],
      dataMaterial: false,
      distributionType: [],
      dialogTableVisible: false,
      dialogVisible: false, //二维码控制
      qrCodeObj: [], //二维码图片
      dialogFormVisible: false,
      dialogFormCustomer: false,
      dialogFormService: false,
      formLabelWidth: '120px',
      handler: true, //首次
      trade: false, // 商
      municipal: true, // 市
      taker: true, // 自提
      columnListedit: [],
      drawerShow: false,
      columnList: [
        {
          prop: '',
          label: '序号',
          type: 0,
          values: '',
          width: 55,
          checkarr: [],
          fixed: true,
        },
        {
          prop: 'serviceNumber',
          label: '服务号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'waybillNumber',
          label: '运单号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'orderCode',
          label: '订单自编号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'warehouse',
          label: '仓库',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'orderPackageStatusName',
          label: '包件状态',
          type: 3,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'orderPackageFreezeStatusName',
          label: '冻结状态',
          type: 3,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'orderPackageGroundingStatusName',
          label: '上架状态',
          type: 3,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'orderPackageStockupStatusName',
          label: '备货状态',
          type: 3,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'orderPackageReservationStatusName',
          label: '预约状态',
          type: 3,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'orderPackageCode',
          label: '包条码',
          type: 2,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'goodsAllocation',
          label: '货位信息',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'pallet',
          label: '所在托盘',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'firsts',
          label: '一级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'second',
          label: '二级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'thirdProduct',
          label: '三级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'materialName',
          label: '物料名称',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'quantity',
          label: '数量',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'createTime',
          label: '入库时间',
          type: 4,
          values: '',
          width: '180',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'trainNumber',
          label: '客户车次号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: 'sendWarehouseName',
          label: '发站仓',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
        },
        {
          prop: '',
          label: '操作',
          type: 6,
          values: '',
          width: '230',
          checkarr: [],
          fixed: 'right',
          hide: true,
        },
      ],
      html: null, // 页面包条码内容
      /** loading */
      loadingObj: {
        pageLoading: false,
        tableLoading: false,
      },
    };
  },
  mounted() {
    this.init();
    this.onLoad(this.page);
    /**
     * 初始化获取本地缓存的编辑隐藏的列表
     *  固定搭配，不能更改
     */
    // let checkList=[]
    // this.columnList.map(item => {
    //     item.head = false;
    // });
    let checkListnewarr = this.$functions.getStorage(window.location.pathname + 'checkList');
    let flexListnewarr = this.$functions.getStorage(window.location.pathname + 'flexList');
    let sortlistnewarr = this.$functions.getStorage(window.location.pathname + 'sortlist');
    if (checkListnewarr) {
      this.columnList.map(item => {
        item.head = false;
      });
      checkListnewarr.map(ite => {
        this.columnList.map(item => {
          if (ite == item.label) {
            item.head = true;
          }
        });
      });
    } else {
      let arr = [];
      this.columnList.map(item => {
        if (item.head) {
          arr.push(item.label);
        }
      });
      this.$functions.setStorage(window.location.pathname + 'checkList', arr);
    }
    if (flexListnewarr) {
      this.columnList.map(item => {
        item.fixed = false;
      });
      flexListnewarr.map(ite => {
        this.columnList.map(item => {
          if (ite == item.label) {
            if (item.type == 6) {
              item.fixed = 'right';
            } else {
              item.fixed = true;
            }
          }
        });
      });
    } else {
      let arr = [];
      this.columnList.map(item => {
        if (item.fixed) {
          arr.push(item.label);
        }
      });
      this.$functions.setStorage(window.location.pathname + 'flexList', arr);
    }
    if (sortlistnewarr) {
      this.columnList.map(item => {
        item.sortable = false;
      });
      sortlistnewarr.map(ite => {
        this.columnList.map(item => {
          if (ite == item.label) {
            item.sortable = true;
          }
        });
      });
    } else {
      let arr = [];
      this.columnList.map(item => {
        if (item.sortable) {
          arr.push(item.label);
        }
      });
      this.$functions.setStorage(window.location.pathname + 'sortlist', arr);
    }
  },
  watch: {
    '$route.query.id': {
      handler(newVal, oldVal) {
        // console.log(newVal, oldVal);
        if (!!this.$route.query.id) {
          this.onLoad(this.page);
          this.onLoadOwn(this.page);
        }
      },
      deep: true,
      immediate: true,
    },
  },
  computed: {
    ...mapGetters(['permission']),
    permissionList() {
      return {
        addBtn: this.validData(this.permission.basicdataBrandCategory_add, false),
        viewBtn: this.validData(this.permission.basicdataBrandCategory_view, false),
        delBtn: this.validData(this.permission.basicdataBrandCategory_delete, false),
        editBtn: this.validData(this.permission.basicdataBrandCategory_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(',');
    },
  },
  methods: {
    handleMaterialList() {
      if (this.selectionList.length === 0) {
        this.$message.warning('请选择需要补充的包件!!!');
        return;
      } else {
        let a = false;
        this.selectionList.forEach(i => {
          console.log('现在的数据》》》》  ', i);
          if (!!i.materialId && i.materialId != '-1') {
            a = true;
          }
        });
        if (a) {
          this.$message.warning('有包含物料的包件信息，请去除，在勾选！！！');
          return;
        }
        this.titleMaterial = '补充物料';
        this.materialBox = true;
      }
    },
    showdrawer(value) {
      this.drawerShow = value;
    },
    /**
     * 弹窗的勾选回调，用于更改头部数组
     * 固定搭配，只需要更换   columnList
     */
    setnewcolum(newarr, headarr, type) {
      // console.log(newarr,'+++++++++++')
      if (type == 1) {
        this.columnList = newarr;
        this.$functions.setStorage(window.location.pathname + 'checkList', headarr);
      } else if (type == 2) {
        this.columnList = newarr;
        this.$functions.setStorage(window.location.pathname + 'flexList', headarr);
      } else if (type == 3) {
        this.columnList = newarr;
        this.$functions.setStorage(window.location.pathname + 'sortlist', headarr);
      }
    },
    selectionsc(value) {
      console.log('11111', value);
    },
    delectsolt(scope) {
      const { row } = scope;
      console.log('2222222', row);
    },
    editsolt(scope) {
      const { row } = scope;
      console.log('33333', row);
    },
    btnsc(index, row) {
      console.log('4444444', index, row);
    },
    selectsc(index, row) {
      console.log(index, row);
      if (row.prop === 'orderPackageFreezeStatusName') {
        this.queryPage['orderPackageFreezeStatus'] = index;
      } else if (row.prop === 'orderPackageReservationStatusName') {
        this.queryPage['orderPackageReservationStatus'] = index;
      } else if (row.prop === 'orderPackageGroundingStatusName') {
        this.queryPage['orderPackageGroundingStatus'] = index;
      } else if (row.prop === 'orderPackageStockupStatusName') {
        this.queryPage['orderPackageStockupStatus'] = index;
      } else if (row.prop === 'orderPackageStatusName') {
        this.queryPage['orderPackageStatus'] = index;
      } else {
        this.queryPage[row.prop] = index;
      }
      this.onLoadOwn(this.page);
    },
    timesc(index, row) {
      console.log(index, row);
      if (!!index) {
        index = dayjs(index).format('YYYY-MM-DD');
      }
      this.queryPage[row.prop] = index;
      if (!index) {
        delete this.queryPage[row.prop];
      }
      this.onLoadOwn(this.page);
    },
    inputsc(index, row) {
      this.queryPage[row.prop] = index;
      if (!index) delete this.queryPage[row.prop];
      this.onLoadOwn(this.page);
    },
    printTemplate() {
      const orderNodeList = document.querySelectorAll('.print_QRCode>div>div');
      print(orderNodeList);
    },
    //提交物品数据
    handleSubmitMethod() {
      // console.log(">>>",this.formMaterial);

      const regex = /^\d+$/;
      let id = [];
      let asm = {
        // id: this.formMaterial.id,
        // materialId: this.formMaterial.materialId,
      };
      if (regex.test(this.formMaterial.materialId)) {
        // console.log("全是数字");
        asm.materialId = this.formMaterial.materialId;
      } else {
        // console.log("包含非数字字符");
        asm.materialId = this.formMaterial.materialCode;
      }
      if (!!this.formMaterial.id) {
        id.push(this.formMaterial.id);
      } else {
        if (this.selectionList.length > 0) {
          this.selectionList.forEach(i => {
            id.push(i.id);
          });
          console.log('shuju>>>>', this.selectionList.length);
        } else {
          id.push(this.formMaterial.id);
        }
      }
      asm.ids = id;
      console.log('>>>', asm);
      updateParcelList(asm).then(() => {
        this.materialBox = false;
        this.onLoadOwn(this.page);
        this.$message({
          type: 'success',
          message: '操作成功!',
        });
        this.formMaterial = {};
      });
    },
    getMethodName(row, num) {
      // console.log("名称选择事件",row);
      switch (num) {
        case '1':
          let a = this.optionsName.find(i => i.id == row);
          this.formMaterial.materialCode = a.productCode;
          this.formMaterial.materialUnit = a.logpmUnit;
          this.formMaterial.sku = a.sku;
          break;
        case '2':
          let b = this.optionsCode.find(i => i.id == row);
          this.formMaterial.materialId = b.name;
          this.formMaterial.materialUnit = b.logpmUnit;
          this.formMaterial.sku = b.sku;
          break;
      }
    },

    async remoteMethodName(query) {
      if (query) {
        this.loading = true;
        //查询物料数据
        let asd = await getListMaterial(this.page.currentPage, this.page.pageSize, {
          name: query,
        }).then();
        console.log('物料信息', asd.data.data);
        this.optionsName = asd.data.data.records;
        this.loading = false;
      } else {
        this.optionsName = [];
      }
    },
    async remoteMethodCode(query) {
      if (query) {
        this.loading = true;
        let asd = await getListMaterial(this.page.currentPage, this.page.pageSize, {
          productCode: query,
        }).then();
        console.log('物料编号信息', asd.data.data);
        this.optionsCode = asd.data.data.records;
        this.loading = false;
      } else {
        this.optionsCode = [];
      }
    },
    /*handleMoke(){
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$router.push({
        path: '/distribution/reservation/reservationFrom',
        query:{
          id: this.ids,
          name: '添加预约单'


        }
      });
    },*/
    /* handleStockList(){
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$router.push({
        path: '/distribution/inventory/distributionStockArticleFrom',
        query: {
          id : this.ids,
          name : "转库存单"
        }
      });


      //
      // this.$confirm("确定将选择的订单转为库存品吗？", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning"
      // })
      //   .then(() => {
      //     return addStock(this.ids);
      //   })
      //   .then(() => {
      //     this.selectionClear();
      //     this.onLoad(this.page);
      //     this.$message({
      //       type: "success",
      //       message: "操作成功!"
      //     });
      //   });
    },*/
    //确定通知提货按钮
    callFordelivery(inde) {
      switch (inde) {
        case '1':
          console.log(this.formCall);
          this.formCall.waybillNumber = this.ids;
          addCallDelivery(this.formCall).then(() => {
            this.$message({
              type: 'success',
              message: '操作成功!',
            });
            this.dialogFormVisible = false;
            this.formCall = {};
          });
          break;
        case '2':
          // console.log("服务类型",this.formService);
          addService(this.formService).then(() => {
            this.$message({
              type: 'success',
              message: '操作成功!',
            });
            this.dialogFormService = false;
            this.formService = {};
          });
          break;
        case '3':
          // console.log("客户信息！！！",this.formCustomer);
          this.formCustomer.stockArticleId = this.$route.query.id;
          console.log('客户信息！！！', this.formCustomer);
          addClient(this.formCustomer).then(() => {
            this.$message({
              type: 'success',
              message: '操作成功!',
            });
            this.dialogFormCustomer = false;
            this.formCustomer = {};
            this.onLoad(this.page);
          });
          break;
      }
    },
    //通知提货
    handleCallDelivery(ind, row) {
      switch (ind) {
        case '1':
          let ids = [];
          this.selectionList.forEach(ele => {
            ids.push(ele.orderCode);
          });
          this.formCall.waybill = ids;
          this.dialogFormVisible = true;
          break;
        case '2':
          this.dialogFormService = true;
          break;
        case '3':
          this.dialogFormCustomer = true;
          console.log('<><>', row);
          this.formCustomer.name = row.customerName;
          this.formCustomer.phone = row.customerTelephone;
          this.formCustomer.address = row.customerAddress;
          break;
      }
    },
    //修改运单收货人
    Modifywaybillrecipient(row) {
      console.log(row, ' // 修改运单收货人');
      this.waybillrecipient = true;
      this.waybillrecipientForm.consigneeAddress = row.consigneeAddress; //收货人地址
      this.waybillrecipientForm.consigneeMobile = row.consigneeMobile; //收货人电话
      this.waybillrecipientForm.consigneePerson = row.consigneePerson; //收货人名称
      this.waybillrecipientForm.id = row.id;
    },
    // 修改运单收货人提交
    waybillrecipientClick() {
      this.$refs.waybillrecipientForm.validate(valid => {
        if (!valid) {
          return;
        }
        this.loadingwaybillrecipient = true;

        let data = {
          entityList: [],
        };
        data['entityList'].push({
          consigneeAddress: this.waybillrecipientForm.consigneeAddress,
          consigneePerson: this.waybillrecipientForm.consigneePerson,
          consigneeMobile: this.waybillrecipientForm.consigneeMobile,
          id: this.waybillrecipientForm.id,
        });
        $_Modifywaybillrecipient(data)
          .then(res => {
            console.log(res, '修改成功后返回值');
            if (res.data.code == 200) {
              this.waybillrecipient = false;
              ElMessage({
                showClose: true,
                message: res.data.msg,
                type: 'success',
              });
              this.onLoad();
            }
          })
          .catch(() => {})
          .finally(() => {
            this.loadingwaybillrecipient = false;
          });
        // waybillrecipient;//弹窗
      });
    },
    init() {
      this.height = this.setPx(document.body.clientHeight - 580);
      getDictionaryBiz('distribution_type').then(res => {
        this.distributionType = res.data.data;
      });
      getDictionaryBiz('logpm_unit').then(res => {
        //单位
        this.logpmUnit = res.data.data;
      });
      getDictionaryBiz('order_package_status').then(res => {
        this.deliveryOrderStatus = res.data.data;
        this.$functions.checkcColumnList('orderPackageStatusName', this.columnList).checkarr =
          res.data.data.map(item => {
            item.value = item.dictKey;
            item.label = item.dictValue;
            return item;
          });
      });
      getDictionaryBiz('order_package_grounding_status').then(res => {
        this.$functions.checkcColumnList(
          'orderPackageGroundingStatusName',
          this.columnList
        ).checkarr = res.data.data.map(item => {
          item.value = item.dictKey;
          item.label = item.dictValue;
          return item;
        });
      });
      getDictionaryBiz('order_package_freeze_status').then(res => {
        this.$functions.checkcColumnList('orderPackageFreezeStatusName', this.columnList).checkarr =
          res.data.data.map(item => {
            item.value = item.dictKey;
            item.label = item.dictValue;
            return item;
          });
      });
      getDictionaryBiz('order_package_stockup_status').then(res => {
        this.$functions.checkcColumnList(
          'orderPackageStockupStatusName',
          this.columnList
        ).checkarr = res.data.data.map(item => {
          item.value = item.dictKey;
          item.label = item.dictValue;
          return item;
        });
      });
      getDictionaryBiz('order_package_reservation_status').then(res => {
        this.$functions.checkcColumnList(
          'orderPackageReservationStatusName',
          this.columnList
        ).checkarr = res.data.data.map(item => {
          item.value = item.dictKey;
          item.label = item.dictValue;
          return item;
        });
      });
    },
    searchHide() {
      this.search = !this.search;
    },
    searchChange() {
      this.onLoad(this.page);
    },
    searchReset() {
      this.query = {};
      this.page.currentPage = 1;
      this.onLoad(this.page);
    },
    handleSubmit() {
      if (!this.form.id) {
        add(this.form).then(() => {
          this.box = false;
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!',
          });
        });
      } else {
        update(this.form).then(() => {
          this.box = false;
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!',
          });
        });
      }
    },

    //全部
    handleEntire() {
      this.handler = true;
      this.taker = true;
      this.trade = false;
    },
    //商配
    handleTrade() {
      // this.handler = true;
      this.trade = true;
    },
    //商配
    handleMunicipal() {
      // this.handler = true;
      // this.taker = true;
    },
    //自提
    handlePickUpStore() {
      this.loading = true;
      // console.log("this.query",this.query);
      let params = {};
      this.query.typeService = '1';
      getList(this.page.currentPage, this.page.pageSize, Object.assign(params, this.query)).then(
        res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
          this.handler = false;
          this.taker = false;
        }
      );
    }, //自提的通知
    handleInform(index) {
      this.loading = true;
      // console.log("this.query",this.query);
      let params = {};
      this.query.typeService = '1';
      switch (index) {
        case '1':
          this.query.notification = index;
          break;
        case '2':
          this.query.notification = index;
          break;
      }
      this.query.typeService = '1';
      getList(this.page.currentPage, this.page.pageSize, Object.assign(params, this.query)).then(
        res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
          this.loading = false;
          this.selectionClear();
          this.handler = false;
          this.taker = false;
        }
      );
    },
    handleAdd() {
      this.title = '新增';
      this.form = {};
      this.box = true;
    },
    handleEdit(row) {
      this.title = '编辑';
      this.box = true;
      getDetail(row.id).then(res => {
        this.form = res.data.data;
      });
    },
    handleView(row) {
      this.title = '查看';
      this.view = true;
      this.box = true;
      getDetail(row.id).then(res => {
        this.form = res.data.data;
      });
    },
    async handleMaterial(row, index) {
      // console.log('row>>>', row);
      if (index === '2') {
        this.titleMaterial = '修改物料';
        this.formMaterial = row;
        this.loading = true;
        getListMaterial(this.page.currentPage, this.page.pageSize, {
          productCode: row.materialCode,
        }).then(res => {
          // console.log('物料编号信息', res.data.data.records[0].sku);
          this.formMaterial.sku = res.data.data.records[0].sku;
        });
        this.loading = false;
        this.optionsName = [{ id: row.materialId, name: row.materialName }];
        this.optionsCode = [{ id: row.materialId, productCode: row.materialCode }];
        // console.log("333333",this.optionsCode[0]);
      } else {
        this.titleMaterial = '补充物料';
        this.formMaterial.id = row.id;
      }
      this.materialBox = true;
      console.log('_+_+_+_+_+_+_', index);
    },
    allhandleQRCode() {
      console.log(this.selectionList);
      if (this.selectionList.length == 0) {
        this.$message.error({ message: '请先选择包件' });
        return;
      }
      let checkcode = [];
      this.selectionList.map(item => {
        checkcode.push(item.id);
        // checkcode.push(item.orderPackageCode)
      });
      // return
      let qr = {
        ids: checkcode.join(','),
        // qrCodes: checkcode.join(','),
      };
      this.html = '';
      showOrderPackgeCode(qr).then(res => {
        // this.orderPackageCode = res.data
        console.log(res.data);
        this.html = this.getHtmls(res.data.data.dataList, res.data.data.templateHtml);
      });

      this.dialogVisible = true;
    },
    handleQRCode(row) {
      // this.title = '查看'
      // this.view = true;
      // this.box = true;
      this.materialQRCode = row;
      console.log('11213 :>> ', 11213);

      let qr = {
        ids: row.id,
      };
      this.html = '';
      showOrderPackgeCode(qr).then(async res => {
        // this.orderPackageCode = res.data
        // console.log(res.data);
        console.log('res :>> ', res);
        this.html = this.getHtmls(res.data.data.dataList, res.data.data.templateHtml);
        this.dialogVisible = true;

        await this.$nextTick();

        hanleTextLineFeed('category', 15);
        hanleTextLineFeed('customer', 45);
      });
    },
    handleTrajectory(row) {
      console.log('>>>>', row);
      this.$router.push({
        path: '/distribution/signdetail/packageNodeSearch',
        query: {
          orderPackageCode: row.orderPackageCode,
        },
      });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning('请选择至少一条数据');
        return;
      }
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.selectionClear();
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!',
          });
        });
    },
    rowDel(row) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!',
          });
        });
    },
    beforeClose(done) {
      done();
      this.form = {};
      this.view = false;
    },
    selectionChange(list) {
      // console.log("添加阿斯顿发生",list);
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      // this.$refs.table.clearSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
      this.onLoadOwn(this.page);
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.onLoadOwn(this.page);
    },
    onLoad(page, params = {}) {
      try {
        this.loadingObj.pageLoading = true;
      } catch (error) {
        console.log('error :>> ', error);
      } finally {
        this.loadingObj.pageLoading = false;
      }

      this.loading = true;
      console.log('执行了查询零零零零');
      this.query.id = this.$route.query.id;
      getDetail(this.page.currentPage, this.page.pageSize, Object.assign(params, this.query)).then(
        res => {
          console.log('返回的数据》》》》', res.data.data);
          const data = res.data.data;
          // this.page.total = data.total;
          this.data[0] = data;

          this.loading = false;
          this.selectionClear();
        }
      );
    },
    async onLoadOwn(page, params = {}) {
      if (Number(this.$route.query.isZero) === 1) return;

      try {
        this.loadingObj.tableLoading = true;

        // this.loading = true;
        this.dataMaterial = false;
        params = {
          stockArticleIds: this.$route.query.id,
        };
        const res = await getListOwn(
          page.currentPage,
          page.pageSize,
          Object.assign(params, this.queryPage)
        );
        console.log('包件明细》》》》》', res.data.data);
        const { code, data } = res.data;

        if (code !== 200) return;

        this.page.total = data.total;
        this.dataPare = data.records;
        this.dataPare.some(i => {
          if (i.conditions == '1') {
            i.conditions = '定制品';
          } else {
            i.conditions = '库存品';
          }
          if (!i.materialId) {
            //有
            this.dataMaterial = true;
          }
        });
        // this.loading = false;
        this.selectionClear();
      } catch (error) {
        console.log('error :>> ', error);
      } finally {
        this.loadingObj.tableLoading = false;
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.plck {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 20px;
}
.el-button--text {
  margin-right: 15px;
}
.el-select {
  width: 300px;
}
.el-input {
  width: 300px;
}
.dialog-footer button:first-child {
  margin-right: 10px;
}
</style>