Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua
commit
03343b6c3a
|
|
@ -1,5 +1,5 @@
|
|||
export enum MapboxConfig {
|
||||
ACCESS_TOKEN = 'pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw',
|
||||
ACCESS_TOKEN = 'pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg',
|
||||
// ACCESS_TOKEN = "1234",
|
||||
TDT_TOKEN = 'b6585bc41ee16251dbe6b1af64f375d9',
|
||||
// add more config options here
|
||||
|
|
|
|||
|
|
@ -35,6 +35,11 @@ export const mapTypeOptions = [
|
|||
{ label: '非农化违法', value: 3 },
|
||||
{ label: '非粮化违法', value: 4 },
|
||||
];
|
||||
export const xcsjMapTypeOptions = [
|
||||
{ label: '合法', value: 0 },
|
||||
{ label: '违法', value: 1 },
|
||||
{ label: '其他', value: 2 },
|
||||
];
|
||||
export const keyIssuesIIMapTypeOptions = [
|
||||
{ label: '合法', value: 0 },
|
||||
{ label: '违法', value: 1 },
|
||||
|
|
@ -68,6 +73,13 @@ export const mapStatusOptions = [
|
|||
// { label: '市级驳回', value: '市级驳回' },
|
||||
// { label: '县级驳回', value: '县级驳回' },
|
||||
];
|
||||
export const xcsjMapStatusOptions = [
|
||||
{ label: '待接收', value: '待接收' },
|
||||
{ label: '待填报', value: '待填报' },
|
||||
{ label: '待整改', value: '待整改' },
|
||||
{ label: '市级驳回', value: '市级驳回' },
|
||||
{ label: '县级驳回', value: '县级驳回' },
|
||||
];
|
||||
export const keyProblemSearchMapStatusOptions = [
|
||||
{ label: '待接收', value: '待接收' },
|
||||
{ label: '待填报', value: '待填报' },
|
||||
|
|
|
|||
|
|
@ -129,7 +129,7 @@
|
|||
v-model:value="props.infoScreenData.mapStatus"
|
||||
@change="(value) => emits('mapListScreenChange',value,'mapStatus')"
|
||||
style="width: 100%"
|
||||
:options="mapStatusOptions"></a-checkbox-group>
|
||||
:options="xcsjMapStatusOptions"></a-checkbox-group>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div style="display:flex;">
|
||||
|
|
@ -297,7 +297,7 @@ import {
|
|||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
measureOptions,
|
||||
mapStatusOptions,
|
||||
xcsjMapStatusOptions,
|
||||
markTypeOptions,
|
||||
inspectionAuditPatchSourceOptions,
|
||||
isOverdueOptions,
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import {
|
|||
yearOptions,
|
||||
markTypeOptions,
|
||||
xcsjNowStatusOptions,
|
||||
mapTypeOptions,
|
||||
xcsjMapTypeOptions,
|
||||
} from '@/utils/global';
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
|
|
@ -205,7 +205,7 @@ export const searchFormSchema: FormSchema[] = [
|
|||
component: 'Select',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
options: mapTypeOptions,
|
||||
options: xcsjMapTypeOptions,
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -158,7 +158,7 @@ export const servicesColumns: BasicColumn[] = [
|
|||
},
|
||||
];
|
||||
|
||||
export const MAPBOX_TOKEN = "pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw";
|
||||
export const MAPBOX_TOKEN = "pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg";
|
||||
|
||||
export const TINADITU_TOKEN = "b6585bc41ee16251dbe6b1af64f375d9";
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,882 @@
|
|||
<template>
|
||||
<div class="map-list-content">
|
||||
<div class="screen-div">
|
||||
<div class="screen-item" style="margin-right:20px;margin-bottom:12px;">
|
||||
<div class="screen-item-label">年份</div>
|
||||
<a-select
|
||||
allowClear
|
||||
style="width:120px;"
|
||||
v-model:value="props.infoScreenData.year"
|
||||
:options="yearOptions"
|
||||
@change="(value) => emits('mapListScreenChange',value,'year')"
|
||||
/>
|
||||
</div>
|
||||
<div class="screen-item" style="margin-right:17px;margin-bottom:12px;">
|
||||
<div class="screen-item-label" style="margin-right: 11px;">线索来源</div>
|
||||
<a-select
|
||||
allowClear
|
||||
style="width:120px;"
|
||||
v-model:value="props.infoScreenData.patchSource"
|
||||
:options="tubanlaiyuanOptions"
|
||||
@change="(value) => emits('mapListScreenChange',value,'patchSource')"
|
||||
/>
|
||||
</div>
|
||||
<div class="screen-item" style="margin-bottom:12px;">
|
||||
<div class="screen-item-label">批次</div>
|
||||
<a-select
|
||||
allowClear
|
||||
style="width: 118px"
|
||||
:options="batchOptions"
|
||||
v-model:value="props.infoScreenData.batch"
|
||||
@change="(value) => emits('mapListScreenChange',value,'batch')"
|
||||
/>
|
||||
</div>
|
||||
<div class="screen-item" style="margin-bottom:12px;">
|
||||
<div class="screen-item-label" style="margin-right: 10px;">下发时间</div>
|
||||
<a-range-picker
|
||||
:format="'YYYY-MM-DD'"
|
||||
allowClear
|
||||
style="width: 306px;"
|
||||
class="item-time-select"
|
||||
@change="(value) => emits('mapListScreenChange',value,'time')"
|
||||
/>
|
||||
</div>
|
||||
<div class="screen-item" style="margin-left: 13px;">
|
||||
<div class="screen-item-label">乡镇</div>
|
||||
<a-select
|
||||
allowClear
|
||||
style="width:120px;"
|
||||
v-model:value="props.infoScreenData.streetId"
|
||||
:options="streetsAreaOptions"
|
||||
@change="(value) => emits('mapListScreenChange',value,'streetId')"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="screen-item" style="margin-right: 14px;">
|
||||
<a-input
|
||||
allowClear
|
||||
placeholder="请输入线索编号"
|
||||
class="item-input"
|
||||
v-model:value="props.infoScreenData.mapNo"
|
||||
@change="(value) => emits('mapListScreenChange',value.target.value,'mapNo')"
|
||||
style="width:404px;"
|
||||
@press-enter="querysBtn"
|
||||
/>
|
||||
</div>
|
||||
<div class="screen-item" style="margin-left: 10px;cursor: pointer;">
|
||||
<a-button
|
||||
class="item-button"
|
||||
type="primary"
|
||||
:icon="h(SearchOutlined)"
|
||||
@click="querysBtn">查询</a-button>
|
||||
<Icon style="font-size: 25px;margin-left: 10px;" icon="streamline:interface-time-reset-time-clock-reset-stopwatch-circle-measure-loading" @click="emits('resetScreenData')" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="sift-div">
|
||||
<div class="layout-div">
|
||||
<div class="sift-item" @click="dataListSort('area')">
|
||||
<div class="sift-label">总面积</div>
|
||||
<div class="sift-icon">
|
||||
<div :style="`${showSortMark('area',1)? 'color: #086DEC;': ''}`">▲</div>
|
||||
<div :style="`${showSortMark('area',2)? 'color: #086DEC;': ''}`">▼</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sift-item" @click="dataListSort('gengdi_area')">
|
||||
<div class="sift-label">耕地面积</div>
|
||||
<div class="sift-icon">
|
||||
<div :style="`${showSortMark('gengdi_area',1)? 'color: #086DEC;': ''}`">▲</div>
|
||||
<div :style="`${showSortMark('gengdi_area',2)? 'color: #086DEC;': ''}`">▼</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sift-item" @click="dataListSort('synchronoustime')">
|
||||
<div class="sift-label">下发时间</div>
|
||||
<div class="sift-icon">
|
||||
<div :style="`${showSortMark('synchronoustime',1)? 'color: #086DEC;': ''}`">▲</div>
|
||||
<div :style="`${showSortMark('synchronoustime',2)? 'color: #086DEC;': ''}`">▼</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collect-div">
|
||||
<a-popover placement="bottom">
|
||||
<template #content>
|
||||
<div style="display:flex;align-items: center;margin-top: 4px;">
|
||||
<div>线索面积：</div>
|
||||
<div style="display:flex;">
|
||||
<a-input style="width:30%;"
|
||||
v-model:value="props.infoScreenData.mapAreaFirst"
|
||||
@change="(e) => emits('mapListScreenChange',e.target.value,'mapAreaFirst')"
|
||||
/>
|
||||
<span>---</span>
|
||||
<a-input style="width:30%;margin-right: 4px;"
|
||||
v-model:value="props.infoScreenData.mapAreaLast"
|
||||
@change="(e) => emits('mapListScreenChange',e.target.value,'mapAreaLast')"
|
||||
/>
|
||||
亩
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;margin-top: 4px;">
|
||||
<div>耕地面积：</div>
|
||||
<div style="display:flex;align-items: center;">
|
||||
<a-input style="width:30%;"
|
||||
v-model:value="props.infoScreenData.arableAreaFirst"
|
||||
@change="(e) => emits('mapListScreenChange',e.target.value,'arableAreaFirst')"
|
||||
/>
|
||||
<span>---</span>
|
||||
<a-input style="width:30%;margin-right: 4px;"
|
||||
v-model:value="props.infoScreenData.arableAreaLast"
|
||||
@change="(e) => emits('mapListScreenChange',e.target.value,'arableAreaLast')"
|
||||
/>
|
||||
亩
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<img src="@/assets/images/tiankongdi/filt.png" class="img-box mr-r-20" />
|
||||
</a-popover>
|
||||
<img src="@/assets/images/tiankongdi/collect-active.png" class="img-box" @click="getCollectList" v-if="openCollect"/>
|
||||
<img src="@/assets/images/tiankongdi/collect.png" class="img-box" @click="getCollectList" v-else/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data-list-div" style="padding-top: 1px;">
|
||||
<div v-for="(item, index) in props.infoDataList" :key="index" class="data-list-item">
|
||||
<div class="back-box" v-if="showDrawBack(item,true)">{{ drawBackSpan(item,true) }}</div>
|
||||
<div class="data-list-layout-div">
|
||||
<div class="data-list-title-div">
|
||||
<img src="/positioning.png" class="map-mark" style="cursor:pointer;" @click="locationFun(item)"/>
|
||||
<div class="label-div">
|
||||
<div class="item-label">{{item.countyname}}</div>
|
||||
<div class="item-sub-label">
|
||||
<div style="margin-right:12px;max-width: 100px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{item.streetname}}</div>
|
||||
<span>{{item.caseno}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-mark" v-if="item.isbuildname">{{item.isbuildname}}</div>
|
||||
</div>
|
||||
<div class="data-item-type-div" style="cursor:pointer;" @click="goAudit(item)">
|
||||
{{item.unitname}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="data-list-info-div">
|
||||
<div class="info-layout-div">
|
||||
<div class="info-item" style="width: 130px;">
|
||||
<div class="info-label">总面积</div>
|
||||
<div class="info-data" :title="dataProcessing(item.area)">{{dataProcessing(item.area)}}</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-label">农用地</div>
|
||||
<div class="info-data" :title="dataProcessing(item.nongyongdiarea)">{{dataProcessing(item.nongyongdiarea)}}</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-label">耕地</div>
|
||||
<div class="info-data" :title="dataProcessing(item.gengdiarea)">{{dataProcessing(item.gengdiarea)}}</div>
|
||||
</div>
|
||||
<div class="info-item" style="width: 120px;">
|
||||
<div class="info-label">永农面积</div>
|
||||
<div class="info-data" :title="dataProcessing(item.yongjiujibennongtianarea)">{{dataProcessing(item.yongjiujibennongtianarea)}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-layout-div">
|
||||
<!-- <span class="info-time">{{item.createdate}}</span> -->
|
||||
<div>
|
||||
<img src="@/assets/images/tiankongdi/collect-active.png" class="img-box" @click="collectItem(item)" v-if="item.fid"/>
|
||||
<img src="@/assets/images/tiankongdi/collect.png" class="img-box" @click="collectItem(item)" v-else/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pagination-div">
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model:pageSize="props.pageSize"
|
||||
v-model:current="props.pageNo"
|
||||
:total="props.total"
|
||||
:show-total="total => `共 ${total} 条数据`"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
@change="changePage" />
|
||||
</div>
|
||||
<a-modal
|
||||
width="100%"
|
||||
wrap-class-name="full-modal"
|
||||
v-model:open="auditOpen"
|
||||
title="接收办理"
|
||||
footer=""
|
||||
:destroyOnClose="true"
|
||||
>
|
||||
<template #footer> </template>
|
||||
<div class="handoff">
|
||||
<a-button
|
||||
type="primary"
|
||||
style="margin-right: 25px;"
|
||||
@click="prevData"
|
||||
>上一条</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="nextData"
|
||||
>下一条</a-button>
|
||||
</div>
|
||||
<Audit
|
||||
v-if="handoffShow"
|
||||
ref="posRef"
|
||||
:processId="processId"
|
||||
:taskId="taskId"
|
||||
:isRead="isRead"
|
||||
:type="type"
|
||||
:auditData="auditData"
|
||||
@closeModel="closeMolder"
|
||||
/>
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, defineEmits, defineProps, computed, h, watch } from "vue"
|
||||
import { StarOutlined, StarFilled, SearchOutlined, RollbackOutlined } from '@ant-design/icons-vue';
|
||||
import Icon from '@/components/Icon/Icon.vue';
|
||||
import { addCaseFavorite,addTaskFavorite,getCaseInfoById, deleteFavoriteCase,deleteTaskCase,getLoadStreet, getLoadDroneCaseInfoDetail } from '@/api/tiankongdi/index.ts';
|
||||
import {
|
||||
batchOptions,
|
||||
yearOptions,
|
||||
mapTypeOptions,
|
||||
illegalTypeOptions,
|
||||
measureOptions,
|
||||
mapStatusOptions,
|
||||
markTypeOptions,
|
||||
patchSourceOptions,
|
||||
isOverdueOptions,
|
||||
} from '@/utils/global'
|
||||
import { useUserStore } from '@/store/modules/user.ts'
|
||||
import { message } from "ant-design-vue";
|
||||
import { flowStore } from '@/store/modules/flow';
|
||||
import { getDetail } from '@/api/sys/WFSchemeInfo';
|
||||
import { Audit } from '@/views/demo/workflow/task/process/page';
|
||||
import { dataProcessing, tubanlaiyuanOptions } from '@/views/demo/tiankongdi/util.ts'
|
||||
import {showDrawBack, drawBackSpan} from '@/views/demo/util'
|
||||
const userStore = useUserStore()
|
||||
const flowWfDataStore = flowStore();
|
||||
const emits = defineEmits([
|
||||
"closeShowInfo",
|
||||
"mapListScreenChange",
|
||||
"changeInfoPage",
|
||||
"getInfoList",
|
||||
"changeTask",
|
||||
"infoDataListSort",
|
||||
"collectChange",
|
||||
"resetScreenData",
|
||||
"changeInfoDataList",
|
||||
])
|
||||
const props = defineProps([
|
||||
"infoScreenData",
|
||||
"cityType",
|
||||
"municipalAreaOptions",
|
||||
"countiesAreaOptions",
|
||||
"communitiesAreaOptions",
|
||||
"pageNo",
|
||||
"pageSize",
|
||||
"total",
|
||||
"infoDataList"
|
||||
])
|
||||
const order = ref(0) // 0: 不排序 1: 升序 2: 降序
|
||||
const landType = ref(0)
|
||||
const orderMark = () => {
|
||||
switch(order.value){
|
||||
case 0:
|
||||
return '-'
|
||||
case 1:
|
||||
return '↑'
|
||||
case 2:
|
||||
return '↓'
|
||||
}
|
||||
}
|
||||
const showDataId = ref()
|
||||
const nextShowDataId = ref()
|
||||
const prevShowDataId = ref()
|
||||
watch(() => showDataId.value, () => {
|
||||
let index = props.infoDataList.findIndex(item => item.id == showDataId.value)
|
||||
if(index < props.infoDataList.length - 1){
|
||||
nextShowDataId.value = props.infoDataList[index + 1].id
|
||||
}else{
|
||||
nextShowDataId.value = 0
|
||||
}
|
||||
if(index > 0){
|
||||
prevShowDataId.value = props.infoDataList[index - 1].id
|
||||
}else{
|
||||
prevShowDataId.value = 0
|
||||
}
|
||||
})
|
||||
const auditOpen = ref(false);
|
||||
const processId = ref('');
|
||||
const taskId = ref('');
|
||||
const type = ref('');
|
||||
const auditData = ref()
|
||||
const handoffShow = ref(true)
|
||||
const isRead: any = ref(0);
|
||||
const openCollect = computed(() => {
|
||||
if(props.infoScreenData.type === '') return false
|
||||
return true
|
||||
})
|
||||
const streetsAreaOptions = ref([
|
||||
{ label: '全部', value: '' },
|
||||
])
|
||||
|
||||
onMounted(() => {
|
||||
getLoadStreet().then(res => {
|
||||
console.log(res)
|
||||
res.forEach(item => {
|
||||
streetsAreaOptions.value.push({
|
||||
label: item.Name,
|
||||
value: item.Id,
|
||||
})
|
||||
})
|
||||
})
|
||||
console.log('onMounted')
|
||||
})
|
||||
|
||||
async function locationFun(record) {
|
||||
console.log(record);
|
||||
emits('changeTask', record.geomid);
|
||||
}
|
||||
|
||||
const changePage = (page, pageSize) => {
|
||||
console.log(page,pageSize)
|
||||
emits('changeInfoPage',page,pageSize)
|
||||
}
|
||||
const querysBtn = ()=>{
|
||||
// emits('getInfoList')
|
||||
emits('changeInfoPage',1,props.pageSize)
|
||||
|
||||
}
|
||||
const collectItem = (item) => {
|
||||
console.log(item)
|
||||
if(item.fid){
|
||||
cancelCollectItem(item)
|
||||
return
|
||||
}
|
||||
let userInfo = userStore.getUserInfo
|
||||
let params = {
|
||||
// id: item.id,
|
||||
taskId: item.taskid,
|
||||
favoriteUserId: userInfo.id
|
||||
}
|
||||
addTaskFavorite(params).then(res => {
|
||||
console.log(res)
|
||||
message.success('收藏成功')
|
||||
emits('getInfoList')
|
||||
})
|
||||
}
|
||||
const cancelCollectItem = (item) => {
|
||||
deleteTaskCase(item.fid).then(res => {
|
||||
message.success('取消收藏成功')
|
||||
emits('getInfoList')
|
||||
})
|
||||
}
|
||||
const getCollectList = () => {
|
||||
let collect = props.infoScreenData.type
|
||||
let value: number|string = ''
|
||||
if(collect === ''){
|
||||
value = 1
|
||||
}else if(collect === 1){
|
||||
value = ''
|
||||
}
|
||||
emits('collectChange', value)
|
||||
}
|
||||
const showSortMark = (key, sort) => {
|
||||
if(props.infoScreenData.sort === key && sort === order.value){
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
const dataListSort = (type) => {
|
||||
if(props.infoScreenData.sort === '' || props.infoScreenData.sort === type){
|
||||
order.value = (order.value + 1) % 3
|
||||
}else{
|
||||
order.value = 1
|
||||
}
|
||||
emits('infoDataListSort', type, order.value)
|
||||
}
|
||||
async function goAudit(record) {
|
||||
showDataId.value = record.id
|
||||
let data = await getDetail({ code: record.processcode });
|
||||
let scheme = JSON.parse(data.scheme.content);
|
||||
let wfData = scheme.wfData;
|
||||
flowWfDataStore.setWfDataAll(wfData);
|
||||
auditOpen.value = true;
|
||||
processId.value = record.processid;
|
||||
taskId.value = record.taskid;
|
||||
type.value = record.type;
|
||||
auditData.value = record;
|
||||
}
|
||||
const prevData = async () => {
|
||||
if(prevShowDataId.value === 0){
|
||||
if(props.pageNo === 1 || props.total == 0){
|
||||
message.warning('已经是第一条数据了')
|
||||
return
|
||||
}
|
||||
getLoadDroneCaseInfoDetail(getParams({page: props.pageNo - 1})).then(async res => {
|
||||
emits('changeInfoDataList',res.items,res.total,props.pageNo - 1)
|
||||
handoffShow.value = false
|
||||
let record = res.items[res.items.length -1]
|
||||
let data = await getDetail({ code: record.processcode });
|
||||
let scheme = JSON.parse(data.scheme.content);
|
||||
let wfData = scheme.wfData;
|
||||
flowWfDataStore.setWfDataAll(wfData);
|
||||
processId.value = record.processid;
|
||||
taskId.value = record.taskid;
|
||||
type.value = record.type;
|
||||
handoffShow.value = true
|
||||
showDataId.value = res.items[res.items.length -1].id
|
||||
auditData.value = res.items[res.items.length -1];
|
||||
})
|
||||
return
|
||||
}else{
|
||||
showDataId.value = prevShowDataId.value
|
||||
}
|
||||
handoffShow.value = false
|
||||
let record = props.infoDataList.find(item => item.id == showDataId.value)
|
||||
let data = await getDetail({ code: record.processcode });
|
||||
let scheme = JSON.parse(data.scheme.content);
|
||||
let wfData = scheme.wfData;
|
||||
flowWfDataStore.setWfDataAll(wfData);
|
||||
processId.value = record.processid;
|
||||
taskId.value = record.taskid;
|
||||
type.value = record.type;
|
||||
handoffShow.value = true
|
||||
auditData.value = record;
|
||||
}
|
||||
const nextData = async () => {
|
||||
if(nextShowDataId.value === 0){
|
||||
if((Math.ceil(props.total / props.pageSize) <= props.pageNo) || props.total == 0){
|
||||
message.warning('已经是最后一条数据了')
|
||||
return
|
||||
}
|
||||
getLoadDroneCaseInfoDetail(getParams({page: props.pageNo + 1})).then(async res => {
|
||||
emits('changeInfoDataList',res.items,res.total,props.pageNo + 1)
|
||||
handoffShow.value = false
|
||||
let record = res.items[0]
|
||||
let data = await getDetail({ code: record.processcode });
|
||||
let scheme = JSON.parse(data.scheme.content);
|
||||
let wfData = scheme.wfData;
|
||||
flowWfDataStore.setWfDataAll(wfData);
|
||||
processId.value = record.processid;
|
||||
taskId.value = record.taskid;
|
||||
type.value = record.type;
|
||||
handoffShow.value = true
|
||||
showDataId.value = res.items[0].id
|
||||
auditData.value = res.items[0]
|
||||
})
|
||||
return
|
||||
}else{
|
||||
showDataId.value = nextShowDataId.value
|
||||
}
|
||||
handoffShow.value = false
|
||||
let record = props.infoDataList.find(item => item.id == showDataId.value)
|
||||
let data = await getDetail({ code: record.processcode });
|
||||
let scheme = JSON.parse(data.scheme.content);
|
||||
let wfData = scheme.wfData;
|
||||
flowWfDataStore.setWfDataAll(wfData);
|
||||
processId.value = record.processid;
|
||||
taskId.value = record.taskid;
|
||||
type.value = record.type;
|
||||
handoffShow.value = true
|
||||
auditData.value = record;
|
||||
}
|
||||
const closeMolder = () => {
|
||||
emits('getInfoList')
|
||||
}
|
||||
const getParams = (data) => {
|
||||
let result = {}
|
||||
let params = {
|
||||
landType: props.infoScreenData.landType, //0 农用地 1建设用地
|
||||
isOutTime: props.infoScreenData.isOverdue, //是否超期
|
||||
year: props.infoScreenData.year, //年
|
||||
tubanlaiyuan: props.infoScreenData.patchSource, //线索来源
|
||||
picihao: props.infoScreenData.batch, //批次号
|
||||
streetid: props.infoScreenData.streetId,
|
||||
caseNo: props.infoScreenData.mapNo, //图版编号
|
||||
startTime: props.infoScreenData.startTime, // 下发开始时间
|
||||
endTime: props.infoScreenData.endTime, // 下发结束时间
|
||||
nowStatus: props.infoScreenData.mapStatus, // 当前状态
|
||||
isBuildName: props.infoScreenData.markType, // 标注
|
||||
tubanArea1: props.infoScreenData.mapAreaFirst, // 线索面积1
|
||||
tubanArea2: props.infoScreenData.mapAreaLast, // 线索面积2
|
||||
gengdiArea1: props.infoScreenData.arableAreaFirst, //耕地面积1
|
||||
gengdiArea2: props.infoScreenData.arableAreaLast, //耕地面积2
|
||||
page: props.pageNo,
|
||||
limit: props.pageSize,
|
||||
sortType: props.infoScreenData.sort,
|
||||
order: props.infoScreenData.order,
|
||||
type: props.infoScreenData.type,
|
||||
...data,
|
||||
}
|
||||
Object.keys(params).forEach(key => {
|
||||
if(params[key] !== '' && params[key] !== null){
|
||||
if(key === 'nowStatus'){
|
||||
result[key] = params[key].join(',')
|
||||
}else if(key === 'isOutTime'){
|
||||
if(params[key].length == 1){
|
||||
result[key] = params[key][0]
|
||||
}
|
||||
}else{
|
||||
result[key] = params[key]
|
||||
}
|
||||
}
|
||||
})
|
||||
return result
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.handoff{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding-right: 25px;
|
||||
}
|
||||
.full-modal {
|
||||
.ant-modal {
|
||||
min-width: 100vw;
|
||||
top: 0px;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
.ant-modal-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.ant-modal-body {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
::v-deep .ant-modal {
|
||||
width: 100vw!important;
|
||||
top: 0px;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
::v-deep .ant-modal-content{
|
||||
width: 100vw!important;
|
||||
background:red!important;
|
||||
}
|
||||
.map-list-content{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.rollback {
|
||||
background: #fff;
|
||||
padding: 10px;
|
||||
}
|
||||
.screen-div{
|
||||
padding: 10px 12px 20px 13px;
|
||||
display: flex;
|
||||
width:590px;
|
||||
flex-wrap: wrap;
|
||||
.screen-item{
|
||||
// width: 33.3%;
|
||||
display: flex;
|
||||
height: 39px;
|
||||
// margin-bottom: 12px;
|
||||
// font-family: Alibaba PuHuiTi;
|
||||
// font-weight: 500;
|
||||
// font-size: 17px;
|
||||
// color: #000000;
|
||||
.screen-item-label{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 17px;
|
||||
color: #000000;
|
||||
line-height: 30px;
|
||||
// width: 53px;
|
||||
// padding-left: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 9px;
|
||||
// font-size: 15px;
|
||||
}
|
||||
:deep(.ant-select-selector){
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family: HarmonyOS Sans;
|
||||
font-weight: 500;
|
||||
font-size: 19px;
|
||||
color: #000000;
|
||||
line-height: 30px;
|
||||
height: 39px;
|
||||
box-shadow: 2px 3px 3px 1px rgba(13,13,13,0.05);
|
||||
}
|
||||
.item-input{
|
||||
width:373px;
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 17px;
|
||||
color: #000000;
|
||||
line-height: 30px;
|
||||
box-shadow: 2px 3px 3px 1px rgba(13,13,13,0.05);
|
||||
}
|
||||
.item-time-select{
|
||||
box-shadow: 2px 3px 3px 1px rgba(13,13,13,0.05);
|
||||
:deep(input){
|
||||
font-family: HarmonyOS Sans;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
.item-button{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 400;
|
||||
font-size: 19px;
|
||||
color: #FFFFFF;
|
||||
line-height: 30px;
|
||||
height:39px;
|
||||
width: 97px;
|
||||
background: #086DEC;
|
||||
// margin-left:12px;
|
||||
}
|
||||
}
|
||||
.screen-button-div{
|
||||
display: flex;
|
||||
// justify-content: space-between;
|
||||
width: 100%;
|
||||
button{
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.top-radio-button-div{
|
||||
width:100%;
|
||||
padding: 33px 12px 8px 13px;
|
||||
.ant-radio-group{
|
||||
display: flex;
|
||||
|
||||
}
|
||||
:deep(.ant-radio-button-wrapper-checked){
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500 !important;
|
||||
font-size: 20px;
|
||||
color: #FFFFFF !important;
|
||||
line-height: 40px;
|
||||
background: #086DEC;
|
||||
}
|
||||
.radio-item{
|
||||
width:33%;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
user-select: none;
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
color: #000000;
|
||||
line-height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center
|
||||
}
|
||||
}
|
||||
.sift-div{
|
||||
background:#fff;
|
||||
height: 77px;
|
||||
padding:19px 13px;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
border-radius: 10px 10px 0px 0px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.layout-div{
|
||||
display:flex;
|
||||
.back-button{
|
||||
font-size:22px;
|
||||
cursor:pointer;
|
||||
}
|
||||
.interval-div{
|
||||
height:100%;
|
||||
width:1px;
|
||||
background:#EDEDED;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.sift-item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right:15px;
|
||||
cursor:pointer;
|
||||
user-select:none;
|
||||
.sift-label{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 19px;
|
||||
color: #000000;
|
||||
}
|
||||
.sift-icon{
|
||||
font-size: 9px;
|
||||
margin-left:5px;
|
||||
opacity: 0.53;
|
||||
}
|
||||
}
|
||||
}
|
||||
.collect-div{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
}
|
||||
}
|
||||
.data-list-div{
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
padding: 10px;
|
||||
scrollbar-width: none; /* firefox */
|
||||
-ms-overflow-style: none; /* IE 10+ */
|
||||
.data-list-item{
|
||||
background:#fff;
|
||||
padding:20px 10px 10px 10px;
|
||||
// border-radius:6px;
|
||||
margin-bottom:1px;
|
||||
position: relative;
|
||||
.back-box{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top:0;
|
||||
background: #EA1C06;
|
||||
padding: 3px 6px;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
border-radius: 0px 0px 0px 8px;
|
||||
}
|
||||
.data-list-layout-div{
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
height: 45px;
|
||||
.data-list-title-div{
|
||||
display:flex;
|
||||
align-items: center;
|
||||
.map-mark{
|
||||
width:17px;
|
||||
height:17px;
|
||||
}
|
||||
.label-div{
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
margin-right: 12px
|
||||
}
|
||||
.item-label{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 23px;
|
||||
color: #000000;
|
||||
margin-left: 9px;
|
||||
margin-right:10px;
|
||||
}
|
||||
.item-sub-label{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 17px;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
}
|
||||
.item-mark{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
margin-left: 17px;
|
||||
color: #696969;
|
||||
margin-top: 4px;
|
||||
}
|
||||
}
|
||||
.data-item-type-div{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
color: #696969;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor:pointer;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
.data-list-info-div{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 10px;
|
||||
height: 40px;
|
||||
.info-layout-div{
|
||||
display:flex;
|
||||
align-items: center;
|
||||
.info-time{
|
||||
font-family: HarmonyOS Sans;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.info-item{
|
||||
display:flex;
|
||||
background: rgba(237, 237, 237, 0.55);
|
||||
align-items: center;
|
||||
width: 110px;
|
||||
border-radius: 7px;
|
||||
margin-right: 8px;
|
||||
height: 33px;
|
||||
justify-content: center;
|
||||
.info-label{
|
||||
font-family: Alibaba PuHuiTi;
|
||||
font-weight: 400;
|
||||
font-size: 13px;
|
||||
color: #959494;
|
||||
// width:45%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-right: 5px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.info-data{
|
||||
font-family: HarmonyOS Sans;
|
||||
font-weight: 500;
|
||||
font-size: 13px;
|
||||
color: #000000;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.data-list-item:nth-last-child(1){
|
||||
border-bottom-left-radius: 6px;
|
||||
border-bottom-right-radius: 6px
|
||||
}
|
||||
}
|
||||
.data-list-div::-webkit-scrollbar {
|
||||
display: none; /* Chrome Safari */
|
||||
}
|
||||
.pagination-div{
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.modal-content{
|
||||
padding:15px;
|
||||
width: 100%;
|
||||
height: calc(100vh - 65px);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
::v-deep .ant-modal{
|
||||
min-width:100vw!important;
|
||||
}
|
||||
.img-box{
|
||||
width: 25px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.mr-r-20{
|
||||
margin-right: 20px;
|
||||
}
|
||||
.img-box.small{
|
||||
width: 18px;
|
||||
margin-right: 6px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,472 @@
|
|||
<template>
|
||||
<div class="curb-spot-city">
|
||||
<div class="show-list">
|
||||
<a-spin :spinning="spinning">
|
||||
<MapList
|
||||
:infoScreenData="infoScreenData"
|
||||
:cityType="cityType"
|
||||
:pageNo="pageNo"
|
||||
:pageSize="pageSize"
|
||||
:total="total"
|
||||
:infoDataList="infoDataList"
|
||||
:municipalAreaOptions="municipalAreaOptions"
|
||||
:countiesAreaOptions="countiesAreaOptions"
|
||||
:streetsAreaOptions="streetsAreaOptions"
|
||||
:communitiesAreaOptions="communitiesAreaOptions"
|
||||
@infoDataListSort="infoDataListSort"
|
||||
@changeInfoPage="changeInfoPage"
|
||||
@getInfoList="getInfoList"
|
||||
@mapListScreenChange="mapListScreenChange"
|
||||
@closeShowInfo="changeShowInfo"
|
||||
@changeTask="changeTask"
|
||||
@collectChange="collectChange"
|
||||
@resetScreenData="resetScreenData"
|
||||
@changeInfoDataList="changeInfoDataList"
|
||||
/>
|
||||
</a-spin>
|
||||
</div>
|
||||
<!-- <div id="showMap" class="map"></div> -->
|
||||
<MapboxMap
|
||||
:mapConfig="mapConfig"
|
||||
@handlerDrawComplete="handlerDrawComplete"
|
||||
@mapOnLoad="onMapboxLoad"
|
||||
ref="MapboxComponent"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onUnmounted, watch, defineAsyncComponent } from 'vue';
|
||||
import mapboxgl, { Map } from 'mapbox-gl';
|
||||
import { MapboxConfig, MapboxDefaultStyle } from '@/components/MapboxMaps/src/config';
|
||||
import AuditProgress from './AuditProgress/index.vue';
|
||||
import MapList from './MapList/index.vue';
|
||||
import {
|
||||
getLoadDroneCaseInfoCount,
|
||||
getLoadDroneCaseInfoDetail,
|
||||
getLoadParents,
|
||||
} from '@/api/tiankongdi/index.ts';
|
||||
import { batchOptions, yearOptions } from '@/views/utils/global';
|
||||
import { getChildrenTree } from '@/api/demo/system';
|
||||
import { getGeom, getConfig } from '@/api/sys/layerManagement';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
|
||||
const MapboxComponent = ref();
|
||||
const mapConfig = ref({ isShowMap: false });
|
||||
|
||||
function onMapboxLoad(): void {
|
||||
getConfig({ code: 'mapsetting' }).then((res) => {
|
||||
mapConfig.value = JSON.parse(res.codeValue);
|
||||
});
|
||||
}
|
||||
const showInfo = ref(true);
|
||||
const year = ref<number>();
|
||||
const batch = ref();
|
||||
const dataList = ref<any>([]);
|
||||
const infoDataList = ref<any>([]);
|
||||
const infoScreenData = ref({
|
||||
landType: 0,
|
||||
year: '',
|
||||
batch: '',
|
||||
patchSource: '',
|
||||
mapNo: '',
|
||||
mapType: '',
|
||||
// countyId: '',
|
||||
streetId: '',
|
||||
// downtownId: '',
|
||||
// communityId: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
isOverdue: '',
|
||||
illegalType: '',
|
||||
measure: '',
|
||||
mapStatus: ['待确认'],
|
||||
markType: '',
|
||||
sort: '',
|
||||
order: '',
|
||||
type: '', // 收藏
|
||||
mapAreaFirst: '',
|
||||
mapAreaLast: '',
|
||||
arableAreaFirst: '',
|
||||
arableAreaLast: '',
|
||||
});
|
||||
const pageNo = ref(1);
|
||||
const pageSize = ref(10);
|
||||
const total = ref(0);
|
||||
const municipalAreaOptions = ref<any[]>([]);
|
||||
const countiesAreaOptions = ref([{ label: '全部', value: '' }]);
|
||||
const streetsAreaOptions = ref([{ label: '全部', value: '' }]);
|
||||
const communitiesAreaOptions = ref([{ label: '全部', value: '' }]);
|
||||
const cityType = ref();
|
||||
const spinning = ref(false);
|
||||
const auditProgressScreenChange = (value, type) => {
|
||||
switch (type) {
|
||||
case 'year':
|
||||
year.value = value;
|
||||
break;
|
||||
case 'batch':
|
||||
batch.value = value;
|
||||
break;
|
||||
}
|
||||
let params = {
|
||||
year: year.value,
|
||||
};
|
||||
spinning.value = true;
|
||||
getLoadDroneCaseInfoCount(params)
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
dataList.value = res;
|
||||
})
|
||||
.finally(() => {
|
||||
spinning.value = false;
|
||||
});
|
||||
};
|
||||
const mapListScreenChange = (value, type) => {
|
||||
switch (type) {
|
||||
case 'landType':
|
||||
infoScreenData.value.landType = value;
|
||||
pageNo.value = 1;
|
||||
getInfoList();
|
||||
break;
|
||||
case 'year':
|
||||
infoScreenData.value.year = value;
|
||||
break;
|
||||
case 'batch':
|
||||
infoScreenData.value.batch = value;
|
||||
break;
|
||||
case 'patchSource':
|
||||
infoScreenData.value.patchSource = value;
|
||||
break;
|
||||
case 'mapNo':
|
||||
infoScreenData.value.mapNo = value;
|
||||
break;
|
||||
// case 'countyId':
|
||||
// infoScreenData.value.countyId = value
|
||||
// break
|
||||
case 'streetId':
|
||||
infoScreenData.value.streetId = value;
|
||||
break;
|
||||
case 'time':
|
||||
if (value) {
|
||||
infoScreenData.value.startTime = dayjs(value[0]).format('YYYY-MM-DD');
|
||||
infoScreenData.value.endTime = dayjs(value[1]).format('YYYY-MM-DD');
|
||||
} else {
|
||||
infoScreenData.value.startTime = '';
|
||||
infoScreenData.value.endTime = '';
|
||||
}
|
||||
break;
|
||||
// case 'communityId':
|
||||
// infoScreenData.value.communityId = value
|
||||
// break
|
||||
case 'mapType':
|
||||
infoScreenData.value.mapType = value;
|
||||
if (value !== 1) {
|
||||
infoScreenData.value.illegalType = '';
|
||||
infoScreenData.value.measure = '';
|
||||
}
|
||||
break;
|
||||
case 'illegalType':
|
||||
infoScreenData.value.illegalType = value;
|
||||
if (value !== 0) {
|
||||
infoScreenData.value.measure = '';
|
||||
}
|
||||
break;
|
||||
case 'measure':
|
||||
infoScreenData.value.measure = value;
|
||||
break;
|
||||
case 'mapStatus':
|
||||
infoScreenData.value.mapStatus = value;
|
||||
break;
|
||||
case 'isOverdue':
|
||||
infoScreenData.value.isOverdue = value;
|
||||
break;
|
||||
case 'markType':
|
||||
infoScreenData.value.markType = value;
|
||||
break;
|
||||
case 'mapAreaFirst':
|
||||
infoScreenData.value.mapAreaFirst = value;
|
||||
break;
|
||||
case 'mapAreaLast':
|
||||
infoScreenData.value.mapAreaLast = value;
|
||||
break;
|
||||
case 'arableAreaFirst':
|
||||
infoScreenData.value.arableAreaFirst = value;
|
||||
break;
|
||||
case 'arableAreaLast':
|
||||
infoScreenData.value.arableAreaLast = value;
|
||||
break;
|
||||
}
|
||||
};
|
||||
const changeShowInfo = async (value, item) => {
|
||||
if (item) {
|
||||
cityType.value = item;
|
||||
let childList = await getChildrenTree({ parentId: item.areaid });
|
||||
let params = {
|
||||
childId: item.areaid,
|
||||
};
|
||||
let parents = await getLoadParents(params);
|
||||
parents.forEach((parent) => {
|
||||
switch (parent.level) {
|
||||
case 0:
|
||||
municipalAreaOptions.value.push({
|
||||
label: parent.name,
|
||||
value: parent.id,
|
||||
});
|
||||
infoScreenData.value.downtownId = parent.id;
|
||||
childList.forEach((cityItem) => {
|
||||
countiesAreaOptions.value.push({
|
||||
label: cityItem.name,
|
||||
value: cityItem.id,
|
||||
});
|
||||
});
|
||||
break;
|
||||
case 1:
|
||||
countiesAreaOptions.value.push({
|
||||
label: parent.name,
|
||||
value: parent.id,
|
||||
});
|
||||
infoScreenData.value.countyId = parent.id;
|
||||
childList.forEach((cityItem) => {
|
||||
streetsAreaOptions.value.push({
|
||||
label: cityItem.name,
|
||||
value: cityItem.id,
|
||||
});
|
||||
});
|
||||
break;
|
||||
case 2:
|
||||
streetsAreaOptions.value.push({
|
||||
label: parent.name,
|
||||
value: parent.id,
|
||||
});
|
||||
infoScreenData.value.streetId = parent.id;
|
||||
childList.forEach((cityItem) => {
|
||||
communitiesAreaOptions.value.push({
|
||||
label: cityItem.name,
|
||||
value: cityItem.id,
|
||||
});
|
||||
});
|
||||
break;
|
||||
case 3:
|
||||
communitiesAreaOptions.value.push({
|
||||
label: parent.name,
|
||||
value: parent.id,
|
||||
});
|
||||
infoScreenData.value.communityId = parent.id;
|
||||
break;
|
||||
}
|
||||
});
|
||||
await getInfoList();
|
||||
showInfo.value = value;
|
||||
} else {
|
||||
cityType.value = null;
|
||||
showInfo.value = value;
|
||||
}
|
||||
console.log(item);
|
||||
};
|
||||
const getParams = () => {
|
||||
let result = {};
|
||||
let params = {
|
||||
landType: infoScreenData.value.landType, //0 农用地 1建设用地
|
||||
isOutTime: infoScreenData.value.isOverdue, //是否超期
|
||||
year: infoScreenData.value.year, //年
|
||||
tubanlaiyuan: infoScreenData.value.patchSource, //线索来源
|
||||
picihao: infoScreenData.value.batch, //批次号
|
||||
// countyid: infoScreenData.value.countyId,
|
||||
streetid: infoScreenData.value.streetId,
|
||||
// communityId: infoScreenData.value.communityId,
|
||||
caseNo: infoScreenData.value.mapNo, //图版编号
|
||||
startTime: infoScreenData.value.startTime, // 下发开始时间
|
||||
endTime: infoScreenData.value.endTime, // 下发结束时间
|
||||
// is_illegal: infoScreenData.value.mapType,
|
||||
// weifaleixing: infoScreenData.value.illegalType,
|
||||
// measure_name: infoScreenData.value.measure,
|
||||
nowStatus: infoScreenData.value.mapStatus, // 当前状态
|
||||
isBuildName: infoScreenData.value.markType, // 标注
|
||||
tubanArea1: infoScreenData.value.mapAreaFirst, // 线索面积1
|
||||
tubanArea2: infoScreenData.value.mapAreaLast, // 线索面积2
|
||||
gengdiArea1: infoScreenData.value.arableAreaFirst, //耕地面积1
|
||||
gengdiArea2: infoScreenData.value.arableAreaLast, //耕地面积2
|
||||
// areaid: cityType.value.areaid,
|
||||
// level: cityType.value.level,
|
||||
page: pageNo.value,
|
||||
limit: pageSize.value,
|
||||
sortType: infoScreenData.value.sort,
|
||||
order: infoScreenData.value.order,
|
||||
type: infoScreenData.value.type,
|
||||
};
|
||||
Object.keys(params).forEach((key) => {
|
||||
if (params[key] !== '' && params[key] !== null) {
|
||||
if (key === 'nowStatus') {
|
||||
result[key] = params[key].join(',');
|
||||
} else if (key === 'isOutTime') {
|
||||
if (params[key].length == 1) {
|
||||
result[key] = params[key][0];
|
||||
}
|
||||
} else {
|
||||
result[key] = params[key];
|
||||
}
|
||||
}
|
||||
});
|
||||
return result;
|
||||
};
|
||||
watch(
|
||||
() => year.value,
|
||||
(newVal) => {
|
||||
infoScreenData.value.year = newVal;
|
||||
},
|
||||
);
|
||||
watch(
|
||||
() => batch.value,
|
||||
(newVal) => {
|
||||
infoScreenData.value.batch = newVal;
|
||||
},
|
||||
);
|
||||
let map: Map;
|
||||
onMounted(() => {
|
||||
mapboxgl.accessToken = MapboxConfig.ACCESS_TOKEN;
|
||||
// map = initMap();
|
||||
getLoadDroneCaseInfoCount()
|
||||
.then((res) => {
|
||||
dataList.value = res;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
});
|
||||
onUnmounted(() => {
|
||||
map && map.remove();
|
||||
});
|
||||
const initMap = () => {
|
||||
return new mapboxgl.Map({
|
||||
container: 'showMap',
|
||||
language: 'zh-cmn',
|
||||
projection: 'equirectangular', // wgs84参考系
|
||||
style: MapboxDefaultStyle,
|
||||
maxZoom: 22,
|
||||
minZoom: 6,
|
||||
zoom: 10,
|
||||
// ...props.mapOptions,
|
||||
center: [117.984425, 35.270654],
|
||||
});
|
||||
};
|
||||
const getInfoList = () => {
|
||||
spinning.value = true;
|
||||
return getLoadDroneCaseInfoDetail(getParams())
|
||||
.then((res) => {
|
||||
total.value = res.total;
|
||||
infoDataList.value = res.items;
|
||||
})
|
||||
.finally(() => {
|
||||
spinning.value = false;
|
||||
});
|
||||
};
|
||||
const changeInfoPage = async (page, limit) => {
|
||||
pageNo.value = page;
|
||||
pageSize.value = limit;
|
||||
await getInfoList();
|
||||
};
|
||||
const changeInfoDataList = (list, totalNumber, page) => {
|
||||
infoDataList.value = list;
|
||||
total.value = totalNumber;
|
||||
pageNo.value = page;
|
||||
};
|
||||
const collectChange = (value) => {
|
||||
pageNo.value = 1;
|
||||
infoScreenData.value.type = value;
|
||||
getInfoList();
|
||||
};
|
||||
|
||||
function changeTask(val) {
|
||||
let getGeomPrams = {
|
||||
TableName: 'drone_shp_data ',
|
||||
FieldName: 'gid',
|
||||
FieldValue: val?.split(','),
|
||||
page: 1,
|
||||
limit: 999,
|
||||
key: null,
|
||||
};
|
||||
if (val) {
|
||||
getGeom(getGeomPrams).then((res) => {
|
||||
let geoms = [];
|
||||
if (res) {
|
||||
if (res.items?.length > 0) {
|
||||
res.items.forEach((item, index) => {
|
||||
let geom = {
|
||||
key: item.gid,
|
||||
mapgeom: item.geometry,
|
||||
};
|
||||
geoms.push(geom);
|
||||
});
|
||||
}
|
||||
// MapboxComponent.value.handlerDraw(status,mapgemoList.value, false);
|
||||
MapboxComponent.value.handlerDraw('Details', geoms, false);
|
||||
} else {
|
||||
createMessage.error('当前数据没有线索！');
|
||||
}
|
||||
});
|
||||
} else {
|
||||
createMessage.error('当前数据没有线索！');
|
||||
}
|
||||
}
|
||||
const infoDataListSort = (type, order) => {
|
||||
switch (order) {
|
||||
case 0:
|
||||
infoScreenData.value.sort = '';
|
||||
infoScreenData.value.order = '';
|
||||
break;
|
||||
case 1:
|
||||
infoScreenData.value.sort = type;
|
||||
infoScreenData.value.order = 'asc';
|
||||
break;
|
||||
case 2:
|
||||
infoScreenData.value.sort = type;
|
||||
infoScreenData.value.order = 'desc';
|
||||
break;
|
||||
}
|
||||
spinning.value = true;
|
||||
getLoadDroneCaseInfoDetail(getParams())
|
||||
.then((res) => {
|
||||
total.value = res.total;
|
||||
infoDataList.value = res.items;
|
||||
// pageNo.value = 1
|
||||
})
|
||||
.finally(() => {
|
||||
spinning.value = false;
|
||||
});
|
||||
};
|
||||
const resetScreenData = () => {
|
||||
infoScreenData.value.mapNo = '';
|
||||
infoScreenData.value.streetId = '';
|
||||
infoScreenData.value.mapType = '';
|
||||
infoScreenData.value.illegalType = '';
|
||||
infoScreenData.value.measure = '';
|
||||
infoScreenData.value.mapStatus = ['待确认'];
|
||||
infoScreenData.value.markType = '';
|
||||
getInfoList();
|
||||
};
|
||||
onMounted(() => {
|
||||
getInfoList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.curb-spot-city {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
.show-list {
|
||||
width: 590px;
|
||||
background: #efefef;
|
||||
:deep(.ant-spin-nested-loading) {
|
||||
height: 100%;
|
||||
}
|
||||
:deep(.ant-spin-container) {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.map {
|
||||
width: 65%;
|
||||
background: burlywood;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
export const MAPBOX_TOKEN = "pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw";
|
||||
export const MAPBOX_TOKEN = "pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg";
|
||||
|
||||
export const TINADITU_TOKEN = "b6585bc41ee16251dbe6b1af64f375d9";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export enum MapboxConfig {
|
||||
ACCESS_TOKEN = 'pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw',
|
||||
ACCESS_TOKEN = 'pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg',
|
||||
// ACCESS_TOKEN = "1234",
|
||||
TDT_TOKEN = 'b6585bc41ee16251dbe6b1af64f375d9',
|
||||
// add more config options here
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export const MAPBOX_TOKEN = "pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw";
|
||||
export const MAPBOX_TOKEN = "pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg";
|
||||
|
||||
export const TINADITU_TOKEN = "b6585bc41ee16251dbe6b1af64f375d9";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="main-container">
|
||||
<div class="videocenter-main-container">
|
||||
|
||||
<div class="search-container-box">
|
||||
<SearchComponent @handlerDraw="handlerDraw" @toPosition="toPosition" @handlerFilter="handlerFilter"></SearchComponent>
|
||||
|
|
@ -10,14 +10,15 @@
|
|||
<div></div>
|
||||
</div>
|
||||
<!-- layout -->
|
||||
<div class="main-header">
|
||||
<div class="main-header-inner">
|
||||
<div class="title">
|
||||
<img src="/statistical/logo.png" alt="" /> {{ t('sys.subject.header_title') }}
|
||||
<div class="user-info" style="z-index: 9999">
|
||||
<span style="color: #325e95">{{ fireUserLoginName }}</span>
|
||||
|
||||
<span style="color: #ddd" @click="logout">退出</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="user-info" style="z-index: 9999">
|
||||
<span style="color: #325e95">{{ fireUserLoginName }}</span>
|
||||
|
||||
<span style="color: #ddd" @click="logout">退出</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main-bottom"></div>
|
||||
|
|
@ -239,15 +240,15 @@ onMounted(() => {
|
|||
</script>
|
||||
|
||||
<style type="less" scoped>
|
||||
.main-container {
|
||||
.videocenter-main-container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 0;
|
||||
.main-header {
|
||||
width: 100vw;
|
||||
.main-header-inner {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
background: url('/videosupervision/main-top.png');
|
||||
background-size: 100% 100%;
|
||||
|
|
@ -258,22 +259,25 @@ onMounted(() => {
|
|||
.title {
|
||||
width: 600px;
|
||||
height: 90px;
|
||||
margin: 0px auto;
|
||||
position:absolute;
|
||||
left:50%;
|
||||
transform:translate(-50%,0);
|
||||
font-size: 40px;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
.user-info {
|
||||
width: 120px;
|
||||
color: #e1e1e1;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 24px;
|
||||
font-size: 14px;
|
||||
z-index: 9;
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
color: #8be5ee;
|
||||
}
|
||||
|
||||
}
|
||||
.user-info {
|
||||
width: 120px;
|
||||
color: #e1e1e1;
|
||||
position:absolute;
|
||||
top: 20px;
|
||||
right: 24px;
|
||||
font-size: 14px;
|
||||
z-index: 9;
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
color: #8be5ee;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
export const MAPBOX_TOKEN = "pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw";
|
||||
export const MAPBOX_TOKEN = "pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg";
|
||||
|
||||
export const TINADITU_TOKEN = "b6585bc41ee16251dbe6b1af64f375d9";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export enum MapboxConfig {
|
||||
ACCESS_TOKEN = 'pk.eyJ1IjoiY3VybXVkZ2VvbnBoZCIsImEiOiJjbHAxZXU2dmwwajV6MmxwZzRpdXhobjB2In0.uIuuAtk1EtV7HSbjpUfeOw',
|
||||
ACCESS_TOKEN = 'pk.eyJ1Ijoic2h1c2h1YmlvIiwiYSI6ImNsN2QxZGdxdjE2aWYzd21pazFteGY3OGMifQ.fb3z0dSPrKhHjKu50zO-sg',
|
||||
// ACCESS_TOKEN = "1234",
|
||||
TDT_TOKEN = 'b6585bc41ee16251dbe6b1af64f375d9',
|
||||
// add more config options here
|
||||
|
|
|
|||
Loading…
Reference in New Issue