|  | @@ -0,0 +1,237 @@
 | 
	
		
			
				|  |  | +<template>
 | 
	
		
			
				|  |  | +    <a-modal
 | 
	
		
			
				|  |  | +      :title="(defaultMethod == 'add')?'新增':'编辑'"
 | 
	
		
			
				|  |  | +       width="60%"
 | 
	
		
			
				|  |  | +      :visible="visible"
 | 
	
		
			
				|  |  | +      :maskClosable="false"
 | 
	
		
			
				|  |  | +      switchFullscreen
 | 
	
		
			
				|  |  | +      @cancel="handleCancel"
 | 
	
		
			
				|  |  | +      @ok='handleOK'
 | 
	
		
			
				|  |  | +      >
 | 
	
		
			
				|  |  | +      <a-card :bordered="false" class="moddle" style="margin-bottom:1%" :loading = 'loading'>
 | 
	
		
			
				|  |  | +        <div class="table-page-search-wrapper">
 | 
	
		
			
				|  |  | +            <a-form-model layout="inline" :model="form" :rules="rules"  ref="form">
 | 
	
		
			
				|  |  | +              <a-row :gutter="24">
 | 
	
		
			
				|  |  | +                <a-col  :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                  <a-form-model-item label="料品名称" prop='inventoryName' >
 | 
	
		
			
				|  |  | +                    <a-input placeholder="请输入" v-model="form.inventoryName" ></a-input>
 | 
	
		
			
				|  |  | +                  </a-form-model-item>
 | 
	
		
			
				|  |  | +                </a-col>
 | 
	
		
			
				|  |  | +                <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                  <a-form-model-item label="料品类别"  prop='classifyName' >
 | 
	
		
			
				|  |  | +                    <a-input-search placeholder="请输入" v-model="form.classifyName" @search="searchClassName"></a-input-search>
 | 
	
		
			
				|  |  | +                  </a-form-model-item>
 | 
	
		
			
				|  |  | +                </a-col>
 | 
	
		
			
				|  |  | +                <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="料品辅单位" prop='auxiliaryUnit' >
 | 
	
		
			
				|  |  | +                      <a-select style="width:100%;"  v-model="form.auxiliaryUnit" @change="changeAuxiliaryUnit">
 | 
	
		
			
				|  |  | +                            <a-select-option v-for="(val,index) in unitOptions" :key="index" :value="val.Name">{{ val.Name }}</a-select-option>
 | 
	
		
			
				|  |  | +                        </a-select>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +                  <a-col :md="8" :sm="24" >
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="料品主单位" prop='unit' >
 | 
	
		
			
				|  |  | +                        <a-select style="width:100%;"  v-model="form.unit" @change="changeUnit">
 | 
	
		
			
				|  |  | +                            <a-select-option v-for="(val,index) in unitOptions" :key="index" :value="val.Name">{{ val.Name }}</a-select-option>
 | 
	
		
			
				|  |  | +                        </a-select>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +                  <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="颜色" prop='color' :labelCol="{offset: 1}">
 | 
	
		
			
				|  |  | +                      <a-input v-model="form.color"/>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +                  <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="支长" prop='fixedLength' :labelCol="{offset: 2}">
 | 
	
		
			
				|  |  | +                      <a-input v-model="form.fixedLength"/>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +                  <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="宽/高" prop='widthHeight' :labelCol="{offset: 1}">
 | 
	
		
			
				|  |  | +                      <a-input v-model="form.widthHeight"/>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +                  <a-col :md="8" :sm="24">
 | 
	
		
			
				|  |  | +                    <a-form-model-item label="料品属性" prop='attribute' >
 | 
	
		
			
				|  |  | +                      <a-input v-model="form.attribute" disabled/>
 | 
	
		
			
				|  |  | +                    </a-form-model-item>
 | 
	
		
			
				|  |  | +                  </a-col>
 | 
	
		
			
				|  |  | +              </a-row>
 | 
	
		
			
				|  |  | +            </a-form-model>
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +     </a-card>
 | 
	
		
			
				|  |  | +     <ClassNamePopup ref="ClassNamePopup" @okData="okData"></ClassNamePopup>
 | 
	
		
			
				|  |  | +    </a-modal>
 | 
	
		
			
				|  |  | +  </template>
 | 
	
		
			
				|  |  | +  <script>
 | 
	
		
			
				|  |  | +  
 | 
	
		
			
				|  |  | +      import { FormTypes } from '@/utils/JEditableTableUtil'
 | 
	
		
			
				|  |  | +      import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
 | 
	
		
			
				|  |  | +      import moment from "moment"
 | 
	
		
			
				|  |  | +      import { httpAction ,getAction,postAction,putAction} from '@/api/manage'
 | 
	
		
			
				|  |  | +      import ClassNamePopup from '../../Popup/ClassNamePopup.vue'
 | 
	
		
			
				|  |  | +      export default {
 | 
	
		
			
				|  |  | +        name: 'AddEncoder',
 | 
	
		
			
				|  |  | +        mixins: [JEditableTableModelMixin],
 | 
	
		
			
				|  |  | +        components: {
 | 
	
		
			
				|  |  | +            ClassNamePopup,
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        data() {
 | 
	
		
			
				|  |  | +          return {
 | 
	
		
			
				|  |  | +            visible:false,
 | 
	
		
			
				|  |  | +            form:{},
 | 
	
		
			
				|  |  | +            loading:false,
 | 
	
		
			
				|  |  | +            defaultMethod:'add',
 | 
	
		
			
				|  |  | +            unitOptions:[],
 | 
	
		
			
				|  |  | +            rules:{
 | 
	
		
			
				|  |  | +              inventoryName: [
 | 
	
		
			
				|  |  | +                { required: true, trigger: 'blur' },
 | 
	
		
			
				|  |  | +              ],
 | 
	
		
			
				|  |  | +              color:[
 | 
	
		
			
				|  |  | +                { required: true, trigger: 'blur' },
 | 
	
		
			
				|  |  | +              ],
 | 
	
		
			
				|  |  | +              widthHeight:[
 | 
	
		
			
				|  |  | +                { required: true, trigger: 'blur' },
 | 
	
		
			
				|  |  | +              ],
 | 
	
		
			
				|  |  | +              fixedLength:[
 | 
	
		
			
				|  |  | +                { required: true, trigger: 'blur' },
 | 
	
		
			
				|  |  | +              ],
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        created() {
 | 
	
		
			
				|  |  | +          
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        methods: {
 | 
	
		
			
				|  |  | +            handleCancel(){
 | 
	
		
			
				|  |  | +                this.form = {}
 | 
	
		
			
				|  |  | +                this.visible=false
 | 
	
		
			
				|  |  | +                this.defaultMethod='add'
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            getOptionUnit(){
 | 
	
		
			
				|  |  | +                getAction('/production/safetyStock/selectUnit').then((res) => {
 | 
	
		
			
				|  |  | +                  if (res.success) {
 | 
	
		
			
				|  |  | +                   this.unitOptions = res.result
 | 
	
		
			
				|  |  | +                  } else {
 | 
	
		
			
				|  |  | +                    this.$message.error(res.message);
 | 
	
		
			
				|  |  | +                  }
 | 
	
		
			
				|  |  | +                })
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            handleOK(){
 | 
	
		
			
				|  |  | +              this.$refs.form.validate(success => {
 | 
	
		
			
				|  |  | +	              if (success) {
 | 
	
		
			
				|  |  | +                    this.loading = true
 | 
	
		
			
				|  |  | +                    if(this.defaultMethod=='add'){
 | 
	
		
			
				|  |  | +                      postAction('/encoder/encoder/add', this.form).then((res) => {
 | 
	
		
			
				|  |  | +                        if (res.success) {
 | 
	
		
			
				|  |  | +                          this.$message.success('添加成功!');
 | 
	
		
			
				|  |  | +                          this.handleCancel()
 | 
	
		
			
				|  |  | +                          this.$emit('ok')
 | 
	
		
			
				|  |  | +                        } else {
 | 
	
		
			
				|  |  | +                          this.$message.error(res.message);
 | 
	
		
			
				|  |  | +                        }
 | 
	
		
			
				|  |  | +                      }).finally(() => {
 | 
	
		
			
				|  |  | +                        this.loading = false
 | 
	
		
			
				|  |  | +                      })
 | 
	
		
			
				|  |  | +                    }else{
 | 
	
		
			
				|  |  | +                      putAction('/encoder/encoder/edit', this.form).then((res) => {
 | 
	
		
			
				|  |  | +                        if (res.success) {
 | 
	
		
			
				|  |  | +                          this.$message.success('编辑成功!');
 | 
	
		
			
				|  |  | +                          this.handleCancel()
 | 
	
		
			
				|  |  | +                          this.$emit('ok')
 | 
	
		
			
				|  |  | +                        } else {
 | 
	
		
			
				|  |  | +                            this.$message.error(res.message);
 | 
	
		
			
				|  |  | +                        }
 | 
	
		
			
				|  |  | +                      }).finally(() => {
 | 
	
		
			
				|  |  | +                          this.loading = false
 | 
	
		
			
				|  |  | +                      })
 | 
	
		
			
				|  |  | +                    } 
 | 
	
		
			
				|  |  | +	              }
 | 
	
		
			
				|  |  | +              })  
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            getEditData(id){
 | 
	
		
			
				|  |  | +              getAction('/encoder/encoder/queryById',{id:id}).then((res) => {
 | 
	
		
			
				|  |  | +                  if (res.success) {
 | 
	
		
			
				|  |  | +                   this.form = res.result
 | 
	
		
			
				|  |  | +                  } else {
 | 
	
		
			
				|  |  | +                    this.$message.error(res.message);
 | 
	
		
			
				|  |  | +                  }
 | 
	
		
			
				|  |  | +                })
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            onSelectChange(selectedRowKeys, selectionRows) {
 | 
	
		
			
				|  |  | +                this.selectedRowKeys = selectedRowKeys;
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            okData(data){
 | 
	
		
			
				|  |  | +              this.$set(this.form,'classifyName',data.name)
 | 
	
		
			
				|  |  | +              this.$set(this.form,'classify',data.id )
 | 
	
		
			
				|  |  | +              this.$refs.form.clearValidate()
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            searchClassName(){
 | 
	
		
			
				|  |  | +                this.$refs.ClassNamePopup.visible = true
 | 
	
		
			
				|  |  | +                this.$refs.ClassNamePopup.getData()
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            changeUnit(data){
 | 
	
		
			
				|  |  | +                this.unitOptions.map(item=>{
 | 
	
		
			
				|  |  | +                    if(item.Name==data){
 | 
	
		
			
				|  |  | +                        this.form.unitId = item.ID
 | 
	
		
			
				|  |  | +                    }
 | 
	
		
			
				|  |  | +                })
 | 
	
		
			
				|  |  | +            },
 | 
	
		
			
				|  |  | +            changeAuxiliaryUnit(data){
 | 
	
		
			
				|  |  | +                this.unitOptions.map(item=>{
 | 
	
		
			
				|  |  | +                    if(item.Name==data){
 | 
	
		
			
				|  |  | +                        this.form.auxiliaryUnitId = item.ID
 | 
	
		
			
				|  |  | +                    }
 | 
	
		
			
				|  |  | +                })
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +  </script>
 | 
	
		
			
				|  |  | +  
 | 
	
		
			
				|  |  | +  <style scoped lang="less">
 | 
	
		
			
				|  |  | +    /* @import '~@assets/less/common.less' */
 | 
	
		
			
				|  |  | +    /deep/.ant-input{
 | 
	
		
			
				|  |  | +        height:29px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-input-number{
 | 
	
		
			
				|  |  | +      height:29px;
 | 
	
		
			
				|  |  | +      width:100%
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-select-selection--single {
 | 
	
		
			
				|  |  | +        height: 29px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-select{
 | 
	
		
			
				|  |  | +        font-size: 12px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-form label{
 | 
	
		
			
				|  |  | +        font-size: 12px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.table-page-search-wrapper .ant-form-inline .ant-form-item{
 | 
	
		
			
				|  |  | +        margin-bottom:9px
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.moddle>.ant-card-body{
 | 
	
		
			
				|  |  | +        padding-bottom:0px;
 | 
	
		
			
				|  |  | +        padding-top: 12px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-btn{
 | 
	
		
			
				|  |  | +        height:28px
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-modal-body{
 | 
	
		
			
				|  |  | +        padding-bottom: 0px;
 | 
	
		
			
				|  |  | +        // padding-top: 0px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-modal-content{
 | 
	
		
			
				|  |  | +        background: #f0f2f5;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-card-body .table-operator {
 | 
	
		
			
				|  |  | +        margin-bottom: 0px;
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    /deep/.ant-calendar-picker{
 | 
	
		
			
				|  |  | +        min-width: 0px !important;  
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +    // 表单校验隐藏提示文字
 | 
	
		
			
				|  |  | +    /deep/.ant-form-explain{
 | 
	
		
			
				|  |  | +      display:none
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +  </style>
 |