dev/dcp-web-gate/src_old/views/userCenter/userCenterItem/userCenteraddUnitPersonnel.vue

<template>
    <div style="width: 100%;background: #fff;min-height: 700px;" class="userCenterAuthenticationPersonal">
        <div style="height: 80px;line-height: 80px;margin-top: 20px;margin: 0 20px; color: #666;font-size: 15px; border-bottom: 1px solid #bcbcbc;">
            {{$t('common.addPersonnel')}}
            <!-- <span style="float: right;margin-top: 27px;"> <i class="el-icon-edit"></i> 修改</span> -->
        </div>     
        <div style="width: 600px;" >
            <el-form ref="form" :model="unitPersonnel" label-width="160px" class="demo-ruleForm"  :rules="rules" style="margin-left: 100px;margin-top: 20px;width: 700px;">
                <el-form-item :label="$t('common.name')" prop='name'>
                    <el-input v-model="unitPersonnel.name" :disabled="false" style="width: 70%;"></el-input>
                  </el-form-item>
                  <el-form-item :label="$t('common.MobilePhone')" prop='preferredMobile'>
                    <el-input v-model="unitPersonnel.preferredMobile" :disabled="false" style="width: 70%;"></el-input>
                  </el-form-item>
                  <el-form-item :label="$t('common.emailInfo')" prop='email'>
                    <el-input v-model="unitPersonnel.email" :disabled="false" style="width: 70%;"></el-input>
                  </el-form-item>
            </el-form>
        </div>
        <div style="height: 200px;">
            <div style="margin-top: 100px;">
                <el-button type="warning" style="margin-left: 300px;" @click="save">{{$t('common.Save')}}</el-button>
                <el-button type="primary" style="margin-left: 30px;" @click="close">{{$t('common.cancel')}}</el-button>
            </div>
        </div>
    </div>
</template>
<script>
    import Base from "@/views/base/Base";
    import { saveOrUpdate,getUnitPersonnelById} from "@/api/userCenter/unitPersonnel";
     export default {
        name: 'userCenterAuthenticationPersonal',
        extends: Base,
        data () {
            return {
                informationsClass:'1',
                dialogVisible: false,
                ifDiaslog:'',
                title:'',
                id: this.$route.params.key,
                unitPersonnel: {
                    name: '',
                    preferredMobile:'',
                    email:'',
                    baseEntityId:'',
                    status:'',
                    statusDict:'',
                },
            }
        },
        watch: {
            '$i18n.locale'(){
            this.toInitData();
            }
        },
        mounted() {
            this.initData();
        },
         computed: {
             rules() {
                 return {
                     name: [
                         {required: true, message: this.$t('common.namePlaceholder'), trigger: 'blur'},
                         {min: 3, max: 5, trigger: 'blur'}
                     ],
                     email: [
                         {required: false, message: this.$t('common.EnterEmail'), trigger: 'blur'}
                     ],
                     preferredMobile: [
                         {required: false, message: this.$t('common.EnterMobile'), trigger: 'blur'}
                     ]
                 }
             }
         },
        methods:{
            initData(){
                if(this.id){
                    getUnitPersonnelById(this.id).then((result) => {
                        var data = result.data;
                        if (data) {
                            console.log(data.unitPersonnelInformation);
                            this.unitPersonnel = data.unitPersonnelInformation;
                        }
                    }) .catch(error => {
                        // 此处你的业务代码
                        this.$message({
                            message: error.msg,
                            type: 'error'
                        });
                        this.resetToken();
                    });
                }

            },
            save: function () {
                this.$refs["form"].validate((valid) => {
                    if (valid) {
                        this.unitPersonnel.status = "未确认";
                        this.unitPersonnel.statusDict="0";
                        var users=localStorage.getItem('user');
                        var user = JSON.parse(users);
                        this.unitPersonnel.baseEntityId = user.umsUser.unitEntityId;
                        this.submitHandler(token => {
                            saveOrUpdate(
                                JSON.stringify(this.unitPersonnel),
                                token
                            )
                                .then(result => {
                                    this.$message({
                                        message: this.$t('common.addSuccess'),
                                        type: 'success'
                                    });
                                    this.unitPersonnel = {};
                                    this.$router.go(-1);//返回上一层
                                })
                                .catch(error => {
                                    // 此处你的业务代码
                                    this.$message({
                                        message: error.msg,
                                        type: 'error'
                                    });
                                    this.resetToken();
                                });
                        });
                    }
                });


                
            },
            close(){
                this.$router.go(-1);
            },
            goAithentication(num){
                this.$router.go(-1);//返回上一层
            },
            handleChange (value) {
                console.log(value)
            },
            photoSuccess(res, file) {
                this.baseProjectView.reserveTwo = res.data;
            },
            handleAvatarSuccessAnnex(res, file) {
                this.baseProjectView.reserveThree = res.data;
            },   
            dialogVisibles(){
                this.dialogVisible=true
            },
        }
    }
</script>
<style scoped>
    .el-button {
        width: 200px;
        height: 45px;
    }
    .authenticationBox1 {
        margin-left: 35px;
        margin-right: 150px;
        height: 100px;
        border: 1px solid rgba(153, 153, 153, 1);
        border-radius: 10px;
        margin-top: 50px;
        position: relative;
    }
    .authenticationBox2 {
        margin: 50px 150px 0 35px;
         height: 100px;
         border: 1px solid rgba(153, 153, 153, 1);
         border-radius: 10px;
         position: relative;
    }
    .authenticationBox1:hover,
    .authenticationBox2:hover {
        border: 1px solid #ff8400;
    }
        .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }
    .userCenterAuthenticationPersonal>>>.el-upload {
        border: 1px solid rgba(204, 204, 204, 1);
    }
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
</style>