<template>
  <div>
    <div class="mrg-b">
      <el-table id="table" ref="table" stripe border :max-height="tableMaxHeight" :data="tableData" >
        <template v-if="tabIndex===0">
          <table-column label="入库单号" prop="asnNo">
            <template slot-scope="scope">
              <p class="blue" @click="getAllData('asnNo','getHeaderByAsnNo',scope.row)">{{ scope.row.asnNo }}</p>
            </template>
          </table-column>
          <table-column label="状态">
            <template slot-scope="scope">
              <p>{{ $utils.keyMatcher(scope.row.status, $keys.stockIn.status).name }}</p>
            </template>
          </table-column>
          <table-column label="数量">
            <template slot-scope="scope">
              <p>已收：{{scope.row.qtyRcvEa}}</p>
              <p>已上：{{scope.row.qtyPaEa}}</p>
              <p>未上：{{scope.row.notQtyPaEa}}</p>
            </template>
          </table-column>
          <table-column label="重量">
            <template slot-scope="scope">
              <p>已收：{{scope.row.rcvWeight}}</p>
              <p>已上：{{scope.row.paWeight}}</p>
              <p>未上：{{scope.row.notPaWeight}}</p>
            </template>
          </table-column>
          <table-column label="类型">
            <template slot-scope="scope">{{ $utils.keyMatcher(scope.row.asnType, $keys.stockIn.asnType).name }}</template>
          </table-column>
          <table-column label="货主">
            <template slot-scope="scope">
              <p>{{ scope.row.ownerCode }}</p>
              <p>{{ scope.row.ownerName }}</p>
            </template>
          </table-column>
          <table-column label="供应商" prop="supplierName"></table-column>
          <table-column label="物流单号" prop="logisticNo"></table-column>
          <table-column label="订单时间" prop="orderTime"></table-column>
          <table-column label="操作">
            <template slot-scope="scope">
              <el-tooltip content="上架" placement="top">
                <el-button v-auth="50100030107" size="mini" plain
                  type="primary" icon="el-icon-info" circle  @click="handlePutaway(scope.row)"></el-button></el-tooltip>
            </template>
          </table-column>
        </template>

        <template v-if="tabIndex===1">
          <table-column label="质检单号" prop="qcNo"></table-column>
          <table-column label="入库单号" prop="asnNo">
            <template slot-scope="scope">
              <p class="blue" @click="getAllData('asnNo','getHeaderByAsnNo',scope.row)">{{scope.row.asnNo}}</p>
            </template>
          </table-column>
          <table-column label="状态">
            <template slot-scope="scope">
              <p>{{ $utils.keyMatcher(scope.row.status, $keys.stockIn.status).name }}</p>
            </template>
          </table-column>
          <table-column label="数量">
            <template slot-scope="scope">
              <p>已收：{{scope.row.qtyRcvEa}}</p>
              <p>已上：{{scope.row.qtyPaEa}}</p>
              <p>未上：{{scope.row.notQtyPaEa}}</p>
            </template>
          </table-column>
          <table-column label="类型" prop="asnType">
            <template slot-scope="scope">
              <p>{{ $utils.keyMatcher(scope.row.asnType, $keys.stockIn.asnType).name }}</p>
            </template>
          </table-column>
          <table-column label="货主" prop="vehicleType">
             <template slot-scope="scope">
              <p>{{scope.row.ownerCode}}</p>
              <p>{{scope.row.ownerName}}</p>
            </template>
          </table-column>
          <table-column label="供应商" prop="supplierName"></table-column>
          <table-column label="物流单号" prop="logisticNo"></table-column>
          <table-column label="订单时间" prop="orderTime"></table-column>
          <table-column label="操作">
            <template slot-scope="scope">
              <el-tooltip content="上架" placement="top">
                <el-button v-auth="50100030107" size="mini" plain
                  type="primary" icon="el-icon-info" circle @click="handlePutaway(scope.row)"></el-button></el-tooltip>
            </template>
          </table-column>
        </template>
        <template v-if="tabIndex===2">
          <table-column label="出库单号" prop="soNo">
            <template slot-scope="scope">
              <p class="blue" @click="getAllData('soNo','getHeaderBySoNo',scope.row)">{{scope.row.soNo}}</p>
            </template>
          </table-column>
          <table-column label="状态">
            <template slot-scope="scope">
              <p>{{ $utils.keyMatcher(scope.row.status, $keys.stockIn.status).name }}</p>
            </template>
          </table-column>
          <table-column label="数量">
            <template slot-scope="scope">
              <p>已上：{{scope.row.qtyPaEa}}</p>
              <p>未上：{{scope.row.noQtyPaEa}}</p>
            </template>
          </table-column>
          <table-column label="类型">
            <template slot-scope="scope">
              <p>{{ $utils.keyMatcher(scope.row.soType, $keys.stockOut.soType).name }}</p>
            </template>
          </table-column>
          <table-column label="货主">
            <template slot-scope="scope">
              <p>{{scope.row.ownerCode}}</p>
              <p>{{scope.row.ownerName}}</p>
            </template>
          </table-column>
          <table-column label="订单时间" prop="orderTime"></table-column>
          <table-column label="操作">
            <template slot-scope="scope">
              <el-tooltip content="上架" placement="top">
                <el-button v-auth="50100030107" size="mini" plain
                  type="primary" icon="el-icon-info" circle @click="handlePutaway(scope.row)" ></el-button></el-tooltip>
            </template>
          </table-column>
        </template>
      </el-table>
    </div>
    <div>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
  </div>
</template>
<script>
import { time } from 'apec-fe-utils'
export default {
  data () {
    return {
    }
  },
  props: {
    tableData: Array,
    pageSize: Number,
    currentPage: Number,
    total: Number,
    tabIndex: Number,
  },
  mounted () {
  },
  methods: {

    getData (url, param) {
      return this.$https.post(url, param)
    },

    getAllData (key, urlKey, row) {
      const getHeaderBySoNo = this.$API.stockIn.Putaway[urlKey]
      const queryTaskPa = this.$API.stockIn.Putaway.queryTaskPa
      const getUserName = this.$API.stockIn.Putaway.getUserName
      const param = { orderNo: row[key], 'page.currentPage': 1, 'page.limitCount': 10 }
      const headParam = { [key]: row[key] }
      this.$https.all([this.getData(getHeaderBySoNo, headParam), this.getData(queryTaskPa, param)]).then(res => {
        let head = res[0]
        const list = res[1].rows
        this.$https.post(getUserName, { creator: res[0].creator, modifier: res[0].modifier }).then(res => {
          head = { ...head, ...res.data }
          this.$emit('handleOpenForm', 'detail', head, list)
        })
      })
    },
    handlePutaway (row) {
      const url = this.$API.stockIn.Putaway.comfirmTaskPaByOrderNo
      const param = { orderNo: row.asnNo }
      this.$https.post(url, param).then(res => {

      })
    },

    // 每页显示条数
    handleSizeChange (pageSize) {
      const query = { 'page.limitCount': pageSize, 'page.currentPage': this.currentPage }
      this.$emit('getList', this.urlKey, query)
    },

    // 当前页码
    handleCurrentChange (currentPage) {
      const query = { 'page.limitCount': this.pageSize, 'page.currentPage': currentPage }
      this.$emit('getList', this.urlKey, query)
    },

  },
  watch: {

  }

}
</script>
<style lang="scss">
.mrg-b {
  margin-bottom: 20px;
}
.mrg-l {
  margin-left: 10px;
}
.blue {
  cursor: pointer;
  color: #0682ea;
}

</style>
