Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua
commit
3d83ec988d
|
|
@ -22,41 +22,55 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="图斑编号">{{ case_no }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{ typename }}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{ countyname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{ streetname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{ communityname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑编号">{{
|
||||
props.showInfoData.case_no
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{
|
||||
props.showInfoData.typename
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{
|
||||
props.showInfoData.countyname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{
|
||||
props.showInfoData.streetname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{
|
||||
props.showInfoData.communityname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑面积(亩)">{{
|
||||
dataProcessing(area)
|
||||
dataProcessing(props.showInfoData.area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="农用地面积(亩)">{{
|
||||
dataProcessing(nongyongdi_area)
|
||||
}}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="耕地面积(亩)">{{
|
||||
dataProcessing(gengdi_area)
|
||||
dataProcessing(props.showInfoData.gengdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永农面积(亩)">{{
|
||||
dataProcessing(yongjiujibennongtian_area)
|
||||
dataProcessing(props.showInfoData.yongjiujibennongtian_area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="占重点区域面积(亩)">{{ dataProcessing(zhongdianquyu_area) }}</a-descriptions-item> -->
|
||||
<!-- <a-descriptions-item label="占生态红线面积(亩)">{{
|
||||
dataProcessing(shengtaibaohuhongxian_area)
|
||||
}}</a-descriptions-item> -->
|
||||
<!-- <a-descriptions-item label="占空间规划面积(亩)">{{ dataProcessing(guotukongjianguihua_area) }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="图斑描述">{{ case_description }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{
|
||||
props.showInfoData.case_description
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="图斑地址">{{ address }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="备注">{{ remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{ synchronoustime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ props.showInfoData.remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ props.showInfoData.lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ props.showInfoData.lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{
|
||||
props.showInfoData.synchronoustime
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -71,13 +85,17 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{ jieshou_people }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{ jieshou_time?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{
|
||||
props.showInfoData.jieshou_people
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{
|
||||
props.showInfoData.jieshou_time?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
v-if="!['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="线索填报"
|
||||
force-render
|
||||
>
|
||||
|
|
@ -91,28 +109,28 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="判定结果">{{
|
||||
getLabel('is_illegal', is_illegal)
|
||||
getLabel('is_illegal', props.showInfoData.is_illegal)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目名称">{{
|
||||
xiangmumc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目名称">{{
|
||||
props.showInfoData.xiangmumc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目主体">{{
|
||||
xiangmuzhuti
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目主体">{{
|
||||
props.showInfoData.xiangmuzhuti
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="实际用途">{{
|
||||
actual_use_to
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="实际用途">{{
|
||||
props.showInfoData.actual_use_to
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', weifaleixing)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', props.showInfoData.weifaleixing)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -126,14 +144,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in hefafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -147,17 +165,17 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', qita_use_to)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', props.showInfoData.qita_use_to)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in qitafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -172,39 +190,47 @@
|
|||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="判定依据说明">{{
|
||||
pandingyijushuoming
|
||||
props.showInfoData.pandingyijushuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{
|
||||
props.showInfoData.examiner_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{
|
||||
props.showInfoData.examine_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="3"
|
||||
tab="整改情况"
|
||||
v-if="is_illegal == 1 && weifaleixing == 0 && !['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="
|
||||
props.showInfoData.is_illegal == 1 &&
|
||||
props.showInfoData.weifaleixing == 0 &&
|
||||
!['建设用地', '推堆土'].includes(props.showInfoData.typename)
|
||||
"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -216,16 +242,16 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="整改措施">{{
|
||||
getLabel('measure_name', measure_name)
|
||||
getLabel('measure_name', props.showInfoData.measure_name)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in yanshoubiaoList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -239,13 +265,13 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template
|
||||
v-for="(imageItem, imageIndex) in chaichufugenghoupicList"
|
||||
:key="imageIndex"
|
||||
|
|
@ -263,14 +289,14 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in zhenggaifujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -284,13 +310,13 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in bubanzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -305,11 +331,19 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{ transactor_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{ transact_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{
|
||||
props.showInfoData.transactor_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{
|
||||
props.showInfoData.transact_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" v-if="!['建设用地', '推堆土'].includes(typename)" tab="区县审核">
|
||||
<a-tab-pane
|
||||
key="4"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="区县审核"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
bordered
|
||||
|
|
@ -319,11 +353,19 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.verifyuser
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.verifytime
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" v-if="!['建设用地', '推堆土'].includes(typename)" tab="市局审核">
|
||||
<a-tab-pane
|
||||
key="5"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="市局审核"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
bordered
|
||||
|
|
@ -333,15 +375,19 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核人">{{ hexiaoren }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ hexiaotime?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="weifaleixing == 0" label="无人机复飞照片">
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.hexiaoren
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.hexiaotime?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="props.showInfoData.weifaleixing == 0" label="无人机复飞照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in wrjffzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -385,167 +431,59 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref, computed,onBeforeMount } from 'vue';
|
||||
import { defineProps, ref, computed, onBeforeMount, watch } from 'vue';
|
||||
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
|
||||
import { getConfig } from '@/api/sys/layerManagement';
|
||||
import { getGeom } from '@/api/sys/layerManagement';
|
||||
import {getLoadCaseImgList} from '@/api/tiankongdi'
|
||||
import { getLoadCaseImgList } from '@/api/tiankongdi';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import axios from 'axios';
|
||||
const { createMessage } = useMessage();
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
import {
|
||||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
measureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
illegalTypeList,
|
||||
resultOptions,
|
||||
qitaUseTOOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
console.log('');
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
watch(
|
||||
() => props.showInfoData,
|
||||
() => {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
},
|
||||
);
|
||||
|
||||
const props = defineProps(['showInfoData']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
||||
const geomsList = ref();
|
||||
const {
|
||||
id,
|
||||
case_no,
|
||||
case_name,
|
||||
case_description,
|
||||
start_time,
|
||||
end_time,
|
||||
address,
|
||||
lng,
|
||||
lat,
|
||||
typeid,
|
||||
typename,
|
||||
handle_status_id,
|
||||
handle_status_name,
|
||||
case_status_i,
|
||||
case_status_name,
|
||||
createtime,
|
||||
createuser,
|
||||
drone_no,
|
||||
deal_userid,
|
||||
deal_username,
|
||||
createusername,
|
||||
is_delete,
|
||||
countyid,
|
||||
countyname,
|
||||
streetid,
|
||||
streetname,
|
||||
communityid,
|
||||
communityname,
|
||||
remark,
|
||||
is_closed,
|
||||
area,
|
||||
is_illegal,
|
||||
close_user,
|
||||
close_time,
|
||||
identification_user,
|
||||
identification_time,
|
||||
is_intact,
|
||||
close_userid,
|
||||
identification_userid,
|
||||
verifyuserid,
|
||||
verifyuser,
|
||||
verifytime,
|
||||
is_improve,
|
||||
improve_reason,
|
||||
is_dispense,
|
||||
dispense_userid,
|
||||
dispense_time,
|
||||
dispense_username,
|
||||
verifystatus,
|
||||
verifystatusname,
|
||||
is_checked,
|
||||
deal_time,
|
||||
is_drawback,
|
||||
examiner_id,
|
||||
examiner_name,
|
||||
examine_time,
|
||||
measure_name,
|
||||
casepic,
|
||||
opinion,
|
||||
result,
|
||||
result_name,
|
||||
opinion_name,
|
||||
handletime,
|
||||
handleuser,
|
||||
handleusername,
|
||||
is_assist,
|
||||
measure_name_deal,
|
||||
qita_use_to,
|
||||
illegal_contact,
|
||||
illegal_shenfenzhenghao,
|
||||
investigation_type,
|
||||
investigation_result,
|
||||
registr_number,
|
||||
is_build_complete,
|
||||
actual_use_to,
|
||||
transactor_id,
|
||||
transactor_name,
|
||||
transact_time,
|
||||
geomid,
|
||||
nongyongdi_area,
|
||||
gengdi_area,
|
||||
yongjiujibennongtian_area,
|
||||
zhongdianquyu_area,
|
||||
shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area,
|
||||
fujian,
|
||||
hefafujian,
|
||||
qitafujian,
|
||||
jieshou_people,
|
||||
jieshou_time,
|
||||
pandingyijushuoming,
|
||||
xiangmumc,
|
||||
xiangmuzhuti,
|
||||
weifaleixing,
|
||||
yanshoubiao,
|
||||
zhenggaifujian,
|
||||
chaichufugenghoupic,
|
||||
bubanzhaopian,
|
||||
is_jieshou,
|
||||
anjianzhaopian,
|
||||
hexiaoren,
|
||||
hexiaotime,
|
||||
wrjffzhaopian,
|
||||
xchczhaopian,
|
||||
synchronoustime,
|
||||
} = props.showInfoData;
|
||||
|
||||
const imageList = ref([])
|
||||
async function getCaseImgList(){
|
||||
|
||||
imageList.value = await getLoadCaseImgList({caseid:id,category:'耕地非粮化'});
|
||||
|
||||
|
||||
const imageList = ref([]);
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({
|
||||
caseid: props.showInfoData.id,
|
||||
category: '耕地非粮化',
|
||||
});
|
||||
|
||||
// 匹配去除无效图片
|
||||
let zhengshiImageList = [];
|
||||
imageList.value?.forEach((item,index)=>{
|
||||
let obj = anjianzhaopianList.value?.find((it,idx)=>{
|
||||
imageList.value?.forEach((item, index) => {
|
||||
let obj = anjianzhaopianList.value?.find((it, idx) => {
|
||||
return item.filePath == it;
|
||||
})
|
||||
if(obj){
|
||||
});
|
||||
if (obj) {
|
||||
zhengshiImageList.push(imageList.value[index]);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
// console.log("imageList",imageList.value);
|
||||
// console.log("anjianzhaopianList",anjianzhaopianList.value);
|
||||
|
|
@ -554,82 +492,76 @@
|
|||
MapboxComponent.value.handlerLoadPictureAzimuth(zhengshiImageList);
|
||||
}
|
||||
|
||||
function handlerPreviewImage(index,url){
|
||||
|
||||
function handlerPreviewImage(index, url) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const match = url.match(regex);
|
||||
if (match) {
|
||||
MapboxComponent.value.handlerCurrentImageChange(match[1]);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const isInitImageLisener = ref<Boolean>(false);
|
||||
// 监听预览图片地址变化进行箭头切换
|
||||
function handlerImageChange(e):void{
|
||||
if(e && !isInitImageLisener.value){
|
||||
setTimeout(function(){
|
||||
function handlerImageChange(e): void {
|
||||
if (e && !isInitImageLisener.value) {
|
||||
setTimeout(function () {
|
||||
const targetNode = document.getElementsByClassName('ant-image-preview-img');
|
||||
// 创建一个观察器实例，并传入回调函数
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if(targetNode[0].getAttribute(mutation.attributeName).match("http")){
|
||||
handlerPreviewImage(0,targetNode[0].getAttribute(mutation.attributeName))
|
||||
}
|
||||
}
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if (targetNode[0].getAttribute(mutation.attributeName).match('http')) {
|
||||
handlerPreviewImage(0, targetNode[0].getAttribute(mutation.attributeName));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// 配置观察选项
|
||||
const config = { attributes: true };
|
||||
// 开始观察目标节点
|
||||
observer.observe(targetNode[0], config);
|
||||
isInitImageLisener.value = true;
|
||||
},250)
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(()=>{
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
const anjianzhaopianList = computed(() => {
|
||||
getCaseImgList();
|
||||
return anjianzhaopian ? anjianzhaopian.split(',') : [];
|
||||
return props.showInfoData.anjianzhaopian ? props.showInfoData.anjianzhaopian.split(',') : [];
|
||||
});
|
||||
const casepicList = computed(() => {
|
||||
return casepic ? casepic.split(',') : [];
|
||||
return props.showInfoData.casepic ? props.showInfoData.casepic.split(',') : [];
|
||||
});
|
||||
const chaichufugenghoupicList = computed(() => {
|
||||
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
|
||||
return props.showInfoData.chaichufugenghoupic
|
||||
? props.showInfoData.chaichufugenghoupic.split(',')
|
||||
: [];
|
||||
});
|
||||
const bubanzhaopianList = computed(() => {
|
||||
return bubanzhaopian ? bubanzhaopian.split(',') : [];
|
||||
return props.showInfoData.bubanzhaopian ? props.showInfoData.bubanzhaopian.split(',') : [];
|
||||
});
|
||||
const fujianList = computed(() => {
|
||||
return fujian ? fujian.split(',') : [];
|
||||
return props.showInfoData.fujian ? props.showInfoData.fujian.split(',') : [];
|
||||
});
|
||||
const hefafujianList = computed(() => {
|
||||
return hefafujian ? hefafujian.split(',') : [];
|
||||
return props.showInfoData.hefafujian ? props.showInfoData.hefafujian.split(',') : [];
|
||||
});
|
||||
const qitafujianList = computed(() => {
|
||||
return qitafujian ? qitafujian.split(',') : [];
|
||||
return props.showInfoData.qitafujian ? props.showInfoData.qitafujian.split(',') : [];
|
||||
});
|
||||
const zhenggaifujianList = computed(() => {
|
||||
return zhenggaifujian ? zhenggaifujian.split(',') : [];
|
||||
return props.showInfoData.zhenggaifujian ? props.showInfoData.zhenggaifujian.split(',') : [];
|
||||
});
|
||||
const yanshoubiaoList = computed(() => {
|
||||
return yanshoubiao ? yanshoubiao.split(',') : [];
|
||||
return props.showInfoData.yanshoubiao ? props.showInfoData.yanshoubiao.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return wrjffzhaopian ? wrjffzhaopian.split(',') : [];
|
||||
return props.showInfoData.wrjffzhaopian ? props.showInfoData.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
const xchczhaopianList = computed(() => {
|
||||
return xchczhaopian ? xchczhaopian.split(',') : [];
|
||||
return props.showInfoData.xchczhaopian ? props.showInfoData.xchczhaopian.split(',') : [];
|
||||
});
|
||||
|
||||
function onMapboxLoad() {
|
||||
|
|
@ -672,8 +604,6 @@
|
|||
key: null,
|
||||
};
|
||||
if (props.showInfoData.geomid) {
|
||||
|
||||
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
|
|
@ -699,27 +629,26 @@
|
|||
}
|
||||
}
|
||||
const downLoadFile = (url) => {
|
||||
if(url.indexOf('.pdf') !== -1){
|
||||
if (url.indexOf('.pdf') !== -1) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/${url}`,
|
||||
responseType: 'blob',
|
||||
headers: {
|
||||
'Content-Disposition': 'inline',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(response => {
|
||||
let blob = new Blob([response.data], {type: 'application/pdf'});
|
||||
let url = window.URL.createObjectURL(blob)
|
||||
window.open(url);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}else{
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
.then((response) => {
|
||||
let blob = new Blob([response.data], { type: 'application/pdf' });
|
||||
let url = window.URL.createObjectURL(blob);
|
||||
window.open(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
} else {
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
}
|
||||
|
||||
};
|
||||
const getContainer = () => {
|
||||
return document.getElementById('info-container');
|
||||
|
|
@ -739,12 +668,12 @@
|
|||
}
|
||||
};
|
||||
const showImage = (url) => {
|
||||
if(url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1 ){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
if (url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -772,14 +701,14 @@
|
|||
height: calc(100vh - 100px);
|
||||
margin-right: 20px;
|
||||
}
|
||||
:deep(.ant-image){
|
||||
:deep(.ant-image) {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-left){
|
||||
:deep(.ant-image-preview-switch-left) {
|
||||
position: absolute;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-right){
|
||||
:deep(.ant-image-preview-switch-right) {
|
||||
position: absolute;
|
||||
}
|
||||
.info-container {
|
||||
|
|
@ -799,14 +728,14 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
.ant-image-preview-operations-operation{
|
||||
.ant-image-preview-operations-operation {
|
||||
// flex:1;
|
||||
}
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(1){
|
||||
.ant-image-preview-operations-operation:nth-last-child(1) {
|
||||
display: none;
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2){
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,41 +22,55 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="图斑编号">{{ case_no }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{ typename }}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{ countyname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{ streetname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{ communityname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑编号">{{
|
||||
props.showInfoData.case_no
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{
|
||||
props.showInfoData.typename
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{
|
||||
props.showInfoData.countyname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{
|
||||
props.showInfoData.streetname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{
|
||||
props.showInfoData.communityname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑面积(亩)">{{
|
||||
dataProcessing(area)
|
||||
dataProcessing(props.showInfoData.area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="农用地面积(亩)">{{
|
||||
dataProcessing(nongyongdi_area)
|
||||
dataProcessing(props.showInfoData.nongyongdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="耕地面积(亩)">{{
|
||||
dataProcessing(gengdi_area)
|
||||
dataProcessing(props.showInfoData.gengdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永农面积(亩)">{{
|
||||
dataProcessing(yongjiujibennongtian_area)
|
||||
dataProcessing(props.showInfoData.yongjiujibennongtian_area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="占重点区域面积(亩)">{{ dataProcessing(zhongdianquyu_area) }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="占生态红线面积(亩)">{{
|
||||
dataProcessing(shengtaibaohuhongxian_area)
|
||||
dataProcessing(props.showInfoData.shengtaibaohuhongxian_area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="占空间规划面积(亩)">{{ dataProcessing(guotukongjianguihua_area) }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="图斑描述">{{ case_description }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{
|
||||
props.showInfoData.case_description
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="图斑地址">{{ address }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="备注">{{ remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{ synchronoustime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ props.showInfoData.remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ props.showInfoData.lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ props.showInfoData.lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{
|
||||
props.showInfoData.synchronoustime
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -71,13 +85,17 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{ jieshou_people }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{ jieshou_time?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{
|
||||
props.showInfoData.jieshou_people
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{
|
||||
props.showInfoData.jieshou_time?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
v-if="!['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="线索填报"
|
||||
force-render
|
||||
>
|
||||
|
|
@ -91,28 +109,28 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="判定结果">{{
|
||||
getLabel('is_illegal', is_illegal)
|
||||
getLabel('is_illegal', props.showInfoData.is_illegal)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目名称">{{
|
||||
xiangmumc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目名称">{{
|
||||
props.showInfoData.xiangmumc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目主体">{{
|
||||
xiangmuzhuti
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目主体">{{
|
||||
props.showInfoData.xiangmuzhuti
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="实际用途">{{
|
||||
actual_use_to
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="实际用途">{{
|
||||
props.showInfoData.actual_use_to
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', weifaleixing)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', props.showInfoData.weifaleixing)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -126,14 +144,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in hefafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -147,17 +165,17 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="实际用途">{{
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', qita_use_to)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in qitafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -172,39 +190,47 @@
|
|||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="判定依据说明">{{
|
||||
pandingyijushuoming
|
||||
props.showInfoData.pandingyijushuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{
|
||||
props.showInfoData.examiner_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{
|
||||
props.showInfoData.examine_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="3"
|
||||
tab="整改情况"
|
||||
v-if="is_illegal == 1 && weifaleixing == 0 && !['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="
|
||||
props.showInfoData.is_illegal == 1 &&
|
||||
props.showInfoData.weifaleixing == 0 &&
|
||||
!['建设用地', '推堆土'].includes(props.showInfoData.typename)
|
||||
"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -216,16 +242,16 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="整改措施">{{
|
||||
getLabel('measure_name', measure_name)
|
||||
getLabel('measure_name', props.showInfoData.measure_name)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in yanshoubiaoList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -239,13 +265,13 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template
|
||||
v-for="(imageItem, imageIndex) in chaichufugenghoupicList"
|
||||
:key="imageIndex"
|
||||
|
|
@ -263,14 +289,14 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in zhenggaifujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -284,13 +310,13 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in bubanzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -305,11 +331,19 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{ transactor_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{ transact_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{
|
||||
props.showInfoData.transactor_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{
|
||||
props.showInfoData.transact_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" v-if="!['建设用地', '推堆土'].includes(typename)" tab="区县审核">
|
||||
<a-tab-pane
|
||||
key="4"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="区县审核"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
bordered
|
||||
|
|
@ -319,11 +353,19 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.verifyuser
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.verifytime
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" v-if="!['建设用地', '推堆土'].includes(typename)" tab="市局审核">
|
||||
<a-tab-pane
|
||||
key="5"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="市局审核"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
bordered
|
||||
|
|
@ -333,15 +375,19 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核人">{{ hexiaoren }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ hexiaotime?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="weifaleixing == 0" label="无人机复飞照片">
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.hexiaoren
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.hexiaotime?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="props.showInfoData.weifaleixing == 0" label="无人机复飞照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in wrjffzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -385,167 +431,58 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref, computed,onBeforeMount } from 'vue';
|
||||
import { defineProps, ref, computed, onBeforeMount, watch } from 'vue';
|
||||
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
|
||||
import { getConfig } from '@/api/sys/layerManagement';
|
||||
import { getGeom } from '@/api/sys/layerManagement';
|
||||
import {getLoadCaseImgList} from '@/api/tiankongdi'
|
||||
import { getLoadCaseImgList } from '@/api/tiankongdi';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import axios from 'axios';
|
||||
const { createMessage } = useMessage();
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
import {
|
||||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
measureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
illegalTypeList,
|
||||
resultOptions,
|
||||
qitaUseTOOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
console.log('');
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
watch(
|
||||
() => props.showInfoData,
|
||||
() => {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
},
|
||||
);
|
||||
|
||||
const props = defineProps(['showInfoData']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
||||
const geomsList = ref();
|
||||
const {
|
||||
id,
|
||||
case_no,
|
||||
case_name,
|
||||
case_description,
|
||||
start_time,
|
||||
end_time,
|
||||
address,
|
||||
lng,
|
||||
lat,
|
||||
typeid,
|
||||
typename,
|
||||
handle_status_id,
|
||||
handle_status_name,
|
||||
case_status_i,
|
||||
case_status_name,
|
||||
createtime,
|
||||
createuser,
|
||||
drone_no,
|
||||
deal_userid,
|
||||
deal_username,
|
||||
createusername,
|
||||
is_delete,
|
||||
countyid,
|
||||
countyname,
|
||||
streetid,
|
||||
streetname,
|
||||
communityid,
|
||||
communityname,
|
||||
remark,
|
||||
is_closed,
|
||||
area,
|
||||
is_illegal,
|
||||
close_user,
|
||||
close_time,
|
||||
identification_user,
|
||||
identification_time,
|
||||
is_intact,
|
||||
close_userid,
|
||||
identification_userid,
|
||||
verifyuserid,
|
||||
verifyuser,
|
||||
verifytime,
|
||||
is_improve,
|
||||
improve_reason,
|
||||
is_dispense,
|
||||
dispense_userid,
|
||||
dispense_time,
|
||||
dispense_username,
|
||||
verifystatus,
|
||||
verifystatusname,
|
||||
is_checked,
|
||||
deal_time,
|
||||
is_drawback,
|
||||
examiner_id,
|
||||
examiner_name,
|
||||
examine_time,
|
||||
measure_name,
|
||||
casepic,
|
||||
opinion,
|
||||
result,
|
||||
result_name,
|
||||
opinion_name,
|
||||
handletime,
|
||||
handleuser,
|
||||
handleusername,
|
||||
is_assist,
|
||||
measure_name_deal,
|
||||
qita_use_to,
|
||||
illegal_contact,
|
||||
illegal_shenfenzhenghao,
|
||||
investigation_type,
|
||||
investigation_result,
|
||||
registr_number,
|
||||
is_build_complete,
|
||||
actual_use_to,
|
||||
transactor_id,
|
||||
transactor_name,
|
||||
transact_time,
|
||||
geomid,
|
||||
nongyongdi_area,
|
||||
gengdi_area,
|
||||
yongjiujibennongtian_area,
|
||||
zhongdianquyu_area,
|
||||
shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area,
|
||||
fujian,
|
||||
hefafujian,
|
||||
qitafujian,
|
||||
jieshou_people,
|
||||
jieshou_time,
|
||||
pandingyijushuoming,
|
||||
xiangmumc,
|
||||
xiangmuzhuti,
|
||||
weifaleixing,
|
||||
yanshoubiao,
|
||||
zhenggaifujian,
|
||||
chaichufugenghoupic,
|
||||
bubanzhaopian,
|
||||
is_jieshou,
|
||||
anjianzhaopian,
|
||||
hexiaoren,
|
||||
hexiaotime,
|
||||
wrjffzhaopian,
|
||||
xchczhaopian,
|
||||
synchronoustime,
|
||||
} = props.showInfoData;
|
||||
|
||||
const imageList = ref([])
|
||||
async function getCaseImgList(){
|
||||
|
||||
imageList.value = await getLoadCaseImgList({caseid:id, category:'非法采矿卫片下发'});
|
||||
|
||||
|
||||
const imageList = ref([]);
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({
|
||||
caseid: props.showInfoData.id,
|
||||
category: '非法采矿卫片下发',
|
||||
});
|
||||
|
||||
// 匹配去除无效图片
|
||||
let zhengshiImageList = [];
|
||||
imageList.value?.forEach((item,index)=>{
|
||||
let obj = anjianzhaopianList.value?.find((it,idx)=>{
|
||||
imageList.value?.forEach((item, index) => {
|
||||
let obj = anjianzhaopianList.value?.find((it, idx) => {
|
||||
return item.filePath == it;
|
||||
})
|
||||
if(obj){
|
||||
});
|
||||
if (obj) {
|
||||
zhengshiImageList.push(imageList.value[index]);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
// console.log("imageList",imageList.value);
|
||||
// console.log("anjianzhaopianList",anjianzhaopianList.value);
|
||||
|
|
@ -554,82 +491,76 @@
|
|||
MapboxComponent.value.handlerLoadPictureAzimuth(zhengshiImageList);
|
||||
}
|
||||
|
||||
function handlerPreviewImage(index,url){
|
||||
|
||||
function handlerPreviewImage(index, url) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const match = url.match(regex);
|
||||
if (match) {
|
||||
MapboxComponent.value.handlerCurrentImageChange(match[1]);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const isInitImageLisener = ref<Boolean>(false);
|
||||
// 监听预览图片地址变化进行箭头切换
|
||||
function handlerImageChange(e):void{
|
||||
if(e && !isInitImageLisener.value){
|
||||
setTimeout(function(){
|
||||
function handlerImageChange(e): void {
|
||||
if (e && !isInitImageLisener.value) {
|
||||
setTimeout(function () {
|
||||
const targetNode = document.getElementsByClassName('ant-image-preview-img');
|
||||
// 创建一个观察器实例，并传入回调函数
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if(targetNode[0].getAttribute(mutation.attributeName).match("http")){
|
||||
handlerPreviewImage(0,targetNode[0].getAttribute(mutation.attributeName))
|
||||
}
|
||||
}
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if (targetNode[0].getAttribute(mutation.attributeName).match('http')) {
|
||||
handlerPreviewImage(0, targetNode[0].getAttribute(mutation.attributeName));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// 配置观察选项
|
||||
const config = { attributes: true };
|
||||
// 开始观察目标节点
|
||||
observer.observe(targetNode[0], config);
|
||||
isInitImageLisener.value = true;
|
||||
},250)
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(()=>{
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
const anjianzhaopianList = computed(() => {
|
||||
getCaseImgList();
|
||||
return anjianzhaopian ? anjianzhaopian.split(',') : [];
|
||||
return props.showInfoData.anjianzhaopian ? props.showInfoData.anjianzhaopian.split(',') : [];
|
||||
});
|
||||
const casepicList = computed(() => {
|
||||
return casepic ? casepic.split(',') : [];
|
||||
return props.showInfoData.casepic ? props.showInfoData.casepic.split(',') : [];
|
||||
});
|
||||
const chaichufugenghoupicList = computed(() => {
|
||||
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
|
||||
return props.showInfoData.chaichufugenghoupic
|
||||
? props.showInfoData.chaichufugenghoupic.split(',')
|
||||
: [];
|
||||
});
|
||||
const bubanzhaopianList = computed(() => {
|
||||
return bubanzhaopian ? bubanzhaopian.split(',') : [];
|
||||
return props.showInfoData.bubanzhaopian ? props.showInfoData.bubanzhaopian.split(',') : [];
|
||||
});
|
||||
const fujianList = computed(() => {
|
||||
return fujian ? fujian.split(',') : [];
|
||||
return props.showInfoData.fujian ? props.showInfoData.fujian.split(',') : [];
|
||||
});
|
||||
const hefafujianList = computed(() => {
|
||||
return hefafujian ? hefafujian.split(',') : [];
|
||||
return props.showInfoData.hefafujian ? props.showInfoData.hefafujian.split(',') : [];
|
||||
});
|
||||
const qitafujianList = computed(() => {
|
||||
return qitafujian ? qitafujian.split(',') : [];
|
||||
return props.showInfoData.qitafujian ? props.showInfoData.qitafujian.split(',') : [];
|
||||
});
|
||||
const zhenggaifujianList = computed(() => {
|
||||
return zhenggaifujian ? zhenggaifujian.split(',') : [];
|
||||
return props.showInfoData.zhenggaifujian ? props.showInfoData.zhenggaifujian.split(',') : [];
|
||||
});
|
||||
const yanshoubiaoList = computed(() => {
|
||||
return yanshoubiao ? yanshoubiao.split(',') : [];
|
||||
return props.showInfoData.yanshoubiao ? props.showInfoData.yanshoubiao.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return wrjffzhaopian ? wrjffzhaopian.split(',') : [];
|
||||
return props.showInfoData.wrjffzhaopian ? props.showInfoData.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
const xchczhaopianList = computed(() => {
|
||||
return xchczhaopian ? xchczhaopian.split(',') : [];
|
||||
return props.showInfoData.xchczhaopian ? props.showInfoData.xchczhaopian.split(',') : [];
|
||||
});
|
||||
|
||||
function onMapboxLoad() {
|
||||
|
|
@ -672,8 +603,6 @@
|
|||
key: null,
|
||||
};
|
||||
if (props.showInfoData.geomid) {
|
||||
|
||||
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
|
|
@ -699,27 +628,26 @@
|
|||
}
|
||||
}
|
||||
const downLoadFile = (url) => {
|
||||
if(url.indexOf('.pdf') !== -1){
|
||||
if (url.indexOf('.pdf') !== -1) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/${url}`,
|
||||
responseType: 'blob',
|
||||
headers: {
|
||||
'Content-Disposition': 'inline',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(response => {
|
||||
let blob = new Blob([response.data], {type: 'application/pdf'});
|
||||
let url = window.URL.createObjectURL(blob)
|
||||
window.open(url);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}else{
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
.then((response) => {
|
||||
let blob = new Blob([response.data], { type: 'application/pdf' });
|
||||
let url = window.URL.createObjectURL(blob);
|
||||
window.open(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
} else {
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
}
|
||||
|
||||
};
|
||||
const getContainer = () => {
|
||||
return document.getElementById('info-container');
|
||||
|
|
@ -739,12 +667,12 @@
|
|||
}
|
||||
};
|
||||
const showImage = (url) => {
|
||||
if(url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1 ){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
if (url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -772,14 +700,14 @@
|
|||
height: calc(100vh - 100px);
|
||||
margin-right: 20px;
|
||||
}
|
||||
:deep(.ant-image){
|
||||
:deep(.ant-image) {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-left){
|
||||
:deep(.ant-image-preview-switch-left) {
|
||||
position: absolute;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-right){
|
||||
:deep(.ant-image-preview-switch-right) {
|
||||
position: absolute;
|
||||
}
|
||||
.info-container {
|
||||
|
|
@ -799,14 +727,14 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
.ant-image-preview-operations-operation{
|
||||
.ant-image-preview-operations-operation {
|
||||
// flex:1;
|
||||
}
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(1){
|
||||
.ant-image-preview-operations-operation:nth-last-child(1) {
|
||||
display: none;
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2){
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,41 +22,55 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="图斑编号">{{ case_no }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{ typename }}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{ countyname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{ streetname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{ communityname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑编号">{{
|
||||
props.showInfoData.case_no
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{
|
||||
props.showInfoData.typename
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{
|
||||
props.showInfoData.countyname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{
|
||||
props.showInfoData.streetname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{
|
||||
props.showInfoData.communityname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑面积(亩)">{{
|
||||
dataProcessing(area)
|
||||
dataProcessing(props.showInfoData.area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="农用地面积(亩)">{{
|
||||
dataProcessing(nongyongdi_area)
|
||||
dataProcessing(props.showInfoData.nongyongdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="耕地面积(亩)">{{
|
||||
dataProcessing(gengdi_area)
|
||||
dataProcessing(props.showInfoData.gengdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永农面积(亩)">{{
|
||||
dataProcessing(yongjiujibennongtian_area)
|
||||
dataProcessing(props.showInfoData.yongjiujibennongtian_area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="占重点区域面积(亩)">{{ dataProcessing(zhongdianquyu_area) }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="占生态红线面积(亩)">{{
|
||||
dataProcessing(shengtaibaohuhongxian_area)
|
||||
dataProcessing(props.showInfoData.shengtaibaohuhongxian_area)
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="占空间规划面积(亩)">{{ dataProcessing(guotukongjianguihua_area) }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="图斑描述">{{ case_description }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{
|
||||
props.showInfoData.case_description
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item label="图斑地址">{{ address }}</a-descriptions-item> -->
|
||||
<a-descriptions-item label="备注">{{ remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{ synchronoustime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ props.showInfoData.remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ props.showInfoData.lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ props.showInfoData.lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{
|
||||
props.showInfoData.synchronoustime
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -71,13 +85,17 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{ jieshou_people }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{ jieshou_time?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收人">{{
|
||||
props.showInfoData.jieshou_people
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="接收时间">{{
|
||||
props.showInfoData.jieshou_time?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
v-if="!['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="线索填报"
|
||||
force-render
|
||||
>
|
||||
|
|
@ -91,28 +109,28 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="判定结果">{{
|
||||
getLabel('is_illegal', is_illegal)
|
||||
getLabel('is_illegal', props.showInfoData.is_illegal)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目名称">{{
|
||||
xiangmumc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目名称">{{
|
||||
props.showInfoData.xiangmumc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目主体">{{
|
||||
xiangmuzhuti
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目主体">{{
|
||||
props.showInfoData.xiangmuzhuti
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="实际用途">{{
|
||||
actual_use_to
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="实际用途">{{
|
||||
props.showInfoData.actual_use_to
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', weifaleixing)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="违法类型">{{
|
||||
getLabel('weifaleixing', props.showInfoData.weifaleixing)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -126,14 +144,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in hefafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -147,17 +165,17 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="实际用途">{{
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', qita_use_to)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in qitafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -172,39 +190,47 @@
|
|||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="判定依据说明">{{
|
||||
pandingyijushuoming
|
||||
props.showInfoData.pandingyijushuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{
|
||||
props.showInfoData.examiner_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{
|
||||
props.showInfoData.examine_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="3"
|
||||
tab="整改情况"
|
||||
v-if="is_illegal == 1 && weifaleixing == 0 && !['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="
|
||||
props.showInfoData.is_illegal == 1 &&
|
||||
props.showInfoData.weifaleixing == 0 &&
|
||||
!['建设用地', '推堆土'].includes(props.showInfoData.typename)
|
||||
"
|
||||
>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -216,16 +242,16 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="整改措施">{{
|
||||
getLabel('measure_name', measure_name)
|
||||
getLabel('measure_name', props.showInfoData.measure_name)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in yanshoubiaoList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -239,14 +265,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 0" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 0" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template
|
||||
v-for="(imageItem, imageIndex) in chaichufugenghoupicList"
|
||||
:key="imageIndex"
|
||||
|
|
@ -255,7 +281,7 @@
|
|||
v-if="imageItem"
|
||||
width="100px"
|
||||
height="100px"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
|
|
@ -265,14 +291,14 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in zhenggaifujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -286,20 +312,20 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="measure_name == 1" label="照片">
|
||||
<a-descriptions-item v-if="props.showInfoData.measure_name == 1" label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in bubanzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
width="100px"
|
||||
height="100px"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
|
|
@ -309,11 +335,19 @@
|
|||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{ transactor_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{ transact_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理人">{{
|
||||
props.showInfoData.transactor_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="办理时间">{{
|
||||
props.showInfoData.transact_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" v-if="!['建设用地', '推堆土'].includes(typename)" tab="审核情况">
|
||||
<a-tab-pane
|
||||
key="4"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="审核情况"
|
||||
>
|
||||
<a-divider>区县审核</a-divider>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -324,10 +358,18 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ xjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ xianjiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.xjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.xianjiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.verifyuser
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.verifytime
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-divider>市局审核</a-divider>
|
||||
<a-descriptions
|
||||
|
|
@ -339,17 +381,29 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ sjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ shijiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ hexiaoren }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ hexiaotime?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="weifaleixing == 0" label="无人机复飞照片" :span="2">
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.sjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.shijiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.hexiaoren
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.hexiaotime?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item
|
||||
v-if="props.showInfoData.weifaleixing == 0"
|
||||
label="无人机复飞照片"
|
||||
:span="2"
|
||||
>
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in wrjffzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -393,158 +447,48 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref, computed,onBeforeMount } from 'vue';
|
||||
import { defineProps, ref, computed, onBeforeMount, watch } from 'vue';
|
||||
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
|
||||
import { getConfig } from '@/api/sys/layerManagement';
|
||||
import { getGeom } from '@/api/sys/layerManagement';
|
||||
import {getLoadCaseImgList} from '@/api/inspectionaudit'
|
||||
import { getLoadCaseImgList } from '@/api/inspectionaudit';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import axios from 'axios';
|
||||
const { createMessage } = useMessage();
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
import {
|
||||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
measureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
illegalTypeList,
|
||||
resultOptions,
|
||||
qitaUseTOOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
console.log('');
|
||||
const { createMessage } = useMessage();
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.showInfoData,
|
||||
() => {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
},
|
||||
);
|
||||
const props = defineProps(['showInfoData']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
||||
const geomsList = ref();
|
||||
const {
|
||||
id,
|
||||
case_no,
|
||||
case_name,
|
||||
case_description,
|
||||
start_time,
|
||||
end_time,
|
||||
address,
|
||||
lng,
|
||||
lat,
|
||||
typeid,
|
||||
typename,
|
||||
handle_status_id,
|
||||
handle_status_name,
|
||||
case_status_i,
|
||||
case_status_name,
|
||||
createtime,
|
||||
createuser,
|
||||
drone_no,
|
||||
deal_userid,
|
||||
deal_username,
|
||||
createusername,
|
||||
is_delete,
|
||||
countyid,
|
||||
countyname,
|
||||
streetid,
|
||||
streetname,
|
||||
communityid,
|
||||
communityname,
|
||||
remark,
|
||||
is_closed,
|
||||
area,
|
||||
is_illegal,
|
||||
close_user,
|
||||
close_time,
|
||||
identification_user,
|
||||
identification_time,
|
||||
is_intact,
|
||||
close_userid,
|
||||
identification_userid,
|
||||
verifyuserid,
|
||||
verifyuser,
|
||||
verifytime,
|
||||
is_improve,
|
||||
improve_reason,
|
||||
is_dispense,
|
||||
dispense_userid,
|
||||
dispense_time,
|
||||
dispense_username,
|
||||
verifystatus,
|
||||
verifystatusname,
|
||||
is_checked,
|
||||
deal_time,
|
||||
is_drawback,
|
||||
examiner_id,
|
||||
examiner_name,
|
||||
examine_time,
|
||||
measure_name,
|
||||
casepic,
|
||||
opinion,
|
||||
result,
|
||||
result_name,
|
||||
opinion_name,
|
||||
handletime,
|
||||
handleuser,
|
||||
handleusername,
|
||||
is_assist,
|
||||
measure_name_deal,
|
||||
qita_use_to,
|
||||
illegal_contact,
|
||||
illegal_shenfenzhenghao,
|
||||
investigation_type,
|
||||
investigation_result,
|
||||
registr_number,
|
||||
is_build_complete,
|
||||
actual_use_to,
|
||||
transactor_id,
|
||||
transactor_name,
|
||||
transact_time,
|
||||
geomid,
|
||||
nongyongdi_area,
|
||||
gengdi_area,
|
||||
yongjiujibennongtian_area,
|
||||
zhongdianquyu_area,
|
||||
shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area,
|
||||
fujian,
|
||||
hefafujian,
|
||||
qitafujian,
|
||||
jieshou_people,
|
||||
jieshou_time,
|
||||
pandingyijushuoming,
|
||||
xiangmumc,
|
||||
xiangmuzhuti,
|
||||
weifaleixing,
|
||||
yanshoubiao,
|
||||
zhenggaifujian,
|
||||
chaichufugenghoupic,
|
||||
bubanzhaopian,
|
||||
is_jieshou,
|
||||
anjianzhaopian,
|
||||
hexiaoren,
|
||||
hexiaotime,
|
||||
wrjffzhaopian,
|
||||
xchczhaopian,
|
||||
synchronoustime,
|
||||
xjshenhejieguo,
|
||||
xianjiyijian,
|
||||
sjshenhejieguo,
|
||||
shijiyijian,
|
||||
} = props.showInfoData;
|
||||
|
||||
const imageList = ref([]);
|
||||
|
||||
async function getCaseImgList(){
|
||||
imageList.value = await getLoadCaseImgList({caseid:id,category:'巡察审计'});
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({
|
||||
caseid: props.showInfoData.id,
|
||||
category: '巡察审计',
|
||||
});
|
||||
MapboxComponent.value.handlerLoadPictureAzimuth(imageList.value);
|
||||
|
||||
// 匹配去除无效图片
|
||||
|
|
@ -557,19 +501,17 @@
|
|||
// zhengshiImageList.push(imageList.value[index]);
|
||||
// }
|
||||
// })
|
||||
|
||||
}
|
||||
|
||||
function handlerDealFileName(path){
|
||||
function handlerDealFileName(path) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const matchStr = path.match(regex);
|
||||
if(matchStr?.length){
|
||||
if (matchStr?.length) {
|
||||
return matchStr[0];
|
||||
}
|
||||
}
|
||||
|
||||
function handlerPreviewImage(index,url){
|
||||
|
||||
function handlerPreviewImage(index, url) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const match = url.match(regex);
|
||||
if (match) {
|
||||
|
|
@ -579,70 +521,66 @@
|
|||
|
||||
const isInitImageLisener = ref<Boolean>(false);
|
||||
// 监听预览图片地址变化进行箭头切换
|
||||
function handlerImageChange(e):void{
|
||||
if(e && !isInitImageLisener.value){
|
||||
setTimeout(function(){
|
||||
function handlerImageChange(e): void {
|
||||
if (e && !isInitImageLisener.value) {
|
||||
setTimeout(function () {
|
||||
const targetNode = document.getElementsByClassName('ant-image-preview-img');
|
||||
// 创建一个观察器实例，并传入回调函数
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if(targetNode[0].getAttribute(mutation.attributeName).match("http")){
|
||||
handlerPreviewImage(0,targetNode[0].getAttribute(mutation.attributeName))
|
||||
}
|
||||
}
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if (targetNode[0].getAttribute(mutation.attributeName).match('http')) {
|
||||
handlerPreviewImage(0, targetNode[0].getAttribute(mutation.attributeName));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// 配置观察选项
|
||||
const config = { attributes: true };
|
||||
// 开始观察目标节点
|
||||
observer.observe(targetNode[0], config);
|
||||
isInitImageLisener.value = true;
|
||||
},250)
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(()=>{
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
const anjianzhaopianList = computed(() => {
|
||||
getCaseImgList();
|
||||
return anjianzhaopian ? anjianzhaopian.split(',') : [];
|
||||
return props.showInfoData.anjianzhaopian ? props.showInfoData.anjianzhaopian.split(',') : [];
|
||||
});
|
||||
const casepicList = computed(() => {
|
||||
return casepic ? casepic.split(',') : [];
|
||||
return props.showInfoData.casepic ? props.showInfoData.casepic.split(',') : [];
|
||||
});
|
||||
const chaichufugenghoupicList = computed(() => {
|
||||
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
|
||||
return props.showInfoData.chaichufugenghoupic
|
||||
? props.showInfoData.chaichufugenghoupic.split(',')
|
||||
: [];
|
||||
});
|
||||
const bubanzhaopianList = computed(() => {
|
||||
return bubanzhaopian ? bubanzhaopian.split(',') : [];
|
||||
return props.showInfoData.bubanzhaopian ? props.showInfoData.bubanzhaopian.split(',') : [];
|
||||
});
|
||||
const fujianList = computed(() => {
|
||||
return fujian ? fujian.split(',') : [];
|
||||
return props.showInfoData.fujian ? props.showInfoData.fujian.split(',') : [];
|
||||
});
|
||||
const hefafujianList = computed(() => {
|
||||
return hefafujian ? hefafujian.split(',') : [];
|
||||
return props.showInfoData.hefafujian ? props.showInfoData.hefafujian.split(',') : [];
|
||||
});
|
||||
const qitafujianList = computed(() => {
|
||||
return qitafujian ? qitafujian.split(',') : [];
|
||||
return props.showInfoData.qitafujian ? props.showInfoData.qitafujian.split(',') : [];
|
||||
});
|
||||
const zhenggaifujianList = computed(() => {
|
||||
return zhenggaifujian ? zhenggaifujian.split(',') : [];
|
||||
return props.showInfoData.zhenggaifujian ? props.showInfoData.zhenggaifujian.split(',') : [];
|
||||
});
|
||||
const yanshoubiaoList = computed(() => {
|
||||
return yanshoubiao ? yanshoubiao.split(',') : [];
|
||||
return props.showInfoData.yanshoubiao ? props.showInfoData.yanshoubiao.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return wrjffzhaopian ? wrjffzhaopian.split(',') : [];
|
||||
return props.showInfoData.wrjffzhaopian ? props.showInfoData.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
const xchczhaopianList = computed(() => {
|
||||
return xchczhaopian ? xchczhaopian.split(',') : [];
|
||||
return props.showInfoData.xchczhaopian ? props.showInfoData.xchczhaopian.split(',') : [];
|
||||
});
|
||||
function onMapboxLoad() {
|
||||
changeTask();
|
||||
|
|
@ -684,8 +622,6 @@
|
|||
key: null,
|
||||
};
|
||||
if (props.showInfoData.geomid) {
|
||||
|
||||
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
|
|
@ -711,27 +647,26 @@
|
|||
}
|
||||
}
|
||||
const downLoadFile = (url) => {
|
||||
if(url.indexOf('.pdf') !== -1){
|
||||
if (url.indexOf('.pdf') !== -1) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/${url}`,
|
||||
responseType: 'blob',
|
||||
headers: {
|
||||
'Content-Disposition': 'inline',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(response => {
|
||||
let blob = new Blob([response.data], {type: 'application/pdf'});
|
||||
let url = window.URL.createObjectURL(blob)
|
||||
window.open(url);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}else{
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
.then((response) => {
|
||||
let blob = new Blob([response.data], { type: 'application/pdf' });
|
||||
let url = window.URL.createObjectURL(blob);
|
||||
window.open(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
} else {
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
}
|
||||
|
||||
};
|
||||
const getContainer = () => {
|
||||
return document.getElementById('info-container');
|
||||
|
|
@ -751,12 +686,12 @@
|
|||
}
|
||||
};
|
||||
const showImage = (url) => {
|
||||
if(url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1 ){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
if (url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -784,14 +719,14 @@
|
|||
height: calc(100vh - 100px);
|
||||
margin-right: 20px;
|
||||
}
|
||||
:deep(.ant-image){
|
||||
:deep(.ant-image) {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-left){
|
||||
:deep(.ant-image-preview-switch-left) {
|
||||
position: absolute;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-right){
|
||||
:deep(.ant-image-preview-switch-right) {
|
||||
position: absolute;
|
||||
}
|
||||
.info-container {
|
||||
|
|
@ -811,14 +746,14 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
.ant-image-preview-operations-operation{
|
||||
.ant-image-preview-operations-operation {
|
||||
// flex:1;
|
||||
}
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(1){
|
||||
.ant-image-preview-operations-operation:nth-last-child(1) {
|
||||
display: none;
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2){
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,38 +22,52 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="图斑编号">{{ case_no }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{ typename }}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{ countyname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{ streetname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{ communityname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑编号">{{
|
||||
props.showInfoData.case_no
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{
|
||||
props.showInfoData.typename
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{
|
||||
props.showInfoData.countyname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{
|
||||
props.showInfoData.streetname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{
|
||||
props.showInfoData.communityname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑面积(亩)">{{
|
||||
dataProcessing(area)
|
||||
dataProcessing(props.showInfoData.area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="农用地面积(亩)">{{
|
||||
dataProcessing(nongyongdi_area)
|
||||
dataProcessing(props.showInfoData.nongyongdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="耕地面积(亩)">{{
|
||||
dataProcessing(gengdi_area)
|
||||
dataProcessing(props.showInfoData.gengdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永农面积(亩)">{{
|
||||
dataProcessing(yongjiujibennongtian_area)
|
||||
dataProcessing(props.showInfoData.yongjiujibennongtian_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="占生态红线面积(亩)">{{
|
||||
dataProcessing(shengtaibaohuhongxian_area)
|
||||
dataProcessing(props.showInfoData.shengtaibaohuhongxian_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{
|
||||
props.showInfoData.case_description
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ props.showInfoData.remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ props.showInfoData.lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ props.showInfoData.lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{
|
||||
props.showInfoData.synchronoustime
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{ case_description }}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{ synchronoustime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -72,7 +86,7 @@
|
|||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
v-if="!['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="线索填报"
|
||||
force-render
|
||||
>
|
||||
|
|
@ -86,34 +100,34 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="判定结果">{{
|
||||
getLabel('is_illegal', is_illegal)
|
||||
getLabel('is_illegal', props.showInfoData.is_illegal)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目名称">{{
|
||||
xiangmumc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目名称">{{
|
||||
props.showInfoData.xiangmumc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目主体">{{
|
||||
xiangmuzhuti
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目主体">{{
|
||||
props.showInfoData.xiangmuzhuti
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="实际用途">{{
|
||||
actual_use_to
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="实际用途">{{
|
||||
props.showInfoData.actual_use_to
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="整改措施">{{
|
||||
getLabel('measure_name', measure_name)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="整改措施">{{
|
||||
getLabel('measure_name', props.showInfoData.measure_name)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="是否对人处理">{{
|
||||
getLabel('is_chuli', is_chuli)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="是否对人处理">{{
|
||||
getLabel('is_chuli', props.showInfoData.is_chuli)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="处理情况说明">{{
|
||||
chuliqingkuangsm
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="处理情况说明">{{
|
||||
props.showInfoData.chuliqingkuangsm
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -127,14 +141,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in hefafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -148,20 +162,22 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', qita_use_to)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="实际用途">{{
|
||||
getLabel('qita_use_to', props.showInfoData.qita_use_to)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="实际用途其他说明">{{
|
||||
qita_shuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item
|
||||
v-if="props.showInfoData.is_illegal == 2"
|
||||
label="实际用途其他说明"
|
||||
>{{ props.showInfoData.qita_shuoming }}</a-descriptions-item
|
||||
>
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in qitafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -176,36 +192,44 @@
|
|||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="判定依据说明">{{
|
||||
pandingyijushuoming
|
||||
props.showInfoData.pandingyijushuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{
|
||||
props.showInfoData.examiner_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{
|
||||
props.showInfoData.examine_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" v-if="!['建设用地', '推堆土'].includes(typename)" tab="审核情况">
|
||||
<a-tab-pane
|
||||
key="4"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="审核情况"
|
||||
>
|
||||
<a-divider>区县审核</a-divider>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -216,10 +240,18 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ xjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ xianjiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.xjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.xianjiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.verifyuser
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.verifytime
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-divider>市局审核</a-divider>
|
||||
<a-descriptions
|
||||
|
|
@ -231,10 +263,18 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ sjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ shijiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ hexiaoren }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ hexiaotime?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.sjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.shijiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.hexiaoren
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.hexiaotime?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item v-if="weifaleixing == 0" label="无人机复飞照片" :span="2">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
|
|
@ -285,162 +325,48 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref, computed,onBeforeMount } from 'vue';
|
||||
import { defineProps, ref, computed, onBeforeMount, watch } from 'vue';
|
||||
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
|
||||
import { getConfig } from '@/api/sys/layerManagement';
|
||||
import { getGeom } from '@/api/sys/layerManagement';
|
||||
import {getLoadCaseImgList} from '@/api/keyproblem/keyissuesII'
|
||||
import { getLoadCaseImgList } from '@/api/keyproblem/keyissuesII';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import axios from 'axios';
|
||||
const { createMessage } = useMessage();
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
import {
|
||||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
keyIssuesIMeasureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
illegalTypeList,
|
||||
resultOptions,
|
||||
qitaUseTOOptions,
|
||||
isChuliOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
console.log('');
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
watch(
|
||||
() => props.showInfoData,
|
||||
() => {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
},
|
||||
);
|
||||
|
||||
const props = defineProps(['showInfoData']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
||||
const geomsList = ref();
|
||||
const {
|
||||
id,
|
||||
case_no,
|
||||
case_name,
|
||||
case_description,
|
||||
start_time,
|
||||
end_time,
|
||||
address,
|
||||
lng,
|
||||
lat,
|
||||
typeid,
|
||||
typename,
|
||||
handle_status_id,
|
||||
handle_status_name,
|
||||
case_status_i,
|
||||
case_status_name,
|
||||
createtime,
|
||||
createuser,
|
||||
drone_no,
|
||||
deal_userid,
|
||||
deal_username,
|
||||
createusername,
|
||||
is_delete,
|
||||
countyid,
|
||||
countyname,
|
||||
streetid,
|
||||
streetname,
|
||||
communityid,
|
||||
communityname,
|
||||
remark,
|
||||
is_closed,
|
||||
area,
|
||||
is_illegal,
|
||||
close_user,
|
||||
close_time,
|
||||
identification_user,
|
||||
identification_time,
|
||||
is_intact,
|
||||
close_userid,
|
||||
identification_userid,
|
||||
verifyuserid,
|
||||
verifyuser,
|
||||
verifytime,
|
||||
is_improve,
|
||||
improve_reason,
|
||||
is_dispense,
|
||||
dispense_userid,
|
||||
dispense_time,
|
||||
dispense_username,
|
||||
verifystatus,
|
||||
verifystatusname,
|
||||
is_checked,
|
||||
deal_time,
|
||||
is_drawback,
|
||||
examiner_id,
|
||||
examiner_name,
|
||||
examine_time,
|
||||
measure_name,
|
||||
casepic,
|
||||
opinion,
|
||||
result,
|
||||
result_name,
|
||||
opinion_name,
|
||||
handletime,
|
||||
handleuser,
|
||||
handleusername,
|
||||
is_assist,
|
||||
measure_name_deal,
|
||||
qita_use_to,
|
||||
illegal_contact,
|
||||
illegal_shenfenzhenghao,
|
||||
investigation_type,
|
||||
investigation_result,
|
||||
registr_number,
|
||||
is_build_complete,
|
||||
actual_use_to,
|
||||
transactor_id,
|
||||
transactor_name,
|
||||
transact_time,
|
||||
geomid,
|
||||
nongyongdi_area,
|
||||
gengdi_area,
|
||||
yongjiujibennongtian_area,
|
||||
zhongdianquyu_area,
|
||||
shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area,
|
||||
fujian,
|
||||
hefafujian,
|
||||
qitafujian,
|
||||
jieshou_people,
|
||||
jieshou_time,
|
||||
pandingyijushuoming,
|
||||
xiangmumc,
|
||||
xiangmuzhuti,
|
||||
weifaleixing,
|
||||
yanshoubiao,
|
||||
zhenggaifujian,
|
||||
chaichufugenghoupic,
|
||||
bubanzhaopian,
|
||||
is_jieshou,
|
||||
anjianzhaopian,
|
||||
hexiaoren,
|
||||
hexiaotime,
|
||||
wrjffzhaopian,
|
||||
xchczhaopian,
|
||||
synchronoustime,
|
||||
xjshenhejieguo,
|
||||
xianjiyijian,
|
||||
sjshenhejieguo,
|
||||
shijiyijian,
|
||||
is_chuli,
|
||||
chuliqingkuangsm,
|
||||
qita_shuoming,
|
||||
} = props.showInfoData;
|
||||
|
||||
const imageList = ref([]);
|
||||
|
||||
async function getCaseImgList(){
|
||||
imageList.value = await getLoadCaseImgList({caseid:id,category:'重点问题I类'});
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({
|
||||
caseid: props.showInfoData.id,
|
||||
category: '重点问题I类',
|
||||
});
|
||||
MapboxComponent.value.handlerLoadPictureAzimuth(imageList.value);
|
||||
|
||||
// 匹配去除无效图片
|
||||
|
|
@ -453,19 +379,17 @@
|
|||
// zhengshiImageList.push(imageList.value[index]);
|
||||
// }
|
||||
// })
|
||||
|
||||
}
|
||||
|
||||
function handlerDealFileName(path){
|
||||
function handlerDealFileName(path) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const matchStr = path.match(regex);
|
||||
if(matchStr?.length){
|
||||
if (matchStr?.length) {
|
||||
return matchStr[0];
|
||||
}
|
||||
}
|
||||
|
||||
function handlerPreviewImage(index,url){
|
||||
|
||||
function handlerPreviewImage(index, url) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const match = url.match(regex);
|
||||
if (match) {
|
||||
|
|
@ -475,70 +399,66 @@
|
|||
|
||||
const isInitImageLisener = ref<Boolean>(false);
|
||||
// 监听预览图片地址变化进行箭头切换
|
||||
function handlerImageChange(e):void{
|
||||
if(e && !isInitImageLisener.value){
|
||||
setTimeout(function(){
|
||||
function handlerImageChange(e): void {
|
||||
if (e && !isInitImageLisener.value) {
|
||||
setTimeout(function () {
|
||||
const targetNode = document.getElementsByClassName('ant-image-preview-img');
|
||||
// 创建一个观察器实例，并传入回调函数
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if(targetNode[0].getAttribute(mutation.attributeName).match("http")){
|
||||
handlerPreviewImage(0,targetNode[0].getAttribute(mutation.attributeName))
|
||||
}
|
||||
}
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if (targetNode[0].getAttribute(mutation.attributeName).match('http')) {
|
||||
handlerPreviewImage(0, targetNode[0].getAttribute(mutation.attributeName));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// 配置观察选项
|
||||
const config = { attributes: true };
|
||||
// 开始观察目标节点
|
||||
observer.observe(targetNode[0], config);
|
||||
isInitImageLisener.value = true;
|
||||
},250)
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(()=>{
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
const anjianzhaopianList = computed(() => {
|
||||
getCaseImgList();
|
||||
return anjianzhaopian ? anjianzhaopian.split(',') : [];
|
||||
return props.showInfoData.anjianzhaopian ? props.showInfoData.anjianzhaopian.split(',') : [];
|
||||
});
|
||||
const casepicList = computed(() => {
|
||||
return casepic ? casepic.split(',') : [];
|
||||
return props.showInfoData.casepic ? props.showInfoData.casepic.split(',') : [];
|
||||
});
|
||||
const chaichufugenghoupicList = computed(() => {
|
||||
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
|
||||
return props.showInfoData.chaichufugenghoupic
|
||||
? props.showInfoData.chaichufugenghoupic.split(',')
|
||||
: [];
|
||||
});
|
||||
const bubanzhaopianList = computed(() => {
|
||||
return bubanzhaopian ? bubanzhaopian.split(',') : [];
|
||||
return props.showInfoData.bubanzhaopian ? props.showInfoData.bubanzhaopian.split(',') : [];
|
||||
});
|
||||
const fujianList = computed(() => {
|
||||
return fujian ? fujian.split(',') : [];
|
||||
return props.showInfoData.fujian ? props.showInfoData.fujian.split(',') : [];
|
||||
});
|
||||
const hefafujianList = computed(() => {
|
||||
return hefafujian ? hefafujian.split(',') : [];
|
||||
return props.showInfoData.hefafujian ? props.showInfoData.hefafujian.split(',') : [];
|
||||
});
|
||||
const qitafujianList = computed(() => {
|
||||
return qitafujian ? qitafujian.split(',') : [];
|
||||
return props.showInfoData.qitafujian ? props.showInfoData.qitafujian.split(',') : [];
|
||||
});
|
||||
const zhenggaifujianList = computed(() => {
|
||||
return zhenggaifujian ? zhenggaifujian.split(',') : [];
|
||||
return props.showInfoData.zhenggaifujian ? props.showInfoData.zhenggaifujian.split(',') : [];
|
||||
});
|
||||
const yanshoubiaoList = computed(() => {
|
||||
return yanshoubiao ? yanshoubiao.split(',') : [];
|
||||
return props.showInfoData.yanshoubiao ? props.showInfoData.yanshoubiao.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return wrjffzhaopian ? wrjffzhaopian.split(',') : [];
|
||||
return props.showInfoData.wrjffzhaopian ? props.showInfoData.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
const xchczhaopianList = computed(() => {
|
||||
return xchczhaopian ? xchczhaopian.split(',') : [];
|
||||
return props.showInfoData.xchczhaopian ? props.showInfoData.xchczhaopian.split(',') : [];
|
||||
});
|
||||
function onMapboxLoad() {
|
||||
changeTask();
|
||||
|
|
@ -582,8 +502,6 @@
|
|||
key: null,
|
||||
};
|
||||
if (props.showInfoData.geomid) {
|
||||
|
||||
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
|
|
@ -609,27 +527,26 @@
|
|||
}
|
||||
}
|
||||
const downLoadFile = (url) => {
|
||||
if(url.indexOf('.pdf') !== -1){
|
||||
if (url.indexOf('.pdf') !== -1) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/${url}`,
|
||||
responseType: 'blob',
|
||||
headers: {
|
||||
'Content-Disposition': 'inline',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(response => {
|
||||
let blob = new Blob([response.data], {type: 'application/pdf'});
|
||||
let url = window.URL.createObjectURL(blob)
|
||||
window.open(url);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}else{
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
.then((response) => {
|
||||
let blob = new Blob([response.data], { type: 'application/pdf' });
|
||||
let url = window.URL.createObjectURL(blob);
|
||||
window.open(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
} else {
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
}
|
||||
|
||||
};
|
||||
const getContainer = () => {
|
||||
return document.getElementById('info-container');
|
||||
|
|
@ -649,12 +566,12 @@
|
|||
}
|
||||
};
|
||||
const showImage = (url) => {
|
||||
if(url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1 ){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
if (url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -682,14 +599,14 @@
|
|||
height: calc(100vh - 100px);
|
||||
margin-right: 20px;
|
||||
}
|
||||
:deep(.ant-image){
|
||||
:deep(.ant-image) {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-left){
|
||||
:deep(.ant-image-preview-switch-left) {
|
||||
position: absolute;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-right){
|
||||
:deep(.ant-image-preview-switch-right) {
|
||||
position: absolute;
|
||||
}
|
||||
.info-container {
|
||||
|
|
@ -709,14 +626,14 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
.ant-image-preview-operations-operation{
|
||||
.ant-image-preview-operations-operation {
|
||||
// flex:1;
|
||||
}
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(1){
|
||||
.ant-image-preview-operations-operation:nth-last-child(1) {
|
||||
display: none;
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2){
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,38 +22,52 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="图斑编号">{{ case_no }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{ typename }}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{ countyname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{ streetname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{ communityname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑编号">{{
|
||||
props.showInfoData.case_no
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑类型">{{
|
||||
props.showInfoData.typename
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="县区">{{
|
||||
props.showInfoData.countyname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="乡镇">{{
|
||||
props.showInfoData.streetname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="社区/村">{{
|
||||
props.showInfoData.communityname
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑面积(亩)">{{
|
||||
dataProcessing(area)
|
||||
dataProcessing(props.showInfoData.area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="农用地面积(亩)">{{
|
||||
dataProcessing(nongyongdi_area)
|
||||
dataProcessing(props.showInfoData.nongyongdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="耕地面积(亩)">{{
|
||||
dataProcessing(gengdi_area)
|
||||
dataProcessing(props.showInfoData.gengdi_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="永农面积(亩)">{{
|
||||
dataProcessing(yongjiujibennongtian_area)
|
||||
dataProcessing(props.showInfoData.yongjiujibennongtian_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="占生态红线面积(亩)">{{
|
||||
dataProcessing(shengtaibaohuhongxian_area)
|
||||
dataProcessing(props.showInfoData.shengtaibaohuhongxian_area)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{
|
||||
props.showInfoData.case_description
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ props.showInfoData.remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ props.showInfoData.lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ props.showInfoData.lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{
|
||||
props.showInfoData.synchronoustime
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑描述">{{ case_description }}</a-descriptions-item>
|
||||
<a-descriptions-item label="备注">{{ remark }}</a-descriptions-item>
|
||||
<a-descriptions-item label="经度">{{ lng }}</a-descriptions-item>
|
||||
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
|
||||
<a-descriptions-item label="下发时间">{{ synchronoustime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="图斑照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
getContainer: getContainer,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
|
|
@ -72,7 +86,7 @@
|
|||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
key="2"
|
||||
v-if="!['建设用地', '推堆土'].includes(typename)"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="线索填报"
|
||||
force-render
|
||||
>
|
||||
|
|
@ -86,34 +100,34 @@
|
|||
}"
|
||||
>
|
||||
<a-descriptions-item label="判定结果">{{
|
||||
getLabel('is_illegal', is_illegal)
|
||||
getLabel('is_illegal', props.showInfoData.is_illegal)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目名称">{{
|
||||
xiangmumc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目名称">{{
|
||||
props.showInfoData.xiangmumc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="项目主体">{{
|
||||
xiangmuzhuti
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="项目主体">{{
|
||||
props.showInfoData.xiangmuzhuti
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="实际用途">{{
|
||||
actual_use_to
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="实际用途">{{
|
||||
props.showInfoData.actual_use_to
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="整改措施">{{
|
||||
getLabel('measure_name', measure_name)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="整改措施">{{
|
||||
getLabel('measure_name', props.showInfoData.measure_name)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="是否对人处理">{{
|
||||
getLabel('is_chuli', is_chuli)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="是否对人处理">{{
|
||||
getLabel('is_chuli', props.showInfoData.is_chuli)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="处理情况说明">{{
|
||||
chuliqingkuangsm
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="处理情况说明">{{
|
||||
props.showInfoData.chuliqingkuangsm
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 1" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -127,14 +141,14 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{getContainer,}">
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 0" label="附件">
|
||||
<a-image-preview-group :preview="{ getContainer }">
|
||||
<template v-for="(item, itemIndex) in hefafujianList" :key="itemIndex">
|
||||
<a-image
|
||||
v-if="showImage(item)"
|
||||
style="width:100px;height:100px;"
|
||||
style="width: 100px; height: 100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${item}`"
|
||||
:preview="{getContainer,}"
|
||||
:preview="{ getContainer }"
|
||||
></a-image>
|
||||
<div v-else>
|
||||
<Icon
|
||||
|
|
@ -148,49 +162,57 @@
|
|||
</template>
|
||||
</a-image-preview-group>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 2" label="其他情形">{{
|
||||
getLabel('qita_qksm', qita_qksm)
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 2" label="其他情形">{{
|
||||
getLabel('qita_qksm', props.showInfoData.qita_qksm)
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 3" label="项目名称">{{
|
||||
zj_xmmc
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 3" label="项目名称">{{
|
||||
props.showInfoData.zj_xmmc
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 3" label="项目主体">{{
|
||||
zj_xmzt
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 3" label="项目主体">{{
|
||||
props.showInfoData.zj_xmzt
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item v-if="is_illegal == 3" label="实际用途">{{
|
||||
zj_sjyt
|
||||
<a-descriptions-item v-if="props.showInfoData.is_illegal == 3" label="实际用途">{{
|
||||
props.showInfoData.zj_sjyt
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="判定依据说明">{{
|
||||
pandingyijushuoming
|
||||
props.showInfoData.pandingyijushuoming
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="照片">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
:preview="{
|
||||
getContainer:getContainer,
|
||||
onVisibleChange:handlerImageChange
|
||||
getContainer: getContainer,
|
||||
onVisibleChange: handlerImageChange,
|
||||
}"
|
||||
>
|
||||
>
|
||||
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex,imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
<a-image
|
||||
v-if="imageItem"
|
||||
@click="handlerPreviewImage(imageIndex, imageItem)"
|
||||
width="100px"
|
||||
height="100px"
|
||||
:src="`${VITE_GLOB_INFO_IMAGE_URL}/${imageItem}`"
|
||||
:preview="{
|
||||
getContainer,
|
||||
}"
|
||||
></a-image>
|
||||
</template>
|
||||
</a-image-preview-group>
|
||||
</div>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报人">{{
|
||||
props.showInfoData.examiner_name
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="填报时间">{{
|
||||
props.showInfoData.examine_time
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" v-if="!['建设用地', '推堆土'].includes(typename)" tab="审核情况">
|
||||
<a-tab-pane
|
||||
key="4"
|
||||
v-if="!['建设用地', '推堆土'].includes(props.showInfoData.typename)"
|
||||
tab="审核情况"
|
||||
>
|
||||
<a-divider>区县审核</a-divider>
|
||||
<a-descriptions
|
||||
:column="2"
|
||||
|
|
@ -201,10 +223,18 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ xjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ xianjiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.xjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.xianjiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.verifyuser
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.verifytime
|
||||
}}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<a-divider>市局审核</a-divider>
|
||||
<a-descriptions
|
||||
|
|
@ -216,10 +246,18 @@
|
|||
'word-break': 'break-all',
|
||||
}"
|
||||
>
|
||||
<a-descriptions-item label="审核结果">{{ sjshenhejieguo }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{ shijiyijian }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{ hexiaoren }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{ hexiaotime?.split('.')[0] }}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核结果">{{
|
||||
props.showInfoData.sjshenhejieguo
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核意见">{{
|
||||
props.showInfoData.shijiyijian
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核人">{{
|
||||
props.showInfoData.hexiaoren
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="审核时间">{{
|
||||
props.showInfoData.hexiaotime?.split('.')[0]
|
||||
}}</a-descriptions-item>
|
||||
<!-- <a-descriptions-item v-if="weifaleixing == 0" label="无人机复飞照片" :span="2">
|
||||
<div class="image-div">
|
||||
<a-image-preview-group
|
||||
|
|
@ -270,166 +308,51 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineProps, ref, computed,onBeforeMount } from 'vue';
|
||||
import { defineProps, ref, computed, onBeforeMount, watch } from 'vue';
|
||||
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
|
||||
import { getConfig } from '@/api/sys/layerManagement';
|
||||
import { getGeom } from '@/api/sys/layerManagement';
|
||||
import {getLoadCaseImgList} from '@/api/keyproblem/keyissuesII'
|
||||
import { getLoadCaseImgList } from '@/api/keyproblem/keyissuesII';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import axios from 'axios';
|
||||
const { createMessage } = useMessage();
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { getAppEnvConfig } from '@/utils/env';
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
import {
|
||||
keyIssuesIIMapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
keyIssuesIIMeasureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
illegalTypeList,
|
||||
resultOptions,
|
||||
qitaUseTOOptions,
|
||||
isChuliOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
console.log('');
|
||||
const { createMessage } = useMessage();
|
||||
const { VITE_GLOB_INFO_IMAGE_URL } = getAppEnvConfig();
|
||||
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.showInfoData,
|
||||
() => {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
},
|
||||
);
|
||||
|
||||
const props = defineProps(['showInfoData']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
||||
const geomsList = ref();
|
||||
const {
|
||||
id,
|
||||
case_no,
|
||||
case_name,
|
||||
case_description,
|
||||
start_time,
|
||||
end_time,
|
||||
address,
|
||||
lng,
|
||||
lat,
|
||||
typeid,
|
||||
typename,
|
||||
handle_status_id,
|
||||
handle_status_name,
|
||||
case_status_i,
|
||||
case_status_name,
|
||||
createtime,
|
||||
createuser,
|
||||
drone_no,
|
||||
deal_userid,
|
||||
deal_username,
|
||||
createusername,
|
||||
is_delete,
|
||||
countyid,
|
||||
countyname,
|
||||
streetid,
|
||||
streetname,
|
||||
communityid,
|
||||
communityname,
|
||||
remark,
|
||||
is_closed,
|
||||
area,
|
||||
is_illegal,
|
||||
close_user,
|
||||
close_time,
|
||||
identification_user,
|
||||
identification_time,
|
||||
is_intact,
|
||||
close_userid,
|
||||
identification_userid,
|
||||
verifyuserid,
|
||||
verifyuser,
|
||||
verifytime,
|
||||
is_improve,
|
||||
improve_reason,
|
||||
is_dispense,
|
||||
dispense_userid,
|
||||
dispense_time,
|
||||
dispense_username,
|
||||
verifystatus,
|
||||
verifystatusname,
|
||||
is_checked,
|
||||
deal_time,
|
||||
is_drawback,
|
||||
examiner_id,
|
||||
examiner_name,
|
||||
examine_time,
|
||||
measure_name,
|
||||
casepic,
|
||||
opinion,
|
||||
result,
|
||||
result_name,
|
||||
opinion_name,
|
||||
handletime,
|
||||
handleuser,
|
||||
handleusername,
|
||||
is_assist,
|
||||
measure_name_deal,
|
||||
qita_use_to,
|
||||
illegal_contact,
|
||||
illegal_shenfenzhenghao,
|
||||
investigation_type,
|
||||
investigation_result,
|
||||
registr_number,
|
||||
is_build_complete,
|
||||
actual_use_to,
|
||||
transactor_id,
|
||||
transactor_name,
|
||||
transact_time,
|
||||
geomid,
|
||||
nongyongdi_area,
|
||||
gengdi_area,
|
||||
yongjiujibennongtian_area,
|
||||
zhongdianquyu_area,
|
||||
shengtaibaohuhongxian_area,
|
||||
guotukongjianguihua_area,
|
||||
fujian,
|
||||
hefafujian,
|
||||
qitafujian,
|
||||
jieshou_people,
|
||||
jieshou_time,
|
||||
pandingyijushuoming,
|
||||
xiangmumc,
|
||||
xiangmuzhuti,
|
||||
weifaleixing,
|
||||
yanshoubiao,
|
||||
zhenggaifujian,
|
||||
chaichufugenghoupic,
|
||||
bubanzhaopian,
|
||||
is_jieshou,
|
||||
anjianzhaopian,
|
||||
hexiaoren,
|
||||
hexiaotime,
|
||||
wrjffzhaopian,
|
||||
xchczhaopian,
|
||||
synchronoustime,
|
||||
xjshenhejieguo,
|
||||
xianjiyijian,
|
||||
sjshenhejieguo,
|
||||
shijiyijian,
|
||||
is_chuli,
|
||||
chuliqingkuangsm,
|
||||
qita_shuoming,
|
||||
qita_qksm,
|
||||
zj_xmmc,
|
||||
zj_xmzt,
|
||||
zj_sjyt,
|
||||
} = props.showInfoData;
|
||||
|
||||
const imageList = ref([]);
|
||||
|
||||
async function getCaseImgList(){
|
||||
imageList.value = await getLoadCaseImgList({caseid:id,category:'重点问题II类'});
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({
|
||||
caseid: props.showInfoData.id,
|
||||
category: '重点问题II类',
|
||||
});
|
||||
MapboxComponent.value.handlerLoadPictureAzimuth(imageList.value);
|
||||
|
||||
// 匹配去除无效图片
|
||||
|
|
@ -442,19 +365,17 @@
|
|||
// zhengshiImageList.push(imageList.value[index]);
|
||||
// }
|
||||
// })
|
||||
|
||||
}
|
||||
|
||||
function handlerDealFileName(path){
|
||||
function handlerDealFileName(path) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const matchStr = path.match(regex);
|
||||
if(matchStr?.length){
|
||||
if (matchStr?.length) {
|
||||
return matchStr[0];
|
||||
}
|
||||
}
|
||||
|
||||
function handlerPreviewImage(index,url){
|
||||
|
||||
function handlerPreviewImage(index, url) {
|
||||
const regex = /([^/\\]+)(?=\.[^/\\]*$|$)/;
|
||||
const match = url.match(regex);
|
||||
if (match) {
|
||||
|
|
@ -464,70 +385,66 @@
|
|||
|
||||
const isInitImageLisener = ref<Boolean>(false);
|
||||
// 监听预览图片地址变化进行箭头切换
|
||||
function handlerImageChange(e):void{
|
||||
if(e && !isInitImageLisener.value){
|
||||
setTimeout(function(){
|
||||
function handlerImageChange(e): void {
|
||||
if (e && !isInitImageLisener.value) {
|
||||
setTimeout(function () {
|
||||
const targetNode = document.getElementsByClassName('ant-image-preview-img');
|
||||
// 创建一个观察器实例，并传入回调函数
|
||||
const observer = new MutationObserver((mutationsList) => {
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if(targetNode[0].getAttribute(mutation.attributeName).match("http")){
|
||||
handlerPreviewImage(0,targetNode[0].getAttribute(mutation.attributeName))
|
||||
}
|
||||
}
|
||||
for (const mutation of mutationsList) {
|
||||
if (mutation.type === 'attributes') {
|
||||
if (targetNode[0].getAttribute(mutation.attributeName).match('http')) {
|
||||
handlerPreviewImage(0, targetNode[0].getAttribute(mutation.attributeName));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// 配置观察选项
|
||||
const config = { attributes: true };
|
||||
// 开始观察目标节点
|
||||
observer.observe(targetNode[0], config);
|
||||
isInitImageLisener.value = true;
|
||||
},250)
|
||||
}, 250);
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeMount(()=>{
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
const anjianzhaopianList = computed(() => {
|
||||
getCaseImgList();
|
||||
return anjianzhaopian ? anjianzhaopian.split(',') : [];
|
||||
return props.showInfoData.anjianzhaopian ? props.showInfoData.anjianzhaopian.split(',') : [];
|
||||
});
|
||||
const casepicList = computed(() => {
|
||||
return casepic ? casepic.split(',') : [];
|
||||
return props.showInfoData.casepic ? props.showInfoData.casepic.split(',') : [];
|
||||
});
|
||||
const chaichufugenghoupicList = computed(() => {
|
||||
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
|
||||
return props.showInfoData.chaichufugenghoupic
|
||||
? props.showInfoData.chaichufugenghoupic.split(',')
|
||||
: [];
|
||||
});
|
||||
const bubanzhaopianList = computed(() => {
|
||||
return bubanzhaopian ? bubanzhaopian.split(',') : [];
|
||||
return props.showInfoData.bubanzhaopian ? props.showInfoData.bubanzhaopian.split(',') : [];
|
||||
});
|
||||
const fujianList = computed(() => {
|
||||
return fujian ? fujian.split(',') : [];
|
||||
return props.showInfoData.fujian ? props.showInfoData.fujian.split(',') : [];
|
||||
});
|
||||
const hefafujianList = computed(() => {
|
||||
return hefafujian ? hefafujian.split(',') : [];
|
||||
return props.showInfoData.hefafujian ? props.showInfoData.hefafujian.split(',') : [];
|
||||
});
|
||||
const qitafujianList = computed(() => {
|
||||
return qitafujian ? qitafujian.split(',') : [];
|
||||
return props.showInfoData.qitafujian ? props.showInfoData.qitafujian.split(',') : [];
|
||||
});
|
||||
const zhenggaifujianList = computed(() => {
|
||||
return zhenggaifujian ? zhenggaifujian.split(',') : [];
|
||||
return props.showInfoData.zhenggaifujian ? props.showInfoData.zhenggaifujian.split(',') : [];
|
||||
});
|
||||
const yanshoubiaoList = computed(() => {
|
||||
return yanshoubiao ? yanshoubiao.split(',') : [];
|
||||
return props.showInfoData.yanshoubiao ? props.showInfoData.yanshoubiao.split(',') : [];
|
||||
});
|
||||
const wrjffzhaopianList = computed(() => {
|
||||
return wrjffzhaopian ? wrjffzhaopian.split(',') : [];
|
||||
return props.showInfoData.wrjffzhaopian ? props.showInfoData.wrjffzhaopian.split(',') : [];
|
||||
});
|
||||
const xchczhaopianList = computed(() => {
|
||||
return xchczhaopian ? xchczhaopian.split(',') : [];
|
||||
return props.showInfoData.xchczhaopian ? props.showInfoData.xchczhaopian.split(',') : [];
|
||||
});
|
||||
function onMapboxLoad() {
|
||||
changeTask();
|
||||
|
|
@ -543,7 +460,7 @@
|
|||
result = illegalTypeList;
|
||||
break;
|
||||
case 'measure_name':
|
||||
result = keyIssuesIIMeasureOptions
|
||||
result = keyIssuesIIMeasureOptions;
|
||||
break;
|
||||
case 'result_name':
|
||||
result = resultOptions;
|
||||
|
|
@ -556,9 +473,9 @@
|
|||
break;
|
||||
case 'qita_qksm':
|
||||
result = [
|
||||
{ label: '不存在经营', value: '1'},
|
||||
{ label: '已优化调整', value: '2'},
|
||||
]
|
||||
{ label: '不存在经营', value: '1' },
|
||||
{ label: '已优化调整', value: '2' },
|
||||
];
|
||||
}
|
||||
result.forEach((item) => {
|
||||
if (item.value == value) {
|
||||
|
|
@ -577,8 +494,6 @@
|
|||
key: null,
|
||||
};
|
||||
if (props.showInfoData.geomid) {
|
||||
|
||||
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
|
|
@ -604,27 +519,26 @@
|
|||
}
|
||||
}
|
||||
const downLoadFile = (url) => {
|
||||
if(url.indexOf('.pdf') !== -1){
|
||||
if (url.indexOf('.pdf') !== -1) {
|
||||
axios({
|
||||
method: 'get',
|
||||
url: `${VITE_GLOB_INFO_IMAGE_URL}/${url}`,
|
||||
responseType: 'blob',
|
||||
headers: {
|
||||
'Content-Disposition': 'inline',
|
||||
}
|
||||
},
|
||||
})
|
||||
.then(response => {
|
||||
let blob = new Blob([response.data], {type: 'application/pdf'});
|
||||
let url = window.URL.createObjectURL(blob)
|
||||
window.open(url);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
});
|
||||
}else{
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
.then((response) => {
|
||||
let blob = new Blob([response.data], { type: 'application/pdf' });
|
||||
let url = window.URL.createObjectURL(blob);
|
||||
window.open(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
} else {
|
||||
window.open(`${VITE_GLOB_INFO_IMAGE_URL}/${url}`, '_blank');
|
||||
}
|
||||
|
||||
};
|
||||
const getContainer = () => {
|
||||
return document.getElementById('info-container');
|
||||
|
|
@ -644,12 +558,12 @@
|
|||
}
|
||||
};
|
||||
const showImage = (url) => {
|
||||
if(url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1 ){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
if (url.indexOf('.png') !== -1 || url.indexOf('.jpg') !== -1 || url.indexOf('.jpeg') !== -1) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -677,14 +591,14 @@
|
|||
height: calc(100vh - 100px);
|
||||
margin-right: 20px;
|
||||
}
|
||||
:deep(.ant-image){
|
||||
:deep(.ant-image) {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-left){
|
||||
:deep(.ant-image-preview-switch-left) {
|
||||
position: absolute;
|
||||
}
|
||||
:deep(.ant-image-preview-switch-right){
|
||||
:deep(.ant-image-preview-switch-right) {
|
||||
position: absolute;
|
||||
}
|
||||
.info-container {
|
||||
|
|
@ -704,14 +618,14 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
.ant-image-preview-operations-operation{
|
||||
.ant-image-preview-operations-operation {
|
||||
// flex:1;
|
||||
}
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(1){
|
||||
.ant-image-preview-operations-operation:nth-last-child(1) {
|
||||
display: none;
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2){
|
||||
}
|
||||
.ant-image-preview-operations-operation:nth-last-child(2) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -116,6 +116,7 @@
|
|||
function handleExport(exportType) {
|
||||
console.log(searchParams);
|
||||
let params = { ...searchParams.value };
|
||||
params.limit = 9999;
|
||||
let url = '';
|
||||
let fileName = '';
|
||||
if (exportType == 'excel') {
|
||||
|
|
@ -180,7 +181,7 @@
|
|||
function getTableData(querys) {
|
||||
setLoading(true);
|
||||
getLoadMineralsLedger(querys).then((res) => {
|
||||
console.log(res)
|
||||
console.log(res);
|
||||
tableData.value = res.items;
|
||||
tablePaginationRight.value.total = res.total;
|
||||
setTableData(tableData.value);
|
||||
|
|
|
|||
|
|
@ -812,10 +812,6 @@
|
|||
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({});
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
|
||||
const props = defineProps(['id']);
|
||||
const activeKey = ref('1');
|
||||
|
||||
|
|
@ -824,6 +820,10 @@
|
|||
function getCaseInfo() {
|
||||
getCaseInfoById({ id: props.id }).then((res) => {
|
||||
caseInfo.value = res;
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
changeTask();
|
||||
});
|
||||
}
|
||||
watch(
|
||||
|
|
@ -839,7 +839,7 @@
|
|||
});
|
||||
const imageList = ref([]);
|
||||
async function getCaseImgList() {
|
||||
imageList.value = await getLoadCaseImgList({ caseid: props.id,category:'非法采矿工作管理' });
|
||||
imageList.value = await getLoadCaseImgList({ caseid: props.id, category: '非法采矿工作管理' });
|
||||
|
||||
// 匹配去除无效图片
|
||||
let zhengshiImageList = [];
|
||||
|
|
|
|||
|
|
@ -38,6 +38,9 @@
|
|||
<template v-if="['area', 'gengdiarea', 'nongyongdiarea'].includes(column.key)">
|
||||
{{ dataProcessingCount(record[column.key]) }}
|
||||
</template>
|
||||
<template v-if="column.key === 'hefapanding_fill'">
|
||||
{{ record.type_base == '加工'? record.hefapanding_jgfill: record.hefapanding_fill }}
|
||||
</template>
|
||||
<template v-if="column.key === 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
|
|
|
|||
|
|
@ -116,6 +116,7 @@
|
|||
function handleExport(exportType) {
|
||||
console.log(searchParams);
|
||||
let params = { ...searchParams.value };
|
||||
params.limit = 9999;
|
||||
let url = '';
|
||||
let fileName = '';
|
||||
if (exportType == 'excel') {
|
||||
|
|
|
|||
|
|
@ -89,10 +89,10 @@
|
|||
const { createMessage } = useMessage();
|
||||
|
||||
// 全屏------------------------------------------------------------
|
||||
const isFullScreen = ref<Boolean>(true);
|
||||
const isFullScreen = ref<Boolean>(false);
|
||||
const searchFormSchema = ref(searchFormSchema_map);
|
||||
const tableSpan = ref(0);
|
||||
const mapSpan = ref(24);
|
||||
const tableSpan = ref(12);
|
||||
const mapSpan = ref(12);
|
||||
|
||||
// 全屏
|
||||
function fullScreen() {
|
||||
|
|
@ -318,11 +318,22 @@
|
|||
coordinates: [parseFloat(st[0]), parseFloat(st[1])],
|
||||
},
|
||||
properties: {
|
||||
taskName: getTaskNameBytaskId(item.taskId) + item.uploadTime,
|
||||
id: item.id,
|
||||
path: item.path,
|
||||
// model: item.model,
|
||||
lng: parseFloat(st[0]),
|
||||
lat: parseFloat(st[1]),
|
||||
uploadTime: item.uploadTime,
|
||||
remark: item.remark,
|
||||
intact: item.intact,
|
||||
userId: item.userId,
|
||||
name: item.name,
|
||||
taskId: item.taskId,
|
||||
workPosition: item.workPosition,
|
||||
flyer: item.flyer,
|
||||
flyTime: item.flyTime,
|
||||
// taskName: taskName,
|
||||
taskName: getTaskNameBytaskId(item.taskId),
|
||||
// model: item.model,
|
||||
},
|
||||
};
|
||||
taskLayerGeoJson.features.push(feature);
|
||||
|
|
@ -403,15 +414,15 @@
|
|||
const modalImage = ref('');
|
||||
const visible = ref<boolean>(false);
|
||||
// 打开窗口
|
||||
const handleOpen = (path) => {
|
||||
const handleOpen = (properties) => {
|
||||
// modalOpen.value = true;
|
||||
setVisible(true);
|
||||
modalTitle.value = '';
|
||||
// 正则表达式验证函数
|
||||
if (isValidUrl(path)) {
|
||||
modalImage.value = path;
|
||||
if (isValidUrl(properties.path)) {
|
||||
modalImage.value = properties.path;
|
||||
} else {
|
||||
modalImage.value = VITE_GLOB_API_URL_VAR.value + path;
|
||||
modalImage.value = VITE_GLOB_API_URL_VAR.value + properties.path;
|
||||
}
|
||||
};
|
||||
// 关闭窗口
|
||||
|
|
|
|||
|
|
@ -48,25 +48,41 @@
|
|||
</a-tooltip>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="19">
|
||||
<a-col :span="19" @wheel.stop="handleScroll">
|
||||
<div class="timeBox">
|
||||
<a-slider
|
||||
v-model:value="nowValue"
|
||||
:tooltipOpen="true"
|
||||
:tooltipOpen="false"
|
||||
:tip-formatter="getValue"
|
||||
:marks="marks"
|
||||
:step="1"
|
||||
:max="maxDays"
|
||||
:min="1"
|
||||
:max="maxCount"
|
||||
@afterChange="sliderChange"
|
||||
>
|
||||
<template #mark="{ label, point }">
|
||||
<template v-if="label.slice(-2) == '01'">
|
||||
<span :style="{ color: 'white' }">{{ label }}</span>
|
||||
</template>
|
||||
<template v-if="label.slice(-4) == '1231'">
|
||||
<span :style="{ color: 'white' }">{{ label }}</span>
|
||||
</template>
|
||||
<span
|
||||
:style="{
|
||||
color: 'white',
|
||||
position: 'relative',
|
||||
right: `${30}px`,
|
||||
}"
|
||||
>
|
||||
<template v-if="bottomPoint.includes(point)">
|
||||
{{ label.slice(0, 6) }}
|
||||
</template>
|
||||
</span>
|
||||
<span
|
||||
:style="{
|
||||
color: 'red',
|
||||
position: 'relative',
|
||||
bottom: `${30 * countLines(label)}px`,
|
||||
}"
|
||||
>
|
||||
<template v-if="topPoint.includes(point)">
|
||||
{{ label }}
|
||||
</template>
|
||||
</span>
|
||||
</template>
|
||||
</a-slider>
|
||||
</div>
|
||||
|
|
@ -80,49 +96,145 @@
|
|||
import { ref, watch, computed, onBeforeMount, onMounted, onBeforeUpdate, onUpdated } from 'vue';
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import dayjs from 'dayjs';
|
||||
import { GeoTiffManagerLoadPage } from '@/api/demo/system';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
|
||||
const emit = defineEmits(['handleNowValueChange']);
|
||||
|
||||
const nowValue = ref<number>(parseInt(dayjs().dayOfYear()));
|
||||
const marks = ref<Record<number, any>>();
|
||||
const maxDays = ref(365);
|
||||
const nowValue = ref<number>(0);
|
||||
const maxCount = ref(365);
|
||||
const marks: any = ref<Record<number, any>>();
|
||||
const allDays: any = ref<Record<number, any>>();
|
||||
let allDaysValue: any = {};
|
||||
const sliderValue: any = ref({});
|
||||
let allSliderValue: any = {};
|
||||
const topPoint = ref([]);
|
||||
const bottomPoint = ref([]);
|
||||
|
||||
const calculateDayOfYearAndDates = (time) => {
|
||||
const startDate = dayjs(time).startOf('year');
|
||||
const endDate = dayjs(time).endOf('year');
|
||||
// 初始化 marks 为空对象
|
||||
marks.value = {};
|
||||
maxDays.value = parseInt(endDate.dayOfYear());
|
||||
for (
|
||||
let currentDate = startDate;
|
||||
currentDate.isBefore(endDate);
|
||||
currentDate = currentDate.add(1, 'day')
|
||||
) {
|
||||
const dayOfYear = parseInt(currentDate.dayOfYear());
|
||||
const dateString = currentDate.format('YYYYMMDD');
|
||||
marks.value[dayOfYear] = dateString;
|
||||
watch(
|
||||
() => allDays.value,
|
||||
() => {
|
||||
marks.value = {};
|
||||
topPoint.value = [];
|
||||
bottomPoint.value = [];
|
||||
|
||||
if (allDays.value) {
|
||||
for (const key in allDays.value) {
|
||||
if (allDays.value.hasOwnProperty(key)) {
|
||||
const dateString = allDays.value[key];
|
||||
// 是否是月底
|
||||
if (isLastDayOfMonth(dateString)) {
|
||||
marks.value[parseInt(key)] = allDays.value[parseInt(key)];
|
||||
bottomPoint.value.push(parseInt(key));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (sliderValue.value) {
|
||||
sliderValue.value.forEach((item) => {
|
||||
// console.log(item);
|
||||
// const key = getKeyByDate(dayjs(item.createTime).format('YYYYMMDD'));
|
||||
const key = getKeyByDate(item.dateDir);
|
||||
if (key) {
|
||||
if (marks.value[key] == undefined) {
|
||||
marks.value[key] = item.layerName;
|
||||
} else {
|
||||
marks.value[key] = marks.value[key] + '\n' + item.layerName;
|
||||
}
|
||||
topPoint.value.push(parseInt(key));
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
// immediate: true,
|
||||
},
|
||||
);
|
||||
|
||||
// 是否是月底
|
||||
function isLastDayOfMonth(dateStr) {
|
||||
const date = dayjs(dateStr, 'YYYYMMDD');
|
||||
const lastDayOfMonth = date.endOf('month'); // 获取当月最后一天
|
||||
return date.isSame(lastDayOfMonth, 'day');
|
||||
}
|
||||
|
||||
function getKeyByDate(dateString) {
|
||||
for (const key in allDays.value) {
|
||||
if (allDays.value.hasOwnProperty(key)) {
|
||||
if (allDays.value[key] === dateString) {
|
||||
return key;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
return null; // 如果找不到对应的日期字符串，则返回 null
|
||||
}
|
||||
|
||||
function countLines(str) {
|
||||
// 使用 \n 作为换行符
|
||||
const lines = str.split('\n');
|
||||
return lines.length;
|
||||
}
|
||||
|
||||
const getValue = (key: number) => {
|
||||
if (marks.value) {
|
||||
return marks.value[key];
|
||||
} else {
|
||||
return key;
|
||||
// } else if (allDays.value.hasOwnProperty(key)) {
|
||||
// return allDays.value[key];
|
||||
// } else {
|
||||
// return key;
|
||||
}
|
||||
};
|
||||
|
||||
// 发生改变
|
||||
const sliderChange = (key: number) => {
|
||||
emit('handleNowValueChange', [dayjs(getValue(1)), dayjs(getValue(nowValue.value))]);
|
||||
playSwitch.value = false;
|
||||
// emit('handleNowValueChange', [getValue(0), getValue(nowValue.value)]);
|
||||
};
|
||||
|
||||
// 鼠标滚动
|
||||
const handleScroll = (event) => {
|
||||
event.preventDefault(); // 阻止默认行为
|
||||
// console.log('滚动事件触发:', event.deltaY);
|
||||
// 上滚
|
||||
if (event.deltaY < 0) {
|
||||
// 进度条数据keys
|
||||
const keys = Object.keys(allDays.value);
|
||||
// console.log(parseInt(keys));
|
||||
// console.log(Object.keys(allDaysValue).length);
|
||||
if (parseInt(keys) + 2 <= Object.keys(allDaysValue).length) {
|
||||
for (const index in allDays.value) {
|
||||
const item = allDays.value[index];
|
||||
if (allDays.value[keys[0]] == item && allDaysValue[parseInt(index) - 1]) {
|
||||
allDays.value[parseInt(index) - 1] = allDaysValue[parseInt(index) - 1];
|
||||
maxCount.value = maxCount.value + 1;
|
||||
}
|
||||
if (allDays.value[keys[keys.length - 1]] == item && allDaysValue[parseInt(index) + 1]) {
|
||||
allDays.value[parseInt(index) + 1] = allDaysValue[parseInt(index) + 1];
|
||||
maxCount.value = maxCount.value + 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 下滚
|
||||
if (event.deltaY > 0) {
|
||||
const keys = Object.keys(allDays.value);
|
||||
if (keys.length > 2) {
|
||||
// 删除最后一个键值对
|
||||
// const lastKey = keys[keys.length - 1];
|
||||
// delete allDays.value[lastKey];
|
||||
// 删除第一个键值对
|
||||
const firstKey = keys[0];
|
||||
delete allDays.value[firstKey];
|
||||
maxCount.value = maxCount.value - 2;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 播放/暂停
|
||||
const playSwitch = ref(false);
|
||||
const handlePlay = () => {
|
||||
playSwitch.value = !playSwitch.value;
|
||||
if (playSwitch.value && nowValue.value < maxDays.value) {
|
||||
if (playSwitch.value && nowValue.value < maxCount.value) {
|
||||
addValue();
|
||||
}
|
||||
};
|
||||
|
|
@ -131,8 +243,8 @@
|
|||
// console.log(playSwitch.value);
|
||||
if (playSwitch.value) {
|
||||
setTimeout(() => {
|
||||
nowValue.value = parseInt(dayjs(getValue(nowValue.value)).add(15, 'day').dayOfYear());
|
||||
emit('handleNowValueChange', [dayjs(getValue(1)), dayjs(getValue(nowValue.value))]);
|
||||
nowValue.value += 1;
|
||||
emit('handleNowValueChange', [getValue(0), getValue(nowValue.value)]);
|
||||
addValue();
|
||||
}, 3000);
|
||||
}
|
||||
|
|
@ -193,14 +305,43 @@
|
|||
return (y % 4 === 0 && y % 100 !== 0) || y % 400 === 0;
|
||||
}
|
||||
|
||||
async function fetch() {
|
||||
// 历史影像
|
||||
GeoTiffManagerLoadPage({
|
||||
page: 1,
|
||||
limit: 1000000,
|
||||
}).then((res) => {
|
||||
console.log(res.items);
|
||||
allSliderValue = res.items;
|
||||
sliderValue.value = res.items;
|
||||
|
||||
const startDate = dayjs().startOf('year');
|
||||
const endDate = dayjs().endOf('year');
|
||||
// 初始化 marks 为空对象
|
||||
allDaysValue = {};
|
||||
allDays.value = {};
|
||||
maxCount.value = parseInt(endDate.dayOfYear());
|
||||
for (
|
||||
let currentDate = startDate;
|
||||
currentDate.isBefore(endDate);
|
||||
currentDate = currentDate.add(1, 'day')
|
||||
) {
|
||||
const dayOfYear = parseInt(currentDate.dayOfYear());
|
||||
const dateString = currentDate.format('YYYYMMDD');
|
||||
allDaysValue[dayOfYear] = dateString;
|
||||
}
|
||||
allDays.value = cloneDeep(allDaysValue);
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
calculateDayOfYearAndDates(dayjs());
|
||||
fetch();
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.timeBox {
|
||||
position: relative;
|
||||
top: 40px;
|
||||
top: 60px;
|
||||
width: 900px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,12 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="case-tree-container">
|
||||
<div class="switch-button-open" @click="handlerOpen" v-if="!isOpen">
|
||||
<img src="/statistical/switch-button.png" />
|
||||
</div>
|
||||
<div class="switch-button-close" @click="handlerOpen" v-if="isOpen">
|
||||
<img src="/statistical/switch-button-active.png" />
|
||||
</div>
|
||||
<div class="case-tree-container" v-if="!isOpen">
|
||||
<div class="title"> 图层列表 </div>
|
||||
<div class="case-tree">
|
||||
<a-directory-tree
|
||||
|
|
@ -38,20 +44,34 @@
|
|||
</a-modal> -->
|
||||
<a-image
|
||||
:width="200"
|
||||
:style="{ display: 'none' }"
|
||||
:style="{ display: 'none', zIndex: 1082 }"
|
||||
:preview="{
|
||||
visible,
|
||||
onVisibleChange: setVisible,
|
||||
}"
|
||||
:src="modalImage"
|
||||
:src="modalImage.path"
|
||||
/>
|
||||
<div class="leftOutlined" :style="{ zIndex: 1082000000 }" v-if="visible && beforeImageVif">
|
||||
<LeftOutlined :style="{ fontSize: '30px' }" @click="beforeImage" />
|
||||
</div>
|
||||
<div class="rightOutlined" :style="{ zIndex: 1082 }" v-if="visible && afterImageVif">
|
||||
<RightOutlined :style="{ fontSize: '30px' }" @click="afterImage" />
|
||||
</div>
|
||||
<div class="footer" :style="{ zIndex: 1082 }" v-if="visible">
|
||||
<span class="info-item">飞手名：{{ modalImage.flyer }}</span>
|
||||
<span class="info-item">飞行时间：{{ modalImage.flyTime }}</span>
|
||||
<span class="info-item">任务名称：{{ modalImage.taskName }}</span>
|
||||
<span class="info-item">任务位置：{{ modalImage.workPosition }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, onMounted } from 'vue';
|
||||
import { BasicTree, TreeItem, TreeActionType } from '@/components/Tree';
|
||||
import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
|
||||
import type { TreeProps } from 'ant-design-vue';
|
||||
|
||||
// vben
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
// 组件
|
||||
|
|
@ -130,16 +150,46 @@
|
|||
pageIndex: 1,
|
||||
pageSize: 10000,
|
||||
}).then((res) => {
|
||||
console.log(135, res.items);
|
||||
// 初始化
|
||||
tableData3_tupian = [];
|
||||
treeData.value[2].children = [];
|
||||
// 航飞图片-第二层
|
||||
let taskDateArray: any = [];
|
||||
res.items.forEach((item) => {
|
||||
taskDateArray.push({
|
||||
key: item.taskDate,
|
||||
});
|
||||
});
|
||||
const uniqueKeysArray = Array.from(new Set(taskDateArray.map((item) => item.key)));
|
||||
uniqueKeysArray.forEach((array) => {
|
||||
treeData.value[2].children.push({
|
||||
key: array,
|
||||
title: array,
|
||||
children: [],
|
||||
});
|
||||
});
|
||||
// 航飞图片-第三层
|
||||
res.items.forEach((item1) => {
|
||||
treeData.value[2].children.forEach((item2) => {
|
||||
if (item1.taskDate === item2.key) {
|
||||
item2.children.push({
|
||||
key: item1.id,
|
||||
title: item1.workPosition + '_' + item1.flyer + ' (' + item1.imageCount + ')',
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 航飞图片-任务数据初始化用于左侧树复选时使用
|
||||
tableData3 = res.items;
|
||||
res.items.forEach((item) => {
|
||||
tableData3_id_list.push(item.id);
|
||||
});
|
||||
tableData3_tupian = [];
|
||||
treeData.value[2].children = [];
|
||||
res.items.forEach((item1) => {
|
||||
if (item1.imageCount > 0) {
|
||||
// 航飞图片-任务
|
||||
let children: any = [];
|
||||
AchievementManageListDroneShpImageexif({
|
||||
pageIndex: 1,
|
||||
pageSize: item1.imageCount,
|
||||
|
|
@ -147,22 +197,7 @@
|
|||
}).then((res2) => {
|
||||
res2.items.forEach((item2) => {
|
||||
tableData3_tupian.push(item2);
|
||||
children.push({
|
||||
key: item2.id,
|
||||
title: item2.uploadTime,
|
||||
});
|
||||
});
|
||||
// 添加进树里
|
||||
treeData.value[2].children.push({
|
||||
key: item1.id,
|
||||
title: item1.taskName + '(' + item1.imageCount + ')',
|
||||
children: children,
|
||||
});
|
||||
});
|
||||
} else {
|
||||
treeData.value[2].children.push({
|
||||
key: item1.id,
|
||||
title: item1.taskName + '(' + item1.imageCount + ')',
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
@ -199,15 +234,17 @@
|
|||
};
|
||||
// 树复选框选中
|
||||
const onCheck: TreeProps['onCheck'] = (checkedKeys) => {
|
||||
console.log(checkedKeys);
|
||||
// console.log(checkedKeys);
|
||||
checkedKeys_now = checkedKeys;
|
||||
let filter_tuceng: any = [];
|
||||
let filter_yingxiang: any = [];
|
||||
let filter_hangfei: any = [];
|
||||
|
||||
mapboxComponentRef.value.clearTaskLayer('GeoserverManagementRaster');
|
||||
mapboxComponentRef.value.clearTaskLayer('GeoTiffManagerRaster');
|
||||
mapboxComponentRef.value.clearTaskLayer('AchievementManageRaster');
|
||||
if (checkedKeys.length == 0) {
|
||||
mapboxComponentRef.value.clearTaskLayer('GeoserverManagementRaster');
|
||||
mapboxComponentRef.value.clearTaskLayer('GeoTiffManagerRaster');
|
||||
mapboxComponentRef.value.clearTaskLayer('AchievementManageRaster');
|
||||
}
|
||||
|
||||
checkedKeys_now.forEach((checkedKey) => {
|
||||
if (!['1', '2', '3'].includes(checkedKey)) {
|
||||
|
|
@ -216,12 +253,12 @@
|
|||
tableData1.forEach((data) => {
|
||||
if (checkedKey == data.id) {
|
||||
// 时间轴筛选数据
|
||||
if (
|
||||
dayjs(startTime).isBefore(data.createTime) &&
|
||||
dayjs(endTime).isAfter(data.createTime)
|
||||
) {
|
||||
filter_tuceng.push(data);
|
||||
}
|
||||
// if (
|
||||
// dayjs(startTime).isBefore(data.createTime) &&
|
||||
// dayjs(endTime).isAfter(data.createTime)
|
||||
// ) {
|
||||
filter_tuceng.push(data);
|
||||
// }
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -230,56 +267,58 @@
|
|||
tableData2.forEach((data) => {
|
||||
if (checkedKey == data.id) {
|
||||
// 时间轴筛选数据
|
||||
if (
|
||||
dayjs(startTime).isBefore(data.createTime) &&
|
||||
dayjs(endTime).isAfter(data.createTime)
|
||||
) {
|
||||
filter_yingxiang.push(data);
|
||||
// if (
|
||||
// dayjs(startTime).isBefore(data.createTime) &&
|
||||
// dayjs(endTime).isAfter(data.createTime)
|
||||
// ) {
|
||||
filter_yingxiang.push(data);
|
||||
// }
|
||||
}
|
||||
});
|
||||
}
|
||||
// 航飞图片-图层
|
||||
else if (tableData3_id_list.includes(checkedKey)) {
|
||||
tableData3.forEach((data) => {
|
||||
if (checkedKey == data.id) {
|
||||
if (data.imageCount > 0) {
|
||||
tableData3_tupian.forEach((tupian) => {
|
||||
if (tupian.taskId == data.id) {
|
||||
// 时间轴筛选数据
|
||||
// if (
|
||||
// dayjs(startTime).isBefore(tupian.uploadTime) &&
|
||||
// dayjs(endTime).isAfter(tupian.uploadTime)
|
||||
// ) {
|
||||
filter_hangfei.push(tupian);
|
||||
// }
|
||||
}
|
||||
});
|
||||
} else {
|
||||
createMessage.info('当前选中的任务并无航飞图片');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// // 航飞图片-图层
|
||||
// else if (tableData3_id_list.includes(checkedKey)) {
|
||||
// tableData3.forEach((data) => {
|
||||
// if (checkedKey == data.id) {
|
||||
// if (data.imageCount > 0) {
|
||||
// tableData3_tupian.forEach((tupian) => {
|
||||
// if (tupian.taskId == data.id) {
|
||||
// // 时间轴筛选数据
|
||||
// if (
|
||||
// dayjs(startTime).isBefore(tupian.uploadTime) &&
|
||||
// dayjs(endTime).isAfter(tupian.uploadTime)
|
||||
// ) {
|
||||
// filter_hangfei.push(tupian);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// } else {
|
||||
// createMessage.info('当前选中的任务并无航飞图片');
|
||||
// 航飞图片-任务
|
||||
// else {
|
||||
// let filter = tableData3_tupian.filter((item) => item.id == checkedKey);
|
||||
// filter?.forEach((f) => {
|
||||
// if (!filter_hangfei.includes(f)) {
|
||||
// if (dayjs(startTime).isBefore(f.uploadTime) && dayjs(endTime).isAfter(f.uploadTime)) {
|
||||
// filter_hangfei.push(f);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// 航飞图片-任务
|
||||
else {
|
||||
let filter = tableData3_tupian.filter((item) => item.id == checkedKey);
|
||||
filter?.forEach((f) => {
|
||||
if (!filter_hangfei.includes(f)) {
|
||||
if (dayjs(startTime).isBefore(f.uploadTime) && dayjs(endTime).isAfter(f.uploadTime)) {
|
||||
filter_hangfei.push(f);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
// 图层管理
|
||||
if (filter_tuceng.length > 0) {
|
||||
mapboxComponentRef.value.GeoserverManagementRaster(
|
||||
filter_tuceng,
|
||||
[118.30207505530701, 35.30123435040745],
|
||||
7.848587811931849,
|
||||
// [118.30207505530701, 35.30123435040745],
|
||||
// 7.848587811931849,
|
||||
null,
|
||||
null,
|
||||
);
|
||||
}
|
||||
// 影像管理
|
||||
|
|
@ -322,11 +361,22 @@
|
|||
coordinates: [parseFloat(st[0]), parseFloat(st[1])],
|
||||
},
|
||||
properties: {
|
||||
taskName: getTaskNameBytaskId(item.taskId) + item.uploadTime,
|
||||
id: item.id,
|
||||
path: item.path,
|
||||
// model: item.model,
|
||||
lng: parseFloat(st[0]),
|
||||
lat: parseFloat(st[1]),
|
||||
uploadTime: item.uploadTime,
|
||||
remark: item.remark,
|
||||
intact: item.intact,
|
||||
userId: item.userId,
|
||||
name: item.name,
|
||||
taskId: item.taskId,
|
||||
workPosition: item.workPosition,
|
||||
flyer: item.flyer,
|
||||
flyTime: item.flyTime,
|
||||
// taskName: taskName,
|
||||
taskName: getTaskNameBytaskId(item.taskId),
|
||||
// model: item.model,
|
||||
},
|
||||
};
|
||||
taskLayerGeoJson.features.push(feature);
|
||||
|
|
@ -339,7 +389,7 @@
|
|||
7.848587811931849,
|
||||
);
|
||||
}
|
||||
|
||||
// 投影坐标系=>地理坐标系
|
||||
function isProjectedCoordinates(x, y) {
|
||||
// 检查是否在地理坐标系的范围内
|
||||
const isGeoXInRange = -180 <= x && x <= 180;
|
||||
|
|
@ -362,23 +412,27 @@
|
|||
let resultName = '';
|
||||
tableData3.forEach((element) => {
|
||||
if (element.id == taskid) {
|
||||
resultName = element.taskName + '(' + element.flyer + ')';
|
||||
resultName = element.taskName;
|
||||
}
|
||||
});
|
||||
if (resultName) {
|
||||
return resultName + '\n';
|
||||
} else {
|
||||
return resultName;
|
||||
}
|
||||
return resultName;
|
||||
}
|
||||
|
||||
// 时间轴发生改变返回值
|
||||
function handleNowValueChange(value) {
|
||||
startTime = dayjs(value[0]).startOf('year').format('YYYY-MM-DD HH:mm:ss');
|
||||
endTime = dayjs(value[1]).endOf('day').format('YYYY-MM-DD HH:mm:ss');
|
||||
// console.log(421, value);
|
||||
|
||||
// startTime = dayjs(value[0]).startOf('year').format('YYYY-MM-DD HH:mm:ss');
|
||||
// endTime = dayjs(value[1]).endOf('day').format('YYYY-MM-DD HH:mm:ss');
|
||||
onCheck(checkedKeys_now);
|
||||
}
|
||||
|
||||
// 图层列表收起放出
|
||||
const isOpen = ref(false);
|
||||
function handlerOpen() {
|
||||
isOpen.value = !isOpen.value;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetch();
|
||||
});
|
||||
|
|
@ -387,29 +441,94 @@
|
|||
// 窗口
|
||||
// const modalOpen = ref(false);
|
||||
const modalTitle = ref('');
|
||||
const modalImage = ref('');
|
||||
const modalImage: any = ref({});
|
||||
const visible = ref<boolean>(false);
|
||||
// 打开窗口
|
||||
const handleOpen = (path) => {
|
||||
const handleOpen = (properties) => {
|
||||
console.log(444, properties);
|
||||
// modalOpen.value = true;
|
||||
setVisible(true);
|
||||
modalTitle.value = '';
|
||||
// 正则表达式验证函数
|
||||
if (isValidUrl(path)) {
|
||||
modalImage.value = path;
|
||||
modalImage.value = properties;
|
||||
if (isValidUrl(properties.path)) {
|
||||
modalImage.value.path = properties.path;
|
||||
} else {
|
||||
modalImage.value = VITE_GLOB_API_URL_VAR.value + path;
|
||||
modalImage.value.path = VITE_GLOB_API_URL_VAR.value + properties.path;
|
||||
}
|
||||
};
|
||||
// 关闭窗口
|
||||
const handleCancel = () => {
|
||||
// modalOpen.value = false;
|
||||
setVisible(false);
|
||||
modalTitle.value = '';
|
||||
modalImage.value = '';
|
||||
};
|
||||
const beforeImageVif = ref(false);
|
||||
const afterImageVif = ref(false);
|
||||
let nowImgs: any = [];
|
||||
// 上一张
|
||||
function beforeImage() {
|
||||
for (let index = 0; index < nowImgs.length; index++) {
|
||||
const item = nowImgs[index];
|
||||
if (item.id == modalImage.value.id) {
|
||||
modalImage.value = nowImgs[index - 1];
|
||||
if (isValidUrl(modalImage.value.path)) {
|
||||
modalImage.value.path = modalImage.value.path;
|
||||
} else {
|
||||
modalImage.value.path = VITE_GLOB_API_URL_VAR.value + modalImage.value.path;
|
||||
}
|
||||
if (index == 1) {
|
||||
beforeImageVif.value = false;
|
||||
}
|
||||
afterImageVif.value = true;
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 下一张
|
||||
function afterImage() {
|
||||
for (let index = 0; index < nowImgs.length; index++) {
|
||||
const item = nowImgs[index];
|
||||
if (item.id == modalImage.value.id) {
|
||||
modalImage.value = nowImgs[index + 1];
|
||||
if (isValidUrl(modalImage.value.path)) {
|
||||
modalImage.value.path = modalImage.value.path;
|
||||
} else {
|
||||
modalImage.value.path = VITE_GLOB_API_URL_VAR.value + modalImage.value.path;
|
||||
}
|
||||
if (index == nowImgs.length - 2) {
|
||||
afterImageVif.value = false;
|
||||
}
|
||||
beforeImageVif.value = true;
|
||||
return;
|
||||
}
|
||||
}
|
||||
// setVisible(true);
|
||||
}
|
||||
|
||||
// // 关闭窗口
|
||||
// const handleCancel = () => {
|
||||
// // modalOpen.value = false;
|
||||
// setVisible(false);
|
||||
// modalTitle.value = '';
|
||||
// modalImage.value = '';
|
||||
// };
|
||||
const setVisible = (value): void => {
|
||||
visible.value = value;
|
||||
setTimeout(() => {
|
||||
nowImgs = tableData3_tupian.filter((f) => {
|
||||
return f.taskId == modalImage.value.taskId;
|
||||
});
|
||||
nowImgs?.forEach((item, index) => {
|
||||
if (item.id == modalImage.value.id) {
|
||||
console.log(index);
|
||||
if (index != 0) {
|
||||
beforeImageVif.value = true;
|
||||
} else {
|
||||
beforeImageVif.value = false;
|
||||
}
|
||||
if (index != nowImgs.length - 1) {
|
||||
afterImageVif.value = true;
|
||||
} else {
|
||||
afterImageVif.value = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
}, 500);
|
||||
};
|
||||
// 正则表达式验证函数
|
||||
function isValidUrl(url: string): boolean {
|
||||
|
|
@ -425,13 +544,13 @@
|
|||
}
|
||||
.case-tree-container {
|
||||
width: 360px;
|
||||
height: 720px;
|
||||
height: calc(100vh - 180px);
|
||||
position: absolute;
|
||||
background: #041b36;
|
||||
color: #155dd8;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
left: 25px;
|
||||
}
|
||||
|
||||
.title {
|
||||
|
|
@ -466,4 +585,87 @@
|
|||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 60px / 60px;
|
||||
}
|
||||
|
||||
.switch-button-open {
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.switch-button-close {
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: 50%;
|
||||
z-index: 999;
|
||||
transform: translate(0, -50%);
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
z-index: 1082;
|
||||
width: 100%;
|
||||
font-size: 40px;
|
||||
bottom: 0px;
|
||||
height: 100px;
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.info-item {
|
||||
color: #ffffff;
|
||||
flex-basis: calc(50% - 10px); /* 每个 span 占据一半的宽度减去一定的间隔 */
|
||||
}
|
||||
|
||||
.leftOutlined {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
z-index: 1082;
|
||||
left: 0px;
|
||||
color: #ffffff;
|
||||
background-color: gray; /* 默认灰色背景 */
|
||||
border-radius: 50%; /* 圆形 */
|
||||
padding: 10px; /* 内边距 */
|
||||
margin: 5px; /* 外边距 */
|
||||
transition: background-color 0.3s ease; /* 平滑过渡 */
|
||||
cursor: pointer; /* 鼠标指针变为手型 */
|
||||
}
|
||||
|
||||
.rightOutlined {
|
||||
position: absolute;
|
||||
z-index: 1082;
|
||||
top: 40%;
|
||||
right: 0px;
|
||||
color: #ffffff;
|
||||
background-color: gray; /* 默认灰色背景 */
|
||||
border-radius: 50%; /* 圆形 */
|
||||
padding: 10px; /* 内边距 */
|
||||
margin: 5px; /* 外边距 */
|
||||
transition: background-color 0.3s ease; /* 平滑过渡 */
|
||||
cursor: pointer; /* 鼠标指针变为手型 */
|
||||
}
|
||||
|
||||
.leftOutlined:hover {
|
||||
background-color: black; /* 鼠标悬停时背景颜色变为黑色 */
|
||||
}
|
||||
.rightOutlined:hover {
|
||||
background-color: black; /* 鼠标悬停时背景颜色变为黑色 */
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -40,6 +40,7 @@
|
|||
GeoTiffManagerLoadPage,
|
||||
GeoTiffManagerGet,
|
||||
} from '@/api/demo/system';
|
||||
import proj4 from 'proj4';
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
|
||||
|
|
@ -81,11 +82,35 @@
|
|||
function handRowClick(record) {
|
||||
let bbox = getBboxFromUrl(record.accessUrl);
|
||||
let lngLat = getCenterPoint(bbox);
|
||||
console.log(lngLat);
|
||||
// 检测坐标系
|
||||
const result = isProjectedCoordinates(parseFloat(lngLat[0]), parseFloat(lngLat[1]));
|
||||
if (result) {
|
||||
lngLat[0] = result[0];
|
||||
lngLat[1] = result[1];
|
||||
}
|
||||
let chooseRows: any = [];
|
||||
chooseRows.push(record);
|
||||
mapboxComponent.value.GeoTiffManagerRaster(chooseRows, lngLat, 11);
|
||||
}
|
||||
|
||||
function isProjectedCoordinates(x, y) {
|
||||
// 检查是否在地理坐标系的范围内
|
||||
const isGeoXInRange = -180 <= x && x <= 180;
|
||||
const isGeoYInRange = -90 <= y && y <= 90;
|
||||
// 定义坐标系
|
||||
const fromCrs = 'EPSG:3857'; // 假设输入坐标是 Web Mercator
|
||||
const toCrs = 'EPSG:4326'; // 目标坐标系是地理坐标系
|
||||
// 如果不在地理坐标系范围内，则认为是投影坐标系
|
||||
if (!isGeoXInRange || !isGeoYInRange) {
|
||||
// 转换坐标
|
||||
const transformer = Transformer.fromCrs(fromCrs, toCrs);
|
||||
return transformer.transform([x, y]);
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// 从参数中获取 bbox 的值
|
||||
function getBboxFromUrl(url) {
|
||||
const urlObj = new URL(url);
|
||||
|
|
|
|||
|
|
@ -119,6 +119,11 @@
|
|||
}
|
||||
if (layerName && map.getLayer(layerName)) {
|
||||
map.moveLayer(layerName, '');
|
||||
if (layerName == 'GeoserverManagementRaster') {
|
||||
if (map.getLayer('countyLayer')) {
|
||||
map.moveLayer('countyLayer', 'GeoserverManagementRaster');
|
||||
}
|
||||
}
|
||||
if (layerName == 'AchievementManageRaster') {
|
||||
if (map.getLayer('clusters')) {
|
||||
map.moveLayer('AchievementManageRaster', 'clusters');
|
||||
|
|
@ -186,6 +191,11 @@
|
|||
}
|
||||
if (layerName && map.getLayer(layerName)) {
|
||||
map.moveLayer(layerName, '');
|
||||
if (layerName == 'GeoserverManagementRaster') {
|
||||
if (map.getLayer('streetLayer')) {
|
||||
map.moveLayer('streetLayer', 'GeoserverManagementRaster');
|
||||
}
|
||||
}
|
||||
if (layerName == 'AchievementManageRaster') {
|
||||
if (map.getLayer('clusters')) {
|
||||
map.moveLayer('AchievementManageRaster', 'clusters');
|
||||
|
|
@ -202,9 +212,9 @@
|
|||
};
|
||||
|
||||
// 图层管理-图层
|
||||
function GeoserverManagementRaster(chooseRows, lngLat, zoom) {
|
||||
function GeoserverManagementRaster(chooseRows, lngLat, zoom, epsg) {
|
||||
// 清除图层
|
||||
// clearTaskLayer('GeoserverManagementRaster');
|
||||
clearTaskLayer('GeoserverManagementRaster');
|
||||
// 县区边界
|
||||
if (!map.getLayer('streetLayer')) {
|
||||
handlerDealStreet('GeoserverManagementRaster');
|
||||
|
|
@ -212,41 +222,38 @@
|
|||
if (!map.getLayer('countyLayer')) {
|
||||
handlerDealCountry('GeoserverManagementRaster');
|
||||
}
|
||||
handlerLocation(lngLat, zoom);
|
||||
if (lngLat && zoom) {
|
||||
handlerLocation(lngLat, zoom);
|
||||
}
|
||||
|
||||
let tiles: any = [];
|
||||
chooseRows.forEach((chooseRow) => {
|
||||
let format =
|
||||
chooseRow.dataType == '点' || chooseRow.dataType == '面'
|
||||
? '&format=application/openlayers'
|
||||
: '&format=image/png&TRANSPARENT=TRUE';
|
||||
let tile =
|
||||
'http://192.168.10.131:8080/geoserver/my_workspace/wms?service=WMS&version=1.1.0&request=GetMap&layers=my_workspace:' +
|
||||
chooseRow.dataTable +
|
||||
'&styles=&bbox={bbox-epsg-3857}&width=768&height=619&srs=' +
|
||||
chooseRow.spatialRef +
|
||||
format;
|
||||
// let tile =
|
||||
// 'http://221.2.83.254:9007/geoserver/ksp/wms?service=WMS&version=1.1.0&request=GetMap&layers=ksp:linqubianyaqi&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE&cql_filter=is_del%20=0';
|
||||
'&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857' +
|
||||
'&format=image/png&TRANSPARENT=TRUE';
|
||||
tiles.push(tile);
|
||||
});
|
||||
|
||||
if (map.getSource('GeoserverManagementRaster' + 'wmsSource')) {
|
||||
map.getSource('GeoserverManagementRaster' + 'wmsSource').setData(tiles);
|
||||
} else {
|
||||
map.addSource('GeoserverManagementRaster' + 'wmsSource', {
|
||||
type: 'raster',
|
||||
tiles: tiles,
|
||||
tileSize: 256,
|
||||
});
|
||||
map.addLayer({
|
||||
id: 'GeoserverManagementRaster',
|
||||
type: 'raster',
|
||||
source: 'GeoserverManagementRaster' + 'wmsSource',
|
||||
layout: {
|
||||
visibility: 'visible',
|
||||
},
|
||||
});
|
||||
map.addSource('GeoserverManagementRaster' + 'wmsSource', {
|
||||
type: 'raster',
|
||||
tiles: tiles,
|
||||
tileSize: 256,
|
||||
});
|
||||
map.addLayer({
|
||||
id: 'GeoserverManagementRaster',
|
||||
type: 'raster',
|
||||
source: 'GeoserverManagementRaster' + 'wmsSource',
|
||||
layout: {
|
||||
visibility: 'visible',
|
||||
},
|
||||
});
|
||||
if (map.getLayer('streetLayer')) {
|
||||
map.moveLayer('streetLayer', 'GeoserverManagementRaster');
|
||||
}
|
||||
if (map.getLayer('countyLayer')) {
|
||||
map.moveLayer('countyLayer', 'GeoserverManagementRaster');
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -265,13 +272,10 @@
|
|||
|
||||
let tiles: any = [];
|
||||
chooseRows.forEach((chooseRow) => {
|
||||
// tiles.push(
|
||||
// chooseRow.accessUrl.replace(
|
||||
// '&format=application/openlayers',
|
||||
// '&format=image/png&TRANSPARENT=TRUE',
|
||||
// ),
|
||||
// );
|
||||
tiles.push(chooseRow.accessUrl);
|
||||
let row = chooseRow.accessUrl
|
||||
.replace('&srs=', '&srs=EPSG:4326')
|
||||
.replace('&format=application/openlayers', '&format=image/png&TRANSPARENT=TRUE');
|
||||
tiles.push(row);
|
||||
});
|
||||
|
||||
if (map.getSource('GeoTiffManagerRaster' + 'wmsSource')) {
|
||||
|
|
@ -305,7 +309,10 @@
|
|||
if (!map.getLayer('countyLayer')) {
|
||||
handlerDealCountry('AchievementManageRaster');
|
||||
}
|
||||
handlerLocation(lngLat, zoom);
|
||||
console.log(lngLat, zoom);
|
||||
if (lngLat && zoom) {
|
||||
// handlerLocation(lngLat, zoom);
|
||||
}
|
||||
|
||||
if (map.getSource('AchievementManageRaster' + 'wmsSource')) {
|
||||
map.getSource('AchievementManageRaster' + 'wmsSource').setData(taskLayerGeoJson);
|
||||
|
|
@ -347,18 +354,18 @@
|
|||
'text-size': 12,
|
||||
},
|
||||
});
|
||||
// map.addLayer({
|
||||
// id: 'unclustered-point',
|
||||
// type: 'circle',
|
||||
// source: 'AchievementManageRaster' + 'wmsSource',
|
||||
// filter: ['any', ['!', ['has', 'point_count']], ['==', 'point_count', 1]],
|
||||
// paint: {
|
||||
// 'circle-color': '#11b4da',
|
||||
// 'circle-radius': 4,
|
||||
// 'circle-stroke-width': 2,
|
||||
// 'circle-stroke-color': '#fff',
|
||||
// },
|
||||
// });
|
||||
map.addLayer({
|
||||
id: 'unclustered-point',
|
||||
type: 'circle',
|
||||
source: 'AchievementManageRaster' + 'wmsSource',
|
||||
filter: ['any', ['!', ['has', 'point_count']], ['==', 'point_count', 1]],
|
||||
paint: {
|
||||
'circle-color': '#11b4da',
|
||||
'circle-radius': 4,
|
||||
'circle-stroke-width': 2,
|
||||
'circle-stroke-color': '#fff',
|
||||
},
|
||||
});
|
||||
// 无人机图标
|
||||
map.loadImage('/map/AchievementManage.png', function (error, image) {
|
||||
if (error) throw error;
|
||||
|
|
@ -372,8 +379,8 @@
|
|||
source: 'AchievementManageRaster' + 'wmsSource',
|
||||
layout: {
|
||||
'icon-image': 'taskIcon',
|
||||
'icon-size': 1,
|
||||
'text-field': ['get', 'taskName'],
|
||||
'icon-size': 0.8,
|
||||
// 'text-field': ['get', 'taskName'],
|
||||
'text-size': 10,
|
||||
'text-font': ['Open Sans Semibold', 'Arial Unicode MS Bold'],
|
||||
'text-offset': [0, 1.8],
|
||||
|
|
@ -388,7 +395,6 @@
|
|||
'text-halo-width': 1,
|
||||
},
|
||||
});
|
||||
|
||||
map.on('click', 'AchievementManageRaster', (e) => {
|
||||
console.log(e);
|
||||
// 显示弹窗
|
||||
|
|
@ -396,12 +402,21 @@
|
|||
// 获取第一个（也是唯一的）被点击的特征
|
||||
const feature = e.features[0];
|
||||
// 从特征的属性中获取 'path' 值
|
||||
const path = feature.properties.path;
|
||||
emits('handleOpen', path);
|
||||
} else {
|
||||
console.log('No feature was clicked.');
|
||||
// const path = feature.properties.path;
|
||||
// console.log(400, feature.properties);
|
||||
emits('handleOpen', feature.properties);
|
||||
}
|
||||
});
|
||||
if (map.getLayer('streetLayer')) {
|
||||
map.moveLayer('streetLayer', 'clusters');
|
||||
map.moveLayer('streetLayer', 'cluster-count');
|
||||
map.moveLayer('streetLayer', 'AchievementManageRaster');
|
||||
}
|
||||
if (map.getLayer('countyLayer')) {
|
||||
map.moveLayer('countyLayer', 'clusters');
|
||||
map.moveLayer('countyLayer', 'cluster-count');
|
||||
map.moveLayer('countyLayer', 'AchievementManageRaster');
|
||||
}
|
||||
if (map.getLayer('AchievementManageRaster')) {
|
||||
if (map.getLayer('clusters')) {
|
||||
map.moveLayer('AchievementManageRaster', 'clusters');
|
||||
|
|
|
|||
Loading…
Reference in New Issue