| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <div class="wrapper"> |
| | | <div class="wrapper" style="overflow: auto;"> |
| | | <div id="building"> |
| | | |
| | | <el-form ref="elForm" :model="personInfos" :rules="rules" size="medium" label-position="left" label-width="100px"> |
| | | <el-container> |
| | | <div style="padding-left:30px;padding-top: 50px"> |
| | | <el-container> |
| | | <el-col :span="6" :data="personInfos"> |
| | | <div class="block" :model="personInfos" > |
| | | <el-col v-model="personInfos.url" prop="url"> |
| | | <el-avatar shape="square" :size=200 > |
| | | <el-image |
| | | :src="'http://47.93.189.255:8080/'+ personInfos.url" |
| | | :fit="fit" |
| | | ></el-image> |
| | | </el-avatar> |
| | | </el-col> |
| | | </div> |
| | | </el-col> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 15px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="姓名" prop="nickName" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="身份" prop="identity" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.identity" placeholder="请输入身份" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="曾用名" prop="oldName" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="生肖" prop="idNo" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.idNo" placeholder="请输入生肖" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="星座" prop="grade" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.grade" placeholder="请输入星座" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 15px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="性别" prop="sex" label-width="45px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}" :disabled="dsb"></el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="民族" prop="nation" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="联系方式" prop="phoneNumber" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="微信号" prop="nationality" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.nationality" placeholder="请输入微信号" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="单位" prop="unit" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.unit" placeholder="请输入单位" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 15px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="婚姻状况" prop="sex" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.sex" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}" :disabled="dsb"></el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="配偶" prop="spouseId" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.spouseId" placeholder="请输入配偶" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="户籍地址" prop="locationAddress" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="常住地址" prop="alwaysAddress" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="职务职称" prop="position" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.position" placeholder="请输入职务职称" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | </el-container> |
| | | <el-divider /> |
| | | <el-container> |
| | | <div style="padding-left:30px;padding-top: 10px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="姓名" prop="nickName" label-width="50px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="身份" prop="identity" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.identity" placeholder="请输入身份" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="曾用名" prop="oldName" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="personInfos.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="生肖" prop="idNo" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.idNo" placeholder="请输入生肖" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="星座" prop="grade" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.grade" placeholder="请输入星座" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 10px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="性别" prop="sex" label-width="45px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}" :disabled="dsb"></el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="民族" prop="nation" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="联系方式" prop="phoneNumber" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="微信号" prop="nationality" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.nationality" placeholder="请输入微信号" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="单位" prop="unit" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.unit" placeholder="请输入单位" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 10px"> |
| | | <el-container> |
| | | <el-row> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="婚姻状况" prop="sex" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.sex" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}" :disabled="dsb"></el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="配偶" prop="spouseId" label-width="50px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.spouseId" placeholder="请输入配偶" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="户籍地址" prop="locationAddress" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="常住地址" prop="alwaysAddress" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | <el-cow :span="8"> |
| | | <el-form-item label="职务职称" prop="position" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;"> |
| | | <el-input v-model="formData.position" placeholder="请输入职务职称" clearable :style="{width: '100%'}" :disabled="dsb"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-cow> |
| | | </el-row> |
| | | </el-container> |
| | | </div> |
| | | <div style="padding-left:30px;padding-top: 45px"> |
| | | <el-container> |
| | | <el-col :span="6" :data="personInfos"> |
| | | <div class="block" :model="personInfos" > |
| | | <el-col v-model="personInfos.url" prop="url"> |
| | | <el-avatar shape="square" :size=200 > |
| | | <el-image |
| | | :src="'http://47.93.189.255:8080/'+ personInfos.url" |
| | | :fit="fit" |
| | | ></el-image> |
| | | </el-avatar> |
| | | </el-col> |
| | | </div> |
| | | </el-col> |
| | | </el-container> |
| | | </div> |
| | | </el-container> |
| | | </el-form> |
| | | |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | <script> |
| | | import {getRoot} from "@/api/root/index"; |
| | | import {listExperience} from "@/api/self"; |
| | | export default { |
| | | name: "index", |
| | | data(){ |
| | | return{ |
| | | personInfos:[] |
| | | // 遮罩层 |
| | | disabled: false, |
| | | personInfos:[], |
| | | loading: true, |
| | | formData:{ |
| | | userId: undefined, |
| | | nickName: undefined, |
| | | oldName: undefined, |
| | | sex: undefined, |
| | | nationality: undefined, |
| | | nation: undefined, |
| | | maritalStatus: undefined, |
| | | politicalOutlook: undefined, |
| | | phoneNumber:undefined, |
| | | idNum: undefined, |
| | | locationAddress: undefined, |
| | | alwaysAddress:undefined, |
| | | locationPolice: undefined, |
| | | alwaysPolice: undefined, |
| | | unit: undefined, |
| | | position:undefined, |
| | | outStatus:undefined, |
| | | idNo: undefined, |
| | | img: undefined, |
| | | spouseId: undefined, |
| | | fatherId: undefined, |
| | | momId: undefined, |
| | | birth: undefined, |
| | | url:undefined, |
| | | familyId:undefined, |
| | | secondFamilyId: undefined, |
| | | childList: undefined |
| | | }, |
| | | // 菜单列表 |
| | | menuOptions: [], |
| | | // 部门列表 |
| | | deptOptions: [], |
| | | // 表单参数 |
| | | form: {}, |
| | | defaultProps: { |
| | | children: "children", |
| | | label: "label" |
| | | }, |
| | | // 表单校验 |
| | | rules: { |
| | | createTime: [{ |
| | | required: true, |
| | | message: '请输入创建时间', |
| | | trigger: 'blur' |
| | | }], |
| | | type: [{ |
| | | required: true, |
| | | message: '请输入类型', |
| | | trigger: 'blur' |
| | | }], |
| | | name: [{ |
| | | required: true, |
| | | message: '请输入名称', |
| | | trigger: 'blur' |
| | | }], |
| | | grade: [{ |
| | | required: true, |
| | | message: '请输入级别', |
| | | trigger: 'blur' |
| | | }], |
| | | idNo: [{ |
| | | required: true, |
| | | message: '请输入证件号/专业', |
| | | trigger: 'blur' |
| | | }], |
| | | validityDate: [{ |
| | | // required: true, |
| | | message: '请输入有效时间', |
| | | trigger: 'blur' |
| | | }], |
| | | getDate: [{ |
| | | // required: true, |
| | | message: '请输入获得时间', |
| | | trigger: 'blur' |
| | | }], |
| | | location: [{ |
| | | // required: true, |
| | | message: '请输入存放位置', |
| | | trigger: 'blur' |
| | | }], |
| | | remark: [{ |
| | | // required: true, |
| | | message: '请输入备注', |
| | | trigger: 'blur' |
| | | }], |
| | | }, |
| | | } |
| | | } |
| | | , |
| | |
| | | console.log(response.data) |
| | | //这里是夫妻的信息,已经拿到了 |
| | | this.personInfos = response.data |
| | | }) |
| | | }); |
| | | |
| | | } |
| | | }, |
| | | } |
| | |
| | | background: url("../../assets/images/Group 407.png"); |
| | | width: 100%; |
| | | height: 100%; |
| | | position: fixed; |
| | | background-size: 100% 100%; |
| | | background-size: 100%; |
| | | background-position: top left; |
| | | background-repeat: no-repeat; |
| | | } |
| | | #building { |
| | | /*设置透明度*/ |
| | | opacity: 0.75; |
| | | /*opacity: 0.9;*/ |
| | | background: rgba(255,255,255,0.8); |
| | | /*overflow-y:auto;*/ |
| | | } |
| | | .app-container{ |
| | | background-color: #FEF7FC; |
| | | |
| | | } |
| | | .el-divider { |
| | | /*display: inline-block;*/ |
| | | weight: 1px; |
| | | height: 1px; |
| | | background: 0 0; |
| | | background-color: rgba(0,0,0,0.3); |
| | | margin: 2px 0px; |
| | | position: relative; |
| | | } |
| | | </style> |