<template>
  <div class="app-container">
    <head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
    <base-table
      :page="listQuery.current"
      :limit="listQuery.size"
      :height="tableH"
      :table-config="tableProps"
      :table-data="list"
      :is-loading="listLoading"
      @clickTopBtn="clickTopBtn"
    />
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="listQuery.current"
      :limit.sync="listQuery.size"
      @pagination="getList()"
    />
  </div>
</template>
<script>
import HeadForm from '@/components/basicData/HeadForm'
import BaseTable from '@/components/BaseTable'
import Pagination from '@/components/Pagination'
import { tableHeight } from '@/utils/index'
import { getInventoryNoList, getMaterialCodeList, getProductSpecList, getTrayList, getNameList, getGoodsList } from '@/utils/wmsDic'
import moment from 'moment'
const tableProps = [
  {
    prop: 'inventoryNumber',
    label: '盘点单号'
  },
  {
    prop: 'productName',
    label: '盖板玻璃或背板玻璃'
  },
  {
    prop: 'spec',
    label: '规格'
  },
  {
    prop: 'materialCode',
    label: '物料编码'
  },
  {
    prop: 'trayID',
    label: '托盘号'
  },
  {
    prop: 'num',
    label: '库存数量'
  },
  {
    prop: 'takeNum',
    label: '盘点数量'
  },
  {
    prop: 'takeTime',
    label: '盘点时间'
  },
  {
    prop: 'operator',
    label: '操作人'
  }
]
export default {
  name: 'StockTaking',
  components: { HeadForm, BaseTable, Pagination },
  data() {
    return {
      headFormConfig: [
        {
          type: 'input',
          label: '关键字',
          placeholder: '盘点单号,盖板玻璃或背板玻璃,物料编码',
          param: 'name',
          width: 250
        },
        {
          type: 'datePicker',
          label: '时间范围',
          dateType: 'daterange',
          format: 'yyyy-MM-dd',
          valueFormat: 'yyyy-MM-dd',
          rangeSeparator: '-',
          startPlaceholder: '开始时间',
          endPlaceholder: '结束时间',
          param: 'searchTime'
        },
        {
          type: 'button',
          btnName: 'btn.search',
          name: 'search',
          color: 'primary'
        }
      ],
      listQuery: {
        current: 1,
        size: 20
      },
      tableH: tableHeight(275),
      tableProps,
      list: [],
      listLoading: false,
      total: 0,
      showTitle: ''
    }
  },
  mounted() {
    window.addEventListener('resize', () => {
      this.tableH = tableHeight(275)
    })
    this.getList()
  },
  methods: {
    getList() {
      const temp = []
      const num = 20
      for (let i = 0; i < num; i++) {
        const obj = {}
        obj.inventoryNumber = getInventoryNoList()
        obj.productName = getGoodsList()
        obj.spec = getProductSpecList()
        obj.materialCode = getMaterialCodeList()
        obj.trayID = getTrayList()
        obj.num = Math.floor(Math.random() * 2000)
        obj.takeNum = parseInt(Math.random() * 2) ? obj.num + Math.floor(Math.random() * 20 - 10) : obj.num
        const sj = Math.floor(Math.random() * 5)
        obj.takeTime = moment().add(sj, 'days').add(sj, 'hour').add(sj, 'minutes').add(sj, 'seconds').format('YYYY-MM-DD hh:mm:ss')
        obj.operator = getNameList()
        temp.push(obj)
      }
      this.list = temp
      this.total = num
    },
    btnClick(val) {
      console.log(val)
      this.getList()
    },
    clickTopBtn(val) {
      console.log(val)
      this.$refs.inStoreDocumentsAdd.init()
      this.showTitle = '新增'
    }
  }
}
</script>
