<template>
  <basic-container>
    <div class="avue-crud">

      <el-row>
        <el-tabs
          type="border-card"
          class="demo-tabs"
          style="width: 100%"
          v-model="activeName"
          @tab-click="handleClick"
        >
          <el-tab-pane label="预约列表" name="reservation">
            <tablecmt
          :columnList="columnListarrs.columnReservation"
          :tableData="data3"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
          </template>
        </tablecmt>

            <div class="avue-crud__pagination" style="width:100%">
              <!-- 分页模块 -->
              <el-pagination align="right"
                             background
                             @size-change="sizeChange"
                             @current-change="currentChange"
                             :current-page="page3.currentPage"
                             :page-sizes="[30, 50,80, 120]"
                             :page-size="page3.pageSize"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="page3.total">
              </el-pagination>
            </div>

          </el-tab-pane>
          <el-tab-pane label="订单列表" name="library">
            <tablecmt
          :columnList="columnListarrs.columnStockOrder"
          :tableData="dataPare"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
          </template>
        </tablecmt>
            <div class="avue-crud__pagination" style="width:100%">
              <!-- 分页模块 -->
              <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-tab-pane>
          <el-tab-pane label="备货包件" name="outbound">
            <el-button type="primary" style="margin-bottom: 10px;padding: 10px 20px;" v-if =isStockUp  @click="handleStockUp(row,'1')">备货</el-button>
            <tablecmt
          :columnList="columnListarrs.columnStockingBag"
          :tableData="data1"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">
            <el-text type="primary" text icon="el-icon-view" v-if="!slotProps.scope?.row?.stockupStatus" @click="handleStockUp(slotProps.scope.row,'2')">备货</el-text>
            <el-button type="primary" text icon="el-icon-view"  @click="handleQRCode(row)">查看包条码</el-button>

          </template>
        </tablecmt>

            <div class="avue-crud__pagination" style="width:100%">
              <!-- 分页模块 -->
              <el-pagination align="right"
                             background
                             @size-change="sizeChange"
                             @current-change="currentChange"
                             :current-page="page1.currentPage"
                             :page-sizes="[30, 50,80, 120]"
                             :page-size="page1.pageSize"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="page1.total">
              </el-pagination>
            </div>
          </el-tab-pane>
          <el-tab-pane label="库存品" name="enter">

            <el-text type="primary" text icon="el-icon-view"  @click="handleBatchDetail('2')">批量打印</el-text>

          <tablecmt
          :columnList="columnListarrs.columnInventory"
          :tableData="data2"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
         >
          <template #default="slotProps">

            <el-text type="primary" text icon="el-icon-view"  @click="handleDetail(slotProps.scope.row)">明细</el-text>

          </template>
        </tablecmt>

            <div class="avue-crud__pagination" style="width:100%">
              <!-- 分页模块 -->
              <el-pagination align="right"
                             background
                             @size-change="sizeChange"
                             @current-change="currentChange"
                             :current-page="page2.currentPage"
                             :page-sizes="[30, 50,80, 120]"
                             :page-size="page2.pageSize"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="page2.total">
              </el-pagination>
            </div>
          </el-tab-pane>
        </el-tabs>

      </el-row>
      <el-dialog title="包条码" :visible.sync="dialogPack" width="1050px" v-model="dialogPack">

        <el-text type="primary" icon="el-icon-view"  @click="handleBatchDetail('1')">批量打印</el-text>

        <tablecmt
          :columnList="columnListarrs.columnInventoryBatch"
          :tableData="packageCodeList"
          :loading="loading"
          @inputTxt="inputsc"
          @timeCheck="timesc"
          @btnCheck="btnsc"
          @selectCheck="selectsc"
          @selection="selectionChange"
        >
          <template #default="slotProps">

            <el-text type="primary" text icon="el-icon-view"  @click="handlePrintDetail(slotProps.scope.row)">打印</el-text>

          </template>
        </tablecmt>

        <div class="avue-crud__pagination" style="width:100%">
          <!-- 分页模块 -->
          <el-pagination align="right"
                         background
                         @size-change="sizeChange"
                         @current-change="currentChange"
                         :current-page="page2.currentPage"
                         :page-sizes="[30, 50,80, 120]"
                         :page-size="page2.pageSize"
                         layout="total, sizes, prev, pager, next, jumper"
                         :total="page2.total">
          </el-pagination>
        </div>

<!--        <div v-for="item in packageCodeList">-->
<!--          <span>{{item}}</span>-->
<!--        </div>-->
        <span slot="footer" class="dialog-footer">
          <!--    <el-button type="primary" @click="ddd">导 出</el-button>-->
<!--          <el-button type="primary" @click="printTemplate">打 印</el-button>-->
          <el-button type="primary" @click="dialogPack = false">确 定</el-button>
          <el-button @click="dialogPack = false">取 消</el-button>
        </span>
      </el-dialog>
      <el-dialog title="二维码" :visible.sync="dialogVisible" width="780px" v-model="dialogVisible">
        <div>
          <div v-html="html"></div>

          <!-- <div v-for="(item,index) in qrCodeObj">
            <el-row>
              <el-col :span="24" >
                <el-image  width="10" height="10" w-full  :key="index" :src="item " alt="Preview Image"/>
              </el-col>
            </el-row>
          </div> -->
        </div>
        <span slot="footer" class="dialog-footer">
          <!--    <el-button type="primary" @click="ddd">导 出</el-button>-->
          <el-button type="primary" @click="printTemplate">打 印</el-button>
          <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
          <el-button @click="dialogVisible = false">取 消</el-button>
        </span>
      </el-dialog>
      <el-dialog v-model="dialogHand" title="系统备货">
        <el-form :model="form">
          <el-form-item label="备货区域" :label-width="formLabelWidth" >
            <el-select v-model="form.goodsAreaId" clearable placeholder="请选择备货区编号" @change="getForklift($event,'3')">
              <el-option
                v-for="item in goodsAreaIdData"
                :key="item.dictKey"
                :label="item.dictValue"
                :value="item.dictKey">
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
        <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogHand = false">取消</el-button>
        <!--        <el-button type="primary" @click="dialogFormVisible = false"> 确定 </el-button>-->
        <el-button type="primary" @click="callFordelivery()"> 确定 </el-button>
      </span>
        </template>
      </el-dialog>
    <!--  <el-row>
        <div class="avue-crud__pagination" style="width:100%">
          &lt;!&ndash; 分页模块 &ndash;&gt;
          <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>-->
      <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>
    </div>
  </basic-container>
</template>

<script>
import {
  getList,
  getDetail,
  add,
  update,
  remove,
  getDetailStockupOwn,
  getDetailReservationOwn, getDetailOrderOwn, getDetailInventoryOwn, getListUser
} from '@/api/distribution/distributionStockup';
import option from "@/option/distribution/distributionStockup";
import { mapGetters } from "vuex";
import { getDictionaryBiz } from '@/api/system/dict';
import { getParcelListOwn } from '@/api/distribution/distributionParcelList';
import { stockUp } from '@/api/basicdata/basicdataGoodsArea';
import { getStockDetail } from '@/api/distribution/distributionStock';
import { getStockTemplate, showOrderPackgeCode } from '@/api/distribution/distributionStockArticle';
import { getLodop } from '@/utils/LodopFuncs';
import dayjs from 'dayjs';
import { getDisStockList,getPrintDetail } from '@/api/distribution/disStockListDetail';

export default {
  data () {
    return {
      dialogVisible:false,
      dialogPack:false,
      html:'',
      columnListarrs:{
      columnReservation:[
        {
          prop: 'consignee',
          label: '收货人',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'deliveryPhone',
          label: '收货电话',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'deliveryAddress',
          label: '收货地址',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'mallName',
          label: '收货单位',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockArticleId',
          label: '订单自编号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupStatusName',
          label: '备货状态',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'pallet',
          label: '托盘码',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'goodsAllocation',
          label: '货位信息',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
      ],
      columnStockOrder:[
        // {
        //   prop: '',
        //   label: '序号',
        //   type: 0,
        //   values: '',
        //   width: 55,
        //   checkarr: [],
        //   fixed: true,
        // },
        {
          prop: 'orderCode',
          label: '订单自编号',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'descriptionGoods',
          label: '货物名称',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'reservationNum',
          label: '备货件数',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'number',
          label: '已备数量',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupStatusName',
          label: '备货状态',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupDate',
          label: '备货时间',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'goodsAllocation',
          label: '库位信息',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupArea',
          label: '备货区',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
      ],
      columnStockingBag:[
        {
          prop: '',
          label: '序号',
          type: 0,
          values: '',
          width: '50',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'orderPackageCode',
          label: '包条码',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'firsts',
          label: '一级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'second',
          label: '二级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'thirdProduct',
          label: '三级品',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'materialName',
          label: '物料名称',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupStatusName',
          label: '备货状态',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupDate',
          label: '备货时间',
          type: 5,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'pallet',
          label: '托盘码',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'goodsAllocation',
          label: '库位信息',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupArea',
          label: '备货区',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: '',
          label: '操作',
          type: 6,
          values: '',
          width: '150',
          checkarr: [],
          fixed: 'right',
          hide: true,
        },
      ],
      columnInventory:[
        {
          prop: '',
          label: '序号',
          type: 0,
          values: '',
          width: 55,
          checkarr: [],
          fixed: true,
        },
        {
          prop: 'sku',
          label: 'SKU',
          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: 'descriptionGoods',
          label: '物料名称',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'cargoUnit',
          label: '单位',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'reservationNum',
          label: '备货数',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'number',
          label: '已备数量',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupStatusName',
          label: '备货状态',
          type: 5,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupDate',
          label: '备货时间',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'pallet',
          label: '托盘码',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'goodsAllocation',
          label: '库位信息',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockupArea',
          label: '备货区',
          type: 2,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: '',
          label: '操作',
          type: 6,
          values: '',
          width: '230',
          checkarr: [],
          fixed: 'right',
          hide: true,
        },

      ],
      columnInventoryBatch:[
        {
          prop: '',
          label: '序号',
          type: 0,
          values: '',
          width: 55,
          checkarr: [],
          fixed: true,
        },
        {
          prop: 'sku',
          label: 'SKU',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: true,
          sortable: true,
          head: false,
        },
        {
          prop: 'orderCode',
          label: '订单编号',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'descriptionGoods',
          label: '物料名称',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'cargoUnit',
          label: '单位',
          type: 1,
          values: '',
          width: '100',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'stockPackageCode',
          label: '包条码',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: 'brandName',
          label: '品牌',
          type: 1,
          values: '',
          width: '150',
          checkarr: [],
          fixed: false,
          sortable: true,
          head: false,
        },
        {
          prop: '',
          label: '操作',
          type: 6,
          values: '',
          width: '230',
          checkarr: [],
          fixed: 'right',
          hide: true,
        },

      ],
      },
      height: 0,
      activeName: 'reservation',
      // 弹框标题
      title: '',
      // 是否展示弹框
      box: false,
      isStockUp: false,
      // 是否显示查询
      search: true,
      // 加载中
      loading: true,
      // 是否为查看模式
      view: false,
      // 查询信息
      query: {},
      // 分页信息
      page: {
        currentPage: 1,
        pageSize: 30,
        total: 40
      },
      // 分页信息
      page1: {
        currentPage: 1,
        pageSize: 30,
        total: 40
      },
      // 分页信息
      page2: {
        currentPage: 1,
        pageSize: 30,
        total: 40
      },
      // 分页信息
      page3: {
        currentPage: 1,
        pageSize: 30,
        total: 40
      },
      // 表单数据
      form: {},
      formCall: {},// 通知
      formService: {}, // 服务
      formCustomer: {}, // 客户
      // 选择行
      selectionList: [],
      goodsAreaIdData: [],
      // 表单配置
      option: option,
      // 表单列表
      data: [],
      data1: [],
      data2: [],
      dataPare: [],
      data3: [],
      distributionType: [],
      serveTypeList: [],
      deliveryWayList: [],
      stockupStatusList: [],
      dialogTableVisible: false,
      dialogFormVisible: false,
      dialogFormCustomer: false,
      dialogHand: false, //备货手动
      deptId: '', //部门id
      dialogFormService: false,
      formLabelWidth: '120px',
      handler:true, //首次
      trade:false, // 商
      municipal:true, // 市
      taker:true, // 自提
      packageCodeList: [], // 自提
    }
  },
  mounted () {
    this.init();

  },
  watch:{
    '$route.query.id':{
      handler(newVal, oldVal) {
        // console.log(newVal, oldVal);
        this.init();
      },
      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: {
    //批量打印
    handleBatchDetail(type){
      console.log("selectionList",this.selectionList);
      if(this.selectionList.length == 0){
        this.$message.warning("至少选择一条数据！！")
        return ;
      }
      if(type== '1'){
        //包条码批量
        let checkcode=[]
        this.selectionList.map(item=>{
          checkcode.push(item.id)
        })
        let qr = {
          ids: checkcode.join(','),
          type: "2"
        };
        getPrintDetail(qr).then( res =>{
          console.log(",./");
          this.html=''
          this.html=this.getHtmls(res.data.data.dataList,res.data.data.templateHtml)
        })
      }else if(type== '2'){
//包条码批量
        let myMap = [];
        this.selectionList.map(item=>{
         if(!!item.stocklist){
           myMap.push(item.stocklist);
         }
        })
        let qr = {
          ids: myMap.join(","),
          type: "3"
        };
        console.log("><><>>",qr);
        //库存品订单批量
        getPrintDetail(qr).then( res =>{
          // console.log(",./");
          this.html=''
          this.html=this.getHtmls(res.data.data.dataList,res.data.data.templateHtml)
        })

      }

    },
    //单独打印
    handlePrintDetail(row){
      console.log("单个答应》》》",row);
      row.type = "1";
      getPrintDetail(row).then( res =>{
        console.log(",./");
        this.html=''
        this.html=this.getHtmls(res.data.data.dataList,res.data.data.templateHtml)
      })

    },
    //查看库存品明细
    handleDetail(row){
      console.log("row>><><><",row);
      this.dialogPack = true;
      //查询信息
      let po = {
        stockListId: row.stockListId,
        reservationId: row.reservationId,
      }
      let s =[];
      getDisStockList(po).then( res =>{
        console.log("res>>>>库存包件码",res.data.data);
        res.data.data.forEach(i => {
          if(!!i){
            let a = {};
            a.sku = i.sku;
            a.orderCode = i.orderCode;
            a.descriptionGoods = i.descriptionGoods;
            a.cargoUnit = i.cargoUnit;
            a.stockPackageCode = i.stockPackageCode;
            a.brandName = i.brandName;
            s.push(a);
          }
        });
        this.packageCodeList = s;
      })
    },
    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(value);
    },
    delectsolt(scope) {
      const { row } = scope;
      console.log(row);
    },
    editsolt(scope) {
      const { row } = scope;
      console.log(row);
    },
    btnsc(index, row) {
      console.log(index, row);
    },
    selectsc(index, row) {
      console.log(index, row);
      // if(row.prop =='typeServiceName'){
      //   this.query['typeService'] = index;
      // }else if(row.prop =='stockupStatusName'){
      //   this.query["stockupStatus"] = index;
      // }else if(row.prop =='assignStatusName'){
      //   this.query["assignStatus"] = index;
      // }else{
      //   this.query[row.prop] = index;
      // }
      // // this.query[row.prop] = index;
      // this.onLoad(this.page);
    },
    timesc(index, row) {
      console.log(index, row);
      if (!!index){
        index = dayjs(index).format('YYYY-MM-DD');
      }
      this.query[row.prop] =  index
      if (!index){
        delete this.query[row.prop]
      }
      this.onLoad(this.page);
    },
    inputsc(index, row) {
      console.log(index, row);
      /*      if(row.prop =='typeServiceName'){
              this.query['typeService'] = index;
            }else if(row.prop =='stockupStatusName'){
              this.query["stockupStatus"] = index;
            }else if(row.prop =='assignStatusName'){
              this.query["assignStatus"] = index;
            }else{
             this.query[row.prop] = index;
             }*/
      this.query[row.prop] = index;

      this.onLoad(this.page);
    },
    //打印
    printTemplate() {
      let LODOP = getLodop();
      console.log("LODOP>>>>>",LODOP);
      // console.log("this.ids>>>>>",this.selectionList);
      // if (this.selectionList.length === 0){
      //   this.$message.warning("请选择至少一条数据");
      //   return;
      // }
      getStockTemplate({ id: this.materialQRCode.id }).then(res => {
        console.log('返回的数据', res.data.data);
        let templateData = res.data.data;
        // let templateData = "res.data.data";
        // console.log(templateData);
        LODOP.PRINT_INITA(1, 1, 900, 660, '测试预览功能');
        LODOP.SET_PRINT_MODE('WINDOW_DEFPRINTER', 'Godex G500');
        LODOP.SET_PRINT_STYLEA(0,"TextNeatRow",true);//允许标点溢出，且英文单词拆开
        // // 设置打印整宽且不变形
        LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', 'Auto-Width');
        // // 设置打印后自动关闭
        LODOP.SET_PRINT_MODE('AUTO_CLOSE_PREWINDOW', 1);
        // // data就是一段html文本
        LODOP.ADD_PRINT_HTM('0%', '0%', '100%', '100%', templateData);
        // LODOP.PREVIEW(); //预览(预览打印无脚标)
        LODOP.PRINT(); //直接打印

      });
    },
    //查看包条码
    handleQRCode(row) {
      // this.title = '查看'
      // this.view = true;
      // this.box = true;
      this.materialQRCode = row;

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

      });

      this.dialogVisible = true;
    },
    //系统备货确定
    callFordelivery(){
      let c = false;
      if (this.selectionList.length > 0) {
        let ids = this.selectionList.map(i => i.id).join(',');
        this.selectionList.forEach( i =>{
          if(!!i.stockupStatus){
            c = true;
          }
        })
        this.form.ids = ids.split(",");
      }else{
        this.form.ids =this.form.ids.split(",");
      }
      if(c){
        this.$message.warning("有已备货的数据！！")
        return ;
      }
      this.form.stockupId = this.$route.query.id;
      getStockDetail( Object.assign(this.form)).then(res =>{
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        this.getStockUpParcelsList(this.page1);
        this.form = {};
        this.dialogHand = false;
      });

    },
    //选择
    getForklift(row,ty){
      switch (ty){
        case '3':
          let f = this.goodsAreaIdData.find(i =>i.dictKey == row)
          this.form.stockupArea = f.dictValue;
          break;
      }
    },
    //备货区
    async getStorageArea(){
      let params ={
        department: this.deptId
      }
      stockUp(params).then(res =>{
        // console.log("res>>>",res.data.data);
        let fo =[];
        res.data.data.forEach(i =>{
          let v = {
            dictKey: i.id,
            dictValue: i.name +'-'+i.headline
          }
          fo.push(v)
        })
        this.goodsAreaIdData = fo;
      })
    },
    handleStockUp(row,type){
      getListUser().then(res =>{ //查询当前人信息
        console.log("res>>>",res.data.data);
        this.deptId = res.data.data.deptId;
        this.getStorageArea();
      })
    console.log("备货数据！！",row);
    switch (type){
      case '1':
        if(this.selectionList.length === 0){
          this.$message.warning("至少选择一条数据！！！");
          return;
        }
        break;
      case '2':
        this.form.ids = row.id;
        break;
    }
      this.dialogHand = true;
    },
    handleClick (tab, event)  {
      console.log(tab, event)
      console.log(tab.props.name);
      this.leibiao = tab.props.name;
      if( this.leibiao == 'library'){
        //订单
        this.getOrderList(this.page);
      }else if( this.leibiao == 'outbound'){
        //包件
        this.getStockUpParcelsList(this.page1);
      }else if( this.leibiao == 'enter'){
        //库存品
        this.getInventoryList(this.page2);
      }
    },
    init () {
      this.height = this.setPx(document.body.clientHeight - 570);
      getDictionaryBiz('distribution_type').then(res => { //配送类型
        this.distributionType = res.data.data;
      });
      // console.log("配送方式123", this.deliveryWayList);
      getDictionaryBiz('delivery_way').then(res => { //配送方式
        this.deliveryWayList = res.data.data;
        console.log("配送方式123", this.deliveryWayList);
      });
      getDictionaryBiz('stockup_status').then(res => { //配送方式
        this.stockupStatusList = res.data.data;
      });
      getDictionaryBiz('addvalue_serve_type').then(res => { //服务类型
        this.serveTypeList = res.data.data;
      });
      this.onLoad(this.page);

    },
    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;
      });
    },
    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) {
      if(!!this.leibiao && this.leibiao == 'library'){
        this.page.currentPage = currentPage;
        this.getOrderList(this.page);

      }else if(!!this.leibiao && this.leibiao == 'outbound'){
        this.page1.currentPage = currentPage;
        this.getStockUpParcelsList(this.page1);
      }
      else if(!!this.leibiao && this.leibiao == 'enter'){
        this.page2.currentPage = currentPage;
        this.getInventoryList(this.page2);
      }
      else {
        this.page3.currentPage = currentPage;
        this.getReservationList(this.page3);
      }
    },
    sizeChange (pageSize) {
      if(!!this.leibiao && this.leibiao == 'library'){
        this.page.pageSize = pageSize;
        this.getOrderList(this.page);

      }else if(!!this.leibiao && this.leibiao == 'outbound'){
        this.page1.pageSize = pageSize;
        this.getStockUpParcelsList(this.page1);
      }
      else if(!!this.leibiao && this.leibiao == 'enter'){
        this.page2.pageSize = pageSize;
        this.getInventoryList(this.page2);
      }
      else{
        this.page3.pageSize = pageSize;
        this.getReservationList(this.page3);
      }

    },
    onLoad (page, params = {}) {
      this.loading = true;
      this.query.id = this.$route.query.id;
      getDetailStockupOwn(this.$route.query.id).then(res => {
        console.log("返回的值",res.data.data);
        const data = res.data.data;
        this.data[0] = data;
        const { serveType, deliveryWay, deliveryType } = this.data[0];
        const serveTypes = !!serveType ? serveType.split(',') : null;
        const deliveryWays = !!deliveryWay ? deliveryWay.split(',') : null;
        const deliveryTypes = !!deliveryType ?  deliveryType.split(',') : null;
        const serveTypeName =!!serveTypes ? this.getOwnServer(serveTypes, '', this.serveTypeList) || null : null;
        const deliveryWayName =!!deliveryWays ? this.getOwnServer(deliveryWays, '', this.deliveryWayList) || null : null;
        const deliveryTypeName =!!deliveryTypes ? this.getOwnServer(deliveryTypes, '', this.distributionType) || null : null;
        Object.assign(this.data[0], {
          serveTypeName,
          deliveryWayName,
          deliveryTypeName
        });
        this.loading = false;
        this.getReservationList(page);
        // console.log(">>>>>",this.data[0],deliveryTypeName,deliveryWayName,serveTypeName);
        this.selectionClear();
      });
    } ,
    //查询预约列表
   async getReservationList(page){
       let a =await getDetailReservationOwn(page.currentPage,page.pageSize,{id :this.$route.query.id});
     console.log("......",a.data);
      const data = a.data.data;
      this.data3 = data.records;
      // if(!!this.data3 && this.data3.length > 0){
      //   this.data3.forEach(i =>{
      //     let b = this.stockupStatusList.find( a => a.dictKey == i.stockupStatus);
      //     if(!!b){
      //       i.stockupStatusName = b.dictValue;
      //     }
      //   })
      // }

     this.page3.total = a.data.data.total;
     this.loading = false;
     this.selectionClear();
    },
    //查询包件列表
   async getStockUpParcelsList(page){
      let a = await getParcelListOwn(page.currentPage,page.pageSize,{id :this.$route.query.id});
     // console.log("包件...",a.data.data);
       const data = a.data.data;
       if(data.records.length > 0){
         // console.log("数据》《》《",data.records[0]);
         if(!!data.records[0]){
           this.data1 = data.records;
           // console.log("数据》《》《》",this.data1);
           if(this.data1[0] != null ){
           this.data1.forEach(i =>{
             if(i != null ){
               console.log("><><><>>>",i);
               if(!i.stockupStatus){
                 i.stockupStatusName = "待备货";
                 this.isStockUp = true;
               }else{
                 i.stockupStatusName = "已备货";
               }
             }
           })
           }
         }

         this.page1.total = a.data.data.total;
       }
     this.loading = false;
     this.selectionClear();
    },
    //查询订单列表
   async getOrderList(page){
      let a =await getDetailOrderOwn(page.currentPage,page.pageSize,{id :this.$route.query.id});
     // console.log("订单...",a.data);
      const data = a.data.data;
      this.dataPare = data.records;
      this.dataPare.forEach(i =>{
        let b = this.stockupStatusList.find( a => a.dictKey == i.stockupStatus);
        if(!!b){
          i.stockupStatusName = b.dictValue;
        }
      })
     this.page.total = a.data.data.total;
     this.loading = false;
     this.selectionClear();
    },
    //查询库存品列表
   async getInventoryList(page){
      let a =await getDetailInventoryOwn(page.currentPage,page.pageSize,{id :this.$route.query.id});
     // console.log("库存品...",a.data);
      const data = a.data.data;
      this.data2 = data.records;
      this.data2.forEach(i =>{
        let b = this.stockupStatusList.find( a => a.dictKey == i.stockupStatus);
        if(!!b){
          i.stockupStatusName = b.dictValue;
        }
      })
     this.page2.total = a.data.data.total;
     this.loading = false;
     this.selectionClear();
    },
    //转换类型
    getOwnServer(row,name,list){
      // console.log(">>>>>",row,name,list);
      // console.log(">>>>>",row);
      // console.log(">>>>>",name);
      // console.log(">>>>>",list);
      row.forEach( i =>{
        // console.log(i,"-=-=-=-");
        let a = list.find( s => s.dictKey == i);
        // console.log("aaaa",a);
        if(!!a){
          name += a.dictValue;
        }

      });
      return name;
    },
  }
};
</script>
<style scoped>
.el-button--text {
  margin-right: 15px;
}
.el-select {
  width: 300px;
}
.el-input {
  width: 300px;
}
.dialog-footer button:first-child {
  margin-right: 10px;
}
</style>

