mt-qj-wms-ui/src/views/common/home.vue

<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="500px"
        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="taskCode"
          header-align="center"
          align="center"
          label="任务编号"
        >
        </el-table-column>
        <el-table-column
          prop="idens"
          header-align="center"
          align="center"
          label="标识卡"
        >
        <template slot-scope="scope">
          <span>{{
            scope.row.idens.join("|")
          }}</span>
        </template>
        </el-table-column>
        <el-table-column
          prop="materials"
          header-align="center"
          align="center"
          label="物料名"
        >
        <template slot-scope="scope">
          <span>{{
            scope.row.materials.join("|")
          }}</span>
        </template>
        </el-table-column>
        <el-table-column
          prop="customers"
          header-align="center"
          align="center"
          label="客户"
        >
        <template slot-scope="scope">
          <span>{{
            scope.row.customers.join("|")
          }}</span>
        </template>
        </el-table-column>
        <el-table-column
          prop="kilnName"
          header-align="center"
          align="center"
          label="窑炉"
        >
        </el-table-column>
        <el-table-column
          prop="status"
          header-align="center"
          align="center"
          label="当前状态"
        >
        </el-table-column>
        <el-table-column
          prop="taskType"
          header-align="center"
          align="center"
          label="任务类型"
        >
        <template slot-scope="scope">
          <span>{{
            scope.row.taskType === 0
              ? "缓存到窑炉加工"
              : scope.row.taskType === 1
              ? "出炉到缓存"
              : scope.row.taskType === 2
              ? "缓存出库"
              : "入库缓存"
          }}</span>
        </template>
        </el-table-column>
        <el-table-column
          prop="startPosition"
          header-align="center"
          align="center"
          label="开始位置"
        >
        </el-table-column>
        <el-table-column
          prop="targetPosition"
          header-align="center"
          align="center"
          label="目标位置"
        >
        </el-table-column>
        <el-table-column
          prop="locationName"
          header-align="center"
          align="center"
          label="库位"
        >
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      dataList: [],
      pageIndex: 1,
      pageSize: 500,
      dataListLoading: false
    }
  },
  created () {
    this.getDataList()
  },
  methods: {
    // 获取数据列表
    getDataList () {
      this.dataListLoading = true
      this.$http({
        url: this.$http.adornUrl('/currTask/mainCurrentTaskNow'),
        method: 'post',
        data: this.$http.adornData({
          current: this.pageIndex,
          size: this.pageSize
        })
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.dataList = data.data.records
        } 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>