aio-ndxy/src/pages/task.vue

<template>
  <div class="contianer">
    <jxHeader :type="type" title="配料作业"></jxHeader>
    <div class="contianer content">
      <div class="contianer content_wraper">
        <div class="contianer mgt2 grid_wraper">
          <table>
            <tr>
              <th>工单编码</th>
              <th>序号</th>
              <th>物料编码</th>
              <th>物料名称</th>
              <th>产线</th>
              <th>站点编码</th>
              <th>配料桶数</th>
              <th>剩余桶数</th>
              <th>物料重量</th>
              <th>状态</th>
              <th style="text-align: center">操作</th>
            </tr>
            <tr v-for="(e, i) in dataList" :key="i">
              <td>{{ e.mfg_order_name }}</td>
              <td>{{ e.seq_no }}</td>
              <td>{{ e.material_code }}</td>
              <td>{{ e.material_name }}</td>
              <td>{{ e.resource_name }}</td>
              <td>{{ e.point_code }}</td>
              <td>{{ e.require_num }}</td>
              <td>{{ e.remain_num }}</td>
              <td>{{ e.qty }}</td>
              <td>{{ e.status }}</td>
              <td>
                <div class="zd-row btn_wraper">
                  <button class="grid_button" :disabled="disabled" @click="_sendWork(e)">下发</button>
                  <!-- <button class="grid_button" :disabled="disabled">执行中</button> -->
                  <button class="grid_button" :disabled="disabled" @click="_reSendWork(e)">补发</button>
                  <button class="grid_button" :disabled="disabled" @click="_pdaPause(e)">暂停</button>
                  <button class="grid_button" :disabled="disabled" @click="_finishWork(e)">完成</button>
                </div>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import jxHeader from '@components/header.vue'
// import {queryWorks} from '@config/mork.js'
import {queryWorks, sendWork, reSendWork, pdaPause, finishWork} from '@config/getData.js'
export default {
  name: 'task',
  components: {
    jxHeader
  },
  data () {
    return {
      type: true,
      timer: null,
      dataList: [],
      pkId: '',
      disabled: false
    }
  },
  mounted () {
    this._queryWorks()
  },
  methods: {
    async _queryWorks () {
      let res = await queryWorks(this.$route.query.order)
      this.dataList = [...res]
    },
    async _sendWork (e) {
      this.disabled = true
      try {
        let res = await sendWork(e.work_code)
        this.$message({
          message: res.message,
          type: 'success'
        })
        this.disabled = false
      } catch (e) {
        this.disabled = false
      }
    },
    async _reSendWork (e) {
      this.disabled = true
      try {
        let res = await reSendWork(e.work_code)
        this.$message({
          message: res.message,
          type: 'success'
        })
        this.disabled = false
      } catch (e) {
        this.disabled = false
      }
    },
    async _pdaPause (e) {
      this.disabled = true
      try {
        let res = await pdaPause(e.work_code)
        this.$message({
          message: res.message,
          type: 'success'
        })
        this.disabled = false
      } catch (e) {
        this.disabled = false
      }
    },
    async _finishWork (e) {
      this.disabled = true
      try {
        let res = await finishWork(e.work_code)
        this.$message({
          message: res.message,
          type: 'success'
        })
        this.disabled = false
      } catch (e) {
        this.disabled = false
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
// @import '~@style/mixin'
.grid_wraper
  height 100%
.btn_wraper
  width 3.5rem
</style>