wms-vue/src/views/modules/haianWarehouse/warehouse/labelQueryLocation54.vue

<template>
  <div class="mod-config">
    <el-form :inline="true" label-position="top">
      <el-form-item label="工厂编码">
        <el-input v-model="site" style="width: 100px" disabled></el-input>
      </el-form-item>
      <el-form-item label="入库状态">
        <el-select v-model="queryHeaderData.inStockFlag" placeholder="请选择" style="width: 120px;">
          <el-option label="全部" value=""></el-option>
          <el-option label="未入库" value="X"></el-option>
          <el-option label="已出库" value="N"></el-option>
          <el-option label="在库" value="Y"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="本期盘点">
        <el-select v-model="queryHeaderData.countFlag" placeholder="请选择" style="width: 120px;">
          <el-option label="全部(ALL)" value=""></el-option>
          <el-option label="Y" value="Y"></el-option>
          <el-option label="N" value="N"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="物料编号(手动加%)">
        <el-input style="width: 120px;" v-model="queryHeaderData.partNo" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="批次号">
        <el-input style="width: 120px;" v-model="queryHeaderData.batchNo" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="库位">
        <el-input style="width: 120px;" v-model="queryHeaderData.locationId" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="标签ID">
        <el-input style="width: 120px;" v-model="queryHeaderData.unitId" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="物料描述">
        <el-input style="width: 120px;" v-model="queryHeaderData.partDesc" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="所在栈板">
        <el-input style="width: 120px;" v-model="queryHeaderData.palletId" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item label="栈板所在区域">
        <el-input style="width: 120px;" v-model="queryHeaderData.stationArea" @keyup.enter.native="getDataList()"></el-input>
      </el-form-item>
      <el-form-item style="margin-top: 20px;">
        <el-button @click="getDataList()" type="primary">{{ $t('warehouse.common.search') }}</el-button>
        <el-button @click="resetQuery()">{{ $t('warehouse.common.reset') }}</el-button>
      </el-form-item>
    </el-form>

    <el-table
      :height="height"
      :data="dataList"
      border
      v-loading="dataListLoading"
      style="width: 100%; margin-bottom: 15px;">
      <el-table-column prop="unitId" label="标签ID" min-width="150" header-align="center" align="center"></el-table-column>
      <el-table-column prop="site" label="工厂" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="partNo" label="物料编号" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="qty" label="数量" min-width="80" header-align="center" align="right"></el-table-column>
      <el-table-column prop="palletId" label="所在栈板" min-width="90" header-align="center" align="center"></el-table-column>
      <el-table-column prop="callingFlag" label="是否调用" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="remark" label="最近一次调用备注" min-width="180" header-align="center" align="left" show-overflow-tooltip></el-table-column>
      <el-table-column prop="position" label="位置" min-width="70" header-align="center" align="center"></el-table-column>
      <el-table-column prop="layer" label="层数" min-width="70" header-align="center" align="center"></el-table-column>
      <el-table-column prop="stationId" label="站点" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="stationArea" label="区域" min-width="90" header-align="center" align="center"></el-table-column>
      <el-table-column prop="asrsFloor" label="立库楼层" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="batchNo" label="批次号" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="locationId" label="库位" min-width="100" header-align="center" align="center"></el-table-column>
      <el-table-column prop="warehouseId" label="仓库" min-width="100" header-align="center" align="center"></el-table-column>
      <el-table-column prop="partDesc" label="物料描述" min-width="150" header-align="center" align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="height" label="高度(mm)" min-width="100" header-align="center" align="right"></el-table-column>
      <el-table-column prop="reserveFlag" label="是否预留" min-width="80" header-align="center" align="center">
        <template slot-scope="scope">{{ scope.row.reserveFlag === 'Y' ? '是' : '否' }}</template>
      </el-table-column>
      <el-table-column prop="reserveOrderRef1" label="预留单号1" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="reserveOrderRef2" label="预留单号2" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="reserveOrderRef3" label="预留单号3" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="wdr" label="WDR" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="engChgLevel" label="版本号" min-width="80" header-align="center" align="center"></el-table-column>
      <el-table-column prop="expiredDate" label="失效日期" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="receiveDate" label="接收日期" min-width="120" header-align="center" align="center"></el-table-column>
      <el-table-column prop="countFlag" label="本期盘点" min-width="90" header-align="center" align="center"></el-table-column>
      <el-table-column prop="lastCountDate" label="最后盘点日期" min-width="150" header-align="center" align="center">
        <template slot-scope="scope">{{ formatDate(scope.row.lastCountDate) }}</template>
      </el-table-column>
    </el-table>

    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>
  </div>
</template>

<script>
import { haiAnGetHandlingUnitLabelListLocation } from '@/api/haianWarehouse/labelQueryLocation'

export default {
  name: 'labelQueryLocation54',
  data() {
    return {
      site: this.$store.state.user.site,
      dataList: [],
      pageIndex: 1,
      pageSize: 50,
      totalPage: 0,
      dataListLoading: false,
      height: 500,
      queryHeaderData: {
        inStockFlag: 'Y',
        countFlag: '',
        partNo: '',
        batchNo: '',
        locationId: '',
        unitId: '',
        partDesc: '',
        stationArea: '',
        palletId: ''
      }
    }
  },
  activated() {
    this.getDataList()
    this.getHeight()
  },
  mounted() {
    this.getDataList()
    this.getHeight()
  },
  methods: {
    // 标签查询沿用旧handling_unit，但后端会通过haian_pallet_detail关联海安托盘位置信息 - rqrq
    getDataList() {
      this.dataListLoading = true
      this.site = this.$store.state.user.site
      const params = {
        page: this.pageIndex,
        size: this.pageSize,
        site: this.site,
        ...this.queryHeaderData
      }
      haiAnGetHandlingUnitLabelListLocation(params).then(({ data }) => {
        if (data && data.code === 0) {
          this.dataList = data.page.list || []
          this.totalPage = data.page.totalCount || 0
        } else {
          this.dataList = []
          this.totalPage = 0
          this.$alert(data.msg || this.$t('warehouse.message.queryFailed'), this.$t('warehouse.common.error'), { confirmButtonText: this.$t('warehouse.common.confirm') })
        }
      }).catch(() => {
        this.dataList = []
        this.totalPage = 0
        this.$alert('查询失败，请稍后重试', this.$t('warehouse.common.error'), { confirmButtonText: this.$t('warehouse.common.confirm') })
      }).finally(() => {
        this.dataListLoading = false
      })
    },
    resetQuery() {
      this.queryHeaderData = {
        inStockFlag: 'Y',
        countFlag: '',
        partNo: '',
        batchNo: '',
        locationId: '',
        unitId: '',
        partDesc: '',
        stationArea: '',
        palletId: ''
      }
      this.pageIndex = 1
      this.getDataList()
    },
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()
    },
    formatDate(date) {
      if (!date) return ''
      const d = new Date(date)
      const year = d.getFullYear()
      const month = String(d.getMonth() + 1).padStart(2, '0')
      const day = String(d.getDate()).padStart(2, '0')
      const hours = String(d.getHours()).padStart(2, '0')
      const minutes = String(d.getMinutes()).padStart(2, '0')
      const seconds = String(d.getSeconds()).padStart(2, '0')
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
    },
    getHeight() {
      this.$nextTick(() => {
        this.height = window.innerHeight - 220
      })
    }
  }
}
</script>

<style scoped>
.mod-config .el-form-item {
  margin-bottom: 15px;
}
</style>