diff --git a/src/api/demo/system.ts b/src/api/demo/system.ts
index 8f976942..8c61ea83 100644
--- a/src/api/demo/system.ts
+++ b/src/api/demo/system.ts
@@ -68,8 +68,8 @@ enum Api {
   DeleteNotice = '/api/DroneCaseinfo/UpdateDelMessage',
   UserList = '/api/users/load',
   // StatisticalList='/api/DroneCaseinfo/CaseSynthesisCensus',
-  StatisticalList = '/api/DroneCaseinfo/CaseSynthesisCensusSingle',
-  StatisticalListExport = '/api/DroneCaseinfo/ExportCaseSynthesisCensusStreet',
+  StatisticalList = '/api/DroneCaseInfoSingle/CaseSynthesisCensusSingle',
+  StatisticalListExport = '/api/DroneCaseInfoSingle/ExportCaseSynthesisCensusStreet',
   LoadNoticeDetail = '/api/DroneCaseinfo/LoadMessage',
   getChildrenTree = '/api/Orgs/LoadChildren',
   GetUserRoles = '/api/Roles/UserRoles',
diff --git a/src/components/MapboxMaps/MapComponent.vue b/src/components/MapboxMaps/MapComponent.vue
index 0f226cec..3257d929 100644
--- a/src/components/MapboxMaps/MapComponent.vue
+++ b/src/components/MapboxMaps/MapComponent.vue
@@ -283,6 +283,13 @@
       });
     });
 
+    function handlerLayerChange(){
+        var allLayers = map.getStyle().layers;
+        allLayers.forEach(function(layer){
+            map.moveLayer('detailsLayer', layer.id);
+            map.moveLayer('detailsLayerLine', layer.id);
+        });     
+    }
     // 地图图层控制
     const handlerLoadMapLayer =  ()=>{
         if(switchLayerControler){
@@ -336,18 +343,18 @@
           let layers = {
             name:item.name,   
             layer: layer,     
-            fixed:true,    
-            zoom:0,   
-            easeToOptions:{},   
-            mutex:false,          
-            mutexIdentity:generateUUID(),  
+            fixed:false,    
+            // zoom:0,   
+            easeToOptions:{},    
             active:false,    
             backgroundImage:VITE_GLOB_API_URL_VAR.value+image,  
             backgroundImageActive:"",
-            onVisibleChange:(visible:boolean)=>{}
+            onVisibleChange:(visible:boolean)=>{
+              handlerLayerChange()
+            }
           }
           baseLayers.push(layers)
-        })
+        });
         configlayers["地图底图"] = {
             "collapse": !0,
             "defaultCollapsed": !0,
@@ -357,7 +364,8 @@
         // 图层管理工具
         switchLayerControler = new SwitchLayerControl({
               name:"图层管理" ,       
-              position:"top-left",     
+              position:"top-left",    
+              showToTop:true, 
               layerGroups:configlayers
         });
         map.addControl(switchLayerControler,"top-left");
@@ -828,22 +836,22 @@
           type:"geojson",
           data:geojson
         })
-        map.addLayer(
-          {
-            "id": "detailsLayer",
-            "type": "fill",
-            "source": "detailsSource",
-            'layout':{
+        // map.addLayer(
+        //   {
+        //     "id": "detailsLayer",
+        //     "type": "fill",
+        //     "source": "detailsSource",
+        //     'layout':{
 
-            },
-            'paint': {
-              //填充颜色
-              'fill-color': '#3badc9', 
-              //透明度设置
-              "fill-opacity": 0.4,
-            }
-          }
-        )
+        //     },
+        //     'paint': {
+        //       //填充颜色
+        //       'fill-color': '#fcf003', 
+        //       //透明度设置
+        //       "fill-opacity": 0.5,
+        //     }
+        //   }
+        // )
         map.addLayer(
           {
             "id": "detailsLayerLine",
@@ -853,8 +861,8 @@
 
             },
             'paint': {
-              'line-color': '#3badc9',
-              'line-width': 2
+              'line-color': '#fcf003',
+              'line-width': 3
             }
           }
         )
diff --git a/src/components/Upload/src/components/ImageUpload.vue b/src/components/Upload/src/components/ImageUpload.vue
index b3d6b2cc..6871d80f 100644
--- a/src/components/Upload/src/components/ImageUpload.vue
+++ b/src/components/Upload/src/components/ImageUpload.vue
@@ -25,11 +25,9 @@
         <div style="margin-top: 8px">{{ t('component.upload.upload') }}</div>
       </div>
     </Upload>
-
     <Modal :open="previewOpen" :title="previewTitle" :footer="null" @cancel="handleCancel">
       <img alt="" style="width: 100%" :src="previewImage" />
     </Modal>
-
   </div>
 </template>
 
diff --git a/src/router/routes/modules/dashboard.ts b/src/router/routes/modules/dashboard.ts
index ed1650a3..1adc086c 100644
--- a/src/router/routes/modules/dashboard.ts
+++ b/src/router/routes/modules/dashboard.ts
@@ -3,97 +3,99 @@ import type { AppRouteModule } from '@/router/types';
 import { LAYOUT } from '@/router/constant';
 import { t } from '@/hooks/web/useI18n';
 
-const dashboard: AppRouteModule = {
-  path: '/dashboard',
-  name: 'Dashboard',
-  component: LAYOUT,
-  redirect: '/dashboard/analysis',
-  meta: {
-    orderNo: 10,
-    icon: 'ion:grid-outline',
-    title: t('routes.dashboard.dashboard'),
-  },
-  children: [
-    {
-      path: '/dashboard/analysis',
-      name: 'Analysis',
-      component: () => import('@/views/dashboard/analysis/index.vue'),
-      meta: {
-        // affix: true,
-        title: t('routes.dashboard.analysis'),
-      },
-    },
-    {
-      path: '/dashboard/test',
-      name: 'test',
-      component: () => import('@/views/dashboard/test/index.vue'),
-      meta: {
-        // affix: true,
-        title: t('routes.dashboard.test'),
-      },
-    },
-    {
-      path: '/formCallPage',
-      name: 'formCallPage',
-      meta: {
-        title: '表单调用',
-        hideMenu: true,
-      },
-      beforeEnter: (to: any, from: any, next: Function) => {
-        to.meta.title = to.query.name;
-        next();
-      },
-      component: () => import('@/views/demo/onlineform/formCall/index.vue'),
-    },
-    {
-      path: 'scheme_preview/:id',
-      name: 'SchemePreview',
-      meta: {
-        hideMenu: true,
-        title: t('routes.demo.workflow.scheme_preview'),
-        ignoreKeepAlive: true,
-        showMenu: false,
-        currentActiveMenu: '/workflow/scheme',
-      },
-      component: () => import('@/views/demo/workflow/scheme/preview.vue'),
-    },
-    {
-      path: 'create_preview/:id',
-      name: 'CreatePreview',
-      meta: {
-        hideMenu: true,
-        title: t('routes.demo.workflow.create_preview'),
-        ignoreKeepAlive: true,
-        showMenu: false,
-        currentActiveMenu: '/workflow/create',
-      },
-      component: () => import('@/views/demo/workflow/h5/create.vue'),
-    },
-    {
-      path: 'task_audit_preview/:id',
-      name: 'TaskAuditPreview',
-      meta: {
-        hideMenu: true,
-        title: t('routes.demo.workflow.task_audit_preview'),
-        ignoreKeepAlive: true,
-        showMenu: false,
-        currentActiveMenu: '/workflow/task',
-      },
-      component: () => import('@/views/demo/workflow/h5/audit.vue'),
-    },
-    {
-      path: 'task_look_preview/:id',
-      name: 'TaskLookPreview',
-      meta: {
-        hideMenu: true,
-        title: t('routes.demo.workflow.task_look_preview'),
-        ignoreKeepAlive: true,
-        showMenu: false,
-        currentActiveMenu: '/workflow/task',
-      },
-      component: () => import('@/views/demo/workflow/h5/look.vue'),
-    },
-  ],
+const dashboard: AppRouteModule =
+ {
+//   path: '/dashboard',
+//   name: 'Dashboard',
+//   component: LAYOUT,
+//   redirect: '/dashboard/analysis',
+//   meta: {
+//     orderNo: 10,
+//     icon: 'ion:grid-outline',
+//     title: t('routes.dashboard.dashboard'),
+//   },
+//   children: [
+//     {
+//       path: '/dashboard/analysis',
+//       name: 'Analysis',
+//       component: () => import('@/views/dashboard/analysis/index.vue'),
+//       meta: {
+//         // affix: true,
+//         title: t('routes.dashboard.analysis'),
+//       },
+//     },
+//     {
+//       path: '/dashboard/test',
+//       name: 'test',
+//       component: () => import('@/views/dashboard/test/index.vue'),
+//       meta: {
+//         // affix: true,
+//         title: t('routes.dashboard.test'),
+//       },
+//     },
+//     {
+//       path: '/formCallPage',
+//       name: 'formCallPage',
+//       meta: {
+//         title: '表单调用',
+//         hideMenu: true,
+//       },
+//       beforeEnter: (to: any, from: any, next: Function) => {
+//         to.meta.title = to.query.name;
+//         next();
+//       },
+//       component: () => import('@/views/demo/onlineform/formCall/index.vue'),
+//     },
+//     {
+//       path: 'scheme_preview/:id',
+//       name: 'SchemePreview',
+//       meta: {
+//         hideMenu: true,
+//         title: t('routes.demo.workflow.scheme_preview'),
+//         ignoreKeepAlive: true,
+//         showMenu: false,
+//         currentActiveMenu: '/workflow/scheme',
+//       },
+//       component: () => import('@/views/demo/workflow/scheme/preview.vue'),
+//     },
+//     {
+//       path: 'create_preview/:id',
+//       name: 'CreatePreview',
+//       meta: {
+//         hideMenu: true,
+//         title: t('routes.demo.workflow.create_preview'),
+//         ignoreKeepAlive: true,
+//         showMenu: false,
+//         currentActiveMenu: '/workflow/create',
+//       },
+//       component: () => import('@/views/demo/workflow/h5/create.vue'),
+//     },
+//     {
+//       path: 'task_audit_preview/:id',
+//       name: 'TaskAuditPreview',
+//       meta: {
+//         hideMenu: true,
+//         title: t('routes.demo.workflow.task_audit_preview'),
+//         ignoreKeepAlive: true,
+//         showMenu: false,
+//         currentActiveMenu: '/workflow/task',
+//       },
+//       component: () => import('@/views/demo/workflow/h5/audit.vue'),
+//     },
+//     {
+//       path: 'task_look_preview/:id',
+//       name: 'TaskLookPreview',
+//       meta: {
+//         hideMenu: true,
+//         title: t('routes.demo.workflow.task_look_preview'),
+//         ignoreKeepAlive: true,
+//         showMenu: false,
+//         currentActiveMenu: '/workflow/task',
+//       },
+//       component: () => import('@/views/demo/workflow/h5/look.vue'),
+//     },
+//   ],
 };
 
-// export default dashboard;
+
+export default dashboard;
diff --git a/src/views/demo/bootstraps/auditinfo/AuditProgress/index.vue b/src/views/demo/bootstraps/auditinfo/AuditProgress/index.vue
index 1f53b416..4f7664f3 100644
--- a/src/views/demo/bootstraps/auditinfo/AuditProgress/index.vue
+++ b/src/views/demo/bootstraps/auditinfo/AuditProgress/index.vue
@@ -34,7 +34,7 @@
         class="data-item"
         v-for="(item, index) in dataList"
         :key="index"
-        @click="emits('showInfo', item.areaid)"
+        @click="emits('showInfo', item)"
         v-if="dataList.length > 0"
       >
         <div class="name-div">
diff --git a/src/views/demo/bootstraps/auditinfo/index.vue b/src/views/demo/bootstraps/auditinfo/index.vue
index c06257a7..f99b3220 100644
--- a/src/views/demo/bootstraps/auditinfo/index.vue
+++ b/src/views/demo/bootstraps/auditinfo/index.vue
@@ -48,7 +48,7 @@
   const MapboxMap = defineAsyncComponent(() => import('@/components/MapboxMaps/MapComponent.vue'));
   const MapboxComponent = ref();
   const mapConfig = ref({ isShowMap: false });
-  
+
   function onMapboxLoad():void {
     getConfig({code:"mapsetting"}).then(res=>{
         mapConfig.value = JSON.parse(res.codeValue)
@@ -127,7 +127,7 @@
   }
   function changeTask(record) {
     if(record?.geomid){
-      handlerGetMapConfigByFormId(record.processcode);
+      // handlerGetMapConfigByFormId(record.processcode);
       let val = record.geomid
       let getGeomPrams = {
         TableName: 'drone_shp_data ',
diff --git a/src/views/demo/bootstraps/mapconfig/index.vue b/src/views/demo/bootstraps/mapconfig/index.vue
index 7633fba7..597cfc63 100644
--- a/src/views/demo/bootstraps/mapconfig/index.vue
+++ b/src/views/demo/bootstraps/mapconfig/index.vue
@@ -197,8 +197,11 @@
     getConfig({code:"mapsetting"}).then(res=>{
         mapConfig.value = JSON.parse(res.codeValue)
     })
+/*
 
 
+*/ 
+
     // const mapConfig = reactive({
     //   baseConfig:{
     //     state:true,
@@ -340,345 +343,7 @@
   
     // config
     // const config: any = inject('formConfig');
-    const config = {
-    "layoutType": 1,
-    "queryType": 1,
-    "left": {
-        "title": "左侧树形",
-        "colField": "",
-        "dataType": "1",
-        "dataIdKey": "",
-        "dataPIdKey": "",
-        "dataValueKey": "",
-        "dataLabelKey": "",
-        "colNames": [],
-        "options": [],
-        "dataCode": ""
-    },
-    "table": {
-        "isPage": true,
-        "columns": [
-            {
-                "key": "_input_39",
-                "label": "案件编号",
-                "value": "案件编号",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_15",
-                "label": "案件类型",
-                "value": "案件类型",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_3",
-                "label": "县区",
-                "value": "县区",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_10",
-                "label": "乡镇",
-                "value": "乡镇",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_11",
-                "label": "村/社区",
-                "value": "村/社区",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_520d1d8068f4492ea8c42ce9bb61b3cf",
-                "label": "农用地面积",
-                "value": "农用地面积",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_16",
-                "label": "案件描述",
-                "value": "案件描述",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_7",
-                "label": "判读人",
-                "value": "判读人",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_input_44",
-                "label": "下发时间",
-                "value": "下发时间",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            },
-            {
-                "key": "_card_group_155",
-                "label": "判定结果",
-                "value": "判定结果",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "CardGroup"
-            },
-            {
-                "key": "_input_21f2a3b800f8402c8161bb767bce5e75",
-                "label": "审核人",
-                "value": "审核人",
-                "width": 120,
-                "align": "left",
-                "isMinWidth": false,
-                "component": "Input"
-            }
-        ],
-        "querys": [
-            {
-                "key": "_input_39",
-                "label": "案件编号",
-                "type": "Input",
-                "componentProps": {
-                    "type": "text",
-                    "dataTable": "drone_caseinfo_single",
-                    "fieldName": "case_no"
-                }
-            },
-            {
-                "key": "_input_15",
-                "label": "案件类型",
-                "type": "Input",
-                "componentProps": {
-                    "type": "text",
-                    "dataTable": "drone_caseinfo_single",
-                    "fieldName": "typename"
-                }
-            },
-            {
-                "key": "_input_3",
-                "label": "县区",
-                "type": "Input",
-                "componentProps": {
-                    "type": "text",
-                    "dataTable": "drone_caseinfo_single",
-                    "fieldName": "countyname"
-                }
-            },
-            {
-                "key": "_input_10",
-                "label": "乡镇",
-                "type": "Input",
-                "componentProps": {
-                    "type": "text",
-                    "dataTable": "drone_caseinfo_single",
-                    "fieldName": "streetname"
-                }
-            },
-            {
-                "key": "_input_11",
-                "label": "村/社区",
-                "type": "Input",
-                "componentProps": {
-                    "type": "text",
-                    "dataTable": "drone_caseinfo_single",
-                    "fieldName": "communityname"
-                }
-            }
-        ],
-        "btns": [
-            {
-                "label": "导出",
-                "id": "Export",
-                "prop": "Export",
-                "icon": "ant-design:download-outlined",
-                "isRowBtn": false,
-                "class": "primary",
-                "sort": 2
-            },
-            {
-                "label": "编辑",
-                "id": "Edit",
-                "prop": "Edit",
-                "icon": "ant-design:edit-outlined",
-                "isRowBtn": true,
-                "class": "success",
-                "sort": 3,
-                "isWFlow": true,
-                "wFlowCode": "0000001"
-            },
-            {
-                "label": "详情",
-                "id": "Details",
-                "prop": "Details",
-                "icon": "ant-design:align-center-outlined",
-                "isRowBtn": true,
-                "class": "default",
-                "sort": 5
-            }
-        ],
-        "maps": {
-            "chooseLayer": "drone_shp_data",
-            "isAllowEditPolygon": false,
-            "isEnablePostionJump": true,
-            "width": 50,
-            "baseLayers": [
-                {
-                    "id": "1e0be368-1276-4d31-8b33-db837ea7b319",
-                    "name": "天地图注记",
-                    "description": "天地图注记",
-                    "type": 0,
-                    "image": "20240703\\2024070317544709510069.png",
-                    "relationTable": null,
-                    "createTime": "2024-07-03 17:54:49",
-                    "createId": "-1",
-                    "srid": null,
-                    "status": 1,
-                    "shpPath": null,
-                    "style": "{\"id\":\"be961f7a-2d92-4c66-8365-dba8904d14dd\",\"type\":\"raster\",\"source\":{\"type\":\"raster\",\"tiles\":[\"https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=b6585bc41ee16251dbe6b1af64f375d9\"],\"tileSize\":256},\"layout\":{\"visibility\":\"none\"},\"paint\":{}}",
-                    "vectorType": null,
-                    "attributeTable": null,
-                    "attributeField": null,
-                    "checked": false
-                },
-                {
-                    "id": "252d2353-22a3-4a62-8d8c-fb37e8254abd",
-                    "name": "费县高清影像服务",
-                    "description": "费县高清影像服务",
-                    "type": 0,
-                    "image": "20240704\\2024070410225737170146.jpg",
-                    "relationTable": null,
-                    "createTime": "2024-07-04 10:22:59",
-                    "createId": "-1",
-                    "srid": null,
-                    "status": 1,
-                    "shpPath": null,
-                    "style": "{\"id\":\"293577da-a17d-4c6f-bab3-6dd669bad36c\",\"type\":\"raster\",\"source\":{\"type\":\"raster\",\"tiles\":[\"http://60.213.14.14:8060/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},\"layout\":{\"visibility\":\"visible\"},\"paint\":{}}",
-                    "vectorType": null,
-                    "attributeTable": null,
-                    "attributeField": null,
-                    "checked": false
-                }
-            ],
-            "layers": [
-                {
-                    "name": "违建图斑",
-                    "layers": [
-                        {
-                            "id": "5ce51b19-5db3-47b9-a48f-e0a389294426",
-                            "name": "天空地案件图斑-关联属性",
-                            "description": "天空地案件图斑-关联属性",
-                            "type": 0,
-                            "image": null,
-                            "relationTable": "drone_shp_data",
-                            "createTime": "2024-06-21 15:50:26",
-                            "createId": "-1",
-                            "srid": "EPSG:4326",
-                            "status": 1,
-                            "shpPath": null,
-                            "style": "{\n    \"id\": \"5ce51b19-5db3-47b9-a48f-e0a389294426\",\n    \"type\": \"line\",\n    \"source\": {\n        \"type\": \"vector\",\n        \"tiles\": [\n            \"http://192.168.10.102:9023/api/DroneCaseinfo/QueryVectorTileByTable?z={z}&x={x}&y={y}&table=drone_shp_data&field=\\\"gid\\\",\"\n        ],\n        \"minzoom\": 1,\n        \"maxzoom\": 20\n    },\n    \"source-layer\": \"drone_shp_data\",\n    \"layout\": {\n        \"line-join\": \"round\",\n        \"line-cap\": \"round\"\n    },\n    \"paint\": {\n        \"line-color\": \"#408eff\",\n        \"line-width\": 3\n    },\n    \"state\": {\n        \"attributeField\": \"geomid\",\n        \"attributeTable\": \"drone_caseinfo_single\"\n    }\n}",
-                            "vectorType": "面",
-                            "attributeTable": "drone_caseinfo_single",
-                            "attributeField": "geomid",
-                            "checked": false
-                        }
-                    ]
-                }
-            ],
-            "isShowMap": true,
-            "mode": "3D",
-            "angle": 0,
-            "zoom": 13,
-            "minZoom": 1,
-            "maxZoom": 18,
-            "center": "117,39"
-        },
-        "sidx": "",
-        "isDESC": false
-    },
-    "btns": [
-        {
-            "label": "新增",
-            "id": "Add",
-            "prop": "Add",
-            "icon": "ant-design:plus-outlined",
-            "isRowBtn": false,
-            "class": "primary",
-            "sort": 0
-        },
-        {
-            "label": "导入",
-            "id": "Import",
-            "prop": "Import",
-            "icon": "ant-design:upload-outlined",
-            "isRowBtn": false,
-            "class": "success",
-            "sort": 1
-        },
-        {
-            "label": "导出",
-            "id": "Export",
-            "prop": "Export",
-            "icon": "ant-design:download-outlined",
-            "isRowBtn": false,
-            "class": "primary",
-            "sort": 2
-        },
-        {
-            "label": "编辑",
-            "id": "Edit",
-            "prop": "Edit",
-            "icon": "ant-design:edit-outlined",
-            "isRowBtn": true,
-            "class": "success",
-            "sort": 3,
-            "isWFlow": true,
-            "wFlowCode": "0000001"
-        },
-        {
-            "label": "删除",
-            "id": "Delete",
-            "prop": "Delete",
-            "icon": "ant-design:delete-outlined",
-            "isRowBtn": true,
-            "class": "error",
-            "sort": 4
-        },
-        {
-            "label": "详情",
-            "id": "Details",
-            "prop": "Details",
-            "icon": "ant-design:align-center-outlined",
-            "isRowBtn": true,
-            "class": "default",
-            "sort": 5
-        }
-    ]
-};
+    const config = {}
     // const mapConfig = ref(config.table.maps);
   
   
diff --git a/src/views/demo/layermanagement/components/VisitSource.vue b/src/views/demo/layermanagement/components/VisitSource.vue
new file mode 100644
index 00000000..56a2e318
--- /dev/null
+++ b/src/views/demo/layermanagement/components/VisitSource.vue
@@ -0,0 +1,82 @@
+<template>
+  <Card title="访问来源" :loading="loading">
+    <div ref="chartRef" :style="{ width, height }"></div>
+  </Card>
+</template>
+<script lang="ts" setup>
+  import { Ref, ref, watch } from 'vue';
+  import { Card } from 'ant-design-vue';
+  import { useECharts } from '@/hooks/web/useECharts';
+
+  const props = defineProps({
+    loading: Boolean,
+    width: {
+      type: String as PropType<string>,
+      default: '100%',
+    },
+    height: {
+      type: String as PropType<string>,
+      default: '300px',
+    },
+  });
+  const chartRef = ref<HTMLDivElement | null>(null);
+  const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
+
+  watch(
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        tooltip: {
+          trigger: 'item',
+        },
+        legend: {
+          bottom: '1%',
+          left: 'center',
+        },
+        series: [
+          {
+            color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+            name: '访问来源',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2,
+            },
+            label: {
+              show: false,
+              position: 'center',
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: '12',
+                fontWeight: 'bold',
+              },
+            },
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: 1048, name: '搜索引擎' },
+              { value: 735, name: '直接访问' },
+              { value: 580, name: '邮件营销' },
+              { value: 484, name: '联盟广告' },
+            ],
+            animationType: 'scale',
+            animationEasing: 'exponentialInOut',
+            animationDelay: function () {
+              return Math.random() * 100;
+            },
+          },
+        ],
+      });
+    },
+    { immediate: true },
+  );
+</script>
diff --git a/src/views/demo/layermanagement/index.vue b/src/views/demo/layermanagement/index.vue
new file mode 100644
index 00000000..713fae45
--- /dev/null
+++ b/src/views/demo/layermanagement/index.vue
@@ -0,0 +1,142 @@
+<template>
+  <div class="w-full" style="height:100%;">
+
+    <MapboxMaps
+      :layers="layers"
+      :location="location"
+      @handlerDrawComplete="handlerDrawComplete"
+      ref="MapboxComponent"
+    />
+
+  </div>
+</template>
+<script lang="ts" setup>
+
+
+  import MapboxMaps from '@/components/MapboxMaps/MapboxMap.vue';
+  // import MapboxMaps from '@/components/MapboxMaps/MapComponent.vue';
+  import {ref,reactive} from 'vue';
+  import { DrawingType } from '@/enums/mapEnum';
+
+
+  const mapOptions = {
+    center: [118.556717,35.80391],
+    zoom: 8,
+  };
+
+  // 展示的图层列表
+  const layers = reactive([
+        {
+            id:1,
+            name:"沂水县道路中心线",
+            checked:false,
+            layer:{
+                'id': 'roadnetLine1',
+                'type': 'line',
+                'source': {
+                    type: 'vector',
+                    tiles: [ 'http://192.168.10.102:9020/api/DroneCaseinfo/QueryVectorTileByTable?z={z}&x={x}&y={y}&table=yishuixian&X-Token=1ded3fe7'],
+                    minzoom: 1,
+                    maxzoom: 20
+                },
+                "source-layer": "yishuixian",
+                'layout': {
+                    'line-join': 'round',
+                    'line-cap': 'round'
+                },
+                'paint': {
+                    'line-color': [
+                    "case",
+                    ["==", ["get", "handle_status_id"], 0],
+                    "#E6A23C",
+                    ["==", ["get", "handle_status_id"], 1],
+                    "#409EFF",
+                    ["==", ["get", "handle_status_id"], 2],
+                    "#67C23A",
+                    // 默认
+                    "#67C23A",
+                    ],
+                    'line-width': 1
+                }
+            }
+        }
+    ])
+
+  // 图层定位数据
+  const location = reactive([118.556717,35.80391])
+
+  // 图层绘制类型 
+  const type = ref('add')
+
+  // 图斑数据
+  // const feature ="LINESTRING (118.55483239594203 35.81329409678203, 118.54889167836416 35.806406839795216, 118.55647247134772 35.80285975465173, 118.56157492816281 35.803303140294986)"
+  
+  //  const feature = "POLYGON ((118.54774514802972 35.80786133598188, 118.54515277045988 35.79816597053564, 118.55919536113471 35.80085134034624, 118.56021460056033 35.80462789316549, 118.5595188628206 35.80695604583504, 118.5580066425723 35.80815336506183, 118.54774514802972 35.80786133598188))"
+
+let drawFeatures = [
+  {
+    "columnName": "mapgeom",
+    "value": "MULTIPOLYGON (((118.55901684631719 35.8045110934671, 118.55946931550466 35.80449259041045, 118.55946551324392 35.80463444717644, 118.559024450841 35.80464061486234, 118.55901684631719 35.8045110934671)))"
+  }, {
+    "columnName": "mapgeom",
+    "value": "POLYGON ((118.5591119028685 35.804344565958516, 118.5594579087177 35.804344565958516, 118.55945410645693 35.80424279914757, 118.55910049608158 35.80423663146167, 118.5591119028685 35.804344565958516))"
+  },  {
+    "columnName": "mapgeom",
+    "value": "POLYGON ((118.55922520818172 35.8049069756666, 118.5594647506927 35.80490080800186, 118.55945714616884 35.80477128705068, 118.55921380139475 35.804783622380114, 118.55922520818172 35.8049069756666))"
+  }
+];
+
+    // 绘图完成返回geom
+  const handlerDrawComplete = (geom)=>{
+    console.log("绘制完成返回的图斑",geom);
+  }
+
+  // 地图组件
+  const MapboxComponent = ref()
+
+  // 添加 或者 编辑图斑
+  // setTimeout(function(){
+  //   // 添加图斑
+  //   // MapboxComponent.value.handlerDraw()
+  //   // 编辑图斑
+  //   MapboxComponent.value.handlerDraw(drawFeatures)
+  // },3000)
+
+  
+
+
+  // setTimeout(function(){
+  //   // MapboxComponent.value.handlerDraw()
+  // },6000)
+
+  // 图斑定位
+  // setTimeout(function(){
+  //   MapboxComponent.value.handlerLocation([118.556717,35.80391]);
+  // },6000)
+
+  
+
+
+
+  const mapDrawControl: DrawingType[] = [DrawingType.Polygon, DrawingType.Line];
+  const mapOnLoad = (map) => {
+
+    // map 对象
+    console.log('map::: ', map);
+    // mapU封装对象
+    console.log('map.U::: ', map.U);
+    // 测试地址
+    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('sourceId', testSource).addLineLayer('layerId', {
+      source: 'sourceId',
+      'source-layer': 'lindi', // source-layer对应数据库的表名
+    });
+  };
+  //地图绘制的回调
+  const handlerMapDraw = (type: string, data: any) => {
+    console.log('data::: ', data);
+    console.log('type::: ', type);
+  };
+</script>
diff --git a/src/views/demo/onlineform/formCall/index.vue b/src/views/demo/onlineform/formCall/index.vue
index 3fab7675..a25fb2ae 100644
--- a/src/views/demo/onlineform/formCall/index.vue
+++ b/src/views/demo/onlineform/formCall/index.vue
@@ -607,6 +607,8 @@
           // showFormModalData.value = toProps;
           // openShowFormModal.value = true;
           // 根据ids获取图斑
+          console.log(rows);
+          console.log("formConfig");
           try {
             console.log('formConfig', formConfig);
             handlerShowGeomtrys(formConfig, rows[0]);
diff --git a/src/views/demo/system/layermanagement/components/VisitSource.vue b/src/views/demo/system/layermanagement/components/VisitSource.vue
new file mode 100644
index 00000000..56a2e318
--- /dev/null
+++ b/src/views/demo/system/layermanagement/components/VisitSource.vue
@@ -0,0 +1,82 @@
+<template>
+  <Card title="访问来源" :loading="loading">
+    <div ref="chartRef" :style="{ width, height }"></div>
+  </Card>
+</template>
+<script lang="ts" setup>
+  import { Ref, ref, watch } from 'vue';
+  import { Card } from 'ant-design-vue';
+  import { useECharts } from '@/hooks/web/useECharts';
+
+  const props = defineProps({
+    loading: Boolean,
+    width: {
+      type: String as PropType<string>,
+      default: '100%',
+    },
+    height: {
+      type: String as PropType<string>,
+      default: '300px',
+    },
+  });
+  const chartRef = ref<HTMLDivElement | null>(null);
+  const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
+
+  watch(
+    () => props.loading,
+    () => {
+      if (props.loading) {
+        return;
+      }
+      setOptions({
+        tooltip: {
+          trigger: 'item',
+        },
+        legend: {
+          bottom: '1%',
+          left: 'center',
+        },
+        series: [
+          {
+            color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
+            name: '访问来源',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2,
+            },
+            label: {
+              show: false,
+              position: 'center',
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: '12',
+                fontWeight: 'bold',
+              },
+            },
+            labelLine: {
+              show: false,
+            },
+            data: [
+              { value: 1048, name: '搜索引擎' },
+              { value: 735, name: '直接访问' },
+              { value: 580, name: '邮件营销' },
+              { value: 484, name: '联盟广告' },
+            ],
+            animationType: 'scale',
+            animationEasing: 'exponentialInOut',
+            animationDelay: function () {
+              return Math.random() * 100;
+            },
+          },
+        ],
+      });
+    },
+    { immediate: true },
+  );
+</script>
diff --git a/src/views/demo/system/layermanagement/index.vue b/src/views/demo/system/layermanagement/index.vue
new file mode 100644
index 00000000..713fae45
--- /dev/null
+++ b/src/views/demo/system/layermanagement/index.vue
@@ -0,0 +1,142 @@
+<template>
+  <div class="w-full" style="height:100%;">
+
+    <MapboxMaps
+      :layers="layers"
+      :location="location"
+      @handlerDrawComplete="handlerDrawComplete"
+      ref="MapboxComponent"
+    />
+
+  </div>
+</template>
+<script lang="ts" setup>
+
+
+  import MapboxMaps from '@/components/MapboxMaps/MapboxMap.vue';
+  // import MapboxMaps from '@/components/MapboxMaps/MapComponent.vue';
+  import {ref,reactive} from 'vue';
+  import { DrawingType } from '@/enums/mapEnum';
+
+
+  const mapOptions = {
+    center: [118.556717,35.80391],
+    zoom: 8,
+  };
+
+  // 展示的图层列表
+  const layers = reactive([
+        {
+            id:1,
+            name:"沂水县道路中心线",
+            checked:false,
+            layer:{
+                'id': 'roadnetLine1',
+                'type': 'line',
+                'source': {
+                    type: 'vector',
+                    tiles: [ 'http://192.168.10.102:9020/api/DroneCaseinfo/QueryVectorTileByTable?z={z}&x={x}&y={y}&table=yishuixian&X-Token=1ded3fe7'],
+                    minzoom: 1,
+                    maxzoom: 20
+                },
+                "source-layer": "yishuixian",
+                'layout': {
+                    'line-join': 'round',
+                    'line-cap': 'round'
+                },
+                'paint': {
+                    'line-color': [
+                    "case",
+                    ["==", ["get", "handle_status_id"], 0],
+                    "#E6A23C",
+                    ["==", ["get", "handle_status_id"], 1],
+                    "#409EFF",
+                    ["==", ["get", "handle_status_id"], 2],
+                    "#67C23A",
+                    // 默认
+                    "#67C23A",
+                    ],
+                    'line-width': 1
+                }
+            }
+        }
+    ])
+
+  // 图层定位数据
+  const location = reactive([118.556717,35.80391])
+
+  // 图层绘制类型 
+  const type = ref('add')
+
+  // 图斑数据
+  // const feature ="LINESTRING (118.55483239594203 35.81329409678203, 118.54889167836416 35.806406839795216, 118.55647247134772 35.80285975465173, 118.56157492816281 35.803303140294986)"
+  
+  //  const feature = "POLYGON ((118.54774514802972 35.80786133598188, 118.54515277045988 35.79816597053564, 118.55919536113471 35.80085134034624, 118.56021460056033 35.80462789316549, 118.5595188628206 35.80695604583504, 118.5580066425723 35.80815336506183, 118.54774514802972 35.80786133598188))"
+
+let drawFeatures = [
+  {
+    "columnName": "mapgeom",
+    "value": "MULTIPOLYGON (((118.55901684631719 35.8045110934671, 118.55946931550466 35.80449259041045, 118.55946551324392 35.80463444717644, 118.559024450841 35.80464061486234, 118.55901684631719 35.8045110934671)))"
+  }, {
+    "columnName": "mapgeom",
+    "value": "POLYGON ((118.5591119028685 35.804344565958516, 118.5594579087177 35.804344565958516, 118.55945410645693 35.80424279914757, 118.55910049608158 35.80423663146167, 118.5591119028685 35.804344565958516))"
+  },  {
+    "columnName": "mapgeom",
+    "value": "POLYGON ((118.55922520818172 35.8049069756666, 118.5594647506927 35.80490080800186, 118.55945714616884 35.80477128705068, 118.55921380139475 35.804783622380114, 118.55922520818172 35.8049069756666))"
+  }
+];
+
+    // 绘图完成返回geom
+  const handlerDrawComplete = (geom)=>{
+    console.log("绘制完成返回的图斑",geom);
+  }
+
+  // 地图组件
+  const MapboxComponent = ref()
+
+  // 添加 或者 编辑图斑
+  // setTimeout(function(){
+  //   // 添加图斑
+  //   // MapboxComponent.value.handlerDraw()
+  //   // 编辑图斑
+  //   MapboxComponent.value.handlerDraw(drawFeatures)
+  // },3000)
+
+  
+
+
+  // setTimeout(function(){
+  //   // MapboxComponent.value.handlerDraw()
+  // },6000)
+
+  // 图斑定位
+  // setTimeout(function(){
+  //   MapboxComponent.value.handlerLocation([118.556717,35.80391]);
+  // },6000)
+
+  
+
+
+
+  const mapDrawControl: DrawingType[] = [DrawingType.Polygon, DrawingType.Line];
+  const mapOnLoad = (map) => {
+
+    // map 对象
+    console.log('map::: ', map);
+    // mapU封装对象
+    console.log('map.U::: ', map.U);
+    // 测试地址
+    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('sourceId', testSource).addLineLayer('layerId', {
+      source: 'sourceId',
+      'source-layer': 'lindi', // source-layer对应数据库的表名
+    });
+  };
+  //地图绘制的回调
+  const handlerMapDraw = (type: string, data: any) => {
+    console.log('data::: ', data);
+    console.log('type::: ', type);
+  };
+</script>