<template>
  <div>
    <el-row>
      <SearchForm v-model="taskList" v-model:showAddWmsTask="showAddWmsTask" v-model:searchParams="searchParams" style="width: 100%" ref="searchForm"></SearchForm>
    </el-row>
    <el-row>
      <WmsTaskList
          v-model="taskList"
          v-model:searchParams="searchParams"
          @page-change="pageChange">
      </WmsTaskList>
    </el-row>
<!--    添加 Wms 任务的弹窗-->
    <AddWmsTask v-model="showAddWmsTask"></AddWmsTask>
  </div>
</template>

<script>
// import  《组件名称》  from '《组件路径》 ';
import SearchForm from "@/view/component/wmsTask/SearchForm.vue";
import WmsTaskList from "@/view/component/wmsTask/WmsTaskList.vue";
import AddWmsTask from "@/view/component/wmsTask/AddWmsTask.vue";

export default {
  // import 引入的组件需要注入到对象中才能使用
  components: {AddWmsTask, WmsTaskList, SearchForm },
  props: {},
  data() {
    // 这里存放数据
    return {
      // 查找参数，用于传递使用，具体定义在SearchForm组件内
      searchParams: {
        // 查询关键字
        searchStr: '',
        // 任务类型
        taskType: [1,2,4,10,9],
        // 任务状态
        taskStatus: [0,1,2,3,9],
        // 起止时间
        timeRange: [],
        // 分页控件信息
        page: {
          // 每页显示的行数
          pageSize: 50,
          // 当前页码
          pageIndex: 1,
          // 总行数
          totalRow: 0
        },
      },
      // 任务列表
      taskList: [],
      // 是否展示添加Wms任务弹窗
      showAddWmsTask: false
    }
  },
  // 计算属性 类似于 data 概念
  computed: {},
  // 监控 data 中的数据变化
  watch: {},
  // 方法集合
  methods: {
    pageChange(searchParams) {
      this.$refs.searchForm.searchData(searchParams)
    },

  },
  // 生命周期 - 挂载完成（可以访问 DOM 元素）
  mounted() {
  }
}
</script>

<style scoped>

</style>