<template>
  <div class="app-container">
    <div>
      <el-row v-for="(row, index) in rowCount" :key="index">
        <el-col v-for="(col, index) in gridCount" :key="index" :span="span">
          <div class="grid-content bg-purple-dark shelf-grid-wrap">
            <div class="shelf-grid" />
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
import { LoadShelInfo } from '@/api/stock/shelf'
export default {
  name: 'StockShelf',
  data: function() {
    return {
      rowCount: 2,
      gridCount: 5
    }
  },
  computed: {
    shelfId: function() {
      return this.$route.query.id
    },
    span: function() {
      const colCount = this.gridCount <= 0 ? 1 : this.gridCount
      const count = Math.floor(24 / colCount)
      return count
    }
  },
  created() {
    if (!this.$route.query.id || this.$route.query.id <= 0) {
      this.$alert('参数无效', { type: 'error' })
    } else {
      this.loadShelInfo()
    }
  },
  methods: {
    loadShelInfo() {
      const shelfId = this.shelfId
      LoadShelInfo({ shelfId }).then((res) => {

      })
    }
  }
}
</script>
<style lang="scss" scoped>
.shelf-grid-wrap {
  height: 150px;
  margin: 5px;
  background-color: #eee;
}
</style>
