<template>
  <div style="box-sizing:border-box;padding:20px;">
    <el-card>
      <div slot="header">
        <span>各品类库存情况统计表</span>
        <span style="margin-left: 50px;">选择仓库：</span>
        <el-select v-model="value" collapse-tags multiple clearable placeholder="请选择" @change="getstockManagerAllPrice">
          <el-option v-for="item in selList" :key="item.id" :label="item.name" :value="item.id">
          </el-option>
        </el-select>
      </div>
      <el-table :data="tableData" style="width: 100%" border show-summary>
        <el-table-column prop="categoryName" label="类别">
        </el-table-column>
        <el-table-column sortable prop="qty" label="库存数量（套）">
        </el-table-column>
        <el-table-column sortable prop="allPrice" label="成本（元）">
        </el-table-column>
        <el-table-column prop="" label="备注">
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
import { stockManagerAllPrice } from '@/api/referCostPrice'
import { getStockListStock } from '@/api/setting'
export default {
  data() {
    return {
      tableData: [],
      selList: [],
      value: []
    }
  },
  mounted() {
    getStockListStock({
      pageNum: 1,
      pageSize: -1
    })
      .then(res => {
        this.selList = res.data.records;
        res.data.records.map(item => ({ dictCode: item.id, dictValue: item.name }))
      });
    this.getstockManagerAllPrice();
  },
  methods: {
    getstockManagerAllPrice(correspondIds = []) {
      stockManagerAllPrice({
        correspondId: correspondIds.join(",")
      }).then(res => {
        this.tableData = res.data
        console.log(res.data)
      })
    }
  },
}
</script>

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