797 lines
		
	
	
		
			37 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			797 lines
		
	
	
		
			37 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | ||
|   <section style="height: 100%">
 | ||
|     <ai-detail class="add">
 | ||
|       <template #title>
 | ||
|         <ai-title :title="params.id ? '监测对象详情' : '新增监测对象'" :isShowBack="true" :isShowBottomBorder="true" @onBackClick="cancel(false)">
 | ||
|           <template slot="rightBtn" v-if="params.id && navIndex != 1">
 | ||
|             <el-button size="small" icon="iconfont iconEdit" type="primary" v-if="!isEdit" @click="isEdit=true">编辑</el-button>
 | ||
|             <el-button size="small" icon="iconfont" type="primary" v-if="isEdit" @click="save">保存</el-button>
 | ||
|             <el-button size="small" icon="iconfont" v-if="isEdit" @click="getDetail(),isEdit=false">取消</el-button>
 | ||
|           </template>
 | ||
|         </ai-title>
 | ||
|       </template>
 | ||
|       <template #content>
 | ||
|         <el-form ref="rules" :model="forms" :rules="formRules" size="small" label-suffix=":" label-width="136px">   
 | ||
|           <div class="nav-list" v-if="params.id">
 | ||
|             <div class="nav-item" :class="navIndex != 1 ? 'active' : ''" @click="navIndex=0">基本信息</div>
 | ||
|             <div class="nav-item" :class="navIndex == 1 ? 'active' : ''" @click="navIndex=1;getLogList()">帮扶日志</div>
 | ||
|           </div>
 | ||
|           <div v-if="navIndex != 1">
 | ||
|             <ai-card title="基础信息">
 | ||
|               <template slot="content">
 | ||
|                 <div v-if="isEdit">
 | ||
|                   <div class="above">
 | ||
|                     <div class="left">
 | ||
|                       <el-form-item label="监测对象类型" prop="type" >
 | ||
|                         <ai-select v-model="forms.type" placeholder="请选择" clearable :selectList="$dict.getDict('fpType')"></ai-select>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="联系方式" prop="phone" >
 | ||
|                         <el-input v-model="forms.phone" placeholder="请输入" maxlength="20" show-word-limit></el-input>
 | ||
|                       </el-form-item>
 | ||
|                     </div>
 | ||
|                     <div class="right">
 | ||
|                       <el-form-item label="是否搬迁" prop="move" >
 | ||
|                         <ai-select v-model="forms.move" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                       </el-form-item>
 | ||
|                     </div>             
 | ||
|                   </div>
 | ||
|                   <el-form-item label="所属区域" prop="addressAreaId">
 | ||
|                     <ai-area-select
 | ||
|                       clearable
 | ||
|                       always-show
 | ||
|                       :instance="instance"
 | ||
|                       v-model="forms.addressAreaId"
 | ||
|                       @fullname="v=>forms.addressArea=v"
 | ||
|                       :disabled-level="user.info.areaList.length"
 | ||
|                     />
 | ||
|                   </el-form-item>
 | ||
|                   <el-form-item label="家庭住址" prop="address">
 | ||
|                     <el-input v-model="forms.address" placeholder="请输入" maxlength="50" show-word-limit></el-input>
 | ||
|                   </el-form-item>
 | ||
|                   <el-form-item label="安置地区" prop="placeAreaId" v-if="forms.move == '01'">
 | ||
|                     <ai-area-select
 | ||
|                       clearable
 | ||
|                       always-show
 | ||
|                       :instance="instance"
 | ||
|                       v-model="forms.placeAreaId"
 | ||
|                       @fullname="v=>forms.placeArea=v"
 | ||
|                       :disabled-level="user.info.areaList.length"
 | ||
|                     />
 | ||
|                   </el-form-item>
 | ||
|                   <el-form-item label="安置详细地址" prop="place" v-if="forms.move == '01'">
 | ||
|                     <el-input v-model="forms.place" placeholder="请输入" maxlength="50" show-word-limit></el-input>
 | ||
|                   </el-form-item>
 | ||
|                 </div>
 | ||
|                 <template v-else>
 | ||
|                   <div class="above">
 | ||
|                     <div class="left">
 | ||
|                       <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                         <ai-info-item label="监测对象类型:"><span >{{dict.getLabel('fpType', forms.type)}}</span></ai-info-item>
 | ||
|                         <ai-info-item label="联系方式:"><span >{{forms.phone}}</span></ai-info-item>
 | ||
|                       </ai-wrapper>
 | ||
|                     </div>
 | ||
|                     <div class="right">
 | ||
|                       <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                         <ai-info-item label="是否搬迁:"><span >{{dict.getLabel('fpYesOrNo', forms.move)}}</span></ai-info-item>
 | ||
|                       </ai-wrapper>
 | ||
|                     </div>
 | ||
|                   </div>
 | ||
|                   <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                     <ai-info-item label="所属区域:"><span >{{forms.addressArea}}</span></ai-info-item>
 | ||
|                     <ai-info-item label="家庭住址:"><span >{{forms.address}}</span></ai-info-item>
 | ||
|                     <ai-info-item label="安置地区:"  v-if="forms.move == '01'"><span >{{forms.placeArea}}</span></ai-info-item>
 | ||
|                     <ai-info-item label="安置详细地址:"  v-if="forms.move == '01'"><span >{{forms.place}}</span></ai-info-item>
 | ||
|                   </ai-wrapper>
 | ||
|                 </template>
 | ||
|               </template>
 | ||
|             </ai-card>
 | ||
| 
 | ||
|             <ai-card title="家庭成员">
 | ||
|               <template slot="content">
 | ||
|                 <ai-search-bar v-if="isEdit">
 | ||
|                   <template #right><el-button type="primary" icon="iconfont iconAdd" @click="showAddFamily=true">添加</el-button></template>
 | ||
|                 </ai-search-bar>
 | ||
|                 <ai-table :tableData="forms.familyList" :colConfigs="colConfigs" :dict="dict" :isShowPagination="false">
 | ||
|                   <el-table-column slot="age" label="年龄" align="center" width="200">
 | ||
|                     <template v-slot="{ row }">
 | ||
|                       <span>{{getAge(row.idNumber)}}</span>
 | ||
|                     </template>
 | ||
|                   </el-table-column>
 | ||
|                   <el-table-column slot="options" label="操作" align="center" fixed="right" width="200" v-if="isEdit">
 | ||
|                     <template v-slot="{ row, $index }">
 | ||
|                       <el-button type="text" @click="editFamily(row, $index)">编辑</el-button>
 | ||
|                       <el-button type="text" @click="delFamily(row, $index)">删除</el-button>
 | ||
|                     </template>
 | ||
|                   </el-table-column>
 | ||
|                 </ai-table>
 | ||
|               </template>
 | ||
|             </ai-card>
 | ||
| 
 | ||
|             <ai-card title="家庭情况">
 | ||
|               <template slot="content">
 | ||
|                 <div class="above" v-if="isEdit">
 | ||
|                   <div class="left">
 | ||
|                     <el-form-item label="是否危房" prop="dilapidatedHouse" >
 | ||
|                       <ai-select v-model="forms.dilapidatedHouse" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="风险类型" prop="riskType" >
 | ||
|                       <ai-select v-model="forms.riskType" placeholder="请选择" clearable :selectList="$dict.getDict('fpRiskType')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                   </div>
 | ||
|                   <div class="right">
 | ||
|                     <el-form-item label="是否饮水安全" prop="waterSecurity" >
 | ||
|                       <ai-select v-model="forms.waterSecurity" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                   </div>             
 | ||
|                 </div>
 | ||
|                 <div class="above" v-else>
 | ||
|                   <div class="left">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="是否危房:"><span >{{dict.getLabel('fpYesOrNo', forms.dilapidatedHouse)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="风险类型:"><span >{{dict.getLabel('fpRiskType', forms.riskType)}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                   <div class="right">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="是否饮水安全:"><span >{{dict.getLabel('fpYesOrNo', forms.waterSecurity)}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                 </div>
 | ||
|               </template>
 | ||
|             </ai-card>
 | ||
| 
 | ||
|             <ai-card title="收入情况(单位:元)">
 | ||
|               <template slot="content">
 | ||
|                 <div v-if="isEdit">
 | ||
|                   <div class="above">
 | ||
|                     <div class="left">
 | ||
|                       <el-form-item label="工资收入">
 | ||
|                         <el-input v-model.number="forms.income1" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="财产性收入">
 | ||
|                         <el-input v-model.number="forms.income3" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="理赔收入">
 | ||
|                         <el-input v-model.number="forms.income8" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="合规自然支出">
 | ||
|                         <el-input v-model.number="forms.income9" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                     </div>
 | ||
|                     <div class="right">
 | ||
|                       <el-form-item label="生存经营收入">
 | ||
|                         <el-input v-model.number="forms.income2" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="转移性收入">
 | ||
|                         <el-input v-model.number="forms.income4" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                       <el-form-item label="生产经营支出">
 | ||
|                         <el-input v-model.number="forms.income5" placeholder="请输入" maxlength="10"></el-input>
 | ||
|                       </el-form-item>
 | ||
|                     </div>          
 | ||
|                   </div>
 | ||
|                   <p style="font-size:14px;">备注:不填写时默认为0元</p>  
 | ||
|                 </div>
 | ||
|                 <div class="above" v-else>
 | ||
|                   <div class="left">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="工资收入:"><span >{{forms.income1 || 0}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="财产性收入:"><span >{{forms.income3 || 0}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="理赔收入:"><span >{{forms.income8 || 0}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="合规自然支出:"><span >{{forms.income9 || 0}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                   <div class="right">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="生存经营收入:"><span >{{forms.income2 || 0}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="转移性收入:"><span >{{forms.income4 || 0}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="生产经营支出:"><span >{{forms.income5 || 0}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                 </div>
 | ||
|               </template>
 | ||
|             </ai-card>
 | ||
| 
 | ||
|             <ai-card title="帮扶情况">
 | ||
|               <template slot="content">
 | ||
|                 <div class="above" v-if="isEdit">
 | ||
|                   <div class="left">
 | ||
|                     <el-form-item label="产业帮扶" prop="industrialAssistance" >
 | ||
|                       <ai-select v-model="forms.industrialAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpIndustrialAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="就业帮扶" prop="employmentAssistance" >
 | ||
|                       <ai-select v-model="forms.employmentAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpEmploymentAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="金融帮扶" prop="financialAssistance" >
 | ||
|                       <ai-select v-model="forms.financialAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpFinancialAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="公益岗位帮扶" prop="publicWelfarePostAssistance" >
 | ||
|                       <ai-select v-model="forms.publicWelfarePostAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpPublicWelfarePostAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="风险消除时间" prop="riskEliminationDate" v-if="forms.isRisk == 1">
 | ||
|                       <el-date-picker
 | ||
|                         v-model="forms.riskEliminationDate"
 | ||
|                         type="date"
 | ||
|                         value-format="yyyy-MM-dd"
 | ||
|                         size="small"
 | ||
|                         placeholder="选择日期">
 | ||
|                       </el-date-picker>
 | ||
|                     </el-form-item>
 | ||
|                   </div>
 | ||
|                   <div class="right">
 | ||
|                      <el-form-item label="健康帮扶" prop="healthAssistance" >
 | ||
|                       <ai-select v-model="forms.healthAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpHealthAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="教育帮扶" prop="educationalAssistance" >
 | ||
|                       <ai-select v-model="forms.educationalAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpEducationalAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="社会帮扶" prop="socialAssistance" >
 | ||
|                       <ai-select v-model="forms.socialAssistance" placeholder="请选择" clearable :selectList="$dict.getDict('fpSocialAssistance')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="是否风险消除">
 | ||
|                       <ai-select v-model="forms.isRisk" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                     <el-form-item label="风险消除方式" prop="riskEliminationMethod"  v-if="forms.isRisk == 1">
 | ||
|                       <ai-select v-model="forms.riskEliminationMethod" placeholder="请选择" clearable :selectList="$dict.getDict('fpRiskEliminationMethod')"></ai-select>
 | ||
|                     </el-form-item>
 | ||
|                   </div>          
 | ||
|                 </div>
 | ||
|                 <div class="above" v-else>
 | ||
|                   <div class="left">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="产业帮扶:"><span >{{dict.getLabel('fpIndustrialAssistance', forms.industrialAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="就业帮扶:"><span >{{dict.getLabel('fpEmploymentAssistance', forms.employmentAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="金融帮扶:"><span >{{dict.getLabel('fpFinancialAssistance', forms.financialAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="公益岗位帮扶:"><span >{{dict.getLabel('fpPublicWelfarePostAssistance', forms.publicWelfarePostAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="风险消除时间:" v-if="forms.isRisk == 1"><span >{{forms.riskEliminationDate}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                   <div class="right">
 | ||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;">
 | ||
|                       <ai-info-item label="健康帮扶:"><span >{{dict.getLabel('fpHealthAssistance', forms.healthAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="教育帮扶:"><span >{{dict.getLabel('fpEducationalAssistance', forms.educationalAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="社会帮扶:"><span >{{dict.getLabel('fpSocialAssistance', forms.socialAssistance)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="是否风险消除:"><span >{{dict.getLabel('fpYesOrNo', forms.isRisk)}}</span></ai-info-item>
 | ||
|                       <ai-info-item label="风险消除方式:" v-if="forms.isRisk == 1"><span >{{dict.getLabel('fpRiskEliminationMethod', forms.riskEliminationMethod)}}</span></ai-info-item>
 | ||
|                     </ai-wrapper>
 | ||
|                   </div>
 | ||
|                 </div>
 | ||
|               </template>
 | ||
|             </ai-card>
 | ||
|           </div>
 | ||
|           <ai-card title="帮扶日志" v-if="navIndex == 1">
 | ||
|             <template #right>
 | ||
|               <span class="edit-text" @click="showAddLog=true">新增日志</span>
 | ||
|             </template>
 | ||
|             <template slot="content">
 | ||
|               <div class="log-list" v-if="logList.length">
 | ||
|                 <div class="log-item" v-for="(item, index) in logList" :key="index">
 | ||
|                   <img src="https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132" alt="">
 | ||
|                   <div class="content">
 | ||
|                     <div class="heade-info">
 | ||
|                       <h2>{{item.createUserName}}</h2>
 | ||
|                       <p>{{item.createTime}}</p>
 | ||
|                     </div>
 | ||
|                     <p class="text">{{item.detail}}</p>
 | ||
|                     <div class="img-list">
 | ||
|                       <ai-uploader :disabled="true"  :instance="instance"  v-model="item.file" :limit="9"></ai-uploader>
 | ||
|                     </div>
 | ||
|                     <div class="footer-btn">
 | ||
|                       <span class="edit-text" @click="editLog(item)">编辑</span>
 | ||
|                       <span class="edit-text" @click="delLog(item)">删除</span>
 | ||
|                     </div>
 | ||
|                   </div>
 | ||
|                 </div>
 | ||
|               </div>
 | ||
|               <ai-empty v-else></ai-empty>
 | ||
|             </template>
 | ||
|           </ai-card>
 | ||
|         </el-form>
 | ||
|         <ai-dialog title="新增帮扶日志" :visible.sync="showAddLog" :customFooter="true"  :destroyOnClose="true"  border  width="900px">
 | ||
|           <el-form ref="logrules" :model="logInfo" :rules="formRules" size="small" label-suffix=":" label-width="150px">
 | ||
|             <el-form-item label="帮扶内容" prop="detail">
 | ||
|               <el-input v-model="logInfo.detail" type="textarea" placeholder="请输入" maxlength="500" show-word-limit></el-input>
 | ||
|             </el-form-item>
 | ||
|             <el-form-item label="图片(最多9张)" >
 | ||
|               <ai-uploader
 | ||
|                 :isShowTip="true"
 | ||
|                 :instance="instance"
 | ||
|                 v-model="logInfo.file"
 | ||
|                 fileType="img"
 | ||
|                 acceptType=".png,.jpg,.jpeg"
 | ||
|                 :limit="9">
 | ||
|                 <template slot="tips">最多上传9张图片,单张图片最大10MB<br/>支持.png,.jpg,.jpeg格式</template>
 | ||
|               </ai-uploader>
 | ||
|             </el-form-item>
 | ||
|           </el-form>
 | ||
|           <div class="dialog-footer" slot="footer" >
 | ||
|             <el-button size="medium" @click="showAddLog=false">取消</el-button>
 | ||
|             <el-button type="primary" size="medium" @click="addLog()">确认</el-button>
 | ||
|           </div>
 | ||
|         </ai-dialog>
 | ||
|         <ai-dialog title="新增家庭成员" :visible.sync="showAddFamily" :customFooter="true"  :destroyOnClose="true"  border  width="900px">
 | ||
|           <el-form ref="addrules" :model="familyInfo" :rules="formRules" size="small" label-suffix=":" label-width="150px">
 | ||
|             <div class="above">
 | ||
|               <div class="left">
 | ||
|                 <el-form-item label="与户主关系" prop="relationship" >
 | ||
|                   <ai-select v-model="familyInfo.relationship" placeholder="请选择" clearable :selectList="$dict.getDict('fpRelationship')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="性别" prop="sex" >
 | ||
|                   <ai-select v-model="familyInfo.sex" placeholder="请选择" clearable :selectList="$dict.getDict('sex')" disabled></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="政治面貌" prop="politicalOutlook" >
 | ||
|                   <ai-select v-model="familyInfo.politicalOutlook" placeholder="请选择" clearable :selectList="$dict.getDict('fpPoliticalOutlook')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="在校情况" prop="studentsInSchool" >
 | ||
|                   <ai-select v-model="familyInfo.studentsInSchool" placeholder="请选择" clearable :selectList="$dict.getDict('fpStudentsInSchool')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="劳动技能" prop="laborSkills" >
 | ||
|                   <ai-select v-model="familyInfo.laborSkills" placeholder="请选择" clearable :selectList="$dict.getDict('fpLaborSkills')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="务工时间" prop="workingMonths" >
 | ||
|                    <el-input v-model.number="familyInfo.workingMonths" placeholder="请输入(月数)" maxlength="30" show-word-limit></el-input>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="是否参加大病医保" prop="sicknessInsurance" >
 | ||
|                   <ai-select v-model="familyInfo.sicknessInsurance" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="享受最低生活保障" prop="subsistenceAllowance" >
 | ||
|                   <ai-select v-model="familyInfo.subsistenceAllowance" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|               </div>
 | ||
|               <div class="right">
 | ||
|                 <el-form-item label="姓名" prop="name" >
 | ||
|                   <el-input v-model.number="familyInfo.name" placeholder="请输入" maxlength="11" show-word-limit></el-input>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="身份证号" prop="idNumber" >
 | ||
|                   <ai-id size="small" v-model="familyInfo.idNumber" @change="getSex(familyInfo.idNumber)"/>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="民族" prop="nation" >
 | ||
|                   <ai-select v-model="familyInfo.nation" placeholder="请选择" clearable :selectList="$dict.getDict('fpNation')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="文化程度" prop="education" >
 | ||
|                   <ai-select v-model="familyInfo.education" placeholder="请选择" clearable :selectList="$dict.getDict('fpEducation')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="健康状况" prop="health" >
 | ||
|                   <ai-select v-model="familyInfo.health" placeholder="请选择" clearable :selectList="$dict.getDict('fpHealth')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="务工区域" prop="workArea" >
 | ||
|                   <el-input v-model="familyInfo.workArea" placeholder="请输入" maxlength="30" show-word-limit></el-input>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="是否参加医保" prop="medicalInsurance" >
 | ||
|                   <ai-select v-model="familyInfo.medicalInsurance" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="是否参加养老保险" prop="endowmentInsurance" >
 | ||
|                   <ai-select v-model="familyInfo.endowmentInsurance" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|                 <el-form-item label="是否特困供养" prop="destitute" >
 | ||
|                   <ai-select v-model="familyInfo.destitute" placeholder="请选择" clearable :selectList="$dict.getDict('fpYesOrNo')"></ai-select>
 | ||
|                 </el-form-item>
 | ||
|               </div>
 | ||
|             </div>
 | ||
|           </el-form>
 | ||
|           <div class="dialog-footer" slot="footer" >
 | ||
|             <el-button  size="medium" @click="showAddFamily=false">取消</el-button>
 | ||
|             <el-button  type="primary" size="medium" @click="addFamily()">确认</el-button>
 | ||
|           </div>
 | ||
|         </ai-dialog>
 | ||
|       </template>
 | ||
|       <template #footer v-if="!params.id">
 | ||
|         <el-button @click="cancel(false)" class="delete-btn footer-btn" >取 消</el-button>
 | ||
|         <el-button type="primary" @click="save()"  class="footer-btn">提 交</el-button>
 | ||
|       </template>
 | ||
|     </ai-detail>
 | ||
|   </section>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| import {mapState} from "vuex";
 | ||
| export default {
 | ||
|   name: "add",
 | ||
|   props: {
 | ||
|     instance: Function,
 | ||
|     dict: Object,
 | ||
|     permissions: Function,
 | ||
|     params: Object,
 | ||
|   },
 | ||
|   data() {
 | ||
|     return {
 | ||
|       forms: {
 | ||
|         type: '',
 | ||
|         phone: '',
 | ||
|         move: '',
 | ||
|         addressAreaId: '',
 | ||
|         address: '',
 | ||
|         placeAreaId: '',
 | ||
|         dilapidatedHouse: '',
 | ||
|         riskType: '',
 | ||
|         waterSecurity: '',
 | ||
|         income1: '',
 | ||
|         income2: '',
 | ||
|         income3: '',
 | ||
|         income4: '',
 | ||
|         income5: '',
 | ||
|         income8: '',
 | ||
|         income9: '',
 | ||
|         isRisk: '',
 | ||
|         riskEliminationDate: '',
 | ||
|         riskEliminationMethod: '',
 | ||
|         industrialAssistance: '',
 | ||
|         employmentAssistance: '',
 | ||
|         financialAssistance: '',
 | ||
|         publicWelfarePostAssistance: '',
 | ||
|         healthAssistance: '',
 | ||
|         educationalAssistance: '',
 | ||
|         socialAssistance: '',
 | ||
|         familyList: []
 | ||
|       },
 | ||
|       navIndex: 0,
 | ||
|       showAddFamily: false,
 | ||
|       isEdit: false,
 | ||
|       familyInfo: {
 | ||
|         relationship: '',
 | ||
|         sex: '',
 | ||
|         politicalOutlook: '',
 | ||
|         studentsInSchool: '',
 | ||
|         laborSkills: '',
 | ||
|         workingMonths: '',
 | ||
|         sicknessInsurance: '',
 | ||
|         subsistenceAllowance: '',
 | ||
|         name: '',
 | ||
|         idNumber: '',
 | ||
|         nation: '',
 | ||
|         education: '',
 | ||
|         health: '',
 | ||
|         workArea: '',
 | ||
|         medicalInsurance: '',
 | ||
|         endowmentInsurance: '',
 | ||
|         destitute: '',
 | ||
|       },
 | ||
|       editFamilyIndex: '',
 | ||
|       showAddLog: false,
 | ||
|       logList: [],
 | ||
|       logInfo: {
 | ||
|         detail: '',
 | ||
|         file: [],
 | ||
|         picture: ''
 | ||
|       }
 | ||
|     };
 | ||
|   },
 | ||
|   created() {
 | ||
|     this.dict.load('fpType', 'fpYesOrNo', 'fpRiskType', 'fpRiskEliminationMethod', 'fpIndustrialAssistance', 'fpEmploymentAssistance', 'fpFinancialAssistance',
 | ||
|     'fpPublicWelfarePostAssistance', 'fpHealthAssistance', 'fpEducationalAssistance', 'fpSocialAssistance', 'fpRelationship', 'sex', 'fpPoliticalOutlook', 
 | ||
|     'fpStudentsInSchool', 'fpLaborSkills', 'fpNation', 'fpEducation', 'fpHealth')
 | ||
|     if (this.params.id) {
 | ||
|       this.getDetail()
 | ||
|       this.isEdit = false
 | ||
|     } else {
 | ||
|       this.isEdit = true
 | ||
|       this.forms.addressAreaId = this.user.info.areaId
 | ||
|       this.forms.placeAreaId = this.user.info.areaId
 | ||
|     }
 | ||
|   },
 | ||
|   computed: {
 | ||
|     formRules() {
 | ||
|       return {
 | ||
|         type: [{ required: true, message: "请选择监测对象类型", trigger: "change" }],
 | ||
|         move: [{ required: true, message: "请选择是否搬迁", trigger: "change" }],
 | ||
|         phone: [{ required: true, message: "请输入联系方式", trigger: "change" }],
 | ||
|         addressAreaId: [
 | ||
|           {required: true, message: "请选择所属区域"},
 | ||
|           {trigger:'blur',validator: (r, v, cb) => /0{3}$/g.test(v) ? cb('请选择到村/社区') : cb()}
 | ||
|         ],
 | ||
|         address: [{ required: true, message: "请输入家庭住址", trigger: "change" }],
 | ||
|         placeAreaId: [
 | ||
|           {required: true, message: "请选择安置地区"},
 | ||
|           {trigger:'blur',validator: (r, v, cb) => /0{3}$/g.test(v) ? cb('请选择到村/社区') : cb()}
 | ||
|         ],
 | ||
|         place: [{ required: true, message: "请输入安置详细住址", trigger: "change" }],
 | ||
|         riskEliminationMethod: [{ required: true, message: "请选择风险消除方式", trigger: "change" }],
 | ||
|         riskEliminationDate: [{ required: true, message: "请选择风险消除时间", trigger: "change" }],
 | ||
| 
 | ||
|         relationship: [{ required: true, message: "请选择与户主关系", trigger: "change" }],
 | ||
|         name: [{ required: true, message: "请输入姓名", trigger: "change" }],
 | ||
|         idNumber: [{ required: true, message: "请输入证件号码", trigger: "change" }],
 | ||
|         studentsInSchool: [{ required: true, message: "请选择在校情况", trigger: "change" }],
 | ||
|         health: [{ required: true, message: "请选择健康情况", trigger: "change" }], 
 | ||
|         sicknessInsurance: [{ required: true, message: "请选择是否大病医保", trigger: "change" }],
 | ||
|         subsistenceAllowance: [{ required: true, message: "请选择享受最低生活保障", trigger: "change" }],
 | ||
|         medicalInsurance: [{ required: true, message: "请选择是否参加医保", trigger: "change" }],
 | ||
|         endowmentInsurance: [{ required: true, message: "请选择是否参加养老保险", trigger: "change" }],
 | ||
|         destitute: [{ required: true, message: "请选择是否特困供养", trigger: "change" }],
 | ||
|         detail: [{ required: true, message: "请输入帮扶内容", trigger: "change" }],
 | ||
|       };
 | ||
|     },
 | ||
|     ...mapState(['user']),
 | ||
|     colConfigs() {
 | ||
|       return [
 | ||
|         {label: "与户主关系", prop: "relationship", dict: 'fpRelationship', align: 'center'},
 | ||
|         {label: "姓名", prop: "name", align: 'center'},
 | ||
|         {label: "性别", prop: "sex", dict: 'sex', align: 'center'},
 | ||
|         {slot: 'age'},
 | ||
|         {
 | ||
|           label: "身份证号", width: "160px", align: 'center',
 | ||
|           render: (h, {row}) => h('span', null, this.idCardNoUtil.hideId(row.idNumber))
 | ||
|         },
 | ||
|         {slot: "options"},
 | ||
|       ]
 | ||
|     }
 | ||
|   },
 | ||
|   methods: {
 | ||
|     save() {
 | ||
|       this.$refs["rules"].validate((valid) => {
 | ||
|         if (valid) {
 | ||
|           this.confirmSave()
 | ||
|         } else {
 | ||
|           return false;
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     confirmSave() {
 | ||
|       var isHolder = false  //家庭成员必须有户主
 | ||
|       if(this.forms.familyList.length) {
 | ||
|         this.forms.familyList.map((item) => {
 | ||
|           if(item.relationship == '01') {
 | ||
|             isHolder = true
 | ||
|           }
 | ||
|         })
 | ||
|       }
 | ||
|       if(!isHolder) {
 | ||
|         return this.$message.error('家庭成员必须添加户主信息');
 | ||
|       }
 | ||
|       if(this.forms.isRisk == '01') {
 | ||
|         this.forms.status = 1
 | ||
|       }
 | ||
|       this.instance .post( `/app/apppreventionreturntopoverty/addOrUpdate`, { ...this.forms}).then((res) => {
 | ||
|         if (res.code == 0) {
 | ||
|           if (!this.params.id) {
 | ||
|             this.cancel(true)
 | ||
|           } else {
 | ||
|             this.isEdit = false
 | ||
|             this.getDetail()
 | ||
|           }
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     getDetail() {
 | ||
|       this.instance.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${this.params.id}`).then((res) => {
 | ||
|         if (res.code == 0) {
 | ||
|           this.forms = { ...this.forms, ...res.data }
 | ||
|           if(this.forms.riskEliminationDate) {
 | ||
|             this.forms.isRisk = '01'
 | ||
|           }else {
 | ||
|             this.forms.isRisk = '02'
 | ||
|           }
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     addFamily() {
 | ||
|       this.$refs["addrules"].validate((valid) => {
 | ||
|         if (valid) {
 | ||
|           if(this.editFamilyIndex === '') {
 | ||
|             this.forms.familyList.push(this.familyInfo)
 | ||
|           }else {
 | ||
|             this.$set(this.forms.familyList, this.editFamilyIndex, this.familyInfo)
 | ||
|           }
 | ||
| 
 | ||
|           if(this.forms.isRisk == '02') {
 | ||
|             this.forms.riskEliminationDate = ''
 | ||
|             this.forms.riskEliminationMethod = ''
 | ||
|           }
 | ||
|           
 | ||
|           this.showAddFamily = false
 | ||
|           this.editFamilyIndex = ''
 | ||
|           this.familyInfo = Object.assign({},this.$options.data().familyInfo);
 | ||
|         } else {
 | ||
|           return false;
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     editFamily(item, index) {
 | ||
|       this.showAddFamily = true
 | ||
|       this.editFamilyIndex = index
 | ||
|       this.familyInfo = {...item}
 | ||
|     },
 | ||
|     delFamily(item, index) {
 | ||
|       this.$confirm("是否要删除该家庭成员", {
 | ||
|         type: 'error'
 | ||
|       }).then(() => {
 | ||
|           this.$message({message: '家庭成员删除成功', type: 'success'});
 | ||
|           this.forms.familyList.splice(index, 1)
 | ||
|       }).catch(() => 0)
 | ||
|     },
 | ||
|     getAge(UUserCard) {
 | ||
|       const myDate = new Date();
 | ||
|       const month = myDate.getMonth() + 1;
 | ||
|       const day = myDate.getDate();
 | ||
|       let age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
 | ||
|       if ( UUserCard.substring(10, 12) < month ||  (UUserCard.substring(10, 12) == month &&  UUserCard.substring(12, 14) <= day)) {
 | ||
|         age++;
 | ||
|       }
 | ||
|       return age
 | ||
|     },
 | ||
|     getSex(UUserCard) {
 | ||
|       if (UUserCard) {
 | ||
|         if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
 | ||
|           this.familyInfo.sex = '1'
 | ||
|         } else {
 | ||
|           this.familyInfo.sex = '0'
 | ||
|         }
 | ||
|       }
 | ||
|     },
 | ||
|     cancel (isRefresh) {
 | ||
|       this.$emit('change', {
 | ||
|         type: 'List',
 | ||
|         isRefresh: isRefresh ? true : false,
 | ||
|       })
 | ||
|     },
 | ||
|     getLogList() {
 | ||
|       this.instance.post(`/app/apppreventionreturntopovertylog/list?pid=${this.params.id}`).then((res) => {
 | ||
|         if (res.code == 0) {
 | ||
|           res.data.records.map((item) => {
 | ||
|             item.file = JSON.parse(item.picture)
 | ||
|           })
 | ||
|           this.logList = res.data.records
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     addLog() {
 | ||
|       this.$refs["logrules"].validate((valid) => {
 | ||
|         if (valid) {
 | ||
|           this.logInfo.picture = JSON.stringify(this.logInfo.file)
 | ||
|           this.logInfo.pid = this.params.id
 | ||
|           this.logInfo.createUserName = this.user.info.name
 | ||
|           this.instance .post( `/app/apppreventionreturntopovertylog/addOrUpdate`, { ...this.logInfo}).then((res) => {
 | ||
|             if (res.code == 0) {
 | ||
|               this.$message({message: this.logInfo.id ? '编辑帮扶日志成功' : '新增帮扶日志成功', type: 'success'});
 | ||
|               this.getLogList()
 | ||
|               this.logInfo = Object.assign({},this.$options.data().logInfo)
 | ||
|               this.showAddLog = false
 | ||
|             }
 | ||
|           });
 | ||
|         } else {
 | ||
|           return false;
 | ||
|         }
 | ||
|       });
 | ||
|     },
 | ||
|     delLog(row) {
 | ||
|       this.$confirm("是否要删除该帮扶日志", {
 | ||
|         type: 'error'
 | ||
|       }).then(() => {
 | ||
|         this.instance.post(`/app/apppreventionreturntopovertylog/delete?ids=${row.id}`).then((res) => {
 | ||
|           if (res.code == 0) {
 | ||
|             this.$message({message: '帮扶日志删除成功', type: 'success'});
 | ||
|             this.getLogList()
 | ||
|           }
 | ||
|         });
 | ||
|       }).catch(() => 0)
 | ||
|     },
 | ||
|     editLog(row) {
 | ||
|       this.logInfo = {...row}
 | ||
|       this.logInfo.file = JSON.parse(row.picture)
 | ||
|       this.showAddLog = true
 | ||
|     }
 | ||
|   },
 | ||
| };
 | ||
| </script>
 | ||
| 
 | ||
| <style lang="scss" scoped>
 | ||
| .add {
 | ||
|   height: 100%;
 | ||
|   .log-list{
 | ||
|     .log-item{
 | ||
|       display: flex;
 | ||
|       border-bottom: 1px solid #ddd;
 | ||
|       padding-top: 16px;
 | ||
|       img{
 | ||
|         width: 48px;
 | ||
|         height: 48px;
 | ||
|         border-radius: 50%;
 | ||
|         margin-right: 16px;
 | ||
|       }
 | ||
|       .content{
 | ||
|         width: calc(100% - 64px);
 | ||
|         color: #000;
 | ||
|         .heade-info{
 | ||
|           display: flex;
 | ||
|           justify-content: space-between;
 | ||
|           height: 36px;
 | ||
|           line-height: 36px;
 | ||
|           h2{
 | ||
|             font-size: 16px;
 | ||
|             font-weight: 400;
 | ||
|           }
 | ||
|           p{
 | ||
|             font-size: 14px;
 | ||
|             color: #333;
 | ||
|           }
 | ||
|         }
 | ||
|         .text{
 | ||
|           font-size: 14px;
 | ||
|           word-break: break-all;
 | ||
|           margin-bottom: 8px;
 | ||
|         }
 | ||
|         .img-list{
 | ||
|           img{
 | ||
|             width: 150px;
 | ||
|             height: 150px;
 | ||
|             margin: 0 16px 16px 0;
 | ||
|           }
 | ||
|         }
 | ||
|         .footer-btn{
 | ||
|           width: 100%;
 | ||
|           text-align: right;
 | ||
|           padding-bottom: 16px;
 | ||
|         }
 | ||
|       }
 | ||
|     }
 | ||
|     .log-item:nth-last-of-type(1) {
 | ||
|       border-bottom: 0;
 | ||
|     }
 | ||
|   }
 | ||
|   .ai-detail__title {
 | ||
|     background-color: #fff;
 | ||
|   }
 | ||
|   .ai-detail__content {
 | ||
|     .ai-detail__content--wrapper {
 | ||
|       .el-form {
 | ||
|         // background-color: #fff;
 | ||
|         // padding: 0 60px;
 | ||
|         .flex {
 | ||
|           display: flex;
 | ||
|           flex-wrap: wrap;
 | ||
|           justify-content: space-between;
 | ||
|           .el-form-item {
 | ||
|             width: 48%;
 | ||
|           }
 | ||
|           .buildingTypes {
 | ||
|             width: 100%;
 | ||
|           }
 | ||
|         }
 | ||
|       }
 | ||
|     }
 | ||
|   }
 | ||
|   ::v-deep .el-tag {
 | ||
|     margin-right: 8px;
 | ||
|     color: #333333;
 | ||
|   }
 | ||
|   .footer-btn {
 | ||
|     width: 92px;
 | ||
|   }
 | ||
|   .above{
 | ||
|     display: flex;
 | ||
|     .left, .right{
 | ||
|       flex: 1;
 | ||
|     }
 | ||
|   }
 | ||
| 
 | ||
|   .nav-list{
 | ||
|     position: absolute;
 | ||
|     top: 100px;
 | ||
|     left: -152px;
 | ||
|     .nav-item{
 | ||
|       width: 120px;
 | ||
|       height: 50px;
 | ||
|       text-align: center;
 | ||
|       line-height: 50px;
 | ||
|       background-color: #fff;
 | ||
|       cursor: pointer;
 | ||
|       font-size: 16px;
 | ||
|       color: #666;
 | ||
|     }
 | ||
|     .active{
 | ||
|       font-weight: 700;
 | ||
|       color: #26f;
 | ||
|     }
 | ||
|   }
 | ||
| 
 | ||
|   ::v-deep .el-date-editor.el-input, .el-date-editor.el-input__inner{
 | ||
|     width: 100%;
 | ||
|   }
 | ||
|   .edit-text{
 | ||
|     color:#2266FF;
 | ||
|     margin-left: 16px;
 | ||
|     cursor: pointer;
 | ||
|     font-size: 12px;
 | ||
|   }
 | ||
| }
 | ||
| </style> |