<template>
<div class="vehicle">
  <Query
    class="vehicle__query"
    :selectedIds="selectedIds"
    @getList="getList"
    @toShowCreator="toShowCreator"
  ></Query>
  <List
    :list="vehicleList"
    :currentNo="currentNo"
    :pageSize="pageSize"
    :total="total"
    @getList="getList"
    @selectionChange="cacheSelectedIds"
    @toShowCreator="toShowCreator"
  ></List>
  <Creator
    :showCreator="showCreator"
    :mode="mode"
    :detailData="detailData"
    @close="close"
    @createDone="getList"
  ></Creator>
</div>
</template>

<script>
import Query from './components/Query'
import List from './components/List'
import Creator from './components/Creator'

export default {
  name: 'Vehicle',
  components: { Query, List, Creator },
  created () {},
  mounted () {
    this.getList()
  },

  data () {
    return {
      query: {
        'page.currentPage': 1,
        'page.limitCount': 20,
      }, // 查询条件
      queryParams: {}, // 路由查询参数
      vehicleList: [], // 盘点列表
      total: 0, // 总数据量
      selectedIds: '', // 选中的id字符串序列 (','隔开)
      showCreator: false, // 新增框不显示
      mode: 'create', // 新增弹窗的模式
      detailData: {}, // 详情信息
      currentNo: 1,
      pageSize: 10
    }
  },
  methods: {
    // 获取盘点列表
    getList (query = {}) {
      const url = this.$API.warehouseBasic.vehicle.getList
      const param = { ...this.query, ...query }
      this.$https.post(url, param)
        .then(data => {
          this.vehicleList = data.rows
          this.total = data.total
          this.currentNo = data.currentPage
          this.pageSize = data.limit
        })
    },
    // 勾选变化, 缓存id
    cacheSelectedIds (ids) {
      this.selectedIds = ids
    },
    // 显示新增表单
    toShowCreator (mode = 'create', detailData = {}) {
      this.showCreator = true
      this.mode = mode
      this.detailData = detailData
    },
    // 关闭新增窗
    close () {
      this.showCreator = false
    }
  },
}
</script>

<style lang="scss" scoped>
.vehicle__query {
  margin-bottom: 20px;
}
</style>
