|
|
@ -2,357 +2,359 @@ |
|
|
|
<div style="position: relative"> |
|
|
|
|
|
|
|
<!-- 组织路由 --> |
|
|
|
<div v-if="pageType===''"> |
|
|
|
<div class="div_top"> |
|
|
|
<div class="router_line"></div> |
|
|
|
<div class="div_router"> |
|
|
|
<div v-if="!showPeopleInfo"> |
|
|
|
<span class="router_child">五大图层</span> |
|
|
|
</div> |
|
|
|
<div v-if="showPeopleInfo"> <span class="router_parents" |
|
|
|
@click="handleClickRouter">五大图层<span class="arrow">></span></span> |
|
|
|
|
|
|
|
<span class="router_child">个人档案</span> |
|
|
|
</div> |
|
|
|
<div class="div_top"> |
|
|
|
<div class="router_line"></div> |
|
|
|
<div class="div_router"> |
|
|
|
<div v-if="!showPeopleInfo"> |
|
|
|
<span class="router_child">五大图层</span> |
|
|
|
</div> |
|
|
|
<div v-if="showPeopleInfo"> <span class="router_parents" |
|
|
|
@click="handleClickRouter">五大图层<span class="arrow">></span></span> |
|
|
|
|
|
|
|
<span class="router_child">个人档案</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-show="!showPeopleInfo" |
|
|
|
class="div_content"> |
|
|
|
<div v-show="!showPeopleInfo" |
|
|
|
class="div_content"> |
|
|
|
|
|
|
|
<div class="div_data"> |
|
|
|
<div class="div_tips"> |
|
|
|
<cpt-card> |
|
|
|
<div class="div_coverage"> |
|
|
|
<div class="div_map" |
|
|
|
id="map" |
|
|
|
ref="map"> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="coverage_item" |
|
|
|
@click="handleClickCoverage(index)" |
|
|
|
v-for="(item,index) in coverageTypesList" |
|
|
|
:key="index"> |
|
|
|
<img :src="item.select?selImg:noSelImg" /> |
|
|
|
<span>{{item.label}}</span> |
|
|
|
</div> |
|
|
|
<div class="div_data"> |
|
|
|
<div class="div_tips"> |
|
|
|
<cpt-card> |
|
|
|
<div class="div_coverage"> |
|
|
|
|
|
|
|
<div class="coverage_item" |
|
|
|
@click="handleClickCoverage(index)" |
|
|
|
v-for="(item,index) in coverageTypesList" |
|
|
|
:key="index"> |
|
|
|
<img :src="item.select?selImg:noSelImg" /> |
|
|
|
<span>{{item.label}}</span> |
|
|
|
</div> |
|
|
|
<div class="div_category"> |
|
|
|
<div v-for="(item,index) in categoryListshow" |
|
|
|
:key="index" |
|
|
|
class="category_item"> |
|
|
|
|
|
|
|
<div v-for="(colItem,colIndex) in item" |
|
|
|
:key="colIndex" |
|
|
|
class="list_item" |
|
|
|
@click="handleClickCategory(index,colIndex)"> |
|
|
|
<img :src="colItem.dataIcon" |
|
|
|
alt /> |
|
|
|
<div :class="['item_content',colItem.sel?'item_content_sel':'']">{{colItem.categoryName}} |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="div_category"> |
|
|
|
<div v-for="(item,index) in categoryListshow" |
|
|
|
:key="index" |
|
|
|
class="category_item"> |
|
|
|
|
|
|
|
<div v-for="(colItem,colIndex) in item" |
|
|
|
:key="colIndex" |
|
|
|
class="list_item" |
|
|
|
@click="handleClickCategory(index,colIndex)"> |
|
|
|
<img :src="colItem.dataIcon" |
|
|
|
alt /> |
|
|
|
<div :class="['item_content',colItem.sel?'item_content_sel':'']">{{colItem.categoryName}} |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</cpt-card> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</cpt-card> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div_info"> |
|
|
|
<cpt-card> |
|
|
|
<div class="div_search_list"> |
|
|
|
<el-input size="mini" |
|
|
|
WarningColor='warning' |
|
|
|
placeholder="请输入搜索内容" |
|
|
|
v-model="search"> |
|
|
|
<i slot="prefix" |
|
|
|
class="icon"> |
|
|
|
<img src="../../../../../assets/img/modules/visual/sousuo.png" |
|
|
|
alt /> |
|
|
|
</i> |
|
|
|
</el-input> |
|
|
|
|
|
|
|
<div class="btn" |
|
|
|
@click="handleSearch">搜索</div> |
|
|
|
<div class="div_info"> |
|
|
|
<cpt-card> |
|
|
|
<div class="div_search_list"> |
|
|
|
<el-input size="mini" |
|
|
|
WarningColor='warning' |
|
|
|
placeholder="请输入搜索内容" |
|
|
|
v-model="search"> |
|
|
|
<i slot="prefix" |
|
|
|
class="icon"> |
|
|
|
<img src="../../../../../assets/img/modules/visual/sousuo.png" |
|
|
|
alt /> |
|
|
|
</i> |
|
|
|
</el-input> |
|
|
|
|
|
|
|
<div class="btn" |
|
|
|
@click="handleSearch">搜索</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="m-tb"> |
|
|
|
</div> |
|
|
|
<div class="m-tb"> |
|
|
|
|
|
|
|
<div class="tb"> |
|
|
|
<cpt-tb :col-list="demand.colList" |
|
|
|
:loading="demand.loading" |
|
|
|
:header="demand.header" |
|
|
|
:list="demand.list" |
|
|
|
@handleClickRow="handleClickRow"></cpt-tb> |
|
|
|
<div class="tb"> |
|
|
|
<cpt-tb :col-list="demand.colList" |
|
|
|
:loading="demand.loading" |
|
|
|
:header="demand.header" |
|
|
|
:list="demand.list" |
|
|
|
@handleClickRow="handleClickRow"></cpt-tb> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="m-pagination"> |
|
|
|
<el-pagination hide-on-single-page |
|
|
|
:current-page="demand.pageNo" |
|
|
|
:page-size="demand.pageSize" |
|
|
|
:total="demand.total" |
|
|
|
background |
|
|
|
layout="prev, pager, next,total" |
|
|
|
@current-change="handlePageNoChange_demand"> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="m-pagination"> |
|
|
|
<el-pagination hide-on-single-page :current-page="demand.pageNo" |
|
|
|
:page-size="demand.pageSize" |
|
|
|
:total="demand.total" |
|
|
|
background |
|
|
|
layout="prev, pager, next,total" |
|
|
|
@current-change="handlePageNoChange_demand"> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</cpt-card> |
|
|
|
</div> |
|
|
|
|
|
|
|
</cpt-card> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div id="popup" |
|
|
|
style="display: none;" |
|
|
|
class="ol-popup"> |
|
|
|
<a href="#" |
|
|
|
id="popup-closer" |
|
|
|
class="ol-popup-closer"></a> |
|
|
|
|
|
|
|
<div id="popup-content" |
|
|
|
class="popup-content"> |
|
|
|
<div v-show="selPlaceType==='resi'|| selPlaceType === 'special_resi'"> |
|
|
|
<div class="popTitle">居民信息</div> |
|
|
|
<div class="popContentTitle">姓名: |
|
|
|
<span>{{ selInfo.icUserName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">所属网格: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">所属小区: |
|
|
|
<span>{{ selInfo.villageName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">本地户籍: |
|
|
|
<span>{{ selInfo.isBdhjShow }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div id="popup" |
|
|
|
style="display: none;" |
|
|
|
class="ol-popup"> |
|
|
|
<a href="#" |
|
|
|
id="popup-closer" |
|
|
|
class="ol-popup-closer"></a> |
|
|
|
|
|
|
|
<div id="popup-content" |
|
|
|
class="popup-content"> |
|
|
|
<div v-show="selPlaceType==='resi'|| selPlaceType === 'special_resi'"> |
|
|
|
<div class="popTitle">居民信息</div> |
|
|
|
<div class="popContentTitle">姓名: |
|
|
|
<span>{{ selInfo.icUserName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">所属网格: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">所属小区: |
|
|
|
<span>{{ selInfo.villageName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">本地户籍: |
|
|
|
<span>{{ selInfo.isBdhjShow }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="popContentTitle">手机: |
|
|
|
<span>{{ selInfo.mobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">性别: |
|
|
|
<span>{{ selInfo.genderShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">身份证号: |
|
|
|
<span>{{ selInfo.idCard }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">手机: |
|
|
|
<span>{{ selInfo.mobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">性别: |
|
|
|
<span>{{ selInfo.genderShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">身份证号: |
|
|
|
<span>{{ selInfo.idCard }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="popContentTitle">工作单位: |
|
|
|
<span>{{ selInfo.gzdw?selInfo.gzdw:'--' }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">人户状况: |
|
|
|
<span>{{ selInfo.rhzkShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="div_resi_more"> |
|
|
|
<div @click="toPeople" |
|
|
|
class="span_resi_more">更多</div> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">工作单位: |
|
|
|
<span>{{ selInfo.gzdw?selInfo.gzdw:'--' }}</span> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='dangerous_chemicals'"> |
|
|
|
<div class="popTitle">企业信息</div> |
|
|
|
<div class="popContentTitle">企业名称: |
|
|
|
<span>{{ selInfo.name }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">企业类型: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">周边安全距离: |
|
|
|
<span>{{ selInfo.safeDistance }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">危化品种类: |
|
|
|
<span>{{ selInfo.dangerTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.principalName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.principalMobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">经营地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">备注: |
|
|
|
<span>{{ selInfo.remark }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">人户状况: |
|
|
|
<span>{{ selInfo.rhzkShow }}</span> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='public_service'||selPlaceType==='city_management'||selPlaceType==='superior_resource'"> |
|
|
|
<div class="popTitle">场所信息</div> |
|
|
|
<div class="popContentTitle">场所名称: |
|
|
|
<span>{{ selInfo.name }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所分类: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">占地面积: |
|
|
|
<span>{{ selInfo.areaCovered }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">容纳人数: |
|
|
|
<span>{{ selInfo.capacity }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="div_resi_more"> |
|
|
|
<div @click="toPeople" |
|
|
|
class="span_resi_more">更多</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='dangerous_chemicals'"> |
|
|
|
<div class="popTitle">企业信息</div> |
|
|
|
<div class="popContentTitle">企业名称: |
|
|
|
<span>{{ selInfo.name }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">企业类型: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">周边安全距离: |
|
|
|
<span>{{ selInfo.safeDistance }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">危化品种类: |
|
|
|
<span>{{ selInfo.dangerTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.principalName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.principalMobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">经营地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">备注: |
|
|
|
<span>{{ selInfo.remark }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='public_service'||selPlaceType==='city_management'||selPlaceType==='superior_resource'"> |
|
|
|
<div class="popTitle">场所信息</div> |
|
|
|
<div class="popContentTitle">场所名称: |
|
|
|
<span>{{ selInfo.name }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所分类: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">占地面积: |
|
|
|
<span>{{ selInfo.areaCovered }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">容纳人数: |
|
|
|
<span>{{ selInfo.capacity }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='event'"> |
|
|
|
<div class="popTitle">难点痛点</div> |
|
|
|
<div class="popContentTitle">所属网格: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">发生时间: |
|
|
|
<span>{{ selInfo.happenTime }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">事件内容: |
|
|
|
<span>{{ selInfo.eventContent }}</span> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='event'"> |
|
|
|
<div class="popTitle">难点痛点</div> |
|
|
|
<div class="popContentTitle">所属网格: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">发生时间: |
|
|
|
<span>{{ selInfo.happenTime }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">事件内容: |
|
|
|
<span>{{ selInfo.eventContent }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-if="selInfo.imageList&&selInfo.imageList.length>0" |
|
|
|
class="info-prop"> |
|
|
|
<span>图片:</span> |
|
|
|
<div class="info-pics"> |
|
|
|
<img :src="src" |
|
|
|
:key="src" |
|
|
|
style="width:100px;height:100px;padding-right:10px" |
|
|
|
v-for="src in eventInfo.imageList" |
|
|
|
@click="watchImg(src)" /> |
|
|
|
<div v-if="selInfo.imageList&&selInfo.imageList.length>0" |
|
|
|
class="info-prop"> |
|
|
|
<span>图片:</span> |
|
|
|
<div class="info-pics"> |
|
|
|
<img :src="src" |
|
|
|
:key="src" |
|
|
|
style="width:100px;height:100px;padding-right:10px" |
|
|
|
v-for="src in eventInfo.imageList" |
|
|
|
@click="watchImg(src)" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-if="selInfo.voiceList&&selInfo.voiceList.length>0" |
|
|
|
class="info-prop"> |
|
|
|
<span>音频:</span> |
|
|
|
<div class="info-pics"> |
|
|
|
<audio controls> |
|
|
|
<source :src="item.url" |
|
|
|
type="" |
|
|
|
:key="item.url" |
|
|
|
v-for="item in eventInfo.voiceList" /> |
|
|
|
</audio> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-if="selInfo.voiceList&&selInfo.voiceList.length>0" |
|
|
|
class="info-prop"> |
|
|
|
<span>音频:</span> |
|
|
|
<div class="info-pics"> |
|
|
|
<audio controls> |
|
|
|
<source :src="item.url" |
|
|
|
type="" |
|
|
|
:key="item.url" |
|
|
|
v-for="item in eventInfo.voiceList" /> |
|
|
|
</audio> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="popContentTitle">反映渠道: |
|
|
|
<span>{{ selInfo.sourceTypeName|| "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地址: |
|
|
|
<span>{{ selInfo.address || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">报事人: |
|
|
|
<span>{{selInfo.name || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">手机号: |
|
|
|
<span>{{ selInfo.mobile || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">身份证号: |
|
|
|
<span>{{ selInfo.idCard || "--" }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='community_org'"> |
|
|
|
<div class="popTitle">组织信息</div> |
|
|
|
<div class="popContentTitle">组织名称: |
|
|
|
<span>{{ selInfo.organizationName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织分类: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织人数: |
|
|
|
<span>{{ selInfo.organizationPersonCount }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织成员: |
|
|
|
<span>{{ selInfo.organizationPersonnelShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">服务事项: |
|
|
|
<span>{{ selInfo.serviceItem }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.principalName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.principalPhone }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">创建时间: |
|
|
|
<span>{{ selInfo.organizationCreatedTime }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">反映渠道: |
|
|
|
<span>{{ selInfo.sourceTypeName|| "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地址: |
|
|
|
<span>{{ selInfo.address || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">报事人: |
|
|
|
<span>{{selInfo.name || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">手机号: |
|
|
|
<span>{{ selInfo.mobile || "--" }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">身份证号: |
|
|
|
<span>{{ selInfo.idCard || "--" }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-show="selPlaceType==='group_rent'"> |
|
|
|
<div class="popTitle">房屋信息</div> |
|
|
|
<div class="popContentTitle">房屋名称: |
|
|
|
<span>{{ selInfo.houseName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋类型: |
|
|
|
<span>{{ selInfo.houseTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋用途: |
|
|
|
<span>{{ selInfo.purposeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋状态: |
|
|
|
<span>{{ selInfo.rentName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房主姓名: |
|
|
|
<span>{{ selInfo.ownerName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系方式: |
|
|
|
<span>{{ selInfo.ownerPhone }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房主身份证: |
|
|
|
<span>{{ selInfo.ownerIdCard }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='community_org'"> |
|
|
|
<div class="popTitle">组织信息</div> |
|
|
|
<div class="popContentTitle">组织名称: |
|
|
|
<span>{{ selInfo.organizationName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织分类: |
|
|
|
<span>{{ selInfo.categoryName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织人数: |
|
|
|
<span>{{ selInfo.organizationPersonCount }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">组织成员: |
|
|
|
<span>{{ selInfo.organizationPersonnelShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">服务事项: |
|
|
|
<span>{{ selInfo.serviceItem }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.principalName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.principalPhone }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">创建时间: |
|
|
|
<span>{{ selInfo.organizationCreatedTime }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-show="selPlaceType==='group_rent'"> |
|
|
|
<div class="popTitle">房屋信息</div> |
|
|
|
<div class="popContentTitle">房屋名称: |
|
|
|
<span>{{ selInfo.houseName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋类型: |
|
|
|
<span>{{ selInfo.houseTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋用途: |
|
|
|
<span>{{ selInfo.purposeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房屋状态: |
|
|
|
<span>{{ selInfo.rentName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房主姓名: |
|
|
|
<span>{{ selInfo.ownerName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系方式: |
|
|
|
<span>{{ selInfo.ownerPhone }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">房主身份证: |
|
|
|
<span>{{ selInfo.ownerIdCard }}</span> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='enterprise_patrol'"> |
|
|
|
<div class="popTitle">企事业信息</div> |
|
|
|
<div class="popContentTitle">场所类型: |
|
|
|
<span>{{ selInfo.placeTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所区域: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所名称: |
|
|
|
<span>{{ selInfo.placeOrgName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">规模: |
|
|
|
<span>{{ selInfo.scale }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.personInCharge }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.mobile }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='enterprise_patrol'"> |
|
|
|
<div class="popTitle">企事业信息</div> |
|
|
|
<div class="popContentTitle">场所类型: |
|
|
|
<span>{{ selInfo.placeTypeName }}</span> |
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='party_unit'"> |
|
|
|
<div class="popTitle">联建单位信息</div> |
|
|
|
<div class="popContentTitle">单位名称: |
|
|
|
<span>{{ selInfo.unitName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">分类: |
|
|
|
<span>{{ selInfo.typeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">服务事项: |
|
|
|
<span>{{ selInfo.serviceMatterListShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系人: |
|
|
|
<span>{{ selInfo.contact }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.contactMobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">在职党员: |
|
|
|
<span>{{ selInfo.memberCount }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">备注: |
|
|
|
<span>{{ selInfo.remark }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地理位置: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所区域: |
|
|
|
<span>{{ selInfo.gridName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所名称: |
|
|
|
<span>{{ selInfo.placeOrgName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">场所地址: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">规模: |
|
|
|
<span>{{ selInfo.scale }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">负责人: |
|
|
|
<span>{{ selInfo.personInCharge }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.mobile }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div v-show="selPlaceType==='party_unit'"> |
|
|
|
<div class="popTitle">联建单位信息</div> |
|
|
|
<div class="popContentTitle">单位名称: |
|
|
|
<span>{{ selInfo.unitName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">分类: |
|
|
|
<span>{{ selInfo.typeName }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">服务事项: |
|
|
|
<span>{{ selInfo.serviceMatterListShow }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系人: |
|
|
|
<span>{{ selInfo.contact }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">联系电话: |
|
|
|
<span>{{ selInfo.contactMobile }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">在职党员: |
|
|
|
<span>{{ selInfo.memberCount }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">备注: |
|
|
|
<span>{{ selInfo.remark }}</span> |
|
|
|
</div> |
|
|
|
<div class="popContentTitle">地理位置: |
|
|
|
<span>{{ selInfo.address }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
@ -361,21 +363,6 @@ |
|
|
|
<people v-if="showPeopleInfo" |
|
|
|
:uid="selUserId" |
|
|
|
ref="ref_people"></people> |
|
|
|
|
|
|
|
<!-- <event-info v-if="pageType==='dispose'" |
|
|
|
ref="eleEditForm" |
|
|
|
@handleClose="handleClose" /> --> |
|
|
|
|
|
|
|
<!-- <service-info v-if="pageType==='dispose'" |
|
|
|
ref="eleEditForm" |
|
|
|
@handleClose="handleClose" /> --> |
|
|
|
<!-- <fuwu-info v-if="pageType==='dispose'" |
|
|
|
ref="eleEditForm" |
|
|
|
@handleClose="handleClose" /> --> |
|
|
|
<qsydw v-if="pageType==='dispose'" |
|
|
|
ref="eleEditForm" |
|
|
|
@handleClose="handleClose" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</template> |
|
|
@ -407,24 +394,130 @@ import cptTb from "@/views/modules/visual/cpts/tb"; |
|
|
|
import cptCard from "@/views/modules/visual/cpts/card"; |
|
|
|
import ScreenLoading from "@/views/modules/visual/cpts/loading"; |
|
|
|
import People from "../../basicinfo/people"; |
|
|
|
import eventInfo from "./eventInfo"; |
|
|
|
import serviceInfo from "./serviceInfo"; |
|
|
|
import fuwuInfo from "./fuwuInfo"; |
|
|
|
import qsydw from "./qsydw"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var centerPointGlobal = [120.664619, 36.504963] |
|
|
|
|
|
|
|
let loading;//加载动画 |
|
|
|
|
|
|
|
|
|
|
|
let map; |
|
|
|
let mapView; |
|
|
|
let gaodeMapLayer;//背景地图图层 |
|
|
|
let parentLayer;//上级组织图层 |
|
|
|
let parentSource;//上级组织多边形 |
|
|
|
let polygonLayer;//标注图层 |
|
|
|
let iconLayer; // icon标注图层 |
|
|
|
let iconSource; // icon |
|
|
|
let polygonSource;//标注多边形 |
|
|
|
let select;//选中标注 |
|
|
|
|
|
|
|
let xoffset = 0 |
|
|
|
let yoffset = 0 |
|
|
|
|
|
|
|
|
|
|
|
//url图标 |
|
|
|
|
|
|
|
let iconUrlArray = [ |
|
|
|
'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a219130b6bc74b0b80b5ddb0fce0892a.png', |
|
|
|
'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/a775d15e62374350b80e5cdf1912a4eb.png', |
|
|
|
'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/20211116/884efcf6d6b44224a7fda599dd1b14cb.png' |
|
|
|
]; |
|
|
|
let textColorArray = [ |
|
|
|
'rgba(236, 69, 4, 0.66)', |
|
|
|
'rgba(0, 146, 238, 0.75)', |
|
|
|
'rgba(238, 151, 0, 0.8)' |
|
|
|
]; |
|
|
|
let polygonColorArray = [ |
|
|
|
'rgba(210, 2, 2, 0.24)', |
|
|
|
'rgba(43, 231, 253, 0.25)', |
|
|
|
'rgba(183, 185, 0, 0.16)' |
|
|
|
]; |
|
|
|
//标注的文字样式 |
|
|
|
var createTextStyle = function (feature) { |
|
|
|
return new Text({ |
|
|
|
textAlign: undefined, |
|
|
|
font: "18px Arial", |
|
|
|
//fontFamily: "Courier New, monospace", |
|
|
|
// fontWeight: "bold", |
|
|
|
text: feature.values_.name, |
|
|
|
backgroundFill: new Fill({ |
|
|
|
// color: 'rgba(0, 146, 238, 0.75)' |
|
|
|
color: textColorArray[feature.values_.colorIndex] |
|
|
|
}), |
|
|
|
padding: [4, 10, 4, 10], |
|
|
|
//text: "名称", |
|
|
|
fill: new Fill({ color: "#ffffff" }), |
|
|
|
// stroke: new Stroke({ color: "#ffffff", width: 3 }), |
|
|
|
offsetY: -30, |
|
|
|
offsetX: -50, |
|
|
|
overflow: true, |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
//上级组织标注样式 |
|
|
|
var parentStyleFunction = (function () { |
|
|
|
return function (feature) { |
|
|
|
return new Style({ |
|
|
|
// fill: new Fill({ |
|
|
|
// color: [255, 255, 255, 0.3] |
|
|
|
// }), |
|
|
|
stroke: new Stroke({ |
|
|
|
color: [0, 103, 182, 1], |
|
|
|
width: 2 |
|
|
|
}), |
|
|
|
|
|
|
|
// text: createTextStyle(feature) |
|
|
|
});; |
|
|
|
}; |
|
|
|
})() |
|
|
|
|
|
|
|
|
|
|
|
//标注样式 |
|
|
|
var polygonStyleFunction = (function () { |
|
|
|
return function (feature) { |
|
|
|
return new Style({ |
|
|
|
fill: new Fill({ |
|
|
|
// color: [255, 255, 255, 0.3] |
|
|
|
color: polygonColorArray[feature.values_.colorIndex] |
|
|
|
}), |
|
|
|
stroke: new Stroke({ |
|
|
|
color: polygonColorArray[feature.values_.colorIndex], |
|
|
|
width: 3 |
|
|
|
}), |
|
|
|
|
|
|
|
text: createTextStyle(feature) |
|
|
|
});; |
|
|
|
}; |
|
|
|
})() |
|
|
|
|
|
|
|
//定义颜色转换方法 |
|
|
|
let reverseFunc = function (pixelsTemp) { |
|
|
|
//蓝色 |
|
|
|
for (var i = 0; i < pixelsTemp.length; i += 4) { |
|
|
|
var r = pixelsTemp[i]; |
|
|
|
var g = pixelsTemp[i + 1]; |
|
|
|
var b = pixelsTemp[i + 2]; |
|
|
|
//运用图像学公式,设置灰度值 |
|
|
|
var grey = r * 0.3 + g * 0.59 + b * 0.11; |
|
|
|
//将rgb的值替换为灰度值 |
|
|
|
pixelsTemp[i] = grey; |
|
|
|
pixelsTemp[i + 1] = grey; |
|
|
|
pixelsTemp[i + 2] = grey; |
|
|
|
|
|
|
|
//基于灰色,设置为蓝色,这几个数值是我自己试出来的,可以根据需求调整 |
|
|
|
pixelsTemp[i] = 55 - pixelsTemp[i]; |
|
|
|
pixelsTemp[i + 1] = 255 - pixelsTemp[i + 1]; |
|
|
|
pixelsTemp[i + 2] = 305 - pixelsTemp[i + 2]; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const vueGis = { |
|
|
|
name: 'HomeMap', |
|
|
|
data () { |
|
|
|
return { |
|
|
|
centerPoint: [],//中心点位置 |
|
|
|
zoom: 14,//缩放范围:区14 |
|
|
|
minZoom: 1,//最小缩放 |
|
|
|
|
|
|
|
orgData: {},//当前组织对象 |
|
|
|
orgId: '', |
|
|
@ -582,16 +675,41 @@ const vueGis = { |
|
|
|
selPlaceType: '', |
|
|
|
selInfo: {}, |
|
|
|
selUserId: '', |
|
|
|
showPeopleInfo: false, |
|
|
|
|
|
|
|
pageType: '', |
|
|
|
eventId: '1542065054671142914', |
|
|
|
eventDetailData: {}, |
|
|
|
showPeopleInfo: false |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
async mounted () { |
|
|
|
|
|
|
|
//加载组织数据 |
|
|
|
await this.loadOrgData() |
|
|
|
|
|
|
|
//初始化地图 |
|
|
|
this.initMap() |
|
|
|
|
|
|
|
await nextTick(300) |
|
|
|
this.addParentLayer() |
|
|
|
this.loadParentPolygon() |
|
|
|
//添加标注图层 |
|
|
|
this.addPolygonLayer() |
|
|
|
|
|
|
|
//添加icontuceng |
|
|
|
this.addIconLayer() |
|
|
|
|
|
|
|
//加载当前园区的标注 |
|
|
|
this.loadPolygon(this.subAgencyArray) |
|
|
|
|
|
|
|
|
|
|
|
this.setMapLocation() |
|
|
|
await this.loadCategoryList() |
|
|
|
this.getTable(); |
|
|
|
await this.getMapTable(); |
|
|
|
|
|
|
|
|
|
|
|
//初始化icon图层 |
|
|
|
this.addOverlay() |
|
|
|
|
|
|
|
this.addMapClick() |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
@ -1036,18 +1154,11 @@ const vueGis = { |
|
|
|
this.getTable(); |
|
|
|
this.getMapTable(); |
|
|
|
}, |
|
|
|
// handleSearch () { |
|
|
|
// this.demand.pageNo = 1 |
|
|
|
// this.getTable(); |
|
|
|
// this.getMapTable(); |
|
|
|
// }, |
|
|
|
handleSearch () { |
|
|
|
this.pageType = "dispose"; |
|
|
|
}, |
|
|
|
handleClose () { |
|
|
|
this.pageType = ""; |
|
|
|
this.demand.pageNo = 1 |
|
|
|
this.getTable(); |
|
|
|
this.getMapTable(); |
|
|
|
}, |
|
|
|
|
|
|
|
// |
|
|
|
handleClickRow (index) { |
|
|
|
let selData = this.tableList[index] |
|
|
@ -1727,7 +1838,7 @@ const vueGis = { |
|
|
|
...mapGetters(["clientHeight"]) |
|
|
|
|
|
|
|
}, |
|
|
|
components: { cptTb, cptCard, ScreenLoading, People, eventInfo, serviceInfo, fuwuInfo, qsydw }, |
|
|
|
components: { cptTb, cptCard, ScreenLoading, People }, |
|
|
|
} |
|
|
|
export default vueGis; |
|
|
|
</script> |
|
|
|