UpdateCabinetDialog.vue

<template>
  <!-- 机架创建对话框 -->
  <el-dialog
    @close="close"
    @opened="updateCabinetInit"
    v-dialogDrag
    :title="$t('CabinetConfigurationManagement.dialogCabinetUpdate')"
    style="font-size: 10px;" width='450px'
    :visible.sync="UpdateCabinetVisible">
    <el-form :model="form" inline="true">
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogCabinetName')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.cabinetName" v-on:blur="textLengthCheck(form.cabinetName)&&cabinetNameCheck()" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogCabinetType')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.cabinetType" v-on:blur="textLengthCheck(form.cabinetType)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogBelongLocation')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-select v-model="value" size="mini" :placeholder="$t('common.selectOption')" clearable v-on:change="deviceBelongLocation" style="width: 200px">
          <el-option
            v-for="item in locationList"
            :key="item.locationKey"
            :label="item.locationName"
            :value="item.locationKey">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogHeight')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.height" v-on:blur="textLengthCheck(form.height)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogDeep')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.depth" v-on:blur="textLengthCheck(form.depth)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogWidth')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.width" v-on:blur="textLengthCheck(form.width)" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogFrameCount')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.frameCount" v-on:blur="textLengthCheck(form.frameCount)&&frameCountNumberCheck()" autocomplete="off" style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item :label="$t('CabinetConfigurationManagement.dialogVoltage')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' :placeholder="$t('common.placeholder')" v-model="form.voltage" v-on:blur="textLengthCheck(form.voltage)" 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="updateCabinet" v-loading.fullscreen.lock="fullscreenLoading">{{$t('common.updateBtn')}}</el-button>
      <el-button size = 'mini' @click="close">{{$t('common.cancel')}}</el-button>
    </div>
  </el-dialog>
</template>

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

  export default {
    props: ['command'],
    data: function () {
      return {

        locationList:[],

        initList: this.command.target,
        UpdateCabinetVisible: false,
        formLabelWidth: '120px',
        form: {
          cabinetKey: "",
          locationKey: "",
          cabinetName: "",
          cabinetType: "",
          height: "",
          depth: "",
          width: "",
          frameCount: "",
          voltage: "",
        },
        value:'',
      }
    },
    methods: {
      close() {
        this.command.done();
      },

      /**
       * @Description  :获取全部机房信息，
       * @date         : 2018/12/13
       */
      getAllLocation: function () {
        //就这句没改
        let _this = this;
        LocationService.getAllLocationCollection().then(result => {
          //成功
          _this.locationList = Object.values(result)
        }).catch(err => {
          //失败
        })
      },

      //------------------------------------创建开始-------------------------------------------------------------------
      updateCabinetInit(){
        this.form.cabinetKey = this.initList.cabinetKey;
        this.form.locationKey = this.initList.locationKey;
        this.form.cabinetName = this.initList.cabinetName;
        this.form.cabinetType = this.initList.cabinetType;
        this.form.height = this.initList.height;
        this.form.depth = this.initList.depth;
        this.form.width = this.initList.width;
        this.form.frameCount = this.initList.frameCount;
        this.form.voltage = this.initList.voltage;
        this.value = this.initList.locationKey;
      },

      updateCabinet() {
        let _this = this
        if (!(_this.cabinetNameCheck()&&_this.frameCountNumberCheck())) {
          return
        }
        if(_this.value==''||_this.value==null){
          //所属机房不能为空
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.CABINET_BELONG_LOCATION_CODE))
          return
        }else {
          let cabinet = {};
          cabinet.cabinetKey = _this.form.cabinetKey
          cabinet.locationKey = _this.value
          cabinet.cabinetName = _this.form.cabinetName
          cabinet.cabinetType = _this.form.cabinetType
          cabinet.height = _this.form.height
          cabinet.depth = _this.form.depth
          cabinet.width = _this.form.width
          cabinet.frameCount = _this.form.frameCount
          cabinet.voltage = _this.form.voltage

          let loadingInstance = _this.Loading.openLoading();
          CabinetService.modifyCabinet(cabinet).then(result => {
            //成功
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.MODIFY_CODE))
            _this.close();
          }).catch(err => {
            //失败
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.errorTip(_this, err);
//            this.command.done();
          });
//          this.command.done();
        }
      },


      //------------------------------------创建结束-------------------------------------------------------------------

      //------------------------------------验证开始-------------------------------------------------------------------
      /**
       * @Description  ：机架名称校验： 不能为空
       * @date         :
       */
      cabinetNameCheck: function () {
        let cabinetCheck = legitimacyCheck()
        if (!cabinetCheck.textNullCheck(this.form.cabinetName)) {
          //输入不可为空
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE),this.$t('CabinetConfigurationManagement.CabinetName'))
          return false
        }
        this.textLengthCheck(this.form.cabinetName)
        return true
      },

      /**
       * @Description  ：文本框所输入的字符长度校验： 控制在20之内
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         : 2019/1/15 16:09
       */
      textLengthCheck: function (checkString) {
        let subnetCheck = legitimacyCheck()
        if (!subnetCheck.textLengthCheck(checkString)) {
          //所输文本长度必须控制在20之内
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.LENGTH_CODE))
          return false
        }
        return true
      },


      //数字校验
      frameCountNumberCheck:function(){
        //框位数数值类型检验
        var regPos = /^\d+(\.\d+)?$/; //非负浮点数
        var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
        if(this.form.frameCount!=''&&!(regPos.test(this.form.frameCount) || regNeg.test(this.form.frameCount))){
          //请输入合法性数字
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.DIGIT_CODE),this.$t('CabinetConfigurationManagement.FrameCount'))
          return false;
        }
        return true;
      },


      //------------------------------------验证结束-------------------------------------------------------------------

    },

    created() {
      this.getAllLocation();
    },
    mounted(){
      this.UpdateCabinetVisible = true;
    }
  }
</script>