<fwgl ref="fwgl" :orgId="orgId"></fwgl> </div> <div class="bgImg"> <Title text="居民概览"/> <jmgl ref="jmgl" :orgId="orgId"></jmgl> </div> <div class="bgImg"> <Title text="图谱画像"/> <jdtphx :id="orgId" :current-level-data="{orgId:orgId, orgLevel:orgLevel}"/> </div> </div> <div class="g-center"> <div class="m-map"> <div class="m-per"> <div class="item" @click="jumpPath('normal', 'aged', '老年人')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/lnr.png" />老年人 </div> <div> <b>{{ perInfo.OLD_PEOPLE_FLAG }}</b> % </div> </div> </div> <div class="item" @click="jumpPath('normal', 'aged', '低保人员')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/qsn.png" />低保人员 </div> <div> <b class="blue">{{ perInfo.SUBSISTENCE_ALLOWANCE_FLAG }}</b> % </div> </div> </div> <div class="item" @click="jumpPath('normal', 'aged', '志愿者')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/syry.png" />失业人员 </div> <div> <b class="blue">{{ perInfo.UNEMPLOYED_FLAG }}</b> % </div> </div> </div> <div class="item" @click="jumpPath('normal', 'aged', '党员')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/dy.png" />党员 </div> <div> <b class="orange">{{ perInfo.PARTY_FLAG }}</b> % </div> </div> </div> <div class="item" @click="jumpPath('normal', 'aged', '志愿者')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/zyz.png" />志愿者 </div> <div> <b class="red">{{ perInfo.VOLUNTEER_FLAG }}</b> % </div> </div> </div> <div class="item" @click="jumpPath('normal', 'aged', '特殊人群')"> <div class="item-info"> <div> <img src="~@/assets/images/shuju/renfang/index/per/tsrq.png" />特殊人群 </div> <div> <b>{{ perInfo.SPECIAL_CROWD_FLAG }}</b> % </div> </div> </div> </div> <grid-map ref="map" :srcGridData="orgData" @clickAgency="clickAgencyItem" @clickDotBtn="handleClickDotBtn" /> <mapRight :orgData="orgData" @clickAgency="clickAgencyItem"/> </div> <div class="m-search"> <div class="btn" @click="searchModule.displayedCard = true"> <img class="btn-bg" src="~@/assets/images/shuju/renfang/index/search/btn-bg.png" /> <img class="btn-bg-hover" src="~@/assets/images/shuju/renfang/index/search/btn-bg-hover.png" /> <span>点击搜索</span> </div> <div v-show="searchModule.displayedCard" class="card"> <div class="card-input"> <div class="card-btn" @click="handleSearch"> <img src="~@/assets/images/shuju/renfang/index/search/search.png" /> </div> <input v-model="searchModule.keyword" placeholder="搜索本组织及下级的居民、小区、楼栋、房屋" type="text" @keyup.enter="handleSearch" /> <div class="i-div"></div> <div class="card-btn" @click="searchModule.displayedCard = false"> <img src="~@/assets/images/shuju/renfang/index/search/close.png" /> </div> </div> <div class="card-show"> <div class="card-tabs"> <div :class="{ 'z-on': searchModule.resultTab == '0', }" @click="searchModule.resultTab = '0'" > 全部 </div> <div :class="{ 'z-on': searchModule.resultTab == '1', }" @click="searchModule.resultTab = '1'" > 居民 </div> <div :class="{ 'z-on': searchModule.resultTab == '2', }" @click="searchModule.resultTab = '2'" > 小区 </div> <div :class="{ 'z-on': searchModule.resultTab == '3', }" @click="searchModule.resultTab = '3'" > 楼栋 </div> <div :class="{ 'z-on': searchModule.resultTab == '4', }" @click="searchModule.resultTab = '4'" > 房屋 </div> </div> <div v-if="searchModule.result.length > 0" class="card-list"> <div v-for="(item, index) in searchModule.result" :key="item.title + index" class="card-item" @click="handleClickSearchItem(item)" > <span>{{ item.title }}</span> <img class="i-arrow" src="~@/assets/images/shuju/renfang/index/search/arrow.png" /> <img class="i-arrow z-on" src="~@/assets/images/shuju/renfang/index/search/arrow-on.png" /> </div> </div> <div v-else class="card-empty"> <img src="~@/assets/images/shuju/renfang/index/empty.png"/> <span>没有找到搜索结果～</span> </div> </div> </div> </div> <div class="bgImg m-box m-cate"> <div class="box-title">  <Title v-if="!displayedForecast" text="居民概览"> <template> <div v-if="!displayedForecast" class="box-title-btn" @click="displayedForecast = true" > <img src="~@/assets/images/shuju/renfang/index/znyc.png"/> <span>智能预测</span> <el-tooltip placement="top"> <div slot="content"> 根据智能分类设置规则，预测来年育龄妇女、老年人、空巢老人、独居老人分别有多少人 </div> <img src="~@/assets/images/shuju/renfang/index/i-hint.png"/> </el-tooltip> </div> </template>