//钢材统计报表
<template>
  <div class="saleSteelReports">
    <div class="tableTop">
      <el-form :inline="true">
        <el-form-item>
          <el-select
            v-model="screen"
            placeholder="请选择需筛选的内容"
            clearable
            @change="changeScreen"
            style="width:90px"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-input
            style="width:150px"
            v-model="input"
            placeholder="请输入查询条件"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-select
            v-model="screen1"
            placeholder="请选择需筛选的内容"
            clearable
            @change="changeScreen"
            style="width:90px"
          >
            <el-option
              v-for="item in options1"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-input
            style="width:150px"
            v-model="input1"
            placeholder="请输入查询条件"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <label class="el-form-item__label" style="width: auto;"
            >计划日期：</label
          >
          <el-date-picker
            v-model="startTime"
            type="date"
            placeholder="选择日期"
            style="width:140px"
            :picker-options="pickerOptions"
          >
          </el-date-picker>
          <span>至</span>
          <el-date-picker
            v-model="endTime"
            type="date"
            placeholder="选择日期"
            style="width:140px"
            :picker-options="pickerOptions1"
          >
          </el-date-picker>
          <el-button type="primary" class="btn" @click="onclick(filterMap)">
            <i class="el-icon-search"></i>
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="exportAllReportToExcel"
            >下载Excel</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="clearFilter"
            >清除所有筛选</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="refresh">
            <i class="el-icon-refresh"></i>
          </el-button>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="checkTrans()"
            v-privilege="activeMenu + 'checkTrans'"
            ><i class="el-icon-truck"></i>轨迹</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="operation()"
            v-privilege="activeMenu + 'operation'"
          >
            <i class="el-icon-edit"></i>更改
            <span>
              <!-- || orgCode!='chengyunshang' -->
              <el-badge
                :value="taskAllNum"
                :max="99"
                :hidden="taskAllNum < 1"
              ></el-badge>
            </span>
          </el-button>
          <!-- <el-button type="primary" @click="batchoperation()"
            ><i class="el-icon-edit"></i>批量更改</el-button
          > -->
          <el-button
            type="primary"
            @click="checkPoint()"
            v-privilege="activeMenu + 'checkPoint'"
            ><i class="el-icon-map-location"></i>实时路径</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="openReceive()"
            v-privilege="activeMenu + 'openReceive'"
          >
            <i class="el-icon-document"></i>签收抵达</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="batchCarrier()"
            v-privilege="activeMenu + 'batchCarrier'"
          >
            <i class="el-icon-share"></i>批量</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            @click="mergeSplit()"
            v-privilege="activeMenu + 'mergeSplit'"
          >
            <i class="el-icon-pie-chart"></i>
            合并或拆分
          </el-button>
        </el-form-item>
        <el-form-item
          ><el-button
            type="primary"
            @click="confirmInbound"
            v-privilege="activeMenu + 'confirmInbound'"
            ><i class="el-icon-check"></i>出库确认</el-button
          ></el-form-item
        >
        <el-form-item v-privilege="activeMenu + 'more'">
          <el-dropdown>
            <el-button type="primary">
              更多<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-button
                type="primary"
                @click="showSaleLog()"
                v-privilege="activeMenu + 'saleLog'"
              >
                <i class="el-icon-pie-chart"></i>
                操作日志
              </el-button>
              <el-button type="primary" @click="ctrlColumnShow">
                <i class="el-icon-pie-chart"></i>
                控制列显隐
              </el-button>
            </el-dropdown-menu>
          </el-dropdown>
        </el-form-item>

        <el-form-item>
          <span style="width: auto;font-size: 16px;line-height: auto;"
            >车数/件数/磅重： {{ totalCapacity }}/{{ totalNumber }}/{{
              totalNetWeight
            }}
          </span>
        </el-form-item>
      </el-form>
    </div>
    <div class="table">
      <el-table
        :data="visibleList"
        :span-method="objectSpanMethod"
        ref="tableRef"
        border
        style="width: 100%; margin-top: 20px"
        id="salesLogisticsStat_saleSteelReports_table"
        :height="maxHeight"
        :max-height="maxHeight"
        :row-class-name="tableRowClassName"
        @cell-click="cellClik"
        @cell-mouse-enter="cellMouse1"
        @cell-mouse-leave="cellLeave1"
        @row-click="rowClick"
        :cell-style="cellStyle"
        @filter-change="filterChange"
        :key="saleSteelKey"
        @select="selectOne"
        @selection-change="handleSelectionChange()"
        :header-cell-style="headCellStyle"
      >
        <el-table-column
          type="selection"
          width="50"
          label="选择"
          align="center"
          column-key="select"
          key="select"
          v-if="
            !notRoutList.includes('select') ||
              !columnNoRoutList.includes('选择')
          "
        ></el-table-column>

        <el-table-column
          width="50"
          label="序号"
          align="center"
          column-key="group"
          key="group"
          :resizable="false"
          v-if="!columnNoRoutList.includes('序号')"
        >
          <template slot-scope="scope">{{ scope.row.group + 1 }}</template>
        </el-table-column>
        <el-table-column
          prop="orderTime"
          label="计划日期"
          width="110px"
          align="center"
          column-key="orderTime"
          key="orderTime"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('订单日期')"
        >
        </el-table-column>
        <el-table-column
          prop="saleMakeDate"
          label="出库日期"
          width="110px"
          align="center"
          column-key="saleMakeDate"
          key="saleMakeDate"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('订单日期')"
        >
        </el-table-column>
        <el-table-column
          prop="inventoryWarehouse"
          label="出库库房"
          width="110px"
          align="center"
          column-key="inventoryWarehouse"
          key="inventoryWarehouse"
          :filters="filterWarehouse"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('订单日期')"
        >
        </el-table-column>
        <el-table-column
          prop="saleOrderStatus"
          column-key="saleOrderStatus"
          key="saleOrderStatus"
          label="计划状态"
          width="110px"
          align="center"
          :filters="filterSaleOrderStatus"
          sortable
          v-if="!columnNoRoutList.includes('销售订单状态')"
        >
        </el-table-column>
        <el-table-column
          prop="consigneeName"
          label="收货单位"
          width="250px"
          align="center"
          column-key="consigneeName"
          key="consigneeName"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('客户')"
          :render-header="renderHeader"
        >
        </el-table-column>
        <el-table-column
          prop="orderStatus"
          column-key="orderStatus"
          key="orderStatus"
          label="运单状态"
          align="center"
          :filters="filterorderStatus"
          v-if="!columnNoRoutList.includes('运单状态')"
        >
        </el-table-column>
        <el-table-column
          prop="orderStatusActually"
          column-key="orderStatusActually"
          key="orderStatusActually"
          label="订单实际状态"
          align="center"
          width="100"
          :filters="filterorderStatusActually"
          v-if="!columnNoRoutList.includes('运单状态')"
        >
        </el-table-column>
        <el-table-column
          prop="carrierName"
          label="承运商"
          align="center"
          width="80px"
          column-key="carrierList"
          key="carrierList"
          sortable
          show-overflow-tooltip
          :filters="filterCarrierList"
          v-if="!columnNoRoutList.includes('承运商')"
        >
        </el-table-column>
        <el-table-column
          prop="capacityNo"
          column-key="capacityNo"
          key="capacityNo"
          label="车牌号"
          align="center"
          width="90px"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('车牌号')"
          :render-header="renderHeader"
        >
        </el-table-column>
        <el-table-column
          prop="materialName"
          column-key="materialNameList"
          key="materialNameList"
          label="物资名称"
          align="center"
          width="150px"
          v-if="!columnNoRoutList.includes('物资名称')"
          :render-header="renderHeader"
        >
        </el-table-column>
        <el-table-column
          prop="materialSpe"
          label="物资规格"
          column-key="materialSpe"
          key="materialSpe"
          align="center"
          width="120px"
          v-if="!columnNoRoutList.includes('物资规格')"
          :render-header="renderHeader"
        >
        </el-table-column>
        <el-table-column
          prop="steelMeters"
          column-key="steelMeters"
          key="steelMeters"
          label="米数"
          align="center"
          width="50px"
          v-if="!columnNoRoutList.includes('物资件数')"
        >
        </el-table-column>
        <el-table-column
          prop="singleWeight"
          column-key="singleWeight"
          key="singleWeight"
          label="单重"
          align="center"
          width="50px"
          v-if="!columnNoRoutList.includes('物资件数')"
        >
        </el-table-column>
        <el-table-column
          prop="materialNum"
          column-key="materialNum"
          key="materialNum"
          label="物资件数"
          align="center"
          width="50px"
          v-if="!columnNoRoutList.includes('物资件数')"
        >
        </el-table-column>
        <el-table-column
          prop="materialWeight"
          column-key="materialWeight"
          key="materialWeight"
          label="出库理重"
          align="center"
          width="50px"
          v-if="!columnNoRoutList.includes('理重')"
        >
        </el-table-column>
        <el-table-column
          prop="netWeight"
          column-key="netWeight"
          key="netWeight"
          label="出库净重"
          align="center"
          width="50px"
          v-if="!columnNoRoutList.includes('净重')"
        >
        </el-table-column>
        <el-table-column
          prop="addressPlace"
          label="收货地址"
          width="250px"
          column-key="addressPlace"
          key="addressPlace"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('收货地址')"
          :render-header="renderHeader"
        >
          <template slot-scope="scope">
            <span
              v-if="scope.row.addressPlace.indexOf('新地址') >= 0"
              style="color:red"
              >{{ scope.row.addressPlace }}</span
            >
            <span v-show="scope.row.addressPlace.indexOf('新地址') < 0">{{
              scope.row.addressPlace
            }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="consigneeTel"
          column-key="consigneeTel"
          key="consigneeTel"
          label="收货客户电话"
          width="120px"
          align="center"
          v-if="!columnNoRoutList.includes('收货客户电话')"
        >
        </el-table-column>
        <el-table-column
          prop="saleRemark"
          column-key="saleRemark"
          key="saleRemark"
          label="摘要"
          width="180px"
          show-overflow-tooltip
          align="center"
          v-if="!columnNoRoutList.includes('摘要')"
          :render-header="renderHeader"
        >
        </el-table-column>
        <el-table-column
          prop="truckRemark"
          column-key="truckRemark"
          key="truckRemark"
          label="备注"
          width="150"
          align="center"
          :render-header="renderHeader"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('备注')"
        >
        </el-table-column>
        <el-table-column
          prop="capacityTel"
          column-key="capacityTel"
          key="capacityTel"
          label="司机电话"
          width="120px"
          align="center"
          v-if="!columnNoRoutList.includes('司机电话')"
        >
        </el-table-column>
        <el-table-column
          prop="spellNum"
          column-key="spellNum"
          key="spellNum"
          label="拼数"
          width="120px"
          align="center"
          :filters="filterSpellNum"
          v-if="!columnNoRoutList.includes('拼数')"
        >
        </el-table-column>
        <el-table-column
          prop="isPrintDelivery"
          column-key="isPrintDelivery"
          key="isPrintDelivery"
          label="送货单打印"
          align="center"
          width="100px"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('送货单打印')"
        >
        </el-table-column>
        <el-table-column
          prop="smsResultId"
          column-key="smsResultId"
          key="smsResultId"
          label="短信发送"
          width="100px"
          align="center"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('短信发送')"
        >
        </el-table-column>
        <el-table-column
          prop="arrivalAddress"
          column-key="arrivalAddress"
          key="arrivalAddress"
          label="抵达地址"
          width="280px"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('抵达地址')"
        >
        </el-table-column>
        <el-table-column
          prop="arrivalTime"
          column-key="arrivalTime"
          key="arrivalTime"
          label="抵达时间"
          width="150px"
          v-if="!columnNoRoutList.includes('抵达时间')"
        >
        </el-table-column>
        <el-table-column
          prop="receiptAddress"
          column-key="receiptAddress"
          key="receiptAddress"
          label="签收地址"
          width="280px"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('签收地址')"
        >
        </el-table-column>
        <el-table-column
          prop="receiptTime"
          column-key="receiptTime"
          key="receiptTime"
          label="签收时间"
          width="150px"
          v-if="!columnNoRoutList.includes('签收时间')"
        >
        </el-table-column>
        <el-table-column
          prop="orderNo"
          column-key="orderNo"
          key="orderNo"
          label="运输订单号"
          width="180px"
          align="center"
          v-if="!columnNoRoutList.includes('运输订单号')"
        >
        </el-table-column>

        <el-table-column
          prop="saler"
          column-key="saler"
          key="saler"
          label="业务员"
          align="center"
          v-if="!columnNoRoutList.includes('业务员')"
        >
        </el-table-column>
        <el-table-column
          prop="shipperName"
          column-key="shipperName"
          key="shipperName"
          label="发货单位"
          width="170px"
          align="center"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('发货单位')"
        >
        </el-table-column>

        <el-table-column
          prop="isSelfMention"
          column-key="isSelfMention"
          key="isSelfMention"
          label="是否自提"
          align="center"
          v-if="!columnNoRoutList.includes('是否自提')"
        >
        </el-table-column>

        <el-table-column
          prop="saleOrderNo"
          column-key="saleOrderNo"
          key="saleOrderNo"
          label="转运计划号"
          width="200px"
          align="center"
          v-if="!columnNoRoutList.includes('销售订单号')"
        >
        </el-table-column>
        <el-table-column
          prop="orderInsertUpdateRemark"
          column-key="orderInsertUpdateRemark"
          key="orderInsertUpdateRemark"
          label="运输订单变更记录"
          width="120px"
          show-overflow-tooltip
          v-if="!columnNoRoutList.includes('运输订单变更记录')"
        >
        </el-table-column>
        <el-table-column
          prop="materialPlanNumber"
          column-key="materialPlanNumber"
          key="materialPlanNumber"
          label="理论件数"
          align="center"
          v-if="!columnNoRoutList.includes('理论件数')"
        >
        </el-table-column>
      </el-table>
    </div>
    <div>
      <vxe-modal
        width="80%"
        height="80%"
        v-model="isShow3"
        show-footer
        show-zoom
        class="vxeModal"
      >
        <div class="demo-image__preview" v-for="(item, i) in srcList" :key="i">
          <span>{{ item.title }}</span>
          <el-image
            :src="item.src"
            fit="fill"
            :previewSrcList="previewSrcList"
            @click.prevent.right="receiveClick(item.src, '抵达')"
          >
            <div slot="error" class="image-slot">
              <span>司机未上传图片</span>
            </div>
          </el-image>
        </div>
      </vxe-modal>
      <vxe-modal width="80%" height="80%" v-model="isShow4" show-zoom>
        <div class="demo-image__preview" v-for="(item, i) in srcList2" :key="i">
          <el-image
            :src="item.src"
            fit="fill"
            :previewSrcList="previewSrcList2"
            @click.prevent.right="receiveClick(item.src, '签收')"
          >
            <div slot="error" class="image-slot">
              <span>司机未上传图片</span>
            </div>
          </el-image>
        </div>
      </vxe-modal>
    </div>
    <div class="dialog">
      <el-dialog
        title="运单详情"
        :visible.sync="centerDialogVisible"
        width="90%"
        center
      >
        <div class="steelMapClass">
          <div class="steelMapClass1">
            <div class="steelMapClass12">
              <span>转运计划号:</span>
              <span>{{ steelMap.saleOrderNo }}</span>
            </div>
            <div class="steelMapClass12">
              <span>订单状态:</span>
              <span>{{ steelMap.saleOrderStatus }}</span>
            </div>
            <div class="steelMapClass12">
              <span>业务员:</span>
              <span>{{ steelMap.saler }}</span>
            </div>
            <div class="steelMapClass12">
              <span>收货单位:</span>
              <span>{{ steelMap.consigneeName }}</span>
            </div>
            <div
              class="steelMapClass13"
              v-if="!notRoutList.includes('closeOrder')"
            >
              <span>车辆备注:</span>
              <span
                ><el-input
                  v-model="steelMap.truckRemark"
                  width="250px"
                ></el-input
              ></span>
              <!-- <span>{{ steelMap.truckRemark }}</span> -->
            </div>
          </div>
          <div class="steelMapClass2">
            <div class="steelMapClass22">
              <span>收货地址:</span>
              <el-select
                v-model="steelMap.addressProvince"
                filterable
                placeholder="请选择"
                @change="onchangeProvince"
                style="width:120px"
                :disabled="notRoutList.includes('province')"
              >
                <el-option
                  v-for="item in provinceList"
                  :key="item.id"
                  :label="item.addressProvince"
                  :value="item.id"
                ></el-option>
              </el-select>
              <el-select
                v-model="steelMap.addressDistrict"
                filterable
                placeholder="请选择"
                @change="onchangeCity"
                style="width:120px"
                :disabled="notRoutList.includes('city')"
              >
                <el-option
                  v-for="item in cityList"
                  :key="item.id"
                  :label="item.addressDistrict"
                  :value="item.id"
                ></el-option>
              </el-select>
              <el-select
                v-model="steelMap.addressTown"
                filterable
                placeholder="请选择"
                @change="onchangeCounty"
                style="width:120px"
                :disabled="notRoutList.includes('country')"
              >
                <el-option
                  v-for="item in countyList"
                  :key="item.id"
                  :label="item.addressTown"
                  :value="item.id"
                ></el-option>
              </el-select>
              <el-autocomplete
                class="inline-input"
                v-model="steelMap.place"
                :fetch-suggestions="querySearch1"
                placeholder="请输入具体收货地址"
                :trigger-on-focus="false"
                @select="handleSelect1"
                style="width:250px"
                :disabled="notRoutList.includes('place')"
              >
              </el-autocomplete>
              <el-button
                type="success"
                circle
                @click="addAddressClick"
                v-if="!notRoutList.includes('addressClick')"
                >提交</el-button
              >
            </div>
            <div
              class="steelMapClass23"
              v-if="
                (steelMap.carStatus == 4 ||
                  steelMap.carStatus == 5 ||
                  steelMap.carStatus == null) &&
                  !notRoutList.includes('closeOrder')
              "
            ></div>
            <div
              class="steelMapClass23"
              v-if="
                steelMap.carStatus == 7 && !notRoutList.includes('closeOrder')
              "
            >
              <el-button type="danger" round @click="reverseCloseOrder"
                >反关闭运单</el-button
              >
            </div>
            <div v-if="!notRoutList.includes('closeOrder')">
              <el-button round @click="resetPrintNumber"
                >重置打印次数</el-button
              >
            </div>
          </div>
          <div class="steelMapClass3">
            <div class="steelMapClass32">
              <span>收货客户电话:</span>
              <el-input
                v-model="steelMap.consigneeTel"
                style="width:150px"
                :disabled="notRoutList.includes('consigeeTel')"
              ></el-input>
              <el-button
                type="success"
                circle
                @click="updateconsigneeTel"
                v-if="!notRoutList.includes('consigeeTel')"
                >提交</el-button
              >
            </div>
            <div class="steelMapClass33">
              <span>承运商:</span>
              <el-autocomplete
                style="width:120px"
                v-model="steelMap.carrierName"
                :fetch-suggestions="querySearchCarrier"
                placeholder="请输入承运商"
                @select="handleSelectCarrier"
                :disabled="notRoutList.includes('carrierName')"
              >
              </el-autocomplete>
              <el-button
                type="success"
                circle
                @click="updateTruckCarrierDebounce"
                v-if="!notRoutList.includes('carrierName')"
                >提交</el-button
              >
            </div>
            <div class="steelMapClass33">
              <span>车牌号:</span>
              <el-autocomplete
                style="width:120px"
                v-model="steelMap.capacityNo"
                :fetch-suggestions="querySearch"
                placeholder="请输入车牌号"
                @select="handleSelect()"
                :disabled="
                  notRoutList.includes('capacityNo') &&
                    steelMap.capacityId != null &&
                    steelMap.capacityNoFlag != null
                "
              ></el-autocomplete>
              <el-button
                type="success"
                circle
                @click="updateCapacityDebounce"
                v-if="
                  !(
                    notRoutList.includes('capacityNo') &&
                    steelMap.capacityId != null &&
                    steelMap.capacityNoFlag != null
                  )
                "
                >提交</el-button
              >
              <span v-show="orgCode != 'chengyunshang'">是否校验GPS:</span>
              <el-switch
                v-model="isCheckGPS"
                v-show="orgCode != 'chengyunshang'"
                :disabled="orgCode == 'chengyunshang'"
              >
              </el-switch>
            </div>
            <div class="steelMapClass33">
              <span>司机电话:</span>
              <el-input
                style="width:120px"
                v-model="steelMap.capacityTel"
                placeholder="请输入电话号码"
              ></el-input>
              <el-button type="success" circle @click="updateDriverTel"
                >提交</el-button
              >
            </div>
          </div>
          <div class="steelMapClass4">
            <div class="steelMapClass42" v-if="steelMap.orderNo != null">
              <span>运输订单号:</span>
              <span>{{ steelMap.orderNo }}</span>
            </div>
            <div class="steelMapClass43">
              <span>运单状态:</span>
              <span>{{ steelMap.orderStatus }}</span>
            </div>
            <div
              class="steelMapClass43"
              v-if="steelMap.orderStatusTime != null"
            >
              <span>状态更新时间:</span>
              <span>{{ steelMap.orderStatusTime }}</span>
            </div>
          </div>
          <div class="steelMapClass9">
            <div
              class="steelMapClass92"
              v-if="
                steelMap.orderNo != null && !notRoutList.includes('closeOrder')
              "
            >
              <el-form :inline="true">
                <el-form-item>
                  <el-input
                    v-model="steelMap.remark"
                    placeholder="填写备注"
                    class="steelMapClass921"
                    type="textarea"
                    autosize
                  >
                    <!-- <template slot="prepend">备注</template>
                <template slot="prefix">
                  {{ steelMap.remark }}
                </template> -->
                  </el-input></el-form-item
                >
                <el-form-item>
                  <el-button @click="openRemarkPic" type="primary"
                    >备注图片</el-button
                  >
                </el-form-item>
              </el-form>
            </div>
          </div>
          <div class="steelMapClass5">
            <div class="steelMapClass52" v-if="steelMap.arrivalAddress != null">
              <span>抵达地址:</span>
              <span>{{ steelMap.arrivalAddress }}</span>
            </div>
          </div>
          <div class="steelMapClass6">
            <div class="steelMapClass62" v-if="steelMap.receiptAddress != null">
              <span>签收地址:</span>
              <span>{{ steelMap.receiptAddress }}</span>
            </div>
          </div>
        </div>
        <div class="table1">
          <el-table
            :data="steelMap.mapList"
            border
            style="width: 100%; margin-top: 20px"
            :span-method="objectSpanMethod1"
          >
            <el-table-column
              prop="materialName"
              label="物资名称"
              align="center"
              width="150px"
            >
            </el-table-column>
            <el-table-column
              prop="materialSpe"
              label="物资规格"
              align="center"
              sortable
            >
            </el-table-column>
            <el-table-column
              prop="materialNum"
              label="物资件数"
              align="center"
              width="200px"
            >
              <template slot-scope="scope">
                <button
                  type="primary"
                  @click="scope.row.materialNumber--"
                  style="height:40px"
                  v-if="!notRoutList.includes('materialNum')"
                >
                  -
                </button>
                <input
                  v-model="scope.row.materialNumber"
                  style="width:40px;height: 40px;font-size:16px;line-height: 40px;text-align: center;"
                  :disabled="notRoutList.includes('materialNum')"
                />
                <button
                  type="primary"
                  @click="scope.row.materialNumber++"
                  style="height:40px"
                  :disabled="scope.row.saleOrderStatus == 4"
                  v-if="!notRoutList.includes('materialNum')"
                >
                  +
                </button>
                <el-button
                  type="primary"
                  @click="updateBillOrder(scope.row)"
                  v-if="!notRoutList.includes('materialNum')"
                  >提交</el-button
                >
              </template>
            </el-table-column>
            <el-table-column prop="loadTime" label="装货时间" width="130px">
            </el-table-column>
            <el-table-column prop="saleRemarkByasm" label="摘要" width="100px">
            </el-table-column>
          </el-table>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="centerDialogVisible = false">返 回</el-button>
          <el-button @click="submitSteelDebounce(steelMap)">确定</el-button>
        </span>
        <div>
          <vxe-modal
            width="549px"
            height="731px"
            v-model="isShow"
            show-zoom
            show-footer
            class="vxeModal"
            title="抵达上传照片"
          >
            <div class="demo-image__preview">
              <div
                class="demo-image__preview"
                v-for="(item, index) in srcList"
                :key="index"
              >
                <span>{{ item.title }}</span>
                <el-image
                  style="height:731px;text-align:center"
                  :src="item.src"
                >
                  <div slot="error" class="image-slot">
                    <span>司机未上传抵达图片</span>
                  </div>
                </el-image>
              </div>
            </div>
          </vxe-modal>
          <vxe-modal
            width="549px"
            height="731px"
            v-model="isShow2"
            show-zoom
            show-footer
            title="签收上传照片"
          >
            <div
              class="demo-image__preview"
              v-for="(item, index) in srcList2"
              :key="index"
            >
              <span>{{ item.title }}</span>
              <el-image style="height:731px;text-align:center" :src="item.src">
                <div slot="error" class="image-slot">
                  <span>司机未上传签收图片</span>
                </div>
              </el-image>
            </div>
          </vxe-modal>
        </div>
      </el-dialog>
    </div>
    <div style="height: 100%">
      <vxe-modal
        width="1237"
        height="731"
        v-model="value7"
        show-zoom
        resize
        title="轨迹查询"
      >
        <template #default>
          <PathView v-bind.sync="pathOption"></PathView>
        </template>
      </vxe-modal>
    </div>
    <div style="height:100%">
      <vxe-modal
        width="1237"
        height="731"
        v-model="value8"
        show-zoom
        resize
        title="实时路径"
        ><currentLocation :carNumber="carNumber"></currentLocation
      ></vxe-modal>
    </div>
    <el-dialog
      title="抵达签收"
      :visible.sync="arrivalReceiving"
      :before-close="closeUpload"
    >
      <el-form style="margin-left:20%">
        <el-form-item label="车牌号码">
          <el-input
            v-model="capacityNumber"
            disabled
            style="width:300px"
          ></el-input>
        </el-form-item>
        <el-form-item label="签收地址">
          <el-input
            v-model="location"
            style="width:400px"
            :disabled="orgCode != 'wuliuyunshubu'"
          ></el-input>
        </el-form-item>
        <el-form-item label="抵达时间">
          <el-date-picker
            v-model="arrivalTime"
            type="datetime"
            :disabled="orgCode != 'wuliuyunshubu'"
            placeholder="选择日期时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="签收时间">
          <el-date-picker
            v-model="receiptTime"
            type="datetime"
            :disabled="orgCode != 'wuliuyunshubu'"
            placeholder="选择日期时间"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="抵达图片（车头、满货箱）" style="">
          <el-upload
            ref="arrival"
            list-type="picture-card"
            :file-list="arriavlList"
            action="/api/v1/otms/addtmstruckArrivalResult"
            :limit="12"
            :on-change="fileChange1"
            :on-remove="fileChange1"
            :on-preview="handlePictureCardPreview"
            :on-exceed="exceed"
            accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF"
            :auto-upload="false"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item>
        <el-form-item label="签收图片（空货箱、质保书、签收单）">
          <el-upload
            ref="receive"
            list-type="picture-card"
            :file-list="receiveList"
            action="null"
            :limit="11"
            :on-change="fileChange2"
            :on-remove="fileChange2"
            :on-preview="handlePictureCardPreview"
            :on-exceed="exceed"
            accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF"
            :auto-upload="false"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item>
      </el-form>
      <el-button
        type="primary"
        @click="arrivalAndReceive"
        :loading="isLoading"
        style="margin-left:40%"
        >确定</el-button
      >
    </el-dialog>
    <el-dialog
      title="备注图片(图片暂存后需要点击全局确定才会保存)"
      :visible.sync="remarkPic"
      :before-close="closeUpload2"
    >
      <el-form style="margin-left:20%">
        <el-form-item>
          <el-upload
            ref="remarkPic"
            list-type="picture-card"
            :file-list="remarkPicList"
            action="null"
            :limit="11"
            :on-change="fileChange3"
            :on-remove="fileChange3"
            :on-preview="handlePictureCardPreview"
            :on-exceed="exceed"
            accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP,.PDF"
            :auto-upload="false"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-form-item>
      </el-form>
      <el-button
        type="primary"
        @click="uploadRemarkPic"
        :loading="isLoading"
        style="margin-left:40%"
        >暂存</el-button
      >
    </el-dialog>
    <el-dialog :visible.sync="dialogVisible" width="80%">
      <img width="100%" :src="dialogImageUrl" alt="" />
    </el-dialog>
    <el-dialog :visible.sync="batchCarrierVisible" width="55%" center>
      <div class="batchCarrierClass">
        <el-form :inline="true">
          <span>批量授权承运商</span>
          <el-form-item>
            <el-autocomplete
              style="width:250px"
              v-model="batchCarrierName"
              :fetch-suggestions="querySearchCarrier"
              placeholder="请输入承运商"
              @select="handleSelectCarrier"
            >
            </el-autocomplete>
          </el-form-item>
          <el-form-item>
            <el-button @click="batchCarrierVisible = false">取 消</el-button>
            <el-button type="primary" @click="batchCarrierMakeSure"
              >确 定</el-button
            >
          </el-form-item>
        </el-form>
      </div>
      <div class="batchCapacityClass">
        <el-form :inline="true">
          <span>批量修改车牌号</span>
          <el-form-item>
            <el-autocomplete
              style="width:250px"
              v-model="capacityNo"
              :fetch-suggestions="querySearch"
              placeholder="请输入车牌号"
              @select="batchCapacitySelect"
            >
            </el-autocomplete>
          </el-form-item>
          <el-form-item>
            <el-button @click="batchCarrierVisible = false">取 消</el-button>
            <el-button type="primary" @click="batchEditCapacity"
              >确 定</el-button
            >
          </el-form-item>
        </el-form>
      </div>
      <div class="steelMapClass22">
        <span>收货地址:</span>
        <el-select
          v-model="steelMap.addressProvince"
          filterable
          placeholder="请选择"
          @change="onchangeProvince"
          style="width:120px"
          :disabled="notRoutList.includes('province')"
        >
          <el-option
            v-for="item in provinceList"
            :key="item.id"
            :label="item.addressProvince"
            :value="item.id"
          ></el-option>
        </el-select>
        <el-select
          v-model="steelMap.addressDistrict"
          filterable
          placeholder="请选择"
          @change="onchangeCity"
          style="width:120px"
          :disabled="notRoutList.includes('city')"
        >
          <el-option
            v-for="item in cityList"
            :key="item.id"
            :label="item.addressDistrict"
            :value="item.id"
          ></el-option>
        </el-select>
        <el-select
          v-model="steelMap.addressTown"
          filterable
          placeholder="请选择"
          @change="onchangeCounty"
          style="width:120px"
          :disabled="notRoutList.includes('country')"
        >
          <el-option
            v-for="item in countyList"
            :key="item.id"
            :label="item.addressTown"
            :value="item.id"
          ></el-option>
        </el-select>
        <el-autocomplete
          class="inline-input"
          v-model="steelMap.place"
          :fetch-suggestions="querySearch1"
          placeholder="请输入具体收货地址"
          :trigger-on-focus="false"
          @select="handleSelect1"
          style="width:250px"
          :disabled="notRoutList.includes('place')"
        >
        </el-autocomplete>
        <el-button
          type="success"
          circle
          @click="batchUpdateCarAddress"
          v-if="!notRoutList.includes('addressClick')"
          >提交</el-button
        >
      </div>
      <div class="batchCapacityClass" style="margin:30px">
        <el-form :inline="true">
          <el-form-item>
            <span>批量修改收货客户电话:</span>
            <el-input
              v-model="consigneeTel"
              style="width:150px"
              :disabled="notRoutList.includes('consigeeTel')"
            ></el-input>
            <el-button
              type="success"
              circle
              @click="batchUpdateconsigneeTel"
              v-if="!notRoutList.includes('consigeeTel')"
              >提交</el-button
            >
          </el-form-item>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog
      title="切换列的显示与隐藏"
      :visible.sync="columnShowDialog"
      width="50%"
      center
      class="columnShowDialogClass"
    >
      <el-tabs
        v-model="schemeMap.activeName"
        type="card"
        editable
        @edit="handleTabsEdit"
        @tab-click="columnShowTabClick"
        tab-position="left"
      >
        <el-tab-pane
          :key="index"
          v-for="(item, index) in schemeMap.schemeList"
          :label="item.title"
          :name="item.name"
        >
          <el-form :inline="true">
            <el-form-item>
              <div style="border:2px,solid,green">
                <div
                  style="margin-left: 50%;margin-bottom: 15px;font-size: 16px;"
                >
                  {{ schemeMap.activeName }}
                </div>
                <el-transfer
                  style="text-align: left; display: inline-block"
                  v-model="item.columnHiddenData"
                  :data="item.columnAllData"
                  :titles="['显示的列', '隐藏的列']"
                  :button-texts="['至显示列', '至隐藏列']"
                ></el-transfer>
              </div>
            </el-form-item>
          </el-form>
          <el-form :inline="true">
            <el-form-item>
              <el-button @click="columnShowDialog = false">取 消</el-button>
              <el-button type="primary" @click="columnShowOperation(item)"
                >启用</el-button
              >
            </el-form-item>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
    <div class="cofirmInbound">
      <el-dialog :visible.sync="confireInboundVisible" width="90%">
        <div
          style="font-size: 20px;font-weight:500;display: flex;justify-content: center;align-items: center;"
        >
          <span>出库确认</span>
        </div>
        <div class="steelMapClass">
          <div class="steelMapClass1">
            <div
              class="steelMapClass12"
              style="font-size: 16px;font-weight:500"
            >
              <span>转运计划号:</span>
              <span>{{ steelMap.saleOrderNo }}</span>
            </div>
            <div
              class="steelMapClass12"
              style="font-size: 18px;font-weight:500"
            >
              <span>订单状态:</span>
              <span>{{ steelMap.saleOrderStatus }}</span>
            </div>
            <div
              class="steelMapClass12"
              style="font-size: 16px;font-weight:500"
            >
              <span>业务员:</span>
              <span>{{ steelMap.saler }}</span>
            </div>
            <div
              class="steelMapClass12"
              style="font-size: 16px;font-weight:500"
            >
              <span>收货单位:</span>
              <span>{{ steelMap.consigneeName }}</span>
            </div>
          </div>
          <div class="steelMapClass2">
            <div
              class="steelMapClass22"
              style="font-size: 16px;font-weight:500"
            >
              <span>收货地址:</span>
              <span>{{ steelMap.addressProvince }}</span>
              <span>{{ steelMap.addressDistrict }}</span>
              <span>{{ steelMap.addressTown }}</span>
              <span>{{ steelMap.place }}</span>
            </div>
          </div>
          <div class="steelMapClass3">
            <div
              class="steelMapClass33"
              style="font-size: 16px;font-weight:500"
            >
              <span>承运商:</span>
              <span>{{ steelMap.carrierName }}</span>
            </div>
            <div
              class="steelMapClass33"
              style="font-size: 16px;font-weight:500"
            >
              <span>车牌号:</span>
              <span>{{ steelMap.capacityNo }}</span>
            </div>
            <div
              class="steelMapClass33"
              style="font-size: 16px;font-weight:500"
            >
              <span>司机电话:</span>
              <span>{{ steelMap.capacityTel }}</span>
            </div>
          </div>
          <div class="steelMapClass4">
            <div
              class="steelMapClass42"
              v-if="steelMap.orderNo != null"
              style="font-size: 16px;font-weight:500"
            >
              <span>运输订单号:</span>
              <span>{{ steelMap.orderNo }}</span>
            </div>
            <div
              class="steelMapClass43"
              style="font-size: 16px;font-weight:500"
            >
              <span>运单状态:</span>
              <span>{{ steelMap.orderStatus }}</span>
            </div>
            <div
              class="steelMapClass43"
              style="font-size: 16px;font-weight:500"
            >
              <span>厂外库</span>
              <span>欧冶库</span>
            </div>
          </div>
        </div>
        <div class="table1">
          <el-table
            :data="steelMap.mapList"
            border
            style="width: 100%; margin-top: 20px"
            :span-method="objectSpanMethod1"
          >
            <el-table-column
              prop="materialName"
              label="物资名称"
              align="center"
              width="150px"
            >
            </el-table-column>
            <el-table-column
              prop="materialSpe"
              label="物资规格"
              align="center"
              sortable
            >
            </el-table-column>
            <el-table-column prop="materialNum" label="物资件数" align="center">
            </el-table-column>
            <el-table-column prop="meter" label="米数" align="center">
            </el-table-column>
            <el-table-column prop="singleWeight" label="单重" align="center">
            </el-table-column>
            <el-table-column
              prop="saleRemarkByasm"
              label="摘要"
              width="180px"
              align="center"
            >
            </el-table-column>
            <el-table-column label="具体仓库名称">
              <template slot-scope="scope">
                <el-select v-model="scope.row.inboundWarehouse">
                  <el-option
                    v-for="(item, index) in oYeWarehouseList"
                    :label="item.label"
                    :value="item.value"
                    :key="index"
                  ></el-option
                ></el-select>
              </template>
            </el-table-column>
            <el-table-column label="出库净重">
              <template slot-scope="scope">
                <el-input
                  v-model.number="scope.row.inboundNetWeight"
                  type="number"
                ></el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <span
          slot="footer"
          class="dialog-footer"
          style="display: flex;justify-content: center;align-items: center;"
        >
          <el-button @click="confireInboundVisible = false">返 回</el-button>
          <el-button @click="confireInboundTo(steelMap)">确定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { sjTime, isVehicleNumber } from '@/utils/sharedJsFile'
import { getCookie } from '@/utils/util.js'
import PathView from './mapTest.vue'
import currentLocation from './currentLocation.vue'
import { downloadFile, creatImageFile } from '@/utils/base64ToBlob.js'
export default {
  components: {
    PathView,
    currentLocation
  },
  data() {
    const generateStartDate = _ => {
      let startDate = new Date()
      console.log(startDate, 'generateStartDate')
      if (
        new Date(startDate.getTime() - 86400000).getMonth() ===
          new Date(startDate.getTime() - 8 * 60 * 60 * 1000).getMonth() &&
        new Date(startDate.getTime() - 86400000).getDate() ===
          new Date(startDate.getTime() - 8 * 60 * 60 * 1000).getDate()
      ) {
        startDate = new Date(startDate.getTime() - 86400000)
      }
      return startDate
    }
    return {
      activeMenu: window.top.localStorage.getItem('activeMenu'),
      confireInboundVisible: false,
      toggleRowIds: [],
      capacityNo: null,
      capacityId: null,
      consigneeTel: null,
      batchCapacityList: [],
      batchCapacityVisible: false,
      isShowSaleLog: false,
      optionSaleLog: {
        maxHeight: 400,
        requestUrl: '/api/v1/ams/selectAllLog?apiId=522',
        requestQuery: {
          con: null
        }
      },
      isCheckGPS: true,
      userId: null,
      orgCode: null,
      taskAllNum: 0,
      noticeInterval: null,
      exceptionHandleVisible: false,
      batchCarrierName: null,
      batchCarrierVisible: false,
      visibleList: [],
      itemHeight: 30,
      scrollTop: 0,
      debounceS: false,
      carNumber: '',
      //弹出框
      centerDialogVisible: false,
      //根据车序号查询的值
      steelMap: {},
      //钢材子表数据
      drawer: false,
      isShow3: false,
      isShow4: false,
      input: null,
      screen: '',
      options: [
        {
          value: '客户',
          lable: '客户'
        },
        {
          value: '承运商',
          lable: '承运商'
        },
        {
          value: '车牌号',
          lable: '车牌号'
        },
        {
          value: '收货地址',
          lable: '收货地址'
        },
        {
          value: '转运计划号',
          lable: '转运计划号'
        }
      ],
      input1: null,
      screen1: '',
      options1: [
        {
          value: '客户',
          lable: '客户'
        },
        {
          value: '承运商',
          lable: '承运商'
        },
        {
          value: '车牌号',
          lable: '车牌号'
        },
        {
          value: '收货地址',
          lable: '收货地址'
        },
        {
          value: '转运计划号',
          lable: '转运计划号'
        }
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now()
        },
        shortcuts: [
          {
            text: '今天',
            onClick(picker) {
              picker.$emit('pick', new Date())
            }
          },
          {
            text: '昨天',
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', date)
            }
          },
          {
            text: '一周前',
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            }
          },
          {
            text: '元年',
            onClick(picker) {
              const date = new Date()
              date.setTime(0)
              picker.$emit('pick', date)
            }
          }
        ]
      },
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() > Date.now()
        },
        shortcuts: [
          {
            text: '今天',
            onClick(picker) {
              picker.$emit('pick', new Date())
            }
          },
          {
            text: '昨天',
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', date)
            }
          },
          {
            text: '一周前',
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            }
          },
          {
            text: '元年',
            onClick(picker) {
              const date = new Date()
              date.setTime(0)
              picker.$emit('pick', date)
            }
          }
        ]
      },
      startTime: generateStartDate(),
      endTime: generateStartDate(),
      //合计净重
      totalNumber: 0,
      //合计车数
      totalCapacity: 0,
      //取消车数
      quxiaoCapacityNum: 0,
      //合计吨位
      totalNetWeight: 0,
      tableTitle: '销售统计报表',
      capacityList: [],
      carrierList: [],
      tableData: [],
      spanArr: [],
      pos: 0,
      spanArr1: [],
      spanArr2: [],
      spanArr3: [],
      mergeListBatch: [
        '净重',
        '皮重时间',
        '皮重',
        '毛重时间',
        '毛重',
        '异常操作',
        '具体仓库名称'
      ],
      pos2: 0,
      pos3: 0,
      pos1: 0,
      //需要合并列的名称
      mergeList: [
        '选择',
        '序号',
        '整车操作',
        '销售订单状态',
        '销售订单号',
        '发货单位',
        '司机电话',
        '运输订单号',
        '签收地址',
        '签收时间',
        '抵达地址',
        '抵达时间',
        '出厂时间',
        '进厂时间',
        '运单状态',
        '订单实际状态',
        '车牌号',
        '承运商',
        '客户',
        '收货地址',
        '业务员',
        '送货单打印',
        '收货客户电话',
        '是否自提',
        '订单日期',
        '短信发送',
        '销售片区',
        '抵达时间',
        '签收时间',
        // '摘要',
        '排队开始时间',
        '钢材科放行时间',
        '备注',
        '订单变更时间',
        '异地库接收标志',
        '销售订单变更记录',
        '运输订单变更记录',
        '拼数',
        '是否继续装',
        '订单上传时间',
        '收款公司'
      ],
      //钢材多拼车辆线路ID
      //索引从1-10为1-10拼路线ID
      lineSpelling: [
        0,
        279973,
        279974,
        279975,
        279976,
        279977,
        279978,
        279979,
        279980,
        279981,
        279982,
        279983
      ],
      tableTitle: '销售钢材统计报表',
      //所有省
      provinceList: [],
      //选中的省
      province: '',
      //所有市
      cityList: [],
      //选中的市
      city: '',
      //所有的县(区)
      countyList: [],
      //选中的县
      county: '',
      //地址输入框的值
      addresText: '',
      //已选中省市县
      //具体地址
      //省市县Id
      addressId: null,
      addressRow: {},
      srcList: [],
      previewSrcList2: [],
      src: '',
      isShow: false,
      srcList2: [],
      previewSrcList2: [],
      isShow2: false,
      maxHeight: 700,
      //轨迹窗口
      value7: false,
      //实时路径窗口
      value8: false,
      pathOption: {
        orderNumber: '',
        capacityNumber: '',
        startPointName: '',
        endPointName: '',
        statusCode: '位置'
      },
      saleSteelKey: false,
      tableRowIndex: '',
      isRowClick: 0,
      orgCodeList: [
        'wuliuyunshubu',
        'dagangadmin',
        'zidonghuabu',
        'chengyunshang'
      ],
      isShowOperate: false,
      filterConsigneeList: [],
      filterCarrierList: [],
      filterCapacityList: [],
      filtermaterialNameList: [],
      filterorderStatusActually: [],
      filterorderStatus: [
        { text: '未派发', value: '未派发' },
        { text: '已派单', value: '已派单' },
        { text: '已接单', value: '已接单' },
        { text: '排队中', value: '排队中' },
        { text: '已完成', value: '已完成' },
        { text: '已关闭', value: '已关闭' }
      ],
      filterIsContinue: [
        { text: '是', value: '是' },
        { text: '否', value: '否' }
      ],
      filterUploadTime: [],
      filterSpellNum: [
        { text: '0', value: '0' },
        { text: '1', value: '1' },
        { text: '2', value: '2' },
        { text: '3', value: '3' },
        { text: '4', value: '4' },
        { text: '5', value: '5' },
        { text: '6', value: '6' },
        { text: '7', value: '7' },
        { text: '8', value: '8' },
        { text: '9', value: '9' }
      ],
      filteraddressPlace: [],
      filtermaterialSpe: [],
      filterSaleRemark: [],
      filterTruckRemark: [],
      filterSaleOrderStatus: [
        { text: '待审核', value: '待审核' },
        { text: '已审核', value: '已审核' }
      ],
      filterFlStatus: [
        {
          text: '关闭',
          value: '关闭'
        },
        {
          text: '正常',
          value: '正常'
        }
      ],
      filterWarehouse: [
        {
          text: '欧冶鑫宏中心库',
          value: '欧冶鑫宏中心库'
        },
        {
          text: '欧冶巨昌中心库',
          value: '欧冶巨昌中心库'
        }
      ],
      filterMap: {
        consigneeNameList: [],
        truckRemarkList: [],
        saleRemarkList: [],
        saleOrderStatusList: [],
        materialSpeList: [],
        addressPlaceList: [],
        orderStatusList: [],
        saleAreaList: [],
        materialNameList: [],
        carrierList: [],
        capacityList: [],
        orderStatusActuallyList: []
      },
      //权限控制
      notRoutList: [],
      remarkPic: false,
      remarkPicList: [],
      location: null,
      orderNumber: null,
      capacityNumber: null,
      arrivalReceiving: false,
      arriavlList: [],
      receiveList: [],
      fileListArrival: [],
      fileListReceive: [],
      dialogImageUrl: '',
      dialogVisible: false,
      isLoading: false,
      arrivalTime: null,
      receiptTime: null,
      dialogFormVisible: false,
      addresText: null,
      originalPriceValue: null,
      originalAddress: null,
      aaadrawer: false,
      downloadCapacityNo: null,
      batchCarrierList: [],
      columnNoRoutList: [],
      salerExportExcelList: [
        '订单日期',
        '客户',
        '物资名称',
        '物资规格',
        '物资件数',
        '理重',
        '净重',
        '收货地址',
        '收货客户电话',
        '摘要',
        '备注',
        '车牌号',
        '司机电话',
        '制单日期',
        '销售订单状态',
        '运单状态',
        '承运商',
        '排队开始时间',
        '钢材科放行时间',
        '进厂时间',
        '皮重时间',
        '皮重',
        '装货时间',
        '毛重时间',
        '毛重',
        '送货单打印',
        '出厂时间',
        '短信发送',
        '抵达地址',
        '抵达时间',
        '签收地址',
        '签收时间',
        '实际运价',
        '实际运费',
        '异地库接收标志',
        '运输订单号',
        '业务员',
        '发货单位',
        '是否自提',
        '销售订单号',
        '金蝶分录ID',
        '订单变更时间',
        '销售订单变更记录',
        '运输订单变更记录',
        '收款公司',
        '理论件数'
      ],
      scrollUpdateSelectFlag: 0,
      scrollLeft: 0,
      scrollLeftFlag: 0,
      isShowOperateYeWuYuan: false,
      headColumnList: [],
      columnAllData: [],
      columnHiddenData: [],
      consigneeCheckList: [],
      showPopover: false,
      schemeMap: {},
      statusNumData: [],
      oYeWarehouseList: [],
      columnShowDialog: false,
      inboundWarehouse: null
    }
  },
  created() {
    if (this.$route.query.str) {
      let filterMap = JSON.parse(this.$route.query.str)
      if (filterMap) {
        this.filterMap = filterMap
        this.startTime = filterMap.startTime
        this.endTime = filterMap.endTime
      }
    }
    this.getSteelReport = this.debounce(() => {
      this.getSteelReportDebounce()
    }, 100)
    this.orgCode = getCookie('orgCode')
    this.userId = getCookie('userId')
    if (this.orgCodeList.includes(getCookie('orgCode'))) {
      this.isShowOperate = true
    }
    if (getCookie('orgCode') == 'chengyunshang') {
      this.notRoutList = [
        'checkPoint',
        'checkTrans',
        'carrierName',
        'consigeeTel',
        'province',
        'city',
        'country',
        'place',
        'addressClick',
        'closeOrder',
        'materialNum',
        'closeEntry',
        'capacityNo',
        'batchCarrier',
        'select',
        'exceptionHandle',
        'mergeSplit',
        'saleLog',
        'batchCapacity'
      ]
      this.noticeInterval = setInterval(() => {
        this.getinformation()
      }, 1000 * 180)
    }
    this.getSteelReport()
    if (getCookie('orgCode') == 'shouhuokehu') {
      //如果是收货客户,则查询
      this.axios
        .post('/api/v1/uc/getColumnNoRoutList', {
          orgCode: getCookie('orgCode'),
          userName: getCookie('loginName'),
          tableName: '销售钢材报表'
        })
        .then(res => {
          this.columnNoRoutList = res.data
        })
      this.notRoutList = ['select']
    } else {
      this.getColumShowHideScheme()
    }
    if (getCookie('orgCode') == 'xiaoshouyewuyuan') {
      this.isShowOperateYeWuYuan = true
    }
    if (getCookie('orgCode') == 'ouyechangwaiku') {
      this.inboundWarehouse = getCookie('loginName')
    }
    //只要涉及提交即必须设计防抖,在初始化时绑定防抖函数
    this.updateCapacityDebounce = this.debounce(() => {
      this.updateCapacity()
    }, 1500)
    this.updateTruckCarrierDebounce = this.debounce(() => {
      this.updateTruckCarrier()
    }, 1500)
    this.cellMouse1 = this.debounce((row, column, cell) => {
      this.cellMouse(row, column, cell)
    }, 200)
    this.cellLeave1 = this.debounce((row, column, cell) => {
      this.cellLeave(row, column, cell)
    }, 200)
    this.exceptionHandleMakeSure = this.debounce(() => {
      this.exceptionHandleMakeSure1()
    }, 500)
    this.submitSteelDebounce = this.debounce(obj => {
      this.submitSteel(obj)
    })
  },
  watch: {
    visibleList: {
      deep: true,
      immediate: true,
      handler(val) {
        let standList = this.$store.state.saleSteelToggleIds
        this.$nextTick(() => {
          this.visibleList.forEach(e => {
            if (standList.includes(e.saleOrderMaterialId))
              this.$refs.tableRef.toggleRowSelection(e, true)
          })
        })
      }
    },
    maxHeight() {
      this.visibleList = this.tableData.slice(
        0,
        Math.floor(this.maxHeight / 30)
      )
      this.getSpanArr(this.visibleList)
      document.querySelector(
        '.el-table__body-wrapper .el-table__body'
      ).style.transform = `translateY(${0}px)`
    },
    scrollTop: {
      immediate: true,
      deep: true,
      handler(val) {
        this.$nextTick(() => {
          if (
            val >=
            this.tableData.length * 30 -
              document.querySelector('.el-table__body-wrapper').offsetHeight -
              20
          ) {
            val =
              this.tableData.length * 30 -
              document.querySelector('.el-table__body-wrapper').offsetHeight
          }
          if (val <= 0) {
            val = 0
          }
          const start = Math.floor(val / 30)
          this.visibleList = this.tableData.slice(
            start,
            start + Math.floor(this.maxHeight / 30)
          )
          this.getSpanArr(this.visibleList)
          document.querySelector(
            '.el-table__body-wrapper .el-table__body'
          ).style.transform = `translateY(${val}px)`
          this.debounceS = false
        })
      }
    },
    scrollLeft: {
      immediate: true,
      deep: true,
      handler(val) {
        this.scrollLeftFlag = 1
      }
    }
  },
  destroyed() {
    clearInterval(this.noticeInterval)
  },
  computed: {},
  mounted() {
    this.$nextTick(() => {
      const that = this
      window.onresize = () => {
        return (() => {
          console.log('我触发了表格分辨率变化的时间')
          that.$nextTick(() => {
            that.maxHeight =
              window.innerHeight -
              document.querySelector('.tableTop').offsetHeight -
              40
          })
        })()
      }
    })
    this.$refs.tableRef.bodyWrapper.addEventListener('scroll', e => {
      if (this.scrollLeftFlag == 1 && this.debounceS == true) {
        this.debounceS = false
      }
      if (this.debounceS) return
      this.debounceS = true
      this.scrollTop = e.target.scrollTop
      this.scrollLeft = e.target.scrollLeft
      this.scrollUpdateSelectFlag = 1
    })
    //基础数据查询
    this.getAllProvince()
    //欧冶仓库
    this.getOyeWarehouse()
  },
  activated() {
    this.maxHeight =
      window.innerHeight - document.querySelector('.tableTop').offsetHeight - 40
  },
  methods: {
    getOyeWarehouse() {
      this.axios
        .post(
          '/api/v1/ams/getOyeWarehouse?apiId=532&pageNum=1&pageSize=100&i=' +
            new Date()
        )
        .then(res => {
          this.oYeWarehouseList = res.data.data.list.map(item => {
            let map = {}
            map.label = item.warehouseName
            map.value = item.warehouseName
            return map
          })
          if (getCookie('orgCode') == 'chengyunshang') {
            this.oYeWarehouseList = this.oYeWarehouseList.filter(item => {
              return item.remark == JSON.parse(getCookie('userInfo')).userName
            })
          }
        })
    },
    confireInboundTo(item) {
      console.log(item, 'item')
      let flag = 1
      let arr = item.mapList.map(e => {
        let map = {}
        map.capacityId = item.capacityId
        map.capacityNumber = item.capacityNo
        map.consigneeId = e.consigneeId
        map.saleNo = item.saleOrderNo
        map.inboundWarehouse = e.inboundWarehouse
        map.inboundArea = '欧冶库'
        map.orderId = item.orderId
        map.meter = e.meter
        map.netWeight = e.inboundNetWeight
        map.materialNumber = e.materialNumber
        map.theoryWeight = e.materialThoWeight
        map.materialId = e.materialId
        map.saleMaterialId = e.saleMaterialId
        map.saleArea = e.saleRemarkByasm
        console.log(map.saleRemarkByasm, 'map.saleRemarkByasm ')
        map.userName = getCookie('loginName')
        map.isPoundSale = e.isPoundSale
        if (map.isPoundSale == 0) {
          //为0则为磅重销售，则将净重转为理重
          map.theoryWeight = e.inboundNetWeight
        }
        return map
      })
      console.log(arr, 'arr')
      this.confireInboundToWms(arr)
    },
    confireInboundToWms(data) {
      this.axios
        .post('/api/v1/wms/insertOyeOutboundResult', {
          orderId: data[0].orderId,
          mapList: data
        })
        .then(res => {
          if (res.data.status == 'succeed') {
            this.$message({
              type: 'success',
              message: res.data.data
            })
            this.confireInboundVisible = false
            this.onclick(this.filterMap)
          } else {
            this.$message({
              type: 'error',
              message: res.data.data
            })
          }
        })
    },
    confirmInbound() {
      if (Object.values(this.steelMap).length == 0) {
        this.$message.error('请点击需要执行更改操作的行！')
        return
      }
      // 将中文逗号替换为英文逗号
      if (Object.keys(this.steelMap).length > 0) {
        this.axios
          .post(
            '/api/v1/tms/getOyeSteelReportDetailsBySmId?saleOrderMaterialId=' +
              this.steelMap.saleOrderMaterialId
          )
          .then(res => {
            this.steelMap = res.data.data
            this.steelMap.userName = getCookie('loginName')
            this.confireInboundVisible = true
            this.getSpanArr1(res.data.data.mapList)
          })
      }
    },
    openBlank() {
      let page = this.$router.resolve({
        name: 'saleSteelReports',
        query: { id: 0, e: 0 },
        meta: {
          title: '销售钢材报表'
        }
      })
      window.open(page.href, '_blank')
    },
    getColumShowHideScheme() {
      this.axios
        .post('/api/v1/uc/getColumShowHideScheme', {
          userName: getCookie('loginName'),
          orgCode: getCookie('orgCode'),
          tableName: '销售钢材报表'
        })
        .then(res => {
          this.schemeMap = res.data.data
          this.columnNoRoutList = this.schemeMap.columnHiddenData
        })
        .catch(() => {
          this.columnNoRoutList = []
        })
    },
    columnShowTabClick(e) {
      this.schemeMap.activeName = e.paneName
    },
    //动态渲染列的显示方案
    handleTabsEdit(targetName, action) {
      if (action === 'add') {
        this.$confirm('请输入方案名称', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'info',
          showInput: true,
          center: true
        })
          .then(mes => {
            let newTabName = mes.value
            this.schemeMap.schemeList.push({
              title: newTabName,
              name: newTabName,
              columnAllData: this.schemeMap.columnAllData,
              columnHiddenData: []
            })
            this.schemeMap.activeName = newTabName
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '用户取消操作'
            })
          })
      }
      if (action === 'remove') {
        let map = {}
        map.columnHiddenData = []
        map.name = targetName || this.schemeMap.activeName
        this.columnShowOperation(map)
      }
    },
    //动态渲染表头
    renderHeader(h, { column }) {
      let renderColumnFilterList = []
      let filterVal = ''
      let optionList = []
      if (column.label === '客户') {
        filterVal = 'consigneeNameList'
        renderColumnFilterList = this.filterConsigneeList
      } else if (column.label === '车牌号') {
        filterVal = 'capacityList'
        renderColumnFilterList = this.filterCapacityList
      } else if (column.label === '收货地址') {
        filterVal = 'addressPlaceList'
        renderColumnFilterList = this.filteraddressPlace
      } else if (column.label === '摘要') {
        filterVal = 'saleRemarkList'
        renderColumnFilterList = this.filterSaleRemark
      } else if (column.label === '备注') {
        filterVal = 'truckRemarkList'
        renderColumnFilterList = this.filterTruckRemark
      } else if (column.label === '物资名称') {
        filterVal = 'materialNameList'
        renderColumnFilterList = this.filtermaterialNameList
      } else if (column.label === '物资规格') {
        filterVal = 'materialSpeList'
        renderColumnFilterList = this.filtermaterialSpe
      }
      if (filterVal == '') {
        return h('div', column.label, {})
      }
      return h(
        'div',
        {
          style: {
            height: 'auto',
            color: this.filterMap[filterVal].length > 0 ? '#409EFF' : '#ffff',
            fontWeight: this.filterMap[filterVal].length > 0 ? '700' : '400',
            fontSize: '12px'
          }
        },
        [
          h(
            'el-popover',
            {
              props: {
                placement: 'bottom',
                trigger: 'click',
                value: this.showPopover
              },
              style: {
                width: 'auto'
              },
              on: {
                show: _ => {
                  this.$nextTick(() => {
                    this.$refs.filterSelectRef.focus()
                  })
                }
              }
            },
            [
              h('span', {
                slot: 'reference',
                style: 'margin-top:20px',
                domProps: {
                  innerHTML:
                    column.label + '  ' + '<i class="el-icon-search""/>'
                }
              }),
              this.$createElement(
                'el-select',
                {
                  ref: `filterSelectRef`,
                  style: {
                    'margin-bottom': '10px',
                    'border-bottom': '1px solid #efefef',
                    'padding-bottom': '10px',
                    width: '250px'
                  },
                  props: {
                    placeholder: '请输入查询',
                    reserveKeyword: true,
                    filterable: true,
                    filterMethod: e => {
                      this.filterMethodChange(
                        e,
                        filterVal,
                        renderColumnFilterList
                      )
                    },
                    multiple: true,
                    collapseTags: true,
                    value: this.filterMap[filterVal]
                  },
                  on: {
                    change: val => {
                      if (val) {
                        this.filterMap[filterVal] = [...new Set(val)]
                      } else {
                        let i = this.filterMap[filterVal].findIndex(
                          row => row == val
                        )
                        this.filterMap[filterVal].splice(i, 1)
                      }
                    }
                  }
                },
                [
                  renderColumnFilterList.map((item, index) => {
                    return h('el-option', {
                      props: {
                        label: item.text,
                        value: item.text,
                        key: item.text
                      }
                    })
                  })
                ]
              ),
              h('el-button', {
                props: {
                  size: 'mini'
                },
                on: {
                  click: e => {
                    this.filterMap[filterVal] = []
                    this.onclick(this.filterMap)
                  }
                },
                domProps: {
                  innerHTML: '重置'
                }
              }),
              h('el-button', {
                props: {
                  size: 'mini',
                  type: 'primary'
                },
                on: {
                  click: _ => {
                    this.onclick(this.filterMap)
                  }
                },
                domProps: {
                  innerHTML: '筛选'
                }
              })
            ]
          )
        ]
      )
    },
    filterMethodChange(e, filterVal, renderColumnFilterList) {
      this.filterMap[filterVal] = [e]
    },
    ctrlColumnShow() {
      this.columnShowDialog = true
    },
    columnShowOperation(item) {
      this.axios
        .post('/api/v1/uc/updateColumnShowHidden', {
          userName: getCookie('loginName'),
          orgCode: getCookie('orgCode'),
          tableName: '销售钢材报表',
          columnHiddenData: item.columnHiddenData,
          schemeName: item.name
        })
        .then(res => {
          this.$message({
            type: 'success',
            message: '切换成功',
            offset: '250'
          })
          this.$router.go(0)
        })
      this.columnShowDialog = false
    },
    headCellStyle({ row, column, rowIndex, columnIndex }) {
      // console.log(row, 'row')
      // console.log('headCellStyle column.property: ', column.property)
      if (column.property && this.headColumnList.includes(column.property)) {
        return { fontWeight: 700, fontSize: '15px' }
        //return {}
      }
      return {}
    },
    clearFilter() {
      this.$refs.tableRef.clearFilter()
      this.headColumnList = []
      this.filterMap = {
        consigneeNameList: [],
        truckRemarkList: [],
        saleRemarkList: [],
        saleOrderStatusList: [],
        materialSpeList: [],
        addressPlaceList: [],
        orderStatusList: [],
        saleAreaList: [],
        materialNameList: [],
        carrierList: [],
        capacityList: [],
        isContinueList: [],
        spellNumList: []
      }
      this.onclick(this.filterMap)
    },
    submitSteel(obj) {
      this.$confirm('该操作会修改全部改动的内容,请确认核实后点击!', '提醒', {
        cancelButtonText: '取消',
        confirmButtonText: '确认',
        center: true
      }).then(() => {
        let map = obj
        map.userName = getCookie('loginName')
        map.shipperAddressId = this.addressId
        this.axios.post('/api/v1/uc/submitSteel', this.steelMap).then(res => {
          let _this = this
          if (res.data.responseMapFailed.length > 0) {
            let responseFailTitle = res.data.responseMapFailed.join(';')
            this.$message({
              type: 'error',
              duration: 2500,
              offset: '250',
              message: responseFailTitle
            })
          }
          if (res.data.response.length == 0) {
            setTimeout(() => {
              _this.$message({
                type: 'success',
                duration: 1500,
                offset: '250',
                message: '未发现任何修改成功的记录!'
              })
            }, 2500)
          } else {
            let responseTitle = res.data.response.join(';')
            setTimeout(() => {
              _this.$message({
                type: 'success',
                duration: 2500,
                offset: '250',
                message: responseTitle
              })
            }, 2500)
          }
          this.operation(this.steelMap)
          this.onclick(this.filterMap)
        })
      })
    },
    resetPrintNumber() {
      this.axios
        .post('/api/v1/bp/resetPrintNumber', this.steelMap)
        .then(res => {
          if (res.data.status == 'succeed') {
            this.$message.success('重置成功！')
          } else {
            this.$message.error('重置失败！')
          }
        })
    },
    showBatchCapacity() {
      this.capacityNo = null
      this.capacityId = null
      this.batchCapacityList = []
      console.log(this.$refs.tableRef.selection)
      //按照saleOrderMaterialId查询物资数量size,用于确定派车的线路ID
      this.$refs.tableRef.selection.forEach(item1 => {
        item1.size = this.visibleList.filter(item2 => {
          return item1.saleOrderMaterialId == item2.saleOrderMaterialId
        }).length
      })
      this.batchCapacityList = this.$refs.tableRef.selection
      console.log(this.batchCapacityList)
      // if (this.batchCapacityList.length > 0) {
      //   this.batchCapacityVisible = true
      // } else {
      //   this.$message({
      //     type: 'warning',
      //     message: '请选择要批量更改车牌号的订单',
      //     offset: '250',
      //     duration: '2500'
      //   })
      // }
    },
    batchCapacitySelect(selection) {
      this.capacityNo = selection.capacityNumber
      this.capacityId = selection.capacityId
    },
    //批量修改车牌号
    batchEditCapacity() {
      if (this.capacityId && this.capacityNo) {
        if (
          !(
            isVehicleNumber(this.capacityNo) ||
            this.capacityNo == '取消' ||
            this.capacityNo == '待定' ||
            this.capacityNo == '空白'
          )
        ) {
          this.$message.error('请输入正确格式的车牌号!')
          return
        }
        console.log('this.batchCapacityList', this.batchCapacityList)
        this.batchCapacityList.forEach(row => {
          row.capacityId = this.capacityId
          row.capacityNumber = this.capacityNo
          row.capacityNo = this.capacityNo
          //是否校验GPS
          row.isCheckGPS = this.isCheckGPS
          row.userId = getCookie('userId')
          if (row.carrierIds == 0) {
            this.$message.error('请先授权承运商！')
            return
          }
          if (row.capacityIds == 0) {
            row.lineId = this.lineSpelling[row.size]
          }
        })
        let map = {
          list: this.batchCapacityList
        }
        this.axios.post('/api/v1/ams/batchUpdateCapacity', map).then(res => {
          if (res.data.code == '200') {
            this.$message.success('派车成功!')
          } else {
            this.$message.error(res.data.data)
          }
        })
        this.batchCarrierVisible = false
        this.onclick(this.filterMap)
      } else {
        this.$message.warning('请先注册车牌号或者选中弹出后再提交!')
      }
    },
    showSaleLog() {
      this.isShowSaleLog = true
      if (this.steelMap) {
        this.optionSaleLog.requestQuery.con = this.steelMap.orderNo
      }
    },
    //删除计量实绩
    linkageDeleteTransportOrder(row, steelMap) {
      console.log(row, 'row')
      debugger
      if (row.netWeight != null && row.netWeight != '') {
        //如果净重不为空
        let arr = []
        let map = {
          orderNumber: row.orderNo,
          good: row.materialName,
          goodspa: `${row.materialSpecification}(${row.materialModel})`,
          resultCrossWeightTime: row.grossWeightTime,
          saleMaterialId: row.saleMaterialId,
          weightBatchId: row.weightBatchId,
          userName: getCookie('loginName')
        }
        arr.push(map)
        this.axios
          .post('/api/v1/uc/linkageDeleteTransportOrder', arr)
          .then(res => {
            this.$message({
              message: '删除计量实绩成功',
              type: 'success',
              offset: '250',
              duration: '2500'
            })
            this.exceptionHandleVisible = false
            this.onclick(this.filterMap)
          })
      }
    },
    mergeSplit() {
      if (this.$refs.tableRef.selection.length == 1) {
        this.$confirm(
          `尊敬的用户${getCookie(
            'loginName'
          )},系统温馨提示您进行拆分操作前,请确认所拆分的订单将不会在金蝶进行提交,审核等操作!`,
          '提醒',
          {
            confirmButtonText: '我已确认',
            cancelButtonText: '我再想想',
            center: true,
            type: 'warning'
          }
        )
          .then(() => {
            this.splitOrder()
          })
          .catch(() => {
            this.$message({
              type: 'info',
              duration: '2500',
              message: '操作取消',
              offset: '250'
            })
          })
      } else if (this.$refs.tableRef.selection.length > 1) {
        this.$confirm(
          `尊敬的用户${getCookie(
            'loginName'
          )},系统温馨提示您进行合并操作前,请确认所合并的订单将不会在金蝶进行提交,审核等操作!`,
          '提醒',
          {
            confirmButtonText: '我已确认',
            cancelButtonText: '我再想想',
            center: true,
            type: 'warning'
          }
        )
          .then(() => {
            this.mergeOrder()
          })
          .catch(() => {
            this.$message({
              type: 'info',
              duration: '2500',
              message: '操作取消',
              offset: '250'
            })
          })
      } else {
        this.$message({
          type: 'warning',
          message: '请勾选/点击需要操作的行',
          offset: '250',
          duration: '2300'
        })
      }
    },
    splitOrder() {
      this.$confirm(
        `勾选了${this.$refs.tableRef.selection.length}条运单将执行拆分操作`,
        '提醒',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          center: true
        }
      )
        .then(() => {
          let mapList = this.$refs.tableRef.selection.map(e => {
            let map = {}
            map.saleOrderMaterialId = e.saleOrderMaterialId
            return map
          })
          let map = {
            mapList: mapList,
            userName: getCookie('loginName')
          }
          this.axios
            .post('/api/v1/ams/splitOrder', map)
            .then(res => {
              if (res.data.code == '200') {
                this.onclick(this.filterMap)
                this.$message({
                  type: 'success',
                  message: '拆分成功',
                  offset: '250',
                  duration: '2500'
                })
              } else {
                this.$message({
                  type: 'error',
                  message: res.data.data,
                  offset: '250',
                  duration: '2500'
                })
              }
            })
            .catch(() => {
              this.$message({
                type: 'error',
                message: '拆分失败',
                offset: '250',
                duration: '2500'
              })
            })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            duration: '2500',
            message: '操作取消',
            offset: '250'
          })
        })
    },
    mergeOrder() {
      this.$confirm(
        `勾选了${this.$refs.tableRef.selection.length}条运单将执行合并操作,此操作不可逆!`,
        '提醒',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          center: true
        }
      )
        .then(() => {
          let mapList = this.$refs.tableRef.selection.map(e => {
            let map = {}
            map.saleOrderMaterialId = e.saleOrderMaterialId
            map.orderId = e.orderId
            map.saleOrderId = e.saleOrderId
            map.orderNo = e.orderNo
            map.capacityNo = e.capacityNo
            map.userName = getCookie('loginName')
            return map
          })
          let map = {
            mapList: mapList,
            userName: getCookie('loginName')
          }
          this.axios
            .post('/api/v1/ams/mergeOrder', map)
            .then(res => {
              if (res.data.code == '200') {
                this.onclick(this.filterMap)
                this.$message({
                  type: 'success',
                  message: '合并成功,请提醒驾驶员!',
                  offset: '250',
                  duration: '3000'
                })
              } else {
                this.$message({
                  type: 'error',
                  message: res.data.data,
                  offset: '250',
                  duration: '2500'
                })
              }
            })
            .catch(() => {
              this.$message({
                type: 'error',
                message: '合并失败',
                offset: '250',
                duration: '2500'
              })
            })
        })
        .catch(() => {
          this.$message({
            type: 'info',
            duration: '2500',
            message: '操作取消',
            offset: '250'
          })
        })
    },
    //获取通知数量
    getinformation() {
      this.axios
        .post('/api/v1/ams/getNoticeAll', { userId: this.userId })
        .then(res => {
          let taskAllNum = 0
          res.data.data.forEach(e => {
            if (e.insertusername == '销售审核' && e.status == 0) {
              taskAllNum++
            }
          })
          this.taskAllNum = taskAllNum
          console.log('未接收数目：', this.taskAllNum)
        })
    },
    readAll() {
      this.axios
        .post('/api/v1/ams/readAll', {
          userId: this.userId,
          insertUserName: '销售审核'
        })
        .then(res => {
          this.taskAllNum = 0
        })
    },
    deleteRow(index, rows) {
      if (rows.length > 1) {
        rows.splice(index, 1)
      }
    },
    copyRowflu(index, row) {
      console.log(index)
      let copyRowflu = new Object()
      Object.keys(row).forEach(key => {
        copyRowflu[key] = row[key]
      })
      delete copyRowflu.materialId
      delete copyRowflu.netWeight
      delete copyRowflu.grossWeight
      delete copyRowflu.grossWeightTime
      delete copyRowflu.tareWeight
      delete copyRowflu.tareWeightTime
      delete copyRowflu.loadTime
      delete copyRowflu.closeEntryId
      this.steelMap.mapList.splice(index + 1, 0, copyRowflu)
    },
    exceptionHandleMakeSure1() {
      console.log(this.steelMap)
      this.$confirm(
        `该操作会将${this.steelMap.capacityNo}下未出净重的分录关闭,并重新上传金蝶,确认操作?`,
        '提示',
        {
          cancelButtonText: '取消',
          confirmButtonText: '确定',
          center: true
        }
      )
        .then(() => {
          let saleDateOfReceipt = null
          let loadTime1 = new Date(
            new Date(new Date().toLocaleDateString()).getTime() +
              (3600 * 1000 * 8 - 1)
          ) // 当天8点前
          let loadTime2 = new Date(
            new Date(new Date().toLocaleDateString()).getTime() +
              (3600 * 1000 * 32 - 1)
          ) // 次天8点前
          if (new Date().getTime() - loadTime1 > 0) {
            saleDateOfReceipt = loadTime2
          } else {
            saleDateOfReceipt = loadTime1
          }
          let closeEntryList = []
          let map = this.steelMap
          map.mapList.forEach(e => {
            let map = {}
            e.saleDateOfReceipt = sjTime(saleDateOfReceipt)
            map.saleMaterialId = e.saleMaterialId
            map.closeEntryId = e.closeEntryId
            map.number = e.saleOrderNo
            closeEntryList.push(map)
          })
          let mapList = map.mapList.filter(e => {
            if (typeof e.netWeight == 'undefined' || e.netWeight == null) {
              return e
            }
          })
          if (mapList.length == 0) {
            this.$message({
              type: 'info',
              message: '所有分录包含净重,退出!',
              offset: '250',
              duration: '2500'
            })
            return
          }
          map.mapList = mapList
          map.isUploadEas = 1
          this.axios
            .post('/api/v1/ams/addSteelSaleOrder', map, {
              timeout: 3 * 60 * 1000
            })
            .then(res => {
              if (res.data.code == '200') {
                this.axios
                  .post('/api/v1/ams/closingEntries', closeEntryList, {
                    timeout: 3 * 60 * 1000
                  })
                  .then(res => {
                    if (res.data.code == '200') {
                      this.onclick(this.filterMap)
                      this.$message({
                        type: 'success',
                        offset: '250',
                        message: '生成订单成功,关闭分录成功',
                        duration: 2000
                      })
                      this.exceptionHandleVisible = false
                    }
                  })
                  .catch(e => {})
              } else {
                this.$message({
                  type: 'error',
                  offset: '250',
                  duration: '2500',
                  message: '新增失败'
                })
              }
            })
        })
        .catch(e => {
          this.$message({
            type: 'info',
            message: '取消操作',
            offset: '200',
            duration: 2500
          })
        })
    },
    exceptionHandle() {
      if (this.$refs.tableRef.selection.length == 1) {
        console.log(this.$refs.tableRef.selection[0])
        this.axios
          .post(
            '/api/v1/tms/getOyeSteelReportDetailsBySmId?saleOrderMaterialId=' +
              this.$refs.tableRef.selection[0].saleOrderMaterialId
          )
          .then(res => {
            this.steelMap = res.data.data
            this.exceptionHandleVisible = true
            this.getSpanArr1(this.steelMap.mapList)
          })
      } else {
        this.$message({
          message: '异常处理单次仅能勾选一辆车',
          offset: '250',
          duration: '2500',
          type: 'warning'
        })
      }
    },
    batchCarrierMakeSure() {
      let batchCarrierId = null
      this.carrierList.forEach(item => {
        if (item.carrierName == this.batchCarrierName) {
          batchCarrierId = item.carrierId
        }
      })
      this.batchCarrierList.forEach(e => {
        e.carrierId = batchCarrierId
      })
      const loading = this.$loading({
        lock: true,
        text: '正在批量授权承运商',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.axios
        .post('/api/v1/ams/dispatchToCarrier', this.batchCarrierList)
        .then(res => {
          if (res.data.code == '0') {
            this.$message.success('授权承运商成功')
            this.batchCarrierList = []
            this.batchCarrierVisible = false
            this.batchCarrierName = null
            this.onclick(this.filterMap)
            loading.close()
          } else {
            this.$message.error('授权失败,请联系管理员')
            this.batchCarrierList = []
            this.batchCarrierVisible = false
            this.batchCarrierName = null
            this.onclick(this.filterMap)
            loading.close()
          }
        })
        .catch(() => {
          this.$message.error('授权失败,请联系管理员')
          this.batchCarrierList = []
          this.batchCarrierVisible = false
          this.onclick(this.filterMap)
          loading.close()
        })
    },
    batchCarrier() {
      if (this.batchCarrierList.length > 0) {
        this.batchCarrierVisible = true
        this.showBatchCapacity()
        this.onchangeProvince()
        this.onchangeCity()
        this.addressId = this.steelMap.shipperAddressId
        this.consigneeTel = this.steelMap.consigneeTel
      } else {
        this.$message({
          type: 'warning',
          message: '请选择要批量授权的订单',
          offset: '250',
          duration: '2500'
        })
      }
    },
    selectOne(selection, row) {
      console.log('selection:', row)
      this.rowClick(row)
    },
    handleSelectionChange() {
      console.log(this.$refs.tableRef.selection, 'selection')
      this.batchCarrierList = []
      this.batchCarrierList = this.$refs.tableRef.selection.map(e => {
        let map = {}
        map.saleOrderMaterialId = e.saleOrderMaterialId
        return map
      })
      console.log(this.scrollUpdateSelectFlag)
      if (this.scrollUpdateSelectFlag == 0) {
        let arr = []
        arr = Array.from(
          this.$refs.tableRef.selection.map(e => {
            return e.saleOrderMaterialId
          })
        )
        let [...arr2] = arr
        this.toggleRowIds = arr2
        this.$store.commit('updateSaleSteelToggleIds', {
          saleSteelToggleIds: arr
        })
      }
    },
    receiveClick(src, title) {
      // this.dialogImageUrl = src
      downloadFile(src, `${this.downloadCapacityNo}${title}照片`, 'jpg')
      // this.dialogVisible = true
    },
    openRemarkPic() {
      //获取图片到本地
      this.axios.post('/api/v1/uc/getPicture', this.steelMap).then(res => {
        console.log(res)
        if (res.data) {
          let remarkPicList = []
          res.data.forEach((e, index) => {
            creatImageFile(e, 'file2-' + index).then(res => {
              remarkPicList.push({
                name: 'file' + index,
                raw: res,
                url: e
              })
            })
          })
          this.remarkPicList = remarkPicList
        } else {
          this.remarkPicList = []
        }
        this.remarkPic = true
      })
    },
    uploadRemarkPic() {
      if (this.remarkPicList.length <= 0) {
        this.$message.error('请上传图片！')
        return
      }
      //上传备注图片
      let formData = new window.FormData()
      this.remarkPicList.forEach((item, index) => {
        formData.append('file' + index, item.raw)
      })
      let options = {
        url: '/api/v1/uc/uploadPic',
        data: formData,
        method: 'post',
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }
      this.axios(options).then(res => {
        console.log(res)
        this.$message.success('暂存成功！')
        this.remarkPic = false
        this.steelMap.urls = res.data
        this.closeUpload2()
      })
    },
    closeUpload2() {
      this.remarkPic = false
      this.isLoading = false
      this.$refs.remarkPic.clearFiles()
    },
    openReceive() {
      this.fileListArrival = []
      this.fileListReceive = []
      if (Object.values(this.steelMap).length == 0) {
        this.$message.warning('请选择需要补录的实绩')
        return
      }
      let row = this.steelMap
      if (!row.outGateTime) {
        this.$message.warning('该车未出厂，不允许签收')
        return
      }
      if (row.arrivalAddress) {
        //优先获取抵达地址
        this.location = row.arrivalAddress
      } else {
        //其次获取车辆定位
        this.axios
          .get(
            '/api/v1/otms/getCurrentLocation?capcityNumber=' + row.newCapacityNo
          )
          .then(res => {
            if (
              res.data.status == 'succeed' &&
              res.data.data.result.status != 1001
            ) {
              this.location = res.data.data.result.adr
            } else {
              this.location = null
              this.$message.warning('获取不到车辆定位！请联系销售公司上传！')
            }
          })
      }
      this.orderNumber = row.orderNo
      this.capacityNumber = row.capacityNo
      this.arrivalTime = row.arrivalTime
      this.receiptTime = row.receiptTime
      this.arrivalReceiving = true
      //抵达图片
      this.axios
        .post('/api/v1/otms/getArrivalPhoto?orderNumber=' + row.orderNo)
        .then(res => {
          console.log('arrivalPhoto:', res)
          if (res.data) {
            this.arriavlList = []
            res.data.forEach((e, index) => {
              creatImageFile(e, 'file1-' + index).then(res => {
                this.arriavlList.push({
                  name: 'file' + index,
                  raw: res,
                  url: e
                })
              })
            })
            this.fileListArrival = this.arriavlList
          }
        })
      //签收图片
      this.axios
        .post('/api/v1/otms/getReceivingPhotoByUrl?orderNumber=' + row.orderNo)
        .then(res => {
          if (res.data) {
            this.receiveList = []
            res.data.forEach((e, index) => {
              creatImageFile(e, 'file2-' + index).then(res => {
                this.receiveList.push({
                  name: 'file' + index,
                  raw: res,
                  url: e
                })
              })
            })
            this.fileListReceive = this.receiveList
          }
        })
    },
    arrivalAndReceive() {
      console.log(this.fileListReceive, 'fileListReceive')
      if (!this.location) {
        this.$message.warning(
          '签收地址必须取车辆定位！若取不到请联系销售公司上传！'
        )
        return
      }
      if (this.fileListArrival.length < 3) {
        this.$message.warning('抵达图至少三张')
        return
      }
      if (this.fileListReceive.length < 2) {
        this.$message.warning('签收图最少两张')
        return
      }
      this.isLoading = true
      //上传抵达
      let formData = new window.FormData()
      this.fileListArrival.forEach((item, index) => {
        formData.append('file' + index, item.raw)
      })
      formData.append('orderNumber', this.orderNumber)
      formData.append('resultArrivalAddress', this.location)
      if (this.arrivalTime) {
        formData.append('arrivalTime', sjTime(this.arrivalTime))
      }
      formData.append('userName', getCookie('loginName'))
      let options = {
        // 设置axios的参数
        url: '/api/v1/otms/addtmstruckArrivalResult',
        data: formData,
        method: 'post',
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }
      this.axios(options).then(res => {
        this.fileListArrival = []
        console.log('arrivalRes:', res)
        //上传签收
        let formData = new window.FormData()
        let request = ''
        this.fileListReceive.forEach((item, index) => {
          formData.append('file' + index, item.raw)
        })
        formData.append('orderNumber', this.orderNumber)
        formData.append('resultArrivalAddress', this.location)
        if (this.receiptTime) {
          formData.append('receiptTime', sjTime(this.receiptTime))
        }
        formData.append('num', request.length)
        let options = {
          url: '/api/v1/otms/addTmstruckReceiptResultForWeb',
          data: formData,
          method: 'post',
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }
        this.axios(options).then(res => {
          console.log('receiveRes:', res)
          this.$message.success('上传成功！')
          this.steelMap.arrivalAddress = this.location
          this.closeUpload()
          this.refresh()
          this.tableRowIndex = ''
          this.fileListReceive = []
        })
      })
    },
    fileChange1(file, fileList) {
      this.fileListArrival = fileList
    },
    fileChange2(file, fileList) {
      this.fileListReceive = fileList
    },
    fileChange3(file, fileList) {
      this.remarkPicList = fileList
    },
    exceed() {
      this.$message.warning('超出上传数量!')
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    closeUpload() {
      this.location = null
      this.arrivalTime = null
      this.receiptTime = null
      this.arrivalReceiving = false
      this.isLoading = false
      this.$refs.arrival.clearFiles()
      this.$refs.receive.clearFiles()
    },
    //防抖函数--防止用户重复点击
    debounce(func, delay) {
      let timer = null
      return function(...args) {
        if (timer !== null) {
          clearTimeout(timer)
        }
        timer = setTimeout(function() {
          func.apply(this, args)
        }, delay)
      }
    },
    //筛选
    filterChange(obj) {
      //承运商筛选,后续有待优化
      console.log(obj, 'filterChange obj', arguments)
      if (typeof obj.carrierList != 'undefined' && obj.carrierList.length > 0) {
        this.headColumnList.push('carrierName')
        this.filterMap.carrierList = obj.carrierList
      }
      if (
        typeof obj.carrierList != 'undefined' &&
        obj.carrierList.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('carrierName'),
          1
        )
        delete this.filterMap.carrierList
      }
      //物资名称筛选,后续有待优化
      if (
        typeof obj.materialNameList != 'undefined' &&
        obj.materialNameList.length > 0
      ) {
        this.headColumnList.push('materialName')
        this.filterMap.materialNameList = obj.materialNameList
      }
      if (
        typeof obj.materialNameList != 'undefined' &&
        obj.materialNameList.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('materialName'),
          1
        )
        delete this.filterMap.materialNameList
      }
      //车牌号筛选,后续有待优化
      if (typeof obj.capacityNo != 'undefined' && obj.capacityNo.length > 0) {
        this.filterMap.capacityList = obj.capacityNo
        this.headColumnList.push('capacityNo')
      }
      if (typeof obj.capacityNo != 'undefined' && obj.capacityNo.length == 0) {
        this.headColumnList.splice(this.headColumnList.indexOf('capacityNo'), 1)
        delete this.filterMap.capacityList
      }
      //客户筛选,后续有待优化
      if (
        typeof obj.consigneeName != 'undefined' &&
        obj.consigneeName.length > 0
      ) {
        this.headColumnList.push('consigneeName')
        this.filterMap.consigneeNameList = obj.consigneeName
      }
      if (
        typeof obj.consigneeName != 'undefined' &&
        obj.consigneeName.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('consigneeName'),
          1
        )
        delete this.filterMap.consigneeNameList
      }
      //销售片区筛选,后续有待优化
      if (
        typeof obj.saleAreaList != 'undefined' &&
        obj.saleAreaList.length > 0
      ) {
        this.filterMap.saleAreaList = obj.saleAreaList
      }
      if (
        typeof obj.saleAreaList != 'undefined' &&
        obj.saleAreaList.length == 0
      ) {
        delete this.filterMap.saleAreaList
      }
      //物资规格筛选
      if (typeof obj.materialSpe != 'undefined' && obj.materialSpe.length > 0) {
        this.headColumnList.push('materialSpe')
        this.filterMap.materialSpeList = obj.materialSpe
      }
      if (
        typeof obj.materialSpe != 'undefined' &&
        obj.materialSpe.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('materialSpe'),
          1
        )
        delete this.filterMap.materialSpeList
      }
      //收货地址筛选
      if (
        typeof obj.addressPlace != 'undefined' &&
        obj.addressPlace.length > 0
      ) {
        this.headColumnList.push('addressPlace')
        this.filterMap.addressPlaceList = obj.addressPlace
      }
      if (
        typeof obj.addressPlace != 'undefined' &&
        obj.addressPlace.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('addressPlace'),
          1
        )
        delete this.filterMap.addressPlaceList
      }
      if (typeof obj.orderStatus != 'undefined' && obj.orderStatus.length > 0) {
        this.headColumnList.push('orderStatus')
        // this.reset()
        this.filterMap.orderStatusList = obj.orderStatus
      }
      if (
        typeof obj.orderStatus != 'undefined' &&
        obj.orderStatus.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('orderStatus'),
          1
        )
        delete this.filterMap.orderStatusList
      }
      if (
        typeof obj.saleOrderStatus != 'undefined' &&
        obj.saleOrderStatus.length > 0
      ) {
        this.headColumnList.push('saleOrderStatus')
        this.filterMap.saleOrderStatusList = obj.saleOrderStatus
      }
      if (
        typeof obj.saleOrderStatus != 'undefined' &&
        obj.saleOrderStatus.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('saleOrderStatus'),
          1
        )
        delete this.filterMap.saleOrderStatusList
      }
      if (typeof obj.saleRemark != 'undefined' && obj.saleRemark.length > 0) {
        this.headColumnList.push('saleRemark')
        this.filterMap.saleRemarkList = obj.saleRemark
      }
      if (typeof obj.saleRemark != 'undefined' && obj.saleRemark.length == 0) {
        this.headColumnList.splice(this.headColumnList.indexOf('saleRemark'), 1)
        delete this.filterMap.saleRemarkList
      }
      if (typeof obj.truckRemark != 'undefined' && obj.truckRemark.length > 0) {
        this.headColumnList.push('truckRemark')
        this.filterMap.truckRemarkList = obj.truckRemark
      }
      if (
        typeof obj.truckRemark != 'undefined' &&
        obj.truckRemark.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('truckRemark'),
          1
        )
        delete this.filterMap.truckRemarkList
      }
      if (typeof obj.isContinue != 'undefined' && obj.isContinue.length > 0) {
        this.headColumnList.push('isContinue')
        this.filterMap.isContinueList = obj.isContinue
      }
      if (typeof obj.isContinue != 'undefined' && obj.isContinue.length == 0) {
        this.headColumnList.splice(this.headColumnList.indexOf('isContinue'), 1)
        delete this.filterMap.isContinueList
      }
      if (typeof obj.spellNum != 'undefined' && obj.spellNum.length > 0) {
        this.headColumnList.push('spellNum')
        this.filterMap.spellNumList = obj.spellNum
      }
      if (typeof obj.spellNum != 'undefined' && obj.spellNum.length == 0) {
        this.headColumnList.splice(this.headColumnList.indexOf('spellNum'), 1)
        delete this.filterMap.spellNumList
      }
      if (typeof obj.flStatus != 'undefined' && obj.flStatus.length > 0) {
        this.headColumnList.push('flStatus')
        this.filterMap.flStatusList = obj.flStatus
      }
      if (typeof obj.flStatus != 'undefined' && obj.flStatus.length == 0) {
        this.headColumnList.splice(this.headColumnList.indexOf('flStatus'), 1)
        delete this.filterMap.flStatusList
      }
      if (
        typeof obj.orderStatusActually != 'undefined' &&
        obj.orderStatusActually.length > 0
      ) {
        this.headColumnList.push('orderStatusActually')
        this.filterMap.orderStatusActuallyList = obj.orderStatusActually
      }
      if (
        typeof obj.orderStatusActually != 'undefined' &&
        obj.orderStatusActually.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('orderStatusActually'),
          1
        )
        delete this.filterMap.orderStatusActuallyList
      }
      if (
        typeof obj.inventoryWarehouse != 'undefined' &&
        obj.inventoryWarehouse.length > 0
      ) {
        this.headColumnList.push('inventoryWarehouse')
        this.filterMap.inventoryWarehouseList = obj.inventoryWarehouse
      }
      if (
        typeof obj.inventoryWarehouse != 'undefined' &&
        obj.inventoryWarehouse.length == 0
      ) {
        this.headColumnList.splice(
          this.headColumnList.indexOf('inventoryWarehouse'),
          1
        )
        delete this.filterMap.inventoryWarehouseList
      }
      // if (obj)
      this.onclick(this.filterMap)
    },
    //控制筛选数组变化
    // filterListChange() {
    //   //客户筛选数组
    //   // let consigneeNameList = this.tableData
    //   //   .map(e => {
    //   //     return e.consigneeName
    //   //   })
    //   //   .sort()
    //   //承运商筛选数组
    //   // let carrierNameList = this.tableData
    //   //   .map(e => {
    //   //     return e.carrierName
    //   //   })
    //   //   .sort()
    //   //车牌号筛选数组
    //   // let capacityList = this.tableData
    //   //   .map(e => {
    //   //     return e.newCapacityNo
    //   //   })
    //   //   .sort()
    //   //物资筛选数组
    //   // let materialNameList = this.tableData
    //   //   .map(e => {
    //   //     return e.materialName
    //   //   })
    //   //   .filter(e => {
    //   //     return e != null
    //   //   })
    //   //   .sort()
    //   //销售片区筛选数组
    //   let saleAreaList = this.tableData
    //     .map(e => {
    //       return e.areaName
    //     })
    //     .filter(e => {
    //       return e != null
    //     })
    //   let addressPlaceList = this.tableData
    //     .map(e => {
    //       return e.addressPlace
    //     })
    //     .filter(e => {
    //       return e != null
    //     })
    //     .sort()
    //   let orderStatusList = this.tableData
    //     .map(e => {
    //       return e.orderStatus
    //     })
    //     .filter(e => {
    //       return e != null
    //     })
    //   let materialSpeList = this.tableData
    //     .map(e => {
    //       return e.materialSpe
    //     })
    //     .filter(e => {
    //       return e != null
    //     })
    //     .sort()
    //   let saleOrderStatusList = this.tableData.map(e => {
    //     return e.saleOrderStatus
    //   })
    //   let saleRemarkList = this.tableData
    //     .map(e => {
    //       return e.saleRemark
    //     })
    //     .sort()
    //   // this.filterConsigneeList = []
    //   // this.filterCarrierList = []
    //   // this.filterCapacityList = []
    //   // this.filtermaterialNameList = []
    //   this.filterSaleAreaList = []
    //   this.filterorderStatus = []
    //   this.filteraddressPlace = []
    //   this.filtermaterialSpe = []
    //   this.filterSaleOrderStatus = []
    //   this.filterSaleRemark = []
    //   // Array.from(new Set(consigneeNameList)).forEach(e => {
    //   //   let map = {}
    //   //   map.text = e
    //   //   map.value = e
    //   //   this.filterConsigneeList.push(map)
    //   // })
    //   Array.from(new Set(carrierNameList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterCarrierList.push(map)
    //   })
    //   Array.from(new Set(capacityList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterCapacityList.push(map)
    //   })
    //   Array.from(new Set(materialNameList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filtermaterialNameList.push(map)
    //   })
    //   Array.from(new Set(saleAreaList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterSaleAreaList.push(map)
    //   })
    //   Array.from(new Set(addressPlaceList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filteraddressPlace.push(map)
    //   })
    //   Array.from(new Set(orderStatusList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterorderStatus.push(map)
    //   })
    //   Array.from(new Set(materialSpeList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filtermaterialSpe.push(map)
    //   })
    //   Array.from(new Set(saleOrderStatusList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterSaleOrderStatus.push(map)
    //   })
    //   Array.from(new Set(saleRemarkList)).forEach(e => {
    //     let map = {}
    //     map.text = e
    //     map.value = e
    //     this.filterSaleRemark.push(map)
    //   })
    // },
    cellStyle({ row, column, rowIndex, columnIndex }) {
      if (
        column.property == 'arrivalAddress' ||
        column.property == 'receiptAddress'
      ) {
        return { color: 'blue', height: '30px' }
      } else {
        return { height: '30px' }
      }
    },
    rowClick(row, column, event) {
      this.steelMap = {}
      this.tableRowIndex = row.group
      this.isRowClick = 1
      this.steelMap = row
    },
    tableRowClassName({ row, rowIndex }) {
      if (row.group == this.tableRowIndex && this.tableRowIndex !== '') {
        return 'warning-row'
      }
    },
    cellMouse(row, column, cell, event) {
      if (this.isRowClick == 0) {
        this.tableRowIndex = row.group
      }
    },
    cellLeave(row, column, cell, event) {
      if (this.isRowClick == 0) {
        this.tableRowIndex = ''
      }
    },
    reset() {
      var that = this
      that.$nextTick(() => {
        that.saleSteelKey = !that.saleSteelKey
      })
    },
    checkTrans(row) {
      this.isRowClick = 0
      if (Object.values(this.steelMap).length == 0) {
        this.$message.error('请点击需要查看轨迹的行！')
        return
      }
      if (typeof row === 'undefined') {
        row = this.steelMap
      }
      console.log(row)
      if (row.saleMakeDate == null) {
        this.$message.error('该车还未出库,暂无轨迹')
        return
      }
      let that = this
      that.axios
        .post('/api/v1/otms/fullPath?orderNumber=' + row.orderNo)
        .then(res => {
          console.log(res.data)
          if (res.data.data == '-1') {
            this.$message.error('运输订单未关闭的自提车辆无权查看!')
          } else if (res.data.data.startAndEndRoutes != null) {
            that.pathOption.orderNumber = row.orderNo
            that.pathOption.capacityNumber = row.capacityNo
            that.pathOption.startPointName = '达钢集团小东门'
            that.pathOption.endPointName = row.receiptAddress
            that.value7 = true
            if (row.orderStatus == '已完成') {
              that.pathOption.statusCode = '位置'
            } else {
              that.pathOption.statusCode = '当前位置'
            }
          } else {
            this.$message.error('车辆没有开启GPS')
          }
        })
    },
    cellClik(row, column, cell, event) {
      if (column.property == 'arrivalAddress') {
        if (row.orderNo && row.arrivalAddress) {
          this.downloadCapacityNo = `${row.orderTime}-${row.capacityNo}`
          this.toPhotoClick(row.orderNo, 1)
        }
      }
      if (column.property == 'receiptAddress') {
        if (row.orderNo && row.receiptAddress) {
          this.downloadCapacityNo = `${row.orderTime}-${row.capacityNo}`
          this.receipctPhotoClick(row.orderNo, 1)
        }
      }
    },
    //反关闭运单
    reverseCloseOrder() {
      this.steelMap.oYeFlag = 1
      this.axios
        .post('/api/v1/ams/reverseCloseOrder', this.steelMap)
        .then(res => {
          this.operation(this.steelMap)
          this.onclick(this.filterMap)
        })
    },
    //筛选
    //筛选客户
    //点击操作弹出框
    operation(row) {
      // this.isRowClick = 0
      this.isCheckGPS = true
      if (Object.values(this.steelMap).length == 0) {
        this.$message.error('请点击需要执行更改操作的行！')
        return
      }
      if (typeof row === 'undefined') {
        row = this.steelMap
      }
      this.axios
        .post(
          '/api/v1/tms/getOyeSteelReportDetailsBySmId?saleOrderMaterialId=' +
            row.saleOrderMaterialId
        )
        .then(res => {
          this.steelMap = res.data.data
          this.steelMap.userName = getCookie('loginName')
          this.addressId = row.shipperAddressId
          this.getAllProvince()
          this.onchangeProvince()
          this.onchangeCity()
          this.centerDialogVisible = true
          this.getSpanArr1(res.data.data.mapList)
        })
    },
    //查看抵达图
    toPhotoClick(orderNo, num) {
      this.axios
        .post('/api/v1/otms/getArrivalPhoto?orderNumber=' + orderNo)
        .then(res => {
          this.srcList = []
          this.previewSrcList = res.data
          console.log(res.data, 'sd')
          res.data.forEach(e => {
            this.srcList.push({
              title: '',
              src: e
            })
          })
          // this.srcList.push({
          //   title: '车头照片',
          //   src: res.data[0]
          // })
          // this.srcList.push({
          //   title: '满货箱照片',
          //   src: res.data[1]
          // })
          if (num == 1) {
            this.isShow3 = true
          } else {
            this.isShow = true
          }
        })
    },
    //查看实时路径
    checkPoint() {
      if (this.input || this.input1 || this.steelMap.capacityNo) {
        this.carNumber = this.input || this.input1 || this.steelMap.capacityNo
        this.value8 = true
      } else {
        this.$message.error('请输入或者点击有车牌号的行查询车牌号的实时路径')
      }
    },
    //查看签收图
    receipctPhotoClick(orderNo, num) {
      this.axios
        .post('/api/v1/otms/getReceivingPhotoByUrl?orderNumber=' + orderNo)
        .then(res => {
          console.log(res.data)
          if (num == 1) {
            this.isShow4 = true
          } else {
            this.isShow2 = true
          }
          this.srcList2 = []
          this.previewSrcList2 = res.data
          if (res.data && res.data.length > 0) {
            res.data.forEach(item => {
              this.srcList2.push({
                title: '',
                src: item
              })
            })
          }
        })
    },
    //销售钢材报表导出excel
    exportAllReportToExcel() {
      const loading = this.$loading({
        lock: true,
        text: '正在导出Excel',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      var title = this.tableTitle
      let tHeader = []
      let filterVal = []
      if (
        getCookie('orgCode') == 'shouhuokehu' ||
        getCookie('orgCode') == 'xiaoshouyewuyuan'
      ) {
        tHeader = []
        filterVal = []
        let tHeader1 = this.salerExportExcelList.filter(e => {
          if (this.columnNoRoutList.indexOf(e) == -1) {
            return e
          }
        })
        console.log(tHeader1)
        let arr = this.$refs.tableRef.$children
        for (var i = 0; i < tHeader1.length; i++) {
          for (var j = 0; j < arr.length; j++) {
            if (arr[j].label === tHeader1[i]) {
              if (tHeader.indexOf(arr[j].label) === -1) {
                tHeader.push(arr[j].label)
              }
              if (filterVal.indexOf(arr[j].prop) === -1) {
                filterVal.push(arr[j].prop)
              }
            }
          }
        }
      } else {
        this.$refs.tableRef.$children.forEach(item => {
          if (item.label != undefined && item.prop != undefined) {
            if (tHeader.indexOf(item.label) === -1) {
              tHeader.push(item.label)
            }
            if (filterVal.indexOf(item.prop) === -1) {
              filterVal.push(item.prop)
            }
          }
        })
      }
      this.downloadLoading = true
      tHeader.unshift('车序号')
      filterVal.unshift('saleOrderMaterialId')

      require.ensure([], () => {
        const {
          export_json_to_excel
        } = require('@/assets/excel/Export2Excel.js') //这里必须使用绝对路径，使用@/+存放export2Excel的路径
        let data = this.disposeDataToExcel(this.tableData).map(v =>
          filterVal.map(j => v[j])
        ) //3.formatJson格式转换
        export_json_to_excel(tHeader, data, title) // (title)导出的表格名称
      })
      loading.close()
    },
    disposeDataToExcel(data) {
      //如果批次相同,只允许一条磅重和运费置为0
      //首先找出批次相同的数组元素
      data.reduce((prev, item) => {
        if (item.weightBatchId) {
          //如果有批次则走这个方法
          if (prev.length > 0) {
            let hash = prev[prev.length - 1]
            //如果处理后的数组长度大于0,那么判断处理后的数组的最后一个元素里面的批次是否与当前批次相等，如果相等
            if (
              item.weightBatchId &&
              hash.weightBatchId &&
              item.weightBatchId == hash.weightBatchId
            ) {
              prev[prev.length - 1].netWeight = 0
              prev[prev.length - 1].detailsAmount = 0
            }
          }
          prev.push(item)
          return prev
        } else {
          prev.push(item)
          return prev
        }
      }, [])
      return data
    },
    changeScreen() {},
    //承运商弹出层
    handleSelectCarrier() {
      this.carrierList.forEach(item => {
        if (item.carrierName == this.steelMap.carrierName) {
          this.steelMap.newCarrierId = item.carrierId
          this.steelMap.carrierId = item.carrierId
        }
      })
    },
    //承运商边输边查
    querySearchCarrier(queryString, cb) {
      if (queryString != null && queryString != '' && queryString.length > 1) {
        this.axios
          .post('/api/v1/uc/getCarrierMesByLike?index=' + queryString)
          .then(res => {
            if (res.data.code == '200') {
              this.carrierList = []
              if (res.data.data.length == 0) {
                this.$message.info('承运商不存在,请前往注册')
                return
              }
              var restaurants = res.data.data
              this.carrierList = res.data.data
              var results = queryString
                ? restaurants.filter(this.createFilterCarrier(queryString))
                : restaurants
              cb(results)
            }
          })
      }
    },
    createFilterCarrier(queryString) {
      return restaurants => {
        return (
          restaurants.value1.toLowerCase().indexOf(queryString.toLowerCase()) >
          -1
        )
      }
    },
    //以下是车牌号边输边查搜索
    querySearch(queryString, cb) {
      console.log(queryString)
      if (
        (queryString != null && queryString != '' && queryString.length > 3) ||
        queryString == '取消' ||
        queryString == '待定' ||
        queryString == '空白'
      ) {
        this.axios
          .post('/api/v1/uc/getCapacityByLike?index=' + queryString)
          .then(res => {
            this.capacityList = []
            if (res.data.code == '200') {
              if (res.data.data.length == 0) {
                this.$message.info('车牌号不存在,请前往注册')
                return
              }
              var restaurants = res.data.data
              this.capacityList = res.data.data
              var results = queryString
                ? restaurants.filter(this.createFilter(queryString))
                : restaurants
              // 调用 callback 返回建议列表的数据
              cb(results)
            }
          })
      }
    },
    createFilter(queryString) {
      return restaurants => {
        return (
          restaurants.value.toLowerCase().indexOf(queryString.toLowerCase()) >
          -1
        )
      }
    },
    //车牌号弹出层
    handleSelect() {
      this.capacityList.forEach(item => {
        if (item.capacityNumber === this.steelMap.capacityNo) {
          this.steelMap.newsCapacityId = item.capacityId
        }
      })
    },
    updateCapacity() {
      console.log('我只想测')
      this.steelMap.capacityId = this.steelMap.newsCapacityId
      this.steelMap.driverTel = this.steelMap.capacityTel
      this.steelMap.userId = getCookie('userId')
      if (this.steelMap.newsCapacityId == null) {
        this.$message.warning('请先注册车牌号或者选中弹出后再提交!')
        return
      }
      if (
        !(
          isVehicleNumber(this.steelMap.capacityNo) ||
          this.steelMap.capacityNo == '取消' ||
          this.steelMap.capacityNo == '待定' ||
          this.steelMap.capacityNo == '空白'
        )
      ) {
        this.$message.error('请输入正确格式的车牌号!')
        return
      }
      //是否校验GPS
      this.steelMap.isCheckGPS = this.isCheckGPS
      if (this.steelMap.capacityIds != 0) {
        const loading = this.$loading({
          lock: true,
          text: '正在变更车牌号',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        this.steelMap.oYeFlag = 1
        this.axios
          .post('/api/v1/ams/updateCapacityNumberInFactory', this.steelMap)
          .then(res => {
            if (res.data.code == 200) {
              this.$message({
                type: 'success',
                message: '变更车号成功,请通知驾驶员',
                duration: 2500,
                offset: '250'
              })
              this.operation(this.steelMap)
              this.onclick(this.filterMap)
              loading.close()
            } else {
              this.$alert(res.data.data, '提示', {
                confirmButtonText: '确定',
                center: true,
                type: 'warning',
                callback: action => {
                  this.onclick(this.filterMap)
                  this.operation(this.steelMap)
                }
              })
              loading.close()
            }
          })
          .catch(() => {
            this.$message.success('变更失败，请联系管理员')
            loading.close()
          })
      } else {
        if (this.steelMap.carrierIds == 0) {
          this.$message.error('请先选择承运商！')
          return
        }
        this.steelMap.lineId = this.lineSpelling[this.steelMap.mapList.length]
        this.steelMap.driverTel = this.steelMap.capacityTel
        this.steelMap.capacityNumber = this.steelMap.capacityNo
        this.steelMap.oYeFlag = 1
        let arr = []
        arr.push(this.steelMap)
        const loading = this.$loading({
          lock: true,
          text: '正在派车,请稍候',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        this.axios
          .post('/api/v1/ams/dispatchSteelOrder', arr)
          .then(res => {
            if (res.data.code == '200') {
              this.$message.success('派车成功!')
              this.operation(this.steelMap)
              this.axios
                .post(
                  '/api/v1/ams/matchingDriverTelRecently?capacityNumber=' +
                    this.steelMap.capacityNo
                )
                .then(res => {
                  // if (res.data.data != null) {
                  //   this.steelMap.capacityTel = res.data.data
                  //   this.updateDriverTel()
                  // }
                })
              this.onclick(this.filterMap)
              loading.close()
            } else {
              loading.close()
              this.$alert(res.data.data, '提示', {
                confirmButtonText: '确定',
                center: true,
                callback: action => {
                  this.onclick(this.filterMap)
                  this.operation(this.steelMap)
                }
              })
            }
          })
          .catch(() => {
            this.$message.error(res.data.data)
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          })
      }
    },
    //修改司机电话号码
    updateDriverTel() {
      const loading = this.$loading({
        lock: true,
        text: '修改电话号码中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      if (
        this.steelMap.capacityTel == null ||
        this.steelMap.capacityTel == ''
      ) {
        this.$message.error('电话号码不能为空')
        loading.close()
        return
      }
      var regex = /^[1][2,3,4,5,6,7,8,9][0-9]{9}$/
      if (!regex.test(this.steelMap.capacityTel)) {
        this.$message.error('电话号码不符合规则')
        loading.close()
        return
      }
      this.axios
        .post('/api/v1/uc/updateDriverTel', {
          orderId: parseInt(this.steelMap.orderId),
          saleOrderMaterialId: parseInt(this.steelMap.saleOrderMaterialId),
          driverTel: this.steelMap.capacityTel,
          oYeFlag: 1
        })
        .then(res => {
          if (res.data.code == '200') {
            this.$message({
              type: 'success',
              duration: 2000,
              message: '修改电话号码成功',
              offset: 250
            })
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          } else {
            this.$message.error('修改失败')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          }
        })
        .catch(() => {
          this.$message.error('修改失败')
          this.operation(this.steelMap)
          this.onclick(this.filterMap)
          loading.close()
        })
    },
    //修改收货客户电话
    updateconsigneeTel() {
      const loading = this.$loading({
        lock: true,
        text: '修改电话号码中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      if (
        this.steelMap.consigneeTel == null ||
        this.steelMap.consigneeTel == ''
      ) {
        this.$message.error('电话号码不能为空')
        return
      }
      this.axios
        .post('/api/v1/ams/updateConsigneeTel', {
          saleOrderNo: this.steelMap.saleOrderNo,
          saleOrderMaterialId: this.steelMap.saleOrderMaterialId,
          consigneeTel: this.steelMap.consigneeTel
        })
        .then(res => {
          if (res.data.code == '200') {
            this.$message.success('修改成功')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          } else {
            this.$message.error('修改失败')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          }
        })
        .catch(() => {
          this.$message.error('修改失败')
          this.operation(this.steelMap)
          this.onclick(this.filterMap)
          loading.close()
        })
    },
    //批量修改收货客户电话
    batchUpdateconsigneeTel() {
      const loading = this.$loading({
        lock: true,
        text: '修改电话号码中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      if (!this.consigneeTel) {
        this.$message.error('电话号码不能为空')
        loading.close()
        return
      }
      this.batchCapacityList.forEach(row => {
        this.axios
          .post('/api/v1/ams/updateConsigneeTel', {
            saleOrderNo: row.saleOrderNo,
            saleOrderMaterialId: row.saleOrderMaterialId,
            consigneeTel: this.consigneeTel,
            oYeFlag: 1
          })
          .then(res => {
            if (res.data.code == '200') {
              this.$message.success('修改成功')
            } else {
              this.$message.error('修改失败')
            }
          })
          .catch(() => {
            this.$message.error('修改失败')
          })
      })
      this.onclick(this.filterMap)
      loading.close()
      this.batchCarrierVisible = false
    },
    //修改承运商授权
    updateTruckCarrier() {
      if (this.steelMap.newCarrierId == null) {
        this.$message.warning('请注册承运商或者选中弹出层之后再提交!')
        this.onclick(this.filterMap)
        return
      }
      if (this.steelMap.carrierIds != 0) {
        const loading = this.$loading({
          lock: true,
          text: '正在修改承运商授权',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        this.steelMap.oYeFlag = 1
        this.axios
          .post('/api/v1/ams/updateTruckNoCarrier', this.steelMap)
          .then(res => {
            if (res.data.code == '200') {
              this.$message.success('修改承运商授权成功')
              this.operation(this.steelMap)
              this.onclick(this.filterMap)
              loading.close()
            } else {
              this.$message.error('修改失败,请联系管理员!')
              this.operation(this.steelMap)
              this.onclick(this.filterMap)
              loading.close()
            }
          })
          .catch(() => {
            this.$message.error('修改失败,请联系管理员!')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          })
      } else {
        //授权承运商
        let arr = []
        this.steelMap.oYeFlag = 1
        arr.push(this.steelMap)
        const loading = this.$loading({
          lock: true,
          text: '正在授权承运商',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        })
        this.axios
          .post('/api/v1/ams/dispatchToCarrier', arr)
          .then(res => {
            if (res.data.code == '0') {
              this.$message.success('授权承运商成功')
              this.operation(this.steelMap)
              this.onclick(this.filterMap)
              loading.close()
            } else {
              this.$message.error('授权失败,请联系管理员')
              this.operation(this.steelMap)
              this.onclick(this.filterMap)
              loading.close()
            }
          })
          .catch(() => {
            this.$message.error('授权失败,请联系管理员')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          })
      }
    },
    updateAddress(row) {
      this.drawer = true
      this.addressRow = row
      this.province = row.addressProvince
      this.city = row.addressDistrict
      this.county = row.addressTown
      this.addressId = row.shipperAddressId
      this.getAllProvince()
      this.onchangeProvince()
      this.onchangeCity()
    },
    //获取所有省数据
    getAllProvince() {
      // this.provinceList = []
      // return
      this.axios
        .post('/api/v1/uc/getAllProvince')
        .then(res => {
          // console.log(res.data.data)
          this.provinceList = res.data.data
        })
        .catch(e => {
          console.log(e)
        })
    },
    //省改变
    onchangeProvince() {
      this.axios
        .post(
          '/api/v1/uc/getDistrictByProvince?addressProvince=' +
            this.steelMap.addressProvince +
            '&i=' +
            new Date()
        )
        .then(res => {
          this.cityList = res.data.data
          // this.city = "";
          // this.county = "";
        })
    },
    //市改变
    onchangeCity() {
      this.axios
        .post(
          '/api/v1/uc/getTownByDistrict?addressDistrict=' +
            this.steelMap.addressDistrict +
            '&i=' +
            new Date()
        )
        .then(res => {
          this.countyList = res.data.data
        })
    },
    //县(区)改变
    onchangeCounty() {
      let mapValue = {
        addressProvince: this.steelMap.addressProvince,
        addressDistrict: this.steelMap.addressDistrict,
        addressTown: this.steelMap.addressTown
      }
      this.axios.post('/api/v1/uc/getPlaceByAllAddress', mapValue).then(res => {
        this.addressId = res.data.data[0].addressId
      })
    },
    //收货地址弹出层
    handleSelect1(item) {
      console.log('获取所有下拉值!')
    },
    //以下是收货地址边输边查搜索
    querySearch1(queryString, cb) {
      this.axios
        .post(
          '/api/v1/ams/getRealAddressByLike?addressId=' +
            this.addressId +
            '&index=' +
            queryString
        )
        .then(res => {
          if (res.data.code == '200') {
            var restaurants = res.data.data
            var results = queryString
              ? restaurants.filter(this.createFilter1(queryString))
              : restaurants
            // 调用 callback 返回建议列表的数据
            cb(results)
          }
        })
    },
    createFilter1(queryString) {
      return restaurants => {
        return (
          restaurants.value.toLowerCase().indexOf(queryString.toLowerCase()) >
          -1
        )
      }
    },
    //修改收货地址
    addAddressClick() {
      const loading = this.$loading({
        lock: true,
        text: '正在修改收货地址',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      let map = this.steelMap
      map.isCloseEas = Number(1)
      map.isNewCar = Number(1)
      map.userName = getCookie('loginName')
      map.shipperAddressId = this.addressId
      map.oYeFlag = 1
      this.axios
        .post('/api/v1/ams/updateCarAddress', map)
        .then(res => {
          if (res.data.code == '200') {
            // this.$message.success('修改收货地址成功!')
            this.$message({
              type: 'success',
              message:
                '修改收货地址成功,请提醒相关人员核对单价及详单数据是否生成正确',
              offset: '250',
              duration: 2500
            })
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          } else {
            this.$message.error('修改失败,请联系管理员!')
            this.operation(this.steelMap)
            this.onclick(this.filterMap)
            loading.close()
          }
        })
        .catch(() => {
          this.$message.error('修改失败,请联系管理员!')
          this.operation(this.steelMap)
          this.onclick(this.filterMap)
          loading.close()
        })
    },
    //批量修改收货地址
    batchUpdateCarAddress() {
      const loading = this.$loading({
        lock: true,
        text: '正在修改收货地址',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.batchCapacityList.forEach(row => {
        let map = row
        map.place = this.steelMap.place
        map.isCloseEas = Number(1)
        map.isNewCar = Number(1)
        map.shipperAddressId = this.addressId
        map.userName = getCookie('loginName')
        map.oYeFlag = 1
        this.axios
          .post('/api/v1/ams/updateCarAddress', map)
          .then(res => {
            if (res.data.code == '200') {
              this.$message({
                type: 'success',
                message:
                  '修改收货地址成功,请提醒相关人员核对单价及详单数据是否生成正确',
                offset: '250',
                duration: 2500
              })
            } else {
              this.$message.error('修改失败,请联系管理员!')
            }
          })
          .catch(() => {
            this.$message.error('修改失败,请联系管理员!')
          })
      })
      this.onclick(this.filterMap)
      loading.close()
      this.batchCarrierVisible = false
    },
    //将序号确定下来
    // getNodeNum(data) {
    //   for (var i = 0; i < data.length; i++) {
    //     if (i === 0) {
    //       data[i].group = i
    //       data[i].rowKey = i
    //     } else {
    //       // 判断当前元素与上一个元素是否相同
    //       if (data[i].saleOrderMaterialId === data[i - 1].saleOrderMaterialId) {
    //         data[i].group = data[i - 1].group
    //         data[i].rowKey = i
    //       } else {
    //         data[i].group = data[i - 1].group + 1
    //         data[i].rowKey = i
    //       }
    //     }
    //   }
    // },
    //记录每一行的合并数
    getSpanArr(data) {
      //每次调用方法初始化
      this.spanArr = []
      this.spanArr2 = []
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1)
          this.spanArr2.push(1)
          // data[i].group = i
          this.pos = 0
          this.pos2 = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].saleOrderMaterialId === data[i - 1].saleOrderMaterialId) {
            this.spanArr[this.pos] += 1
            // data[i].group = data[i - 1].group
            this.spanArr.push(0)

            if (
              data[i].weightBatchId &&
              data[i].weightBatchId === data[i - 1].weightBatchId
            ) {
              //批次合并
              this.spanArr2[this.pos2] += 1
              this.spanArr2.push(0)
            } else {
              this.spanArr2.push(1)
              this.pos2 = i
            }
          } else {
            this.spanArr.push(1)
            this.pos = i
            // data[i].group = data[i - 1].group + 1
            this.spanArr2.push(1)
            this.pos2 = i
          }
        }
      }
    },
    getSpanArr1(data) {
      //每次调用方法初始化
      this.spanArr1 = []
      this.spanArr3 = []
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr1.push(1)
          this.spanArr3.push(1)
          // data[i].group = i
          this.pos1 = 0
          this.pos3 = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].saleOrderMaterialId === data[i - 1].saleOrderMaterialId) {
            this.spanArr1[this.pos] += 1
            // data[i].group = data[i - 1].group
            this.spanArr1.push(0)
            if (
              data[i].weightBatchId &&
              data[i].weightBatchId === data[i - 1].weightBatchId
            ) {
              //批次合并
              this.spanArr3[this.pos3] += 1
              this.spanArr3.push(0)
            } else {
              this.spanArr3.push(1)
              this.pos3 = i
            }
          } else {
            this.spanArr1.push(1)
            this.pos1 = i
            this.spanArr3.push(1)
            this.pos3 = i
            // data[i].group = data[i - 1].group + 1
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (this.mergeList.indexOf(column.label) != -1) {
        const _row = this.spanArr[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      } else if (this.mergeListBatch.indexOf(column.label) != -1) {
        const _row = this.spanArr2[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
      if (this.mergeList.indexOf(column.label) != -1) {
        const _row = this.spanArr1[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      } else if (this.mergeListBatch.indexOf(column.label) != -1) {
        const _row = this.spanArr3[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    objectSpanMethod2({ row, column, rowIndex, columnIndex }) {
      if (this.mergeList.indexOf(column.label) != -1) {
        const _row = this.spanArr1[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      } else if (this.mergeListBatch.indexOf(column.label) != -1) {
        const _row = this.spanArr3[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    //计算总件数和总车数
    // getTotalNum(data) {
    //   //通过车序号的个数来计算车数
    //   let arr = []
    //   arr = data.map(e => {
    //     if (
    //       e.capacityNo != '取消' &&
    //       e.saleOrderStatus != '反审批' &&
    //       e.orderStatus != '已关闭'
    //     ) {
    //       return e.saleOrderMaterialId
    //     }
    //   })
    //   this.totalCapacity = Array.from(new Set(arr)).length
    //   this.totalNumber = data.reduce(function(prev, item) {
    //     return prev + item.materialNum
    //   }, 0)
    // },
    //减少物资件数
    updateBillOrder(row) {
      const loading = this.$loading({
        lock: true,
        text: '修改物资件数中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      let map = {
        materialId: row.materialId,
        materialNum: row.materialNumber,
        oYeFlag: 1
      }
      let arr = []
      arr.push(map)
      let updateMap = {
        orderId: this.steelMap.orderId,
        saleOrderId: this.steelMap.saleOrderId,
        saleOrderMaterialId: this.steelMap.saleOrderMaterialId,
        mapList: arr,
        oYeFlag: 1
      }
      this.axios
        .post('/api/v1/oms/updateMaterialMes', updateMap)
        .then(res => {
          if (res.data.code == '200') {
            this.$message.success('修改物资数量成功')
            this.onclick(this.filterMap)
            loading.close()
          } else {
            this.$message.error('修改物资数量失败,请联系管理员')
            this.onclick(this.filterMap)
            loading.close()
          }
        })
        .catch(() => {
          this.$message.error('修改物资数量失败,请联系管理员')
          this.onclick(this.filterMap)
          loading.close()
        })
    },
    getStatusNum(data) {
      //未派发、取消
    },
    //查询，输入查询条件
    onclick(obj) {
      this.$store.commit('updateSaleSteelToggleIds', { isClear: 1 })
      this.isRowClick = 0
      this.showPopover = false
      const loading = this.$loading({
        lock: true,
        text: '正在获取数据',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      let startTime = null
      let endTime = null
      let carrierSsoId = null
      let carrierName = null
      let consigneeName = null
      let capacityNo = null
      let remark = null
      let saler = null
      let easPrimaryId = null
      let consigneeLoginName = null
      let receiveAddress = null
      let inboundWarehouse = null
      obj.receiveAddress = null
      obj.saleNo = null
      obj.receiveCustomer = null
      if (this.startTime && this.endTime) {
        startTime = sjTime(this.startTime)
        endTime = sjTime(this.endTime)
      }
      if (getCookie('orgCode') == 'chengyunshang') {
        carrierSsoId = getCookie('userId')
      }
      if (getCookie('orgCode') == 'xiaoshouyewuyuan') {
        saler = getCookie('loginName')
      }
      if (getCookie('orgCode') == 'shouhuokehu') {
        consigneeLoginName =
          JSON.parse(getCookie('userInfo')).userCode || getCookie('loginName')
        obj.consigneeLoginName = consigneeLoginName
      }
      if (getCookie('orgCode') == 'ouyechangwaiku') {
        inboundWarehouse = getCookie('loginName')
      }
      obj.inboundWarehouse = inboundWarehouse
      if (this.screen == '客户') {
        consigneeName = this.input
      } else if (this.screen == '承运商') {
        carrierName = this.input
      } else if (this.screen == '车牌号') {
        capacityNo = this.input
      } else if (this.screen == '分录ID') {
        easPrimaryId = this.input
      } else if (this.screen == '收货地址') {
        receiveAddress = this.input
        obj.receiveAddress = receiveAddress
      } else if (this.screen == '销售订单号') {
        obj.saleNo = this.input
      } else if (this.screen == '收款公司') {
        obj.receiveCustomer = this.input
      } else {
        remark = this.input
      }
      if (this.screen1 == '客户' && this.input1 != null && this.input1 != '') {
        consigneeName = this.input1
      } else if (
        this.screen1 == '承运商' &&
        this.input1 != null &&
        this.input1 != ''
      ) {
        carrierName = this.input1
      } else if (
        this.screen1 == '车牌号' &&
        this.input1 != null &&
        this.input1 != ''
      ) {
        capacityNo = this.input1
      } else if (
        this.screen1 == '分录ID' &&
        this.input1 != null &&
        this.input1 != ''
      ) {
        easPrimaryId = this.input1
      } else if (
        this.screen1 == '收货地址' &&
        this.input1 != null &&
        this.input1 != ''
      ) {
        receiveAddress = this.input1
        obj.receiveAddress = receiveAddress
      } else if (
        this.screen1 == '销售订单号' &&
        this.input1 != null &&
        this.input1 != ''
      ) {
        obj.saleNo = this.input1
      } else if (this.screen1 == '收款公司') {
        obj.receiveCustomer = this.input1
      } else if (this.input1 != null && this.input1 != '') {
        remark = this.input1
      }
      this.axios
        .post(
          '/api/v1/tms/getOyeSteelReport?startTime=' +
            startTime +
            '&endTime=' +
            endTime +
            '&carrierSsoId=' +
            carrierSsoId +
            '&i=' +
            new Date() +
            '&remark=' +
            remark +
            '&consigneeName=' +
            consigneeName +
            '&carrierName=' +
            carrierName +
            '&capacityNo=' +
            capacityNo +
            '&saler=' +
            saler +
            '&easPrimaryId=' +
            encodeURIComponent(easPrimaryId),
          obj,
          {
            timeout: 10 * 60 * 1000
          }
        )
        .then(res => {
          this.tableData = res.data.data
          if (res.data.data.length > 0) {
            this.totalNumber = `${res.data.data[0].totalNumber}件`
            this.totalCapacity = `${res.data.data[0].totalCapacity}车`
            this.quxiaoCapacityNum = `${res.data.data[0].quxiaoCapacityNum}车`
            this.totalNetWeight = `${res.data.data[0].totalNetWeight}吨`
            console.log(obj, 'obj')
            if (this.filterMap) {
              this.filterRefreshCtrl(res.data.data, this.filterMap)
            }
          }
          this.maxHeight =
            window.innerHeight -
            document.querySelector('.tableTop').offsetHeight -
            40
          let a = 1
          if (
            this.visibleList.length > 0 &&
            this.visibleList.length < this.tableData.length
          ) {
            a = this.visibleList[0].rowKey
          }
          this.visibleList = []
          this.visibleList = this.tableData.slice(
            0,
            Math.floor(this.maxHeight / this.itemHeight) + 1
          )
          this.getSpanArr(this.visibleList)
          this.$refs.tableRef.bodyWrapper.scrollTop = 30 * (a - 1)
          // this.getTotalNum(this.tableData)
          loading.close()
        })
        .catch(() => {
          loading.close()
          this.maxHeight =
            window.innerHeight -
            document.querySelector('.tableTop').offsetHeight -
            40
          this.$message.error('查询失败')
        })
    },
    filterRefreshCtrl(data, obj) {
      if (!obj.truckRemarkList || obj.truckRemarkList.length === 0) {
        this.filterTruckRemark = data[0].filterTruckRemark
      }
      if (!obj.saleRemarkList || obj.saleRemarkList.length === 0) {
        this.filterSaleRemark = data[0].filterSaleRemark
      }
      if (!obj.consigneeNameList || obj.consigneeNameList.length === 0) {
        this.filterConsigneeList = data[0].filterConsigneeList
      }
      if (!obj.addressPlaceList || obj.addressPlaceList.length === 0) {
        this.filteraddressPlace = data[0].filteraddressPlace
      }
      if (!obj.materialSpeList || obj.materialSpeList.length === 0) {
        this.filtermaterialSpe = data[0].filtermaterialSpe
      }
      if (!obj.capacityList || obj.capacityList.length === 0) {
        this.filterCapacityList = data[0].filterCapacityList
      }
      if (!obj.materialNameList || obj.materialNameList.length === 0) {
        this.filtermaterialNameList = data[0].filtermaterialNameList
      }
      if (!obj.carrierList || obj.carrierList.length === 0) {
        this.filterCarrierList = data[0].filterCarrierList
      }
      if (!obj.orderStatusList || obj.orderStatusList.length === 0) {
        this.filterorderStatus = data[0].filterorderStatus
      }
      if (!obj.areaNameList || obj.areaNameList.length === 0) {
        this.filterAreaName = data[0].filterAreaName
      }
      if (
        !obj.orderStatusActuallyList ||
        obj.orderStatusActuallyList.length === 0
      ) {
        this.filterorderStatusActually = data[0].filterorderStatusActually
      }
    },
    //重新获取表格数据
    refresh() {
      this.filterMap = {
        consigneeNameList: [],
        truckRemarkList: [],
        saleRemarkList: [],
        saleOrderStatusList: [],
        materialSpeList: [],
        addressPlaceList: [],
        orderStatusList: [],
        saleAreaList: [],
        materialNameList: [],
        carrierList: [],
        capacityList: []
      }
      this.visibleList = []
      this.getSteelReport()
    },
    //获取钢材统计报表
    getSteelReportDebounce() {
      this.$store.commit('updateSaleSteelToggleIds', { isClear: 1 })
      console.log('---------------------------1111')
      const loading = this.$loading({
        lock: true,
        text: '正在获取数据,请稍候',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      // this.isRowClick = 0
      let startTime = null
      let endTime = null
      let carrierSsoId = null
      let carrierName = null
      let consigneeName = null
      let consigneeLoginName = null
      let capacityNo = null
      let remark = null
      let saler = null
      let inboundWarehouse = null
      if (this.startTime && this.endTime) {
        startTime = sjTime(this.startTime)
        endTime = sjTime(this.endTime)
      }
      if (getCookie('orgCode') == 'chengyunshang') {
        carrierSsoId = getCookie('userId')
      }
      if (getCookie('orgCode') == 'xiaoshouyewuyuan') {
        saler = getCookie('loginName')
      }
      if (getCookie('orgCode') == 'shouhuokehu') {
        consigneeLoginName =
          JSON.parse(getCookie('userInfo')).userCode || getCookie('loginName')
        // console.log('userinfo')
        // JSON.parse(getCookie('userInfo')).userCode
        this.filterMap.consigneeLoginName = consigneeLoginName
      }
      if (getCookie('orgCode') == 'ouyechangwaiku') {
        inboundWarehouse = getCookie('loginName')
      }
      this.filterMap.inboundWarehouse = inboundWarehouse
      if (this.screen == '客户') {
        consigneeName = this.input
      } else if (this.screen == '承运商') {
        carrierName = this.input
      } else if (this.screen == '车牌号') {
        capacityNo = this.input
      } else {
        remark = this.input
      }
      if (this.screen1 == '客户') {
        consigneeName = this.input1
      } else if (this.screen1 == '承运商') {
        carrierName = this.input1
      } else if (this.screen1 == '车牌号') {
        capacityNo = this.input1
      } else {
        remark = this.input1
      }
      if (getCookie('orgCode') == 'chengyunshang') {
        carrierSsoId = getCookie('userId')
      }
      if (getCookie('orgCode') == 'xiaoshouyewuyuan') {
        saler = getCookie('loginName')
      }
      this.axios
        .post(
          '/api/v1/tms/getOyeSteelReport?startTime=' +
            startTime +
            '&endTime=' +
            endTime +
            '&carrierSsoId=' +
            carrierSsoId +
            '&saler=' +
            saler +
            '&i=' +
            new Date() +
            '&remark=' +
            remark +
            '&consigneeName=' +
            consigneeName +
            '&carrierName=' +
            carrierName +
            '&capacityNo=' +
            capacityNo,
          this.filterMap,
          { timeout: 6000000 }
        )
        .then(res => {
          this.tableData = res.data.data
          if (res.data.data.length > 0) {
            this.totalNumber = `${res.data.data[0].totalNumber}件`
            this.totalCapacity = `${res.data.data[0].totalCapacity}车`
            this.quxiaoCapacityNum = `${res.data.data[0].quxiaoCapacityNum}车`
            this.totalNetWeight = `${res.data.data[0].totalNetWeight}吨`
            this.filterConsigneeList = res.data.data[0].filterConsigneeList
            this.filterCarrierList = res.data.data[0].filterCarrierList
            this.filterCapacityList = res.data.data[0].filterCapacityList
            this.filtermaterialNameList =
              res.data.data[0].filtermaterialNameList
            // this.filterorderStatus = res.data.data[0].filterorderStatus
            this.filteraddressPlace = res.data.data[0].filteraddressPlace
            this.filtermaterialSpe = res.data.data[0].filtermaterialSpe
            this.filterSaleRemark = res.data.data[0].filterSaleRemark
            this.filterTruckRemark = res.data.data[0].filterTruckRemark
            this.filterorderStatusActually =
              res.data.data[0].filterorderStatusActually
          }
          this.maxHeight =
            window.innerHeight -
            document.querySelector('.tableTop').offsetHeight -
            40
          let a = 1
          if (
            this.visibleList.length > 0 &&
            this.visibleList.length < this.tableData.length
          ) {
            a = this.visibleList[0].rowKey
          }
          this.visibleList = []
          // this.getNodeLNum(this.tableData)
          this.visibleList = this.tableData.slice(
            0,
            Math.floor(this.maxHeight / this.itemHeight) + 1
          )

          this.getSpanArr(this.visibleList)
          this.$refs.tableRef.bodyWrapper.scrollTop = 30 * (a - 1)
          loading.close()
        })
        .catch(() => {
          this.maxHeight =
            window.innerHeight -
            document.querySelector('.tableTop').offsetHeight -
            40
          loading.close()
        })
    }
  }
}
</script>

<style lang="scss" scoped>
.saleSteelReports {
  .tableTop {
    margin-left: 20px;
    margin-top: 20px;
    // height: ;
  }
  .table {
    margin-left: 20px;
    margin-top: 20px;
    /deep/ .el-tooltip {
      width: auto !important;
    }
    /deep/ .el-table__body {
      overflow-y: auto;
      position: absolute !important;
      tr:hover > td {
        background-color: #fff;
      }
    }

    ::-webkit-scrollbar {
      height: 20px;
      width: 10px;
      background-color: transparent;
    }

    /deep/ .scrollBarClass {
      max-height: 200px;
      width: 220px;
    }
  }
  /deep/ .el-tabs__new-tab {
    font-size: 20px;
    line-height: 20px;
    font-weight: 700 !important;
    color: #000;
  }

  .batchCarrierClass {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .batchCapacityClass {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .dialog {
    .exceptionHandleClass {
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 20px;
      margin-top: 20px;
      margin-bottom: 20px;
    }
    .steelMapClass {
      .steelMapClass1 {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass12 {
          margin-left: 50px;
          margin-right: 10px;
        }
        .steelMapClass13 {
          display: flex;
          margin-left: 50px;
          margin-right: 10px;
        }
      }
      .steelMapClass2 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass22 {
          margin-left: 50px;
          margin-right: 10px;
          .el-select {
            .el-input .el-input--suffix {
              .el-input__inner {
                border: 0px solid !important;
              }
            }
          }
        }
      }
      .steelMapClass3 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass32 {
          margin-left: 50px;
          // margin-right: 10px;
        }
        .steelMapClass33 {
          margin-left: 20px;
          // margin-right: 10px;
        }
      }
      .steelMapClass4 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;

        .steelMapClass42 {
          margin-left: 50px;
          margin-right: 10px;
        }
        .steelMapClass43 {
          margin-left: 50px;
          margin-right: 10px;
        }
        .steelMapClass44 {
          margin-left: 50px;
          margin-right: 10px;
        }
      }
      .steelMapClass5 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;

        .steelMapClass52 {
          margin-left: 50px;
          margin-right: 10px;
          .steelMapClass521 {
            margin-left: 20px;
          }
        }
      }
      .steelMapClass9 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass92 {
          margin-left: 50px;
          margin-right: 10px;
          .steelMapClass921 {
            text-align: start;
            min-width: 350px;
            .el-textarea {
              width: auto;
            }
            // /deep/ .el-input__prefix {
            //   display: inline-block;
            //   position: relative;
            //   border: 1px solid #dcdfe6;
            //   box-sizing: border-box;
            //   color: #606266;
            //   font-size: inherit;
            //   height: 40px;
            //   line-height: 40px;
            //   padding: 0 30px;
            //   transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
            //   padding-left: 30px;
            //   left: 0;
            //   visibility: hidden;
            // }
            // /deep/ .el-textarea__inner {
            //   position: absolute;
            // }
          }
        }
      }
      .steelMapClass6 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass62 {
          margin-left: 50px;
          margin-right: 10px;
        }
      }

      .steelMapClass7 {
        margin-top: 20px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        font-size: 16px;
        .steelMapClass72 {
          margin-left: 50px;
          margin-right: 10px;
        }
      }
    }
    .table1 {
      margin-left: 20px;
      margin-top: 20px;
      .el-tooltip {
        width: auto !important;
      }
    }
    .columnShowDialogClass {
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
}
</style>
