<template>
|
<el-dialog :visible.sync="show" :show-close="false" width="80%" top="51px" :close-on-click-modal="false">
|
<div class="content">
|
<el-form label-position="left" label-width="105px" :model="form" :rules="rules">
|
<div class="title">个人信息</div>
|
<div class="company">所属公司：成都喜望软件有限公司</div>
|
<el-row :gutter="90" class="companyForm">
|
<el-col :span="6.5">
|
<el-form-item label="姓名:">
|
<el-input v-model="form.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6.5"><el-form-item label="手机号:" label-width="120px">
|
<el-input v-model="form.region"></el-input>
|
</el-form-item></el-col>
|
<el-col :span="6.5"><el-form-item label="邮箱:">
|
<el-input v-model="form.type"></el-input>
|
</el-form-item></el-col>
|
</el-row>
|
<div class="company" style="margin-top: 6px;">其他邮箱
|
<div class="btn"><img src="@/assets/add.png" alt="">新增邮箱</div>
|
</div>
|
<el-row :gutter="90" class="companyForm">
|
<el-col :span="6.5">
|
<el-form-item label="邮箱:" prop="email">
|
<el-input v-model="form.email"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="16"><el-form-item label="备注:" label-width="120px">
|
<div style="display: flex;align-items: center;"><el-input v-model="form.region"></el-input>
|
<img style="width: 19px;height: 21px;cursor: pointer;margin-left: 26px;"
|
src="@/assets/delete.png" alt="">
|
</div>
|
</el-form-item></el-col>
|
|
</el-row>
|
<div class="company" style="margin-top: 6px;">常用收件信息
|
<div class="btn"><img src="@/assets/add.png" alt="">新增收件人</div>
|
</div>
|
<el-row :gutter="90" class="companyForm">
|
<el-col :span="6.5">
|
<el-form-item label="收件人姓名:">
|
<el-input v-model="form.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6.5"><el-form-item label="收件人手机号:" label-width="120px">
|
<el-input v-model="form.region"></el-input>
|
</el-form-item></el-col>
|
<el-col :span="6.5"><el-form-item label="收件人邮箱:">
|
<el-input v-model="form.type"></el-input>
|
</el-form-item></el-col>
|
<el-col :span="20" style="padding-right: 73px;"><el-form-item label="收件人地址:">
|
<el-input v-model="form.type"></el-input>
|
</el-form-item></el-col>
|
<el-col :span="20" style="padding-right: 73px;position: relative;"><el-form-item label="备注:">
|
<div style="display: flex;align-items: center;"><el-input type="textarea" :rows="3"
|
v-model="form.region"></el-input>
|
<img style="width: 19px;height: 21px;cursor: pointer;position: absolute;right: -175px;"
|
src="@/assets/delete.png" alt="">
|
</div>
|
</el-form-item></el-col>
|
</el-row>
|
</el-form>
|
<div class="btns">
|
<el-button @click="$emit('close')">关闭</el-button>
|
<el-button type="primary">保存</el-button>
|
</div>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
export default {
|
props: ['show'],
|
data() {
|
return {
|
form: {
|
name: '',
|
region: '',
|
type: '',
|
email: ''
|
},
|
rules: {
|
email: [
|
{ required: true, message: '请选择活动区域', trigger: 'change' }
|
],
|
}
|
};
|
},
|
watch: {
|
show(val) {
|
if (val) {
|
console.log(this.$store.state.userInfo, '111');
|
}
|
}
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.content {
|
.title {
|
padding: 31px 0;
|
text-align: center;
|
font-size: 18px;
|
font-weight: bold;
|
color: #3B3F56;
|
line-height: 27px;
|
}
|
|
.company {
|
font-weight: bold;
|
font-size: 16px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
color: #3B3F56;
|
line-height: 24px;
|
margin-left: 38px;
|
padding-right: 50px;
|
|
.btn {
|
width: 151px;
|
height: 50px;
|
border-radius: 4px;
|
background: #014099;
|
font-size: 16px;
|
color: #fff;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
cursor: pointer;
|
|
img {
|
width: 20px;
|
height: 20px;
|
margin-right: 13px;
|
}
|
}
|
}
|
|
.companyForm {
|
margin-top: 32px;
|
border-bottom: 1px solid rgba(151, 151, 151, 0.12);
|
padding-left: 38px;
|
}
|
|
.btns {
|
display: flex;
|
justify-content: center;
|
margin-top: 32px;
|
padding-bottom: 33px;
|
|
.el-button {
|
width: 190px;
|
height: 50px;
|
font-size: 20px;
|
|
}
|
|
.el-button--primary {
|
background-color: #014099;
|
border-color: #014099;
|
}
|
}
|
}
|
|
/deep/ .el-dialog {
|
border-radius: 8px;
|
|
.el-dialog__header {
|
display: none !important;
|
}
|
|
.el-dialog__body {
|
padding: 0 !important;
|
|
}
|
}
|
|
/deep/ .el-form {
|
.el-form-item__label {
|
font-size: 16px;
|
color: #3B3F56;
|
font-weight: 500;
|
}
|
}
|
</style>
|
