3095 changed files with 284937 additions and 677010 deletions
--- a/.dumi/global.less
+++ b/.dumi/global.less
@ -6,17 +6,13 @@
  max-width: none;
 }

-#root .dumi-default-header-content {
-  max-width: none;
-}
-
 #root .dumi-default-header {
  box-shadow: 2px 1px 16px #dfdfdf;
 }

 #root .dumi-default-sidebar {
  width: 188px;
-  overflow-y: scroll;
+  overflow-y: hidden;
  /* stylelint-disable-next-line rule-empty-line-before */
  &:hover {
    overflow-y: auto;
--- a/.dumi/loading.svg
+++ b/.dumi/loading.svg
@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: none; display: block; shape-rendering: auto;" width="200px" height="200px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+<defs>
+  <path id="path" d="M50 15A15 35 0 0 1 50 85A15 35 0 0 1 50 15" fill="none"></path>
+  <path id="patha" d="M0 0A15 35 0 0 1 0 70A15 35 0 0 1 0 0" fill="none"></path>
+</defs><g transform="rotate(0 50 50)">
+<use xlink:href="#path" stroke="#dfdfdf" stroke-width="3"></use>
+</g><g transform="rotate(60 50 50)">
+<use xlink:href="#path" stroke="#dfdfdf" stroke-width="3"></use>
+</g><g transform="rotate(120 50 50)">
+<use xlink:href="#path" stroke="#dfdfdf" stroke-width="3"></use>
+</g><g transform="rotate(0 50 50)">
+<circle cx="50" cy="15" r="9" fill="#e15b64">
+  <animateMotion dur="1s" repeatCount="indefinite" begin="0s">
+    <mpath xlink:href="#patha"></mpath>
+  </animateMotion>
+</circle>
+</g><g transform="rotate(60 50 50)">
+<circle cx="50" cy="15" r="9" fill="#f8b26a">
+  <animateMotion dur="1s" repeatCount="indefinite" begin="-0.16666666666666666s">
+    <mpath xlink:href="#patha"></mpath>
+  </animateMotion>
+</circle>
+</g><g transform="rotate(120 50 50)">
+<circle cx="50" cy="15" r="9" fill="#abbd81">
+  <animateMotion dur="1s" repeatCount="indefinite" begin="-0.3333333333333333s">
+    <mpath xlink:href="#patha"></mpath>
+  </animateMotion>
+</circle>
+</g></svg>
--- a/.dumi/loading.tsx
+++ b/.dumi/loading.tsx
@ -0,0 +1,11 @@
+import React from 'react';
+import loading from './loading.svg'
+
+export default () => {
+  return (
+    <div style={{ textAlign: 'center' }}>
+      <image src={loading} />
+      <p>客官，您慢点儿...</p>
+    </div>
+  );
+};
--- a/.dumirc.ts
+++ b/.dumirc.ts
@ -1,6 +1,8 @@
 import { defineConfig } from 'dumi';
 import path from 'path';

+console.log(path.join(__dirname, 'packages/hooks/src'));
+
 export default defineConfig({
  logo: '/logo.jpg',
  favicons: ['/logo.jpg'],
@ -16,31 +18,31 @@ export default defineConfig({
    '@zhst/biz': path.join(__dirname, 'packages/biz/src'),
    '@zhst/meta': path.join(__dirname, 'packages/meta/src'),
    '@zhst/request': path.join(__dirname, 'packages/request/src'),
-    '@zhst/slave': path.join(__dirname, 'packages/slave/src'),
-    '@zhst/material': path.join(__dirname, 'packages/material/src'),
-    '@zhst/icon': path.join(__dirname, 'packages/icon/src'),
-    '@zhst/icon-v2': path.join(__dirname, 'packages/icon-v2/src'),
-    '@zhst/map': path.join(__dirname, 'packages/map/src'),
  },
  resolve: {
    docDirs: ['docs'],
    atomDirs: [
      { type: 'hooks', dir: 'packages/hooks/src' },
      { type: 'utils', dir: 'packages/func/src' },
-      { type: 'module', subType: 'biz', dir: 'packages/biz/src' },
-      { type: 'module', subType: 'meta', dir: 'packages/meta/src' },
-      { type: 'other', subType: 'request', dir: 'packages/request/src' },
-      { type: 'other', subType: 'constants', dir: 'packages/constants/src' },
-      { type: 'other', subType: 'types', dir: 'packages/types/src' },
-      { type: 'slave', dir: 'packages/slave/src' },
-      { type: 'material', dir: 'packages/material/src' },
-      { type: 'icon', dir: 'packages/icon/src' },
-      { type: 'icon-v2', dir: 'packages/icon-v2/src' },
-      { type: 'map', dir: 'packages/map/src' },
+      { type: 'biz', dir: 'packages/biz/src' },
+      { type: 'meta', dir: 'packages/meta/src' },
+      { type: 'request', dir: 'packages/request/src' },
+      { type: 'constants', dir: 'packages/constants/src' },
+      { type: 'types', dir: 'packages/types/src' },
    ],
  },
  monorepoRedirect: {
    srcDir: ['packages', 'src'],
    peerDeps: true,
  },
+  extraBabelPlugins: [
+    [
+      'import',
+      {
+        libraryName: 'antd',
+        libraryDirectory: 'es',
+        style: true,
+      },
+    ],
+  ],
 });
--- a/.fatherrc.ts
+++ b/.fatherrc.ts
@ -1,15 +1,15 @@
-import { defineConfig } from 'father-plugin-less';
+import { defineConfig } from 'father';

 export default defineConfig({
  // more father config: https://github.com/umijs/father/blob/master/docs/config.md
-  esm: {
-    output: 'es',
-    ignores: ['**/demo/*', 'src/**/demo/*'],
-    transformer: 'babel',
-  },
-  cjs: {
-    output: 'lib',
-    ignores: ['**/demo/*', 'src/**/demo/*'],
-    transformer: 'babel',
-  },
+  extraBabelPlugins: [
+    [
+      'import',
+      {
+        libraryName: 'antd',
+        libraryDirectory: 'es',
+        style: true,
+      },
+    ],
+  ],
 });
--- a/.gitignore
+++ b/.gitignore
@ -9,10 +9,5 @@ vueuse
 /temp
 packages/**/es
 packages/**/lib
-**/es
-**/lib
-**/**/es
-**/**/lib
 /es
 /lib
-pnpm-lock.yaml
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@ -1,36 +1,12 @@
 stages:
  - build
-  - package
-  - deploy
-
-cache:
-  policy: pull
-  key: '$CI_COMMIT_REF_NAME'
-  paths:
-    - node_modules/

 build:
-  image: registry.zhst.com/video-analysis/pnpm4-lambo
  tags:
-    - linux_docker_web_204
+    - linux
  stage: build
  script:
-    - chmod +x ./deploy/build.sh && ./deploy/build.sh
-  artifacts:
-    name: '${CI_PROJECT_NAME}_${CI_COMMIT_REF_NAME}_${CI_JOB_NAME}_${CI_PIPELINE_ID}'
-    paths:
-      - ./app/public/*
-  only:
-    - master 
-
-package:
-  tags:
-    - linux_shell
-  stage: package
-  script:
-    - chmod +x ./deploy/package.sh && ./deploy/package.sh
-  dependencies:
-    - build
-  only:
-    - master 
-
+    - cd /home
+    - ls
+    - git
+    - node
--- a/.npmrc
+++ b/.npmrc
@ -1,6 +1,4 @@
-//10.0.0.77:4874/:always-auth=true
-//10.0.0.77:4874/:_authToken=VbcnvB0eKGAqsT5ZNbfKiw==
 registry="https://registry.npmmirror.com"
-@zhst:registry="http://10.0.0.77:4874/"
+@zhst:registry="http://10.0.0.77:4874"
 strict-peer-dependencies=false
 ignore-workspace-root-check=true
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@ -1,10 +0,0 @@
-{
-  "configurations": [
-    {
-      "type": "chrome",
-      "name": "lambo",
-      "request": "launch",
-      "url": "http://localhost:8000/metas"
-    }
-  ]
-}
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@ -10,9 +10,6 @@
    "flvjs",
    "indicatorsize",
    "lambo",
-    "mapbox",
-    "maxzoom",
-    "minzoom",
    "remuxer",
    "stylelint",
    "transmuxer",
--- a/5
+++ b/5
@ -1,5 +0,0 @@
-FROM registry.zhst.com/video-analysis/alpine:latest
-
-ADD ./app/public/ /app/public/
-
-CMD [ "sh", "-c", "while true; do echo zhst-web; sleep 1; done" ]
--- a/deploy/build.sh
+++ b/deploy/build.sh
@ -1,22 +0,0 @@
-pnpm --version
-pnpm -v
-node -v
-pnpm install --force
-
-pnpm run pkg:build
-
-if [ $? -ne 0 ]; then
-  exit 1
-fi
-
-pnpm run pub
-
-# 打tag失败
-
-pnpm run build:master
-
-mkdir -p ./app/public/
-
-mv ./dist/* ./app/public/
-
-cat ./app/public/index.html | head -n 7
--- a/deploy/package.sh
+++ b/deploy/package.sh
@ -1,10 +0,0 @@
-#! /bin/bash
-set -e
-
-export DOCKER_CLI_EXPERIMENTAL=enabled
-docker login registry.zhst.com -u zhst -p Zhst666\&
-
-# docker build -t registry.zhst.com/${CI_PROJECT_NAMESPACE}/${CI_PROJECT_NAME}:${CI_COMMIT_REF_NAME//\//-}-${CI_PIPELINE_ID} -f Dockerfile .
-# docker push registry.zhst.com/${CI_PROJECT_NAMESPACE}/${CI_PROJECT_NAME}:${CI_COMMIT_REF_NAME//\//-}-${CI_PIPELINE_ID}
-docker buildx build  --platform linux/arm64,linux/amd64 -t registry.zhst.com/${CI_PROJECT_NAMESPACE}/${CI_PROJECT_NAME}:${CI_COMMIT_REF_NAME//\//-}-${CI_PIPELINE_ID} -f Dockerfile .  --push
-
--- a/docs/index.md
+++ b/docs/index.md
@ -1,81 +1,40 @@
 ---
 hero:
  title: lambo
-  description: 致力于提升前端开发效率与规范（开发前请先阅读开发流程）
+  description: 致力于提升前端开发效率与规范
  actions:
    - text: 快速上手
      link: /bizs
-# features:
-#   - title: biz
-#     emoji: 🍑
-#     description: 业务库
-#   - title: hooks
-#     emoji: 💎
-#     description: hooks
-#   - title: func
-#     emoji: 🌈
-#     description: 常用函数库
-#   - title: meta
-#     emoji: ☀️
-#     description: 原子组件库
-#   - title: constants
-#     emoji: 🈶️
-#     description: 静态定义库
-#   - title: request
-#     emoji: 🥣
-#     description: 网络请求库
-#   - title: types
-#     emoji: 🈸
-#     description: typescript 声明库
-#   - title: material
-#     emoji: 🥱
-#     description: 物料库
-#   - title: cli
-#     emoji: 🐔
-#     description: 脚手架
+features:
+  - title: biz
+    emoji: 🍑
+    description: 业务库
+  - title: hooks
+    emoji: 💎
+    description: hooks
+  - title: func
+    emoji: 🌈
+    description: 常用函数库
+  - title: meta
+    emoji: ☀️
+    description: 原子组件库
+  - title: constants
+    emoji: 🈶️
+    description: 静态定义库
+  - title: request
+    emoji: 🥣
+    description: 网络请求库
+  - title: types
+    emoji: 🈸
+    description: typescript 声明库
+  - title: material
+    emoji: 🥱
+    description: 物料库
+  - title: cli
+    emoji: 🐔
+    description: 脚手架
 ---

-## 开发流程
-
-### 1. 确定需求
-
-从 gitlab 上的 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 模块找到对应的需求。将 Assignee 负责人指派为自己（如果多人协同开发可以将需求拆分为多个需求，分别指派），然后将 Labels 标签改为 doing 状态。（截止日期选填）
-
-> issuse 命名规则：@zhst/{包名} - {模块名}，然后在详情页描述对应需求。
-
-### 2. 创建 git 分支
-
-按照 git flow 规范从 [master](http://10.0.0.88/web-project/zhst-lambo) 上创建分支, 分支的命名规则参考：
-
-1. feat/XXX: 需求新增
-2. hotfix/XXX: bug 修复
-
-### 3. 开始开发
-
-进入项目文件夹，在 packages 下找到对应的 npm 包, 然后在 src 目录下按已有的格式进行开发，如果是功能变更就找到对应的页面进行修改
-
-### 4. 提交代码，并提交 mr 到 develop 分支
-
-完成开发后，给代码提交 commit，格式参考 ${行为}(${影响范围}): ${变更内容}， 例如：
-
-> feat(package.json): 修改版本号
-> fix(app.ts): 修改环境变量
-
-对应的变更会在最终的 npm 包版本号体现：a.b.c - a 对应重构（一般用不上） - b 对应 feat（功能新增） - c 对应 hotfix（一般是 bug 修复）
-
-push 完代码之后，在 gitlab 上提交一个 mr 到 develop 分支，指定给对应的人员审核（@江志雄），合并成功之后，将 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 对应的 Labels 状态改为 waittingPublish。
-
-### 5. 发布成功
-
-发布成功之后，会有两个行为：
-
-1. 在钉钉群通知发布成功。
-2. 生成线上预览[说明文档](http://10.0.0.204:30080)
-
-一旦触发了钉钉通知，则需要去到 [issue](http://10.0.0.88/web-project/zhst-lambo/boards) 板块将对应的需求 **close** 掉。
-
-这就是 npm 包整个开发链路。
-
 ## 目录结构

 <Tree>
--- a/global.d.ts
+++ b/global.d.ts
@ -1,4 +0,0 @@
-declare module '*.less';
-declare module '*.png';
-declare module '*.jpg';
-declare module '*.jpeg';
--- a/package.json
+++ b/package.json
@ -14,7 +14,7 @@
  ],
  "scripts": {
    "add": "pnpm changeset add",
-    "build:master": "dumi build",
+    "build": "pnpm --filter=@zhst/* run build",
    "build:watch": "father dev",
    "dev": "dumi dev",
    "docs:build": "dumi build",
@ -22,7 +22,6 @@
    "lint": "npm run lint:es && npm run lint:css",
    "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
    "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
-    "pkg:build": "pnpm --filter=@zhst/* run build",
    "prepare": "husky install && dumi setup",
    "prepublishOnly": "father doctor && npm run build",
    "pub": "pnpm changeset publish",
@ -51,6 +50,7 @@
      "prettier --parser=typescript --write"
    ]
  },
+  "dependencies": {},
  "devDependencies": {
    "@changesets/cli": "^2.27.1",
    "@commitlint/cli": "^17.1.2",
@ -58,10 +58,10 @@
    "@types/react": "^18.0.0",
    "@types/react-dom": "^18.0.0",
    "@umijs/lint": "^4.0.0",
+    "babel-plugin-import": "^1.13.8",
    "dumi": "^2.2.13",
    "eslint": "^8.23.0",
    "father": "^4.1.0",
-    "father-plugin-less": "^0.0.2",
    "husky": "^8.0.1",
    "lerna": "^8.0.0",
    "lint-staged": "^13.0.3",
@ -83,12 +83,5 @@
  },
  "authors": [
    "dev<710328466@qq.com>"
-  ],
-  "dependencies": {
-    "@ant-design/happy-work-theme": "^1.0.0",
-    "@zhst/meta": "workspace:^",
-    "rc-rate": "~2.12.0",
-    "react-fast-marquee": "^1.6.4",
-    "react-infinite-scroll-component": "^6.1.0"
-  }
+  ]
 }
--- a/packages/biz/.fatherrc.ts
+++ b/packages/biz/.fatherrc.ts
@ -1,20 +1,13 @@
-import { defineConfig } from 'father-plugin-less';
+import { defineConfig } from 'father';

 export default defineConfig({
  // more father config: https://github.com/umijs/father/blob/master/docs/config.md
  esm: {
    output: 'es',
-    ignores: ['**/demo/*', 'src/**/demo/*'],
-    transformer: 'babel',
+    ignores: ['**/demo/*', 'src/**/demo/*']
  },
  cjs: {
    output: 'lib',
-    ignores: ['**/demo/*', 'src/**/demo/*'],
-    transformer: 'babel',
+    ignores: ['**/demo/*', 'src/**/demo/*']
  },
-  lessInBabel: {
-    modifyVars: {
-    },
-  },
-  plugins: ['father-plugin-less'],
 });
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@ -1,567 +1,5 @@
 # @zhst/biz

-## 0.34.0
-
-### Minor Changes
-
- feat(material,biz,meta): 修改算法配置物料,树组件业务传参,修复大图组件 od 变化不重新渲染
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.30.0
-
-## 0.33.2
-
-### Patch Changes
-
- 修改穿梭框不能修改宽度
-
-## 0.33.1
-
-### Patch Changes
-
- 修改穿梭框不能修改宽度 bug
-
-## 0.33.0
-
-### Minor Changes
-
- feat(biz): 修改穿梭框的样式和注释
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.29.0
-
-## 0.32.2
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.28.0
-
-## 0.32.1
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/icon@0.8.0
-  - @zhst/meta@0.27.1
-
-## 0.32.0
-
-### Minor Changes
-
- zhst/biz 废弃 tree 组件
-
-## 0.31.0
-
-### Minor Changes
-
- 修改 less to css 配置
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.17.0
-  - @zhst/hooks@0.15.0
-  - @zhst/icon@0.7.0
-  - @zhst/meta@0.27.0
-
-## 0.30.0
-
-### Minor Changes
-
- 新增 zhst/biz 的大图组件 v2,修改其它包打包样式文件为 css
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/hooks@0.14.0
-  - @zhst/icon@0.6.0
-  - @zhst/meta@0.26.0
-
-## 0.29.0
-
-### Minor Changes
-
- zhst/biz: 添加 treePanel 的一些例子,修复一些 ts 报错
-
-## 0.28.0
-
-### Minor Changes
-
- zhst/biz: 新增树面板
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.25.0
-
-## 0.27.0
-
-### Minor Changes
-
- zhst/meta 全量迁移 antd-5.17.4
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.24.0
-
-## 0.26.0
-
-### Minor Changes
-
- 穿梭框完成,新增 meta 组件
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.23.0
-  - @zhst/hooks@0.13.2
-  - @zhst/func@0.16.1
-  - @zhst/icon@0.5.1
-
-## 0.25.1
-
-### Patch Changes
-
- feat(zhst/map,zhst/biz): map 完善文档,biz 修改 boxSelectTree 的文档格式
-
-## 0.25.0
-
-### Minor Changes
-
- zhst/map:拓展地图 api,加入 tools 组件、cluster 组价、marker 组件、draw 组件、popup 组件；zhst/mata:添加 floatButton 组件
-
-## 0.24.0
-
-### Minor Changes
-
- 树组件支持 tag 面板、优化 filter 传参、优化 option 传参、废弃之前的定制化方案
-
-## 0.23.0
-
-### Minor Changes
-
- feat(biz 无限滚动组件): 添加无限滚动组件,屏幕自适应撑开
-
-## 0.22.2
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.16.0
-  - @zhst/hooks@0.13.1
-  - @zhst/meta@0.21.2
-
-## 0.22.1
-
-### Patch Changes
-
- fix: 修改 cropperHelper 的无效引用
- Updated dependencies
-  - @zhst/meta@0.21.1
-
-## 0.22.0
-
-### Minor Changes
-
- fix: zhst/meta、zhst/biz、zhst/material-修改图片标注组件
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.21.0
-
-## 0.21.5
-
-### Patch Changes
-
- fix: 修改 zhst/meta
- Updated dependencies
-  - @zhst/meta@0.20.3
-
-## 0.21.4
-
-### Patch Changes
-
- zhst/biz、zhst/meta、zhst/material: 修改 od、修改 boxSelectTree
- Updated dependencies
-  - @zhst/meta@0.20.2
-
-## 0.21.3
-
-### Patch Changes
-
- zhst/biz: fix: 边框颜色主题色，实时监控窗口有图片和选中，预警记录文字溢出
-
-## 0.21.2
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.20.1
-
-## 0.21.1
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.20.0
-
-## 0.21.0
-
-### Minor Changes
-
- feat: 修复之前发版错乱问题
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/hooks@0.13.0
-  - @zhst/func@0.15.0
-  - @zhst/icon@0.5.0
-  - @zhst/meta@0.19.0
-
-## 0.20.1
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.14.1
-  - @zhst/hooks@0.12.1
-  - @zhst/meta@0.18.1
-
-## 0.20.0
-
-### Minor Changes
-
- feat: 重新发版
-
-### Patch Changes
-
- fix: zhst/biz 优化实时监控布局
-
-## 0.19.1
-
-### Patch Changes
-
- zhst/biz: 实时监控预警记录添加滚动条
-
-## 0.19.0
-
-### Minor Changes
-
- fix: 修复适配问题
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/hooks@0.11.0
-  - @zhst/func@0.13.0
-  - @zhst/icon@0.3.0
-  - @zhst/meta@0.17.0
-
-## 0.18.8
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.12.0
-  - @zhst/hooks@0.10.4
-  - @zhst/meta@0.16.4
-
-## 0.18.7
-
-### Patch Changes
-
- @zhst/func@0.11.3
- @zhst/hooks@0.10.3
- @zhst/meta@0.16.3
-
-## 0.18.6
-
-### Patch Changes
-
- biz 优化无限滚动组件、boxselectTree 组件；material 修改算法编辑模块
-
-## 0.18.5
-
-### Patch Changes
-
- zhst/biz 优化 boxselecttree
-
-## 0.18.4
-
-### Patch Changes
-
- biz-transfer： 修改删除时透出
-
-## 0.18.3
-
-### Patch Changes
-
- zhst/biz - 修改穿梭框事件透出
-
-## 0.18.2
-
-### Patch Changes
-
- @zhst/func@0.11.2
- @zhst/hooks@0.10.2
- @zhst/meta@0.16.2
-
-## 0.18.1
-
-### Patch Changes
-
- @zhst/func@0.11.1
- @zhst/hooks@0.10.1
- @zhst/meta@0.16.1
-
-## 0.18.0
-
-### Minor Changes
-
- zhst/biz:新增摘要列表-无限滚动组件
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/hooks@0.10.0
-  - @zhst/func@0.11.0
-  - @zhst/meta@0.16.0
-
-## 0.17.0
-
-### Minor Changes
-
- 视频添加 OD 框,查看大图首次点击修复
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.15.0
-  - @zhst/func@0.10.2
-  - @zhst/hooks@0.9.2
-
-## 0.16.1
-
-### Patch Changes
-
- zhst/biz: fix: 在业务层控制窗口切换状态
-
-## 0.16.0
-
-### Minor Changes
-
- zhst/meta 大图圈选组件点击选不上 bug 修复,attach 遮挡底部框事件阻止修复
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.14.0
-
-## 0.15.0
-
-### Minor Changes
-
- biz: 视频播放首图添加 od 框
-
-## 0.14.0
-
-### Minor Changes
-
- biz：新增 od 弹框、预警图片 od；meta：新增人脸碰撞模型组件、扫描组件、termial 组件；material：新增中心连接物料
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.13.0
-  - @zhst/hooks@0.9.1
-  - @zhst/func@0.10.1
-
-## 0.13.0
-
-### Minor Changes
-
- 修改业务组件的 boxSelectTree
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/hooks@0.9.0
-  - @zhst/func@0.10.0
-  - @zhst/meta@0.12.0
-
-## 0.12.2
-
-### Patch Changes
-
- 修改盒子组件顺序
-  - @zhst/func@0.9.3
-  - @zhst/hooks@0.8.12
-  - @zhst/meta@0.11.1
-
-## 0.12.1
-
-### Patch Changes
-
- 修改物料库算法编辑新增箭头选择,元组件新增图片标记组件
- Updated dependencies
-  - @zhst/meta@0.11.0
-  - @zhst/func@0.9.2
-  - @zhst/hooks@0.8.11
-
-## 0.12.0
-
-### Minor Changes
-
- 优化 meta 预览图组件
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.10.0
-
-## 0.11.3
-
-### Patch Changes
-
- @zhst/func@0.9.1
- @zhst/hooks@0.8.10
- @zhst/meta@0.9.7
-
-## 0.11.2
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.9.0
-  - @zhst/hooks@0.8.9
-  - @zhst/meta@0.9.6
-
-## 0.11.1
-
-### Patch Changes
-
- biz 打包没打上
-
-## 0.11.0
-
-### Minor Changes
-
- 添加 traansfer 组件 searchProps 透传
-
-## 0.10.5
-
-### Patch Changes
-
- 初始化物料库
- Updated dependencies
-  - @zhst/hooks@0.8.8
-  - @zhst/func@0.8.3
-  - @zhst/meta@0.9.5
-
-## 0.10.4
-
-### Patch Changes
-
- 初始化物料包
- Updated dependencies
-  - @zhst/hooks@0.8.7
-  - @zhst/func@0.8.2
-  - @zhst/meta@0.9.4
-
-## 0.10.3
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.8.1
-  - @zhst/hooks@0.8.6
-  - @zhst/meta@0.9.3
-
-## 0.10.2
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/func@0.8.0
-  - @zhst/hooks@0.8.5
-  - @zhst/meta@0.9.2
-
-## 0.10.1
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.9.1
-
-## 0.10.0
-
-### Minor Changes
-
- 修改 metad 大图组建
-
-### Patch Changes
-
- Updated dependencies
-  - @zhst/meta@0.9.0
-
-## 0.9.8
-
-### Patch Changes
-
- @zhst/func@0.7.5
- @zhst/hooks@0.8.4
- @zhst/meta@0.8.5
-
-## 0.9.7
-
-### Patch Changes
-
- 新增 RealTimeMonitor,VideoPlayerCard,ViewLargerImageModal,WarningRecordCard 组件,优化盒子树创建弹框规则校验
- Updated dependencies
-  - @zhst/meta@0.8.5
-
-## 0.9.6
-
-### Patch Changes
-
- 新增 tree 组件的监听事件,优化 meta 全选的回调事件监听
- Updated dependencies
-  - @zhst/hooks@0.8.3
-  - @zhst/func@0.7.4
-  - @zhst/meta@0.8.4
-
-## 0.9.5
-
-### Patch Changes
-
- 删除预览图组件,新增摄像头状态判断,修复 ts 生成失败问题
-
-## 0.9.4
-
-### Patch Changes
-
- 添加 biz 模块修改树形盒子组件监听事件
-
-## 0.9.3
-
-### Patch Changes
-
- 新增监听点击事件自定义
-
-## 0.9.2
-
-### Patch Changes
-
- 新增 BoxSelectTree 监听时钟点击事件,导入盒子事件
-
 ## 0.9.1

 ### Patch Changes
--- a/packages/biz/es/BigImageModal/BigImageModal.js
+++ b/packages/biz/es/BigImageModal/BigImageModal.js
--- a/packages/biz/es/BigImageModal/components/navigation/index.js
+++ b/packages/biz/es/BigImageModal/components/navigation/index.js
@ -0,0 +1,26 @@
+import * as React from 'react';
+import classnames from 'classnames';
+import { Icon, Button } 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
@ -17,7 +17,7 @@

  :global {
    i:hover {
-      color: #fff !important;
+      color: #f0f0f0 !important;
    }
  }

@ -35,10 +35,10 @@
  }

  &-prev {
-    left: 12px;
+    left: 20px;
  }

  &-next {
-    right: 12px;
+    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.d.ts
+++ b/packages/biz/es/BigImageModal/index.d.ts
@ -0,0 +1,3 @@
+import BigImageModal from "./BigImageModal";
+export type { BigImageModalProps } from './BigImageModal';
+export default BigImageModal;
--- a/packages/biz/es/BigImageModal/index.js
+++ b/packages/biz/es/BigImageModal/index.js
@ -0,0 +1,2 @@
+import BigImageModal from "./BigImageModal";
+export default BigImageModal;
--- a/packages/biz/es/BigImageModal/index.less
+++ b/packages/biz/es/BigImageModal/index.less
@ -0,0 +1,514 @@
+.zhst-image {
+  .zhst-dialog-content {
+    box-shadow: 0 4px 12px rgb(0 0 0 / 20%);
+  }
+
+  .zhst-tabs .zhst-tabs-nav-wrap {
+    background-color: #f6f6f6;
+  }
+
+
+  &-view-container {
+    position: relative;
+    width: 100%;
+    margin-bottom: 16px;
+
+    &__nav {
+      position: absolute;
+      z-index: 99;
+      top: 50%;
+      width: 40px !important;
+      height: 40px !important;
+      background: #d9d9d9;
+      border-radius: 100%;
+      cursor: pointer;
+      transform: translateY(-50%);
+
+      &>button {
+        display: flex;
+        align-items: center;
+        color: #fff !important;
+      }
+
+      &--disabled {
+        opacity: 0.3;
+
+        &>button {
+          color: #fff !important;
+        }
+      }
+    }
+
+    &__nav:hover {
+      background: #09f;
+      color: #fff !important;
+    }
+  }
+
+  &-tool-container {
+    width: 100%;
+    height: 40px;
+    margin-bottom: 16px;
+  }
+
+  &__face-score {
+    position: absolute;
+    right: 90px;
+    bottom: 80px;
+    color: red;
+    font-family: 'Microsoft YaHei';
+    font-size: 19px;
+    font-weight: bold;
+  }
+
+  &-carousel-container {
+    position: relative;
+    width: 100%;
+    height: 100px;
+    margin-top: 16px;
+    margin-bottom: 24px;
+  }
+}
+
+
+.zhst-image__tool {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  font-size: 14px;
+
+  &-split {
+    width: 0;
+    height: 14px;
+
+    &::before {
+      display: block;
+      height: 100%;
+      border-left: 1px solid #e6e7eb;
+      content: '';
+    }
+  }
+
+  &-zoom {
+    display: inline-flex;
+    align-items: center;
+
+    &> :not(:last-child) {
+      margin-right: 14px;
+    }
+
+    &__scale {
+      display: inline-block;
+      width: 38px;
+      height: 14px;
+
+      // margin-left: 15px;
+      box-sizing: content-box;
+      border: 1px solid rgb(77 77 77 / 100%);
+      margin-top: 2px; //对齐
+      background: rgb(255 255 255 / 100%);
+      border-radius: 2px;
+      color: #4d4d4d;
+      cursor: default;
+      font-size: 12px;
+      line-height: 14px;
+      text-align: center;
+    }
+  }
+
+  &-switch {
+    display: flex;
+    width: 30px;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    margin: 0 26px;
+  }
+
+  &-left {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: flex-end;
+
+    &> :not(:last-child) {
+      margin-right: 14px;
+    }
+  }
+
+  &-right {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: flex-start;
+
+    &> :not(:first-child) {
+      margin-left: 20px;
+    }
+  }
+
+  &-icon-container {
+    font-size: 14px;
+
+    &--active {
+      color: #5584ff !important;
+    }
+
+    &> :first-child {
+      margin-right: 2px;
+    }
+  }
+}
+
+.zhst-image__carousel {
+  position: relative;
+  display: flex;
+  width: 742px;
+  height: 100px;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid #f0f0f0;
+  margin: 0 auto;
+  background: #fafafa;
+  border-radius: 2px;
+  user-select: none;
+
+  &-container {
+    width: (58px + 8px) * 10;
+  }
+
+  &-item {
+    display: flex;
+    width: 58px + 8px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &-item-img {
+    /* 尝试消除transform 副作用 */
+    position: relative;
+    z-index: 99;
+
+    // width: 58px;
+    // height: 76px;
+    display: flex;
+    width: 66px;
+    height: 84px;
+    box-sizing: border-box;
+    align-items: center;
+    justify-content: center;
+    background: #fafafa;
+    cursor: pointer;
+
+    /* 尝试消除transform 副作用 end */
+    &--active {
+      border: 2px solid #09f;
+      border-radius: 1px;
+    }
+
+    &>div {
+      /* 尝试消除transform 副作用 */
+      position: relative;
+      z-index: 99;
+      overflow: hidden;
+      width: 58px;
+      height: 76px;
+
+      /* 尝试消除transform 副作用 end */
+      &>img {
+        width: 58px;
+        height: 76px;
+        object-fit: contain;
+        transition: all 0.2s;
+
+        &:hover {
+          transform: scale(1.5);
+        }
+      }
+    }
+  }
+}
+
+.zhst-image__trackmodel {
+  &__panel {
+    position: relative;
+    z-index: 99;
+    top: 0;
+    right: 0;
+    width: 320px;
+    height: 100%;
+    background-color: #fff;
+
+    &--head {
+      width: 100%;
+      height: 40px;
+      padding: 0 16px;
+      border-bottom: 1px solid #f0f0f0;
+      color: #333;
+      font-size: 14px;
+      font-weight: bold;
+      line-height: 40px;
+      text-align: left;
+    }
+
+    &--track {
+      height: calc(100% - 40px);
+    }
+
+    &-date {
+      padding: 10px 6px;
+
+      // position: absolute;
+    }
+  }
+
+  &--bigImage {
+    position: absolute;
+    z-index: 100;
+    top: 0;
+    left: 0;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    justify-content: center;
+    padding-top: 59px;
+    background: rgb(0 0 0 / 40%);
+
+    &--image {
+      width: 946px;
+      height: 532px;
+
+      &>img {
+        width: 946px;
+        height: 532px;
+        object-fit: contain;
+      }
+    }
+
+    &--close {
+      margin-left: 16px;
+      color: #fff;
+    }
+  }
+
+  &__flooter {
+    position: absolute;
+    z-index: 999;
+    bottom: -124px;
+    left: 0;
+    width: calc(100% - 320px - 10px);
+    height: 144px;
+    background: #fff;
+    box-shadow: 0 0 8px 0 rgb(172 172 172 / 50%);
+
+    &--head {
+      display: flex;
+      height: 20px;
+      align-items: center;
+      justify-content: center;
+      background: #f6f6f6;
+      color: #999;
+      line-height: 16px;
+    }
+
+    &--body {
+      display: flex;
+      height: calc(100% - 20px);
+      padding-left: 50px;
+
+      &__title {
+        color: #333;
+        font-size: 12px;
+        font-weight: bold;
+        line-height: 16px;
+      }
+
+      &__text {
+        overflow: hidden;
+        color: #333;
+        font-size: 12px;
+        line-height: 16px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      &--left {
+        display: flex;
+        width: 75px;
+        height: 100;
+        align-items: center;
+
+        &>img {
+          width: 75px;
+          height: 100px;
+          object-fit: contain;
+        }
+      }
+
+      &--middle {
+        display: grid;
+        width: 331px;
+        justify-content: flex-start;
+        padding: 8px 20px;
+        border-right: 1px solid #f0f0f0;
+
+        &>div {
+          display: flex;
+        }
+      }
+
+      &--right {
+        display: grid;
+        width: calc(100% - 331px - 75px);
+        padding: 8px 20px;
+
+        &>div {
+          display: flex;
+        }
+
+        &__button-list {
+          display: flex;
+          align-items: center;
+
+          &>button {
+            margin-right: 20px;
+
+            &>span {
+              color: #09f !important;
+            }
+
+            &:hover {
+              &>span {
+                color: #247fdb !important;
+              }
+            }
+          }
+        }
+      }
+    }
+
+    @keyframes close {
+      from {
+        bottom: 0;
+      }
+
+      to {
+        bottom: -124px;
+      }
+    }
+
+    @keyframes open {
+      from {
+        bottom: -124px;
+      }
+
+      to {
+        bottom: 0;
+      }
+    }
+
+    &--close {
+      bottom: -124px;
+      animation-duration: 1s;
+      animation-name: close;
+    }
+
+    &--open {
+      bottom: 0;
+      animation-duration: 1s;
+      animation-name: open;
+    }
+  }
+}
+
+.zhst-image__attributePanel {
+  margin: 0 66px;
+  background: #f6f6f6;
+  margin-top: 20px;
+  padding-top: 16px;
+  display: flex;
+  justify-content: center;
+
+  &>div:first-child {
+    width: fit-content;
+    display: flex;
+    flex-direction: column;
+  }
+
+  &-title {
+    color: rgb(0 0 0 / 88%);
+    font-weight: bold;
+    padding-bottom: 12px;
+  }
+
+  &-item {
+    display: flex;
+  }
+
+  &-label {
+    color: rgb(0 0 0 / 45%);
+  }
+
+  &-value {
+    color: rgb(0 0 0 / 88%);
+  }
+}
+
+.relatedWrapper {
+  width: 100%;
+  height: 100px;
+  padding: 0 30px;
+  margin-bottom: 30px;
+  box-sizing: border-box;
+
+  .relatedTabs {
+    width: 100%;
+    height: 100px;
+  }
+
+  .relatedContent {
+    width: 100%;
+    height: 100px;
+    display: flex;
+
+    .relatedPics {
+      width: 742px;
+      height: 100px;
+    }
+
+    .disabled {
+      color: rgba(0, 0, 0, 25%);
+    }
+
+    .relatedBtn {
+      flex: 1;
+      font-size: 14px;
+      color: #333;
+      display: flex;
+      align-items: flex-end;
+      cursor: pointer;
+
+      &:hover {
+        color: #09f;
+      }
+    }
+  }
+
+  :global {
+    .ant-tabs-left>.ant-tabs-content-holder>.ant-tabs-content>.ant-tabs-tabpane {
+      padding-left: 16px;
+    }
+
+    .ant-tabs-tab {
+      padding: 8px 12px !important;
+      text-align: right !important;
+    }
+
+    .ant-tabs .ant-tabs-tab {
+      font-size: 14px;
+      font-weight: bold;
+      text-align: right;
+      justify-content: flex-end;
+    }
+  }
+}
--- a/packages/biz/es/BigImageModal/mock.js
+++ b/packages/biz/es/BigImageModal/mock.js
@ -0,0 +1,473 @@
+export var IMAGE_DATA = {
+  "enAbleDeleteFeature": true,
+  "tabsFilter": ["COMPATER", "NORMAL"],
+  "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",
+    "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"],
+    "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",
+    "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": [],
+    "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",
+    "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"],
+    "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": ""
+};
+export var BIG_IMAGE_DATA = [{
+  imageKey: 'http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622934503424.jpg',
+  imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+  flvUrl: 'ws://10.0.0.120:9033/flv/Sip/34020000001310000301.flv?ip=10.0.0.120&stime=1704815972&etime=1704815992',
+  compaterImages: ['http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg', "http://10.0.0.120:30003/file/public/public_20240117/file/dfdd3340-53c8-4dc4-9921-f13230aa0355.jpg"],
+  odRect: {
+    "x": 0.5445312,
+    "y": 0.19166666,
+    "w": 0.08671875,
+    "h": 0.40138888
+  },
+  attachImg: [{
+    "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622695428096.jpg",
+    "label": "形体"
+  }, {
+    "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894588427964418.jpg",
+    "label": "人脸"
+  }],
+  score: '0.6',
+  // 人脸质量分
+  showScore: true,
+  // 人脸质量分
+  cameraPosition: 'string',
+  // 摄像头位置
+  time: '2022-01-01',
+  // 摄像头拍摄时间
+  objects: [{
+    "objectIndex": {
+      "objectId": "1746832189053474816",
+      "solutionId": "0",
+      "deviceId": "0",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "sourceObjectId": "0",
+    "level": 0,
+    "confidence": 0.881164,
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1705312223057",
+      "width": 0,
+      "height": 0,
+      "originWidth": 0,
+      "originHeight": 0,
+      "offsetTime": "0",
+      "skipNumber": "0"
+    },
+    "infoOnSource": {
+      "bboxInFrame": {
+        "bboxRatio": {
+          "x": 0.61418945,
+          "y": 0.34309354,
+          "w": 0.067661405,
+          "h": 0.34659258
+        }
+      },
+      "countInSource": 0,
+      "indexInSource": 0
+    },
+    "qualityScore": 0
+  }]
+}, {
+  imageKey: 'http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581994436608.jpg',
+  imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+  odRect: {
+    "x": 0.553125,
+    "y": 0.29722223,
+    "w": 0.048958335,
+    "h": 0.2462963
+  },
+  attachImg: [{
+    "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581163964416.jpg",
+    "label": "形体"
+  }, {
+    "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795546867140608.jpg",
+    "label": "人脸"
+  }],
+  flvUrl: 'ws://10.0.0.120:9033/flv/HaikangNvr/34.flv?ip=10.0.2.103&stime=1705302394&etime=1705302414',
+  score: 0.815207,
+  // 人脸质量分
+  showScore: true,
+  // 人脸质量分
+  cameraPosition: 'string',
+  // 摄像头位置
+  time: '2022-01-01',
+  // 摄像头拍摄时间
+  objects: [{
+    "objectIndex": {
+      "objectId": "1746816737430472704",
+      "solutionId": "0",
+      "deviceId": "0",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "sourceObjectId": "0",
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1705308539109",
+      "width": 0,
+      "height": 0,
+      "originWidth": 0,
+      "originHeight": 0,
+      "offsetTime": "0",
+      "skipNumber": "0"
+    },
+    "infoOnSource": {
+      "bboxInFrame": {
+        "bboxRatio": {
+          "x": 0.5519352,
+          "y": 0.2965385,
+          "w": 0.05185461,
+          "h": 0.24698898
+        }
+      },
+      "countInSource": 0,
+      "indexInSource": 0
+    },
+    "qualityScore": 0
+  }, {
+    "objectIndex": {
+      "objectId": "1746816737430472705",
+      "solutionId": "0",
+      "deviceId": "0",
+      "fragmentId": "0"
+    },
+    "objectType": "OBJECT_TYPE_PEDESTRAIN",
+    "sourceObjectId": "0",
+    "level": 0,
+    "confidence": 0.9310699,
+    "frameInfo": {
+      "frameId": "0",
+      "frameTimestamp": "1705308539109",
+      "width": 0,
+      "height": 0,
+      "originWidth": 0,
+      "originHeight": 0,
+      "offsetTime": "0",
+      "skipNumber": "0"
+    },
+    "infoOnSource": {
+      "bboxInFrame": {
+        "bboxRatio": {
+          "x": 0.58543766,
+          "y": 0.3203356,
+          "w": 0.052037954,
+          "h": 0.2664015
+        }
+      },
+      "countInSource": 0,
+      "indexInSource": 0
+    },
+    "qualityScore": 0
+  }]
+}];
+export var attributeList = [{
+  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: '否'
+  }]
+}, {
+  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: '否'
+  }]
+}];
--- a/packages/biz/es/Demo/index.js
+++ b/packages/biz/es/Demo/index.js
@ -0,0 +1,14 @@
+import React from 'react';
+import { Button } from '@zhst/meta';
+import { useThrottleFn } from '@zhst/hooks';
+export default (function () {
+  var _useThrottleFn = useThrottleFn(function () {
+      return console.log('123');
+    }),
+    run = _useThrottleFn.run;
+  return /*#__PURE__*/React.createElement(Button, {
+    onClick: function onClick() {
+      return run();
+    }
+  }, "\u6D4B\u8BD5");
+});
--- a/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
+++ b/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
@ -0,0 +1,45 @@
+import { Dayjs as Moment } from 'dayjs';
+export declare const getDefaultRadius: () => number;
+export declare const setDefaultRadius: (radius: number) => void;
+export declare const setSearchIntervalDuration: (duration: number) => void;
+export declare const getSearchIntervalDuration: (time: number) => number;
+export declare const operateTrackById: (smartTrackId: number, operationType: OperationType) => Promise<void>;
+export declare const deleteTrackById: (smartTrackId: number) => Promise<void>;
+export declare const modifyTrackImgs: (smartTrackId: number, images: Array<Object>) => Promise<void>;
+export declare const modifyTrackConf: (conf: any, smartTrackId: number) => Promise<void>;
+export declare const getTrackTaskById: (smartTrackId?: number) => Promise<any>;
+export declare const getTackDetailInfo: (smartTrackId?: number) => Promise<any>;
+export declare const getTaskCameraByCenterAndPower: (value: {
+    taskPower: {
+        facePower: number;
+        bodyPower: number;
+    };
+    cameraInfos: Array<Object>;
+    center: [number, number];
+}) => Promise<Object[]>;
+/**创建追踪任务 */
+export declare const createIntelligentTrack: (value: {
+    images: Array<Object>;
+    deviceIds: Array<string>;
+    circleCenter: [number, number];
+    model: number;
+    circleRadius: number;
+    facePower?: number;
+    bodyPower?: number;
+    historyTime?: [Moment, Moment];
+    topping?: boolean;
+}) => Promise<any>;
+export declare const emitHeartbeat: (smartTrackId: number) => Promise<void>;
+export declare const ModifyTrackCameras: (value: {
+    smartTrackId: number;
+    deviceIds: Array<number>;
+    centerPoint: [number, number];
+}) => Promise<void>;
+export declare const setIntelligentTrackCircleInfo: (smartTrackId: number, circleCenter: [number, number]) => Promise<void>;
+export declare const getTackCameraInfo: (value: {
+    circleCenter: [Moment, Moment];
+    radius: number;
+    zoom: number;
+}) => Promise<any>;
+export declare const getCameraInfoByCircle: (circleCenter: any, radius: any, zoom?: number) => Promise<any>;
+export declare const taskInfoToSearchItem: (taskInfo: any) => any[];
--- a/packages/biz/es/hooks/useIntelligentTracking/index.js
+++ b/packages/biz/es/hooks/useIntelligentTracking/index.js
--- a/packages/biz/es/index.d.ts
+++ b/packages/biz/es/index.d.ts
@ -0,0 +1,8 @@
+export { default as BigImageModal } from './BigImageModal';
+export { default as BoxSelectTree } from './boxSelectTree';
+export { default as Tree } from './tree';
+export type { TreeData } from './tree';
+export { default as TreeTransfer } from './treeTransfer';
+export { default as TreeTransferModal } from './treeTransferModal';
+export { default as WarningRecordCard } from './WarningRecordCard';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
--- a/packages/biz/es/index.js
+++ b/packages/biz/es/index.js
@ -0,0 +1,6 @@
+export { default as BigImageModal } from "./BigImageModal";
+export { default as BoxSelectTree } from "./boxSelectTree";
+export { default as Tree } from "./tree";
+export { default as TreeTransfer } from "./treeTransfer";
+export { default as TreeTransferModal } from "./treeTransferModal";
+export { default as WarningRecordCard } from "./WarningRecordCard";
--- a/packages/biz/es/useSocket/index.js
+++ b/packages/biz/es/useSocket/index.js
@ -0,0 +1,95 @@
+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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { useMemo } from 'react';
+import { throttle as loadshThrottle, noop } from '@zhst/func';
+import { useDeepEffect, useLatest } from '@zhst/hooks';
+import ws from "./ws";
+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$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.d.ts
+++ b/packages/biz/es/useSocket/onceChannel.d.ts
@ -0,0 +1,2 @@
+declare const startChannel: (topic: any, req: any, callback: any) => () => void;
+export default startChannel;
--- 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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+//@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,244 @@
+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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+// @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';
+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.d.ts
+++ b/packages/biz/es/utils/constants.d.ts
@ -0,0 +1,31 @@
+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;
+};
+export declare const BOX_TYPE_LIST: {
+    value: string;
+    label: string;
+}[];
+export declare const ALL_LIST: {
+    value: string;
+    label: string;
+}[];
--- a/packages/biz/es/utils/constants.js
+++ b/packages/biz/es/utils/constants.js
@ -0,0 +1,43 @@
+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 // 只有普通摄像头，没有人脸、没有盒子、直连
+};
+
+// 盒子 Tab 切换
+export var BOX_TYPE_LIST = [{
+  value: '1',
+  label: '盒子'
+}, {
+  value: '2',
+  label: '盒子组'
+}];
+export var ALL_LIST = [{
+  value: '',
+  label: '全部'
+}];
--- a/packages/biz/es/utils/index.d.ts
+++ b/packages/biz/es/utils/index.d.ts
--- a/packages/biz/src/boxSelectTree/components/boxPanel/constants.ts
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/constants.ts
--- a/packages/biz/lib/BigImageModal/BigImageModal.js
+++ b/packages/biz/lib/BigImageModal/BigImageModal.js
@ -0,0 +1,250 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/BigImageModal/BigImageModal.tsx
+var BigImageModal_exports = {};
+__export(BigImageModal_exports, {
+  componentPrefix: () => componentPrefix,
+  default: () => BigImageModal_default
+});
+module.exports = __toCommonJS(BigImageModal_exports);
+var import_react = __toESM(require("react"));
+var import_meta = require("@zhst/meta");
+var import_classnames = __toESM(require("classnames"));
+var import_func = require("@zhst/func");
+var import_index = require("./index.less");
+var import_navigation = __toESM(require("./components/navigation"));
+var import_CombineImage = __toESM(require("./components/CombineImage"));
+var DescriptionsItem = import_meta.Descriptions.Item;
+var componentPrefix = "zhst-image";
+var initialStyle = {
+  fontSize: "12px"
+};
+var BigImageModal = (0, import_react.forwardRef)((props, ref) => {
+  var _a;
+  const {
+    // 配置
+    title = "-",
+    open,
+    children,
+    activeTab,
+    attributeList = [],
+    isRelated = false,
+    tabs = {},
+    footer = null,
+    showCarousel = true,
+    // 数据
+    dataSource = [],
+    // 总数据源，只允许有一份
+    imageData = [],
+    relatedData = [],
+    // 事件
+    onIndexChange,
+    onTabChange,
+    transformPropFunc
+  } = props;
+  const combineImageRef = (0, import_react.useRef)(null);
+  const bigImagePreviewRef = (0, import_react.useRef)(null);
+  const videoPlayerRef = (0, import_react.useRef)(null);
+  const modalRef = (0, import_react.useRef)(null);
+  const [tab, setTab] = (0, import_react.useState)(activeTab || (0, import_func.get)(tabsConfig, "data[0].key"));
+  const [activeKey, setActiveKey] = (0, import_react.useState)("related");
+  const [currentIndex, setCurrentIndex] = (0, import_react.useState)(0);
+  const tabsConfig = !(0, import_func.isEmpty)(tabs) ? tabs : {
+    data: [
+      {
+        label: "对比图模式",
+        key: "COMPATER",
+        children: /* @__PURE__ */ import_react.default.createElement(
+          import_CombineImage.default,
+          {
+            ref: combineImageRef,
+            data: dataSource[currentIndex] || {}
+          }
+        )
+      },
+      {
+        label: "场景图模式",
+        key: "NORMAL",
+        children: /* @__PURE__ */ import_react.default.createElement(
+          import_meta.BigImagePreview,
+          {
+            ref: bigImagePreviewRef,
+            height: "500px",
+            data: dataSource[currentIndex]
+          }
+        )
+      }
+    ]
+  };
+  (0, import_react.useEffect)(() => {
+    (async () => {
+      let data = {};
+    })();
+  }, [currentIndex, dataSource, imageData, isRelated]);
+  (0, import_react.useImperativeHandle)(ref, () => ({
+    ref,
+    tab,
+    setTab,
+    modalRef,
+    activeKey,
+    setActiveKey,
+    videoPlayerRef,
+    combineImageRef,
+    bigImagePreviewRef
+  }));
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_meta.Modal,
+    {
+      destroyOnClose: true,
+      open,
+      ref: modalRef,
+      footer,
+      className: componentPrefix,
+      title,
+      ...props
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        style: {
+          marginTop: "16px"
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_meta.ConfigProvider,
+        {
+          theme: {
+            token: {
+              colorTextSecondary: "rgba(0,0,0,0.45)"
+            },
+            components: {
+              Descriptions: {
+                titleMarginBottom: "20px",
+                viewBg: "#f6f6f6",
+                titleColor: "rgba(0,0,0,0.45)",
+                colorTextLabel: "rgba(0,0,0,0.45)",
+                contentColor: "rgba(0,0,0,0.88)"
+              }
+            }
+          }
+        },
+        attributeList.map((descriptions) => {
+          var _a2;
+          return /* @__PURE__ */ import_react.default.createElement(
+            import_meta.Descriptions,
+            {
+              key: descriptions.title,
+              title: /* @__PURE__ */ import_react.default.createElement("p", { style: { margin: "12px 0 0", fontSize: initialStyle.fontSize } }, descriptions.title),
+              column: 8,
+              style: { padding: "0 64px" }
+            },
+            (_a2 = descriptions == null ? void 0 : descriptions.children) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ import_react.default.createElement(
+              DescriptionsItem,
+              {
+                key: item.key,
+                label: item.label,
+                span: 1,
+                contentStyle: { fontSize: initialStyle.fontSize },
+                labelStyle: { fontSize: initialStyle.fontSize }
+              },
+              item.children
+            ))
+          );
+        })
+      ),
+      /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          className: (0, import_classnames.default)(`${componentPrefix}-view-container`)
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_meta.Tabs,
+          {
+            activeKey: tab,
+            centered: true,
+            destroyInactiveTabPane: true,
+            onChange: (v) => {
+              setTab((pre) => {
+                onTabChange == null ? void 0 : onTabChange(v, pre);
+                return v;
+              });
+            },
+            tabBarStyle: { fontSize: "18px", fontWeight: "bold" },
+            items: tabsConfig.data,
+            ...tabsConfig
+          }
+        ),
+        tab === "VIDEO" && /* @__PURE__ */ import_react.default.createElement(import_meta.VideoPlayer, { ref: videoPlayerRef, url: (_a = dataSource[currentIndex]) == null ? void 0 : _a.flvUrl }),
+        /* @__PURE__ */ import_react.default.createElement(
+          import_navigation.default,
+          {
+            className: (0, import_classnames.default)(
+              `${componentPrefix}-view-container__nav`,
+              currentIndex <= 0 && `${componentPrefix}-view-container__nav--disabled`,
+              `${componentPrefix}-view-container__nav--left`
+            ),
+            show: isRelated ? imageData.length > 1 : dataSource.length > 1,
+            disabled: currentIndex <= 0,
+            prev: true,
+            onClick: () => {
+              setCurrentIndex((pre) => {
+                onIndexChange == null ? void 0 : onIndexChange(pre - 1, pre);
+                return pre - 1;
+              });
+            }
+          }
+        ),
+        /* @__PURE__ */ import_react.default.createElement(
+          import_navigation.default,
+          {
+            className: (0, import_classnames.default)(
+              `${componentPrefix}-view-container__nav`,
+              (currentIndex >= imageData.length - 1 || currentIndex >= dataSource.length - 1) && `${componentPrefix}-view-container__nav--disabled`,
+              `${componentPrefix}-view-container__nav--right`
+            ),
+            show: isRelated ? imageData.length > 1 : dataSource.length > 1,
+            disabled: currentIndex >= imageData.length - 1 || currentIndex >= dataSource.length - 1,
+            next: true,
+            onClick: async (e) => {
+              setCurrentIndex((pre) => {
+                onIndexChange == null ? void 0 : onIndexChange(pre + 1, pre);
+                return pre + 1;
+              });
+            }
+          }
+        )
+      )
+    )
+  );
+});
+var BigImageModal_default = BigImageModal;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  componentPrefix
+});
--- a/packages/biz/lib/BigImageModal/components/navigation/index.js
+++ b/packages/biz/lib/BigImageModal/components/navigation/index.js
@ -0,0 +1,57 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/BigImageModal/components/navigation/index.tsx
+var navigation_exports = {};
+__export(navigation_exports, {
+  default: () => navigation_default
+});
+module.exports = __toCommonJS(navigation_exports);
+var React = __toESM(require("react"));
+var import_classnames = __toESM(require("classnames"));
+var import_meta = require("@zhst/meta");
+var import_index = require("./index.less");
+var componentName = `zhst-image__nav`;
+var Navigation = (props) => {
+  const { show, prev, next, disabled, onClick, className, color } = props;
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)(
+        `${componentName}`,
+        prev && `${componentName}-prev`,
+        next && `${componentName}-next`,
+        disabled && `${componentName}--disable`,
+        !show && `${componentName}--hide`,
+        className
+      )
+    },
+    /* @__PURE__ */ React.createElement(import_meta.Button, { type: "text", disabled, onClick }, /* @__PURE__ */ React.createElement(import_meta.Icon, { size: 28, color, icon: prev ? "icon-qiehuanzuo" : "icon-qiehuanyou" }))
+  );
+};
+var navigation_default = Navigation;
--- a/packages/biz/lib/BigImageModal/components/navigation/index.less
+++ b/packages/biz/lib/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/lib/BigImageModal/images/emptyImage.png
+++ b/packages/biz/lib/BigImageModal/images/emptyImage.png
--- a/packages/biz/lib/BigImageModal/images/percent_background.png
+++ b/packages/biz/lib/BigImageModal/images/percent_background.png
--- a/packages/biz/lib/BigImageModal/index.d.ts
+++ b/packages/biz/lib/BigImageModal/index.d.ts
@ -0,0 +1,3 @@
+import BigImageModal from "./BigImageModal";
+export type { BigImageModalProps } from './BigImageModal';
+export default BigImageModal;
--- a/packages/biz/lib/BigImageModal/index.js
+++ b/packages/biz/lib/BigImageModal/index.js
@ -0,0 +1,36 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/BigImageModal/index.tsx
+var BigImageModal_exports = {};
+__export(BigImageModal_exports, {
+  default: () => BigImageModal_default
+});
+module.exports = __toCommonJS(BigImageModal_exports);
+var import_BigImageModal = __toESM(require("./BigImageModal"));
+var BigImageModal_default = import_BigImageModal.default;
--- a/packages/biz/lib/BigImageModal/index.less
+++ b/packages/biz/lib/BigImageModal/index.less
@ -0,0 +1,514 @@
+.zhst-image {
+  .zhst-dialog-content {
+    box-shadow: 0 4px 12px rgb(0 0 0 / 20%);
+  }
+
+  .zhst-tabs .zhst-tabs-nav-wrap {
+    background-color: #f6f6f6;
+  }
+
+
+  &-view-container {
+    position: relative;
+    width: 100%;
+    margin-bottom: 16px;
+
+    &__nav {
+      position: absolute;
+      z-index: 99;
+      top: 50%;
+      width: 40px !important;
+      height: 40px !important;
+      background: #d9d9d9;
+      border-radius: 100%;
+      cursor: pointer;
+      transform: translateY(-50%);
+
+      &>button {
+        display: flex;
+        align-items: center;
+        color: #fff !important;
+      }
+
+      &--disabled {
+        opacity: 0.3;
+
+        &>button {
+          color: #fff !important;
+        }
+      }
+    }
+
+    &__nav:hover {
+      background: #09f;
+      color: #fff !important;
+    }
+  }
+
+  &-tool-container {
+    width: 100%;
+    height: 40px;
+    margin-bottom: 16px;
+  }
+
+  &__face-score {
+    position: absolute;
+    right: 90px;
+    bottom: 80px;
+    color: red;
+    font-family: 'Microsoft YaHei';
+    font-size: 19px;
+    font-weight: bold;
+  }
+
+  &-carousel-container {
+    position: relative;
+    width: 100%;
+    height: 100px;
+    margin-top: 16px;
+    margin-bottom: 24px;
+  }
+}
+
+
+.zhst-image__tool {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  font-size: 14px;
+
+  &-split {
+    width: 0;
+    height: 14px;
+
+    &::before {
+      display: block;
+      height: 100%;
+      border-left: 1px solid #e6e7eb;
+      content: '';
+    }
+  }
+
+  &-zoom {
+    display: inline-flex;
+    align-items: center;
+
+    &> :not(:last-child) {
+      margin-right: 14px;
+    }
+
+    &__scale {
+      display: inline-block;
+      width: 38px;
+      height: 14px;
+
+      // margin-left: 15px;
+      box-sizing: content-box;
+      border: 1px solid rgb(77 77 77 / 100%);
+      margin-top: 2px; //对齐
+      background: rgb(255 255 255 / 100%);
+      border-radius: 2px;
+      color: #4d4d4d;
+      cursor: default;
+      font-size: 12px;
+      line-height: 14px;
+      text-align: center;
+    }
+  }
+
+  &-switch {
+    display: flex;
+    width: 30px;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+    margin: 0 26px;
+  }
+
+  &-left {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: flex-end;
+
+    &> :not(:last-child) {
+      margin-right: 14px;
+    }
+  }
+
+  &-right {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: flex-start;
+
+    &> :not(:first-child) {
+      margin-left: 20px;
+    }
+  }
+
+  &-icon-container {
+    font-size: 14px;
+
+    &--active {
+      color: #5584ff !important;
+    }
+
+    &> :first-child {
+      margin-right: 2px;
+    }
+  }
+}
+
+.zhst-image__carousel {
+  position: relative;
+  display: flex;
+  width: 742px;
+  height: 100px;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid #f0f0f0;
+  margin: 0 auto;
+  background: #fafafa;
+  border-radius: 2px;
+  user-select: none;
+
+  &-container {
+    width: (58px + 8px) * 10;
+  }
+
+  &-item {
+    display: flex;
+    width: 58px + 8px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &-item-img {
+    /* 尝试消除transform 副作用 */
+    position: relative;
+    z-index: 99;
+
+    // width: 58px;
+    // height: 76px;
+    display: flex;
+    width: 66px;
+    height: 84px;
+    box-sizing: border-box;
+    align-items: center;
+    justify-content: center;
+    background: #fafafa;
+    cursor: pointer;
+
+    /* 尝试消除transform 副作用 end */
+    &--active {
+      border: 2px solid #09f;
+      border-radius: 1px;
+    }
+
+    &>div {
+      /* 尝试消除transform 副作用 */
+      position: relative;
+      z-index: 99;
+      overflow: hidden;
+      width: 58px;
+      height: 76px;
+
+      /* 尝试消除transform 副作用 end */
+      &>img {
+        width: 58px;
+        height: 76px;
+        object-fit: contain;
+        transition: all 0.2s;
+
+        &:hover {
+          transform: scale(1.5);
+        }
+      }
+    }
+  }
+}
+
+.zhst-image__trackmodel {
+  &__panel {
+    position: relative;
+    z-index: 99;
+    top: 0;
+    right: 0;
+    width: 320px;
+    height: 100%;
+    background-color: #fff;
+
+    &--head {
+      width: 100%;
+      height: 40px;
+      padding: 0 16px;
+      border-bottom: 1px solid #f0f0f0;
+      color: #333;
+      font-size: 14px;
+      font-weight: bold;
+      line-height: 40px;
+      text-align: left;
+    }
+
+    &--track {
+      height: calc(100% - 40px);
+    }
+
+    &-date {
+      padding: 10px 6px;
+
+      // position: absolute;
+    }
+  }
+
+  &--bigImage {
+    position: absolute;
+    z-index: 100;
+    top: 0;
+    left: 0;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    justify-content: center;
+    padding-top: 59px;
+    background: rgb(0 0 0 / 40%);
+
+    &--image {
+      width: 946px;
+      height: 532px;
+
+      &>img {
+        width: 946px;
+        height: 532px;
+        object-fit: contain;
+      }
+    }
+
+    &--close {
+      margin-left: 16px;
+      color: #fff;
+    }
+  }
+
+  &__flooter {
+    position: absolute;
+    z-index: 999;
+    bottom: -124px;
+    left: 0;
+    width: calc(100% - 320px - 10px);
+    height: 144px;
+    background: #fff;
+    box-shadow: 0 0 8px 0 rgb(172 172 172 / 50%);
+
+    &--head {
+      display: flex;
+      height: 20px;
+      align-items: center;
+      justify-content: center;
+      background: #f6f6f6;
+      color: #999;
+      line-height: 16px;
+    }
+
+    &--body {
+      display: flex;
+      height: calc(100% - 20px);
+      padding-left: 50px;
+
+      &__title {
+        color: #333;
+        font-size: 12px;
+        font-weight: bold;
+        line-height: 16px;
+      }
+
+      &__text {
+        overflow: hidden;
+        color: #333;
+        font-size: 12px;
+        line-height: 16px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      &--left {
+        display: flex;
+        width: 75px;
+        height: 100;
+        align-items: center;
+
+        &>img {
+          width: 75px;
+          height: 100px;
+          object-fit: contain;
+        }
+      }
+
+      &--middle {
+        display: grid;
+        width: 331px;
+        justify-content: flex-start;
+        padding: 8px 20px;
+        border-right: 1px solid #f0f0f0;
+
+        &>div {
+          display: flex;
+        }
+      }
+
+      &--right {
+        display: grid;
+        width: calc(100% - 331px - 75px);
+        padding: 8px 20px;
+
+        &>div {
+          display: flex;
+        }
+
+        &__button-list {
+          display: flex;
+          align-items: center;
+
+          &>button {
+            margin-right: 20px;
+
+            &>span {
+              color: #09f !important;
+            }
+
+            &:hover {
+              &>span {
+                color: #247fdb !important;
+              }
+            }
+          }
+        }
+      }
+    }
+
+    @keyframes close {
+      from {
+        bottom: 0;
+      }
+
+      to {
+        bottom: -124px;
+      }
+    }
+
+    @keyframes open {
+      from {
+        bottom: -124px;
+      }
+
+      to {
+        bottom: 0;
+      }
+    }
+
+    &--close {
+      bottom: -124px;
+      animation-duration: 1s;
+      animation-name: close;
+    }
+
+    &--open {
+      bottom: 0;
+      animation-duration: 1s;
+      animation-name: open;
+    }
+  }
+}
+
+.zhst-image__attributePanel {
+  margin: 0 66px;
+  background: #f6f6f6;
+  margin-top: 20px;
+  padding-top: 16px;
+  display: flex;
+  justify-content: center;
+
+  &>div:first-child {
+    width: fit-content;
+    display: flex;
+    flex-direction: column;
+  }
+
+  &-title {
+    color: rgb(0 0 0 / 88%);
+    font-weight: bold;
+    padding-bottom: 12px;
+  }
+
+  &-item {
+    display: flex;
+  }
+
+  &-label {
+    color: rgb(0 0 0 / 45%);
+  }
+
+  &-value {
+    color: rgb(0 0 0 / 88%);
+  }
+}
+
+.relatedWrapper {
+  width: 100%;
+  height: 100px;
+  padding: 0 30px;
+  margin-bottom: 30px;
+  box-sizing: border-box;
+
+  .relatedTabs {
+    width: 100%;
+    height: 100px;
+  }
+
+  .relatedContent {
+    width: 100%;
+    height: 100px;
+    display: flex;
+
+    .relatedPics {
+      width: 742px;
+      height: 100px;
+    }
+
+    .disabled {
+      color: rgba(0, 0, 0, 25%);
+    }
+
+    .relatedBtn {
+      flex: 1;
+      font-size: 14px;
+      color: #333;
+      display: flex;
+      align-items: flex-end;
+      cursor: pointer;
+
+      &:hover {
+        color: #09f;
+      }
+    }
+  }
+
+  :global {
+    .ant-tabs-left>.ant-tabs-content-holder>.ant-tabs-content>.ant-tabs-tabpane {
+      padding-left: 16px;
+    }
+
+    .ant-tabs-tab {
+      padding: 8px 12px !important;
+      text-align: right !important;
+    }
+
+    .ant-tabs .ant-tabs-tab {
+      font-size: 14px;
+      font-weight: bold;
+      text-align: right;
+      justify-content: flex-end;
+    }
+  }
+}
--- a/packages/biz/lib/BigImageModal/mock.js
+++ b/packages/biz/lib/BigImageModal/mock.js
@ -0,0 +1,567 @@
+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/BigImageModal/mock.ts
+var mock_exports = {};
+__export(mock_exports, {
+  BIG_IMAGE_DATA: () => BIG_IMAGE_DATA,
+  IMAGE_DATA: () => IMAGE_DATA,
+  attributeList: () => attributeList
+});
+module.exports = __toCommonJS(mock_exports);
+var IMAGE_DATA = {
+  "enAbleDeleteFeature": true,
+  "tabsFilter": [
+    "COMPATER",
+    "NORMAL"
+  ],
+  "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",
+      "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"
+      ],
+      "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",
+      "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": [],
+      "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",
+      "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"
+      ],
+      "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": ""
+};
+var BIG_IMAGE_DATA = [
+  {
+    imageKey: "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622934503424.jpg",
+    imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+    flvUrl: "ws://10.0.0.120:9033/flv/Sip/34020000001310000301.flv?ip=10.0.0.120&stime=1704815972&etime=1704815992",
+    compaterImages: [
+      "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+      "http://10.0.0.120:30003/file/public/public_20240117/file/dfdd3340-53c8-4dc4-9921-f13230aa0355.jpg"
+    ],
+    odRect: {
+      "x": 0.5445312,
+      "y": 0.19166666,
+      "w": 0.08671875,
+      "h": 0.40138888
+    },
+    attachImg: [
+      {
+        "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622695428096.jpg",
+        "label": "形体"
+      },
+      {
+        "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894588427964418.jpg",
+        "label": "人脸"
+      }
+    ],
+    score: "0.6",
+    // 人脸质量分
+    showScore: true,
+    // 人脸质量分
+    cameraPosition: "string",
+    // 摄像头位置
+    time: "2022-01-01",
+    // 摄像头拍摄时间
+    objects: [
+      {
+        "objectIndex": {
+          "objectId": "1746832189053474816",
+          "solutionId": "0",
+          "deviceId": "0",
+          "fragmentId": "0"
+        },
+        "objectType": "OBJECT_TYPE_PEDESTRAIN",
+        "sourceObjectId": "0",
+        "level": 0,
+        "confidence": 0.881164,
+        "frameInfo": {
+          "frameId": "0",
+          "frameTimestamp": "1705312223057",
+          "width": 0,
+          "height": 0,
+          "originWidth": 0,
+          "originHeight": 0,
+          "offsetTime": "0",
+          "skipNumber": "0"
+        },
+        "infoOnSource": {
+          "bboxInFrame": {
+            "bboxRatio": {
+              "x": 0.61418945,
+              "y": 0.34309354,
+              "w": 0.067661405,
+              "h": 0.34659258
+            }
+          },
+          "countInSource": 0,
+          "indexInSource": 0
+        },
+        "qualityScore": 0
+      }
+    ]
+  },
+  {
+    imageKey: "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581994436608.jpg",
+    imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+    odRect: {
+      "x": 0.553125,
+      "y": 0.29722223,
+      "w": 0.048958335,
+      "h": 0.2462963
+    },
+    attachImg: [
+      {
+        "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581163964416.jpg",
+        "label": "形体"
+      },
+      {
+        "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795546867140608.jpg",
+        "label": "人脸"
+      }
+    ],
+    flvUrl: "ws://10.0.0.120:9033/flv/HaikangNvr/34.flv?ip=10.0.2.103&stime=1705302394&etime=1705302414",
+    score: 0.815207,
+    // 人脸质量分
+    showScore: true,
+    // 人脸质量分
+    cameraPosition: "string",
+    // 摄像头位置
+    time: "2022-01-01",
+    // 摄像头拍摄时间
+    objects: [
+      {
+        "objectIndex": {
+          "objectId": "1746816737430472704",
+          "solutionId": "0",
+          "deviceId": "0",
+          "fragmentId": "0"
+        },
+        "objectType": "OBJECT_TYPE_PEDESTRAIN",
+        "sourceObjectId": "0",
+        "frameInfo": {
+          "frameId": "0",
+          "frameTimestamp": "1705308539109",
+          "width": 0,
+          "height": 0,
+          "originWidth": 0,
+          "originHeight": 0,
+          "offsetTime": "0",
+          "skipNumber": "0"
+        },
+        "infoOnSource": {
+          "bboxInFrame": {
+            "bboxRatio": {
+              "x": 0.5519352,
+              "y": 0.2965385,
+              "w": 0.05185461,
+              "h": 0.24698898
+            }
+          },
+          "countInSource": 0,
+          "indexInSource": 0
+        },
+        "qualityScore": 0
+      },
+      {
+        "objectIndex": {
+          "objectId": "1746816737430472705",
+          "solutionId": "0",
+          "deviceId": "0",
+          "fragmentId": "0"
+        },
+        "objectType": "OBJECT_TYPE_PEDESTRAIN",
+        "sourceObjectId": "0",
+        "level": 0,
+        "confidence": 0.9310699,
+        "frameInfo": {
+          "frameId": "0",
+          "frameTimestamp": "1705308539109",
+          "width": 0,
+          "height": 0,
+          "originWidth": 0,
+          "originHeight": 0,
+          "offsetTime": "0",
+          "skipNumber": "0"
+        },
+        "infoOnSource": {
+          "bboxInFrame": {
+            "bboxRatio": {
+              "x": 0.58543766,
+              "y": 0.3203356,
+              "w": 0.052037954,
+              "h": 0.2664015
+            }
+          },
+          "countInSource": 0,
+          "indexInSource": 0
+        },
+        "qualityScore": 0
+      }
+    ]
+  }
+];
+var attributeList = [
+  {
+    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: "否"
+      }
+    ]
+  },
+  {
+    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: "否"
+      }
+    ]
+  }
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BIG_IMAGE_DATA,
+  IMAGE_DATA,
+  attributeList
+});
--- a/packages/biz/lib/Demo/index.js
+++ b/packages/biz/lib/Demo/index.js
@ -0,0 +1,41 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Demo/index.tsx
+var Demo_exports = {};
+__export(Demo_exports, {
+  default: () => Demo_default
+});
+module.exports = __toCommonJS(Demo_exports);
+var import_react = __toESM(require("react"));
+var import_meta = require("@zhst/meta");
+var import_hooks = require("@zhst/hooks");
+var Demo_default = () => {
+  const { run } = (0, import_hooks.useThrottleFn)(() => console.log("123"));
+  return /* @__PURE__ */ import_react.default.createElement(import_meta.Button, { onClick: () => run() }, "测试");
+};
--- a/packages/biz/lib/hooks/useIntelligentTracking/index.d.ts
+++ b/packages/biz/lib/hooks/useIntelligentTracking/index.d.ts
@ -0,0 +1,45 @@
+import { Dayjs as Moment } from 'dayjs';
+export declare const getDefaultRadius: () => number;
+export declare const setDefaultRadius: (radius: number) => void;
+export declare const setSearchIntervalDuration: (duration: number) => void;
+export declare const getSearchIntervalDuration: (time: number) => number;
+export declare const operateTrackById: (smartTrackId: number, operationType: OperationType) => Promise<void>;
+export declare const deleteTrackById: (smartTrackId: number) => Promise<void>;
+export declare const modifyTrackImgs: (smartTrackId: number, images: Array<Object>) => Promise<void>;
+export declare const modifyTrackConf: (conf: any, smartTrackId: number) => Promise<void>;
+export declare const getTrackTaskById: (smartTrackId?: number) => Promise<any>;
+export declare const getTackDetailInfo: (smartTrackId?: number) => Promise<any>;
+export declare const getTaskCameraByCenterAndPower: (value: {
+    taskPower: {
+        facePower: number;
+        bodyPower: number;
+    };
+    cameraInfos: Array<Object>;
+    center: [number, number];
+}) => Promise<Object[]>;
+/**创建追踪任务 */
+export declare const createIntelligentTrack: (value: {
+    images: Array<Object>;
+    deviceIds: Array<string>;
+    circleCenter: [number, number];
+    model: number;
+    circleRadius: number;
+    facePower?: number;
+    bodyPower?: number;
+    historyTime?: [Moment, Moment];
+    topping?: boolean;
+}) => Promise<any>;
+export declare const emitHeartbeat: (smartTrackId: number) => Promise<void>;
+export declare const ModifyTrackCameras: (value: {
+    smartTrackId: number;
+    deviceIds: Array<number>;
+    centerPoint: [number, number];
+}) => Promise<void>;
+export declare const setIntelligentTrackCircleInfo: (smartTrackId: number, circleCenter: [number, number]) => Promise<void>;
+export declare const getTackCameraInfo: (value: {
+    circleCenter: [Moment, Moment];
+    radius: number;
+    zoom: number;
+}) => Promise<any>;
+export declare const getCameraInfoByCircle: (circleCenter: any, radius: any, zoom?: number) => Promise<any>;
+export declare const taskInfoToSearchItem: (taskInfo: any) => any[];
--- a/packages/biz/lib/hooks/useIntelligentTracking/index.js
+++ b/packages/biz/lib/hooks/useIntelligentTracking/index.js
@ -0,0 +1,371 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/hooks/useIntelligentTracking/index.tsx
+var useIntelligentTracking_exports = {};
+__export(useIntelligentTracking_exports, {
+  ModifyTrackCameras: () => ModifyTrackCameras,
+  createIntelligentTrack: () => createIntelligentTrack,
+  deleteTrackById: () => deleteTrackById,
+  emitHeartbeat: () => emitHeartbeat,
+  getCameraInfoByCircle: () => getCameraInfoByCircle,
+  getDefaultRadius: () => getDefaultRadius,
+  getSearchIntervalDuration: () => getSearchIntervalDuration,
+  getTackCameraInfo: () => getTackCameraInfo,
+  getTackDetailInfo: () => getTackDetailInfo,
+  getTaskCameraByCenterAndPower: () => getTaskCameraByCenterAndPower,
+  getTrackTaskById: () => getTrackTaskById,
+  modifyTrackConf: () => modifyTrackConf,
+  modifyTrackImgs: () => modifyTrackImgs,
+  operateTrackById: () => operateTrackById,
+  setDefaultRadius: () => setDefaultRadius,
+  setIntelligentTrackCircleInfo: () => setIntelligentTrackCircleInfo,
+  setSearchIntervalDuration: () => setSearchIntervalDuration,
+  taskInfoToSearchItem: () => taskInfoToSearchItem
+});
+module.exports = __toCommonJS(useIntelligentTracking_exports);
+var turf = __toESM(require("@turf/turf"));
+var import_useTaskState = require("../useTaskState");
+var import_Tree = __toESM(require("@common/components/CameraTree/Tree"));
+var import_request = __toESM(require("../../utils/request"));
+var import_meta = require("@zhst/meta");
+var import_utils = require("@common/components/CameraTree/utils");
+var import_func = require("@zhst/func");
+var defaultFaceThreshold = 0.68;
+var defaultBodyThreshold = 0.7;
+var defaultFaceResultNum = 5;
+var defaultRadius = 0.15;
+var defaultQueryCycle = 10;
+var getDefaultRadius = () => {
+  return defaultRadius;
+};
+var setDefaultRadius = (radius) => {
+  defaultRadius = radius;
+};
+var searchIntervalDuration = 10;
+var setSearchIntervalDuration = (duration) => {
+  searchIntervalDuration = duration;
+};
+var getSearchIntervalDuration = (time) => {
+  return time;
+};
+var operateTrackById = async (smartTrackId, operationType) => {
+  try {
+    const data = {
+      operationType,
+      smartTrackId
+    };
+    await (0, import_request.default)({
+      method: "PUT",
+      url: "/singer.SmartTrackService/OperationSmartTrack",
+      data
+    });
+    import_meta.message.success("操作成功");
+  } catch (err) {
+    console.error(err);
+    import_meta.message.success("操作失败");
+  }
+};
+var deleteTrackById = async (smartTrackId) => {
+  try {
+    await (0, import_request.default)({
+      method: "DELETE",
+      url: "/singer.SmartTrackService/DeleteSmartTrack",
+      data: {
+        smartTrackId
+      }
+    });
+  } catch (err) {
+    console.error(err);
+  }
+};
+var modifyTrackImgs = async (smartTrackId, images) => {
+  try {
+    await (0, import_request.default)({
+      method: "PUT",
+      url: "/singer.SmartTrackService/ModifyTrackImg",
+      data: {
+        images,
+        smartTrackId
+      }
+    });
+  } catch (err) {
+    console.log("err", err);
+  }
+};
+var modifyTrackConf = async (conf, smartTrackId) => {
+  try {
+    await (0, import_request.default)({
+      method: "PUT",
+      url: "/singer.SmartTrackService/ModifyTrackConf",
+      data: {
+        conf,
+        smartTrackId
+      }
+    });
+  } catch (err) {
+    console.log("err", err);
+  }
+};
+var getTrackTaskById = async (smartTrackId = 0) => {
+  try {
+    const data = smartTrackId ? {
+      smartTrackId
+    } : {};
+    let req = await (0, import_request.default)({
+      method: "POST",
+      url: "/singer.SmartTrackService/GetSmartTrack",
+      data
+    });
+    return req;
+  } catch (err) {
+    console.error(err);
+  }
+};
+var getTackDetailInfo = async (smartTrackId = 0) => {
+  const data = smartTrackId ? {
+    smartTrackId
+  } : {};
+  let req = await (0, import_request.default)({
+    method: "POST",
+    url: "/singer.SmartTrackService/GetTrackOverView",
+    data
+  });
+  return req;
+};
+var getTaskCameraByCenterAndPower = async (value) => {
+  let realCameraInfos = value["cameraInfos"];
+  let realPreprocessInfos = [];
+  if (!(0, import_func.isEmpty)(realCameraInfos)) {
+    const { taskStatus } = await (0, import_useTaskState.getListTaskStatus)();
+    realPreprocessInfos = (0, import_useTaskState.getCameraStatusFunc)(taskStatus);
+  }
+  const runRealCameraInfos = [];
+  realCameraInfos = realCameraInfos.filter((v) => {
+    if (import_Tree.default.judgeOccupyPowerById(v["id"], realPreprocessInfos)) {
+      runRealCameraInfos.push(v);
+    }
+    return !import_Tree.default.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];
+};
+var createIntelligentTrack = async (value) => {
+  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"] * 1e3,
+      queryCycle: defaultQueryCycle
+    },
+    centerConf: {
+      centerX: value["circleCenter"][0],
+      centerY: value["circleCenter"][1]
+    }
+  };
+  const res = await (0, import_request.default)({
+    method: "PUT",
+    url: "/singer.SmartTrackService/CreateSmartTrack",
+    data
+  });
+  return res;
+};
+var emitHeartbeat = async (smartTrackId) => {
+  try {
+    await (0, import_request.default)({
+      method: "POST",
+      url: "/singer.SmartTrackService/SmartTrackHeartBeat",
+      data: {
+        smartTrackId
+      }
+    });
+  } catch (err) {
+    console.error(err);
+  }
+};
+var ModifyTrackCameras = async (value) => {
+  try {
+    await setIntelligentTrackCircleInfo(value["smartTrackId"], value["centerPoint"]);
+    await (0, import_request.default)({
+      url: "/singer.SmartTrackService/ModifyTrackCameras",
+      method: "PUT",
+      data: {
+        smartTrackId: value["smartTrackId"],
+        deviceIds: value["deviceIds"]
+      }
+    });
+  } catch (err) {
+    import_meta.message.error(err);
+  }
+};
+var setIntelligentTrackCircleInfo = async (smartTrackId, circleCenter) => {
+  try {
+    await (0, import_request.default)({
+      url: "/singer.SmartTrackService/ModifyTrackScopeConf",
+      method: "PUT",
+      data: {
+        smartTrackId,
+        centerConf: {
+          centerX: (0, import_func.get)(circleCenter, "0"),
+          centerY: (0, import_func.get)(circleCenter, "1")
+        }
+      }
+    });
+  } catch (err) {
+    import_meta.message.error(err);
+  }
+};
+var getTackCameraInfo = async (value) => {
+  let circleCameraInfos = await getCameraInfoByCircle(
+    value["circleCenter"],
+    value["radius"],
+    value["zoom"]
+  );
+  return circleCameraInfos;
+};
+var 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 point2 = turf.destination(turf.point(circleCenter), radius, 90 * i, {
+        units: "kilometers"
+      }).geometry.coordinates;
+      if (point2[0] < minx || minx === 0) {
+        minx = point2[0];
+      }
+      if (point2[0] > maxx || maxx === 0) {
+        maxx = point2[0];
+      }
+      if (point2[1] < miny || miny === 0) {
+        miny = point2[1];
+      }
+      if (point2[1] > maxy || maxy === 0) {
+        maxy = point2[1];
+      }
+    }
+    let { clusterPoint } = await (0, import_request.default)({
+      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 (0, import_utils.SearchCamera)({
+      cameraId: cameraIds,
+      maxResults: cameraIds.length
+    });
+    const cameraInfos = cameras.filter((v) => {
+      let cameraPoint = turf.point([(0, import_func.get)(v, "longitude"), (0, import_func.get)(v, "latitude")]);
+      return turf.booleanPointInPolygon(cameraPoint, centerFeature);
+    });
+    return cameraInfos;
+  } catch (err) {
+    console.error(err);
+    return [];
+  }
+};
+var taskInfoToSearchItem = (taskInfo) => {
+  let imageList = [];
+  (0, import_func.get)(taskInfo, "images", []).forEach((v) => {
+    const url = (0, import_func.get)(v, "conds.0.srcImageUrl");
+    const objectId = (0, import_func.get)(v, "conds.0.featureInfo.objectId");
+    let imageItem = {
+      index: 0,
+      url,
+      objectId,
+      odRects: (0, import_func.get)(v, "conds").map((item) => {
+        return {
+          fileKey: (0, import_func.get)(item, "objectImageUrl"),
+          extendRect: {
+            algorithmVersion: (0, import_func.get)(item, "alg", ""),
+            ...(0, import_func.get)(item, "rect", {})
+          },
+          rect: {
+            algorithmVersion: (0, import_func.get)(item, "alg", ""),
+            rect: (0, import_func.get)(item, "rect", {})
+          }
+        };
+      })
+    };
+    imageList.push(imageItem);
+  });
+  return imageList;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ModifyTrackCameras,
+  createIntelligentTrack,
+  deleteTrackById,
+  emitHeartbeat,
+  getCameraInfoByCircle,
+  getDefaultRadius,
+  getSearchIntervalDuration,
+  getTackCameraInfo,
+  getTackDetailInfo,
+  getTaskCameraByCenterAndPower,
+  getTrackTaskById,
+  modifyTrackConf,
+  modifyTrackImgs,
+  operateTrackById,
+  setDefaultRadius,
+  setIntelligentTrackCircleInfo,
+  setSearchIntervalDuration,
+  taskInfoToSearchItem
+});
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@ -0,0 +1,8 @@
+export { default as BigImageModal } from './BigImageModal';
+export { default as BoxSelectTree } from './boxSelectTree';
+export { default as Tree } from './tree';
+export type { TreeData } from './tree';
+export { default as TreeTransfer } from './treeTransfer';
+export { default as TreeTransferModal } from './treeTransferModal';
+export { default as WarningRecordCard } from './WarningRecordCard';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
--- a/packages/biz/lib/index.js
+++ b/packages/biz/lib/index.js
@ -0,0 +1,54 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var src_exports = {};
+__export(src_exports, {
+  BigImageModal: () => import_BigImageModal.default,
+  BoxSelectTree: () => import_boxSelectTree.default,
+  Tree: () => import_tree.default,
+  TreeTransfer: () => import_treeTransfer.default,
+  TreeTransferModal: () => import_treeTransferModal.default,
+  WarningRecordCard: () => import_WarningRecordCard.default
+});
+module.exports = __toCommonJS(src_exports);
+var import_BigImageModal = __toESM(require("./BigImageModal"));
+var import_boxSelectTree = __toESM(require("./boxSelectTree"));
+var import_tree = __toESM(require("./tree"));
+var import_treeTransfer = __toESM(require("./treeTransfer"));
+var import_treeTransferModal = __toESM(require("./treeTransferModal"));
+var import_WarningRecordCard = __toESM(require("./WarningRecordCard"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BigImageModal,
+  BoxSelectTree,
+  Tree,
+  TreeTransfer,
+  TreeTransferModal,
+  WarningRecordCard
+});
--- a/packages/biz/lib/useSocket/index.js
+++ b/packages/biz/lib/useSocket/index.js
@ -0,0 +1,118 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/useSocket/index.ts
+var useSocket_exports = {};
+__export(useSocket_exports, {
+  SocketApi: () => SocketApi,
+  default: () => useSocket_default
+});
+module.exports = __toCommonJS(useSocket_exports);
+var import_react = require("react");
+var import_func = require("@zhst/func");
+var import_hooks = require("@zhst/hooks");
+var import_ws = __toESM(require("./ws"));
+var getSelf = (v) => v;
+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"
+  // 监听视频分组状态变化，列表变化也通知
+};
+var useSocket_default = (topic, iterator = import_func.noop, opt) => {
+  const {
+    req = {},
+    throttle = 0,
+    beforeLoopTmp = getSelf,
+    shouldBreak = false,
+    forceRefresh,
+    close
+  } = opt || {};
+  const reqstring = (0, import_react.useMemo)(() => {
+    const newReq = {
+      ...req,
+      extraHeaders: {
+        authorization: localStorage.getItem("USER-TOKEN")
+      }
+    };
+    return JSON.stringify(newReq);
+  }, [req]);
+  const latestIterator = (0, import_hooks.useLatest)(iterator);
+  (0, import_hooks.useDeepEffect)(() => {
+    if (close) {
+      return;
+    }
+    if (shouldBreak) {
+      return;
+    }
+    let tmpData = [];
+    const throttleUpdate = (0, import_func.throttle)(() => {
+      if (tmpData.length == 0) {
+        return;
+      }
+      const _tmpData = beforeLoopTmp(tmpData);
+      latestIterator.current(_tmpData);
+      tmpData = [];
+    }, throttle);
+    const unSubscribe = import_ws.default.subscribe(SocketApi[topic], reqstring, (socketData) => {
+      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]);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SocketApi
+});
--- a/packages/biz/lib/useSocket/onceChannel.d.ts
+++ b/packages/biz/lib/useSocket/onceChannel.d.ts
@ -0,0 +1,2 @@
+declare const startChannel: (topic: any, req: any, callback: any) => () => void;
+export default startChannel;
--- a/packages/biz/lib/useSocket/onceChannel.js
+++ b/packages/biz/lib/useSocket/onceChannel.js
@ -0,0 +1,51 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/useSocket/onceChannel.tsx
+var onceChannel_exports = {};
+__export(onceChannel_exports, {
+  default: () => onceChannel_default
+});
+module.exports = __toCommonJS(onceChannel_exports);
+var import_ws = __toESM(require("./ws"));
+var startChannel = (topic, req, callback) => {
+  let reqstring = JSON.stringify({
+    ...req,
+    extraHeaders: {
+      authorization: localStorage.getItem("USER-TOKEN")
+    }
+  });
+  let unSubscribe = import_ws.default.subscribe(topic, reqstring, (socketData) => {
+    let shouldStop = callback(socketData);
+    if (shouldStop) {
+      unSubscribe == null ? void 0 : unSubscribe();
+    }
+  });
+  return unSubscribe;
+};
+var onceChannel_default = startChannel;
--- a/packages/biz/lib/useSocket/ws.js
+++ b/packages/biz/lib/useSocket/ws.js
@ -0,0 +1,224 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/useSocket/ws.ts
+var ws_exports = {};
+__export(ws_exports, {
+  default: () => ws_default
+});
+module.exports = __toCommonJS(ws_exports);
+var import_uuid = require("uuid");
+var import_func = require("@zhst/func");
+var import_socket = __toESM(require("socket.io-client"));
+var import_constants = require("@common/constants");
+var EMITSTATE = {
+  NOT_CONNECT: 0,
+  WAITING: 1,
+  CONNECT: 2
+};
+var initRetryTime = 0;
+var intervalTime = 5 * 1e3;
+var maxIntervalTime = 1 * 60 * 60 * 1e3;
+var Channel = class {
+  constructor() {
+    /**
+     * 已存在的订阅列表
+     */
+    this.listeners = [
+      // {
+      //     topic: "",
+      //     req: "",
+      //     suInfo: {},
+      //     hasEmit: false,//是否已经订阅
+      //     lastRetryInterval: 0,
+      //     handles: {
+      //     }
+      // }
+    ];
+    /**
+     * 调试信息 记录订阅/反订阅次数
+     */
+    this.subscribeListenerId = [];
+    this.unSubscribeListenerId = [];
+    this.init = () => {
+      const ioIns = this.ioIns = (0, import_socket.default)(import_constants.SOCKET_HOST, {
+        reconnection: true,
+        transports: ["websocket"],
+        forceNew: true
+      });
+      ioIns.on("connect", (...arg) => {
+        console.debug("connect", arg);
+        this.ioIns = ioIns;
+        this.listeners.forEach((v) => {
+          this.doEmit(v["topic"], v["req"], v["id"]);
+        });
+      });
+      ioIns.on("event", (...arg) => {
+        console.debug("event", arg);
+      });
+      ioIns.on("disconnect", (...arg) => {
+        console.debug("disconnect", arg);
+        this.subscribeListenerId = [];
+        this.unSubscribeListenerId = [];
+      });
+      ioIns.on("reconnect", (...arg) => {
+        console.debug("reconnect", arg);
+        this.listeners.forEach((v) => {
+          v["hasEmit"] = EMITSTATE.NOT_CONNECT;
+          this.doEmit(v["topic"], v["req"], v["id"]);
+        });
+      });
+    };
+    this.retry = (listener) => {
+      const intervalId = setTimeout(() => {
+        const hasExit = this.listeners.find(
+          (v) => v["topic"] === (listener == null ? 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;
+    };
+    this.doEmit = (topic, req, listenerId) => {
+      var _a, _b;
+      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;
+      (_b = (_a = this.ioIns) == null ? void 0 : _a.emit) == null ? void 0 : _b.call(_a, topic, req, (data) => {
+        var _a2, _b2;
+        console.info("emit", topic, req, data);
+        const suInfo = JSON.parse(data);
+        if ((0, import_func.has)(suInfo, "Error.code")) {
+          if (suInfo.Error.code === 500) {
+            this.retry(listener);
+          }
+          return;
+        }
+        this.subscribeListenerId.push(listenerId);
+        const currentTopicIndex = this.listeners.findIndex(
+          (v) => v["topic"] === topic && v["req"] === req && v["id"] === listenerId
+        );
+        if (currentTopicIndex == -1) {
+          this.ioIns.emit("UnSubscribe", JSON.stringify(suInfo), (data2) => {
+            this.unSubscribeListenerId.push(listenerId);
+            console.debug("UNSUBSCRIBE", listenerId, topic, req, data2);
+          });
+          return;
+        }
+        if (!suInfo["SubscribeID"]) {
+          this.listeners.splice(currentTopicIndex, 0);
+        } else {
+          this.listeners[currentTopicIndex]["suInfo"] = suInfo;
+          this.listeners[currentTopicIndex]["hasEmit"] = EMITSTATE.CONNECT;
+        }
+        (_b2 = (_a2 = this.ioIns) == null ? void 0 : _a2.on) == null ? void 0 : _b2.call(_a2, suInfo["SubscribeID"], (data2) => {
+          console.info("on", suInfo["SubscribeID"], data2);
+          try {
+            const socketData = JSON.parse(data2);
+            if ((0, import_func.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 {
+                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 = (0, import_uuid.v4)();
+    const listenerId = (0, import_uuid.v4)();
+    const listener = this.listeners.find((v) => v["topic"] === topic && v["req"] === req);
+    if (listener) {
+      listener["handles"][handleId] = handle;
+    } else {
+      this.listeners.push({
+        topic,
+        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));
+      }
+    }
+  }
+};
+var channelIns = new Channel();
+window.__channel__ = channelIns;
+var ws_default = channelIns;
--- a/packages/biz/lib/utils/constants.d.ts
+++ b/packages/biz/lib/utils/constants.d.ts
@ -0,0 +1,31 @@
+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;
+};
+export declare const BOX_TYPE_LIST: {
+    value: string;
+    label: string;
+}[];
+export declare const ALL_LIST: {
+    value: string;
+    label: string;
+}[];
--- a/packages/biz/lib/utils/constants.js
+++ b/packages/biz/lib/utils/constants.js
@ -0,0 +1,91 @@
+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/utils/constants.ts
+var constants_exports = {};
+__export(constants_exports, {
+  ALL_LIST: () => ALL_LIST,
+  BODY_SEARCH_THRESHOID: () => BODY_SEARCH_THRESHOID,
+  BOX_TYPE_LIST: () => BOX_TYPE_LIST,
+  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(constants_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
+  // 只有普通摄像头，没有人脸、没有盒子、直连
+};
+var BOX_TYPE_LIST = [
+  { value: "1", label: "盒子" },
+  { value: "2", label: "盒子组" }
+];
+var ALL_LIST = [
+  { value: "", label: "全部" }
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ALL_LIST,
+  BODY_SEARCH_THRESHOID,
+  BOX_TYPE_LIST,
+  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/biz/src/infiniteList/type.ts
+++ b/packages/biz/src/infiniteList/type.ts
--- a/packages/biz/src/treePanel/constants.ts
+++ b/packages/biz/src/treePanel/constants.ts
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@ -1,6 +1,6 @@
 {
  "name": "@zhst/biz",
-  "version": "0.34.0",
+  "version": "0.9.1",
  "description": "业务库",
  "keywords": [
    "business",
@ -35,20 +35,17 @@
    "registry": "http://10.0.0.77:4874"
  },
  "devDependencies": {
-    "@swc/core": "^1.3.9",
-    "@zhst/types": "workspace:^"
+    "@types/zhst": "workspace:^"
  },
  "dependencies": {
    "@ant-design/icons": "^5.2.6",
    "@ant-design/pro-components": "^2.6.49",
    "@zhst/func": "workspace:^",
    "@zhst/hooks": "workspace:^",
-    "@zhst/icon": "workspace:^",
    "@zhst/meta": "workspace:^",
    "antd": "^5.12.5",
    "classnames": "^2.5.1",
-    "dayjs": "^1.11.10",
    "rc-util": "^5.38.1",
-    "react-infinite-scroll-component": "^6.1.0"
+    "dayjs": "^1.11.10"
  }
 }
--- a/packages/biz/src/BigImage/BigImage.tsx
+++ b/packages/biz/src/BigImage/BigImage.tsx
@ -1,304 +0,0 @@
-import React, { forwardRef, useImperativeHandle, useRef } from 'react'
-import {
-  ConfigProvider,
-  Descriptions,
-  CropperImage,
-  AttachImage,
-  VideoPlayer,
-  RelatedImage,
-  Radio,
-  Tooltip,
-  Button,
-  Tabs
-} from '@zhst/meta';
-import classNames from 'classnames'
-import { IconFont } from '@zhst/icon'
-import { BigImageProps, BigImageRef } from './interface'
-import CombineImage from './components/CombineImage'
-import './index.less'
-
-const DescriptionsItem = Descriptions.Item
-
-export const componentPrefix = 'zhst-big-image'
-
-const initialStyle ={
-  fontSize: '12px'
-}
-
-const BigImage = forwardRef<BigImageRef, BigImageProps>((props, ref) => {
-  const {
-    // ------------ 通用配置 -------------------
-    type,
-    viewHeight,
-    width = '100%',
-    children,
-    // ------------ 顶部按钮 -----------------
-    topButtonRender,
-    // ------------ 描述 -----------------
-    descriptionList = [],
-    showDescription,
-    // ------------- tab 导航 ----------------
-    customTabBarExtraContent,
-    tabProps,
-    onTabChange,
-    // ------------- 场景图 -------------
-    cropperImageProps = {
-      cropButtonList: []
-    },
-    // ----------------- 对比图 ---------------------
-    combineImageProps,
-    // ------------ 视频模式 -----------------
-    videoProps,
-    // ------------ view 操作按钮 -----------------
-    showModeChange,
-    modeButtonGroupProps,
-    viewTopModeButtonList = [
-      {
-        key: 'image',
-        label: '图片'
-      },
-      {
-        key: 'video',
-        label: '视频'
-      }
-    ],
-    // ------------------ 翻页 ----------------------
-    showNavigation,
-    prevButtonProps,
-    onPrevButtonClick,
-    onNextButtonClick,
-    nextButtonProps,
-    // ------------------ 人脸碰撞模型 -----------------
-    relatedImageProps,
-    isRelated = false,
-    theme,
-  } = props
-  const combineImageRef = useRef<any>(null)
-  const videoPlayerRef = useRef<any>(null)
-  const cropperImageRef = useRef<any>(null)
-
-  cropperImageProps.cropButtonList = cropperImageProps?.cropButtonList || [
-    {
-      key: 'auto',
-      icon: <IconFont icon='icon-zidong' />,
-      label: '智能框选',
-    },
-    {
-      key: 'custom',
-      icon: <IconFont icon='icon-shoudong' />,
-      label: '手动框选',
-    }
-  ];
-
-  // ------------------- 初始化模式 ----------------------
-  const initMode = (type: BigImageProps['type'] = 'normal') => {
-    switch (type) {
-      case 'compater':
-        return (
-          <CombineImage
-            // @ts-ignore
-            ref={combineImageRef}
-            height={viewHeight}
-            {...combineImageProps}
-          />
-        )
-      case 'normal':
-        return (
-          <div style={{ height: viewHeight, width: '100%' }}>
-            <CropperImage
-              ref={cropperImageRef}
-              type='rect'
-              // @ts-ignore
-              height={viewHeight}
-              {...cropperImageProps}
-            >
-              {/* // ------------ 显示条件：当不为编辑状态，并且有图片值 ----------------- */}
-              {!cropperImageProps?.editAble && cropperImageProps?.attachImageData && (
-                <>
-                  <AttachImage
-                    data={cropperImageProps?.attachImageData}
-                    {...cropperImageProps?.attachImageProps}
-                  />
-                  <div
-                    style={{
-                      position: 'absolute',
-                      right: '4px',
-                      bottom: '4px',
-                      fontSize: '18px',
-                      color: 'red',
-                      cursor: 'default'
-                    }}
-                  >{`人脸质量分：${(Number(cropperImageProps?.score) as number).toFixed(2)}`}</div>
-                </>
-              )}
-              {/* // ------------ 场景图绘制工具栏 ----------------- */}
-              {cropperImageProps?.showEditTools && (
-                <div className={`${componentPrefix}-view-cropper-btn`}>
-                  <Radio.Group
-                    className={`${componentPrefix}-view-cropper-btn-group`}
-                    size="small"
-                    buttonStyle='solid'
-                    // @ts-ignore
-                    onChange={cropperImageProps?.onCropperTypeChange}
-                    {...cropperImageProps.btnGroupProps}
-                  >
-                    {cropperImageProps?.cropButtonList?.map(btn => (
-                      <Tooltip key={btn.key} title={btn.label}>
-                        {/* @ts-ignore */}
-                        <Radio.Button value={btn.key}{...btn.props}><div  className={`${componentPrefix}-view-cropper-btn-group-radio`}>{btn.icon} {btn.label}</div></Radio.Button>
-                      </Tooltip>
-                    ))}
-                  </Radio.Group>
-                  <Button onClick={cropperImageProps?.onExitEdit} className={`${componentPrefix}-view-cropper-btn_close`} type="primary" size="small" icon={<IconFont icon="icon-danchuangguanbi" />} />
-                </div>
-              )}
-            </CropperImage>
-          </div>
-        )
-      case 'video':
-        return (
-          // @ts-ignore
-          <VideoPlayer ref={videoPlayerRef} height={viewHeight} {...videoProps} />
-        )
-    }
-  }
-
-  // 暴露 ref 实例
-  useImperativeHandle(ref, () => ({
-    // @ts-ignore
-    cropperImageRef: cropperImageRef?.current,
-    videoPlayerRef: videoPlayerRef?.current,
-    combineImageRef: combineImageRef?.current,
-  }));
-
-  return (
-    <div
-      className={classNames(`${componentPrefix}-view`)}
-      style={{ width: `${parseInt(width as string)}px` }}
-    >
-      <div className={classNames(`${componentPrefix}-view-btns`)}>
-        {topButtonRender}
-      </div>
-      {showDescription && (
-        <div
-          className={classNames(`${componentPrefix}-view-desc`)}
-        >
-          <ConfigProvider
-            theme={{
-              components: {
-                Descriptions: {
-                  viewBg: '#f6f6f6',
-                  colorBgLayout:'#ccc',
-                  titleColor: 'rgba(0,0,0,0.45)',
-                  colorTextLabel: 'rgba(0,0,0,0.45)',
-                  contentColor: 'rgba(0,0,0,0.88)',
-                },
-              },
-              ...theme
-            }}
-          >
-            {descriptionList.map(descriptions => (
-              <Descriptions
-                key={descriptions.title}
-                title={descriptions.showTitle && descriptions.title}
-                column={8}
-                {...descriptions.props}
-              >
-                {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>
-            ))}
-          </ConfigProvider>
-        </div>
-      )}
-      <Tabs
-        tabBarExtraContent={customTabBarExtraContent}
-        onChange={onTabChange}
-        items={[
-          {
-            label: `场景图`,
-            key: '1',
-          },
-          {
-            label: `对比图`,
-            key: '2',
-          }
-        ]}
-        {...tabProps}
-      />
-      <div
-        className={classNames(`${componentPrefix}-view-container`)}
-      >
-        {/* ---------------- view 视图左上角导航按钮 ------------------ */}
-        {showModeChange && (
-          <div
-            className={classNames(`${componentPrefix}-view-container-modeNav`)}
-          >
-            <Radio.Group
-              buttonStyle='solid'
-              size='small'
-              {...modeButtonGroupProps}
-            >
-              {viewTopModeButtonList?.map(btn => (
-                <Tooltip key={btn.key} title={btn.tooltipTxt}>
-                  {/* @ts-ignore */}
-                  <Radio.Button  value={btn.key} {...btn.props}>{btn.icon} {btn.label}</Radio.Button>
-                </Tooltip>
-              ))}
-            </Radio.Group>
-          </div>
-        )}
-        {/* --------------------------------- 视频播放模式 --------------------------------- */}
-        {initMode(type)}
-        {/* 切换按钮组件 */}
-        {/* ----------------------------------- 上一张按钮 ---------------------------------- */}
-        {showNavigation && (
-          <Button
-            className={classNames(
-              `${componentPrefix}-view-container-nav`,
-              `${componentPrefix}-view-container-nav_left`
-            )}
-            icon={<IconFont icon="icon-qiehuanzuo" />}
-            type="primary"
-            // style={{ backgroundColor: 'rgba(255,255,255,0.8)' }}
-            shape='circle'
-            onClick={onPrevButtonClick}
-            {...prevButtonProps}
-          />
-        )}
-        {/* ----------------------------------- 下一张按钮 ---------------------------------- */}
-        {showNavigation && (
-          <Button
-            className={classNames(
-              `${componentPrefix}-view-container-nav`,
-              `${componentPrefix}-view-container-nav_right`
-            )}
-            icon={<IconFont icon="icon-qiehuanyou" />}
-            type="primary"
-            // style={{ backgroundColor: 'rgba(255,255,255,0.8)' }}
-            shape='circle'
-            onClick={onNextButtonClick}
-            {...nextButtonProps}
-          />
-        )}
-      </div>
-      {/* ----------------------------------- 人脸碰撞组件 ---------------------------------- */}
-      {isRelated && (
-        // @ts-ignore
-        <RelatedImage
-          {...relatedImageProps}
-        />
-      )}
-      {children}
-    </div>
-  )
-})
-
-export default BigImage
--- a/packages/biz/src/BigImage/components/CombineImage/index.less
+++ b/packages/biz/src/BigImage/components/CombineImage/index.less
@ -1,3 +0,0 @@
-.zhst-big-image-combime-image {
-  background-color: #f7f7f7;
-}
--- a/packages/biz/src/BigImage/components/CombineImage/index.tsx
+++ b/packages/biz/src/BigImage/components/CombineImage/index.tsx
@ -1,82 +0,0 @@
-
-import React, { FC, useRef, forwardRef, useImperativeHandle } from 'react';
-import { CompareImage, Flex, Progress, ProgressProps, CompareImageProps } from '@zhst/meta'
-import './index.less'
-
-export interface ComBineImageProps {
-  height?: string | number
-  data: {
-    imgSummary: string;
-    compaterImage: string;
-    imageKey: string;
-    score: number;
-  }
-  prevDisable?: boolean;
-  nextDisable?: boolean;
-  onPre?: () => void;
-  onNext?: () => void;
-  openRoll?: boolean
-  targetImageProps?: CompareImageProps
-  sourceImageProps?: CompareImageProps
-}
-
-const conicColors: ProgressProps['strokeColor'] = {
-  '0%': '#42E2AC',
-  '50%': '#DFAF2E',
-  '100%': '#F95C55',
-};
-
-const componentName = 'zhst-big-image-combime-image'
-
-const ComBineImage: FC<ComBineImageProps> = forwardRef((props, ref) => {
-  const {
-    height,
-    data,
-    prevDisable,
-    nextDisable,
-    onNext,
-    onPre,
-    openRoll
-  } = props
-  const { imgSummary, compaterImage, score } = data
-  const targetImageRef = useRef(null)
-  const compareImageRef = useRef(null)
-
-  useImperativeHandle(ref, () => ({
-    compareImageRef,
-    targetImageRef
-  }));
-
-  return (
-    <Flex className={componentName} justify='space-between' align='center' >
-      <CompareImage
-        ref={targetImageRef}
-        height={height as string}
-        width="400px"
-        preDisable={prevDisable}
-        nextDisable={nextDisable}
-        onNext={onNext}
-        onPre={onPre}
-        showScore={false}
-        openRoll={openRoll}
-        url={imgSummary}
-        label="目标图"
-        {...props.targetImageProps}
-      />
-      <Progress type="circle" size={72} strokeWidth={6} percent={Number(score || 0)} strokeColor={conicColors} />
-      <CompareImage
-        ref={compareImageRef}
-        width="400px"
-        height={height as string}
-        url={compaterImage}
-        openRoll={false}
-        score={score}
-        label="预警图"
-        labelColor='#FA5852'
-        {...props.sourceImageProps}
-      />
-    </Flex>
-  )
-})
-
-export default ComBineImage
--- a/packages/biz/src/BigImage/components/navigation/index.tsx
+++ b/packages/biz/src/BigImage/components/navigation/index.tsx
@ -1,40 +0,0 @@
-// !! 已废弃
-import * as React from 'react';
-import classnames from 'classnames';
-import { Button } from '@zhst/meta';
-import { IconFont } from '@zhst/icon'
-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} shape='circle' onClick={onClick}>
-        <IconFont size={28} color={color} icon={prev ? 'icon-qiehuanzuo' : 'icon-qiehuanyou'} />
-      </Button>
-    </div>
-  );
-};
-
-export default Navigation;
--- a/packages/biz/src/BigImage/demo/imgs/photo-1503185912284-5271ff81b9a8.webp
+++ b/packages/biz/src/BigImage/demo/imgs/photo-1503185912284-5271ff81b9a8.webp
--- a/packages/biz/src/BigImage/demo/index.tsx
+++ b/packages/biz/src/BigImage/demo/index.tsx
@ -1,71 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { BigImage } from '@zhst/biz'
-import { Space, Switch } from '@zhst/meta'
-import { pick, get } from '@zhst/func'
-import { BIG_IMAGE_DATA, attributeList } from '../mock'
-import Img from './imgs/photo-1503185912284-5271ff81b9a8.webp'
-
-const BigModal = (props: any) => {
-  const {
-  } = props
-  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [showDesc, setShowDesc] = useState(true)
-  const [type, setType] = useState('normal')
-  const modalRef = useRef(null)
-
-  return (
-    <div style={{ padding: '32px', border: '1px solid #09f' }}>
-      <Space>
-        <span>显示属性：<Switch value={showDesc} onChange={e => setShowDesc(pre => !pre)} /></span>
-      </Space>
-      <BigImage
-        type={type}
-        ref={modalRef}
-        width={896}
-        viewHeight={'440px'}
-        showModeChange
-        onTabChange={(newVal) => setType(newVal === '1'? 'normal': 'compater')}
-        // ------------ 属性列表 -----------------
-        showDescription={showDesc}
-        descriptionList={attributeList}
-        // ------------ 图片/视频切换 -----------------
-        viewTopModeButtonList={[
-          {
-            key: 'image',
-            label: '图片'
-          },
-          {
-            key: 'video',
-            label: '视频'
-          }
-        ]}
-        modeButtonGroupProps={{
-          defaultValue: 'image',
-          onChange: e => console.log('模式切换', e)
-        }}
-        // ------------ 导航功能 -----------------
-        showNavigation
-        onPrevButtonClick={val => console.log('pre', val)}
-        onNextButtonClick={val => console.log('next', val)}
-        // ------------ 场景图功能 -----------------
-        cropperImageProps={{
-          url: Img,
-          score: 50,
-          odList: get(dataSource, 'odRect', []),
-          attachImageData: get(dataSource, 'attachImg', []),
-        }}
-        // ------------ 对比图模式 -----------------
-        combineImageProps={{
-          data: pick(dataSource, 'compaterImage', 'imgSummary', 'imageKey', 'score'),
-        }}
-        // ------------ 视频模块 -----------------
-        videoProps={{
-          url: get(dataSource, 'flvUrl', '')
-        }}
-      >
-      </BigImage>
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImage/demo/oldData.tsx
+++ b/packages/biz/src/BigImage/demo/oldData.tsx
@ -1,128 +0,0 @@
-// @ts-nocheck
-import React, { useState } from 'react';
-import { BigImageModal } from '@zhst/biz'
-import { Button, DescriptionsProps } from '@zhst/meta'
-import { IMAGE_DATA, BIG_IMAGE_DATA } from '../mock'
-import bigImageModalAdapter from '../util/bigImageModalAdapter'
-import { get } from '@zhst/func';
-
-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: '否',
-      },
-    ]
-  }
-];
-
-// 适配器，适配老接口
-const NewImageModal = bigImageModalAdapter(BigImageModal, {
-  oldMode: true
-})
-
-const BigModal = (props) => {
-  const {
-    onClose,
-    isArchiveDetail = false,
-    specialTitle = '对比图2',
-    transformPropFunc,
-    screenshotButtonRender,
-    showLowFaceTip = false
-  } = props
-  const [visible, setVisible] = useState(false)
-  const [selectIndex, setSelectIndex] = useState(0)
-  const [dataSource, setDataSource] = useState(IMAGE_DATA.dataSource)
-  const [dataSources, setDataSources] = useState(IMAGE_DATA.dataSource)
-  const [selectItem, setSelectItem] = useState({})
-
-  return (
-    <div>
-      <Button onClick={() => setVisible(true)} >查看大图</Button>
-      <NewImageModal
-        title="查看大图"
-        dataSource={dataSource}
-        imageData={dataSource}
-        width={1098}
-        onClose={() => onClose}
-        descriptionConfig={{ data: descriptionList }}
-        visible={visible}
-        isArchiveDetail={isArchiveDetail}
-        ToolProps={{
-          // renderLeft: leftOperateBar({ disableBtn, onActionClick: onBigImageActionClick }),
-          // renderRight: rightOperateBar({
-          //   disableBtn,
-          //   onActionClick: onBigImageActionClick,
-          //   isArchiveDetail,
-          // }),
-          // renderVideoBtn: !disableBtn.includes(OPT['PLAY_VIDEO']),
-          // disableVideo: disableVideo,
-        }}
-        selectIndex={selectIndex}
-        onSelectIndexChange={(index: number) => {
-          index > 0 && index < dataSources.length && setSelectIndex(index);
-        }}
-        // tabsFilter={tabsFilter}
-        specialTitle={specialTitle}
-        transformPropFunc={async (item: any) => {
-          let bigImageInfo = !!transformPropFunc && (await transformPropFunc(item));
-          setSelectItem({ ...bigImageInfo });
-          return { ...bigImageInfo };
-        }}
-        screenshotButtonRender={screenshotButtonRender}
-        //@ts-ignore
-        transformVideoPropFunc={async (item) => {
-          const { maxDuration: duration = 20 } = item || {};
-          const time = get(item, 'timestamp');
-          const cameraId = get(item, 'cameraId');
-          const { url: flvUrl } = {
-            url: 'url',
-            downloadUrl: 'url',
-          };
-          return {
-            flvUrl,
-            maxDuration: duration,
-          };
-        }}
-        nullDialogProp={{
-          emptyText: showLowFaceTip ? '目标图人脸质量较低，暂无聚类数据' : '暂无数据',
-        }}
-      />
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImage/demo/withEdit.tsx
+++ b/packages/biz/src/BigImage/demo/withEdit.tsx
@ -1,89 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { BigImage } from '@zhst/biz'
-import { Space, Switch, Button } from '@zhst/meta'
-import { pick, get } from '@zhst/func'
-import { BIG_IMAGE_DATA, attributeList } from '../mock'
-import Img from './imgs/photo-1503185912284-5271ff81b9a8.webp'
-
-const testOd = [
-  {
-    "id": "456",
-    "x": 0.58543766,
-    "y": 0.3203356,
-    "w": 0.052037954,
-    "h": 0.2664015
-  }
-]
-
-const BigModal = (props: any) => {
-  const {
-  } = props
-  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [showDesc, setShowDesc] = useState(true)
-  const [editAble, setEditAble] = useState(false)
-  const [odList, setOdList] = useState(get(dataSource, 'odRect', []))
-  const [type, setType] = useState('normal')
-  const bigImageRef = useRef(null)
-
-  return (
-    <div style={{ padding: '32px', border: '1px solid #09f' }}>
-      <Space>
-        <span>显示属性：<Switch value={showDesc} onChange={e => setShowDesc(pre => !pre)} /></span>
-        <span>打开编辑模式：<Switch value={editAble} onChange={e => setEditAble(pre => !pre)} /></span>
-        <Button onClick={() => setOdList(testOd)}>修改Od</Button>
-      </Space>
-      <BigImage
-        type={type}
-        ref={bigImageRef}
-        width={896}
-        viewHeight={'440px'}
-        showModeChange
-        onTabChange={(newVal) => setType(newVal === '1'? 'normal': 'compater')}
-        // ------------ 属性列表 -----------------
-        showDescription={showDesc}
-        descriptionList={attributeList}
-        // ------------ 图片/视频切换 -----------------
-        viewTopModeButtonList={[
-          {
-            key: 'image',
-            label: '图片'
-          },
-          {
-            key: 'video',
-            label: '视频'
-          }
-        ]}
-        modeButtonGroupProps={{
-          defaultValue: 'image',
-          onChange: e => console.log('模式切换', e)
-        }}
-        // ------------ 导航功能 -----------------
-        showNavigation
-        onPrevButtonClick={val => console.log('pre', val)}
-        onNextButtonClick={val => console.log('next', val)}
-        // ------------ 场景图功能 -----------------
-        cropperImageProps={{
-          editAble,
-          url: Img,
-          score: 50,
-          odList: odList,
-          showEditTools: editAble,
-          attachImageData: get(dataSource, 'attachImg', []),
-          onCropperTypeChange: v => console.log('框选模式', v),
-          onExitEdit: () => setEditAble(pre => !pre)
-        }}
-        // ------------ 对比图模式 -----------------
-        combineImageProps={{
-          data: pick(dataSource, 'compaterImage', 'imgSummary', 'imageKey', 'score'),
-        }}
-        // ------------ 视频模块 -----------------
-        videoProps={{
-          url: get(dataSource, 'flvUrl', '')
-        }}
-      >
-      </BigImage>
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImage/demo/withRelatedImage.tsx
+++ b/packages/biz/src/BigImage/demo/withRelatedImage.tsx
@ -1,78 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { BigImage } from '@zhst/biz'
-import { Button, Space, Switch } from '@zhst/meta'
-import { pick, get } from '@zhst/func'
-import { BIG_IMAGE_DATA, attributeList, RELATED_IMAGES } from '../mock'
-
-const BigModal = (props: any) => {
-  const {
-  } = props
-  const [visible, setVisible] = useState(true)
-  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [selectedItemKey, setSelectedItemKey] = useState()
-  const [showFaceModel, setShowFaceModel] = useState(true)
-  const [type, setType] = useState('normal')
-  const modalRef = useRef(null)
-
-  return (
-    <div style={{ padding: '32px', border: '1px solid #09f' }}>
-      <Space>
-        <span>显示人脸碰撞模型：<Switch value={showFaceModel} onChange={e => setShowFaceModel(pre => !pre)} /></span>
-      </Space>
-      <BigImage
-        type={type}
-        open={visible}
-        ref={modalRef}
-        viewHeight={'440px'}
-        width={896}
-        onCancel={() => setVisible(false)}
-        showModeChange
-        onTabChange={(newVal, oldVal) => setType(newVal === '1'? 'normal': 'compater')}
-        // ------------ 图片/视频切换 -----------------
-        viewTopModeButtonList={[
-          {
-            key: 'image',
-            label: '图片'
-          },
-          {
-            key: 'video',
-            label: '视频'
-          }
-        ]}
-        modeButtonGroupProps={{
-          defaultValue: 'image',
-          onChange: e => console.log('模式切换', e)
-        }}
-        // ------------ 场景图功能 -----------------
-        cropperImageProps={{
-          url: "https://gw.alipayobjects.com/zos/antfincdn/LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp",
-          score: 50,
-          odList: get(dataSource, 'odRect', []),
-          attachImageData: get(dataSource, 'attachImg', []),
-        }}
-        // ------------ 对比图模式 -----------------
-        combineImageProps={{
-          data: pick(dataSource, 'compaterImage', 'imgSummary', 'imageKey', 'score'),
-        }}
-        // ------------ 视频模块 -----------------
-        videoProps={{
-          url: get(dataSource, 'flvUrl', '')
-        }}
-        // ------------ 人脸碰撞模型 -----------------
-        isRelated={showFaceModel}
-        relatedImageProps={{
-          activeTab: 'related',
-          selectedItemKey,
-          data: RELATED_IMAGES,
-          onCancel: () => console.log('取消关联'),
-          onConnect: () => console.log('关联'),
-          onTabChange: (newVal, oldVal) => console.log('tab切换', newVal, oldVal),
-          onItemSelected: (item) => setSelectedItemKey(item.key)
-        }}
-      >
-      </BigImage>
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImage/index.less
+++ b/packages/biz/src/BigImage/index.less
@ -1,132 +0,0 @@
-.zhst-big-image {
-  .zhst-dialog-content {
-    box-shadow: 0 4px 12px rgb(0 0 0 / 20%);
-  }
-
-  .zhst-tabs .zhst-tabs-nav-wrap {
-    background-color: #f6f6f6;
-  }
-
-  &-view {
-    &-btns {
-      margin-bottom: 16px;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 100%;
-    }
-    &-desc {
-      margin-bottom: 16px;
-      padding: 16px 16px 0 16px;
-      background-color: #f7f7f7;
-      .zhst-descriptions-header {
-        margin-bottom: 8px;
-      }
-      .zhst-descriptions-title {
-        font-size: 14px;
-      }
-    }
-    // ------------ tab -----------------
-    .zhst-tabs-nav {
-      margin-bottom: 8px;
-      .zhst-tabs-tab {
-        &:not(:first-child) {
-          margin-left: 24px;
-        }
-        padding: 0;
-        padding-bottom: 4px;
-      }
-      &::before {
-        display: none;
-      }
-    }
-    &-container {
-      position: relative;
-      min-height: 440px;
-      width: 100%;
-      margin-bottom: 16px;
-      font-size: 0;
-      &-modeNav {
-        padding: 2px;
-        position: absolute;
-        top: 4px;
-        left: 4px;
-        z-index: 10;
-        border-radius: 4px;
-      }
-      &__nav {
-        position: absolute;
-        z-index: 99;
-        top: 50%;
-        width: 40px !important;
-        height: 40px !important;
-        background: #d9d9d9;
-        border-radius: 100%;
-        cursor: pointer;
-        transform: translateY(-50%);
-
-        &>button {
-          display: flex;
-          align-items: center;
-          color: #fff !important;
-        }
-
-        &--disabled {
-          opacity: 0.3;
-
-          &>button {
-            color: #fff !important;
-          }
-        }
-      }
-
-      &__nav:hover {
-        background: #09f;
-        color: #fff !important;
-      }
-      // ------------ 导航 -----------------
-      &-nav {
-        position: absolute;
-        top: 50%;
-        transform: translateY(-50%);
-        background-color: rgba(255, 255, 255, 0.8);
-        &:hover {
-          opacity: 0.8;
-          background-color: rgba(255, 255, 255, 0.8)!important;
-        }
-        &_left {
-          left: 8px;
-        }
-        &_right {
-          right: 8px;
-        }
-      }
-    }
-    // ------------ 场景图 -----------------
-    &-cropper-btn {
-      position: absolute;
-      top: 4px;
-      right: 4px;
-      &_close {
-        margin-left: 4px;
-        vertical-align: top;
-      }
-      &-group {
-        .zhst-radio-button-wrapper {
-          display: inline-flex;
-          font-size: 12px;
-          color: #191919;
-          background-color: rgba(255, 255, 255, 0.8)
-        }
-        &-radio {
-          display: inline-flex;
-          align-items: center;
-          .anticon {
-            margin-right: 4px;
-          }
-        }
-      }
-    }
-  }
-}
-
--- a/packages/biz/src/BigImage/index.md
+++ b/packages/biz/src/BigImage/index.md
@ -1,96 +0,0 @@
---
-group: 进阶组件
-category: Components
-subtitle: 大图组件
-toc: content
-title: BigImage 大图组件
---
-
-## 大图弹框
-
-<code src="./demo/index.tsx">基本</code>
-<code src="./demo/withRelatedImage.tsx">人脸碰撞模型</code>
-<code src="./demo/withEdit.tsx">编辑模式</code>
-
-### API
-
-| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
-| type | 当前模式 | 'compater'、'normal'、'video' | - |  |
-| viewHeight | 视图高度 | string、number | - |  |
-| width | 宽度 | string、number | - |  |
-| showDescription | 描述列表显示\隐藏 | boolean | false |  |
-| descriptionsProps | 描述列表透传 |  | antd - DescriptionsProps |  |
-| descriptionList | 描述列表数据(见下文) |  | IDescriptionList |  |
-| topButtonRender | 顶部按钮 |  | ReactNode、string |  |
-| customTabBarExtraContent | 自定义tab尾部导航插槽 |  | ReactNode、 string |  |
-| onTabChange | tab事件监听 |  | antd - TabsProps['onChange'] |  |
-| tabProps | tab透传 |  | antd - TabsProps |  |
-| showModeChange | 是否显示模式切换按钮 |  | boolean |  |
-| viewTopModeButtonList | 模式切换按钮列表 |  | TypeRadio[] |  |
-| modeButtonGroupProps | 模式切换按钮组透传 | RadioGroupProps | - |  |
-| isRelated | 人脸碰撞模型显示\隐藏 | boolean |  |  |
-| relatedImageProps | 人脸碰撞模型透传 | zhst/meta - RelatedImageProps |  |  |
-| cropperImageProps | 场景图模式透传 | ICropperImageProps |  |  |
-| combineImageProps | 对比图模式透传 | ComBineImageProps |  |  |
-| videoProps | 视频模式透传 | videoProps |  |  |
-| showNavigation | 是否展示导航 | boolean |  |  |
-| prevButtonProps | 前翻箭头透传 | prevButtonProps |  |  |
-| onPrevButtonClick | 前翻箭头点击事件 | () => void; |  |  |
-| nextButtonProps | 下翻箭头透传 | () => void; |  |  |
-| onNextButtonClick | 下翻箭头点击事件 | () => void; |  |  |
-| children |  | ReactNode |  |  |
-
-### IDescriptionList
-
-```ts
-interface IDescriptionList {
-  title: string;
-  showTitle?: boolean;
-  props?: DescriptionsProps
-  children: DescriptionsProps['items']
-}[]
-```
-
-### 
-
-```ts
-interface ICropperImageProps extends CropperImageProps {
-  showEditTools?: boolean       // 是否展示编辑按钮
-  editAble?: boolean            // 是否开启编辑模式
-  score?: string | number       // 分数
-  btnGroupProps?: BtnGroupProps;     // crop 场景图模式下的按钮拓展
-  cropButtonList?: TypeRadio[]     // 编辑按钮列表
-  onCropperTypeChange?: (type: RadioProps['onChange']) => void
-  onExitEdit?: ButtonProps['onClick']     // 退出编辑模式
-  attachImageData?: AttachImageProps['data']    // 左下角预览图
-  attachImageProps?: AttachImageProps  // 左下角预览图透传
-}
-```
-
-## 设计方案
-
-结合当下的业务场景，目前大图组件有三种模式
-
-1. 场景图模式
-    - 
-2. 对比图模式
-3. 视频模式
-
-场景图和视频模式，支持用户编辑圈选
-
-三种模式状态下，都会有外层模块的嵌套，目前有以下几种：
-
-1. 描述模块
-2. 顶部拓展
-    - 目前仅支持自定义
-    - 默认下边间距 16px
-3. tabs 切换
-    - 默认下间距：16px
-    - 支持自定义文案
-    - 支持自定义数量
-    - 支持后方插槽
-4. 人脸碰撞模型
-    - 支持用户自定义传入数据
-
-本来想通过插件的形式按需加载
--- a/packages/biz/src/BigImage/index.tsx
+++ b/packages/biz/src/BigImage/index.tsx
@ -1,5 +0,0 @@
-import BigImage from "./BigImage";
-
-export type { BigImageProps, BigImageRef } from './interface'
-
-export default BigImage
--- a/packages/biz/src/BigImage/interface.ts
+++ b/packages/biz/src/BigImage/interface.ts
@ -1,84 +0,0 @@
-import { ReactNode } from 'react'
-import {
-  ButtonProps,
-  RadioProps,
-  RadioGroupProps,
-  VideoViewProps,
-  DescriptionsProps,
-  TabsProps,
-  RelatedImageProps,
-  BtnGroupProps,
-  CropperImageProps,
-  VideoViewRef,
-  AttachImageProps
-} from '@zhst/meta'
-import { ComBineImageProps } from './components/CombineImage'
-
-export type TypeRadio = {
-  label?: string;
-  key: string;
-  tooltipTxt?: string;
-  onClick?: ButtonProps['onClick']
-  icon?: ReactNode | string;
-  props?: ButtonProps
-}
-
-type TypePlugin = 'compater' | 'normal' | 'video' | 'faceMode'
-
-export interface BigImageProps {
-  type?: TypePlugin // 当前 tab
-  viewHeight?: string | number;
-  width?: string | number
-  typePlugins?: TypePlugin[]     // TODO: 开启插件类型
-  // ------------ 描述列表 -----------------
-  showDescription?: boolean;
-  descriptionsProps?: DescriptionsProps
-  descriptionList?: {
-    title: string;
-    showTitle?: boolean;
-    props?: DescriptionsProps
-    children: DescriptionsProps['items']
-  }[]
-  // ------------------ 顶部按钮列表
-  topButtonRender?: ReactNode | string
-  // ---------------- Tabs 导航 ------------------
-  customTabBarExtraContent?: string | ReactNode
-  onTabChange?: TabsProps['onChange']
-  tabProps?: TabsProps
-  // ------------ 图片 ｜ 视频切换导航 -----------------
-  showModeChange?: boolean
-  viewTopModeButtonList?: TypeRadio[]
-  modeButtonGroupProps?: RadioGroupProps
-  // ----------------- 人脸碰转 -----------------
-  isRelated?: boolean   // 人脸碰撞功能打开
-  relatedImageProps?: RelatedImageProps
-  // -------------------------- crop 场景图模式 -----------------------
-  cropperImageProps?: CropperImageProps & {
-    showEditTools?: boolean
-    editAble?: boolean
-    score?: string | number
-    btnGroupProps?: BtnGroupProps;     // crop 场景图模式下的按钮拓展
-    cropButtonList?: TypeRadio[]
-    onCropperTypeChange?: (type: RadioProps['onChange']) => void
-    onExitEdit?: ButtonProps['onClick']
-    attachImageData?: AttachImageProps['data']
-    attachImageProps?: AttachImageProps
-  }
-  // -------------------- 对比图模式 -------------------------
-  combineImageProps?: ComBineImageProps
-  // ------------ 导航 -----------------
-  showNavigation?: boolean    // 是否展示导航箭头
-  prevButtonProps?: any;
-  onPrevButtonClick?: () => void;
-  nextButtonProps?: any
-  onNextButtonClick?: () => void;
-  theme?: any
-  children?: React.ReactNode
-  // ------------ 视频模式 -----------------
-  videoProps?: VideoViewProps
-}
-
-export interface BigImageRef {
-  videoPlayerRef: VideoViewRef
-  combineImageRef: any
-}
--- a/packages/biz/src/BigImage/mock.ts
+++ b/packages/biz/src/BigImage/mock.ts
@ -1,293 +0,0 @@
-// @ts-nocheck
-import imageUrl from './demo/imgs/photo-1503185912284-5271ff81b9a8.webp'
-
-export const IMAGE_DATA = {
-    "enAbleDeleteFeature": true,
-    "tabsFilter": [
-        "COMPATER",
-        "NORMAL"
-    ],
-    "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",
-      "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"
-      ],
-      "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楼门口过道人脸"
-    },
-    "isArchiveDetail": false,
-    "ToolProps": {
-        "renderVideoBtn": true,
-        "disableVideo": false
-    },
-    "specialTitle": ""
-}
-
-export const RELATED_IMAGES = [
-  { key: '123', url: imageUrl },
-  { key: '22', url: imageUrl },
-  { key: '22122333', url: imageUrl },
-  { key: '2212243', url: imageUrl },
-  { key: '224523433', url: imageUrl },
-  { key: '224235453', url: imageUrl },
-  { key: '245423', url: imageUrl },
-  { key: '224233543', url: imageUrl },
-  { key: '22452343', url: imageUrl },
-  { key: '22323243', url: imageUrl },
-  { key: '2236456', url: imageUrl },
-  { key: '224563', url: imageUrl },
-  { key: '24565423', url: imageUrl },
-  { key: '245645623', url: imageUrl },
-  { key: '2456435623', url: imageUrl },
-  { key: '2323', url: imageUrl }
-]
-
-export const BIG_IMAGE_DATA = {
-  imageKey: imageUrl,
-  imgSummary: imageUrl,
-  flvUrl: 'ws://10.0.0.120:9033/flv/HaikangNvr/45.flv?ip=10.0.2.103&stime=1712539148&etime=1712539168',
-  compaterImage: imageUrl,
-  odRect: [
-    {
-      id: '123',
-      "x":0.5445312,
-      "y":0.19166666,
-      "w":0.08671875,
-      "h":0.40138888
-    },
-    {
-      "id": "123",
-      "x": 0.5519352,
-      "y": 0.2965385,
-      "w": 0.05185461,
-      "h": 0.24698898,
-    },
-    {
-      "id": "456",
-      "x": 0.58543766,
-      "y": 0.3203356,
-      "w": 0.052037954,
-      "h": 0.2664015
-    }
-  ],
-  attachImg: [
-    {
-      "url": imageUrl,
-      "label": "形体"
-    },{
-      "url": imageUrl,
-      "label": "人脸"
-    }
-  ],
-  score: 60,   // 人脸质量分
-  showScore: true,   // 人脸质量分
-  cameraPosition: 'string', // 摄像头位置
-  time: '2022-01-01', // 摄像头拍摄时间
-  objects:  [
-    {
-        "objectIndex": {
-            "objectId": "1746832189053474816",
-            "solutionId": "0",
-            "deviceId": "0",
-            "fragmentId": "0"
-        },
-        "objectType": "OBJECT_TYPE_PEDESTRAIN",
-        "sourceObjectId": "0",
-        "level": 0,
-        "confidence": 0.881164,
-        "frameInfo": {
-            "frameId": "0",
-            "frameTimestamp": "1705312223057",
-            "width": 0,
-            "height": 0,
-            "originWidth": 0,
-            "originHeight": 0,
-            "offsetTime": "0",
-            "skipNumber": "0"
-        },
-        "infoOnSource": {
-            "bboxInFrame": {
-                "bboxRatio": {
-                    "x": 0.61418945,
-                    "y": 0.34309354,
-                    "w": 0.067661405,
-                    "h": 0.34659258
-                },
-            },
-            "countInSource": 0,
-            "indexInSource": 0
-        },
-        "qualityScore": 0,
-    }
-  ]
-}
-
-export const attributeList = [
-  {
-    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: '否',
-      },
-    ]
-  },
-  {
-    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: '否',
-      },
-    ]
-  }
-];
--- a/packages/biz/src/BigImage/util/bigImageModalAdapter.tsx
+++ b/packages/biz/src/BigImage/util/bigImageModalAdapter.tsx
@ -1,195 +0,0 @@
-/**
- * 适配老的大屏组件数据格式传入
- */
-import React, { } from 'react';
-import { AlgorithmVersionStr, HumanProperty, ObjectType, Rect, IScreenshotButtonProp } from '@zhst/types'
-import { VideoViewProps, ImgViewProps, VideoViewRef, ImgViewRef } from '@zhst/meta'
-
-export type TAB_TYPE = 'COMPATER' | 'NORMAL' | 'TRACK';
-export type MODEL_TYPE = 'VIDEO' | 'IMAGE';
-
-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'>>;
-
-/**
- * 描述列表 description
- */
-export interface HeaderProps {
-  value: TAB_TYPE;
-  onChange: (type: TAB_TYPE) => void;
-  tabsFilter: TAB_TYPE[];
-}
-
-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 ToolProps {
-  renderRight?: (props: ParamProps) => React.ReactNode;
-  renderLeft?: (props: ParamProps) => React.ReactNode;
-  renderVideoBtn?: boolean;
-  param: ParamProps;
-  disableVideo: boolean;
-}
-
-
-export interface BigImageData {
-  //imageKey 小图
-  extendRectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
-  rectList: (Rect & { algorithmVersion: AlgorithmVersionStr; imageKey: string })[];
-  attachImg: { url: string; label: '形体' | '人脸' }[];
-  odRect: Rect;
-  compaterImages: string[]  // 目标图列表
-  constractKey: string;   // 当前比较中的目标图
-  frameImageKey: string;  // 场景图
-  imageKey?: string; // 大图
-  imgSummary: string; // 摘要图
-  objectExtImageKey: string; //比对到的目标图扩展图 === imgSummary
-
-  attributeList: { label: string; list: any[] }[];
-  archiveImages?: any;
-  spaceName: string;
-
-  objectIndex?: {
-    deviceId: string;
-    fragmentId: string;
-    objectId: string;
-    solutionId: 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;
-  position: {
-    lat: number
-    lng: number
-  }
-
-  solutionId?: string;
-  [index: string]: any;
-}
-
-
-interface IOldImageData {
-  visible?: boolean;    // 显示隐藏弹框
-  defaultModel?: MODEL_TYPE;    //  视频模式 | 图片模式
-  onClose?: () => void;  // 关闭弹框
-  isLoading?: boolean;  // 是否加载中
-  hasPre?: boolean;  // 向前翻页
-  hasNext?: boolean;   // 向后翻页
-  selectIndex?: number;   // 选中的数据（dataSource为数组情况下）
-  onSelectIndexChange?: (i: number) => void;   // 修改当前下标
-  dataSource: BigImageData[];    // 数据1
-  dataSources: BigImageData[];   // 数据2
-  relatedData?: BigImageData[];  // 数据3
-  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;    // 是否显示 description
-  tabsFilter?: TAB_TYPE[];  // tabs 过滤
-  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 ImageModalDataProps {
-  targetData: BigImageData[]
-  compactData: BigImageData[]
-}
-
-export interface ModalAdapterConfigProps {
-  oldMode?: boolean; // 是否是老模式
-}
-
-/**
- * 兼容老数据格式
- * @param _data 老数据格式
- * @returns newData
- */
-const translateOldImageData = (_data: IOldImageData) => {
-  return {
-    ..._data,
-    open: _data.visible,
-    onCancel: _data.onClose
-  }
-}
-
-/**
- * 大图组件适配器，兼容老接口
- * @param Cmp 大图组件
- * @param config 额外配置
- * @returns 大图组件
- */
-const adapter = (Cmp: any, config: ModalAdapterConfigProps): any => {
-  const { oldMode = false } = config
-
-  return (props: IOldImageData) => {
-    const newProps = oldMode ? translateOldImageData(props) : props
-    console.log('adapter----适配数据', props, newProps)
-
-    // 该属性已经废弃
-    delete newProps.visible
-
-    return (
-      <Cmp
-        {...newProps}
-      />
-    )
-  }
-}
-
-
-export default adapter
--- a/packages/biz/src/BigImage/util/interface.ts
+++ b/packages/biz/src/BigImage/util/interface.ts
@ -1,36 +0,0 @@
-export interface IBigImageModalData {
-  imageKey?: string     // 目标图
-  imgSummary?: string   // 大图
-  flvUrl?: string       // 视频链接
-  compaterImages?: string[]   // 对比图
-  odRect?: {          // od 框数据
-    "x": number
-    "y": number
-    "w": number
-    "h": number
-    [key: string]: string | number;   // 拓展参数
-  }[],
-  attachImg?: {          // 小图，只有在场景图模式生效（人脸、形体）
-    "url": string
-    "label": string
-    [key: string]: string
-  }[],
-  score?: number | string   // 人脸质量分
-  showScore?: boolean   // 人脸质量分
-  cameraPosition?: string // 摄像头位置
-  time?: string // 摄像头拍摄时间
-  objects: {             // 拓展参数、可以自由支配
-    objectIndex: {
-      [key: string]: any
-    },
-    objectType: string
-    sourceObjectId: string
-    level: number
-    confidence: number
-    infoOnSource: {
-      [key: string]: any
-    },
-    qualityScore: number
-    [key: string]: any
-  }[]
-}
--- a/packages/biz/src/BigImageModal/BigImageModal.tsx
+++ b/packages/biz/src/BigImageModal/BigImageModal.tsx
@ -1,47 +1,26 @@
 // @ts-nocheck
 import React, { forwardRef, useImperativeHandle, useRef, useState, useEffect } from 'react'
-import {
-  ConfigProvider,
-  Descriptions,
-  Modal,
-  Tabs,
-  Button,
-  CropperImage,
-  AttachImage,
-  VideoPlayer,
-  BtnGroup,
-  RelatedImage
-} from '@zhst/meta';
+import { ConfigProvider, Descriptions, Modal, Tabs, Button, BigImagePreview, VideoPlayer } from '@zhst/meta';
 import classNames from 'classnames'
-import type {
-  ModalProps,
-  DescriptionsProps,
-  TabsProps,
-  VideoViewRef,
-  ImgViewRef,
-  CompareImageProps,
-  CropperImageProps,
-  AttachImageProps,
-  BtnGroupProps,
-  ThemeConfig,
-  RelatedImageProps
-} from '@zhst/meta'
-import { get, isEmpty, pick } from '@zhst/func';
+import type { ModalProps, DescriptionsProps, TabsProps, VideoViewRef, ImgViewRef } from '@zhst/meta'
+import { get, isEmpty } from '@zhst/func';
+
+
+import './index.less'
 import Navigation from './components/navigation';
 import CombineImage from './components/CombineImage'
-import './index.less'
+import { BIG_IMAGE_DATA } from './mock'

 const DescriptionsItem = Descriptions.Item

 export const componentPrefix = 'zhst-image'

-export type TAB_TYPE = 'COMPATER' | 'NORMAL' | 'VIDEO';   // 对比图模式、场景图模式、视频模式
+export type TAB_TYPE = 'COMPATER' | 'NORMAL' | 'VIDEO';
 export type MODEL_TYPE = 'VIDEO' | 'IMAGE';

-export interface BigImageModalProps {
+export interface BigImageModalProps extends ModalProps {
  visible: boolean   // 弹框显示隐藏
  activeTab?: TAB_TYPE // 当前 tab
-  width?: number | string
  attributeList: {
    title: string;
    children: Pick<DescriptionsProps, 'items'>
@ -51,33 +30,18 @@ export interface BigImageModalProps {
      key: TAB_TYPE     // !! TRACK 模式已废弃、新增：VIDEO 模式
    }     // 导航栏列表
  }
-  tabsProps?: TabsProps  // tab菜单的透传
  dataSource: any
-  onCancel?: () => void
+  imageData: any

-  isRelated?: boolean   // 人脸碰撞功能打开
+  relatedData: any
+  isRelated?: boolean

  footer?: React.ReactNode
+  showCarousel?: boolean

  onTabChange?: (newVal?: TAB_TYPE, oldVal?: TAB_TYPE) => void
-
-  compareImageProps?: CompareImageProps
-  modalProps?: ModalProps
-  cropperImageProps?: CropperImageProps & {
-    showEditTools?: boolean
-  }
-  showNavigation?: boolean    // 是否展示箭头
-  prevButtonProps?: any;
-  onPrevButtonClick?: () => void;
-  nextButtonProps?: any
-  onNextButtonClick?: () => void;
-  btnGroupProps?: BtnGroupProps;
-
-  descriptionsProps?: DescriptionsProps
-  relatedImageProps?: RelatedImageProps
-
-  theme?: ThemeConfig
-  children?: React.ReactNode
+  onIndexChange?: (newVal?: number, oldVal?: number) => void
+  transformPropFunc: (data: any) => void   // 格式化数据方法
 }

 interface BigModalRef {
@ -88,6 +52,7 @@ interface BigModalRef {
  setActiveKey: (val: string) => void
  videoPlayerRef: VideoViewRef
  combineImageRef: any
+  bigImagePreviewRef: ImgViewRef
 }

 const initialStyle ={
@ -98,130 +63,79 @@ const BigImageModal: React.FC<BigImageModalProps, BigModalRef> = forwardRef((pro
  const {
    // 配置
    title = '-',
-    width,
    open,
    children,
-    onCancel,
    activeTab,
    attributeList = [],
    isRelated = false,
    tabs = {},
    footer = null,
+    showCarousel = true,
    // 数据
-    dataSource = {},   // 总数据源，只允许有一份
+    dataSource = [],   // 总数据源，只允许有一份
+    imageData = [],
+    relatedData = [],
    // 事件
+    onIndexChange,
    onTabChange,
-    compareImageProps,
-    showNavigation,
-    modalProps,
-    cropperImageProps,
-    prevButtonProps,
-    onPrevButtonClick,
-    onNextButtonClick,
-    nextButtonProps,
-    tabsProps,
-    btnGroupProps,
-    descriptionsProps,
-    relatedImageProps,
-    theme,
+    transformPropFunc
  } = props

  const combineImageRef = useRef(null)
+  const bigImagePreviewRef = useRef(null)
  const videoPlayerRef = useRef(null)
  const modalRef = useRef(null)

  // ========================== 头切换 =========================
-  const [tab, setTab] = useState<TAB_TYPE>(activeTab || get(tabsProps, 'data[0].key'));
+  const [tab, setTab] = useState<TAB_TYPE>(activeTab || get(tabsConfig, 'data[0].key'));
  const [activeKey, setActiveKey] = useState<string>('related');

  // ========================= 预览切换下标 =========================
-  const [cropType, setCropType] = useState<'auto' | 'custom' | 'close'>('auto')
-  const cropBtnDataSource = [
-    {
-      key: 'close',
-      icon: 'icon-danchuangguanbi',
-      title: '退出',
-    },
-    {
-      key: 'auto',
-      icon: 'icon-zidong',
-      title: '智能框选',
-    },
-    {
-      key: 'custom',
-      icon: 'icon-shoudong',
-      title: '手动框选',
-    },
-  ];
+  const [currentIndex, setCurrentIndex] = useState<number>(0)

-  const handleCropBtnClick = (v: string) => {
-    setCropType(v)
+  const tabsConfig = !isEmpty(tabs) ? tabs : {
+    data: [
+        {
+          label: '对比图模式',
+          key: 'COMPATER',
+          children: (
+            <CombineImage
+              ref={combineImageRef}
+              data={dataSource[currentIndex] || {}}
+            />
+          )
+        },
+        {
+          label: '场景图模式',
+          key: 'NORMAL',
+          children: (
+            <BigImagePreview
+              ref={bigImagePreviewRef}
+              height={'500px'}
+              data={dataSource[currentIndex]}
+            />
+          )
+        }
+      ]
  }

-  const defaultTabsProps: TabsProps = !isEmpty(tabs) ? tabs : {
-    items: [
-      {
-        label: '对比图模式',
-        key: 'COMPATER',
-        children: (
-          <CombineImage
-            ref={combineImageRef}
-            data={pick(dataSource, 'compaterImage', 'imgSummary', 'imageKey', 'score')}
-            {...compareImageProps}
-          />
-        )
-      },
-      {
-        label: '场景图模式',
-        key: 'NORMAL',
-        children: (
-          <div style={{ display: 'flex', justifyContent: 'center', width: '100%' }}>
-            <div style={{ width: '85%', height: '500px' }}>
-              <CropperImage
-                type='rect'
-                odList={get(dataSource, 'odRect', [])}
-                {...cropperImageProps}
-              >
-                {!cropperImageProps?.editAble && (
-                  <>
-                    <AttachImage
-                      data={[
-                        { label: '测试', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' }
-                      ]}
-                    />
-                    <div
-                      style={{
-                        position: 'absolute',
-                        right: '24px',
-                        bottom: '24px',
-                        fontSize: '18px',
-                        color: 'red',
-                        cursor: 'default'
-                      }}
-                    >{`人脸质量分：${(Number(cropperImageProps?.score) as number).toFixed(2)}`}</div>
-                  </>
-                )}
-                {cropperImageProps?.showEditTools && (
-                  <BtnGroup
-                    circle
-                    style={{
-                      position: 'absolute',
-                      top: 0,
-                      right: 0
-                    }}
-                    dataSource={cropBtnDataSource}
-                    onClick={handleCropBtnClick}
-                    selectKey={cropType}
-                    {...btnGroupProps}
-                  />
-                )}
-              </CropperImage>
-            </div>
-          </div>
-        )
-      }
-    ]
-  }
+
+  // TODO: 页面初始化
+  useEffect(() => {
+    (async () => {
+      let data: any = {};
+      // if (isRelated) {
+      //   data = await transformPropFunc(imageData[currentIndex]);
+      // } else {
+      //   data = await transformPropFunc(dataSource[currentIndex]);
+      // }
+      // setAttributeList(get(data, 'attributeList', []));
+      //防背推
+      // if (currentIndex === latestSelectIndex.current) {
+      //   setSelectItem(data);
+      // }
+    })();
+  }, [currentIndex, dataSource, imageData, isRelated]);

  // 暴露 ref 实例
  useImperativeHandle(ref, () => ({
@ -233,19 +147,18 @@ const BigImageModal: React.FC<BigImageModalProps, BigModalRef> = forwardRef((pro
    setActiveKey,
    videoPlayerRef,
    combineImageRef,
+    bigImagePreviewRef,
  }));

  return (
    <Modal
      destroyOnClose
-      width={width}
      open={open}
      ref={modalRef}
      footer={footer}
      className={componentPrefix}
      title={title}
-      onCancel={onCancel}
-      {...modalProps}
+      {...props}
    >
      <div
        style={{
@ -266,7 +179,6 @@ const BigImageModal: React.FC<BigImageModalProps, BigModalRef> = forwardRef((pro
                contentColor: 'rgba(0,0,0,0.88)',
              },
            },
-            ...theme
          }}
        >
          {attributeList.map(descriptions => (
@ -279,7 +191,6 @@ const BigImageModal: React.FC<BigImageModalProps, BigModalRef> = forwardRef((pro
              }
              column={8}
              style={{ padding: '0 64px' }}
-              {...descriptionsProps}
            >
              {descriptions?.children?.map(item => (
                <DescriptionsItem
@ -307,49 +218,70 @@ const BigImageModal: React.FC<BigImageModalProps, BigModalRef> = forwardRef((pro
              })
            }}
            tabBarStyle={{ fontSize: '18px', fontWeight:'bold' }}
-            {...defaultTabsProps}
-            {...tabsProps}
+            items={tabsConfig.data}
+            {...tabsConfig}
          />
          {/* --------------------------------- 视频播放模式 --------------------------------- */}
          {tab === 'VIDEO' && (
-            <VideoPlayer ref={videoPlayerRef} url={dataSource?.flvUrl} />
+            <VideoPlayer ref={videoPlayerRef} url={dataSource[currentIndex]?.flvUrl} />
          )}
          {/* 切换按钮组件 */}
          {/* ----------------------------------- 上一张按钮 ---------------------------------- */}
          <Navigation
            className={classNames(
              `${componentPrefix}-view-container__nav`,
-              prevButtonProps?.disabled && `${componentPrefix}-view-container__nav--disabled`,
+              currentIndex <= 0 && `${componentPrefix}-view-container__nav--disabled`,
              `${componentPrefix}-view-container__nav--left`
            )}
+            show={isRelated ? (imageData.length > 1) : (dataSource.length > 1)}
+            disabled={currentIndex <= 0}
            prev
-            show={showNavigation}
-            onClick={onPrevButtonClick}
-            {...prevButtonProps}
+            onClick={() => {
+              setCurrentIndex((pre) => {
+                onIndexChange?.(pre - 1, pre)
+                return pre - 1
+              });
+            }}
          />
          {/* ----------------------------------- 下一张按钮 ---------------------------------- */}
          <Navigation
            className={classNames(
              `${componentPrefix}-view-container__nav`,
-              nextButtonProps?.disabled && `${componentPrefix}-view-container__nav--disabled`,
+              ((currentIndex >= imageData.length - 1) || (currentIndex >= dataSource.length - 1)) && `${componentPrefix}-view-container__nav--disabled`,
              `${componentPrefix}-view-container__nav--right`
            )}
+            show={isRelated ? (imageData.length > 1) : (dataSource.length > 1)}
+            disabled={((currentIndex >= imageData.length - 1) || (currentIndex >= dataSource.length - 1))}
            next
-            show={showNavigation}
-            onClick={onNextButtonClick}
-            {...nextButtonProps}
+            onClick={async (e) => {
+              setCurrentIndex((pre) => {
+                onIndexChange?.(pre + 1, pre)
+                return pre + 1
+              });
+            }}
          />
-          {/* ----------------------------------- 人脸碰撞组件 ---------------------------------- */}
-          {isRelated && (
-            <div style={{ margin: '24px 0' }}>
-              <RelatedImage
-                {...relatedImageProps}
+          {/* --------------------------------- 模型碰撞组件 --------------------------------- */}
+          {/* {isRelated && (
+            <div className="relatedWrapper">
+              <Tabs
+                className="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>
-          )}
+          )} */}
        </div>
      </div>
-      {children}
    </Modal>
  )
 })
--- a/packages/biz/src/BigImageModal/components/CombineImage/index.tsx
+++ b/packages/biz/src/BigImageModal/components/CombineImage/index.tsx
@ -1,33 +1,22 @@

-import React, { FC, useRef, forwardRef, useImperativeHandle } from 'react';
+import React, { FC, useRef, forwardRef, useImperativeHandle, useState } from 'react';
 import { CompareImage, Flex, Score } from '@zhst/meta'

 interface ComBineImageProps {
    data: {
      imgSummary: string;
-      compaterImage: string;
+      compaterImages: string[];
      imageKey: string;
      score: number;
    }
-    prevDisable?: boolean;
-    nextDisable?: boolean;
-    onPre?: () => void;
-    onNext?: () => void;
-    openRoll?: boolean
 }

 const ComBineImage: FC<ComBineImageProps> = forwardRef((props, ref) => {
-  const {
-    data,
-    prevDisable,
-    nextDisable,
-    onNext,
-    onPre,
-    openRoll
-  } = props
-  const { imgSummary, compaterImage, score } = data
+  const { data } = props
+  const { imgSummary, compaterImages = [] } = data
  const targetImageRef = useRef(null)
  const compareImageRef = useRef(null)
+  const [targetIndex, setTargetIndex] = useState(compaterImages.findIndex(_url => imgSummary === _url) || 0)

  useImperativeHandle(ref, () => ({
    compareImageRef,
@ -38,21 +27,21 @@ const ComBineImage: FC<ComBineImageProps> = forwardRef((props, ref) => {
    <Flex justify='space-evenly' align='center' style={{ padding:'0 32px' }}>
      <CompareImage
        ref={targetImageRef}
-        preDisable={prevDisable}
-        nextDisable={nextDisable}
-        onNext={onNext}
-        onPre={onPre}
+        preDisable={targetIndex === 0}
+        nextDisable={targetIndex >= compaterImages.length - 1}
+        onNext={() => setTargetIndex(targetIndex + 1)}
+        onPre={() => setTargetIndex(targetIndex - 1)}
        showScore={false}
-        openRoll={openRoll}
-        url={imgSummary}
+        openRoll={!!compaterImages.length}
+        url={compaterImages[targetIndex] || imgSummary}
        label="目标图"
      />
-      <Score score={score} />
+      <Score score={data.score} />
      <CompareImage
        ref={compareImageRef}
-        url={compaterImage}
+        url={data.imageKey}
        openRoll={false}
-        score={score}
+        score={data.score}
        label="对比图"
      />
    </Flex>
--- a/packages/biz/src/BigImageModal/components/navigation/index.less
+++ b/packages/biz/src/BigImageModal/components/navigation/index.less
@ -17,7 +17,7 @@

  :global {
    i:hover {
-      color: #fff !important;
+      color: #f0f0f0 !important;
    }
  }

@ -35,10 +35,10 @@
  }

  &-prev {
-    left: 12px;
+    left: 20px;
  }

  &-next {
-    right: 12px;
+    right: 20px;
  }
 }
--- a/packages/biz/src/BigImageModal/components/navigation/index.tsx
+++ b/packages/biz/src/BigImageModal/components/navigation/index.tsx
@ -1,7 +1,6 @@
 import * as React from 'react';
 import classnames from 'classnames';
-import { Button } from '@zhst/meta';
-import { IconFont } from '@zhst/icon'
+import { Icon, Button } from '@zhst/meta';
 import './index.less';

 const componentName = `zhst-image__nav`;
@ -29,8 +28,8 @@ const Navigation: React.FC<{
        className
      )}
    >
-      <Button type="text" disabled={disabled} shape='circle' onClick={onClick}>
-        <IconFont size={28} color={color} icon={prev ? 'icon-qiehuanzuo' : 'icon-qiehuanyou'} />
+      <Button type="text" disabled={disabled} onClick={onClick}>
+        <Icon size={28} color={color} icon={prev ? 'icon-qiehuanzuo' : 'icon-qiehuanyou'} />
      </Button>
    </div>
  );
--- a/packages/biz/src/BigImageModal/demo/index.tsx
+++ b/packages/biz/src/BigImageModal/demo/index.tsx
@ -11,8 +11,6 @@ const BigModal = (props: any) => {
  } = props
  const [visible, setVisible] = useState(true)
  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [selectedItemKey, setSelectedItemKey] = useState()
-  const [editAble, setEditAble] = useState(false)
  const modalRef = useRef(null)

  useEffect(() => {
@ -31,30 +29,19 @@ const BigModal = (props: any) => {
        footer={(
          <Space>
            <Button onClick={() => modalRef.current?.setTab('VIDEO')} >查看视频</Button>
-            <Button onClick={() => modalRef.current?.setTab('COMPATER')} >对比图模式</Button>
+            <Button onClick={() => modalRef.current?.bigImagePreviewRef.current.setShowCrop(true)} >编辑模式</Button>
+            <Button onClick={() => modalRef.current?.bigImagePreviewRef.current.setShowCrop(false)} >取消编辑</Button>
          </Space>
        )}
-        showNavigation
        open={visible}
        ref={modalRef}
        onCancel={() => setVisible(false)}
        dataSource={dataSource}
-        onTabChange={(newVal, oldVal) => console.log(oldVal, newVal)}
+        imageData={dataSource}
+        onIndexChange={(oldVal, newVal) => console.log(oldVal, newVal)}
+        onTabChange={(oldVal, newVal) => console.log(oldVal, newVal)}
        width={1098}
        attributeList={attributeList}
-        cropperImageProps={{
-          editAble,
-          url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-          score: 50,
-          showEditTools: true
-        }}
-        btnGroupProps={{
-          onClick: v => {
-            v === 'custom' && setEditAble(true)
-            v === 'close' && setEditAble(false)
-            v === 'auto' && console.log('自动补点')
-          }
-        }}
      >
      </BigImageModal>
    </div>
--- a/packages/biz/src/BigImageModal/demo/noDescription.tsx
+++ b/packages/biz/src/BigImageModal/demo/noDescription.tsx
@ -1,57 +0,0 @@
-// @ts-nocheck
-import React, { useEffect, useRef, useState } from 'react';
-import { BigImageModal } from '@zhst/biz'
-import { Button, Space } from '@zhst/meta'
-import { BIG_IMAGE_DATA, attributeList } from '../mock'
-
-
-
-const BigModal = (props: any) => {
-  const {
-  } = props
-  const [visible, setVisible] = useState(false)
-  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [selectedItemKey, setSelectedItemKey] = useState()
-  const [editAble, setEditAble] = useState(false)
-  const modalRef = useRef(null)
-
-  useEffect(() => {
-    console.log(modalRef.current)
-  }, [modalRef.current?.currentIndex])
-
-  useEffect(() => {
-    console.log(modalRef.current)
-  }, [])
-
-  return (
-    <div>
-      <Button onClick={() => setVisible(true)} >查看大图</Button>
-      <BigImageModal
-        title="查看大图"
-        showNavigation
-        open={visible}
-        ref={modalRef}
-        onCancel={() => setVisible(false)}
-        dataSource={dataSource}
-        onTabChange={(newVal, oldVal) => console.log(oldVal, newVal)}
-        width={1098}
-        cropperImageProps={{
-          editAble,
-          url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-          score: 50,
-          showEditTools: true
-        }}
-        btnGroupProps={{
-          onClick: v => {
-            v === 'custom' && setEditAble(true)
-            v === 'close' && setEditAble(false)
-            v === 'auto' && console.log('自动补点')
-          }
-        }}
-      >
-      </BigImageModal>
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImageModal/demo/withRelatedImage.tsx
+++ b/packages/biz/src/BigImageModal/demo/withRelatedImage.tsx
@ -1,59 +0,0 @@
-// @ts-nocheck
-import React, { useEffect, useRef, useState } from 'react';
-import { BigImageModal } from '@zhst/biz'
-import { Button, Space } from '@zhst/meta'
-import { BIG_IMAGE_DATA, attributeList, RELATED_IMAGES } from '../mock'
-
-const BigModal = (props: any) => {
-  const {
-  } = props
-  const [visible, setVisible] = useState(false)
-  const [dataSource, setDataSource] = useState(BIG_IMAGE_DATA)
-  const [selectedItemKey, setSelectedItemKey] = useState()
-  const [editAble, setEditAble] = useState(false)
-  const modalRef = useRef(null)
-
-  return (
-    <div>
-      <Button onClick={() => setVisible(true)} >查看大图</Button>
-      <BigImageModal
-        title="查看大图"
-        showNavigation
-        open={visible}
-        ref={modalRef}
-        onCancel={() => setVisible(false)}
-        dataSource={dataSource}
-        onTabChange={(newVal, oldVal) => console.log(oldVal, newVal)}
-        width={1098}
-        attributeList={attributeList}
-        cropperImageProps={{
-          editAble,
-          url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-          score: 50,
-          showEditTools: true
-        }}
-        btnGroupProps={{
-          onClick: v => {
-            v === 'custom' && setEditAble(true)
-            v === 'close' && setEditAble(false)
-            v === 'auto' && console.log('自动补点')
-          }
-        }}
-        isRelated
-        relatedImageProps={{
-          carouselWidth: '900px',
-          activeTab: 'related',
-          selectedItemKey,
-          data: RELATED_IMAGES,
-          onCancel: () => console.log('取消关联'),
-          onConnect: () => console.log('关联'),
-          onTabChange: (newVal, oldVal) => console.log('tab切换', newVal, oldVal),
-          onItemSelecteditem: (item) => setSelectedItemKey(item.key)
-        }}
-      >
-      </BigImageModal>
-    </div>
-  )
-}
-
-export default BigModal
--- a/packages/biz/src/BigImageModal/index.less
+++ b/packages/biz/src/BigImageModal/index.less
@ -160,6 +160,75 @@
  }
 }

+.zhst-image__carousel {
+  position: relative;
+  display: flex;
+  width: 742px;
+  height: 100px;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid #f0f0f0;
+  margin: 0 auto;
+  background: #fafafa;
+  border-radius: 2px;
+  user-select: none;
+
+  &-container {
+    width: (58px + 8px) * 10;
+  }
+
+  &-item {
+    display: flex;
+    width: 58px + 8px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &-item-img {
+    /* 尝试消除transform 副作用 */
+    position: relative;
+    z-index: 99;
+
+    // width: 58px;
+    // height: 76px;
+    display: flex;
+    width: 66px;
+    height: 84px;
+    box-sizing: border-box;
+    align-items: center;
+    justify-content: center;
+    background: #fafafa;
+    cursor: pointer;
+
+    /* 尝试消除transform 副作用 end */
+    &--active {
+      border: 2px solid #09f;
+      border-radius: 1px;
+    }
+
+    &>div {
+      /* 尝试消除transform 副作用 */
+      position: relative;
+      z-index: 99;
+      overflow: hidden;
+      width: 58px;
+      height: 76px;
+
+      /* 尝试消除transform 副作用 end */
+      &>img {
+        width: 58px;
+        height: 76px;
+        object-fit: contain;
+        transition: all 0.2s;
+
+        &:hover {
+          transform: scale(1.5);
+        }
+      }
+    }
+  }
+}
+
 .zhst-image__trackmodel {
  &__panel {
    position: relative;
@ -385,3 +454,61 @@
  }
 }

+.relatedWrapper {
+  width: 100%;
+  height: 100px;
+  padding: 0 30px;
+  margin-bottom: 30px;
+  box-sizing: border-box;
+
+  .relatedTabs {
+    width: 100%;
+    height: 100px;
+  }
+
+  .relatedContent {
+    width: 100%;
+    height: 100px;
+    display: flex;
+
+    .relatedPics {
+      width: 742px;
+      height: 100px;
+    }
+
+    .disabled {
+      color: rgba(0, 0, 0, 25%);
+    }
+
+    .relatedBtn {
+      flex: 1;
+      font-size: 14px;
+      color: #333;
+      display: flex;
+      align-items: flex-end;
+      cursor: pointer;
+
+      &:hover {
+        color: #09f;
+      }
+    }
+  }
+
+  :global {
+    .ant-tabs-left>.ant-tabs-content-holder>.ant-tabs-content>.ant-tabs-tabpane {
+      padding-left: 16px;
+    }
+
+    .ant-tabs-tab {
+      padding: 8px 12px !important;
+      text-align: right !important;
+    }
+
+    .ant-tabs .ant-tabs-tab {
+      font-size: 14px;
+      font-weight: bold;
+      text-align: right;
+      justify-content: flex-end;
+    }
+  }
+}
--- a/packages/biz/src/BigImageModal/index.md
+++ b/packages/biz/src/BigImageModal/index.md
@ -2,93 +2,14 @@
 group: 进阶组件
 category: Components
 subtitle: 大图预览组件
-toc: content
 title: BigImagePreview 大图预览组件
 demo:
  cols: 2
 ---

-## 大图弹框
+
+# 大图弹框

 <code src="./demo/index.tsx">基本</code>
-<code src="./demo/withRelatedImage.tsx">人脸碰撞模型</code>
-<code src="./demo/noDescription.tsx">不要描述</code>
-
-### API
-
-| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
-| dataSource | 数据源 | DataProps | - |  |
-| visible | 弹框显示隐藏 | boolean | - |  |
-| activeTab | 模式 | 'COMPATER' 'NORMAL' 'VIDEO' | - | 对比图模式、场景图模式、视频模式 |
-| width | 宽度 | string number | - |  |
-| attributeList | 图片列表 | IAttributeList | - |  |
-| tabs | 图片列表 | DataProps | - |  |
-| tabsProps | tab菜单的透传,参考 antd-tabs | TabsProps | - |  |
-| onTabChange | tab切换 | (newVal?: TAB_TYPE, oldVal?: TAB_TYPE) => void | - |  |
-| isRelated | 人脸碰撞功能 | boolean | - |  |
-| footer | 底部dom | React.ReactNode | - |  |
-| onCancel | 关闭弹框 | () => void | - |  |
-| compareImageProps | 参考@zhst/meta-CompareImage  | CompareImageProps | - |  |
-| modalProps |  参考antd-Modal | ModalProps | - |  |
-| cropperImageProps |  参考@zhst/meta-cropperImage | cropperImageProps | - |  |
-| prevButtonProps |  上一页透传 | any | - |  |
-| onPrevButtonClick | 上一页 |  () => void | - |  |
-| nextButtonProps |  下一页透传 | any | - |  |
-| onNextButtonClick |  下一页 |  () => void | - |  |
-| btnGroupProps |  参考@zhst/meta-btnGroup | ModalProps | - |  |
-| descriptionsProps |  参考antd-descriptions | ModalProps | - |  |
-| relatedImageProps |  参考@zhst/meta-relatedImage | RelatedImageProps | - |  |
-| theme |  参考antd-themeConfig | ThemeConfig | - |  |
-| children |  参考antd-Modal | React.ReactNode | - |  |
-
-### IBigImageModalData
-
-```js
-export interface IBigImageModalData {
-  imageKey?: string     // 目标图
-  imgSummary?: string   // 大图
-  flvUrl?: string       // 视频链接
-  compaterImage?: string   // 对比图
-  odRect?: {          // od 框数据
-    "x": number
-    "y": number
-    "w": number
-    "h": number
-    [key: string]: string | number;   // 拓展参数
-  }[],
-  attachImg?: {          // 小图，只有在场景图模式生效（人脸、形体）
-    "url": string
-    "label": string
-    [key: string]: string
-  }[],
-  score?: number | string   // 人脸质量分
-  showScore?: boolean   // 人脸质量分
-  cameraPosition?: string // 摄像头位置
-  time?: string // 摄像头拍摄时间
-  objects: {             // 拓展参数、可以自由支配
-    objectIndex: {
-      [key: string]: any
-    },
-    objectType: string
-    sourceObjectId: string
-    level: number
-    confidence: number
-    infoOnSource: {
-      [key: string]: any
-    },
-    qualityScore: number
-    [key: string]: any
-  }[]
-}
-```
-
-### IAttributeList
-
-```js
-type IAttributeList {
-  title: string;
-  children: Pick<DescriptionsProps, 'items'>
-}[]
-```
+<code src="./demo/oldData.tsx">老数据版本</code>

--- a/packages/biz/src/BigImageModal/mock.ts
+++ b/packages/biz/src/BigImageModal/mock.ts
@ -11,94 +11,268 @@ export const IMAGE_DATA = {
        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",
-      "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"
-      ],
-      "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楼门口过道人脸"
-    },
+    "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",
+            "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"
+            ],
+            "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",
+            "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": [],
+            "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",
+            "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"
+            ],
+            "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,
@ -107,104 +281,163 @@ export const IMAGE_DATA = {
    "specialTitle": ""
 }

-export const RELATED_IMAGES = [
-  { key: '123', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '22', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '22122333', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '2212243', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '224523433', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '224235453', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '245423', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '224233543', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '22452343', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '22323243', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '2236456', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '224563', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '24565423', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '245645623', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '2456435623', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' },
-  { key: '2323', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' }
-]
-
-export const BIG_IMAGE_DATA = {
-  imageKey: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
-  imgSummary: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-  flvUrl: 'ws://10.0.0.120:9033/flv/HaikangNvr/45.flv?ip=10.0.2.103&stime=1712539148&etime=1712539168',
-  compaterImage: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
-  odRect: [
+export const BIG_IMAGE_DATA = [
    {
-      id: '123',
-      "x":0.5445312,
-      "y":0.19166666,
-      "w":0.08671875,
-      "h":0.40138888
-    },
-    {
-      "id": "123",
-      "x": 0.5519352,
-      "y": 0.2965385,
-      "w": 0.05185461,
-      "h": 0.24698898,
-    },
-    {
-      "id": "456",
-      "x": 0.58543766,
-      "y": 0.3203356,
-      "w": 0.052037954,
-      "h": 0.2664015
-    }
-  ],
-  attachImg: [
-    {
-      "url": "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-      "label": "形体"
-    },{
-      "url": "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
-      "label": "人脸"
-    }
-  ],
-  score: '0.6',   // 人脸质量分
-  showScore: true,   // 人脸质量分
-  cameraPosition: 'string', // 摄像头位置
-  time: '2022-01-01', // 摄像头拍摄时间
-  objects:  [
-    {
-        "objectIndex": {
-            "objectId": "1746832189053474816",
-            "solutionId": "0",
-            "deviceId": "0",
-            "fragmentId": "0"
-        },
-        "objectType": "OBJECT_TYPE_PEDESTRAIN",
-        "sourceObjectId": "0",
-        "level": 0,
-        "confidence": 0.881164,
-        "frameInfo": {
-            "frameId": "0",
-            "frameTimestamp": "1705312223057",
-            "width": 0,
-            "height": 0,
-            "originWidth": 0,
-            "originHeight": 0,
-            "offsetTime": "0",
-            "skipNumber": "0"
-        },
-        "infoOnSource": {
-            "bboxInFrame": {
-                "bboxRatio": {
-                    "x": 0.61418945,
-                    "y": 0.34309354,
-                    "w": 0.067661405,
-                    "h": 0.34659258
-                },
+      imageKey: 'http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622934503424.jpg',
+      imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+      flvUrl: 'ws://10.0.0.120:9033/flv/Sip/34020000001310000301.flv?ip=10.0.0.120&stime=1704815972&etime=1704815992',
+      compaterImages: [
+        'http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg',
+        "http://10.0.0.120:30003/file/public/public_20240117/file/dfdd3340-53c8-4dc4-9921-f13230aa0355.jpg"
+      ],
+      odRect: {
+        "x":0.5445312,
+        "y":0.19166666,
+        "w":0.08671875,
+        "h":0.40138888
+      },
+      attachImg: [
+        {
+          "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894622695428096.jpg",
+          "label": "形体"
+        },{
+          "url": "http://10.0.0.120:30003/file/singer-20240110/1/5/1744894588427964418.jpg",
+          "label": "人脸"
+        }
+      ],
+      score: '0.6',   // 人脸质量分
+      showScore: true,   // 人脸质量分
+      cameraPosition: 'string', // 摄像头位置
+      time: '2022-01-01', // 摄像头拍摄时间
+      objects:  [
+        {
+            "objectIndex": {
+                "objectId": "1746832189053474816",
+                "solutionId": "0",
+                "deviceId": "0",
+                "fragmentId": "0"
            },
-            "countInSource": 0,
-            "indexInSource": 0
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "sourceObjectId": "0",
+            "level": 0,
+            "confidence": 0.881164,
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1705312223057",
+                "width": 0,
+                "height": 0,
+                "originWidth": 0,
+                "originHeight": 0,
+                "offsetTime": "0",
+                "skipNumber": "0"
+            },
+            "infoOnSource": {
+                "bboxInFrame": {
+                    "bboxRatio": {
+                        "x": 0.61418945,
+                        "y": 0.34309354,
+                        "w": 0.067661405,
+                        "h": 0.34659258
+                    },
+                },
+                "countInSource": 0,
+                "indexInSource": 0
+            },
+            "qualityScore": 0,
+        }
+      ]
+    },
+    {
+      imageKey: 'http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581994436608.jpg',
+      imgSummary: "http://10.0.0.120:30003/file/singer-20240117/1/5/1747536346412488704.jpg",
+      odRect:{
+        "x":0.553125,"y":0.29722223,"w":0.048958335,"h":0.2462963
+      },
+      attachImg: [
+        {
+          "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795581163964416.jpg","label": "形体"
+        },{
+          "url": "http://10.0.0.120:30003/file/singer-20240115/1/9/1746795546867140608.jpg",
+          "label": "人脸"
+        }
+      ],
+      flvUrl: 'ws://10.0.0.120:9033/flv/HaikangNvr/34.flv?ip=10.0.2.103&stime=1705302394&etime=1705302414',
+      score: 0.815207,   // 人脸质量分
+      showScore: true,   // 人脸质量分
+      cameraPosition: 'string', // 摄像头位置
+      time: '2022-01-01', // 摄像头拍摄时间
+      objects: [
+        {
+            "objectIndex": {
+                "objectId": "1746816737430472704",
+                "solutionId": "0",
+                "deviceId": "0",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "sourceObjectId": "0",
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1705308539109",
+                "width": 0,
+                "height": 0,
+                "originWidth": 0,
+                "originHeight": 0,
+                "offsetTime": "0",
+                "skipNumber": "0"
+            },
+            "infoOnSource": {
+                "bboxInFrame": {
+                    "bboxRatio": {
+                        "x": 0.5519352,
+                        "y": 0.2965385,
+                        "w": 0.05185461,
+                        "h": 0.24698898
+                    },
+                },
+                "countInSource": 0,
+                "indexInSource": 0
+            },
+            "qualityScore": 0,
        },
-        "qualityScore": 0,
+        {
+            "objectIndex": {
+                "objectId": "1746816737430472705",
+                "solutionId": "0",
+                "deviceId": "0",
+                "fragmentId": "0"
+            },
+            "objectType": "OBJECT_TYPE_PEDESTRAIN",
+            "sourceObjectId": "0",
+            "level": 0,
+            "confidence": 0.9310699,
+            "frameInfo": {
+                "frameId": "0",
+                "frameTimestamp": "1705308539109",
+                "width": 0,
+                "height": 0,
+                "originWidth": 0,
+                "originHeight": 0,
+                "offsetTime": "0",
+                "skipNumber": "0"
+            },
+            "infoOnSource": {
+                "bboxInFrame": {
+                    "bboxRatio": {
+                        "x": 0.58543766,
+                        "y": 0.3203356,
+                        "w": 0.052037954,
+                        "h": 0.2664015
+                    },
+                },
+                "countInSource": 0,
+                "indexInSource": 0
+            },
+            "qualityScore": 0,
+        }
+    ]
    }
-  ]
-}
+]

 export const attributeList = [
  {
--- a/packages/biz/src/BigImageModal/util/interface.ts
+++ b/packages/biz/src/BigImageModal/util/interface.ts
@ -1,36 +0,0 @@
-export interface IBigImageModalData {
-  imageKey?: string     // 目标图
-  imgSummary?: string   // 大图
-  flvUrl?: string       // 视频链接
-  compaterImages?: string[]   // 对比图
-  odRect?: {          // od 框数据
-    "x": number
-    "y": number
-    "w": number
-    "h": number
-    [key: string]: string | number;   // 拓展参数
-  }[],
-  attachImg?: {          // 小图，只有在场景图模式生效（人脸、形体）
-    "url": string
-    "label": string
-    [key: string]: string
-  }[],
-  score?: number | string   // 人脸质量分
-  showScore?: boolean   // 人脸质量分
-  cameraPosition?: string // 摄像头位置
-  time?: string // 摄像头拍摄时间
-  objects: {             // 拓展参数、可以自由支配
-    objectIndex: {
-      [key: string]: any
-    },
-    objectType: string
-    sourceObjectId: string
-    level: number
-    confidence: number
-    infoOnSource: {
-      [key: string]: any
-    },
-    qualityScore: number
-    [key: string]: any
-  }[]
-}
--- a/packages/biz/src/CustomCard/components/commonCard/CommonCard.tsx
+++ b/packages/biz/src/CustomCard/components/commonCard/CommonCard.tsx
@ -1,102 +0,0 @@
-/**
- * Created by jiangzhixiong on 2024/04/28
- */
-
-import React, { forwardRef, ReactNode, useContext, useImperativeHandle } from 'react'
-import { ConfigProvider, EMPTY_BASE64 } from '@zhst/meta'
-import { Image } from 'antd';
-import './index.less'
-
-const { ConfigContext } = ConfigProvider
-
-export interface IData {
-  id?: string | number;
-  url?: string;
-  sort?: number;
-  title?: string;
-  subtitle?: string;
-}
-
-export interface CommonCardProps extends IData {
-  prefixCls?: string;
-  data?: IData
-  width?: string;
-  height?: string;
-  onCreateTxt?: string;
-  onCreate?: () => void;
-  onAddTxt?: string;
-  onAdd?: (data: any) => void;
-  onRemoveTxt?: string;
-  onRemove?: (data: any) => void;
-  actions?: ReactNode[]
-  onItemClick?: (data: any, e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-}
-
-export interface CommonCardRefProps {
-}
-
-const CommonCard = forwardRef<CommonCardRefProps, CommonCardProps>((props, ref) => {
-  const {
-    prefixCls: customizePrefixCls,
-    url,
-    id,
-    title,
-    subtitle,
-    sort,
-    data,
-    actions = [],
-    width = '184px',
-    height = '100%',
-    onItemClick
-  } = props
-  const { getPrefixCls } = useContext(ConfigContext)
-  const componentName = getPrefixCls('biz-search-card', customizePrefixCls);
-
-  const optionListRender = (_actions: ReactNode[]) => {
-    return _actions.map((action, i) => (
-      // eslint-disable-next-line react/no-array-index-key
-      <li key={`${componentName}-main-opt-action-${i}`}>
-        {action}
-        {i !== _actions.length - 1 && <em className={`${componentName}-main-opt-action-split`} />}
-      </li>
-    ))
-  }
-
-  const handleItemClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, _data: IData | undefined) => {
-    onItemClick?.(data, e)
-  }
-
-  useImperativeHandle(ref, () => ({
-  }))
-
-  return (
-    <div
-      className={componentName}
-      style={{
-        width,
-        height
-      }}
-      onClick={e => handleItemClick(e, data)}
-    >
-      <div className={`${componentName}-main`}>
-        <i className={`${componentName}-main-num`}>{sort || id}</i>
-        <Image
-          className={`${componentName}-main-img`}
-          src={url || data?.url}
-          height={'240px'}
-          preview={false}
-          fallback={EMPTY_BASE64}
-        />
-        <ul className={`${componentName}-main-opt`}>
-          {optionListRender(actions)}
-        </ul>
-      </div>
-      <div className={`${componentName}-footer`}>
-        <p className={`${componentName}-footer-tit`}>{title || data?.title}</p>
-        <p className={`${componentName}-footer-subtitle`}>{subtitle || data?.subtitle}</p>
-      </div>
-    </div>
-  )
-})
-
-export default CommonCard
--- a/packages/biz/src/CustomCard/components/commonCard/index.less
+++ b/packages/biz/src/CustomCard/components/commonCard/index.less
@ -1,109 +0,0 @@
-.zhst-biz-search-card {
-  display: inline-block;
-  border: 2px solid transparent;
-  transition: .1s ease-in all;
-  cursor: pointer;
-  overflow: hidden;
-
-  &:hover {
-    transition: .5s ease all;
-    border: 2px solid #09f;
-
-    .zhst-biz-search-card-main-opt {
-      display: flex;
-      align-items: center;
-    }
-  }
-
-  &-main {
-    position: relative;
-    overflow: hidden;
-
-    &-num {
-      position: absolute;
-      right: 2px;
-      top: 2px;
-      width: 20px;
-      height: 20px;
-      line-height: 20px;
-      font-style: normal;
-      text-align: center;
-      font-size: 12px;
-      color: rgb(153, 153, 153);
-      background-color: rgba(255, 255, 255, 75%);
-      z-index: 1;
-      border-radius: 3px;
-    }
-
-    &-img {
-      width: 100%;
-      overflow: hidden;
-
-      &:hover {
-        transition: .5s ease-in all;
-        transform: scale(1.05);
-      }
-    }
-
-    &-opt {
-      display: none;
-      margin: 0;
-      position: absolute;
-      padding: 6px 3px;
-      left: 0;
-      width: 100%;
-      bottom: 0;
-      font-size: 12px;
-      background-color: #09f;
-      color: #fff;
-      box-sizing: border-box;
-      transition: .2s ease-in all;
-
-      li {
-        position: relative;
-        list-style: none;
-        flex: 1;
-        text-align: center;
-      }
-
-      &-action-split {
-        position: absolute;
-        top: 50%;
-        right: 0;
-        width: 1px;
-        height: 80%;
-        transform: translateY(-50%);
-        background-color: #fff;
-      }
-
-      a {
-        color: #fff;
-
-        &:hover {
-          opacity: 0.88;
-        }
-      }
-    }
-  }
-
-  &-footer {
-    padding: 6px;
-    font-size: 12px;
-    text-align: center;
-
-    &-tit {
-      margin: 0;
-      line-height: 20px;
-    }
-
-    &-subtitle {
-      margin: 0;
-      line-height: 20px;
-      transition: .1s ease-in all;
-
-      &:hover {
-        color: #09f;
-      }
-    }
-  }
-}
--- a/packages/biz/src/CustomCard/components/commonCard/index.tsx
+++ b/packages/biz/src/CustomCard/components/commonCard/index.tsx
@ -1,5 +0,0 @@
-import CommonCard from './CommonCard'
-
-export type { CommonCardProps, CommonCardRefProps } from './CommonCard'
-
-export default CommonCard
--- a/packages/biz/src/CustomCard/demo/commonCard.tsx
+++ b/packages/biz/src/CustomCard/demo/commonCard.tsx
@ -1,42 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import { CommonCard } from '@zhst/biz'
-import { uniqueId } from '@zhst/func'
-
-export default () => {
-  const [data, setData] = useState([])
-
-  useEffect(() => {
-    fetch('https://randomuser.me/api/?results=10&inc=id,key,name,gender,email,nat,picture&noinfo')
-      .then((res) => res.json())
-      .then((body) => {
-        let res = body.results.map((o, index) => {
-          return {
-            id: uniqueId(),
-            sort: index + 1,
-            title: o.name.first,
-            subtitle: o.name.last,
-            url: o.picture.large
-          }
-        })
-        setData(res);
-      })
-  }, [])
-
-  return (
-    <div>
-      {data?.map(item => (
-        <CommonCard
-          key={item.id}
-          sort={item.sort}
-          data={item}
-          width="184px"
-          actions={[
-            <a>创建检索</a>,
-            <a>创建布控</a>,
-            <a>删除点位</a>
-          ]}
-        />
-      ))}
-    </div>
-  )
-}
--- a/packages/biz/src/CustomCard/index.md
+++ b/packages/biz/src/CustomCard/index.md
@ -1,31 +0,0 @@
---
-category: Components
-title: CustomCard 定制化卡片
-toc: content
-group:
-  title: 数据展示
---
-
-定制化卡片
-
-## 代码演示
-
-<code src="./demo/commonCard.tsx">基本卡片</code>
-
-## API
-
-### CommonCardProps
-
-| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
-| data | 数据源 | IData[] | [] | - |
-| prefixCls | 数据源 | string | [] | - |
-| width | 宽度 | string | [] | - |
-| height | 高度 | string | [] | - |
-| onCreateTxt | 创建方法文字 | string | [] | - |
-| onCreate | 创建方法 | () => void | [] | - |
-| onAddTxt | 数据源 | string | [] | - |
-| onAdd | 数据源 | () => void | [] | - |
-| onRemoveTxt | 数据源 | string | [] | - |
-| onRemove | 数据源 | () => void | [] | - |
-| customOptionRender | 数据源 | React.ReactNode | - | - |
--- a/packages/biz/src/CustomCard/index.tsx
+++ b/packages/biz/src/CustomCard/index.tsx
@ -1,6 +0,0 @@
-/**
- * Created by jiangzhixiong on 2024/04/28
- */
-
-export { default as CommonCard } from './components/commonCard'
-export type { CommonCardProps, CommonCardRefProps } from './components/commonCard'
--- a/packages/biz/src/Demo/index.tsx
+++ b/packages/biz/src/Demo/index.tsx
@ -0,0 +1,12 @@
+import React from 'react'
+import { Button } from '@zhst/meta'
+import { useThrottleFn } from '@zhst/hooks'
+
+export default () => {
+
+  const { run } = useThrottleFn(() => console.log('123'))
+
+  return (
+    <Button onClick={() => run()} >测试</Button>
+  )
+}
--- a/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
+++ b/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
@ -1,92 +0,0 @@
-import React, { useContext, useRef } from 'react';
-import WindowToggle, { ISize } from './components/WindowToggle';
-import WarningRecordList from './components/WarningRecordList';
-import { ConfigProvider } from '@zhst/meta';
-import { IRecord } from '../WarningRecordCard';
-import { VideoPlayerCardProps } from '../VideoPlayerCard';
-import { ViewLargerImageModalRef } from '../ViewLargerImageModal';
-
-interface RealTimeMonitorProps {
-  prefixCls?: string
-  videoDataSource?: VideoPlayerCardProps[];
-  handleWindowClick?: (key?: string) => void;
-  handleCloseButtonClick?: (key?: string) => void;
-  selectedWindowKey?: string;
-  warningDataSource?: IRecord[];
-  viewLargerImageModalRef?: React.RefObject<ViewLargerImageModalRef>;
-  /*
-  处理 图片下载按钮点击事件
-  */
-  handleDownloadImg?: (imageKey?: string) => void;
-  /*
-  处理 预警记录卡片点击事件
-  */
-  onRecordClick?: (record?: IRecord) => void;
-  /*
-  获取选中的 记录 id 用于 判断是否显示 选中样式
-  */
-  selectedRecordId?: string;
-  isRecordListLoading?: boolean;
-  recordListTitle?: string;
-  style?: React.CSSProperties;
-  cardStyle?: React.CSSProperties;
-  imgStyle?: React.CSSProperties;
-  largeImageTitle?: string;
-  size: ISize;
-  setSize: React.Dispatch<React.SetStateAction<ISize>>
-  maxRecordCount?: number;
-  warningImgStyle?: React.CSSProperties;
-}
-
-export const RealTimeMonitor: React.FC<RealTimeMonitorProps> = (props) => {
-
-  const { ConfigContext } = ConfigProvider;
-  const { getPrefixCls } = useContext(ConfigContext);
-  const {
-    prefixCls: customizePrefixCls,
-    videoDataSource,
-    handleWindowClick,
-    handleCloseButtonClick,
-    selectedWindowKey,
-    warningDataSource,
-    viewLargerImageModalRef,
-    handleDownloadImg,
-    onRecordClick,
-    selectedRecordId,
-    isRecordListLoading,
-    size,
-    setSize,
-    maxRecordCount,
-    warningImgStyle,
-  } = props
-  const toggleRef = useRef<HTMLDivElement>()
-  const componentName = getPrefixCls('biz-real-time-monitor', customizePrefixCls);
-
-  return (
-    <div className={componentName} style={{ display: 'flex' }} >
-      <WindowToggle
-        toggleRef={toggleRef}
-        selectedWindowKey={selectedWindowKey}
-        dataSource={videoDataSource}
-        handleWindowClick={handleWindowClick}
-        handleCloseButtonClick={handleCloseButtonClick}
-        size={size}
-        setSize={setSize}
-      />
-      <WarningRecordList
-        dataSource={warningDataSource}
-        handleDownloadImg={handleDownloadImg}
-        onRecordClick={onRecordClick}
-        selectedRecordId={selectedRecordId}
-        viewLargerImageModalRef={viewLargerImageModalRef}
-        isRecordListLoading={isRecordListLoading}
-        recordListTitle="监控预警记录"
-        maxHeight={toggleRef.current?.offsetHeight}
-        maxRecordCount={maxRecordCount}
-        imgStyle={warningImgStyle}
-      />
-    </div>
-  );
-};
-
-export default RealTimeMonitor;
--- a/packages/biz/src/RealTimeMonitor/components/WarningRecordList/WarningRecordList.tsx
+++ b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/WarningRecordList.tsx
@ -1,89 +0,0 @@
-import React from 'react';
-import { IRecord } from '../../../WarningRecordCard';
-import { ViewLargerImageModalRef } from '../../../ViewLargerImageModal';
-import WarningRecordCard from '../../../WarningRecordCard';
-import ViewLargerImageModal from '../../../ViewLargerImageModal';
-import { Empty, Space, Spin } from '@zhst/meta';
-import { pxToRem } from '@zhst/func'
-import { LoadingOutlined } from '@ant-design/icons';
-import "./index.less"
-
-interface WarningRecordListProps {
-  dataSource?: IRecord[];
-  viewLargerImageModalRef?: React.RefObject<ViewLargerImageModalRef>;
-  /*
-  处理 图片下载按钮点击事件
-  */
-  handleDownloadImg?: (imageKey?: string) => void;
-  /*
-  处理 预警记录卡片点击事件
-  */
-  onRecordClick?: (record?: IRecord) => void;
-  /*
-  获取选中的 记录 id 用于 判断是否显示 选中样式
-  */
-  selectedRecordId?: string;
-  isRecordListLoading?: boolean;
-  recordListTitle?: string;
-  style?: React.CSSProperties;
-  cardStyle?: React.CSSProperties;
-  imgStyle?: React.CSSProperties;
-  largeImageTitle?: string;
-  maxHeight?: number;
-  maxRecordCount?: number;
-}
-
-const WarningRecordList: React.FC<WarningRecordListProps> = (props) => {
-
-  const {
-    dataSource = [],
-    viewLargerImageModalRef,
-    selectedRecordId,
-    handleDownloadImg,
-    onRecordClick,
-    isRecordListLoading,
-    recordListTitle,
-    style,
-    cardStyle,
-    imgStyle,
-    largeImageTitle,
-    maxHeight,
-    maxRecordCount = 10
-  } = props
-  return (
-    <div className='zhst-biz-warning-record-list' style={{ maxHeight: `${pxToRem(`${maxHeight}`)}`, ...style }} >
-      <div className='header'>{recordListTitle}</div>
-      <div className='body'>
-        {
-          isRecordListLoading ?
-            <div style={{ height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
-              <Spin indicator={<LoadingOutlined style={{ fontSize: 24 }} />} />
-            </div>
-            : (dataSource?.length) > 0 ?
-              <Space direction='vertical' size={10}  >
-                {dataSource?.map((record, index) => {
-                  if (index > maxRecordCount - 1) return
-                  return (<WarningRecordCard
-                    key={record?.id}
-                    record={record}
-                    onRecordClick={(record) => { onRecordClick?.(record) }}
-                    selectedRecordId={selectedRecordId}
-                    cardStyle={{ ...cardStyle }}
-                    imgStyle={{ ...imgStyle }}
-                  />)
-                }
-                )}
-              </Space>
-              :
-              <div style={{ height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
-                <Empty description="暂无数据" />
-              </div>
-        }
-      </div>
-      {/* 弹窗 绑定ref 后可以调用 handleCancel方法关闭弹窗 show方法打开弹窗 */}
-      <ViewLargerImageModal ref={viewLargerImageModalRef} downloadImg={handleDownloadImg} title={largeImageTitle} />
-    </div>
-  )
-};
-
-export default WarningRecordList;
--- a/packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.less
+++ b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.less
@ -1,22 +0,0 @@
-.zhst-biz-warning-record-list {
-  display: flex;
-  flex-direction: column;
-  border-left: solid 1px #00000026;
-  min-width: 320px;
-
-  .header {
-    width: 100%;
-    height: 48px;
-    background-color: #EFF2F4;
-    padding: 0 20px;
-    box-sizing: border-box;
-    line-height: 48px;
-  }
-
-  .body {
-    padding: 10px;
-    overflow-y: auto;
-    overflow-x: hidden;
-    flex: 1;
-  }
-}
--- a/Show More
+++ b/Show More