工单作业、工单查询、报工查询

src/pages/modules/workorder/work-report-query.vue

@@ -20,17 +20,24 @@
                     <el-select v-model="value" placeholder="请选择">
                       <el-option
                           v-for="item in options"
-                          :key="item.value"
-                          :label="item.label"
-                          :value="item.value">
+                          :key="item.device_code"
+                          :label="item.device_name"
+                          :value="item.device_code">
                       </el-option>
                     </el-select>
                   </div>
               </div>
+              <div class="filter_item">
+                  <div class="filter_label filter_label_z3">工单号</div>
+                  <div class="filter-input-wrap filter-input-wrap_z3">
+                  <input type="text" class="filter-input filter-input_1" v-model="workorder">
+                  <i v-show="closeIcon1" class="iconfont close_icon" @click="clearData(1)"></i>
+                  </div>
+              </div>
           </div>
           <div class="wrap-buttons">
               <button class="button button--primary" @click="getDatas">查询</button>
-              <button class="button button--primary" :disabled="disabled1">修改</button>
+              <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled1" @click="showDialog">修改</button>
               <button class="button button--primary" :disabled="disabled2">删除</button>
           </div>
       </div>
@@ -38,66 +45,157 @@
           <table class="filter-table">
               <tr>
                   <th width="4%"></th>
-                  <th width="7%">工单号</th>
+                  <th width="6%">工单号</th>
                   <th width="6%">设备</th>
-                  <th width="8%">顺序号</th>
-                  <th width="8%">班次</th>
+                  <th width="6%">顺序号</th>
+                  <th width="4%">班次</th>
                   <th width="8%">物料名称</th>
                   <th width="8%">开始时间</th>
                   <th width="8%">结束时间</th>
                   <th width="7%">电气数量</th>
                   <th width="10%">上报合格数</th>
-                  <th width="7%">上报报废数</th>
-                  <th width="6%">上报报修数</th>
+                  <th width="10%">上报报废数</th>
+                  <th width="10%">上报报修数</th>
                   <th width="6%">操作工</th>
                   <th width="5%">状态</th>
               </tr>
-              <tr v-for="e in dataList" :key="e.workorder_id">
+              <tr v-for="e in dataList" :key="e.macoperate_id">
                   <td>
-                      <button class="iconfont select_icon" :class="pkId === e.workorder_id ? 'selected_icon' : 'unselect_icon'" @click="toRadio(e)"></button>
+                      <button class="iconfont select_icon" :class="{'selected_icon': pkId === e.macoperate_id}" @click="toRadio(e)"></button>
                   </td>
                   <td>{{e.workorder_code}}</td>
-                  <td>{{e.shift_type_scode_name}}</td>
+                  <td>{{e.device_code}}</td>
+                  <td>{{e.seq_number}}</td>
+                  <td>{{e.shift_type_scode}}</td>
                   <td>{{e.material_name}}</td>
-                  <td>{{e.workprocedure_name}}</td>
-                  <td>{{['创建','下发','生产中','暂停', '完成'][Number(e.order_status) - 1]}}</td>
-                  <td>{{e.plan_qty}}</td>
-                  <td>{{e.real_qty}}</td>
-                  <td>
-                  </td>
-                  <td>{{e.realproducestart_date}}</td>
-                  <td>{{e.realproduceend_date}}</td>
-                  <td></td>
-                  <td></td>
-                  <td></td>
+                  <td>{{e.operatetime_start}}</td>
+                  <td>{{e.operatetime_end}}</td>
+                  <td>{{ e.dq_report_qty }}</td>
+                  <td>{{e.report_qty}}</td>
+                  <td>{{e.nok_qty}}</td>
+                  <td>{{ e.repare_qty }}</td>
+                  <td>{{ e.produce_person_name }}</td>
+                  <td>{{ ['生成','报工','审核'][Number(e.report_status) - 1] }}</td>
               </tr>
           </table>
       </div>
+      <jxDialog
+        ref="child"
+        title="请输入数量"
+        @toSure="toSureDialog"
+        >
+        <div class="form_wraper">
+          <div class="form">
+            <div class="form_item">
+              <div class="form_item__label">合格数量</div>
+              <div class="form_item__content">
+                <input type="number" class="form_item__input" v-model="reportQty">
+              </div>
+            </div>
+            <div class="form_item">
+              <div class="form_item__label">报废数量</div>
+              <div class="form_item__content">
+                <input type="number" class="form_item__input" v-model="nokQty">
+              </div>
+            </div>
+          </div>
+          <div class="form">
+            <div class="form_item">
+              <div class="form_item__label">报修数量</div>
+              <div class="form_item__content">
+                <input type="number" class="form_item__input" v-model="repareQty">
+              </div>
+            </div>
+          </div>
+        </div>
+      </jxDialog>
   </div>
 </template>
 
 <script>
+import { deviceList, reportQuery } from '../../../config/getData2.js'
+import jxDialog from '@components/dialog.vue'
+import {dateFtt} from '@config/utils.js'
 export default {
+  components: {
+    jxDialog
+  },
   data () {
     return {
       options: [],
       value: '',
       value1: [new Date(), new Date()],
+      workorder: '',
       disabled1: false,
       disabled2: false,
-      disabled3: false,
-      dataList: [{workorder_id: '1'}, {workorder_id: '2'}],
+      dataList: [],
       pkId: '',
-      pkObj: {}
+      pkObj: {},
+      reportQty: '',
+      nokQty: '',
+      repareQty: ''
     }
   },
+  computed: {
+    closeIcon1 () {
+      return this.keyValue !== ''
+    }
+  },
+  watch: {
+    workorder () {
+      this.debouncedgetDatas()
+    }
+  },
+  created () {
+    this._deviceList()
+    this.debouncedgetDatas = this.debounce(this.getDatas, 500)
+  },
   methods: {
-    getDatas () {
-
+    debounce (fn, delay = 500) {
+      let timer = null
+      return function () {
+        if (timer) {
+          clearTimeout(timer)
+        }
+        timer = setTimeout(() => {
+          fn.apply(this, arguments)
+          timer = null
+        }, delay)
+      }
+    },
+    clearData (e) {
+      switch (e) {
+        case 1:
+          this.workorder = ''
+          break
+      }
+    },
+    async _deviceList () {
+      let res = await deviceList()
+      if (res.code === 200) {
+        this.options = [...res.content]
+      }
+    },
+    async getDatas () {
+      let res = await reportQuery(this.value1 !== null ? dateFtt(this.value1[0]) : '', this.value1 !== null ? dateFtt(this.value1[1]) : '', this.value, this.workorder)
+      this.dataList = [...res.content]
     },
     toRadio (e) {
-      this.pkId = this.pkId === e.workorder_id ? '' : e.workorder_id
-      this.pkObj = this.pkId === e.workorder_id ? e : {}
+      this.pkId = this.pkId === e.macoperate_id ? '' : e.macoperate_id
+      this.pkObj = this.pkId === e.macoperate_id ? e : {}
+    },
+    showDialog () {
+      if (!this.pkId) {
+        this.toast('请选择一行')
+        return
+      }
+      this.reportQty = this.pkObj.report_qty
+      this.nokQty = this.pkObj.nok_qty
+      this.repareQty = this.pkObj.repare_qty
+      this.$refs.child.active = true
+    },
+    toSureDialog () {
+      this.$refs.child.active = false
     }
   }
 }
@@ -105,16 +203,29 @@ export default {
 
 <style lang="stylus" scoped>
 .wrap-filters
-  width calc(100% - 270px)
+  width calc(100% - 178px)
 .wrap-buttons
-  width 270px
+  width 178px
 .filter_label_z2
   width 32px
 .filter-input-wrap_z2
   width calc(100% - 32px)
 .filter_item
   &:nth-child(1)
-      width 55%
+      width 43%
   &:nth-child(2)
-      width calc(45% - 10px)
+      width calc(30% - 10px)
+  &:nth-child(3)
+      width calc(27% - 10px)
+.close_icon
+  width 20px
+  height 20px
+  font-size 15px
+  line-height 20px
+  top 5px
+  right 10px
+.filter_label_z3
+  width 43px
+.filter-input-wrap_z3
+  width calc(100% - 43px)
 </style>