wms_base/mes/qd/src/views/wms/mps/produce/index.vue

<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <div v-if="crud.props.searchToggle">
        <el-form
          :inline="true"
          class="demo-form-inline"
          label-position="right"
          label-width="90px"
          label-suffix=":"
        >
          <!-- 搜索 -->
          <el-form-item label="工单编号">
            <el-input
              v-model="query.produceorder_code"
              clearable
              size="small"
              placeholder="请输入工单编号"
              style="width: 200px;"
              class="filter-item"
            />
          </el-form-item>
          <el-form-item label="物料搜索">
            <el-input
              v-model="query.material"
              clearable
              size="small"
              placeholder="物料编码、名称或规格"
              style="width: 200px;"
              class="filter-item"
            />
          </el-form-item>
          <el-form-item label="工单类型">
            <el-select
              v-model="query.order_type_scode"
              style="width: 200px"
              clearable
              filterable
              placeholder="请选择"
              @change="crud.toQuery"
            >
              <el-option
                v-for="item in dict.PDM_BI_ORDERTYPE"
                :key="item.id"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>

          <el-form-item label=" 工单状态">
            <el-select
              v-model="order_status"
              style="width: 200px"
              clearable
              multiple
              placeholder="请选择"
              class="filter-item"
              @change="handTaskStatus"
            >
              <el-option
                label="未完成"
                value="-1"
              />
              <el-option
                v-for="item in dict.MPS_BD_ORDERSTATUS"
                :key="item.id"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="生产日期">
            <el-date-picker
              v-model="query.createTime"
              type="daterange"
              value-format="yyyy-MM-dd"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :default-time="['00:00:00','23:59:59']"
              @change="crud.toQuery"
            />
          </el-form-item>
          <el-form-item label="班次类型">
            <el-select
              v-model="query.shift_type_scode"
              style="width: 200px"
              clearable
              filterable
              placeholder="请选择"
              @change="crud.toQuery"
            >
              <el-option
                v-for="item in dict.PDM_BI_SHIFTTYPE"
                :key="item.id"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="产品系列" style="height: 20px;">
            <treeselect
              v-model="query.product_series"
              :options="classes3"
              :auto-load-root-options="false"
              :load-options="loadChildNodes"
              style="width: 200px;"
              placeholder="请选择"
            />
          </el-form-item>
          <el-form-item label="销售单标识">
            <el-input
              v-model="query.sale_id"
              clearable
              size="small"
              placeholder="请输入销售单标识"
              style="width: 200px;"
              class="filter-item"
            />
          </el-form-item>
          <rrOperation :crud="crud" />
        </el-form>
      </div>
      <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
      <crudOperation :permission="permission">
        <el-button
          slot="right"
          class="filter-item"
          type="success"
          icon="el-icon-position"
          size="mini"
          :disabled="crud.selections.length !== 1"
          @click="crud.toCopy(crud.selections[0])"
        >
          复制新增
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          type="success"
          icon="el-icon-position"
          size="mini"
          @click="add"
        >
          批量新增
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          type="success"
          icon="el-icon-position"
          size="mini"
          :disabled="is_disabled(crud.selections)"
          @click="submits(crud.selections)"
        >
          下发
        </el-button>
        <el-button
          slot="right"
          class="filter-item"
          type="danger"
          icon="el-icon-position"
          size="mini"
          :disabled="crud.selections.length !== 1"
          @click="forceFinish(crud.selections[0])"
        >
          强制完成
        </el-button>
      </crudOperation>
      <!--表单组件-->
      <el-dialog
        :close-on-click-modal="false"
        :before-close="crud.cancelCU"
        :visible.sync="crud.status.cu > 0"
        :title="crud.status.title"
        width="1200px"
      >
        <el-form ref="form" :inline="true" :model="form" :rules="rules" size="mini" label-width="160px">
          <el-form-item label="工单类型" prop="order_type_scode">
            <el-select v-model="form.order_type_scode" style="width: 200px" filterable placeholder="请选择">
              <el-option
                v-for="item in dict.PDM_BI_ORDERTYPE"
                :key="item.id"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="所属工序" prop="workprocedure_id">
            <el-select
              v-model="form.workprocedure_id"
              clearable
              size="mini"
              class="filter-item"
              style="width: 200px;"
            >
              <el-option
                v-for="item in workprocedureList"
                :key="item.workprocedure_id"
                :label="item.workprocedure_name"
                :value="item.workprocedure_id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="生产日期" prop="produce_date">
            <el-date-picker v-model="form.produce_date" type="date" value-format="yyyy-MM-dd" style="width: 200px;" />
          </el-form-item>
          <el-form-item v-if="false" label="物料标识" prop="material_id">
            <el-input v-model="form.material_id" style="width: 200px;" />
          </el-form-item>
          <el-form-item label="物料编码" prop="material_code">
            <el-input
              v-model="form.material_code"
              style="width: 200px;"
              clearable
              @focus="materialShow=true"
              @clear="form.material_id='',form.material_code='',form.material_name='',form.material_spec=''"
            />
          </el-form-item>
          <el-form-item label="物料名称" prop="material_name">
            <el-input
              v-model="form.material_name"
              style="width: 200px;"
              disabled
            />
          </el-form-item>
          <el-form-item label="物料规格" prop="material_spec">
            <el-input
              v-model="form.material_spec"
              style="width: 200px;"
              disabled
            />
          </el-form-item>
          <el-form-item label="物料单重" prop="material_weight">
            <el-input v-model="form.material_weight" style="width: 200px;" />
          </el-form-item>
          <el-form-item label="计划数量" prop="plan_qty">
            <el-input v-model="form.plan_qty" style="width: 200px;" />
          </el-form-item>
          <el-form-item label="计划开始时间" prop="planproducestart_date">
            <el-date-picker
              v-model="form.planproducestart_date"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              style="width: 200px;"
            />
          </el-form-item>
          <el-form-item label="计划结束时间" prop="planproduceend_date">
            <el-date-picker
              v-model="form.planproduceend_date"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              style="width: 200px;"
            />
          </el-form-item>
          <el-form-item v-if="crud.status.edit" label="报工数量" prop="report_qty">
            <el-input v-model="form.report_qty" style="width: 200px;" />
          </el-form-item>
          <el-form-item v-if="crud.status.edit" label="实际数量" prop="report_qty">
            <el-input v-model="form.real_qty" style="width: 200px;" />
          </el-form-item>
          <el-form-item label="班次类型" prop="shift_type_scode">
            <el-select
              v-model="form.shift_type_scode"
              style="width: 200px"
              clearable
              filterable
              @change="change"
              placeholder="请选择"
            >
              <el-option
                v-for="item in dict.PDM_BI_SHIFTTYPE"
                :key="item.id"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="销售单标识">
            <el-input v-model="form.sale_id" style="width: 200px;" />
          </el-form-item>
          <el-form-item label="是否搬运" prop="is_needmove">
            <el-radio
              v-for="item in dict.IS_OR_NOT"
              :key="item.id"
              v-model="form.is_needmove"
              :label="item.value"
            >{{ item.label }}
            </el-radio>
          </el-form-item>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-form-item label="允许修改报工数量" prop="is_canupdate_update">
            <el-radio
              v-for="item in dict.IS_OR_NOT"
              :key="item.id"
              v-model="form.is_canupdate_update"
              :label="item.value"
            >{{ item.label }}
            </el-radio>
          </el-form-item>
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-form-item label="工单数量" prop="orderNum">
            <el-input v-model="form.orderNum" type="number" :min="1" oninput="value = value.replace(/[^\d]/g, '')" style="width: 200px;" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="text" @click="crud.cancelCU">取消</el-button>
          <el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
        </div>
      </el-dialog>
      <!--表格渲染-->
      <el-table
        ref="table"
        v-loading="crud.loading"
        :data="crud.data"
        size="mini"
        style="width: 100%;"
        @selection-change="crud.selectionChangeHandler"
      >
        <el-table-column type="selection" width="55" />
        <el-table-column v-if="false" prop="produceorder_id" label="生产班次工单标识" />
        <el-table-column prop="produceorder_code" label="工单编号" width="140px">
          <template slot-scope="scope">
            <el-link type="warning" @click="toView(scope.row)">{{ scope.row.produceorder_code }}</el-link>
          </template>
        </el-table-column>
        <el-table-column prop="producedeviceorder_code" label="机台工单号" width="100px" />
        <el-table-column prop="order_status" label="工单状态">
          <template slot-scope="scope">
            {{ dict.label.MPS_BD_ORDERSTATUS[scope.row.order_status] }}
          </template>
        </el-table-column>
        <el-table-column prop="shift_type_scode" label="班次类型">
          <template slot-scope="scope">
            {{ dict.label.PDM_BI_SHIFTTYPE[scope.row.shift_type_scode] }}
          </template>
        </el-table-column>
        <el-table-column v-if="false" prop="workprocedure_id" label="工序标识" />
        <el-table-column prop="produce_date" label="生产日期" width="100px" />
        <el-table-column prop="device_code" label="设备编码" />
        <el-table-column prop="device_name" label="设备名称" />
        <el-table-column prop="jockey_name" label="操作工" />
        <el-table-column prop="plan_qty" label="计划数量" />
        <el-table-column prop="real_qty" label="实际数量" />
        <el-table-column prop="report_qty" label="报工数量" />
        <el-table-column v-if="false" prop="material_id" label="物料标识" />
        <el-table-column prop="material_code" label="物料编码" width="100" show-overflow-tooltip />
        <el-table-column prop="material_name" label="物料名称" width="100" show-overflow-tooltip />
        <el-table-column prop="material_spec" label="物料规格" width="100" show-overflow-tooltip />
        <el-table-column prop="sale_id" label="销售单标识" width="100" show-overflow-tooltip />
        <el-table-column prop="class_name" label="产品系列" width="100" show-overflow-tooltip />
        <el-table-column prop="material_weight" label="物料单重" :formatter="rounding" />
        <el-table-column prop="planproducestart_date" label="计划生产开始时间" width="150" />
        <el-table-column prop="planproduceend_date" label="计划生产结束时间" width="150" />
        <el-table-column prop="realproducestart_date" label="实际生产开始时间" width="150" />
        <el-table-column prop="realproduceend_date" label="实际生产结束时间" width="150" />
        <el-table-column prop="is_needmove" label="是否搬运">
          <template slot-scope="scope">
            {{ dict.label.IS_OR_NOT[scope.row.is_needmove] }}
          </template>
        </el-table-column>
        <el-table-column prop="order_type_scode" label="工单类型">
          <template slot-scope="scope">
            {{ dict.label.PDM_BI_ORDERTYPE[scope.row.order_type_scode] }}
          </template>
        </el-table-column>
        <el-table-column prop="create_name" label="创建人" />
        <el-table-column prop="create_time" label="创建时间" width="150" />
        <el-table-column prop="update_optname" label="修改人" />
        <el-table-column prop="update_time" label="修改时间" width="150" />
        <el-table-column v-permission="[]" label="操作" width="120px" align="center" fixed="right">
          <template slot-scope="scope">
            <udOperation
              :data="scope.row"
              :permission="permission"
            />
          </template>
        </el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination />
    </div>
    <MaterDtl
      :dialog-show.sync="materialShow"
      :is-single="true"
      :mater-opt-code="materType"
      @setMaterValue="setMaterValue"
    />
    <ViewDialog ref="child3" />
    <AddDialog :dialog-show.sync="addShow" @AddChanged="querytable" />
  </div>
</template>

<script>
import crudProduceshiftorder from '@/api/wms/mps/produceshiftorder'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import crudWorkProcedure from '@/api/wms/basedata/pdm/workProcedure'
import MaterDtl from '@/views/wms/pub/MaterDialog'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import ViewDialog from '@/views/wms/mps/produce/ViewDialog'
import crudClassstandard from '@/api/wms/basedata/master/classstandard'
import AddDialog from '@/views/wms/mps/produce/AddDialog'

const defaultForm = {
  produceorder_id: null,
  produceorder_code: null,
  producedeviceorder_code: null,
  shift_type_scode: '01',
  workprocedure_id: null,
  produce_date: null,
  plan_qty: null,
  real_qty: null,
  report_qty: null,
  material_id: null,
  material_code: null,
  material_weight: null,
  planproducestart_date: null,
  planproduceend_date: null,
  realproducestart_date: null,
  realproduceend_date: null,
  order_status: '00',
  is_needmove: '0',
  order_type_scode: '01',
  create_id: null,
  create_name: null,
  create_time: null,
  update_optid: null,
  update_optname: null,
  update_time: null,
  sysdeptid: null,
  syscompanyid: null,
  is_delete: null,
  material_name: null,
  device_id: null,
  is_canupdate_update: '1',
  material_spec: null,
  sale_id: null,
  orderNum: 1
}
export default {
  name: 'Produceshiftorder',
  components: { AddDialog, pagination, crudOperation, rrOperation, udOperation, MaterDtl, Treeselect, ViewDialog },
  mixins: [presenter(), header(), form(defaultForm), crud()],
  dicts: ['PDM_BI_SHIFTTYPE', 'MPS_BD_ORDERSTATUS', 'is_used', 'PDM_BI_ORDERTYPE', 'IS_OR_NOT'],
  cruds() {
    return CRUD({
      title: '工单', url: 'api/produceshiftorder', idField: 'produceorder_id', sort: 'produceorder_id,desc',
      optShow: {
        add: true,
        edit: false,
        del: false,
        download: false,
        reset: true
      },
      query: {
        order_status: '-1'
      },
      crudMethod: { ...crudProduceshiftorder }
    })
  },
  data() {
    return {
      classes3: [],
      materType: '01',
      materialShow: false,
      addShow: false,
      workprocedureList: [],
      order_status: ['-1'],
      permission: {},
      rules: {
        produceorder_code: [
          { required: true, message: '生产班次工单编号不能为空', trigger: 'blur' }
        ],
        producedeviceorder_code: [
          { required: true, message: '机台工单号不能为空', trigger: 'blur' }
        ],
        shift_type_scode: [
          { required: true, message: '班次类型不能为空', trigger: 'blur' }
        ],
        workprocedure_id: [
          { required: true, message: '工序标识不能为空', trigger: 'blur' }
        ],
        produce_date: [
          { required: true, message: '生产日期不能为空', trigger: 'blur' }
        ],
        plan_qty: [
          { required: true, message: '计划数量不能为空', trigger: 'blur' }
        ],
        material_code: [
          { required: true, message: '物料编码不能为空', trigger: 'change' }
        ],
        order_status: [
          { required: true, message: '工单状态不能为空', trigger: 'blur' }
        ],
        is_needmove: [
          { required: true, message: '是否搬运不能为空', trigger: 'blur' }
        ],
        order_type_scode: [
          { required: true, message: '工单类型不能为空', trigger: 'blur' }
        ],
        orderNum: [
          { required: true, message: '生成工单数量不能为空', trigger: 'blur' }
        ],
        is_canupdate_update: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  created() {
    this.getworkprocedure()
    this.initClass3()
  },
  methods: {
    initDataPlan() {
      const date = this.dateFormatter(new Date())
      const formatter1 = this.dateFormatter1(new Date())
      this.form.planproducestart_date = date
      this.form.planproduceend_date = formatter1
      this.form.produce_date = date
    },
    change(val) {
      const d = new Date()
      const year = d.getFullYear()
      const month = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : (d.getMonth() + 1)
      const day = d.getDate() < 10 ? '0' + d.getDate() : d.getDate()
      if (val === '02') {
        this.form.planproducestart_date = [year, month, day].join('-') + ' ' + ['18', '30', '00'].join(':')
        const day1 = d.getDate() < 10 ? '0' + (d.getDate() + 1) : d.getDate() + 1
        this.form.planproduceend_date = [year, month, day1].join('-') + ' ' + ['07', '30', '00'].join(':')
      }
      if (val === '01') {
        this.form.planproducestart_date = [year, month, day].join('-') + ' ' + ['07', '30', '00'].join(':')
        this.form.planproduceend_date = [year, month, day].join('-') + ' ' + ['18', '30', '00'].join(':')
      }
    },
    dateFormatter(str) {
      const d = new Date(str)
      const year = d.getFullYear()
      const month = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : (d.getMonth() + 1)
      const day = d.getDate() < 10 ? '0' + d.getDate() : d.getDate()
      return [year, month, day].join('-') + ' ' + ['07', '30', '00'].join(':')
    },
    dateFormatter1(str) {
      const d = new Date(str)
      const year = d.getFullYear()
      const month = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : (d.getMonth() + 1)
      const day = d.getDate() < 10 ? '0' + d.getDate() : d.getDate()
      return [year, month, day].join('-') + ' ' + ['18', '30', '00'].join(':')
    },
    queryClassId() {
      const param = {
        'class_idStr': this.class_idStr
      }
      crudClassstandard.queryClassById(param).then(res => {
        this.classes = res.content.map(obj => {
          if (obj.hasChildren) {
            obj.children = null
          }
          return obj
        })
      })
    },
    buildTree(classes) {
      classes.forEach(data => {
        if (data.children) {
          this.buildTree(data.children)
        }
        if (data.hasChildren && !data.children) {
          data.children = null // 重点代码
        }
      })
    },
    // 获取子节点数据
    loadChildNodes({ action, parentNode, callback }) {
      if (action === LOAD_CHILDREN_OPTIONS) {
        crudClassstandard.getClass({ pid: parentNode.id }).then(res => {
          parentNode.children = res.content.map(function(obj) {
            if (obj.hasChildren) {
              obj.children = null
            }
            return obj
          })
          setTimeout(() => {
            callback()
          }, 100)
        })
      }
    },
    initClass3() {
      const param = {
        parent_class_code: '07'
      }
      crudClassstandard.getClassType(param).then(res => {
        const data = res.content
        this.buildTree(data)
        this.classes3 = data
      })
    },
    querytable() {
      this.crud.toQuery()
    },
    // 工单状态多选搜索
    handTaskStatus(value) {
      this.$forceUpdate()
      if (value) {
        this.order_status = JSON.parse(JSON.stringify(value))
        this.query.order_status = this.order_status.toString()
      }
      this.crud.toQuery()
    },
    // 查看
    toView(row) {
      console.log(row)
      if (row !== null) {
        this.$refs.child3.setForm(row)
      }
    },
    // 强制完成
    forceFinish(data) {
      crudProduceshiftorder.forceFinish({ row: data }).then(res => {
        this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
        this.crud.toQuery()
      })
    },
    // 取两位小数点
    rounding(row, column) {
      return parseFloat(row[column.property]).toFixed(2)
    },
    // 下发按钮禁用条件
    is_disabled(rows) {
      var length = rows.length
      if (length > 1) {
        var flag = false
        for (let i = 0; i < rows.length; i++) {
          if (rows[i].order_status !== '00') {
            flag = true
            break
          }
        }
        return flag
      } else if (length === 1 && rows[0].order_status === '00') {
        return false
      } else {
        return true
      }
    },
    // 新增编辑给form表单物料相关信息赋值
    setMaterValue(row) {
      this.form.material_id = row.material_id
      this.form.material_code = row.material_code
      this.form.material_name = row.material_name
      this.form.material_spec = row.material_spec
    },
    getworkprocedure() {
      // 查询工序
      crudWorkProcedure.downSelect({}).then(res => {
        this.workprocedureList = res
      })
    },
    // 下发
    submits(rows) {
      rows.forEach((item) => {
        var produceorder_id = item.produceorder_id
        crudProduceshiftorder.submits({ produceorder_id: produceorder_id }).then(res => {
        })
      })
      this.crud.notify('下发成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
      this.crud.toQuery()
    },
    add() {
      this.addShow = true
    },
    copyAdd(data) {
      this.crud.toCopy(data)
    },
    [CRUD.HOOK.beforeToAdd]() {
      this.initDataPlan()
    }
  }
}
</script>

<style scoped>

</style>