HC_YFZX
/
CaiYuanYiTiHua
11
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua

dianlixunjian
徐景良 2024-07-15 17:36:28 +08:00
parent 4a7dfe4bb2 13c06b6dfd
commit 54ed97aa7c
28 changed files with 2220 additions and 918 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
.env.tiankongdi
View File

@ -12,19 +12,16 @@ VITE_BUILD_COMPRESS = 'none'
# Basic interface address SPA
# 天空地项目
VITE_GLOB_API_URL=http://123.132.248.154:9104
VITE_GLOB_API_URL=http://120.222.154.7:6050
# File upload address， optional
# It can be forwarded by nginx or write the actual address directly
VITE_GLOB_UPLOAD_URL=http://60.213.14.14:6070
VITE_GLOB_UPLOAD_URL=http://120.222.154.7:6050
# Interface prefix
VITE_GLOB_API_URL_PREFIX=
<<<<<<< HEAD
VITE_GLOB_APP_TITLE = 临沂市自然资源无人机全域巡查平台
=======
VITE_GLOB_APP_TITLE = 临沂市自然资源综合监管平台
>>>>>>> 1baf4278c134b7cd31e07b595f1947d5358e7099
# 专题名称
VITE_GLOB_ZT_TITLE = 全域巡查监管
VITE_GLOB_APP_LOGO = /tiankongdi-logo.png

1
.gitignore vendored
View File

@ -1,6 +1,7 @@
node_modules
.DS_Store
dist
dist.zip
.cache
.turbo

9
public/bigScreen/lib/mars3d/mars3d.css
View File

File diff suppressed because one or more lines are too long

8
public/bigScreen/lib/mars3d/plugins/navigation/mars3d-navigation.css
View File

File diff suppressed because one or more lines are too long

8
public/bigScreen/lib/mars3d/plugins/navigation/mars3d-navigation.js
View File

File diff suppressed because one or more lines are too long

8
public/bigScreen/lib/mars3d/plugins/widget/mars3d-widget.css
View File

@ -1,7 +1 @@
/*!
* Mars3D平台插件,原生JS下的项目widget模块化设计功能模块
* 版本信息：v3.0.1, hash值: aada21ae7cd70c2a2efa
* 编译日期：2021-03-29 20:58:42
* 版权所有：Copyright by 火星科技 http://mars3d.cn
*
*/.mars3d-widgetbar{margin:0 auto;position:absolute;bottom:30px;left:20%;width:60%;height:auto;z-index:1987}.mars3d-widgetbar .fa{margin-right:5px}
.mars3d-widgetbar{margin:0 auto;position:absolute;bottom:30px;left:20%;width:60%;height:auto;z-index:1987}.mars3d-widgetbar .fa{margin-right:5px}

18
src/api/tiankongdi/index.ts
View File

@ -35,8 +35,10 @@ enum Api {
AddtaskFavorite = '/api/DroneCaseInfoSingle/AddtaskFavorite',
// 审核列表删除收藏
DeleteTaskCase = '/api/DroneCaseInfoSingle/DeleteTaskCase',
// 获取当前账号可以看见的乡镇
loadStreet = '/api/DroneCaseInfoSingle/loadStreet'
// 获取当前账号可以看见的乡镇
loadStreet = '/api/DroneCaseInfoSingle/loadStreet',
// 违法处理，待办任务列表
LoadTaskIllegalDetailList = '/api/DroneCaseInfoSingle/LoadTaskIllegalDetailList',
}
/**
@ -72,7 +74,7 @@ export function getLoadTaskDetailList(params?: taskInfoParams) {
export function addCaseFavorite(params?: addCaseFavoriteParams) {
return defHttp.post({ url: Api.AddCaseFavorite, params });
}
export function addTaskFavorite(params?: {taskId:string,favoriteUserId: string}) {
export function addTaskFavorite(params?: { taskId: string; favoriteUserId: string }) {
return defHttp.post({ url: Api.AddtaskFavorite, params });
}
export function deleteFavoriteCase(params: string) {
@ -91,8 +93,12 @@ export function getCaseInfoById(params?: { id: string }) {
export const updateDroneCaseInfo = (params: updateCaseInfoParams) =>
defHttp.post({ url: Api.UpdateDroneCaseInfo, params });
export const updateSupervise = (params: {id:string,supervise: number}) =>
export const updateSupervise = (params: { id: string; supervise: number }) =>
defHttp.post({ url: `${Api.Supervise}?id=${params.id}&supervise=${params.supervise}`, params });
export const getLoadParents = (params: {childId:Number}) =>
defHttp.get({ url: `${Api.LoadParents}?childId=${params.childId}`,});
export const getLoadParents = (params: { childId: Number }) =>
defHttp.get({ url: `${Api.LoadParents}?childId=${params.childId}` });
export function getLoadTaskIllegalDetailList(params?: taskInfoParams) {
return defHttp.get({ url: Api.LoadTaskIllegalDetailList, params });
}

2
src/locales/lang/zh-CN/sys.json
View File

@ -98,7 +98,7 @@
"header_title": "临沂市自然资源综合监管平台",
"header_admin": "，欢迎进入！",
"header_logout": "退出系统",
"bottom_copyright": "版权所有：临沂市自然资源和规划局",
"bottom_copyright": "管理单位：临沂市自然资源和规划局",
"bottom_support": "技术⽀持：山东慧创信息科技有限公司",
"bottom_version": "系统版本：V1.0"
}

180
src/router/routes/modules/dashboard.ts
View File

@ -5,96 +5,96 @@ import { t } from '@/hooks/web/useI18n';
const dashboard: AppRouteModule =
{
// path: '/dashboard',
// name: 'Dashboard',
// component: LAYOUT,
// redirect: '/dashboard/analysis',
// meta: {
// orderNo: 10,
// icon: 'ion:grid-outline',
// title: t('routes.dashboard.dashboard'),
// },
// children: [
// {
// path: '/dashboard/analysis',
// name: 'Analysis',
// component: () => import('@/views/dashboard/analysis/index.vue'),
// meta: {
// // affix: true,
// title: t('routes.dashboard.analysis'),
// },
// },
// {
// path: '/dashboard/test',
// name: 'test',
// component: () => import('@/views/dashboard/test/index.vue'),
// meta: {
// // affix: true,
// title: t('routes.dashboard.test'),
// },
// },
// {
// path: '/formCallPage',
// name: 'formCallPage',
// meta: {
// title: '表单调用',
// hideMenu: true,
// },
// beforeEnter: (to: any, from: any, next: Function) => {
// to.meta.title = to.query.name;
// next();
// },
// component: () => import('@/views/demo/onlineform/formCall/index.vue'),
// },
// {
// path: 'scheme_preview/:id',
// name: 'SchemePreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.scheme_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/scheme',
// },
// component: () => import('@/views/demo/workflow/scheme/preview.vue'),
// },
// {
// path: 'create_preview/:id',
// name: 'CreatePreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.create_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/create',
// },
// component: () => import('@/views/demo/workflow/h5/create.vue'),
// },
// {
// path: 'task_audit_preview/:id',
// name: 'TaskAuditPreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.task_audit_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/task',
// },
// component: () => import('@/views/demo/workflow/h5/audit.vue'),
// },
// {
// path: 'task_look_preview/:id',
// name: 'TaskLookPreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.task_look_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/task',
// },
// component: () => import('@/views/demo/workflow/h5/look.vue'),
// },
// ],
path: '/dashboard',
name: 'Dashboard',
component: LAYOUT,
redirect: '/dashboard/analysis',
meta: {
orderNo: 10,
icon: 'ion:grid-outline',
title: t('routes.dashboard.dashboard'),
},
children: [
// {
// path: '/dashboard/analysis',
// name: 'Analysis',
// component: () => import('@/views/dashboard/analysis/index.vue'),
// meta: {
// // affix: true,
// title: t('routes.dashboard.analysis'),
// },
// },
{
path: '/dashboard/test',
name: 'test',
component: () => import('@/views/dashboard/test/index.vue'),
meta: {
// affix: true,
title: t('routes.dashboard.test'),
},
},
// {
// path: '/formCallPage',
// name: 'formCallPage',
// meta: {
// title: '表单调用',
// hideMenu: true,
// },
// beforeEnter: (to: any, from: any, next: Function) => {
// to.meta.title = to.query.name;
// next();
// },
// component: () => import('@/views/demo/onlineform/formCall/index.vue'),
// },
// {
// path: 'scheme_preview/:id',
// name: 'SchemePreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.scheme_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/scheme',
// },
// component: () => import('@/views/demo/workflow/scheme/preview.vue'),
// },
// {
// path: 'create_preview/:id',
// name: 'CreatePreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.create_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/create',
// },
// component: () => import('@/views/demo/workflow/h5/create.vue'),
// },
// {
// path: 'task_audit_preview/:id',
// name: 'TaskAuditPreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.task_audit_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/task',
// },
// component: () => import('@/views/demo/workflow/h5/audit.vue'),
// },
// {
// path: 'task_look_preview/:id',
// name: 'TaskLookPreview',
// meta: {
// hideMenu: true,
// title: t('routes.demo.workflow.task_look_preview'),
// ignoreKeepAlive: true,
// showMenu: false,
// currentActiveMenu: '/workflow/task',
// },
// component: () => import('@/views/demo/workflow/h5/look.vue'),
// },
],
};

BIN
src/views/dashboard/test/SearchMenu/CloudQueryModal/01B759D0-567B-4794-9386-645E7DC93C5F.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.7 MiB

BIN
src/views/dashboard/test/SearchMenu/CloudQueryModal/53E2647B-EF88-4793-9BFE-281F3EDD2BC7.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.4 MiB

3
src/views/dashboard/test/SearchMenu/CloudQueryModal/BasicQuery/index.vue
View File

@ -13,7 +13,7 @@
:width="470"
:height="470"
:preview="false"
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
:src="image"
/>
</template>
<template v-if="selectType === 1"></template>
@ -45,6 +45,7 @@
import { ref } from "vue"
import ShowTableList from '@/views/dashboard/test/components/ShowTableList/index.vue'
import ModalMap from './ModalMap/index.vue'
import image from '../01B759D0-567B-4794-9386-645E7DC93C5F.png'
const type = ref('1')
const addOnMap = ref(false)
const selectType = ref(0)

4
src/views/dashboard/test/SearchMenu/CloudQueryModal/HistoryPhoto/index.vue
View File

@ -14,7 +14,7 @@
<div style="position: relative;">
<a-image
:height="300"
:src="image.url"
:src="image1"
/>
<div class="showImageInfo">
<div>任务名称：{{ image.title }}</div>
@ -39,6 +39,8 @@
<script setup lang="ts">
import { LeftCircleOutlined, RightCircleOutlined } from "@ant-design/icons-vue"
import { computed, ref } from "vue"
import image1 from '@/views/dashboard/test/SearchMenu/CloudQueryModal/01B759D0-567B-4794-9386-645E7DC93C5F.png'
import image2 from '@/views/dashboard/test/SearchMenu/CloudQueryModal/53E2647B-EF88-4793-9BFE-281F3EDD2BC7.png'
const data = ref([
{

4
src/views/dashboard/test/components/ShowImage/index.vue
View File

@ -8,7 +8,7 @@
<a-image
:width="470"
:height="470"
:src="select === 0? specialUrl: screenshotUrl"
:src="select === 0? image1: image2"
/>
<div class="footer" v-if="haveFooter">
<slot name="footer" />
@ -17,6 +17,8 @@
<script setup lang="ts">
import { ref, defineProps } from "vue"
import image1 from '@/views/dashboard/test/SearchMenu/CloudQueryModal/01B759D0-567B-4794-9386-645E7DC93C5F.png'
import image2 from '@/views/dashboard/test/SearchMenu/CloudQueryModal/53E2647B-EF88-4793-9BFE-281F3EDD2BC7.png'
const select = ref(0)
const props = defineProps(["data", "haveFooter"])
const { data:{ specialUrl, screenshotUrl }, haveFooter=false } = props

3
src/views/dashboard/test/index.vue
View File

@ -1,7 +1,10 @@
<template>
<div style="width:100%; height: 100%;">
<div class="mapContainer" id="showMapContainer"></div>
<SearchMenu></SearchMenu>
<ResourceMenu></ResourceMenu>
</div>
</template>
<script setup lang="ts">

357
src/views/demo/statistical/illegaltreatment/AuditProgress/index.vue Normal file
View File

@ -0,0 +1,357 @@
<template>
<div class="screen-div">
<div class="screen-row">
<div class="screen-item">
<div class="screen-item-label" style="margin-right: 9px">年份</div>
<a-select
allowClear
style="width: 103px"
v-model:value="props.year"
:options="yearOptions"
@change="
(value) => {
emits('auditProgressScreenChange', value, 'year');
}
"
/>
</div>
<div class="screen-item" style="margin-left: 20px; margin-right: 17px">
<div class="screen-item-label" style="margin-right: 11px">图斑来源</div>
<a-select
allowClear
style="width: 142px"
v-model:value="props.patchSource"
:options="patchSourceOptions"
@change="
(value) => {
emits('auditProgressScreenChange', value, 'patchSource');
}
"
/>
</div>
<div class="screen-item">
<div class="screen-item-label" style="margin-right: 9px">批次</div>
<a-input
allowClear
class="item-input"
style="width: 117px"
v-model:value="props.batch"
@change="(value) => emits('auditProgressScreenChange', value.target.value, 'batch')"
/>
</div>
</div>
</div>
<div class="data-list">
<!-- <div class="data-title">审核进度</div> -->
<div class="show-data-list-content">
<div
class="data-item"
v-for="(item, index) in dataList"
:key="index"
@click="emits('showInfo', item)"
v-if="dataList.length > 0"
>
<div class="name-div">
<!-- <div class="item-mark"></div> -->
<div class="icon-name">
<img src="/positioning.png" class="item-mark" />
<div class="item-label">{{ item.areaname }}</div>
</div>
<!-- <div class="progress-div">
<div class="progress-label progress-color">进度</div>
<div class="progress-data" style="width:97px">
<span style="color: #086DEC;">{{item.verificatedtask}}</span>/{{item.totaltask}}
</div>
</div>
<div class="progress-div">
<div class="progress-label extended-color">超期</div>
<div class="progress-data" style="width:40px">
<span style="color: #D03542">{{item.overduetask}}</span>
</div>
</div> -->
<div class="progress-div">
<div class="progress-label reviewed-color" style="width: 70px">待审核</div>
<div class="progress-data" style="width: 31px">
<span style="color: #ec7908">{{ item.verifytask }}</span>
</div>
</div>
</div>
<div class="info-data-div">
<div class="info-data-item">
<div class="info-data-label">下发</div>
<div class="info-data-data">{{item.makeupcase}}</div>
</div>
<div
style="
width: 1px;
margin-right: 15px;
margin-left: 15px;
background-color: #ededed;
height: 15px;
"
></div>
<div class="info-data-item">
<div class="info-data-label">接收</div>
<div class="info-data-data">{{item.receivetask}}</div>
</div>
<div
style="
width: 1px;
margin-right: 15px;
margin-left: 15px;
background-color: #ededed;
height: 15px;
"
></div>
<div class="info-data-item">
<div class="info-data-label">非粮化</div>
<div class="info-data-data">{{ item.nonfoodcase }}</div>
</div>
<div
style="
width: 1px;
margin-right: 15px;
margin-left: 15px;
background-color: #ededed;
height: 15px;
"
></div>
<div class="info-data-item">
<div class="info-data-label">拆除复耕</div>
<div class="info-data-data">{{ item.rehabilitationcase }}</div>
</div>
<div
style="
width: 1px;
margin-right: 15px;
margin-left: 15px;
background-color: #ededed;
height: 15px;
"
></div>
<div class="info-data-item">
<div class="info-data-label">补办手续</div>
<div class="info-data-data">{{ item.makeupcase }}</div>
</div>
</div>
<!-- <div class="data-div">
<spam style="color: #086dec">{{ item.count }}</spam>
</div> -->
</div>
<div v-else class="no-data">
<a-empty :image="simpleImage" />
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, defineProps, defineEmits, toRefs } from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import { Empty } from 'ant-design-vue';
import { patchSourceOptions } from '../util.ts';
const props = defineProps([
'year',
'batch',
'patchSource',
'batchOptions',
'yearOptions',
'dataList',
]);
const emits = defineEmits(['auditProgressScreenChange', 'showInfo']);
const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
// function changeParam(val,type) {
// emits('auditProgressScreenChange', val, type);
// }
</script>
<style lang="less" scoped>
.screen-div {
padding: 22px 12px 14px 13px;
.screen-row {
display: flex;
height: 39px;
.screen-item {
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 17px;
color: #000000;
// width: 33.3%;
display: flex;
.item-input {
width: 223px;
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);
}
.screen-item-label {
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 17px;
color: #000000;
line-height: 30px;
display: flex;
align-items: center;
}
: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);
}
}
}
}
.data-list {
height: calc(100% - 85px);
// background: darkgoldenrod;
// background: @component-background;
margin-top: 10px;
padding: 0px 11px 0px 13px;
.data-title {
height: 40px;
background: #bab9b7;
font-size: 18px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
color: #366198;
}
.show-data-list-content {
.data-item {
cursor: pointer;
width: 100%;
background: #fff;
border-radius: 11px;
padding: 0px 17px 0px 12px;
margin-bottom: 8px;
.name-div {
display: flex;
height: 57px;
align-items: center;
padding: 10px 0px;
border-bottom: 1px solid #e5e5e5;
justify-content: space-between;
.icon-name {
display: flex;
align-items: center;
}
}
.info-data-div {
height: 61px;
display: flex;
align-items: center;
padding-left: 2px;
// justify-content: space-between;
// margin-top: 10px;
.info-data-item {
display: flex;
align-items: center;
// flex: 1;
justify-content: center;
// border-right: 1px solid #EDEDED;
.info-data-label {
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 16px;
color: #959494;
display: flex;
line-height: 30px;
margin-right: 11px;
}
.info-data-data {
font-family: HarmonyOS Sans;
font-weight: 500;
font-size: 16px;
color: #000000;
line-height: 30px;
display: flex;
}
}
.info-data-item:nth-last-child(1) {
border-right: 0px;
}
}
.data-div {
font-weight: 500;
margin-right: 5px;
}
.item-mark {
width: 17px;
height: 17px;
// background: #086dec;
// margin-left: 7px;
// margin-right: 7px;
}
.item-label {
width: 122px;
padding-left: 9px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 23px;
color: #000000;
line-height: 30px;
}
.progress-div {
display: flex;
// font-weight: 500;
// font-size: 16px;
// line-height: 30px;
margin-right: 17px;
.progress-label {
font-family: Alibaba PuHuiTi;
color: #ffffff;
width: 50px;
height: 27px;
border-radius: 13px 0px 0px 13px;
display: flex;
align-items: center;
justify-content: center;
}
.progress-data {
background: #efefef;
height: 27px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0px 0px 11px 0px;
font-family: HarmonyOS Sans;
font-weight: 500;
font-size: 19px;
// color: #086DEC;
line-height: 30px;
}
.progress-color {
background: #086dec;
}
.extended-color {
background: #d03542;
}
.reviewed-color {
background: #ec7908;
}
}
}
.data-item:hover {
background-color: rgba(8, 109, 236, 0.08);
}
// .data-item:nth-child(2n) {
// background: #ececec;
// }
}
}
.no-data {
padding: 20px 0;
}
</style>

708
src/views/demo/statistical/illegaltreatment/MapList/index.vue Normal file
View File

@ -0,0 +1,708 @@
<template>
<div class="map-list-content">
<div class="screen-div">
<div class="screen-item" style="margin-right:20px;margin-bottom:15px;">
<div class="screen-item-label">年份</div>
<a-select
allowClear
style="width:130px;"
v-model:value="params.year"
:options="props.yearOptions"
/>
</div>
<div class="screen-item" style="margin-right:17px;margin-bottom:15px;">
<div class="screen-item-label">图斑来源</div>
<a-select
allowClear
style="width:130px;"
v-model:value="params.tubanlaiyuan"
:options="patchSourceOptions"
/>
</div>
<div class="screen-item" style="margin-bottom:15px;">
<div class="screen-item-label">批次</div>
<a-input
allowClear
class="item-input"
style="width:103px;"
v-model:value="params.picihao"
/>
</div>
<div class="screen-item" style="margin-right:13px;">
<div class="screen-item-label">举证</div>
<a-select
allowClear
style="width:130px;"
v-model:value="params.is_build_name"
:options="markTypeOptions"
/>
</div>
<div class="screen-item" style="margin-right:51px;">
<!-- <div class="screen-item-label">图斑号</div> -->
<a-input allowClear v-model:value="params.geomid" class="item-input" placeholder="请输入图斑编号"/>
</div>
<div class="screen-item" style="display: flex; justify-content: end;margin-bottom: 0px;">
<a-button type="primary" class="item-button" :icon="h(SearchOutlined)" @click="query">查询</a-button>
</div>
</div>
<div class="sift-div">
<div class="layout-div">
<RollbackOutlined class="back-button" @click="emits('changeShowParent')"/>
<div class="interval-div"></div>
<div class="sift-item" @click="dataListSort('area')">
<div class="sift-label">总面积</div>
<div class="sift-icon">
<div :style="`${showSortMark('area',1)? 'color: #086DEC;': ''}`">&#9650</div>
<div :style="`${showSortMark('area',2)? 'color: #086DEC;': ''}`">&#9660</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;': ''}`">&#9650</div>
<div :style="`${showSortMark('gengdi_area',2)? 'color: #086DEC;': ''}`">&#9660</div>
</div>
</div>
<div class="sift-item" @click="dataListSort('yongjiujibennongtian_area')">
<div class="sift-label">基本农田</div>
<div class="sift-icon">
<div :style="`${showSortMark('yongjiujibennongtian_area',1)? 'color: #086DEC;': ''}`">&#9650</div>
<div :style="`${showSortMark('yongjiujibennongtian_area',2)? 'color: #086DEC;': ''}`">&#9660</div>
</div>
</div>
<div class="sift-item" @click="dataListSort('CreateDate')">
<div class="sift-label">下发时间</div>
<div class="sift-icon">
<div :style="`${showSortMark('CreateDate',1)? 'color: #086DEC;': ''}`">&#9650</div>
<div :style="`${showSortMark('CreateDate',2)? 'color: #086DEC;': ''}`">&#9660</div>
</div>
</div>
</div>
<div class="collect-div">
<Icon
:style="`font-size: 30px; cursor: pointer;${openCollect? 'color:#F7710F': ''}`"
icon="mdi:folder-star"
@click="getCollectList"
/>
</div>
</div>
<div class="data-list-div" style="padding-top: 3px;">
<div
v-for="(item, index) in dataList"
:key="index"
class="data-list-item"
v-if="dataList.length > 0"
>
<div class="data-list-layout-div">
<div class="data-list-title-div">
<img src="/positioning.png" class="map-mark" @click="locationFun(item)"/>
<div class="label-div">
<div class="item-label">{{item.countyname}}</div>
<div class="item-sub-label">
<span style="margin-right:12px;">{{item.streetname}}</span>
<span>{{item.case_no}}</span>
</div>
</div>
<div class="item-mark" v-if="item.is_build_name">{{item.is_build_name}}</div>
</div>
<div
class="data-item-type-div"
:style="`border-color:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'}`"
@click="goAudit(item)">
<div>
<div class="type-title">举证</div>
<div class="type-data" :style="`background:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'};`">
{{item.is_illegal === 0? '合法': item.is_illegal === 1? '违法': '其他'}}
</div>
</div>
</div>
</div>
<div class="data-list-info-div">
<div class="info-layout-div">
<div class="info-item">
<div class="info-label">总</div>
<div class="info-data">{{item.area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">耕</div>
<div class="info-data">{{item.gengdi_area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">基</div>
<div class="info-data">{{item.yongjiujibennongtian_area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">农</div>
<div class="info-data">{{item.nongyongdi_area}}亩</div>
</div>
</div>
<div class="info-layout-div">
<div>
<Icon
:style="`font-size: 30px; color: #314A8C; cursor: pointer;${item.isouttime === 2? 'color: #D03542;': item.isouttime === 1? 'color: #F7710F;': 'color: #314A8C;'}`"
icon="icon-park-solid:timer"
@click="()=>{}"
/>
</div>
<div style="background: rgb(237, 237, 237);width: 1px;height: 100%;margin-right: 10px;margin-left: 10px;"></div>
<div>
<Icon
:style="`font-size: 30px; cursor: pointer;${item.Fid? 'color:#F7710F': ''}`"
icon="mdi:folder-star-outline"
@click="collectItem(item)"
/>
</div>
</div>
</div>
</div>
</div>
<div class="pagination-div" v-if="dataList.length > 0">
<a-pagination
size="small"
v-model:current="pageNumber"
v-model:pageSize="pageSizeNumber"
:total="total"
show-size-changer
show-quick-jumper
@change="changePagination"
/>
</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"
@closeModel="closeMolder"
/>
</a-modal>
</div>
</template>
<script setup lang="ts">
import { onMounted, ref, defineEmits, computed, h } from 'vue';
import { StarOutlined,StarFilled } from '@ant-design/icons-vue';
import Icon from '@/components/Icon/Icon.vue';
import { getLoadTaskIllegalDetailList, updateSupervise, addTaskFavorite, deleteTaskCase } from '@/api/tiankongdi/index';
import { flowStore } from '@/store/modules/flow';
import { getDetail } from '@/api/sys/WFSchemeInfo';
import { Audit } from '@/views/demo/workflow/task/process/page';
import { Empty } from 'ant-design-vue';
import { message } from 'ant-design-vue';
import { useUserStore } from '@/store/modules/user.ts'
import { SearchOutlined, RollbackOutlined } from '@ant-design/icons-vue';
import { patchSourceOptions } from '../util.ts'
const userStore = useUserStore()
const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
const emits = defineEmits(['changeTask', 'changeShowParent']);
const flowWfDataStore = flowStore();
const props = defineProps(['areaId', 'yearOptions', 'year','level','batch','patchSource','batchOptions']);
const processId = ref('');
const taskId = ref('');
const isRead: any = ref(0);
const type = ref('');
const order = ref(0)
const auditOpen = ref(false);
const showDataIndex = ref()
const handoffShow = ref(true)
const openCollect = computed(() => {
if(params.value.type === null) return false
return true
})
const params = ref({
page: 1,
limit: 10,
level: props.level,
areaid: props.areaId,
geomid: null,
year: props.year,
picihao: props.batch,
tubanlaiyuan: props.patchSource,
is_build_name: null,
type: null,
sort: null,
order: null,
});
const markTypeOptions = ref([
{ label: '非粮化', value: '非粮化' },
{ label: '拆除复耕', value: '拆除复耕' },
{ label: '补办手续', value: '补办手续' },
]);
const dataList = ref([]);
const total = ref(0);
const pageNumber = ref(1)
const pageSizeNumber = ref(10)
function query() {
params.value.page = 1;
getTaskList();
}
async function getTaskList() {
console.log(params.value);
const data = await getLoadTaskIllegalDetailList(params.value);
dataList.value = data.items;
total.value = data.total;
}
function changePagination(page, pageSize) {
console.log(page, pageSize);
params.value.page = page;
params.value.limit = pageSize;
getTaskList();
}
async function goAudit(record) {
showDataIndex.value = dataList.value.findIndex(item => item.taskeid === record.taskeid)
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.taskeid;
type.value = record.type;
}
async function locationFun(record) {
emits('changeTask', record);
}
onMounted(() => {
getTaskList();
});
const changeSupervise = (item) => {
if(item.cancelsupervise === 0 && item.issupervise === 1){
message.error('取消改督办权限不足')
return
}
let params = {
id: item.processid,
supervise: 1,
}
if(item.issupervise === 1){
params.supervise = 0
}
updateSupervise(params).then(res => {
if(params.supervise === 1){
message.success('成功发起督办')
}else{
message.success('取消督办成功')
}
getTaskList();
})
}
const prevData = async () => {
if(showDataIndex.value === 0){
if(params.value.page === 1){
message.warning('已经是第一条数据了')
return
}
pageNumber.value = pageNumber.value - 1
params.value.page = params.value.page -1
await getTaskList();
showDataIndex.value = dataList.value.length -1
}else{
showDataIndex.value = showDataIndex.value -1
}
handoffShow.value = false
let record = dataList.value[showDataIndex.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.taskeid;
type.value = record.type;
handoffShow.value = true
}
const nextData = async () => {
if(showDataIndex.value === dataList.value.length -1){
if(Math.ceil(total.value / pageSizeNumber.value) === pageNumber.value){
message.warning('已经是最后一条数据了')
return
}
pageNumber.value = pageNumber.value + 1
params.value.page = params.value.page + 1
await getTaskList();
showDataIndex.value = 0
}else{
showDataIndex.value = showDataIndex.value + 1
}
handoffShow.value = false
let record = dataList.value[showDataIndex.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.taskeid;
type.value = record.type;
handoffShow.value = true
}
const cancelCollectItem = (item) => {
deleteTaskCase(item.Fid).then(res => {
message.success('取消收藏成功')
getTaskList();
})
}
const collectItem = (item) => {
if(item.Fid){
cancelCollectItem(item)
return
}
let userInfo = userStore.getUserInfo
let params = {
taskId: item.taskeid,
favoriteUserId: userInfo.id
}
addTaskFavorite(params).then(res => {
message.success('收藏成功')
getTaskList();
})
}
const getCollectList = () => {
if(params.value.type === null){
params.value.type = 1
}else if(params.value.type === 1){
params.value.type = null
}
params.value.page = 1
pageNumber.value = 1
getTaskList();
}
const showSortMark = (key, sort) => {
if(params.value.sort === key && sort === order.value){
return true
}
return false
}
const dataListSort = (type) => {
if(params.value.sort === null || params.value.sort === type){
order.value = (order.value + 1) % 3
}else{
order.value = 1
}
// emits('infoDataListSort', type, order.value)
switch(order.value){
case 0:
params.value.sort = null
params.value.order = null
break
case 1:
params.value.sort = type
params.value.order = 'asc'
break
case 2:
params.value.sort = type
params.value.order = 'desc'
break
}
getTaskList();
}
const closeMolder = () => {
getTaskList();
}
</script>
<style lang="less">
.full-modal {
.ant-modal {
max-width: 100%;
top: 0;
}
.ant-modal-content {
height: calc(100vh);
}
.ant-modal-body {
height: 85%;
}
}
</style>
<style lang="less" scoped>
.handoff{
width: 100%;
display: flex;
justify-content: flex-end;
padding-right: 25px;
}
.map-list-content {
height: 100%;
display: flex;
flex-direction: column;
}
.screen-div {
padding: 22px 12px 19px 13px;
display: flex;
width: 590px;
// margin-top: 10px;
flex-wrap: wrap;
// background: @component-background;
.screen-item {
// width: 33.3%;
display: flex;
// margin-bottom: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 17px;
color: #000000;
height: 39px;
.screen-item-label {
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 17px;
color: #000000;
line-height: 30px;
display: flex;
align-items: center;
margin-right: 9px;
}
: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{
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 19px;
color: #000000;
line-height: 30px;
width:223px;
box-shadow: 2px 3px 3px 1px rgba(13,13,13,0.05);
}
.item-button{
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 19px;
color: #FFFFFF;
line-height: 30px;
height:39px;
width: 97px;
background:#086DEC;
}
}
.screen-button-div {
display: flex;
justify-content: space-between;
width: 100%;
}
}
.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;
// margin-top: 10px;
height: 60vh;
scrollbar-width: none; /* firefox */
-ms-overflow-style: none; /* IE 10+ */
.data-list-item{
background:#fff;
padding:10px;
// border-radius:6px;
margin-bottom:4px;
.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;
cursor:pointer;
}
.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;
}
.item-mark{
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 13px;
color: #FFFFFF;
background: rgba(0,0,0,0.59);
padding: 5px 8px;
border-radius: 14px;
}
}
.data-item-type-div{
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 15px;
color: #000000;
border: 1px solid;
width: 37px;
height: 37px;
border-radius: 4px;
cursor: pointer;
user-select: none;
.type-title{
display:flex;
align-items:center;
justify-content: center;
}
.type-data{
background:#086DEC;
color:#fff;
display:flex;
align-items:center;
justify-content: center;
}
}
}
.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: 80px;
border-radius: 7px;
margin-right: 8px;
height: 33px;
justify-content: center;
.info-label{
font-family: Alibaba PuHuiTi;
font-weight: 400;
font-size: 16px;
color: #959494;
// width:45%;
display: flex;
justify-content: center;
padding-right: 5px;
}
.info-data{
font-family: HarmonyOS Sans;
font-weight: 500;
font-size: 16px;
color: #000000;
}
}
}
}
.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 {
background: @component-background;
padding: 0 10px 10px;
}
.no-data {
padding: 20px 0;
}
.rollback {
background: @component-background;
padding: 10px;
}
</style>

234
src/views/demo/statistical/illegaltreatment/index-old.vue Normal file
View File

@ -0,0 +1,234 @@
<template>
<div>
<BasicTable @register="registerTable">
<template #toolbar>
<PermissionBtn @btn-event="onBtnClicked" />
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction :actions="createActions(record)" />
</template>
</template>
</BasicTable>
<a-modal
style="width: 100vw; top: 0px; left: 0px; margin: 0px; padding: 0px"
wrap-class-name="full-modal"
v-model:open="showInfoOpen"
title="详情"
:footer="null"
:maskClosable="true"
:destroyOnClose="true"
@cancel="showInfoOpen = false"
>
<div class="modal-content">
<ShowInfoModal :showInfoData="showInfoData" />
</div>
</a-modal>
</div>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction, EditRecordRow } from '@/components/Table';
import { loadCaseInfoIllegalList, dealIllegalCaseInfo } from '@/api/demo/system';
import { PermissionBtn } from '@/components/PermissionBtn/index';
import { columns, searchFormSchema } from './illegaltreatment.data';
import { getAppEnvConfig } from '@/utils/env';
import axios from 'axios';
import ShowInfoModal from '@/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue';
import { getCaseInfoById } from '@/api/tiankongdi/index';
import { useMessage } from '@/hooks/web/useMessage';
import { cloneDeep } from 'lodash-es';
const { VITE_GLOB_API_URL } = getAppEnvConfig();
const { createMessage } = useMessage();
defineOptions({ name: 'RoleManagement' });
const searchInfo = reactive<Recordable>({
countyid: null,
});
const showInfoData = ref();
const showInfoOpen = ref(false);
const searchParams = ref();
const [registerTable] = useTable({
title: '违法处理',
api: loadCaseInfoIllegalList,
columns,
formConfig: {
labelWidth: 120,
showAdvancedButton: false,
schemas: searchFormSchema,
},
useSearchForm: true,
showTableSetting: true,
tableSetting: { fullScreen: true },
// 搜索
handleSearchInfoFn(info) {
searchParams.value = info;
return info;
},
actionColumn: {
width: 120,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const currentEditKeyRef = ref('');
function createActions(record: EditRecordRow): ActionItem[] {
if (!record.editable) {
return [
{
label: '编辑',
disabled: currentEditKeyRef.value ? currentEditKeyRef.value !== record.Id : false,
onClick: handleEdit.bind(null, record),
},
{
// icon: 'ant-design:ellipsis-outlined',
label: '查看',
onClick: viewAccount.bind(null, record),
},
];
}
return [
{
label: '保存',
onClick: handleSave.bind(null, record),
},
{
label: '取消',
popConfirm: {
title: '是否取消编辑',
confirm: handleCancel.bind(null, record),
},
},
];
}
function handleEdit(record: EditRecordRow) {
console.log(record);
currentEditKeyRef.value = record.Id;
record.onEdit?.(true);
}
function handleCancel(record: EditRecordRow) {
currentEditKeyRef.value = '';
record.onEdit?.(false, false);
}
async function handleSave(record: EditRecordRow) {
console.log(record);
// 校验
createMessage.loading({ content: '正在保存...', duration: 0, key: 'saving' });
const valid = await record.onValid?.();
console.log(valid);
if (valid) {
try {
const data = cloneDeep(record.editValueRefs);
console.log(data);
let querys = { ...data };
querys.id = record.Id;
console.log(querys);
//TODO 此处将数据提交给服务器保存
const res = await dealIllegalCaseInfo(querys);
console.log(res);
if (res) {
// 保存之后提交编辑状态
const pass = await record.onEdit?.(false, true);
if (pass) {
currentEditKeyRef.value = '';
}
createMessage.success({ content: '数据已保存', key: 'saving' });
}
} catch (error) {
createMessage.error({ content: '保存失败', key: 'saving' });
}
} else {
// const pass = await record.onEdit?.(false, true);
createMessage.error({ content: '请填写正确的数据', key: 'saving' });
}
}
// 直接下载接口返回的二进制流
function handleExport() {
let params = { ...searchParams.value };
params.countyid = searchInfo?.countyid;
axios({
method: 'post',
url: VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportCaseInfoIllegalList',
params: params,
headers: {
'X-Token': localStorage.getItem('X-Token'),
},
responseType: 'blob',
}).then((res) => {
console.log('excel', res);
let fileName = '违法处理统计报表' + new Date().getTime() + '.xls';
const elink = document.createElement('a');
elink.download = fileName;
elink.style.display = 'none';
elink.href = URL.createObjectURL(res.data);
document.body.appendChild(elink);
elink.click();
URL.revokeObjectURL(elink.href);
document.body.removeChild(elink);
});
}
function onBtnClicked(domId) {
switch (domId) {
case 'btnExport':
handleExport();
break;
default:
break;
}
}
function viewAccount(record) {
console.log(record);
getCaseInfoById({ id: record.Id }).then((res) => {
showInfoData.value = res;
showInfoOpen.value = true;
});
}
</script>
<style lang="scss" scoped>
.data-preview-container {
width: 100%;
height: calc(100% - 0px);
position: absolute;
padding: 30px 10px;
top: 0px;
left: 0px;
background: #fff;
}
.data-preview-container-option {
width: 120px;
height: 40px;
position: absolute;
top: 30px;
right: 0px;
}
.data-preview-container-option div {
width: 40px;
height: 40px;
line-height: 40px;
float: left;
text-align: center;
cursor: pointer;
}
.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;
}
}
</style>

391
src/views/demo/statistical/illegaltreatment/index.vue
View File

@ -1,234 +1,205 @@
<template>
<div>
<BasicTable @register="registerTable">
<template #toolbar>
<PermissionBtn @btn-event="onBtnClicked" />
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction :actions="createActions(record)" />
</template>
</template>
</BasicTable>
<a-modal
style="width: 100vw; top: 0px; left: 0px; margin: 0px; padding: 0px"
wrap-class-name="full-modal"
v-model:open="showInfoOpen"
title="详情"
:footer="null"
:maskClosable="true"
:destroyOnClose="true"
@cancel="showInfoOpen = false"
>
<div class="modal-content">
<ShowInfoModal :showInfoData="showInfoData" />
</div>
</a-modal>
<div class="curb-spot-city">
<div class="show-list">
<AuditProgress
v-if="showParent"
:year="year"
:batch="batch"
:batchOptions="batchOptions"
:yearOptions="yearOptions"
:dataList="dataList"
@auditProgressScreenChange="auditProgressScreenChange"
@showInfo="changeShowInfo"
/>
<MapList
@changeTask="changeTask"
@changeShowParent="changeShowParent"
:areaId="areaId"
:level="level"
:year="year"
:batch="batch"
:patchSource="patchSource"
:yearOptions="yearOptions"
:batchOptions="batchOptions"
v-else
/>
</div>
<div class="map-box-div">
<MapboxMap
:mapConfig="mapConfig"
@handlerDrawComplete="handlerDrawComplete"
@mapOnLoad="onMapboxLoad"
ref="MapboxComponent"
/>
</div>
</div>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { BasicTable, useTable, TableAction, EditRecordRow } from '@/components/Table';
import { loadCaseInfoIllegalList, dealIllegalCaseInfo } from '@/api/demo/system';
import { PermissionBtn } from '@/components/PermissionBtn/index';
import { columns, searchFormSchema } from './illegaltreatment.data';
import { getAppEnvConfig } from '@/utils/env';
import axios from 'axios';
import ShowInfoModal from '@/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue';
import { getCaseInfoById } from '@/api/tiankongdi/index';
<script setup lang="ts">
import { ref, onMounted, onUnmounted, defineAsyncComponent } from 'vue';
import mapboxgl, { Map } from 'mapbox-gl';
import { MapboxConfig, MapboxDefaultStyle } from '@/components/MapboxMaps/src/config.ts';
import AuditProgress from './AuditProgress/index.vue';
import MapList from './MapList/index.vue';
import { getLoadTaskCount } from '@/api/tiankongdi/index';
import { getGeom,getConfig } from '@/api/sys/layerManagement';
import { getDetail } from '@/api/sys/WFSchemeInfo';
import { useMessage } from '@/hooks/web/useMessage';
import { cloneDeep } from 'lodash-es';
const { VITE_GLOB_API_URL } = getAppEnvConfig();
const { createMessage } = useMessage();
defineOptions({ name: 'RoleManagement' });
const searchInfo = reactive<Recordable>({
countyid: null,
});
const showInfoData = ref();
const showInfoOpen = ref(false);
const searchParams = ref();
const [registerTable] = useTable({
title: '违法处理',
api: loadCaseInfoIllegalList,
columns,
formConfig: {
labelWidth: 120,
showAdvancedButton: false,
schemas: searchFormSchema,
},
useSearchForm: true,
showTableSetting: true,
tableSetting: { fullScreen: true },
// 搜索
handleSearchInfoFn(info) {
searchParams.value = info;
return info;
},
actionColumn: {
width: 120,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
const MapboxComponent = ref();
const mapConfig = ref({ isShowMap: false });
const currentEditKeyRef = ref('');
function createActions(record: EditRecordRow): ActionItem[] {
if (!record.editable) {
return [
{
label: '编辑',
disabled: currentEditKeyRef.value ? currentEditKeyRef.value !== record.Id : false,
onClick: handleEdit.bind(null, record),
},
{
// icon: 'ant-design:ellipsis-outlined',
label: '查看',
onClick: viewAccount.bind(null, record),
},
];
function onMapboxLoad():void {
getConfig({code:"mapsetting"}).then(res=>{
mapConfig.value = JSON.parse(res.codeValue)
})
}
const showParent = ref(true);
const year = ref();
const batch = ref();
const patchSource = ref()
const batchOptions = ref([
{ value: '第一批', label: '第一批' },
{ value: '第二批', label: '第二批' },
{ value: '第三批', label: '第三批' },
]);
const yearOptions = ref([
{ value: '2024', label: '2024' },
{ value: '2023', label: '2023' },
{ value: '2022', label: '2022' },
{ value: '2021', label: '2021' },
{ value: '2020', label: '2020' },
]);
const dataList = ref([]);
const areaId = ref('');
const level = ref()
const auditProgressScreenChange = (value, type) => {
switch (type) {
case 'year':
year.value = value;
break;
case 'batch':
batch.value = value;
break;
case 'patchSource':
patchSource.value = value;
break;
}
return [
{
label: '保存',
onClick: handleSave.bind(null, record),
},
{
label: '取消',
popConfirm: {
title: '是否取消编辑',
confirm: handleCancel.bind(null, record),
},
},
];
getCountList();
};
const changeShowInfo = (item) => {
console.log(item);
showParent.value = false;
areaId.value = item.areaid;
level.value = item.level
};
function changeShowParent() {
getCountList()
showParent.value = true;
}
function handleEdit(record: EditRecordRow) {
console.log(record);
currentEditKeyRef.value = record.Id;
record.onEdit?.(true);
async function getCountList() {
const data = await getLoadTaskCount({
year: year.value,
tubanlaiyuan: patchSource.value,
picihao: batch.value,
});
dataList.value = data;
}
function handleCancel(record: EditRecordRow) {
currentEditKeyRef.value = '';
record.onEdit?.(false, false);
onMounted(() => {
getYearList();
getCountList();
});
function getYearList() {
let num = 10;
const currentYear = new Date().getFullYear();
// 存储年份数据的数组
let list: any = [];
// 获取当前年份
// year.value = Number(`${currentYear}`);
list.push({
value: Number(`${currentYear}`),
label: Number(`${currentYear}`),
});
// 获取后面几年的数据
for (let i = 1; i <= num; i++) {
list.push({
value: Number(`${currentYear - i}`),
label: Number(`${currentYear - i}`),
});
}
yearOptions.value = list;
}
async function handleSave(record: EditRecordRow) {
console.log(record);
// 校验
createMessage.loading({ content: '正在保存...', duration: 0, key: 'saving' });
const valid = await record.onValid?.();
console.log(valid);
if (valid) {
try {
const data = cloneDeep(record.editValueRefs);
console.log(data);
let querys = { ...data };
querys.id = record.Id;
console.log(querys);
//TODO 此处将数据提交给服务器保存
const res = await dealIllegalCaseInfo(querys);
console.log(res);
if (res) {
// 保存之后提交编辑状态
const pass = await record.onEdit?.(false, true);
if (pass) {
currentEditKeyRef.value = '';
function changeTask(record) {
if(record?.geomid){
// handlerGetMapConfigByFormId(record.processcode);
let val = record.geomid
let getGeomPrams = {
TableName: 'drone_shp_data ',
FieldName: 'gid',
FieldValue: val,
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('当前数据没有图斑！');
}
createMessage.success({ content: '数据已保存', key: 'saving' });
}
} catch (error) {
createMessage.error({ content: '保存失败', key: 'saving' });
});
} else {
createMessage.error('当前数据没有图斑！');
}
} else {
// const pass = await record.onEdit?.(false, true);
createMessage.error({ content: '请填写正确的数据', key: 'saving' });
}
}
// 直接下载接口返回的二进制流
function handleExport() {
let params = { ...searchParams.value };
params.countyid = searchInfo?.countyid;
axios({
method: 'post',
url: VITE_GLOB_API_URL + '/api/DroneCaseInfoSingle/ExportCaseInfoIllegalList',
params: params,
headers: {
'X-Token': localStorage.getItem('X-Token'),
},
responseType: 'blob',
}).then((res) => {
console.log('excel', res);
let fileName = '违法处理统计报表' + new Date().getTime() + '.xls';
const elink = document.createElement('a');
elink.download = fileName;
elink.style.display = 'none';
elink.href = URL.createObjectURL(res.data);
document.body.appendChild(elink);
elink.click();
URL.revokeObjectURL(elink.href);
document.body.removeChild(elink);
});
}
function onBtnClicked(domId) {
switch (domId) {
case 'btnExport':
handleExport();
break;
default:
break;
// 根据发布表单的id获取地图配置
function handlerGetMapConfigByFormId(id){
if(id){
getDetail({ code: id }).then(res=>{
let data = res;
let scheme = JSON.parse(data.scheme.content);
let wfData = scheme.wfData;
let startFlow = wfData.find((item,index)=>{
return item.type == "bpmn:StartEvent";
})
if(startFlow?.mapConfig){
mapConfig.value = startFlow?.mapConfig
}
});
}
}
function viewAccount(record) {
console.log(record);
getCaseInfoById({ id: record.Id }).then((res) => {
showInfoData.value = res;
showInfoOpen.value = true;
});
}
</script>
<style lang="scss" scoped>
.data-preview-container {
width: 100%;
height: calc(100% - 0px);
position: absolute;
padding: 30px 10px;
top: 0px;
left: 0px;
background: #fff;
}
.data-preview-container-option {
width: 120px;
height: 40px;
position: absolute;
top: 30px;
right: 0px;
}
.data-preview-container-option div {
width: 40px;
height: 40px;
line-height: 40px;
float: left;
text-align: center;
cursor: pointer;
}
.full-modal {
.ant-modal {
min-width: 100vw;
top: 0px;
padding: 0px;
margin: 0px;
.curb-spot-city {
height: 100%;
display: flex;
.show-list {
width: 590px;
background: #EFEFEF;
}
.ant-modal-content {
display: flex;
flex-direction: column;
}
.ant-modal-body {
flex: 1;
.map-box-div {
width: 65%;
}
}
</style>

10
src/views/demo/statistical/illegaltreatment/util.ts Normal file
View File

@ -0,0 +1,10 @@
export const patchSourceOptions = [
{
label: '全域巡查',
value: '全域巡查',
},
{
label: '卫片下发',
value: '卫片下发',
}
]

18
src/views/demo/system/version/index.vue
View File

@ -37,8 +37,6 @@
:headers="headers"
:progress="progress"
:beforeUpload="beforeUpload"
@change="handleChange"
@drop="handleDrop"
>
<a-button :loading="loading"> 点击上传 </a-button>
</a-upload>
@ -71,7 +69,7 @@
<a-row style="overflow-y: hidden">
<a-col :span="12" style="padding: 20px; border: 1px silver solid; margin-left: 10px">
<a-form
ref="fly_currentAppForm"
ref="fly_form"
v-model:model="fly_currentAppForm"
labelAlign="right"
label-width="80px"
@ -99,8 +97,6 @@
:headers="headers"
:progress="progress"
:beforeUpload="beforeUpload"
@change="handleChange"
@drop="handleDrop"
>
<a-button :loading="fly_loading"> 点击上传 </a-button>
</a-upload>
@ -134,9 +130,8 @@
<script lang="ts" setup>
// vue
import { ref } from 'vue';
import { ref, onMounted } from 'vue';
// vben
import BasicUpload from './src/BasicUpload.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { DeleteOutlined, UploadOutlined } from '@ant-design/icons-vue';
import { message, Upload } from 'ant-design-vue';
@ -200,8 +195,6 @@
});
deleteFileName();
}
// 版本
getAppInfo();
// 上传文件接口
const handleCustomRequest = (file, progress) => {
@ -216,6 +209,7 @@
}
})
.catch((err) => {
loading.value = false;
file.onError(err);
createMessage.error(err.message);
});
@ -230,6 +224,7 @@
}
})
.catch((err) => {
fly_loading.value = false;
file.onError(err);
createMessage.error(err.message);
});
@ -361,4 +356,9 @@
}
});
}
onMounted(() => {
// 版本
getAppInfo();
});
</script>

82
src/views/demo/tiankongdi/auditinfo/AuditProgress/index.vue
View File

@ -29,12 +29,16 @@
</div>
<div class="screen-item">
<div class="screen-item-label" style="margin-right:9px;">批次</div>
<a-input
<a-select
allowClear
class="item-input"
style="width:117px;"
style="width: 117px"
v-model:value="props.batch"
@change="(value) => emits('auditProgressScreenChange',value.target.value,'batch')"
:options="props.batchOptions"
@change="
(value) => {
emits('auditProgressScreenChange', value, 'batch');
}
"
/>
</div>
</div>
@ -50,57 +54,38 @@
v-if="dataList.length > 0"
>
<div class="name-div">
<!-- <div class="item-mark"></div> -->
<img src="/positioning.png" class="item-mark"/>
<div class="item-label">{{ item.areaname }}</div>
<div class="progress-div">
<div class="progress-label progress-color">进度</div>
<div class="progress-data" style="width:97px">
<span style="color: #086DEC;">{{item.verificatedtask}}</span>/{{item.totaltask}}
</div>
</div>
<div class="progress-div">
<div class="progress-label extended-color">超期</div>
<div class="progress-data" style="width:40px">
<span style="color: #D03542">{{item.overduetask}}</span>
</div>
<div style="display:flex;align-items: center;">
<img src="/positioning.png" class="item-mark"/>
<div class="item-label">{{ item.areaname }}</div>
</div>
<div class="progress-div">
<div class="progress-label reviewed-color" style="width:70px;">待审核</div>
<div class="progress-data" style="width:31px">
<div class="progress-data" style="width:37px">
<span style="color: #EC7908;">{{item.verifytask}}</span>
</div>
</div>
</div>
<div class="info-data-div">
<div class="info-data-item">
<div class="info-data-label">合法</div>
<div class="info-data-label">下发</div>
<div class="info-data-data">{{item.totaltask}}</div>
</div>
<div style="width: 1px;margin-right:27px;margin-left:31px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">接收</div>
<div class="info-data-data">{{item.receivetask}}</div>
</div>
<div style="width: 1px;margin-right:15px;margin-left:30px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">举证合法</div>
<div class="info-data-data">{{item.legalcase}}</div>
</div>
<div style="width: 1px;margin-right:21px;margin-left:21px;background-color:#EDEDED;height: 15px;"></div>
<div style="width: 1px;margin-right:18px;margin-left:17px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">其他</div>
<div class="info-data-label">举证其他</div>
<div class="info-data-data">{{item.ilegalcase}}</div>
</div>
<div style="width: 1px;margin-right:21px;margin-left:19px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">非粮化</div>
<div class="info-data-data">{{item.nonfoodcase}}</div>
</div>
<div style="width: 1px;margin-right:17px;margin-left:21px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">复耕</div>
<div class="info-data-data">{{item.rehabilitationcase}}</div>
</div>
<div style="width: 1px;margin-right:21px;margin-left:17px;background-color:#EDEDED;height: 15px;"></div>
<div class="info-data-item">
<div class="info-data-label">补手续</div>
<div class="info-data-data">{{item.makeupcase}}</div>
</div>
</div>
<!-- <div class="data-div">
<spam style="color: #086dec">{{ item.count }}</spam>
</div> -->
</div>
<div v-else class="no-data">
<a-empty :image="simpleImage" />
@ -191,7 +176,7 @@
width: 100%;
background: #fff;
border-radius: 11px;
padding: 0px 17px 0px 12px;
padding: 0px 15px 0px 16px;
margin-bottom: 8px;
.name-div {
display: flex;
@ -199,12 +184,13 @@
align-items: center;
padding: 10px 0px;
border-bottom: 1px solid #E5E5E5;
justify-content: space-between;
}
.info-data-div{
height: 61px;
display: flex;
align-items: center;
padding-left: 2px;
padding-left: 27px;
// justify-content: space-between;
// margin-top: 10px;
.info-data-item{
@ -248,7 +234,7 @@
}
.item-label {
width: 122px;
padding-left: 9px;
padding-left: 12px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 23px;
@ -260,24 +246,24 @@
// font-weight: 500;
// font-size: 16px;
// line-height: 30px;
margin-right: 17px;
// margin-right: 17px;
.progress-label{
font-family: Alibaba PuHuiTi;
color: #FFFFFF;
width: 50px;
height: 27px;
border-radius: 13px 0px 0px 13px;
height: 30px;
border-radius: 4px 0px 0px 4px;
display: flex;
align-items: center;
justify-content: center;
}
.progress-data{
background: #EFEFEF;
height: 27px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0px 0px 11px 0px;
border-radius: 0px 4px 4px 0px;
font-family: HarmonyOS Sans;
font-weight: 500;
font-size: 19px;

87
src/views/demo/tiankongdi/auditinfo/MapList/index.vue
View File

@ -21,15 +21,15 @@
</div>
<div class="screen-item" style="margin-bottom:15px;">
<div class="screen-item-label">批次</div>
<a-input
<a-select
allowClear
class="item-input"
style="width:117px;"
v-model:value="params.picihao"
:options="props.batchOptions"
/>
</div>
<div class="screen-item" style="margin-right:13px;">
<div class="screen-item-label">类型</div>
<div class="screen-item-label">举证</div>
<a-select
allowClear
style="width:136px;"
@ -101,50 +101,42 @@
<div class="item-sub-label">
<span style="margin-right:12px;">{{item.streetname}}</span>
<span>{{item.case_no}}</span>
<span class="item-mark" v-if="item.is_build_name">{{item.is_build_name}}</span>
</div>
</div>
<div class="item-mark" v-if="item.is_build_name">{{item.is_build_name}}</div>
</div>
<div
class="data-item-type-div"
:style="`border-color:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'}`"
@click="goAudit(item)">
<div>
<div class="type-title">举证</div>
<div class="type-data" :style="`background:${item.is_illegal === 0? '#086DEC': item.is_illegal === 1? '#D03542': '#F7710F'};`">
{{item.is_illegal === 0? '合法': item.is_illegal === 1? '违法': '其他'}}
</div>
</div>
<div class="button-div">
<a-button type="primary" class="button-item" @click="goAudit(item)">审核</a-button>
</div>
</div>
<div class="data-list-info-div">
<div class="info-layout-div">
<div class="info-item">
<div class="info-label">总</div>
<div class="info-label">总面积</div>
<div class="info-data">{{item.area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">耕</div>
<div class="info-label">农用地</div>
<div class="info-data">{{item.nongyongdi_area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">耕地</div>
<div class="info-data">{{item.gengdi_area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">基</div>
<div class="info-item" style="width:127px;">
<div class="info-label">基本农田</div>
<div class="info-data">{{item.yongjiujibennongtian_area}}亩</div>
</div>
<div class="info-item">
<div class="info-label">农</div>
<div class="info-data">{{item.nongyongdi_area}}亩</div>
</div>
</div>
<div class="info-layout-div">
<div>
<!-- <div>
<Icon
:style="`font-size: 30px; color: #314A8C; cursor: pointer;${item.isouttime === 2? 'color: #D03542;': item.isouttime === 1? 'color: #F7710F;': 'color: #314A8C;'}`"
icon="icon-park-solid:timer"
@click="()=>{}"
/>
</div>
<div style="background: rgb(237, 237, 237);width: 1px;height: 100%;margin-right: 10px;margin-left: 10px;"></div>
<div style="background: rgb(237, 237, 237);width: 1px;height: 100%;margin-right: 10px;margin-left: 10px;"></div> -->
<div>
<Icon
:style="`font-size: 30px; cursor: pointer;${item.Fid? 'color:#F7710F': ''}`"
@ -251,9 +243,6 @@
const markTypeOptions = ref([
{ label: '合法', value: '合法' },
{ label: '其他', value: '其他' },
{ label: '非粮化', value: '非粮化' },
{ label: '拆除复耕', value: '拆除复耕' },
{ label: '补办手续', value: '补办手续' },
]);
const dataList = ref([]);
@ -613,34 +602,24 @@
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 13px;
color: #FFFFFF;
background: rgba(0,0,0,0.59);
padding: 5px 8px;
border-radius: 14px;
color: #696969;
margin-left: 17px;
}
}
.data-item-type-div{
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 15px;
color: #000000;
border: 1px solid;
width: 37px;
height: 37px;
border-radius: 4px;
cursor: pointer;
user-select: none;
.type-title{
display:flex;
align-items:center;
justify-content: center;
}
.type-data{
background:#086DEC;
color:#fff;
display:flex;
align-items:center;
.button-div{
display: flex;
align-items: center;
.button-item{
height: 27px;
width: 52px;
display: flex;
align-items: center;
justify-content: center;
font-family: Alibaba PuHuiTi;
font-weight: 500;
font-size: 15px;
color: #fff;
background: linear-gradient(-56deg, #0060FF, #007EFF, #0061FF);
}
}
}
@ -664,9 +643,9 @@
display:flex;
background: rgba(237, 237, 237, 0.55);
align-items: center;
width: 80px;
width: 110px;
border-radius: 7px;
margin-right: 8px;
margin-right: 9px;
height: 33px;
justify-content: center;
.info-label{

8
src/views/demo/tiankongdi/auditinfo/index.vue
View File

@ -61,11 +61,7 @@
const year = ref();
const batch = ref();
const patchSource = ref()
const batchOptions = ref([
{ value: '第一批', label: '第一批' },
{ value: '第二批', label: '第二批' },
{ value: '第三批', label: '第三批' },
]);
const batchOptions = ref([]);
const yearOptions = ref([
{ value: '2024', label: '2024' },
{ value: '2023', label: '2023' },
@ -111,6 +107,8 @@
onMounted(() => {
getYearList();
getCountList();
// TODO 获取批次
batchOptions.value = []
});
function getYearList() {
let num = 10;

195
src/views/demo/tiankongdi/changearea/MapList/amend.vue
View File

@ -1,90 +1,100 @@
<template>
<div>
<a-modal v-model:open="props.modalShow" title="图斑调整" @ok="handleSubmit" @cancel="handlerCloseModal">
<a-form
ref="formRef"
:model="formState"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol"
<div>
<a-modal
v-model:open="props.modalShow"
title="图斑调整"
@ok="handleSubmit"
@cancel="handlerCloseModal"
>
<a-form-item label="案件编号" name="case_no">
<a-input v-model:value="formState.case_no" disabled />
</a-form-item>
<a-form-item label="案件描述" name="case_description">
<a-input v-model:value="formState.case_description" disabled />
</a-form-item>
<a-form-item label="县区" name="countyid">
<a-select
v-model:value="formState.countyid"
placeholder="请选择"
:options="data.countyOptions"
@change="handleCountyChange"
:field-names="{ label: 'name', value: 'id' }"
/>
</a-form-item>
<a-form-item label="乡镇" name="streetid">
<a-select
v-model:value="formState.streetid"
:options="data.streetOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleStreetChange"
/>
</a-form-item>
<a-form-item label="村/社区" name="communityid">
<a-form
ref="formRef"
:model="formState"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-form-item label="案件编号" name="case_no">
<a-input v-model:value="formState.case_no" disabled />
</a-form-item>
<a-form-item label="案件描述" name="case_description">
<a-input v-model:value="formState.case_description" disabled />
</a-form-item>
<a-form-item label="县区" name="countyid">
<a-select
v-model:value="formState.countyid"
placeholder="请选择"
:options="data.countyOptions"
@change="handleCountyChange"
:field-names="{ label: 'name', value: 'id' }"
/>
</a-form-item>
<a-form-item label="乡镇" name="streetid">
<a-select
v-model:value="formState.streetid"
:options="data.streetOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleStreetChange"
/>
</a-form-item>
<!-- <a-form-item label="村/社区" name="communityid">
<a-select
v-model:value="formState.communityid"
:options="data.communityOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleCommunityChange"
/>
</a-form-item>
</a-form>
</a-modal>
</a-form-item> -->
</a-form>
</a-modal>
<a-modal v-if="false" v-bind="$attrs" @register="registerModal" title="飞地调整" @ok="handleSubmit" >
<a-form
ref="formRef"
:model="formState"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol"
<a-modal
v-if="false"
v-bind="$attrs"
@register="registerModal"
title="飞地调整"
@ok="handleSubmit"
>
<a-form-item label="案件编号" name="case_no">
<a-input v-model:value="formState.case_no" disabled />
</a-form-item>
<a-form-item label="案件描述" name="case_description">
<a-input v-model:value="formState.case_description" disabled />
</a-form-item>
<a-form-item label="县区" name="countyid">
<a-select
v-model:value="formState.countyid"
placeholder="请选择"
:options="data.countyOptions"
@change="handleCountyChange"
:field-names="{ label: 'name', value: 'id' }"
/>
</a-form-item>
<a-form-item label="乡镇" name="streetid">
<a-select
v-model:value="formState.streetid"
:options="data.streetOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleStreetChange"
/>
</a-form-item>
<a-form-item label="村/社区" name="communityid">
<a-form
ref="formRef"
:model="formState"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-form-item label="案件编号" name="case_no">
<a-input v-model:value="formState.case_no" disabled />
</a-form-item>
<a-form-item label="案件描述" name="case_description">
<a-input v-model:value="formState.case_description" disabled />
</a-form-item>
<a-form-item label="县区" name="countyid">
<a-select
v-model:value="formState.countyid"
placeholder="请选择"
:options="data.countyOptions"
@change="handleCountyChange"
:field-names="{ label: 'name', value: 'id' }"
/>
</a-form-item>
<a-form-item label="乡镇" name="streetid">
<a-select
v-model:value="formState.streetid"
:options="data.streetOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleStreetChange"
/>
</a-form-item>
<!-- <a-form-item label="村/社区" name="communityid">
<a-select
v-model:value="formState.communityid"
:options="data.communityOptions"
:field-names="{ label: 'name', value: 'id' }"
@change="handleCommunityChange"
/>
</a-form-item>
</a-form>
</a-modal>
</div>
</a-form-item> -->
</a-form>
</a-modal>
</div>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, defineProps, watch } from 'vue';
@ -103,38 +113,36 @@
default: false,
readonly: false,
},
record:String,
record: String,
});
getDetail(props.record)
getDetail(props.record);
const labelCol = { span: 4 };
const wrapperCol = { span: 14 };
const formState: any = ref({});
const rules = ref({
countyid: [{ required: true, message: '县区不能为空', trigger: 'blur' }],
streetid: [{ required: true, message: '乡镇不能为空', trigger: 'blur' }],
communityid: [{ required: true, message: '村/社区不能为空', trigger: 'blur' }],
// communityid: [{ required: true, message: '村/社区不能为空', trigger: 'blur' }],
});
const data = reactive({
countyOptions: [],
streetOptions: [],
communityOptions: [],
// communityOptions: [],
});
watch(
() => props.modalShow,
() => {
if (props.modalShow) {
getDetail(props.record);
getDetail(props.record);
}
},
);
watch(
() => props.record,
(newVal,oldVal)=>{
}
)
(newVal, oldVal) => {},
);
async function getDetail(id) {
const data = await getCaseInfoById({
id: id,
@ -149,19 +157,19 @@
data.streetOptions = res;
});
formState.value.streetid = '';
formState.value.communityid = '';
// formState.value.communityid = '';
}
async function handleStreetChange(value, option) {
formState.value.streetid = value;
formState.value.streetname = option.name;
getOptions(value).then((res) => {
data.communityOptions = res;
});
}
async function handleCommunityChange(value, option) {
formState.value.communityid = value;
formState.value.communityname = option.name;
// getOptions(value).then((res) => {
// data.communityOptions = res;
// });
}
// async function handleCommunityChange(value, option) {
// formState.value.communityid = value;
// formState.value.communityname = option.name;
// }
async function getOptions(value) {
const data = await getChildrenTree({
parentId: value,
@ -184,9 +192,9 @@
data.streetOptions = res;
});
// 获取村/社区数据
getOptions(formState.value.streetid).then((res) => {
data.communityOptions = res;
});
// getOptions(formState.value.streetid).then((res) => {
// data.communityOptions = res;
// });
}
function handlerCloseModal() {
@ -203,8 +211,8 @@
countyname: formState.value.countyname,
streetid: formState.value.streetid,
streetname: formState.value.streetname,
communityid: formState.value.communityid,
communityname: formState.value.communityname,
// communityid: formState.value.communityid,
// communityname: formState.value.communityname,
};
console.log(querys);
const data = await updateDroneCaseInfo(querys);
@ -221,7 +229,6 @@
console.log('error', error);
});
} finally {
}
}
onMounted(() => {

756
src/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue
View File

@ -1,347 +1,385 @@
<template>
<div class="detail-container">
<div class="map-container">
<MapboxMap
:mapConfig="mapConfig"
@handlerDrawComplete="handlerDrawComplete"
@mapOnLoad="onMapboxLoad"
ref="MapboxComponent"
/>
</div>
<div class="info-container">
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="1" tab="线索下发">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'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="经度">{{ lng }}</a-descriptions-item>
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
<a-descriptions-item label="农用地面积">{{ nongyongdi_area }}</a-descriptions-item>
<a-descriptions-item label="耕地面积">{{ gengdi_area }}</a-descriptions-item>
<a-descriptions-item label="永久基本农田面积">{{ yongjiujibennongtian_area }}</a-descriptions-item>
<a-descriptions-item label="生态保护红线面积">{{ shengtaibaohuhongxian_area }}</a-descriptions-item>
<a-descriptions-item label="国土空间规划面积">{{ guotukongjianguihua_area }}</a-descriptions-item>
<a-descriptions-item label="案件面积">{{ area }}</a-descriptions-item>
<a-descriptions-item label="案件描述">{{ case_description }}</a-descriptions-item>
<a-descriptions-item label="判读时间">{{ identification_time }}</a-descriptions-item>
<a-descriptions-item label="案件备注">{{ remark }}</a-descriptions-item>
<a-descriptions-item label="下发时间">{{ createtime }}</a-descriptions-item>
<a-descriptions-item label="案件图片">
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex" >
<div class="detail-container">
<div class="map-container">
<MapboxMap
:mapConfig="mapConfig"
@handlerDrawComplete="handlerDrawComplete"
@mapOnLoad="onMapboxLoad"
ref="MapboxComponent"
/>
</div>
<div class="info-container" id="info-container">
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="1" tab="线索下发">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'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="经度">{{ lng }}</a-descriptions-item>
<a-descriptions-item label="纬度">{{ lat }}</a-descriptions-item>
<a-descriptions-item label="农用地面积">{{ nongyongdi_area }}</a-descriptions-item>
<a-descriptions-item label="耕地面积">{{ gengdi_area }}</a-descriptions-item>
<a-descriptions-item label="永久基本农田面积">{{
yongjiujibennongtian_area
}}</a-descriptions-item>
<a-descriptions-item label="生态保护红线面积">{{
shengtaibaohuhongxian_area
}}</a-descriptions-item>
<a-descriptions-item label="国土空间规划面积">{{
guotukongjianguihua_area
}}</a-descriptions-item>
<a-descriptions-item label="案件面积">{{ area }}</a-descriptions-item>
<a-descriptions-item label="案件描述">{{ case_description }}</a-descriptions-item>
<a-descriptions-item label="判读时间">{{ identification_time }}</a-descriptions-item>
<a-descriptions-item label="案件备注">{{ remark }}</a-descriptions-item>
<a-descriptions-item label="下发时间">{{ createtime }}</a-descriptions-item>
<a-descriptions-item label="案件图片">
<template v-for="(imageItem, imageIndex) in casepicList" :key="imageIndex">
<a-image
v-if="imageItem"
width="100px"
height="100px"
:src="`${VITE_GLOB_API_URL}/${imageItem}`"
:preview="{
getContainer,
}"
></a-image>
</template>
<!-- {{ anjianzhaopian }} -->
</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="2" tab="线索填报" force-render>
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all',
}"
>
<a-descriptions-item label="判定结果">{{
getLabel('is_illegal', is_illegal)
}}</a-descriptions-item>
<a-descriptions-item label="项目名称">{{ xiangmumc }}</a-descriptions-item>
<a-descriptions-item label="项目主体">{{ xiangmuzhuti }}</a-descriptions-item>
<a-descriptions-item label="实际用途">{{ actual_use_to }}</a-descriptions-item>
<a-descriptions-item label="违法类型">{{
getLabel('weifaleixing', weifaleixing)
}}</a-descriptions-item>
<a-descriptions-item label="处理方式">{{
getLabel('result_name', result_name)
}}</a-descriptions-item>
<a-descriptions-item label="立案号">{{ registr_number }}</a-descriptions-item>
<a-descriptions-item label="违法联系人">{{ illegal_contact }}</a-descriptions-item>
<a-descriptions-item label="违法人身份证号">{{
illegal_shenfenzhenghao
}}</a-descriptions-item>
<a-descriptions-item label="判定依据说明">{{
pandingyijushuoming
}}</a-descriptions-item>
<a-descriptions-item label="附件">
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex">
<div v-if="item" style="margin-top: 10px">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ fujian }} -->
</a-descriptions-item>
<a-descriptions-item label="照片">
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex">
<div style="margin-top: 10px">
<a-image
v-if="imageItem"
width="100px"
height="100px"
:src="`${VITE_GLOB_API_URL}/${imageItem}`"
:preview="{
getContainer,
}"
></a-image>
</template>
<!-- {{ anjianzhaopian }} -->
</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="2" tab="线索填报" force-render>
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all'
}">
<a-descriptions-item label="判定结果">{{ getLabel('is_illegal',is_illegal) }}</a-descriptions-item>
<a-descriptions-item label="项目名称">{{ xiangmumc }}</a-descriptions-item>
<a-descriptions-item label="项目主体">{{ xiangmuzhuti }}</a-descriptions-item>
<a-descriptions-item label="实际用途">{{ actual_use_to }}</a-descriptions-item>
<a-descriptions-item label="违法类型">{{ getLabel('weifaleixing',weifaleixing) }}</a-descriptions-item>
<a-descriptions-item label="处理方式">{{ getLabel('result_name',result_name) }}</a-descriptions-item>
<a-descriptions-item label="立案号">{{ registr_number }}</a-descriptions-item>
<a-descriptions-item label="违法联系人">{{ illegal_contact }}</a-descriptions-item>
<a-descriptions-item label="违法人身份证号">{{ illegal_shenfenzhenghao }}</a-descriptions-item>
<a-descriptions-item label="判定依据说明">{{ pandingyijushuoming }}</a-descriptions-item>
<a-descriptions-item label="附件">
<template v-for="(item, itemIndex) in fujianList" :key="itemIndex" >
<div v-if="item">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ fujian }} -->
</a-descriptions-item>
<a-descriptions-item label="照片">
<template v-for="(imageItem, imageIndex) in anjianzhaopianList" :key="imageIndex" >
</div>
</template>
<!-- {{ casepic }} -->
</a-descriptions-item>
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="3" tab="整改措施">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all',
}"
>
<a-descriptions-item label="整改措施">{{
getLabel('measure_name', measure_name)
}}</a-descriptions-item>
<a-descriptions-item label="验收表">
<template v-for="(item, itemIndex) in yanshoubiaoList" :key="itemIndex">
<div v-if="item">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ yanshoubiao }} -->
</a-descriptions-item>
<a-descriptions-item label="拆除复耕后照片">
<template
v-for="(imageItem, imageIndex) in chaichufugenghoupicList"
:key="imageIndex"
>
<div style="margin-top: 10px">
<a-image
v-if="imageItem"
width="100px"
height="100px"
:src="`${VITE_GLOB_API_URL}/${imageItem}`"
:preview="{
getContainer,
}"
></a-image>
</template>
<!-- {{ casepic }} -->
</a-descriptions-item>
<a-descriptions-item label="填报人">{{ examiner_name }}</a-descriptions-item>
<a-descriptions-item label="填报时间">{{ examine_time }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="3" tab="整改措施">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all'
}">
<a-descriptions-item label="整改措施">{{ getLabel('measure_name',measure_name) }}</a-descriptions-item>
<a-descriptions-item label="验收表">
<template v-for="(item, itemIndex) in yanshoubiaoList" :key="itemIndex" >
<div v-if="item">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ yanshoubiao }} -->
</a-descriptions-item>
<a-descriptions-item label="拆除复耕后照片">
<template v-for="(imageItem, imageIndex) in chaichufugenghoupicList" :key="imageIndex" >
<a-image
v-if="imageItem"
width="100px"
height="100px"
:src="`${VITE_GLOB_API_URL}/${imageItem}`"
></a-image>
</template>
<!-- {{ chaichufugenghoupic }} -->
</a-descriptions-item>
<a-descriptions-item label="附件">
<template v-for="(item, itemIndex) in zhenggaifujianList" :key="itemIndex" >
<div v-if="item">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ zhenggaifujian }} -->
</a-descriptions-item>
<a-descriptions-item label="办理人">{{ transactor_name }}</a-descriptions-item>
<a-descriptions-item label="办理时间">{{ transact_time }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="4" tab="审核">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all'
}">
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
</a-tabs>
</div>
</div>
</div>
</template>
<!-- {{ chaichufugenghoupic }} -->
</a-descriptions-item>
<a-descriptions-item label="附件">
<template v-for="(item, itemIndex) in zhenggaifujianList" :key="itemIndex">
<div v-if="item">
<Icon
:style="`font-size: 30px; cursor: pointer;`"
icon="ion:document-attach-outline"
@click="downLoadFile(item)"
/>
{{ item }}
</div>
</template>
<!-- {{ zhenggaifujian }} -->
</a-descriptions-item>
<a-descriptions-item label="办理人">{{ transactor_name }}</a-descriptions-item>
<a-descriptions-item label="办理时间">{{ transact_time }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
<a-tab-pane key="4" tab="审核">
<a-descriptions
:column="2"
bordered
:contentStyle="{
'text-align': 'center',
'min-width': '250px',
'word-break': 'break-all',
}"
>
<a-descriptions-item label="审核人">{{ verifyuser }}</a-descriptions-item>
<a-descriptions-item label="审核时间">{{ verifytime }}</a-descriptions-item>
</a-descriptions>
</a-tab-pane>
</a-tabs>
</div>
</div>
</template>
<script setup lang="ts">
import { defineProps,ref,computed } from "vue"
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue'
import {getConfig} from '@/api/sys/layerManagement'
import { getGeom } from '@/api/sys/layerManagement';
import { useMessage } from '@/hooks/web/useMessage';
const { createMessage } = useMessage();
import Icon from '@/components/Icon/Icon.vue';
import { getAppEnvConfig } from '@/utils/env';
const { VITE_GLOB_API_URL } = getAppEnvConfig();
import {
mapTypeOptions,
illegalTypeOptions,
measureOptions,
mapStatusOptions,
markTypeOptions,
illegalTypeList,
resultOptions,
} from '@/views/demo/tiankongdi/curbspotcity/util.ts'
import { defineProps, ref, computed } from 'vue';
import MapboxMap from '@/components/MapboxMaps/MapComponent.vue';
import { getConfig } from '@/api/sys/layerManagement';
import { getGeom } from '@/api/sys/layerManagement';
import { useMessage } from '@/hooks/web/useMessage';
const { createMessage } = useMessage();
import Icon from '@/components/Icon/Icon.vue';
import { getAppEnvConfig } from '@/utils/env';
const { VITE_GLOB_API_URL } = getAppEnvConfig();
import {
mapTypeOptions,
illegalTypeOptions,
measureOptions,
mapStatusOptions,
markTypeOptions,
illegalTypeList,
resultOptions,
} from '@/views/demo/tiankongdi/curbspotcity/util.ts';
const MapboxComponent = ref();
const mapConfig = ref({})
getConfig({code:"mapsetting"}).then(res=>{
mapConfig.value = JSON.parse(res.codeValue)
console.log("resresres",mapConfig.value);
})
const MapboxComponent = ref();
const mapConfig = ref({});
getConfig({ code: 'mapsetting' }).then((res) => {
mapConfig.value = JSON.parse(res.codeValue);
console.log('resresres', mapConfig.value);
});
const props = defineProps(['showInfoData']);
const activeKey = ref('1');
const props = defineProps(["showInfoData"])
const activeKey = ref('1')
console.log('showInfoData123', props.showInfoData);
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,
jieshou_people,
jieshou_time,
pandingyijushuoming,
xiangmumc,
xiangmuzhuti,
weifaleixing,
yanshoubiao,
zhenggaifujian,
chaichufugenghoupic,
is_jieshou,
anjianzhaopian,
} = props.showInfoData;
const anjianzhaopianList = computed(() => {
return anjianzhaopian ? anjianzhaopian.split(',') : [];
});
const casepicList = computed(() => {
return casepic ? casepic.split(',') : [];
});
const chaichufugenghoupicList = computed(() => {
return chaichufugenghoupic ? chaichufugenghoupic.split(',') : [];
});
const fujianList = computed(() => {
return fujian ? fujian.split(',') : [];
});
const zhenggaifujianList = computed(() => {
return zhenggaifujian ? zhenggaifujian.split(',') : [];
});
const yanshoubiaoList = computed(() => {
return yanshoubiao ? yanshoubiao.split(',') : [];
});
console.log("showInfoData123",props.showInfoData);
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,
jieshou_people,
jieshou_time,
pandingyijushuoming,
xiangmumc,
xiangmuzhuti,
weifaleixing,
yanshoubiao,
zhenggaifujian,
chaichufugenghoupic,
is_jieshou,
anjianzhaopian
} = props.showInfoData
const anjianzhaopianList = computed(() => {
return anjianzhaopian?anjianzhaopian.split(','):[]
})
const casepicList = computed(() => {
return casepic?casepic.split(','):[]
})
const chaichufugenghoupicList = computed(() => {
return chaichufugenghoupic?chaichufugenghoupic.split(','):[]
})
const fujianList = computed(() => {
return fujian?fujian.split(','):[]
})
const zhenggaifujianList = computed(() => {
return zhenggaifujian?zhenggaifujian.split(','):[]
})
const yanshoubiaoList = computed(() => {
return yanshoubiao?yanshoubiao.split(','):[]
})
function onMapboxLoad(){
changeTask();
}
const getLabel = (type,value) => {
let result:any[] = []
let label = ''
switch(type){
case 'is_illegal':
result = mapTypeOptions
break;
case 'weifaleixing':
result = illegalTypeList
break;
case 'measure_name':
result = measureOptions
break;
case 'result_name':
result = resultOptions
break;
function onMapboxLoad() {
changeTask();
}
result.forEach(item => {
if(item.value == value){
label = item.label
const getLabel = (type, value) => {
let result: any[] = [];
let label = '';
switch (type) {
case 'is_illegal':
result = mapTypeOptions;
break;
case 'weifaleixing':
result = illegalTypeList;
break;
case 'measure_name':
result = measureOptions;
break;
case 'result_name':
result = resultOptions;
break;
}
})
return label
}
function changeTask() {
result.forEach((item) => {
if (item.value == value) {
label = item.label;
}
});
return label;
};
function changeTask() {
let getGeomPrams = {
TableName: 'drone_shp_data ',
FieldName: 'gid',
@ -350,7 +388,7 @@ function changeTask() {
limit: 999,
key: null,
};
if ( props.showInfoData.geomid) {
if (props.showInfoData.geomid) {
getGeom(getGeomPrams).then((res) => {
let geoms = [];
if (res) {
@ -372,32 +410,54 @@ function changeTask() {
} else {
createMessage.error('当前数据没有图斑！');
}
}
const downLoadFile = (url) => {
window.open(`${VITE_GLOB_API_URL}/${url}`,"mozillaTab")
}
}
const downLoadFile = (url) => {
window.open(`${VITE_GLOB_API_URL}/${url}`, 'mozillaTab');
};
const getContainer = () => {
return document.getElementById('info-container')
}
</script>
<style lang="scss" scoped>
.detail-container{
width: 100vw;
height: calc( 100vh - 120px);
}
.detail-container::after{
content:"";
display: block;
clear:both;
height:0;
visibility: none;
}
.map-container{
float: left;
width: 50vw;
height: calc( 100vh - 100px);
margin-right:20px;
}
.info-container{
float:left;
}
.detail-container {
width: 100vw;
height: calc(100vh - 120px);
}
.detail-container::after {
content: '';
display: block;
clear: both;
height: 0;
visibility: none;
}
.map-container {
float: left;
width: 50vw;
height: calc(100vh - 100px);
margin-right: 20px;
}
.info-container {
float: left;
position: relative;
:deep(.ant-image-preview-wrap){
position: absolute;
}
:deep(.ant-image-preview-mask){
position: absolute;
}
:deep(.ant-image-preview-operations-wrapper){
position: absolute;
}
:deep(.ant-image-preview-operations){
position: absolute;
top: 0;
width: 100%;
}
}
::v-deep .ant-tabs .ant-tabs-content-holder{
overflow: auto;
height: 80vh;
overflow: auto;
}
</style>

32
src/views/demo/tiankongdi/curbspotcity/MapList/index.vue
View File

@ -7,7 +7,8 @@
button-style="solid"
style="width:100%">
<a-radio-button :value="0" class="radio-item">农用地</a-radio-button>
<a-radio-button :value="1" class="radio-item">建设用地、推堆土</a-radio-button>
<a-radio-button :value="1" class="radio-item">建设用地</a-radio-button>
<a-radio-button :value="2" class="radio-item">推堆土</a-radio-button>
</a-radio-group>
</div>
<div class="screen-div">
@ -15,7 +16,7 @@
<div class="screen-item-label">年份</div>
<a-select
allowClear
style="width:103px;"
style="width:130px;"
v-model:value="props.infoScreenData.year"
:options="yearOptions"
@change="(value) => emits('mapListScreenChange',value,'year')"
@ -25,7 +26,7 @@
<div class="screen-item-label" style="margin-right: 11px;">图斑来源</div>
<a-select
allowClear
style="width:142px;"
style="width:130px;"
v-model:value="props.infoScreenData.patchSource"
:options="patchSourceOptions"
@change="(value) => emits('mapListScreenChange',value,'patchSource')"
@ -34,23 +35,24 @@
<div class="screen-item" style="margin-bottom:12px;">
<div class="screen-item-label">批次</div>
<a-input
allowClear
class="item-input"
style="width:117px;"
style="width:103px;"
v-model:value="props.infoScreenData.batch"
@change="(value) => emits('mapListScreenChange',value.target.value,'batch')"
/>
</div>
<div class="screen-item" style="margin-right:15px;margin-bottom:22px;">
<div class="screen-item" style="margin-right:15px;margin-bottom:12px;">
<div class="screen-item-label">标注</div>
<a-select
allowClear
style="width:136px;"
style="width:130px;"
v-model:value="props.infoScreenData.markType"
:options="markTypeOptions"
@change="(value) => emits('mapListScreenChange',value,'markType')"
/>
</div>
<div class="screen-item" style="margin-bottom:22px;">
<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'"
@ -64,7 +66,7 @@
<div class="screen-item-label">乡镇</div>
<a-select
allowClear
style="width:136px;"
style="width:130px;"
v-model:value="props.infoScreenData.streetId"
:options="streetsAreaOptions"
@change="(value) => emits('mapListScreenChange',value,'streetId')"
@ -137,7 +139,7 @@
:options="isOverdueOptions"></a-checkbox-group>
</div>
</div>
<div style="display:flex;">
<div style="display:flex;align-items: center;">
<div>图斑面积：</div>
<div style="display:flex;">
<a-input style="width:30%;"
@ -145,24 +147,26 @@
@change="(e) => emits('mapListScreenChange',e.target.value,'mapAreaFirst')"
/>
<span>---</span>
<a-input style="width:30%;"
<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;">
<div style="display:flex;margin-top: 4px;">
<div>耕地面积：</div>
<div style="display:flex;">
<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%;"
<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>
@ -627,7 +631,7 @@ const closeMolder = () => {
background: #086DEC;
}
.radio-item{
width:50%;
width:33%;
text-align: center;
height: 40px;
user-select: none;

1
src/views/demo/tiankongdi/curbspotcity/util.ts
View File

@ -27,6 +27,7 @@ export const mapStatusOptions = [
{ label: '待接收', value: '待接收' },
{ label: '待填报', value: '待填报' },
{ label: '待整改', value: '待整改' },
{ label: '已退回', value: '已退回' },
]
export const markTypeOptions = [
{ label: '在建', value: '在建' },