<template>
  <div class="app-container">
    <div>
      <el-form :model="search" inline>
        <el-form-item label="年">
          <el-input v-model="search.year" placeholder="输入年份"></el-input>
        </el-form-item>
        <el-form-item label="周">
          <el-input v-model="search.week" placeholder="输入周"></el-input>
        </el-form-item>
        <el-form-item label="日期" style="float: right">
          <el-button-group>
            <el-button type="primary" @click="searchDate(1)">周一</el-button>
            <el-button type="primary" @click="searchDate(2)">周二</el-button>
            <el-button type="primary" @click="searchDate(3)">周三</el-button>
            <el-button type="primary" @click="searchDate(4)">周四</el-button>
            <el-button type="primary" @click="searchDate(5)">周五</el-button>
            <el-button type="primary" @click="searchDate(6)">周六</el-button>
            <el-button type="primary" @click="searchDate(7)">周日</el-button>
          </el-button-group>
        </el-form-item>
      </el-form>
    </div>

    <pagination
      :total="pagination.total"
      :page.sync="pagination.pageNum"
      :limit.sync="pagination.pageSize"
      @pagination="getMaterialRequisitionList"
    />
    <vxe-table :data="MaterialRequisitionList" stripe>
      <vxe-column type="seq" width="60"></vxe-column>
      <vxe-column field="year" title="年"></vxe-column>
      <vxe-column field="week" title="周"></vxe-column>
      <vxe-column field="date" title="日"></vxe-column>
      <vxe-column field="id" title="流水号"></vxe-column>
      <vxe-column field="workblankpartnumber" title="毛坯零件号"></vxe-column>
      <vxe-column field="requirenum" title="需要的数量"></vxe-column>
      <vxe-column title="状态" fixed="right">
        <template>
          <vxe-button type="text" status="primary" content="未领料"></vxe-button>
        </template>
      </vxe-column>
    </vxe-table>
  </div>
</template>

<script>
import { getMRlist } from '@/api/warehouseManagement/materials_requisition.js'
export default {
  name: 'materials_requisition',
  data() {
    return {
      search: {
        year: new Date().getFullYear(),
        week: 1,
        date: 0,
      },
      pagination: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      MaterialRequisitionList: [], //领料单list
    }
  },
  mounted() {
    this.getMaterialRequisitionList()
  },
  methods: {
    //todo  获取领料单
    getMaterialRequisitionList() {
      const query = { ...this.search, ...this.pagination }
      getMRlist(query).then((res) => {
        if (res.code == 200) {
          this.MaterialRequisitionList = res.data.item1
          this.search.total = res.data.item2
        }
      })
    },
    searchDate(item) {
      this.search.date = item
      this.getMaterialRequisitionList()
    },
  },
}
</script>

<style lang="scss" scoped></style>
