feat: 初始化仓库

2024-01-10 15:15:12 +08:00 · 2024-01-10 15:15:12 +08:00 · 8d8aa13483
commit 8d8aa13483
parent abe2127cbb
352 changed files with 23265 additions and 10505 deletions
--- a/.changeset/config.json
+++ b/.changeset/config.json
@ -5,7 +5,7 @@
  "fixed": [],
  "linked": [],
  "access": "public",
-  "baseBranch": "origin/master",
+  "baseBranch": "master",
  "updateInternalDependencies": "patch",
  "ignore": []
 }
--- a/.npmrc
+++ b/.npmrc
@ -1,3 +1,4 @@
+registry="https://registry.npm.taobao.org/"
@zhst:registry="http://10.0.0.77:4874"
 strict-peer-dependencies=false
 ignore-workspace-root-check=true
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@ -0,0 +1,8 @@
+{
+  "cSpell.words": [
+    "ahooks",
+    "antd",
+    "COMPATER",
+    "zhst"
+  ]
+}
--- a/docs/index.md
+++ b/docs/index.md
@ -4,10 +4,10 @@ hero:
  description: 前端工具库合集
  actions:
    - text: 快速上手
-      link: /hooks
+      link: /bizs
 features:
  - title: biz
-    emoji: 🌈
+    emoji: 🍑
    description: 业务库
  - title: hooks
    emoji: 💎
@ -15,4 +15,49 @@ features:
  - title: func
    emoji: 🌈
    description: 常用函数库
+  - title: meta
+    emoji: 🧸
+    description: 原子组件库
 ---
+
+## 本文档食用说明
+
+目前在开发中的项目为：@zhst/bizs、@zhst/hooks、@zhst/meta、@zhst/func。
+
+bizs: 基于@zhst/hooks、@zhst/meta、@zhst/func 开发，基本贴近于业务。<Badge>doing</Badge>
+
+meta：基于 antd 开发，作为公司的定制化原子组件。<Badge>doing</Badge>
+
+hooks：基于 ahooks、@zhst/func 定制化二次开发。<Badge>doing</Badge>
+
+func：基于 lodash-es 定制化二次开发 (由于utils包名被使用了)<Badge>doing</Badge>
+
+## 后续构思
+
+想做一个，基于智慧视通开发场景和业务场景的前端技术流程化方案，希望它能渗透到整个研发的所有流程中。
+
+比如：代码规范、git提交规范、物料库、基于electron的前端工具客户端（可集成物料库、图片上传小工具）、api自动生成...
+
+:::info{title=@zhst/lint}
+lint工具库，包含：eslint-config、eslint-plugin、commit-lint
+:::
+
+:::info{title=@zhst/metarial}
+物料库，可以直接通过 clone npm 仓库的形式生成模板页面
+:::
+
+:::info{title=@zhst/app}
+基于 electron 的前端客户端工具，初期功能构思方案有：文件上传、git 仓库管理、物料库可视化页面一键生成
+:::
+
+:::info{title=@zhst/autoapi}
+接口一键生成工具
+:::
+
+:::info{title=@zhst/types}
+类型定义库
+:::
+
+:::info{title=@zhst/constants}
+静态变量枚举库
+:::
--- a/global.d.ts
+++ b/global.d.ts
@ -0,0 +1,3 @@
+declare module '@zhst/func';
+declare module '@zhst/hooks';
+declare module '@zhst/meta';
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@ -1,5 +1,15 @@
 # @zhst/biz

+## 0.2.4
+
+### Patch Changes
+
+- feat: 新增 meta 包
+- Updated dependencies
+  - @zhst/func@0.2.4
+  - @zhst/hooks@0.2.4
+  - @zhst/meta@0.2.4
+
 ## 0.2.3

 ### Patch Changes
--- a/packages/biz/README.md
+++ b/packages/biz/README.md
@ -1,6 +1,6 @@
 ## 介绍

-业务库
+基于 @zhst/meta(元组件)、 @zhst/hooks、@zhst/func 开发，内容上会更贴近业务.

 ## 安装

--- a/packages/biz/es/BigImageModal/components/navigation/index.js
+++ b/packages/biz/es/BigImageModal/components/navigation/index.js
@ -0,0 +1,27 @@
+import * as React from 'react';
+import classnames from 'classnames';
+import { Button } from 'antd';
+import { Icon } from '@zhst/meta';
+import "./index.less";
+var componentName = "zhst-image__nav";
+var Navigation = function Navigation(props) {
+  var show = props.show,
+    prev = props.prev,
+    next = props.next,
+    disabled = props.disabled,
+    onClick = props.onClick,
+    className = props.className,
+    color = props.color;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classnames("".concat(componentName), prev && "".concat(componentName, "-prev"), next && "".concat(componentName, "-next"), disabled && "".concat(componentName, "--disable"), !show && "".concat(componentName, "--hide"), className)
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "text",
+    disabled: disabled,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Icon, {
+    size: 28,
+    color: color,
+    icon: prev ? 'icon-qiehuanzuo' : 'icon-qiehuanyou'
+  })));
+};
+export default Navigation;
--- a/packages/biz/es/BigImageModal/components/navigation/index.less
+++ b/packages/biz/es/BigImageModal/components/navigation/index.less
@ -0,0 +1,44 @@
+.zhst-image__nav {
+  position: absolute;
+  display: flex;
+  width: 48px;
+  height: 100%;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  font-size: 0;
+
+  &>button {
+    & span {
+      display: flex;
+    }
+  }
+
+  :global {
+    i:hover {
+      color: #f0f0f0 !important;
+    }
+  }
+
+  &--disable {
+    :global {
+      i {
+        color: #f0f0f0;
+        cursor: not-allowed !important;
+      }
+    }
+  }
+
+  &--hide {
+    display: none;
+  }
+
+  &-prev {
+    left: 20px;
+  }
+
+  &-next {
+    right: 20px;
+  }
+}
--- a/packages/biz/es/BigImageModal/images/emptyImage.png
+++ b/packages/biz/es/BigImageModal/images/emptyImage.png
--- a/packages/biz/es/BigImageModal/images/percent_background.png
+++ b/packages/biz/es/BigImageModal/images/percent_background.png
--- a/packages/biz/es/BigImageModal/index.js
+++ b/packages/biz/es/BigImageModal/index.js
--- a/packages/biz/es/BigImageModal/index.less
+++ b/packages/biz/es/BigImageModal/index.less
--- a/packages/biz/es/BigImageModal/index.temp.js
+++ b/packages/biz/es/BigImageModal/index.temp.js
--- a/packages/biz/es/BigImageModal/mock.js
+++ b/packages/biz/es/BigImageModal/mock.js
@ -0,0 +1,854 @@
+export var IMAGE_DATA = {
+  "enAbleDeleteFeature": true,
+  "tabsFilter": ["COMPATER", "NORMAL"],
+  "dataSources": [{
+    "objectId": "1742110565582518272",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.7163062,
+    "timestamp": 1704186491979,
+    "deviceId": "129533",
+    "id": "129533",
+    "name": "4楼门口过道人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.125,
+    "latitude": 30.280500411987305,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "38",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742110565582518272",
+      "solutionId": "1",
+      "deviceId": "129533",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742110532019697664",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704186491979",
+      "width": 0,
+      "height": 0,
+      "originWidth": 1920,
+      "originHeight": 1080,
+      "offsetTime": "24714687",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.603125,
+      "y": 0.3314815,
+      "w": 0.0578125,
+      "h": 0.2712963
+    },
+    "bboxExtInFrame": {
+      "x": 0.546875,
+      "y": 0.2638889,
+      "w": 0.17135416,
+      "h": 0.40648147
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+    "confidence": 0.817271,
+    "sourceObjectId": "1742110565603489792",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 1,
+    "subObjectType": ["OBJECT_TYPE_FACE"],
+    "subObjectIds": ["1742110532015503360"],
+    "cameraInfo": {
+      "id": "129533",
+      "name": "4楼门口过道人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.125,
+      "latitude": 30.280500411987305,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "38",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129533/1742110565582518272.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129533/1742110565582518272.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129533",
+    "cameraName": "4楼门口过道人脸"
+  }, {
+    "objectId": "1742092780462684161",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.70154816,
+    "timestamp": 1704182251640,
+    "deviceId": "129533",
+    "id": "129533",
+    "name": "4楼门口过道人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.125,
+    "latitude": 30.280500411987305,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "38",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742092780462684161",
+      "solutionId": "1",
+      "deviceId": "129533",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742092746237163520",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704182251640",
+      "width": 0,
+      "height": 0,
+      "originWidth": 1920,
+      "originHeight": 1080,
+      "offsetTime": "20474348",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.63177085,
+      "y": 0.38333333,
+      "w": 0.078125,
+      "h": 0.3537037
+    },
+    "bboxExtInFrame": {
+      "x": 0.55885416,
+      "y": 0.29537037,
+      "w": 0.22447917,
+      "h": 0.5314815
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780462684161.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780768868352.jpg",
+    "confidence": 0.888334,
+    "sourceObjectId": "1742092780768868352",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 1,
+    "subObjectType": ["OBJECT_TYPE_FACE"],
+    "subObjectIds": ["1742092746232969217"],
+    "cameraInfo": {
+      "id": "129533",
+      "name": "4楼门口过道人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.125,
+      "latitude": 30.280500411987305,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "38",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129533/1742092780462684161.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129533/1742092780462684161.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780462684161.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780768868352.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129533",
+    "cameraName": "4楼门口过道人脸"
+  }, {
+    "objectId": "1742092514409592832",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.703765,
+    "timestamp": 1704182186451,
+    "deviceId": "129529",
+    "id": "129529",
+    "name": "4入口人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.12100219726562,
+    "latitude": 30.280099868774414,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "34",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742092514409592832",
+      "solutionId": "1",
+      "deviceId": "129529",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742092482440607744",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704182186451",
+      "width": 0,
+      "height": 0,
+      "originWidth": 2560,
+      "originHeight": 1440,
+      "offsetTime": "20409182",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.6195313,
+      "y": 0.24583334,
+      "w": 0.09804688,
+      "h": 0.41944444
+    },
+    "bboxExtInFrame": {
+      "x": 0.53515625,
+      "y": 0.14027777,
+      "w": 0.26640624,
+      "h": 0.63125
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+    "confidence": 0.92494,
+    "sourceObjectId": "1742092515508500480",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 1,
+    "subObjectType": ["OBJECT_TYPE_FACE"],
+    "subObjectIds": ["1742092482432219136"],
+    "cameraInfo": {
+      "id": "129529",
+      "name": "4入口人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.12100219726562,
+      "latitude": 30.280099868774414,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "34",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129529/1742092514409592832.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129529/1742092514409592832.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129529",
+    "cameraName": "4入口人脸"
+  }],
+  "selectIndex": 4,
+  "disableBtn": [0, 1, 4, 20],
+  "dataSource": [{
+    "objectId": "1742110565582518272",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.7163062,
+    "timestamp": 1704186491979,
+    "deviceId": "129533",
+    "id": "129533",
+    "name": "4楼门口过道人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.125,
+    "latitude": 30.280500411987305,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "38",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742110565582518272",
+      "solutionId": "1",
+      "deviceId": "129533",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742110532019697664",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704186491979",
+      "width": 0,
+      "height": 0,
+      "originWidth": 1920,
+      "originHeight": 1080,
+      "offsetTime": "24714687",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.603125,
+      "y": 0.3314815,
+      "w": 0.0578125,
+      "h": 0.2712963
+    },
+    "bboxExtInFrame": {
+      "x": 0.546875,
+      "y": 0.2638889,
+      "w": 0.17135416,
+      "h": 0.40648147
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+    "confidence": 0.817271,
+    "sourceObjectId": "1742110565603489792",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 1,
+    "subObjectType": ["OBJECT_TYPE_FACE"],
+    "subObjectIds": ["1742110532015503360"],
+    "cameraInfo": {
+      "id": "129533",
+      "name": "4楼门口过道人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.125,
+      "latitude": 30.280500411987305,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "38",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129533/1742110565582518272.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129533/1742110565582518272.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129533",
+    "cameraName": "4楼门口过道人脸"
+  }, {
+    "objectId": "1742092680994764802",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.7007122,
+    "timestamp": 1704182225679,
+    "deviceId": "129533",
+    "id": "129533",
+    "name": "4楼门口过道人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.125,
+    "latitude": 30.280500411987305,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "38",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742092680994764802",
+      "solutionId": "1",
+      "deviceId": "129533",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742092646219790337",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704182225679",
+      "width": 0,
+      "height": 0,
+      "originWidth": 1920,
+      "originHeight": 1080,
+      "offsetTime": "20448387",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.5265625,
+      "y": 0.49537036,
+      "w": 0.104166664,
+      "h": 0.35833332
+    },
+    "bboxExtInFrame": {
+      "x": 0.465625,
+      "y": 0.40648147,
+      "w": 0.22708334,
+      "h": 0.537963
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092680994764802.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092681720379392.jpg",
+    "confidence": 0.769764,
+    "sourceObjectId": "1742092681720379392",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 0,
+    "subObjectType": [],
+    "subObjectIds": [],
+    "cameraInfo": {
+      "id": "129533",
+      "name": "4楼门口过道人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.125,
+      "latitude": 30.280500411987305,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "38",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129533/1742092680994764802.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129533/1742092680994764802.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092680994764802.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092681720379392.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129533",
+    "cameraName": "4楼门口过道人脸"
+  }, {
+    "objectId": "1742092514409592832",
+    "condition": {
+      "featureInfo": null,
+      "featureData": "AAAAAAAAAAAAAAAAAAAAAAAA==",
+      "imageData": "",
+      "alg": "VERSION_REID_HEAD_ATTR",
+      "rect": {
+        "x": 0.271875,
+        "y": 0.32222223,
+        "w": 0.2859375,
+        "h": 0.67777777
+      },
+      "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+      "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+    },
+    "score": 0.703765,
+    "timestamp": 1704182186451,
+    "deviceId": "129529",
+    "id": "129529",
+    "name": "4入口人脸",
+    "dirid": "0",
+    "status": "1",
+    "longitude": 120.12100219726562,
+    "latitude": 30.280099868774414,
+    "caseId": "0",
+    "caseGroup": "",
+    "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+    "extendInfo": {
+      "vmsPlatformId": "29",
+      "vmsChannel": "34",
+      "vmsCameraDecoderTag": "hikvision",
+      "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+      "deviceVender": "0",
+      "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+      "ip": "",
+      "port": "0",
+      "username": "",
+      "passwd": "",
+      "rtspAddress": "",
+      "facesnapChannel": "",
+      "edgeDeviceSn": "",
+      "platform1400Id": 0,
+      "useRtspAddress": false,
+      "frameCheck": false,
+      "frameRectX": 0,
+      "frameRectY": 0,
+      "frameRectW": 0,
+      "frameRectH": 0,
+      "edgeNodeId": "0",
+      "processStatus": "FILTER_REALTIME_DEFAULT"
+    },
+    "objectIndex": {
+      "objectId": "1742092514409592832",
+      "solutionId": "1",
+      "deviceId": "129529",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "isObjectTrack": true,
+    "pathId": "1742092482440607744",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1704182186451",
+      "width": 0,
+      "height": 0,
+      "originWidth": 2560,
+      "originHeight": 1440,
+      "offsetTime": "20409182",
+      "skipNumber": "0"
+    },
+    "level": 1,
+    "bboxInFrame": {
+      "x": 0.6195313,
+      "y": 0.24583334,
+      "w": 0.09804688,
+      "h": 0.41944444
+    },
+    "bboxExtInFrame": {
+      "x": 0.53515625,
+      "y": 0.14027777,
+      "w": 0.26640624,
+      "h": 0.63125
+    },
+    "objectImageKey": "",
+    "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+    "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+    "confidence": 0.92494,
+    "sourceObjectId": "1742092515508500480",
+    "storeTimestamp": "0",
+    "gbNumber": "",
+    "qualityScore": 0,
+    "subObjectCount": 1,
+    "subObjectType": ["OBJECT_TYPE_FACE"],
+    "subObjectIds": ["1742092482432219136"],
+    "cameraInfo": {
+      "id": "129529",
+      "name": "4入口人脸",
+      "dirid": "0",
+      "status": "1",
+      "longitude": 120.12100219726562,
+      "latitude": 30.280099868774414,
+      "caseId": "0",
+      "caseGroup": "",
+      "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+      "extendInfo": {
+        "vmsPlatformId": "29",
+        "vmsChannel": "34",
+        "vmsCameraDecoderTag": "hikvision",
+        "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+        "deviceVender": "0",
+        "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+        "ip": "",
+        "port": "0",
+        "username": "",
+        "passwd": "",
+        "rtspAddress": "",
+        "facesnapChannel": "",
+        "edgeDeviceSn": "",
+        "platform1400Id": 0,
+        "useRtspAddress": false,
+        "frameCheck": false,
+        "frameRectX": 0,
+        "frameRectY": 0,
+        "frameRectW": 0,
+        "frameRectH": 0,
+        "edgeNodeId": "0",
+        "processStatus": "FILTER_REALTIME_DEFAULT"
+      }
+    },
+    "solutionId": "1",
+    "fragmentId": "0",
+    "contrastKey": "singer-20240102/1/129529/1742092514409592832.jpg",
+    "compaterImages": ["http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"],
+    "imgSummary": "singer-20240102/1/129529/1742092514409592832.jpg",
+    "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+    "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+    "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+    "cameraId": "129529",
+    "cameraName": "4入口人脸"
+  }],
+  "isArchiveDetail": false,
+  "ToolProps": {
+    "renderVideoBtn": true,
+    "disableVideo": false
+  },
+  "specialTitle": ""
+};
--- a/packages/biz/es/Demo/index.d.ts
+++ b/packages/biz/es/Demo/index.d.ts
@ -1,3 +0,0 @@
-import React from 'react';
-declare const _default: () => React.JSX.Element;
-export default _default;
--- a/packages/biz/es/Demo/index.js
+++ b/packages/biz/es/Demo/index.js
@ -1,15 +1,14 @@
 import React from 'react';
-import { Button } from '@zhst/meta';
+import { Button } from 'antd';
 import { useThrottleFn } from '@zhst/hooks';
 export default (function () {
-  var ok = function ok() {
-    return useThrottleFn(function () {
+  var _useThrottleFn = useThrottleFn(function () {
      return console.log('123');
-    });
-  };
+    }),
+    run = _useThrottleFn.run;
  return /*#__PURE__*/React.createElement(Button, {
    onClick: function onClick() {
-      return ok();
+      return run();
    }
  }, "\u6D4B\u8BD5");
 });
--- a/packages/biz/es/adapter/BigImageModalAdapter/index.js
+++ b/packages/biz/es/adapter/BigImageModalAdapter/index.js
@ -0,0 +1,8 @@
+/**
+ * 适配老的大屏组件数据格式传入
+ */
+
+export default (function (data) {
+  var newData = data;
+  return newData;
+});
--- a/packages/biz/es/adapter/BigImageModalAdapter/interface.d.ts
+++ b/packages/biz/es/adapter/BigImageModalAdapter/interface.d.ts
@ -0,0 +1,217 @@
+export type CamerasStatusList = [string[], string[], string[]];
+
+export type Rect = { x: number; y: number; w: number; h: number };
+
+export type StatusList = {
+  taskOverview: any;
+  taskIndex: {
+    deviceId: string;
+    solutionId: string;
+  };
+}[];
+
+export enum OperationType {
+  OPERATION_TYPE_UNKNOW, // 未知状态，传该值会报错
+  OPERATION_TYPE_START,
+  OPERATION_TYPE_STOP
+}
+
+
+export enum AlgorithmVersion {
+  VERSION_MGN_BNN, // MGN+BNN算法
+  VERSION_BNN_PRO, // BNNPRO算法
+  VERSION_BNN_PRO_ATTR, // BNNPROATTR算法
+  VERSION_BNN_PRO_ATTR_SCORE, // BNNPROATTR算法
+  VERSION_FACE, // 人脸算法
+  VERSION_HEAD, // 头肩算法
+  VERSION_NON_MOTOR_VEHICLE, // 非机动车的算法
+  VERSION_REID_HEAD_ATTR, // 形体头肩属性三种特征融合的算法
+  VERSION_MOTOR_VEHICLE, // 机动车的算法
+}
+
+export enum AlgorithmVersionStr {
+  VERSION_MGN_BNN = 'VERSION_MGN_BNN', // MGN+BNN算法
+  VERSION_BNN_PRO = 'VERSION_BNN_PRO', // BNNPRO算法
+  VERSION_BNN_PRO_ATTR = 'VERSION_BNN_PRO_ATTR', // BNNPROATTR算法
+  VERSION_BNN_PRO_ATTR_SCORE = 'VERSION_BNN_PRO_ATTR_SCORE', // BNNPROATTR算法
+  VERSION_FACE = 'VERSION_FACE', // 人脸算法
+  VERSION_HEAD = 'VERSION_HEAD', // 头肩算法
+  VERSION_NON_MOTOR_VEHICLE = 'VERSION_NON_MOTOR_VEHICLE', // 非机动车的算法
+  VERSION_REID_HEAD_ATTR = 'VERSION_REID_HEAD_ATTR', // 形体头肩属性三种特征融合的算法
+  VERSION_MOTOR_VEHICLE = 'VERSION_MOTOR_VEHICLE', // 机动车的算法
+}
+
+类型枚举
+export enum ObjectType {
+  OBJECT_TYPE_NULL,
+  OBJECT_TYPE_PEDESTRAIN,
+  OBJECT_TYPE_BICYCLE,
+  OBJECT_TYPE_CAR,
+  OBJECT_TYPE_MOTORBIKE,
+  OBJECT_TYPE_AEROPLANE,
+  OBJECT_TYPE_BUS,
+  OBJECT_TYPE_TRAIN,
+  OBJECT_TYPE_TRUCK,
+  OBJECT_TYPE_MOTOR_RIDER,
+  OBJECT_TYPE_BIKE_RIDER,
+  OBJECT_TYPE_MAX,
+  OBJECT_TYPE_FACE = 101,
+}
+
+// 性别
+export enum Gender {
+  GENDER_NONE = 'GENDER_NONE',
+  GENDER_MAN = 'GENDER_MAN',
+  GENDER_WOMAN = 'GENDER_WOMAN',
+}
+
+// 年龄
+export enum Age {
+  AGE_ALL = 'AGE_ALL',
+  AGE_ZERO = 'AGE_ZERO',
+  AGE_OVERENGHTEEN = 'AGE_OVERENGHTEEN',
+  AGE_OVERSIXTY = 'AGE_OVERSIXTY',
+}
+
+// 戴帽子状态
+export enum Hat {
+  HAT_ALL = 'HAT_ALL',
+  HAT_NONE = 'HAT_NONE',
+  HAT_OWNED = 'HAT_OWNED',
+}
+
+// 颜色
+export enum Color {
+  COLOR_ALL = 'COLOR_ALL',
+  COLOR_BLACK = 'COLOR_BLACK',
+  COLOR_WHITE = 'COLOR_WHITE',
+  COLOR_GRAY = 'COLOR_GRAY',
+  COLOR_BROWN = 'COLOR_BROWN',
+  COLOR_PINK = 'COLOR_PINK',
+  COLOR_REDANDORANGE = 'COLOR_REDANDORANGE',
+  COLOR_YELLOW = 'COLOR_YELLOW',
+  COLOR_GREEN = 'COLOR_GREEN',
+  COLOR_BLUE = 'COLOR_BLUE',
+  COLOR_PURPLE = 'COLOR_PURPLE',
+}
+
+// 背包
+export enum Package {
+  PACKAGE_ALL = 'PACKAGE_ALL',
+  PACKAGE_HANDBAG = 'PACKAGE_HANDBAG',
+  PACKAGE_BACKPACK = 'PACKAGE_BACKPACK',
+  PACKAGE_SHOULDERBAG = 'PACKAGE_SHOULDERBAG',
+  PACKAGE_OTHER = 'PACKAGE_OTHER',
+  PACKAGE_NONE = 'PACKAGE_NONE',
+}
+
+// 行走模式
+export enum WalkPattern {
+  WALKPATTERN_ALL = 'WALKPATTERN_ALL',
+  WALKPATTERN_WALK = 'WALKPATTERN_WALK',
+  WALKPATTERN_RIDING = 'WALKPATTERN_RIDING',
+}
+
+// 人类属性
+export interface HumanProperty {
+  age: Age;
+  downColor: Color;
+  gender: Gender;
+  hat: Hat;
+  package: Package;
+  upColor: Color;
+  walkPattern: WalkPattern;
+}
+
+// 人类属性枚举
+export interface EnumHumanProperty {
+  Gender: typeof Gender;
+  Age: typeof Age;
+  Hat: typeof Hat;
+  Color: typeof Color;
+  Package: typeof Package;
+  WalkPattern: typeof WalkPattern;
+}
+
+export interface IScreenshotButtonProp {
+    model: 'VIDEO' | 'IMAGE';
+    getCropInfo: () => Promise<RESP>;
+    setShowCrop: React.Dispatch<React.SetStateAction<boolean>>;
+    cropType: typeof cropType[number];
+    selectAlgorithmVersion: number;
+}
+
+export interface AlignType {
+    /**
+     * move point of source node to align with point of target node.
+     * Such as ['tr','cc'], align top right point of source node with center point of target node.
+     * Point can be 't'(top), 'b'(bottom), 'c'(center), 'l'(left), 'r'(right) */
+    points?: AlignPoint[];
+    /**
+     * offset source node by offset[0] in x and offset[1] in y.
+     * If offset contains percentage string value, it is relative to sourceNode region.
+     */
+    offset?: number[];
+    /**
+     * offset target node by offset[0] in x and offset[1] in y.
+     * If targetOffset contains percentage string value, it is relative to targetNode region.
+     */
+    targetOffset?: number[];
+    /**
+     * If adjustX field is true, will adjust source node in x direction if source node is invisible.
+     * If adjustY field is true, will adjust source node in y direction if source node is invisible.
+     */
+    overflow?: {
+        adjustX?: boolean | number;
+        adjustY?: boolean | number;
+    };
+    /**
+     * Whether use css right instead of left to position
+     */
+    useCssRight?: boolean;
+    /**
+     * Whether use css bottom instead of top to position
+     */
+    useCssBottom?: boolean;
+    /**
+     * Whether use css transform instead of left/top/right/bottom to position if browser supports.
+     * Defaults to false.
+     */
+    useCssTransform?: boolean;
+    ignoreShake?: boolean;
+}
+
+export type ODRECT = {
+    topleft: {
+        x: number;
+        y: number;
+    };
+    width: number;
+    height: number;
+};
+
+export interface ViewOption {
+  /* 图片url */
+  image?: string | HTMLImageElement;
+
+  /* 缩放灵敏度(0,1],default: 0.1 */
+  wheelZoomRatio?: number;
+
+  /*
+   * 是否允许缩放
+   * @default: true
+   */
+  scaleAble?: boolean;
+
+  /*
+   * 是否允许拖拽
+   * @default: true
+   */
+  dragAble?: boolean;
+
+  /*
+   * fit scale 作为 最小缩放
+   * @default: false
+   */
+  fitScaleAsMinScale?: boolean;
+}
--- a/packages/biz/es/adapter/index.js
+++ b/packages/biz/es/adapter/index.js
@ -0,0 +1 @@
+export { default as BigImageModalAdapter } from "./BigImageModalAdapter";
--- a/packages/biz/es/global.d.ts
+++ b/packages/biz/es/global.d.ts
--- a/packages/biz/es/hooks/useIntelligentTracking/index.js
+++ b/packages/biz/es/hooks/useIntelligentTracking/index.js
--- a/packages/biz/es/hooks/useTaskState/index.js
+++ b/packages/biz/es/hooks/useTaskState/index.js
--- a/packages/biz/es/index.js
+++ b/packages/biz/es/index.js
@ -1 +1,3 @@
-export { default as Demo } from "./Demo";
+export { default as Demo } from "./Demo";
+export * from "./adapter";
+export { default as BigImageModal } from "./BigImageModal";
--- a/packages/biz/es/useSocket/index.js
+++ b/packages/biz/es/useSocket/index.js
@ -0,0 +1,101 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { useMemo } from 'react';
+import { throttle as loadshThrottle } from '@zhst/func';
+import { useDeepEffect, useLatest } from '@zhst/hooks';
+import ws from "./ws";
+var noop = function noop(v) {
+  return null;
+};
+var getSelf = function getSelf(v) {
+  return v;
+};
+export var SocketApi = {
+  CameraTaskStatue: 'singer.DeviceService/SubScribeCameraTaskStatus',
+  DeviceStatus: 'singer.TaskManagerService/SubscribeTaskStatus',
+  SubscribeSolutionDeploy: 'singer.SolutionManagerService/SubscribeSolutionDeploy',
+  SubscribeTasksSummary: 'singer.TaskManagerService/SubscribeTasksSummary',
+  MonitorSubscribeResult: 'singer.MonitorService/MonitorSubscribeResult',
+  MonitorSubscribeStatus: 'singer.MonitorService/MonitorSubscribeStatus',
+  SubscribeArchiveGroupUpload: 'singer.ArchiveGroupService/CreateArchiveByImport',
+  SubscribeJointTask: 'singer.JointTaskService/SubscribeJointTask',
+  SubscribeGroupFragment: 'singer.VideoService/SubscribeVideoFragmentStatus',
+  // 监听视频分片状态变化，包括新建、删除、变化
+  SubscribeGroup: 'singer.VideoService/SubscribeGroup',
+  // 监听视频分组状态变化，列表变化也通知
+  SubscribeStreamEvent: 'singer.MediaManagerService/SubscribeStreamEvent' // 监听视频分组状态变化，列表变化也通知
+};
+
+export default (function (topic) {
+  var iterator = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noop;
+  var opt = arguments.length > 2 ? arguments[2] : undefined;
+  var _ref = opt || {},
+    _ref$req = _ref.req,
+    req = _ref$req === void 0 ? {} : _ref$req,
+    _ref$throttle = _ref.throttle,
+    throttle = _ref$throttle === void 0 ? 0 : _ref$throttle,
+    _ref$parseData = _ref.parseData,
+    parseData = _ref$parseData === void 0 ? true : _ref$parseData,
+    _ref$beforeLoopTmp = _ref.beforeLoopTmp,
+    beforeLoopTmp = _ref$beforeLoopTmp === void 0 ? getSelf : _ref$beforeLoopTmp,
+    _ref$shouldBreak = _ref.shouldBreak,
+    shouldBreak = _ref$shouldBreak === void 0 ? false : _ref$shouldBreak,
+    forceRefresh = _ref.forceRefresh,
+    close = _ref.close;
+
+  // 带上token
+  var reqstring = useMemo(function () {
+    var newReq = _objectSpread(_objectSpread({}, req), {}, {
+      extraHeaders: {
+        authorization: localStorage.getItem('USER-TOKEN')
+      }
+    });
+    return JSON.stringify(newReq);
+  }, [req]);
+  var latestIterator = useLatest(iterator);
+  useDeepEffect(function () {
+    if (close) {
+      return;
+    }
+    //控制socket 请求发送
+    if (shouldBreak) {
+      return;
+    }
+    //去抖动
+
+    var tmpData = [];
+    var throttleUpdate = loadshThrottle(function () {
+      if (tmpData.length == 0) {
+        return;
+      }
+      var _tmpData = beforeLoopTmp(tmpData);
+      latestIterator.current(_tmpData); //加了throttle 数据就变成数组
+      tmpData = [];
+    }, throttle);
+    var unSubscribe = ws.subscribe(SocketApi[topic], reqstring, function (socketData) {
+      try {
+        if (!throttle) {
+          latestIterator.current(socketData);
+        } else {
+          tmpData.push(socketData);
+          throttleUpdate();
+        }
+      } catch (error) {
+        console.error('useSocke:', error);
+      }
+    });
+    return function () {
+      try {
+        unSubscribe();
+        throttleUpdate.cancel();
+      } catch (error) {
+        console.error(error);
+        throw error;
+      }
+    };
+  }, [topic, reqstring, shouldBreak, forceRefresh, close]);
+});
--- a/packages/biz/es/useSocket/onceChannel.js
+++ b/packages/biz/es/useSocket/onceChannel.js
@ -0,0 +1,24 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+//@ts-nocheck
+import channel from "./ws";
+var startChannel = function startChannel(topic, req, callback) {
+  // 带上token
+  var reqstring = JSON.stringify(_objectSpread(_objectSpread({}, req), {}, {
+    extraHeaders: {
+      authorization: localStorage.getItem('USER-TOKEN')
+    }
+  }));
+  var unSubscribe = channel.subscribe(topic, reqstring, function (socketData) {
+    var shouldStop = callback(socketData);
+    if (shouldStop) {
+      unSubscribe === null || unSubscribe === void 0 || unSubscribe();
+    }
+  });
+  return unSubscribe;
+};
+export default startChannel;
--- a/packages/biz/es/useSocket/ws.js
+++ b/packages/biz/es/useSocket/ws.js
@ -0,0 +1,243 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { v4 as uuidv4 } from 'uuid';
+import { has } from '@zhst/func';
+import io from 'socket.io-client';
+import { SOCKET_HOST } from '@common/constants';
+var EMITSTATE = {
+  NOT_CONNECT: 0,
+  WAITING: 1,
+  CONNECT: 2
+};
+var initRetryTime = 0;
+var intervalTime = 5 * 1000; //下次重试增加时间
+var maxIntervalTime = 1 * 60 * 60 * 1000; //最大重试时间1小时
+var Channel = /*#__PURE__*/function () {
+  function Channel() {
+    var _this = this;
+    _classCallCheck(this, Channel);
+    /**
+     * io 实例化对象
+     */
+    _defineProperty(this, "ioIns", void 0);
+    /**
+     * 已存在的订阅列表
+     */
+    _defineProperty(this, "listeners", [
+      // {
+      //     topic: "",
+      //     req: "",
+      //     suInfo: {},
+      //     hasEmit: false,//是否已经订阅
+      //     lastRetryInterval: 0,
+      //     handles: {
+      //     }
+      // }
+    ]);
+    /**
+     * 调试信息 记录订阅/反订阅次数
+     */
+    _defineProperty(this, "subscribeListenerId", []);
+    _defineProperty(this, "unSubscribeListenerId", []);
+    _defineProperty(this, "init", function () {
+      var ioIns = _this.ioIns = io(SOCKET_HOST, {
+        reconnection: true,
+        transports: ['websocket'],
+        forceNew: true
+      });
+      ioIns.on('connect', function () {
+        for (var _len = arguments.length, arg = new Array(_len), _key = 0; _key < _len; _key++) {
+          arg[_key] = arguments[_key];
+        }
+        console.debug('connect', arg);
+        _this.ioIns = ioIns;
+        _this.listeners.forEach(function (v) {
+          _this.doEmit(v['topic'], v['req'], v['id']);
+        });
+      });
+      ioIns.on('event', function () {
+        for (var _len2 = arguments.length, arg = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+          arg[_key2] = arguments[_key2];
+        }
+        console.debug('event', arg);
+      });
+      ioIns.on('disconnect', function () {
+        for (var _len3 = arguments.length, arg = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+          arg[_key3] = arguments[_key3];
+        }
+        console.debug('disconnect', arg);
+        _this.subscribeListenerId = [];
+        _this.unSubscribeListenerId = [];
+      });
+      ioIns.on('reconnect', function () {
+        for (var _len4 = arguments.length, arg = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
+          arg[_key4] = arguments[_key4];
+        }
+        console.debug('reconnect', arg);
+        _this.listeners.forEach(function (v) {
+          v['hasEmit'] = EMITSTATE.NOT_CONNECT;
+          _this.doEmit(v['topic'], v['req'], v['id']);
+        });
+      });
+    });
+    _defineProperty(this, "retry", function (listener) {
+      //重试逻辑
+      var intervalId = setTimeout(function () {
+        var hasExit = _this.listeners.find(function (v) {
+          return v['topic'] === (listener === null || listener === void 0 ? void 0 : listener['topic']) && v['req'] === listener['req'];
+        });
+        if (!hasExit) return;
+        listener['hasEmit'] = EMITSTATE.NOT_CONNECT;
+        _this.doEmit(listener['topic'], listener['req'], listener['id']);
+      }, listener.lastRetryInterval);
+      listener.intervalId = intervalId;
+      listener.lastRetryInterval = intervalTime + listener.lastRetryInterval > maxIntervalTime ? maxIntervalTime : intervalTime + listener.lastRetryInterval;
+    });
+    _defineProperty(this, "doEmit", function (topic, req, listenerId) {
+      var _this$ioIns, _this$ioIns$emit;
+      if (!_this.ioIns) {
+        _this.init();
+      }
+      //订阅过就不订阅了
+      var hasEmit = _this.listeners.find(function (v) {
+        return v['topic'] === topic && v['req'] === req && v['hasEmit'] !== EMITSTATE.NOT_CONNECT;
+      });
+      if (hasEmit) {
+        return;
+      }
+      var listener = _this.listeners.find(function (v) {
+        return v['topic'] === topic && v['req'] === req;
+      });
+      listener['hasEmit'] = EMITSTATE.WAITING;
+      (_this$ioIns = _this.ioIns) === null || _this$ioIns === void 0 || (_this$ioIns$emit = _this$ioIns.emit) === null || _this$ioIns$emit === void 0 || _this$ioIns$emit.call(_this$ioIns, topic, req, function (data) {
+        var _this$ioIns2, _this$ioIns2$on;
+        console.info('emit', topic, req, data);
+        var suInfo = JSON.parse(data);
+        if (has(suInfo, 'Error.code')) {
+          if (suInfo.Error.code === 500) {
+            //后端出错
+            _this.retry(listener);
+          }
+          return;
+        }
+        // console.debug('SUBSCRIBE', listenerId, topic, req, suInfo);
+        _this.subscribeListenerId.push(listenerId);
+        // debugger
+        //重新找一遍topic
+        var currentTopicIndex = _this.listeners.findIndex(function (v) {
+          return v['topic'] === topic && v['req'] === req && v['id'] === listenerId;
+        });
+        if (currentTopicIndex == -1) {
+          // 不存在说明listener取消了 直接反订阅
+          _this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), function (data) {
+            _this.unSubscribeListenerId.push(listenerId);
+            console.debug('UNSUBSCRIBE', listenerId, topic, req, data);
+          });
+          return;
+        }
+        if (!suInfo['SubscribeID']) {
+          _this.listeners.splice(currentTopicIndex, 0);
+        } else {
+          _this.listeners[currentTopicIndex]['suInfo'] = suInfo;
+          _this.listeners[currentTopicIndex]['hasEmit'] = EMITSTATE.CONNECT;
+        }
+        (_this$ioIns2 = _this.ioIns) === null || _this$ioIns2 === void 0 || (_this$ioIns2$on = _this$ioIns2.on) === null || _this$ioIns2$on === void 0 || _this$ioIns2$on.call(_this$ioIns2, suInfo['SubscribeID'], function (data) {
+          console.info('on', suInfo['SubscribeID'], data);
+          try {
+            var socketData = JSON.parse(data);
+            if (has(socketData, 'Error.code')) {
+              if (socketData.Error.code === 500) {
+                //后端出错
+                _this.retry(listener);
+              }
+              return;
+            }
+            var _ref = _this.listeners.find(function (v) {
+                return v['topic'] === topic && v['req'] === req;
+              }) || {},
+              _ref$handles = _ref.handles,
+              handles = _ref$handles === void 0 ? {} : _ref$handles;
+            Object.keys(handles).forEach(function (key) {
+              try {
+                //后面观察 为什么delete后在foreach
+                var func = handles[key];
+                if (!func) return;
+                func(socketData);
+              } catch (error) {
+                console.error(error);
+              }
+            });
+          } catch (error) {
+            console.debug('error', error);
+          }
+        });
+      });
+    });
+  }
+  _createClass(Channel, [{
+    key: "subscribe",
+    value: function subscribe(topic, req, handle) {
+      var handleId = uuidv4();
+      var listenerId = uuidv4();
+      var listener = this.listeners.find(function (v) {
+        return v['topic'] === topic && v['req'] === req;
+      });
+      if (listener) {
+        listener['handles'][handleId] = handle;
+      } else {
+        this.listeners.push({
+          topic: topic,
+          req: req,
+          suInfo: {},
+          id: listenerId,
+          hasEmit: EMITSTATE.NOT_CONNECT,
+          lastRetryInterval: initRetryTime,
+          handles: _defineProperty({}, "".concat(handleId), handle)
+        });
+        //未注册过 则去订阅
+        this.doEmit(topic, req, listenerId);
+      }
+      return this.unSubscribe.bind(this, topic, req, handleId, listenerId);
+    }
+  }, {
+    key: "unSubscribe",
+    value: function unSubscribe(topic, req, handleId, listenerId) {
+      var _this2 = this;
+      var listener = this.listeners.find(function (v) {
+        return v['topic'] === topic && v['req'] === req && v['id'] === listenerId;
+      });
+      var _ref2 = listener || {},
+        _ref2$handles = _ref2.handles,
+        handles = _ref2$handles === void 0 ? {} : _ref2$handles,
+        suInfo = _ref2.suInfo;
+      if (handles[handleId]) {
+        delete handles[handleId];
+        //如果没有其他订阅就删除
+        if (Object.keys(handles).length === 0) {
+          if (this.intervalId) {
+            clearTimeout(this.intervalId);
+          }
+          if (listener['hasEmit'] === EMITSTATE['CONNECT']) {
+            this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), function (data) {
+              _this2.unSubscribeListenerId.push(listenerId);
+              console.debug('UNSUBSCRIBE', listener['id'], topic, req, data);
+            });
+          }
+          this.listeners = this.listeners.filter(function (v) {
+            return !(v['topic'] === topic && v['req'] === req);
+          });
+        }
+      }
+    }
+  }]);
+  return Channel;
+}(); //单例
+var channelIns = new Channel();
+//暴露实例 调试用
+window.__channel__ = channelIns;
+export default channelIns;
--- a/packages/biz/es/utils/constants.js
+++ b/packages/biz/es/utils/constants.js
@ -0,0 +1,40 @@
+export var isDev = import.meta.env.DEV;
+export var host = isDev ? 'http://10.0.0.7' : "".concat(location.protocol, "//").concat(location.hostname);
+export var port = isDev ? '30003' : location.port;
+export var ProjectUrl = "".concat(host, ":").concat(port);
+export var MANAGER_URL = port ? ProjectUrl + '/manager' : host + '/manager';
+export var S3_HOST = location.port ? "".concat(host, ":").concat(port) : host;
+export var MapUrl = port ? ProjectUrl + '/map' : host + '/map';
+export var S3_V3_HOST = host; //minio 地址
+export var SOCKET_HOST = port ? ProjectUrl : host;
+export var OBJECT_GRNER_THRESHOLD = 0.8; //目标图判断性别阈值
+export var OBJECT_AGE_TYPE_THRESHOLD = 0.5; //目标图判断年龄段阈值
+export var MODE_KEY = 'test_mode';
+export var ROUTER_SHOULD_FILTER = isDev; //是否根据后台配置路由，开发环境全打开
+//业务约定
+export var SEARCH_IMG_COUNT = 10; //检索图片的最大个数
+export var GLOBAL_IS_ITEM_NUMBER_SHOW = false; //是否展示索引
+export var publicPath = 'hummingbird';
+export var ENTER_CIRCLE = 'MONITORTYPE_ENTER_CIRCLE';
+export var OUT_CIRCLE = 'MONITORTYPE_OUT_CIRCLE';
+export var TEMP = 'MONITORTYPE_TEMP';
+export var GLOBAL_IS_BOX_VMS_SHOW = true; //是否展示盒子vms
+
+export var BODY_SEARCH_THRESHOID = 0.45; //形体检索阈值
+export var RECORD_VERSION = '3.0.0'; //保存记录的版本号
+
+export var DeviceTab = {
+  EMPTY: 0,
+  REAL_CAMERA: 1,
+  PREPROCESS_CAMERA: 2,
+  //摄像头列表
+  TAG_CAMERA: 3,
+  //预案列表
+  HISTORY_VIDEO_GROUP: 4,
+  //录像回放
+  VIRTUAL_CAMERA: 5,
+  //离线视频
+  REAL_CAMERA_NOFACE: 6,
+  REAL_CAMERA_ONLYFACE: 7,
+  REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8 // 只有普通摄像头，没有人脸、没有盒子、直连
+};
--- a/packages/biz/es/utils/index.js
+++ b/packages/biz/es/utils/index.js
--- a/packages/biz/es/utils/request.js
+++ b/packages/biz/es/utils/request.js
--- a/packages/biz/lib/Demo/index.d.ts
+++ b/packages/biz/lib/Demo/index.d.ts
@ -1,3 +0,0 @@
-import React from 'react';
-declare const _default: () => React.JSX.Element;
-export default _default;
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@ -1 +0,0 @@
-export { default as Demo } from './Demo';
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@ -1,6 +1,6 @@
 {
  "name": "@zhst/biz",
-  "version": "0.2.3",
+  "version": "0.2.4",
  "description": "业务库",
  "keywords": [
    "business",
@ -18,6 +18,9 @@
  "main": "lib/index.tsx",
  "module": "es/index.js",
  "typings": "es/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json"
+  },
  "files": [
    "es",
    "lib"
@ -30,8 +33,13 @@
    "registry": "http://10.0.0.77:4874"
  },
  "dependencies": {
+    "@zhst/func": "workspace:^",
    "@zhst/hooks": "workspace:^",
    "@zhst/meta": "workspace:^",
-    "@zhst/func": "workspace:^"
+    "antd": "^5.12.5",
+    "base-64": "^1.0.0",
+    "classnames": "^2.5.1",
+    "rc-util": "^5.38.1",
+    "umi-request": "^1.4.0"
  }
 }
--- a/packages/biz/src/BigImageModal/components/navigation/index.less
+++ b/packages/biz/src/BigImageModal/components/navigation/index.less
@ -0,0 +1,44 @@
+.zhst-image__nav {
+  position: absolute;
+  display: flex;
+  width: 48px;
+  height: 100%;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  font-size: 0;
+
+  &>button {
+    & span {
+      display: flex;
+    }
+  }
+
+  :global {
+    i:hover {
+      color: #f0f0f0 !important;
+    }
+  }
+
+  &--disable {
+    :global {
+      i {
+        color: #f0f0f0;
+        cursor: not-allowed !important;
+      }
+    }
+  }
+
+  &--hide {
+    display: none;
+  }
+
+  &-prev {
+    left: 20px;
+  }
+
+  &-next {
+    right: 20px;
+  }
+}
--- a/packages/biz/src/BigImageModal/components/navigation/index.tsx
+++ b/packages/biz/src/BigImageModal/components/navigation/index.tsx
@ -0,0 +1,39 @@
+import * as React from 'react';
+import classnames from 'classnames';
+import { Button } from 'antd';
+import { Icon } from '@zhst/meta';
+import './index.less';
+
+const componentName = `zhst-image__nav`;
+
+const Navigation: React.FC<{
+  show?: boolean;
+  onClick?: React.MouseEventHandler<HTMLElement>;
+  prev?: boolean;
+  next?: boolean;
+  disabled?: boolean;
+  className?: string;
+  color?: string;
+  hoverColor?: string;
+}> = (props) => {
+  const { show, prev, next, disabled, onClick, className, color } = props;
+
+  return (
+    <div
+      className={classnames(
+        `${componentName}`,
+        prev && `${componentName}-prev`,
+        next && `${componentName}-next`,
+        disabled && `${componentName}--disable`,
+        !show && `${componentName}--hide`,
+        className
+      )}
+    >
+      <Button type="text" disabled={disabled} onClick={onClick}>
+        <Icon size={28} color={color} icon={prev ? 'icon-qiehuanzuo' : 'icon-qiehuanyou'} />
+      </Button>
+    </div>
+  );
+};
+
+export default Navigation;
--- a/packages/biz/src/BigImageModal/images/emptyImage.png
+++ b/packages/biz/src/BigImageModal/images/emptyImage.png
--- a/packages/biz/src/BigImageModal/images/percent_background.png
+++ b/packages/biz/src/BigImageModal/images/percent_background.png
--- a/packages/biz/src/BigImageModal/index.less
+++ b/packages/biz/src/BigImageModal/index.less
--- a/packages/biz/src/BigImageModal/index.md
+++ b/packages/biz/src/BigImageModal/index.md
@ -0,0 +1,76 @@
+---
+nav:
+  title: 业务组件
+group:
+  title: 数据展示
+  order: 1
+---
+
+
+# 大图弹框
+
+```jsx
+import React from 'react';
+import { Button } from 'antd'
+import { BigImageModal } from '@zhst/biz'
+import { DescriptionsProps } from '@zhst/biz'
+import { IMAGE_DATA } from './mock.ts'
+
+const descriptionList: DescriptionsProps['items'] = [
+  {
+    title: '人员属性',
+    children: [
+      {
+        key: '1',
+        label: '性别',
+        children: '男',
+      },
+      {
+        key: '2',
+        label: '年龄',
+        children: '成年',
+      },
+      {
+        key: '3',
+        label: '帽子',
+        children: '无',
+      },
+      {
+        key: '4',
+        label: '上身颜色',
+        children: '灰',
+      },
+      {
+        key: '5',
+        label: '下身颜色',
+        children: '蓝色',
+      },
+      {
+        key: '6',
+        label: '附着物',
+        children: '无',
+      },
+      {
+        key: '7',
+        label: '骑行',
+        children: '否',
+      },
+    ]
+  }
+];
+
+export default () => {
+  console.log(IMAGE_DATA)
+  
+  return (
+    <BigImageModal 
+      title="查看大图" 
+      open 
+      dataSource={IMAGE_DATA.dataSource}
+      imageData={IMAGE_DATA.dataSource}
+      width={1098}
+      descriptionConfig={{ data: descriptionList }}
+    />
+  )
+}
+```
--- a/packages/biz/src/BigImageModal/index.temp.tsx
+++ b/packages/biz/src/BigImageModal/index.temp.tsx
@ -0,0 +1,696 @@
+// @ts-nocheck
+import React, { ReactElement, useEffect, useRef, useState, useMemo } from 'react';
+import { useLatest, useThrottleFn } from 'ahooks';
+import { isFunction, pick, noop, get, isEmpty } from 'lodash-es';
+import classNames from 'classnames';
+import { message, Modal, Tabs as TabPane } from 'antd';
+import KeyCode from 'rc-util/lib/KeyCode';
+import { observer } from 'mobx-react-lite';
+import ImgView, { ImgViewProps, ImgViewRef } from './ImgView';
+import VideoView, { VideoViewProps, VideoViewRef } from './VideoView';
+import CompareView from './CompareView';
+import Tool, { ToolProps } from './Tool';
+import Header, { Tabs, TabsType, tabsFilter } from './Header';
+import Navigation from './Nav';
+import AttributePanel from './AttributePanel';
+import { usePropState, cssPrefix, getSolt } from './utils';
+import { screenshotButtonProp, MODEL_TYPE, Rect } from '../adapter/BigImageModalAdapter/interface';
+import NullView, { NullDialogProp } from './NullDialog';
+import styles from './index.module.scss';
+import { generateImg } from '@common/utils';
+import IconFont from '../iconfont/IconFont';
+import addEventListenerWrap from '@common/utils/addEventListener';
+import Carousel, { CarouselProps } from './Carousel';
+import { doubleClick } from '@common/components/doubleCheck';
+import { store } from '@store/index';
+import { store as achieveStore } from '@pages/archive/store';
+import { ObjectType } from '@store/Monitor';
+
+const componentName = cssPrefix;
+
+export type selecItem = Partial<Omit<ImgViewProps, 'screenshotButtonRender'>> &
+  Partial<Omit<VideoViewProps, 'screenshotButtonRender'>>;
+
+export interface ParamProps {
+  tab: string;
+  selectItem: selecItem;
+  imgViewRef: React.MutableRefObject<ImgViewRef>;
+  VideoViewRef: React.MutableRefObject<VideoViewRef>;
+  model: MODEL_TYPE;
+  setModel: React.Dispatch<React.SetStateAction<MODEL_TYPE>>;
+  /* 可观测值 */
+  scale$: number;
+  showCrop$: boolean;
+}
+
+export interface BigImageData {
+  //imageKey 小图
+  extendRectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
+  rectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
+  attachImg: { url: string; label: '形体' | '人脸' }[];
+  odRect: Rect;
+  imageKey: string; //大图
+  imgSummary: string; //摘要图
+
+  objectExtImageKey: string; //比对到的目标图扩展图 === imgSummary
+  attributeList: { label: string; list: any[] }[];
+  archiveImages?: any;
+  spaceName: string;
+
+  objectType: ObjectType;
+  objectId: string; //这张摘要本身的Id
+  bodyObjectId?: string;
+  faceObjectId?: string; //这张摘要下的人脸Id(如果有)
+  sourceObjectId?: string; //这张摘要上游的形体Id(如果有)
+  cameraId: string;
+  cameraName: string;
+  selectIndex: number;
+  humanProperty: HumanProperty;
+  qualityScore?: number; //人脸质量分
+  score: number; //相似度
+  timestamp: string;
+  bodyImageUrl: string;
+  faceImageUrl: string;
+  algorithmVersion: AlgorithmVersionStr;
+
+  bodySpaceName: string;
+  faceSpaceName: string;
+
+  solutionId?: Solution;
+  [index: string]: any;
+}
+
+export interface BigImageDialogProps {
+  visible?: boolean;
+  defaultModel?: MODEL_TYPE;
+  onClose?: () => void;
+  isLoading?: boolean;
+  hasPre?: boolean;
+  hasNext?: boolean;
+  selectIndex?: number;
+  onSelectIndexChange?: (index: number) => void;
+  dataSource: any[];
+  relatedData?: any[];
+  transformPropFunc: (item: any) => selecItem;
+  transformVideoPropFunc: (
+    item: selecItem
+  ) => Promise<Omit<VideoViewProps, 'screenshotButtonRender'>>;
+  screenshotButtonRender?: (screenshotButtonProp: screenshotButtonProp) => ReactElement;
+  showTool?: boolean;
+  showCarousel?: boolean;
+  imgViewProp?: Partial<ImgViewProps>;
+  videoViewProp?: Partial<VideoViewProps>;
+  ToolProps?: Partial<ToolProps>;
+  nullDialogProp?: Partial<NullDialogProp>;
+  showHeader?: boolean;
+  tabsFilter?: tabsFilter;
+  useVirtual?: boolean;
+  loadNext?: (index: number) => Promise<void>;
+  loadPre?: (index: number) => Promise<void>;
+  children: React.ReactNode;
+  title?: string;
+  specialTitle?: string;
+  isRelated?: boolean;
+  carouselProp?: Partial<CarouselProps>;
+}
+
+//查看对比图和场景图组件
+const BigImageDialog: React.FC<BigImageDialogProps> = (props) => {
+  const {
+    hasPre: propHasPre = false,
+    hasNext: propHasNext = false,
+    loadNext = noop,
+    loadPre = noop,
+    visible = true,
+    onClose,
+    isLoading: propIsLoading = false,
+    selectIndex: propSelectIndex = 0,
+    onSelectIndexChange,
+    dataSource = [],
+    relatedData = [],
+    screenshotButtonRender,
+    transformPropFunc,
+    transformVideoPropFunc,
+    defaultModel = 'IMAGE',
+    imgViewProp: otherImgViewProp,
+    videoViewProp: otherVideoViewProp,
+    carouselProp: otherCarouselProp,
+    ToolProps: otherToolProp,
+    showTool = true,
+    children,
+    nullDialogProp,
+    showHeader = true,
+    tabsFilter = ['COMPATER', 'NORMAL'],
+    useVirtual,
+    title = '查看大图',
+    specialTitle = '',
+    showCarousel = true,
+    isRelated = false,
+  } = props;
+
+  console.log('props', props)
+  //可观测值
+  const showCrop$Ref = useRef(false);
+  const scale$Ref = useRef(0);
+  const showCrop$ = showCrop$Ref.current;
+  const scale$ = scale$Ref.current;
+  // ========================== 头切换 =========================
+  const [tab, setTab] = useState<TAB_TYPE>(
+    tabsFilter.length > 1 ? (Object.keys(Tabs)[0] as TAB_TYPE) : (Object.keys(Tabs)[1] as TAB_TYPE)
+  );
+  const [activeKey, setActiveKey] = useState<string>('related');
+  const [similarList, setSimilarList] = useState<any>(dataSource); // 其他相似目标列表
+  const [relatedList, setRelatedList] = useState<any>(relatedData); // 已关联列表
+  const [imageData, setImageData] = useState<any>(dataSource); // 其他相似目标列表
+  const lastSimData = useLatest(similarList);
+  const lastRelatedData = useLatest(relatedList);
+
+  // ========================== 内部转换 =========================
+  const [model, setModel] = useState<MODEL_TYPE>(defaultModel); // 图片/视频模式
+  useEffect(() => {
+    if (activeKey === 'unRlated') {
+      setImageData(lastSimData.current);
+      setSelectIndex(0);
+    }
+    if (activeKey === 'related') {
+      setImageData(lastRelatedData.current);
+      setSelectIndex(0);
+    }
+  }, [activeKey]);
+  useEffect(() => {
+    setSimilarList(dataSource);
+    if (activeKey === 'unRelated') {
+      setImageData(dataSource);
+    }
+  }, [dataSource]);
+
+  const carouseDataSource = useMemo(() => {
+    return imageData.map((v: any, index: number) => {
+      return {
+        url: generateImg(get(v, 'passerbyImage.objectRects.0.fileKey')),
+        key: index,
+        passerbyId: get(v, 'passerbyId'),
+      };
+    });
+  }, [imageData, dataSource]);
+
+  //选择
+  const [selectIndex, setSelectIndex] = usePropState(propSelectIndex);
+  const hasPre = propHasPre ? true : selectIndex > 0;
+  const changeIndex = isRelated ? imageData.length - 1 : dataSource.length - 1;
+  const hasNext = propHasNext ? true : selectIndex < changeIndex;
+  //设置选中
+  const latestSelectIndex = useLatest(selectIndex);
+  const latestDataSource = isRelated ? useLatest(imageData) : useLatest(dataSource);
+  //加一个防背推
+  const seq = useRef(0);
+  const { run: setSelectIndexWrapper } = useThrottleFn(
+    async (arg: ((num: number) => void) | number) => {
+      const _seq = ++seq.current;
+      const selectIndex = latestSelectIndex.current;
+      const dataSource = latestDataSource.current;
+      let newIndex = isFunction(arg) ? arg(selectIndex) : arg;
+      if (newIndex > dataSource.length - 1) {
+        if (propHasNext) {
+          await loadNext(newIndex);
+        } else {
+          newIndex = dataSource.length - 1;
+        }
+      }
+      if (newIndex < 0) {
+        newIndex = 0;
+      }
+      if (_seq !== seq.current) {
+        return;
+      }
+
+      onSelectIndexChange && onSelectIndexChange(newIndex);
+      setSelectIndex(newIndex);
+    },
+    { wait: 500 }
+  );
+
+  //异步获取数据
+  const [selectItem, setSelectItem] = useState(null);
+  const [isFetching, setIsFetching] = useState(true);
+  //人员属性
+  const [attributeList, setAttributeList] = useState([]);
+  const isLoading = useMemo(() => propIsLoading || isFetching, [propIsLoading, isFetching]);
+  useEffect(() => {
+    (async () => {
+      setIsFetching(true);
+      let data: any = {};
+      if (isRelated) {
+        data = await transformPropFunc(imageData[selectIndex]);
+      } else {
+        data = await transformPropFunc(dataSource[selectIndex]);
+      }
+      setAttributeList(get(data, 'attributeList', []));
+      //防背推
+      if (selectIndex === latestSelectIndex.current) {
+        setSelectItem(data);
+        setIsFetching(false);
+      }
+    })();
+  }, [selectIndex, dataSource, imageData, isRelated]);
+
+  const selectqualityScore = useMemo(() => {
+    return get(selectItem, 'qualityScore');
+  }, [selectItem]);
+  //支持视频url异步获取
+  const [flvUrl, setFlvUrl] = useState(null);
+  const [maxDuration, setMaxDuration] = useState(null);
+  useEffect(() => {
+    (async () => {
+      if (model === 'IMAGE') {
+        setFlvUrl(null);
+        setMaxDuration(null);
+        return;
+      }
+
+      if (isFunction(transformVideoPropFunc)) {
+        //先情空
+        setFlvUrl(null);
+        setMaxDuration(null);
+        const { flvUrl, maxDuration } = await transformVideoPropFunc(selectItem);
+        //防背推
+        if (selectIndex === latestSelectIndex.current) {
+          setMaxDuration(maxDuration);
+          setFlvUrl(flvUrl);
+        }
+      } else {
+        setFlvUrl(get(selectItem, 'flvUrl'));
+        setMaxDuration(get(selectItem, 'maxDuration'));
+      }
+    })();
+  }, [selectItem, model]);
+
+  //切换选中index时候变更key 让组件走销毁逻辑 减少大图/视频组件内部逻辑复杂度
+  const key = 0
+  const imgCmpKey = useMemo(() => `img-key-${key}`, [key]);
+  const videoCmpKey = useMemo(() => `video-key-${key}`, [key]);
+
+  // ========================== 分离参数 =========================
+  const CompareViewProp = {
+    targertImg: generateImg(get(selectItem, 'imgSummary', '')), // 对比图
+    score: get(selectItem, 'score'),
+    similarScore: get(selectItem, 'similarScore'),
+    sourceImg:
+      get(selectItem, 'constractKey', '') ||
+      get(selectItem, 'compaterImages.0') ||
+      generateImg(get(selectItem, 'imgSummary', '')),
+    compaterImages: get(selectItem, 'compaterImages', []),
+    specialTitle,
+    isRelated,
+  };
+  const carouselProp = {
+    selectIndex,
+    setSelectIndex: setSelectIndexWrapper,
+    hasPre,
+    hasNext,
+    dataSource: carouseDataSource,
+    ...otherCarouselProp,
+  } as CarouselProps;
+  const imgViewProp = {
+    ...pick(selectItem, ['imageKey', 'odRect', 'attachImg', 'score']),
+    screenshotButtonRender,
+    ...otherImgViewProp,
+    showCrop$,
+    scale$,
+  } as ImgViewProps;
+
+  const videoViewProp = {
+    flvUrl,
+    maxDuration,
+    screenshotButtonRender,
+    ...otherVideoViewProp,
+    showCrop$,
+  } as VideoViewProps;
+
+  const ToolProps = {
+    ...otherToolProp,
+    isGray: true,
+  } as ToolProps;
+
+  // ========================== 插槽参数 =========================
+  const imgViewRef = useRef<ImgViewRef>(null);
+  const VideoViewRef = useRef<VideoViewRef>(null);
+  scale$;
+  const param: ParamProps = {
+    tab,
+    selectItem,
+    imgViewRef,
+    VideoViewRef,
+    model,
+    setModel,
+    showCrop$,
+    scale$,
+  };
+  const slots = getSolt(children, param);
+
+  // ========================== 监听键盘 =========================
+  useEffect(() => {
+    const onKeyDown = (event) => {
+      const { keyCode } = event;
+      if (keyCode === KeyCode.LEFT) {
+        setSelectIndexWrapper((pre) => --pre);
+      }
+      if (keyCode === KeyCode.RIGHT) {
+        setSelectIndexWrapper((pre) => ++pre);
+      }
+    };
+    document.addEventListener('keydown', onKeyDown);
+    return () => {
+      document.removeEventListener('keydownm', onKeyDown);
+    };
+  }, []);
+
+  // ========================== 监听滚轮 =========================
+  React.useEffect(() => {
+    const mousewheelListener = (e) => {
+      e.preventDefault();
+      let direction = 0;
+      if (e.wheelDelta) {
+        //IE/Opera/Chrome
+        if (e.wheelDelta > 0) {
+          //向上滚动事件
+          direction = 1;
+        } else {
+          //向下滚动事件
+          direction = -1;
+        }
+      } else if (e.detail) {
+        //Firefox
+        if (e.detail < 0) {
+          //向上滚动事件
+          direction = 1;
+        } else {
+          //向下滚动事件
+          direction = -1;
+        }
+      }
+      setSelectIndexWrapper((pre) => {
+        return direction < 0 ? pre + 1 : pre - 1;
+      });
+    };
+    let handleMouseWheel;
+    if (store.bigImgScrollEmit) {
+      handleMouseWheel = addEventListenerWrap(document, 'mousewheel', mousewheelListener);
+    } else {
+      handleMouseWheel?.remove();
+    }
+    return () => {
+      handleMouseWheel?.remove();
+    };
+  }, [store.bigImgScrollEmit]);
+
+  const tabList = [
+    {
+      key: 'related',
+      label: '关联的目标',
+      children: (
+        <div className={styles.relatedContent}>
+          {showCarousel && (
+            <div className={classNames(styles.relatedPics)}>
+              <Carousel {...carouselProp} />
+            </div>
+          )}
+          <div
+            style={
+              isEmpty(relatedList) ? { color: 'rgba(0, 0, 0, 0.25)', cursor: 'not-allowed' } : {}
+            }
+            className={classNames(styles.relatedBtn)}
+            onClick={async (e) => {
+              if (isEmpty(relatedList)) {
+                e.stopPropagation();
+              } else {
+                try {
+                  const { archiveId, passerbyId } = selectItem;
+                  if (archiveId && passerbyId) {
+                    doubleClick({
+                      title: '确认取消关联，取消后可在“其他相似目标推荐”处再次关联',
+                      checkboxLabel: '同时移除档案对应轨迹',
+                      checked: true,
+                      onOk: async () => {
+                        try {
+                          await achieveStore.archive.UnLinkTarget(passerbyId, archiveId);
+                          message.success('目标已成功取消关联！');
+                          // 更新已关联目标列表
+                          const { relatedPassersby } = await achieveStore.archive.GetRelatedArchive(
+                            archiveId
+                          );
+                          setRelatedList(relatedPassersby);
+                          setImageData(relatedPassersby);
+                          // 更新当前相似目标列表
+                          const { similarPassersby } =
+                            await achieveStore.archive.GetSimilarPasserbyList(archiveId);
+                          setSimilarList(similarPassersby);
+                          setSelectIndex((pre) => {
+                            if (pre > 0) {
+                              return pre - 1;
+                            } else {
+                              return 0;
+                            }
+                          });
+                        } catch (e) {
+                          message.success('目标取消关联失败！');
+                          console.error(e);
+                        }
+                      },
+                    });
+                  }
+                } catch (e) {
+                  console.error(e);
+                }
+              }
+            }}
+          >
+            <IconFont
+              icon="icon-guanlian"
+              styles={{ fontWeight: 'bold', margin: '0px 4px 0px 17px' }}
+              size={16}
+            />
+            取消关联
+          </div>
+        </div>
+      ),
+    },
+    {
+      key: 'unRlated',
+      label: '其他相似目标推荐',
+      children: (
+        <div className={styles.relatedContent}>
+          {showCarousel && (
+            <div className={classNames(styles.relatedPics)}>
+              <Carousel {...carouselProp} />
+            </div>
+          )}
+
+          <div
+            style={
+              isEmpty(lastSimData.current)
+                ? { color: 'rgba(0, 0, 0, 0.25)', cursor: 'not-allowed' }
+                : {}
+            }
+            className={classNames(styles.relatedBtn)}
+            onClick={async (e) => {
+              if (isEmpty(lastSimData.current)) {
+                e.stopPropagation();
+              } else {
+                try {
+                  const { archiveId, passerbyId, archiveGroupId, trajectoryId } = selectItem;
+
+                  if (archiveId && passerbyId && archiveGroupId && trajectoryId) {
+                    await achieveStore.archive.LinkTarget({
+                      passerbyId,
+                      archiveId,
+                      archiveGroupId,
+                      trajectoryId,
+                    });
+                    message.success('目标已成功关联！');
+                    // 更新当前相似目标列表
+                    const { similarPassersby } = await achieveStore.archive.GetSimilarPasserbyList(
+                      archiveId
+                    );
+                    setSimilarList(similarPassersby);
+                    setImageData(similarPassersby);
+
+                    // 更新已关联目标列表
+                    const { relatedPassersby } = await achieveStore.archive.GetRelatedArchive(
+                      archiveId
+                    );
+                    setRelatedList(relatedPassersby);
+                    setSelectIndex((pre) => {
+                      if (pre > 0) {
+                        return pre - 1;
+                      } else {
+                        return 0;
+                      }
+                    });
+                  }
+                } catch (e) {
+                  message.error('目标关联失败！');
+                  console.error(e);
+                }
+              }
+            }}
+          >
+            <IconFont
+              icon="icon-guanlian"
+              styles={{ fontWeight: 'bold', margin: '0px 4px 0px 17px' }}
+              size={16}
+            />
+            关联
+          </div>
+        </div>
+      ),
+    },
+  ];
+  return (
+    <Modal
+      open={visible}
+      onCancel={onClose}
+      footer={null}
+      className={classNames(componentName)}
+      centered
+      title={title}
+    >
+      {!isEmpty(attributeList) && <AttributePanel attributeList={attributeList} />}
+      {showHeader && (
+        <Header
+          noBgColor={!isEmpty(attributeList)}
+          value={tab}
+          onChange={setTab}
+          tabsFilter={tabsFilter}
+        />
+      )}
+      <div
+        className={classNames(`${componentName}-view-container`)}
+        style={
+          tab === 'TRACK'
+            ? {
+                height: '718px',
+                marginBottom: '0px',
+              }
+            : {}
+        }
+      >
+        {tab !== 'TRACK' && (
+          <>
+            {/* ---------------------------------- 对比图模式 --------------------------------- */}
+            {model == 'IMAGE' && tab === 'COMPATER' && !isEmpty(selectItem) && (
+              <CompareView {...CompareViewProp} />
+            )}
+            {/* ---------------------------------- 场景图模式 --------------------------------- */}
+            {!isLoading &&
+              model == 'IMAGE' &&
+              tab === 'NORMAL' &&
+              !isEmpty(selectItem?.rectList) && (
+                <ImgView key={imgCmpKey} {...imgViewProp} ref={imgViewRef} />
+              )}
+            {/* -------------------------------- 暂无图片数据 -------------------------------- */}
+            {!isLoading && model == 'IMAGE' && isEmpty(selectItem) && tab === 'COMPATER' && (
+              <NullView {...nullDialogProp}></NullView>
+            )}
+            {!isLoading && model == 'IMAGE' && isEmpty(selectItem.rectList) && tab === 'NORMAL' && (
+              <NullView emptyText={isRelated ? '暂无匹配数据' : '暂无数据'}></NullView>
+            )}
+            {/* --------------------------------- 视频播放模式 --------------------------------- */}
+            {!isLoading && model == 'VIDEO' && (
+              <VideoView key={videoCmpKey} {...videoViewProp} ref={VideoViewRef} />
+            )}
+            {/* ----------------------------------- 左导航 ---------------------------------- */}
+            <Navigation
+              className={classNames(
+                `${componentName}-view-container__nav`,
+                !hasPre && `${componentName}-view-container__nav--disabled`,
+                `${componentName}-view-container__nav--left`
+              )}
+              show={isRelated ? imageData.length !== 1 : dataSource.length !== 1}
+              disabled={!hasPre}
+              prev
+              onClick={(e) => {
+                if (useVirtual && selectIndex === 0) {
+                  !!loadPre && loadPre();
+                  //都跳转到第一个
+                  setSelectIndexWrapper(0);
+                } else {
+                  setSelectIndexWrapper((pre) => pre - 1);
+                }
+              }}
+            />
+            {/* ----------------------------------- 右导航 ---------------------------------- */}
+            <Navigation
+              className={classNames(
+                `${componentName}-view-container__nav`,
+                !hasNext && `${componentName}-view-container__nav--disabled`,
+                `${componentName}-view-container__nav--right`
+              )}
+              show={isRelated ? imageData.length !== 1 : dataSource.length !== 1}
+              disabled={!hasNext}
+              next
+              onClick={async (e) => {
+                if (isRelated) {
+                  if (useVirtual && selectIndex === imageData.length - 1) {
+                    !!loadNext && (await loadNext());
+                    //都跳转到第一个
+                    setSelectIndexWrapper(0);
+                  } else {
+                    setSelectIndexWrapper((pre) => pre + 1);
+                  }
+                } else {
+                  if (useVirtual && selectIndex === dataSource.length - 1) {
+                    !!loadNext && (await loadNext());
+                    //都跳转到第一个
+                    setSelectIndexWrapper(0);
+                  } else {
+                    setSelectIndexWrapper((pre) => pre + 1);
+                  }
+                }
+              }}
+            />
+          </>
+        )}
+      </div>
+      {/* 工具集合 */}
+      {tab !== 'TRACK' && showTool && (
+        <>
+          <div className={classNames(`${componentName}-tool-container`)}>
+            <Tool {...ToolProps} param={param} />
+          </div>
+          {slots['after-tool']}
+        </>
+      )}
+      {/* 人脸质量分 */}
+      {!!selectqualityScore && store.user.isfaceScore && model == 'IMAGE' && tab === 'NORMAL' && (
+        <div
+          style={isRelated ? { bottom: 220 } : { bottom: 90 }}
+          slot={'after-tool'}
+          className={classNames(`${componentName}__face-score`)}
+        >{`人脸质量分：${(selectqualityScore as number).toFixed(2)}`}</div>
+      )}
+      {/* --------------------------------- 模型碰撞组件 --------------------------------- */}
+      {isRelated && tab !== 'TRACK' && (
+        <div className={styles.relatedWrapper}>
+          <TabPane
+            className={styles.relatedTabs}
+            tabPosition={'left'}
+            activeKey={activeKey}
+            onChange={(key: string) => {
+              setActiveKey(key);
+            }}
+            items={tabList.map((item) => {
+              return {
+                label: item.label,
+                key: item.key,
+                children: item.children,
+              };
+            })}
+          />
+        </div>
+      )}
+    </Modal>
+  );
+};
+
+export default observer(BigImageDialog);
--- a/packages/biz/src/BigImageModal/index.tsx
+++ b/packages/biz/src/BigImageModal/index.tsx
@ -0,0 +1,162 @@
+// @ts-nocheck
+import React, { useRef, useState } from 'react'
+import { Descriptions, Modal, Tabs } from 'antd';
+import classNames from 'classnames'
+import type { ModalProps, DescriptionsProps, TabsProps } from 'antd'
+import { get } from '@zhst/func';
+import './index.less'
+import Navigation from './components/navigation';
+
+const DescriptionsItem = Descriptions.Item
+
+export const componentPrefix = 'zhst-image'
+
+export interface BigImageModalProps extends ModalProps {
+  visible: boolean   // 弹框显示隐藏
+  descriptionConfig: {
+    data: {      // 描述列表
+      title: string;        // 标题
+      children: Pick<DescriptionsProps, 'items'>  // 描述项
+    }[]
+  }
+  tabsConfig: {       // 导航栏配置
+    data: Pick<TabsProps, 'items'> & {
+      key: 'NORMAL' | 'COMPATER' | 'TRACK'
+    }     // 导航栏列表
+  }
+  dataSource: any
+  imageData: any
+  relatedData: any
+}
+
+const initialStyle ={
+  fontSize: '12px'
+}
+
+const BigImageModal: React.FC<BigImageModalProps> = (props) => {
+  const {
+    title = '-',
+    open,
+    visible,
+    children,
+    descriptionConfig = {
+      data: []
+    },
+    tabsConfig = {
+      data: [
+        {
+          label: '对比图模式',
+          key: '1',
+          children: '对比图组件',
+        },
+        {
+          label: '场景图模式',
+          key: '2',
+          children: '场景图组件',
+        }
+      ],
+    },
+    dataSource = [],
+    imageData = [],
+    relatedData = [],
+  } = props
+
+  const showCropRef = useRef(false);
+  const scaleRef = useRef(0);
+
+  // ========================== 头切换 =========================
+  const [activeKey, setActiveKey] = useState<string>(get(tabsConfig, 'data[0].key'));
+
+  // ========================= 预览切换下标 =========================
+  const [previewIndex, setPreviewIndex] = useState<number>(0)
+  const [isRelated, setIsRelated] = useState<number>(false)
+
+  return (
+    <Modal
+      destroyOnClose
+      open={open || visible}
+      footer={null}
+      className={componentPrefix}
+      title={title}
+      {...props}
+    >
+      {descriptionConfig.data.map(descriptions => (
+        <Descriptions
+          key={descriptions.title}
+          title={
+            <p style={{ margin: '12px 0 0', fontSize: initialStyle.fontSize }}>
+              {descriptions.title}
+            </p>
+          }
+          column={8}
+          style={{ padding: '0 64px' }}
+        >
+          {descriptions?.children?.map(item => (
+            <DescriptionsItem
+              key={item.key}
+              label={item.label}
+              span={1}
+              contentStyle={{ fontSize: initialStyle.fontSize }}
+              labelStyle={{ fontSize: initialStyle.fontSize }}
+            >{item.children}</DescriptionsItem>
+          ))}
+        </Descriptions>
+      ))}
+      <Tabs
+        defaultActiveKey={activeKey}
+        centered
+        tabBarStyle={{ fontSize: '18px' }}
+        items={tabsConfig.data}
+        {...tabsConfig}
+      />
+      <div
+        className={classNames(`${componentPrefix}-view-container`)}
+        style={
+          activeKey === 'TRACK'
+            ? {
+                height: '718px',
+                marginBottom: '0px',
+              }
+            : {}
+        }
+      >
+        {
+          activeKey !== 'TRACK' && (
+            <>
+              {/* ----------------------------------- 上一张按钮 ---------------------------------- */}
+              <Navigation
+                className={classNames(
+                  `${componentPrefix}-view-container__nav`,
+                  previewIndex <= 0 && `${componentPrefix}-view-container__nav--disabled`,
+                  `${componentPrefix}-view-container__nav--left`
+                )}
+                show={isRelated ? (imageData.length > 1) : (dataSource.length > 1)}
+                disabled={previewIndex <= 0}
+                prev
+                onClick={() => {
+                  setPreviewIndex((pre) => pre - 1);
+                }}
+              />
+              {/* ----------------------------------- 下一张按钮 ---------------------------------- */}
+              <Navigation
+                className={classNames(
+                  `${componentPrefix}-view-container__nav`,
+                  ((previewIndex >= imageData.length - 1) || (previewIndex >= dataSource.length - 1)) && `${componentPrefix}-view-container__nav--disabled`,
+                  `${componentPrefix}-view-container__nav--right`
+                )}
+                show={isRelated ? (imageData.length > 1) : (dataSource.length > 1)}
+                disabled={((previewIndex >= imageData.length - 1) || (previewIndex >= dataSource.length - 1))}
+                next
+                onClick={async (e) => {
+                  setPreviewIndex((pre) => pre + 1);
+                }}
+              />
+            </>
+          )
+        }
+      </div>
+    </Modal>
+  )
+}
+
+export default BigImageModal
--- a/packages/biz/src/BigImageModal/mock.ts
+++ b/packages/biz/src/BigImageModal/mock.ts
@ -0,0 +1,902 @@
+export const IMAGE_DATA = {
+    "enAbleDeleteFeature": true,
+    "tabsFilter": [
+        "COMPATER",
+        "NORMAL"
+    ],
+    "dataSources": [
+        {
+            "objectId": "1742110565582518272",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.7163062,
+            "timestamp": 1704186491979,
+            "deviceId": "129533",
+            "id": "129533",
+            "name": "4楼门口过道人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.125,
+            "latitude": 30.280500411987305,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "38",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742110565582518272",
+                "solutionId": "1",
+                "deviceId": "129533",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742110532019697664",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704186491979",
+                "width": 0,
+                "height": 0,
+                "originWidth": 1920,
+                "originHeight": 1080,
+                "offsetTime": "24714687",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.603125,
+                "y": 0.3314815,
+                "w": 0.0578125,
+                "h": 0.2712963
+            },
+            "bboxExtInFrame": {
+                "x": 0.546875,
+                "y": 0.2638889,
+                "w": 0.17135416,
+                "h": 0.40648147
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+            "confidence": 0.817271,
+            "sourceObjectId": "1742110565603489792",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 1,
+            "subObjectType": [
+                "OBJECT_TYPE_FACE"
+            ],
+            "subObjectIds": [
+                "1742110532015503360"
+            ],
+            "cameraInfo": {
+                "id": "129533",
+                "name": "4楼门口过道人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.125,
+                "latitude": 30.280500411987305,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "38",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129533/1742110565582518272.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129533/1742110565582518272.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129533",
+            "cameraName": "4楼门口过道人脸"
+        },
+        {
+            "objectId": "1742092780462684161",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.70154816,
+            "timestamp": 1704182251640,
+            "deviceId": "129533",
+            "id": "129533",
+            "name": "4楼门口过道人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.125,
+            "latitude": 30.280500411987305,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "38",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742092780462684161",
+                "solutionId": "1",
+                "deviceId": "129533",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742092746237163520",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704182251640",
+                "width": 0,
+                "height": 0,
+                "originWidth": 1920,
+                "originHeight": 1080,
+                "offsetTime": "20474348",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.63177085,
+                "y": 0.38333333,
+                "w": 0.078125,
+                "h": 0.3537037
+            },
+            "bboxExtInFrame": {
+                "x": 0.55885416,
+                "y": 0.29537037,
+                "w": 0.22447917,
+                "h": 0.5314815
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780462684161.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780768868352.jpg",
+            "confidence": 0.888334,
+            "sourceObjectId": "1742092780768868352",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 1,
+            "subObjectType": [
+                "OBJECT_TYPE_FACE"
+            ],
+            "subObjectIds": [
+                "1742092746232969217"
+            ],
+            "cameraInfo": {
+                "id": "129533",
+                "name": "4楼门口过道人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.125,
+                "latitude": 30.280500411987305,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "38",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129533/1742092780462684161.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129533/1742092780462684161.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780462684161.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092780768868352.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129533",
+            "cameraName": "4楼门口过道人脸"
+        },
+        {
+            "objectId": "1742092514409592832",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.703765,
+            "timestamp": 1704182186451,
+            "deviceId": "129529",
+            "id": "129529",
+            "name": "4入口人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.12100219726562,
+            "latitude": 30.280099868774414,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "34",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742092514409592832",
+                "solutionId": "1",
+                "deviceId": "129529",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742092482440607744",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704182186451",
+                "width": 0,
+                "height": 0,
+                "originWidth": 2560,
+                "originHeight": 1440,
+                "offsetTime": "20409182",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.6195313,
+                "y": 0.24583334,
+                "w": 0.09804688,
+                "h": 0.41944444
+            },
+            "bboxExtInFrame": {
+                "x": 0.53515625,
+                "y": 0.14027777,
+                "w": 0.26640624,
+                "h": 0.63125
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+            "confidence": 0.92494,
+            "sourceObjectId": "1742092515508500480",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 1,
+            "subObjectType": [
+                "OBJECT_TYPE_FACE"
+            ],
+            "subObjectIds": [
+                "1742092482432219136"
+            ],
+            "cameraInfo": {
+                "id": "129529",
+                "name": "4入口人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.12100219726562,
+                "latitude": 30.280099868774414,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "34",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129529/1742092514409592832.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129529/1742092514409592832.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129529",
+            "cameraName": "4入口人脸"
+        }
+    ],
+    "selectIndex": 4,
+    "disableBtn": [
+        0,
+        1,
+        4,
+        20
+    ],
+    "dataSource": [
+        {
+            "objectId": "1742110565582518272",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.7163062,
+            "timestamp": 1704186491979,
+            "deviceId": "129533",
+            "id": "129533",
+            "name": "4楼门口过道人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.125,
+            "latitude": 30.280500411987305,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "38",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742110565582518272",
+                "solutionId": "1",
+                "deviceId": "129533",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742110532019697664",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704186491979",
+                "width": 0,
+                "height": 0,
+                "originWidth": 1920,
+                "originHeight": 1080,
+                "offsetTime": "24714687",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.603125,
+                "y": 0.3314815,
+                "w": 0.0578125,
+                "h": 0.2712963
+            },
+            "bboxExtInFrame": {
+                "x": 0.546875,
+                "y": 0.2638889,
+                "w": 0.17135416,
+                "h": 0.40648147
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+            "confidence": 0.817271,
+            "sourceObjectId": "1742110565603489792",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 1,
+            "subObjectType": [
+                "OBJECT_TYPE_FACE"
+            ],
+            "subObjectIds": [
+                "1742110532015503360"
+            ],
+            "cameraInfo": {
+                "id": "129533",
+                "name": "4楼门口过道人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.125,
+                "latitude": 30.280500411987305,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "38",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129533/1742110565582518272.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129533/1742110565582518272.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565582518272.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742110565603489792.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129533",
+            "cameraName": "4楼门口过道人脸"
+        },
+        {
+            "objectId": "1742092680994764802",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.7007122,
+            "timestamp": 1704182225679,
+            "deviceId": "129533",
+            "id": "129533",
+            "name": "4楼门口过道人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.125,
+            "latitude": 30.280500411987305,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "38",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742092680994764802",
+                "solutionId": "1",
+                "deviceId": "129533",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742092646219790337",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704182225679",
+                "width": 0,
+                "height": 0,
+                "originWidth": 1920,
+                "originHeight": 1080,
+                "offsetTime": "20448387",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.5265625,
+                "y": 0.49537036,
+                "w": 0.104166664,
+                "h": 0.35833332
+            },
+            "bboxExtInFrame": {
+                "x": 0.465625,
+                "y": 0.40648147,
+                "w": 0.22708334,
+                "h": 0.537963
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092680994764802.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092681720379392.jpg",
+            "confidence": 0.769764,
+            "sourceObjectId": "1742092681720379392",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 0,
+            "subObjectType": [],
+            "subObjectIds": [],
+            "cameraInfo": {
+                "id": "129533",
+                "name": "4楼门口过道人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.125,
+                "latitude": 30.280500411987305,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "38",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129533/1742092680994764802.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129533/1742092680994764802.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092680994764802.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129533/1742092681720379392.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129533",
+            "cameraName": "4楼门口过道人脸"
+        },
+        {
+            "objectId": "1742092514409592832",
+            "condition": {
+                "featureInfo": null,
+                "featureData": "AAAAAAAAAAAAAAAAAAAAAAAA==",
+                "imageData": "",
+                "alg": "VERSION_REID_HEAD_ATTR",
+                "rect": {
+                    "x": 0.271875,
+                    "y": 0.32222223,
+                    "w": 0.2859375,
+                    "h": 0.67777777
+                },
+                "objectImageUrl": "singer-20240102/1/129529/1742047651878156288.jpg",
+                "srcImageUrl": "singer-20240102/1/129529/1742047652511496192.jpg"
+            },
+            "score": 0.703765,
+            "timestamp": 1704182186451,
+            "deviceId": "129529",
+            "id": "129529",
+            "name": "4入口人脸",
+            "dirid": "0",
+            "status": "1",
+            "longitude": 120.12100219726562,
+            "latitude": 30.280099868774414,
+            "caseId": "0",
+            "caseGroup": "",
+            "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+            "extendInfo": {
+                "vmsPlatformId": "29",
+                "vmsChannel": "34",
+                "vmsCameraDecoderTag": "hikvision",
+                "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                "deviceVender": "0",
+                "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                "ip": "",
+                "port": "0",
+                "username": "",
+                "passwd": "",
+                "rtspAddress": "",
+                "facesnapChannel": "",
+                "edgeDeviceSn": "",
+                "platform1400Id": 0,
+                "useRtspAddress": false,
+                "frameCheck": false,
+                "frameRectX": 0,
+                "frameRectY": 0,
+                "frameRectW": 0,
+                "frameRectH": 0,
+                "edgeNodeId": "0",
+                "processStatus": "FILTER_REALTIME_DEFAULT"
+            },
+            "objectIndex": {
+                "objectId": "1742092514409592832",
+                "solutionId": "1",
+                "deviceId": "129529",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "isObjectTrack": true,
+            "pathId": "1742092482440607744",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1704182186451",
+                "width": 0,
+                "height": 0,
+                "originWidth": 2560,
+                "originHeight": 1440,
+                "offsetTime": "20409182",
+                "skipNumber": "0"
+            },
+            "level": 1,
+            "bboxInFrame": {
+                "x": 0.6195313,
+                "y": 0.24583334,
+                "w": 0.09804688,
+                "h": 0.41944444
+            },
+            "bboxExtInFrame": {
+                "x": 0.53515625,
+                "y": 0.14027777,
+                "w": 0.26640624,
+                "h": 0.63125
+            },
+            "objectImageKey": "",
+            "objectExtImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+            "frameImageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+            "confidence": 0.92494,
+            "sourceObjectId": "1742092515508500480",
+            "storeTimestamp": "0",
+            "gbNumber": "",
+            "qualityScore": 0,
+            "subObjectCount": 1,
+            "subObjectType": [
+                "OBJECT_TYPE_FACE"
+            ],
+            "subObjectIds": [
+                "1742092482432219136"
+            ],
+            "cameraInfo": {
+                "id": "129529",
+                "name": "4入口人脸",
+                "dirid": "0",
+                "status": "1",
+                "longitude": 120.12100219726562,
+                "latitude": 30.280099868774414,
+                "caseId": "0",
+                "caseGroup": "",
+                "isDeleted": "DEVICEMANAGER_BOOL_DEFAULT",
+                "extendInfo": {
+                    "vmsPlatformId": "29",
+                    "vmsChannel": "34",
+                    "vmsCameraDecoderTag": "hikvision",
+                    "platformPluginType": "PLATFORM_PLUGIN_TYPE_HAIKANG_NVR",
+                    "deviceVender": "0",
+                    "type": "DEVICEMANAGER_CAMERA_TYPE_NORMAL",
+                    "ip": "",
+                    "port": "0",
+                    "username": "",
+                    "passwd": "",
+                    "rtspAddress": "",
+                    "facesnapChannel": "",
+                    "edgeDeviceSn": "",
+                    "platform1400Id": 0,
+                    "useRtspAddress": false,
+                    "frameCheck": false,
+                    "frameRectX": 0,
+                    "frameRectY": 0,
+                    "frameRectW": 0,
+                    "frameRectH": 0,
+                    "edgeNodeId": "0",
+                    "processStatus": "FILTER_REALTIME_DEFAULT"
+                }
+            },
+            "solutionId": "1",
+            "fragmentId": "0",
+            "contrastKey": "singer-20240102/1/129529/1742092514409592832.jpg",
+            "compaterImages": [
+                "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742047651878156288.jpg"
+            ],
+            "imgSummary": "singer-20240102/1/129529/1742092514409592832.jpg",
+            "imageKey": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092514409592832.jpg",
+            "srcImageUrl": "http://10.0.0.7:30003/file/singer-20240102/1/129529/1742092515508500480.jpg",
+            "algorithmVersion": "VERSION_REID_HEAD_ATTR",
+            "cameraId": "129529",
+            "cameraName": "4入口人脸"
+        }
+    ],
+    "isArchiveDetail": false,
+    "ToolProps": {
+        "renderVideoBtn": true,
+        "disableVideo": false
+    },
+    "specialTitle": ""
+}
--- a/packages/biz/src/Demo/index.tsx
+++ b/packages/biz/src/Demo/index.tsx
@ -1,12 +1,12 @@
 import React from 'react'
-import { Button } from '@zhst/meta'
+import { Button } from 'antd'
 import { useThrottleFn } from '@zhst/hooks'

 export default () => {

-  const ok = () => useThrottleFn(() => console.log('123'))
+  const { run } = useThrottleFn(() => console.log('123'))

  return (
-    <Button onClick={() => ok()} >测试</Button>
+    <Button onClick={() => run()} >测试</Button>
  )
 }
--- a/packages/biz/src/adapter/BigImageModalAdapter/index.tsx
+++ b/packages/biz/src/adapter/BigImageModalAdapter/index.tsx
@ -0,0 +1,177 @@
+/**
+ * 适配老的大屏组件数据格式传入
+ */
+import React from 'react';
+import { AlgorithmVersionStr, HumanProperty, ObjectType, Rect, ViewOption, AlignType, IScreenshotButtonProp, ODRECT } from './interface'
+
+export type TAB_TYPE = 'COMPATER' | 'NORMAL' | 'TRACK';
+export type MODEL_TYPE = 'VIDEO' | 'IMAGE';
+
+export interface ImgViewProps extends React.HTMLAttributes<HTMLElement> {
+  imageKey: string; //不在监听url变化 更新走销毁
+  odRect: ODRECT;
+  attachImg?: Array<{ label: string; url: string }>;
+  showAttachImgLabel: boolean;
+  /* 截图渲染 */
+  screenshotButtonAlign: AlignType;
+  screenshotButtonRender: (screenshotButtonProp: IScreenshotButtonProp) => React.ReactElement;
+  /* 可观测值 */
+  scale$?: number;
+  showCrop$?: boolean;
+  hideLeftTopBtn?: boolean;
+  score?: number;
+  viewOption?: ViewOption;
+}
+
+export interface VideoViewProps {
+  /* 播放地址 */
+  flvUrl: string;
+  /* 播放总时间 */
+  maxDuration?: number;
+  /* 截图渲染 */
+  screenshotButtonAlign?: AlignType;
+  screenshotButtonRender?: (screenshotButtonProp: IScreenshotButtonProp) => React.ReactElement;
+  /* 默认截图框 */
+  defautlNormalizationRect?: Rect;
+  /* 截图回调 */
+  onCropChange?: (showCrop: boolean, normalizationRect: null | Rect) => void;
+
+  /* 可观测值 */
+  showCrop$?: boolean;
+}
+
+export interface CarouselProps {
+  hasPre?: boolean;
+  hasNext?: boolean;
+  selectIndex: number;
+  setSelectIndex: React.Dispatch<React.SetStateAction<number>>;
+  dataSource: Array<{
+    key: string;
+    url: string;
+  }>;
+}
+
+export type ISelectItem = Partial<Omit<ImgViewProps, 'screenshotButtonRender'>> &
+  Partial<Omit<VideoViewProps, 'screenshotButtonRender'>>;
+
+export interface HeaderProps {
+  value: TAB_TYPE;
+  onChange: (type: TAB_TYPE) => void;
+  tabsFilter: TAB_TYPE[];
+}
+
+export interface ImgViewRef {
+  /* 图片实例 */
+  imgInsRef: React.MutableRefObject<any>;
+  /* 切换图片模式 */
+  setShowCrop: React.Dispatch<React.SetStateAction<boolean>>;
+}
+
+
+export interface VideoViewRef {
+  /* 当前图片模式 */
+  cropAble: boolean;
+  setShowCrop: React.Dispatch<React.SetStateAction<boolean>>;
+  downloadVideoframe: () => void;
+}
+
+export interface ParamProps {
+  tab: string;
+  selectItem: ISelectItem;
+  imgViewRef: React.MutableRefObject<ImgViewRef>;
+  VideoViewRef: React.MutableRefObject<VideoViewRef>;
+  model: MODEL_TYPE;
+  setModel: React.Dispatch<React.SetStateAction<MODEL_TYPE>>;
+  /* 可观测值 */
+  scale$: number;
+  showCrop$: boolean;
+}
+
+
+export interface BigImageData {
+  //imageKey 小图
+  extendRectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
+  rectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
+  attachImg: { url: string; label: '形体' | '人脸' }[];
+  odRect: Rect;
+  imageKey: string; //大图
+  imgSummary: string; //摘要图
+
+  objectExtImageKey: string; //比对到的目标图扩展图 === imgSummary
+  attributeList: { label: string; list: any[] }[];
+  archiveImages?: any;
+  spaceName: string;
+
+  objectType: ObjectType;
+  objectId: string; //这张摘要本身的Id
+  bodyObjectId?: string;
+  faceObjectId?: string; //这张摘要下的人脸Id(如果有)
+  sourceObjectId?: string; //这张摘要上游的形体Id(如果有)
+  cameraId: string;
+  cameraName: string;
+  selectIndex: number;
+  humanProperty: HumanProperty;
+  qualityScore?: number; //人脸质量分
+  score: number; //相似度
+  timestamp: string;
+  bodyImageUrl: string;
+  faceImageUrl: string;
+  algorithmVersion: AlgorithmVersionStr;
+
+  bodySpaceName: string;
+  faceSpaceName: string;
+
+  solutionId?: string;
+  [index: string]: any;
+}
+
+interface IOldImageData {
+  visible?: boolean;
+  defaultModel?: MODEL_TYPE;
+  onClose?: () => void;
+  isLoading?: boolean;
+  hasPre?: boolean;
+  hasNext?: boolean;
+  selectIndex?: number;
+  onSelectIndexChange?: (i: number) => void;
+  dataSource: any[];
+  dataSources: any[];
+  relatedData?: any[];
+  transformPropFunc: (item: any) => ISelectItem;
+  transformVideoPropFunc: (
+    item: ISelectItem
+  ) => Promise<Omit<VideoViewProps, 'screenshotButtonRender'>>;
+  screenshotButtonRender?: (screenshotButtonProp: IScreenshotButtonProp) => React.ReactElement;
+  showTool?: boolean;
+  showCarousel?: boolean;
+  imgViewProp?: Partial<ImgViewProps>;
+  videoViewProp?: Partial<VideoViewProps>;
+  ToolProps?: Partial<ToolProps>;
+  nullDialogProp?: {
+    emptyText?: string;
+  };
+  showHeader?: boolean;
+  tabsFilter?: TAB_TYPE[];
+  useVirtual?: boolean;
+  loadNext?: (i: number) => Promise<void>;
+  loadPre?: (i: number) => Promise<void>;
+  children: React.ReactNode;
+  title?: string;
+  specialTitle?: string;
+  isRelated?: boolean;
+  carouselProp?: Partial<CarouselProps>;
+}
+
+export interface ToolProps {
+  renderRight?: (props: ParamProps) => React.ReactNode;
+  renderLeft?: (props: ParamProps) => React.ReactNode;
+  renderVideoBtn?: boolean;
+  param: ParamProps;
+  disableVideo: boolean;
+}
+
+export default (data: IOldImageData) => {
+  const newData = data
+
+  return newData
+}
--- a/packages/biz/src/adapter/BigImageModalAdapter/interface.d.ts
+++ b/packages/biz/src/adapter/BigImageModalAdapter/interface.d.ts
@ -0,0 +1,217 @@
+export type CamerasStatusList = [string[], string[], string[]];
+
+export type Rect = { x: number; y: number; w: number; h: number };
+
+export type StatusList = {
+  taskOverview: any;
+  taskIndex: {
+    deviceId: string;
+    solutionId: string;
+  };
+}[];
+
+export enum OperationType {
+  OPERATION_TYPE_UNKNOW, // 未知状态，传该值会报错
+  OPERATION_TYPE_START,
+  OPERATION_TYPE_STOP
+}
+
+
+export enum AlgorithmVersion {
+  VERSION_MGN_BNN, // MGN+BNN算法
+  VERSION_BNN_PRO, // BNNPRO算法
+  VERSION_BNN_PRO_ATTR, // BNNPROATTR算法
+  VERSION_BNN_PRO_ATTR_SCORE, // BNNPROATTR算法
+  VERSION_FACE, // 人脸算法
+  VERSION_HEAD, // 头肩算法
+  VERSION_NON_MOTOR_VEHICLE, // 非机动车的算法
+  VERSION_REID_HEAD_ATTR, // 形体头肩属性三种特征融合的算法
+  VERSION_MOTOR_VEHICLE, // 机动车的算法
+}
+
+export enum AlgorithmVersionStr {
+  VERSION_MGN_BNN = 'VERSION_MGN_BNN', // MGN+BNN算法
+  VERSION_BNN_PRO = 'VERSION_BNN_PRO', // BNNPRO算法
+  VERSION_BNN_PRO_ATTR = 'VERSION_BNN_PRO_ATTR', // BNNPROATTR算法
+  VERSION_BNN_PRO_ATTR_SCORE = 'VERSION_BNN_PRO_ATTR_SCORE', // BNNPROATTR算法
+  VERSION_FACE = 'VERSION_FACE', // 人脸算法
+  VERSION_HEAD = 'VERSION_HEAD', // 头肩算法
+  VERSION_NON_MOTOR_VEHICLE = 'VERSION_NON_MOTOR_VEHICLE', // 非机动车的算法
+  VERSION_REID_HEAD_ATTR = 'VERSION_REID_HEAD_ATTR', // 形体头肩属性三种特征融合的算法
+  VERSION_MOTOR_VEHICLE = 'VERSION_MOTOR_VEHICLE', // 机动车的算法
+}
+
+类型枚举
+export enum ObjectType {
+  OBJECT_TYPE_NULL,
+  OBJECT_TYPE_PEDESTRAIN,
+  OBJECT_TYPE_BICYCLE,
+  OBJECT_TYPE_CAR,
+  OBJECT_TYPE_MOTORBIKE,
+  OBJECT_TYPE_AEROPLANE,
+  OBJECT_TYPE_BUS,
+  OBJECT_TYPE_TRAIN,
+  OBJECT_TYPE_TRUCK,
+  OBJECT_TYPE_MOTOR_RIDER,
+  OBJECT_TYPE_BIKE_RIDER,
+  OBJECT_TYPE_MAX,
+  OBJECT_TYPE_FACE = 101,
+}
+
+// 性别
+export enum Gender {
+  GENDER_NONE = 'GENDER_NONE',
+  GENDER_MAN = 'GENDER_MAN',
+  GENDER_WOMAN = 'GENDER_WOMAN',
+}
+
+// 年龄
+export enum Age {
+  AGE_ALL = 'AGE_ALL',
+  AGE_ZERO = 'AGE_ZERO',
+  AGE_OVERENGHTEEN = 'AGE_OVERENGHTEEN',
+  AGE_OVERSIXTY = 'AGE_OVERSIXTY',
+}
+
+// 戴帽子状态
+export enum Hat {
+  HAT_ALL = 'HAT_ALL',
+  HAT_NONE = 'HAT_NONE',
+  HAT_OWNED = 'HAT_OWNED',
+}
+
+// 颜色
+export enum Color {
+  COLOR_ALL = 'COLOR_ALL',
+  COLOR_BLACK = 'COLOR_BLACK',
+  COLOR_WHITE = 'COLOR_WHITE',
+  COLOR_GRAY = 'COLOR_GRAY',
+  COLOR_BROWN = 'COLOR_BROWN',
+  COLOR_PINK = 'COLOR_PINK',
+  COLOR_REDANDORANGE = 'COLOR_REDANDORANGE',
+  COLOR_YELLOW = 'COLOR_YELLOW',
+  COLOR_GREEN = 'COLOR_GREEN',
+  COLOR_BLUE = 'COLOR_BLUE',
+  COLOR_PURPLE = 'COLOR_PURPLE',
+}
+
+// 背包
+export enum Package {
+  PACKAGE_ALL = 'PACKAGE_ALL',
+  PACKAGE_HANDBAG = 'PACKAGE_HANDBAG',
+  PACKAGE_BACKPACK = 'PACKAGE_BACKPACK',
+  PACKAGE_SHOULDERBAG = 'PACKAGE_SHOULDERBAG',
+  PACKAGE_OTHER = 'PACKAGE_OTHER',
+  PACKAGE_NONE = 'PACKAGE_NONE',
+}
+
+// 行走模式
+export enum WalkPattern {
+  WALKPATTERN_ALL = 'WALKPATTERN_ALL',
+  WALKPATTERN_WALK = 'WALKPATTERN_WALK',
+  WALKPATTERN_RIDING = 'WALKPATTERN_RIDING',
+}
+
+// 人类属性
+export interface HumanProperty {
+  age: Age;
+  downColor: Color;
+  gender: Gender;
+  hat: Hat;
+  package: Package;
+  upColor: Color;
+  walkPattern: WalkPattern;
+}
+
+// 人类属性枚举
+export interface EnumHumanProperty {
+  Gender: typeof Gender;
+  Age: typeof Age;
+  Hat: typeof Hat;
+  Color: typeof Color;
+  Package: typeof Package;
+  WalkPattern: typeof WalkPattern;
+}
+
+export interface IScreenshotButtonProp {
+    model: 'VIDEO' | 'IMAGE';
+    getCropInfo: () => Promise<RESP>;
+    setShowCrop: React.Dispatch<React.SetStateAction<boolean>>;
+    cropType: typeof cropType[number];
+    selectAlgorithmVersion: number;
+}
+
+export interface AlignType {
+    /**
+     * move point of source node to align with point of target node.
+     * Such as ['tr','cc'], align top right point of source node with center point of target node.
+     * Point can be 't'(top), 'b'(bottom), 'c'(center), 'l'(left), 'r'(right) */
+    points?: AlignPoint[];
+    /**
+     * offset source node by offset[0] in x and offset[1] in y.
+     * If offset contains percentage string value, it is relative to sourceNode region.
+     */
+    offset?: number[];
+    /**
+     * offset target node by offset[0] in x and offset[1] in y.
+     * If targetOffset contains percentage string value, it is relative to targetNode region.
+     */
+    targetOffset?: number[];
+    /**
+     * If adjustX field is true, will adjust source node in x direction if source node is invisible.
+     * If adjustY field is true, will adjust source node in y direction if source node is invisible.
+     */
+    overflow?: {
+        adjustX?: boolean | number;
+        adjustY?: boolean | number;
+    };
+    /**
+     * Whether use css right instead of left to position
+     */
+    useCssRight?: boolean;
+    /**
+     * Whether use css bottom instead of top to position
+     */
+    useCssBottom?: boolean;
+    /**
+     * Whether use css transform instead of left/top/right/bottom to position if browser supports.
+     * Defaults to false.
+     */
+    useCssTransform?: boolean;
+    ignoreShake?: boolean;
+}
+
+export type ODRECT = {
+    topleft: {
+        x: number;
+        y: number;
+    };
+    width: number;
+    height: number;
+};
+
+export interface ViewOption {
+  /* 图片url */
+  image?: string | HTMLImageElement;
+
+  /* 缩放灵敏度(0,1],default: 0.1 */
+  wheelZoomRatio?: number;
+
+  /*
+   * 是否允许缩放
+   * @default: true
+   */
+  scaleAble?: boolean;
+
+  /*
+   * 是否允许拖拽
+   * @default: true
+   */
+  dragAble?: boolean;
+
+  /*
+   * fit scale 作为 最小缩放
+   * @default: false
+   */
+  fitScaleAsMinScale?: boolean;
+}
--- a/packages/biz/src/adapter/index.ts
+++ b/packages/biz/src/adapter/index.ts
@ -0,0 +1 @@
+export { default as BigImageModalAdapter } from './BigImageModalAdapter'
--- a/packages/biz/src/global.d.ts
+++ b/packages/biz/src/global.d.ts
--- a/packages/biz/src/hooks/useIntelligentTracking/index.tsx
+++ b/packages/biz/src/hooks/useIntelligentTracking/index.tsx
@ -0,0 +1,378 @@
+//@ts-nocheck
+import * as turf from '@turf/turf';
+import { getListTaskStatus, getCameraStatusFunc } from '../useTaskState';
+import Tree from '@common/components/CameraTree/Tree';
+import doRequest from '../../utils/request';
+import { Dayjs as Moment } from 'dayjs';
+import { message } from 'antd';
+import { SearchCamera } from '@common/components/CameraTree/utils';
+import { get, isEmpty } from '@zhst/func';
+import type { OperationType } from '../../interface'
+
+
+//默认取值
+let defaultFaceThreshold = 0.68;
+let defaultBodyThreshold = 0.7;
+//下边栏人脸数量，默认为5
+let defaultFaceResultNum = 5;
+//追踪圈半径长度(m),默认为150
+let defaultRadius = 0.15;
+//查询周期（s）默认是10,，只负责保存做展示用
+let defaultQueryCycle = 10;
+
+//获取默认半径
+export const getDefaultRadius = () => {
+  return defaultRadius;
+};
+//设置默认半径
+export const setDefaultRadius = (radius: number) => {
+  defaultRadius = radius;
+};
+//检索间隔时长
+let searchIntervalDuration = 10;
+//设置检索时长
+export const setSearchIntervalDuration = (duration: number) => {
+  searchIntervalDuration = duration;
+};
+//获取检索时长
+export const getSearchIntervalDuration = (time: number) => {
+  return time;
+};
+
+//通过id停止或启动任务
+export const operateTrackById = async (smartTrackId: number, operationType: OperationType) => {
+  try {
+    const data = {
+      operationType,
+      smartTrackId,
+    };
+    await doRequest({
+      method: 'PUT',
+      url: '/singer.SmartTrackService/OperationSmartTrack',
+      data,
+    });
+    message.success('操作成功');
+  } catch (err) {
+    console.error(err);
+    message.success('操作失败');
+  }
+};
+//通过id删除追踪任务
+export const deleteTrackById = async (smartTrackId: number) => {
+  try {
+    await doRequest({
+      method: 'DELETE',
+      url: '/singer.SmartTrackService/DeleteSmartTrack',
+      data: {
+        smartTrackId,
+      },
+    });
+  } catch (err) {
+    console.error(err);
+  }
+};
+
+//编辑追踪任务图片
+export const modifyTrackImgs = async (smartTrackId: number, images: Array<Object>) => {
+  try {
+    await doRequest({
+      method: 'PUT',
+      url: '/singer.SmartTrackService/ModifyTrackImg',
+      data: {
+        images,
+        smartTrackId,
+      },
+    });
+  } catch (err) {
+    console.log('err', err);
+  }
+};
+//编辑高级设置
+export const modifyTrackConf = async (conf: any, smartTrackId: number) => {
+  try {
+    await doRequest({
+      method: 'PUT',
+      url: '/singer.SmartTrackService/ModifyTrackConf',
+      data: {
+        conf,
+        smartTrackId,
+      },
+    });
+  } catch (err) {
+    console.log('err', err);
+  }
+};
+//通过id获取追踪任务
+export const getTrackTaskById = async (smartTrackId = 0) => {
+  try {
+    const data = smartTrackId
+      ? {
+          smartTrackId,
+        }
+      : {};
+    let req = await doRequest({
+      method: 'POST',
+      url: '/singer.SmartTrackService/GetSmartTrack',
+      data,
+    });
+    return req;
+  } catch (err) {
+    console.error(err);
+  }
+};
+
+//获取追踪实况
+export const getTackDetailInfo = async (smartTrackId = 0) => {
+  const data = smartTrackId
+    ? {
+        smartTrackId,
+      }
+    : {};
+  let req = await doRequest({
+    method: 'POST',
+    url: '/singer.SmartTrackService/GetTrackOverView',
+    data,
+  });
+  return req;
+};
+
+//根据传入的算力，圆心，摄像头信息计算出最后需要的摄像头信息
+export const getTaskCameraByCenterAndPower = async (value: {
+  taskPower: {
+    facePower: number;
+    bodyPower: number;
+  };
+  cameraInfos: Array<Object>;
+  center: [number, number];
+}) => {
+  let realCameraInfos = value['cameraInfos'];
+  //先通过摄像头id拿预处理信息
+  let realPreprocessInfos = [];
+  if (!isEmpty(realCameraInfos)) {
+    const { taskStatus } = await getListTaskStatus();
+    realPreprocessInfos = getCameraStatusFunc(taskStatus);
+  }
+  //去除由实时开启的摄像头
+  //缓存下已经开启的
+  const runRealCameraInfos: Object[] = [];
+  realCameraInfos = realCameraInfos.filter((v) => {
+    if (Tree.judgeOccupyPowerById(v['id'], realPreprocessInfos)) {
+      runRealCameraInfos.push(v);
+    }
+    return !Tree.judgeOccupyPowerById(v['id'], realPreprocessInfos);
+  });
+  //算力不够时选择离中心点最近的
+  let from = turf.point(value['center']);
+  if (realCameraInfos.length > value['taskPower']['bodyPower']) {
+    realCameraInfos
+      .map((v) => {
+        let dis = turf.distance(from, turf.point([v['longitude'], v['latitude']]));
+        return {
+          ...v,
+          dis,
+        };
+      })
+      .sort((a, b) => {
+        return a - b;
+      });
+    realCameraInfos = realCameraInfos.slice(0, value['taskPower']['bodyPower']);
+  }
+  return [...runRealCameraInfos, ...realCameraInfos];
+};
+
+/**创建追踪任务 */
+export const createIntelligentTrack = async (value: {
+  images: Array<Object>;
+  deviceIds: Array<string>;
+  circleCenter: [number, number];
+  model: number;
+  circleRadius: number;
+  facePower?: number;
+  bodyPower?: number;
+  historyTime?: [Moment, Moment];
+  topping?: boolean;
+}) => {
+  const data = {
+    images: value['images'],
+    type: value['model'],
+    normalComputerPower: value['bodyPower'] || 0,
+    faceComputerPower: value['facePower'] || 0,
+    // deviceIds: ['129537'],
+    deviceIds: value['deviceIds'],
+    conf: {
+      faceThreshold: defaultFaceThreshold,
+      bodyThreshold: defaultBodyThreshold,
+      faceResultNum: defaultFaceResultNum,
+      radius: value['circleRadius'] * 1000,
+      queryCycle: defaultQueryCycle,
+    },
+    centerConf: {
+      centerX: value['circleCenter'][0],
+      centerY: value['circleCenter'][1],
+    },
+  };
+  const res = await doRequest({
+    method: 'PUT',
+    url: '/singer.SmartTrackService/CreateSmartTrack',
+    data,
+  });
+  return res;
+};
+
+//发送心跳包
+export const emitHeartbeat = async (smartTrackId: number) => {
+  try {
+    await doRequest({
+      method: 'POST',
+      url: '/singer.SmartTrackService/SmartTrackHeartBeat',
+      data: {
+        smartTrackId: smartTrackId,
+      },
+    });
+  } catch (err) {
+    console.error(err);
+  }
+};
+
+//更改任务摄像头信息
+export const ModifyTrackCameras = async (value: {
+  smartTrackId: number;
+  deviceIds: Array<number>;
+  centerPoint: [number, number];
+}) => {
+  try {
+    await setIntelligentTrackCircleInfo(value['smartTrackId'], value['centerPoint']);
+    await doRequest({
+      url: '/singer.SmartTrackService/ModifyTrackCameras',
+      method: 'PUT',
+      data: {
+        smartTrackId: value['smartTrackId'],
+        deviceIds: value['deviceIds'],
+      },
+    });
+  } catch (err) {
+    message.error(err);
+  }
+};
+
+//保存智能追踪圆的信息
+export const setIntelligentTrackCircleInfo = async (
+  smartTrackId: number,
+  circleCenter: [number, number]
+) => {
+  try {
+    await doRequest({
+      url: '/singer.SmartTrackService/ModifyTrackScopeConf',
+      method: 'PUT',
+      data: {
+        smartTrackId: smartTrackId,
+        centerConf: {
+          centerX: get(circleCenter, '0'),
+          centerY: get(circleCenter, '1'),
+        },
+      },
+    });
+  } catch (err) {
+    message.error(err);
+  }
+};
+
+//智能追踪的获取摄像头
+export const getTackCameraInfo = async (value: {
+  circleCenter: [Moment, Moment];
+  radius: number;
+  zoom: number;
+}) => {
+  //通过圆心和半径拿取到摄像头
+  let circleCameraInfos = await getCameraInfoByCircle(
+    value['circleCenter'],
+    value['radius'],
+    value['zoom']
+  );
+  return circleCameraInfos;
+};
+
+//通过圆心和半径获取摄像头
+export const getCameraInfoByCircle = async (circleCenter, radius, zoom = 16) => {
+  try {
+    let centerFeature = turf.circle(turf.point(circleCenter), radius, {
+      units: 'kilometers',
+      steps: 64,
+    });
+    let minx = 0;
+    let maxx = 0;
+    let miny = 0;
+    let maxy = 0;
+    for (let i = 0; i < 4; i++) {
+      let point = turf.destination(turf.point(circleCenter), radius, 90 * i, {
+        units: 'kilometers',
+      }).geometry.coordinates;
+      if (point[0] < minx || minx === 0) {
+        minx = point[0];
+      }
+      if (point[0] > maxx || maxx === 0) {
+        maxx = point[0];
+      }
+      if (point[1] < miny || miny === 0) {
+        miny = point[1];
+      }
+      if (point[1] > maxy || maxy === 0) {
+        maxy = point[1];
+      }
+    }
+    let { clusterPoint }: any = await doRequest({
+      url: '/singer.DeviceService/GetClusters',
+      method: 'POST',
+      data: {
+        northEast: { X: maxx, Y: maxy },
+        southWest: { X: minx, Y: miny },
+        zoom,
+      },
+    });
+    let cameraIds = [];
+    clusterPoint.forEach((v) => {
+      cameraIds.push(...v['cameraIDs']);
+    });
+    const { cameras } = await SearchCamera({
+      cameraId: cameraIds,
+      maxResults: cameraIds.length,
+    });
+    const cameraInfos = cameras.filter((v) => {
+      let cameraPoint = turf.point([get(v, 'longitude'), get(v, 'latitude')]);
+      return turf.booleanPointInPolygon(cameraPoint, centerFeature);
+    });
+    return cameraInfos;
+  } catch (err) {
+    console.error(err);
+    return [];
+  }
+};
+
+//追踪任务转化为检索的格式
+export const taskInfoToSearchItem = (taskInfo) => {
+  let imageList = [];
+  get(taskInfo, 'images', []).forEach((v) => {
+    const url = get(v, 'conds.0.srcImageUrl');
+    const objectId = get(v, 'conds.0.featureInfo.objectId');
+    let imageItem = {
+      index: 0,
+      url,
+      objectId,
+      odRects: get(v, 'conds').map((item) => {
+        return {
+          fileKey: get(item, 'objectImageUrl'),
+          extendRect: {
+            algorithmVersion: get(item, 'alg', ''),
+            ...get(item, 'rect', {}),
+          },
+          rect: {
+            algorithmVersion: get(item, 'alg', ''),
+            rect: get(item, 'rect', {}),
+          },
+        };
+      }),
+    };
+    imageList.push(imageItem);
+  });
+  return imageList;
+};
--- a/packages/biz/src/hooks/useTaskState/index.ts
+++ b/packages/biz/src/hooks/useTaskState/index.ts
@ -0,0 +1,103 @@
+import doRequest from '../../utils/request';
+import { NetworkType, useStores } from '@store/index';
+import { useMount, useUnmount } from '@zhst/hooks';
+import { useRef, useState } from 'react';
+import type { CamerasStatusList, StatusList } from '../../interface'
+
+const Streams = [
+  'TASK_OVERVIEW_WAIT_START_STREAM',
+  'TASK_OVERVIEW_WAIT_STREAM',
+  'TASK_OVERVIEW_WAIT_START_SVINFER',
+];
+
+const StreamsNum = [1, 2, 3];
+const RunsNum = [5, 9];
+const ErrorsNum = [7];
+
+const Runs = ['TASK_OVERVIEW_RUNNING', 'TASK_OVERVIEW_FINISH'];
+
+const Errors = ['TASK_OVERVIEW_ERROR'];
+
+export const getListTaskStatus = async (data?: { taskIndex: { deviceId: string }[] }) => {
+  const res = await doRequest<{
+    taskStatus: StatusList;
+  }>({
+    url: '/singer.TaskManagerService/ListTaskStatusResponse',
+    method: 'POST',
+    data: data || {}
+  });
+  return res;
+};
+export const getCameraStatusFunc = (list: StatusList, useNum = false) => {
+  const _Runs: any = useNum ? RunsNum : Runs;
+  const _Errors: any = useNum ? ErrorsNum : Errors;
+  const _Streams: any = useNum ? StreamsNum : Streams;
+  const res = list.reduce((res, cur) => {
+    const cameraId = cur.taskIndex.deviceId;
+    const status = cur.taskOverview;
+    res.some((ids, i) => {
+      if (ids.includes(cameraId)) {
+        res[i] = ids.filter((id) => id !== cameraId);
+        return true;
+      }
+      return false;
+    });
+    if (_Runs.includes(status)) {
+      res[0].push(cameraId);
+    } else if (_Errors.includes(status)) {
+      res[1].push(cameraId);
+    } else if (_Streams.includes(status)) {
+      res[2].push(cameraId);
+    }
+    return res;
+  }, [[], [], []]);
+  return [...res];
+};
+let camerasStatusStoreList: CamerasStatusList = [[], [], []];
+let num = 0;
+const useTaskState = () => {
+  const { store } = useStores();
+  const [camerasStatusList, setCamerasStatusList] =
+    useState<CamerasStatusList>(camerasStatusStoreList);
+  const timerRef = useRef(null);
+
+  const getCameraStatus = (list: StatusList, useNum = false) => {
+    const res = getCameraStatusFunc(list, useNum);
+    setCamerasStatusList(res);
+  };
+  const request = (data: { taskStatus: StatusList }[]) => {
+    if (data) {
+      const list: StatusList = [];
+      data.forEach((v) => {
+        list.push(...v.taskStatus);
+      });
+      getCameraStatus(list, store.networkType === NetworkType.NORMAL);
+    }
+  };
+  useMount(async () => {
+    num++;
+    if (num - 1 > 0) {
+      return;
+    }
+    const res = await getListTaskStatus();
+    getCameraStatus(res.taskStatus);
+    if (store.networkType === NetworkType.DUAL_NETWORK) {
+      timerRef.current = setInterval(async () => {
+        const res = await getListTaskStatus();
+        request([res]);
+      }, 2000);
+    }
+  });
+  useUnmount(() => {
+    clearInterval(timerRef.current);
+    setCamerasStatusList([[], [], []]);
+    num--;
+    if (num === 0) {
+      camerasStatusStoreList = [[], [], []];
+    }
+  });
+
+  return camerasStatusList;
+};
+
+export default useTaskState;
--- a/packages/biz/src/index.md
+++ b/packages/biz/src/index.md
@ -1,7 +1,7 @@
 ---
 nav:
  title: 业务组件
-  order: 1
+order: 1
 title: 快速上手
 ---

--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@ -1 +1,3 @@
 export { default as Demo } from './Demo';
+export * from './adapter'
+export { default as BigImageModal } from './BigImageModal'
--- a/packages/biz/src/useSocket/index.ts
+++ b/packages/biz/src/useSocket/index.ts
@ -0,0 +1,101 @@
+import { useMemo } from 'react';
+import { throttle as loadshThrottle } from '@zhst/func';
+import { useDeepEffect, useLatest } from '@zhst/hooks';
+import ws from './ws';
+
+const noop = (v: any) => null;
+const getSelf = (v: any) => v;
+export const SocketApi = {
+  CameraTaskStatue: 'singer.DeviceService/SubScribeCameraTaskStatus',
+  DeviceStatus: 'singer.TaskManagerService/SubscribeTaskStatus',
+  SubscribeSolutionDeploy: 'singer.SolutionManagerService/SubscribeSolutionDeploy',
+  SubscribeTasksSummary: 'singer.TaskManagerService/SubscribeTasksSummary',
+  MonitorSubscribeResult: 'singer.MonitorService/MonitorSubscribeResult',
+  MonitorSubscribeStatus: 'singer.MonitorService/MonitorSubscribeStatus',
+  SubscribeArchiveGroupUpload: 'singer.ArchiveGroupService/CreateArchiveByImport',
+  SubscribeJointTask: 'singer.JointTaskService/SubscribeJointTask',
+  SubscribeGroupFragment: 'singer.VideoService/SubscribeVideoFragmentStatus', // 监听视频分片状态变化，包括新建、删除、变化
+  SubscribeGroup: 'singer.VideoService/SubscribeGroup', // 监听视频分组状态变化，列表变化也通知
+  SubscribeStreamEvent: 'singer.MediaManagerService/SubscribeStreamEvent', // 监听视频分组状态变化，列表变化也通知
+};
+type ApiKeys = keyof typeof SocketApi;
+
+export default (
+  topic: ApiKeys,
+  iterator: any = noop,
+  opt?: {
+    req?: { [key: string]: any };
+    throttle?: number;
+    parseData?: boolean;
+    beforeLoopTmp?: Function;
+    shouldBreak: boolean;
+    forceRefresh: any;
+    close?: boolean;
+  }
+) => {
+  const {
+    req = {},
+    throttle = 0,
+    parseData = true,
+    beforeLoopTmp = getSelf,
+    shouldBreak = false,
+    forceRefresh,
+    close,
+  } = opt || {};
+
+  // 带上token
+  const reqstring = useMemo(() => {
+    const newReq = {
+      ...req,
+      extraHeaders: {
+        authorization: localStorage.getItem('USER-TOKEN'),
+      },
+    };
+    return JSON.stringify(newReq);
+  }, [req]);
+
+  const latestIterator = useLatest(iterator);
+  useDeepEffect(() => {
+    if (close) {
+      return;
+    }
+    //控制socket 请求发送
+    if (shouldBreak) {
+      return;
+    }
+    //去抖动
+
+    let tmpData: any = [];
+    const throttleUpdate = loadshThrottle(() => {
+      if (tmpData.length == 0) {
+        return;
+      }
+      const _tmpData = beforeLoopTmp(tmpData);
+      latestIterator.current(_tmpData); //加了throttle 数据就变成数组
+      tmpData = [];
+    }, throttle);
+
+    const unSubscribe = ws.subscribe(SocketApi[topic], reqstring, (socketData: any) => {
+      try {
+        if (!throttle) {
+          latestIterator.current(socketData);
+        } else {
+          tmpData.push(socketData);
+          throttleUpdate();
+        }
+      } catch (error) {
+        console.error('useSocke:', error);
+      }
+    });
+
+    return () => {
+      try {
+        unSubscribe();
+        throttleUpdate.cancel();
+      } catch (error) {
+        console.error(error);
+        throw error;
+      }
+    };
+  }, [topic, reqstring, shouldBreak, forceRefresh, close]);
+};
--- a/packages/biz/src/useSocket/onceChannel.tsx
+++ b/packages/biz/src/useSocket/onceChannel.tsx
@ -0,0 +1,23 @@
+//@ts-nocheck
+import channel from './ws';
+
+const startChannel = (topic, req, callback) => {
+  // 带上token
+  let reqstring = JSON.stringify({
+    ...req,
+    extraHeaders: {
+      authorization: localStorage.getItem('USER-TOKEN'),
+    },
+  });
+
+  let unSubscribe = channel.subscribe(topic, reqstring, (socketData) => {
+    let shouldStop = callback(socketData);
+    if (shouldStop) {
+      unSubscribe?.();
+    }
+  });
+
+  return unSubscribe;
+};
+
+export default startChannel;
--- a/packages/biz/src/useSocket/ws.ts
+++ b/packages/biz/src/useSocket/ws.ts
@ -0,0 +1,222 @@
+// @ts-nocheck
+import { v4 as uuidv4 } from 'uuid';
+import { has } from '@zhst/func';
+import io from 'socket.io-client';
+import { SOCKET_HOST } from '@common/constants';
+
+const EMITSTATE = {
+  NOT_CONNECT: 0,
+  WAITING: 1,
+  CONNECT: 2,
+};
+
+const initRetryTime = 0;
+const intervalTime = 5 * 1000; //下次重试增加时间
+const maxIntervalTime = 1 * 60 * 60 * 1000; //最大重试时间1小时
+
+class Channel {
+  /**
+   * io 实例化对象
+   */
+  ioIns;
+  /**
+   * 已存在的订阅列表
+   */
+  listeners = [
+    // {
+    //     topic: "",
+    //     req: "",
+    //     suInfo: {},
+    //     hasEmit: false,//是否已经订阅
+    //     lastRetryInterval: 0,
+    //     handles: {
+    //     }
+    // }
+  ];
+
+  /**
+   * 调试信息 记录订阅/反订阅次数
+   */
+  subscribeListenerId = [];
+  unSubscribeListenerId = [];
+
+  init = () => {
+    const ioIns = (this.ioIns = io(SOCKET_HOST, {
+      reconnection: true,
+      transports: ['websocket'],
+      forceNew: true,
+    }));
+    ioIns.on('connect', (...arg: any) => {
+      console.debug('connect', arg);
+      this.ioIns = ioIns;
+      this.listeners.forEach((v) => {
+        this.doEmit(v['topic'], v['req'], v['id']);
+      });
+    });
+
+    ioIns.on('event', (...arg: any) => {
+      console.debug('event', arg);
+    });
+
+    ioIns.on('disconnect', (...arg: any) => {
+      console.debug('disconnect', arg);
+      this.subscribeListenerId = [];
+      this.unSubscribeListenerId = [];
+    });
+
+    ioIns.on('reconnect', (...arg: any) => {
+      console.debug('reconnect', arg);
+      this.listeners.forEach((v) => {
+        v['hasEmit'] = EMITSTATE.NOT_CONNECT;
+        this.doEmit(v['topic'], v['req'], v['id']);
+      });
+    });
+  };
+
+  retry = (listener: { [x: string]: any; lastRetryInterval: number | undefined; intervalId: NodeJS.Timeout; } | undefined) => {
+    //重试逻辑
+    const intervalId = setTimeout(() => {
+      const hasExit = this.listeners.find(
+        (v) => v['topic'] === listener?.['topic'] && v['req'] === listener['req']
+      );
+      if (!hasExit) return;
+      listener['hasEmit'] = EMITSTATE.NOT_CONNECT;
+      this.doEmit(listener['topic'], listener['req'], listener['id']);
+    }, listener.lastRetryInterval);
+
+    listener.intervalId = intervalId;
+    listener.lastRetryInterval =
+      intervalTime + listener.lastRetryInterval > maxIntervalTime
+        ? maxIntervalTime
+        : intervalTime + listener.lastRetryInterval;
+  };
+
+  doEmit = (topic, req, listenerId) => {
+    if (!this.ioIns) {
+      this.init();
+    }
+    //订阅过就不订阅了
+    const hasEmit = this.listeners.find(
+      (v) => v['topic'] === topic && v['req'] === req && v['hasEmit'] !== EMITSTATE.NOT_CONNECT
+    );
+    if (hasEmit) {
+      return;
+    }
+    const listener = this.listeners.find((v) => v['topic'] === topic && v['req'] === req);
+    listener['hasEmit'] = EMITSTATE.WAITING;
+
+    this.ioIns?.emit?.(topic, req, (data) => {
+      console.info('emit', topic, req, data);
+      const suInfo = JSON.parse(data);
+      if (has(suInfo, 'Error.code')) {
+        if (suInfo.Error.code === 500) {
+          //后端出错
+          this.retry(listener);
+        }
+        return;
+      }
+      // console.debug('SUBSCRIBE', listenerId, topic, req, suInfo);
+      this.subscribeListenerId.push(listenerId);
+      // debugger
+      //重新找一遍topic
+      const currentTopicIndex = this.listeners.findIndex(
+        (v) => v['topic'] === topic && v['req'] === req && v['id'] === listenerId
+      );
+      if (currentTopicIndex == -1) {
+        // 不存在说明listener取消了 直接反订阅
+        this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), (data) => {
+          this.unSubscribeListenerId.push(listenerId);
+          console.debug('UNSUBSCRIBE', listenerId, topic, req, data);
+        });
+        return;
+      }
+      if (!suInfo['SubscribeID']) {
+        this.listeners.splice(currentTopicIndex, 0);
+      } else {
+        this.listeners[currentTopicIndex]['suInfo'] = suInfo;
+        this.listeners[currentTopicIndex]['hasEmit'] = EMITSTATE.CONNECT;
+      }
+
+      this.ioIns?.on?.(suInfo['SubscribeID'], (data) => {
+        console.info('on', suInfo['SubscribeID'], data);
+        try {
+          const socketData = JSON.parse(data);
+          if (has(socketData, 'Error.code')) {
+            if (socketData.Error.code === 500) {
+              //后端出错
+              this.retry(listener);
+            }
+            return;
+          }
+          const { handles = {} } =
+            this.listeners.find((v) => v['topic'] === topic && v['req'] === req) || {};
+          Object.keys(handles).forEach((key) => {
+            try {
+              //后面观察 为什么delete后在foreach
+              const func = handles[key];
+              if (!func) return;
+              func(socketData);
+            } catch (error) {
+              console.error(error);
+            }
+          });
+        } catch (error) {
+          console.debug('error', error);
+        }
+      });
+    });
+  };
+
+  subscribe(topic, req, handle) {
+    const handleId = uuidv4();
+    const listenerId = uuidv4();
+    const listener = this.listeners.find((v) => v['topic'] === topic && v['req'] === req);
+    if (listener) {
+      listener['handles'][handleId] = handle;
+    } else {
+      this.listeners.push({
+        topic: topic,
+        req: req,
+        suInfo: {},
+        id: listenerId,
+        hasEmit: EMITSTATE.NOT_CONNECT,
+        lastRetryInterval: initRetryTime,
+        handles: {
+          [`${handleId}`]: handle,
+        },
+      });
+      //未注册过 则去订阅
+      this.doEmit(topic, req, listenerId);
+    }
+    return this.unSubscribe.bind(this, topic, req, handleId, listenerId);
+  }
+
+  unSubscribe(topic, req, handleId, listenerId) {
+    const listener = this.listeners.find(
+      (v) => v['topic'] === topic && v['req'] === req && v['id'] === listenerId
+    );
+    const { handles = {}, suInfo } = listener || {};
+    if (handles[handleId]) {
+      delete handles[handleId];
+      //如果没有其他订阅就删除
+      if (Object.keys(handles).length === 0) {
+        if (this.intervalId) {
+          clearTimeout(this.intervalId);
+        }
+        if (listener['hasEmit'] === EMITSTATE['CONNECT']) {
+          this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), (data) => {
+            this.unSubscribeListenerId.push(listenerId);
+            console.debug('UNSUBSCRIBE', listener['id'], topic, req, data);
+          });
+        }
+        this.listeners = this.listeners.filter((v) => !(v['topic'] === topic && v['req'] === req));
+      }
+    }
+  }
+}
+//单例
+const channelIns = new Channel();
+//暴露实例 调试用
+window.__channel__ = channelIns;
+
+export default channelIns;
--- a/packages/biz/src/utils/constants.ts
+++ b/packages/biz/src/utils/constants.ts
@ -0,0 +1,28 @@
+export const OBJECT_GRNER_THRESHOLD = 0.8; //目标图判断性别阈值
+export const OBJECT_AGE_TYPE_THRESHOLD = 0.5; //目标图判断年龄段阈值
+export const MODE_KEY = 'test_mode';
+export const ROUTER_SHOULD_FILTER = isDev; //是否根据后台配置路由，开发环境全打开
+//业务约定
+export const SEARCH_IMG_COUNT = 10; //检索图片的最大个数
+export const GLOBAL_IS_ITEM_NUMBER_SHOW = false; //是否展示索引
+export const publicPath = 'hummingbird';
+
+export const ENTER_CIRCLE = 'MONITORTYPE_ENTER_CIRCLE';
+export const OUT_CIRCLE = 'MONITORTYPE_OUT_CIRCLE';
+export const TEMP = 'MONITORTYPE_TEMP';
+export const GLOBAL_IS_BOX_VMS_SHOW = true; //是否展示盒子vms
+
+export const BODY_SEARCH_THRESHOID = 0.45; //形体检索阈值
+export const RECORD_VERSION = '3.0.0'; //保存记录的版本号
+
+export const DeviceTab = {
+  EMPTY: 0,
+  REAL_CAMERA: 1,
+  PREPROCESS_CAMERA: 2, //摄像头列表
+  TAG_CAMERA: 3, //预案列表
+  HISTORY_VIDEO_GROUP: 4, //录像回放
+  VIRTUAL_CAMERA: 5, //离线视频
+  REAL_CAMERA_NOFACE: 6,
+  REAL_CAMERA_ONLYFACE: 7,
+  REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8, // 只有普通摄像头，没有人脸、没有盒子、直连
+};
--- a/packages/biz/src/utils/index.ts
+++ b/packages/biz/src/utils/index.ts
--- a/packages/biz/src/utils/request.ts
+++ b/packages/biz/src/utils/request.ts
@ -0,0 +1,77 @@
+import { extend } from 'umi-request';
+import type { RequestOptionsInit } from 'umi-request';
+import { get } from '@zhst/func';
+import { message } from 'antd';
+import base64 from 'base-64';
+
+export class ResponseError<D> extends Error {
+  name;
+  data;
+  response;
+  request;
+  type;
+  constructor(
+    response: Response,
+    text: string,
+    data: D,
+    request: {
+      url: string;
+      options: RequestOptionsInit;
+    },
+    type = 'ResponseError'
+  ) {
+    super(text || response.statusText);
+    this.name = 'ResponseError';
+    this.data = data;
+    this.response = response;
+    this.request = request;
+    this.type = type;
+  }
+}
+
+export const request = extend({
+  getResponse: true,
+  // timeout: 1000,
+  parseResponse: false,
+});
+
+//错误处理中间件
+request.use(async (ctx, next) => {
+  const { req } = ctx;
+  const { toast = true } = req?.options || {};
+  try {
+    await next();
+    const { res } = ctx;
+    const d = await res.text();
+    if (res.status === 401) {
+      message.warning('登录过期，请重新登录!');
+      return;
+    }
+    const isEmptyRes = d === ''; //有些后端接口成功会返回空 做下兼容
+    const body = !isEmptyRes ? JSON.parse(d) : d;
+    if (res.status >= 200 && res.status < 300) {
+      ctx.res = body;
+    } else {
+      // 先判断Grpc-Metadata-Errorx-Message
+      let errMsg = res.headers.get('Grpc-Metadata-Errorx-Message');
+      if (errMsg) {
+        errMsg = window.utf8?.decode(base64.decode(errMsg));
+        // 后判断 body中的message
+      } else if (!errMsg && get(body, 'message')) {
+        errMsg = `${get(body, 'message')}`;
+      } else {
+        // 最后看状态码
+        errMsg = '您的网络发生异常，无法连接服务器';
+      }
+      toast && message.error(errMsg);
+      throw new ResponseError(res, errMsg, d, req, 'CustomError');
+    }
+  } catch (error) {
+    if (get(error, 'type') !== 'CustomError') {
+      toast && message.error('您的网络发生异常，无法连接服务器');
+    }
+    throw error;
+  }
+});
+
+export default request
--- a/packages/constants/.fatherrc.ts
+++ b/packages/constants/.fatherrc.ts
@ -0,0 +1,7 @@
+import { defineConfig } from 'father';
+
+export default defineConfig({
+  // more father config: https://github.com/umijs/father/blob/master/docs/config.md
+  esm: { output: 'es' },
+  cjs: { output: 'lib' },
+});
--- a/packages/constants/CHANGELOG.md
+++ b/packages/constants/CHANGELOG.md
@ -0,0 +1,19 @@
+# @zhst/biz
+
+## 0.2.4
+
+### Patch Changes
+
+- feat: 新增 meta 包
+- Updated dependencies
+  - @zhst/func@0.2.4
+  - @zhst/hooks@0.2.4
+  - @zhst/meta@0.2.4
+
+## 0.2.3
+
+### Patch Changes
+
+- fix: 调试包 link
+- Updated dependencies
+  - @zhst/hooks@0.2.3
--- a/packages/constants/README.md
+++ b/packages/constants/README.md
@ -0,0 +1,15 @@
+## 介绍
+
+业务库
+
+## 安装
+
+> pnpm install @zhst/constants
+
+## 使用
+
+```js
+import React from 'react';
+import { TYPE } from '@zhst/constants'
+
+```
--- a/packages/constants/es/base/index.d.ts
+++ b/packages/constants/es/base/index.d.ts
@ -0,0 +1,23 @@
+export declare const OBJECT_GRNER_THRESHOLD = 0.8;
+export declare const OBJECT_AGE_TYPE_THRESHOLD = 0.5;
+export declare const MODE_KEY = "test_mode";
+export declare const SEARCH_IMG_COUNT = 10;
+export declare const GLOBAL_IS_ITEM_NUMBER_SHOW = false;
+export declare const publicPath = "hummingbird";
+export declare const ENTER_CIRCLE = "MONITORTYPE_ENTER_CIRCLE";
+export declare const OUT_CIRCLE = "MONITORTYPE_OUT_CIRCLE";
+export declare const TEMP = "MONITORTYPE_TEMP";
+export declare const GLOBAL_IS_BOX_VMS_SHOW = true;
+export declare const BODY_SEARCH_THRESHOID = 0.45;
+export declare const RECORD_VERSION = "3.0.0";
+export declare const DeviceTab: {
+    EMPTY: number;
+    REAL_CAMERA: number;
+    PREPROCESS_CAMERA: number;
+    TAG_CAMERA: number;
+    HISTORY_VIDEO_GROUP: number;
+    VIRTUAL_CAMERA: number;
+    REAL_CAMERA_NOFACE: number;
+    REAL_CAMERA_ONLYFACE: number;
+    REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: number;
+};
--- a/packages/constants/es/base/index.js
+++ b/packages/constants/es/base/index.js
@ -0,0 +1,30 @@
+export var OBJECT_GRNER_THRESHOLD = 0.8; //目标图判断性别阈值
+export var OBJECT_AGE_TYPE_THRESHOLD = 0.5; //目标图判断年龄段阈值
+export var MODE_KEY = 'test_mode';
+//业务约定
+export var SEARCH_IMG_COUNT = 10; //检索图片的最大个数
+export var GLOBAL_IS_ITEM_NUMBER_SHOW = false; //是否展示索引
+export var publicPath = 'hummingbird';
+export var ENTER_CIRCLE = 'MONITORTYPE_ENTER_CIRCLE';
+export var OUT_CIRCLE = 'MONITORTYPE_OUT_CIRCLE';
+export var TEMP = 'MONITORTYPE_TEMP';
+export var GLOBAL_IS_BOX_VMS_SHOW = true; //是否展示盒子vms
+
+export var BODY_SEARCH_THRESHOID = 0.45; //形体检索阈值
+export var RECORD_VERSION = '3.0.0'; //保存记录的版本号
+
+export var DeviceTab = {
+  EMPTY: 0,
+  REAL_CAMERA: 1,
+  PREPROCESS_CAMERA: 2,
+  //摄像头列表
+  TAG_CAMERA: 3,
+  //预案列表
+  HISTORY_VIDEO_GROUP: 4,
+  //录像回放
+  VIRTUAL_CAMERA: 5,
+  //离线视频
+  REAL_CAMERA_NOFACE: 6,
+  REAL_CAMERA_ONLYFACE: 7,
+  REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8 // 只有普通摄像头，没有人脸、没有盒子、直连
+};
--- a/packages/constants/es/camera/index.d.ts
+++ b/packages/constants/es/camera/index.d.ts
@ -0,0 +1 @@
+export declare const TYPE = "";
--- a/packages/constants/es/camera/index.js
+++ b/packages/constants/es/camera/index.js
@ -0,0 +1 @@
+export var TYPE = '';
--- a/packages/constants/es/index.d.ts
+++ b/packages/constants/es/index.d.ts
@ -0,0 +1,2 @@
+export * from './camera';
+export * from './base';
--- a/packages/constants/es/index.js
+++ b/packages/constants/es/index.js
@ -0,0 +1,2 @@
+export * from "./camera";
+export * from "./base";
--- a/packages/constants/lib/base/index.d.ts
+++ b/packages/constants/lib/base/index.d.ts
@ -0,0 +1,23 @@
+export declare const OBJECT_GRNER_THRESHOLD = 0.8;
+export declare const OBJECT_AGE_TYPE_THRESHOLD = 0.5;
+export declare const MODE_KEY = "test_mode";
+export declare const SEARCH_IMG_COUNT = 10;
+export declare const GLOBAL_IS_ITEM_NUMBER_SHOW = false;
+export declare const publicPath = "hummingbird";
+export declare const ENTER_CIRCLE = "MONITORTYPE_ENTER_CIRCLE";
+export declare const OUT_CIRCLE = "MONITORTYPE_OUT_CIRCLE";
+export declare const TEMP = "MONITORTYPE_TEMP";
+export declare const GLOBAL_IS_BOX_VMS_SHOW = true;
+export declare const BODY_SEARCH_THRESHOID = 0.45;
+export declare const RECORD_VERSION = "3.0.0";
+export declare const DeviceTab: {
+    EMPTY: number;
+    REAL_CAMERA: number;
+    PREPROCESS_CAMERA: number;
+    TAG_CAMERA: number;
+    HISTORY_VIDEO_GROUP: number;
+    VIRTUAL_CAMERA: number;
+    REAL_CAMERA_NOFACE: number;
+    REAL_CAMERA_ONLYFACE: number;
+    REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: number;
+};
--- a/packages/constants/lib/base/index.js
+++ b/packages/constants/lib/base/index.js
@ -0,0 +1,80 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/base/index.ts
+var base_exports = {};
+__export(base_exports, {
+  BODY_SEARCH_THRESHOID: () => BODY_SEARCH_THRESHOID,
+  DeviceTab: () => DeviceTab,
+  ENTER_CIRCLE: () => ENTER_CIRCLE,
+  GLOBAL_IS_BOX_VMS_SHOW: () => GLOBAL_IS_BOX_VMS_SHOW,
+  GLOBAL_IS_ITEM_NUMBER_SHOW: () => GLOBAL_IS_ITEM_NUMBER_SHOW,
+  MODE_KEY: () => MODE_KEY,
+  OBJECT_AGE_TYPE_THRESHOLD: () => OBJECT_AGE_TYPE_THRESHOLD,
+  OBJECT_GRNER_THRESHOLD: () => OBJECT_GRNER_THRESHOLD,
+  OUT_CIRCLE: () => OUT_CIRCLE,
+  RECORD_VERSION: () => RECORD_VERSION,
+  SEARCH_IMG_COUNT: () => SEARCH_IMG_COUNT,
+  TEMP: () => TEMP,
+  publicPath: () => publicPath
+});
+module.exports = __toCommonJS(base_exports);
+var OBJECT_GRNER_THRESHOLD = 0.8;
+var OBJECT_AGE_TYPE_THRESHOLD = 0.5;
+var MODE_KEY = "test_mode";
+var SEARCH_IMG_COUNT = 10;
+var GLOBAL_IS_ITEM_NUMBER_SHOW = false;
+var publicPath = "hummingbird";
+var ENTER_CIRCLE = "MONITORTYPE_ENTER_CIRCLE";
+var OUT_CIRCLE = "MONITORTYPE_OUT_CIRCLE";
+var TEMP = "MONITORTYPE_TEMP";
+var GLOBAL_IS_BOX_VMS_SHOW = true;
+var BODY_SEARCH_THRESHOID = 0.45;
+var RECORD_VERSION = "3.0.0";
+var DeviceTab = {
+  EMPTY: 0,
+  REAL_CAMERA: 1,
+  PREPROCESS_CAMERA: 2,
+  //摄像头列表
+  TAG_CAMERA: 3,
+  //预案列表
+  HISTORY_VIDEO_GROUP: 4,
+  //录像回放
+  VIRTUAL_CAMERA: 5,
+  //离线视频
+  REAL_CAMERA_NOFACE: 6,
+  REAL_CAMERA_ONLYFACE: 7,
+  REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8
+  // 只有普通摄像头，没有人脸、没有盒子、直连
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BODY_SEARCH_THRESHOID,
+  DeviceTab,
+  ENTER_CIRCLE,
+  GLOBAL_IS_BOX_VMS_SHOW,
+  GLOBAL_IS_ITEM_NUMBER_SHOW,
+  MODE_KEY,
+  OBJECT_AGE_TYPE_THRESHOLD,
+  OBJECT_GRNER_THRESHOLD,
+  OUT_CIRCLE,
+  RECORD_VERSION,
+  SEARCH_IMG_COUNT,
+  TEMP,
+  publicPath
+});
--- a/packages/constants/lib/camera/index.d.ts
+++ b/packages/constants/lib/camera/index.d.ts
@ -0,0 +1 @@
+export declare const TYPE = "";
--- a/packages/constants/lib/camera/index.js
+++ b/packages/constants/lib/camera/index.js
@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/camera/index.ts
+var camera_exports = {};
+__export(camera_exports, {
+  TYPE: () => TYPE
+});
+module.exports = __toCommonJS(camera_exports);
+var TYPE = "";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TYPE
+});
--- a/packages/constants/lib/index.d.ts
+++ b/packages/constants/lib/index.d.ts
@ -0,0 +1,2 @@
+export * from './camera';
+export * from './base';
--- a/packages/constants/lib/index.js
+++ b/packages/constants/lib/index.js
@ -0,0 +1,25 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./camera"), module.exports);
+__reExport(src_exports, require("./base"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./camera"),
+  ...require("./base")
+});
--- a/packages/constants/package.json
+++ b/packages/constants/package.json
@ -0,0 +1,38 @@
+{
+  "name": "@zhst/constants",
+  "version": "0.2.4",
+  "description": "常量库",
+  "keywords": [
+    "constants",
+    "biz",
+    "zhst",
+    "常量"
+  ],
+  "license": "ISC",
+  "author": "dev",
+  "sideEffects": [
+    "dist/*",
+    "es/**/style/*",
+    "lib/**/style/*",
+    "*.less"
+  ],
+  "main": "lib/index.tsx",
+  "module": "es/index.js",
+  "typings": "es/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "es",
+    "lib"
+  ],
+  "scripts": {
+    "build": "father build"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "http://10.0.0.77:4874"
+  },
+  "dependencies": {
+  }
+}
--- a/packages/constants/src/base/index.ts
+++ b/packages/constants/src/base/index.ts
@ -0,0 +1,27 @@
+export const OBJECT_GRNER_THRESHOLD = 0.8; //目标图判断性别阈值
+export const OBJECT_AGE_TYPE_THRESHOLD = 0.5; //目标图判断年龄段阈值
+export const MODE_KEY = 'test_mode';
+//业务约定
+export const SEARCH_IMG_COUNT = 10; //检索图片的最大个数
+export const GLOBAL_IS_ITEM_NUMBER_SHOW = false; //是否展示索引
+export const publicPath = 'hummingbird';
+
+export const ENTER_CIRCLE = 'MONITORTYPE_ENTER_CIRCLE';
+export const OUT_CIRCLE = 'MONITORTYPE_OUT_CIRCLE';
+export const TEMP = 'MONITORTYPE_TEMP';
+export const GLOBAL_IS_BOX_VMS_SHOW = true; //是否展示盒子vms
+
+export const BODY_SEARCH_THRESHOID = 0.45; //形体检索阈值
+export const RECORD_VERSION = '3.0.0'; //保存记录的版本号
+
+export const DeviceTab = {
+  EMPTY: 0,
+  REAL_CAMERA: 1,
+  PREPROCESS_CAMERA: 2, //摄像头列表
+  TAG_CAMERA: 3, //预案列表
+  HISTORY_VIDEO_GROUP: 4, //录像回放
+  VIRTUAL_CAMERA: 5, //离线视频
+  REAL_CAMERA_NOFACE: 6,
+  REAL_CAMERA_ONLYFACE: 7,
+  REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8, // 只有普通摄像头，没有人脸、没有盒子、直连
+};
--- a/packages/constants/src/camera/index.ts
+++ b/packages/constants/src/camera/index.ts
@ -0,0 +1 @@
+export const TYPE = ''
--- a/packages/constants/src/changelog/index.md
+++ b/packages/constants/src/changelog/index.md
@ -0,0 +1,8 @@
+---
+nav:
+  title: 元组件
+title: 版本更新日志
+order: 99
+---
+
+<embed src="../../CHANGELOG.md" ></embed>
--- a/packages/constants/src/index.md
+++ b/packages/constants/src/index.md
@ -0,0 +1,8 @@
+---
+nav:
+  title: 业务组件
+order: 1
+title: 快速上手
+---
+
+<embed src="../README.md" ></embed>
--- a/packages/constants/src/index.tsx
+++ b/packages/constants/src/index.tsx
@ -0,0 +1,2 @@
+export * from './camera'
+export * from './base'
--- a/packages/func/.fatherrc.ts
+++ b/packages/func/.fatherrc.ts
@ -4,7 +4,4 @@ export default defineConfig({
  // more father config: https://github.com/umijs/father/blob/master/docs/config.md
  esm: { output: 'es' },
  cjs: { output: 'lib' },
-  umd: {
-    name: 'zhst-func',
-  },
 });
--- a/packages/func/CHANGELOG.md
+++ b/packages/func/CHANGELOG.md
@ -1,5 +1,11 @@
 # @zhst/utils

+## 0.2.4
+
+### Patch Changes
+
+- feat: 新增 meta 包
+
 ## 0.2.3

 ### Patch Changes
--- a/packages/func/dist/umd/func.min.js
+++ b/packages/func/dist/umd/func.min.js
--- a/packages/func/es/addEventListener/index.d.ts
+++ b/packages/func/es/addEventListener/index.d.ts
@ -1,3 +0,0 @@
-export default function addEventListener(target: any, eventType: string, cb: any, option: any): {
-    remove: () => void;
-};
--- a/packages/func/es/addEventListener/index.js
+++ b/packages/func/es/addEventListener/index.js
@ -1,17 +0,0 @@
-import ReactDOM from 'react-dom';
-export default function addEventListener(target, eventType, cb, option) {
-  /* eslint camelcase: 2 */
-  var callback = ReactDOM.unstable_batchedUpdates ? function run(e) {
-    ReactDOM.unstable_batchedUpdates(cb, e);
-  } : cb;
-  if (target.addEventListener) {
-    target.addEventListener(eventType, callback, option);
-  }
-  return {
-    remove: function remove() {
-      if (target.removeEventListener) {
-        target.removeEventListener(eventType, callback);
-      }
-    }
-  };
-}
--- a/packages/func/es/camera/constants.d.ts
+++ b/packages/func/es/camera/constants.d.ts
@ -0,0 +1,41 @@
+/**
+ * 设备类型枚举
+ */
+export declare const DeviceType: {
+    VMS: string;
+    DIR: string;
+    CAMERA: string;
+};
+export declare const LOCAL_KEY = "local";
+export declare const DIRE_CONNECT_KEY = "direconnect";
+export declare const BOX_LIST_KEY = "boxlist";
+export declare enum VmsplatformOpt {
+    VMSPLATFORMOPT_ID = 0,
+    VMSPLATFORMOPT_PLATFORMNAME = 1,
+    VMSPLATFORMOPT_PLUGINNAME = 2,
+    VMSPLATFORMOPT_IP = 3,
+    VMSPLATFORMOPT_PORT = 4,
+    VMSPLATFORMOPT_USERNAME = 5,
+    VMSPLATFORMOPT_PASSWORD = 6
+}
+export declare enum OPT {
+    OR = 0,
+    AND = 1,
+    ORNOT = 2,
+    ANDNOT = 3
+}
+export declare enum DevicemanagerCameraType {
+    DEVICEMANAGER_CAMERA_TYPE_DEFAULT = 0,
+    DEVICEMANAGER_CAMERA_TYPE_NORMAL = 1,
+    DEVICEMANAGER_CAMERA_TYPE_1400 = 97,
+    DEVICEMANAGER_CAMERA_TYPE_DHGRABBER = 98,
+    DEVICEMANAGER_CAMERA_TYPE_HKGRABBER = 99,
+    DEVICEMANAGER_CAMERA_TYPE_LOCAL = 100
+}
+export declare const BOX_DIRECONNECT_PLATFORM_FILTER: {
+    filtervmsplatformList: {
+        opt: OPT;
+        vmsplatformOpt: VmsplatformOpt;
+        value: string;
+    }[];
+};
--- a/packages/func/es/camera/constants.js
+++ b/packages/func/es/camera/constants.js
@ -0,0 +1,50 @@
+/**
+ * 设备类型枚举
+ */
+export var DeviceType = {
+  VMS: 'vms',
+  DIR: 'dir',
+  CAMERA: 'camera'
+};
+export var LOCAL_KEY = 'local'; //离线摄像头key 约定
+export var DIRE_CONNECT_KEY = 'direconnect';
+export var BOX_LIST_KEY = 'boxlist';
+export var VmsplatformOpt = /*#__PURE__*/function (VmsplatformOpt) {
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_ID"] = 0] = "VMSPLATFORMOPT_ID";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_PLATFORMNAME"] = 1] = "VMSPLATFORMOPT_PLATFORMNAME";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_PLUGINNAME"] = 2] = "VMSPLATFORMOPT_PLUGINNAME";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_IP"] = 3] = "VMSPLATFORMOPT_IP";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_PORT"] = 4] = "VMSPLATFORMOPT_PORT";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_USERNAME"] = 5] = "VMSPLATFORMOPT_USERNAME";
+  VmsplatformOpt[VmsplatformOpt["VMSPLATFORMOPT_PASSWORD"] = 6] = "VMSPLATFORMOPT_PASSWORD";
+  return VmsplatformOpt;
+}({});
+export var OPT = /*#__PURE__*/function (OPT) {
+  OPT[OPT["OR"] = 0] = "OR";
+  OPT[OPT["AND"] = 1] = "AND";
+  OPT[OPT["ORNOT"] = 2] = "ORNOT";
+  OPT[OPT["ANDNOT"] = 3] = "ANDNOT";
+  return OPT;
+}({});
+export var DevicemanagerCameraType = /*#__PURE__*/function (DevicemanagerCameraType) {
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_DEFAULT"] = 0] = "DEVICEMANAGER_CAMERA_TYPE_DEFAULT";
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_NORMAL"] = 1] = "DEVICEMANAGER_CAMERA_TYPE_NORMAL";
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_1400"] = 97] = "DEVICEMANAGER_CAMERA_TYPE_1400";
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_DHGRABBER"] = 98] = "DEVICEMANAGER_CAMERA_TYPE_DHGRABBER";
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_HKGRABBER"] = 99] = "DEVICEMANAGER_CAMERA_TYPE_HKGRABBER";
+  DevicemanagerCameraType[DevicemanagerCameraType["DEVICEMANAGER_CAMERA_TYPE_LOCAL"] = 100] = "DEVICEMANAGER_CAMERA_TYPE_LOCAL";
+  return DevicemanagerCameraType;
+}({});
+
+// 盒子 直连 平台
+export var BOX_DIRECONNECT_PLATFORM_FILTER = {
+  filtervmsplatformList: [{
+    opt: OPT.OR,
+    vmsplatformOpt: VmsplatformOpt.VMSPLATFORMOPT_PLATFORMNAME,
+    value: 'direconnect'
+  }, {
+    opt: OPT.OR,
+    vmsplatformOpt: VmsplatformOpt.VMSPLATFORMOPT_PLATFORMNAME,
+    value: 'boxlist'
+  }]
+};
--- a/packages/func/es/camera/index.d.ts
+++ b/packages/func/es/camera/index.d.ts
@ -0,0 +1,40 @@
+import { DevicemanagerCameraType } from './constants';
+export declare const isFaceCamera: (type: DevicemanagerCameraType) => boolean;
+/**
+ *
+ * @param value 传入的数据 可以是 item（camera/vms/dirs）/ deviceID
+ * @param isId
+ */
+export declare function getDeviceType(value: {
+    [x: string]: any;
+    id: any;
+} | string): any;
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param id  设备id
+ * @param type  设备类型
+ */
+export declare function deviceIDToDeviceKey(id: any, type: string, vmsId?: any): string;
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param item  camera/vms/dirs
+ */
+export declare function deviceToDeviceKey(item: {
+    [x: string]: any;
+    id: any;
+}): string;
+/**
+ * 设备树key 转 后端设备原始id dirid是string/vms&camera 是number 和后端保持一致
+ * @param deviceKey 设备树的id
+ */
+export declare function deviceKeyToDeviceId(deviceKey: {
+    split: (arg0: string) => [any, any];
+}): any;
+export declare const getVmsIdByDeviceId: (key: string) => string;
+/**
+ * 通过设备id或设备key在树里面找摄像头
+ * @param ids cameraId
+ * @param deviceTree 树
+ * @param type "id" | "key"
+ */
+export declare const findCamerasByInDeviceTree: (ids: never[] | undefined, deviceTree: any, type?: string) => any[];
--- a/packages/func/es/camera/index.js
+++ b/packages/func/es/camera/index.js
@ -0,0 +1,142 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { get, has, isString } from 'lodash-es';
+import { loop } from "../utils";
+import { DevicemanagerCameraType, DeviceType } from "./constants";
+export var isFaceCamera = function isFaceCamera(type) {
+  return [DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_1400, DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_HKGRABBER, DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_DHGRABBER].includes(type);
+};
+
+/**
+ *
+ * @param value 传入的数据 可以是 item（camera/vms/dirs）/ deviceID
+ * @param isId
+ */
+export function getDeviceType(value) {
+  var type;
+  var isDeviceKey = isString(value);
+  if (isDeviceKey) {
+    type = value.split('_')[0];
+  } else {
+    if (has(value, 'longitude')) {
+      type = DeviceType['CAMERA'];
+    }
+    if (has(value, 'ip')) {
+      type = DeviceType['VMS'];
+    }
+    if (!type) {
+      type = DeviceType['DIR'];
+    }
+  }
+  return type;
+}
+
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param id  设备id
+ * @param type  设备类型
+ */
+export function deviceIDToDeviceKey(id, type, vmsId) {
+  if (type == DeviceType['DIR']) {
+    return "".concat(type, "_").concat(id, "_").concat(vmsId);
+  } else {
+    return "".concat(type, "_").concat(id);
+  }
+}
+
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param item  camera/vms/dirs
+ */
+export function deviceToDeviceKey(item) {
+  var deviceKey = '';
+  var type = getDeviceType(item);
+  if (!type) {
+    console.error('device type is null!');
+  }
+  switch (type) {
+    case DeviceType['DIR']:
+      {
+        var dirId = item['dirid'] || item['dirId'];
+        if (!dirId && dirId !== 0) {
+          console.error('dirId type is null!');
+        }
+        var vmsId = get(item, 'extendInfo.vmsPlatformId');
+        if (!vmsId && vmsId !== 0) {
+          console.error('vmsId type is null!');
+        }
+        deviceKey = "".concat(type, "_").concat(dirId, "_").concat(vmsId);
+      }
+      break;
+    case DeviceType['VMS']:
+      deviceKey = "".concat(type, "_").concat(item['id']);
+      break;
+    case DeviceType['CAMERA']:
+      {
+        var _vmsId = get(item, 'extendInfo.vmsPlatformId');
+        if (!_vmsId && _vmsId !== 0) {
+          console.error('vmsId type is null!');
+        }
+        deviceKey = "".concat(type, "_").concat(item.id);
+      }
+      break;
+  }
+  return deviceKey;
+}
+
+/**
+ * 设备树key 转 后端设备原始id dirid是string/vms&camera 是number 和后端保持一致
+ * @param deviceKey 设备树的id
+ */
+export function deviceKeyToDeviceId(deviceKey) {
+  var _deviceKey$split = deviceKey.split('_'),
+    _deviceKey$split2 = _slicedToArray(_deviceKey$split, 2),
+    type = _deviceKey$split2[0],
+    id = _deviceKey$split2[1];
+  return type === DeviceType['DIR'] ? id : Number(id);
+}
+export var getVmsIdByDeviceId = function getVmsIdByDeviceId(key) {
+  var type = getDeviceType(key);
+  var vmsId = '';
+  switch (type) {
+    case DeviceType['CAMERA']:
+    case DeviceType['DIR']:
+      vmsId = key.split('_')[2];
+      break;
+    case DeviceType['VMS']:
+      vmsId = key.split('_')[1];
+      break;
+  }
+  if (!vmsId) {
+    console.error('vmsid is null!');
+  }
+  return vmsId;
+};
+
+/**
+ * 通过设备id或设备key在树里面找摄像头
+ * @param ids cameraId
+ * @param deviceTree 树
+ * @param type "id" | "key"
+ */
+export var findCamerasByInDeviceTree = function findCamerasByInDeviceTree() {
+  var ids = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var deviceTree = arguments.length > 1 ? arguments[1] : undefined;
+  var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'id';
+  var cameraInfoList = [];
+  var _ids = ids.map(function (v) {
+    return String(v);
+  }); //都转string在做判断 保证格式一致
+  loop(deviceTree, function (item) {
+    var isCamera = getDeviceType(get(item, 'key', '')) === DeviceType['CAMERA'];
+    var isMatch = type === 'key' ? _ids.includes(get(item, 'key')) : _ids.includes("".concat(get(item, 'origin.id')));
+    if (isCamera && isMatch) {
+      cameraInfoList.push(item);
+    }
+  });
+  return cameraInfoList;
+};
--- a/packages/func/es/file/index.d.ts
+++ b/packages/func/es/file/index.d.ts
@ -52,3 +52,10 @@ export declare function base64toBlob(base64: string): Blob | undefined;
 export declare const downloadPackageImages: (imgDataList: string | any[], zipName: string) => Promise<void>;
 export declare function getFileSize(size: number): string;
 export declare const dataURLToBlob: (dataurl: string) => Blob;
+/**
+ * key 转 http 链接
+ * @param originImgkey 图片的值 ，可以是 base64 也可以是 http链接
+ * @param host 图片的域值
+ * @returns {string}
+ */
+export declare const generateImg: (imgKey: string, host?: string) => string;
--- a/packages/func/es/file/index.js
+++ b/packages/func/es/file/index.js
@ -309,4 +309,38 @@ export var dataURLToBlob = function dataURLToBlob(dataurl) {
  return new Blob([u8arr], {
    type: mime
  });
+};
+
+/**
+ * key 转 http 链接
+ * @param originImgkey 图片的值 ，可以是 base64 也可以是 http链接
+ * @param host 图片的域值
+ * @returns {string}
+ */
+export var generateImg = function generateImg(_imgKey) {
+  var host = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'http://10.0.0.120';
+  var imgKey = _imgKey;
+  var imgUrl = '';
+  //判空
+  if (!imgKey) return '';
+  if (/^(http:|https:)/.test(imgKey)) {
+    return imgKey;
+  }
+  try {
+    if (matchS3Prefix(imgKey)) {
+      imgKey = base64DecodeImageKey(imgKey);
+      if (imgKey.endsWith('/')) {
+        var i = imgKey.substring(0, imgKey.length - 1);
+        imgKey = i;
+      }
+    }
+    imgUrl = "".concat(host, "/file/").concat(imgKey);
+    if (_imgKey.includes('v3')) {
+      imgUrl = "".concat(host, "/minio/").concat(imgKey);
+    }
+  } catch (error) {
+    console.error(error);
+    imgUrl = '';
+  }
+  return imgUrl;
 };
--- a/packages/func/es/index.d.ts
+++ b/packages/func/es/index.d.ts
@ -1,3 +1,4 @@
+export * from 'lodash-es';
 export * from './file';
 export * from './map';
 export * from './performance';
@ -5,3 +6,4 @@ export * from './string';
 export * from './number';
 export * from './time';
 export * from './utils';
+export * from './camera';
--- a/packages/func/es/index.js
+++ b/packages/func/es/index.js
@ -1,7 +1,9 @@
+export * from 'lodash-es';
 export * from "./file";
 export * from "./map";
 export * from "./performance";
 export * from "./string";
 export * from "./number";
 export * from "./time";
-export * from "./utils";
+export * from "./utils";
+export * from "./camera";
--- a/packages/func/es/utils/index.d.ts
+++ b/packages/func/es/utils/index.d.ts
@ -1,3 +1,4 @@
+export { default as isChrome } from './isChrome';
 export declare const matchS3Prefix: (str: string) => boolean;
 /**
 * 通过文件名获取文件类型
@ -13,3 +14,7 @@ export declare const getFileSuffix: (fileName: string) => string;
 export declare const getImageSuffixByFileType: (type: string) => string;
 export declare function getChromeVersion(): number | false;
 export declare const nextTick: (func: (value: void) => void | PromiseLike<void>) => void;
+export declare const loop: (items: string | any[], callback: (arg0: any) => any) => void;
+export declare const addEventListener: (target: any, eventType: string, cb: any, option?: any) => {
+    remove: () => void;
+};
--- a/packages/func/es/utils/index.js
+++ b/packages/func/es/utils/index.js
@ -1,3 +1,5 @@
+import ReactDOM from 'react-dom';
+export { default as isChrome } from "./isChrome";
 export var matchS3Prefix = function matchS3Prefix(str) {
  return /^v[0-9]_/.test(str);
 };
@ -73,4 +75,32 @@ export var nextTick = function nextTick(func) {
    return;
  }
  Promise.resolve().then(func);
+};
+export var loop = function loop(items, callback) {
+  for (var i = 0; i < items.length; i++) {
+    var element = items[i];
+    var isBreak = callback(element);
+    if (isBreak) {
+      return;
+    }
+    if (element['children']) {
+      loop(element['children'], callback);
+    }
+  }
+};
+export var addEventListener = function addEventListener(target, eventType, cb, option) {
+  /* eslint camelcase: 2 */
+  var callback = ReactDOM.unstable_batchedUpdates ? function run(e) {
+    ReactDOM.unstable_batchedUpdates(cb, e);
+  } : cb;
+  if (target.addEventListener) {
+    target.addEventListener(eventType, callback, option);
+  }
+  return {
+    remove: function remove() {
+      if (target.removeEventListener) {
+        target.removeEventListener(eventType, callback);
+      }
+    }
+  };
 };
--- a/packages/func/es/utils/isChrome.d.ts
+++ b/packages/func/es/utils/isChrome.d.ts
@ -0,0 +1,3 @@
+export declare const isBrowser: boolean;
+declare const isChrome: () => boolean;
+export default isChrome;
--- a/packages/func/es/utils/isChrome.js
+++ b/packages/func/es/utils/isChrome.js
@ -0,0 +1,17 @@
+export var isBrowser = !!(typeof window !== 'undefined' && window);
+var isChrome = function isChrome() {
+  var winNav = isBrowser && window.navigator;
+  var vendorName = winNav && winNav.vendor;
+  var userAgent = winNav && winNav.userAgent;
+
+  //@ts-ignore
+  var isChromium = isBrowser && typeof chrome !== 'undefined';
+
+  //@ts-ignore
+  var isOpera = isBrowser && typeof opr !== 'undefined';
+  var isIEedge = userAgent && userAgent.indexOf('Edge') > -1;
+  var isIOSChrome = !!(userAgent && userAgent.match('CriOS'));
+  var isDesktopChrome = isChromium && vendorName === 'Google Inc.' && !isOpera && !isIEedge;
+  return isIOSChrome || isDesktopChrome;
+};
+export default isChrome;
--- a/packages/func/lib/addEventListener/index.d.ts
+++ b/packages/func/lib/addEventListener/index.d.ts
@ -1,3 +0,0 @@
-export default function addEventListener(target: any, eventType: string, cb: any, option: any): {
-    remove: () => void;
-};
--- a/packages/func/lib/camera/constants.d.ts
+++ b/packages/func/lib/camera/constants.d.ts
@ -0,0 +1,41 @@
+/**
+ * 设备类型枚举
+ */
+export declare const DeviceType: {
+    VMS: string;
+    DIR: string;
+    CAMERA: string;
+};
+export declare const LOCAL_KEY = "local";
+export declare const DIRE_CONNECT_KEY = "direconnect";
+export declare const BOX_LIST_KEY = "boxlist";
+export declare enum VmsplatformOpt {
+    VMSPLATFORMOPT_ID = 0,
+    VMSPLATFORMOPT_PLATFORMNAME = 1,
+    VMSPLATFORMOPT_PLUGINNAME = 2,
+    VMSPLATFORMOPT_IP = 3,
+    VMSPLATFORMOPT_PORT = 4,
+    VMSPLATFORMOPT_USERNAME = 5,
+    VMSPLATFORMOPT_PASSWORD = 6
+}
+export declare enum OPT {
+    OR = 0,
+    AND = 1,
+    ORNOT = 2,
+    ANDNOT = 3
+}
+export declare enum DevicemanagerCameraType {
+    DEVICEMANAGER_CAMERA_TYPE_DEFAULT = 0,
+    DEVICEMANAGER_CAMERA_TYPE_NORMAL = 1,
+    DEVICEMANAGER_CAMERA_TYPE_1400 = 97,
+    DEVICEMANAGER_CAMERA_TYPE_DHGRABBER = 98,
+    DEVICEMANAGER_CAMERA_TYPE_HKGRABBER = 99,
+    DEVICEMANAGER_CAMERA_TYPE_LOCAL = 100
+}
+export declare const BOX_DIRECONNECT_PLATFORM_FILTER: {
+    filtervmsplatformList: {
+        opt: OPT;
+        vmsplatformOpt: VmsplatformOpt;
+        value: string;
+    }[];
+};
--- a/packages/func/lib/camera/constants.js
+++ b/packages/func/lib/camera/constants.js
@ -0,0 +1,90 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/camera/constants.ts
+var constants_exports = {};
+__export(constants_exports, {
+  BOX_DIRECONNECT_PLATFORM_FILTER: () => BOX_DIRECONNECT_PLATFORM_FILTER,
+  BOX_LIST_KEY: () => BOX_LIST_KEY,
+  DIRE_CONNECT_KEY: () => DIRE_CONNECT_KEY,
+  DeviceType: () => DeviceType,
+  DevicemanagerCameraType: () => DevicemanagerCameraType,
+  LOCAL_KEY: () => LOCAL_KEY,
+  OPT: () => OPT,
+  VmsplatformOpt: () => VmsplatformOpt
+});
+module.exports = __toCommonJS(constants_exports);
+var DeviceType = {
+  VMS: "vms",
+  DIR: "dir",
+  CAMERA: "camera"
+};
+var LOCAL_KEY = "local";
+var DIRE_CONNECT_KEY = "direconnect";
+var BOX_LIST_KEY = "boxlist";
+var VmsplatformOpt = /* @__PURE__ */ ((VmsplatformOpt2) => {
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_ID"] = 0] = "VMSPLATFORMOPT_ID";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_PLATFORMNAME"] = 1] = "VMSPLATFORMOPT_PLATFORMNAME";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_PLUGINNAME"] = 2] = "VMSPLATFORMOPT_PLUGINNAME";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_IP"] = 3] = "VMSPLATFORMOPT_IP";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_PORT"] = 4] = "VMSPLATFORMOPT_PORT";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_USERNAME"] = 5] = "VMSPLATFORMOPT_USERNAME";
+  VmsplatformOpt2[VmsplatformOpt2["VMSPLATFORMOPT_PASSWORD"] = 6] = "VMSPLATFORMOPT_PASSWORD";
+  return VmsplatformOpt2;
+})(VmsplatformOpt || {});
+var OPT = /* @__PURE__ */ ((OPT2) => {
+  OPT2[OPT2["OR"] = 0] = "OR";
+  OPT2[OPT2["AND"] = 1] = "AND";
+  OPT2[OPT2["ORNOT"] = 2] = "ORNOT";
+  OPT2[OPT2["ANDNOT"] = 3] = "ANDNOT";
+  return OPT2;
+})(OPT || {});
+var DevicemanagerCameraType = /* @__PURE__ */ ((DevicemanagerCameraType2) => {
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_DEFAULT"] = 0] = "DEVICEMANAGER_CAMERA_TYPE_DEFAULT";
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_NORMAL"] = 1] = "DEVICEMANAGER_CAMERA_TYPE_NORMAL";
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_1400"] = 97] = "DEVICEMANAGER_CAMERA_TYPE_1400";
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_DHGRABBER"] = 98] = "DEVICEMANAGER_CAMERA_TYPE_DHGRABBER";
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_HKGRABBER"] = 99] = "DEVICEMANAGER_CAMERA_TYPE_HKGRABBER";
+  DevicemanagerCameraType2[DevicemanagerCameraType2["DEVICEMANAGER_CAMERA_TYPE_LOCAL"] = 100] = "DEVICEMANAGER_CAMERA_TYPE_LOCAL";
+  return DevicemanagerCameraType2;
+})(DevicemanagerCameraType || {});
+var BOX_DIRECONNECT_PLATFORM_FILTER = {
+  filtervmsplatformList: [
+    {
+      opt: 0 /* OR */,
+      vmsplatformOpt: 1 /* VMSPLATFORMOPT_PLATFORMNAME */,
+      value: "direconnect"
+    },
+    {
+      opt: 0 /* OR */,
+      vmsplatformOpt: 1 /* VMSPLATFORMOPT_PLATFORMNAME */,
+      value: "boxlist"
+    }
+  ]
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BOX_DIRECONNECT_PLATFORM_FILTER,
+  BOX_LIST_KEY,
+  DIRE_CONNECT_KEY,
+  DeviceType,
+  DevicemanagerCameraType,
+  LOCAL_KEY,
+  OPT,
+  VmsplatformOpt
+});
--- a/packages/func/lib/camera/index.d.ts
+++ b/packages/func/lib/camera/index.d.ts
@ -0,0 +1,40 @@
+import { DevicemanagerCameraType } from './constants';
+export declare const isFaceCamera: (type: DevicemanagerCameraType) => boolean;
+/**
+ *
+ * @param value 传入的数据 可以是 item（camera/vms/dirs）/ deviceID
+ * @param isId
+ */
+export declare function getDeviceType(value: {
+    [x: string]: any;
+    id: any;
+} | string): any;
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param id  设备id
+ * @param type  设备类型
+ */
+export declare function deviceIDToDeviceKey(id: any, type: string, vmsId?: any): string;
+/**
+ * 后端设备id/vmsid/dirid是三张表 合并在一起不保证唯一 前端生成唯一key
+ * @param item  camera/vms/dirs
+ */
+export declare function deviceToDeviceKey(item: {
+    [x: string]: any;
+    id: any;
+}): string;
+/**
+ * 设备树key 转 后端设备原始id dirid是string/vms&camera 是number 和后端保持一致
+ * @param deviceKey 设备树的id
+ */
+export declare function deviceKeyToDeviceId(deviceKey: {
+    split: (arg0: string) => [any, any];
+}): any;
+export declare const getVmsIdByDeviceId: (key: string) => string;
+/**
+ * 通过设备id或设备key在树里面找摄像头
+ * @param ids cameraId
+ * @param deviceTree 树
+ * @param type "id" | "key"
+ */
+export declare const findCamerasByInDeviceTree: (ids: never[] | undefined, deviceTree: any, type?: string) => any[];
--- a/packages/func/lib/camera/index.js
+++ b/packages/func/lib/camera/index.js
@ -0,0 +1,143 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/camera/index.ts
+var camera_exports = {};
+__export(camera_exports, {
+  deviceIDToDeviceKey: () => deviceIDToDeviceKey,
+  deviceKeyToDeviceId: () => deviceKeyToDeviceId,
+  deviceToDeviceKey: () => deviceToDeviceKey,
+  findCamerasByInDeviceTree: () => findCamerasByInDeviceTree,
+  getDeviceType: () => getDeviceType,
+  getVmsIdByDeviceId: () => getVmsIdByDeviceId,
+  isFaceCamera: () => isFaceCamera
+});
+module.exports = __toCommonJS(camera_exports);
+var import_lodash_es = require("lodash-es");
+var import_utils = require("../utils");
+var import_constants = require("./constants");
+var isFaceCamera = (type) => {
+  return [
+    import_constants.DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_1400,
+    import_constants.DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_HKGRABBER,
+    import_constants.DevicemanagerCameraType.DEVICEMANAGER_CAMERA_TYPE_DHGRABBER
+  ].includes(type);
+};
+function getDeviceType(value) {
+  let type;
+  let isDeviceKey = (0, import_lodash_es.isString)(value);
+  if (isDeviceKey) {
+    type = value.split("_")[0];
+  } else {
+    if ((0, import_lodash_es.has)(value, "longitude")) {
+      type = import_constants.DeviceType["CAMERA"];
+    }
+    if ((0, import_lodash_es.has)(value, "ip")) {
+      type = import_constants.DeviceType["VMS"];
+    }
+    if (!type) {
+      type = import_constants.DeviceType["DIR"];
+    }
+  }
+  return type;
+}
+function deviceIDToDeviceKey(id, type, vmsId) {
+  if (type == import_constants.DeviceType["DIR"]) {
+    return `${type}_${id}_${vmsId}`;
+  } else {
+    return `${type}_${id}`;
+  }
+}
+function deviceToDeviceKey(item) {
+  let deviceKey = "";
+  let type = getDeviceType(item);
+  if (!type) {
+    console.error("device type is null!");
+  }
+  switch (type) {
+    case import_constants.DeviceType["DIR"]:
+      {
+        let dirId = item["dirid"] || item["dirId"];
+        if (!dirId && dirId !== 0) {
+          console.error("dirId type is null!");
+        }
+        let vmsId = (0, import_lodash_es.get)(item, "extendInfo.vmsPlatformId");
+        if (!vmsId && vmsId !== 0) {
+          console.error("vmsId type is null!");
+        }
+        deviceKey = `${type}_${dirId}_${vmsId}`;
+      }
+      break;
+    case import_constants.DeviceType["VMS"]:
+      deviceKey = `${type}_${item["id"]}`;
+      break;
+    case import_constants.DeviceType["CAMERA"]:
+      {
+        let vmsId = (0, import_lodash_es.get)(item, "extendInfo.vmsPlatformId");
+        if (!vmsId && vmsId !== 0) {
+          console.error("vmsId type is null!");
+        }
+        deviceKey = `${type}_${item.id}`;
+      }
+      break;
+  }
+  return deviceKey;
+}
+function deviceKeyToDeviceId(deviceKey) {
+  let [type, id] = deviceKey.split("_");
+  return type === import_constants.DeviceType["DIR"] ? id : Number(id);
+}
+var getVmsIdByDeviceId = (key) => {
+  const type = getDeviceType(key);
+  let vmsId = "";
+  switch (type) {
+    case import_constants.DeviceType["CAMERA"]:
+    case import_constants.DeviceType["DIR"]:
+      vmsId = key.split("_")[2];
+      break;
+    case import_constants.DeviceType["VMS"]:
+      vmsId = key.split("_")[1];
+      break;
+  }
+  if (!vmsId) {
+    console.error("vmsid is null!");
+  }
+  return vmsId;
+};
+var findCamerasByInDeviceTree = (ids = [], deviceTree, type = "id") => {
+  let cameraInfoList = [];
+  let _ids = ids.map((v) => String(v));
+  (0, import_utils.loop)(deviceTree, (item) => {
+    let isCamera = getDeviceType((0, import_lodash_es.get)(item, "key", "")) === import_constants.DeviceType["CAMERA"];
+    let isMatch = type === "key" ? _ids.includes((0, import_lodash_es.get)(item, "key")) : _ids.includes(`${(0, import_lodash_es.get)(item, "origin.id")}`);
+    if (isCamera && isMatch) {
+      cameraInfoList.push(item);
+    }
+  });
+  return cameraInfoList;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  deviceIDToDeviceKey,
+  deviceKeyToDeviceId,
+  deviceToDeviceKey,
+  findCamerasByInDeviceTree,
+  getDeviceType,
+  getVmsIdByDeviceId,
+  isFaceCamera
+});
--- a/Show More
+++ b/Show More
				`@ -0,0 +1 @@`
				`export { default as BigImageModalAdapter } from "./BigImageModalAdapter";`