icore-pass/src/views/queue/components/qmsEnFacotory/queueFStart.vue

// 排队开始
<template>
  <div class="sale">
    <div class="top">
      <el-form :inline="true" style="margin-top: 1rem;">
        <el-form-item>
          <el-input
            v-model.trim="capacityNo"
            style="width:250px"
            placeholder="输入车牌号查询"
            clearable
          >
          </el-input>
          <el-button
            type="primary"
            class="btn"
            @click="onclick"
            style="margin-left: 4px;"
            clearable
            ><i class="el-icon-search"></i>查询车辆</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            class="btn"
            @click="onclickMaterial"
            style="margin-left: 4px;"
            clearable
            ><i class="el-icon-search"></i>查询物资</el-button
          >
        </el-form-item>
        <el-form-item>
          <el-badge :value="redDotNum" class="item">
            <el-button type="primary" class="btn" @click="refresh">
              <i class="el-icon-refresh"></i>刷新
            </el-button>
          </el-badge>
        </el-form-item>
        <el-form-item
          ><el-button type="primary" class="btn" @click="allow">
            <i class="el-icon-d-arrow-right"></i>放行
          </el-button></el-form-item
        >
        <el-form-item
          ><el-button type="primary" class="btn" disabled>
            厂内钢材车辆总数
          </el-button>
          <el-input disabled style="width:100px" v-model="steelOrderNum">
          </el-input>
        </el-form-item>
      </el-form>
    </div>
    <!-- 物资选择模态框 -->
    <el-drawer
      title="选择物资信息"
      :visible.sync="table1"
      direction="rtl"
      size="90%"
      :show-close="true"
    >
      <el-form :inline="true" style="margin-top: 0.5rem;">
        <el-form-item>
          <label class="el-form-item__label" style="width: auto;"
            >物资名称</label
          >
        </el-form-item>
        <el-form-item>
          <el-input
            placeholder="请输入内容"
            v-model="materialNameText"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <label class="el-form-item__label" style="width: auto;">规格</label>
        </el-form-item>
        <el-form-item>
          <el-input
            placeholder="请输入内容"
            v-model="materialSpecificationText"
            clearable
            ><template slot="prepend">Φ</template></el-input
          >
        </el-form-item>
        <el-button
          type="primary"
          class="btn"
          @click="onclickMaterial1"
          style="margin-left: 4px;"
          ><i class="el-icon-search"></i>查询</el-button
        >
        <el-button type="primary" @click="makeSureMaterial"
          ><i class="el-icon-check"></i>确定</el-button
        >
      </el-form>
      <div class="tablecls">
        <!-- 查询所有的物资 -->
        <dilTable
          v-bind.sync="optionMa"
          @selection-change="selectionChange2"
          @rowDbClick="rowDbClick"
        >
        </dilTable>
      </div>
    </el-drawer>
    <div class="tabs">
      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="单拼车辆排队链表" name="first">
          <el-table
            ref="mutiData"
            :data="tableData1"
            border
            :row-key="getRowKey"
            style="width: 100%; margin-top: 20px"
            @selection-change="handleSelectionChange"
            max-height="500px"
            @cell-click="cellClikSingle"
            :cell-style="cellStyleSingle"
          >
            <!-- 是否可以勾选:selectable="selectInit" -->
            <el-table-column
              type="selection"
              width="30"
              reserve-selection
              align="center"
              :selectable="selectInit"
            ></el-table-column>
            <el-table-column label="装货点" width="100">
              <template slot-scope="scope">
                <el-select
                  size="mini"
                  v-model="scope.row.id"
                  @change="changePriority(scope.row)"
                >
                  <el-option
                    v-for="item in option"
                    :key="item.id"
                    :label="item.value"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="capacityNumber"
              label="车牌号"
              fit
              width="120"
            >
            </el-table-column>
            <el-table-column
              prop="listNodeOrder"
              label="序号"
              align="center"
              width="30"
            ></el-table-column>
            <el-table-column
              prop="resultStartTime"
              label="排队开始时间"
              align="center"
              width="150"
            >
            </el-table-column>
            <el-table-column
              prop="consigneeName"
              label="客户"
              fit
              show-overflow-tooltip
              width="170"
            >
            </el-table-column>
            <el-table-column
              prop="materialName"
              label="物资名称"
              min-width="180"
            >
            </el-table-column>
            <el-table-column
              prop="steelMeter"
              label="钢材长度"
              align="center"
              width="55"
            >
            </el-table-column>
            <el-table-column
              prop="materialSpecification"
              label="规格型号"
              min-width="160"
            >
            </el-table-column>
            <el-table-column
              prop="materialNumber"
              label="物资件数"
              align="center"
              width="60"
            >
            </el-table-column>
            <el-table-column prop="driverTel" label="司机电话号码" width="120">
            </el-table-column>
            <el-table-column prop="sureTime" label="可进厂确认时间" width="150">
            </el-table-column>

            <!-- <el-table-column prop="gatepostName" label="进厂门岗" width="80">
            </el-table-column> -->
            <el-table-column fixed="right" label="操作" width="150">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="mini"
                  @click="ctrlZQueueAllow(scope)"
                >
                  撤销放行
                </el-button>
                <el-button type="text" size="mini" @click="updateBill(scope)">
                  修改提货单
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="两拼车辆排队链表" name="fourth">
          <el-table
            :data="tableData2"
            :span-method="objectSpanMethod1"
            border
            style="width: 100%; margin-top: 20px"
            @selection-change="handleSelectionChangeSpelling"
            :row-key="getRowKey"
            max-height="500px"
            ref="twoSpellData"
            :cell-style="cellStyleTwoSpelling"
          >
            <el-table-column
              type="selection"
              width="30"
              align="center"
              reserve-selection
              :selectable="selectInitSplleing"
            ></el-table-column>
            <el-table-column label="装货点" width="100">
              <template slot-scope="scope">
                <el-select
                  size="mini"
                  v-model="scope.row.id"
                  @change="changePriority(scope.row)"
                >
                  <el-option
                    v-for="item in option"
                    :key="item.id"
                    :label="item.value"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="capacityNumber"
              label="车牌号"
              fit
              align="center"
              width="120"
            >
            </el-table-column>
            <el-table-column
              prop="listNodeOrder"
              label="序号"
              align="center"
              width="30"
            ></el-table-column>
            <el-table-column
              prop="resultStartTime"
              label="排队开始时间"
              width="150"
            >
            </el-table-column>
            <el-table-column
              prop="consigneeName"
              label="客户"
              fit
              width="170"
              show-overflow-tooltip
            >
            </el-table-column>
            <el-table-column
              prop="materialName"
              label="物资名称"
              min-width="180"
            >
            </el-table-column>
            <el-table-column
              prop="steelMeter"
              label="钢材长度"
              align="center"
              width="60"
            >
            </el-table-column>
            <el-table-column
              prop="materialSpecification"
              label="规格型号"
              min-width="160"
            >
            </el-table-column>
            <el-table-column
              prop="materialNumber"
              label="物资件数"
              align="center"
              width="60"
            >
            </el-table-column>
            <el-table-column
              prop="grid"
              label="拼数"
              fit
              align="center"
              width="50"
            >
            </el-table-column>
            <el-table-column prop="driverTel" label="司机电话号码" width="120">
            </el-table-column>
            <!-- <el-table-column prop="gatepostName" label="进厂门岗" width="100">
            </el-table-column> -->
            <el-table-column prop="sureTime" label="可进厂确认时间" width="150">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="150">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="mini"
                  @click="ctrlZQueueAllow(scope)"
                >
                  撤销放行
                </el-button>
                <el-button type="text" size="mini" @click="updateBill(scope)">
                  修改提货单
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="多拼车辆排队链表" name="second">
          <el-table
            :data="tableData"
            :span-method="objectSpanMethod"
            border
            style="width: 100%; margin-top: 20px"
            @selection-change="handleSelectionChangeSpelling"
            :row-key="getRowKey"
            max-height="500px"
            ref="spellData"
            :cell-style="cellStyleSpelling"
          >
            <el-table-column
              type="selection"
              width="30"
              align="center"
              reserve-selection
              :selectable="selectInitSplleing"
            ></el-table-column>
            <el-table-column label="装货点" width="100">
              <template slot-scope="scope">
                <el-select
                  size="mini"
                  v-model="scope.row.id"
                  @change="changePriority(scope.row)"
                >
                  <el-option
                    v-for="item in option"
                    :key="item.id"
                    :label="item.value"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="capacityNumber"
              label="车牌号"
              fit
              align="center"
              width="120"
            >
            </el-table-column>
            <el-table-column
              prop="listNodeOrder"
              label="序号"
              width="30"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="resultStartTime"
              label="排队开始时间"
              align="center"
              width="150"
            >
            </el-table-column>
            <el-table-column
              prop="consigneeName"
              label="客户"
              fit
              width="170"
              show-overflow-tooltip
            >
            </el-table-column>
            <el-table-column
              prop="materialName"
              label="物资名称"
              align="center"
              min-width="180"
            >
            </el-table-column>
            <el-table-column
              prop="steelMeter"
              label="钢材长度"
              align="cenetr"
              width="60"
            >
            </el-table-column>
            <el-table-column
              prop="materialSpecification"
              label="规格型号"
              align="center"
              min-width="160"
            >
            </el-table-column>
            <el-table-column
              prop="materialNumber"
              label="物资件数"
              align="center"
              width="60"
            >
            </el-table-column>
            <el-table-column
              prop="grid"
              label="拼数"
              fit
              width="60"
              align="center"
            >
            </el-table-column>
            <el-table-column prop="driverTel" label="司机电话号码" width="120">
            </el-table-column>
            <!-- <el-table-column prop="gatepostName" label="进厂门岗">
            </el-table-column> -->
            <el-table-column prop="sureTime" label="可进厂确认时间" width="150">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="150">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="mini"
                  @click="ctrlZQueueAllow(scope)"
                >
                  撤销放行
                </el-button>
                <el-button type="text" size="mini" @click="updateBill(scope)">
                  修改提货单
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="仓库排队列表" name="third">
          <el-table
            :data="tableData3"
            border
            style="width: 100%; margin-top: 20px"
            max-height="500px"
          >
            <el-table-column
              prop="warehouseName"
              label="仓库"
              fit
            ></el-table-column>
            <el-table-column prop="carQueue" label="排队车辆"></el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
import { getCookie } from '@/utils/util.js'
export default {
  data() {
    return {
      capacityNo: '',
      inputText: '',
      option1: {
        // 表格请求数据的地址
        requestUrl: '',
        selectionType: 'select'
      },
      optionMa: {
        // 表格请求数据的地址
        requestUrl: '',
        // 控制显示多选列
        selectionType: 'select'
      },
      activeName: 'first',
      tableData: [],
      tableData1: [],
      tableData2: [],
      tableData3: [],
      //存放每一行记录的合并数
      spanArr: [],
      spanArr1: [],
      maplist: [],
      id: null,
      option: [],
      filterArr1: [],
      table1: false,
      //物资选中表格
      materialList: [],
      //物资选中暂存
      materialList1: [],
      //物资信息查询内容
      materialNameText: null,
      materialSpecificationText: null,
      materialModelText: null,
      timer: null,
      totalQueueNum: null,
      redDotNum: null,
      i: 0,
      totalQueueNumFirst: null,
      //厂内钢材车辆总数
      steelOrderNum: 0,
      isQueryCapacity: null,
      //排队放行限制
      releaseFlag: false
    }
  },
  created() {
    this.i = 0
    this.infomation()
    this.getReleaseFlag()
    this.getSpellingArray()
    this.getNoSpellingArray()
    this.getStoreArray()
    this.getSteelOrderNum()
    this.wantEnfactory()
    this.start()
  },
  mounted() {},
  computed: {
    wantS() {
      return this.totalQueueNum
    }
  },
  beforeDestroy() {
    this.timer
  },
  watch: {
    wantS() {
      if (this.totalQueueNum - this.totalQueueNumFirst > 0) {
        this.redDotNum = this.totalQueueNum - this.totalQueueNumFirst
      }
    }
  },
  methods: {
    //获取放行限制标志
    getReleaseFlag() {
      this.axios
        .get('/api/v1/uc/getReleaseFlag')
        .then(res => {
          this.releaseFlag = res.data
          console.log(res.data, 'res')
        })
        .catch(e => {
          this.releaseFlag = false
        })
    },
    //单拼样式调整
    cellStyleSingle({ row, column, rowIndex, columnIndex }) {
      if (
        column.property == 'capacityNumber' ||
        column.property == 'materialName' ||
        column.property == 'materialSpecification'
      ) {
        return { fontSize: '16px', fontWeight: '600' }
      } else {
        return { fontSize: '15px' }
      }
    },
    cellStyleTwoSpelling({ row, column, rowIndex, columnIndex }) {
      if (
        column.property == 'capacityNumber' ||
        column.property == 'materialName' ||
        column.property == 'materialSpecification'
      ) {
        return { fontSize: '16px', fontWeight: '600' }
      } else {
        return { fontSize: '15px' }
      }
    },
    cellStyleSpelling({ row, column, rowIndex, columnIndex }) {
      if (
        column.property == 'capacityNumber' ||
        column.property == 'materialName' ||
        column.property == 'materialSpecification'
      ) {
        return { fontSize: '16px', fontWeight: '600' }
      } else {
        return { fontSize: '15px' }
      }
    },
    ctrlZQueueAllow(scope) {
      let map = {
        listId: scope.row.listId,
        resultTotalId: scope.row.resultTotalId
      }
      console.log(map)
      this.axios.post('/api/v1/qms/ctrlZQueueAllow', map).then(res => {
        if (res.data.code == 200) {
          this.$message({
            message: '撤销成功',
            type: 'success',
            duration: 2000,
            center: true,
            offset: 100
          })
          this.getNoSpellingArray()
          this.getSpellingArray()
          this.getSpellingArrayTwo()
        } else {
          this.$message({
            message: '撤销失败',
            type: 'error',
            duration: 2000,
            center: true,
            offset: 100
          })
        }
      })
    },
    wantEnfactory() {
      this.axios.get('/api/v1/uc/getQueueCount').then(res => {
        this.totalQueueNum = res.data.data
        console.log(this.totalQueueNum, 'totalQueueNum')
        if (this.i == 0) {
          this.totalQueueNumFirst = this.totalQueueNum
        }
        this.i++
      })
    },
    start() {
      this.timer = setInterval(this.wantEnfactory, 60000)
    },
    refresh() {
      this.getReleaseFlag()
      this.getSpellingArray()
      this.getNoSpellingArray()
      this.getSpellingArrayTwo()
      this.getSteelOrderNum()
      this.getStoreArray()
      this.redDotNum = null
      this.totalQueueNum = null
      this.totalQueueNumFirst = null
      this.isQueryCapacity = null
      this.maplist = []
      this.filterArr1 = []
      this.i = 0
      clearInterval(this.timer)
      this.start()
    },
    getSteelOrderNum() {
      this.axios.get('/api/v1/uc/getSteelOrderNum').then(res => {
        this.steelOrderNum = res.data.data
      })
    },
    getRowKey(row) {
      return row.ROW_ID
    },
    selectInit(row) {
      if (!this.releaseFlag) {
        return true
      }
      //单拼的可勾选控制功能在这
      //过滤出处在同一个网格上的数据
      let gridData = this.tableData1.filter(e => {
        return e.gridId === row.gridId && e.sureTime == null
      })
      //处理下maplist里面的数据
      let reallyMaplist = this.maplist.map(e => {
        return e.resultTotalId
      })
      //在maplist里面的不能进入到gridData里面来,遍历gridData移除在maplist里面的
      let reallyGridData = gridData.filter(e => {
        if (!reallyMaplist.includes(e.resultTotalId)) {
          return e
        }
      })
      //判断当前行是不是在reallyGridData的第一行，如果是就允许勾选,反之不行
      if (
        (reallyGridData.length > 0 &&
          (row.resultTotalId === reallyGridData[0].resultTotalId ||
            row.resultInsertTime != null)) ||
        reallyMaplist.includes(row.resultTotalId)
      ) {
        return true
      } else {
        return false
      }
      // if (this.maplist.length == 0) {
      //   if (row.ROW_ID == 1) {
      //     return true
      //   } else {
      //     return false
      //   }
      // } else {
      //   if (
      //     this.maplist.some(e => {
      //       return (
      //         e.ROW_ID == row.ROW_ID ||
      //         e.ROW_ID + 1 == row.ROW_ID ||
      //         typeof row.ROW_ID == 'undefined'
      //       )
      //     })
      //   ) {
      //     return true
      //   } else {
      //     return false
      //   }
      // }
    },
    selectInitSplleing(row) {
      if (!this.releaseFlag) {
        return true
      }
      if (this.maplist.length == 0) {
        if (row.group + 1 == 1) {
          return true
        } else {
          return false
        }
      } else {
        if (
          this.maplist.some(e => {
            return e.group == row.group || e.group + 1 == row.group
          })
        ) {
          return true
        } else {
          return false
        }
      }
    },
    rowDbClick(row) {
      this.materialList = []
      this.materialList.push(row)
      this.makeSureMaterial()
    },
    cellClikSingle(row, column, cell, event) {
      if (
        column.property == 'materialSpecification' ||
        column.property == 'materialName'
      ) {
        this.materialList = []
        this.materialList.push(row)
        this.makeSureMaterial()
      }
    },
    //物资模态框查询
    onclickMaterial1() {
      this.optionMa.requestUrl =
        '/api/v1/uc/getSteelMaterial?apiId=244&materialNameText=' +
        this.materialNameText +
        '&materialSpecificationText=' +
        this.materialSpecificationText
    },
    onclickMaterial() {
      this.table1 = true
      this.optionMa.requestUrl =
        '/api/v1/uc/getSteelMaterial?apiId=244&i=' + new Date()
    },
    //返回选中的物资信息
    selectionChange2(selection) {
      8
      this.materialList1 = []
      this.materialList1 = selection
      this.materialList = this.materialList.concat(this.materialList1)
    },
    makeSureMaterial() {
      if (this.materialList.length > 0) {
        console.log(this.materialList)
        var materialIdList = []
        this.materialList.forEach(e => {
          if (materialIdList.indexOf(e.materialId) == -1) {
            materialIdList.push(e.materialId)
          }
        })
        let map = {
          materialList: materialIdList
        }
        // this.materialList = []
        // this.materialList1 = []
        if (this.activeName == 'first') {
          this.axios
            .post('/api/v1/qms/getQueueListByQueueUp?isSpelling=0', map)
            .then(res => {
              this.tableData1 = res.data.data
            })
        }
        this.table1 = false
      }
    },
    infomation() {
      this.axios.get('/api/v1/uc/getSteelWarehouse').then(res => {
        console.log(res.data)
        this.option = res.data
      })
    },
    //记录每一行的合并数
    getSpanArr(data) {
      //每次调用方法初始化
      this.spanArr = []
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1)
          this.pos = 0
          data[i].group = i
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].resultTotalId === data[i - 1].resultTotalId) {
            this.spanArr[this.pos] += 1
            this.spanArr.push(0)
            data[i].group = data[i - 1].group
          } else {
            this.spanArr.push(1)
            this.pos = i
            data[i].group = data[i - 1].group + 1
          }
        }
      }
    },
    //记录每一行的合并数
    getSpanArr1(data) {
      //每次调用方法初始化
      this.spanArr1 = []
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr1.push(1)
          this.pos = 0
          data[i].group = i
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].resultTotalId === data[i - 1].resultTotalId) {
            this.spanArr1[this.pos] += 1
            this.spanArr1.push(0)
            data[i].group = data[i - 1].group
          } else {
            this.spanArr1.push(1)
            this.pos = i
            data[i].group = data[i - 1].group + 1
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (
        columnIndex === 0 ||
        columnIndex === 2 ||
        columnIndex === 3 ||
        columnIndex === 4 ||
        columnIndex === 10 ||
        columnIndex === 11 ||
        columnIndex === 12 ||
        columnIndex === 13 ||
        columnIndex === 14 ||
        columnIndex === 15
      ) {
        const _row = this.spanArr[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    objectSpanMethod1({ row, column, rowIndex, columnIndex }) {
      if (
        columnIndex === 0 ||
        columnIndex === 2 ||
        columnIndex === 3 ||
        columnIndex === 4 ||
        columnIndex === 10 ||
        columnIndex === 11 ||
        columnIndex === 12 ||
        columnIndex === 13 ||
        columnIndex === 14 ||
        columnIndex === 15
      ) {
        const _row = this.spanArr1[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },
    handleClick() {
      this.redDotNum = null
      this.totalQueueNum = null
      this.totalQueueNumFirst = null
      this.i = 0
      if (this.activeName == 'first') {
        this.getNoSpellingArray()
      } else if (this.activeName == 'second') {
        this.getSpellingArray()
      } else if (this.activeName == 'fourth') {
        this.getSpellingArrayTwo()
      } else {
        this.getStoreArray()
      }
    },
    getNoSpellingArray() {
      this.axios
        .post('/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=' + new Date())
        .then(res => {
          this.tableData1 = res.data.data
          this.isQueryCapacity = null
          console.log(this.tableData1)
        })
    },
    getSpellingArray() {
      this.axios
        .post(
          '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=' +
            new Date()
        )
        .then(res => {
          this.tableData = res.data.data
          this.isQueryCapacity = null
          console.log(this.tableData)
          this.getSpanArr(this.tableData)
        })
    },
    getSpellingArrayTwo() {
      this.axios
        .post(
          '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=2&i=' +
            new Date()
        )
        .then(res => {
          this.tableData2 = res.data.data
          this.isQueryCapacity = null
          console.log(this.tableData2)
          this.getSpanArr1(this.tableData2)
        })
    },
    getStoreArray() {
      this.axios.post('/api/v1/qms/getStoreQueueList').then(res => {
        this.tableData3 = res.data.data
        console.log('getStoreArray ' + JSON.stringify(this.tableData3))
      })
    },
    onclick() {
      if (this.activeName == 'first') {
        this.axios
          .post(
            '/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=' +
              new Date() +
              '&capacityNumber=' +
              this.capacityNo
          )
          .then(res => {
            this.isQueryCapacity = 1
            this.tableData1 = res.data.data
          })
        console.log('wzxxx')
      } else if (this.activeName == 'second') {
        this.axios
          .post(
            '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=' +
              new Date() +
              '&capacityNumber=' +
              this.capacityNo
          )
          .then(res => {
            this.isQueryCapacity = 1
            this.tableData = res.data.data
            this.getSpanArr(this.tableData)
          })
      } else if (this.activeName == 'fourth') {
        this.axios
          .post(
            '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=2&i=' +
              new Date() +
              '&capacityNumber=' +
              this.capacityNo
          )
          .then(res => {
            this.isQueryCapacity = 1
            this.tableData2 = res.data.data
            this.getSpanArr1(this.tableData2)
          })
      }
    },
    handleSelectionChange(selection) {
      this.maplist = []
      this.maplist = selection
    },
    handleSelectionChangeSpelling(selection) {
      this.maplist = []
      this.maplist = selection
      // console.log(selection)
      // for (let i = 0; i < this.maplist.length; i++) {
      //   if (i + 1 < this.maplist.length) {
      //     if (this.maplist[i].group + 1 != this.maplist[i + 1].group) {
      //       this.$refs.spellData.clearSelection()
      //       this.$refs.twoSpellData.clearSelection()
      //     }
      //   }
      // }
      // // 限制只取第一个去掉
      // if (
      //   !this.maplist.some(e => {
      //     return e.group == 0
      //   })
      // ) {
      //   this.$refs.spellData.clearSelection()
      //   this.$refs.twoSpellData.clearSelection()
      // }
    },
    updateBill(scope) {
      console.log(scope.row.capacityId)
      this.$router.push(
        `/editBill/${scope.row.capacityId}/${scope.row.capacityNumber}`
      )
    },
    filterArr(resultId) {
      console.log('fdhjsaj')
      this.filterArr1 = []
      if (this.activeName == 'first') {
        this.filterArr1 = this.filterArr1.concat(
          this.tableData1.filter(ele => ele.resultId == resultId)
        )
      } else if (this.activeName == 'second') {
        this.filterArr1 = this.filterArr1.concat(
          this.tableData.filter(ele => ele.resultId == resultId)
        )
      } else if (this.activeName == 'fourth') {
        this.filterArr1 = this.filterArr1.concat(
          this.tableData2.filter(ele => ele.resultId == resultId)
        )
      }
    },
    allow() {
      if (this.maplist.length == 0) {
        this.$message({
          message: '请选择需要放行的车辆',
          type: 'error',
          duration: 2000,
          center: true,
          offset: 100
        })
        return
      }
      for (let i = 0; i < this.maplist.length; i++) {
        console.log(typeof this.maplist[i].id)
        if (
          typeof this.maplist[i].id == 'undefined' ||
          this.maplist[i].id == null ||
          this.maplist[i].id == 'null'
        ) {
          this.$message({
            message: '请选择装货点',
            type: 'error',
            duration: 2000,
            center: true,
            offset: 100
          })
          return
        }
        let warehouse = this.tableData3.find(
          value => value.materialPriority === this.maplist[i].id
        )
        console.log('warehouse', warehouse)
        if (warehouse && warehouse.carQueue >= 30) {
          this.$message({
            message: '该仓库已经有30辆车在排队，不允许放行！',
            type: 'error',
            duration: 2000,
            center: true,
            offset: 100
          })
          return
        }
        this.filterArr(this.maplist[i].resultId)
      }
      console.log(this.filterArr1, 'this.fil')
      var filterArr2 = []
      this.filterArr1.forEach(e => {
        if (filterArr2.indexOf(e) === -1) {
          filterArr2.push(e)
        }
      })
      let map = {
        ssoId: getCookie('userId'),
        mapList: filterArr2,
        isQueryCapacity: this.isQueryCapacity
      }
      if (this.activeName == 'first') {
        map.mapList = this.maplist
      }
      console.log('勾选的数据')
      console.log(map)
      this.axios
        .post('/api/v1/qms/allowEnFactory', map)
        .then(res => {
          if (res.data.code == '200') {
            this.$message({
              message: '放行成功，等待进厂',
              type: 'success',
              duration: 2000,
              center: true,
              offset: 100
            })
            this.maplist = []
            this.filterArr1 = []
            this.$refs.mutiData.clearSelection()
            this.$refs.spellData.clearSelection()
            this.$refs.twoSpellData.clearSelection()
            // this.getNoSpellingArray()
            this.makeSureMaterial()
            this.getSpellingArray()
            this.getSpellingArrayTwo()
            this.getStoreArray()
            this.redDotNum = null
            this.totalQueueNum = null
            this.totalQueueNumFirst = null
            this.i = 0
            clearInterval(this.timer)
            this.start()
          } else {
            this.$message({
              message: '请按顺序勾选',
              type: 'error',
              duration: 2000,
              center: true,
              offset: 100
            })
            this.maplist = []
            this.filterArr1 = []
            this.$refs.mutiData.clearSelection()
            this.$refs.spellData.clearSelection()
            this.$refs.twoSpellData.clearSelection()
            // this.getNoSpellingArray()
            this.makeSureMaterial()
            this.getSpellingArray()
            this.getStoreArray()
            this.getSpellingArrayTwo()
            this.redDotNum = null
            this.totalQueueNum = null
            this.totalQueueNumFirst = null
            this.i = 0
            clearInterval(this.timer)
            this.start()
          }
        })
        .catch(e => {
          console.log(e)
          this.maplist = []
          this.filterArr1 = []
          this.$refs.mutiData.clearSelection()
          this.$refs.spellData.clearSelection()
          this.$refs.twoSpellData.clearSelection()
          this.getNoSpellingArray()
          this.getSpellingArray()
          this.getStoreArray()
          this.getSpellingArrayTwo()
          this.redDotNum = null
          this.totalQueueNum = null
          this.totalQueueNumFirst = null
          this.i = 0
          clearInterval(this.timer)
          this.start()
        })
    },
    changePriority(row) {
      console.log('装货点：' + row.id)
      console.log('订单id' + row.orderId)
      console.log('物资ID' + row.materialId)
      let map = {
        id: row.id,
        orderId: row.orderId,
        materialId: row.materialId
      }
      this.axios.post('/api/v1/qms/modifyLoadWarehouse', map).then(res => {
        console.log(res)
        if (res.data.code == '200') {
          this.$message({
            message: '更新装货点成功',
            type: 'success',
            duration: 2000,
            center: true,
            offset: 100
          })
        } else {
          this.$message({
            message: '更新装货点失败',
            type: 'error',
            duration: 2000,
            center: true,
            offset: 100
          })
        }
      })
      //this.axios.post("")
    }
  }
}
</script>
<style lang="scss" scoped>
.sale {
  .top {
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    padding-left: 40px;
    .el-form {
      display: flex;
      justify-content: center;
      align-items: center;
      .el-form-item__label {
        align-items: center;
        line-height: 80px;
      }
    }
  }
  .input {
    width: 250px;
    margin-right: 20px;
  }
  .tabs {
    margin-left: 20px;
    margin-top: 10px;
    .tabs /deep/ .el-tabs__nav {
      font-size: 40px;
    }
  }
}
</style>