<template>
  <div>
    <el-row type="flex" justify="space-around">
      <el-col :span="6">
        <el-card class="box-card" shadow="hover" @click.native="$router.push({ name: 'orderProcess' })">
          <icon-svg class="iconClass" name="guolu"></icon-svg>
          <h2>进工业炉加工</h2>
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-card class="box-card" shadow="hover" @click.native="$router.push({ name: 'exWarehouse' })">
          <icon-svg class="iconClass" name="chuku"></icon-svg>
          <h2>出库</h2>
        </el-card>
      </el-col>
      <el-col :span="6">
        <el-card class="box-card" shadow="hover" @click.native="$router.push({ name: 'addProcess' })">
          <icon-svg class="iconClass" name="zaijiagong"></icon-svg>
          <h2>追加加工</h2>
        </el-card>
      </el-col>
    </el-row>
    <div class="mod-log">
      <h3>当前任务列表</h3>
      <el-table
        :data="dataList"
        border
        height="600px"
        v-loading="dataListLoading"
        style="width: 100%"
      >
        <el-table-column
          type="index"
          header-align="center"
          align="center"
          label="序号"
          width="50"
        ></el-table-column>
        <el-table-column
          prop="id"
          header-align="center"
          align="center"
          label="任务编号"
        >
        </el-table-column>
        <el-table-column
          prop="username"
          header-align="center"
          align="center"
          label="标识卡"
        >
        </el-table-column>
        <el-table-column
          prop="operation"
          header-align="center"
          align="center"
          label="物料名"
        >
        </el-table-column>
        <el-table-column
          prop="method"
          header-align="center"
          align="center"
          label="客户"
        >
        </el-table-column>
        <el-table-column
          prop="params11"
          header-align="center"
          align="center"
          label="窑炉"
        >
        </el-table-column>
        <el-table-column
          prop="time"
          header-align="center"
          align="center"
          label="当前状态"
        >
        </el-table-column>
        <el-table-column
          prop="ip"
          header-align="center"
          align="center"
          label="任务类型"
        >
        </el-table-column>
        <el-table-column
          prop="createDate"
          header-align="center"
          align="center"
          label="开始位置"
        >
        </el-table-column>
        <el-table-column
          prop="createDate"
          header-align="center"
          align="center"
          label="目标位置"
        >
        </el-table-column>
        <el-table-column
          prop="createDate"
          header-align="center"
          align="center"
          label="库位"
        >
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      dataList: [],
      pageIndex: 1,
      pageSize: 10,
      dataListLoading: false
    }
  },
  created () {
    this.getDataList()
  },
  methods: {
    // 获取数据列表
    getDataList () {
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/sys/log/list'),
        method: 'get',
        params: this.$http.adornParams({
          page: this.pageIndex,
          limit: this.pageSize
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.dataList = data.page.list
        } else {
          this.dataList = []
        }
        this.dataListLoading = false
      })
    }
  }
}
</script>

<style scoped>
.mod-log {
  margin-top: 100px;
}
.box-card{
  background-color: rgb(235, 254, 255);
  text-align: center;
  cursor: pointer;
}
.iconClass{
  width: 100px;
  height: 100px;
}
</style>
