platformFront/src/components/admin/ModifinedOrga.vue

<!-- 添加机构信息 By_liucf -->
<template>
    <div>
        <crumbs title="机构信息-修改机构" linkTo="organizationInfo">
        </crumbs>
        <div class="contents">
            <el-form ref="form" :model="form" :rules="rules" label-width="110px" class="add-admin-form">
                <h4>基本信息</h4>
                <el-form-item label="机构名称："><el-input v-model="form.orgName" :disabled="true"></el-input></el-form-item>
                <el-form-item label="机构负责人：" ><el-input v-model="form.orgPrincipal" :disabled="true"></el-input></el-form-item>
                <el-form-item label="机构所在地：" prop="orgAddress" required >
                    <el-input v-model="form.orgAddress" placeholder="请输入机构所在地"></el-input>
                </el-form-item>
                <el-form-item label="机构属性：" required>
                    <el-select v-model="form.orgType" placeholder="请选择机构">
                        <el-option v-for="item in orgList" :key="item.key" :label="item.name" :value="item.key">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="下属机构数量：">
                    <!--<el-input v-model="form.orgSubNum" placeholder="请输入下属机构数量" @blur="handleNumInput"></el-input>-->
                    {{form.orgSubNum}}
                </el-form-item>
                <el-button size="small" type="primary" @click="modifineOrga">确定修改</el-button>
            </el-form>
        </div>
    </div>
</template>

<script>
  import api from '../../api/index.js';
  import adminApi from '@api/admin.js';
  import utils from '@api/utils.js';

  export default {
    name: 'ModifinedOrga',
    data(){
      return {
        orgList:[],
        form: {
          orgPrincipal: '',//负责人
          orgAddress: '',
          orgSubNum: null,
          orgName: '',
          orgType: '',
          orgId:''
        },
        rules: {
          orgAddress: [
            {required:true, message: '请输入机构所在地', trigger: ['blur', 'change']}
          ]
        }
      }
    },
    created() {
      const info = this.$route.query.info;console.log(info)
      this.form.orgId = info.orgId;
      this.form.orgName = info.orgName;
      this.form.orgPrincipal = info.orgPrincipal;
      this.form.orgAddress = info.orgAddress;
      this.form.orgType = info.orgType;
      this.form.orgSubNum = info.orgSubNum;
      const enumsList = JSON.parse(localStorage.getItem('enumsData'));
      this.orgList = enumsList.organizationTypeEnum;
    },
    methods: {
      modifineOrga() {
        if(this.form.orgAddress && this.form.orgAddress.trim() && this.form.orgType!==''){
          adminApi.modifineOrganization(this.form).then((res) => {
          if (res.data.code == '0') {
            this.$message({showClose: true, message: "修改成功", type: 'success'});
            this.$router.push({path: 'LT-KHZX-JGXX'});
          } else {
            this.$message({
              showClose: true,
              message: res.data.msg,
              type: 'warning'
            });
          }
        }).catch((error) => {
          this.$message({
            showClose: true,
            message: "服务器正忙...",
            type: 'warning'
          });
        })
      }else{
        this.$message({
          showClose: true,
          message: '请完整填写机构信息',
          type: 'warning'
        });
      }
      },
      handleNumInput(){//机构数量只能数字
        const numReg = new RegExp(/[^\d]/g);
        if(numReg.test(this.form.orgSubNum) || this.form.orgSubNum < 0){
          this.form.orgSubNum = null;
        }
      }
    }
  }
</script>

<style lang="less" scoped>
    @import "../../less/admin.less";

    .add-admin-form {
        background: #fff;
        padding: 20px 10px 30px;

    &
    > div {
        margin-left: 9px;
    }

    }
    h4 {
        text-indent: 20px;
        font-size: 15px;
        margin-bottom: 20px;
    }
  .el-button{
    margin: 30px 0 0 20px;
  }
  .el-dropdown{
    margin-bottom: 15px;
  }
  .contents{
    position: relative;
    .back{
      position: absolute;
      top: 10px;
      left: 5px;
      z-index: 7;
      cursor: pointer;
    }
  }
</style>