CreateAndCopyLocatonCofig.vue

<template>
  <!-- 机房创建对话框 -->
  <el-dialog
    v-dialogDrag style="font-size: 10px;" width='450px'
    :title=title
    :visible.sync="dialog_locationCreate"
    @close="close"
    @opened="createLocationConfigInit"
    v-dialogDrag>
    <el-form :model="form" inline="true">
      <el-form-item :label="$t('LocationConfigurationManagement.dialogLocationId')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.locationID" v-on:blur="legalCheck(form.locationID)&&locationIDCheck()" autocomplete="off" style="width: 200px"></el-input>

      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogLocationName')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.locationName" v-on:blur="legalCheck(form.locationName)&&locationNameCheck()" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogLine')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.line" v-on:blur="legalCheck(form.line)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogSite')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.site" v-on:blur="legalCheck(form.site)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogKm')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.km" v-on:blur="legalCheck(form.km)" autocomplete="off" style="width: 200px" ></el-input>
      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogLongitude')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.longitude" v-on:blur="legalCheck(form.longitude)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('LocationConfigurationManagement.dialogLatitude')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.latitude" v-on:blur="legalCheck(form.latitude)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button size = 'mini' type="primary" @click="createLocation" v-loading.fullscreen.lock="fullscreenLoading">{{$t('common.createBtn')}}</el-button>
      <el-button size = 'mini' @click="close">{{$t('common.cancel')}}</el-button>
    </div>
  </el-dialog>

</template>

<script>
  import LocationService from '@/domain/services/LocationService.js'
  import legitimacyCheck from "../../../utils/legitimacyCheck";
  import HelperUtil from '@/utils/HelperUtil'

    export default {
      name: "CreateAndCopyLocationCofig",
      props:['command'],
      //vue加载初始化函数，加载数据
      created:function(){
        //this.getAllLocationInit()

      },
      beforeCreate:function(){

      },
      data:function(){
        return {
          dialog_locationCreate:false,
          fullscreenLoading:false,
          initList: this.command.target,
          title:this.command.title,
          form:{
            locationID:null,
            locationName:null,
            line:null,
            site:null,
            km:null,
            longitude:null,
            latitude:null,
            locationKey:'',
            delFlag:0,
            modifyTime:'',
          },
          formLabelWidth: '120px',
        }
      },
      methods: {
        //关闭对话框
        close() {
          this.command.done();
        },

        //从command拿值
        createLocationConfigInit(){
          this.form.locationID = this.initList.locationID;
          this.form.locationName = this.initList.locationName;
          this.form.line = this.initList.line;
          this.form.site = this.initList.site;
          this.form.km = this.initList.km;
          this.form.longitude = this.initList.longitude;
          this.form.latitude = this.initList.latitude;
          this.form.locationKey = this.initList.locationKey;
          this.form.delFlag = this.initList.delFlag;
          this.form.modifyTime = this.initList.modifyTime;
        },

        //合法性检查
        legalCheck: function(attr){
          let legal=legitimacyCheck();
          if(legal.textLengthCheck(attr)){
            return true;
          }else{
            //所输文本长度必须控制在20之内
            this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.LENGTH_CODE))
            return;
          }
        },

        //创建
        createLocation:function(){
          let _this = this
          let loc={};
          loc.locationKey='';
          loc.locationId=_this.form.locationID;
          loc.locationName=_this.form.locationName;
          loc.line=_this.form.line;
          loc.site=_this.form.site;
          loc.km=_this.form.km;
          loc.longitude=_this.form.longitude;
          loc.latitude=_this.form.latitude;
          loc.delFlag=0;
          loc.modifyTime='';
          if(!(_this.locationNameCheck()&&_this.locationIDCheck())){
            return;
          }
          let loadingInstance = _this.Loading.openLoading();
          LocationService.addLocation(loc).then(result=>{
            //成功
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.ADD_CODE))
            _this.close();
          }).catch(err => {
            //失败
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.errorTip(_this, err);
//            this.command.done();
          });
        },

        locationNameCheck: function () {
          let locationCheck =  legitimacyCheck()
          if (!locationCheck.textNullCheck(this.form.locationName)) {
            //输入不可为空
            this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE),this.$t('LocationConfigurationManagement.locationName'))
            return false;
          }
          return true
        },

        locationIDCheck:function(){
          let locationCheck =  legitimacyCheck()
          if (!locationCheck.textNullCheck(this.form.locationID)) {
            //输入不可为空
            this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE),this.$t('LocationConfigurationManagement.locationId'))
            return false
          }
          return true
        },

      },
      mounted(){
        this.dialog_locationCreate = true;
      }
    }
</script>