<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <div v-if="crud.props.searchToggle">
        <el-form
          :inline="true"
          class="demo-form-inline"
          label-position="right"
          label-width="90px"
          label-suffix=":"
        >
          <el-form-item label="查询时间">
            <el-date-picker
              v-model="query.start_time"
              value-format="yyyy-MM-dd"
              type="month"
              style="width: 240px;"
              placeholder="选择日期时间"
            />
          </el-form-item>
          <!-- <el-form-item label="结束时间">
            <el-date-picker
              v-model="form.end_time"
              value-format="yyyy-MM-dd"
              type="date"
              style="width: 240px;"
              placeholder="选择日期时间"
            />
          </el-form-item> -->
          <rrOperation />
        </el-form>
      </div>
      <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
      <crudOperation :permission="permission" />

      <!--表格渲染-->
      <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
        <el-table-column type="selection" width="55" />
        <el-table-column prop="supplierCode" label="客户编码" />
        <el-table-column prop="supplierName" label="客户名称" />
        <el-table-column prop="productName" label="物料编码" />
        <el-table-column prop="date" label="日期"/>
        <el-table-column prop="specification" label="规格" />
        <el-table-column prop="batch" label="来料批次" />
        <el-table-column prop="barLevel" label="棒源等级" />
        <el-table-column label="上月结存">
          <el-table-column prop="sy_length" label="实际长度(mm)" />
          <el-table-column prop="sy_weight" label="实际重量(KG)" />
        </el-table-column>
        <el-table-column label="来料入库">
          <el-table-column prop="ll_length" label="实际长度(mm)" />
          <el-table-column prop="ll_weight" label="实际重量(KG)" />
        </el-table-column>
        <el-table-column prop="pickingBatch" label="领料批次" />
        <el-table-column label="生产领料">
          <el-table-column prop="sc_length" label="实际长度(mm)" />
          <el-table-column prop="sc_weight" label="实际重量(KG)" />
        </el-table-column>
        <el-table-column label="结存">
          <el-table-column prop="jc_length" label="实际长度(mm)" />
          <el-table-column prop="jc_weight" label="实际重量(KG)" />
        </el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination />
    </div>
  </div>
</template>

<script>
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import crudMdBaseWorkShop from '@/views/wms/basedata/workshop/mdBaseWorkshop'
import crudSchBasePoint from '@/views/wms/sch/point/schBasePoint'
import crudSchBaseRegion from '@/views/wms/sch/region/schBaseRegion'

const defaultForm = {
  group_id: null,
  vehicle_code: null,
  vehicle_type: null,
  material_id: null,
  child_vehicle_code: null,
  source_vehicle_code: null,
  point_code: null,
  point_name: null,
  is_full: true,
  pcsn: null,
  instorage_time: null,
  standing_time: null,
  material_qty: null,
  material_weight: null,
  workorder_code: null,
  group_number: null,
  task_code: null,
  ext_data: null,
  workshop_code: null,
  group_status: null,
  table_name: null,
  table_fk: null,
  table_fk_id: null,
  buss_move_id: null,
  is_first_flow_task: true,
  flow_code: null,
  flow_num: null,
  before_task_code: null,
  next_task_code: null,
  remark: null,
  is_delete: false
}
export default {
  name: 'Data',
  dicts: ['group_status', 'group_bind_material_status', 'vehicle_type'],
  components: { pagination, crudOperation, rrOperation, udOperation },
  mixins: [presenter(), header(), form(defaultForm), crud()],
  cruds() {
    return CRUD({
      title: '库存统计报表',
      url: 'api/materialData',
      idField: 'group_id',
      sort: 'pointCode,desc',
      optShow: {
        add: false,
        edit: false,
        del: false,
        download: false,
        reset: false
      },
      query: {
      },
      crudMethod: { }
    })
  },
  data() {
    return {
      permission: {
      },
      rules: {
      },
      workShopList: [],
      pointList: [],
      regionList: [],
      supplierNameList: [],
      productDescriptionList: [],
      choose: '物料'
    }
  },
  created() {
    this.getWorkShopList()
    this.getPointList()
    this.getRegionList()
    this.getSupplierNameList()
    this.getProductDescriptionList()
  },
  methods: {
    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
    [CRUD.HOOK.beforeRefresh]() {
      return true
    },
    getWorkShopList() { // 获取车间列表
      crudMdBaseWorkShop.getWorkShopList().then(res => {
        this.workShopList = res
      })
    },
    getRegionList() {
      crudSchBaseRegion.getRegionList().then(res => {
        this.regionList = res
      })
    },
    getPointList() { // 获取点位列表
      crudSchBasePoint.getPointList().then(res => {
        this.pointList = res
      })
    },
    tableChanged(row) {
      this.form.material_name = row.material_name
      this.form.material_id = row.material_id
      this.form.material_spec = row.material_spec
      this.form.material_code = row.material_code
      if (this.choose === '工单') {
        this.form.workorder_code = row.workorder_code
      }
    },
    clearMaterial() {
      this.form.material_name = null
      this.form.material_id = null
      this.form.material_spec = null
      this.form.material_code = null
    },
    setPointName(data) {
      var point = this.pointList.find(item => item.point_code === data)
      this.form.point_name = point.point_name
    },
    hand(value) {
      this.crud.toQuery()
    }
  }
}
</script>

<style scoped>

</style>
