merge

.env.development

@@ -10,7 +10,7 @@ VITE_GLOB_API_URL=http://192.168.10.104:9020
 
 
 # File upload address， optional
-VITE_GLOB_UPLOAD_URL=/upload
+VITE_GLOB_UPLOAD_URL=http://192.168.10.104:9011
 
 # Interface prefix
 VITE_GLOB_API_URL_PREFIX=

package.json

@@ -130,6 +130,7 @@
     "vxe-table-plugin-export-xlsx": "^3.1.0",
     "xe-utils": "^3.5.14",
     "xlsx": "^0.18.5",
+    "vue-video-player": "^5.0.2",
     "xml-js": "^1.6.11"
   },
   "devDependencies": {

src/api/caseauditing/index.ts

@@ -0,0 +1,52 @@
+import { defHttp } from '@/utils/http/axios';
+import {
+  DemoOptionsItem,
+  OrgItemList,
+  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', //添加收藏案件
+  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?: 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 });

src/api/caseauditing/model/index.ts

@@ -0,0 +1,75 @@
+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 {
+  name: string;
+}
+
+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>;

src/api/demo/model/queryModal.ts

@@ -0,0 +1,11 @@
+import { BasicFetchResult } from '@/api/model/baseModel';
+
+// 常用返回消息
+export interface responses {
+  code: number;
+  columnHeaders: [];
+  count: number;
+  result: boolean;
+  msg: string;
+}
+export type responsesmodel = BasicFetchResult<responses>;

src/api/demo/query.ts

@@ -0,0 +1,100 @@
+import { responsesmodel } from './model/queryModal';
+import { defHttp } from '@/utils/http/axios';
+
+enum Api {
+  // complete-分页获取列表数据
+  Get_LoadCaseInfoList = '/api/DroneCaseinfo/LoadCaseInfoList',
+  // complete-
+  Get_LoadList = '/api/Categorys/LoadList',
+  // complete-
+  Get_load = '/api/categorys/load',
+  // complete-
+  Get_OrgList = '/api/Orgs/OrgList',
+  // complete-导出
+  Get_ExportCaseInfoList = '/api/DroneCaseinfo/ExportCaseInfoList', 
+
+  // 案件详情
+  Get_getCaseInfo = '/api/DroneCaseinfo/GetCaseInfo',
+  // 获取案件处理流程
+  Get_GetCaseFlowLog = '/api/DroneCaseinfo/GetCaseFlowLog',
+  // 处理详情
+  Get_GetDroneCaseDeal = '/api/DroneCaseinfo/GetDroneCaseDeal',
+}
+
+// complete-分页获取列表数据
+export function fun_LoadDataBaseInfo(params) {
+  params.typeid = params.value.typeid;
+  params.org = params.value.org;
+  params.is_illegal = params.value.is_illegal;
+  params.case_no = params.value.case_no;
+  params.key = params.value.key;
+  params.deal_username = params.value.deal_username;
+  params.verifyuser = params.value.verifyuser;
+  params.report_start_time = params.value.report_start_time;
+  params.report_end_time = params.value.report_end_time;
+  params.countyid = params.value.countyid;
+  params.streetid = params.value.streetid;
+  params.communityid = params.value.communityid;
+  delete params.value;
+
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_LoadCaseInfoList,
+    params,
+  });
+}
+
+// complete-分页获取列表数据
+export function fun_LoadList(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_LoadList,
+    params,
+  });
+}
+
+// complete-分页获取列表数据
+export function fun_load(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_load,
+    params,
+  });
+}
+
+// complete-分页获取列表数据
+export function fun_OrgList(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_OrgList,
+    params,
+  });
+}
+
+// complete-导出
+export function fun_ExportCaseInfoList(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_ExportCaseInfoList,
+    params,
+  });
+}
+
+// 案件详情
+export function fun_getCaseInfo(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_getCaseInfo,
+    params,
+  });
+}
+
+// 处理详情
+export function fun_GetCaseFlowLog(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_GetCaseFlowLog,
+    params,
+  });
+}
+
+// 获取案件处理流程
+export function fun_GetDroneCaseDeal(params) {
+  return defHttp.get<responsesmodel>({
+    url: Api.Get_GetDroneCaseDeal,
+    params,
+  });
+}

src/api/demo/system.ts

@@ -68,6 +68,8 @@ enum Api {
   DeleteNotice = '/api/DroneCaseinfo/UpdateDelMessage',
   UserList = '/api/users/load',
   StatisticalList='/api/DroneCaseinfo/CaseSynthesisCensus',
+  LoadNoticeDetail="/api/DroneCaseinfo/LoadMessage",
+  getChildrenTree = '/api/Orgs/LoadChildren',
 }
 
 export const getPositionsTree = (params?: AccountParams) =>
@@ -97,6 +99,9 @@ export const loadForRole = (params?: DeptListItem) =>
 export const loadByRole = (params?: DeptListItem) =>
   defHttp.get<DeptListGetResultModel>({ url: Api.LoadByRole, params });
 
+export const getChildrenTree = (params:{parentId:number}) =>
+  defHttp.get({ url: Api.getChildrenTree, params });
+
 export function addAccount(params) {
   return defHttp.post(
     {
@@ -345,5 +350,16 @@ export function deleteNotice(params) {
   );
 }
 
+export function getNoticeDetail(params) {
+  return defHttp.get(
+    {
+      url: Api.LoadNoticeDetail,
+      params,
+    },
+  );
+}
+
+
+
 export const getUserList = (params: UserListParams)=> 
   defHttp.get<UserListGetResultModel>({ url: Api.UserList, params });

src/api/monitor/index.ts

@@ -1,25 +1,29 @@
-
-// WFProcess 流程模版基本信息 
+// WFProcess 流程模版基本信息
 import { defHttp } from '@/utils/http/axios';
-import { caseFlowLogParams , flowLogModel , droneCaseDealModel ,droneCaseDealParams} from './model/index'
+import {
+  caseFlowLogParams,
+  flowLogModel,
+  droneCaseDealModel,
+  droneCaseDealParams,
+} from './model/index';
 
 enum Api {
   // 获取案件详情步骤条
   GetCaseFlowLog = '/api/DroneCaseinfo/GetCaseFlowLog',
   // 获取案件处理详情
   GetDroneCaseDeal = '/api/DroneCaseinfo/GetDroneCaseDeal',
-   // 获取案件详情
-   GetCaseInfo = '/api/DroneCaseinfo/GetCaseInfo',
+  // 获取案件详情
+  GetCaseInfo = '/api/DroneCaseinfo/GetCaseInfo',
   // 案件列表
   LoadCaseInfoList = '/api/DroneCaseinfo/LoadCaseInfoList',
   // 获取GeoJson图层
-  GetDroneGeoJson='/api/DroneCaseinfo/GetDroneGeoJson'
+  GetDroneGeoJson = '/api/DroneCaseinfo/GetDroneGeoJson',
 }
 
 /**
  * @description: getCaseFlowLog
  */
- export function getCaseFlowLog(params?: caseFlowLogParams) {
+export function getCaseFlowLog(params?: caseFlowLogParams) {
   return defHttp.get<flowLogModel>({ url: Api.GetCaseFlowLog, params });
 }
 /**
@@ -46,5 +50,3 @@ export function getCaseInfoList(params?: caseFlowLogParams) {
 export function getDroneGeoJson(params?: caseFlowLogParams) {
   return defHttp.get<flowLogModel>({ url: Api.GetDroneGeoJson, params });
 }
-
-

src/api/monitor/model/index.ts

@@ -1,21 +1,22 @@
 export interface caseFlowLogParams {
   id?: string;
 }
-export interface droneCaseDealParams{
-  caseid?:string;
+export interface droneCaseDealParams {
+  caseid?: string;
+  id?: string;
 }
 export interface flowLog {
   name: string;
   time: string;
   user_name: string;
   status: number;
-  state?:string;
+  state?: string;
 }
 export type flowLogModel = flowLog[];
 
-export interface fileList{
-  filePath?:string | undefined;
-  s_filePath?:string;
+export interface fileList {
+  filePath?: string | undefined;
+  s_filePath?: string;
 }
 export type fileListModel = fileList[];
 
@@ -30,5 +31,4 @@ export type droneCaseDealModel = {
   payment_pic_list?: any;
   agree_checkout_pic_list?: any;
   checkout_pic_list?: any;
-  
-}
+};

src/api/summaryverification/index.ts

@@ -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 });

src/api/summaryverification/model/index.ts

@@ -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>;

src/api/sys/WFDelegate.ts

@@ -1,16 +1,15 @@
-// WFDelegate 流程模版基本信息 
+// WFDelegate 流程模版基本信息
 import { defHttp } from '@/utils/http/axios';
-import {DetailParams} from './model/wfSchemeInfoModel'
+import { DetailParams } from './model/wfSchemeInfoModel';
 
-  enum Api {
+enum Api {
   // 创建流程
   LoadMyUserList = '/api/WFDelegate/LoadMyUserList',
- 
 }
 
 /**
  * @description: getLoadMyUserList
  */
- export function getLoadMyUserList(params?: DetailParams) {
+export function getLoadMyUserList(params?: DetailParams) {
   return defHttp.get({ url: Api.LoadMyUserList, params });
-}
+}

src/api/sys/WFProcess.ts

@@ -1,8 +1,12 @@
-
-// WFProcess 流程模版基本信息 
+// WFProcess 流程模版基本信息
 import { defHttp } from '@/utils/http/axios';
-import { CreateParams, DeleteDraftParams, RevokeAuditParams,LoadNextAuditorsParams } from './model/WFProcessModel'
-import { MyUncompletedParams } from './model/WFTaskModel'
+import {
+  CreateParams,
+  DeleteDraftParams,
+  RevokeAuditParams,
+  LoadNextAuditorsParams,
+} from './model/WFProcessModel';
+import { MyUncompletedParams } from './model/WFTaskModel';
 
 enum Api {
   // 创建流程
@@ -28,73 +32,63 @@ enum Api {
   // 加签审核
   SignAudit = '/api/WFProcess/SignAudit',
   // 流程审核
-  Audit='/api/WFProcess/Audit',
+  Audit = '/api/WFProcess/Audit',
   // 获取下一节点审核人
-  LoadNextAuditors='/api/WFProcess/LoadNextAuditors',
+  LoadNextAuditors = '/api/WFProcess/LoadNextAuditors',
   // 确认阅读
-  ReadFlow='/api/WFProcess/ReadFlow',
+  ReadFlow = '/api/WFProcess/ReadFlow',
 }
 
 /**
  * @description: getLoadMyPage
  */
- export function getLoadNextAuditors(params?: LoadNextAuditorsParams) {
+export function getLoadNextAuditors(params?: LoadNextAuditorsParams) {
   return defHttp.get({ url: Api.LoadNextAuditors, params });
 }
 /**
  * @description: 创建流程
  */
 export function create(params?: CreateParams) {
-  return defHttp.post(
-    {
-      url: Api.Create,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.Create,
+    params,
+  });
 }
 /**
  * @description: 重新创建流程
  */
 export function createAgain(params?: CreateParams) {
-  return defHttp.post(
-    {
-      url: Api.CreateAgain,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.CreateAgain,
+    params,
+  });
 }
 /**
  * @description: 加签审核
  */
- export function signAudit(id?:String,params?: CreateParams) {
-  return defHttp.post(
-    {
-      url: Api.SignAudit+"?id="+id,
-      params,
-    },
-  );
+export function signAudit(id?: String, params?: CreateParams) {
+  return defHttp.post({
+    url: Api.SignAudit + '?id=' + id,
+    params,
+  });
 }
 /**
  * @description: 流程审核
  */
- export function audit(id:String,params?: CreateParams) {
-  return defHttp.post(
-    {
-      url: Api.Audit+"?id="+id,
-      params,
-    },
-  );
+export function audit(id: String, params?: CreateParams) {
+  return defHttp.post({
+    url: Api.Audit + '?id=' + id,
+    params,
+  });
 }
 /**
  * @description: 保存草稿
  */
 export function saveDraft(params?: CreateParams) {
-  return defHttp.post(
-    {
-      url: Api.SaveDraft,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.SaveDraft,
+    params,
+  });
 }
 /**
  * @description: getLoadMyPage
@@ -112,45 +106,37 @@ export function getLoadMyDraftPage(params?: MyUncompletedParams) {
  * @description: 删除草稿
  */
 export function deleteDraft(params: DeleteDraftParams) {
-  return defHttp.post(
-    {
-      url: Api.DeleteDraft + "?id=" + params.id,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.DeleteDraft + '?id=' + params.id,
+    params,
+  });
 }
 /**
  * @description: 催办
  */
 export function urge(params: DeleteDraftParams) {
-  return defHttp.post(
-    {
-      url: Api.Urge + "?id=" + params.id,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.Urge + '?id=' + params.id,
+    params,
+  });
 }
 /**
  * @description: 撤销
  */
 export function revoke(params: DeleteDraftParams) {
-  return defHttp.post(
-    {
-      url: Api.Revoke + "?id=" + params.id,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.Revoke + '?id=' + params.id,
+    params,
+  });
 }
 /**
  * @description: 审核撤销
  */
 export function revokeAudit(params: RevokeAuditParams) {
-  return defHttp.post(
-    {
-      url: Api.RevokeAudit + "?id=" + params.id + "&taskId=" + params.taskId,
-      params,
-    },
-  );
+  return defHttp.post({
+    url: Api.RevokeAudit + '?id=' + params.id + '&taskId=' + params.taskId,
+    params,
+  });
 }
 /**
  * @description: getPBMN
@@ -162,10 +148,8 @@ export function getBPMN(params: DeleteDraftParams) {
 /**
  * @description: 确认阅读
  */
- export function ReadFlow(id: string) {
-  return defHttp.post(
-    {
-      url: Api.ReadFlow + "?id=" + id ,
-    },
-  );
-}
+export function ReadFlow(id: string) {
+  return defHttp.post({
+    url: Api.ReadFlow + '?id=' + id,
+  });
+}

src/api/sys/WFSchemeInfo.ts

@@ -1,25 +1,35 @@
-// WFSchemeInfo 流程模版基本信息 
+// WFSchemeInfo 流程模版基本信息
 import { defHttp } from '@/utils/http/axios';
-import {SchemeListParams,GetSchemeModel,AddParams,
-  DeleteParams,UpdateParams,StateParams,HistoryParams,GetHistoryModel,SchemeParams,DetailParams} from './model/wfSchemeInfoModel'
+import {
+  SchemeListParams,
+  GetSchemeModel,
+  AddParams,
+  DeleteParams,
+  UpdateParams,
+  StateParams,
+  HistoryParams,
+  GetHistoryModel,
+  SchemeParams,
+  DetailParams,
+} from './model/wfSchemeInfoModel';
 
-  enum Api {
+enum Api {
   // 流程模板基本信息
   LoadPage = '/api/WFSchemeInfo/LoadPage',
   Add = '/api/WFSchemeInfo/Add',
   Update = '/api/WFSchemeInfo/Update',
   Delete = '/api/WFSchemeInfo/Delete',
   UpDateState = '/api/WFSchemeInfo/UpDateState',
-  GetDetail='/api/WFSchemeInfo/Get',
+  GetDetail = '/api/WFSchemeInfo/Get',
   // 可用模板合集
-  Load='/api/WFSchemeInfo/Load',
+  Load = '/api/WFSchemeInfo/Load',
   // 流程模板详细信息
-  LoadHistoryPage= '/api/WFScheme/LoadPage',
-  UpdateScheme='/api/WFSchemeInfo/UpdateScheme',
+  LoadHistoryPage = '/api/WFScheme/LoadPage',
+  UpdateScheme = '/api/WFSchemeInfo/UpdateScheme',
   // 获取某模板历史数据
-  VerisonsLoad='/api/WFScheme/Load',
+  VerisonsLoad = '/api/WFScheme/Load',
   // 获取自定义流程列表（流程发起页）
-  GetInfoList='/api/WFSchemeInfo/GetInfoList'
+  GetInfoList = '/api/WFSchemeInfo/GetInfoList',
 }
 
 /**
@@ -28,57 +38,56 @@ import {SchemeListParams,GetSchemeModel,AddParams,
 export function getLoadPage(params?: SchemeListParams) {
   return defHttp.get<GetSchemeModel>({ url: Api.LoadPage, params });
 }
-export function getDetail(params?: DetailParams){
+export function getDetail(params?: DetailParams) {
   return defHttp.get({ url: Api.GetDetail, params });
 }
 /**
  * @description: getLoad 可用模板列表
  */
- export function getLoad(params?: SchemeListParams) {
+export function getLoad(params?: SchemeListParams) {
   return defHttp.get<GetSchemeModel>({ url: Api.Load, params });
 }
 /**
  * @description: postAdd
  */
-export function postAdd( params?:AddParams) {
-  return defHttp.post(
-    {
-      url: Api.Add,
-      params,
-    },
-  );
-}
-
-export function update(params:UpdateParams) {
+export function postAdd(params?: AddParams) {
   return defHttp.post({
-    url: Api.Update+"?id="+params.schemeinfo.id,
-    params
+    url: Api.Add,
+    params,
   });
 }
 
-export function del(params:DeleteParams) {
-  return defHttp.post({ url: Api.Delete + "?id=" + params.id });
+export function update(params: UpdateParams) {
+  return defHttp.post({
+    url: Api.Update + '?id=' + params.schemeinfo.id,
+    params,
+  });
 }
 
-export function updateState(params:StateParams){
-  return defHttp.post({ url: Api.UpDateState + "?id=" + params.id +"&state="+params.state});
+export function del(params: DeleteParams) {
+  return defHttp.post({ url: Api.Delete + '?id=' + params.id });
 }
 
-export function getLoadHistoryPage(params?:HistoryParams){
-  return defHttp.get<GetHistoryModel>({url:Api.LoadHistoryPage,params})
-}
-export function getVerisonsLoad(params?:HistoryParams){
-  return defHttp.get<GetHistoryModel>({url:Api.VerisonsLoad,params})
+export function updateState(params: StateParams) {
+  return defHttp.post({ url: Api.UpDateState + '?id=' + params.id + '&state=' + params.state });
 }
 
-export function updateScheme(params:SchemeParams){
-  return defHttp.post({ url: Api.UpdateScheme + "?id=" + params.id +"&schemeId="+params.schemeId});
+export function getLoadHistoryPage(params?: HistoryParams) {
+  return defHttp.get<GetHistoryModel>({ url: Api.LoadHistoryPage, params });
+}
+export function getVerisonsLoad(params?: HistoryParams) {
+  return defHttp.get<GetHistoryModel>({ url: Api.VerisonsLoad, params });
+}
+
+export function updateScheme(params: SchemeParams) {
+  return defHttp.post({
+    url: Api.UpdateScheme + '?id=' + params.id + '&schemeId=' + params.schemeId,
+  });
 }
 
 /**
  * @description: getInfoList 获取流程自定义列表
  */
- export function getInfoList(params) {
+export function getInfoList(params) {
   return defHttp.get({ url: Api.GetInfoList, params });
 }
-

src/api/sys/WFTask.ts

@@ -1,55 +1,53 @@
-
 // WFTask
 import { defHttp } from '@/utils/http/axios';
-import {MyUncompletedParams,TaskDetailParam} from './model/WFTaskModel'
+import { MyUncompletedParams, TaskDetailParam } from './model/WFTaskModel';
 
-  enum Api {
+enum Api {
   // 我的待办
   LoadMyUncompletedPage = '/api/WFTask/LoadMyUncompletedPage',
   // 我的已办
-  LoadMyCompletedPage='/api/WFTask/LoadMyCompletedPage',
+  LoadMyCompletedPage = '/api/WFTask/LoadMyCompletedPage',
   // 我的传阅
-  LoadMyReadPage='/api/WFTask/LoadMyReadPage',
+  LoadMyReadPage = '/api/WFTask/LoadMyReadPage',
   // 我的委托
-  LoadMyDelegatePage='/api/WFTask/LoadMyDelegatePage',
-  GetTaskDetail='/api/WFTask/Get',
-  GetBPMNTask='/api/WFTask/GetBPMN'
+  LoadMyDelegatePage = '/api/WFTask/LoadMyDelegatePage',
+  GetTaskDetail = '/api/WFTask/Get',
+  GetBPMNTask = '/api/WFTask/GetBPMN',
 }
 
 /**
  * @description: getLoadMyUncompletedPage
  */
- export function getLoadMyUncompletedPage(params?: MyUncompletedParams) {
+export function getLoadMyUncompletedPage(params?: MyUncompletedParams) {
   return defHttp.get({ url: Api.LoadMyUncompletedPage, params });
 }
 /**
  * @description: getLoadMyCompletedPage
  */
- export function getLoadMyCompletedPage(params?: MyUncompletedParams) {
+export function getLoadMyCompletedPage(params?: MyUncompletedParams) {
   return defHttp.get({ url: Api.LoadMyCompletedPage, params });
 }
 /**
  * @description: getLoadMyReadPage
  */
- export function getLoadMyReadPage(params?: MyUncompletedParams) {
+export function getLoadMyReadPage(params?: MyUncompletedParams) {
   return defHttp.get({ url: Api.LoadMyReadPage, params });
 }
 /**
  * @description: getLoadMyDelegatePage
  */
- export function getLoadMyDelegatePage(params?: MyUncompletedParams) {
+export function getLoadMyDelegatePage(params?: MyUncompletedParams) {
   return defHttp.get({ url: Api.LoadMyDelegatePage, params });
 }
 /**
  * @description: GetTaskDetail
  */
- export function getTaskDetail(params?: TaskDetailParam) {
+export function getTaskDetail(params?: TaskDetailParam) {
   return defHttp.get({ url: Api.GetTaskDetail, params });
 }
 /**
  * @description: getBPMNTask
  */
- export function getBPMNTask(params?: TaskDetailParam) {
+export function getBPMNTask(params?: TaskDetailParam) {
   return defHttp.get({ url: Api.GetBPMNTask, params });
 }
-

src/api/sys/categories.ts

@@ -0,0 +1,31 @@
+import { defHttp } from '@/utils/http/axios';
+enum Api{
+  getLeftTree = '/api/SysDataItem/Load',
+  getRightTable = '/api/SysDataItemDetail/Load',
+  addLeftItem = '/api/SysDataItem/Add',
+  addRightItem = '/api/SysDataItemDetail/Add',
+  delLeftItem = '/api/SysDataItem/Delete',
+  delRightItem = '/api/SysDataItemDetail/Delete',
+  editRightItem = '/api/SysDataItemDetail/Update',
+}
+export function getLeftTree(params) {
+  return defHttp.get({ url: Api.getLeftTree, params });
+}
+export function getRightTable(params) {
+  return defHttp.get({ url: Api.getRightTable, params });
+}
+export function addLeftItem(params){
+  return defHttp.post({ url: Api.addLeftItem, params });
+}
+export function addRightItem(params){
+  return defHttp.post({ url: Api.addRightItem + '?code=' + params.itemCode, params });
+}
+export function delLeftItem(params){
+  return defHttp.post({ url: Api.delLeftItem + '?id=' + params.id });
+}
+export function delRightItem(params){
+  return defHttp.post({ url: Api.delRightItem + '?id=' + params.id });
+}
+export function editRightItem(params){
+  return defHttp.post({ url: Api.editRightItem, params });
+}

src/api/sys/flowPenal.ts

@@ -1,5 +1,10 @@
 import { defHttp } from '@/utils/http/axios';
-import {TableListParams,TableListModel,TableFormsParams,TableFormsModel} from './model/flowPenal'
+import {
+  TableListParams,
+  TableListModel,
+  TableFormsParams,
+  TableFormsModel,
+} from './model/flowPenalModel';
 
 enum Api {
   GetTableList = '/api/FormModule/GetTableList',
@@ -15,7 +20,7 @@ export function getTableList(params: TableListParams) {
 }
 /**
  * @description: getTableForms 获取表的对象集合
- */ 
- export function getTableForms(params: TableFormsParams) {
+ */
+export function getTableForms(params: TableFormsParams) {
   return defHttp.get<TableFormsModel>({ url: Api.GetTableForms, params });
-}
+}

src/api/sys/leadreporting.ts

@@ -0,0 +1,7 @@
+import { defHttp } from '@/utils/http/axios';
+enum Api{
+  LoadPage = '/api/DroneClueReporting/QueryClueReporting',
+}
+export function getLoadPage(params) {
+  return defHttp.get({ url: Api.LoadPage, params });
+}

src/api/sys/model/WFProcessModel.ts

@@ -1,45 +1,44 @@
 /**
  * @description: 创建流程参数
  */
- export interface CreateParams {
-  processId?: string | null,
-  schemeCode?: string,
-  title?: string,
-  userId?: string,
-  toUserId?: string,
+export interface CreateParams {
+  processId?: string | null;
+  schemeCode?: string;
+  title?: string;
+  userId?: string;
+  toUserId?: string;
   nextUsers?: {
-    additionalProp1: string,
-    additionalProp2: string,
-    additionalProp3: string
-  },
-  des?: string,
-  code?: string,
-  name?: string,
-  stampImg?: string,
-  stampPassWord?: string,
-  nextId?: string
+    additionalProp1: string;
+    additionalProp2: string;
+    additionalProp3: string;
+  };
+  des?: string;
+  code?: string;
+  name?: string;
+  stampImg?: string;
+  stampPassWord?: string;
+  nextId?: string;
 }
 /**
  * @description: 删除草稿参数
  */
- export interface DeleteDraftParams {
-  id: string,
+export interface DeleteDraftParams {
+  id: string;
 }
 /**
  * @description: 审核撤销参数
  */
- export interface RevokeAuditParams {
-  id: string,
-  taskId:string,
+export interface RevokeAuditParams {
+  id: string;
+  taskId: string;
 }
 /**
  * @description: 下一节点审核人参数
  */
- export interface LoadNextAuditorsParams {
-  code: string,
-  processId?:string | number,
-  nodeId:string,
-  operationCode:string,
-  userId:string,
+export interface LoadNextAuditorsParams {
+  code: string;
+  processId?: string | number;
+  nodeId: string;
+  operationCode: string;
+  userId: string;
 }
-

src/api/sys/model/WFTaskModel.ts

@@ -1,7 +1,7 @@
 /**
  * @description: 我的待办查询参数
  */
- export interface MyUncompletedParams {
+export interface MyUncompletedParams {
   keyWord: string;
   page: number;
   limit: number;
@@ -10,4 +10,4 @@
 }
 export interface TaskDetailParam {
   id: string;
-}
+}

src/api/sys/model/flowPenalModel.ts

@@ -1,7 +1,7 @@
 /**
  * @description: 表数据
  */
- export interface TableListModel {
+export interface TableListModel {
   name: string;
   description: number;
   dbObjectType: number;
@@ -15,7 +15,7 @@ export interface TableListParams {
 /**
  * @description: 表对象集合的参数
  */
- export interface TableFormsParams {
+export interface TableFormsParams {
   dbCode: string;
   tableNames: string;
 }
@@ -23,7 +23,7 @@ export interface TableListParams {
 /**
  * @description: 表对象集合
  */
- export interface TableFormsModel {
+export interface TableFormsModel {
   db_codetable: object;
-  db_codecolumnsList:object
-}
+  db_codecolumnsList: object;
+}

src/api/sys/model/sysDataItemDetailModel.ts

@@ -19,8 +19,8 @@ export interface AddParams {
 /**
  * @description: 字典明细更新参数
  */
- export interface UpdateParams {
-  itemDetailId?:string;
+export interface UpdateParams {
+  itemDetailId?: string;
   itemName?: string;
   itemValue?: string;
   sortCode?: number;
@@ -28,12 +28,11 @@ export interface AddParams {
   description?: string;
 }
 
-
 /**
  * @description: 分类明细删除参数
  */
 export interface DeleteParams {
-  id: string ;
+  id: string;
 }
 
 /**

src/api/sys/model/wfSchemeInfoModel.ts

@@ -20,41 +20,41 @@ export interface DetailParams {
  */
 export interface AddParams {
   schemeinfo: {
-    id: string,
-    code: string,
-    name: string,
-    category: string,
-    color: string,
-    icon: string,
-    schemeId: string,
-    enabledMark: 0,
-    mark: 0,
-    isInApp: 0,
-    authType: 0,
-    description: string,
-    type: 0,
-    createDate: string,
-    createUserId: string,
-    createUserName: string
-  },
+    id: string;
+    code: string;
+    name: string;
+    category: string;
+    color: string;
+    icon: string;
+    schemeId: string;
+    enabledMark: 0;
+    mark: 0;
+    isInApp: 0;
+    authType: 0;
+    description: string;
+    type: 0;
+    createDate: string;
+    createUserId: string;
+    createUserName: string;
+  };
   schemeAuthList: [
     {
-      id: string,
-      schemeInfoId: string,
-      objName: string,
-      objId: string,
-      objType: 0
-    }
-  ],
+      id: string;
+      schemeInfoId: string;
+      objName: string;
+      objId: string;
+      objType: 0;
+    },
+  ];
   scheme: {
-    id: string,
-    schemeInfoId: string,
-    type: 0,
-    createDate: string,
-    createUserId: string,
-    createUserName: string,
-    content: string
-  }
+    id: string;
+    schemeInfoId: string;
+    type: 0;
+    createDate: string;
+    createUserId: string;
+    createUserName: string;
+    content: string;
+  };
 }
 
 /**
@@ -62,44 +62,43 @@ export interface AddParams {
  */
 export interface UpdateParams {
   schemeinfo: {
-    id: string,
-    code: string,
-    name: string,
-    category: string,
-    color: string,
-    icon: string,
-    schemeId: string,
-    enabledMark: 0,
-    mark: 0,
-    isInApp: 0,
-    authType: 0,
-    description: string,
-    type: 0,
-    createDate: string,
-    createUserId: string,
-    createUserName: string
-  },
+    id: string;
+    code: string;
+    name: string;
+    category: string;
+    color: string;
+    icon: string;
+    schemeId: string;
+    enabledMark: 0;
+    mark: 0;
+    isInApp: 0;
+    authType: 0;
+    description: string;
+    type: 0;
+    createDate: string;
+    createUserId: string;
+    createUserName: string;
+  };
   schemeAuthList: [
     {
-      id: string,
-      schemeInfoId: string,
-      objName: string,
-      objId: string,
-      objType: 0
-    }
-  ],
+      id: string;
+      schemeInfoId: string;
+      objName: string;
+      objId: string;
+      objType: 0;
+    },
+  ];
   scheme: {
-    id: string,
-    schemeInfoId: string,
-    type: 0,
-    createDate: string,
-    createUserId: string,
-    createUserName: string,
-    content: string
-  }
+    id: string;
+    schemeInfoId: string;
+    type: 0;
+    createDate: string;
+    createUserId: string;
+    createUserName: string;
+    content: string;
+  };
 }
 
-
 /**
  * @description: 分类明细删除参数
  */
@@ -149,18 +148,18 @@ export interface HistoryParams {
  * @description: 历史记录返回值
  */
 export interface GetHistoryModel {
-  id: string,
-  schemeInfoId: string,
-  type: number,
-  createDate: string,
-  createUserId: string,
-  createUserName: string,
-  content: string
+  id: string;
+  schemeInfoId: string;
+  type: number;
+  createDate: string;
+  createUserId: string;
+  createUserName: string;
+  content: string;
 }
 /**
  * @description: 切换版本
  */
 export interface SchemeParams {
-  id: string,
-  schemeId: string
+  id: string;
+  schemeId: string;
 }

src/api/sys/sysDataItemDetail.ts

@@ -1,6 +1,12 @@
 // sysDataItemDetail 字典明细接口api
 import { defHttp } from '@/utils/http/axios';
-import {CodeParams,AddParams,UpdateParams ,DeleteParams,GetSysDataItemDetailModel} from './model/sysDataItemDetailModel'
+import {
+  CodeParams,
+  AddParams,
+  UpdateParams,
+  DeleteParams,
+  GetSysDataItemDetailModel,
+} from './model/sysDataItemDetailModel';
 enum Api {
   Load = '/api/SysDataItemDetail/Load',
   Add = '/api/SysDataItemDetail/Add',
@@ -11,13 +17,11 @@ enum Api {
 /**
  * @description: postAdd
  */
-export function postAdd(code:string, params?:AddParams) {
-  return defHttp.post(
-    {
-      url: Api.Add + "?code=" + code,
-      params,
-    },
-  );
+export function postAdd(code: string, params?: AddParams) {
+  return defHttp.post({
+    url: Api.Add + '?code=' + code,
+    params,
+  });
 }
 
 /**
@@ -27,16 +31,14 @@ export function getLoad(params: CodeParams) {
   return defHttp.get<GetSysDataItemDetailModel>({ url: Api.Load, params });
 }
 
-export function update(params?:UpdateParams) {
-  console.log(params)
+export function update(params?: UpdateParams) {
+  console.log(params);
   return defHttp.post({
     url: Api.Update,
-    params
+    params,
   });
 }
 
-export function del(params:DeleteParams) {
-  return defHttp.post({ url: Api.Delete + "?id=" + params.id });
+export function del(params: DeleteParams) {
+  return defHttp.post({ url: Api.Delete + '?id=' + params.id });
 }
-
-

src/api/sys/upload.ts

@@ -4,8 +4,9 @@ import { UploadFileParams } from '#/axios';
 import { useGlobSetting } from '@/hooks/setting';
 import { AxiosProgressEvent } from 'axios';
 
-const { uploadUrl = '' } = useGlobSetting();
+const { uploadUrl } = useGlobSetting();
 
+const uploadFileUrl = uploadUrl + '/api/Platform/Upload';
 /**
  * @description: Upload interface
  */
@@ -15,7 +16,7 @@ export function uploadApi(
 ) {
   return defHttp.uploadFile<UploadApiResult>(
     {
-      url: uploadUrl,
+      url: uploadFileUrl,
       onUploadProgress,
     },
     params,

src/api/sys/user.ts

@@ -17,15 +17,17 @@ enum Api {
  * @description: user login api
  */
 export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal') {
-  console.log(defHttp.post<LoginResultModel>(
-    {
-      url: Api.Login,
-      params,
-    },
-    {
-      errorMessageMode: mode,
-    },
-  ))
+  console.log(
+    defHttp.post<LoginResultModel>(
+      {
+        url: Api.Login,
+        params,
+      },
+      {
+        errorMessageMode: mode,
+      },
+    ),
+  );
   return defHttp.post<LoginResultModel>(
     {
       url: Api.Login,

src/components/MapboxMaps/index.vue

@@ -32,10 +32,12 @@
   const props = defineProps<MapboxOptionsInterface>();
 
   let nextMapControl: Array<any> = reactive([]);
-  nextMapControl = props.control.map((item) => {
-    console.log('item::: ', item);
-    return MapControlConfig[item];
-  });
+  nextMapControl = props.control
+    ? props.control.map((item) => {
+        console.log('item::: ', item);
+        return MapControlConfig[item];
+      })
+    : [];
   console.log('nextMapControl::: ', nextMapControl);
 
   // 定义地图容器
@@ -67,6 +69,8 @@
       language: 'zh-cmn',
       projection: 'equirectangular', // wgs84参考系
       style: MapboxDefaultStyle,
+      maxZoom: 22,
+      minZoom: 6,
       ...props.mapOptions,
     });
   };

src/components/MapboxMaps/src/MP.ts

@@ -198,9 +198,9 @@ export class MP extends BaseMP {
     polygon: string;
   };
   currentMouseLocation: null;
-  correctionMouseLocation: null;
+  correctionMouseLocation: any;
   clickCount: number;
-  clickTimeout: null;
+  clickTimeout: any;
   constructor(map) {
     super(map);
     this.drawModelChoose = {
@@ -270,8 +270,12 @@ export class MP extends BaseMP {
       this._addOrUpdateSource(lastGSPL, this.drawCurrentId.polygon);
     }
   };
+  //绘制当前的layer
   _currentDrawLayer = () => {
+    // 如果是点，直接绘制点
     this._addLayer(this.drawCurrentId.point, this.drawCurrentId.point, 'Point', CIRCLE_STYLE);
+    // 如果是线，在点的基础上，加上线
+    // 如果是面，在线的基础上，加上面
     if (
       this.drawModel === this.drawModelChoose.LineString ||
       this.drawModel === this.drawModelChoose.Polygon
@@ -385,6 +389,9 @@ export class MP extends BaseMP {
       // 在这里编写双击事件的操作
       console.log('在这里编写双击事件的操作');
       if (this.drawModel === this.drawModelChoose.LineString) {
+        _this.drawLocal.push(e.lngLat);
+        _this._currentDrawSource();
+        _this._currentDrawLayer();
         this.drawIsFinish();
       }
     }

src/components/MapboxMaps/src/config.ts

@@ -21,7 +21,7 @@ export const MapboxDefaultStyle = {
       type: 'raster',
       source: 'raster-tiles',
       minzoom: 0,
-      maxzoom: 22,
+      maxzoom: 18,
     },
   ],
 };

src/components/MapboxMaps/src/index.css

@@ -0,0 +1,22 @@
+.mapboxgl-ctrl-logo {
+  display: none !important;
+}
+.map-container {
+  position: relative;
+}
+.map-box,
+.map-container {
+  width: 100%;
+  height: 100%;
+}
+.map-control {
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  display: flex;
+}
+.map-control img {
+  width: 40px;
+  height: 40px;
+  cursor: pointer;
+}

src/main.ts

@@ -16,41 +16,38 @@ import { router, setupRouter } from '@/router';
 import { setupRouterGuard } from '@/router/guard';
 import { setupStore } from '@/store';
 
-import { injectState, key } from "@/mars/common/store/widget"
-import store from "./mars/install/widget-store"
-
+import { injectState, key } from '@/mars/common/store/widget';
+import store from './mars/install/widget-store';
 
+import VideoPlayer from 'vue-video-player';
+import 'vue-video-player/src/custom-theme.css';
 
 import App from './App.vue';
 
-import "mars3d-cesium/Build/Cesium/Widgets/widgets.css"
-import "mars3d/dist/mars3d.css"
-
-
-import MarsUIInstall from "@/mars/components/mars-ui"
-import "@/mars/components/mars-ui/common"
-
-import ElementPlus from 'element-plus'
-import 'element-plus/theme-chalk/index.css'
-import VForm3 from '@/../lib/vform/designer.umd.js'
-import '../lib/vform/designer.style.css'
-
+import 'mars3d-cesium/Build/Cesium/Widgets/widgets.css';
+import 'mars3d/dist/mars3d.css';
 
+import MarsUIInstall from '@/mars/components/mars-ui';
+import '@/mars/components/mars-ui/common';
 
+import ElementPlus from 'element-plus';
+import 'element-plus/theme-chalk/index.css';
+import VForm3 from '@/../lib/vform/designer.umd.js';
+import '../lib/vform/designer.style.css';
 
 import 'bpmn-js/dist/assets/diagram-js.css';
 import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
 
-import Antd from "ant-design-vue"
+import Antd from 'ant-design-vue';
 
 async function bootstrap() {
   const app = createApp(App);
-  app.use(Antd)
+  app.use(Antd);
 
   // Configure store
   // 配置 store
   setupStore(app);
-  
+
   // Initialize internal system configuration
   // 初始化内部系统配置
   initAppConfigStore();
@@ -87,10 +84,10 @@ async function bootstrap() {
   // 注册Mars3d UI组件
   MarsUIInstall(app);
   app.use(injectState(store), key);
-  app.use(ElementPlus)
-  app.use(VForm3)  //全局注册VForm3，同时注册了v-form-designer、v-form-render等组件
+  app.use(ElementPlus);
+  app.use(VForm3);
+  app.use(VideoPlayer);
   app.mount('#app');
-  
 }
 
 bootstrap();

src/store/modules/flow.ts

@@ -1,7 +1,5 @@
-
 import { defineStore } from 'pinia';
 
-
 export const flowStore = defineStore({
   id: 'flow',
   state: () => ({
@@ -20,44 +18,44 @@ export const flowStore = defineStore({
     setWfDataName(id, name) {
       this.flowWfData.forEach((element: any) => {
         if (element.id == id && name) {
-            element.name = name
+          element.name = name;
         }
       });
     },
     setElments(data) {
-      this.flowElements = data
+      this.flowElements = data;
     },
     // 获取单个节点的数据
     getWfDataNode(id) {
       var currentIndex = (this.flowWfData || []).findIndex((element) => element.id === id);
       if (currentIndex == -1) {
-        return null
+        return null;
       } else {
-        return this.flowWfData[currentIndex]
+        return this.flowWfData[currentIndex];
       }
     },
     // 添加单个节点的数据
     setWfDataNode(data) {
-      let flowWfData = this.flowWfData
+      let flowWfData = this.flowWfData;
       var currentIndex = (flowWfData || []).findIndex((element) => element.id === data.id);
       if (currentIndex == -1) {
-        this.flowWfData.push(data)
+        this.flowWfData.push(data);
       }
     },
     // 全覆盖，供更新和详情使用
     setWfDataAll(list) {
-      this.flowWfData = list
+      this.flowWfData = list;
     },
     // 修改单个节点的某项数据
     updataWfDataNode(id, key, value) {
-      let flowWfData = this.flowWfData
+      let flowWfData = this.flowWfData;
       var currentIndex = (flowWfData || []).findIndex((element) => element.id === id);
-      this.flowWfData[currentIndex][key] = value
+      this.flowWfData[currentIndex][key] = value;
     },
     deleteWfData(data) {
-      let flowWfData = this.flowWfData
+      let flowWfData = this.flowWfData;
       var currentIndex = (flowWfData || []).findIndex((element) => element.id === data.id);
-      this.flowWfData.splice(currentIndex, 1)
-    }
+      this.flowWfData.splice(currentIndex, 1);
+    },
   },
 });

src/utils/http/axios/Axios.ts

@@ -128,8 +128,7 @@ export class VAxios {
    */
   uploadFile<T = any>(config: AxiosRequestConfig, params: UploadFileParams) {
     const formData = new window.FormData();
-    const customFilename = params.name || 'file';
-
+    const customFilename = 'files';
     if (params.filename) {
       formData.append(customFilename, params.file, params.filename);
     } else {

src/views/dashboard/analysis/index.vue

@@ -2,7 +2,7 @@
   <div class="w-full" style="height: 100%">
     <MapboxMaps
       :mapOptions="mapOptions"
-      :control="mapControl"
+      :control="mapDrawControl"
       @map-on-load="mapOnLoad"
       @map-draw="handlerMapDraw"
     />
@@ -16,7 +16,7 @@
     center: [116.404, 39.905],
     zoom: 8,
   };
-  const mapControl: DrawingType[] = [DrawingType.Point];
+  const mapDrawControl: DrawingType[] = [DrawingType.Polygon, DrawingType.Line];
   const mapOnLoad = (map) => {
     // map 对象
     console.log('map::: ', map);

src/views/demo/Categories/Button/index.vue

@@ -0,0 +1,54 @@
+<template>
+   <a-button :size="props.size" :class="`${props.type}`" :type="getType(props.type)" :icon="h(getIcon(props.type))">{{props.text}}</a-button>
+</template>
+
+<script setup lang="ts">
+import {defineProps,h} from "vue"
+import { PlusOutlined,FormOutlined,DeleteOutlined,SearchOutlined } from '@ant-design/icons-vue';
+const props = defineProps(['text','type','size'])
+const getIcon = (icon:string) => {
+  switch (icon) {
+    case 'add':
+      return PlusOutlined
+    case 'edit':
+      return FormOutlined
+    case 'del':
+      return DeleteOutlined
+    case 'search':
+      return SearchOutlined
+    default:
+      return null
+  }
+}
+const getType = (type:string) => {
+  switch (type) {
+    case 'search':
+      return 'default'
+    default:
+      return 'primary'
+  }
+}
+</script>
+<style lang="scss" scoped>
+.add{
+  background-color: #409167;
+}
+.add:hover{
+  background-color: #66a785;
+}
+.edit{
+  background-color: #0076c8
+}
+.edit:hover{
+  background-color: #3391d3;
+}
+.del{
+  background-color: #d63737
+}
+.del:hover{
+  background-color: #de5f5f;
+}
+.position{
+  margin-left:10px
+}
+</style>

src/views/demo/Categories/Modal/index.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="categories-modal-container">
+    <a-form
+      ref="formRef"
+      :model="props.modalData.data"
+      :rules="props.modalData.type.indexOf('left') > -1? rules: rightRules"
+      labelAlign="right"
+      :label-col="{ span: 5 }"
+    >
+      <template v-if="props.modalData.type.indexOf('left') > -1">
+        <a-form-item label="分类ID" name="itemCode">
+          <a-input v-model:value="props.modalData.data.itemCode" />
+        </a-form-item>
+        <a-form-item label="分类名称" name="itemName">
+          <a-input v-model:value="props.modalData.data.itemName" />
+        </a-form-item>
+      </template>
+      <template v-else>
+        <a-form-item label="ID" name="id">
+          <a-input v-model:value="props.modalData.data.id" disabled  placeholder="系统自动处理"/>
+        </a-form-item>
+        <a-form-item label="分类标识" name="isDefault">
+          <a-input v-model:value="props.modalData.data.isDefault" type="number"/>
+        </a-form-item>
+        <a-form-item label="名称" name="itemName">
+          <a-input v-model:value="props.modalData.data.itemName" />
+        </a-form-item>
+        <a-form-item label="值" name="itemValue">
+          <a-input v-model:value="props.modalData.data.itemValue" />
+        </a-form-item>
+        <a-form-item label="是否可用" name="enabledMark">
+          <a-select v-model:value="props.modalData.data.enabledMark">
+            <a-select-option value="0">停用</a-select-option>
+            <a-select-option value="1">正常</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item label="排序号" name="sortCode">
+          <a-input-number v-model:value="props.modalData.data.sortCode" addon-before="-" addon-after="+" :min="1" :max="10"></a-input-number>
+        </a-form-item>
+        <a-form-item label="描述" name="description">
+          <a-input v-model:value="props.modalData.data.description" />
+        </a-form-item>
+        <a-form-item label="所属分类ID" name="itemCode">
+          <a-select v-model:value="props.modalData.data.itemCode">
+            <a-select-option v-for="item in props.lTree" :value="item.key">{{ item.title }}</a-select-option>
+          </a-select>
+        </a-form-item>
+      </template>
+    </a-form>
+    <div class="modal-footer">
+      <a-button style="margin-right: 10px;" @click="closeModal">取消</a-button>
+      <a-button type="primary" @click="submit">确定</a-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {defineProps, defineEmits,ref} from "vue"
+const props = defineProps(['modalData','modalForm','lTree'])
+const emit = defineEmits(['closeModal','submit'])
+const formRef = ref()
+const rules = {
+  itemCode: [
+    { required: true, message: '分类ID不能为空', trigger: 'blur' },
+  ],
+  itemName: [
+    { required: true, message: '分类名称不能为空', trigger: 'blur' },
+  ],
+}
+const rightRules = {
+  itemName: [
+    { required: true, message: '分类名称不能为空', trigger: 'blur' },
+  ],
+  itemCode: [
+    { required: true, message: '所属分类不能为空', trigger: 'blur' },
+  ],
+}
+const submit = () => {
+  formRef.value.validate().then(() => {
+    emit('submit')
+  }).catch(error => {
+    console.log('error', error)
+  })
+}
+const closeModal = () => {
+  emit('closeModal')
+  formRef.value.resetFields()
+}
+const clearModalData = () => {
+  formRef.value.resetFields()
+}
+defineExpose({
+  clearModalData
+})
+</script>
+<style lang="scss" scoped>
+.categories-modal-container{
+  padding: 10px 25px;
+  .modal-footer{
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 20px;
+  }
+}
+</style>

src/views/demo/Categories/index.vue

@@ -0,0 +1,285 @@
+<template>
+  <div class="page-div categories-page">
+    <div class="left-div">
+      <div class="header">
+        <div class="buttons-div">
+          <HeaderButton :text="'删除分类'" :type="'del'" :size="'small'" @click="buttonClick('left','del')"/>
+          <HeaderButton :text="'添加分类'" :type="'add'" :size="'small'" @click="buttonClick('left','add')"/>
+        </div>
+        <div class="search-div">
+          <a-input v-model:value="LValue" placeholder="请输入内容" size="small"/>
+          <HeaderButton :text="'搜索'" :type="'search'" :size="'small'" @click="searchData('left')"/>
+        </div>
+        
+      </div>
+      <div class="content">
+        <div class="show-all-button">
+          <a-button type="link" @click="changeTypeId('')">全部字典>></a-button>
+        </div>
+        <BasicTree :treeData="lTree" :loading="lLoading" @select="(selectedKeys,{node}) => {getLeftSelectId(node.id);changeTypeId(node.key)}"/>
+      </div>
+    </div>
+    <div class="right-div">
+      <div class="header">
+        <div class="buttons-div">
+          <a-input style="width:150px" v-model:value="RValue" placeholder="名称" size="small"/>
+          <HeaderButton :text="'搜索'" :type="'search'" :size="'small'" @click="searchData('right')"/>
+          <HeaderButton :text="'添加'" :type="'add'" :size="'small'" @click="buttonClick('right','add')"/>
+          <HeaderButton :text="'编辑'" :type="'edit'" :size="'small'" @click="buttonClick('right','edit')"/>
+          <HeaderButton :text="'删除'" :type="'del'" :size="'small'" @click="buttonClick('right','del')"/>
+        </div>
+      </div>
+      <div class="content">
+        <BasicTable @register="registerTable">
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'enabledMark'">
+              <a-tag  v-if="record.enabledMark" color="success">正常</a-tag>
+              <a-tag v-else color="error">停用</a-tag>
+            </template>
+          </template>
+        </BasicTable>
+      </div>
+    </div>
+    <a-modal class="categories-modal" v-model:open="openModal" 
+      :title="modalData.title" :afterClose="clearModal">
+      <UseModal ref="modalForm" :modalData="modalData" @closeModal="closeModal" @submit="submit" :lTree="lTree"/>
+    </a-modal>
+  </div>
+</template>
+
+<script setup lang="ts">
+import HeaderButton from './Button/index.vue'
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+import UseModal from './Modal/index.vue'
+import { BasicTree } from '@/components/Tree';
+import {BasicTable,useTable} from '@/components/Table'
+import {ref,onMounted,reactive,watch,createVNode } from "vue"
+import {getLeftTree,getRightTable,addLeftItem,addRightItem,delLeftItem,editRightItem,delRightItem} from '@/api/sys/categories.ts'
+import {columns,emptyRightItem,emptyLeftItem,dataProcess} from './util.ts'
+import {Modal,message} from 'ant-design-vue'
+const modalForm = ref()
+let LValue = ref('')
+let RValue = ref('')
+let lLoading = ref(false)
+let typeId = ref('')
+let selectLeftId = ref('')
+let lTree = ref([])
+let openModal = ref(false)
+const modalData = reactive({
+  title:'',
+  data:{},
+  type:'',
+})
+const [registerTable,{reload,getSelectRows}] = useTable({
+  beforeFetch: (params) => {
+    return {...params, code:typeId.value, key:RValue.value}
+  },
+  api:getRightTable,
+  columns,
+  showIndexColumn: false,
+  rowSelection: {
+    type: 'checkbox',
+  },
+})
+const getLeftTreeData = (value='') => {
+  lLoading.value = true
+  getLeftTree({key:value}).then(res => {
+    let data = dataProcess(res)
+    lTree.value = data
+    lLoading.value = false
+  }).catch(err => {
+    console.log(err)
+    lLoading.value = false
+  })
+}
+onMounted(() => {
+  getLeftTreeData()
+})
+const changeTypeId = (value) => {
+  typeId.value = value
+  reload()
+}
+const getLeftSelectId = (value) => {
+  selectLeftId.value = value
+}
+const searchData = (type) => {
+  if (type === 'left') {
+    console.log(LValue.value)
+    getLeftTreeData(LValue.value)
+  }else{
+    reload()
+  }
+}
+const submit = () => {
+  switch(modalData.type){
+    case 'leftadd':
+      addLeftItem(modalData.data).then(res => {
+        getLeftTreeData()
+        openModal.value = false
+      }).catch(err => {
+        console.log(err)
+      })
+      break;
+    case 'rightadd':
+      addRightItem(modalData.data).then(res => {
+        reload()
+        openModal.value = false
+      }).catch(err => {
+        console.log(err)
+      })
+      break;
+    case 'rightedit':
+      editRightItem(modalData.data).then(res => {
+        reload()
+        openModal.value = false
+      }).catch(err => {
+        console.log(err)
+      })
+      break;
+    default:
+      break;
+  }
+}
+const buttonClick = (diff,type) => {
+  let isLeft = diff === 'left'
+  switch(type){
+    case 'add':
+      openModal.value = true
+      modalData.title = isLeft? '添加分组': '添加'
+      modalData.data = isLeft? emptyLeftItem: emptyRightItem
+      modalData.type = `${diff}${type}`
+      break;
+    case 'del':
+        Modal.confirm({
+          title:'是否确认删除?',
+          icon: createVNode(ExclamationCircleOutlined),
+          onCancel() {},
+          onOk() {
+            if(isLeft){
+              return delLeftItem({id:selectLeftId.value}).then(res => {
+                getLeftTreeData()
+                typeId.value = ''
+                reload()
+              }).catch(err => {
+                console.log(err)
+              })
+            }else{
+              console.log(getSelectRows())
+              if(getSelectRows().length !== 1){
+                message.warning('请选择一条数据')
+                return
+              } 
+              let selectRightId = getSelectRows()[0].itemDetailId
+              console.log(selectRightId)
+              return delRightItem({id:selectRightId}).then(res => {
+                reload()
+              }).catch(err => {
+                console.log(err)
+              })
+            }
+          }
+        })
+      break;
+    case 'edit':
+      if(getSelectRows().length !== 1){
+        message.warning('请选择一条数据')
+        return 
+      } 
+      let editData = getSelectRows()[0]
+      console.log(editData)
+      modalData.title = '编辑'
+      modalData.data = {...editData}
+      modalData.type = `${diff}${type}`
+      openModal.value = true
+      break;
+  }
+}
+const closeModal = () => {
+  openModal.value = false
+}
+const clearModal = () => {
+  modalForm.value.clearModalData()
+}
+</script>
+
+<style lang="scss" scoped>
+.page-div{
+  position: relative;
+  top:10px;
+  left:10px;
+  width:calc(100% - 20px);
+  height:calc(100% - 20px);
+  display:flex;
+  border: 1px solid #ccc;
+  .left-div{
+    width:230px;
+    border-right: 1px solid #ccc;
+    display: flex;
+    flex-direction: column;
+    .header{
+      display: flex;
+      flex-direction: column;
+      padding:10px;
+      .buttons-div{
+        display: flex;
+        justify-content: space-between;
+      }
+      .search-div{
+        margin-top:10px;
+        display: flex;
+      } 
+    }
+    .content{
+      background-color: #fff;
+      border-radius: 5px;
+      height:100%;
+      .show-all-button{
+        height:34px;
+        line-height: 34px;
+        padding-left: 20px;
+        border-bottom: 1px solid #ccc;
+      }
+    }
+    
+  }
+  .right-div{
+    width: calc(100% - 230px);
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    .header{
+      height: 42px;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      padding-right: 10px;
+      .buttons-div > button{
+        margin-left: 10px;
+      }
+    }
+    .content{
+      flex: 1;
+      background-color: #fff;
+    }
+  }
+}
+</style>
+<style lang="scss">
+.categories-page{
+  .left-div{
+    .h-full{
+      height:auto;
+    }
+  }
+}
+.categories-modal{
+  .ant-modal-footer > button{
+    display: none;
+  }
+  .ant-modal-footer{
+    margin-top:0px;
+    border-top: 0px;
+  }
+}
+// ant-table-header
+</style>

src/views/demo/Categories/util.ts

@@ -0,0 +1,92 @@
+export const columns = [
+  {
+    title: '名称',
+    dataIndex: 'itemName',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '代码',
+    dataIndex: 'isDefault',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '值',
+    dataIndex: 'itemValue',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '是否可用',
+    dataIndex: 'enabledMark',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '排序号',
+    dataIndex: 'sortCode',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '描述',
+    dataIndex: 'description',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '分类标识',
+    dataIndex: 'itemCode',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createDate',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '创建人',
+    dataIndex: 'createUserName',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '最后更新时间',
+    dataIndex: 'modifyDate',
+    resizable:true,
+    width:100,
+  },
+  {
+    title: '最后更新人',
+    dataIndex: 'modifyUserName',
+    resizable:true,
+    width:100,
+  },
+]
+export const emptyLeftItem = {
+  itemCode:"",
+  itemName:"",
+}
+export const emptyRightItem = {
+  id:"",
+  itemCode:"",
+  itemName:"",
+  itemValue:"",
+  enabledMark:"1",
+  sortCode:"",
+  description:"",
+  typeId:"",
+}
+export const dataProcess = (list) => {
+  return list.map((item) => {
+      return {
+        id: item.itemId,
+        title:item.itemName,
+        icon: 'home|svg',
+        key: item.itemCode,
+      }
+  })
+}

src/views/demo/caseauditing/module/HandleCase.vue

@@ -0,0 +1,552 @@
+<template>
+  <div>
+    <a-form :model="caseHandlingData" name="basic" :label-col="{ span: 6 }" disabled>
+      <a-form-item>
+        <a-divider orientation="left">【案件核查信息】</a-divider>
+      </a-form-item>
+      <a-form-item label="核查人：">
+        <a-input v-model:value="caseHandlingData.createusername" />
+      </a-form-item>
+      <a-form-item label="核查时间：">
+        <a-input v-model:value="caseHandlingData.createtime" />
+      </a-form-item>
+      <a-form-item label="是否违法：">
+        <a-radio-group v-model:value="illegal">
+          <a-radio value="0">合法</a-radio>
+          <a-radio value="1">违法</a-radio>
+          <a-radio value="2">伪变化</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="现场照片：">
+        <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="现场视频：">
+        <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-select
+          v-model:value="caseHandlingData.measure_name"
+          placeholder="请选择处理措施"
+          :options="dealMeasuresList"
+        />
+      </a-form-item>
+
+      <a-col :span="24" v-if="illegal == '0'">
+        <a-form-item label="项目名称: ">
+          <a-input v-model:value="caseHandlingData.result_name" />
+        </a-form-item>
+        <a-form-item label="建设情况: ">
+          <a-input v-model:value="caseHandlingData.actual_scene_case" />
+        </a-form-item>
+        <a-form-item label="建筑结构: ">
+          <a-input v-model:value="caseHandlingData.build_structure" />
+        </a-form-item>
+        <a-form-item label="实际用途: ">
+          <a-input v-model:value="caseHandlingData.actual_use_to" />
+        </a-form-item>
+        <a-form-item label="当事人: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact" />
+        </a-form-item>
+        <a-form-item label="当事人电话: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact_phone" />
+        </a-form-item>
+
+        <a-divider orientation="left">【案件办理信息-合法】</a-divider>
+        <a-form-item label="批准文件名称: ">
+          <a-input v-model:value="caseHandlingData.evidence_file_name" />
+        </a-form-item>
+        <a-form-item label="批准文件编号: ">
+          <a-input v-model:value="caseHandlingData.evidence_file_number" />
+        </a-form-item>
+        <a-form-item label="批准文件有效期: ">
+          <a-input v-model:value="caseHandlingData.evidence_file_indate" />
+        </a-form-item>
+
+        <a-form-item label="合法批准文件: " v-if="illegal == '0'">
+          <div
+            v-for="(item, num) in evidenceFileList"
+            :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-empty v-if="evidenceFileList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+
+        <a-form-item label="勘测定界图: " v-if="illegal == '0'">
+          <div
+            v-for="(item, num) in boundaryImageList"
+            :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-empty v-if="boundaryImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+
+        <a-form-item label="是否超范围: ">
+          <a-radio-group v-model:value="caseHandlingData.is_out_boundary">
+            <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 :value="1">是</a-radio>
+            <a-radio :value="0">否</a-radio>
+          </a-radio-group>
+        </a-form-item>
+
+        <a-form-item label="办理人: ">
+          <a-input v-model:value="caseHandlingData.transactor_name" />
+        </a-form-item>
+        <a-form-item label="办理时间: ">
+          <a-input v-model:value="caseHandlingData.transact_time" />
+        </a-form-item>
+      </a-col>
+
+      <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>
+        <a-form-item label="当事人: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact" />
+        </a-form-item>
+        <a-form-item label="当事人电话: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact_phone" />
+        </a-form-item>
+        <a-form-item label="建设情况: ">
+          <a-radio-group v-model:value="caseHandlingData.is_build_complete">
+            <a-radio :value="1">已建成</a-radio>
+            <a-radio :value="0">建设中</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item label="建筑结构: ">
+          <a-input v-model:value="caseHandlingData.build_structure" />
+        </a-form-item>
+        <a-divider orientation="left">【案件办理信息-拆除】</a-divider>
+        <a-form-item label="拆除后照片: ">
+          <div
+            v-for="(item, num) in afterImageList"
+            :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-empty v-if="afterImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+        <a-form-item label="办理人: ">
+          <a-input v-model:value="caseHandlingData.transactor_name" />
+        </a-form-item>
+        <a-form-item label="办理时间: ">
+          <a-input v-model:value="caseHandlingData.transact_time" />
+        </a-form-item>
+      </a-col>
+
+      <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>
+        <a-form-item label="当事人: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact" />
+        </a-form-item>
+        <a-form-item label="当事人电话: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact_phone" />
+        </a-form-item>
+        <a-form-item label="建筑结构: ">
+          <a-input v-model:value="caseHandlingData.build_structure" />
+        </a-form-item>
+        <a-form-item label="违法类型: ">
+          <a-radio-group v-model:value="caseHandlingData.illegal_type">
+            <a-radio value="违法建筑类">违法建筑类</a-radio>
+            <a-radio value="非法采矿类">非法采矿类</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-divider orientation="left">【案件办理信息-查处】</a-divider>
+
+        <a-form-item label="立案号: ">
+          <a-input v-model:value="caseHandlingData.registr_number" />
+        </a-form-item>
+        <a-form-item label="当事人姓名: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact" />
+        </a-form-item>
+        <a-form-item label="身份证号码: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact_idcard" />
+        </a-form-item>
+
+        <a-form-item label="处罚通知书: ">
+          <div
+            v-for="(item, num) in punishImageList"
+            :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-empty v-if="punishImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+        <a-form-item label="交款通知书: ">
+          <div
+            v-for="(item, num) in paymentImagesList"
+            :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-empty v-if="paymentImagesList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+
+        <a-form-item label="办理人: ">
+          <a-input v-model:value="caseHandlingData.transactor_name" />
+        </a-form-item>
+        <a-form-item label="办理时间: ">
+          <a-input v-model:value="caseHandlingData.transact_time" />
+        </a-form-item>
+      </a-col>
+
+      <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>
+        <a-form-item label="当事人: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact" />
+        </a-form-item>
+        <a-form-item label="当事人电话: ">
+          <a-input v-model:value="caseHandlingData.illegal_contact_phone" />
+        </a-form-item>
+        <a-form-item label="拟完善手续名称: ">
+          <a-input v-model:value="caseHandlingData.result_name" />
+        </a-form-item>
+        <a-form-item label="完善手续条件: ">
+          <a-radio-group v-model:value="caseHandlingData.is_have_checkout_condition">
+            <a-radio :value="1">是</a-radio>
+            <a-radio :value="0">否</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-divider orientation="left">【案件办理信息-完善手续】</a-divider>
+
+        <a-form-item label="政府同意完善手续证明: ">
+          <div
+            v-for="(item, num) in agreeImageList"
+            :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-empty v-if="agreeImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+        <a-form-item label="办理手续照片: ">
+          <div
+            v-for="(item, num) in checkoutImageList"
+            :key="num"
+            style="
+              position: relative;
+              width: 125px;
+              height: 112px;
+              overflow: hidden;
+              float: left;
+              background: #f9f9f9;
+              margin-left: 6px;
+              margin-bottom: 6px;
+            "
+          >
+            <a-image :width="124" :src="item.s_filePath" />
+          </div>
+          <a-empty v-if="checkoutImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+        <a-form-item label="勘测定界图: ">
+          <div
+            v-for="(item, num) in boundaryImageList"
+            :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-empty v-if="boundaryImageList.length <= 0">
+            <template #description>
+              <span>暂无图片</span>
+            </template>
+          </a-empty>
+        </a-form-item>
+        <a-form-item label="手续有效期: ">
+          <a-input v-model:value="caseHandlingData.procedure_indate" />
+        </a-form-item>
+        <a-form-item label="办理人: ">
+          <a-input v-model:value="caseHandlingData.transactor_name" />
+        </a-form-item>
+        <a-form-item label="办理时间: ">
+          <a-input v-model:value="caseHandlingData.transact_time" />
+        </a-form-item>
+      </a-col>
+
+      <a-col :span="24" v-if="illegal == '2'">
+        <a-form-item label="伪变化原因: ">
+          <a-input v-model:value="caseHandlingData.pseudo_change_reason" />
+        </a-form-item>
+        <a-form-item label="实际用途: ">
+          <a-input v-model:value="caseHandlingData.actual_use_to" />
+        </a-form-item>
+        <a-form-item label="实际面积: ">
+          <a-input v-model:value="caseHandlingData.actual_area" />
+        </a-form-item>
+        <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 :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 :value="1">是</a-radio>
+            <a-radio :value="0">否</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item label="办理人: ">
+          <a-input v-model:value="caseHandlingData.transactor_name" />
+        </a-form-item>
+        <a-form-item label="办理时间: ">
+          <a-input v-model:value="caseHandlingData.transact_time" />
+        </a-form-item>
+      </a-col>
+    </a-form>
+  </div>
+</template>
+<script lang="ts" setup>
+  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: '',
+    result_name: '',
+    is_assist: 0,
+    assist_people: '',
+    assist_company: '',
+    illegal_contact: null, //违法人
+    illegal_contact_phone: null, //违法人联系方式
+    actual_scene_case: null, //现场实际情况
+  });
+  const illegal: any = ref();
+  const dealMeasuresList: any = ref([]);
+  const evidenceFileList: any = ref([]);
+  const boundaryImageList: any = ref([]);
+  const afterImageList: any = ref([]);
+  const punishImageList: any = ref([]);
+  const paymentImagesList: any = ref([]);
+  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>

src/views/demo/caseauditing/module/index.data.ts

@@ -0,0 +1,120 @@
+import { BasicColumn, FormSchema } from '@/components/Table';
+
+export const columns: BasicColumn[] = [
+  {
+    title: '案件编号',
+    dataIndex: 'case_no',
+  },
+  {
+    title: '案件详情',
+    dataIndex: 'case_description',
+  },
+  {
+    title: '办理人',
+    dataIndex: 'deal_username',
+  },
+  {
+    title: '办理时间',
+    dataIndex: 'deal_time',
+  },
+  {
+    title: '新增退回',
+    dataIndex: 'is_drawback',
+    customRender: ({ record }) => {
+      const status = record.is_drawback;
+      const enable = ~~status === 1;
+      const text = enable ? '退回案件' : '新增案件';
+      return text;
+    },
+  },
+  {
+    title: '是否违法',
+    dataIndex: 'is_illegal',
+    customRender: ({ record }) => {
+      const status = record.is_illegal;
+      if (status == 1) {
+        const text = '违法';
+        return text;
+      } else if (status == 2) {
+        const text = '伪变化';
+        return text;
+      } else {
+        const text = '合法';
+        return text;
+      }
+    },
+  },
+];
+
+export const formSchema: FormSchema[] = [
+  {
+    field: 'case_no',
+    label: '案件编号：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'typename',
+    label: '案件类型：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'case_description',
+    label: '案件描述：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'homeAddress',
+    label: '案件地址：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'area',
+    label: '占用土地面积：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'handle_status_name',
+    label: '案件状态：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'verifystatusname',
+    label: '审核状态：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'lngLat',
+    label: '经纬度：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'field1',
+    label: '现场照片：',
+    slot: 'imgSlot',
+  },
+  {
+    field: 'field1',
+    label: '现场视频：',
+    slot: 'videoSlot',
+  },
+  {
+    field: 'identification_user',
+    label: '上报人：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+  {
+    field: 'identification_time',
+    label: '上报时间：',
+    component: 'Input',
+    dynamicDisabled: true,
+  },
+];

src/views/demo/caseauditing/module/index.vue

@@ -0,0 +1,592 @@
+<template>
+  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
+    <div :class="`${prefixCls}`">
+      <div :class="`${prefixCls}-header`">
+        <div>
+          <a-button type="primary" :icon="h(StarOutlined)" @click="openCollenction">
+            收藏夹（ {{ favoriteNum }} ）
+          </a-button>
+        </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="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="!collenctionVisible">
+              <template #bodyCell="{ column, record }">
+                <template v-if="column.key === 'action'">
+                  <TableAction
+                    :actions="[
+                      {
+                        label: '收藏',
+                        color: 'warning',
+                        onClick: () => {
+                          handleCollention(record);
+                        },
+                      },
+                      {
+                        label: '审核',
+                        onClick: () => {
+                          handleAuditing(record);
+                        },
+                      },
+                    ]"
+                  />
+                </template>
+              </template>
+            </BasicTable>
+            <div :class="`${prefixCls}-content-tabbox-left-collenction`" v-if="collenctionVisible">
+              <div :class="`${prefixCls}-content-tabbox-left-collenction-header`">
+                <div> <StarOutlined /> 收藏案件 </div>
+                <div
+                  :class="`${prefixCls}-content-tabbox-left-collenction-header-close`"
+                  @click="closeCollenction"
+                  ><CloseOutlined
+                /></div>
+              </div>
+              <div>
+                <BasicTable @register="registerCollenctionTable">
+                  <template #bodyCell="{ column, record }">
+                    <template v-if="column.key === 'action'">
+                      <TableAction
+                        :actions="[
+                          {
+                            label: '移除',
+                            type: 'link',
+                            color: 'warning',
+                            onClick: () => {
+                              handleRemoveCollention(record);
+                            },
+                          },
+                          {
+                            label: '审核',
+                            onClick: () => {
+                              handleAuditing(record);
+                            },
+                          },
+                        ]"
+                      />
+                    </template>
+                  </template>
+                </BasicTable>
+              </div>
+            </div>
+          </div>
+          <div :class="`${prefixCls}-content-tabbox-right`" v-if="auditingVisible">
+            <div :class="`${prefixCls}-content-tabbox-right-header`">
+              <div
+                :class="`${prefixCls}-content-tabbox-right-header-tabs`"
+                v-for="(item, index) in tabsArr"
+                :key="index"
+              >
+                <div
+                  :class="tabsActiveIndex == index ? 'active' : 'tabsnormal'"
+                  @click="tabsClick(index)"
+                  >{{ item }}</div
+                >
+              </div>
+              <div :class="`${prefixCls}-content-tabbox-right-header-close`" @click="auditingClose"
+                ><CloseOutlined
+              /></div>
+            </div>
+            <div :class="`${prefixCls}-content-tabbox-right-content`">
+              <BasicForm ref="formRef" @register="registerForm" v-show="tabsActiveIndex == 0">
+                <template #imgSlot>
+                  <div
+                    v-for="(item, num) in fileList"
+                    :key="num"
+                    style="
+                      position: relative;
+                      width: 125px;
+                      height: 90px;
+                      overflow: hidden;
+                      float: left;
+                      background: #f9f9f9;
+                      margin-left: 6px;
+                      margin-bottom: 6px;
+                    "
+                  >
+                    <a-image :width="125" :src="item.url" />
+                  </div>
+                  <a-empty v-show="fileList.length <= 0">
+                    <template #description>
+                      <span>暂无图片</span>
+                    </template>
+                  </a-empty>
+                </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 :id="selectRowDetail.id" v-show="tabsActiveIndex == 1" />
+            </div>
+            <div :class="`${prefixCls}-content-tabbox-right-footer`">
+              <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`">
+          <MapDetail :ruleForm="selectRowDetail"></MapDetail>
+        </div>
+      </div>
+    </div>
+  </PageWrapper>
+</template>
+<script lang="ts" setup>
+  import { onMounted, ref, h } from 'vue';
+  import {
+    SearchOutlined,
+    StarOutlined,
+    DownloadOutlined,
+    CloseOutlined,
+  } from '@ant-design/icons-vue';
+  import HandleCase from './HandleCase.vue';
+  import { BasicTable, useTable, TableAction } from '@/components/Table';
+  import { BasicForm, useForm } from '@/components/Form';
+  import { PageWrapper } from '@/components/Page';
+  import {
+    getTableDataList,
+    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 { MapDetail } from '@/views/demo/summaryverification/index';
+
+  const { createMessage } = useMessage();
+  const favoriteNum: any = ref();
+  const tabsActiveIndex: any = ref('0');
+  const tabsArr: any = ref(['案件信息', '核查办理']);
+  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 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 is_drawback: any = ref();
+  const selectOptions3: any = ref([
+    { label: '新增', value: 0 },
+    { label: '退回', value: 1 },
+  ]);
+
+  const fileList: any = ref([]);
+
+  const [registerTable, { reload: reload1 }] = useTable({
+    title: '',
+    api: getTableDataList,
+    columns,
+    rowKey: 'id',
+    formConfig: {
+      labelWidth: 120,
+    },
+    isTreeTable: true,
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+    showIndexColumn: false,
+    actionColumn: {
+      width: 200,
+      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;
+    },
+  });
+  const [registerCollenctionTable, { reload: reload2 }] = useTable({
+    title: '',
+    api: getCollectionCaseList,
+    columns,
+    rowKey: 'id',
+    formConfig: {
+      labelWidth: 120,
+    },
+    isTreeTable: true,
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+    showIndexColumn: false,
+    actionColumn: {
+      width: 200,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    handleSearchInfoFn(info) {
+      return info;
+    },
+  });
+  const [registerForm, { setFieldsValue }] = useForm({
+    labelWidth: 120,
+    labelAlign: 'right',
+    schemas: formSchema,
+    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;
+    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;
+  }
+  function closeCollenction() {
+    collenctionVisible.value = false;
+    reload1();
+  }
+  function tabsClick(index: any) {
+    tabsActiveIndex.value = index;
+  }
+  function auditingClose() {
+    auditingVisible.value = false;
+  }
+  function getCollentionLength() {
+    getCollectionCaseList().then((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>
+<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%;
+
+            &-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;
+              }
+            }
+          }
+        }
+
+        &-right {
+          flex: 1;
+          margin-left: 15px;
+          margin-bottom: 15px;
+          border: 1px solid #eee;
+          background: #fff;
+
+          &-header {
+            position: relative;
+            padding: 0 10px;
+            height: 50px;
+            overflow: auto;
+            border-bottom: 1px solid #eee;
+            display: flex;
+
+            &-tabs {
+              cursor: pointer;
+              margin: 0 10px;
+
+              .active {
+                color: #409eff;
+                height: 100%;
+                display: flex;
+                align-items: center;
+              }
+
+              .tabsnormal {
+                height: 100%;
+                display: flex;
+                align-items: center;
+                &:hover {
+                  color: #409eff;
+                  border-bottom: 1px solid #409eff;
+                }
+              }
+            }
+
+            &-close {
+              position: absolute;
+              right: 20px;
+              top: 50%;
+              transform: translate(0, -50%);
+              cursor: pointer;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+            }
+          }
+
+          &-content {
+            height: calc(100% - 140px);
+            overflow: auto;
+            padding: 15px 20px 15px 10px;
+            margin: 10px 0;
+          }
+
+          &-footer {
+            height: 60px;
+            border-top: 1px solid #eee;
+            display: flex;
+            align-items: center;
+            padding-right: 15px;
+          }
+        }
+      }
+
+      &-mapbox {
+        width: calc(30% - 20px);
+        margin: 0 15px 15px 15px;
+        border: 1px solid red;
+      }
+    }
+  }
+</style>

src/views/demo/h5html/index.data.ts

@@ -3,7 +3,6 @@ import { h } from 'vue';
 import { Tag } from 'ant-design-vue';
 
 export const columns: BasicColumn[] = [
-
   {
     title: '名称',
     dataIndex: 'name',
@@ -26,11 +25,11 @@ export const columns: BasicColumn[] = [
   },
   {
     title: '创建人',
-    dataIndex: 'createUserName'
+    dataIndex: 'createUserName',
   },
   {
     title: '创建时间',
-    dataIndex: 'createDate'
+    dataIndex: 'createDate',
   },
   // {
   //   title: '备注',
@@ -46,4 +45,3 @@ export const searchFormSchema: FormSchema[] = [
     colProps: { span: 8 },
   },
 ];
-  

src/views/demo/leadreporting/InfoComponent/index.vue

@@ -0,0 +1,189 @@
+<template>
+  <div class="leadreport-information-component">
+    <div style="display: flex;height:calc(100% - 62px);">
+      <div style="flex: 1;">
+        <a-divider>【线索详情】</a-divider>
+        <a-descriptions :column="1" bordered>
+          <a-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              举报人
+            </template>
+            <!-- TODO 加密 -->
+            {{detail.name}}
+          </a-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              手机号
+            </template>
+            <!-- TODO 加密 -->
+            {{detail.phone}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              地点
+            </template>
+            {{detail.address}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              举报内容
+            </template>
+            {{detail.content}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              举报时间
+            </template>
+            {{detail.createTime}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              图片
+            </template>
+            <a-image-preview-group>
+              <a-image :width="200" v-for="(item,index) in imageList" :key="index" :src="item" />
+            </a-image-preview-group>
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <TabletOutlined />
+              视频
+            </template>
+            <video-player class="video-player vjs-custom-skin" v-for="(item,index) in videoList"
+              :key="index" ref="videoPlayer" :playsinline="true" :options="item"
+              style="width:400px;margin-top: 10px;">
+            </video-player>
+          </el-descriptions-item>
+        </a-descriptions>
+      </div>
+      <div style="flex: 1;">
+        <a-divider>【地址】</a-divider>
+        <div class="amap-wrapper">
+          <!-- <MapboxMaps :mapOptions="mapOptions" @map-on-load="mapOnLoad"/> -->
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { TabletOutlined } from "@ant-design/icons-vue";
+import MapboxMaps from '@/components/MapboxMaps/index.vue'
+
+
+import {defineProps, onMounted,ref,reactive} from 'vue'
+const props = defineProps(['showInfoId'])
+const BASE_IMAGE_URL = import.meta.env.VITE_BASE_IMAGE_URL
+let detail = ref({})
+const mapOptions = reactive({
+  center: [0,0],
+  zoom: 13,
+})
+let imageList:string[] = reactive([])
+let videoList = reactive([])
+
+const mapOnload = (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).addLineLayer('layerId',{
+    source: 'sourceId',
+    'source-layer': 'lindi'
+  });
+}
+onMounted(() => {
+  console.log(props.showInfoId,detail)
+  loadDetailCaseInfo()
+  console.log(detail)
+})
+const loadDetailCaseInfo = () => {
+  // TODO request /ClueReporting/GetClueReportingDetail?id=   暂时只显示列表
+  let response = {
+    result:{
+      reporting:{
+        id:1,
+        name:"张三",
+        phone:"11111111111",
+        address:"啊手动阀啊手动阀啊手动阀啊手动阀",
+        createTime:"2022-08-09 12:00:00",
+        content:"aaa",
+        lng:116.404,
+        lat:39.915
+      },
+      imageFiles:[
+        "x43I27A55%26/photo-1438109491414-7198515b166b.webp",
+        "cV16ZqzMjW/photo-1473091540282-9b846e7965e3.webp",
+        "LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp",
+      ],
+      videoFiles:[
+        // "1.mp4",
+        // "2.mp4",
+        // "3.mp4"
+      ]
+    }
+  }
+  Promise.resolve(response).then((res) => {
+    let obj = res.result.reporting
+    detail.value = {...obj}
+    mapOptions.center = [obj.lng, obj.lat]
+    if (res.result.imageFiles) {
+      res.result.imageFiles.forEach(element => {
+        imageList.push(
+          // BASE_IMAGE_URL + "/" + element
+          `https://gw.alipayobjects.com/zos/antfincdn/${element}`
+        )
+      });
+    }
+    if (res.result.videoFiles) {
+      res.result.videoFiles.forEach(element => {
+        let options = {
+          playbackRates: [0.5, 1.0, 1.5, 2.0], //可选择的播放速度
+          autoplay: false, //如果true,浏览器准备好时开始回放。
+          muted: false, // 默认情况下将会消除任何音频。
+          loop: false, // 视频一结束就重新开始。
+          preload: 'auto', // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
+          language: 'zh-CN',
+          aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
+          fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
+          sources: [
+            {
+                type: "",
+                src: BASE_IMAGE_URL + "/" + element//url地址
+            }
+          ],
+          poster: "", //你的封面地址
+          // width: document.documentElement.clientWidth,
+          notSupportedMessage: '此视频暂无法播放，请稍后再试', //允许覆盖Video.js无法播放媒体源时显示的默认信息。
+          controlBar: {
+            timeDivider: true,//当前时间和持续时间的分隔符
+            durationDisplay: true,//显示持续时间
+            remainingTimeDisplay: false,//是否显示剩余时间功能
+            fullscreenToggle: true  //全屏按钮
+          }
+        }
+        videoList.push(options)
+      });
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.leadreport-information-component{
+  height: 600px;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.amap-wrapper{
+  width: 100%;
+  height: 100%
+}
+.amap-demo{
+  width: 100%;
+  height: 100%;
+}
+</style>

src/views/demo/leadreporting/index.vue

@@ -0,0 +1,193 @@
+<template>
+  <div class="page-div">
+    <!-- <Header @reload="reload" @setPagination="setPagination" @getSelectRows="getSelectRows"></Header> -->
+    <div class="report-content filter-container" style="display:flex;overflow:auto;height:50px; background-color:#f8f8f8;align-items: center;
+      justify-content: flex-end;padding-right: 20px;">
+      <div style="margin-right:10px;">
+        <a-range-picker :presets="rangePresets" @change="onRangeChange" >
+        </a-range-picker>
+      </div>
+      <div style="margin-right:10px">
+        <a-input v-model:value="content" placeholder="请输入举报内容" />
+      </div>
+      <a-button style="background-color: #0076c8;" type="primary" :icon="h(SearchOutlined)" @click="searchTable">查询</a-button>
+      <a-button style="background-color: #409167; margin-left:10px" type="primary" 
+        :icon="h(VerticalAlignBottomOutlined)" @click="distribute">下发</a-button>
+    </div>
+    <div class="content">
+      <BasicTable rowKey="id" @register="registerTable">
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'isDistribute'">
+            <a-tag  v-if="record.isDistribute" color="success">是</a-tag>
+            <a-tag v-else color="error">否</a-tag>
+          </template>
+          <template v-if="column.key === 'action'">
+            <a-button @click="openInfo(record)">详情</a-button>
+          </template>
+        </template>
+      </BasicTable>
+    </div>
+    <a-modal style="width: 80vw;height:600px" v-model:open="modal" title="案件详情" :mask="true" 
+      :maskClosable="false" :keyboard="false" :afterClose="closeModal">
+      <InfoComponent v-if="modal" :showInfoId="showInfoId"></InfoComponent>
+    </a-modal>
+  </div>
+  
+</template>
+
+<script setup lang="ts">
+// import Header from './header/index.vue'
+// import Table from './Table/index.vue'
+import InfoComponent from './InfoComponent/index.vue'
+import dayjs, {Dayjs} from 'dayjs';
+import {ref, h, } from "vue"
+import { SearchOutlined, VerticalAlignBottomOutlined  } from '@ant-design/icons-vue';
+import {BasicTable, useTable} from '@/components/Table'
+import { getLoadPage } from '@/api/sys/leadreporting';
+import {message,} from 'ant-design-vue'
+type RangeValue = [Dayjs, Dayjs];
+let beginDate = ref()
+let endDate = ref()
+let content = ref()
+let modal = ref(false)
+let showInfoId = ref()
+const rangePresets = ref([
+  { label: '今天', value: [dayjs(), dayjs()] },
+  { label: '最近一周', value: [dayjs().add(-1, 'w'), dayjs()] },
+  { label: '最近一个月', value: [dayjs().add(-1, 'M'), dayjs()] },
+  { label: '最近三个月', value: [dayjs().add(-3, 'M'), dayjs()] },
+  { label: '最近六个月', value: [dayjs().add(-6, 'M'), dayjs()] },
+  { label: '最近一年', value: [dayjs().add(-1, 'y'), dayjs()] },
+]);
+const columns = [
+  {
+    title: '举报人',
+    dataIndex: 'name',
+  },
+  {
+    title: '手机号',
+    dataIndex: 'phone',
+  },
+  {
+    title: '地点',
+    dataIndex: 'address',
+  },
+  {
+    title: '举报内容',
+    dataIndex: 'content',
+  },
+  {
+    title: '举报时间',
+    dataIndex: 'createTime',
+  },
+  {
+    title: '是否下发',
+    dataIndex: 'isDistribute',
+  },
+
+];
+const onRangeChange = (dates: RangeValue, dateStrings: string[]) => {
+  if (dates) {
+    beginDate.value = dateStrings[0]
+    endDate.value = dateStrings[1]
+  } else {
+    beginDate.value = null
+    endDate.value = null
+  }
+}
+const [registerTable,{reload, setPagination,getSelectRows}] = useTable({
+  beforeFetch: (params) => {
+    console.log(params)
+    let useParams = {...params}
+    if(beginDate.value) useParams = {...useParams,beginDate:beginDate.value}
+    if(endDate.value) useParams = {...useParams,endDate:endDate.value}
+    if(content.value) useParams = {...useParams,content:content.value}
+    return useParams
+  },
+  api:getLoadPage,
+  columns,
+  showIndexColumn: false,
+  rowSelection: {
+    type: 'checkbox',
+  },
+  actionColumn:{
+    width: 80,
+    title: '操作',
+    dataIndex: 'action',
+  }
+})
+const distribute = () => {
+  const selectList = getSelectRows()
+  if(selectList.length == 1){
+    if(selectList[0].isDistribute){
+      message.warning('已经下发的不能再次下发')
+      return
+    }
+    let query = {id: selectList[0].id}
+    // TODO request  暂时不下发
+    Promise.resolve("success").then(res => {
+      message.success(res)
+    })
+    reload()
+  }else{
+    message.warning('选中一个进行下发')
+  }
+  console.log(selectList)
+}
+const searchTable = () => {
+  setPagination({current:1,pageSize:10})
+  reload()
+}
+const openInfo = (info) => {
+  modal.value = true
+  showInfoId.value = info.id
+}
+const closeModal = () => {
+  modal.value = false
+  showInfoId.value = null
+}
+</script>
+
+<style lang="scss" scoped>
+.content{
+  width: calc(100% - 20px);
+  margin: auto;
+  height: 823px;
+  background-color: #fff;
+  padding: 10px;
+  overflow: hidden;
+}
+.page-div{
+  background-color: #efefef;
+}
+.amap-wrapper {
+  width: 100%;
+height: 100%;
+
+}
+
+.desc-container {
+  overflow-y: scroll;
+}
+
+/* 滑道样式 */
+.desc-container::-webkit-scrollbar {
+  width: 5px;
+  background: rgba(255, 255, 255, 0.2);
+  border-radius: 6px;
+}
+
+/* 定义滑块的样式 */
+.desc-container::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
+  background-color: rgba(255, 255, 255, 0.3);
+}
+
+/* 定义滑块鼠标移入时的样式 */
+.desc-container::-webkit-scrollbar-thumb:hover {
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3);
+  background-color: rgba(255, 255, 255, 0.4);
+}
+</style>

src/views/demo/monitor/caseview/index.vue

@@ -1,12 +1,7 @@
 <template>
   <div class="case-view">
     <div class="case-view_step">
-      <a-steps
-        v-model:current="current"
-        type="navigation"
-        size="small"
-        :style="stepStyle"
-      >
+      <a-steps v-model:current="current" type="navigation" size="small" :style="stepStyle">
         <a-step
           v-for="(item, index) in flowLog"
           :key="index"
@@ -17,13 +12,13 @@
       </a-steps>
     </div>
     <div class="case-view_content">
-      <div class="file-box w-1/2 xl:w-1/2" v-if="caseHandleInfo">
+      <div :class="props.mapShow ? 'file-box w-1/2 xl:w-1/2' : 'file-all'" v-if="caseHandleInfo">
         <CollapseContainer
           title="【案件下发信息】"
           :canExpan="false"
           v-if="current == 0 || current == 4"
         >
-          <Issue :data="detailData"></Issue>
+          <Issue :data="detailData" :imageList="imageList"></Issue>
         </CollapseContainer>
 
         <CollapseContainer
@@ -138,7 +133,12 @@
           </a-descriptions>
         </CollapseContainer>
       </div>
-      <CollapseContainer title="地图位置" :canExpan="false" class="map-box ml-1 w-1/2 xl:w-1/2">
+      <CollapseContainer
+        v-if="props.mapShow"
+        title="地图位置"
+        :canExpan="false"
+        class="map_box ml-1 w-1/2 xl:w-1/2"
+      >
         <MapDetail :ruleForm="detailData" :isOnce="true"></MapDetail>
       </CollapseContainer>
     </div>
@@ -161,7 +161,9 @@
     Investigate,
     Procedure,
   } from '../index';
-  const BASE_IMAGE_URL = ref('http://192.168.104:9011');
+  // 图片服务器地址
+  import { useGlobSetting } from '@/hooks/setting';
+  const { uploadUrl } = useGlobSetting();
   const current = ref<number>(0);
   const stepStyle = ref({
     marginBottom: '60px',
@@ -172,12 +174,16 @@
   });
   const props = defineProps({
     caseId: String,
+    mapShow: {
+      type: Boolean,
+      default: () => {
+        return true;
+      },
+    },
   });
-  console.log(props);
   watch(
     () => props.caseId,
     (newVal, oldVal) => {
-      console.log(newVal);
       getCaseFlowLogData();
       loadDetailCaseInfo();
       getCaseHandleInfo();
@@ -186,6 +192,8 @@
   const detailData = ref();
   const caseHandleInfo = ref();
   const playerOptions = ref();
+  // 案件图片
+  const imageList = ref<fileListModel>([]);
   //现场照片
   const threadImageList = ref<fileListModel>([]);
   // 整改后、处理后照片
@@ -236,14 +244,16 @@
   }
   //   获取详情
   async function loadDetailCaseInfo() {
+    imageList.value = [];
     const data = await getCaseInfo({ id: props.caseId });
-    console.log(data);
     detailData.value = data;
+    for (let i = 0; i < data.pic_list.length; i++) {
+      imageList.value.push(uploadUrl + '/' + data.pic_list[i]);
+    }
   }
   //   获取处理详情
   async function getCaseHandleInfo() {
     const data = await getDroneCaseDeal({ caseid: props.caseId });
-    console.log(data);
     caseHandleInfo.value = data;
     if (caseHandleInfo.value.is_illegal == 0) {
       caseHandleInfo.value.is_illegal = '合法';
@@ -268,7 +278,7 @@
           sources: [
             {
               type: '',
-              src: BASE_IMAGE_URL + '/' + item, //url地址
+              src: uploadUrl + '/' + item, //url地址
             },
           ],
           poster: '', //你的封面地址
@@ -286,23 +296,17 @@
     }
     // 现场照片
     if (data.pic_info_list.length > 0) {
+      threadImageList.value = []
       data.pic_info_list.forEach((item) => {
-        threadImageList.value.push(item.filePath);
+        threadImageList.value.push(uploadUrl + '/' + item.filePath);
       });
-      for (let i = 0; i < threadImageList.value.length; i++) {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + threadImageList.value[i],
-          s_filePath: BASE_IMAGE_URL + '/S_' + threadImageList.value[i],
-        };
-        threadImageList.value[i] = obj;
-      }
     }
 
     // 处理后照片 整改后照片 恢复后照片
     if (data.after_pic_list.length > 0) {
       threadAfterImageList.value = [];
-      data.after_pic_list.forEach((item: fileList) => {
-        threadAfterImageList.value.push(BASE_IMAGE_URL + '/S_' + item.filePath);
+      data.after_pic_list.forEach((item) => {
+        threadAfterImageList.value.push(uploadUrl + '/' + item.filePath);
       });
     }
 
@@ -323,7 +327,7 @@
           sources: [
             {
               type: '',
-              src: BASE_IMAGE_URL + '/' + item, //url地址
+              src: uploadUrl + '/' + item, //url地址
             },
           ],
           poster: '', //你的封面地址
@@ -343,22 +347,14 @@
     if (data.evidence_file_list.length > 0) {
       evidenceFileList.value = [];
       data.evidence_file_list.forEach((item: fileList) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item.filePath,
-          s_filePath: BASE_IMAGE_URL + '/' + item.filePath,
-        };
-        evidenceFileList.value.push(obj);
+        evidenceFileList.value.push(uploadUrl + '/' + item.filePath);
       });
     }
 
     if (data.boundary_pic_list.length > 0) {
       boundaryImageList.value = [];
       data.boundary_pic_list.forEach((item) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item,
-          s_filePath: BASE_IMAGE_URL + '/' + item,
-        };
-        boundaryImageList.value.push(obj);
+        boundaryImageList.value.push(uploadUrl + '/' + item);
       });
     }
 
@@ -366,11 +362,7 @@
     if (data.punish_pic_list.length > 0) {
       punishImageList.value = [];
       data.punish_pic_list.forEach((item) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item,
-          s_filePath: BASE_IMAGE_URL + '/S_' + item,
-        };
-        punishImageList.value.push(obj);
+        punishImageList.value.push(uploadUrl + '/' + item);
       });
     }
 
@@ -378,11 +370,7 @@
     if (data.payment_pic_list.length > 0) {
       paymentImageList.value = [];
       data.payment_pic_list.forEach((item) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item,
-          s_filePath: BASE_IMAGE_URL + '/S_' + item,
-        };
-        paymentImageList.value.push(obj);
+        paymentImageList.value.push(uploadUrl + '/' + item);
       });
     }
 
@@ -390,11 +378,7 @@
     if (data.agree_checkout_pic_list.length > 0) {
       agreeImageList.value = [];
       data.agree_checkout_pic_list.forEach((item) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item,
-          s_filePath: BASE_IMAGE_URL + '/S_' + item,
-        };
-        agreeImageList.value.push(obj);
+        agreeImageList.value.push(uploadUrl + '/' + item);
       });
     }
 
@@ -402,11 +386,7 @@
     if (data.checkout_pic_list.length > 0) {
       checkoutImageList.value = [];
       data.checkout_pic_list.forEach((item) => {
-        let obj = {
-          filePath: BASE_IMAGE_URL + '/' + item,
-          s_filePath: BASE_IMAGE_URL + '/S_' + item,
-        };
-        checkoutImageList.value.push(obj);
+        checkoutImageList.value.push(uploadUrl + '/' + item);
       });
     }
   }
@@ -430,11 +410,15 @@
       display: flex;
       height: 65vh;
       .file-box {
-        overflow: auto;
+        overflow-y: auto;
+      }
+      .file-all {
+        overflow-y: auto;
+        width: 100%;
       }
     }
   }
-  .map-box {
+  .map_box {
     height: 100%;
   }
 </style>

src/views/demo/monitor/caseview/model.ts

@@ -15,11 +15,11 @@ export interface caseDetailObj {
   remark?: string;
   case_description?: string;
 }
-export interface infoObj{
+export interface infoObj {
   createusername?: string;
-  createtime?:string;
-  verifystatusname?:string;
-  measure_name?:string;
+  createtime?: string;
+  verifystatusname?: string;
+  measure_name?: string;
   result_name?: string;
   contacts_people?: string;
   contacts_phone?: string;
@@ -43,9 +43,20 @@ export interface infoObj{
   evidence_file_indate?: string;
   illegal_contact_idcard?: string;
   registr_number?: string;
-  procedure_indate?:string;
+  procedure_indate?: string;
 }
 export interface caseHandleInfoObj {
-  info:infoObj
+  info: infoObj;
   is_illegal?: string;
-}
+}
+export interface ListItem {
+  title: string;
+  icon: string;
+  color?: string;
+}
+
+export interface TabItem {
+  key: string;
+  name: string;
+  component: string;
+}

src/views/demo/monitor/caseview/src/dismantle.vue

@@ -8,7 +8,7 @@
     </a-descriptions-item>
     <a-descriptions-item label="拟拆除后照片">
       <div>
-        <ImagePreview :imageList="imgList" />
+        <ImagePreview :imageList="threadAfterImageList" />
       </div>
     </a-descriptions-item>
     <a-descriptions-item label="视频">

src/views/demo/monitor/caseview/src/inspect.vue

@@ -170,7 +170,7 @@
 
     <a-descriptions-item label="现场照片">
       <div>
-        <ImagePreview :imageList="imgList" />
+        <ImagePreview :imageList="threadImageList" />
       </div>
     </a-descriptions-item>
     <a-descriptions-item label="现场视频">
@@ -220,7 +220,6 @@
       },
     },
   });
-  console.log(props)
   caseHandleInfo.value = props.data;
   playerOptions.value = props.playerOptions;
   threadImageList.value = props.threadImageList;

src/views/demo/monitor/caseview/src/issue.vue

@@ -41,6 +41,7 @@
   import { reactive, watch, ref } from 'vue';
   import { ImagePreview } from '@/components/Preview';
   import { DetailModel, caseDetailObj } from '../model';
+
   const labelStyle = ref({
     width: '100px',
   });
@@ -52,20 +53,24 @@
         return {};
       },
     },
+    imageList: {
+      type: Object,
+      default: () => {
+        return [];
+      },
+    },
   });
-  if(Object.keys(props.data).length != 0){
+  console.log(props)
+  const imgList = ref([]);
+  if (Object.keys(props.data).length != 0) {
     caseDetail.value = props.data.info;
+    imgList.value = props.imageList;
   }
-  const imgList = ref([
-    'https://picsum.photos/id/66/346/216',
-    'https://picsum.photos/id/67/346/216',
-    'https://picsum.photos/id/68/346/216',
-  ]);
-
   watch(
     () => props.data,
     (newVal, oldVal) => {
       caseDetail.value = newVal.info;
+      imgList.value = props.imageList;
     },
   );
 </script>

src/views/demo/monitor/caseview/src/mapDetail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="w-full">
-    <MapboxMaps :mapOptions="mapOptions" @map-on-load="mapOnLoad" />
+    <MapboxMaps :mapOptions="mapOptions" :control="[]" @map-on-load="mapOnLoad" />
   </div>
 </template>
 <script lang="ts" setup>
@@ -8,6 +8,7 @@
   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: {
@@ -199,7 +200,6 @@
 </script>
 <style scoped lang="less">
   .w-full {
-    width: 100%;
     height: 50vh;
   }
 </style>

src/views/demo/monitor/index.ts

@@ -16,7 +16,9 @@ export { default as Evidence } from './caseview/src/evidence.vue';
 export { default as Investigate } from './caseview/src/investigate.vue';
 // 【案件办理信息-违法-拟完善手续】
 export { default as Procedure } from './caseview/src/procedure.vue';
-
-
-
-
+// 案件判读
+export { default as Interpret } from './interpretation/src/interpret.vue';
+// 案件处理
+export { default as Dispose } from './interpretation/src/dispose.vue';
+// 案件判读地图
+export { default as InterpretMap } from './interpretation/src/interpretMap.vue';

src/views/demo/monitor/interpretation/index.vue

@@ -0,0 +1,251 @@
+<template>
+  <div class="interpretation-box">
+    <InterpretMap :interpretData="interpretData" @setArea="setArea"></InterpretMap>
+    <div :class="prefixCls" v-if="disabledType">
+      <div :class="`${prefixCls}__top`">
+        <a-form ref="formRef" :model="listQuery" labelAlign="left">
+          <a-form-item placeholder="状态">
+            <a-select
+              v-model:value="listQuery.is_intact"
+              placeholder="请选择"
+              :options="data.intactDatas"
+              :field-names="{ label: 'itemName', value: 'itemValue' }"
+            >
+            </a-select>
+          </a-form-item>
+          <a-form-item placeholder="办理状态">
+            <a-select
+              v-model:value="listQuery.handle_status_id"
+              placeholder="请选择"
+              :options="data.handleDealOptions"
+              :field-names="{ label: 'itemName', value: 'itemValue' }"
+            >
+            </a-select>
+          </a-form-item>
+          <a-form-item placeholder="办理状态">
+            <a-tree-select
+              v-model:value="value"
+              :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+              :tree-data="data.OrgList"
+              placeholder="查询地区"
+            />
+          </a-form-item>
+          <a-form-item>
+            <a-input v-model:value="listQuery.key" placeholder="请输入关键字" />
+          </a-form-item>
+          <a-form-item>
+            <a-input v-model:value="listQuery.identification_user" placeholder="判读人姓名" />
+          </a-form-item>
+          <a-form-item class="btn_item">
+            <a-button @click="getList">
+              <template #icon><SearchOutlined /></template>
+            </a-button>
+            <a-button>
+              <template #icon><VerticalAlignBottomOutlined /></template>
+            </a-button>
+          </a-form-item>
+        </a-form>
+        <div class="clear"></div>
+      </div>
+
+      <div :class="`${prefixCls}__content`">
+        <List :pagination="pagination">
+          <template v-for="item in data.dataList" :key="item.id">
+            <List.Item class="list">
+              <List.Item.Meta>
+                <template #avatar>
+                  <a-image
+                    :width="60"
+                    src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
+                  />
+                </template>
+                <template #title>
+                  <span>{{ item.case_description }}</span>
+                </template>
+                <template #description>
+                  <div class="description-box">
+                    <div class="description">
+                      <span>{{ item.streetname }}&nbsp;{{ item.communityname }}</span>
+                      &nbsp;&nbsp;&nbsp;&nbsp;
+                      <span style="float: right">{{ item.createtime }}</span>
+                    </div>
+                    <div class="description">
+                      {{ item.identification_user }}
+                    </div>
+                    <div class="extra">
+                      <a-button type="primary" @click="interpretBnt(item)">操作</a-button>
+                    </div>
+                  </div>
+                </template>
+              </List.Item.Meta>
+            </List.Item>
+          </template>
+        </List>
+      </div>
+    </div>
+    <div class="case_info" v-else>
+      <CollapseContainer title="案件信息" :canExpan="false">
+        <template #action>
+          <div class="case_close" @click="changeType">
+            <CloseOutlined />
+          </div>
+        </template>
+        <a-tabs v-model:activeKey="activeKey">
+          <a-tab-pane key="1" tab="案件判读">
+            <Interpret :interpretData="interpretData" @close="changeType"></Interpret>
+          </a-tab-pane>
+          <a-tab-pane key="2" tab="案件处理">
+            <Dispose :id="interpretData.id"></Dispose>
+          </a-tab-pane>
+        </a-tabs>
+      </CollapseContainer>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+  import { ref, reactive, onMounted } from 'vue';
+  import { Progress, Row, Col, List, Tag, Tabs } from 'ant-design-vue';
+  import Icon from '@/components/Icon/Icon.vue';
+  import { CollapseContainer } from '@/components/Container';
+  import { SearchOutlined } from '@ant-design/icons-vue';
+  import { VerticalAlignBottomOutlined, CloseOutlined } from '@ant-design/icons-vue';
+  import { BasicForm } from '@/components/Form';
+  import MapboxMaps from '@/components/MapboxMaps/index.vue';
+  import { getCaseInfoList } from '@/api/monitor/index';
+  import { Interpret, Dispose, InterpretMap } from '../index';
+  const disabledType = ref(true);
+  const prefixCls = 'list-basic';
+  const activeKey = ref('1');
+  const interpretData = ref({});
+  const pagination = ref({
+    onChange: (page: number) => {
+      console.log(page);
+      listQuery.value.page = page;
+      getList();
+    },
+    pageSize: 5,
+    total: 0,
+  });
+  const listQuery = ref({
+    page: 1,
+    limit: 5,
+    is_intact: 0,
+  });
+  const data = reactive({
+    OrgList: [],
+    handleDealOptions: [],
+    intactDatas: [],
+    dataList: [],
+  });
+
+  const mapOptions = {
+    center: [117.84714891969796, 35.22152309532066],
+    zoom: 10,
+  };
+  const detailMap = ref();
+  const mapBox = ref();
+  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;
+  };
+  async function getList() {
+    const obj = await getCaseInfoList(listQuery.value);
+    console.log(obj);
+    data.dataList = obj.items;
+    pagination.value.total = obj.total;
+  }
+  function changeType() {
+    disabledType.value = true;
+  }
+  function interpretBnt(item) {
+    disabledType.value = false;
+    console.log(item);
+    interpretData.value = item;
+  }
+  function setArea(area) {
+    interpretData.value.area = area;
+  }
+  onMounted(() => {
+    getList();
+  });
+</script>
+<style scoped lang="less">
+  .w-full {
+    width: 100%;
+    position: relative;
+    height: 90vh;
+  }
+  .case_info {
+    position: absolute;
+    top: 12px;
+    left: 25px;
+    width: 40%;
+    height: 87vh;
+    .vben-collapse-container {
+      height: 100%;
+    }
+    .case_close {
+      cursor: pointer;
+    }
+  }
+  .list-basic {
+    position: absolute;
+    top: 12px;
+    left: 25px;
+    width: 30%;
+    height: 90vh;
+    &__top {
+      padding: 10px;
+      background-color: @component-background;
+      text-align: center;
+      height: 10vh;
+      .clear {
+        clear: both;
+      }
+    }
+
+    &__content {
+      height: 76vh;
+      overflow: auto;
+      margin-top: 12px;
+      padding: 10px 0;
+      background-color: @component-background;
+
+      .list {
+        position: relative;
+      }
+
+      .icon {
+        font-size: 40px !important;
+      }
+
+      .extra {
+        display: flex;
+        justify-content: flex-end;
+      }
+      .description-box {
+        display: flex;
+        flex-direction: column;
+      }
+    }
+  }
+  ::v-deep .ant-form {
+    .ant-form-item {
+      float: left;
+      margin-bottom: 4px;
+      margin-left: 4px;
+      width: 30%;
+      button {
+        margin-right: 10px;
+      }
+    }
+  }
+</style>

src/views/demo/monitor/interpretation/src/dispose.vue

@@ -0,0 +1,382 @@
+<template>
+  <div>
+    <CollapseContainer title="【案件核查信息】" :canExpan="false">
+      <a-descriptions bordered :column="1" size="small" :labelStyle="labelStyle">
+        <a-descriptions-item label="核查人">{{
+          caseHandlingData.createusername
+        }}</a-descriptions-item>
+        <a-descriptions-item label="核查时间">
+          {{ caseHandlingData.createtime }}
+        </a-descriptions-item>
+        <a-descriptions-item label="是否违法">
+          <span v-if="illegal == 0">合法</span>
+          <span v-else-if="illegal == 1">违法</span>
+          <span v-else-if="illegal == 2">伪变化</span>
+        </a-descriptions-item>
+        <a-descriptions-item label="现场照片">
+          <div>
+            <ImagePreview :imageList="imageList" />
+          </div>
+        </a-descriptions-item>
+        <a-descriptions-item label="现场视频">
+          <div v-if="playerOptions.length > 0">
+            <video-player
+              class="video-player vjs-custom-skin"
+              v-for="(item, index) in playerOptions"
+              :key="index"
+              ref="videoPlayer"
+              :playsinline="true"
+              :options="item"
+              style="width: 200px"
+            ></video-player>
+          </div>
+        </a-descriptions-item>
+
+        <a-descriptions-item label="处理措施" v-if="illegal == 1">
+          {{ caseHandlingData.createtime }}
+        </a-descriptions-item>
+
+        <template v-if="illegal == 0">
+          <a-descriptions-item label="项目名称">
+            {{ caseHandlingData.result_name }}
+          </a-descriptions-item>
+          <a-descriptions-item label="建设情况">
+            {{ caseHandlingData.actual_scene_case }}
+          </a-descriptions-item>
+          <a-descriptions-item label="建筑结构">
+            {{ caseHandlingData.build_structure }}
+          </a-descriptions-item>
+          <a-descriptions-item label="实际用途">
+            {{ caseHandlingData.actual_use_to }}
+          </a-descriptions-item>
+          <a-descriptions-item label="当事人">
+            {{ caseHandlingData.illegal_contact }}
+          </a-descriptions-item>
+          <a-descriptions-item label="当事人电话">
+            {{ caseHandlingData.illegal_contact_phone }}
+          </a-descriptions-item>
+        </template>
+      </a-descriptions>
+    </CollapseContainer>
+    <CollapseContainer title="【案件办理信息-合法】" :canExpan="false" v-if="illegal == 0">
+      <a-descriptions-item label="批准文件名称">
+        {{ caseHandlingData.evidence_file_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="批准文件编号">
+        {{ caseHandlingData.evidence_file_number }}
+      </a-descriptions-item>
+      <a-descriptions-item label="批准文件有效期">
+        {{ caseHandlingData.evidence_file_indate }}
+      </a-descriptions-item>
+      <a-descriptions-item label="合法批准文件">
+        <div>
+          <ImagePreview :imageList="evidenceFileList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="勘测定界图">
+        <div>
+          <ImagePreview :imageList="boundaryImageList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="是否超范围">
+        {{ caseHandlingData.is_out_boundary == 1 ? '是' : '否' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="是否超层">
+        {{ caseHandlingData.is_over_floor == 1 ? '是' : '否' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理人">
+        {{ caseHandlingData.transactor_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理时间">
+        {{ caseHandlingData.transact_time }}
+      </a-descriptions-item>
+    </CollapseContainer>
+    <CollapseContainer title="【案件办理信息-伪变化】" :canExpan="false" v-if="illegal == 2">
+      <a-descriptions-item label="伪变化原因">
+        {{ caseHandlingData.pseudo_change_reason }}
+      </a-descriptions-item>
+      <a-descriptions-item label="实际用途">
+        {{ caseHandlingData.actual_use_to }}
+      </a-descriptions-item>
+      <a-descriptions-item label="实际面积">
+        {{ caseHandlingData.actual_area }}
+      </a-descriptions-item>
+      <a-descriptions-item label="是否有建筑物">
+        {{ caseHandlingData.is_have_build == 1 ? '是' : '否' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="是否永久性建筑">
+        {{ caseHandlingData.is_have_build == 1 ? '是' : '否' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理人">
+        {{ caseHandlingData.transactor_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理时间">
+        {{ caseHandlingData.transact_time }}
+      </a-descriptions-item>
+    </CollapseContainer>
+    <CollapseContainer
+      title="【案件办理信息-拟拆除】"
+      :canExpan="false"
+      v-if="illegal == 1 && caseHandlingData.measure_name == '拟拆除'"
+    >
+      <a-descriptions-item label="实际用途">
+        {{ caseHandlingData.actual_use_to }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人">
+        {{ caseHandlingData.illegal_contact }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人电话">
+        {{ caseHandlingData.illegal_contact_phone }}
+      </a-descriptions-item>
+      <a-descriptions-item label="建设情况">
+        {{ caseHandlingData.is_build_complete == 1 ? '已建成' : '建设中' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="建筑结构">
+        {{ caseHandlingData.build_structure }}
+      </a-descriptions-item>
+      <a-descriptions-item label="拆除后照片">
+        <div>
+          <ImagePreview :imageList="afterImageList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="办理人">
+        {{ caseHandlingData.transactor_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理时间">
+        {{ caseHandlingData.transact_time }}
+      </a-descriptions-item>
+    </CollapseContainer>
+    <CollapseContainer
+      title="【案件办理信息-查处】"
+      :canExpan="false"
+      v-if="illegal == 1 && caseHandlingData.measure_name == '查处'"
+    >
+      <a-descriptions-item label="实际用途">
+        {{ caseHandlingData.actual_use_to }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人">
+        {{ caseHandlingData.illegal_contact }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人电话">
+        {{ caseHandlingData.illegal_contact_phone }}
+      </a-descriptions-item>
+      <a-descriptions-item label="身份证号码">
+        {{ caseHandlingData.illegal_contact_idcard }}
+      </a-descriptions-item>
+      <a-descriptions-item label="违法类型">
+        {{ caseHandlingData.illegal_type }}
+      </a-descriptions-item>
+      <a-descriptions-item label="立案号">
+        {{ caseHandlingData.build_structure }}
+      </a-descriptions-item>
+      <a-descriptions-item label="处罚通知书">
+        <div>
+          <ImagePreview :imageList="punishImageList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="交款通知书">
+        <div>
+          <ImagePreview :imageList="paymentImagesList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="办理人">
+        {{ caseHandlingData.transactor_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理时间">
+        {{ caseHandlingData.transact_time }}
+      </a-descriptions-item>
+    </CollapseContainer>
+    <CollapseContainer
+      title="【案件办理信息-拟完善手续】"
+      :canExpan="false"
+      v-if="illegal == 1 && caseHandlingData.measure_name == '拟完善手续'"
+    >
+      <a-descriptions-item label="实际用途">
+        {{ caseHandlingData.actual_use_to }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人">
+        {{ caseHandlingData.illegal_contact }}
+      </a-descriptions-item>
+      <a-descriptions-item label="当事人电话">
+        {{ caseHandlingData.illegal_contact_phone }}
+      </a-descriptions-item>
+      <a-descriptions-item label="拟完善手续名称">
+        {{ caseHandlingData.result_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="完善手续条件">
+        {{ caseHandlingData.is_have_checkout_condition == 1 ? '是' : '否' }}
+      </a-descriptions-item>
+      <a-descriptions-item label="违法类型">
+        {{ caseHandlingData.illegal_type }}
+      </a-descriptions-item>
+
+      <a-descriptions-item label="政府同意完善手续证明">
+        <div>
+          <ImagePreview :imageList="agreeImageList" />
+        </div>
+      </a-descriptions-item>
+
+      <a-descriptions-item label="办理手续照片">
+        <div>
+          <ImagePreview :imageList="checkoutImageList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="勘测定界图">
+        <div>
+          <ImagePreview :imageList="boundaryImageList" />
+        </div>
+      </a-descriptions-item>
+      <a-descriptions-item label="手续有效期">
+        {{ caseHandlingData.procedure_indate }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理人">
+        {{ caseHandlingData.transactor_name }}
+      </a-descriptions-item>
+      <a-descriptions-item label="办理时间">
+        {{ caseHandlingData.transact_time }}
+      </a-descriptions-item>
+    </CollapseContainer>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { reactive, watch, ref , onMounted} from 'vue';
+  import { ImagePreview } from '@/components/Preview';
+  import { CollapseContainer } from '@/components/Container';
+  import { caseHandleInfoObj } from '../model';
+  import { getDroneCaseDeal } from '@/api/monitor/index'
+  const illegal = ref(0);
+  const labelStyle = ref({
+    width: '100px',
+  });
+  const caseHandlingData = ref({});
+  const playerOptions = ref([]);
+  const imageList = ref([
+    'https://picsum.photos/id/66/346/216',
+    'https://picsum.photos/id/67/346/216',
+    'https://picsum.photos/id/68/346/216',
+  ]);
+  const evidenceFileList = ref([
+    'https://picsum.photos/id/66/346/216',
+    'https://picsum.photos/id/67/346/216',
+    'https://picsum.photos/id/68/346/216',
+  ]);
+  const boundaryImageList = ref([
+    'https://picsum.photos/id/66/346/216',
+    'https://picsum.photos/id/67/346/216',
+    'https://picsum.photos/id/68/346/216',
+  ]);
+  const afterImageList = ref([
+    'https://picsum.photos/id/66/346/216',
+    'https://picsum.photos/id/67/346/216',
+    'https://picsum.photos/id/68/346/216',
+  ]);
+  const punishImageList = ref([]);
+  const paymentImagesList = ref([]);
+  const agreeImageList = ref([]);
+  const checkoutImageList = ref([]);
+
+  const props = defineProps({
+    id: String
+  });
+  watch(
+    () => props.id,
+    (newVal, oldVal) => {
+      getCaseHandlingDetail()
+    },
+  );
+  onMounted(() => {
+    getCaseHandlingDetail();
+  });
+  async function getCaseHandlingDetail() {
+    const data = await getDroneCaseDeal({ caseid: props.id });
+    illegal.value = data.is_illegal;
+    caseHandlingData.value = data.info;
+    imageList.value = [];
+    if (data.pic_info_list.length > 0) {
+      data.pic_info_list.forEach((item) => {
+        item.s_filePath = BASE_IMAGE_URL + '/S_' + item.filePath;
+        item.filePath = BASE_IMAGE_URL + '/' + item.filePath;
+        imageList.value.push(item);
+      });
+    }
+
+    afterImageList.value = [];
+    if (data.after_pic_list.length > 0) {
+      data.after_pic_list.forEach((item) => {
+        item.s_filePath = BASE_IMAGE_URL + '/S_' + item.filePath;
+        item.filePath = BASE_IMAGE_URL + '/' + item.filePath;
+        afterImageList.value.push(item);
+      });
+    }
+
+    // 证明材料
+    evidenceFileList.value = [];
+    if (data.evidence_file_list.length > 0) {
+      data.evidence_file_list.forEach((item) => {
+        item.s_filePath = BASE_IMAGE_URL + '/S_' + item.filePath;
+        item.filePath = BASE_IMAGE_URL + '/' + item.filePath;
+        evidenceFileList.value.push(item);
+      });
+    }
+    // 罚款通知书
+    if (data.punish_pic_list.length > 0) {
+     punishImageList.value = this.handleImageArray(data.punish_pic_list);
+    }
+    // 交款通知单
+    if (data.payment_pic_list.length > 0) {
+      paymentImagesList.value = this.handleImageArray(data.payment_pic_list);
+    }
+    // 政府同意证明
+    if (data.agree_checkout_pic_list.length > 0) {
+     agreeImageList.value = this.handleImageArray(data.agree_checkout_pic_list);
+    }
+    // 办理手续
+    if (data.checkout_pic_list.length > 0) {
+      checkoutImageList.value = this.handleImageArray(data.checkout_pic_list);
+    }
+
+    // 勘测定界照片
+    if (data.boundary_pic_list.length > 0) {
+     boundaryImageList.value = this.handleImageArray(data.boundary_pic_list);
+    }
+
+    playerOptions.value = [];
+    if (data.video_list.length > 0) {
+      data.video_list.forEach((item, index) => {
+        let options = {
+          playbackRates: [0.5, 1.0, 1.5, 2.0], //可选择的播放速度
+          autoplay: false, //如果true,浏览器准备好时开始回放。
+          muted: false, // 默认情况下将会消除任何音频。
+          loop: false, // 视频一结束就重新开始。
+          preload: 'auto', // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
+          language: 'zh-CN',
+          aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
+          fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
+          sources: [
+            {
+              type: '',
+              src: BASE_IMAGE_URL + '/' + item, //url地址
+            },
+          ],
+          poster: '', //你的封面地址
+          // width: document.documentElement.clientWidth,
+          notSupportedMessage: '此视频暂无法播放，请稍后再试', //允许覆盖Video.js无法播放媒体源时显示的默认信息。
+          controlBar: {
+            timeDivider: true, //当前时间和持续时间的分隔符
+            durationDisplay: true, //显示持续时间
+            remainingTimeDisplay: false, //是否显示剩余时间功能
+            fullscreenToggle: true, //全屏按钮
+          },
+        };
+        playerOptions.value.push(options);
+      });
+    
+    }
+  }
+</script>
+<style lang="less" scoped>
+  ::v-deep .ant-image .ant-image-img {
+    width: 85px;
+    margin-bottom: 10px;
+  }
+</style>

src/views/demo/monitor/interpretation/src/interpret.vue

@@ -0,0 +1,269 @@
+<template>
+  <div class="interpret-box">
+    <div class="interpret-form">
+      <a-form
+        ref="formRef"
+        :rules="data.rules"
+        :model="ruleForm"
+        :label-col="labelCol"
+        :wrapper-col="wrapperCol"
+      >
+        <a-form-item label="案件编号">
+          <a-input v-model:value="ruleForm.case_no" disabled />
+        </a-form-item>
+        <a-form-item label="案件详情">
+          <a-input v-model:value="ruleForm.case_description" placeholder="请输入" />
+        </a-form-item>
+        <a-form-item label="违规类型" name="typeid">
+          <a-select
+            v-model:value="ruleForm.typeid"
+            placeholder="请选择"
+            :options="data.violationOptions"
+            :field-names="{ label: 'itemName', value: 'itemValue' }"
+          >
+          </a-select>
+        </a-form-item>
+        <a-form-item label="图斑面积">
+          <a-input v-model:value="ruleForm.area" placeholder="请输入" />
+        </a-form-item>
+        <a-form-item label="县/区">
+          <a-select
+            v-model:value="ruleForm.countyid"
+            placeholder="请选择"
+            :options="data.cityDatas"
+            :field-names="{ label: 'itemName', value: 'itemValue' }"
+          >
+          </a-select>
+        </a-form-item>
+        <a-form-item label="乡镇/街道">
+          <a-select
+            v-model:value="ruleForm.streetid"
+            placeholder="请选择"
+            :options="data.streetDatas"
+            :field-names="{ label: 'itemName', value: 'itemValue' }"
+          >
+          </a-select>
+        </a-form-item>
+        <a-form-item label="社区/村">
+          <a-select
+            v-model:value="ruleForm.communityname"
+            placeholder="请选择"
+            :options="data.communtDatas"
+            :field-names="{ label: 'itemName', value: 'itemValue' }"
+          >
+          </a-select>
+        </a-form-item>
+        <a-form-item label="详细地址">
+          <a-input v-model:value="ruleForm.address" placeholder="请输入" />
+        </a-form-item>
+        <a-form-item label="备注">
+          <a-textarea
+            v-model:value="ruleForm.description"
+            placeholder="备注"
+            :auto-size="{ minRows: 1, maxRows: 3 }"
+          />
+        </a-form-item>
+        <a-form-item label="现场照片">
+          <ImagePreview :imageList="abbreviationPicListData" />
+          <ImageUpload
+            file-list="fileList"
+            :maxSize="20"
+            :maxNumber="10"
+            :api="imgApi"
+            :multiple="true"
+            @delete="handleRemove"
+          />
+        </a-form-item>
+      </a-form>
+    </div>
+    <div class="btn-box">
+      <a-button color="info" class="ml-2" @click="resetForm">取消</a-button>
+      <a-button color="info" class="ml-2" type="primary" @click="saveForm">保存</a-button>
+      <a-button color="success" class="ml-2" type="primary" @click="submitForm">提交</a-button>
+      <a-button color="info" class="ml-2" type="primary" danger @click="eventClose">关闭</a-button>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { ImageUpload } from '@/components/Upload';
+  import { ref, reactive, watch, onMounted } from 'vue';
+  import { ImagePreview } from '@/components/Preview';
+  import { getCaseInfo } from '@/api/monitor/index';
+  import { uploadApi } from '@/api/sys/upload';
+  // 图片服务器地址
+  import { useGlobSetting } from '@/hooks/setting';
+  const { uploadUrl } = useGlobSetting();
+  const emit = defineEmits(['close']);
+  const formRef = ref();
+  const labelCol = { span: 7 };
+  const wrapperCol = { span: 17 };
+  const ruleForm = ref({});
+  const fileList = ref([]);
+  const filSuccessList = ref([]);
+  const formData = ref({});
+  const picListData = ref([]);
+  const abbreviationPicListData = ref(['https://picsum.photos/id/66/346/216']);
+  const data = reactive({
+    violationOptions: [],
+    communtDatas: [],
+    streetDatas: [],
+    cityDatas: [],
+    rules: {
+      typeid: [{ required: true, message: '请选择违规类型' }],
+    },
+  });
+  watch(fileList, (newValue) => {
+    // 监听 fileList 的变化
+    // newValue 的值就是 formUser 的真实值 === formUser.value
+    console.log(newValue);
+  });
+  const props = defineProps({
+    interpretData: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+  });
+  ruleForm.value = props.interpretData;
+  watch(
+    () => props.interpretData,
+    (newVal, oldVal) => {
+      ruleForm.value = newVal;
+      getFormData();
+    },
+  );
+  onMounted(() => {
+    getFormData();
+  });
+
+  // 获取现场照片
+  async function getFormData() {
+    picListData.value = [];
+    const data = await getCaseInfo({ id: ruleForm.value.id });
+    formData.value = data;
+    data.pics.forEach((item) => {
+      let src = item.path;
+      item.path = uploadUrl + '/' + item.path;
+      item.thumbnail = uploadUrl + '/S_' + src;
+      picListData.value.push(item);
+      // 缩略图
+      abbreviationPicListData.value.push(item.thumbnail);
+    });
+  }
+  async function imgApi(file, progress) {
+    const data = await uploadApi(file, progress);
+    if (data.result.length > 0) {
+      filList.value.push(file);
+      filSuccessList.value.push(data.data.result[0]);
+    }
+  }
+  function handleRemove(file) {
+    console.log(file);
+    var currentIndex = (fileList.value || []).findIndex((element) => element.uid === file.uid);
+    fileList.value.splice(currentIndex, 1);
+    filSuccessList.value.splice(currentIndex, 1);
+  }
+  //   获取违规类型
+  async function getNoBuildStatus() {
+    getMethodCommon('/Categorys/LoadList', { typeid: 'DRONE_CASE_TYPE' }).then((res) => {
+      this.violationOptions = res.result;
+    });
+  }
+  // 获取地区
+  async function getAreasData() {
+    getMethodCommon('/Orgs/LoadOrgList', { name: '费县' }).then((res) => {
+      this.areasDatas = res.result;
+      res.result.forEach((item) => {
+        if (item.parentName == '临沂市') {
+          this.cityDatas.push(item);
+        }
+        if (item.parentId == this.ruleForm.countyid) {
+          this.streetDatas.push(item);
+        }
+        if (item.parentId == this.ruleForm.streetid) {
+          this.communtDatas.push(item);
+        }
+      });
+    });
+  }
+  // 表单验证
+  async function validateForm() {
+    let res = await formRef.value
+      .validate()
+      .then((values) => {
+        return true;
+      })
+      .catch((error) => {
+        return false;
+      });
+    return res;
+  }
+  // 取消
+  function resetForm() {
+    emit('close');
+  }
+
+  // 保存
+  async function saveForm() {
+    this.formData.info = this.ruleForm;
+    let arr = this.picListData;
+    // console.log("arr",arr);
+    this.formData.pic_list = [];
+    for (let i = 0; i < arr.length; i++) {
+      // this.formData.pic_list[i]=this.picListData[i].split("6001/")[1];
+      this.formData.pic_list[i] = this.handleImagePath(this.picListData[i].path);
+    }
+    postMethodCommon('/DroneCaseinfo/AddDroneCaseInfo', this.formData).then((res) => {
+      if (res.code == 200) {
+        this.$notify({
+          title: '成功',
+          message: '保存成功',
+          type: 'success',
+          duration: 2000,
+        });
+        this.close();
+      }
+    });
+  }
+</script>
+<style lang="less" scoped>
+  .interpret-box {
+    width: 100%;
+    height: 74vh;
+    position: relative;
+    .interpret-form {
+      overflow-y: auto;
+      height: 100%;
+      padding-bottom: 20px;
+    }
+    .ant-form {
+      padding: 20px;
+      display: flex;
+      flex-direction: column;
+      .ant-form-item {
+        float: left;
+        margin-bottom: 10px;
+        margin-left: 4px;
+        width: 100%;
+        button {
+          margin-right: 10px;
+        }
+      }
+    }
+    ::v-deep .ant-image-img{
+      width: 50%;
+    }
+  }
+  .btn-box {
+    width: 100%;
+    padding: 10px 10%;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    position: absolute;
+    bottom: 0px;
+    left: 0;
+    background-color: @component-background;
+  }
+</style>

src/views/demo/monitor/interpretation/src/interpretMap.vue

@@ -0,0 +1,103 @@
+<template>
+  <div class="w-full">
+    <MapboxMaps :mapOptions="mapOptions" @map-on-load="mapOnLoad" :control="mapControl" @map-draw="handlerMapDraw" />
+  </div>
+</template>
+<script setup lang="ts">
+  import { ref, reactive, onMounted, watch } from 'vue';
+  import rodeImg from '@/assets/images/icon_fly2.png';
+  import MapboxMaps from '@/components/MapboxMaps/index.vue';
+  import { DrawingType } from '@/enums/mapEnum';
+  const mapControl: DrawingType[] = [DrawingType.Polygon];
+
+  const mapOptions = {
+    center: [117.84714891969796, 35.22152309532066],
+    zoom: 10,
+  };
+  const detailMap = ref();
+  const mapBox = ref();
+  const ruleForm = ref({});
+  const props = defineProps({
+    interpretData: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+  });
+  console.log(props.interpretData);
+  ruleForm.value = props.interpretData;
+  watch(
+    () => props.interpretData,
+    (newVal, oldVal) => {
+      ruleForm.value = newVal;
+      detailMap.value.flyTo({
+        center: [newVal.lng, newVal.lat], // 中心点
+        zoom: 16, // 缩放比例
+        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;
+  };
+  //地图绘制的回调
+  const handlerMapDraw = (type: string, data: any) => {
+    console.log('data::: ', data);
+    console.log('type::: ', type);
+  };
+  //   案件位置显示无人机图标
+  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%;
+    position: relative;
+    height: 90vh;
+  }
+</style>

src/views/demo/notice/index.vue

@@ -13,7 +13,7 @@
   import { reactive, ref } from 'vue';
 
   import { BasicTable, useTable } from '@/components/Table';
-  import { getNoticeList, deleteNotice } from '@/api/demo/system';
+  import { getNoticeList, deleteNotice,getNoticeDetail } from '@/api/demo/system';
   import { PageWrapper } from '@/components/Page';
   import { useModal } from '@/components/Modal';
   import { useMessage } from '@/hooks/web/useMessage';
@@ -78,10 +78,14 @@
 
   function handleEdit() {
     let rows = getSelectRows();
-    if (rows.length == 0) {
-      return createMessage.warn('请选择一个部门进行编辑');
+    if (rows.length != 1) {
+      return createMessage.warn('请选择一条数据进行编辑');
     }
     const record = rows[0];
+    
+    // let res:any = getNoticeDetail({id:rows[0].Id});
+    // const record = res.result;
+    // console.log("record",res);
     openDeptModal(true, {
       record,
       isUpdate: true,

src/views/demo/onlineform/formCall/index.vue

@@ -34,7 +34,6 @@
   import { BasicTree, TreeItem, TreeActionItem, TreeActionType } from '@/components/Tree';
   import { getFormsDesignData, getFormsPageData, delFormsData } from '@/api/formrender/index';
   import { getOutKeyList } from '@/api/formdesign/index';
-  // import { searchFormSchema } from './index.data';
   import { PageWrapper } from '@/components/Page';
   import { cloneDeep } from 'lodash-es';
   import { IFormConfig } from '../../form-design/typings/v-form-component';
@@ -70,7 +69,6 @@
     columns: callColumns,
     formConfig: {
       labelWidth: 120,
-      // schemas: searchFormSchema,
     },
     rowSelection: {
       type: 'radio',

src/views/demo/query/complete/columns.data.ts

@@ -0,0 +1,58 @@
+import { BasicColumn, FormSchema } from '@/components/Table';
+
+export const tableColums: BasicColumn[] = [
+  {
+    title: '案件编号',
+    dataIndex: 'case_no',
+    width: 120,
+  },
+  {
+    title: '上报时间',
+    dataIndex: 'createtime',
+    width: 120,
+  },
+  {
+    title: '地点',
+    dataIndex: 'address',
+    width: 120,
+  },
+  {
+    title: '案件描述',
+    dataIndex: 'case_description',
+    width: 120,
+  },
+  {
+    title: '处理时间',
+    dataIndex: 'deal_time',
+    width: 120,
+  },
+  {
+    title: '案件处理人',
+    dataIndex: 'deal_username',
+    width: 120,
+  },
+  {
+    title: '处理进度',
+    dataIndex: 'verifystatusname',
+    width: 120,
+  },
+  {
+    title: '处理状态',
+    dataIndex: 'handle_status_name',
+    width: 120,
+  },
+  {
+    title: '办结时间',
+    dataIndex: 'verifytime',
+    width: 120,
+  },
+];
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'keyword',
+    label: '关键字',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+];

src/views/demo/query/complete/index.vue

@@ -0,0 +1,336 @@
+<!-- eslint-disable vue/no-deprecated-v-on-native-modifier -->
+<template>
+  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
+    <BasicTable
+      class="w-4/4 xl:w-5/5"
+      @register="registerTable"
+      @fetch-success="onFetchSuccess"
+      :searchInfo="searchInfo"
+    >
+      <template #toolbar>
+        <!-- 日期选择框 -->
+        <div style="display: inline; margin-right: 10px; width: 200px">
+          <a-range-picker
+            v-model:value="startEndTime"
+            size="mini"
+            align="right"
+            :presets="rangePresets"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 案件类型 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-select
+            :options="caseTypeOptions"
+            v-model:value="listQuery.typeid"
+            placeholder="案件类型"
+            style="width: 100px"
+            :field-names="{ label: 'name', value: 'id' }"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 查询地区 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-cascader
+            :options="OrgList"
+            v-model:value="listQuery.org"
+            placeholder="查询地区"
+            size="mini"
+            style="width: 100px"
+            @change="handleChange"
+          />
+        </div>
+        <!-- 现场状况 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-select
+            :options="illegalOptions"
+            v-model:value="listQuery.is_illegal"
+            placeholder="现场状况"
+            style="width: 100px"
+            :field-names="{ label: 'name', value: 'id' }"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 案件编号 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'案件编号'"
+            v-model:value="listQuery.case_no"
+          />
+        </div>
+        <!-- 处理人姓名 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'处理人姓名'"
+            v-model:value="listQuery.deal_username"
+          />
+        </div>
+        <!-- 审核人姓名 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'审核人姓名'"
+            v-model:value="listQuery.verifyuser"
+          />
+        </div>
+        <!-- 请输入关键字 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'请输入关键字'"
+            v-model:value="listQuery.key"
+          />
+        </div>
+        <!-- 搜索按钮 -->
+        <a-button class="filter-item" type="primary" @click="getCaseList" size="mini">
+          查询
+        </a-button>
+        <a-button class="filter-item" @click="resetListQuery" size="mini"> 重置 </a-button>
+        <a-button class="filter-item" type="success" @click="exportExcelList" size="mini">
+          导出
+        </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <!-- 地点特殊处理 -->
+        <template v-if="column.key === 'address'">
+          <span>{{ record.streetname }}</span>
+          <span>{{ record.streetname }}</span>
+          <span>{{ record.communityname }}</span>
+        </template>
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                label: '详情',
+                onClick: () => {
+                  openDetailModal(record);
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <DetailModal
+      @register="registerModal"
+      @close-modal="closeModal"
+      :caseDetailId="caseDetailId"
+      :isShowMap="true"
+      width="80%"
+    />
+  </PageWrapper>
+</template>
+<script lang="ts" setup>
+  // vue
+  import { ref, reactive, onMounted } from 'vue';
+  // vben
+  import { PageWrapper } from '@/components/Page';
+  import { BasicTable, useTable, TableAction } from '@/components/Table';
+  import { TreeItem } from '@/components/Tree';
+  import { useModal } from '@/components/Modal';
+  import dayjs, { Dayjs } from 'dayjs';
+  // 子组件
+  import DetailModal from './detailModal.vue';
+  // api
+  import {
+    fun_LoadDataBaseInfo,
+    fun_LoadList,
+    fun_load,
+    fun_OrgList,
+    fun_ExportCaseInfoList,
+  } from '@/api/demo/query';
+  // ts
+  import { tableColums, searchFormSchema } from './columns.data';
+
+  // 日期选择框
+  type RangeValue = [Dayjs, Dayjs];
+  const startEndTime = ref<RangeValue>();
+  // 日期选择表-事件预选项
+  const rangePresets = ref([
+    { label: '今天', value: [dayjs(), dayjs()] },
+    { label: '最近三天', value: [dayjs().add(-3, 'd'), dayjs()] },
+    { label: '最近一周', value: [dayjs().add(-7, 'd'), dayjs()] },
+    { label: '最近两周', value: [dayjs().add(-14, 'd'), dayjs()] },
+    { label: '最近一个月', value: [dayjs().add(-30, 'd'), dayjs()] },
+    { label: '最近三个月', value: [dayjs().add(-90, 'd'), dayjs()] },
+    { label: '最近半年', value: [dayjs().add(-180, 'd'), dayjs()] },
+    { label: '最近一年', value: [dayjs().add(-365, 'd'), dayjs()] },
+  ]);
+  // 搜索条件
+  const searchInfo = reactive<Recordable>({});
+  // 导出
+  const BASE_API = process.env.VUE_APP_BASE;
+
+  // 查询条件
+  let listQuery = ref({
+    typeid: null,
+    org: null,
+    is_illegal: null,
+    case_no: null,
+    key: undefined,
+    deal_username: null,
+    verifyuser: null,
+    report_start_time: null,
+    report_end_time: null,
+    countyid: null,
+    streetid: null,
+    communityid: null,
+  });
+  // 现场状况
+  let illegalOptions = [
+    { id: 0, name: '合法' },
+    { id: 1, name: '违法' },
+    { id: 2, name: '伪变化' },
+  ];
+  // 案件类型
+  const caseTypeOptions = ref<[]>([]);
+  // 查询地区
+  const OrgList = ref<TreeItem[]>([]);
+
+  // 弹窗
+  const [registerModal, { openModal }] = useModal();
+  // 办结查询列表
+  const [registerTable, { reload, clearSelectedRowKeys }] = useTable({
+    api: fun_LoadDataBaseInfo,
+    columns: tableColums,
+    rowKey: 'id',
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+    // 序号列
+    showIndexColumn: true,
+    actionColumn: {
+      width: 120,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    beforeFetch: (data) => {
+      // 接口请求前 参数处理
+      var temp = {
+        page: data.page,
+        rows: data.limit,
+        value: data.value,
+        handle_status_id: 2, //处理进度为：审核完成
+      };
+      return temp;
+    },
+    handleSearchInfoFn(info) {
+      return info;
+    },
+  });
+
+  // 搜索条件-查询地区
+  function handleChange(itemIdArr) {
+    if (itemIdArr.length === 0) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = null;
+    }
+    if (itemIdArr.length === 1) {
+      listQuery.value.countyid = itemIdArr[0];
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = null;
+    } else if (itemIdArr.length == 2) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = itemIdArr[1];
+      listQuery.value.communityid = null;
+    } else if (itemIdArr.length == 3) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = itemIdArr[2];
+    }
+    getCaseList();
+  }
+
+  // 条件搜索
+  async function getCaseList() {
+    // 日期选择框
+    if (startEndTime.value != null) {
+      listQuery.value.report_start_time = startEndTime.value[0].format('YYYY-MM-DD');
+      listQuery.value.report_end_time = startEndTime.value[1].format('YYYY-MM-DD');
+    } else {
+      listQuery.value.report_start_time = null;
+      listQuery.value.report_end_time = null;
+    }
+    searchInfo.value = listQuery.value;
+    clearSelectedRowKeys();
+    reload();
+  }
+
+  // 重置
+  function resetListQuery() {
+    startEndTime.value = null;
+    // 查询条件
+    listQuery.value = {
+      typeid: null,
+      org: null,
+      is_illegal: null,
+      case_no: null,
+      key: undefined,
+      deal_username: null,
+      verifyuser: null,
+      report_start_time: null,
+      report_end_time: null,
+      countyid: null,
+      streetid: null,
+      communityid: null,
+    };
+    getCaseList();
+  }
+
+  // 导出
+  async function exportExcelList() {
+    await fun_ExportCaseInfoList(listQuery.value).then((res) => {
+      console.log('导出', res);
+      if (res.code === 200) {
+        window.location.href = BASE_API + '/' + res.result;
+      }
+    });
+  }
+
+  // 打开详情窗口
+  let caseDetailId = '';
+  function openDetailModal(record: Recordable) {
+    caseDetailId = record.id;
+    openModal(true, { record });
+  }
+
+  // 初始化
+  async function fetch() {
+    getCaseList();
+    let data0 = await fun_LoadList({ typeid: 'SYS_NOBUILD_TYPE' });
+    console.log(data0);
+    // 案件类型
+    let data1 = await fun_load({ page: 1, limit: 99, typeid: 'DRONE_CASE_TYPE' });
+    // caseTypeOptions.value =
+    console.log(data1);
+
+    // 查询地区
+    let data2 = await fun_OrgList({ name: '费县' });
+    // OrgList.value =
+    console.log(data2);
+  }
+
+  onMounted(() => {
+    fetch();
+  });
+</script>

src/views/demo/query/complete/mapDetail.vue

@@ -0,0 +1,205 @@
+<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) => {
+      console.log(newVal);
+      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();
+    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.info.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.info.lng, props.ruleForm.info.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: 50vh;
+  }
+</style>

src/views/demo/query/return/columns.data.ts

@@ -0,0 +1,48 @@
+import { BasicColumn, FormSchema } from '@/components/Table';
+
+export const tableColums: BasicColumn[] = [
+  {
+    title: '案件编号',
+    dataIndex: 'case_no',
+    width: 120,
+  },
+  {
+    title: '上报时间',
+    dataIndex: 'createtime',
+    width: 120,
+  },
+  {
+    title: '地点',
+    dataIndex: 'address',
+    width: 120,
+  },
+  {
+    title: '案件描述',
+    dataIndex: 'case_description',
+    width: 120,
+  },
+  {
+    title: '处理时间',
+    dataIndex: 'deal_time',
+    width: 120,
+  },
+  {
+    title: '案件处理人',
+    dataIndex: 'deal_username',
+    width: 120,
+  },
+  {
+    title: '退回次数',
+    dataIndex: 'drawbackcount',
+    width: 80,
+  },
+];
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'keyword',
+    label: '关键字',
+    component: 'Input',
+    colProps: { span: 8 },
+  },
+];

src/views/demo/query/return/index.vue

@@ -0,0 +1,328 @@
+<!-- eslint-disable vue/no-deprecated-v-on-native-modifier -->
+<template>
+  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
+    <BasicTable
+      class="w-4/4 xl:w-5/5"
+      @register="registerTable"
+      @fetch-success="onFetchSuccess"
+      :searchInfo="searchInfo"
+    >
+      <template #toolbar>
+        <!-- 日期选择框 -->
+        <div style="display: inline; margin-right: 10px; width: 200px">
+          <a-range-picker
+            v-model:value="startEndTime"
+            size="mini"
+            align="right"
+            :presets="rangePresets"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 案件类型 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-select
+            :options="caseTypeOptions"
+            v-model:value="listQuery.typeid"
+            placeholder="案件类型"
+            style="width: 100px"
+            :field-names="{ label: 'name', value: 'id' }"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 查询地区 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-cascader
+            :options="OrgList"
+            v-model:value="listQuery.org"
+            placeholder="查询地区"
+            size="mini"
+            style="width: 100px"
+            @change="handleChange"
+          />
+        </div>
+        <!-- 现场状况 -->
+        <div style="display: inline; margin-right: 10px; width: 100px">
+          <a-select
+            :options="illegalOptions"
+            v-model:value="listQuery.is_illegal"
+            placeholder="现场状况"
+            style="width: 100px"
+            :field-names="{ label: 'name', value: 'id' }"
+            @change="getCaseList"
+          />
+        </div>
+        <!-- 案件编号 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'案件编号'"
+            v-model:value="listQuery.case_no"
+          />
+        </div>
+        <!-- 处理人姓名 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'处理人姓名'"
+            v-model:value="listQuery.deal_username"
+          />
+        </div>
+        <!-- 请输入关键字 -->
+        <div style="display: inline; margin-right: 10px">
+          <a-input
+            @keyup.enter="getCaseList"
+            size="mini"
+            style="width: 120px"
+            class="filter-item"
+            :placeholder="'请输入关键字'"
+            v-model:value="listQuery.key"
+          />
+        </div>
+        <!-- 搜索按钮 -->
+        <a-button class="filter-item" type="primary" @click="getCaseList" size="mini">
+          查询
+        </a-button>
+        <a-button class="filter-item" @click="resetListQuery" size="mini"> 重置 </a-button>
+        <a-button class="filter-item" type="success" @click="exportExcelList" size="mini">
+          导出
+        </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <!-- 地点特殊处理 -->
+        <template v-if="column.key === 'address'">
+          <span>{{ record.streetname }}</span>
+          <span>{{ record.streetname }}</span>
+          <span>{{ record.communityname }}</span>
+        </template>
+        <template v-if="column.key === 'drawbackcount'">
+          <span>{{ record.drawbackcount >= 1 ? record.drawbackcount : 1 }}</span>
+        </template>
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                label: '详情',
+                onClick: () => {
+                  openDetailModal(record);
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <DetailModal
+      @register="registerModal"
+      @close-modal="closeModal"
+      :caseDetailId="caseDetailId"
+      :isShowMap="true"
+      width="80%"
+    />
+  </PageWrapper>
+</template>
+<script lang="ts" setup>
+  // vue
+  import { ref, reactive, onMounted } from 'vue';
+  // vben
+  import { PageWrapper } from '@/components/Page';
+  import { BasicTable, useTable, TableAction } from '@/components/Table';
+  import { TreeItem } from '@/components/Tree';
+  import { useModal } from '@/components/Modal';
+  import dayjs, { Dayjs } from 'dayjs';
+  // 子组件
+  import DetailModal from './detailModal.vue';
+  // api
+  import {
+    fun_LoadDataBaseInfo,
+    fun_LoadList,
+    fun_load,
+    fun_OrgList,
+    fun_ExportCaseInfoList,
+  } from '@/api/demo/query';
+  // ts
+  import { tableColums, searchFormSchema } from './columns.data';
+
+  // 日期选择框
+  type RangeValue = [Dayjs, Dayjs];
+  const startEndTime = ref<RangeValue>();
+  // 日期选择表-事件预选项
+  const rangePresets = ref([
+    { label: '今天', value: [dayjs(), dayjs()] },
+    { label: '最近三天', value: [dayjs().add(-3, 'd'), dayjs()] },
+    { label: '最近一周', value: [dayjs().add(-7, 'd'), dayjs()] },
+    { label: '最近两周', value: [dayjs().add(-14, 'd'), dayjs()] },
+    { label: '最近一个月', value: [dayjs().add(-30, 'd'), dayjs()] },
+    { label: '最近三个月', value: [dayjs().add(-90, 'd'), dayjs()] },
+    { label: '最近半年', value: [dayjs().add(-180, 'd'), dayjs()] },
+    { label: '最近一年', value: [dayjs().add(-365, 'd'), dayjs()] },
+  ]);
+  // 搜索条件
+  const searchInfo = reactive<Recordable>({});
+  // 导出
+  const BASE_API = process.env.VUE_APP_BASE;
+
+  // 查询条件
+  let listQuery = ref({
+    typeid: null,
+    org: null,
+    is_illegal: null,
+    case_no: null,
+    key: undefined,
+    deal_username: null,
+    report_start_time: null,
+    report_end_time: null,
+    countyid: null,
+    streetid: null,
+    communityid: null,
+    is_drawback: 1,
+  });
+  // 现场状况
+  let illegalOptions = [
+    { id: 0, name: '合法' },
+    { id: 1, name: '违法' },
+    { id: 2, name: '伪变化' },
+  ];
+  // 案件类型
+  const caseTypeOptions = ref<[]>([]);
+  // 查询地区
+  const OrgList = ref<TreeItem[]>([]);
+
+  // 弹窗
+  const [registerModal, { openModal }] = useModal();
+  // 办结查询列表
+  const [registerTable, { reload, clearSelectedRowKeys }] = useTable({
+    api: fun_LoadDataBaseInfo,
+    columns: tableColums,
+    rowKey: 'id',
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    striped: false,
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+    // 序号列
+    showIndexColumn: true,
+    actionColumn: {
+      width: 120,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    beforeFetch: (data) => {
+      // 接口请求前 参数处理
+      var temp = {
+        page: data.page,
+        rows: data.limit,
+        value: data.value,
+        is_drawback: 1, //处理进度为：退回
+      };
+      return temp;
+    },
+    handleSearchInfoFn(info) {
+      return info;
+    },
+  });
+
+  // 搜索条件-查询地区
+  function handleChange(itemIdArr) {
+    if (itemIdArr.length === 0) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = null;
+    }
+    if (itemIdArr.length === 1) {
+      listQuery.value.countyid = itemIdArr[0];
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = null;
+    } else if (itemIdArr.length == 2) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = itemIdArr[1];
+      listQuery.value.communityid = null;
+    } else if (itemIdArr.length == 3) {
+      listQuery.value.countyid = null;
+      listQuery.value.streetid = null;
+      listQuery.value.communityid = itemIdArr[2];
+    }
+    getCaseList();
+  }
+
+  // 条件搜索
+  async function getCaseList() {
+    // 日期选择框
+    if (startEndTime.value != null) {
+      listQuery.value.report_start_time = startEndTime.value[0].format('YYYY-MM-DD');
+      listQuery.value.report_end_time = startEndTime.value[1].format('YYYY-MM-DD');
+    } else {
+      listQuery.value.report_start_time = null;
+      listQuery.value.report_end_time = null;
+    }
+    searchInfo.value = listQuery.value;
+    clearSelectedRowKeys();
+    reload();
+  }
+
+  // 重置
+  function resetListQuery() {
+    startEndTime.value = null;
+    // 查询条件
+    listQuery.value = {
+      typeid: null,
+      org: null,
+      is_illegal: null,
+      case_no: null,
+      key: undefined,
+      deal_username: null,
+      report_start_time: null,
+      report_end_time: null,
+      countyid: null,
+      streetid: null,
+      communityid: null,
+      is_drawback: 1,
+    };
+    getCaseList();
+  }
+
+  // 导出
+  async function exportExcelList() {
+    await fun_ExportCaseInfoList(listQuery.value).then((res) => {
+      console.log('导出', res);
+      if (res.code === 200) {
+        window.location.href = BASE_API + '/' + res.result;
+      }
+    });
+  }
+
+  // 打开详情窗口
+  let caseDetailId = '';
+  function openDetailModal(record: Recordable) {
+    caseDetailId = record.id;
+    openModal(true, { record });
+  }
+
+  // 初始化
+  async function fetch() {
+    getCaseList();
+    let data0 = await fun_LoadList({ typeid: 'SYS_NOBUILD_TYPE' });
+    console.log(data0);
+    // 案件类型
+    let data1 = await fun_load({ page: 1, limit: 99, typeid: 'DRONE_CASE_TYPE' });
+    // caseTypeOptions.value =
+    console.log(data1);
+
+    // 查询地区
+    let data2 = await fun_OrgList({ name: '费县' });
+    // OrgList.value =
+    console.log(data2);
+  }
+
+  onMounted(() => {
+    fetch();
+  });
+</script>

src/views/demo/query/return/mapDetail.vue

@@ -0,0 +1,205 @@
+<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) => {
+      console.log(newVal);
+      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();
+    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.info.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.info.lng, props.ruleForm.info.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: 50vh;
+  }
+</style>

src/views/demo/report/index.vue

@@ -9,7 +9,6 @@
           <TableAction
             :actions="[
               {
-                // icon: 'ant-design:ellipsis-outlined',
                 label: '详情',
                 onClick: viewDetail.bind(null, record),
               },
@@ -18,7 +17,6 @@
         </template>
       </template>
     </BasicTable>
-
     <BasicModal
       v-bind="$attrs"
       @register="registerModal"
@@ -29,156 +27,69 @@
       :showOkBtn="false"
       :draggable="false"
     >
-      <!-- <CaseView :caseId="caseId"></CaseView> -->
+      <CaseView :caseId="caseId"></CaseView>
     </BasicModal>
-
   </div>
 </template>
 <script lang="ts" setup>
-  import { reactive,ref } from 'vue';
-
-  import { CaseView } from '@/views/demo/monitor/index';
-
-  import { BasicTable, useTable, TableAction } from '@/components/Table';
-  import { getRoleListByPage,getReportList, deleteRole } from '@/api/demo/system';
-
+  import { reactive, ref } from 'vue';
+  import { BasicTable, useTable, TableAction, BasicColumn } from '@/components/Table';
+  import { getCaseInfoList } from '@/api/monitor/index';
   import { useMessage } from '@/hooks/web/useMessage';
-  import { useModal } from '@/components/Modal';
   import { PermissionBtn } from '@/components/PermissionBtn/index';
-
-  import { columns, searchFormSchema } from './report.data';
-
-  defineOptions({ name: 'RoleManagement' });
-
+  import { searchFormSchema, columns } from './report.data';
+  import { BasicModal, useModal } from '@/components/Modal';
+  import { CaseView } from '@/views/demo/monitor/index';
   const { createConfirm, createMessage } = useMessage();
-
-
   const searchInfo = reactive<Recordable>({});
 
   const [registerTable, { reload, getSelectRows, clearSelectedRowKeys }] = useTable({
-    // 表格名称
-    title: '报告打印',
-    // 获取数据的接口
-    api: getReportList,
-    // 表单列信息 BasicColumn[]
+    title: '案件列表',
+    api: getCaseInfoList,
     columns,
     rowKey: 'id',
     formConfig: {
       labelWidth: 120,
       schemas: searchFormSchema,
     },
-    // 使用搜索表单
     useSearchForm: true,
-    // 显示表格设置工具
     showTableSetting: true,
-    // 是否显示表格边框
     bordered: true,
-    // 序号列
     showIndexColumn: false,
-    // 勾选列
     rowSelection: {
-      //多选框
-      // type: 'checkbox',
-      type: 'radio',
+      type: 'checkbox',
     },
-    // 搜索
     handleSearchInfoFn(info) {
       return info;
     },
     actionColumn: {
       width: 80,
-      title: '查看账号',
+      title: '操作',
       dataIndex: 'action',
-      // slots: { customRender: 'action' },
-      fixed: undefined,
     },
   });
-
   const [registerModal, { openModal, setModalProps }] = useModal();
-
-  function handleCreate() {
-    openRoleModal(true, {
-      isUpdate: false,
-    });
-  }
-  function handleExport(){
-    createMessage.success("下载成功！");
-  }
-
-
   const caseId = ref('');
-  
-  function viewDetail(record) {
-    console.log(record);
-    caseId.value = record.id;
-    alert(caseId.value)
-    openModal();
-  }
-
-  function handleEdit() {
-    let rows = getSelectRows();
-    if (rows.length == 0) {
-      return createMessage.warn('请勾选一个角色进行编辑');
-    }
-    const record = rows[0];
-    openRoleModal(true, {
-      record,
-      isUpdate: true,
-    });
-  }
-
-  async function handleDelete() {
-    let rows = getSelectRows();
-    if (rows.length == 0) {
-      return createMessage.warn('请勾选一个角色进行删除');
-    }
-    const query = [rows[0].id];
-    createConfirm({
-      iconType: 'info',
-      title: '删除',
-      content: '确定要删除当前角色吗',
-      onOk: async () => {
-        const data = await deleteRole(query);
-        if (data) {
-          handleSuccess();
-          return createMessage.success('删除成功');
-        } else {
-          return createMessage.error('删除失败');
-        }
-      },
-    });
-  }
-
-  function handleSuccess() {
-    clearSelectedRowKeys();
-    reload();
-  }
   function onBtnClicked(domId) {
     switch (domId) {
       case 'btnAdd':
-        handleCreate();
-        break;
-      case 'btnEdit':
-        handleEdit();
-        break;
-      case 'btnDelete':
-        handleDelete();
-        break;
-      case 'btnModules':
-        let rows = getSelectRows();
-        if (rows.length == 0) {
-          return createMessage.warn('请勾选一个角色进行编辑');
-        }
-        const record = rows[0];
-        openModulesModal(true, {
-          record,
-        });
-        break;
-      case 'btnExport':
-        handleExport();
         break;
       default:
         break;
     }
   }
+  function viewDetail(record) {
+    console.log(record);
+    caseId.value = record.id;
+    openModal();
+  }
 </script>
+<style lang="less" scoped>
+  // ::v-deep .ant-row .ant-col{
+  //   margin-right: 2px;
+  // }
+  // ::v-deep .ant-row .ant-col.ant-col-2 {
+  //   margin-right: 10px;
+  // }
+  
+</style>

src/views/demo/statistical/RecordList.vue

@@ -15,9 +15,9 @@
     </BasicTable>
   </template>
 <script lang="ts" setup>
-    import { reactive } from 'vue';
+    import { reactive,defineProps,watch } from 'vue';
   
-    import { BasicTable, useTable, TableAction } from '@/components/Table';
+    import { BasicTable, useTable, TableAction, FormSchema } from '@/components/Table';
     import { getRoleListByPage,getReportList, deleteRole } from '@/api/demo/system';
   
     import { useMessage } from '@/hooks/web/useMessage';
@@ -26,6 +26,15 @@
     import { columns,columnsDataPreview,searchFormSchema } from './record.data';
   
     defineOptions({ name: 'RoleManagement' });
+
+    const props = defineProps<{
+      tablist:Object,
+      currentListQuery:Object
+    }>()
+
+
+
+    console.log("propspropsprops",props.tablist);
   
     const { createConfirm, createMessage } = useMessage();
     const [registerModal, { openModal: openRoleModal }] = useModal();
@@ -47,7 +56,7 @@
         schemas: searchFormSchema,
       },
       // 使用搜索表单
-      useSearchForm: false,
+      useSearchForm: true,
       // 显示表格设置工具
       showTableSetting: false,
       // 是否显示表格边框
@@ -123,6 +132,52 @@
       createMessage.success("数据导出成功！")
     }
   
+    watch(()=>props.currentListQuery,(newValue,oldValue)=>{
+      while (searchFormSchema.length > 0) {
+          searchFormSchema.pop();
+      }
+      console.log("EEEEEEE",props.currentListQuery);
+      for(let item in props.currentListQuery){
+        console.log('EEEEEEEEEEEE',item);
+        let obj:any =   {
+          field: item,
+          label: item,
+          component: 'Input',
+          defaultValue:props.currentListQuery[item],
+          colProps: { span: 6 },
+        }
+        console.log("OBJ",obj);
+        searchFormSchema.push(obj);
+      }
+      reload();
+
+      useTable({
+      // 表格名称
+      title: '',
+      // 获取数据的接口
+      api: getReportList,
+      // 表单列信息 BasicColumn[]
+      columns,
+      rowKey: 'id',
+      formConfig: {
+        labelWidth: 120,
+        schemas: searchFormSchema,
+      },
+      // 使用搜索表单
+      useSearchForm: true,
+      // 显示表格设置工具
+      showTableSetting: false,
+      // 是否显示表格边框
+      bordered: true,
+      // 序号列
+      showIndexColumn: false,
+      handleSearchInfoFn(info) {
+        return info;
+      },
+    });
+
+    },{immediate:true,deep:true})
+
     function handleSuccess() {
       clearSelectedRowKeys();
       reload();

src/views/demo/statistical/index.vue

@@ -4,27 +4,120 @@
       <template #toolbar>
         <PermissionBtn @btn-event="onBtnClicked" />
       </template>
+      
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'streetname'">
-          <TableAction
-            :actions="[
-              {
-                label: record.streetname,
-                onClick: handlePreViewData.bind(null, record),
-              },
-            ]"
-          />
+        
+        <!-- 无人机发现数量 -->
+        <template v-if="column.key === 'allCount'">
+          <a @click="handlePreViewData(column,record)">{{record.allCount}}</a>
         </template>
+
+        <!-- 完成外业核查数量 -->
+        <template v-if="column.key === 'handleStatus'">
+          <a @click="handlePreViewData(column,record)">{{record.handleStatus}}</a>
+        </template>
+        
+        <!-- 24H内为核查 -->
+        <template v-if="column.key === 'notDealHour24'">
+          <a @click="handlePreViewData(column,record)">{{record.notDealHour24}}</a>
+        </template>
+
+        <!-- 房屋翻新 -->
+        <template v-if="column.key === 'typeFanxinCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeFanxinCount}}</a>
+        </template>
+
+        <!-- 房屋加盖 -->
+        <template v-if="column.key === 'typeJiagaiCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeJiagaiCount}}</a>
+        </template>
+
+        <!-- 房屋翻建 -->
+        <template v-if="column.key === 'typeFanjianCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeFanjianCount}}</a>
+        </template>
+
+        <!-- 存量建设 -->
+        <template v-if="column.key === 'typeCunliangCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeCunliangCount}}</a>
+        </template>
+
+        <!-- 推土 -->
+        <template v-if="column.key === 'typeTuituCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeTuituCount}}</a>
+        </template>
+
+         <!-- 其他 -->
+         <template v-if="column.key === 'typeOtherCount'">
+          <a @click="handlePreViewData(column,record)">{{record.typeOtherCount}}</a>
+        </template>
+
+        <!-- 合法 -->
+        <template v-if="column.key === 'illegal0Count'">
+          <a @click="handlePreViewData(column,record)">{{record.illegal0Count}}</a>
+        </template>
+        <!-- 违法 -->
+        <template v-if="column.key === 'illegal1Count'">
+          <a @click="handlePreViewData(column,record)">{{record.illegal1Count}}</a>
+        </template>
+        <!-- 伪变化 -->
+        <template v-if="column.key === 'illegal2Count'">
+          <a @click="handlePreViewData(column,record)">{{record.illegal2Count}}</a>
+        </template>
+        <!-- 外业核实后确定违法数量 -->
+        <template v-if="column.key === 'illegal1Count1'">
+          <a @click="handlePreViewData(column,record)">{{record.illegal1Count}}</a>
+        </template>
+        <!-- 违法面积  -->
+        <!-- <template v-if="column.key === 'illegalHandleAreaList'">
+          <a @click="handlePreViewData(column,record)">{{record.illegalHandleAreaList}}</a>
+        </template> -->
+        <!-- 整改销号数 -->
+        <template v-if="column.key === 'illegalHandle2Status'">
+          <a @click="handlePreViewData(column,record)">{{record.illegalHandle2Status}}</a>
+        </template>
+        <!-- 销号面积 -->
+        <!-- <template v-if="column.key === 'illegalHandle2AreaList'">
+          <a @click="handlePreViewData(column,record)">{{record.illegalHandle2AreaList}}</a>
+        </template> -->
+        <!-- 尚未整改宗数 -->
+        <template v-if="column.key === 'illegalHandle01Status'">
+          <a @click="handlePreViewData(column,record)">{{record.illegalHandle01Status}}</a>
+        </template>
+        <!-- 尚未整改面积 -->
+        <!-- <template v-if="column.key === 'illegalHandle01AreaList'">
+          <a @click="handlePreViewData(column,record)">{{record.illegalHandle01AreaList}}</a>
+        </template> -->
+        <!-- 3日内未整改完成  -->
+        <template v-if="column.key === 'notComplete3'">
+          <a @click="handlePreViewData(column,record)">{{record.notComplete3}}</a>
+        </template>
+        <!-- 7日内未整改完成  -->
+        <template v-if="column.key === 'notComplete7'">
+          <a @click="handlePreViewData(column,record)">{{record.notComplete7}}</a>
+        </template>
+        <!-- 30日内未整改完成 -->
+        <template v-if="column.key === 'notComplete30'">
+          <a @click="handlePreViewData(column,record)">{{record.notComplete30}}</a>
+        </template>
+        <!-- 30日以上未整改完成 -->
+        <template v-if="column.key === 'notComplete30More'">
+          <a @click="handlePreViewData(column,record)">{{record.notComplete30More}}</a>
+        </template>
+        
       </template>
+
+
+
+
     </BasicTable>
 
 	<div class="data-preview-container" v-if="showRecordList">
-		<a-tabs  hide-add type="editable-card" @edit="onEdit">
-			<a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title" :closable="pane.closable">
-				{{ pane.content }}
+		<a-tabs  hide-add type="editable-card" @edit="onEdit" @change="handleTabChange">
+			<a-tab-pane v-for="(pane,index) in tablist" :key="index.toString()" :tab="pane.streetname+'-'+pane.label" :closable="pane.closable">
 			</a-tab-pane>
 		</a-tabs>
-		<RecordList></RecordList>
+		<RecordList :tablist="tablist" :currentListQuery="currentListQuery"></RecordList>
 		<div class="data-preview-container-option">
 			<div @click="handleCloseRecordList()">
 				<MinusOutlined />
@@ -137,10 +230,141 @@
       record,
     });
   }
+  function onEdit(targetKey: string){
+    tablist.splice(parseInt(targetKey),1);
+    if(tablist.length==0){
+      showRecordList.value = false;
+    }
+  }
 
-  function handlePreViewData(record:Recordable){
-	showRecordList.value = true;
-	console.log(record)
+  let currentListQuery = reactive<searchListSchema>({});
+  
+  function handleTabChange(e){
+    currentListQuery = reactive<searchListSchema>(tablist[e].listQuery)
+  }
+
+
+  // function remvoeTab(){
+
+  // }
+
+  const tablist = reactive<{streetname:string;label:string;listQuery:searchListSchema}[]>([])
+  // 查询条件
+  interface searchListSchema{
+    is_intact?:number;
+    streetid?:string;
+    identification_start_time?:string;
+    identification_end_time?:string;
+    page?:number;
+    limit?:number;
+    is_deal?:number;
+    is_not_deal_hour24?:number;
+    is_drawback?:number;
+    typeid?:number;
+    is_illegal?:number;
+    is_complete?:number;
+    handle_status_id?:number;
+    out_time_flag?:number;
+  }
+
+
+
+  // const searchForm = reactive<searchListSchema>({
+
+  // })
+  
+  function handlePreViewData(column,record:Recordable){
+
+    const searchForm = reactive<searchListSchema>({
+      streetid:record.streetid,
+      identification_start_time:"",
+      identification_end_time:"",
+      is_intact:1,
+      page:1,
+      limit:10,
+    })
+
+    switch(column.dataIndex){
+      case 'allCount':
+        break;
+      case 'handleStatus':
+        searchForm.is_deal = 1;
+        break;
+      case 'notDealHour24':
+        searchForm.is_not_deal_hour24 = 1;
+        searchForm.is_drawback = 0;
+        break;
+      case 'notDealHour24':
+        searchForm.is_not_deal_hour24 = 1;
+        searchForm.is_drawback = 0;
+        break;
+      case 'typeFanxinCount':
+        searchForm.typeid = record.typeid
+      case 'typeJiagaiCount':
+        searchForm.typeid = record.typeid
+      case 'typeFanjianCount':
+        searchForm.typeid = record.typeid
+      case 'typeCunliangCount':
+        searchForm.typeid = record.typeid
+      case 'typeTuituCount':
+        searchForm.typeid = record.typeid
+      case 'illegal0Count':
+        searchForm.is_illegal = 0;
+        searchForm.is_deal = 1;
+        break;
+      case 'illegal1Count':
+        searchForm.is_illegal = 1;
+        searchForm.is_deal = 1;
+        break;
+      case 'illegal2Count':
+        searchForm.is_illegal = 2;
+        searchForm.is_deal = 1;
+        break;
+      case 'illegal1Count1':
+        searchForm.is_illegal = 1;
+        searchForm.is_deal = 1;
+        break;
+      case 'illegalHandle2Status':
+        searchForm.handle_status_id = 1;
+        searchForm.is_deal = 1;
+        break;
+      case 'illegalHandle01Status':
+        searchForm.is_illegal = 1;
+        searchForm.is_deal = 1;
+        searchForm.is_complete = 0;
+        break;
+      case 'notComplete3':
+        searchForm.is_illegal = 1;
+        searchForm.is_complete = 0;
+        searchForm.out_time_flag = 1;
+        break;
+      case 'notComplete7':
+        searchForm.is_illegal = 1;
+        searchForm.is_complete = 0;
+        searchForm.out_time_flag = 2;
+        break;
+      case 'notComplete30':
+        searchForm.is_illegal = 1;
+        searchForm.is_complete = 0;
+        searchForm.out_time_flag = 4;
+        break;
+      case 'notComplete30More':
+        searchForm.is_illegal = 1;
+        searchForm.is_complete = 0;
+        searchForm.out_time_flag = 5;
+        break;
+    }
+    
+    let tabItem = {
+      streetname:record.streetname,
+      label:column.title,
+      listQuery:searchForm,
+    }
+
+    tablist.push(tabItem)
+    // console.log("TabList",tablist);
+    showRecordList.value = true;
+   
   }
 
   function handleEdit() {

src/views/demo/statistical/statistical.data.ts

@@ -31,6 +31,7 @@ export const columnsDataPreview: BasicColumn[] = [
     ]
   },{
     title: '下发疑似图斑类型',
+    dataIndex: '',
     children:[
       {
         title: '房屋翻新',
@@ -60,6 +61,7 @@ export const columnsDataPreview: BasicColumn[] = [
     ]
   },{
     title: '图斑判定',
+    dataIndex:"1",
     children:[
       {
         title: '合法',
@@ -77,11 +79,11 @@ export const columnsDataPreview: BasicColumn[] = [
     ]
   },{
     title: '新增违法图斑整改情况',
-    dataIndex: 'handle_status_name',
+    dataIndex: '2',
     children:[
       {
         title: '外业核实后确定违法数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegal1Count1',
         width: 120,
       },{
         title: '违法面积',
@@ -89,19 +91,19 @@ export const columnsDataPreview: BasicColumn[] = [
         width: 120,
       },{
         title: '整改销号数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle2Status',
         width: 120,
       },{
         title: '销号面积',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle2AreaList',
         width: 120,
       },{
         title: '尚未整改宗数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle01Status',
         width: 120,
       },{
         title: '未整改面积',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle01AreaList',
         width: 120,
       }
     ]
@@ -136,10 +138,10 @@ export const columnsDataPreview: BasicColumn[] = [
         width: 120,
       }
     ]
-  },{
+  },
+  {
     title: '备注',
-    dataIndex: 'createusername',
-    width: 200,
+    dataIndex: 'mask',
   }
 ];
 
@@ -167,6 +169,7 @@ export const columns: BasicColumn[] = [
     ]
   },{
     title: '下发疑似图斑类型',
+    dataIndex: '',
     children:[
       {
         title: '房屋翻新',
@@ -196,6 +199,7 @@ export const columns: BasicColumn[] = [
     ]
   },{
     title: '图斑判定',
+    dataIndex:"1",
     children:[
       {
         title: '合法',
@@ -213,11 +217,11 @@ export const columns: BasicColumn[] = [
     ]
   },{
     title: '新增违法图斑整改情况',
-    dataIndex: 'handle_status_name',
+    dataIndex: '2',
     children:[
       {
         title: '外业核实后确定违法数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegal1Count1',
         width: 120,
       },{
         title: '违法面积',
@@ -225,19 +229,19 @@ export const columns: BasicColumn[] = [
         width: 120,
       },{
         title: '整改销号数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle2Status',
         width: 120,
       },{
         title: '销号面积',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle2AreaList',
         width: 120,
       },{
         title: '尚未整改宗数',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle01Status',
         width: 120,
       },{
         title: '未整改面积',
-        dataIndex: 'beginTime',
+        dataIndex: 'illegalHandle01AreaList',
         width: 120,
       }
     ]
@@ -272,10 +276,10 @@ export const columns: BasicColumn[] = [
         width: 120,
       }
     ]
-  },{
+  },
+  {
     title: '备注',
-    dataIndex: 'createusername',
-    width: 200,
+    dataIndex: 'mask',
   }
 ];
 

src/views/demo/summaryverification/index.ts

@@ -0,0 +1,2 @@
+// 地图位置
+export { default as MapDetail } from './module/mapDetail.vue';

src/views/demo/summaryverification/module/index.data.ts

@@ -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',
+  },
+];

src/views/demo/summaryverification/module/index.vue

@@ -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>

src/views/demo/summaryverification/module/mapDetail.vue

@@ -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>

src/views/demo/system/dept/DeptTree.vue

@@ -3,14 +3,16 @@
       <BasicTree ref="asyncExpandTreeRef" title="部门列表" toolbar search
       treeWrapperClassName="h-[calc(100%-35px)] overflow-auto" loadData :actionList="actionList"
       :renderIcon="createIcon" :clickRowToExpand="false" :treeData="treeData" :fieldNames="{ key: 'id', title: 'name' }"
-      :defaultExpandAll="true" @select="handleSelect" />
+      @select="handleSelect" :load-data="onLoadData"/>
   </div>
 </template>
 <script lang="ts" setup>
   import { onMounted, ref , nextTick, unref} from 'vue';
 
   import { BasicTree, TreeItem ,TreeActionType} from '@/components/Tree';
-  import { getDeptList } from '@/api/demo/system';
+  import { getDeptList, getChildrenTree } from '@/api/demo/system';
+  import { isArray } from '@/utils/is';
+  import { uniq } from 'lodash-es';
 
   defineOptions({ name: 'DeptTree' });
 
@@ -21,9 +23,9 @@
 
   async function fetch() {
     treeData.value = (await getDeptList()) as unknown as TreeItem[];
-     // 展开全部
+     // 显示到一级
      nextTick(() => {
-      unref(asyncExpandTreeRef)?.expandAll(true);
+      unref(asyncExpandTreeRef)?.filterByLevel(1);
     });
   }
 
@@ -37,4 +39,30 @@
   defineExpose({
 		fetch
 	})
+  function onLoadData(treeNode) {
+    return new Promise((resolve: (value?: unknown) => void) => {
+      if (isArray(treeNode.children) && treeNode.children.length > 0) {
+        resolve();
+        return;
+      }
+      console.log(treeNode)
+      getChildrenTree({parentId: treeNode.id}).then(res => {
+        const asyncTreeAction: TreeActionType | null = unref(asyncExpandTreeRef);
+        console.log(res)
+        if (asyncTreeAction) {
+          const nodeChildren = res
+          asyncTreeAction.updateNodeByKey(treeNode.eventKey, { children: nodeChildren });
+          asyncTreeAction.setExpandedKeys(
+            uniq([treeNode.eventKey, ...asyncTreeAction.getExpandedKeys()]),
+          );
+        }
+        resolve();
+        return;
+      }).catch(err => {
+        console.log(err)
+        resolve();
+        return;
+      })
+    });
+  }
 </script>