案件审核汇总核验页面开发接口对接
parent
d46c63777a
commit
4478b93089
|
|
@ -5,25 +5,48 @@ import {
|
|||
TabDataItem,
|
||||
CaseCollectionItem,
|
||||
GetBaseItem,
|
||||
CaseCollectionDelItem,
|
||||
GetBaseIdItem,
|
||||
GetBaseUidItem,
|
||||
GetCaseDealItem,
|
||||
CaseBackItem,
|
||||
} from './model/index';
|
||||
|
||||
enum Api {
|
||||
GETORG_List = '/api/Orgs/OrgList', //组织机构字典
|
||||
GETTABLEDATA_LIST = '/api/DroneCaseinfo/LoadWaitToVerifyCaseList', //表格列表数据
|
||||
ADDCASE_COLLECTION = '/api/DroneCaseinfo/AddCaseFavorite', //收藏案件
|
||||
ADDCASE_COLLECTION = '/api/DroneCaseinfo/AddCaseFavorite', //添加收藏案件
|
||||
DELCASE_COLLECTION = '/api/DroneCaseinfo/DeleteFavoriteCases', //移除收藏
|
||||
GETCOLLECTION_LIST = '/api/DroneCaseinfo/LoadFavoriteCases', //收藏列表
|
||||
GETUSERINFO = '/api/DroneCaseinfo/GetCurrentUser', //获取当前用户信息
|
||||
GETCASE_DETAIL = '/api/DroneCaseinfo/GetCaseInfo', //获取案件详情
|
||||
GETCASELIST = '/api/DroneCaseinfo/FavoriteCaseList', //全部收藏案件数据
|
||||
GETCASEDEAL = '/api/DroneCaseinfo/GetDroneCaseDeal', //审核详情
|
||||
CASE_AUDITING = '/api/DroneCaseinfo/VerfiyCaseData', //案件通过审核
|
||||
CASE_BACK = '/api/DroneCaseinfo/DrawbackCase', //案件退回
|
||||
}
|
||||
/**
|
||||
* @description: Get sample options value
|
||||
*/
|
||||
export const getUserOrg = (params?: OrgItemList) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETORG_List, params });
|
||||
export const getUserInfoData = (params?: OrgItemList) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETUSERINFO, params });
|
||||
export const getTableDataList = (params?: TabDataItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETTABLEDATA_LIST, params });
|
||||
export const addCaseCollection = (params?: CaseCollectionItem) =>
|
||||
defHttp.post<DemoOptionsItem[]>({ url: Api.ADDCASE_COLLECTION, params });
|
||||
export const delCaseCollection = (params?: CaseCollectionItem) =>
|
||||
export const delCaseCollection = (params?: CaseCollectionDelItem) =>
|
||||
defHttp.post<DemoOptionsItem[]>({ url: Api.DELCASE_COLLECTION, params });
|
||||
export const getCollectionCaseList = (params?: GetBaseItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETCOLLECTION_LIST, params });
|
||||
export const getCaseDataDetail = (params?: GetBaseIdItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETCASE_DETAIL, params });
|
||||
export const getCaseList = (params?: GetBaseUidItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETCASELIST, params });
|
||||
export const getCaseDealDetail = (params?: GetCaseDealItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETCASEDEAL, params });
|
||||
export const caseAudiSteps = (params?: GetBaseIdItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.CASE_AUDITING, params });
|
||||
export const caseBackSteps = (params?: CaseBackItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.CASE_BACK, params });
|
||||
|
|
|
|||
|
|
@ -1,8 +1,29 @@
|
|||
import { BasicFetchResult } from '@/api/model/baseModel';
|
||||
export interface BasicFetchResult<T> {
|
||||
moduleIds?: any;
|
||||
formScheme?: any;
|
||||
elementIds?: any;
|
||||
items: T[];
|
||||
total: number;
|
||||
user: any;
|
||||
pics: any;
|
||||
video_list: any;
|
||||
is_illegal: any;
|
||||
info: any;
|
||||
pic_info_list: any;
|
||||
after_pic_list: any;
|
||||
evidence_file_list: any;
|
||||
punish_pic_list: any;
|
||||
payment_pic_list: any;
|
||||
agree_checkout_pic_list: any;
|
||||
checkout_pic_list: any;
|
||||
boundary_pic_list: any;
|
||||
}
|
||||
|
||||
export interface DemoOptionsItem {
|
||||
items: any;
|
||||
total: any;
|
||||
user: any;
|
||||
pics: any;
|
||||
}
|
||||
|
||||
export interface OrgItemList {
|
||||
|
|
@ -26,16 +47,28 @@ export interface TabDataItem {
|
|||
is_illegal: any;
|
||||
}
|
||||
export interface CaseCollectionItem {
|
||||
id: any;
|
||||
caseNo: any;
|
||||
favoriteUserId: any;
|
||||
}
|
||||
export interface CaseCollectionDelItem {}
|
||||
export interface GetBaseItem {
|
||||
page: any;
|
||||
limit: any;
|
||||
key: any;
|
||||
}
|
||||
|
||||
export interface GetBaseIdItem {
|
||||
id: any;
|
||||
}
|
||||
export interface GetBaseUidItem {
|
||||
uid: any;
|
||||
}
|
||||
export interface GetCaseDealItem {
|
||||
caseid: any;
|
||||
}
|
||||
export interface CaseBackItem {
|
||||
id: any;
|
||||
drawbackReason: any;
|
||||
}
|
||||
/**
|
||||
* @description: Request list return value
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
import { defHttp } from '@/utils/http/axios';
|
||||
import { DemoOptionsItem, OrgItemList, CaseCollectionDelItem, CaseBackItem } from './model/index';
|
||||
|
||||
enum Api {
|
||||
GETORG_List = '/api/DroneCaseinfo/LoadCaseInfoList', //表格列表
|
||||
PASS_VERIFICAT = '/api/DroneCaseinfo/VerificatCase', //核验
|
||||
BACK_VERIFICAT = '/api/DroneCaseinfo/DrawbackCase', //退回
|
||||
}
|
||||
/**
|
||||
* @description: Get sample options value
|
||||
*/
|
||||
export const getTableListData = (params?: OrgItemList) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.GETORG_List, params });
|
||||
export const passVerificatCase = (params?: CaseCollectionDelItem) =>
|
||||
defHttp.post<DemoOptionsItem[]>({ url: Api.PASS_VERIFICAT, params });
|
||||
export const backVerificcatCase = (params?: CaseBackItem) =>
|
||||
defHttp.get<DemoOptionsItem[]>({ url: Api.BACK_VERIFICAT, params });
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
export interface BasicFetchResult<T> {
|
||||
moduleIds?: any;
|
||||
formScheme?: any;
|
||||
elementIds?: any;
|
||||
items: T[];
|
||||
total: number;
|
||||
user: any;
|
||||
pics: any;
|
||||
video_list: any;
|
||||
is_illegal: any;
|
||||
info: any;
|
||||
pic_info_list: any;
|
||||
after_pic_list: any;
|
||||
evidence_file_list: any;
|
||||
punish_pic_list: any;
|
||||
payment_pic_list: any;
|
||||
agree_checkout_pic_list: any;
|
||||
checkout_pic_list: any;
|
||||
boundary_pic_list: any;
|
||||
}
|
||||
|
||||
export interface DemoOptionsItem {
|
||||
items: any;
|
||||
total: any;
|
||||
user: any;
|
||||
pics: any;
|
||||
}
|
||||
|
||||
export interface OrgItemList {}
|
||||
|
||||
export interface TabDataItem {
|
||||
is_intact: any;
|
||||
page: any;
|
||||
limit: any;
|
||||
key: any;
|
||||
appId: any;
|
||||
reportTime: any;
|
||||
violationStatus: any;
|
||||
handle_status_id: any;
|
||||
identification_user: any;
|
||||
countyid: any;
|
||||
streetid: any;
|
||||
communityid: any;
|
||||
case_no: any;
|
||||
is_illegal: any;
|
||||
}
|
||||
export interface CaseCollectionItem {
|
||||
caseNo: any;
|
||||
favoriteUserId: any;
|
||||
}
|
||||
export interface CaseCollectionDelItem {}
|
||||
export interface GetBaseItem {
|
||||
page: any;
|
||||
limit: any;
|
||||
key: any;
|
||||
}
|
||||
export interface GetBaseIdItem {
|
||||
id: any;
|
||||
}
|
||||
export interface GetBaseUidItem {
|
||||
uid: any;
|
||||
}
|
||||
export interface GetCaseDealItem {
|
||||
caseid: any;
|
||||
}
|
||||
export interface CaseBackItem {
|
||||
id: any;
|
||||
drawbackReason: any;
|
||||
}
|
||||
/**
|
||||
* @description: Request list return value
|
||||
*/
|
||||
export type DemoOptionsGetResultModel = BasicFetchResult<DemoOptionsItem>;
|
||||
|
|
@ -17,7 +17,7 @@ const dashboard: AppRouteModule = {
|
|||
{
|
||||
path: '/dashboard/analysis',
|
||||
name: 'Analysis',
|
||||
component: () => import('@/views/demo/caseauditing/index.vue'),
|
||||
component: () => import('@/views/dashboard/analysis/index.vue'),
|
||||
meta: {
|
||||
// affix: true,
|
||||
title: t('routes.dashboard.analysis'),
|
||||
|
|
|
|||
|
|
@ -18,14 +18,41 @@
|
|||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="现场照片:">
|
||||
<div v-for="(item, num) in imageList" :key="num">
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<div
|
||||
v-for="(item, num) in imageList"
|
||||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
background: #f9f9f9;
|
||||
margin-left: 6px;
|
||||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
</a-form-item>
|
||||
<a-form-item label="现场视频:">
|
||||
<a-input v-model:value="caseHandlingData.username" />
|
||||
<div
|
||||
style="margin-top: 10px; width: 240px; height: 150px"
|
||||
v-for="(item, index) in videoList"
|
||||
:key="index"
|
||||
>
|
||||
<video width="100%" height="100%" controls>
|
||||
<source :src="item" type="video/mp4" />
|
||||
您的浏览器不支持Video标签。
|
||||
</video>
|
||||
</div>
|
||||
<a-empty v-show="videoList.length <= 0">
|
||||
<template #description>
|
||||
<span>暂无视频</span>
|
||||
</template>
|
||||
</a-empty>
|
||||
</a-form-item>
|
||||
<a-form-item label="处理措施: " v-if="illegal == 1">
|
||||
<a-form-item label="处理措施: " v-if="illegal == '1'">
|
||||
<a-select
|
||||
v-model:value="caseHandlingData.measure_name"
|
||||
placeholder="请选择处理措施"
|
||||
|
|
@ -33,7 +60,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
|
||||
<a-col :span="24" v-if="illegal == 0">
|
||||
<a-col :span="24" v-if="illegal == '0'">
|
||||
<a-form-item label="项目名称: ">
|
||||
<a-input v-model:value="caseHandlingData.result_name" />
|
||||
</a-form-item>
|
||||
|
|
@ -64,13 +91,13 @@
|
|||
<a-input v-model:value="caseHandlingData.evidence_file_indate" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="合法批准文件: " v-if="illegal == 0">
|
||||
<a-form-item label="合法批准文件: " v-if="illegal == '0'">
|
||||
<div
|
||||
v-for="(item, num) in evidenceFileList"
|
||||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -79,7 +106,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="evidenceFileList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -88,13 +115,13 @@
|
|||
</a-empty>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="勘测定界图: " v-if="illegal == 0">
|
||||
<a-form-item label="勘测定界图: " v-if="illegal == '0'">
|
||||
<div
|
||||
v-for="(item, num) in boundaryImageList"
|
||||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -103,7 +130,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="boundaryImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -114,15 +141,15 @@
|
|||
|
||||
<a-form-item label="是否超范围: ">
|
||||
<a-radio-group v-model:value="caseHandlingData.is_out_boundary">
|
||||
<a-radio :label="1">是</a-radio>
|
||||
<a-radio :label="0">否</a-radio>
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="是否超层: ">
|
||||
<a-radio-group v-model:value="caseHandlingData.is_over_floor">
|
||||
<a-radio :label="1">是</a-radio>
|
||||
<a-radio :label="0">否</a-radio>
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
|
||||
|
|
@ -134,7 +161,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24" v-if="illegal == 1 && caseHandlingData.measure_name == '拟拆除'">
|
||||
<a-col :span="24" v-if="illegal == '1' && caseHandlingData.measure_name == '拟拆除'">
|
||||
<a-form-item label="实际用途: ">
|
||||
<a-input v-model:value="caseHandlingData.actual_use_to" />
|
||||
</a-form-item>
|
||||
|
|
@ -146,8 +173,8 @@
|
|||
</a-form-item>
|
||||
<a-form-item label="建设情况: ">
|
||||
<a-radio-group v-model:value="caseHandlingData.is_build_complete">
|
||||
<a-radio :label="1">已建成</a-radio>
|
||||
<a-radio :label="0">建设中</a-radio>
|
||||
<a-radio :value="1">已建成</a-radio>
|
||||
<a-radio :value="0">建设中</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="建筑结构: ">
|
||||
|
|
@ -160,7 +187,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -169,7 +196,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="afterImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -185,7 +212,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24" v-if="illegal == 1 && caseHandlingData.measure_name == '查处'">
|
||||
<a-col :span="24" v-if="illegal == '1' && caseHandlingData.measure_name == '查处'">
|
||||
<a-form-item label="实际用途: ">
|
||||
<a-input v-model:value="caseHandlingData.actual_use_to" />
|
||||
</a-form-item>
|
||||
|
|
@ -200,8 +227,8 @@
|
|||
</a-form-item>
|
||||
<a-form-item label="违法类型: ">
|
||||
<a-radio-group v-model:value="caseHandlingData.illegal_type">
|
||||
<a-radio label="违法建筑类">违法建筑类</a-radio>
|
||||
<a-radio label="非法采矿类">非法采矿类</a-radio>
|
||||
<a-radio value="违法建筑类">违法建筑类</a-radio>
|
||||
<a-radio value="非法采矿类">非法采矿类</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-divider orientation="left">【案件办理信息-查处】</a-divider>
|
||||
|
|
@ -222,7 +249,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -231,7 +258,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="punishImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -245,7 +272,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -254,7 +281,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="paymentImagesList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -271,7 +298,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24" v-if="illegal == 1 && caseHandlingData.measure_name == '拟完善手续'">
|
||||
<a-col :span="24" v-if="illegal == '1' && caseHandlingData.measure_name == '拟完善手续'">
|
||||
<a-form-item label="实际用途: ">
|
||||
<a-input v-model:value="caseHandlingData.actual_use_to" />
|
||||
</a-form-item>
|
||||
|
|
@ -286,8 +313,8 @@
|
|||
</a-form-item>
|
||||
<a-form-item label="完善手续条件: ">
|
||||
<a-radio-group v-model:value="caseHandlingData.is_have_checkout_condition">
|
||||
<a-radio :label="1">是</a-radio>
|
||||
<a-radio :label="0">否</a-radio>
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-divider orientation="left">【案件办理信息-完善手续】</a-divider>
|
||||
|
|
@ -298,7 +325,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -307,7 +334,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="agreeImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -321,7 +348,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -330,7 +357,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="124" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="checkoutImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -344,7 +371,7 @@
|
|||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
width: 125px;
|
||||
height: 112px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
|
|
@ -353,7 +380,7 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.s_filePath" />
|
||||
<a-image :width="125" :src="item.s_filePath" />
|
||||
</div>
|
||||
<a-empty v-if="boundaryImageList.length <= 0">
|
||||
<template #description>
|
||||
|
|
@ -372,7 +399,7 @@
|
|||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24" v-if="illegal == 2">
|
||||
<a-col :span="24" v-if="illegal == '2'">
|
||||
<a-form-item label="伪变化原因: ">
|
||||
<a-input v-model:value="caseHandlingData.pseudo_change_reason" />
|
||||
</a-form-item>
|
||||
|
|
@ -385,14 +412,14 @@
|
|||
<a-form-item label="是否有建筑物: ">
|
||||
<!-- <a-input v-model:value="caseHandlingData.is_have_build" /> -->
|
||||
<a-radio-group v-model:value="caseHandlingData.is_have_build">
|
||||
<a-radio :label="1">是</a-radio>
|
||||
<a-radio :label="0">否</a-radio>
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="是否永久性建筑: " v-if="caseHandlingData.is_have_build == 1">
|
||||
<a-radio-group v-model:value="caseHandlingData.is_forever_build">
|
||||
<a-radio :label="1">是</a-radio>
|
||||
<a-radio :label="0">否</a-radio>
|
||||
<a-radio :value="1">是</a-radio>
|
||||
<a-radio :value="0">否</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="办理人: ">
|
||||
|
|
@ -406,8 +433,24 @@
|
|||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { onMounted, ref, defineProps, watch } from 'vue';
|
||||
import { getUserInfoData, getCaseDealDetail } from '@/api/caseauditing/index';
|
||||
|
||||
const caseId: any = ref();
|
||||
const props = defineProps({
|
||||
id: {
|
||||
default: null,
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
watch(
|
||||
() => props.id,
|
||||
(newValue) => {
|
||||
caseId.value = newValue;
|
||||
getCaseHandlingDetail();
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
);
|
||||
const caseHandlingData: any = ref({
|
||||
id: '',
|
||||
measure_name: '',
|
||||
|
|
@ -419,7 +462,7 @@
|
|||
illegal_contact_phone: null, //违法人联系方式
|
||||
actual_scene_case: null, //现场实际情况
|
||||
});
|
||||
const illegal: any = ref('0');
|
||||
const illegal: any = ref();
|
||||
const dealMeasuresList: any = ref([]);
|
||||
const evidenceFileList: any = ref([]);
|
||||
const boundaryImageList: any = ref([]);
|
||||
|
|
@ -429,4 +472,81 @@
|
|||
const agreeImageList: any = ref([]);
|
||||
const checkoutImageList: any = ref([]);
|
||||
const imageList: any = ref([]);
|
||||
const videoList: any = ref([]);
|
||||
|
||||
function getUserInfo() {
|
||||
getUserInfoData().then((res) => {
|
||||
caseHandlingData.value.createusername = res.user.Name;
|
||||
});
|
||||
}
|
||||
function getCaseHandlingDetail() {
|
||||
getCaseDealDetail({ caseid: caseId.value }).then((res) => {
|
||||
illegal.value = JSON.stringify(res.is_illegal);
|
||||
caseHandlingData.value = res.info;
|
||||
imageList.value = [];
|
||||
if (res.pic_info_list.length > 0) {
|
||||
res.pic_info_list.forEach((item) => {
|
||||
item.s_filePath = 'http://60.213.14.14:6070/' + '/S_' + item.filePath;
|
||||
item.filePath = 'http://60.213.14.14:6070/' + '/' + item.filePath;
|
||||
imageList.value.push(item);
|
||||
});
|
||||
}
|
||||
afterImageList.value = [];
|
||||
if (res.after_pic_list.length > 0) {
|
||||
res.after_pic_list.forEach((item) => {
|
||||
item.s_filePath = 'http://60.213.14.14:6070/' + '/S_' + item.filePath;
|
||||
item.filePath = 'http://60.213.14.14:6070/' + '/' + item.filePath;
|
||||
afterImageList.value.push(item);
|
||||
});
|
||||
}
|
||||
//证明材料
|
||||
evidenceFileList.value = [];
|
||||
if (res.evidence_file_list.length > 0) {
|
||||
res.evidence_file_list.forEach((item) => {
|
||||
item.s_filePath = 'http://60.213.14.14:6070/' + '/S_' + item.filePath;
|
||||
item.filePath = 'http://60.213.14.14:6070/' + '/' + item.filePath;
|
||||
evidenceFileList.value.push(item);
|
||||
});
|
||||
}
|
||||
// 罚款通知书
|
||||
if (res.punish_pic_list.length > 0) {
|
||||
punishImageList.value = handleImageArray(res.punish_pic_list);
|
||||
}
|
||||
// 交款通知单
|
||||
if (res.payment_pic_list.length > 0) {
|
||||
paymentImagesList.value = handleImageArray(res.payment_pic_list);
|
||||
}
|
||||
// 政府同意证明
|
||||
if (res.agree_checkout_pic_list.length > 0) {
|
||||
agreeImageList.value = handleImageArray(res.agree_checkout_pic_list);
|
||||
}
|
||||
// 办理手续
|
||||
if (res.checkout_pic_list.length > 0) {
|
||||
checkoutImageList.value = handleImageArray(res.checkout_pic_list);
|
||||
}
|
||||
// 勘测定界照片
|
||||
if (res.boundary_pic_list.length > 0) {
|
||||
boundaryImageList.value = handleImageArray(res.boundary_pic_list);
|
||||
}
|
||||
if (res.video_list) {
|
||||
res.video_list.forEach((item) => {
|
||||
videoList.value.push('http://60.213.14.14:6070/' + item);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
function handleImageArray(imageArr) {
|
||||
let returnArray: any = ref([]);
|
||||
imageArr.forEach((item) => {
|
||||
let obj = {
|
||||
s_filePath: 'http://60.213.14.14:6070/' + '/S_' + item,
|
||||
filePath: 'http://60.213.14.14:6070/' + '/' + item,
|
||||
};
|
||||
returnArray.value.push(obj);
|
||||
});
|
||||
return returnArray.value;
|
||||
}
|
||||
onMounted(() => {
|
||||
getUserInfo();
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -33,14 +33,14 @@ export const columns: BasicColumn[] = [
|
|||
customRender: ({ record }) => {
|
||||
const status = record.is_illegal;
|
||||
if (status == 1) {
|
||||
const text = '合法';
|
||||
return text;
|
||||
} else if (status == 2) {
|
||||
const text = '违法';
|
||||
return text;
|
||||
} else {
|
||||
} else if (status == 2) {
|
||||
const text = '伪变化';
|
||||
return text;
|
||||
} else {
|
||||
const text = '合法';
|
||||
return text;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
|
@ -66,7 +66,7 @@ export const formSchema: FormSchema[] = [
|
|||
dynamicDisabled: true,
|
||||
},
|
||||
{
|
||||
field: 'countyname',
|
||||
field: 'homeAddress',
|
||||
label: '案件地址:',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true,
|
||||
|
|
@ -90,7 +90,7 @@ export const formSchema: FormSchema[] = [
|
|||
dynamicDisabled: true,
|
||||
},
|
||||
{
|
||||
field: 'lng',
|
||||
field: 'lngLat',
|
||||
label: '经纬度:',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true,
|
||||
|
|
@ -106,13 +106,13 @@ export const formSchema: FormSchema[] = [
|
|||
slot: 'videoSlot',
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
field: 'identification_user',
|
||||
label: '上报人:',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true,
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
field: 'identification_time',
|
||||
label: '上报时间:',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true,
|
||||
|
|
|
|||
|
|
@ -8,32 +8,50 @@
|
|||
</a-button>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<a-select
|
||||
ref="select"
|
||||
<a-tree-select
|
||||
v-if="selectOptions1.length > 0"
|
||||
v-model:value="selectValues1"
|
||||
:options="selectOptions1"
|
||||
style="width: 200px"
|
||||
class="ml-3"
|
||||
show-search
|
||||
style="width: 230px"
|
||||
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
||||
placeholder="查询地区"
|
||||
allow-clear
|
||||
:tree-data="selectOptions1"
|
||||
:field-names="{
|
||||
children: 'children',
|
||||
value: 'id',
|
||||
label: 'name',
|
||||
}"
|
||||
tree-node-filter-prop="name"
|
||||
@change="areaChange"
|
||||
/>
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="selectValues2"
|
||||
v-model:value="is_illegal"
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
allowClear
|
||||
:options="selectOptions2"
|
||||
placeholder="现场状况"
|
||||
@change="reload1"
|
||||
/>
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="selectValues3"
|
||||
v-model:value="is_drawback"
|
||||
:options="selectOptions3"
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
allowClear
|
||||
placeholder="新增退回"
|
||||
@change="reload1"
|
||||
/>
|
||||
<a-input style="width: 150px" class="ml-3" v-model:value="value" placeholder="请输入" />
|
||||
<a-button class="ml-3" :icon="h(SearchOutlined)">搜索</a-button>
|
||||
<a-input
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
v-model:value="searchKey"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<a-button class="ml-3" :icon="h(SearchOutlined)" @click="reload1">搜索</a-button>
|
||||
<a-button type="success" class="ml-3" :icon="h(DownloadOutlined)">导出</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -47,10 +65,9 @@
|
|||
:actions="[
|
||||
{
|
||||
label: '收藏',
|
||||
type: 'link',
|
||||
color: 'warning',
|
||||
onClick: () => {
|
||||
handleEdit(record);
|
||||
handleCollention(record);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -84,7 +101,7 @@
|
|||
type: 'link',
|
||||
color: 'warning',
|
||||
onClick: () => {
|
||||
handleEdit(record);
|
||||
handleRemoveCollention(record);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -119,15 +136,15 @@
|
|||
/></div>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-tabbox-right-content`">
|
||||
<BasicForm ref="formRef" @register="registerForm" v-if="tabsActiveIndex == 0">
|
||||
<template #imgSlot="{ model, field }">
|
||||
<BasicForm ref="formRef" @register="registerForm" v-show="tabsActiveIndex == 0">
|
||||
<template #imgSlot>
|
||||
<div
|
||||
v-for="(item, num) in fileList"
|
||||
:key="num"
|
||||
style="
|
||||
position: relative;
|
||||
width: 85px;
|
||||
height: 112px;
|
||||
width: 125px;
|
||||
height: 90px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
background: #f9f9f9;
|
||||
|
|
@ -135,26 +152,44 @@
|
|||
margin-bottom: 6px;
|
||||
"
|
||||
>
|
||||
<a-image :width="85" :src="item.url" />
|
||||
<a-image :width="125" :src="item.url" />
|
||||
</div>
|
||||
<a-empty v-if="fileList.length <= 0">
|
||||
<a-empty v-show="fileList.length <= 0">
|
||||
<template #description>
|
||||
<span>暂无图片</span>
|
||||
</template>
|
||||
</a-empty>
|
||||
</template>
|
||||
<template #videoSlot="{ model, field }"></template>
|
||||
<template #videoSlot>
|
||||
<div
|
||||
style="margin-top: 10px; width: 240px; height: 150px"
|
||||
v-for="(item, index) in videoList"
|
||||
:key="index"
|
||||
>
|
||||
<video width="100%" height="100%" controls>
|
||||
<source :src="item" type="video/mp4" />
|
||||
您的浏览器不支持Video标签。
|
||||
</video>
|
||||
</div>
|
||||
<a-empty v-show="videoList.length <= 0">
|
||||
<template #description>
|
||||
<span>暂无视频</span>
|
||||
</template>
|
||||
</a-empty>
|
||||
</template>
|
||||
</BasicForm>
|
||||
<HandleCase v-if="tabsActiveIndex == 1" />
|
||||
<HandleCase :id="selectRowDetail.id" v-show="tabsActiveIndex == 1" />
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-tabbox-right-footer`">
|
||||
<a-input class="ml-3" v-model:value="value" placeholder="案件退回原因" />
|
||||
<a-button type="error" class="ml-3"> 退回 </a-button>
|
||||
<a-button type="primary" class="ml-3"> 通过 </a-button>
|
||||
<a-input class="ml-3" v-model:value="caseBackReason" placeholder="案件退回原因" />
|
||||
<a-button type="error" class="ml-3" @click="handleCaseBack"> 退回 </a-button>
|
||||
<a-button type="primary" class="ml-3" @click="handlePassForm"> 通过 </a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-mapbox`"></div>
|
||||
<div :class="`${prefixCls}-content-mapbox`">
|
||||
<MapDetail :ruleForm="selectRowDetail"></MapDetail>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</PageWrapper>
|
||||
|
|
@ -166,7 +201,6 @@
|
|||
StarOutlined,
|
||||
DownloadOutlined,
|
||||
CloseOutlined,
|
||||
PlusOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import HandleCase from '@/views/demo/caseauditing/HandleCase.vue';
|
||||
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
||||
|
|
@ -174,73 +208,49 @@
|
|||
import { PageWrapper } from '@/components/Page';
|
||||
import {
|
||||
getTableDataList,
|
||||
getUserOrg,
|
||||
addCaseCollection,
|
||||
delCaseCollection,
|
||||
getCollectionCaseList,
|
||||
getUserInfoData,
|
||||
getCaseDataDetail,
|
||||
getCaseList,
|
||||
caseAudiSteps,
|
||||
caseBackSteps,
|
||||
} from '@/api/caseauditing/index';
|
||||
import { getDeptList } from '@/api/demo/system';
|
||||
import { columns, formSchema } from './index.data';
|
||||
// import { useMessage } from '@/hooks/web/useMessage';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import MapDetail from '@/views/demo/summaryverification/mapDetail.vue';
|
||||
|
||||
// const { createConfirm, createMessage } = useMessage();
|
||||
const { createMessage } = useMessage();
|
||||
const favoriteNum: any = ref();
|
||||
const tabsActiveIndex: any = ref('0');
|
||||
const tabsArr: any = ref(['案件信息', '核查办理']);
|
||||
const auditingVisible: any = ref(true);
|
||||
const auditingVisible: any = ref(false);
|
||||
const collenctionVisible: any = ref(false);
|
||||
const collenctionList: any = ref([]);
|
||||
const selectRowDetail: any = ref({});
|
||||
const caseBackReason: any = ref();
|
||||
const selectValues1: any = ref();
|
||||
const selectOptions1: any = ref([]);
|
||||
// const playerOptions: any = ref([]);
|
||||
const selectValues2: any = ref();
|
||||
const videoList: any = ref([]);
|
||||
const searchKey: any = ref();
|
||||
const countyid: any = ref();
|
||||
const streetid: any = ref();
|
||||
const communityid: any = ref();
|
||||
const is_illegal: any = ref();
|
||||
const selectOptions2: any = ref([
|
||||
{ label: '合法', value: 0 },
|
||||
{ label: '违法', value: 1 },
|
||||
{ label: '伪变化', value: 2 },
|
||||
]);
|
||||
const selectValues3: any = ref();
|
||||
const is_drawback: any = ref();
|
||||
const selectOptions3: any = ref([
|
||||
{ label: '新增', value: 0 },
|
||||
{ label: '退回', value: 1 },
|
||||
]);
|
||||
|
||||
const fileList = ref([
|
||||
{
|
||||
uid: '-1',
|
||||
name: 'image.png',
|
||||
status: 'done',
|
||||
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
|
||||
},
|
||||
{
|
||||
uid: '-2',
|
||||
name: 'image.png',
|
||||
status: 'done',
|
||||
url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
|
||||
},
|
||||
]);
|
||||
const previewVisible = ref(false);
|
||||
const previewImage = ref('');
|
||||
const previewTitle = ref('');
|
||||
|
||||
function getBase64(file: File) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader();
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = () => resolve(reader.result);
|
||||
reader.onerror = (error) => reject(error);
|
||||
});
|
||||
}
|
||||
const handleCancel = () => {
|
||||
previewVisible.value = false;
|
||||
previewTitle.value = '';
|
||||
};
|
||||
const handlePreview = async (file: UploadProps['fileList'][number]) => {
|
||||
if (!file.url && !file.preview) {
|
||||
file.preview = (await getBase64(file.originFileObj)) as string;
|
||||
}
|
||||
previewImage.value = file.url || file.preview;
|
||||
previewVisible.value = true;
|
||||
previewTitle.value = file.name || file.url.substring(file.url.lastIndexOf('/') + 1);
|
||||
};
|
||||
const fileList: any = ref([]);
|
||||
|
||||
const [registerTable, { reload: reload1 }] = useTable({
|
||||
title: '',
|
||||
|
|
@ -261,6 +271,19 @@
|
|||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
},
|
||||
beforeFetch: (data) => {
|
||||
let temp = {
|
||||
page: data.page,
|
||||
limit: data.limit,
|
||||
is_illegal: is_illegal.value,
|
||||
is_drawback: is_drawback.value,
|
||||
countyid: countyid.value,
|
||||
streetid: streetid.value,
|
||||
communityid: communityid.value,
|
||||
key: searchKey.value,
|
||||
};
|
||||
return temp;
|
||||
},
|
||||
handleSearchInfoFn(info) {
|
||||
return info;
|
||||
},
|
||||
|
|
@ -295,10 +318,109 @@
|
|||
showActionButtonGroup: false,
|
||||
baseColProps: { lg: 24, md: 24 },
|
||||
});
|
||||
function areaChange(items) {
|
||||
countyid.value = null;
|
||||
streetid.value = null;
|
||||
communityid.value = null;
|
||||
if (items && JSON.stringify(items).length == 6) {
|
||||
countyid.value = items;
|
||||
}
|
||||
if (items && JSON.stringify(items).length == 9) {
|
||||
streetid.value = items;
|
||||
}
|
||||
if (items && JSON.stringify(items).length == 12) {
|
||||
communityid.value = items;
|
||||
}
|
||||
reload1();
|
||||
}
|
||||
|
||||
function handlePassForm() {
|
||||
const param = {
|
||||
id: selectRowDetail.value.id,
|
||||
};
|
||||
caseAudiSteps(param).then((res) => {
|
||||
if (res) {
|
||||
createMessage.success('审核成功');
|
||||
reload1();
|
||||
reload2();
|
||||
}
|
||||
});
|
||||
}
|
||||
function handleCaseBack() {
|
||||
if (!caseBackReason.value) {
|
||||
createMessage.error('退回原因不能为空');
|
||||
return;
|
||||
}
|
||||
const param = {
|
||||
id: selectRowDetail.value.id,
|
||||
drawbackReason: caseBackReason.value,
|
||||
};
|
||||
caseBackSteps(param).then((res) => {
|
||||
if (res) {
|
||||
createMessage.success('操作成功');
|
||||
} else {
|
||||
createMessage.error('此案件未办理,无需退回。');
|
||||
}
|
||||
});
|
||||
}
|
||||
function handleAuditing(record) {
|
||||
const formData = record;
|
||||
caseBackReason.value = null;
|
||||
formData.homeAddress =
|
||||
record.countyname + record.streetname + record.communityname + record.address;
|
||||
formData.lngLat = record.lng + ' , ' + record.lat;
|
||||
selectRowDetail.value = formData;
|
||||
auditingVisible.value = true;
|
||||
setFieldsValue(record);
|
||||
setTimeout(() => {
|
||||
setFieldsValue(formData);
|
||||
}, 100);
|
||||
const param = {
|
||||
id: record.id,
|
||||
};
|
||||
getCaseDataDetail(param).then((res) => {
|
||||
fileList.value = [];
|
||||
videoList.value = [];
|
||||
if (res.pics) {
|
||||
res.pics.forEach((item) => {
|
||||
fileList.value.push({
|
||||
url: 'http://60.213.14.14:6070/' + item.path,
|
||||
id: item.id,
|
||||
});
|
||||
});
|
||||
}
|
||||
if (res.video_list) {
|
||||
res.video_list.forEach((item) => {
|
||||
videoList.value.push('http://60.213.14.14:6070/' + item);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
function handleCollention(row) {
|
||||
getUserInfoData().then((res) => {
|
||||
let param = {
|
||||
caseNo: row.case_no,
|
||||
favoriteUserId: res.user.Id,
|
||||
};
|
||||
addCaseCollection(param).then((rel) => {
|
||||
if (rel) {
|
||||
createMessage.success('收藏成功');
|
||||
getCollentionLength();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
function handleRemoveCollention(row) {
|
||||
const arr = collenctionList.value.filter((item) => {
|
||||
return item.caseNo == row.case_no;
|
||||
});
|
||||
let param = [arr[0].id];
|
||||
delCaseCollection(param).then((res) => {
|
||||
if (res) {
|
||||
createMessage.success('已从收藏夹中移除');
|
||||
getCollentionLength();
|
||||
reload2();
|
||||
}
|
||||
});
|
||||
}
|
||||
function openCollenction() {
|
||||
collenctionVisible.value = true;
|
||||
|
|
@ -315,12 +437,29 @@
|
|||
}
|
||||
function getCollentionLength() {
|
||||
getCollectionCaseList().then((res) => {
|
||||
console.log('ree', res);
|
||||
favoriteNum.value = res.total;
|
||||
});
|
||||
}
|
||||
function getOrgList() {
|
||||
getDeptList().then((res) => {
|
||||
res.forEach((item) => {
|
||||
if (item.id == '371300') {
|
||||
selectOptions1.value = item.children;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
function getCaseCollList() {
|
||||
getUserInfoData().then((res) => {
|
||||
getCaseList({ uid: res.user.Id }).then((rel) => {
|
||||
collenctionList.value = rel;
|
||||
});
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
getCollentionLength();
|
||||
getCaseCollList();
|
||||
getOrgList();
|
||||
});
|
||||
const prefixCls = 'form-box';
|
||||
</script>
|
||||
|
|
@ -358,6 +497,7 @@
|
|||
&-collenction {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
&-header {
|
||||
padding: 0 10px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,36 @@
|
|||
import { BasicColumn } from '@/components/Table';
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '案件编号',
|
||||
dataIndex: 'case_no',
|
||||
},
|
||||
{
|
||||
title: '上报时间',
|
||||
dataIndex: 'createtime',
|
||||
},
|
||||
{
|
||||
title: '地点',
|
||||
dataIndex: 'address',
|
||||
customRender: ({ record }) => {
|
||||
const text = record.countyname + record.streetname + record.communityname;
|
||||
return text;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '案件描述',
|
||||
dataIndex: 'case_description',
|
||||
},
|
||||
{
|
||||
title: '占用耕地面积',
|
||||
dataIndex: 'area',
|
||||
},
|
||||
{
|
||||
title: '处理时间',
|
||||
dataIndex: 'deal_time',
|
||||
},
|
||||
{
|
||||
title: '案件处理人',
|
||||
dataIndex: 'deal_username',
|
||||
},
|
||||
];
|
||||
|
|
@ -0,0 +1,330 @@
|
|||
<template>
|
||||
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
|
||||
<div :class="`${prefixCls}`">
|
||||
<div :class="`${prefixCls}-header`">
|
||||
<div></div>
|
||||
<div class="flex">
|
||||
<a-tree-select
|
||||
v-if="selectOptions1.length > 0"
|
||||
v-model:value="selectValues1"
|
||||
show-search
|
||||
style="width: 230px"
|
||||
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
||||
placeholder="查询地区"
|
||||
allow-clear
|
||||
:tree-data="selectOptions1"
|
||||
:field-names="{
|
||||
children: 'children',
|
||||
value: 'id',
|
||||
label: 'name',
|
||||
}"
|
||||
tree-node-filter-prop="name"
|
||||
@change="areaChange"
|
||||
/>
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="is_illegal"
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
allowClear
|
||||
:options="selectOptions2"
|
||||
placeholder="现场状况"
|
||||
@change="reload1"
|
||||
/>
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="is_drawback"
|
||||
:options="selectOptions3"
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
allowClear
|
||||
placeholder="新增退回"
|
||||
@change="reload1"
|
||||
/>
|
||||
<a-input
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
v-model:value="searchCaseNo"
|
||||
placeholder="案件编号"
|
||||
/>
|
||||
<a-input
|
||||
style="width: 150px"
|
||||
class="ml-3"
|
||||
v-model:value="searchKey"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<a-button class="ml-3" :icon="h(SearchOutlined)" @click="reload1">搜索</a-button>
|
||||
<a-button type="success" class="ml-3" :icon="h(DownloadOutlined)">导出</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content`">
|
||||
<div :class="`${prefixCls}-content-tabbox`">
|
||||
<div :class="`${prefixCls}-content-tabbox-left`">
|
||||
<BasicTable @register="registerTable" v-if="!caseDetailVisible">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
label: '核验',
|
||||
onClick: () => {
|
||||
handleAuditing(record);
|
||||
},
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
<div :class="`${prefixCls}-content-tabbox-left-collenction`" v-if="caseDetailVisible">
|
||||
<div :class="`${prefixCls}-content-tabbox-left-collenction-header`">
|
||||
<div>案件详情</div>
|
||||
<div
|
||||
:class="`${prefixCls}-content-tabbox-left-collenction-header-close`"
|
||||
@click="closeCaseDetail"
|
||||
><CloseOutlined
|
||||
/></div>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-tabbox-left-collenction-box`">
|
||||
<CaseView :caseId="selectRowDetail.id" :mapShow="false"></CaseView>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-tabbox-left-collenction-footer`">
|
||||
<a-input
|
||||
size="mini"
|
||||
class="ml-3"
|
||||
v-model:value="caseBackReason"
|
||||
placeholder="退回原因"
|
||||
/>
|
||||
<a-button type="error" class="ml-3" @click="handleCaseBack"> 退回 </a-button>
|
||||
<a-button type="primary" class="ml-3" @click="handlePassForm"> 核验 </a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="`${prefixCls}-content-mapbox`">
|
||||
<MapDetail :ruleForm="selectRowDetail"></MapDetail>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref, h } from 'vue';
|
||||
import { SearchOutlined, DownloadOutlined, CloseOutlined } from '@ant-design/icons-vue';
|
||||
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
||||
import { PageWrapper } from '@/components/Page';
|
||||
import {
|
||||
getTableListData,
|
||||
passVerificatCase,
|
||||
backVerificcatCase,
|
||||
} from '@/api/summaryverification/index';
|
||||
import { getDeptList } from '@/api/demo/system';
|
||||
import { columns } from './index.data';
|
||||
import { useMessage } from '@/hooks/web/useMessage';
|
||||
import { CaseView } from '@/views/demo/monitor/index';
|
||||
import MapDetail from './mapDetail.vue';
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const caseBackReason: any = ref();
|
||||
const caseDetailVisible: any = ref(false);
|
||||
const selectRowDetail: any = ref({});
|
||||
const selectValues1: any = ref();
|
||||
const selectOptions1: any = ref([]);
|
||||
const searchKey: any = ref();
|
||||
const searchCaseNo: any = ref();
|
||||
const countyid: any = ref();
|
||||
const streetid: any = ref();
|
||||
const communityid: any = ref();
|
||||
const is_illegal: any = ref();
|
||||
const selectOptions2: any = ref([
|
||||
{ label: '合法', value: 0 },
|
||||
{ label: '违法', value: 1 },
|
||||
{ label: '伪变化', value: 2 },
|
||||
]);
|
||||
const is_drawback: any = ref();
|
||||
const selectOptions3: any = ref([
|
||||
{ label: '新增', value: 0 },
|
||||
{ label: '退回', value: 1 },
|
||||
]);
|
||||
|
||||
const [registerTable, { reload: reload1 }] = useTable({
|
||||
title: '',
|
||||
api: getTableListData,
|
||||
columns,
|
||||
rowKey: 'id',
|
||||
formConfig: {
|
||||
labelWidth: 120,
|
||||
},
|
||||
// rowSelection: {
|
||||
// type: 'checkbox',
|
||||
// },
|
||||
useSearchForm: false,
|
||||
showTableSetting: false,
|
||||
bordered: true,
|
||||
actionColumn: {
|
||||
width: 100,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
},
|
||||
beforeFetch: (data) => {
|
||||
let temp = {
|
||||
page: data.page,
|
||||
limit: data.limit,
|
||||
is_illegal: is_illegal.value,
|
||||
is_drawback: is_drawback.value,
|
||||
countyid: countyid.value,
|
||||
streetid: streetid.value,
|
||||
communityid: communityid.value,
|
||||
case_no: searchCaseNo.value,
|
||||
key: searchKey.value,
|
||||
};
|
||||
return temp;
|
||||
},
|
||||
handleSearchInfoFn(info) {
|
||||
return info;
|
||||
},
|
||||
});
|
||||
function closeCaseDetail() {
|
||||
caseDetailVisible.value = false;
|
||||
}
|
||||
function handleCaseBack() {
|
||||
if (!caseBackReason.value) {
|
||||
createMessage.error('退回原因不能为空');
|
||||
return;
|
||||
}
|
||||
const param = {
|
||||
id: selectRowDetail.value.id,
|
||||
drawbackReason: caseBackReason.value,
|
||||
};
|
||||
backVerificcatCase(param).then((res) => {
|
||||
if (res) {
|
||||
createMessage.success('操作成功');
|
||||
reload1();
|
||||
caseDetailVisible.value = false;
|
||||
} else {
|
||||
createMessage.error('此案件未办理,无需退回。');
|
||||
}
|
||||
});
|
||||
}
|
||||
function handlePassForm() {
|
||||
passVerificatCase([selectRowDetail.value.id]).then((res) => {
|
||||
if (res) {
|
||||
caseDetailVisible.value = false;
|
||||
createMessage.success('操作成功');
|
||||
} else {
|
||||
createMessage.error('操作失败');
|
||||
}
|
||||
});
|
||||
}
|
||||
function areaChange(items) {
|
||||
countyid.value = null;
|
||||
streetid.value = null;
|
||||
communityid.value = null;
|
||||
if (items && JSON.stringify(items).length == 6) {
|
||||
countyid.value = items;
|
||||
}
|
||||
if (items && JSON.stringify(items).length == 9) {
|
||||
streetid.value = items;
|
||||
}
|
||||
if (items && JSON.stringify(items).length == 12) {
|
||||
communityid.value = items;
|
||||
}
|
||||
reload1();
|
||||
}
|
||||
function handleAuditing(record) {
|
||||
console.log('record', record);
|
||||
const formData = record;
|
||||
formData.homeAddress =
|
||||
record.countyname + record.streetname + record.communityname + record.address;
|
||||
formData.lngLat = record.lng + ' , ' + record.lat;
|
||||
selectRowDetail.value = record;
|
||||
caseDetailVisible.value = true;
|
||||
}
|
||||
function getOrgList() {
|
||||
getDeptList().then((res) => {
|
||||
res.forEach((item) => {
|
||||
if (item.id == '371300') {
|
||||
selectOptions1.value = item.children;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
getOrgList();
|
||||
});
|
||||
const prefixCls = 'form-box';
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.form-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&-header {
|
||||
width: 100%;
|
||||
padding: 0 10px;
|
||||
height: 60px;
|
||||
background: #f8f8f8;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-content {
|
||||
width: 100%;
|
||||
height: calc(100% - 60px);
|
||||
display: flex;
|
||||
|
||||
&-tabbox {
|
||||
width: 70%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
&-left {
|
||||
flex: 1;
|
||||
border: 1px solid #eee;
|
||||
|
||||
&-collenction {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
&-box {
|
||||
height: calc(100% - 110px);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
&-footer {
|
||||
height: 60px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-header {
|
||||
padding: 0 10px;
|
||||
height: 50px;
|
||||
overflow: auto;
|
||||
border-bottom: 1px solid #eee;
|
||||
display: flex;
|
||||
background: #fff;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
&-close {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-mapbox {
|
||||
width: calc(30% - 20px);
|
||||
margin: 0 15px 15px 15px;
|
||||
border: 1px solid red;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,206 @@
|
|||
<template>
|
||||
<div class="w-full">
|
||||
<MapboxMaps :mapOptions="mapOptions" @map-on-load="mapOnLoad" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import rodeImg from '@/assets/images/icon_fly2.png';
|
||||
import { ref, watch } from 'vue';
|
||||
import MapboxMaps from '@/components/MapboxMaps/index.vue';
|
||||
import { getDroneGeoJson } from '@/api/monitor/index';
|
||||
const detailMap = ref();
|
||||
const props = defineProps({
|
||||
ruleForm: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
},
|
||||
},
|
||||
});
|
||||
const geojson = ref();
|
||||
const droneMarker = ref();
|
||||
const mapBox = ref();
|
||||
|
||||
const mapOptions = {
|
||||
center: [117.84714891969796, 35.22152309532066],
|
||||
zoom: 10,
|
||||
};
|
||||
watch(
|
||||
() => props.ruleForm,
|
||||
(newVal, oldVal) => {
|
||||
loadCaseGeoJson();
|
||||
detailMap.value.flyTo({
|
||||
center: [newVal.lng, newVal.lat], // 中心点
|
||||
zoom: 18, // 缩放比例
|
||||
pitch: 0, // 倾斜度
|
||||
});
|
||||
loadDroneMarker(newVal.lng, newVal.lat);
|
||||
},
|
||||
);
|
||||
const mapOnLoad = (map) => {
|
||||
mapBox.value = map;
|
||||
// 测试地址
|
||||
const testSource =
|
||||
'http://123.132.248.154:9205/geoserver/gwc/service/tms/1.0.0/TEST_WORK_SPACE%3Alindi@EPSG:900913@pbf/{z}/{x}/{y}.pbf';
|
||||
map.U.addVector('name', testSource);
|
||||
map.U.addLineLayer('ffff', {
|
||||
source: 'name',
|
||||
'source-layer': 'lindi',
|
||||
});
|
||||
detailMap.value = map;
|
||||
loadImageLayer();
|
||||
loadStreetBorderLayer();
|
||||
if (props.ruleForm && props.ruleForm.id) {
|
||||
loadCaseGeoJson();
|
||||
}
|
||||
};
|
||||
// 费县图斑
|
||||
function loadImageLayer() {
|
||||
detailMap.value.addLayer({
|
||||
id: 'wms-test-layer',
|
||||
type: 'raster',
|
||||
source: {
|
||||
type: 'raster',
|
||||
tiles: [
|
||||
'http://175.27.168.120:8080/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:yingxiang&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE',
|
||||
],
|
||||
tileSize: 256,
|
||||
},
|
||||
paint: {},
|
||||
});
|
||||
}
|
||||
// 费县镇界
|
||||
function loadStreetBorderLayer() {
|
||||
detailMap.value.addLayer({
|
||||
id: 'street-border',
|
||||
type: 'raster',
|
||||
source: {
|
||||
type: 'raster',
|
||||
tiles: [
|
||||
'http://175.27.168.120:8080/geoserver/feixian/wms?service=WMS&version=1.1.0&request=GetMap&layers=feixian:zhenjie&styles=&bbox={bbox-epsg-3857}&width=256&height=256&srs=EPSG:3857&format=image/png&TRANSPARENT=TRUE',
|
||||
],
|
||||
tileSize: 256,
|
||||
},
|
||||
paint: {},
|
||||
layout: {
|
||||
visibility: 'visible',
|
||||
},
|
||||
});
|
||||
detailMap.value.resize();
|
||||
}
|
||||
// 获取GeoJSON图层
|
||||
async function loadCaseGeoJson() {
|
||||
const data = await getDroneGeoJson({ id: props.ruleForm.id });
|
||||
console.log(data);
|
||||
geojson.value = data;
|
||||
if (geojson.value.features.length == 0) {
|
||||
detailMap.value.addLayer({
|
||||
id: 'points',
|
||||
type: 'symbol',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'FeatureCollection',
|
||||
features: [
|
||||
{
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [props.ruleForm.lng, props.ruleForm.lng],
|
||||
},
|
||||
properties: {
|
||||
title: 'Mapbox DC',
|
||||
icon: 'monument',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
layout: {},
|
||||
});
|
||||
}
|
||||
// 报错的修改方法There is already a source with ID "geojsonfill"
|
||||
if (detailMap.value.getLayer('geojsonfill')) {
|
||||
detailMap.value.removeLayer('geojsonfill');
|
||||
detailMap.value.removeSource('geojsonfill');
|
||||
}
|
||||
if (detailMap.value.getLayer('geojsonline')) {
|
||||
detailMap.value.removeLayer('geojsonline');
|
||||
detailMap.value.removeSource('geojsonline');
|
||||
}
|
||||
|
||||
detailMap.value.addLayer({
|
||||
id: 'geojsonfill',
|
||||
type: 'fill',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: geojson.value,
|
||||
},
|
||||
paint: {
|
||||
'fill-color': '#FE9003',
|
||||
'fill-opacity': 0.2,
|
||||
'fill-outline-color': '#FE9003',
|
||||
},
|
||||
});
|
||||
|
||||
detailMap.value.addLayer({
|
||||
id: 'geojsonline',
|
||||
type: 'line',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: geojson.value,
|
||||
},
|
||||
layout: {
|
||||
'line-join': 'round',
|
||||
'line-cap': 'round',
|
||||
},
|
||||
paint: {
|
||||
'line-color': '#FE9003',
|
||||
'line-width': 4,
|
||||
},
|
||||
});
|
||||
}
|
||||
// 案件位置显示无人机图标
|
||||
function loadDroneMarker(lng, lat) {
|
||||
if (detailMap.value.getLayer('cat-on-building')) {
|
||||
detailMap.value.removeLayer('cat-on-building');
|
||||
detailMap.value.removeSource('cat-on-building');
|
||||
detailMap.value.removeImage('cat');
|
||||
}
|
||||
detailMap.value.loadImage(rodeImg, (error, image) => {
|
||||
detailMap.value.addImage('cat', image);
|
||||
detailMap.value.addLayer({
|
||||
id: 'cat-on-building',
|
||||
source: {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'FeatureCollection',
|
||||
features: [
|
||||
{
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [lng, lat],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
slot: 'top',
|
||||
type: 'symbol',
|
||||
layout: {
|
||||
'icon-image': 'cat',
|
||||
'icon-size': 0.05,
|
||||
'symbol-placement': 'point',
|
||||
'symbol-z-elevate': true,
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.w-full {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue