<template>
  <div class="g-main ">
       <div class=" title-small title_postion" >基础信息 </div>
         <el-row type="flex" class="f-m-top29">
             <el-col :span="12" class="f-flex">
                <div class="f-label">所属网格:</div> <div class="f-left8 f-font-color">{{gridName}}</div>
             </el-col>
             <el-col :span="12" class="f-flex">
                <div class="f-label">所属房屋: </div>  <div  class="f-left8 f-font-color">{{homeName}}</div>
             </el-col>
         </el-row>
         <el-row type="flex" justify=""  class="f-m-top29" >
             <el-col :span="24" class="f-flex">
                <div class="f-label">本地户籍:</div> <div class="f-left8 f-font-color"> 
                  {{resiDetailObj.localResidenceFlag==1?'是':resiDetailObj.localResidenceFlag==0?'否':'--'}}
                </div>
             </el-col>
         </el-row>
         <el-row type="flex" justify=""  class="f-m-top29" >
             <el-col :span="12" class="f-flex">
                <div class="f-label">居民姓名:</div> <div  class="f-left8 f-font-color">{{resiDetailObj.name?resiDetailObj.name:'--'}}</div>
             </el-col>
             <el-col :span="12" class="f-flex">
                <div class="f-label">出生日期: </div>  <div  class="f-left8 f-font-color">{{resiDetailObj.birthday}}</div>
             </el-col>
         </el-row>
         <el-row type="flex" justify=""  class="f-m-top29" >
             <el-col :span="12" class="f-flex">
                <div class="f-label">性别:</div> <div  class="f-left8 f-font-color">{{resiDetailObj.gender?resiDetailObj.gender==1?'男':'女':'--'}}</div>
             </el-col>
             <el-col :span="12" class="f-flex">
                <div class="f-label">民族: </div>  <div  class="f-left8 f-font-color">{{resiDetailObj.nationName?resiDetailObj.nationName:'--'}}</div>
             </el-col>
         </el-row>
         <el-row type="flex" justify=""  class="f-m-top29" >
             <el-col :span="12" class="f-flex">
                <div class="f-label">联系电话:</div> <div  class="f-left8 f-font-color">
                   {{resiDetailObj.showMobile?resiDetailObj.showMobile:resiDetailObj.mobile?`${resiDetailObj.mobile.substr(0,3)}`+ "****" +`${resiDetailObj.mobile.substr(7,5)}`:'--'}} 
                  </div>
                <el-button v-if="resiDetailObj.mobile"
                         style="margin-left: 10px"
                         type="text"
                         class="div-table-button--blue"
                         icon="el-icon-view"
                         size="small"
                         @click="handleTuomin('mobile')">显示</el-button>
             </el-col>
             <el-col :span="12" class="f-flex">
                <div class="f-label">证件号: </div> 
                 <div  class="f-left8 f-font-color">{{resiDetailObj.showIdNum?resiDetailObj.showIdNum:resiDetailObj.idNum?`${resiDetailObj.idNum.substr(0, 11)}` +"******" +`${resiDetailObj.idNum.substr(16, 2)}`:'--'}}
                </div>
                <el-button v-if="resiDetailObj.idNum"
                         style="margin-left: 10px"
                         type="text"
                         class="div-table-button--blue"
                         icon="el-icon-view"
                         size="small"
                         @click="handleTuomin('idCard')">显示</el-button>
             </el-col>
         </el-row>
         <el-row type="flex" justify=""  class="f-m-top29" >
             <el-col :span="24" class="f-flex">
                <div class="f-label">备注:</div> 
                <div  class="f-left8 f-font-color">{{resiDetailObj.remark?resiDetailObj.remark:'--'}}</div>
             </el-col>
         </el-row>
         <div class=" title-small title_postion f-top40" >分类信息 </div>
           <el-row class="f-m-top29">
               <el-col :span="24" class="f-flex">
                <div class="f-label">居民分类:</div> 
                <section class="f-left15 f-flex  f-flex1" v-if="resiDetailObj.categoryInfo&& resiClass" style="flex: 1;flex-wrap: wrap;">
                  <span class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.bereavedPersonFlag==1">失独老人  </span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.chronicDiseaseFlag==1">慢病</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.dementedFlag==1">失智老人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.disabilityFlag==1"> 残疾</span>
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.disabledFlag==1">失能老人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.emptyNesterFlag==1">空巢老人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.ensureHouseFlag==1">保障房人员</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.fertileWomanFlag==1">育龄妇女</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.floatingFlag==1">流动人口</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.liveAloneFlag==1">独居老人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.oldPeopleFlag==1">老年人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.partyFlag==1"> 党员</span>
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.petitionOfficerFlag==1">信访人员</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.seriousIllnessFlag==1"> 大病</span>
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.specialCrowdFlag==1">特殊人群</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.subsistenceAllowanceFlag==1">低保</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.unitedFrontFlag==1">统战人员</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.tenantFlag==1">租户</span>
                   <span  class="f-right30 f-w70  f-font-color f-bto16" v-show="resiDetailObj.categoryInfo.unemployedFlag==1">失业</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16"  v-show="resiDetailObj.categoryInfo.veteranFlag==1">退役军人</span> 
                   <span  class="f-right30 f-w70  f-font-color f-bto16"  v-show="resiDetailObj.categoryInfo.volunteerFlag==1">志愿者</span> 
               
                </section>
                <section v-else>--</section>
              </el-col>
           </el-row>
         <div class=" title-small title_postion f-top40 f-bot24" >其他信息 </div>
         <el-tabs v-model="activeName" @tab-click="handleClick">
                      <el-tab-pane label="教育">
                           <div class="f-flex f-bto16 f-top24"> 
                              <div class="f-labels">文化程度:</div> 
                              <span class="f-left8 f-font-color">{{educationText}}</span> 
                          </div>
                           <div class="f-flex f-bto16"> 
                              <div class="f-labels">备注:</div>
                                <span class="f-left8 f-font-color">{{eduInfoDto.eduRemark?eduInfoDto.eduRemark:'--'}}</span>
                             </div>
                      </el-tab-pane>
                      <el-tab-pane label="兴趣爱好">
                        <section class="f-flex  f-flex1" style="flex: 1;flex-wrap: wrap;">
                          <div class="f-labels f-top24">兴趣分类 :</div>
                            <div v-for="(item,index) in hobbyCodeArr" :key="index"  class="f-top24">
                               <span class="f-right24 f-font-color" >
                                {{item}}
                               </span>
                              
                            </div>
                            <span v-show="hobbyCodeArr.length==0" class="f-top24 f-left8">
                                  --
                               </span>
                         </section>
                         <el-row type="flex" class="f-flex f-bto16 f-top24" >
                          <el-col :span="24" class="f-flex">
                              <div class="f-labels">兴趣:</div> <div class="f-left8 f-font-color">{{hobbyInfoObj.interestDesc?hobbyInfoObj.interestDesc:'--'}}</div>
                          </el-col>
                       </el-row>
                       <el-row type="flex" >
                          <el-col :span="24" class="f-flex">
                              <div class="f-labels">备注:</div> <div class="f-left8 f-font-color">{{hobbyInfoObj.hobbyRemark?hobbyInfoObj.hobbyRemark:'--'}}</div>
                          </el-col>
                       </el-row>
                       </el-tab-pane>
                       <el-tab-pane label="宗教信仰">
                        <div class="f-flex f-bto16 f-top24">
                           <div class="f-labels">宗教:</div> 
                            <span class="f-left8 f-font-color">{{residentReligionObj.religion?residentReligionObj.religion:'--'}}</span>
                        </div>
                        <div class="f-flex f-bto16"> 
                          <div class="f-labels">备注:</div> 
                           <span class="f-left8 f-font-color">{{residentReligionObj.religionRemark?residentReligionObj.religionRemark:'--'}}</span>
                        </div>
                       </el-tab-pane>
                       <el-tab-pane label="健康">
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">残疾类别:</div> 
                                    <span class="f-left8 f-font-color">{{ categoryText }}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">残疾等级:</div> 
                                    <span class="f-left8 f-font-color">{{disabilityLevelText}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24"> 
                                  <div class="f-labels">残疾证号:</div> 
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.disabilityNum?resiHealthInfonObj.disabilityNum:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>

                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">残疾说明:</div> 
                                    <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.disabilityDesc?resiHealthInfonObj.disabilityDesc:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">监护人:</div>  
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj.guardianFlag==1?'有':resiHealthInfonObj.guardianFlag==0?'无':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">技能特长:</div>
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj.specialSkillFlag==1?'有':resiHealthInfonObj.specialSkillFlag==0?'无':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                      
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">劳动能力:</div> 
                                    <span class="f-left8 f-font-color">{{resiHealthInfonObj.workCapacityFlag==1?'有':resiHealthInfonObj.workCapacityFlag==0?'无':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">非义务教育阶段助学:</div> 
                                    <span class="f-left8 f-font-color">{{resiHealthInfonObj.voluntaryEducationFlag==1?'有':resiHealthInfonObj.voluntaryEducationFlag==0?'无':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24"> 
                                  <div class="f-labels">所患大病:</div> 
                                  <span class="f-left8 f-font-color">{{illnessText}}</span> 
                               </div>
                              </el-col>
                          </el-row>

                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">大病患病时间:</div> 
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj.illnessTime?resiHealthInfonObj.illnessTime?resiHealthInfonObj.illnessTime:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">所患慢性病:</div>  
                                   <span class="f-left8 f-font-color">{{chronicText}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">慢病患病时间:</div>  
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj.chronicDiseaseTime?resiHealthInfonObj.chronicDiseaseTime?resiHealthInfonObj.chronicDiseaseTime:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否参保:</div>
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj.insuredFlag==1?'是':resiHealthInfonObj.insuredFlag==0?'否':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">自付金额:</div> 
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.selfPayAmount?resiHealthInfonObj.selfPayAmount:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">救助金额:</div> 
                                  <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.deliveranceAmount?resiHealthInfonObj.deliveranceAmount:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">救助时间:</div> 
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.deliveranceTime?resiHealthInfonObj.deliveranceTime:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">享受救助明细序号:</div> 
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.deliveranceNum?resiHealthInfonObj.deliveranceNum:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                            <el-col :span="24">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">备注:</div>  
                                   <span class="f-left8 f-font-color">{{resiHealthInfonObj?resiHealthInfonObj.healthRemark?resiHealthInfonObj.healthRemark:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                       </el-tab-pane>
                       <el-tab-pane label="工作">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">工作单位:</div> 
                                   <span class="f-left8 f-font-color">{{residentWorkInfoObj?residentWorkInfoObj.workUnit?residentWorkInfoObj.workUnit:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">职业:</div> 
                                    <span class="f-left8 f-font-color">{{residentWorkInfoObj?residentWorkInfoObj.occupation?residentWorkInfoObj.occupation:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">离退休时间:</div>  
                                  <span class="f-left8 f-font-color">{{residentWorkInfoObj?residentWorkInfoObj.retireTime?residentWorkInfoObj.retireTime.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                          <el-row>
                            <div class="f-flex f-bto16 f-top24">
                               <div class="f-labels">备注:</div>
                               <span class="f-left8 f-font-color">{{residentWorkInfoObj?residentWorkInfoObj.workRemark?residentWorkInfoObj.workRemark:'--':'--'}}</span> 
                               </div>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="经济状况">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">退休金额:</div>  
                                   <span class="f-left8 f-font-color">{{resiEconomyObj?resiEconomyObj.retirementAmount?resiEconomyObj.retirementAmount:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">月收入:</div>  
                                   <span class="f-left8 f-font-color">{{resiEconomyObj?resiEconomyObj.monthIncome?resiEconomyObj.monthIncome:'--':'--'}}</span> 
                                </div>
                              </el-col>
                            
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="居住">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">籍贯:</div> 
                                 <span class="f-left8 f-font-color">{{residentResideInfoObj?residentResideInfoObj.nativePlace?residentResideInfoObj.nativePlace:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">户籍所在地:</div> 
                                 <span class="f-left8 f-font-color">{{residentResideInfoObj?residentResideInfoObj.placeOfDomicile?residentResideInfoObj.placeOfDomicile:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">现居住地:</div> 
                                 <span class="f-left8 f-font-color">{{residentResideInfoObj?residentResideInfoObj.currentResidence?residentResideInfoObj.currentResidence:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">人户状况:</div> 
                                   <span class="f-left8 f-font-color">{{householdText}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="16">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">备注:</div>
                                 <span class="f-left8 f-font-color">{{residentResideInfoObj?residentResideInfoObj.resiRemark?residentResideInfoObj.resiRemark:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="家庭">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">与户主关系	:</div> 
                                 <span class="f-left8 f-font-color">{{relationshipText}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">居住情况	:</div>  
                                <span class="f-left8 f-font-color">{{resideText}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">婚姻状况	:</div> 
                                 <span class="f-left8 f-font-color">{{categoryDictText}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">有无赡养人	:</div>  
                                <span class="f-left8 f-font-color">{{residentFamilyInfoObj.elderlyFlag==1?'有':residentFamilyInfoObj.elderlyFlag==0?'无':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">与赡养人关系	:</div> 
                                 <span class="f-left8 f-font-color">{{elderlyRelationText}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">赡养人联系电话	:</div> 
                                 <span class="f-left8 f-font-color">{{residentFamilyInfoObj?residentFamilyInfoObj.dependantMobile?residentFamilyInfoObj.dependantMobile:'--':'--'}}</span> 
                                 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                            <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">配偶情况	:</div>  
                                <span class="f-left8 f-font-color">{{spouseText}}</span> 
                                </div>
                              </el-col>
                            <el-col :span="16">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">备注	:</div> 
                                 <span class="f-left8 f-font-color">{{residentFamilyInfoObj?residentFamilyInfoObj.familyInfoRemark?residentFamilyInfoObj.familyInfoRemark:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="党员">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">入党时间	:</div> 
                                 <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj.joinTime?residentPartyMemberInfoObj.joinTime.substr(0,10):'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">转正时间	:</div> 
                                 <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj?residentPartyMemberInfoObj.positiveTime?residentPartyMemberInfoObj.positiveTime.substr(0,10):'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">所属支部	:</div>
                                 <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj?residentPartyMemberInfoObj.branchId?residentPartyMemberInfoObj.branchId:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                        
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否退休	:</div> 
                                 <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj.retiredFlag==1?'是':residentPartyMemberInfoObj.retiredFlag==0?'否':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否党员中心户	:</div> 
                                 <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj.centerFlag==1?'是':residentPartyMemberInfoObj.centerFlag==0?'否':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">入党时所在党支部		:</div>
                                  <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj?residentPartyMemberInfoObj.joinBranchName?residentPartyMemberInfoObj.joinBranchName:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">组织关系转入社区时间	:</div>  
                                <span class="f-left8 f-font-color">{{residentPartyMemberInfoObj?residentPartyMemberInfoObj.joinCommunityTime?residentPartyMemberInfoObj.joinCommunityTime.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否请长假	:</div> 
                                 <span class="f-left8 f-font-color" >{{residentPartyMemberInfoObj.longHolidayFlag==1?'是':residentPartyMemberInfoObj.longHolidayFlag==0?'否':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="保障房">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">住房性质	:</div>  
                                <span class="f-left8 f-font-color">{{houseText}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">保障类型 :</div>  
                                <span class="f-left8 f-font-color">{{residentEnsureHouseObj?residentEnsureHouseObj.securityType?residentEnsureHouseObj.securityType:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">发证日期		:</div>  
                                <span class="f-left8 f-font-color">{{residentEnsureHouseObj?residentEnsureHouseObj.certificateDate?residentEnsureHouseObj.certificateDate.substr(0,10):'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">补贴编号 :</div>  
                                <span class="f-left8 f-font-color">{{residentEnsureHouseObj?residentEnsureHouseObj.subsidyNum?residentEnsureHouseObj.subsidyNum:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">补贴金额 :</div>  
                                <span class="f-left8 f-font-color">{{residentEnsureHouseObj?residentEnsureHouseObj.subsidyAmount	?residentEnsureHouseObj.subsidyAmount	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                            
                          </el-row>
                      </el-tab-pane>
                       <el-tab-pane label="失业">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">原工作单位		:</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.originWorkUnit?residentUnemployedObj.originWorkUnit:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">失业时间 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.unemploymentTime?residentUnemployedObj.unemploymentTime.substr(0,10):'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">失业证号 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.unemploymentNum?residentUnemployedObj.unemploymentNum:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">再就业优惠证号	:</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.employmentNum?residentUnemployedObj.employmentNum:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">技术特长 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.specialSkill?residentUnemployedObj.specialSkill:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">失业原因 :</div>  
                                <span class="f-left8 f-font-color">{{unemploymentText}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">再就业优惠证号	:</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.employmentNum?residentUnemployedObj.employmentNum:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否就业困难对象 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj.employmentHardFlag==1?'是':residentUnemployedObj.employmentHardFlag==0?'否':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">劳动能力就业愿望	 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnemployedObj?residentUnemployedObj.employmentWish?residentUnemployedObj.employmentWish:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="退役军人">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">入伍时间 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.joinArmyTime?residentVeteranObj.joinArmyTime.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">退伍时间 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.leaveArmyTime	?residentVeteranObj.leaveArmyTime.substr(0,10)	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">服役单位 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.serviceUnit?residentVeteranObj.serviceUnit:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">接收单位 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.receiveUnit?residentVeteranObj.receiveUnit:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">待安置补助金 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.settlementAmount	?residentVeteranObj.settlementAmount	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">培训状况 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.trainDesc?residentVeteranObj.trainDesc:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">参战时间开始日期 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.joinWarStartTime?residentVeteranObj.joinWarStartTime.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">参战时间截止日期 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.joinWarEndTime	?residentVeteranObj.joinWarEndTime.substr(0,10):'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">现就业情况 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj?residentVeteranObj.employmentSituation?residentVeteranObj.employmentSituation:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">是否办理公益性岗位 :</div>  
                                <span class="f-left8 f-font-color">{{residentVeteranObj.pubWelfareJobFlag==1?'是':residentVeteranObj.pubWelfareJobFlag==0?'否':'--'}}</span> 
                               </div>
                              </el-col>
                             
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="统战人员">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">职务 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnitedFrontObj?residentUnitedFrontObj.duty?residentUnitedFrontObj.duty:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">探亲情况	 :</div>  
                                <span class="f-left8 f-font-color">{{residentUnitedFrontObj?residentUnitedFrontObj.visitation	?residentUnitedFrontObj.visitation	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="志愿者">
                        <section class="f-flex  f-flex1" style="flex: 1;flex-wrap: wrap;">
                          <div class="f-labels f-top24">志愿者类别 :</div>
                            <div v-for="(item,index) in volunteerCategoryArr" :key="index"  class="f-top24">
                               <span class="f-right24 f-font-color" >
                                {{item}}
                               </span>
                              
                            </div>
                            <span v-show="volunteerCategoryArr.length==0" class="f-top24 f-left8">
                                  --
                               </span>
                         </section>
                        <el-row>
                              <el-col :span="24">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">备注 :</div>  
                                <span class="f-left8 f-font-color">{{residentVolunteerObj?residentVolunteerObj.volunteerRemark?residentVolunteerObj.volunteerRemark:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="老年人">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">高龄补助	 :</div>  
                                <span class="f-left8 f-font-color">{{residentOldPeopleObj.oldSubsidy?residentOldPeopleObj.oldSubsidy:'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="特殊人群">
                        <section class="f-flex  f-flex1" style="flex: 1;flex-wrap: wrap;">
                          <div class="f-labels f-top24">特殊人群类别 :</div>
                            <div v-for="(item,index) in specialDtoArrText" :key="index"  class="f-top24">
                               <span class="f-right24 f-font-color" >
                                {{item}}
                               </span>
                              
                            </div>
                            <span v-show="specialDtoArrText.length==0" class="f-top24 f-left8">
                                  --
                               </span>
                         </section>
                      </el-tab-pane>
                      <el-tab-pane label="出生信息">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">出生地	 :</div>  
                                <span class="f-left8 f-font-color">{{residentBirthRecordObj?residentBirthRecordObj.birthplace?residentBirthRecordObj.birthplace:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">父亲姓名	 :</div>  
                                <span class="f-left8 f-font-color">{{residentBirthRecordObj?residentBirthRecordObj.father	?residentBirthRecordObj.father	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">母亲姓名	 :</div>  
                                <span class="f-left8 f-font-color">{{residentBirthRecordObj?residentBirthRecordObj.mother?residentBirthRecordObj.mother:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">胎次		 :</div>  
                                <span class="f-left8 f-font-color">{{residentBirthRecordObj?residentBirthRecordObj.count?residentBirthRecordObj.count:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">申报日期		 :</div>  
                                <span class="f-left8 f-font-color">{{residentBirthRecordObj?residentBirthRecordObj.reportDate	?residentBirthRecordObj.reportDate	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="死亡人员">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">死亡时间 :</div>  
                                <span class="f-left8 f-font-color">{{residentDeathRecordObj?residentDeathRecordObj.deathDate?residentDeathRecordObj.deathDate.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">加入原因 :</div>  
                                <span class="f-left8 f-font-color">{{residentDeathRecordObj?residentDeathRecordObj.deathReason	?residentDeathRecordObj.deathReason	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">移除时间	:</div>  
                                <span class="f-left8 f-font-color">{{residentDeathRecordObj?residentDeathRecordObj.removeDate	?residentDeathRecordObj.removeDate.substr(0,10)	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">移除原因 :</div>  
                                <span class="f-left8 f-font-color">{{residentDeathRecordObj?residentDeathRecordObj.removeReason?residentDeathRecordObj.removeReason:'--':'--'}}</span> 
                               </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="迁出">
                        <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">迁出日期	 :</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.outOfTime?residentMoveOutRecordObj.outOfTime.substr(0,10):'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">迁出类型	:</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.type	?residentMoveOutRecordObj.type	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">迁出原因	:</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.reason	?residentMoveOutRecordObj.reason:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">迁出至组织		 :</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.deptId?residentMoveOutRecordObj.deptId:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">小区	:</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.villageName	?residentMoveOutRecordObj.villageName	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">楼号		:</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.buildName	?residentMoveOutRecordObj.buildName:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                          <el-row>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">单元		 :</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.unitName	?residentMoveOutRecordObj.unitName	:'--':'--'}}</span> 
                               </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">房屋	:</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.homeName	?residentMoveOutRecordObj.homeName	:'--':'--'}}</span> 
                                </div>
                              </el-col>
                              <el-col :span="8">
                                <div class="f-flex f-bto16 f-top24">
                                   <div class="f-labels">外迁地址 :</div>  
                                <span class="f-left8 f-font-color">{{residentMoveOutRecordObj?residentMoveOutRecordObj.address	?residentMoveOutRecordObj.address:'--':'--'}}</span> 
                                </div>
                              </el-col>
                          </el-row>
                      </el-tab-pane>
                </el-tabs>

  </div>
</template>

<script>

import { requestPost, requestGet } from '@/js/dai/request'
export default {
  name: 'resiForm',
  props: {
    resiId: {
        type: String,
      },

  },
  data () {
   return {
    resiDetailObj:{},
    activeName:0,
    eduInfoDto:{},
    hobbyInfoObj:{},
    residentReligionObj:{},
    resiHealthInfonObj:{},//健康
    residentWorkInfoObj:{},
    residentUnitedFrontObj:{},
    residentVolunteerObj:{},//志愿者
    residentBirthRecordObj:{},
    residentOldPeopleObj:{},
    residentSpecialObj:{},//特殊人群
    residentVeteranObj:{},
    residentUnemployedObj:{},//失业
    residentEnsureHouseObj:{},//保障房
    residentPartyMemberInfoObj:{},//党员
    residentResideInfoObj:{},//居住
    residentFamilyInfoObj:{},//家庭
    residentDeathRecordObj:{},//死亡
    resiEconomyObj:{},
    residentMoveOutRecordObj:{},//迁出
    // 字典分割线
    educationDictonArr:[],
    disability_levelArr:[],
    illnessArr:[],
    householdArr:[],
    houseArr:[],
    unemploymentArr:[],
    chronicArr:[],
    resideArr:[],
    marriageArr:[],
    specialDtoArr:[],
    spouseArr:[],
    relationshipArr:[],
    categoryDictArr:[]
   }
  },
  computed: {
    gridName(){
       let arr = []
       if(this.resiDetailObj.houseInfo&&this.resiDetailObj.houseInfo.gridName){
        arr = this.resiDetailObj.houseInfo.gridName
       }else {
        arr = '--'
       }
        return arr
      },
      homeName(item){
       let arr = []
       if(this.resiDetailObj.houseInfo&&this.resiDetailObj.houseInfo.homeName){
        arr = this.resiDetailObj.houseInfo.homeName
       }else {
        arr = '--'
       }
        return arr
      },
      educationText(){
            let text = '--'
            this.educationDictonArr.forEach(item=>{
              if(item.value == this.eduInfoDto.cultureLevel){
                text = item.label
              }
            })
            return text
  
        },
        hobbyCodeArr(){
          let arr = []
          if(this.hobbyInfoObj.hobbyCode){
             arr = this.hobbyInfoObj.hobbyCode.split(',')
          }else{
            arr = []
          }
         return arr
        },
        educationText(){
            let text = '--'
            this.educationDictonArr.forEach(item=>{
              if(item.value == this.eduInfoDto.cultureLevel){
                text = item.label
              }
            })
            return text
  
        },
        resiClass(){
          let flag = true
        var num = 0
        if(this.resiDetailObj.categoryInfo != 'undefined'){
          for (let key in this.resiDetailObj.categoryInfo) {
          if(this.resiDetailObj.categoryInfo[key] == 0){
              num++
              if(num >= 21){
                flag = false
              }else {
               flag = true
              }
          }
        }
        }else{
          flag = false
        }
        return flag
        },
        categoryText(){
            let text = '--'
            this.categoryDictArr.forEach(item=>{
              if(item.value == this.resiHealthInfonObj.disabilityCategoryCode){
                text = item.label
              }
            })
            return text
  
        },
        disabilityLevelText(){
            let text = '--'
            this.disability_levelArr.forEach(item=>{
              if(item.value == this.resiHealthInfonObj.disabilityLevel){
                text = item.label
              }
            })
            return text
  
        },
        illnessText(){
            let text = '--'
            this.illnessArr.forEach(item=>{
              if(item.value == this.resiHealthInfonObj.illnessCode){
                text = item.label
              }
            })
            return text
        },  
        chronicText(){
            let text = '--'
            this.chronicArr.forEach(item=>{
              if(item.value == this.resiHealthInfonObj.chronicDiseaseCode){
                text = item.label
              }
            })
            return text
        },
        householdText(){
            let text = '--'
            this.householdArr.forEach(item=>{
              if(item.value == this.residentResideInfoObj.householdSituation){
                text = item.label
              }
            })
            return text
        },
        relationshipText(){
            let text = '--'
            this.relationshipArr.forEach(item=>{
              if(item.value == this.residentFamilyInfoObj.houseHolderRel){
                text = item.label
              }
            })
            return text
        },
        elderlyRelationText(){
            let text = '--'
            this.relationshipArr.forEach(item=>{
              if(item.value == this.residentFamilyInfoObj.elderlyRelation){
                text = item.label
              }
            })
            return text
        },
        resideText(){
            let text = '--'
            this.resideArr.forEach(item=>{
              if(item.value == this.residentFamilyInfoObj.resideSituation){
                text = item.label
              }
            })
            return text
        },
        categoryDictText(){
            let text = '--'
            this.marriageArr.forEach(item=>{
              if(item.value == this.residentFamilyInfoObj.marriage){
                text = item.label
              }
            })
            return text
        },
        spouseText(){
            let text = '--'
            this.spouseArr.forEach(item=>{
              if(item.value == this.residentFamilyInfoObj.spouseSituation){
                text = item.label
              }
            })
            return text
        },
        houseText(){
            let text = '--'
            this.houseArr.forEach(item=>{
              if(item.value == this.residentEnsureHouseObj.housingNature){
                text = item.label
              }
            })
            return text
        },
        unemploymentText(){
            let text = '--'
            console.log(this.unemploymentArr);
            this.unemploymentArr.forEach(item=>{
              if(item.value == this.residentUnemployedObj.unemploymentReason){
                text = item.label
              }
            })
            return text
        },
        volunteerCategoryArr(){
          let arr = []
          if(this.residentVolunteerObj.volunteerCategory){
             arr = this.residentVolunteerObj.volunteerCategory.split(',')
          }else{
            arr = []
          }
         return arr
        },
        specialDtoArrText(){
          let arr = []
          let temp = []
          if(this.residentSpecialObj.specialCategoryCode){
             arr = this.residentSpecialObj.specialCategoryCode.split(',')
             for (let i of arr) {
                for(let tab of this.specialDtoArr){
                  if(i == tab.value){
                    temp.push(tab.label)
                  }
                }
             } 
          }else{
            temp = []
          }
         return temp
        },
  },
  watch: {
    
  },
  created () {
    this. getResiDetail()
    this.getEduInfoDtoObj()
    this.getEducation()
    this.getdisabilityNationClass()
  },
  methods: {
    getResiDetail(){
        this.$http.post(`/actual/base/residentBaseInfo/detail/${this.resiId}`).then(res=>{
        this.resiDetailObj = res.data.data
       }).catch(err =>{
          console.log(err);
       })
  
      },
      handleClick(tab){
          if(tab.index==0){
            this.getEducation()
            this.getEduInfoDtoObj()
          }else if(tab.index == 1){
            this.getResidentHobbyInfoObj()
          }
          else if(tab.index == 2){
            this.getResidentReligionObj()
          }else if(tab.index == 3){
            this.getdisabilityNation()
            this.getillnessNation()
            this.getchronicNation()

            this.getHealthInfoDetailById()
          }else if (tab.index == 4){
            this.getResidentWorkInfoObj()
          }else if (tab.index == 5){
            this.getEconomyDetailById()
          }else if (tab.index == 6){
             this.getHouseholdNation()
            this.getResideInfoDetailById()
          }else if(tab.index == 7){
            this.getrelationshipArr()
            this.getSpouse()
            this.getMarriageNation()
            this.getResideNation()
            this.getFamilyInfoDetailById()
          }else if(tab.index == 8){
            this.getResidentPartyMemberInfo()
          }else if(tab.index == 9){
            this.getHousing()
            this.getResidentEnsureHouse()
          }else if(tab.index == 10){
            this.getUnemployment()
            this.getResidentUnemployed()
          }else if (tab.index == 11){
            this.getVeteranDetailById()
          }else if(tab.index == 12){
            this.getResidentUnitedFront()
          }else if(tab.index == 13){
            this.getVolunteerDetailById()
          }else if(tab.index == 14){
            this.getOldPeopleDetailById()
          }else if(tab.index == 15){
            this.getResidentNation()
            this.getresidentSpecial()
          }else if(tab.index == 16){
            this.getResidentBirthRecord()
          }else if(tab.index == 17){
            this.getResidentDeathRecord()
          }else if (tab.index == 18){
            this.getResidentMoveOutRecord()
          }
      },
      async getEduInfoDtoObj(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentEduInfo/detail/${this.resiId}`)
         if(data.data == null){
           this.eduInfoDto = {}
         }else{
          this.eduInfoDto = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      
      //获取兴趣爱好
      async getResidentHobbyInfoObj(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentHobbyInfo/detail/${this.resiId}`)
         if(data.data == null){
           this.hobbyInfoObj = {}
         }else{
          this.hobbyInfoObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
       //获取宗教信仰
       async getResidentReligionObj(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentReligion/detail/${this.resiId}`)
         if(data.data == null){
           this.residentReligionObj = {}
         }else{
          this.residentReligionObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      //获取健康信息
      async getHealthInfoDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentHealthInfo/getHealthInfoDetailById/${this.resiId}`)
         if(data.data == null){
           this.resiHealthInfonObj = {}
         }else{
          this.resiHealthInfonObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
      //获取特殊人群
      async getresidentSpecial(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentSpecial/detail/${this.resiId}`)
         if(data.data == null){
           this.residentSpecialObj = {}
         }else{
          this.residentSpecialObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
       //获取出生人员详情
       async getResidentBirthRecord(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentBirthRecord/detail/${this.resiId}`)
         if(data.data == null){
           this.residentBirthRecordObj = {}
         }else{
          this.residentBirthRecordObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
       //获取死亡人员详情
       async getResidentDeathRecord(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentDeathRecord/detail/${this.resiId}`)
         if(data.data == null){
           this.residentDeathRecordObj = {}
         }else{
          this.residentDeathRecordObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
       //获取迁出详情
       async getResidentMoveOutRecord(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentMoveOutRecord/detail/${this.resiId}`)
         if(data.data == null){
           this.residentMoveOutRecordObj = {}
         }else{
          this.residentMoveOutRecordObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
      //获取工作信息
       async getResidentWorkInfoObj(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentWorkInfo/detail/${this.resiId}`)
         if(data.data == null){
           this.residentWorkInfoObj = {}
         }else{
          this.residentWorkInfoObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
      //获取党员信息
      async getResidentPartyMemberInfo(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentPartyMemberInfo/detail/${this.resiId}`)
        
          this.residentPartyMemberInfoObj = data.data
         } catch (error) {
          console.log(error);
         }
      }, 
        //获取保障房
        async getResidentEnsureHouse(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentEnsureHouse/detail/${this.resiId}`)
         if(data.data == null){
           this.residentEnsureHouseObj = {}
         }else{
          this.residentEnsureHouseObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
       //获取失业
       async getResidentUnemployed(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentUnemployed/detail/${this.resiId}`)
         if(data.data == null){
           this.residentUnemployedObj = {}
         }else{
          this.residentUnemployedObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
      //获取统战
      async getResidentUnitedFront(){
        try {
          const {data} = await this.$http.get(`/actual/base/residentUnitedFront/detail/${this.resiId}`)
         if(data.data == null){
           this.residentUnitedFrontObj = {}
         }else{
          this.residentUnitedFrontObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
       //获取经济状况
      async getEconomyDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentEconomy/getEconomyDetailById/${this.resiId}`)
         if(data.data == null){
           this.resiEconomyObj = {}
         }else{
          this.resiEconomyObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      async  getHousing(){
        try {
          let { data } = await this.$http.post('sys/dict/data/house',{formCode: "resi_base_info"})
          this.houseArr = data.data
          } catch (error) {
            console.log(error,'获取住房性质字典');
          }
  
        },
      //获取残疾类别字典
      async  getdisabilityNation(){
        try {
          const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'disability_category_code'})
         
            this.categoryDictArr = data.data
  
        } catch (error) {
          console.log(error,'获取残疾类别字典');
      }},
      async  getResidentNation(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'resident_category'})
            this.specialDtoArr=data.data
          } catch (error) {
            console.log(error,'获取特殊人群字典');
          }
        },
      async  getMarriageNation(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'marriage'})
            this.marriageArr = data.data
          } catch (error) {
            console.log(error,'获取婚姻状况字典');
          }
        },
      // 获取残疾等级字典
      async  getdisabilityNationClass(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'disability_level'})
            this.disability_levelArr = data.data
    
          } catch (error) {
            console.log(error,'获取残疾等级字典');
          }
        },
        async  getSpouse(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'spouse_situation'})
            this.spouseArr = data.data
          } catch (error) {
            console.log(error,'获取配偶情况字典');
          }
        },
        async  getrelationshipArr(){
        try {
          const { data } = await this.$http.post('sys/dict/data/relationship',{formCode: "resi_base_info"})
          this.relationshipArr = data.data
          } catch (error) {
            console.log(error,'获取户主关系字典');
          }
  
        },
        //获取老年人信息详情
        async getOldPeopleDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentOldPeople/getOldPeopleDetailById/${this.resiId}`)
         if(data.data == null){
           this.residentOldPeopleObj = {}
         }else{
          this.residentOldPeopleObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      async  getillnessNation(){
        try {
          const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'illness_code'})
          this.illnessArr = data.data
        } catch (error) {
          console.log(error,'获取所患大病字典');
        }
        },
      //居住
      async getResideInfoDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentResideInfo/getResideInfoDetailById/${this.resiId}`)
         if(data.data == null){
           this.residentResideInfoObj = {}
         }else{
          this.residentResideInfoObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      //获取退役军人信息
      async getVeteranDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentVeteran/getVeteranDetailById/${this.resiId}`)
         if(data.data == null){
           this.residentVeteranObj = {}
         }else{
          this.residentVeteranObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      //家庭信息
      async getFamilyInfoDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentFamilyInfo/getFamilyInfoDetailById/${this.resiId}`)
         if(data.data == null){
           this.residentFamilyInfoObj = {}
         }else{
          this.residentFamilyInfoObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      }, 
      //志愿者信息详情
      async getVolunteerDetailById(){
        try {
          const {data} = await this.$http.post(`/actual/base/residentVolunteer/getVolunteerDetailById/${this.resiId}`)
         if(data.data == null){
           this.residentVolunteerObj = {}
         }else{
          this.residentVolunteerObj = data.data
         }
         } catch (error) {
          console.log(error);
         }
      },
      async getEducation(){
  
        try {
          let { data } = await this.$http.post('sys/dict/data/education',{formCode: "resi_base_info"})
          this.educationDictonArr = data.data
          } catch (error) {
            console.log(error,'获取学历字典');
          }

       },
       async  getchronicNation(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'chronic_disease_code'})
            this.chronicArr = data.data
          } catch (error) {
            console.log(error,'获取所患慢病字典');
          }
        },
        async  getHouseholdNation(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'household_situation'})
            this.householdArr = data.data
          } catch (error) {
            console.log(error,'获取人户状况字典');
          }
        },
        async  getResideNation(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'reside_situation'})
            this.resideArr = data.data
          } catch (error) {
            console.log(error,'获取居住情况字典');
          }
        },
        async  getUnemployment(){
          try {
            const { data } = await this.$http.post('sys/dict/data/dictlist', {'dictType':'unemployment_reason'})
            this.unemploymentArr = data.data
          } catch (error) {
            console.log(error,'获取失业原因字典');
          }
        },
      async handleTuomin (type) {
        const url = "/data/aggregator/epmetuser/detailByType";
  
        const { data, code, msg } = await requestPost(url, {
          id: this.resiId,
          type: "checkIcResiUser",
        });
        if (code === 0) {
          if (type === 'mobile') {
            this.$set(this.resiDetailObj, 'showMobile', data.mobile)
          }
          if (type === 'idCard') {
            this.$set(this.resiDetailObj, 'showIdNum', data.idCard)
          }
  
  
        } else {
          this.$message.error(msg);
        }
  
      },
  }
}
</script>

<style lang="scss" scoped>
@import "@/assets/scss/modules/management/list-main.scss";
.f-m-top29{
  margin-top:29px ;
  padding-left: 20px;
}
.f-left8{
  margin-left: 8px;
}
.f-font-color{
   color: #000; 
   font-weight: 400;
}
.f-right30{
  margin-right: 50px;
}
.f-left15{
  padding-left: 15px;
}
.f-w70{
  width: 70px;
}
.el-button--small, .el-button--small.is-round{
  padding: 0;
}
.f-bto16{
  margin-bottom: 16px;
}
.f-label{
  width: 65px;
  text-align: right;
}
.f-labels{
  width: 100px;
  text-align: right;
  margin-right: 10px;
}

</style>