art: 上料列表、新增页面

zhangherong

17 小时以前 c95e7e5af5e80d6603b8dfc922201079b27b9056

 src/views/mes/modules/MesMaterialLoadingForm.vue

@@ -4,43 +4,29 @@
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="删除标记" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="delFlag">
              <a-input-number v-model="model.delFlag" placeholder="请输入删除标记" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="工单ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workOrderId">
              <a-input v-model="model.workOrderId" placeholder="请输入工单ID"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="设备ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="equipmentId">
              <a-input v-model="model.equipmentId" placeholder="请输入设备ID"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="工序编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="processCode">
              <a-input v-model="model.processCode" placeholder="请输入工序编码"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="工序名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="processName">
              <a-input v-model="model.processName" placeholder="请输入工序名称"  ></a-input>
            <a-form-model-item label="产线" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="factoryId">
              <j-search-select-tag placeholder="请选择产线" v-model="model.factoryId"
                                   dict="base_factory,factory_name,id,del_flag=0 and factory_category='3'"
                                   @change="factorySelectChange"></j-search-select-tag>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="物料编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="materialNumber">
              <a-input v-model="model.materialNumber" placeholder="请输入物料编码"  ></a-input>
              <j-search-select-tag v-model="model.materialNumber" placeholder="请选择物料编码"
                                   :dict-options="materialNumberDictOptions"
                                   @change="materialNumberSelectChange"></j-search-select-tag>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="物料名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="materialName">
              <a-input v-model="model.materialName" placeholder="请输入物料名称"  ></a-input>
              <a-input v-model="model.materialName" placeholder="请输入物料名称" readOnly></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="批次号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="batchNumber">
              <a-input v-model="model.batchNumber" placeholder="请输入批次号"  ></a-input>
              <j-search-select-tag v-model="model.batchNumber" placeholder="请选择批次号"
                                   :dict-options="batchNumberDictOptions"
                                   @change="batchNumberSelectChange"></j-search-select-tag>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
@@ -48,9 +34,10 @@
              <a-input-number v-model="model.quantity" placeholder="请输入数量" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="剩余数量" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remainingQuantity">
              <a-input-number v-model="model.remainingQuantity" placeholder="请输入剩余数量" style="width: 100%" />
          <a-col :span="12" v-if="materialCategory === 'STEEL_BALL'">
            <a-form-model-item label="钢球尺寸" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="steelBallSize">
              <j-search-select-tag v-model="model.steelBallSize" placeholder="请选择钢球尺寸" dict="steel_ball_size"
                                   style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>
@@ -61,89 +48,159 @@

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'

  export default {
    name: 'MesMaterialLoadingForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
export default {
  name: 'MesMaterialLoadingForm',
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {
        factoryId: [
          { required: true, message: '产线是必选项', trigger: 'change' }
        ],
        materialNumber: [
          { required: true, message: '物料编码是必填项', trigger: 'change' }
        ],
        materialName: [
          { required: true, message: '物料名称是必填项', trigger: 'change' }
        ],
        batchNumber: [
          { required: true, message: '批次号是必选项', trigger: 'change' }
        ],
        quantity: [
          { required: true, message: '数量是必填项', trigger: 'change' }
        ],
        steelBallSize: [
          { required: false, message: '钢球尺寸是必填项', trigger: 'change' }
        ]
      },
      materialCategory: undefined,
      batchNumberDictOptions: [],
      inventoryList: [],
      url: {
        add: '/mes/mesMaterialLoading/add',
        edit: '/mes/mesMaterialLoading/edit',
        queryById: '/mes/mesMaterialLoading/queryById',
        queryMaterialInventory: '/lsw/materialInventory/queryMaterialInventory'
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
    data () {
      return {
        model:{
         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {
        },
        url: {
          add: "/mes/mesMaterialLoading/add",
          edit: "/mes/mesMaterialLoading/edit",
          queryById: "/mes/mesMaterialLoading/queryById"
    materialNumberDictOptions() {
      let materialNumberArr = new Set()
      let materialNumberOptions = []
      for (let item of this.inventoryList) {
        if (!materialNumberArr.has(item.materialNumber)) {
          materialNumberOptions.push({
            value: item.materialNumber,
            text: item.materialNumber + '(' + item.materialName + ')',
            materialCategory: item.materialCategory,
            materialName: item.materialName
          })
          materialNumberArr.add(item.materialNumber)
        }
      }
      return materialNumberOptions
    }
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
    add() {
      this.edit(this.modelDefault)
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    edit(record) {
      this.model = Object.assign({}, record)
      this.visible = true
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
    submitForm() {
      const that = this
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
         
        })
      },
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$emit('ok')
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        }

      })
    },
    factorySelectChange(val) {
      getAction(this.url.queryMaterialInventory, { factoryId: val }).then((res) => {
        if (res.success) {
          this.inventoryList = res.result.map(item => ({ ...item }))
        }
      })
    },
    materialNumberSelectChange(val) {
      let option = this.materialNumberDictOptions.find(item => item.value === val)
      if (option) {
        this.model.materialName = option.materialName
        this.materialCategory = option.materialCategory
        let map = this.inventoryList.filter(item => item.materialNumber === val).map(item => ({
          value: item.batchNumber,
          text: item.batchNumber,
          quantity: item.quantity
        }))
        this.batchNumberDictOptions = [...map]
        this.validatorRules.steelBallSize[0].required = true
      } else {
        this.model.materialName = ''
        this.materialCategory = undefined
        this.batchNumberDictOptions = []
        this.validatorRules.steelBallSize[0].required = false
      }
    },
    batchNumberSelectChange(val) {
      let option = this.batchNumberDictOptions.find(item => item.value === val)
      if (option) {
        this.model.quantity = option.quantity
      } else {
        this.model.quantity = null
      }
    }
  }
}
</script>