1.缺陷定义100%

loulijun2021

2023-09-26 089a8067eae3980cc9f247d2e65bb5c10aa1bd99

 src/views/produce/stepReport.vue

@@ -1,11 +1,722 @@
<template />
<template>
  <div>
    <div class="body" style="padding-top: 10px;" :style="{height:mainHeight+'px'}">

      <div style="position: absolute;right:36px;z-index: 2;top: 13px">
        <el-button
          v-if="activeName==='生产列表'&&tableData.length>0"
          v-waves
          icon="el-icon-thumb"
          type="primary"
          @click="report()"
        >报工
        </el-button>
        <el-button
          v-if="activeName==='外协发料'&&tableData.length>0"
          v-waves
          type="primary"
          icon="el-icon-thumb"
          @click="sendOut"
        >发料
        </el-button>
        <el-button
          v-if="activeName==='外协收料'&&tableData.length>0"
          v-waves
          type="primary"
          icon="el-icon-thumb"
          @click="takeIn"
        >收料
        </el-button>
        <el-button
          v-if="activeName==='不良待处理'&&tableData.length>0"
          v-waves
          type="primary"
          icon="el-icon-thumb"
          @click="handleBad"
        >处理
        </el-button>
      </div>

      <el-tabs
        ref="elTabs"
        v-model="activeName"
        type="border-card"
        @tab-click="tabClick"
      >
        <el-tab-pane
          v-for="item in elTabsArr"
          :key="item.code"
          :label="item.name"
          :name="item.name"
        >
          <div class="bodyTopFormGroup">
            <el-form
              ref="form"
              :model="form"
              label-width="100px"
              inline
              style="display: flex;"
            >
              <div class="elForm">

                <el-form-item label="工单号" style=" display: flex;">
                  <el-input
                    v-model="form.wocode"
                    :name="'produceCode'+item.code"
                    placeholder="请扫描或输入"
                    style="width: 300px"
                    @keyup.enter.native="val=>enterNative(val,'produceCode' + item.code)"
                  />
                </el-form-item>
                <el-form-item label="产品编码" style=" display: flex;">
                  <el-input v-model="form.partcode" placeholder="请输入" style="width: 200px" />
                </el-form-item>
                <el-form-item label="产品名称" style=" display: flex;">
                  <el-input v-model="form.partname" placeholder="请输入" style="width: 200px" />
                </el-form-item>
                <!--                <el-form-item label="规格型号" style=" display: flex;">-->
                <!--                  <el-input v-model="form.partspec" placeholder="请输入" style="width: 200px" />-->
                <!--                </el-form-item>-->

              </div>
              <div
                class="bodySearchReset"
                :style="{marginLeft:$store.state.app.sidebar.opened? $store.state.settings.menuIsHorizontal?'15%':'3%':'10%'}"
              >
                <el-button v-waves type="primary" icon="el-icon-search" @click="search">查询</el-button>
                <el-button v-waves type="info" icon="el-icon-refresh" @click="reset">重置</el-button>
              </div>
            </el-form>
            <div
              class="bodyTopFormExpand"
              style="height:5px"
            >
              <!--          <svg-icon-->
              <!--            v-show="mouseHoverType==='mouseout'"-->
              <!--            style="cursor: pointer"-->
              <!--            :icon-class="!isExpandForm?'doubleDown3':'doubleUp3'"-->
              <!--            @mouseenter="mouseHoverType=$event.type"-->
              <!--          />-->
              <!--          <svg-icon-->
              <!--            v-show="mouseHoverType==='mouseenter'"-->
              <!--            style="cursor: pointer"-->
              <!--            :icon-class="!isExpandForm?'doubleDown':'doubleUp'"-->
              <!--            @click="isExpandForm=!isExpandForm"-->
              <!--            @mouseout="mouseHoverType=$event.type"-->
              <!--          />-->
            </div>
          </div>

          <div class="elTableDiv">
            <el-table
              ref="tableDataRef"
              :key="'tableDataRef'+item.code"
              class="tableFixed"
              :data="tableData"
              :height="tableHeight+50"
              border
              row-class-name="custom-row"
              :style="{width: 100+'%',height:tableHeight+'px'}"
              highlight-current-row
              :header-cell-style="headerCellStyle()"
              :cell-style="cellStyle()"
              @sort-change="sortChange"
              @row-click="rowClick"
            >
              <el-table-column
                width="50"
                fixed
              >
                <template slot-scope="{row}">
                  <el-radio
                    v-model="radioSelected"
                    :label="row.id"
                    style="color: transparent;padding-left: 10px;"
                  />
                </template>
              </el-table-column>
              <el-table-column
                prop="rowNum"
                width="50"
                label="序号"
                fixed
              />
              <el-table-column
                prop="status"
                show-tooltip-when-overflow
                label="状态"
                sortable="custom"
                width="80"
              >
                <template slot-scope="{row}">
                  <div v-if="row.status==='NEW'">新订单</div>
                  <div v-if="row.status==='ALLO'">已派发</div>
                  <div v-if="row.status==='START'">开工</div>
                  <div v-if="row.status==='CLOSED'">完工</div>
                  <div v-if="row.status==='NOSCHED'">待排程</div>
                  <div v-if="row.status==='SCHED'">已排程</div>
                </template>
              </el-table-column>
              <el-table-column
                prop="wo_code"
                label="工单号"
                width="160"
                show-tooltip-when-overflow
                sortable="custom"
              />
              <el-table-column
                prop="partcode"
                label="产品编码"
                min-width="110"
                sortable="custom"
                show-tooltip-when-overflow
              />
              <el-table-column
                prop="partname"
                min-width="110"
                show-tooltip-when-overflow
                label="产品名称"
                sortable="custom"
              />
              <el-table-column
                prop="partspec"
                min-width="110"
                show-tooltip-when-overflow
                label="规格型号"
                sortable="custom"
              >
                <template slot-scope="{row}">
                  {{ row.partspec ? row.partspec : '/' }}
                </template>
              </el-table-column>
              <el-table-column
                prop="stepname"
                label="工序名称"
                show-tooltip-when-overflow
                width="120"
                sortable="custom"
              />
              <el-table-column
                prop="plan_qty"
                label="任务数量"
                width="110"
                sortable="custom"
                show-tooltip-when-overflow
              />
              <el-table-column
                prop="good_qty"
                show-tooltip-when-overflow
                label="合格数量"
                sortable="custom"
                width="160"
              />
              <el-table-column
                prop="ng_qty"
                label="不良数量"
                show-tooltip-when-overflow
                width="150"
                sortable="custom"
              />
              <el-table-column
                prop="laborbad_qty"
                label="工废数量"
                width="120"
                show-tooltip-when-overflow
                sortable="custom"
              />
              <el-table-column
                prop="materielbad_qty"
                label="料废数量"
                width="120"
                show-tooltip-when-overflow
                sortable="custom"
              />

              <el-table-column
                label="操作"
                width="120"
                fixed="right"
              >
                <template slot-scope="{row}">
                  <div class="operationClass">
                    <el-button v-if="activeName==='生产列表'" v-waves icon="el-icon-thumb" type="text" @click="report(row)">
                      报工
                    </el-button>
                    <el-button
                      v-if="activeName==='外协发料'"
                      v-waves
                      icon="el-icon-thumb"
                      type="text"
                      @click="sendOut(row)"
                    >发料
                    </el-button>
                    <el-button v-if="activeName==='外协收料'" v-waves icon="el-icon-thumb" type="text" @click="takeIn(row)">
                      收料
                    </el-button>
                    <el-button
                      v-if="activeName==='不良待处理'"
                      v-waves
                      icon="el-icon-thumb"
                      type="text"
                      @click="handleBad(row)"
                    >处理
                    </el-button>
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <!--分页-->
          <pagination
            :total="total"
            :page.sync="form.page"
            :limit.sync="form.rows"
            align="right"
            layout="total,prev, pager, next,sizes"
            popper-class="select_bottom"
            @pagination="search"
          />
        </el-tab-pane>

      </el-tabs>

    </div>

    <el-dialog
      v-el-drag-dialog
      :title="dialogTitle"
      :visible.sync="dialogVisible"
      width="800px"
      :close-on-click-modal="false"
      top="15vh"
      @closed="handleClose"
      @close="handleClose"
    >
      <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="80px">
        <el-form-item label="工单编号" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.wo_code }}</div>
          <!--          <el-input v-model="dialogForm.wo_code" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="产品编码" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.partnumber }}</div>
          <!--          <el-input v-model="dialogForm.partnumber" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="产品名称" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.partname }}</div>
          <!--          <el-input v-model="dialogForm.partname" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="规格型号" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.partspec }}</div>
          <!--          <el-input v-model="dialogForm.partspec" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="当前工序" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.stepname }}</div>
          <!--          <el-input v-model="dialogForm.stepname" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="下道工序" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.nextstepname }}</div>
          <!--          <el-input v-model="dialogForm.nextstepname" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="任务数量" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.planqty }}</div>
          <!--          <el-input v-model="dialogForm.planqty" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="未报/已报" class="dialogFormItem">
          <div class="dialogFormItemDiv">{{ dialogForm.noreportqty + '/' + dialogForm.reportqty }}</div>
          <!--          <el-input v-model="dialogForm.planqty" style="width: 200px" />-->
        </el-form-item>
        <el-form-item label="计件方式">
          <el-radio-group v-model="dialogForm.reckway" style="width: 200px;" @change="reckwayChange">
            <el-radio label="person">个人</el-radio>
            <el-radio label="group">班组</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item v-if="dialogForm.reckway==='group'" prop="usergroupcode" label="班组">
          <el-select
            v-model="dialogForm.usergroupcode"
            style="width:200px"
            placeholder="请选择"
            filterable
            clearable
            :popper-append-to-body="false"
          >
            <el-option
              v-for="item in usergroupArr"
              :key="item.postcode"
              :label="item.postname"
              :value="item.postcode"
            />
          </el-select>
        </el-form-item>
        <el-form-item prop="reportuser" label="报工人员">
          <el-select
            v-model="dialogForm.reportuser"
            style="width:200px"
            placeholder="请选择"
            filterable
            clearable
            :popper-append-to-body="false"
          >
            <el-option
              v-for="item in reportuserArr"
              :key="item.postcode"
              :label="item.postname"
              :value="item.postcode"
            />
          </el-select>
        </el-form-item>
        <el-form-item prop="eqpcode" label="报工设备">
          <el-select
            v-model="dialogForm.eqpcode"
            style="width:200px"
            placeholder="请选择"
            filterable
            clearable
            :popper-append-to-body="false"
          >
            <el-option
              v-for="item in eqpArr"
              :key="item.postcode"
              :label="item.postname"
              :value="item.postcode"
            />
          </el-select>
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
        <div class="footerButton">
          <el-button v-waves @click="dialogVisibleCancel">取 消</el-button>
          <el-button
            v-waves
            type="primary"
            :loading="$store.state.app.buttonIsDisabled"
            :disabled="$store.state.app.buttonIsDisabled"
            @click="dialogVisibleConfirm"
          >确 定</el-button>
        </div>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import $ from 'jquery'
import { getCookie } from '@/utils/auth'
import elDragDialog from '@/directive/el-drag-dialog'
import waves from '@/directive/waves'
import {
  MesOrderNgStepSearch,
  MesOrderNgSubStepSearch,
  MesOrderStepSearch, MesOrderStepStart,
  MesOrderWxStepSearch
} from '@/api/WorkOrder'
import { validateCode } from '@/utils/global'

export default {
  name: 'StepReport'
  name: 'SCKBG',
  components: {
    Pagination
  },
  directives: { elDragDialog, waves },
  data() {
    return {
      mainHeight: 0,
      tableHeight: 0,
      form: {
        wocode: '', // 工单号
        partcode: '', // 产品编码
        partname: '', // 产品名称
        partspec: '', // 产品规格
        prop: 'lm_date', // 排序字段
        order: 'desc', // 排序字段
        page: 1, // 第几页
        rows: 20 // 每页多少条
      },
      total: 10,
      tableData: [],
      activeName: '生产列表',
      elTabsArr: [
        { code: 'ZZ', name: '生产列表' },
        { code: 'OUT', name: '外协发料' },
        { code: 'IN', name: '外协收料' },
        { code: 'BAD', name: '不良待处理' }
      ],
      radioSelected: '', // 多选框选中值

      dialogVisible: false,
      dialogTitle: '', // 对话框小标题

      dialogForm: {
        'wo_code': '',
        'partnumber': '',
        'partname': '',
        'partspec': '',
        'seq': '',
        'stepcode': '',
        'stepname': '',
        'stepprice': '', // 工序单价
        'nextstepcode': '',
        'nextstepname': '',
        'nextstepprice': '',
        'stepdesc': '',
        'planqty': 0,
        'startqty': 0,
        'noreportqty': 0,
        'reportqty': 0,
        'noputqty': 0,
        'wkshopcode': '',
        'wkshopname': '',
        'eqpcode': '',
        'eqpname': '',

        remarks: '', // 备注
        inbarcode: '', // 入库条码
        defectlist: '', // 不良汇总
        reckway: 'person', // 计件方式(班组:group、个人:person)
        usergroupcode: '', // 班组编码
        reportuser: '' // 报工人员

      },
      dialogFormRules: {
        postcode: [
          { required: true, validator: validateCode, trigger: ['blur', 'change'] }
        ],
        postname: [
          { required: true, message: '请输入岗位名称', trigger: ['blur', 'change'] }
        ]
      },
      reckwayArr: [// 报工类型
        { code: 'group', name: '班组' },
        { code: 'person', name: '个人' }
      ],
      reportuserArr: [], // 报工人员
      usergroupArr: [], // 报工班组
      eqpArr: [], // 报工设备
      defectArr: []// 不良缺陷

    }
  },

  created() {

  },
  mounted() {
    window.addEventListener('resize', this.getHeight)
    this.getHeight()

    this.tabClick()
  },
  methods: {
    tabClick() {
      let belong
      switch (this.activeName) {
        case '生产列表':
          belong = 'produceCodeZZ'
          this.dialogTitle = '报工'
          break
        case '外协发料':
          belong = 'produceCodeOUT'
          this.dialogTitle = '发料'
          break
        case '外协收料':
          belong = 'produceCodeIN'
          this.dialogTitle = '收料'
          break
        case '不良待处理':
          belong = 'produceCodeBAD'
          this.dialogTitle = '不良处理'
          break
      }
      this.enterNative(this.form.wocode, belong)
      this.search()
    },
    enterNative(val, belong) {
      if (belong === 'produceCodeZZ') {
        this.$nextTick(() => {
          $('input[name=\'produceCodeZZ\']')[0].focus()
        })
      }
      if (belong === 'produceCodeOUT') {
        this.$nextTick(() => {
          $('input[name=\'produceCodeOUT\']')[0].focus()
        })
      }
      if (belong === 'produceCodeIN') {
        this.$nextTick(() => {
          $('input[name=\'produceCodeIN\']')[0].focus()
        })
      }
      if (belong === 'produceCodeBAD') {
        this.$nextTick(() => {
          $('input[name=\'produceCodeBAD\']')[0].focus()
        })
      }
    },
    // 排序改变时
    sortChange({ column, prop, order }) {
      if (order === 'descending') {
        order = 'desc'
      } else if (order === 'ascending') {
        order = 'asc'
      } else {
        order = 'desc'
      }
      this.form.order = order
      this.form.prop = prop
      this.search()
    },
    // 查询
    async search() {
      if (this.activeName === '生产列表') {
        const res = await MesOrderStepSearch(this.form)
        this.tableData = res.data
        this.total = res.count
      }
      if (this.activeName === '外协发料' || this.activeName === '外协收料') {
        const res = await MesOrderWxStepSearch(this.form)
        this.tableData = res.data
        this.total = res.count
      }

      if (this.activeName === '不良待处理') {
        const res = await MesOrderNgStepSearch(this.form)
        this.tableData = res.data
        this.total = res.count
      }
    },
    // 报工
    report(row) {
      if (row) {
        this.getMesOrderStepStart('ZZ', '', row.wo_code, row.stepcode)
      } else {
        const temp = this.tableData.find(i => i.id === this.radioSelected)
        this.getMesOrderStepStart('ZZ', '', temp.wo_code, temp.stepcode)
      }
    },
    // 发料
    sendOut(row) {
      if (row) {
        this.getMesOrderStepStart('WX', 'OUT', row.wo_code, row.stepcode)
      } else {
        const temp = this.tableData.find(i => i.id === this.radioSelected)
        this.getMesOrderStepStart('WX', 'OUT', temp.wo_code, temp.stepcode)
      }
    },
    // 收料
    takeIn(row) {
      if (row) {
        this.getMesOrderStepStart('WX', 'IN', row.wo_code, row.stepcode)
      } else {
        const temp = this.tableData.find(i => i.id === this.radioSelected)
        this.getMesOrderStepStart('WX', 'IN', temp.wo_code, temp.stepcode)
      }
    },
    // 不良处理
    handleBad(row) {

    },
    // 生产开报工：报工/外协(发料/收料)时条件判断及数据返回接口
    async getMesOrderStepStart(OperType, SelectType, wocode, stepcode) {
      const data = {
        OperType, SelectType, wocode, stepcode
      }
      let res = await MesOrderStepStart(data)
      if (res.code === '200') {
        res = res.data
        this.dialogForm.wo_code = res.wo_code
        this.dialogForm.partnumber = res.partnumber
        this.dialogForm.partname = res.partname
        this.dialogForm.partspec = res.partspec
        this.dialogForm.seq = res.seq
        this.dialogForm.stepcode = res.stepcode
        this.dialogForm.stepname = res.stepname
        this.dialogForm.stepprice = res.stepprice
        this.dialogForm.nextstepcode = res.nextstepcode
        this.dialogForm.nextstepname = res.nextstepname
        this.dialogForm.nextstepprice = res.nextstepprice
        this.dialogForm.stepdesc = res.stepdesc
        this.dialogForm.planqty = res.planqty
        this.dialogForm.startqty = res.startqty
        this.dialogForm.noreportqty = res.noreportqty// 未报数量
        this.dialogForm.reportqty = res.reportqty // 已报数量
        this.dialogForm.noputqty = res.noputqty
        this.dialogForm.wkshopcode = res.wkshopcode
        this.dialogForm.wkshopname = res.wkshopname
        this.dialogForm.eqpcode = res.eqpcode
        this.dialogForm.eqpname = res.eqpname

        this.dialogVisible = true
      }
    },
    // 生产开报工扫码获取工单对应工序任务(不良明细)
    async getMesOrderNgSubStepSearch(wocode, stepcode) {
      const data = {
        wocode, stepcode
      }
      const res = await MesOrderNgSubStepSearch(data)
    },
    // 对话框关闭事件
    handleClose() {
      this.$refs.dialogForm.clearValidate()
    },
    // 对话框取消
    dialogVisibleCancel() {
      this.dialogVisible = false
      this.tabClick()
    },
    // 对话框确认
    dialogVisibleConfirm() {
      // this.$refs.dialogForm.validate(async valid => {
      //   if (valid) {
      //
      //   }
      // })
    },
    reckwayChange(val) {

    },
    rowClick(row, event, column) {
      this.radioSelected = row.id
    },
    // 获取页面高度
    getHeight() {
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 85
        this.tableHeight = this.mainHeight - 275
        // this.$refs.tableDataRef.doLayout()
      })
    },
    reset() {
      this.form.wocode = ''
      this.form.partcode = ''
      this.form.partname = ''
      this.form.partspec = ''
    },

    headerCellStyle() {
      return this.$headerCellStyle
    },
    cellStyle() {
      return this.$cellStyle
    }
  }
}
</script>
<style lang="scss" scoped>

<style scoped>
::v-deep .elTableDiv .el-radio__label {
  display: none !important;
}

.dialogFormItem {
  margin: 0 10px 0 0;
}

.dialogFormItemDiv {
  width: 200px;
}

</style>