From c4a14f3ca4542f93d9275845687a89645741e768 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 10:45:01 +0800
Subject: [PATCH 01/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E8=AE=B0=E5=BD=95=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../WarningRecordCard/WarningRecordCard.tsx   | 83 +++++++++++++++++++
 .../meta/src/WarningRecordCard/demo/base.tsx  | 29 +++++++
 .../meta/src/WarningRecordCard/index.less     | 27 ++++++
 packages/meta/src/WarningRecordCard/index.md  | 19 +++++
 packages/meta/src/WarningRecordCard/index.tsx |  5 ++
 packages/meta/src/index.tsx                   |  1 +
 6 files changed, 164 insertions(+)
 create mode 100644 packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
 create mode 100644 packages/meta/src/WarningRecordCard/demo/base.tsx
 create mode 100644 packages/meta/src/WarningRecordCard/index.less
 create mode 100644 packages/meta/src/WarningRecordCard/index.md
 create mode 100644 packages/meta/src/WarningRecordCard/index.tsx

diff --git a/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx b/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
new file mode 100644
index 0000000..6e0b6eb
--- /dev/null
+++ b/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
@@ -0,0 +1,83 @@
+import { Card, Space, Divider } from 'antd';
+import React from 'react';
+import './index.less'
+import dayjs from 'dayjs';
+
+const componentName = `zhst-warning-record-card`;
+
+export interface Record {
+
+  imgSrc?: string;
+
+  id?: string;
+
+  /**
+   * 图片的描述
+   */
+  description?: string;
+  /*
+   用于显示  盒子 点位 柜子 等信息
+  */
+  info?: string[]
+  /* 
+    右侧 柜子id 显示  
+  */
+  cabietInfo?: string;
+  /* 
+    直接传格式化好的时间 
+  */
+  warningTime?: string | number;
+  /* 
+    传格时间戳
+  */
+  warningTimestamp?: string | number
+  /* 
+    传格时间格式 
+    @default YYYY-MM-DD HH:mm:ss
+  */
+  warningTimeFormat?: string;
+};
+
+export interface WarningRecordCardProps {
+  record?: Record;
+  onRecordClick?: (record?: Record) => void;
+  style?: React.CSSProperties;
+};
+
+export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
+  const { record, onRecordClick, style = { width: 356, height: 302 } } = props;
+  const { imgSrc = '', id = '', description = '', info = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+  const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
+  const warningTimeShow = warningTime ? warningTime : formattedDate
+  const handleClick = () => {
+    onRecordClick?.(record);
+  };
+
+  return (
+    <div className={componentName} key={id} onClick={handleClick}>
+
+      <Card
+        style={{ ...style, padding: 10, borderRadius: 4 }}
+        cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
+      >
+
+        <div className='left-context'>
+          <div className="description">{description}</div>
+          <Space size={0} split={<Divider type="vertical" />}>
+            {info?.map((item, index) => (
+              <div key={index} className="info-item">
+                {item}
+              </div>
+            ))}
+          </Space>
+          <div className='warning-time'>{warningTimeShow}</div>
+        </div>
+
+        <div className='cabietInfo' >{cabietInfo}</div>
+
+      </Card>
+    </div>
+  );
+};
+
+export default WarningRecordCard;
diff --git a/packages/meta/src/WarningRecordCard/demo/base.tsx b/packages/meta/src/WarningRecordCard/demo/base.tsx
new file mode 100644
index 0000000..cd9c569
--- /dev/null
+++ b/packages/meta/src/WarningRecordCard/demo/base.tsx
@@ -0,0 +1,29 @@
+
+import React from 'react';
+import WarningRecordCard , {type Record}from '../WarningRecordCard';
+import { Space } from 'antd/es';
+
+const props = {
+    record :
+      {
+        imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+        id: '1561561',
+        description: '火焰识别',
+        info:['盒子1','点位1'],
+        cabietInfo: '柜子ID : C001', 
+        // warningTime: "2023-03-01 ",
+        warningTimestamp :Date.now() ,
+        // warningTimeFormat:"YYYY-MM-DD"
+      },
+      onRecordClick:(record?:Record) =>{
+        console.log(record)
+      }
+}
+
+export default () => {
+  return (
+    <Space size={[8, 16]} direction="vertical">
+      <WarningRecordCard {...props} />
+    </Space>
+  )
+}
diff --git a/packages/meta/src/WarningRecordCard/index.less b/packages/meta/src/WarningRecordCard/index.less
new file mode 100644
index 0000000..0470b70
--- /dev/null
+++ b/packages/meta/src/WarningRecordCard/index.less
@@ -0,0 +1,27 @@
+.zhst-warning-record-card {
+  .ant-card-body {
+    padding: 0 !important;
+    font-family: MicrosoftYaHei;
+    line-height: 19px;
+    display: flex;
+    margin-top: 10px;
+
+    .left-context {
+      flex: 1;
+
+    > div{
+        margin-top: 6px;
+      }
+
+    > div:nth-child(1) {
+          margin-top: 0;
+      }
+    }
+   
+    .description{
+      font-weight: bold;
+    }
+  }
+
+
+}
diff --git a/packages/meta/src/WarningRecordCard/index.md b/packages/meta/src/WarningRecordCard/index.md
new file mode 100644
index 0000000..a804761
--- /dev/null
+++ b/packages/meta/src/WarningRecordCard/index.md
@@ -0,0 +1,19 @@
+---
+group: 数据展示
+category: Components
+subtitle: 预警记录卡片
+title: WarningRecordCard 预警记录卡片
+---
+
+# WarningRecordCard 预警记录卡片
+
+
+<code src="./demo/base.tsx"></code>
+
+
+
+## API
+
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+
diff --git a/packages/meta/src/WarningRecordCard/index.tsx b/packages/meta/src/WarningRecordCard/index.tsx
new file mode 100644
index 0000000..a3ebea8
--- /dev/null
+++ b/packages/meta/src/WarningRecordCard/index.tsx
@@ -0,0 +1,5 @@
+import WarningRecordCard from './WarningRecordCard'
+
+export type { Record, WarningRecordCardProps} from './WarningRecordCard'
+
+export default WarningRecordCard
diff --git a/packages/meta/src/index.tsx b/packages/meta/src/index.tsx
index 544fb69..1191958 100644
--- a/packages/meta/src/index.tsx
+++ b/packages/meta/src/index.tsx
@@ -81,3 +81,4 @@ export { default as Tour } from './tour'
 export type { TourLocale, TourProps, TourStepProps } from './tour/interface'
 export { default as Segmented } from './segmented'
 export type { SegmentedLabeledOption, SegmentedProps, SegmentedValue } from './segmented'
+export type { default as WarningRecordCard } from './WarningRecordCard'

From ee9abf3ead0d37f75af47fd412f51a040467324b Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 10:58:33 +0800
Subject: [PATCH 02/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E8=AE=B0=E5=BD=95=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/meta/src/WarningRecordCard/WarningRecordCard.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx b/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
index 6e0b6eb..555dac3 100644
--- a/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
@@ -45,7 +45,7 @@ export interface WarningRecordCardProps {
 };
 
 export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
-  const { record, onRecordClick, style = { width: 356, height: 302 } } = props;
+  const { record, onRecordClick, style  } = props;
   const { imgSrc = '', id = '', description = '', info = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
   const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
   const warningTimeShow = warningTime ? warningTime : formattedDate
@@ -57,7 +57,7 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
     <div className={componentName} key={id} onClick={handleClick}>
 
       <Card
-        style={{ ...style, padding: 10, borderRadius: 4 }}
+        style={{  width: 356, height: 302 , padding: 10, borderRadius: 4 ,...style}}
         cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
       >
 

From a4b96011bb30b5a9a42e97a55585a47f20b3acf5 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 12:01:19 +0800
Subject: [PATCH 03/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E8=AE=B0=E5=BD=95=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../WarningRecordCard/WarningRecordCard.tsx   | 83 -------------------
 .../meta/src/WarningRecordCard/demo/base.tsx  | 29 -------
 .../meta/src/WarningRecordCard/index.less     | 27 ------
 packages/meta/src/WarningRecordCard/index.md  | 19 -----
 packages/meta/src/WarningRecordCard/index.tsx |  5 --
 packages/meta/src/index.tsx                   |  1 -
 6 files changed, 164 deletions(-)
 delete mode 100644 packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
 delete mode 100644 packages/meta/src/WarningRecordCard/demo/base.tsx
 delete mode 100644 packages/meta/src/WarningRecordCard/index.less
 delete mode 100644 packages/meta/src/WarningRecordCard/index.md
 delete mode 100644 packages/meta/src/WarningRecordCard/index.tsx

diff --git a/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx b/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
deleted file mode 100644
index 555dac3..0000000
--- a/packages/meta/src/WarningRecordCard/WarningRecordCard.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import { Card, Space, Divider } from 'antd';
-import React from 'react';
-import './index.less'
-import dayjs from 'dayjs';
-
-const componentName = `zhst-warning-record-card`;
-
-export interface Record {
-
-  imgSrc?: string;
-
-  id?: string;
-
-  /**
-   * 图片的描述
-   */
-  description?: string;
-  /*
-   用于显示  盒子 点位 柜子 等信息
-  */
-  info?: string[]
-  /* 
-    右侧 柜子id 显示  
-  */
-  cabietInfo?: string;
-  /* 
-    直接传格式化好的时间 
-  */
-  warningTime?: string | number;
-  /* 
-    传格时间戳
-  */
-  warningTimestamp?: string | number
-  /* 
-    传格时间格式 
-    @default YYYY-MM-DD HH:mm:ss
-  */
-  warningTimeFormat?: string;
-};
-
-export interface WarningRecordCardProps {
-  record?: Record;
-  onRecordClick?: (record?: Record) => void;
-  style?: React.CSSProperties;
-};
-
-export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
-  const { record, onRecordClick, style  } = props;
-  const { imgSrc = '', id = '', description = '', info = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
-  const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
-  const warningTimeShow = warningTime ? warningTime : formattedDate
-  const handleClick = () => {
-    onRecordClick?.(record);
-  };
-
-  return (
-    <div className={componentName} key={id} onClick={handleClick}>
-
-      <Card
-        style={{  width: 356, height: 302 , padding: 10, borderRadius: 4 ,...style}}
-        cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
-      >
-
-        <div className='left-context'>
-          <div className="description">{description}</div>
-          <Space size={0} split={<Divider type="vertical" />}>
-            {info?.map((item, index) => (
-              <div key={index} className="info-item">
-                {item}
-              </div>
-            ))}
-          </Space>
-          <div className='warning-time'>{warningTimeShow}</div>
-        </div>
-
-        <div className='cabietInfo' >{cabietInfo}</div>
-
-      </Card>
-    </div>
-  );
-};
-
-export default WarningRecordCard;
diff --git a/packages/meta/src/WarningRecordCard/demo/base.tsx b/packages/meta/src/WarningRecordCard/demo/base.tsx
deleted file mode 100644
index cd9c569..0000000
--- a/packages/meta/src/WarningRecordCard/demo/base.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-
-import React from 'react';
-import WarningRecordCard , {type Record}from '../WarningRecordCard';
-import { Space } from 'antd/es';
-
-const props = {
-    record :
-      {
-        imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
-        id: '1561561',
-        description: '火焰识别',
-        info:['盒子1','点位1'],
-        cabietInfo: '柜子ID : C001', 
-        // warningTime: "2023-03-01 ",
-        warningTimestamp :Date.now() ,
-        // warningTimeFormat:"YYYY-MM-DD"
-      },
-      onRecordClick:(record?:Record) =>{
-        console.log(record)
-      }
-}
-
-export default () => {
-  return (
-    <Space size={[8, 16]} direction="vertical">
-      <WarningRecordCard {...props} />
-    </Space>
-  )
-}
diff --git a/packages/meta/src/WarningRecordCard/index.less b/packages/meta/src/WarningRecordCard/index.less
deleted file mode 100644
index 0470b70..0000000
--- a/packages/meta/src/WarningRecordCard/index.less
+++ /dev/null
@@ -1,27 +0,0 @@
-.zhst-warning-record-card {
-  .ant-card-body {
-    padding: 0 !important;
-    font-family: MicrosoftYaHei;
-    line-height: 19px;
-    display: flex;
-    margin-top: 10px;
-
-    .left-context {
-      flex: 1;
-
-    > div{
-        margin-top: 6px;
-      }
-
-    > div:nth-child(1) {
-          margin-top: 0;
-      }
-    }
-   
-    .description{
-      font-weight: bold;
-    }
-  }
-
-
-}
diff --git a/packages/meta/src/WarningRecordCard/index.md b/packages/meta/src/WarningRecordCard/index.md
deleted file mode 100644
index a804761..0000000
--- a/packages/meta/src/WarningRecordCard/index.md
+++ /dev/null
@@ -1,19 +0,0 @@
----
-group: 数据展示
-category: Components
-subtitle: 预警记录卡片
-title: WarningRecordCard 预警记录卡片
----
-
-# WarningRecordCard 预警记录卡片
-
-
-<code src="./demo/base.tsx"></code>
-
-
-
-## API
-
-| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
-
diff --git a/packages/meta/src/WarningRecordCard/index.tsx b/packages/meta/src/WarningRecordCard/index.tsx
deleted file mode 100644
index a3ebea8..0000000
--- a/packages/meta/src/WarningRecordCard/index.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import WarningRecordCard from './WarningRecordCard'
-
-export type { Record, WarningRecordCardProps} from './WarningRecordCard'
-
-export default WarningRecordCard
diff --git a/packages/meta/src/index.tsx b/packages/meta/src/index.tsx
index 1191958..544fb69 100644
--- a/packages/meta/src/index.tsx
+++ b/packages/meta/src/index.tsx
@@ -81,4 +81,3 @@ export { default as Tour } from './tour'
 export type { TourLocale, TourProps, TourStepProps } from './tour/interface'
 export { default as Segmented } from './segmented'
 export type { SegmentedLabeledOption, SegmentedProps, SegmentedValue } from './segmented'
-export type { default as WarningRecordCard } from './WarningRecordCard'

From 5a97990cc8607dd6041b98c0ee28f7bf21ef7d57 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 14:29:27 +0800
Subject: [PATCH 04/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E8=AE=B0=E5=BD=95=E6=95=B0=E6=8D=AE=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/package.json                     |  4 +-
 .../WarningRecordCard/WarningRecordCard.tsx   | 84 +++++++++++++++++++
 .../biz/src/WarningRecordCard/demo/base.tsx   | 29 +++++++
 packages/biz/src/WarningRecordCard/index.less | 25 ++++++
 packages/biz/src/WarningRecordCard/index.md   | 31 +++++++
 packages/biz/src/WarningRecordCard/index.tsx  |  3 +
 packages/biz/src/index.tsx                    |  2 +
 7 files changed, 177 insertions(+), 1 deletion(-)
 create mode 100644 packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
 create mode 100644 packages/biz/src/WarningRecordCard/demo/base.tsx
 create mode 100644 packages/biz/src/WarningRecordCard/index.less
 create mode 100644 packages/biz/src/WarningRecordCard/index.md
 create mode 100644 packages/biz/src/WarningRecordCard/index.tsx

diff --git a/packages/biz/package.json b/packages/biz/package.json
index 41a32a0..68945b6 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -43,6 +43,8 @@
     "@zhst/meta": "workspace:^",
     "antd": "^5.12.5",
     "classnames": "^2.5.1",
-    "rc-util": "^5.38.1"
+    "rc-util": "^5.38.1",
+    "dayjs": "^1.11.10"
+
   }
 }
diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
new file mode 100644
index 0000000..5ea7a21
--- /dev/null
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -0,0 +1,84 @@
+import { Card, Space, Divider } from 'antd';
+import React from 'react';
+import dayjs from 'dayjs';
+import './index.less'
+const componentName = `zhst-biz-warning-record-card`;
+
+export interface IRecord {
+
+  imgSrc?: string;
+
+  id?: string;
+
+  /**
+   * 预警类型
+   */
+  warningType?: string;
+  /*
+   用于显示  盒子 点位 柜子 等信息
+  */
+  warningInfo?: string[]
+  /* 
+    右侧 柜子id 显示  
+  */
+  cabietInfo?: string;
+  /* 
+    直接传格式化好的时间 
+  */
+  warningTime?: string ;
+  /* 
+    传格时间戳
+  */
+  warningTimestamp?: string | number
+  /* 
+    传格时间格式 
+    @default YYYY-MM-DD HH:mm:ss
+  */
+  warningTimeFormat?: string;
+};
+
+export interface WarningRecordCardProps {
+  record?: IRecord;
+  onRecordClick?: (record?: IRecord) => void;
+  style?: React.CSSProperties;
+};
+
+export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
+
+  const { record, onRecordClick, style  } = props;
+  const { imgSrc = '', id = '', warningType = '', warningInfo = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+  const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
+  const warningTimeShow = warningTime ? warningTime : formattedDate
+
+  const handleClick = () => {
+    onRecordClick?.(record);
+  };
+
+  return (
+    <div className={componentName} key={id} onClick={handleClick}>
+
+      <Card
+        style={{  width: 356, height: 302 , padding: 10, borderRadius: 4 ,...style}}
+        cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
+      >
+
+        <div className='left-context'>
+          <div className="description">{warningType}</div>
+          <Space size={0} split={<Divider type="vertical" />}>
+            {warningInfo?.map((item, index) => (
+              <div key={index} className="info-item">
+                {item}
+              </div>
+            ))}
+          </Space>
+          <div className='warning-time'>{warningTimeShow}</div>
+        </div>
+
+        <div className='cabietInfo' >{cabietInfo}</div>
+
+      </Card>
+    </div>
+  );
+};
+
+export default WarningRecordCard;
diff --git a/packages/biz/src/WarningRecordCard/demo/base.tsx b/packages/biz/src/WarningRecordCard/demo/base.tsx
new file mode 100644
index 0000000..0dc5fdf
--- /dev/null
+++ b/packages/biz/src/WarningRecordCard/demo/base.tsx
@@ -0,0 +1,29 @@
+
+import React from 'react';
+import WarningRecordCard , {type IRecord} from '../WarningRecordCard';
+import { Space } from 'antd/es';
+
+const props = {
+    record :
+      {
+        imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+        id: '1561561',
+        warningType: '火焰识别',
+        warningInfo:['盒子1','点位1'],
+        cabietInfo: '柜子ID : C001', 
+        // warningTime: "2023-03-01 ",
+        warningTimestamp :Date.now() ,
+        // warningTimeFormat:"YYYY-MM-DD"
+      },
+      onRecordClick:(record?:IRecord) =>{
+        console.log(record)
+      }
+}
+
+export default () => {
+  return (
+    <Space size={[8, 16]} direction="vertical">
+      <WarningRecordCard {...props} />
+    </Space>
+  )
+}
diff --git a/packages/biz/src/WarningRecordCard/index.less b/packages/biz/src/WarningRecordCard/index.less
new file mode 100644
index 0000000..a7ca119
--- /dev/null
+++ b/packages/biz/src/WarningRecordCard/index.less
@@ -0,0 +1,25 @@
+.zhst-biz-warning-record-card {
+  .ant-card-body {
+    padding: 0 !important;
+    font-family: MicrosoftYaHei;
+    line-height: 19px;
+    display: flex;
+    margin-top: 10px;
+
+    .left-context {
+      flex: 1;
+
+    > div{
+        margin-top: 6px;
+      }
+
+    > div:nth-child(1) {
+          margin-top: 0;
+      }
+    }
+   
+    .description{
+      font-weight: bold;
+    }
+  }
+}
diff --git a/packages/biz/src/WarningRecordCard/index.md b/packages/biz/src/WarningRecordCard/index.md
new file mode 100644
index 0000000..3d286b3
--- /dev/null
+++ b/packages/biz/src/WarningRecordCard/index.md
@@ -0,0 +1,31 @@
+---
+group: 数据展示
+category: Components
+subtitle: 预警记录卡片
+title: WarningRecordCard 预警记录卡片
+---
+
+# WarningRecordCard 预警记录卡片
+
+
+<code src="./demo/base.tsx"></code>
+
+
+
+## API
+
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| imgSrc | 图片src | string | - | - |
+| id | 数据的唯一id 用于key 传值| string | - | - |
+| warningType | 预警类型 | string | - | - |
+| warningInfo | 盒子 点位 柜子 等信息 | string[] | - | - |
+| cabietInfo | 右侧 柜子信息  | string | - | - |
+| warningTime | 预警时间 格式化后的时间字符串 | string | - | - |
+| warningTimestamp | 预警时间戳 | string \| nmbuer  | - | - |
+| warningTimeFormat | 预警时间格式 | string | YYYY-MM-DD HH:mm:ss | - |
+
+
+
+
+
diff --git a/packages/biz/src/WarningRecordCard/index.tsx b/packages/biz/src/WarningRecordCard/index.tsx
new file mode 100644
index 0000000..b60bf27
--- /dev/null
+++ b/packages/biz/src/WarningRecordCard/index.tsx
@@ -0,0 +1,3 @@
+import WarningRecordCard from './WarningRecordCard'
+export type { IRecord, WarningRecordCardProps} from './WarningRecordCard'
+export default WarningRecordCard
\ No newline at end of file
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index d1ccc9c..779269f 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -1,2 +1,4 @@
 export { default as Demo } from './Demo';
 export { default as BigImageModal } from './BigImageModal'
+export { default as WarningRecordCard } from './WarningRecordCard'
+export type {IRecord, WarningRecordCardProps} from './WarningRecordCard'

From 390dd6ca88feb9616888c59548e920814646db17 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 17:18:51 +0800
Subject: [PATCH 05/24] =?UTF-8?q?fix:=20"=E8=A7=A3=E5=86=B3=E5=86=B2?=
 =?UTF-8?q?=E7=AA=81"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/WarningRecordCard/demo/base.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/biz/src/WarningRecordCard/demo/base.tsx b/packages/biz/src/WarningRecordCard/demo/base.tsx
index 0dc5fdf..b954ceb 100644
--- a/packages/biz/src/WarningRecordCard/demo/base.tsx
+++ b/packages/biz/src/WarningRecordCard/demo/base.tsx
@@ -1,7 +1,7 @@
 
 import React from 'react';
-import WarningRecordCard , {type IRecord} from '../WarningRecordCard';
-import { Space } from 'antd/es';
+import {WarningRecordCard,type IRecord} from '@zhst/biz';
+import { Space } from 'antd';
 
 const props = {
     record :

From 9366c8f33abae7dcb61754ae7b6d2ea2af51be3b Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 17:21:18 +0800
Subject: [PATCH 06/24] =?UTF-8?q?fix:=20"=E8=A7=A3=E5=86=B3=E5=86=B2?=
 =?UTF-8?q?=E7=AA=81"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/WarningRecordCard/WarningRecordCard.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index 5ea7a21..a555952 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -2,6 +2,7 @@ import { Card, Space, Divider } from 'antd';
 import React from 'react';
 import dayjs from 'dayjs';
 import './index.less'
+
 const componentName = `zhst-biz-warning-record-card`;
 
 export interface IRecord {

From d78b44f12f7d0a8cb498d08bdaa6df2d965730bd Mon Sep 17 00:00:00 2001
From: dev <710328466@qq.com>
Date: Fri, 1 Mar 2024 17:40:37 +0800
Subject: [PATCH 07/24] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E6=89=BE=E4=B8=8D=E5=88=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/boxSelectTree/components/boxPanel/index.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
index a94e1df..0cad4a0 100644
--- a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
@@ -5,7 +5,6 @@ import { DiffOutlined, SwitcherOutlined  } from '@ant-design/icons'
 import type { TreeProps, InputProps } from 'antd';
 import TreeTransferModal from '../../../treeTransferModal'
 import BoxTree from '../../../tree';
-import './index.less'
 
 export interface BoxGroupPanelProps {
   searchInputProps?: InputProps

From cab10522c852a7c6be45608e058b39cf5c74ef04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E5=BF=97=E9=9B=84?= <jiangzhixiong@smartvision.cn>
Date: Fri, 1 Mar 2024 17:55:26 +0800
Subject: [PATCH 08/24] =?UTF-8?q?fix:=20=E6=89=93=E5=8C=85=E7=94=9F?=
 =?UTF-8?q?=E6=88=90=E6=96=87=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/CHANGELOG.md                     |  6 +++++
 .../hooks/useIntelligentTracking/index.d.ts   | 15 ++++++++---
 packages/biz/es/index.d.ts                    |  2 ++
 packages/biz/es/index.js                      |  3 ++-
 packages/biz/es/useSocket/ws.d.ts             | 26 -------------------
 packages/biz/lib/index.d.ts                   |  2 ++
 packages/biz/lib/index.js                     |  7 +++--
 packages/biz/lib/useSocket/ws.d.ts            | 26 -------------------
 packages/biz/package.json                     |  3 +--
 9 files changed, 30 insertions(+), 60 deletions(-)
 delete mode 100644 packages/biz/es/useSocket/ws.d.ts
 delete mode 100644 packages/biz/lib/useSocket/ws.d.ts

diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index 5fa366f..ec30caf 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @zhst/biz
 
+## 0.7.0
+
+### Minor Changes
+
+- 新增预警记录卡片组件
+
 ## 0.6.0
 
 ### Minor Changes
diff --git a/packages/biz/es/hooks/useIntelligentTracking/index.d.ts b/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
index c1e54ef..bd6e0e3 100644
--- a/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
+++ b/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
@@ -15,13 +15,19 @@ export declare const getTaskCameraByCenterAndPower: (value: {
         bodyPower: number;
     };
     cameraInfos: Array<Object>;
-    center: [number, number];
+    center: [
+        number,
+        number
+    ];
 }) => Promise<Object[]>;
 /**创建追踪任务 */
 export declare const createIntelligentTrack: (value: {
     images: Array<Object>;
     deviceIds: Array<string>;
-    circleCenter: [number, number];
+    circleCenter: [
+        number,
+        number
+    ];
     model: number;
     circleRadius: number;
     facePower?: number;
@@ -33,7 +39,10 @@ export declare const emitHeartbeat: (smartTrackId: number) => Promise<void>;
 export declare const ModifyTrackCameras: (value: {
     smartTrackId: number;
     deviceIds: Array<number>;
-    centerPoint: [number, number];
+    centerPoint: [
+        number,
+        number
+    ];
 }) => Promise<void>;
 export declare const setIntelligentTrackCircleInfo: (smartTrackId: number, circleCenter: [number, number]) => Promise<void>;
 export declare const getTackCameraInfo: (value: {
diff --git a/packages/biz/es/index.d.ts b/packages/biz/es/index.d.ts
index ba509c5..bc308c1 100644
--- a/packages/biz/es/index.d.ts
+++ b/packages/biz/es/index.d.ts
@@ -3,3 +3,5 @@ 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';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
diff --git a/packages/biz/es/index.js b/packages/biz/es/index.js
index beffc49..7e9350e 100644
--- a/packages/biz/es/index.js
+++ b/packages/biz/es/index.js
@@ -2,4 +2,5 @@ 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";
\ No newline at end of file
+export { default as TreeTransferModal } from "./treeTransferModal";
+export { default as WarningRecordCard } from "./WarningRecordCard";
\ No newline at end of file
diff --git a/packages/biz/es/useSocket/ws.d.ts b/packages/biz/es/useSocket/ws.d.ts
deleted file mode 100644
index 0dc9550..0000000
--- a/packages/biz/es/useSocket/ws.d.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-declare class Channel {
-    /**
-     * io 实例化对象
-     */
-    ioIns: any;
-    /**
-     * 已存在的订阅列表
-     */
-    listeners: never[];
-    /**
-     * 调试信息 记录订阅/反订阅次数
-     */
-    subscribeListenerId: never[];
-    unSubscribeListenerId: never[];
-    init: () => void;
-    retry: (listener: {
-        [x: string]: any;
-        lastRetryInterval: number | undefined;
-        intervalId: NodeJS.Timeout;
-    } | undefined) => void;
-    doEmit: (topic: any, req: any, listenerId: any) => void;
-    subscribe(topic: any, req: any, handle: any): () => void;
-    unSubscribe(topic: any, req: any, handleId: any, listenerId: any): void;
-}
-declare const channelIns: Channel;
-export default channelIns;
diff --git a/packages/biz/lib/index.d.ts b/packages/biz/lib/index.d.ts
index ba509c5..bc308c1 100644
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@@ -3,3 +3,5 @@ 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';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
diff --git a/packages/biz/lib/index.js b/packages/biz/lib/index.js
index e86160c..82e9b73 100644
--- a/packages/biz/lib/index.js
+++ b/packages/biz/lib/index.js
@@ -33,7 +33,8 @@ __export(src_exports, {
   BoxSelectTree: () => import_boxSelectTree.default,
   Tree: () => import_tree.default,
   TreeTransfer: () => import_treeTransfer.default,
-  TreeTransferModal: () => import_treeTransferModal.default
+  TreeTransferModal: () => import_treeTransferModal.default,
+  WarningRecordCard: () => import_WarningRecordCard.default
 });
 module.exports = __toCommonJS(src_exports);
 var import_BigImageModal = __toESM(require("./BigImageModal"));
@@ -41,11 +42,13 @@ 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
+  TreeTransferModal,
+  WarningRecordCard
 });
diff --git a/packages/biz/lib/useSocket/ws.d.ts b/packages/biz/lib/useSocket/ws.d.ts
deleted file mode 100644
index 0dc9550..0000000
--- a/packages/biz/lib/useSocket/ws.d.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-declare class Channel {
-    /**
-     * io 实例化对象
-     */
-    ioIns: any;
-    /**
-     * 已存在的订阅列表
-     */
-    listeners: never[];
-    /**
-     * 调试信息 记录订阅/反订阅次数
-     */
-    subscribeListenerId: never[];
-    unSubscribeListenerId: never[];
-    init: () => void;
-    retry: (listener: {
-        [x: string]: any;
-        lastRetryInterval: number | undefined;
-        intervalId: NodeJS.Timeout;
-    } | undefined) => void;
-    doEmit: (topic: any, req: any, listenerId: any) => void;
-    subscribe(topic: any, req: any, handle: any): () => void;
-    unSubscribe(topic: any, req: any, handleId: any, listenerId: any): void;
-}
-declare const channelIns: Channel;
-export default channelIns;
diff --git a/packages/biz/package.json b/packages/biz/package.json
index ef55f5f..2f7e962 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "业务库",
   "keywords": [
     "business",
@@ -47,6 +47,5 @@
     "classnames": "^2.5.1",
     "rc-util": "^5.38.1",
     "dayjs": "^1.11.10"
-
   }
 }

From e590ab308ca79dbfd8e126b228f2fff144f8de9c Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Fri, 1 Mar 2024 18:56:51 +0800
Subject: [PATCH 09/24] =?UTF-8?q?fix:=20"=E4=BC=98=E5=8C=96=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E5=9B=BE=E3=80=80=E6=B7=BB=E5=8A=A0=20cardProps"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../biz/src/WarningRecordCard/WarningRecordCard.tsx  | 12 +++++++-----
 packages/biz/src/WarningRecordCard/demo/base.tsx     |  5 +++--
 .../src/boxSelectTree/components/boxPanel/index.tsx  |  1 +
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index a555952..74f0376 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -1,4 +1,4 @@
-import { Card, Space, Divider } from 'antd';
+import { Card, Space, Divider, CardProps } from 'antd';
 import React from 'react';
 import dayjs from 'dayjs';
 import './index.less'
@@ -26,7 +26,7 @@ export interface IRecord {
   /* 
     直接传格式化好的时间 
   */
-  warningTime?: string ;
+  warningTime?: string;
   /* 
     传格时间戳
   */
@@ -42,11 +42,12 @@ export interface WarningRecordCardProps {
   record?: IRecord;
   onRecordClick?: (record?: IRecord) => void;
   style?: React.CSSProperties;
+  cardProps?: CardProps;
 };
 
 export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
 
-  const { record, onRecordClick, style  } = props;
+  const { record, onRecordClick, style, cardProps } = props;
   const { imgSrc = '', id = '', warningType = '', warningInfo = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
   const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
   const warningTimeShow = warningTime ? warningTime : formattedDate
@@ -56,11 +57,12 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
   };
 
   return (
-    <div className={componentName} key={id} onClick={handleClick}>
+    <div className={componentName} key={id} onClick={handleClick} style={style}>
 
       <Card
-        style={{  width: 356, height: 302 , padding: 10, borderRadius: 4 ,...style}}
         cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
+        style={{ width: 356, height: 302, padding: 10, borderRadius: 4 }}
+        {...cardProps}
       >
 
         <div className='left-context'>
diff --git a/packages/biz/src/WarningRecordCard/demo/base.tsx b/packages/biz/src/WarningRecordCard/demo/base.tsx
index b954ceb..b5938a8 100644
--- a/packages/biz/src/WarningRecordCard/demo/base.tsx
+++ b/packages/biz/src/WarningRecordCard/demo/base.tsx
@@ -17,13 +17,14 @@ const props = {
       },
       onRecordClick:(record?:IRecord) =>{
         console.log(record)
-      }
+      },
+      // cardProps:{ style:{width:5000}}
 }
 
 export default () => {
   return (
     <Space size={[8, 16]} direction="vertical">
-      <WarningRecordCard {...props} />
+      <WarningRecordCard {...props }/>
     </Space>
   )
 }
diff --git a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
index 0cad4a0..5aeab5e 100644
--- a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
@@ -5,6 +5,7 @@ import { DiffOutlined, SwitcherOutlined  } from '@ant-design/icons'
 import type { TreeProps, InputProps } from 'antd';
 import TreeTransferModal from '../../../treeTransferModal'
 import BoxTree from '../../../tree';
+// import './index.less'
 
 export interface BoxGroupPanelProps {
   searchInputProps?: InputProps

From ea98dde102a36f039b439837db9a4e5c7ab7a65c Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Mon, 4 Mar 2024 17:30:36 +0800
Subject: [PATCH 10/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E5=A4=A7=E5=9B=BE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewLargerImageModal.tsx                  | 87 +++++++++++++++++++
 .../src/ViewLargerImageModal/demo/base.tsx    | 70 +++++++++++++++
 .../biz/src/ViewLargerImageModal/index.less   | 62 +++++++++++++
 .../biz/src/ViewLargerImageModal/index.md     | 25 ++++++
 .../biz/src/ViewLargerImageModal/index.tsx    |  3 +
 .../WarningRecordCard/WarningRecordCard.tsx   |  6 +-
 packages/biz/src/WarningRecordCard/index.md   |  2 +-
 packages/biz/src/index.tsx                    |  1 +
 8 files changed, 252 insertions(+), 4 deletions(-)
 create mode 100644 packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
 create mode 100644 packages/biz/src/ViewLargerImageModal/demo/base.tsx
 create mode 100644 packages/biz/src/ViewLargerImageModal/index.less
 create mode 100644 packages/biz/src/ViewLargerImageModal/index.md
 create mode 100644 packages/biz/src/ViewLargerImageModal/index.tsx

diff --git a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
new file mode 100644
index 0000000..a046c83
--- /dev/null
+++ b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
@@ -0,0 +1,87 @@
+import React, { useImperativeHandle, useRef, useState, forwardRef } from 'react';
+import { Modal, ModalProps, Space } from 'antd';
+import theme from 'antd/lib/theme';
+import { DownloadOutlined } from '@ant-design/icons';
+import './index.less'
+
+type ViewLargerImageModalParams = {
+  imgSrc?: string;
+  contextData?: { [key: string]: string | number | JSX.Element };
+};
+
+interface ViewLargerImageModalRef {
+  show: (params?: ViewLargerImageModalParams) => void;
+  handleCancel: () => void;
+}
+
+interface ViewLargerImageModalProps {
+  imgStyle?: React.CSSProperties;
+  downloadImg?: (imgSrc: string) => void;
+  title: string;
+  downloadText?:string;
+  modalProps?: ModalProps
+}
+
+export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLargerImageModalProps>(
+  (props, ref) => {
+
+    const { modalProps, downloadImg, imgStyle, title, downloadText = '下载大图' } = props
+    const {useToken}  = theme
+    const {token} = useToken()
+    const [open, setOpen] = useState<boolean>(false);
+    const [imgSrc, setImgSrc] = useState<string>();
+    const [contextData, setContextData] = useState<ViewLargerImageModalParams['contextData']>();
+
+    const handleCancel = () => {
+      setOpen(false);
+    }
+
+    useImperativeHandle(ref, () => {
+      return {
+        show: (_params) => {
+          setOpen(true);
+          setImgSrc(_params?.imgSrc)
+          setContextData(_params?.contextData)
+        },
+        handleCancel
+      };
+    });
+
+
+    return (
+      <Modal
+        className='zhst-biz-view-warning-larger-image-modal'
+        open={open}
+        destroyOnClose
+        title={title}
+        width="1029px"
+        footer={null}
+        onCancel={handleCancel}
+        {...modalProps}
+      >
+        <Space size={0}>
+          <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', borderRadius: '0 0 0 6px', ...imgStyle }} />
+          
+          <div className='right-context'>
+            {contextData && Object.entries(contextData).map(([key, value]) => (
+              <div key={key} >
+                <span className='context-key'>{`${key}: `}</span>
+                {value}
+              </div>
+            ))}
+
+            {imgSrc && downloadImg && <div className='img-download' style={{ color: token.colorPrimary }} onClick={() => downloadImg?.(imgSrc)} ><DownloadOutlined /><span style={{ paddingLeft: 3 }}>{downloadText}</span></div>}
+
+          </div>
+
+        </Space>
+      </Modal>
+    );
+  }
+)
+
+export default ViewLargerImageModal;
+
+export const useViewLargerImageModal = () => {
+  return useRef<ViewLargerImageModalRef>(null);
+};
\ No newline at end of file
diff --git a/packages/biz/src/ViewLargerImageModal/demo/base.tsx b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
new file mode 100644
index 0000000..6bf6d53
--- /dev/null
+++ b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
@@ -0,0 +1,70 @@
+
+import React from 'react';
+import { ViewLargerImageModal, WarningRecordCard, IRecord, useViewLargerImageModal } from '@zhst/biz';
+import { Space } from 'antd';
+import dayjs from 'dayjs';
+
+
+const dataSource = [
+  {
+    imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+    id: '1561561',
+    warningType: '火焰识别',
+    warningInfo: ['盒子2', '点位2'],
+    cabietID: '002',
+    // warningTime: "2023-03-01 ",
+    warningTimestamp: Date.now(),
+    // warningTimeFormat:"YYYY-MM-DD"
+  },
+  {
+    imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+    id: '156156155',
+    warningType: '火焰识别',
+    warningInfo: ['盒子1', '点位1'],
+    cabietID: 'C001',
+    // warningTime: "2023-03-01 ",
+    warningTimestamp: Date.now(),
+    // warningTimeFormat:"YYYY-MM-DD"
+  }
+]
+
+
+
+export default () => {
+
+  const viewLargerImageModalRef = useViewLargerImageModal()
+
+  const handleDownloadImg = () => {
+    console.log('download')
+    // 可以调用 下面 方法关闭弹窗
+    // viewLargerImageModalRef.current?.handleCancel()
+  }
+
+  const handleClick = (record?: IRecord) => {
+    const { imgSrc, warningType = '', warningInfo = [], cabietID = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+    const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
+    const warningTimeShow = warningTime ? warningTime : formattedDate
+
+    const contextData = {
+      "预警类型": warningType,
+      '预警时间': warningTimeShow,
+      '盒子': warningInfo[0],
+      '点位': warningInfo[1],
+      '柜子ID': cabietID,
+    }
+
+    viewLargerImageModalRef?.current?.show({ imgSrc: imgSrc, contextData: contextData })
+  }
+
+  return (
+    <>
+      <Space size={[8, 16]} >
+        {
+          dataSource?.map((record) => <WarningRecordCard key={record?.id} record={record} onRecordClick={(record) => { handleClick(record) }} />)
+        }
+      </Space>
+      <ViewLargerImageModal ref={viewLargerImageModalRef}  downloadImg={handleDownloadImg} title="预警大图" />
+    </>
+
+  )
+}
diff --git a/packages/biz/src/ViewLargerImageModal/index.less b/packages/biz/src/ViewLargerImageModal/index.less
new file mode 100644
index 0000000..63f97a1
--- /dev/null
+++ b/packages/biz/src/ViewLargerImageModal/index.less
@@ -0,0 +1,62 @@
+.zhst-biz-view-warning-larger-image-modal {
+    font-family: MicrosoftYaHei;
+
+  .ant-modal-content {
+    padding: 0 ;
+    height: 492px !important;
+    border-radius:6px;
+
+    .ant-modal-close {
+      top: 14px;
+      right: 16px;
+    }
+
+  .ant-modal-header {
+    height: 48px;
+    line-height: 48px;
+    margin-bottom: 0;
+
+    .ant-modal-title {
+      height: 100%;
+      line-height: 48px;
+      font-weight: bold;
+      padding-left: 20px;
+    }
+  }
+
+  .ant-modal-body {
+    height: 444px;
+
+    >div{
+      width: 100%;
+      height: 100%;
+      align-items: flex-start;
+    
+      >div:nth-child(2){
+        position: relative;
+        flex: 1;
+        box-sizing: border-box;
+        height: 100%;
+        padding: 30px 16px;
+        background-color: #F6F9FAFF;
+      
+        .right-context > div {
+          margin-bottom: 20px;
+        }
+
+        .right-context .context-key{
+          font-weight: bold;
+        }
+
+        .img-download {
+          position: absolute;
+          bottom: 0;
+          cursor: pointer;
+        }
+
+      }
+      
+    }
+  }
+    }
+}
diff --git a/packages/biz/src/ViewLargerImageModal/index.md b/packages/biz/src/ViewLargerImageModal/index.md
new file mode 100644
index 0000000..2db2c1a
--- /dev/null
+++ b/packages/biz/src/ViewLargerImageModal/index.md
@@ -0,0 +1,25 @@
+---
+group: 数据展示
+category: Components
+subtitle: 查看大图弹窗
+title: ViewLargerImageModal 查看大图弹窗
+---
+
+# ViewLargerImageModal 查看大图弹窗
+
+
+<code src="./demo/base.tsx"></code>
+
+
+
+## API
+
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| imgSrc |  图片地址 |string  |  |  |
+| contextData |  大图显示的数据 |  |  |  |
+| imgStyle |  用于修改图片样式 |  |  |  |
+| downloadImg |  传入下载图片的方法 |  |  |  |
+| title | 弹窗标题 | string  |  |  |
+| downloadText | 下载按钮文本 | string  |  |  |
+| modalProps | 弹窗属性 |  |  |  |
\ No newline at end of file
diff --git a/packages/biz/src/ViewLargerImageModal/index.tsx b/packages/biz/src/ViewLargerImageModal/index.tsx
new file mode 100644
index 0000000..52d812f
--- /dev/null
+++ b/packages/biz/src/ViewLargerImageModal/index.tsx
@@ -0,0 +1,3 @@
+import ViewLargerImageModal,{useViewLargerImageModal } from './ViewLargerImageModal'
+export default ViewLargerImageModal;
+export { useViewLargerImageModal };
\ No newline at end of file
diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index 74f0376..b4313b5 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -22,7 +22,7 @@ export interface IRecord {
   /* 
     右侧 柜子id 显示  
   */
-  cabietInfo?: string;
+  cabietID?: string;
   /* 
     直接传格式化好的时间 
   */
@@ -48,7 +48,7 @@ export interface WarningRecordCardProps {
 export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
 
   const { record, onRecordClick, style, cardProps } = props;
-  const { imgSrc = '', id = '', warningType = '', warningInfo = [], cabietInfo = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+  const { imgSrc = '', id = '', warningType = '', warningInfo = [], cabietID = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
   const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
   const warningTimeShow = warningTime ? warningTime : formattedDate
 
@@ -77,7 +77,7 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
           <div className='warning-time'>{warningTimeShow}</div>
         </div>
 
-        <div className='cabietInfo' >{cabietInfo}</div>
+        <div className='cabietInfo' >{cabietID ? `柜子ID:${cabietID}` : ''} </div>
 
       </Card>
     </div>
diff --git a/packages/biz/src/WarningRecordCard/index.md b/packages/biz/src/WarningRecordCard/index.md
index 3d286b3..886de92 100644
--- a/packages/biz/src/WarningRecordCard/index.md
+++ b/packages/biz/src/WarningRecordCard/index.md
@@ -22,7 +22,7 @@ title: WarningRecordCard 预警记录卡片
 | warningInfo | 盒子 点位 柜子 等信息 | string[] | - | - |
 | cabietInfo | 右侧 柜子信息  | string | - | - |
 | warningTime | 预警时间 格式化后的时间字符串 | string | - | - |
-| warningTimestamp | 预警时间戳 | string \| nmbuer  | - | - |
+| warningTimestamp | 预警时间戳 | string \| number  | - | - |
 | warningTimeFormat | 预警时间格式 | string | YYYY-MM-DD HH:mm:ss | - |
 
 
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 04ac73b..331b212 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -5,3 +5,4 @@ export { default as TreeTransfer } from './treeTransfer'
 export { default as TreeTransferModal } from './treeTransferModal'
 export { default as WarningRecordCard } from './WarningRecordCard'
 export type {IRecord, WarningRecordCardProps} from './WarningRecordCard'
+export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'

From cd4bf82223475b26ae55e7d2d8ecee140bb7bdd1 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Tue, 5 Mar 2024 10:27:28 +0800
Subject: [PATCH 11/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E5=A4=A7=E5=9B=BE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewLargerImageModal.tsx                  | 28 +++---
 .../src/ViewLargerImageModal/demo/base.tsx    | 57 ++++++++----
 .../biz/src/ViewLargerImageModal/index.less   | 88 ++++++++++---------
 .../biz/src/ViewLargerImageModal/index.md     |  5 +-
 .../WarningRecordCard/WarningRecordCard.tsx   | 23 +++--
 .../biz/src/WarningRecordCard/demo/base.tsx   | 63 +++++++++----
 packages/biz/src/WarningRecordCard/index.md   |  3 +-
 packages/biz/src/index.tsx                    |  2 +-
 8 files changed, 168 insertions(+), 101 deletions(-)

diff --git a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
index a046c83..5ce1283 100644
--- a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
+++ b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
@@ -6,7 +6,10 @@ import './index.less'
 
 type ViewLargerImageModalParams = {
   imgSrc?: string;
-  contextData?: { [key: string]: string | number | JSX.Element };
+  warningData?: {
+    label?: string;
+    value?: string;
+  }[];
 };
 
 interface ViewLargerImageModalRef {
@@ -18,7 +21,7 @@ interface ViewLargerImageModalProps {
   imgStyle?: React.CSSProperties;
   downloadImg?: (imgSrc: string) => void;
   title: string;
-  downloadText?:string;
+  downloadText?: string;
   modalProps?: ModalProps
 }
 
@@ -26,11 +29,11 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
   (props, ref) => {
 
     const { modalProps, downloadImg, imgStyle, title, downloadText = '下载大图' } = props
-    const {useToken}  = theme
-    const {token} = useToken()
+    const { useToken } = theme
+    const { token } = useToken()
     const [open, setOpen] = useState<boolean>(false);
     const [imgSrc, setImgSrc] = useState<string>();
-    const [contextData, setContextData] = useState<ViewLargerImageModalParams['contextData']>();
+    const [warningData, setWarningData] = useState<ViewLargerImageModalParams['warningData']>();
 
     const handleCancel = () => {
       setOpen(false);
@@ -41,13 +44,12 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
         show: (_params) => {
           setOpen(true);
           setImgSrc(_params?.imgSrc)
-          setContextData(_params?.contextData)
+          setWarningData(_params?.warningData)
         },
         handleCancel
       };
     });
 
-
     return (
       <Modal
         className='zhst-biz-view-warning-larger-image-modal'
@@ -59,13 +61,13 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
         onCancel={handleCancel}
         {...modalProps}
       >
-        <Space size={0}>
+        <Space size={0} styles={{ item: { backgroundColor: token.colorBgElevated } }}>
           <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', borderRadius: '0 0 0 6px', ...imgStyle }} />
-          
-          <div className='right-context'>
-            {contextData && Object.entries(contextData).map(([key, value]) => (
-              <div key={key} >
-                <span className='context-key'>{`${key}: `}</span>
+
+          <div className='right-context' style={{ borderRadius: '0 0 0 6px' }}>
+            {warningData?.map(({ label, value }) => (
+              <div key={label} >
+                <span className='context-key'>{`${label}: `}</span>
                 {value}
               </div>
             ))}
diff --git a/packages/biz/src/ViewLargerImageModal/demo/base.tsx b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
index 6bf6d53..a81c120 100644
--- a/packages/biz/src/ViewLargerImageModal/demo/base.tsx
+++ b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
@@ -5,13 +5,16 @@ import { Space } from 'antd';
 import dayjs from 'dayjs';
 
 
-const dataSource = [
+
+// 结合预警图列表 演示查看预警大图的使用    例如 后端返回这样的数据结构
+const backEndData = [
   {
     imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
     id: '1561561',
     warningType: '火焰识别',
-    warningInfo: ['盒子2', '点位2'],
-    cabietID: '002',
+    boxId: '2',
+    position: '2',
+    cabietId: '002',
     // warningTime: "2023-03-01 ",
     warningTimestamp: Date.now(),
     // warningTimeFormat:"YYYY-MM-DD"
@@ -20,18 +23,36 @@ const dataSource = [
     imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
     id: '156156155',
     warningType: '火焰识别',
-    warningInfo: ['盒子1', '点位1'],
-    cabietID: 'C001',
+    boxId: '1',
+    position: '1',
+    cabietId: '001',
     // warningTime: "2023-03-01 ",
     warningTimestamp: Date.now(),
     // warningTimeFormat:"YYYY-MM-DD"
   }
 ]
 
+// 前端处理数据结构
+const dataSource = backEndData.map(o => {
+  return {
+    imgSrc: o.imgSrc,
+    id: o.id,
+    warningType: o.warningType,
+    boxId: o.boxId,
+    position: o.position,
+    cabietId: o.cabietId,
+    //,`柜子ID: ${o.cabietId}`
+    warningInfo: [`盒子${o.boxId}`, `位置${o.position}`],
+    cabietText: `柜子ID: ${o.cabietId}`,
+    warningTimestamp: o.warningTimestamp,
+  }
+})
+
 
 
 export default () => {
 
+  // 把弹窗的ref 拿出来
   const viewLargerImageModalRef = useViewLargerImageModal()
 
   const handleDownloadImg = () => {
@@ -41,19 +62,20 @@ export default () => {
   }
 
   const handleClick = (record?: IRecord) => {
-    const { imgSrc, warningType = '', warningInfo = [], cabietID = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+    // 点击的时候把数据 拿过来处理一下传给大图弹框
+    const { imgSrc, warningType, boxId, position, cabietId, warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
     const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
     const warningTimeShow = warningTime ? warningTime : formattedDate
-
-    const contextData = {
-      "预警类型": warningType,
-      '预警时间': warningTimeShow,
-      '盒子': warningInfo[0],
-      '点位': warningInfo[1],
-      '柜子ID': cabietID,
-    }
-
-    viewLargerImageModalRef?.current?.show({ imgSrc: imgSrc, contextData: contextData })
+    //用于渲染右侧的 信息
+    const warningData = [
+      { label: '预警类型', value: warningType },
+      { label: '预警时间', value: warningTimeShow },
+      { label: '盒子', value: boxId },
+      { label: '点位', value: position },
+      { label: '柜子ID', value: cabietId },
+    ]
+    // 调用这个方法打开弹框
+    viewLargerImageModalRef?.current?.show({ imgSrc: imgSrc, warningData: warningData })
   }
 
   return (
@@ -63,7 +85,8 @@ export default () => {
           dataSource?.map((record) => <WarningRecordCard key={record?.id} record={record} onRecordClick={(record) => { handleClick(record) }} />)
         }
       </Space>
-      <ViewLargerImageModal ref={viewLargerImageModalRef}  downloadImg={handleDownloadImg} title="预警大图" />
+      {/* 弹窗 绑定ref 后可以调用 handleCancel方法关闭弹窗 show方法打开弹窗 */}
+      <ViewLargerImageModal ref={viewLargerImageModalRef} downloadImg={handleDownloadImg} title="预警大图" />
     </>
 
   )
diff --git a/packages/biz/src/ViewLargerImageModal/index.less b/packages/biz/src/ViewLargerImageModal/index.less
index 63f97a1..0c81850 100644
--- a/packages/biz/src/ViewLargerImageModal/index.less
+++ b/packages/biz/src/ViewLargerImageModal/index.less
@@ -1,62 +1,66 @@
 .zhst-biz-view-warning-larger-image-modal {
-    font-family: MicrosoftYaHei;
+  font-family: MicrosoftYaHei;
 
   .ant-modal-content {
-    padding: 0 ;
-    height: 492px !important;
-    border-radius:6px;
+    padding: 0;
+    height: 492px;
+    border-radius: 6px;
 
     .ant-modal-close {
       top: 14px;
       right: 16px;
     }
 
-  .ant-modal-header {
-    height: 48px;
-    line-height: 48px;
-    margin-bottom: 0;
-
-    .ant-modal-title {
-      height: 100%;
+    .ant-modal-header {
+      height: 48px;
       line-height: 48px;
-      font-weight: bold;
-      padding-left: 20px;
-    }
-  }
+      margin-bottom: 0;
 
-  .ant-modal-body {
-    height: 444px;
-
-    >div{
-      width: 100%;
-      height: 100%;
-      align-items: flex-start;
-    
-      >div:nth-child(2){
-        position: relative;
-        flex: 1;
-        box-sizing: border-box;
+      .ant-modal-title {
         height: 100%;
-        padding: 30px 16px;
-        background-color: #F6F9FAFF;
-      
-        .right-context > div {
-          margin-bottom: 20px;
+        line-height: 48px;
+        font-weight: bold;
+        padding-left: 20px;
+      }
+    }
+
+    .ant-modal-body {
+      height: 444px;
+
+      >div {
+        width: 100%;
+        height: 100%;
+        align-items: flex-start;
+
+        >div:nth-child(1) {
+          border-bottom-left-radius: 6px;
         }
 
-        .right-context .context-key{
-          font-weight: bold;
-        }
+        >div:nth-child(2) {
+          position: relative;
+          flex: 1;
+          box-sizing: border-box;
+          height: 100%;
+          padding: 30px 16px;
+          border-bottom-right-radius: 6px;
+
+          .right-context>div {
+            margin-bottom: 20px;
+          }
+
+          .right-context .context-key {
+            font-weight: bold;
+          }
+
+          .img-download {
+            position: absolute;
+            bottom: 0;
+            cursor: pointer;
+          }
 
-        .img-download {
-          position: absolute;
-          bottom: 0;
-          cursor: pointer;
         }
 
       }
-      
     }
   }
-    }
-}
+}
\ No newline at end of file
diff --git a/packages/biz/src/ViewLargerImageModal/index.md b/packages/biz/src/ViewLargerImageModal/index.md
index 2db2c1a..d4ae110 100644
--- a/packages/biz/src/ViewLargerImageModal/index.md
+++ b/packages/biz/src/ViewLargerImageModal/index.md
@@ -16,10 +16,13 @@ title: ViewLargerImageModal 查看大图弹窗
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
+| show() |通过 ref 用于开启弹窗 可以将点击的 记录传给弹窗|  |  |  |
+| handleCancel() | 通过 ref 用于关闭弹窗 |  |  |  |
 | imgSrc |  图片地址 |string  |  |  |
 | contextData |  大图显示的数据 |  |  |  |
 | imgStyle |  用于修改图片样式 |  |  |  |
 | downloadImg |  传入下载图片的方法 |  |  |  |
 | title | 弹窗标题 | string  |  |  |
 | downloadText | 下载按钮文本 | string  |  |  |
-| modalProps | 弹窗属性 |  |  |  |
\ No newline at end of file
+| modalProps | 弹窗属性 |  |  |  |
+
diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index b4313b5..9e94dd8 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -10,7 +10,6 @@ export interface IRecord {
   imgSrc?: string;
 
   id?: string;
-
   /**
    * 预警类型
    */
@@ -19,10 +18,22 @@ export interface IRecord {
    用于显示  盒子 点位 柜子 等信息
   */
   warningInfo?: string[]
-  /* 
-    右侧 柜子id 显示  
+  /*
+   盒子 ID
   */
-  cabietID?: string;
+  boxId: string;
+  /*
+   位置信息
+  */
+  position: string;
+  /* 
+    柜子id 
+  */
+  cabietId?: string;
+  /* 
+   右侧 柜子id 显示  
+ */
+  cabietText?: string;
   /* 
     直接传格式化好的时间 
   */
@@ -48,7 +59,7 @@ export interface WarningRecordCardProps {
 export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
 
   const { record, onRecordClick, style, cardProps } = props;
-  const { imgSrc = '', id = '', warningType = '', warningInfo = [], cabietID = '', warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
+  const { imgSrc, id, warningType, warningInfo = [], cabietText, warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
   const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
   const warningTimeShow = warningTime ? warningTime : formattedDate
 
@@ -77,7 +88,7 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
           <div className='warning-time'>{warningTimeShow}</div>
         </div>
 
-        <div className='cabietInfo' >{cabietID ? `柜子ID:${cabietID}` : ''} </div>
+        <div className='cabietInfo' >{cabietText}</div>
 
       </Card>
     </div>
diff --git a/packages/biz/src/WarningRecordCard/demo/base.tsx b/packages/biz/src/WarningRecordCard/demo/base.tsx
index b5938a8..8fcaf69 100644
--- a/packages/biz/src/WarningRecordCard/demo/base.tsx
+++ b/packages/biz/src/WarningRecordCard/demo/base.tsx
@@ -1,30 +1,55 @@
 
 import React from 'react';
-import {WarningRecordCard,type IRecord} from '@zhst/biz';
+import { WarningRecordCard, type IRecord } from '@zhst/biz';
 import { Space } from 'antd';
 
-const props = {
-    record :
-      {
-        imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
-        id: '1561561',
-        warningType: '火焰识别',
-        warningInfo:['盒子1','点位1'],
-        cabietInfo: '柜子ID : C001', 
-        // warningTime: "2023-03-01 ",
-        warningTimestamp :Date.now() ,
-        // warningTimeFormat:"YYYY-MM-DD"
-      },
-      onRecordClick:(record?:IRecord) =>{
-        console.log(record)
-      },
-      // cardProps:{ style:{width:5000}}
-}
+// 例如 后端返回这样的数据结构
+const backEndData = [
+  {
+    imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+    id: '1561561',
+    warningType: '火焰识别',
+    boxId: '2',
+    position: '2',
+    cabietId: '002',
+    // warningTime: "2023-03-01 ",
+    warningTimestamp: Date.now(),
+    // warningTimeFormat:"YYYY-MM-DD"
+  },
+  {
+    imgSrc: 'https://i.yourimageshare.com/lRHiD2UnAT.png',
+    id: '156156155',
+    warningType: '火焰识别',
+    boxId: '1',
+    position: '1',
+    cabietId: '001',
+    // warningTime: "2023-03-01 ",
+    warningTimestamp: Date.now(),
+    // warningTimeFormat:"YYYY-MM-DD"
+  }
+]
+
+// 前端处理数据结构
+const dataSource = backEndData.map(o => {
+  return {
+    imgSrc: o.imgSrc,
+    id: o.id,
+    warningType: o.warningType,
+    boxId: o.boxId,
+    position: o.position,
+    cabietId: o.cabietId,
+    warningInfo: [`盒子${o.boxId}`, `位置${o.position}`, `柜子ID: ${o.cabietId}`],
+    // cabietText: `柜子ID: ${o.cabietId}`,  
+    warningTimestamp: o.warningTimestamp,
+  }
+})
 
 export default () => {
   return (
     <Space size={[8, 16]} direction="vertical">
-      <WarningRecordCard {...props }/>
+      {
+        dataSource?.map((record) => <WarningRecordCard key={record?.id} record={record} />)
+      }
     </Space>
   )
 }
diff --git a/packages/biz/src/WarningRecordCard/index.md b/packages/biz/src/WarningRecordCard/index.md
index 886de92..bb9e648 100644
--- a/packages/biz/src/WarningRecordCard/index.md
+++ b/packages/biz/src/WarningRecordCard/index.md
@@ -20,7 +20,7 @@ title: WarningRecordCard 预警记录卡片
 | id | 数据的唯一id 用于key 传值| string | - | - |
 | warningType | 预警类型 | string | - | - |
 | warningInfo | 盒子 点位 柜子 等信息 | string[] | - | - |
-| cabietInfo | 右侧 柜子信息  | string | - | - |
+| cabietText | 右侧 柜子信息  | string | - | - |
 | warningTime | 预警时间 格式化后的时间字符串 | string | - | - |
 | warningTimestamp | 预警时间戳 | string \| number  | - | - |
 | warningTimeFormat | 预警时间格式 | string | YYYY-MM-DD HH:mm:ss | - |
@@ -28,4 +28,3 @@ title: WarningRecordCard 预警记录卡片
 
 
 
-
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 331b212..217fbd0 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -4,5 +4,5 @@ export { default as Tree } 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'
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard'
 export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'

From 1633eb9c99d3df631e1a6f390cc4ef4b9d9d05b2 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Tue, 5 Mar 2024 11:11:36 +0800
Subject: [PATCH 12/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E5=A4=A7=E5=9B=BE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewLargerImageModal/ViewLargerImageModal.tsx  |  7 ++++---
 packages/biz/src/WarningRecordCard/index.less      | 14 +++++++-------
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
index 5ce1283..c893144 100644
--- a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
+++ b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
@@ -1,5 +1,5 @@
 import React, { useImperativeHandle, useRef, useState, forwardRef } from 'react';
-import { Modal, ModalProps, Space } from 'antd';
+import { Modal, ModalProps, Space, SpaceProps } from 'antd';
 import theme from 'antd/lib/theme';
 import { DownloadOutlined } from '@ant-design/icons';
 import './index.less'
@@ -23,12 +23,13 @@ interface ViewLargerImageModalProps {
   title: string;
   downloadText?: string;
   modalProps?: ModalProps
+  spaceProps?: SpaceProps;
 }
 
 export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLargerImageModalProps>(
   (props, ref) => {
 
-    const { modalProps, downloadImg, imgStyle, title, downloadText = '下载大图' } = props
+    const { modalProps, downloadImg, imgStyle, title, downloadText = '下载大图' ,spaceProps} = props
     const { useToken } = theme
     const { token } = useToken()
     const [open, setOpen] = useState<boolean>(false);
@@ -61,7 +62,7 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
         onCancel={handleCancel}
         {...modalProps}
       >
-        <Space size={0} styles={{ item: { backgroundColor: token.colorBgElevated } }}>
+        <Space size={0} styles={{ item: { backgroundColor: '#F6F9FAFF' } }} {...spaceProps}>
           <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', borderRadius: '0 0 0 6px', ...imgStyle }} />
 
           <div className='right-context' style={{ borderRadius: '0 0 0 6px' }}>
diff --git a/packages/biz/src/WarningRecordCard/index.less b/packages/biz/src/WarningRecordCard/index.less
index a7ca119..f6e2887 100644
--- a/packages/biz/src/WarningRecordCard/index.less
+++ b/packages/biz/src/WarningRecordCard/index.less
@@ -1,6 +1,6 @@
 .zhst-biz-warning-record-card {
   .ant-card-body {
-    padding: 0 !important;
+    padding: 0;
     font-family: MicrosoftYaHei;
     line-height: 19px;
     display: flex;
@@ -9,17 +9,17 @@
     .left-context {
       flex: 1;
 
-    > div{
+      >div {
         margin-top: 6px;
       }
 
-    > div:nth-child(1) {
-          margin-top: 0;
+      >div:nth-child(1) {
+        margin-top: 0;
       }
     }
-   
-    .description{
+
+    .description {
       font-weight: bold;
     }
   }
-}
+}
\ No newline at end of file

From c5e262a384e9dfccfdf3d6f0e8726ee0d39b53f6 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Wed, 6 Mar 2024 15:18:14 +0800
Subject: [PATCH 13/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E9=A2=84?=
 =?UTF-8?q?=E8=AD=A6=E5=A4=A7=E5=9B=BE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewLargerImageModal.tsx                  |  6 ++--
 .../biz/src/ViewLargerImageModal/index.less   |  6 +---
 packages/biz/src/WarningRecordCard/index.less | 34 ++++++++++---------
 packages/biz/src/index.tsx                    |  4 +++
 4 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
index c893144..72170f9 100644
--- a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
+++ b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
@@ -38,7 +38,7 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
 
     const handleCancel = () => {
       setOpen(false);
-    }
+    } 
 
     useImperativeHandle(ref, () => {
       return {
@@ -63,9 +63,9 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
         {...modalProps}
       >
         <Space size={0} styles={{ item: { backgroundColor: '#F6F9FAFF' } }} {...spaceProps}>
-          <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', borderRadius: '0 0 0 6px', ...imgStyle }} />
+          <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', ...imgStyle }} />
 
-          <div className='right-context' style={{ borderRadius: '0 0 0 6px' }}>
+          <div className='right-context'>
             {warningData?.map(({ label, value }) => (
               <div key={label} >
                 <span className='context-key'>{`${label}: `}</span>
diff --git a/packages/biz/src/ViewLargerImageModal/index.less b/packages/biz/src/ViewLargerImageModal/index.less
index 0c81850..32363d0 100644
--- a/packages/biz/src/ViewLargerImageModal/index.less
+++ b/packages/biz/src/ViewLargerImageModal/index.less
@@ -5,6 +5,7 @@
     padding: 0;
     height: 492px;
     border-radius: 6px;
+    overflow: hidden;
 
     .ant-modal-close {
       top: 14px;
@@ -32,17 +33,12 @@
         height: 100%;
         align-items: flex-start;
 
-        >div:nth-child(1) {
-          border-bottom-left-radius: 6px;
-        }
-
         >div:nth-child(2) {
           position: relative;
           flex: 1;
           box-sizing: border-box;
           height: 100%;
           padding: 30px 16px;
-          border-bottom-right-radius: 6px;
 
           .right-context>div {
             margin-bottom: 20px;
diff --git a/packages/biz/src/WarningRecordCard/index.less b/packages/biz/src/WarningRecordCard/index.less
index f6e2887..cb25750 100644
--- a/packages/biz/src/WarningRecordCard/index.less
+++ b/packages/biz/src/WarningRecordCard/index.less
@@ -1,25 +1,27 @@
 .zhst-biz-warning-record-card {
-  .ant-card-body {
-    padding: 0;
-    font-family: MicrosoftYaHei;
-    line-height: 19px;
-    display: flex;
-    margin-top: 10px;
+  cursor: pointer;
 
-    .left-context {
-      flex: 1;
+.ant-card-body {
+  padding: 0;
+  font-family: MicrosoftYaHei;
+  line-height: 19px;
+  display: flex;
+  margin-top: 10px;
 
-      >div {
-        margin-top: 6px;
-      }
+  .left-context {
+    flex: 1;
 
-      >div:nth-child(1) {
-        margin-top: 0;
-      }
+    >div {
+      margin-top: 6px;
     }
 
-    .description {
-      font-weight: bold;
+    >div:nth-child(1) {
+      margin-top: 0;
     }
   }
+
+  .description {
+    font-weight: bold;
+  }
+}
 }
\ No newline at end of file
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 217fbd0..8d54007 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -6,3 +6,7 @@ export { default as TreeTransferModal } from './treeTransferModal'
 export { default as WarningRecordCard } from './WarningRecordCard'
 export type { IRecord, WarningRecordCardProps } from './WarningRecordCard'
 export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'
+export type { VideoPlayerCardProps } from './VideoPlayerCard'
+export { default as VideoPlayerCard } from './VideoPlayerCard'
+export { default as WindowToggle } from './WindowToggle'
+

From 690fcd9e20bf0ab729a652c3c8511eb9018e0850 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E5=BF=97=E9=9B=84?= <jiangzhixiong@smartvision.cn>
Date: Wed, 6 Mar 2024 17:15:34 +0800
Subject: [PATCH 14/24] =?UTF-8?q?fix:=20biz=E7=BB=84=E4=BB=B6=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=20boxSelectTree=20=E7=BB=84=E4=BB=B6=EF=BC=8C?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=8F=AF=E4=BB=A5=E8=87=AA=E5=AE=9A=E4=B9=89?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=E6=8C=89=E9=92=AE=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/CHANGELOG.md                     |  26 +++
 .../hooks/useIntelligentTracking/index.d.ts   |  15 +-
 packages/biz/es/index.d.ts                    |   1 +
 packages/biz/es/utils/constants.d.ts          |   8 +
 packages/biz/es/utils/constants.js            |  15 +-
 packages/biz/lib/index.d.ts                   |   1 +
 packages/biz/lib/utils/constants.d.ts         |   8 +
 packages/biz/lib/utils/constants.js           |  11 +
 packages/biz/package.json                     |   2 +-
 .../WarningRecordCard/WarningRecordCard.tsx   |  15 +-
 .../biz/src/boxSelectTree/boxSelectTree.tsx   |  10 +-
 .../components/boxPanel/index.tsx             | 163 +++++++++------
 packages/biz/src/boxSelectTree/demo/basic.tsx |  21 +-
 packages/biz/src/boxSelectTree/demo/mock.tsx  |  45 ++--
 .../biz/src/boxSelectTree/demo/noOptions.tsx  |  61 ++++++
 packages/biz/src/boxSelectTree/index.md       |   7 +
 packages/biz/src/index.tsx                    |   1 +
 packages/biz/src/tree/boxTree.tsx             | 112 ++++++----
 packages/biz/src/tree/demo/customOptions.tsx  |  23 +++
 .../biz/src/tree/demo/customTitleRender.tsx   |   7 +-
 packages/biz/src/tree/index.md                |   7 +
 packages/biz/src/tree/index.tsx               |   7 +
 packages/biz/src/treeTransfer/index.md        |   2 +
 .../treeTransferModal/TreeTransferModal.tsx   |  42 ++--
 .../biz/src/treeTransferModal/demo/basic.tsx  |   4 +-
 packages/biz/src/treeTransferModal/index.md   |   2 +
 packages/biz/src/utils/constants.ts           |  10 +
 packages/func/CHANGELOG.md                    |  15 ++
 packages/func/package.json                    |   2 +-
 packages/hooks/CHANGELOG.md                   |  18 ++
 packages/hooks/es/useActivateWrapper/index.js |   2 +-
 packages/hooks/package.json                   |   2 +-
 packages/meta/CHANGELOG.md                    |  19 ++
 packages/meta/package.json                    |   2 +-
 packages/request/CHANGELOG.md                 |  12 ++
 packages/request/es/index.js                  | 193 ------------------
 packages/request/lib/index.js                 | 155 --------------
 packages/request/package.json                 |   2 +-
 38 files changed, 513 insertions(+), 535 deletions(-)
 create mode 100644 packages/biz/src/boxSelectTree/demo/noOptions.tsx
 create mode 100644 packages/biz/src/tree/demo/customOptions.tsx

diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index ec30caf..ab61f46 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,31 @@
 # @zhst/biz
 
+## 0.9.0
+
+### Minor Changes
+
+- 优化 boxSelectTree 组件，添加可以自定义配置按钮功能
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/hooks@0.8.1
+  - @zhst/func@0.7.2
+  - @zhst/meta@0.8.2
+
+## 0.8.0
+
+### Minor Changes
+
+- @zhst/biz 优化数组件
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/hooks@0.8.0
+  - @zhst/func@0.7.1
+  - @zhst/meta@0.8.1
+
 ## 0.7.0
 
 ### Minor Changes
diff --git a/packages/biz/es/hooks/useIntelligentTracking/index.d.ts b/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
index bd6e0e3..c1e54ef 100644
--- a/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
+++ b/packages/biz/es/hooks/useIntelligentTracking/index.d.ts
@@ -15,19 +15,13 @@ export declare const getTaskCameraByCenterAndPower: (value: {
         bodyPower: number;
     };
     cameraInfos: Array<Object>;
-    center: [
-        number,
-        number
-    ];
+    center: [number, number];
 }) => Promise<Object[]>;
 /**创建追踪任务 */
 export declare const createIntelligentTrack: (value: {
     images: Array<Object>;
     deviceIds: Array<string>;
-    circleCenter: [
-        number,
-        number
-    ];
+    circleCenter: [number, number];
     model: number;
     circleRadius: number;
     facePower?: number;
@@ -39,10 +33,7 @@ export declare const emitHeartbeat: (smartTrackId: number) => Promise<void>;
 export declare const ModifyTrackCameras: (value: {
     smartTrackId: number;
     deviceIds: Array<number>;
-    centerPoint: [
-        number,
-        number
-    ];
+    centerPoint: [number, number];
 }) => Promise<void>;
 export declare const setIntelligentTrackCircleInfo: (smartTrackId: number, circleCenter: [number, number]) => Promise<void>;
 export declare const getTackCameraInfo: (value: {
diff --git a/packages/biz/es/index.d.ts b/packages/biz/es/index.d.ts
index bc308c1..259e6bc 100644
--- a/packages/biz/es/index.d.ts
+++ b/packages/biz/es/index.d.ts
@@ -1,6 +1,7 @@
 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';
diff --git a/packages/biz/es/utils/constants.d.ts b/packages/biz/es/utils/constants.d.ts
index 45a9a99..0180cc0 100644
--- a/packages/biz/es/utils/constants.d.ts
+++ b/packages/biz/es/utils/constants.d.ts
@@ -21,3 +21,11 @@ export declare const DeviceTab: {
     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;
+}[];
diff --git a/packages/biz/es/utils/constants.js b/packages/biz/es/utils/constants.js
index 1ad86ba..925bab4 100644
--- a/packages/biz/es/utils/constants.js
+++ b/packages/biz/es/utils/constants.js
@@ -27,4 +27,17 @@ export var DeviceTab = {
   REAL_CAMERA_NOFACE: 6,
   REAL_CAMERA_ONLYFACE: 7,
   REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8 // 只有普通摄像头，没有人脸、没有盒子、直连
-};
\ No newline at end of file
+};
+
+// 盒子 Tab 切换
+export var BOX_TYPE_LIST = [{
+  value: '1',
+  label: '盒子'
+}, {
+  value: '2',
+  label: '盒子组'
+}];
+export var ALL_LIST = [{
+  value: '',
+  label: '全部'
+}];
\ No newline at end of file
diff --git a/packages/biz/lib/index.d.ts b/packages/biz/lib/index.d.ts
index bc308c1..259e6bc 100644
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@@ -1,6 +1,7 @@
 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';
diff --git a/packages/biz/lib/utils/constants.d.ts b/packages/biz/lib/utils/constants.d.ts
index 45a9a99..0180cc0 100644
--- a/packages/biz/lib/utils/constants.d.ts
+++ b/packages/biz/lib/utils/constants.d.ts
@@ -21,3 +21,11 @@ export declare const DeviceTab: {
     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;
+}[];
diff --git a/packages/biz/lib/utils/constants.js b/packages/biz/lib/utils/constants.js
index 6c57f12..733d65a 100644
--- a/packages/biz/lib/utils/constants.js
+++ b/packages/biz/lib/utils/constants.js
@@ -19,7 +19,9 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // 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,
@@ -62,9 +64,18 @@ var DeviceTab = {
   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,
diff --git a/packages/biz/package.json b/packages/biz/package.json
index 2f7e962..687a741 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "业务库",
   "keywords": [
     "business",
diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index a555952..6230bf8 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -19,23 +19,24 @@ export interface IRecord {
    用于显示  盒子 点位 柜子 等信息
   */
   warningInfo?: string[]
-  /* 
-    右侧 柜子id 显示  
+  /*
+    右侧 柜子id 显示
   */
   cabietInfo?: string;
-  /* 
-    直接传格式化好的时间 
+  /*
+    直接传格式化好的时间
   */
   warningTime?: string ;
-  /* 
+  /*
     传格时间戳
   */
   warningTimestamp?: string | number
-  /* 
-    传格时间格式 
+  /*
+    传格时间格式
     @default YYYY-MM-DD HH:mm:ss
   */
   warningTimeFormat?: string;
+
 };
 
 export interface WarningRecordCardProps {
diff --git a/packages/biz/src/boxSelectTree/boxSelectTree.tsx b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
index fe3914e..82255fa 100644
--- a/packages/biz/src/boxSelectTree/boxSelectTree.tsx
+++ b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
@@ -16,6 +16,8 @@ export interface BoxSelectTreeProps {
   tabsProps?: TabsProps
   searchInputProps?: InputProps
   treeProps?: TreeProps
+  showOptions?: boolean
+  customImport?: any
 }
 
 const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
@@ -31,7 +33,9 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
     onCreateSubmit,
     tabsProps,
     searchInputProps,
-    treeProps
+    treeProps,
+    customImport,
+    showOptions = true
   } = props
 
   const onChange = (key: string) => {
@@ -54,6 +58,8 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           onSearch={onSearch}
           onItemCheck={onItemCheck}
           onItemSelect={onItemSelect}
+          showOptions={showOptions}
+          customImport={customImport}
         />
       )
     },
@@ -72,6 +78,8 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           onSearch={onSearch}
           onItemCheck={onItemCheck}
           onItemSelect={onItemSelect}
+          showOptions={showOptions}
+          customImport={customImport}
         />
       )
     },
diff --git a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
index 0cad4a0..361d3b0 100644
--- a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
@@ -1,13 +1,14 @@
 import React, { FC, useState, useRef } from 'react';
 import{ Button, Divider, Input, Space, TreeDataNode } from 'antd'
 import { ModalForm, ModalFormProps, ProFormInstance, ProFormText } from '@ant-design/pro-components'
-import { DiffOutlined, SwitcherOutlined  } from '@ant-design/icons'
+import { ClockCircleOutlined, CloseCircleOutlined, DiffOutlined, FolderAddOutlined, ImportOutlined, SwitcherOutlined  } from '@ant-design/icons'
 import type { TreeProps, InputProps } from 'antd';
 import TreeTransferModal from '../../../treeTransferModal'
 import BoxTree from '../../../tree';
 
 export interface BoxGroupPanelProps {
   searchInputProps?: InputProps
+  showOptions?: boolean
   treeProps?: TreeProps
   data: TreeDataNode[]
   boxDataSource: TreeDataNode[]
@@ -18,11 +19,16 @@ export interface BoxGroupPanelProps {
   onBoxBatchDelete?: (data?: any) => void
   onBoxDelete?: (data?: any) => void
   onCreateSubmit?: ModalFormProps['onFinish']
+  onClockClick?: () => void
+  customImport?: any
+  extraBtns?: any
 }
 
 const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
   const {
     searchInputProps,
+    showOptions = true,
+    extraBtns,
     data = [],
     onSearch,
     treeProps,
@@ -31,7 +37,9 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
     onCreateSubmit,
     onBoxBatchDelete,
     onBoxDelete,
-    boxDataSource
+    onClockClick,
+    boxDataSource,
+    customImport
   } = props
   const [isTreeCheckable, setIsTreeCheckable] = useState(false)
   const [targetItems, setTargetItems] = useState<TreeDataNode[]>([]);
@@ -40,8 +48,7 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
   const createFormRef = useRef<
     ProFormInstance<{
       name: string;
-      company?: string;
-      useMode?: string;
+      boxList?: any[];
     }>
   >()
 
@@ -75,89 +82,109 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
     setTargetItems(pre => pre.filter(o => o.key !== key))
   }
 
-  const onOk = (data: any) => {
-    console.log('data', data)
+  // 盒子点击确定
+  const onBoxChoiceOk = async (data: any) => {
+    createFormRef.current?.setFieldValue('boxList', data)
+    createFormRef.current?.setFieldValue('boxName', 123)
+    console.log(createFormRef.current?.getFieldValue('boxList'))
+    setBoxChoiceOpen(false)
   }
 
-  const onReset = () => {
+  // 盒子选择重置
+  const onBoxChoiceReset = () => {
     setCheckedKeys([])
     setTargetItems([])
   }
 
   return (
     <div style={{ padding: '0 16px' }}>
+      {/* 盒子选择弹框 */}
       <TreeTransferModal
         open={boxChoiceOpen}
         onCancel={() => setBoxChoiceOpen(false)}
-        onRadioChange={(val) => console.log('radio', val)}    // 顶部 radio 事件
+        onRadioChange={(e) => console.log('radio', e.target.value)}    // 顶部 radio 事件
         dataSource={boxDataSource}                   // 数据源
         targetItems={targetItems}               // 右侧选中项
         checkedKeys={checkedKeys}               // 左侧选中
-        onReset={onReset}                       // 重置按钮事件
-        onOk={onOk}                             // 确定按钮事件
+        onReset={onBoxChoiceReset}                       // 重置按钮事件
+        onOk={onBoxChoiceOk}                             // 确定按钮事件
         onTreeCheck={onTreeCheck}               // 树check选中事件
         onItemDelete={onItemDelete}             // 右侧点击删除事件
       />
-      <Space size={12} direction='vertical'>
-        <Space>
+      <Space size={12} direction='vertical' style={{ width: '100%' }}>
+        <Space size={4}  style={{ width: '100%', justifyContent: 'space-between' }} >
           <Input size='middle' onChange={(e) => onSearch?.(e)} placeholder='请输入盒子名称' {...searchInputProps} />
-          <Button style={{ width: '80px' }} type='primary' >导入盒子</Button>
+          {customImport || (
+            <>
+              <Button type="text" onClick={() => handleCheckable()} icon={!isTreeCheckable ? <DiffOutlined /> : <SwitcherOutlined />} />
+              <Button type="text" onClick={() => onClockClick?.()} icon={<ClockCircleOutlined />} />
+            </>
+          )}
         </Space>
-        <Space align='center'>
-          <ModalForm
-            width={'600px'}
-            formRef={createFormRef}
-            title="新建组"
-            modalProps={{ destroyOnClose: true }}
-            layout='horizontal'
-            labelCol={{ span: 6 }}
-            wrapperCol={{ span: 18 }}
-            trigger={<Button type='link' >新建组</Button>}
-            submitter={{
-              searchConfig: {
-                submitText: '确定',
-                resetText: '取消',
-              },
-            }}
-            onFinish={onCreateSubmit}
-          >
-            <ProFormText
-              rules={[
-                {
-                  required: true,
-                },
-              ]}
-              width="md"
-              name="name"
-              label="盒子组名称"
-              placeholder="请输入盒子名称"
-            />
-            <ProFormText
-              width="md"
-              name="boxList"
-              label="盒子选择"
-              placeholder="已选择0个盒子"
-              fieldProps={{
-                readOnly: true,
-                suffix: (
-                  <Space>
-                    <a onClick={() => {
-                      createFormRef.current?.setFieldValue('boxList', null)
-                    }} >恢复默认</a>
-                    <a onClick={() => setBoxChoiceOpen(true)}>范围选择</a>
-                  </Space>
-                )
-              }}
-            />
-          </ModalForm>
-          <Divider type="vertical" />
-          {/* @ts-ignore */}
-          <Button danger type='link' disabled={treeProps?.checkedKeys?.length <= 0} onClick={onBoxBatchDelete} >删除</Button>
-          <Divider type="vertical" />
-          <Button type="link" onClick={() => handleCheckable()} icon={isTreeCheckable ? <DiffOutlined /> : <SwitcherOutlined />} />
-          <Button type="link" onClick={() => handleCheckable()} icon={isTreeCheckable ? <DiffOutlined /> : <SwitcherOutlined />} />
-        </Space>
-        <Divider style={{ margin: 0 }} />
+        {/* 是否显示操作按钮 */}
+        {showOptions && (
+          <>
+            <Space align='center'>
+              <Button type='text' style={{ padding: '4px 8px' }} icon={<ImportOutlined />} >导入盒子</Button>
+              <Divider type="vertical" style={{ margin: '8px 0' }} />
+              <ModalForm<{
+                name: string
+                boxList?: any[]
+              }>
+                width={'600px'}
+                formRef={createFormRef}
+                title="新建组"
+                modalProps={{ destroyOnClose: true }}
+                layout='horizontal'
+                labelCol={{ span: 6 }}
+                wrapperCol={{ span: 18 }}
+                trigger={<Button type='text' style={{ padding: '4px 8px' }} icon={<FolderAddOutlined />} >新建组</Button>}
+                submitter={{
+                  searchConfig: {
+                    submitText: '确定',
+                    resetText: '取消',
+                  },
+                }}
+                onFinish={onCreateSubmit}
+              >
+                <ProFormText
+                  rules={[
+                    {
+                      required: true,
+                    },
+                  ]}
+                  width="md"
+                  name="name"
+                  label="盒子组名称"
+                  placeholder="请输入盒子名称"
+                />
+                <ProFormText
+                  width="md"
+                  name="boxList"
+                  label="盒子选择"
+                  fieldProps={{
+                    readOnly: true,
+                    value: `已选择${createFormRef.current?.getFieldValue('boxList')?.length || 0}个盒子`,
+                    suffix: (
+                      <Space>
+                        <a onClick={() => {
+                          createFormRef.current?.setFieldValue('boxList', null)
+                          onBoxChoiceReset()
+                        }} >恢复默认</a>
+                        <a onClick={() => setBoxChoiceOpen(true)}>范围选择</a>
+                      </Space>
+                    )
+                  }}
+                />
+              </ModalForm>
+              <Divider type="vertical" style={{ margin: '8px 0' }} />
+              {/* @ts-ignore */}
+              <Button danger type='text' style={{ padding: '4px 8px' }} icon={<CloseCircleOutlined />} disabled={treeProps?.checkedKeys?.length <= 0} onClick={onBoxBatchDelete} >删除</Button>
+            </Space>
+            <Divider style={{ margin: 0 }} />
+          </>
+        )}
+        {extraBtns}
         <BoxTree
           treeCheckable={isTreeCheckable}
           data={data}
diff --git a/packages/biz/src/boxSelectTree/demo/basic.tsx b/packages/biz/src/boxSelectTree/demo/basic.tsx
index dd2b0dc..68b5ad3 100644
--- a/packages/biz/src/boxSelectTree/demo/basic.tsx
+++ b/packages/biz/src/boxSelectTree/demo/basic.tsx
@@ -2,10 +2,12 @@ import React, { useState } from 'react';
 import { BoxSelectTree } from '@zhst/biz';
 import { treeData, boxDataSource } from './mock'
 import { Select, TreeProps, Modal, Checkbox } from 'antd';
+import { BOX_TYPE_LIST } from '../../utils/constants';
 
 const { Option } = Select
 
 const demo = () => {
+  const [activeKey, setActiveKey] = useState('1')
   const [searchType, setSearchType] = useState('1')
   const [searchVal, setSearchVal] = useState('')
   const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
@@ -32,18 +34,24 @@ const demo = () => {
   }
 
   return (
-    <div style={{ border: '1px solid #ccc', width: '320px' }}>
+    <div style={{ border: '1px solid #ccc', width: '320px', minHeight: '900px' }}>
       {contextHolder}
       <BoxSelectTree
-        data={treeData}
+        data={activeKey === '1' ? treeData : boxDataSource}
         boxDataSource={boxDataSource}
         onSearch={e => console.log('搜索', e)}
-        onCreateSubmit={async () => { return true }}
+        onCreateSubmit={async (_data) => {
+          console.log('新建盒子', _data)
+          return true
+        }}
         onItemCheck={onTreeCheck}
         onItemSelect={e => console.log('onItemSelect', e)}
-        onTabChange={e => console.log('tabChange', e)}
+        onTabChange={val => setActiveKey(val)}
         onBoxDelete={data => console.log('盒子删除', data)}
         onBoxBatchDelete={onBoxBatchDelete}
+        tabsProps={{
+          activeKey,
+        }}
         searchInputProps={{
           addonBefore: (
             <Select
@@ -54,8 +62,9 @@ const demo = () => {
               }}
               style={{ width: '72px' }}
             >
-              <Option value="1">盒子</Option>
-              <Option value="2">盒子组</Option>
+              {BOX_TYPE_LIST.map(item => (
+                <Option value={item.value}>{item.label}</Option>
+              ))}
             </Select>
           ),
           onChange: e => setSearchVal(e.target.value),
diff --git a/packages/biz/src/boxSelectTree/demo/mock.tsx b/packages/biz/src/boxSelectTree/demo/mock.tsx
index f60888b..d6bbc91 100644
--- a/packages/biz/src/boxSelectTree/demo/mock.tsx
+++ b/packages/biz/src/boxSelectTree/demo/mock.tsx
@@ -1,6 +1,6 @@
-import { TreeDataNode } from "antd";
+import { TreeData } from "@zhst/biz";
 
-export const treeData: TreeDataNode[] = [
+export const boxDataSource: TreeData[] = [
   {
     title: '全部盒子',
     key: '0-0',
@@ -12,10 +12,12 @@ export const treeData: TreeDataNode[] = [
           {
             title: '摄像头1',
             key: '0-0-0-0',
+            isCamera: true
           },
           {
             title: '摄像头2',
             key: '0-0-0-1',
+            isCamera: true
           },
         ],
       },
@@ -25,7 +27,8 @@ export const treeData: TreeDataNode[] = [
         children: [
           {
             title: '摄像头4',
-            key: '0-0-1-0'
+            key: '0-0-1-0',
+            isCamera: true
           }
         ],
       },
@@ -34,36 +37,18 @@ export const treeData: TreeDataNode[] = [
 ];
 
 
-export const boxDataSource: TreeDataNode[] = [
+export const treeData: TreeData[] = [
+  { key: '0-1-0', title: '分组0-1-0', isLeaf: true, checkable: false },
+  { key: '0-1-1', title: '分组0-1-1', isLeaf: true, checkable: false },
+  { key: '0-1-2', title: '分组0-1-2', isLeaf: true, checkable: false },
   {
-    key: '0-0',
-    title: '分组0-0',
-    isLeaf: false,
-    checkable: false,
-  },
-  {
-    key: '0-1',
-    title: '分组0-1',
+    key: '0-1-3',
+    title: '分组0-1-3',
     isLeaf: false,
     children: [
-      { key: '0-1-0', title: '分组0-1-0', isLeaf: true, checkable: false },
-      { key: '0-1-1', title: '分组0-1-1', isLeaf: true, checkable: false },
-      { key: '0-1-2', title: '分组0-1-2', isLeaf: true, checkable: false },
-      {
-        key: '0-1-3',
-        title: '分组0-1-3',
-        isLeaf: false,
-        children: [
-          { key: '0-1-3-1', title: '分组0-1-3-1', isLeaf: true },
-          { key: '0-1-3-2', title: '分组0-1-3-2', isLeaf: true },
-          { key: '0-1-3-3', title: '分组0-1-3-3', isLeaf: true },
-        ],
-      },
+      { key: '0-1-3-1', title: '分组0-1-3-1', isLeaf: true, isCamera: true },
+      { key: '0-1-3-2', title: '分组0-1-3-2', isLeaf: true, isCamera: true },
+      { key: '0-1-3-3', title: '分组0-1-3-3', isLeaf: true, isCamera: true },
     ],
   },
-  { key: '0-2', title: '分组0-2', isLeaf: false, checkable: false, },
-  { key: '0-3', title: '分组0-3', isLeaf: false, checkable: false, },
-  { key: '0-4', title: '分组0-4', isLeaf: false, checkable: false, },
-  { key: '0-5', title: '分组0-4', isLeaf: false, checkable: false, },
-  { key: '0-6', title: '分组0-4', isLeaf: false, checkable: false, },
 ];
diff --git a/packages/biz/src/boxSelectTree/demo/noOptions.tsx b/packages/biz/src/boxSelectTree/demo/noOptions.tsx
new file mode 100644
index 0000000..a2e34e7
--- /dev/null
+++ b/packages/biz/src/boxSelectTree/demo/noOptions.tsx
@@ -0,0 +1,61 @@
+import React, { useState } from 'react';
+import { BoxSelectTree } from '@zhst/biz';
+import { Button, Select, TreeProps } from 'antd';
+import { FilterOutlined } from '@ant-design/icons';
+import { BOX_TYPE_LIST } from '../../utils/constants';
+import { treeData, boxDataSource } from './mock'
+
+const { Option } = Select
+
+const demo = () => {
+  const [activeKey, setActiveKey] = useState('1')
+  const [searchType, setSearchType] = useState('1')
+  const [searchVal, setSearchVal] = useState('')
+  const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
+
+  const onTreeCheck: TreeProps['onCheck'] = (keys: any) => {
+    setCheckedKeys(keys)
+  }
+
+  return (
+    <div style={{ border: '1px solid #ccc', width: '340px', minHeight: '900px' }}>
+      <BoxSelectTree
+        data={activeKey === '1' ? treeData : boxDataSource}
+        boxDataSource={boxDataSource}
+        onSearch={e => console.log('搜索', e)}
+        onItemCheck={onTreeCheck}
+        onItemSelect={e => console.log('onItemSelect', e)}
+        onTabChange={val => setActiveKey(val)}
+        onBoxDelete={data => console.log('盒子删除', data)}
+        showOptions={false}
+        tabsProps={{
+          activeKey,
+        }}
+        customImport={<Button type="text" icon={<FilterOutlined />} />}
+        searchInputProps={{
+          addonBefore: (
+            <Select
+              value={searchType}
+              onChange={_type => {
+                setSearchType(_type)
+                setSearchVal('')
+              }}
+              style={{ width: '72px' }}
+            >
+              {BOX_TYPE_LIST.map(item => (
+                <Option value={item.value}>{item.label}</Option>
+              ))}
+            </Select>
+          ),
+          onChange: e => setSearchVal(e.target.value),
+          value: searchVal
+        }}
+        treeProps={{
+          checkedKeys
+        }}
+      />
+    </div>
+  );
+};
+
+export default demo;
diff --git a/packages/biz/src/boxSelectTree/index.md b/packages/biz/src/boxSelectTree/index.md
index aa8ec86..9e929ce 100644
--- a/packages/biz/src/boxSelectTree/index.md
+++ b/packages/biz/src/boxSelectTree/index.md
@@ -13,7 +13,9 @@ group:
 ## 代码演示
 
 <code src="./demo/basic.tsx">基本用法</code>
+<code src="./demo/noOptions.tsx">不显示其它按钮</code>
 
+## API
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
@@ -24,3 +26,8 @@ group:
 | tabsProps | Tabs组件的Props | antd的Tabs组件 | - | - |
 | searchInputProps | 搜索框的Props | antd的Input组件 | - | - |
 | onTabChange | tab切换监听 | function: (e) => void | - | - |
+| onBoxDelete | 盒子删除事件 | function: (e) => void | - | - |
+| onBoxBatchDelete | 盒子批量删除事件 | function: (e) => void | - | - |
+| onCreateSubmit | 新建提交事件 | function: (e) => void | - | - |
+| showOptions | 展示其它功能按钮 | boolean | true | - |
+
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 04ac73b..8027afa 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -1,6 +1,7 @@
 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'
diff --git a/packages/biz/src/tree/boxTree.tsx b/packages/biz/src/tree/boxTree.tsx
index 425596f..5461434 100644
--- a/packages/biz/src/tree/boxTree.tsx
+++ b/packages/biz/src/tree/boxTree.tsx
@@ -1,16 +1,18 @@
-import React, { FC } from 'react';
+import React, { FC, useState } from 'react';
 import { Tree, Badge, TreeDataNode, Space, TreeProps } from 'antd';
+import theme from 'antd/es/theme'
 import { CloseOutlined, EditOutlined, SettingOutlined } from '@ant-design/icons'
 import { ModalForm, ProFormText } from '@ant-design/pro-components';
 import './index.less'
 
 const componentName = 'zhst-biz-tree'
+const { useToken } = theme
 
 export interface BoxTreeProps extends TreeProps {
   data: TreeDataNode[]
   treeCheckable?: boolean
   showItemOption?: boolean
-  treeProps?: TreeProps
+  customOptions?: any;
   onItemCheck?: TreeProps['onCheck']
   onItemSelect?: TreeProps['onSelect']
   onItemSetting?: (_data: any) => void
@@ -19,52 +21,86 @@ export interface BoxTreeProps extends TreeProps {
 }
 
 const boxTree: FC<BoxTreeProps> = (props) => {
-  const { onItemSelect, onItemCheck, onItemSetting, onItemDelete, data = [], showItemOption = true, treeCheckable = false, onRenameFinish } = props
+  const {
+    onItemSelect,
+    onItemCheck,
+    onItemSetting,
+    onItemDelete,
+    data = [],
+    showItemOption = true,
+    treeCheckable = false,
+    onRenameFinish,
+    customOptions
+  } = props
+  const { token } = useToken()
+  const [checkedItem, setCheckedItem] = useState<React.Key>('')
+
+  const cameraStatus = new Map([
+      ['0', 'success'],
+      ['1', 'error']
+    ])
 
   return (
     <Tree
       checkable={treeCheckable}
       blockNode
-      onSelect={onItemSelect}
+      onSelect={(selectedKeys, info) => {
+        setCheckedItem(selectedKeys[0])
+        onItemSelect?.(selectedKeys, info)
+      }}
       onCheck={onItemCheck}
       treeData={data}
       titleRender={(_nodeData) => {
         return (
           <div className={`${componentName}-item-render`}>
-            {!_nodeData.children && <Badge style={{ marginRight: '6px' }} status="success" />}
-            {_nodeData.title as any}
-            {showItemOption && <Space className={`${componentName}-item-render_right`} style={{ float:'right' }} >
-              <ModalForm
-                title="重命名"
-                width={600}
-                modalProps={{ destroyOnClose: true }}
-                layout='horizontal'
-                labelCol={{ span: 6 }}
-                wrapperCol={{ span: 18 }}
-                trigger={<EditOutlined />}
-                submitter={{
-                  searchConfig: {
-                    submitText: '确定',
-                    resetText: '取消',
-                  },
-                }}
-                onFinish={async (value) => onRenameFinish?.(value, _nodeData)}
-              >
-                <ProFormText
-                  rules={[
-                    {
-                      required: true,
-                    },
-                  ]}
-                  width="md"
-                  name="name"
-                  label="盒子名称"
-                  placeholder="请输入盒子名称"
-                />
-              </ModalForm>
-              <SettingOutlined onClick={() => onItemSetting?.(_nodeData)} />
-              <CloseOutlined onClick={() => onItemDelete?.(_nodeData)} />
-            </Space>}
+            {/* @ts-ignore */}
+            {!_nodeData.children && _nodeData.isCamera && <Badge style={{ marginRight: '6px' }} status={cameraStatus.get('0')} />}
+            <span
+              // @ts-ignore
+              style={(checkedItem === _nodeData.key) && _nodeData.isCamera ? {
+                color: token.colorPrimary
+              } : {}}
+            >
+              {_nodeData.title as any}
+            </span>
+            {showItemOption && (
+              <Space className={`${componentName}-item-render_right`} style={{ float:'right' }} >
+                {customOptions || (
+                  <>
+                    <ModalForm
+                      title="重命名"
+                      width={600}
+                      modalProps={{ destroyOnClose: true }}
+                      layout='horizontal'
+                      labelCol={{ span: 6 }}
+                      wrapperCol={{ span: 18 }}
+                      trigger={<EditOutlined />}
+                      submitter={{
+                        searchConfig: {
+                          submitText: '确定',
+                          resetText: '取消',
+                        },
+                      }}
+                      onFinish={async (value) => onRenameFinish?.(value, _nodeData)}
+                    >
+                      <ProFormText
+                        rules={[
+                          {
+                            required: true,
+                          },
+                        ]}
+                        width="md"
+                        name="name"
+                        label="盒子名称"
+                        placeholder="请输入盒子名称"
+                      />
+                    </ModalForm>
+                    <SettingOutlined onClick={() => onItemSetting?.(_nodeData)} />
+                    <CloseOutlined onClick={() => onItemDelete?.(_nodeData)} />
+                  </>
+                )}
+              </Space>
+            )}
           </div>
         )
       }}
diff --git a/packages/biz/src/tree/demo/customOptions.tsx b/packages/biz/src/tree/demo/customOptions.tsx
new file mode 100644
index 0000000..bcb14fb
--- /dev/null
+++ b/packages/biz/src/tree/demo/customOptions.tsx
@@ -0,0 +1,23 @@
+import React from 'react';
+import { Tree } from '@zhst/biz';
+import { LoadingOutlined, PlayCircleOutlined, SettingOutlined } from '@ant-design/icons';
+import { treeData } from './mock'
+
+const demo = () => {
+  return (
+    <div style={{ width: '320px' }}>
+      <Tree
+        data={treeData}
+        customOptions={(
+          <>
+            <PlayCircleOutlined />
+            <SettingOutlined />
+            <LoadingOutlined />
+          </>
+        )}
+      />
+    </div>
+  );
+};
+
+export default demo;
diff --git a/packages/biz/src/tree/demo/customTitleRender.tsx b/packages/biz/src/tree/demo/customTitleRender.tsx
index 61971a2..95f3cd2 100644
--- a/packages/biz/src/tree/demo/customTitleRender.tsx
+++ b/packages/biz/src/tree/demo/customTitleRender.tsx
@@ -14,8 +14,11 @@ const demo = () => {
             <div>
               {title}
               <div style={{ float: 'right' }} >
-                <Tooltip placement="right" title={'存在0个'}>
-                  <a >包含0个</a>
+                <Tooltip
+                  placement="right"
+                  title={'存在0个'}
+                >
+                  <a>在0个组中包含</a>
                 </Tooltip>
               </div>
             </div>
diff --git a/packages/biz/src/tree/index.md b/packages/biz/src/tree/index.md
index 7a84601..b54b366 100644
--- a/packages/biz/src/tree/index.md
+++ b/packages/biz/src/tree/index.md
@@ -14,8 +14,15 @@ group:
 <code src="./demo/basic.tsx">基本用法</code>
 <code src="./demo/customTitleRender.tsx">自定义渲染界面</code>
 <code src="./demo/noOption.tsx">不展示配置项</code>
+<code src="./demo/customOptions.tsx">自定义配置项</code>
 
+## API
+
+**额外参数可以参考 antd - Tree 组件**
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | data | 数据源 | Array[] | [] | - |
+| titleRender | 子项自定义 | ReactNode、 undefined | - | - |
+| showItemOption | 是否显示额外配置功能 | boolean | true | - |
+| customOptions | 自定义配置项 | any | - | - |
diff --git a/packages/biz/src/tree/index.tsx b/packages/biz/src/tree/index.tsx
index fb90026..1c01493 100644
--- a/packages/biz/src/tree/index.tsx
+++ b/packages/biz/src/tree/index.tsx
@@ -1,3 +1,10 @@
+import { TreeDataNode } from 'antd';
 import BoxTree from './boxTree';
 
+export interface TreeData extends TreeDataNode {
+  children?: TreeDataNode['children'] & {
+    isCamera?: boolean
+  }[]
+}
+
 export default BoxTree;
diff --git a/packages/biz/src/treeTransfer/index.md b/packages/biz/src/treeTransfer/index.md
index ba09b9d..678b494 100644
--- a/packages/biz/src/treeTransfer/index.md
+++ b/packages/biz/src/treeTransfer/index.md
@@ -13,6 +13,8 @@ group:
 <code src="./demo/basic.tsx">基本用法</code>
 <code src="./demo/withModal.tsx">和Modal组合使用</code>
 
+## API
+
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | data | 数据源 | Array[] | [] | - |
diff --git a/packages/biz/src/treeTransferModal/TreeTransferModal.tsx b/packages/biz/src/treeTransferModal/TreeTransferModal.tsx
index 565357e..303cd40 100644
--- a/packages/biz/src/treeTransferModal/TreeTransferModal.tsx
+++ b/packages/biz/src/treeTransferModal/TreeTransferModal.tsx
@@ -1,7 +1,7 @@
 import React, { FC, useState } from 'react';
+import { Modal, ModalProps, Radio, RadioGroupProps, Select, SelectProps, TransferProps, TreeDataNode, TreeProps } from 'antd';
 import TreeTransfer from '../treeTransfer';
-import { Modal, ModalProps, Radio, RadioGroupProps, TransferProps, TreeDataNode } from 'antd';
-import { TreeProps } from 'antd/lib';
+import { ALL_LIST, BOX_TYPE_LIST } from '../utils/constants';
 
 export interface TreeTransferModalProps {
   dataSource: TreeDataNode[]
@@ -17,7 +17,10 @@ export interface TreeTransferModalProps {
   open?: boolean
   onCancel?: ModalProps['onCancel']
   onRadioChange?: RadioGroupProps['onChange']
+  onSelect?: SelectProps['onSelect']
   modalProps?: ModalProps
+  radioProps?: RadioGroupProps
+  selectProps?: SelectProps
 }
 
 const TreeTransferModal: FC<TreeTransferModalProps> = (props) => {
@@ -31,11 +34,14 @@ const TreeTransferModal: FC<TreeTransferModalProps> = (props) => {
     onReset,
     onRadioChange,
     onTreeCheck,
+    onSelect,
     targetItems,
     modalProps,
+    radioProps,
+    selectProps,
   } = props
 
-  const [type, setType] = useState('box')
+  const [type, setType] = useState('1')
 
   return (
     <Modal
@@ -48,17 +54,25 @@ const TreeTransferModal: FC<TreeTransferModalProps> = (props) => {
       {...modalProps}
     >
       <div>
-        <Radio.Group
-          onChange={e => {
-            setType(e.target.value)
-            onRadioChange?.(e)
-          }}
-          style={{ marginLeft: '24px', padding: '20px 0' }}
-          value={type}
-        >
-          <Radio value={'box'}>盒子</Radio>
-          <Radio value={'boxGroup'}>盒子组</Radio>
-        </Radio.Group>
+        <div>
+          <Radio.Group
+            onChange={e => {
+              setType(e.target.value)
+              onRadioChange?.(e)
+            }}
+            style={{ marginLeft: '24px', padding: '20px 0' }}
+            value={type}
+            options={BOX_TYPE_LIST}
+            {...radioProps}
+          />
+          <Select
+            defaultValue={''}
+            style={{ marginLeft: 200, width: 150 }}
+            options={ALL_LIST}
+            onSelect={onSelect}
+            {...selectProps}
+          />
+        </div>
         {type === 'box' ?
           (
             <TreeTransfer
diff --git a/packages/biz/src/treeTransferModal/demo/basic.tsx b/packages/biz/src/treeTransferModal/demo/basic.tsx
index ad3ef21..d0b5210 100644
--- a/packages/biz/src/treeTransferModal/demo/basic.tsx
+++ b/packages/biz/src/treeTransferModal/demo/basic.tsx
@@ -7,7 +7,7 @@ import { boxDataSource } from './mock'
 const App: React.FC = () => {
   const [targetItems, setTargetItems] = useState<TreeDataNode[]>([]);
   const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
-  const [open, setOpen] = useState(false)
+  const [open, setOpen] = useState(true)
 
   const onTreeCheck: TreeProps['onCheck'] = (keys: any, info) => {
     let _targetItems: TreeDataNode[] = []
@@ -47,7 +47,7 @@ const App: React.FC = () => {
       <TreeTransferModal
         open={open}
         onCancel={() => setOpen(false)}
-        onRadioChange={() => setOpen(false)}    // 顶部 radio 事件
+        onRadioChange={(e) => console.log('radioChange', e)}    // 顶部 radio 事件
         dataSource={boxDataSource}                   // 数据源
         targetItems={targetItems}               // 右侧选中项
         checkedKeys={checkedKeys}               // 左侧选中
diff --git a/packages/biz/src/treeTransferModal/index.md b/packages/biz/src/treeTransferModal/index.md
index 557b204..34ec4e6 100644
--- a/packages/biz/src/treeTransferModal/index.md
+++ b/packages/biz/src/treeTransferModal/index.md
@@ -12,6 +12,8 @@ group:
 
 <code src="./demo/basic.tsx">基本用法</code>
 
+## API
+
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
 | data | 数据源 | Array[] | [] | - |
diff --git a/packages/biz/src/utils/constants.ts b/packages/biz/src/utils/constants.ts
index 465736f..0b142ab 100644
--- a/packages/biz/src/utils/constants.ts
+++ b/packages/biz/src/utils/constants.ts
@@ -25,3 +25,13 @@ export const DeviceTab = {
   REAL_CAMERA_ONLYFACE: 7,
   REAL_CAMERA_NOFACE_NOBOX_NODIRECONNECT: 8, // 只有普通摄像头，没有人脸、没有盒子、直连
 };
+
+// 盒子 Tab 切换
+export const BOX_TYPE_LIST = [
+  { value: '1', label: '盒子' },
+  { value: '2', label: '盒子组' }
+]
+
+export const ALL_LIST = [
+  { value: '', label: '全部' }
+]
diff --git a/packages/func/CHANGELOG.md b/packages/func/CHANGELOG.md
index a075f37..602e8ff 100644
--- a/packages/func/CHANGELOG.md
+++ b/packages/func/CHANGELOG.md
@@ -1,5 +1,20 @@
 # @zhst/utils
 
+## 0.7.2
+
+### Patch Changes
+
+- 优化 boxSelectTree 组件，添加可以自定义配置按钮功能
+- Updated dependencies
+  - @zhst/request@0.8.1
+
+## 0.7.1
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/request@0.8.0
+
 ## 0.7.0
 
 ### Minor Changes
diff --git a/packages/func/package.json b/packages/func/package.json
index 5104702..3b25946 100644
--- a/packages/func/package.json
+++ b/packages/func/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/func",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "description": "函数合集",
   "keywords": [
     "hooks"
diff --git a/packages/hooks/CHANGELOG.md b/packages/hooks/CHANGELOG.md
index 53a2301..194c17d 100644
--- a/packages/hooks/CHANGELOG.md
+++ b/packages/hooks/CHANGELOG.md
@@ -1,5 +1,23 @@
 # @zhst/hooks
 
+## 0.8.1
+
+### Patch Changes
+
+- 优化 boxSelectTree 组件，添加可以自定义配置按钮功能
+- Updated dependencies
+  - @zhst/func@0.7.2
+
+## 0.8.0
+
+### Minor Changes
+
+- @zhst/biz 优化数组件
+
+### Patch Changes
+
+- @zhst/func@0.7.1
+
 ## 0.7.0
 
 ### Minor Changes
diff --git a/packages/hooks/es/useActivateWrapper/index.js b/packages/hooks/es/useActivateWrapper/index.js
index 89223ec..8083d39 100644
--- a/packages/hooks/es/useActivateWrapper/index.js
+++ b/packages/hooks/es/useActivateWrapper/index.js
@@ -48,4 +48,4 @@ export var useActivateState = function useActivateState() {
   });
   return isActive;
 };
-export default useActivateWrapper;
+export default useActivateWrapper;
\ No newline at end of file
diff --git a/packages/hooks/package.json b/packages/hooks/package.json
index 79555b5..c9e2dca 100644
--- a/packages/hooks/package.json
+++ b/packages/hooks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/hooks",
-  "version": "0.7.0",
+  "version": "0.8.1",
   "description": "hooks合集",
   "keywords": [
     "hooks"
diff --git a/packages/meta/CHANGELOG.md b/packages/meta/CHANGELOG.md
index e6fb0fd..822cf5d 100644
--- a/packages/meta/CHANGELOG.md
+++ b/packages/meta/CHANGELOG.md
@@ -1,5 +1,24 @@
 # @zhst/utils
 
+## 0.8.2
+
+### Patch Changes
+
+- 优化 boxSelectTree 组件，添加可以自定义配置按钮功能
+- Updated dependencies
+  - @zhst/hooks@0.8.1
+  - @zhst/func@0.7.2
+  - @zhst/meta@0.8.2
+
+## 0.8.1
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/hooks@0.8.0
+  - @zhst/func@0.7.1
+  - @zhst/meta@0.8.1
+
 ## 0.8.0
 
 ### Minor Changes
diff --git a/packages/meta/package.json b/packages/meta/package.json
index f59dac2..78e688e 100644
--- a/packages/meta/package.json
+++ b/packages/meta/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/meta",
-  "version": "0.8.0",
+  "version": "0.8.2",
   "description": "原子组件",
   "keywords": [
     "meta",
diff --git a/packages/request/CHANGELOG.md b/packages/request/CHANGELOG.md
index 7117ce1..ddf85c4 100644
--- a/packages/request/CHANGELOG.md
+++ b/packages/request/CHANGELOG.md
@@ -1,5 +1,17 @@
 # @zhst/request
 
+## 0.8.1
+
+### Patch Changes
+
+- 优化 boxSelectTree 组件，添加可以自定义配置按钮功能
+
+## 0.8.0
+
+### Minor Changes
+
+- @zhst/biz 优化数组件
+
 ## 0.7.0
 
 ### Minor Changes
diff --git a/packages/request/es/index.js b/packages/request/es/index.js
index 2ac5ad5..e69de29 100644
--- a/packages/request/es/index.js
+++ b/packages/request/es/index.js
@@ -1,193 +0,0 @@
-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 _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _wrapNativeSuper(Class) { var _cache = typeof Map === "function" ? new Map() : undefined; _wrapNativeSuper = function _wrapNativeSuper(Class) { if (Class === null || !_isNativeFunction(Class)) return Class; if (typeof Class !== "function") { throw new TypeError("Super expression must either be null or a function"); } if (typeof _cache !== "undefined") { if (_cache.has(Class)) return _cache.get(Class); _cache.set(Class, Wrapper); } function Wrapper() { return _construct(Class, arguments, _getPrototypeOf(this).constructor); } Wrapper.prototype = Object.create(Class.prototype, { constructor: { value: Wrapper, enumerable: false, writable: true, configurable: true } }); return _setPrototypeOf(Wrapper, Class); }; return _wrapNativeSuper(Class); }
-function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct.bind(); } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-function _isNativeFunction(fn) { try { return Function.toString.call(fn).indexOf("[native code]") !== -1; } catch (e) { return typeof fn === "function"; } }
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-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 { extend } from 'umi-request';
-import { omit, get } from 'lodash-es';
-import { message } from 'antd';
-import base64 from 'base-64';
-export var User = /*#__PURE__*/function (User) {
-  User["TOKEN_KEY"] = "USER-TOKEN";
-  User["USER_KEY"] = "USER";
-  return User;
-}({});
-export var ResponseError = /*#__PURE__*/function (_Error) {
-  _inherits(ResponseError, _Error);
-  var _super = _createSuper(ResponseError);
-  function ResponseError(response, text, data, request) {
-    var _this;
-    var type = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'ResponseError';
-    _classCallCheck(this, ResponseError);
-    _this = _super.call(this, text || response.statusText);
-    _defineProperty(_assertThisInitialized(_this), "name", void 0);
-    _defineProperty(_assertThisInitialized(_this), "data", void 0);
-    _defineProperty(_assertThisInitialized(_this), "response", void 0);
-    _defineProperty(_assertThisInitialized(_this), "request", void 0);
-    _defineProperty(_assertThisInitialized(_this), "type", void 0);
-    _this.name = 'ResponseError';
-    _this.data = data;
-    _this.response = response;
-    _this.request = request;
-    _this.type = type;
-    return _this;
-  }
-  return _createClass(ResponseError);
-}( /*#__PURE__*/_wrapNativeSuper(Error));
-export var req = extend({
-  getResponse: true,
-  // timeout: 1000,
-  parseResponse: false
-});
-
-//错误处理中间件
-req.use( /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(ctx, next) {
-    var req, _ref2, _ref2$toast, toast, res, d, isEmptyRes, body, errMsg;
-    return _regeneratorRuntime().wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          req = ctx.req;
-          _ref2 = (req === null || req === void 0 ? void 0 : req.options) || {}, _ref2$toast = _ref2.toast, toast = _ref2$toast === void 0 ? true : _ref2$toast;
-          _context.prev = 2;
-          _context.next = 5;
-          return next();
-        case 5:
-          res = ctx.res;
-          _context.next = 8;
-          return res.text();
-        case 8:
-          d = _context.sent;
-          if (!(res.status === 401)) {
-            _context.next = 14;
-            break;
-          }
-          localStorage.removeItem(User.TOKEN_KEY);
-          localStorage.removeItem(User.USER_KEY);
-          message.warning('登录过期，请重新登录!');
-          return _context.abrupt("return");
-        case 14:
-          isEmptyRes = d === ''; //有些后端接口成功会返回空 做下兼容
-          if (res) {
-            _context.next = 17;
-            break;
-          }
-          return _context.abrupt("return");
-        case 17:
-          body = !isEmptyRes ? JSON.parse(d) : d;
-          if (!(res.status >= 200 && res.status < 300)) {
-            _context.next = 22;
-            break;
-          }
-          ctx.res = body;
-          _context.next = 26;
-          break;
-        case 22:
-          // 先判断Grpc-Metadata-Errorx-Message
-          errMsg = res.headers.get('Grpc-Metadata-Errorx-Message');
-          if (errMsg) {
-            errMsg = base64.decode(errMsg);
-            // 后判断 body中的message
-          } else if (!errMsg && get(body, 'message')) {
-            errMsg = "".concat(get(body, 'message'));
-          } else {
-            // 最后看状态码
-            errMsg = '您的网络发生异常，无法连接服务器';
-          }
-          toast && message.error(errMsg);
-          throw new ResponseError(res, errMsg, d, req, 'CustomError');
-        case 26:
-          _context.next = 32;
-          break;
-        case 28:
-          _context.prev = 28;
-          _context.t0 = _context["catch"](2);
-          if (get(_context.t0, 'type') !== 'CustomError') {
-            toast && message.error('您的网络发生异常，无法连接服务器');
-          }
-          throw _context.t0;
-        case 32:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee, null, [[2, 28]]);
-  }));
-  return function (_x, _x2) {
-    return _ref.apply(this, arguments);
-  };
-}());
-export var doRequest = function doRequest(cgi, option) {
-  var method = cgi.method,
-    url = cgi.url,
-    baseUrl = cgi.baseUrl,
-    _cgi$data = cgi.data,
-    data = _cgi$data === void 0 ? {} : _cgi$data,
-    _cgi$useBaseUrl = cgi.useBaseUrl,
-    useBaseUrl = _cgi$useBaseUrl === void 0 ? true : _cgi$useBaseUrl,
-    _cgi$originUrl = cgi.originUrl,
-    originUrl = _cgi$originUrl === void 0 ? false : _cgi$originUrl,
-    _cgi$refererSuffix = cgi.refererSuffix,
-    refererSuffix = _cgi$refererSuffix === void 0 ? '' : _cgi$refererSuffix;
-  var token = localStorage.getItem(User.TOKEN_KEY);
-  var newUrl = '';
-  if (useBaseUrl) {
-    newUrl = "".concat(baseUrl).concat(url);
-  } else {
-    // 本地Mock -- http://127.0.0.1:4523/m1/2822485-0-default
-    // 7环境gateway -- http://10.0.0.7:32223
-    newUrl = "http://10.0.0.7:32223".concat(url); // 7环境进行调试
-  }
-  if (originUrl) {
-    newUrl = url;
-  }
-  // 对于 /:id 类的 url 进行参数填充
-  var regex = /\/:(\w+)/g; // 替换 url 参数
-  var params = [];
-  var matches;
-  while ((matches = regex.exec(newUrl)) != null) {
-    if (matches[1]) {
-      params.push(matches[1]);
-    }
-  }
-  params.forEach(function (name) {
-    var d = data === null || data === void 0 ? void 0 : data[name];
-    if (d == null) {
-      d = '';
-    }
-    newUrl = newUrl.replace(":".concat(name), d);
-  });
-  //通过method 判断解析成data / params
-  var newData = omit(data, params);
-  var paramObj = method.toLowerCase() === 'get' ? {
-    params: newData
-  } : {
-    data: newData
-  };
-  return req(newUrl, _objectSpread(_objectSpread(_objectSpread({
-    method: method
-  }, paramObj), option), {}, {
-    headers: _objectSpread({
-      authorization: token
-    }, refererSuffix ? {
-      zhst_referer: "".concat(baseUrl).concat(refererSuffix)
-    } : {})
-  }));
-};
-export default doRequest;
\ No newline at end of file
diff --git a/packages/request/lib/index.js b/packages/request/lib/index.js
index 2ede4ea..e69de29 100644
--- a/packages/request/lib/index.js
+++ b/packages/request/lib/index.js
@@ -1,155 +0,0 @@
-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.ts
-var src_exports = {};
-__export(src_exports, {
-  ResponseError: () => ResponseError,
-  User: () => User,
-  default: () => src_default,
-  doRequest: () => doRequest,
-  req: () => req
-});
-module.exports = __toCommonJS(src_exports);
-var import_umi_request = require("umi-request");
-var import_lodash_es = require("lodash-es");
-var import_antd = require("antd");
-var import_base_64 = __toESM(require("base-64"));
-var User = /* @__PURE__ */ ((User2) => {
-  User2["TOKEN_KEY"] = "USER-TOKEN";
-  User2["USER_KEY"] = "USER";
-  return User2;
-})(User || {});
-var ResponseError = class extends Error {
-  constructor(response, text, data, request, type = "ResponseError") {
-    super(text || response.statusText);
-    this.name = "ResponseError";
-    this.data = data;
-    this.response = response;
-    this.request = request;
-    this.type = type;
-  }
-};
-var req = (0, import_umi_request.extend)({
-  getResponse: true,
-  // timeout: 1000,
-  parseResponse: false
-});
-req.use(async (ctx, next) => {
-  const { req: req2 } = ctx;
-  const { toast = true } = (req2 == null ? void 0 : req2.options) || {};
-  try {
-    await next();
-    const { res } = ctx;
-    const d = await res.text();
-    if (res.status === 401) {
-      localStorage.removeItem("USER-TOKEN" /* TOKEN_KEY */);
-      localStorage.removeItem("USER" /* USER_KEY */);
-      import_antd.message.warning("登录过期，请重新登录!");
-      return;
-    }
-    const isEmptyRes = d === "";
-    if (!res)
-      return;
-    const body = !isEmptyRes ? JSON.parse(d) : d;
-    if (res.status >= 200 && res.status < 300) {
-      ctx.res = body;
-    } else {
-      let errMsg = res.headers.get("Grpc-Metadata-Errorx-Message");
-      if (errMsg) {
-        errMsg = import_base_64.default.decode(errMsg);
-      } else if (!errMsg && (0, import_lodash_es.get)(body, "message")) {
-        errMsg = `${(0, import_lodash_es.get)(body, "message")}`;
-      } else {
-        errMsg = "您的网络发生异常，无法连接服务器";
-      }
-      toast && import_antd.message.error(errMsg);
-      throw new ResponseError(res, errMsg, d, req2, "CustomError");
-    }
-  } catch (error) {
-    if ((0, import_lodash_es.get)(error, "type") !== "CustomError") {
-      toast && import_antd.message.error("您的网络发生异常，无法连接服务器");
-    }
-    throw error;
-  }
-});
-var doRequest = (cgi, option) => {
-  const {
-    method,
-    url,
-    baseUrl,
-    data = {},
-    useBaseUrl = true,
-    originUrl = false,
-    refererSuffix = ""
-  } = cgi;
-  const token = localStorage.getItem("USER-TOKEN" /* TOKEN_KEY */);
-  let newUrl = "";
-  if (useBaseUrl) {
-    newUrl = `${baseUrl}${url}`;
-  } else {
-    newUrl = `http://10.0.0.7:32223${url}`;
-  }
-  if (originUrl) {
-    newUrl = url;
-  }
-  const regex = /\/:(\w+)/g;
-  const params = [];
-  let matches;
-  while ((matches = regex.exec(newUrl)) != null) {
-    if (matches[1]) {
-      params.push(matches[1]);
-    }
-  }
-  params.forEach(function(name) {
-    let d = data == null ? void 0 : data[name];
-    if (d == null) {
-      d = "";
-    }
-    newUrl = newUrl.replace(`:${name}`, d);
-  });
-  const newData = (0, import_lodash_es.omit)(data, params);
-  const paramObj = method.toLowerCase() === "get" ? { params: newData } : { data: newData };
-  return req(newUrl, {
-    method,
-    ...paramObj,
-    ...option,
-    headers: {
-      authorization: token,
-      ...refererSuffix ? { zhst_referer: `${baseUrl}${refererSuffix}` } : {}
-    }
-  });
-};
-var src_default = doRequest;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  ResponseError,
-  User,
-  doRequest,
-  req
-});
diff --git a/packages/request/package.json b/packages/request/package.json
index ee7ec1a..c23f2c1 100644
--- a/packages/request/package.json
+++ b/packages/request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/request",
-  "version": "0.7.0",
+  "version": "0.8.1",
   "description": "请求库",
   "keywords": [
     "request",

From 35b99a3270b0a79a6a1d3aaf6583a60ba80e02ae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E5=BF=97=E9=9B=84?= <jiangzhixiong@smartvision.cn>
Date: Wed, 6 Mar 2024 17:56:55 +0800
Subject: [PATCH 15/24] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=20boxSelectTree?=
 =?UTF-8?q?=20=E7=BB=84=E4=BB=B6=EF=BC=8C=E6=B7=BB=E5=8A=A0=E5=8F=AF?=
 =?UTF-8?q?=E4=BB=A5=E8=87=AA=E5=AE=9A=E4=B9=89=E9=85=8D=E7=BD=AE=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/CHANGELOG.md                     | 10 +++++++
 packages/biz/package.json                     |  2 +-
 .../biz/src/boxSelectTree/boxSelectTree.tsx   |  4 +++
 .../biz/src/boxSelectTree/demo/extraBtns.tsx  | 29 +++++++++++++++++++
 packages/biz/src/boxSelectTree/index.md       |  3 +-
 packages/func/CHANGELOG.md                    |  8 +++++
 packages/func/package.json                    |  2 +-
 packages/hooks/CHANGELOG.md                   |  8 +++++
 packages/hooks/package.json                   |  2 +-
 packages/meta/CHANGELOG.md                    | 10 +++++++
 packages/meta/package.json                    |  2 +-
 packages/request/CHANGELOG.md                 |  6 ++++
 packages/request/package.json                 |  2 +-
 13 files changed, 82 insertions(+), 6 deletions(-)
 create mode 100644 packages/biz/src/boxSelectTree/demo/extraBtns.tsx

diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index ab61f46..833cb13 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,15 @@
 # @zhst/biz
 
+## 0.9.1
+
+### Patch Changes
+
+- 修改 boxSelectTree 类型提示
+- Updated dependencies
+  - @zhst/hooks@0.8.2
+  - @zhst/func@0.7.3
+  - @zhst/meta@0.8.3
+
 ## 0.9.0
 
 ### Minor Changes
diff --git a/packages/biz/package.json b/packages/biz/package.json
index 687a741..1fdb65b 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "description": "业务库",
   "keywords": [
     "business",
diff --git a/packages/biz/src/boxSelectTree/boxSelectTree.tsx b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
index 82255fa..964aa0a 100644
--- a/packages/biz/src/boxSelectTree/boxSelectTree.tsx
+++ b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
@@ -18,6 +18,7 @@ export interface BoxSelectTreeProps {
   treeProps?: TreeProps
   showOptions?: boolean
   customImport?: any
+  extraBtns?: any
 }
 
 const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
@@ -35,6 +36,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
     searchInputProps,
     treeProps,
     customImport,
+    extraBtns,
     showOptions = true
   } = props
 
@@ -60,6 +62,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           onItemSelect={onItemSelect}
           showOptions={showOptions}
           customImport={customImport}
+          extraBtns={extraBtns}
         />
       )
     },
@@ -80,6 +83,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           onItemSelect={onItemSelect}
           showOptions={showOptions}
           customImport={customImport}
+          extraBtns={extraBtns}
         />
       )
     },
diff --git a/packages/biz/src/boxSelectTree/demo/extraBtns.tsx b/packages/biz/src/boxSelectTree/demo/extraBtns.tsx
new file mode 100644
index 0000000..e398407
--- /dev/null
+++ b/packages/biz/src/boxSelectTree/demo/extraBtns.tsx
@@ -0,0 +1,29 @@
+import React, { useState } from 'react';
+import { BoxSelectTree } from '@zhst/biz';
+import { treeData, boxDataSource } from './mock'
+import { Button } from 'antd';
+
+const demo = () => {
+  const [activeKey, setActiveKey] = useState('1')
+  const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
+
+
+  return (
+    <div style={{ border: '1px solid #ccc', width: '340px', minHeight: '900px' }}>
+      <BoxSelectTree
+        data={activeKey === '1' ? treeData : boxDataSource}
+        boxDataSource={boxDataSource}
+        showOptions={false}
+        extraBtns={<Button type="dashed" style={{ color: 'green' }}>自定义按钮</Button>}
+        tabsProps={{
+          activeKey,
+        }}
+        treeProps={{
+          checkedKeys
+        }}
+      />
+    </div>
+  );
+};
+
+export default demo;
diff --git a/packages/biz/src/boxSelectTree/index.md b/packages/biz/src/boxSelectTree/index.md
index 9e929ce..6948d72 100644
--- a/packages/biz/src/boxSelectTree/index.md
+++ b/packages/biz/src/boxSelectTree/index.md
@@ -2,7 +2,7 @@
 category: Components
 title: BoxSelectTree 盒子树
 demo:
-  cols: 2
+  cols: 4
 group:
   title: 进阶组件
   order: 2
@@ -13,6 +13,7 @@ group:
 ## 代码演示
 
 <code src="./demo/basic.tsx">基本用法</code>
+<code src="./demo/extraBtns.tsx">自定义其它按钮</code>
 <code src="./demo/noOptions.tsx">不显示其它按钮</code>
 
 ## API
diff --git a/packages/func/CHANGELOG.md b/packages/func/CHANGELOG.md
index 602e8ff..59c8fb8 100644
--- a/packages/func/CHANGELOG.md
+++ b/packages/func/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @zhst/utils
 
+## 0.7.3
+
+### Patch Changes
+
+- 修改 boxSelectTree 类型提示
+- Updated dependencies
+  - @zhst/request@0.8.2
+
 ## 0.7.2
 
 ### Patch Changes
diff --git a/packages/func/package.json b/packages/func/package.json
index 3b25946..bdc04b2 100644
--- a/packages/func/package.json
+++ b/packages/func/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/func",
-  "version": "0.7.2",
+  "version": "0.7.3",
   "description": "函数合集",
   "keywords": [
     "hooks"
diff --git a/packages/hooks/CHANGELOG.md b/packages/hooks/CHANGELOG.md
index 194c17d..d7179a6 100644
--- a/packages/hooks/CHANGELOG.md
+++ b/packages/hooks/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @zhst/hooks
 
+## 0.8.2
+
+### Patch Changes
+
+- 修改 boxSelectTree 类型提示
+- Updated dependencies
+  - @zhst/func@0.7.3
+
 ## 0.8.1
 
 ### Patch Changes
diff --git a/packages/hooks/package.json b/packages/hooks/package.json
index c9e2dca..b03af6a 100644
--- a/packages/hooks/package.json
+++ b/packages/hooks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/hooks",
-  "version": "0.8.1",
+  "version": "0.8.2",
   "description": "hooks合集",
   "keywords": [
     "hooks"
diff --git a/packages/meta/CHANGELOG.md b/packages/meta/CHANGELOG.md
index 822cf5d..6e48ef1 100644
--- a/packages/meta/CHANGELOG.md
+++ b/packages/meta/CHANGELOG.md
@@ -1,5 +1,15 @@
 # @zhst/utils
 
+## 0.8.3
+
+### Patch Changes
+
+- 修改 boxSelectTree 类型提示
+- Updated dependencies
+  - @zhst/hooks@0.8.2
+  - @zhst/func@0.7.3
+  - @zhst/meta@0.8.3
+
 ## 0.8.2
 
 ### Patch Changes
diff --git a/packages/meta/package.json b/packages/meta/package.json
index 78e688e..ca3c72e 100644
--- a/packages/meta/package.json
+++ b/packages/meta/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/meta",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "原子组件",
   "keywords": [
     "meta",
diff --git a/packages/request/CHANGELOG.md b/packages/request/CHANGELOG.md
index ddf85c4..a3744cf 100644
--- a/packages/request/CHANGELOG.md
+++ b/packages/request/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @zhst/request
 
+## 0.8.2
+
+### Patch Changes
+
+- 修改 boxSelectTree 类型提示
+
 ## 0.8.1
 
 ### Patch Changes
diff --git a/packages/request/package.json b/packages/request/package.json
index c23f2c1..0d9878f 100644
--- a/packages/request/package.json
+++ b/packages/request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/request",
-  "version": "0.8.1",
+  "version": "0.8.2",
   "description": "请求库",
   "keywords": [
     "request",

From c3041a7d9ec2bdae9ed92f7c4391a22cc8507e3e Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Sun, 10 Mar 2024 16:20:59 +0800
Subject: [PATCH 16/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E7=AA=97=E5=8F=A3=E5=88=87=E6=8D=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewLargerImageModal.tsx                  | 16 ++++-----
 .../src/ViewLargerImageModal/demo/base.tsx    | 11 +++---
 .../biz/src/ViewLargerImageModal/index.tsx    |  3 +-
 .../WarningRecordCard/WarningRecordCard.tsx   | 28 +++++++++------
 .../biz/src/WarningRecordCard/demo/base.tsx   |  5 +--
 packages/biz/src/WarningRecordCard/index.less | 34 +++++++++----------
 packages/biz/src/index.tsx                    |  1 +
 7 files changed, 52 insertions(+), 46 deletions(-)

diff --git a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
index 72170f9..f4475bd 100644
--- a/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
+++ b/packages/biz/src/ViewLargerImageModal/ViewLargerImageModal.tsx
@@ -12,15 +12,15 @@ type ViewLargerImageModalParams = {
   }[];
 };
 
-interface ViewLargerImageModalRef {
+export interface ViewLargerImageModalRef {
   show: (params?: ViewLargerImageModalParams) => void;
   handleCancel: () => void;
 }
 
-interface ViewLargerImageModalProps {
+export interface ViewLargerImageModalProps {
   imgStyle?: React.CSSProperties;
-  downloadImg?: (imgSrc: string) => void;
-  title: string;
+  downloadImg?: (imgSrc?: string) => void;
+  title?: string;
   downloadText?: string;
   modalProps?: ModalProps
   spaceProps?: SpaceProps;
@@ -29,7 +29,7 @@ interface ViewLargerImageModalProps {
 export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLargerImageModalProps>(
   (props, ref) => {
 
-    const { modalProps, downloadImg, imgStyle, title, downloadText = '下载大图' ,spaceProps} = props
+    const { modalProps, downloadImg, imgStyle, title = '预警大图', downloadText = '下载大图', spaceProps } = props
     const { useToken } = theme
     const { token } = useToken()
     const [open, setOpen] = useState<boolean>(false);
@@ -38,7 +38,7 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
 
     const handleCancel = () => {
       setOpen(false);
-    } 
+    }
 
     useImperativeHandle(ref, () => {
       return {
@@ -64,7 +64,6 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
       >
         <Space size={0} styles={{ item: { backgroundColor: '#F6F9FAFF' } }} {...spaceProps}>
           <img alt={title} src={imgSrc} style={{ width: 789, height: 444, display: 'block', ...imgStyle }} />
-
           <div className='right-context'>
             {warningData?.map(({ label, value }) => (
               <div key={label} >
@@ -72,11 +71,8 @@ export const ViewLargerImageModal = forwardRef<ViewLargerImageModalRef, ViewLarg
                 {value}
               </div>
             ))}
-
             {imgSrc && downloadImg && <div className='img-download' style={{ color: token.colorPrimary }} onClick={() => downloadImg?.(imgSrc)} ><DownloadOutlined /><span style={{ paddingLeft: 3 }}>{downloadText}</span></div>}
-
           </div>
-
         </Space>
       </Modal>
     );
diff --git a/packages/biz/src/ViewLargerImageModal/demo/base.tsx b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
index a81c120..0668f55 100644
--- a/packages/biz/src/ViewLargerImageModal/demo/base.tsx
+++ b/packages/biz/src/ViewLargerImageModal/demo/base.tsx
@@ -4,8 +4,6 @@ import { ViewLargerImageModal, WarningRecordCard, IRecord, useViewLargerImageMod
 import { Space } from 'antd';
 import dayjs from 'dayjs';
 
-
-
 // 结合预警图列表 演示查看预警大图的使用    例如 后端返回这样的数据结构
 const backEndData = [
   {
@@ -41,7 +39,7 @@ const dataSource = backEndData.map(o => {
     boxId: o.boxId,
     position: o.position,
     cabietId: o.cabietId,
-    //,`柜子ID: ${o.cabietId}`
+    //,`柜子ID ${o.cabietId}`
     warningInfo: [`盒子${o.boxId}`, `位置${o.position}`],
     cabietText: `柜子ID: ${o.cabietId}`,
     warningTimestamp: o.warningTimestamp,
@@ -52,6 +50,8 @@ const dataSource = backEndData.map(o => {
 
 export default () => {
 
+  const [selectedRecordId, setSelectedRecordId] = React.useState<string | undefined>()
+
   // 把弹窗的ref 拿出来
   const viewLargerImageModalRef = useViewLargerImageModal()
 
@@ -76,18 +76,19 @@ export default () => {
     ]
     // 调用这个方法打开弹框
     viewLargerImageModalRef?.current?.show({ imgSrc: imgSrc, warningData: warningData })
+
+    setSelectedRecordId(record?.id)
   }
 
   return (
     <>
       <Space size={[8, 16]} >
         {
-          dataSource?.map((record) => <WarningRecordCard key={record?.id} record={record} onRecordClick={(record) => { handleClick(record) }} />)
+          dataSource?.map((record) => <WarningRecordCard key={record?.id} record={record} onRecordClick={(record) => { handleClick(record) }} selectedRecordId={selectedRecordId} />)
         }
       </Space>
       {/* 弹窗 绑定ref 后可以调用 handleCancel方法关闭弹窗 show方法打开弹窗 */}
       <ViewLargerImageModal ref={viewLargerImageModalRef} downloadImg={handleDownloadImg} title="预警大图" />
     </>
-
   )
 }
diff --git a/packages/biz/src/ViewLargerImageModal/index.tsx b/packages/biz/src/ViewLargerImageModal/index.tsx
index 52d812f..2780f86 100644
--- a/packages/biz/src/ViewLargerImageModal/index.tsx
+++ b/packages/biz/src/ViewLargerImageModal/index.tsx
@@ -1,3 +1,4 @@
-import ViewLargerImageModal,{useViewLargerImageModal } from './ViewLargerImageModal'
+import ViewLargerImageModal, { useViewLargerImageModal } from './ViewLargerImageModal'
+export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewLargerImageModal'
 export default ViewLargerImageModal;
 export { useViewLargerImageModal };
\ No newline at end of file
diff --git a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
index 66378a0..4833868 100644
--- a/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
+++ b/packages/biz/src/WarningRecordCard/WarningRecordCard.tsx
@@ -1,10 +1,8 @@
 import { Card, Space, Divider, CardProps } from 'antd';
+import { theme } from 'antd/lib';
 import React from 'react';
 import dayjs from 'dayjs';
 import './index.less'
-
-const componentName = `zhst-biz-warning-record-card`;
-
 export interface IRecord {
 
   imgSrc?: string;
@@ -59,14 +57,26 @@ export interface WarningRecordCardProps {
   onRecordClick?: (record?: IRecord) => void;
   style?: React.CSSProperties;
   cardProps?: CardProps;
+  selectedRecordId?: string;
+  cardStyle?: React.CSSProperties;
+  imgStyle?: React.CSSProperties;
 };
 
 export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
 
-  const { record, onRecordClick, style, cardProps } = props;
+  const componentName = `zhst-biz-warning-record-card`;
+  const { record, onRecordClick, style, cardProps, selectedRecordId, cardStyle, imgStyle } = props;
   const { imgSrc, id, warningType, warningInfo = [], cabietText, warningTime, warningTimestamp, warningTimeFormat = 'YYYY-MM-DD HH:mm:ss' } = record || {}
   const formattedDate = warningTimestamp ? dayjs(warningTimestamp).format(warningTimeFormat) : '';
   const warningTimeShow = warningTime ? warningTime : formattedDate
+  const { useToken } = theme
+  const { token } = useToken()
+  const selectedBorderStyle = {
+    border: `2px solid ${token.colorPrimary}`, boxShadow: " 0px 2px 9px 0px rgba(0,0,0,0.16)"
+  }
+  const selectedCardStyle: React.CSSProperties = {
+    ...(selectedRecordId === record?.id ? selectedBorderStyle : {})
+  };
 
   const handleClick = () => {
     onRecordClick?.(record);
@@ -74,15 +84,13 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
 
   return (
     <div className={componentName} key={id} onClick={handleClick} style={style}>
-
       <Card
-        cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0 }} />}
-        style={{ width: 356, height: 302, padding: 10, borderRadius: 4 }}
+        cover={<img alt="预警图" src={imgSrc} style={{ width: 336, height: 203, borderRadius: 0, ...imgStyle }} />}
+        style={{ width: 356, height: 302, padding: 10, borderRadius: 4, ...selectedCardStyle, ...cardStyle }}
         {...cardProps}
       >
-
         <div className='left-context'>
-          <div className="description">{warningType}</div>
+          <div className="warning-type">{warningType}</div>
           <Space size={0} split={<Divider type="vertical" />}>
             {warningInfo?.map((item, index) => (
               <div key={index} className="info-item">
@@ -92,9 +100,7 @@ export const WarningRecordCard: React.FC<WarningRecordCardProps> = (props) => {
           </Space>
           <div className='warning-time'>{warningTimeShow}</div>
         </div>
-
         <div className='cabietInfo' >{cabietText}</div>
-
       </Card>
     </div>
   );
diff --git a/packages/biz/src/WarningRecordCard/demo/base.tsx b/packages/biz/src/WarningRecordCard/demo/base.tsx
index 8fcaf69..51a8039 100644
--- a/packages/biz/src/WarningRecordCard/demo/base.tsx
+++ b/packages/biz/src/WarningRecordCard/demo/base.tsx
@@ -1,6 +1,6 @@
 
 import React from 'react';
-import { WarningRecordCard, type IRecord } from '@zhst/biz';
+import { WarningRecordCard } from '@zhst/biz';
 import { Space } from 'antd';
 
 // 例如 后端返回这样的数据结构
@@ -38,13 +38,14 @@ const dataSource = backEndData.map(o => {
     boxId: o.boxId,
     position: o.position,
     cabietId: o.cabietId,
-    warningInfo: [`盒子${o.boxId}`, `位置${o.position}`, `柜子ID: ${o.cabietId}`],
+    warningInfo: [`盒子${o.boxId}`, `位置${o.position}`, `柜子ID${o.cabietId}`],
     // cabietText: `柜子ID: ${o.cabietId}`,  
     warningTimestamp: o.warningTimestamp,
   }
 })
 
 export default () => {
+
   return (
     <Space size={[8, 16]} direction="vertical">
       {
diff --git a/packages/biz/src/WarningRecordCard/index.less b/packages/biz/src/WarningRecordCard/index.less
index cb25750..7cfba38 100644
--- a/packages/biz/src/WarningRecordCard/index.less
+++ b/packages/biz/src/WarningRecordCard/index.less
@@ -1,27 +1,27 @@
 .zhst-biz-warning-record-card {
   cursor: pointer;
 
-.ant-card-body {
-  padding: 0;
-  font-family: MicrosoftYaHei;
-  line-height: 19px;
-  display: flex;
-  margin-top: 10px;
+  .ant-card-body {
+    padding: 0;
+    font-family: MicrosoftYaHei;
+    line-height: 19px;
+    display: flex;
+    margin-top: 10px;
 
-  .left-context {
-    flex: 1;
+    .left-context {
+      flex: 1;
 
-    >div {
-      margin-top: 6px;
+      >div {
+        margin-top: 6px;
+      }
+
+      >div:nth-child(1) {
+        margin-top: 0;
+      }
     }
 
-    >div:nth-child(1) {
-      margin-top: 0;
+    .warning-type {
+      font-weight: bold;
     }
   }
-
-  .description {
-    font-weight: bold;
-  }
-}
 }
\ No newline at end of file
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index abf2337..cb4a40e 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -6,6 +6,7 @@ export { default as TreeTransfer } from './treeTransfer'
 export { default as TreeTransferModal } from './treeTransferModal'
 export { default as WarningRecordCard } from './WarningRecordCard'
 export type { IRecord, WarningRecordCardProps } from './WarningRecordCard'
+export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewLargerImageModal'
 export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'
 export type { VideoPlayerCardProps } from './VideoPlayerCard'
 export { default as VideoPlayerCard } from './VideoPlayerCard'

From b67b89a4ce7a1fcddfcbdbd0f0ceafbe5dea2b9d Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Sun, 10 Mar 2024 17:35:15 +0800
Subject: [PATCH 17/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E7=AA=97=E5=8F=A3=E5=88=87=E6=8D=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/VideoPlayerCard/VideoPlayerCard.tsx  |  2 --
 .../WarningRecordList/WarningRecordList.tsx           | 11 +++++++++--
 packages/biz/src/WindowToggle/index.md                |  7 ++++---
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/packages/biz/src/VideoPlayerCard/VideoPlayerCard.tsx b/packages/biz/src/VideoPlayerCard/VideoPlayerCard.tsx
index 8319823..7499d22 100644
--- a/packages/biz/src/VideoPlayerCard/VideoPlayerCard.tsx
+++ b/packages/biz/src/VideoPlayerCard/VideoPlayerCard.tsx
@@ -1,11 +1,9 @@
 import { Card, Space, CardProps, Spin, Button } from 'antd';
 import { theme } from 'antd/lib';
 import { VideoPlayer, type VideoViewRef } from '@zhst/meta';
-
 import React, { useState, useEffect, ReactNode, useRef } from 'react';
 import { CloseOutlined, LoadingOutlined } from '@ant-design/icons';
 import './index.less'
-
 export interface VideoPlayerCardProps {
   windowKey?: string;
   selectedWindowKey?: string;
diff --git a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx b/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx
index f4f8dec..08f7815 100644
--- a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx
+++ b/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx
@@ -4,12 +4,20 @@ import { Empty, Space, Spin } from 'antd';
 import "./index.less"
 import { LoadingOutlined } from '@ant-design/icons';
 
-
 interface WarningRecordListProps {
   dataSource?: IRecord[];
   viewLargerImageModalRef?: React.RefObject<ViewLargerImageModalRef>;
+  /*
+  处理 图片下载按钮点击事件
+  */
   handleDownloadImg?: (imgSrc?: string) => void;
+  /*
+  处理 预警记录卡片点击事件
+  */
   onRecordClick?: (record?: IRecord) => void;
+  /*
+  获取选中的 记录 id 用于 判断是否显示 选中样式
+  */
   selectedRecordId?: string;
   isRecordListLoading?: boolean;
   recordListTitle?: string;
@@ -58,7 +66,6 @@ const WarningRecordList: React.FC<WarningRecordListProps> = (props) => {
                     imgStyle={{ width: 280, height: 169, ...imgStyle }}
                   />)
                 }
-
                 )}
               </Space>
               :
diff --git a/packages/biz/src/WindowToggle/index.md b/packages/biz/src/WindowToggle/index.md
index a0040bf..bf1b0e6 100644
--- a/packages/biz/src/WindowToggle/index.md
+++ b/packages/biz/src/WindowToggle/index.md
@@ -16,7 +16,8 @@ title: WindowToggle 窗口切换组件
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
-
-
-
+| dataSource | 用于渲染 每个窗口的数据 | VideoPlayerCardProps[] | 需要传一组默认值用于窗口的渲染| - |
+| handleWindowClick | 用于获取窗口的 windowKey 方便更新对应窗口数据 | (key?: string) => void; | - | - |
+| handleCloseButtonClick | 用于点击窗口关闭按钮的事件 | (key?: string) => void; | - | - |
+| selectedWindowKey | 选中的窗口的 key 用于控制 选中边框样式 |string| - | - |
 

From 838e8bfa39591a8957230f8ec6ec720526174cab Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Sun, 10 Mar 2024 19:20:26 +0800
Subject: [PATCH 18/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E7=AA=97=E5=8F=A3=E5=88=87=E6=8D=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/RealTimeMonitor/RealTimeMonitor.tsx   | 70 +++++++++++++++++++
 .../WarningRecordList/WarningRecordList.tsx   |  1 -
 .../components/WarningRecordList/index.less   |  0
 .../components/WarningRecordList/index.tsx    |  0
 .../components}/WindowToggle/WindowToggle.tsx |  0
 .../components}/WindowToggle/index.less       |  0
 .../components}/WindowToggle/index.tsx        |  0
 .../demo/base.tsx                             | 34 ++++-----
 .../demo/index.less                           |  2 +-
 .../demo/mock.tsx                             |  0
 packages/biz/src/RealTimeMonitor/index.less   | 45 ++++++++++++
 packages/biz/src/RealTimeMonitor/index.md     | 36 ++++++++++
 packages/biz/src/RealTimeMonitor/index.tsx    |  2 +
 packages/biz/src/VideoPlayerCard/index.md     | 12 ++++
 packages/biz/src/WindowToggle/index.md        | 23 ------
 packages/biz/src/index.tsx                    |  2 +-
 16 files changed, 182 insertions(+), 45 deletions(-)
 create mode 100644 packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
 rename packages/biz/src/{WindowToggle/demo => RealTimeMonitor}/components/WarningRecordList/WarningRecordList.tsx (99%)
 rename packages/biz/src/{WindowToggle/demo => RealTimeMonitor}/components/WarningRecordList/index.less (100%)
 rename packages/biz/src/{WindowToggle/demo => RealTimeMonitor}/components/WarningRecordList/index.tsx (100%)
 rename packages/biz/src/{ => RealTimeMonitor/components}/WindowToggle/WindowToggle.tsx (100%)
 rename packages/biz/src/{ => RealTimeMonitor/components}/WindowToggle/index.less (100%)
 rename packages/biz/src/{ => RealTimeMonitor/components}/WindowToggle/index.tsx (100%)
 rename packages/biz/src/{WindowToggle => RealTimeMonitor}/demo/base.tsx (85%)
 rename packages/biz/src/{WindowToggle => RealTimeMonitor}/demo/index.less (69%)
 rename packages/biz/src/{WindowToggle => RealTimeMonitor}/demo/mock.tsx (100%)
 create mode 100644 packages/biz/src/RealTimeMonitor/index.less
 create mode 100644 packages/biz/src/RealTimeMonitor/index.md
 create mode 100644 packages/biz/src/RealTimeMonitor/index.tsx
 delete mode 100644 packages/biz/src/WindowToggle/index.md

diff --git a/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx b/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
new file mode 100644
index 0000000..6ebc983
--- /dev/null
+++ b/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
@@ -0,0 +1,70 @@
+import React from 'react';
+import { IRecord, VideoPlayerCardProps, ViewLargerImageModalRef } from '@zhst/biz';
+import './index.less'
+import WindowToggle from './components/WindowToggle';
+import WarningRecordList from './components/WarningRecordList';
+
+interface RealTimeMonitorProps {
+  videoDataSource?: VideoPlayerCardProps[];
+  handleWindowClick?: (key?: string) => void;
+  handleCloseButtonClick?: (key?: string) => void;
+  selectedWindowKey?: string;
+  warningDataSource?: IRecord[];
+  viewLargerImageModalRef?: React.RefObject<ViewLargerImageModalRef>;
+  /*
+  处理 图片下载按钮点击事件
+  */
+  handleDownloadImg?: (imgSrc?: string) => void;
+  /*
+  处理 预警记录卡片点击事件
+  */
+  onRecordClick?: (record?: IRecord) => void;
+  /*
+  获取选中的 记录 id 用于 判断是否显示 选中样式
+  */
+  selectedRecordId?: string;
+  isRecordListLoading?: boolean;
+  recordListTitle?: string;
+  style?: React.CSSProperties;
+  cardStyle?: React.CSSProperties;
+  imgStyle?: React.CSSProperties;
+  largeImageTitle?: string;
+}
+
+export const RealTimeMonitor: React.FC<RealTimeMonitorProps> = (props) => {
+
+  const { videoDataSource,
+    handleWindowClick,
+    handleCloseButtonClick,
+    selectedWindowKey,
+    warningDataSource,
+    viewLargerImageModalRef,
+    handleDownloadImg,
+    onRecordClick,
+    selectedRecordId,
+    isRecordListLoading,
+  } = props
+
+  return (
+    <div className='zhst-biz-real-time-monitor' style={{ display: 'flex' }} >
+      <WindowToggle
+        selectedWindowKey={selectedWindowKey}
+        dataSource={videoDataSource}
+        handleWindowClick={handleWindowClick}
+        handleCloseButtonClick={handleCloseButtonClick}
+      />
+      <WarningRecordList
+        dataSource={warningDataSource}
+        handleDownloadImg={handleDownloadImg}
+        onRecordClick={onRecordClick}
+        selectedRecordId={selectedRecordId}
+        viewLargerImageModalRef={viewLargerImageModalRef}
+        isRecordListLoading={isRecordListLoading}
+        recordListTitle="监控预警记录"
+      />
+    </div>
+
+  );
+};
+
+export default RealTimeMonitor;
\ No newline at end of file
diff --git a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/WarningRecordList.tsx
similarity index 99%
rename from packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx
rename to packages/biz/src/RealTimeMonitor/components/WarningRecordList/WarningRecordList.tsx
index 08f7815..9aba8b9 100644
--- a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/WarningRecordList.tsx
+++ b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/WarningRecordList.tsx
@@ -27,7 +27,6 @@ interface WarningRecordListProps {
   largeImageTitle?: string;
 }
 
-
 const WarningRecordList: React.FC<WarningRecordListProps> = (props) => {
 
   const {
diff --git a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/index.less b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.less
similarity index 100%
rename from packages/biz/src/WindowToggle/demo/components/WarningRecordList/index.less
rename to packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.less
diff --git a/packages/biz/src/WindowToggle/demo/components/WarningRecordList/index.tsx b/packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.tsx
similarity index 100%
rename from packages/biz/src/WindowToggle/demo/components/WarningRecordList/index.tsx
rename to packages/biz/src/RealTimeMonitor/components/WarningRecordList/index.tsx
diff --git a/packages/biz/src/WindowToggle/WindowToggle.tsx b/packages/biz/src/RealTimeMonitor/components/WindowToggle/WindowToggle.tsx
similarity index 100%
rename from packages/biz/src/WindowToggle/WindowToggle.tsx
rename to packages/biz/src/RealTimeMonitor/components/WindowToggle/WindowToggle.tsx
diff --git a/packages/biz/src/WindowToggle/index.less b/packages/biz/src/RealTimeMonitor/components/WindowToggle/index.less
similarity index 100%
rename from packages/biz/src/WindowToggle/index.less
rename to packages/biz/src/RealTimeMonitor/components/WindowToggle/index.less
diff --git a/packages/biz/src/WindowToggle/index.tsx b/packages/biz/src/RealTimeMonitor/components/WindowToggle/index.tsx
similarity index 100%
rename from packages/biz/src/WindowToggle/index.tsx
rename to packages/biz/src/RealTimeMonitor/components/WindowToggle/index.tsx
diff --git a/packages/biz/src/WindowToggle/demo/base.tsx b/packages/biz/src/RealTimeMonitor/demo/base.tsx
similarity index 85%
rename from packages/biz/src/WindowToggle/demo/base.tsx
rename to packages/biz/src/RealTimeMonitor/demo/base.tsx
index 883b541..fb683c4 100644
--- a/packages/biz/src/WindowToggle/demo/base.tsx
+++ b/packages/biz/src/RealTimeMonitor/demo/base.tsx
@@ -1,10 +1,9 @@
 
 import React, { useState } from 'react';
-import { IRecord, VideoPlayerCardProps, WindowToggle, useViewLargerImageModal } from '@zhst/biz';
+import { IRecord, RealTimeMonitor, VideoPlayerCardProps, useViewLargerImageModal } from '@zhst/biz';
 import { videoData, warningData } from './mock';
 import { Space } from 'antd';
 import dayjs from 'dayjs'
-import WarningRecordList from './components/WarningRecordList';
 import './index.less'
 
 
@@ -142,24 +141,21 @@ export default () => {
   }
 
   return (
+
+
     <Space size={[8, 16]} direction="vertical">
-      <div className='zhst-biz-real-time-monitor' style={{ display: 'flex' }} >
-        <WindowToggle
-          selectedWindowKey={selectedWindowKey}
-          dataSource={videoDataSource}
-          handleWindowClick={handleWindowClick}
-          handleCloseButtonClick={clearWindowData}
-        />
-        <WarningRecordList
-          dataSource={warningDataSource}
-          handleDownloadImg={handleDownloadImg}
-          onRecordClick={onRecordClick}
-          selectedRecordId={selectedRecordId}
-          viewLargerImageModalRef={viewLargerImageModalRef}
-          isRecordListLoading={isRecordListLoading}
-          recordListTitle="监控预警记录"
-        />
-      </div>
+      <RealTimeMonitor
+        selectedWindowKey={selectedWindowKey}
+        videoDataSource={videoDataSource}
+        handleWindowClick={handleWindowClick}
+        handleCloseButtonClick={clearWindowData}
+        warningDataSource={warningDataSource}
+        handleDownloadImg={handleDownloadImg}
+        onRecordClick={onRecordClick}
+        selectedRecordId={selectedRecordId}
+        viewLargerImageModalRef={viewLargerImageModalRef}
+        isRecordListLoading={isRecordListLoading}
+        recordListTitle="监控预警记录" />
       <button onClick={() => { mockData() }}>模拟数据</button>
     </Space>
   )
diff --git a/packages/biz/src/WindowToggle/demo/index.less b/packages/biz/src/RealTimeMonitor/demo/index.less
similarity index 69%
rename from packages/biz/src/WindowToggle/demo/index.less
rename to packages/biz/src/RealTimeMonitor/demo/index.less
index b73ced1..71ea110 100644
--- a/packages/biz/src/WindowToggle/demo/index.less
+++ b/packages/biz/src/RealTimeMonitor/demo/index.less
@@ -1,4 +1,4 @@
-#windowtoggle-demo-base {
+#realtimemonitor-demo-base {
     .dumi-default-previewer-demo>div {
         width: 100%;
     }
diff --git a/packages/biz/src/WindowToggle/demo/mock.tsx b/packages/biz/src/RealTimeMonitor/demo/mock.tsx
similarity index 100%
rename from packages/biz/src/WindowToggle/demo/mock.tsx
rename to packages/biz/src/RealTimeMonitor/demo/mock.tsx
diff --git a/packages/biz/src/RealTimeMonitor/index.less b/packages/biz/src/RealTimeMonitor/index.less
new file mode 100644
index 0000000..61c77bd
--- /dev/null
+++ b/packages/biz/src/RealTimeMonitor/index.less
@@ -0,0 +1,45 @@
+.zhst-biz-window-toggle {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+
+  .header {
+    width: 100%;
+    height: 48px;
+    background-color: #EFF2F4;
+    padding: 10px 20px;
+    box-sizing: border-box;
+
+    .ant-segmented {
+      padding: 0;
+
+      .ant-segmented-group {
+        border-radius: 4px;
+        overflow: hidden;
+
+        .ant-segmented-item {
+          border-radius: 0;
+
+          .ant-segmented-item-label {
+            padding: 0;
+          }
+        }
+      }
+    }
+  }
+
+  .body {
+    flex: 1;
+    width: 100%;
+    background-color: #E5EAEC;
+    padding: 10px;
+    box-sizing: border-box;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+
+    >div {
+      margin: 10px;
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/biz/src/RealTimeMonitor/index.md b/packages/biz/src/RealTimeMonitor/index.md
new file mode 100644
index 0000000..de10be9
--- /dev/null
+++ b/packages/biz/src/RealTimeMonitor/index.md
@@ -0,0 +1,36 @@
+---
+group: 数据展示
+category: Components
+subtitle: 实时监控页面
+title: RealTimeMonitor 实时监控页面
+---
+
+# RealTimeMonitor 实时监控页面
+
+
+<code src="./demo/base.tsx"></code>
+
+
+
+## API
+
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| videoDataSource | 用于渲染 每个窗口的数据 | VideoPlayerCardProps[] | 需要传一组默认值用于窗口的渲染| - |
+| warningDataSource | 用于渲染 预警记录的数据 | WindowProps[] | 需要传一组默认值用于窗口的渲染| - |
+| handleWindowClick | 用于获取窗口的 windowKey 方便更新对应窗口数据 | (key?: string) => void; | - | - |
+| handleCloseButtonClick | 用于点击窗口关闭按钮的事件 | (key?: string) => void; | - | - |
+| selectedWindowKey | 选中的窗口的 key 用于控制 选中边框样式 |string| - | - |
+| handleDownloadImg | 用于处理查看大图下载图片的事件 | (key?: string) => void; | - | - |
+| onRecordClick | 用于处理预警记录卡片点击事件事件 | (key?: string) => void; | - | - |
+| selectedRecordId| 用于判断是否显示选中样式 |string| - | - |
+| isRecordListLoading | 判断预警记录列表loading状态 |boolean| - | - |
+| recordListTitle | 预警记录列表的标题 | string | - | - |
+| viewLargerImageModalRef | 查看大图弹窗的ref |         viewLargerImageModalRef={viewLargerImageModalRef}| | - |
+
+
+
+
+
+
+
diff --git a/packages/biz/src/RealTimeMonitor/index.tsx b/packages/biz/src/RealTimeMonitor/index.tsx
new file mode 100644
index 0000000..00985f9
--- /dev/null
+++ b/packages/biz/src/RealTimeMonitor/index.tsx
@@ -0,0 +1,2 @@
+import RealTimeMonitor from './RealTimeMonitor'
+export default RealTimeMonitor
\ No newline at end of file
diff --git a/packages/biz/src/VideoPlayerCard/index.md b/packages/biz/src/VideoPlayerCard/index.md
index 1e900ec..a888603 100644
--- a/packages/biz/src/VideoPlayerCard/index.md
+++ b/packages/biz/src/VideoPlayerCard/index.md
@@ -16,6 +16,18 @@ title: VideoPlayerCard  视频播放卡片
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
+| windowKey | 每个卡片的唯一标识 | string | - | - |
+| selectedWindowKey | 选中的窗口key | string | - | - |
+| imgSrc | 图片地址 | string | - | - |
+| videoSrc | 视频地址 | string | - | - |
+| errorReasonText | 加载失败的错误提示 | string | - | - |
+| isWindowLoading | 判断是否显示loading | boolean | - | - |
+| size | 设置窗口大小 | 'large' \| 'small' | - | - |
+| title | 设置窗口标题 |  string \| ReactNode | - | - |
+| handleCloseButtonClick | 处理关闭按钮事件 |  (key?: string) => void| - | - |
+| handleWindowClick | 处理窗口点击事件 |  (key?: string) => void| - | - |
+
+
 
 
 
diff --git a/packages/biz/src/WindowToggle/index.md b/packages/biz/src/WindowToggle/index.md
deleted file mode 100644
index bf1b0e6..0000000
--- a/packages/biz/src/WindowToggle/index.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-group: 数据展示
-category: Components
-subtitle: 窗口切换组件
-title: WindowToggle 窗口切换组件
----
-
-# WindowToggle 窗口切换组件
-
-
-<code src="./demo/base.tsx"></code>
-
-
-
-## API
-
-| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
-| dataSource | 用于渲染 每个窗口的数据 | VideoPlayerCardProps[] | 需要传一组默认值用于窗口的渲染| - |
-| handleWindowClick | 用于获取窗口的 windowKey 方便更新对应窗口数据 | (key?: string) => void; | - | - |
-| handleCloseButtonClick | 用于点击窗口关闭按钮的事件 | (key?: string) => void; | - | - |
-| selectedWindowKey | 选中的窗口的 key 用于控制 选中边框样式 |string| - | - |
-
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index cb4a40e..9d70097 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -10,5 +10,5 @@ export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewL
 export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'
 export type { VideoPlayerCardProps } from './VideoPlayerCard'
 export { default as VideoPlayerCard } from './VideoPlayerCard'
-export { default as WindowToggle } from './WindowToggle'
+export { default as RealTimeMonitor } from './RealTimeMonitor'
 

From c8e4057ed64a9e95141a4e9b88ca17565d734854 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Sun, 10 Mar 2024 19:22:50 +0800
Subject: [PATCH 19/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E7=AA=97=E5=8F=A3=E5=88=87=E6=8D=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/RealTimeMonitor/demo/base.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/biz/src/RealTimeMonitor/demo/base.tsx b/packages/biz/src/RealTimeMonitor/demo/base.tsx
index fb683c4..90338fd 100644
--- a/packages/biz/src/RealTimeMonitor/demo/base.tsx
+++ b/packages/biz/src/RealTimeMonitor/demo/base.tsx
@@ -6,7 +6,6 @@ import { Space } from 'antd';
 import dayjs from 'dayjs'
 import './index.less'
 
-
 export default () => {
 
   // 必须设置初始数据 用于渲染 4个窗口

From 59913abe7b9057f57f328938279986c9d386afd4 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Mon, 11 Mar 2024 09:10:09 +0800
Subject: [PATCH 20/24] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=20=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E7=AA=97=E5=8F=A3=E5=88=87=E6=8D=A2=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/RealTimeMonitor/RealTimeMonitor.tsx   |  1 -
 packages/biz/src/RealTimeMonitor/index.less   | 45 -------------------
 2 files changed, 46 deletions(-)
 delete mode 100644 packages/biz/src/RealTimeMonitor/index.less

diff --git a/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx b/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
index 6ebc983..73d7dd4 100644
--- a/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
+++ b/packages/biz/src/RealTimeMonitor/RealTimeMonitor.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { IRecord, VideoPlayerCardProps, ViewLargerImageModalRef } from '@zhst/biz';
-import './index.less'
 import WindowToggle from './components/WindowToggle';
 import WarningRecordList from './components/WarningRecordList';
 
diff --git a/packages/biz/src/RealTimeMonitor/index.less b/packages/biz/src/RealTimeMonitor/index.less
deleted file mode 100644
index 61c77bd..0000000
--- a/packages/biz/src/RealTimeMonitor/index.less
+++ /dev/null
@@ -1,45 +0,0 @@
-.zhst-biz-window-toggle {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-
-  .header {
-    width: 100%;
-    height: 48px;
-    background-color: #EFF2F4;
-    padding: 10px 20px;
-    box-sizing: border-box;
-
-    .ant-segmented {
-      padding: 0;
-
-      .ant-segmented-group {
-        border-radius: 4px;
-        overflow: hidden;
-
-        .ant-segmented-item {
-          border-radius: 0;
-
-          .ant-segmented-item-label {
-            padding: 0;
-          }
-        }
-      }
-    }
-  }
-
-  .body {
-    flex: 1;
-    width: 100%;
-    background-color: #E5EAEC;
-    padding: 10px;
-    box-sizing: border-box;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-
-    >div {
-      margin: 10px;
-    }
-  }
-}
\ No newline at end of file

From 8c9346e627190db0004238a46b75fcba0f7c4998 Mon Sep 17 00:00:00 2001
From: YuanHongbo <782242184@qq.com>
Date: Mon, 11 Mar 2024 11:11:21 +0800
Subject: [PATCH 21/24] =?UTF-8?q?feat:=20=E5=AE=8C=E5=96=84=E5=AE=9E?=
 =?UTF-8?q?=E6=97=B6=E7=9B=91=E6=8E=A7=20api=20=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/biz/src/RealTimeMonitor/index.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/biz/src/RealTimeMonitor/index.md b/packages/biz/src/RealTimeMonitor/index.md
index de10be9..e18579f 100644
--- a/packages/biz/src/RealTimeMonitor/index.md
+++ b/packages/biz/src/RealTimeMonitor/index.md
@@ -27,7 +27,7 @@ title: RealTimeMonitor 实时监控页面
 | isRecordListLoading | 判断预警记录列表loading状态 |boolean| - | - |
 | recordListTitle | 预警记录列表的标题 | string | - | - |
 | viewLargerImageModalRef | 查看大图弹窗的ref |         viewLargerImageModalRef={viewLargerImageModalRef}| | - |
-
+| viewLargerImageModalRef | 查看大图弹窗的ref |React.RefObject\<ViewLargerImageModalRef\>| - | - |
 
 
 

From 762f480f81f222a8c7ac8ed428c0bf6e58eba57a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E5=BF=97=E9=9B=84?= <jiangzhixiong@smartvision.cn>
Date: Mon, 11 Mar 2024 18:55:35 +0800
Subject: [PATCH 22/24] =?UTF-8?q?fix:=20=E6=96=B0=E5=A2=9E=20tree=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=9A=84=E7=9B=91=E5=90=AC=E4=BA=8B=E4=BB=B6?=
 =?UTF-8?q?,=E4=BC=98=E5=8C=96=20meta=20=E5=85=A8=E9=80=89=E7=9A=84?=
 =?UTF-8?q?=E5=9B=9E=E8=B0=83=E4=BA=8B=E4=BB=B6=E7=9B=91=E5=90=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .vscode/launch.json                           |  10 +
 packages/biz/CHANGELOG.md                     |  34 +++
 packages/biz/es/index.d.ts                    |   8 +-
 packages/biz/es/useSocket/index.js            |  95 -------
 packages/biz/es/useSocket/onceChannel.d.ts    |   2 -
 packages/biz/es/useSocket/onceChannel.js      |  24 --
 packages/biz/es/useSocket/ws.js               | 244 ------------------
 packages/biz/es/utils/constants.d.ts          |  31 ---
 packages/biz/lib/index.d.ts                   |   8 +-
 packages/biz/lib/useSocket/index.js           | 118 ---------
 packages/biz/lib/useSocket/onceChannel.d.ts   |   2 -
 packages/biz/lib/useSocket/onceChannel.js     |  51 ----
 packages/biz/lib/useSocket/ws.js              | 224 ----------------
 packages/biz/lib/utils/constants.d.ts         |  31 ---
 packages/biz/package.json                     |   2 +-
 .../biz/src/boxSelectTree/boxSelectTree.tsx   |  36 +--
 .../components/boxPanel/index.tsx             | 126 +++++----
 packages/biz/src/boxSelectTree/demo/async.tsx |  82 ++++++
 packages/biz/src/boxSelectTree/demo/basic.tsx |   9 +-
 packages/biz/src/boxSelectTree/index.md       |   6 +-
 packages/biz/src/boxSelectTree/index.tsx      |   2 +
 packages/biz/src/index.tsx                    |   8 +-
 packages/biz/src/tree/boxTree.tsx             |  34 ++-
 packages/biz/src/tree/index.tsx               |   6 +
 packages/biz/src/treeTransfer/index.tsx       |   4 +
 packages/biz/src/treeTransferModal/index.tsx  |   2 +
 packages/biz/src/useSocket/index.ts           |  99 -------
 packages/biz/src/useSocket/onceChannel.tsx    |  23 --
 packages/biz/src/useSocket/ws.ts              | 222 ----------------
 packages/func/CHANGELOG.md                    |   8 +
 packages/func/package.json                    |   2 +-
 packages/func/src/math/index.ts               | 125 ---------
 packages/hooks/CHANGELOG.md                   |   8 +
 packages/hooks/package.json                   |   2 +-
 packages/meta/CHANGELOG.md                    |  10 +
 packages/meta/package.json                    |   2 +-
 .../src/BigImagePreview/BigImagePreview.tsx   |  65 +++--
 .../BigImagePreview/bigImagePreviewHelper.ts  |  58 +++++
 .../meta/src/BigImagePreview/demo/base.tsx    |  32 +--
 .../src/BigImagePreview/demo/noAttach.tsx     |  43 +++
 packages/meta/src/BigImagePreview/index.less  |   6 +-
 packages/meta/src/BigImagePreview/index.md    |   1 +
 packages/meta/src/VideoPlayer/VideoPlayer.tsx |   2 +-
 packages/request/CHANGELOG.md                 |   6 +
 packages/request/package.json                 |   2 +-
 45 files changed, 462 insertions(+), 1453 deletions(-)
 create mode 100644 .vscode/launch.json
 delete mode 100644 packages/biz/es/useSocket/index.js
 delete mode 100644 packages/biz/es/useSocket/onceChannel.d.ts
 delete mode 100644 packages/biz/es/useSocket/onceChannel.js
 delete mode 100644 packages/biz/es/useSocket/ws.js
 delete mode 100644 packages/biz/es/utils/constants.d.ts
 delete mode 100644 packages/biz/lib/useSocket/index.js
 delete mode 100644 packages/biz/lib/useSocket/onceChannel.d.ts
 delete mode 100644 packages/biz/lib/useSocket/onceChannel.js
 delete mode 100644 packages/biz/lib/useSocket/ws.js
 delete mode 100644 packages/biz/lib/utils/constants.d.ts
 create mode 100644 packages/biz/src/boxSelectTree/demo/async.tsx
 delete mode 100644 packages/biz/src/useSocket/index.ts
 delete mode 100644 packages/biz/src/useSocket/onceChannel.tsx
 delete mode 100644 packages/biz/src/useSocket/ws.ts
 create mode 100644 packages/meta/src/BigImagePreview/demo/noAttach.tsx

diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..d6aacd6
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,10 @@
+{
+  "configurations": [
+    {
+      "type": "chrome",
+      "name": "http://localhost:8000/metas/big-image-preview",
+      "request": "launch",
+      "url": "http://localhost:8000/metas/big-image-preview"
+    }
+  ]
+}
diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index 833cb13..a5f4767 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,39 @@
 # @zhst/biz
 
+## 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
diff --git a/packages/biz/es/index.d.ts b/packages/biz/es/index.d.ts
index 259e6bc..f170490 100644
--- a/packages/biz/es/index.d.ts
+++ b/packages/biz/es/index.d.ts
@@ -1,8 +1,12 @@
 export { default as BigImageModal } from './BigImageModal';
+export type { BigImageModalProps } from './BigImageModal';
 export { default as BoxSelectTree } from './boxSelectTree';
+export type { BoxSelectTreeProps } from './boxSelectTree';
 export { default as Tree } from './tree';
-export type { TreeData } from './tree';
+export type { BoxTreeProps, TreeData } from './tree';
 export { default as TreeTransfer } from './treeTransfer';
+export type { TreeTransferProps } from './treeTransfer';
 export { default as TreeTransferModal } from './treeTransferModal';
+export type { TreeTransferModalProps } from './treeTransferModal';
 export { default as WarningRecordCard } from './WarningRecordCard';
-export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
+export type { WarningRecordCardProps, IRecord } from './WarningRecordCard';
diff --git a/packages/biz/es/useSocket/index.js b/packages/biz/es/useSocket/index.js
deleted file mode 100644
index 305ec57..0000000
--- a/packages/biz/es/useSocket/index.js
+++ /dev/null
@@ -1,95 +0,0 @@
-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]);
-});
\ No newline at end of file
diff --git a/packages/biz/es/useSocket/onceChannel.d.ts b/packages/biz/es/useSocket/onceChannel.d.ts
deleted file mode 100644
index 400ffa7..0000000
--- a/packages/biz/es/useSocket/onceChannel.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-declare const startChannel: (topic: any, req: any, callback: any) => () => void;
-export default startChannel;
diff --git a/packages/biz/es/useSocket/onceChannel.js b/packages/biz/es/useSocket/onceChannel.js
deleted file mode 100644
index b7f273e..0000000
--- a/packages/biz/es/useSocket/onceChannel.js
+++ /dev/null
@@ -1,24 +0,0 @@
-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;
\ No newline at end of file
diff --git a/packages/biz/es/useSocket/ws.js b/packages/biz/es/useSocket/ws.js
deleted file mode 100644
index a3918cb..0000000
--- a/packages/biz/es/useSocket/ws.js
+++ /dev/null
@@ -1,244 +0,0 @@
-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;
\ No newline at end of file
diff --git a/packages/biz/es/utils/constants.d.ts b/packages/biz/es/utils/constants.d.ts
deleted file mode 100644
index 0180cc0..0000000
--- a/packages/biz/es/utils/constants.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-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;
-}[];
diff --git a/packages/biz/lib/index.d.ts b/packages/biz/lib/index.d.ts
index 259e6bc..f170490 100644
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@@ -1,8 +1,12 @@
 export { default as BigImageModal } from './BigImageModal';
+export type { BigImageModalProps } from './BigImageModal';
 export { default as BoxSelectTree } from './boxSelectTree';
+export type { BoxSelectTreeProps } from './boxSelectTree';
 export { default as Tree } from './tree';
-export type { TreeData } from './tree';
+export type { BoxTreeProps, TreeData } from './tree';
 export { default as TreeTransfer } from './treeTransfer';
+export type { TreeTransferProps } from './treeTransfer';
 export { default as TreeTransferModal } from './treeTransferModal';
+export type { TreeTransferModalProps } from './treeTransferModal';
 export { default as WarningRecordCard } from './WarningRecordCard';
-export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
+export type { WarningRecordCardProps, IRecord } from './WarningRecordCard';
diff --git a/packages/biz/lib/useSocket/index.js b/packages/biz/lib/useSocket/index.js
deleted file mode 100644
index b4d6861..0000000
--- a/packages/biz/lib/useSocket/index.js
+++ /dev/null
@@ -1,118 +0,0 @@
-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
-});
diff --git a/packages/biz/lib/useSocket/onceChannel.d.ts b/packages/biz/lib/useSocket/onceChannel.d.ts
deleted file mode 100644
index 400ffa7..0000000
--- a/packages/biz/lib/useSocket/onceChannel.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-declare const startChannel: (topic: any, req: any, callback: any) => () => void;
-export default startChannel;
diff --git a/packages/biz/lib/useSocket/onceChannel.js b/packages/biz/lib/useSocket/onceChannel.js
deleted file mode 100644
index 2dc648e..0000000
--- a/packages/biz/lib/useSocket/onceChannel.js
+++ /dev/null
@@ -1,51 +0,0 @@
-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;
diff --git a/packages/biz/lib/useSocket/ws.js b/packages/biz/lib/useSocket/ws.js
deleted file mode 100644
index 8dab6f2..0000000
--- a/packages/biz/lib/useSocket/ws.js
+++ /dev/null
@@ -1,224 +0,0 @@
-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;
diff --git a/packages/biz/lib/utils/constants.d.ts b/packages/biz/lib/utils/constants.d.ts
deleted file mode 100644
index 0180cc0..0000000
--- a/packages/biz/lib/utils/constants.d.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-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;
-}[];
diff --git a/packages/biz/package.json b/packages/biz/package.json
index 1fdb65b..a4e27f2 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.9.1",
+  "version": "0.9.6",
   "description": "业务库",
   "keywords": [
     "business",
diff --git a/packages/biz/src/boxSelectTree/boxSelectTree.tsx b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
index 964aa0a..aea65ad 100644
--- a/packages/biz/src/boxSelectTree/boxSelectTree.tsx
+++ b/packages/biz/src/boxSelectTree/boxSelectTree.tsx
@@ -1,24 +1,11 @@
 import React, { FC } from 'react';
-import { InputProps, Tabs, TabsProps, TreeDataNode, TreeProps } from 'antd'
+import { Tabs, TabsProps } from 'antd'
 import BoxPanel from './components/boxPanel';
-import { ModalFormProps } from '@ant-design/pro-components';
+import type { BoxPanelProps } from './components/boxPanel';
 
-export interface BoxSelectTreeProps {
-  boxDataSource: TreeDataNode[]
-  data: TreeDataNode[]
-  onSearch?: (e: any) => void       // 搜索
-  onItemSelect?: TreeProps['onSelect']
-  onItemCheck?: TreeProps['onCheck']
+export interface BoxSelectTreeProps extends BoxPanelProps {
   onTabChange?: (e: any) => void
-  onBoxBatchDelete?: (data?: any) => void
-  onBoxDelete?: (data?: any) => void
-  onCreateSubmit?: ModalFormProps['onFinish']
   tabsProps?: TabsProps
-  searchInputProps?: InputProps
-  treeProps?: TreeProps
-  showOptions?: boolean
-  customImport?: any
-  extraBtns?: any
 }
 
 const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
@@ -32,18 +19,17 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
     onBoxBatchDelete,
     onBoxDelete,
     onCreateSubmit,
+    onClockClick,
+    onImport,
+    onCreate,
     tabsProps,
     searchInputProps,
     treeProps,
     customImport,
+    showOptions,
     extraBtns,
-    showOptions = true
   } = props
 
-  const onChange = (key: string) => {
-    onTabChange?.(key)
-  };
-
   const items: TabsProps['items'] = [
     {
       key: '1',
@@ -54,6 +40,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           boxDataSource={boxDataSource}
           treeProps={treeProps}
           data={data}
+          onCreate={onCreate}
           onCreateSubmit={onCreateSubmit}
           onBoxBatchDelete={onBoxBatchDelete}
           onBoxDelete={onBoxDelete}
@@ -63,6 +50,8 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           showOptions={showOptions}
           customImport={customImport}
           extraBtns={extraBtns}
+          onClockClick={onClockClick}
+          onImport={onImport}
         />
       )
     },
@@ -75,6 +64,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           searchInputProps={searchInputProps}
           treeProps={treeProps}
           data={data}
+          onCreate={onCreate}
           onBoxBatchDelete={onBoxBatchDelete}
           onCreateSubmit={onCreateSubmit}
           onBoxDelete={onBoxDelete}
@@ -84,6 +74,8 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
           showOptions={showOptions}
           customImport={customImport}
           extraBtns={extraBtns}
+          onClockClick={onClockClick}
+          onImport={onImport}
         />
       )
     },
@@ -94,7 +86,7 @@ const BoxSelectTree: FC<BoxSelectTreeProps> = (props) => {
       defaultActiveKey="1"
       centered
       items={items}
-      onChange={onChange}
+      onChange={onTabChange}
       tabBarGutter={0}
       indicator={{ size: (origin) => origin, align: 'center' }}
       {...tabsProps}
diff --git a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
index 361d3b0..a8270e5 100644
--- a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
@@ -3,13 +3,14 @@ import{ Button, Divider, Input, Space, TreeDataNode } from 'antd'
 import { ModalForm, ModalFormProps, ProFormInstance, ProFormText } from '@ant-design/pro-components'
 import { ClockCircleOutlined, CloseCircleOutlined, DiffOutlined, FolderAddOutlined, ImportOutlined, SwitcherOutlined  } from '@ant-design/icons'
 import type { TreeProps, InputProps } from 'antd';
+import type { BoxTreeProps } from '../../../tree';
 import TreeTransferModal from '../../../treeTransferModal'
 import BoxTree from '../../../tree';
 
-export interface BoxGroupPanelProps {
+export interface BoxPanelProps {
   searchInputProps?: InputProps
   showOptions?: boolean
-  treeProps?: TreeProps
+  treeProps?: Partial<BoxTreeProps>
   data: TreeDataNode[]
   boxDataSource: TreeDataNode[]
   handleImport?: () => void
@@ -20,11 +21,14 @@ export interface BoxGroupPanelProps {
   onBoxDelete?: (data?: any) => void
   onCreateSubmit?: ModalFormProps['onFinish']
   onClockClick?: () => void
+  onImport?: () => void
+  onBatch?: () => void
+  onCreate?: () => void
   customImport?: any
   extraBtns?: any
 }
 
-const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
+const BoxPanel: FC<BoxPanelProps> = (props) => {
   const {
     searchInputProps,
     showOptions = true,
@@ -38,6 +42,9 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
     onBoxBatchDelete,
     onBoxDelete,
     onClockClick,
+    onImport,
+    onBatch,
+    onCreate,
     boxDataSource,
     customImport
   } = props
@@ -116,7 +123,7 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
           <Input size='middle' onChange={(e) => onSearch?.(e)} placeholder='请输入盒子名称' {...searchInputProps} />
           {customImport || (
             <>
-              <Button type="text" onClick={() => handleCheckable()} icon={!isTreeCheckable ? <DiffOutlined /> : <SwitcherOutlined />} />
+              <Button type="text" onClick={() => onBatch?.() || handleCheckable()} icon={isTreeCheckable ? <SwitcherOutlined /> : <DiffOutlined />} />
               <Button type="text" onClick={() => onClockClick?.()} icon={<ClockCircleOutlined />} />
             </>
           )}
@@ -125,58 +132,65 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
         {showOptions && (
           <>
             <Space align='center'>
-              <Button type='text' style={{ padding: '4px 8px' }} icon={<ImportOutlined />} >导入盒子</Button>
+              <Button type='text' style={{ padding: '4px 8px' }} onClick={() => onImport?.()} icon={<ImportOutlined />} >导入盒子</Button>
               <Divider type="vertical" style={{ margin: '8px 0' }} />
-              <ModalForm<{
-                name: string
-                boxList?: any[]
-              }>
-                width={'600px'}
-                formRef={createFormRef}
-                title="新建组"
-                modalProps={{ destroyOnClose: true }}
-                layout='horizontal'
-                labelCol={{ span: 6 }}
-                wrapperCol={{ span: 18 }}
-                trigger={<Button type='text' style={{ padding: '4px 8px' }} icon={<FolderAddOutlined />} >新建组</Button>}
-                submitter={{
-                  searchConfig: {
-                    submitText: '确定',
-                    resetText: '取消',
-                  },
-                }}
-                onFinish={onCreateSubmit}
-              >
-                <ProFormText
-                  rules={[
-                    {
-                      required: true,
-                    },
-                  ]}
-                  width="md"
-                  name="name"
-                  label="盒子组名称"
-                  placeholder="请输入盒子名称"
-                />
-                <ProFormText
-                  width="md"
-                  name="boxList"
-                  label="盒子选择"
-                  fieldProps={{
-                    readOnly: true,
-                    value: `已选择${createFormRef.current?.getFieldValue('boxList')?.length || 0}个盒子`,
-                    suffix: (
-                      <Space>
-                        <a onClick={() => {
-                          createFormRef.current?.setFieldValue('boxList', null)
-                          onBoxChoiceReset()
-                        }} >恢复默认</a>
-                        <a onClick={() => setBoxChoiceOpen(true)}>范围选择</a>
-                      </Space>
-                    )
-                  }}
-                />
-              </ModalForm>
+              {onCreate ?
+                (
+                  <Button onClick={onCreate} type='text' style={{ padding: '4px 8px' }} icon={<FolderAddOutlined />} >新建组</Button>
+                ) : (
+                  <ModalForm<{
+                    name: string
+                    boxList?: any[]
+                  }>
+                    width={'600px'}
+                    open={onCreate ? false : undefined}
+                    formRef={createFormRef}
+                    title="新建组"
+                    modalProps={{ destroyOnClose: true }}
+                    layout='horizontal'
+                    labelCol={{ span: 6 }}
+                    wrapperCol={{ span: 18 }}
+                    trigger={<Button type='text' style={{ padding: '4px 8px' }} icon={<FolderAddOutlined />} >新建组</Button>}
+                    submitter={{
+                      searchConfig: {
+                        submitText: '确定',
+                        resetText: '取消',
+                      },
+                    }}
+                    onFinish={onCreateSubmit}
+                  >
+                    <ProFormText
+                      rules={[
+                        {
+                          required: true,
+                        },
+                      ]}
+                      width="md"
+                      name="name"
+                      label="盒子组名称"
+                      placeholder="请输入盒子名称"
+                    />
+                    <ProFormText
+                      width="md"
+                      name="boxList"
+                      label="盒子选择"
+                      fieldProps={{
+                        readOnly: true,
+                        value: `已选择${createFormRef.current?.getFieldValue('boxList')?.length || 0}个盒子`,
+                        suffix: (
+                          <Space>
+                            <a onClick={() => {
+                              createFormRef.current?.setFieldValue('boxList', null)
+                              onBoxChoiceReset()
+                            }} >恢复默认</a>
+                            <a onClick={() => setBoxChoiceOpen(true)}>范围选择</a>
+                          </Space>
+                        )
+                      }}
+                    />
+                  </ModalForm>
+                )
+              }
               <Divider type="vertical" style={{ margin: '8px 0' }} />
               {/* @ts-ignore */}
               <Button danger type='text' style={{ padding: '4px 8px' }} icon={<CloseCircleOutlined />} disabled={treeProps?.checkedKeys?.length <= 0} onClick={onBoxBatchDelete} >删除</Button>
@@ -198,4 +212,4 @@ const BoxGroupPanel: FC<BoxGroupPanelProps> = (props) => {
   )
 }
 
-export default BoxGroupPanel
+export default BoxPanel
diff --git a/packages/biz/src/boxSelectTree/demo/async.tsx b/packages/biz/src/boxSelectTree/demo/async.tsx
new file mode 100644
index 0000000..ac573e8
--- /dev/null
+++ b/packages/biz/src/boxSelectTree/demo/async.tsx
@@ -0,0 +1,82 @@
+import React, { useState } from 'react';
+import { BoxSelectTree } from '@zhst/biz';
+import { boxDataSource } from './mock'
+
+interface DataNode {
+  title: string;
+  key: string;
+  isLeaf?: boolean;
+  children?: DataNode[];
+}
+
+const initTreeData: DataNode[] = [
+  { title: '盒子组1', key: '0' },
+  { title: '盒子组2', key: '1' },
+  { title: '盒子组3', key: '2', isLeaf: true },
+];
+
+/**
+ * 递归更新树结构
+ * @param list 原数组列表
+ * @param key 当前选中的项
+ * @param children 需要插入更新的数据
+ * @returns newList
+ */
+const updateTreeData = (list: DataNode[], key: React.Key, children: DataNode[]): DataNode[] =>
+  list.map((node) => {
+    if (node.key === key) {
+      return {
+        ...node,
+        children,
+      };
+    }
+    if (node.children) {
+      return {
+        ...node,
+        children: updateTreeData(node.children, key, children),
+      };
+    }
+    return node;
+  });
+
+const demo = () => {
+  const [treeData, setTreeData] = useState(initTreeData);
+  const [activeKey, setActiveKey] = useState('1')
+  const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
+
+  const onLoadData = ({ key, children }: any) =>
+    new Promise<void>((resolve) => {
+      if (children) {
+        resolve();
+        return;
+      }
+      setTimeout(() => {
+        setTreeData((origin) =>
+          updateTreeData(origin, key, [
+            { title: '盒子', key: `${key}-0` },
+            { title: '盒子', key: `${key}-1` },
+          ]),
+        );
+        resolve();
+      }, 1000);
+    });
+
+  return (
+    <div style={{ border: '1px solid #ccc', width: '340px', minHeight: '900px' }}>
+      <BoxSelectTree
+        data={treeData}
+        boxDataSource={boxDataSource}
+        showOptions={false}
+        tabsProps={{
+          activeKey,
+        }}
+        treeProps={{
+          loadData: (_params) => onLoadData(_params),
+          checkedKeys
+        }}
+      />
+    </div>
+  );
+};
+
+export default demo;
diff --git a/packages/biz/src/boxSelectTree/demo/basic.tsx b/packages/biz/src/boxSelectTree/demo/basic.tsx
index 68b5ad3..8bb399a 100644
--- a/packages/biz/src/boxSelectTree/demo/basic.tsx
+++ b/packages/biz/src/boxSelectTree/demo/basic.tsx
@@ -47,8 +47,9 @@ const demo = () => {
         onItemCheck={onTreeCheck}
         onItemSelect={e => console.log('onItemSelect', e)}
         onTabChange={val => setActiveKey(val)}
-        onBoxDelete={data => console.log('盒子删除', data)}
         onBoxBatchDelete={onBoxBatchDelete}
+        onClockClick={() => console.log('时钟点击事件')}
+        onImport={() => console.log('导入盒子')}
         tabsProps={{
           activeKey,
         }}
@@ -71,7 +72,11 @@ const demo = () => {
           value: searchVal
         }}
         treeProps={{
-          checkedKeys
+          onItemDelete: data => console.log('删除', data),
+          onItemSetting: data => console.log('配置事件', data),
+          onItemRename: (data) =>console.log('重命名', data),
+          onItemRenameFinish: async (val, data) => console.log('盒子重命名提交(返回boolean,控制弹框显示\隐藏)', val, data),
+          checkedKeys,
         }}
       />
     </div>
diff --git a/packages/biz/src/boxSelectTree/index.md b/packages/biz/src/boxSelectTree/index.md
index 6948d72..a377225 100644
--- a/packages/biz/src/boxSelectTree/index.md
+++ b/packages/biz/src/boxSelectTree/index.md
@@ -2,7 +2,7 @@
 category: Components
 title: BoxSelectTree 盒子树
 demo:
-  cols: 4
+  cols: 2
 group:
   title: 进阶组件
   order: 2
@@ -15,6 +15,7 @@ group:
 <code src="./demo/basic.tsx">基本用法</code>
 <code src="./demo/extraBtns.tsx">自定义其它按钮</code>
 <code src="./demo/noOptions.tsx">不显示其它按钮</code>
+<code src="./demo/async.tsx">异步加载数据</code>
 
 ## API
 
@@ -30,5 +31,8 @@ group:
 | onBoxDelete | 盒子删除事件 | function: (e) => void | - | - |
 | onBoxBatchDelete | 盒子批量删除事件 | function: (e) => void | - | - |
 | onCreateSubmit | 新建提交事件 | function: (e) => void | - | - |
+| onImport | 监听导入盒子点击事件 | function: () => void | - | - |
+| onClockClick | 监听时钟点击事件 | function: () => void | - | - |
+| onCreate | 监听创建点击事件 | function: () => void | 如果不传默认用自带的创建事件 | - |
 | showOptions | 展示其它功能按钮 | boolean | true | - |
 
diff --git a/packages/biz/src/boxSelectTree/index.tsx b/packages/biz/src/boxSelectTree/index.tsx
index c3e4bd4..8adaf1d 100644
--- a/packages/biz/src/boxSelectTree/index.tsx
+++ b/packages/biz/src/boxSelectTree/index.tsx
@@ -1,3 +1,5 @@
 import BoxSelectTree from './boxSelectTree';
 
+export type { BoxSelectTreeProps } from './boxSelectTree'
+
 export default BoxSelectTree;
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 8027afa..40f9252 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -1,8 +1,12 @@
 export { default as BigImageModal } from './BigImageModal'
+export type { BigImageModalProps } from './BigImageModal'
 export { default as BoxSelectTree } from './boxSelectTree'
+export type { BoxSelectTreeProps } from './boxSelectTree'
 export { default as Tree } from './tree'
-export type { TreeData } from './tree'
+export type { BoxTreeProps, TreeData } from './tree'
 export { default as TreeTransfer } from './treeTransfer'
+export type { TreeTransferProps } from './treeTransfer'
 export { default as TreeTransferModal } from './treeTransferModal'
+export type { TreeTransferModalProps } from './treeTransferModal'
 export { default as WarningRecordCard } from './WarningRecordCard'
-export type {IRecord, WarningRecordCardProps} from './WarningRecordCard'
+export type { WarningRecordCardProps, IRecord } from './WarningRecordCard'
diff --git a/packages/biz/src/tree/boxTree.tsx b/packages/biz/src/tree/boxTree.tsx
index 5461434..f769199 100644
--- a/packages/biz/src/tree/boxTree.tsx
+++ b/packages/biz/src/tree/boxTree.tsx
@@ -17,7 +17,8 @@ export interface BoxTreeProps extends TreeProps {
   onItemSelect?: TreeProps['onSelect']
   onItemSetting?: (_data: any) => void
   onItemDelete?: (_data: any) => void
-  onRenameFinish?: (_data: any, _nodeData: any) => Promise<any>
+  onItemRename?: (_nodeData: any) => void
+  onItemRenameFinish?: (_data: any, _nodeData: any) => Promise<any>
 }
 
 const boxTree: FC<BoxTreeProps> = (props) => {
@@ -29,15 +30,18 @@ const boxTree: FC<BoxTreeProps> = (props) => {
     data = [],
     showItemOption = true,
     treeCheckable = false,
-    onRenameFinish,
+    onItemRename,
+    onItemRenameFinish,
     customOptions
   } = props
   const { token } = useToken()
   const [checkedItem, setCheckedItem] = useState<React.Key>('')
 
   const cameraStatus = new Map([
-      ['0', 'success'],
-      ['1', 'error']
+      ['0', 'error'],
+      ['1', 'success'],
+      ['3', 'processing'],
+      ['4', 'default'],
     ])
 
   return (
@@ -54,7 +58,7 @@ const boxTree: FC<BoxTreeProps> = (props) => {
         return (
           <div className={`${componentName}-item-render`}>
             {/* @ts-ignore */}
-            {!_nodeData.children && _nodeData.isCamera && <Badge style={{ marginRight: '6px' }} status={cameraStatus.get('0')} />}
+            {!_nodeData.children && _nodeData.isCamera && <Badge style={{ marginRight: '6px' }} status={cameraStatus.get(_nodeData.status || '4')} />}
             <span
               // @ts-ignore
               style={(checkedItem === _nodeData.key) && _nodeData.isCamera ? {
@@ -74,14 +78,18 @@ const boxTree: FC<BoxTreeProps> = (props) => {
                       layout='horizontal'
                       labelCol={{ span: 6 }}
                       wrapperCol={{ span: 18 }}
-                      trigger={<EditOutlined />}
+                      trigger={<EditOutlined onClick={(e) => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        onItemRename?.(_nodeData)
+                      }} />}
                       submitter={{
                         searchConfig: {
                           submitText: '确定',
                           resetText: '取消',
                         },
                       }}
-                      onFinish={async (value) => onRenameFinish?.(value, _nodeData)}
+                      onFinish={async (value) => onItemRenameFinish?.(value, _nodeData)}
                     >
                       <ProFormText
                         rules={[
@@ -95,8 +103,16 @@ const boxTree: FC<BoxTreeProps> = (props) => {
                         placeholder="请输入盒子名称"
                       />
                     </ModalForm>
-                    <SettingOutlined onClick={() => onItemSetting?.(_nodeData)} />
-                    <CloseOutlined onClick={() => onItemDelete?.(_nodeData)} />
+                    <SettingOutlined onClick={(e) => {
+                      e.preventDefault();
+                      e.stopPropagation();
+                      onItemSetting?.(_nodeData)}
+                    } />
+                    <CloseOutlined onClick={(e) => {
+                      e.preventDefault();
+                      e.stopPropagation();
+                      onItemDelete?.(_nodeData)
+                    }} />
                   </>
                 )}
               </Space>
diff --git a/packages/biz/src/tree/index.tsx b/packages/biz/src/tree/index.tsx
index 1c01493..7f1277a 100644
--- a/packages/biz/src/tree/index.tsx
+++ b/packages/biz/src/tree/index.tsx
@@ -4,7 +4,13 @@ import BoxTree from './boxTree';
 export interface TreeData extends TreeDataNode {
   children?: TreeDataNode['children'] & {
     isCamera?: boolean
+    /**
+     * 0-失败  1-成功  2-进行中  3-未知
+     */
+    status?: '0' | '1' | '2' | '3'
   }[]
 }
 
+export type { BoxTreeProps } from './boxTree'
+
 export default BoxTree;
diff --git a/packages/biz/src/treeTransfer/index.tsx b/packages/biz/src/treeTransfer/index.tsx
index e912a8e..f4390fb 100644
--- a/packages/biz/src/treeTransfer/index.tsx
+++ b/packages/biz/src/treeTransfer/index.tsx
@@ -1,3 +1,7 @@
 import TreeTransfer from "./TreeTransfer";
 
+export type { TreeTransferProps } from './TreeTransfer'
+
+export * from './treeTransferHelper'
+
 export default TreeTransfer
diff --git a/packages/biz/src/treeTransferModal/index.tsx b/packages/biz/src/treeTransferModal/index.tsx
index 8feb731..b521e47 100644
--- a/packages/biz/src/treeTransferModal/index.tsx
+++ b/packages/biz/src/treeTransferModal/index.tsx
@@ -1,3 +1,5 @@
 import TreeTransferModal from './TreeTransferModal'
 
+export type { TreeTransferModalProps } from './TreeTransferModal'
+
 export default TreeTransferModal
diff --git a/packages/biz/src/useSocket/index.ts b/packages/biz/src/useSocket/index.ts
deleted file mode 100644
index bebbabd..0000000
--- a/packages/biz/src/useSocket/index.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-import { useMemo } from 'react';
-import { throttle as loadshThrottle, noop } from '@zhst/func';
-import { useDeepEffect, useLatest } from '@zhst/hooks';
-import ws from './ws';
-
-const getSelf = (v: any) => v;
-export const SocketApi = {
-  CameraTaskStatue: 'singer.DeviceService/SubScribeCameraTaskStatus',
-  DeviceStatus: 'singer.TaskManagerService/SubscribeTaskStatus',
-  SubscribeSolutionDeploy: 'singer.SolutionManagerService/SubscribeSolutionDeploy',
-  SubscribeTasksSummary: 'singer.TaskManagerService/SubscribeTasksSummary',
-  MonitorSubscribeResult: 'singer.MonitorService/MonitorSubscribeResult',
-  MonitorSubscribeStatus: 'singer.MonitorService/MonitorSubscribeStatus',
-  SubscribeArchiveGroupUpload: 'singer.ArchiveGroupService/CreateArchiveByImport',
-  SubscribeJointTask: 'singer.JointTaskService/SubscribeJointTask',
-  SubscribeGroupFragment: 'singer.VideoService/SubscribeVideoFragmentStatus', // 监听视频分片状态变化，包括新建、删除、变化
-  SubscribeGroup: 'singer.VideoService/SubscribeGroup', // 监听视频分组状态变化，列表变化也通知
-  SubscribeStreamEvent: 'singer.MediaManagerService/SubscribeStreamEvent', // 监听视频分组状态变化，列表变化也通知
-};
-type ApiKeys = keyof typeof SocketApi;
-
-export default (
-  topic: ApiKeys,
-  iterator: any = noop,
-  opt?: {
-    req?: { [key: string]: any };
-    throttle?: number;
-    parseData?: boolean;
-    beforeLoopTmp?: Function;
-    shouldBreak: boolean;
-    forceRefresh: any;
-    close?: boolean;
-  }
-) => {
-  const {
-    req = {},
-    throttle = 0,
-    beforeLoopTmp = getSelf,
-    shouldBreak = false,
-    forceRefresh,
-    close,
-  } = opt || {};
-
-  // 带上token
-  const reqstring = useMemo(() => {
-    const newReq = {
-      ...req,
-      extraHeaders: {
-        authorization: localStorage.getItem('USER-TOKEN'),
-      },
-    };
-    return JSON.stringify(newReq);
-  }, [req]);
-
-  const latestIterator = useLatest(iterator);
-  useDeepEffect(() => {
-    if (close) {
-      return;
-    }
-    //控制socket 请求发送
-    if (shouldBreak) {
-      return;
-    }
-    //去抖动
-
-    let tmpData: any = [];
-    const throttleUpdate = loadshThrottle(() => {
-      if (tmpData.length == 0) {
-        return;
-      }
-      const _tmpData = beforeLoopTmp(tmpData);
-      latestIterator.current(_tmpData); //加了throttle 数据就变成数组
-      tmpData = [];
-    }, throttle);
-
-    const unSubscribe = ws.subscribe(SocketApi[topic], reqstring, (socketData: any) => {
-      try {
-        if (!throttle) {
-          latestIterator.current(socketData);
-        } else {
-          tmpData.push(socketData);
-          throttleUpdate();
-        }
-      } catch (error) {
-        console.error('useSocke:', error);
-      }
-    });
-
-    return () => {
-      try {
-        unSubscribe();
-        throttleUpdate.cancel();
-      } catch (error) {
-        console.error(error);
-        throw error;
-      }
-    };
-  }, [topic, reqstring, shouldBreak, forceRefresh, close]);
-};
diff --git a/packages/biz/src/useSocket/onceChannel.tsx b/packages/biz/src/useSocket/onceChannel.tsx
deleted file mode 100644
index 1a488fe..0000000
--- a/packages/biz/src/useSocket/onceChannel.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-//@ts-nocheck
-import channel from './ws';
-
-const startChannel = (topic, req, callback) => {
-  // 带上token
-  let reqstring = JSON.stringify({
-    ...req,
-    extraHeaders: {
-      authorization: localStorage.getItem('USER-TOKEN'),
-    },
-  });
-
-  let unSubscribe = channel.subscribe(topic, reqstring, (socketData) => {
-    let shouldStop = callback(socketData);
-    if (shouldStop) {
-      unSubscribe?.();
-    }
-  });
-
-  return unSubscribe;
-};
-
-export default startChannel;
diff --git a/packages/biz/src/useSocket/ws.ts b/packages/biz/src/useSocket/ws.ts
deleted file mode 100644
index 8963eb1..0000000
--- a/packages/biz/src/useSocket/ws.ts
+++ /dev/null
@@ -1,222 +0,0 @@
-// @ts-nocheck
-import { v4 as uuidv4 } from 'uuid';
-import { has } from '@zhst/func';
-import io from 'socket.io-client';
-import { SOCKET_HOST } from '@common/constants';
-
-const EMITSTATE = {
-  NOT_CONNECT: 0,
-  WAITING: 1,
-  CONNECT: 2,
-};
-
-const initRetryTime = 0;
-const intervalTime = 5 * 1000; //下次重试增加时间
-const maxIntervalTime = 1 * 60 * 60 * 1000; //最大重试时间1小时
-
-class Channel {
-  /**
-   * io 实例化对象
-   */
-  ioIns;
-  /**
-   * 已存在的订阅列表
-   */
-  listeners = [
-    // {
-    //     topic: "",
-    //     req: "",
-    //     suInfo: {},
-    //     hasEmit: false,//是否已经订阅
-    //     lastRetryInterval: 0,
-    //     handles: {
-    //     }
-    // }
-  ];
-
-  /**
-   * 调试信息 记录订阅/反订阅次数
-   */
-  subscribeListenerId = [];
-  unSubscribeListenerId = [];
-
-  init = () => {
-    const ioIns = (this.ioIns = io(SOCKET_HOST, {
-      reconnection: true,
-      transports: ['websocket'],
-      forceNew: true,
-    }));
-    ioIns.on('connect', (...arg: any) => {
-      console.debug('connect', arg);
-      this.ioIns = ioIns;
-      this.listeners.forEach((v) => {
-        this.doEmit(v['topic'], v['req'], v['id']);
-      });
-    });
-
-    ioIns.on('event', (...arg: any) => {
-      console.debug('event', arg);
-    });
-
-    ioIns.on('disconnect', (...arg: any) => {
-      console.debug('disconnect', arg);
-      this.subscribeListenerId = [];
-      this.unSubscribeListenerId = [];
-    });
-
-    ioIns.on('reconnect', (...arg: any) => {
-      console.debug('reconnect', arg);
-      this.listeners.forEach((v) => {
-        v['hasEmit'] = EMITSTATE.NOT_CONNECT;
-        this.doEmit(v['topic'], v['req'], v['id']);
-      });
-    });
-  };
-
-  retry = (listener: { [x: string]: any; lastRetryInterval: number | undefined; intervalId: NodeJS.Timeout; } | undefined) => {
-    //重试逻辑
-    const intervalId = setTimeout(() => {
-      const hasExit = this.listeners.find(
-        (v) => v['topic'] === listener?.['topic'] && v['req'] === listener['req']
-      );
-      if (!hasExit) return;
-      listener['hasEmit'] = EMITSTATE.NOT_CONNECT;
-      this.doEmit(listener['topic'], listener['req'], listener['id']);
-    }, listener.lastRetryInterval);
-
-    listener.intervalId = intervalId;
-    listener.lastRetryInterval =
-      intervalTime + listener.lastRetryInterval > maxIntervalTime
-        ? maxIntervalTime
-        : intervalTime + listener.lastRetryInterval;
-  };
-
-  doEmit = (topic, req, listenerId) => {
-    if (!this.ioIns) {
-      this.init();
-    }
-    //订阅过就不订阅了
-    const hasEmit = this.listeners.find(
-      (v) => v['topic'] === topic && v['req'] === req && v['hasEmit'] !== EMITSTATE.NOT_CONNECT
-    );
-    if (hasEmit) {
-      return;
-    }
-    const listener = this.listeners.find((v) => v['topic'] === topic && v['req'] === req);
-    listener['hasEmit'] = EMITSTATE.WAITING;
-
-    this.ioIns?.emit?.(topic, req, (data) => {
-      console.info('emit', topic, req, data);
-      const suInfo = JSON.parse(data);
-      if (has(suInfo, 'Error.code')) {
-        if (suInfo.Error.code === 500) {
-          //后端出错
-          this.retry(listener);
-        }
-        return;
-      }
-      // console.debug('SUBSCRIBE', listenerId, topic, req, suInfo);
-      this.subscribeListenerId.push(listenerId);
-      // debugger
-      //重新找一遍topic
-      const currentTopicIndex = this.listeners.findIndex(
-        (v) => v['topic'] === topic && v['req'] === req && v['id'] === listenerId
-      );
-      if (currentTopicIndex == -1) {
-        // 不存在说明listener取消了 直接反订阅
-        this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), (data) => {
-          this.unSubscribeListenerId.push(listenerId);
-          console.debug('UNSUBSCRIBE', listenerId, topic, req, data);
-        });
-        return;
-      }
-      if (!suInfo['SubscribeID']) {
-        this.listeners.splice(currentTopicIndex, 0);
-      } else {
-        this.listeners[currentTopicIndex]['suInfo'] = suInfo;
-        this.listeners[currentTopicIndex]['hasEmit'] = EMITSTATE.CONNECT;
-      }
-
-      this.ioIns?.on?.(suInfo['SubscribeID'], (data) => {
-        console.info('on', suInfo['SubscribeID'], data);
-        try {
-          const socketData = JSON.parse(data);
-          if (has(socketData, 'Error.code')) {
-            if (socketData.Error.code === 500) {
-              //后端出错
-              this.retry(listener);
-            }
-            return;
-          }
-          const { handles = {} } =
-            this.listeners.find((v) => v['topic'] === topic && v['req'] === req) || {};
-          Object.keys(handles).forEach((key) => {
-            try {
-              //后面观察 为什么delete后在foreach
-              const func = handles[key];
-              if (!func) return;
-              func(socketData);
-            } catch (error) {
-              console.error(error);
-            }
-          });
-        } catch (error) {
-          console.debug('error', error);
-        }
-      });
-    });
-  };
-
-  subscribe(topic, req, handle) {
-    const handleId = uuidv4();
-    const listenerId = uuidv4();
-    const listener = this.listeners.find((v) => v['topic'] === topic && v['req'] === req);
-    if (listener) {
-      listener['handles'][handleId] = handle;
-    } else {
-      this.listeners.push({
-        topic: topic,
-        req: req,
-        suInfo: {},
-        id: listenerId,
-        hasEmit: EMITSTATE.NOT_CONNECT,
-        lastRetryInterval: initRetryTime,
-        handles: {
-          [`${handleId}`]: handle,
-        },
-      });
-      //未注册过 则去订阅
-      this.doEmit(topic, req, listenerId);
-    }
-    return this.unSubscribe.bind(this, topic, req, handleId, listenerId);
-  }
-
-  unSubscribe(topic, req, handleId, listenerId) {
-    const listener = this.listeners.find(
-      (v) => v['topic'] === topic && v['req'] === req && v['id'] === listenerId
-    );
-    const { handles = {}, suInfo } = listener || {};
-    if (handles[handleId]) {
-      delete handles[handleId];
-      //如果没有其他订阅就删除
-      if (Object.keys(handles).length === 0) {
-        if (this.intervalId) {
-          clearTimeout(this.intervalId);
-        }
-        if (listener['hasEmit'] === EMITSTATE['CONNECT']) {
-          this.ioIns.emit('UnSubscribe', JSON.stringify(suInfo), (data) => {
-            this.unSubscribeListenerId.push(listenerId);
-            console.debug('UNSUBSCRIBE', listener['id'], topic, req, data);
-          });
-        }
-        this.listeners = this.listeners.filter((v) => !(v['topic'] === topic && v['req'] === req));
-      }
-    }
-  }
-}
-//单例
-const channelIns = new Channel();
-//暴露实例 调试用
-window.__channel__ = channelIns;
-
-export default channelIns;
diff --git a/packages/func/CHANGELOG.md b/packages/func/CHANGELOG.md
index 59c8fb8..6859c83 100644
--- a/packages/func/CHANGELOG.md
+++ b/packages/func/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @zhst/utils
 
+## 0.7.4
+
+### Patch Changes
+
+- 新增 tree 组件的监听事件,优化 meta 全选的回调事件监听
+- Updated dependencies
+  - @zhst/request@0.8.3
+
 ## 0.7.3
 
 ### Patch Changes
diff --git a/packages/func/package.json b/packages/func/package.json
index bdc04b2..a6a8980 100644
--- a/packages/func/package.json
+++ b/packages/func/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/func",
-  "version": "0.7.3",
+  "version": "0.7.4",
   "description": "函数合集",
   "keywords": [
     "hooks"
diff --git a/packages/func/src/math/index.ts b/packages/func/src/math/index.ts
index 0d41326..398ecf2 100644
--- a/packages/func/src/math/index.ts
+++ b/packages/func/src/math/index.ts
@@ -240,128 +240,3 @@ export const getRotateImg = (image: HTMLImageElement, rotate: number) => {
   commonCanvas.parentNode?.removeChild(commonCanvas);
   return file;
 };
-
-/**
- *  格式化工具
- * @param originData
- * @returns
- */
-export const getOdRect = (originData: IOdRectOrigin) => {
-  let data = get(originData, 'objects', [])
-    .filter((v: any) => !isNull(get(v, 'infoOnSource.bboxInFrame.bboxRatio')))
-    .map((v: any, index: any) => {
-      // objectId==0 特征没有提取到过滤1掉
-      const rect = get(v, 'infoOnSource.bboxInFrame.bboxRatio');
-      const extendBox = get(v, 'infoOnSource.bboxInFrame.extendBoxRatio');
-      const frameTimestamp = get(v, 'timestamp'); //时间戳创建档案的时候需要
-      const qualityScore = get(v, 'qualityScore');
-      const algorithmVersion =
-        get(v, 'objectType') === 'OBJECT_TYPE_PEDESTRAIN'
-          ? 'VERSION_REID_HEAD_ATTR'
-          : get(v, 'objectType') === 'OBJECT_TYPE_FACE'
-          ? 'VERSION_FACE'
-          : 'VERSION_REID_HEAD_ATTR';
-      const featureData = get(v, 'feature', []).filter(
-        (v: any) => v.type === 'FEATURE_TYPE_BYTE'
-      );
-      const objectRectIndex = algorithmVersion === 'VERSION_FACE' ? 0 : 1;
-      const objectType = get(v, 'objectType');
-      const objectId = get(v, 'objectIndex.objectId');
-      const sourceObjectId = get(v, 'sourceObjectId');
-      return {
-        x: rect.x,
-        y: rect.y,
-        w: rect.w,
-        h: rect.h,
-        // faceCorrectImage: faceCorrectImage,
-        id: index,
-        qualityScore: qualityScore,
-        algorithmVersion: algorithmVersion,
-        featureData: get(featureData, '0.featureByte'),
-        objectRectIndex: objectRectIndex,
-        objectType: objectType,
-        objectId: objectId,
-        frameTimestamp: frameTimestamp,
-        sourceObjectId: sourceObjectId,
-        extendBox: extendBox,
-      };
-    });
-  if (data.length > 0) {
-    data = data.filter((v: { objectId: string; }) => v.objectId !== '0');
-  } else {
-    throw new Error('empty');
-  }
-  return data;
-};
-
-//档案库od
-export const getOdRectV2 = (originData: { odv2Result: any[]; }) => {
-  const resp = originData.odv2Result[0];
-  const subObjects: { x: any; y: any; w: any; h: any; id: any; qualityScore: any; algorithmVersion: any; featrueData: any; objectRectIndex: number; objectType: any; objectId: any; }[] = []; //形体
-  const data = get(resp, 'objects', [])
-    .filter((v: any) => !isNull(get(v, 'subObjects[0].infoOnSource.bboxInFrame.bboxRatio')))
-    .map((v: any, index: any) => {
-      const rect = get(v, 'infoOnSource.bboxInFrame.bboxRatio');
-      const qualityScore = get(v, 'qualityScore');
-      const algorithmVersion = get(v, 'objectType');
-      const featrueData = get(v, 'feature', []).filter(
-        (v: { name: string; }) => v.name === 'feature-body' || v.name === 'feature-face'
-      );
-      const objectRectIndex = algorithmVersion === 'OBJECT_TYPE_FACE' ? 0 : 1;
-      const objectType = get(v, 'objectType');
-      const objectId = get(v, 'objectIndex.objectId');
-      //如果存在subObjects的数组不为null表示形体里面带人脸，人脸的od框也要显示出来
-      if (get(v, 'subObjects', []).length) {
-        get(v, 'subObjects', []).forEach((e: any) => {
-          const rect = get(e, 'infoOnSource.bboxInFrame.bboxRatio');
-          const qualityScore = get(e, 'qualityScore');
-          const algorithmVersion = get(e, 'objectType');
-          const featrueData = get(e, 'feature', []).filter(
-            (v: { name: string; }) => v.name === 'feature-body' || v.name === 'feature-face'
-          );
-          const objectRectIndex = algorithmVersion === 'OBJECT_TYPE_FACE' ? 0 : 1;
-          const objectType = get(e, 'objectType');
-          const objectId = get(e, 'objectIndex.objectId');
-          subObjects.push({
-            x: rect.x,
-            y: rect.y,
-            w: rect.w,
-            h: rect.h,
-            id: index,
-            qualityScore: qualityScore,
-            algorithmVersion: algorithmVersion,
-            featrueData: featrueData.length ? featrueData[0].featureByte : '',
-            objectRectIndex: objectRectIndex,
-            objectType: objectType,
-            objectId,
-          });
-        });
-      }
-      return {
-        x: rect.x,
-        y: rect.y,
-        w: rect.w,
-        h: rect.h,
-        id: index,
-        qualityScore: qualityScore,
-        algorithmVersion: algorithmVersion,
-        featrueData: featrueData[0].featureByte,
-        objectRectIndex: objectRectIndex,
-        objectType: objectType,
-        objectId: objectId,
-      };
-    });
-  const brr = data.concat(subObjects).map((v: { id: any; }, vs: any) => {
-    if (String(v.id)) {
-      v.id = vs;
-    }
-    return v;
-  });
-  if (brr.length > 0) {
-    console.log(brr, 'data111');
-  } else {
-    throw new Error('empty');
-  }
-  console.log(brr);
-  return brr;
-};
diff --git a/packages/hooks/CHANGELOG.md b/packages/hooks/CHANGELOG.md
index d7179a6..8ef5dbb 100644
--- a/packages/hooks/CHANGELOG.md
+++ b/packages/hooks/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @zhst/hooks
 
+## 0.8.3
+
+### Patch Changes
+
+- 新增 tree 组件的监听事件,优化 meta 全选的回调事件监听
+- Updated dependencies
+  - @zhst/func@0.7.4
+
 ## 0.8.2
 
 ### Patch Changes
diff --git a/packages/hooks/package.json b/packages/hooks/package.json
index b03af6a..e66f7c4 100644
--- a/packages/hooks/package.json
+++ b/packages/hooks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/hooks",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "hooks合集",
   "keywords": [
     "hooks"
diff --git a/packages/meta/CHANGELOG.md b/packages/meta/CHANGELOG.md
index 6e48ef1..4ff7367 100644
--- a/packages/meta/CHANGELOG.md
+++ b/packages/meta/CHANGELOG.md
@@ -1,5 +1,15 @@
 # @zhst/utils
 
+## 0.8.4
+
+### Patch Changes
+
+- 新增 tree 组件的监听事件,优化 meta 全选的回调事件监听
+- Updated dependencies
+  - @zhst/hooks@0.8.3
+  - @zhst/func@0.7.4
+  - @zhst/meta@0.8.4
+
 ## 0.8.3
 
 ### Patch Changes
diff --git a/packages/meta/package.json b/packages/meta/package.json
index ca3c72e..39b65d7 100644
--- a/packages/meta/package.json
+++ b/packages/meta/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/meta",
-  "version": "0.8.3",
+  "version": "0.8.4",
   "description": "原子组件",
   "keywords": [
     "meta",
diff --git a/packages/meta/src/BigImagePreview/BigImagePreview.tsx b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
index a10cb74..30cefc8 100644
--- a/packages/meta/src/BigImagePreview/BigImagePreview.tsx
+++ b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
@@ -7,7 +7,6 @@ import {
   isNull,
   generateImg,
   dataURLToBlob,
-  getOdRect,
   getExtendRect,
   getTransformRect,
   getRotateImg,
@@ -17,7 +16,7 @@ import {
 } from '@zhst/func';
 import Align from 'rc-align';
 import { Button, Empty } from '..';
-import { type Rect, type IScreenshotButtonProp, type AlignType, type IOdRectOrigin } from '@zhst/types'
+import { type Rect, type IScreenshotButtonProp, type AlignType } from '@zhst/types'
 import Icon from '../iconfont';
 import {
   Cropper,
@@ -30,10 +29,10 @@ import {
 import BtnGroup from './components/BtnGroup';
 import './index.less'
 import { defaultAlignOption, CROP_TYPE } from '../utils/constants'
+import { getOdRect, IOdObject } from './bigImagePreviewHelper'
 
 const componentName = `zhst-image__img-view`;
 
-
 export interface ViewOption {
   /* 图片url */
   image?: string | HTMLImageElement;
@@ -67,7 +66,7 @@ export interface ImgViewProps extends React.HTMLAttributes<HTMLElement> {
     attachImg?: Array<{ label: string; url: string }>;    // 缩略图列表
     odRect?: Rect
     score?: number
-    objects?: IOdRectOrigin[]    //  图片人物框选
+    objects?: IOdObject
   }
   showAttachImgLabel?: boolean;          // 是否显示缩略图
   showOpt?: boolean; // 是否显示操作面板
@@ -77,6 +76,7 @@ export interface ImgViewProps extends React.HTMLAttributes<HTMLElement> {
   screenshotButtonAlign?: AlignType;
   screenshotButtonRender?: (screenshotButtonProp: IScreenshotButtonProp) => ReactElement;
   hideLeftTopBtn?: boolean;
+  onRectSelect?: (obj: IOdObject) => void
   showScore?: boolean // 是否显示相似度
   viewOption?: ViewOption;
 }
@@ -127,12 +127,12 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
   const {
     width,
     height,
-    showScore = true,
+    showScore = false,
     data,
     showOpt = false,
     showAttachImgLabel = true,
     screenshotButtonAlign = defaultAlignOption,
-    screenshotButtonRender = () => <div style={{ color: '#fff' }}>回调DOM</div>,
+    screenshotButtonRender = () => <div style={{ color: '#fff', width: '80px', top: 0 }}>回调DOM</div>,
     hideLeftTopBtn = true,
     viewOption = {}
   } = props;
@@ -144,18 +144,13 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
     objects = [],
   } = data
   const imgContainerRef = React.useRef(null);
-  const [isReady, setIsReady] = useState(false);
 
-  const init = useCallback(($container: null) => {
-    imgContainerRef.current = $container;
-    setIsReady(true);
-  }, []);
   // ============================= viewer  =========================
   const imgInsRef = useRef<any>(null);
   const [isImgReady, setIsImgReady] = useState(false);
 
   useEffect(() => {
-    if (!isReady || !imgContainerRef?.current) return;
+    if (!imgContainerRef?.current) return;
     const handleReady = addEventListenerWrapper(imgContainerRef.current, EVENT_VIEWER_READY, () => {
       setIsImgReady(true);
     });
@@ -176,7 +171,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
       imgInsRef?.current?.destroy?.();
       imgInsRef.current = null;
     };
-  }, [isReady, imageKey]);
+  }, [imageKey]);
 
   // ============================= viewer操作按钮 =========================
   const handleOptClick = (v: string) => {
@@ -227,7 +222,8 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
     };
   }, [isImgReady, showCrop, cropType, imageKey]);
 
-  const initData = (_objects: IOdRectOrigin[]) => {
+  // 初始化页面的绘制矩形
+  const initData = (_objects: IOdObject | never[]) => {
     const imgIns = imgInsRef.current;
     const _odRect = odRect
     //清理crop
@@ -301,12 +297,15 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
       handlerCropEndRef.current = addEventListenerWrapper(imgContainerRef.current, EVENT_CROP_END, (event: { detail: any; }) => {
         const data = event.detail;
         setSelectAlgorithmVersion(null);
-        setCropRect({
+        const _rect = {
           x: data.left,
           y: data.top,
           w: data.width,
           h: data.height,
-        });
+        }
+        setCropRect(_rect);
+        const p = getCropInfo({ type: cropType, rect: _rect })
+        console.log('p', p)
         alignRef?.current?.forceAlign?.();
       });
       cropInsRef.current = new Cropper(imgContainerRef.current, {
@@ -317,11 +316,10 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
   }
 
   //  获取框选的截图框信息
-  const latestCropType = useLatest(cropType);
-  const latestCropRect = useLatest(cropRect);
-  const getCropInfo = async (cb: (data: any) => void) => {
-    const cropType = latestCropType.current;
-    const cropRect = latestCropRect.current;
+  const getCropInfo = async (opt: { type: string; rect: Rect }) => {
+    const { type, rect } = opt
+    const cropType = type;
+    const cropRect = rect;
     const imgIns = imgInsRef.current;
     const transform = imgIns.targetTransform;
     let newImgKey = imageKey;
@@ -398,8 +396,15 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
         rectList[index] = newRect;
       })
     );
-    cb?.({ rectList, extendRectList, selectIndex, imgKey: newImgKey })
-    return { rectList, extendRectList, selectIndex, imgKey: newImgKey };
+
+    let data = {
+      rectList,
+      extendRectList,
+      selectIndex,
+      imgKey: newImgKey
+    }
+
+    return data;
   };
 
   // 操作界面判断
@@ -421,22 +426,12 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
   const [selectAttachImgIndex, setSelectAttachImgIndex] = useState(0);
   const [isZoomin, setIsZoomin] = useState(false);
 
-  /**
-   * 修改当前图片预览下标
-   * @param diff 跳转强度 正向后翻、负值向前翻
-   */
-  const handleChangeIndex = (cb?: () => void) => {
-    if (!imageKey) return
-    cb?.()
-  }
-
   // ============================== Ref ===============================
   useImperativeHandle(ref, () => ({
     imgInsRef,
     setShowCrop,
     initData,
     getCropInfo,
-    handleChangeIndex
   }));
 
   return (
@@ -449,7 +444,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
               `${componentName}-main`,
               cropType === CROP_TYPE['AUTO'] && `${componentName}-main--cursor`
             )}
-            ref={init}
+            ref={imgContainerRef}
           />
           {/* 图片操作 */}
           {!hideLeftTopBtn && (
@@ -562,7 +557,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
               />
             </div>
           )}
-          {showScore && <div
+          {(showScore || score) && <div
             style={{ bottom: 20 }}
             className={classNames(`${componentName}__face-score`)}
           >
diff --git a/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts b/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
index e69de29..bdc6992 100644
--- a/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
+++ b/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
@@ -0,0 +1,58 @@
+import { get, isNull } from "@zhst/func";
+import { ObjectType, Rect } from "@zhst/types";
+
+export interface IOdObject {
+  objects: {
+    bboxRatio: Rect
+    timestamp?: string
+    qualityScore?: string
+    extendBoxRatio?: any
+    objectType?: ObjectType
+    objectIndex?: {
+      objectId: string
+    }
+    sourceObjectId?: string
+  }[]
+}
+
+/**
+ *  格式化工具
+ * @param originData
+ * @returns
+ */
+export const getOdRect = (originData: IOdObject) => {
+  let data = get(originData, 'objects', [])
+    .filter((v: any) => !isNull(get(v, 'bboxRatio')) || get(v, 'objectIndex.objectId') !== '0' )
+    .map((v: any, index: any) => {
+      const rect = get(v, 'bboxRatio');
+      const extendBox = get(v, 'extendBoxRatio');
+      const frameTimestamp = get(v, 'timestamp'); //时间戳创建档案的时候需要
+      const qualityScore = get(v, 'qualityScore');
+      const algorithmVersion =
+        get(v, 'objectType') === 'OBJECT_TYPE_PEDESTRAIN'
+          ? 'VERSION_REID_HEAD_ATTR'
+          : get(v, 'objectType') === 'OBJECT_TYPE_FACE'
+          ? 'VERSION_FACE'
+          : 'VERSION_REID_HEAD_ATTR';
+      const objectRectIndex = algorithmVersion === 'VERSION_FACE' ? 0 : 1;
+      const objectType = get(v, 'objectType');
+      const objectId = get(v, 'objectIndex.objectId');
+      const sourceObjectId = get(v, 'sourceObjectId');
+      return {
+        x: rect.x,
+        y: rect.y,
+        w: rect.w,
+        h: rect.h,
+        id: index,
+        qualityScore,
+        algorithmVersion,
+        objectRectIndex,
+        objectType,
+        objectId,
+        frameTimestamp,
+        sourceObjectId,
+        extendBox,
+      };
+    });
+  return data;
+};
diff --git a/packages/meta/src/BigImagePreview/demo/base.tsx b/packages/meta/src/BigImagePreview/demo/base.tsx
index d08f1ca..2b1181b 100644
--- a/packages/meta/src/BigImagePreview/demo/base.tsx
+++ b/packages/meta/src/BigImagePreview/demo/base.tsx
@@ -25,28 +25,20 @@ const props = {
       time: '2022-01-01', // 摄像头拍摄时间
       objects: [
         {
-            "infoOnSource": {
-                "bboxInFrame": {
-                    "bboxRatio": {
-                        "x": 0.5519352,
-                        "y": 0.2965385,
-                        "w": 0.05185461,
-                        "h": 0.24698898
-                    },
-                },
-            },
+          "bboxRatio": {
+              "x": 0.5519352,
+              "y": 0.2965385,
+              "w": 0.05185461,
+              "h": 0.24698898
+          },
         },
         {
-            "infoOnSource": {
-                "bboxInFrame": {
-                    "bboxRatio": {
-                        "x": 0.58543766,
-                        "y": 0.3203356,
-                        "w": 0.052037954,
-                        "h": 0.2664015
-                    },
-                },
-            },
+          "bboxRatio": {
+              "x": 0.58543766,
+              "y": 0.3203356,
+              "w": 0.052037954,
+              "h": 0.2664015
+          },
         },
     ]
   }
diff --git a/packages/meta/src/BigImagePreview/demo/noAttach.tsx b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
new file mode 100644
index 0000000..b75fb7b
--- /dev/null
+++ b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
@@ -0,0 +1,43 @@
+
+import React, { useRef } from 'react';
+import { Button, Space } from '@zhst/meta'
+import { BigImagePreview } from '@zhst/meta'
+
+
+const props = {
+  heigth: '500px',
+  data: {
+      imageKey: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
+      odRect:{
+        "x":0.553125,"y":0.29722223,"w":0.048958335,"h":0.2462963
+      },
+      cameraPosition: 'string', // 摄像头位置
+      time: '2022-01-01', // 摄像头拍摄时间
+      objects: [
+        {
+          "bboxRatio": {
+              "x": 0.5519352,
+              "y": 0.2965385,
+              "w": 0.05185461,
+              "h": 0.24698898
+          },
+        },
+    ]
+  },
+  onRectSelect: data => console.log('data', data)
+}
+
+export default () => {
+  const imgRef = useRef(null)
+
+  return (
+    <Space size={[8, 16]} direction="vertical">
+      <BigImagePreview {...props} ref={imgRef} />
+      <Space>
+        <Button type="primary" onClick={() => imgRef.current?.setShowCrop(true)}>编辑</Button>
+        <Button onClick={() => imgRef.current?.handleChangeIndex(1)}>下一张</Button>
+        <Button onClick={() => imgRef.current?.setShowCrop(false)}>取消</Button>
+      </Space>
+    </Space>
+  )
+}
diff --git a/packages/meta/src/BigImagePreview/index.less b/packages/meta/src/BigImagePreview/index.less
index 829ebe1..7c8f030 100644
--- a/packages/meta/src/BigImagePreview/index.less
+++ b/packages/meta/src/BigImagePreview/index.less
@@ -2,6 +2,7 @@
   position: relative;
   width: calc(100%);
   height: 100%;
+  font-size: 0;
 
   &__face-score {
     position: absolute;
@@ -62,14 +63,9 @@
     height: 202px;
     transition: all 200ms;
 
-    &--fixed {
-    }
 
     &--zoomin {
       height: 100%;
-
-      &--fixed {
-      }
     }
 
     &__tab {
diff --git a/packages/meta/src/BigImagePreview/index.md b/packages/meta/src/BigImagePreview/index.md
index 84dd881..8e07732 100644
--- a/packages/meta/src/BigImagePreview/index.md
+++ b/packages/meta/src/BigImagePreview/index.md
@@ -8,6 +8,7 @@ title: BigImagePreview 大图预览组件
 # BigImagePreview 大图预览组件
 
 <code src="./demo/base.tsx">基本</code>
+<code src="./demo/noAttach.tsx">不展示小图</code>
 
 ## API
 
diff --git a/packages/meta/src/VideoPlayer/VideoPlayer.tsx b/packages/meta/src/VideoPlayer/VideoPlayer.tsx
index f6d06af..56ddf4d 100644
--- a/packages/meta/src/VideoPlayer/VideoPlayer.tsx
+++ b/packages/meta/src/VideoPlayer/VideoPlayer.tsx
@@ -63,7 +63,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
         adjustY: true,
       },
     },
-    screenshotButtonRender = () => <div style={{ color: '#fff' }}>回调DOM</div>,
+    screenshotButtonRender = () => <div style={{ color: '#fff', width: '80px', top: 0 }}>回调DOM</div>,
     onCropChange,
     defautlNormalizationRect: defaultNormalizationRect,
   } = props;
diff --git a/packages/request/CHANGELOG.md b/packages/request/CHANGELOG.md
index a3744cf..0cf2e9f 100644
--- a/packages/request/CHANGELOG.md
+++ b/packages/request/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @zhst/request
 
+## 0.8.3
+
+### Patch Changes
+
+- 新增 tree 组件的监听事件,优化 meta 全选的回调事件监听
+
 ## 0.8.2
 
 ### Patch Changes
diff --git a/packages/request/package.json b/packages/request/package.json
index 0d9878f..009afad 100644
--- a/packages/request/package.json
+++ b/packages/request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/request",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "请求库",
   "keywords": [
     "request",

From 572876c585d071ab0e53c1de9f86f18bf8fee913 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E5=BF=97=E9=9B=84?= <jiangzhixiong@smartvision.cn>
Date: Thu, 14 Mar 2024 10:47:05 +0800
Subject: [PATCH 23/24] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9biz=E7=9B=92?=
 =?UTF-8?q?=E5=AD=90=E6=A0=91=E7=BB=84=E4=BB=B6=E6=A0=A1=E9=AA=8C=E8=A7=84?=
 =?UTF-8?q?=E5=88=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .dumirc.ts                                    |   2 -
 packages/biz/CHANGELOG.md                     |  14 +
 packages/biz/es/index.d.ts                    |   7 +-
 packages/biz/es/index.js                      |   5 +-
 packages/biz/lib/index.d.ts                   |   7 +-
 packages/biz/lib/index.js                     |  15 +-
 packages/biz/package.json                     |   2 +-
 .../components/boxPanel/index.tsx             |   6 +
 .../biz/src/boxSelectTree/demo/extraBtns.tsx  |   1 -
 packages/biz/src/index.tsx                    |   1 -
 packages/func/CHANGELOG.md                    |   7 +
 packages/func/es/math/index.js                | 359 +-----------------
 packages/func/package.json                    |   2 +-
 packages/func/src/math/index.ts               | 243 +-----------
 packages/hooks/CHANGELOG.md                   |   6 +
 packages/hooks/package.json                   |   2 +-
 packages/meta/CHANGELOG.md                    |   8 +
 packages/meta/package.json                    |   2 +-
 .../src/BigImagePreview/BigImagePreview.tsx   |  34 +-
 .../BigImagePreview/bigImagePreviewHelper.ts  | 244 +++++++++++-
 .../src/BigImagePreview/demo/noAttach.tsx     |  12 +-
 packages/request/CHANGELOG.md                 |   6 +
 packages/request/package.json                 |   2 +-
 23 files changed, 350 insertions(+), 637 deletions(-)

diff --git a/.dumirc.ts b/.dumirc.ts
index 36d1e9e..9de9ea5 100644
--- a/.dumirc.ts
+++ b/.dumirc.ts
@@ -1,8 +1,6 @@
 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'],
diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index a5f4767..c999c2d 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,19 @@
 # @zhst/biz
 
+## 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 组件,优化盒子树创建弹框规则校验
+
 ## 0.9.6
 
 ### Patch Changes
diff --git a/packages/biz/es/index.d.ts b/packages/biz/es/index.d.ts
index f170490..743bed4 100644
--- a/packages/biz/es/index.d.ts
+++ b/packages/biz/es/index.d.ts
@@ -9,4 +9,9 @@ export type { TreeTransferProps } from './treeTransfer';
 export { default as TreeTransferModal } from './treeTransferModal';
 export type { TreeTransferModalProps } from './treeTransferModal';
 export { default as WarningRecordCard } from './WarningRecordCard';
-export type { WarningRecordCardProps, IRecord } from './WarningRecordCard';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
+export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewLargerImageModal';
+export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal';
+export type { VideoPlayerCardProps } from './VideoPlayerCard';
+export { default as VideoPlayerCard } from './VideoPlayerCard';
+export { default as RealTimeMonitor } from './RealTimeMonitor';
diff --git a/packages/biz/es/index.js b/packages/biz/es/index.js
index 7e9350e..d340720 100644
--- a/packages/biz/es/index.js
+++ b/packages/biz/es/index.js
@@ -3,4 +3,7 @@ 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";
\ No newline at end of file
+export { default as WarningRecordCard } from "./WarningRecordCard";
+export { default as ViewLargerImageModal, useViewLargerImageModal } from "./ViewLargerImageModal";
+export { default as VideoPlayerCard } from "./VideoPlayerCard";
+export { default as RealTimeMonitor } from "./RealTimeMonitor";
\ No newline at end of file
diff --git a/packages/biz/lib/index.d.ts b/packages/biz/lib/index.d.ts
index f170490..743bed4 100644
--- a/packages/biz/lib/index.d.ts
+++ b/packages/biz/lib/index.d.ts
@@ -9,4 +9,9 @@ export type { TreeTransferProps } from './treeTransfer';
 export { default as TreeTransferModal } from './treeTransferModal';
 export type { TreeTransferModalProps } from './treeTransferModal';
 export { default as WarningRecordCard } from './WarningRecordCard';
-export type { WarningRecordCardProps, IRecord } from './WarningRecordCard';
+export type { IRecord, WarningRecordCardProps } from './WarningRecordCard';
+export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewLargerImageModal';
+export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal';
+export type { VideoPlayerCardProps } from './VideoPlayerCard';
+export { default as VideoPlayerCard } from './VideoPlayerCard';
+export { default as RealTimeMonitor } from './RealTimeMonitor';
diff --git a/packages/biz/lib/index.js b/packages/biz/lib/index.js
index 82e9b73..435cd59 100644
--- a/packages/biz/lib/index.js
+++ b/packages/biz/lib/index.js
@@ -31,10 +31,14 @@ var src_exports = {};
 __export(src_exports, {
   BigImageModal: () => import_BigImageModal.default,
   BoxSelectTree: () => import_boxSelectTree.default,
+  RealTimeMonitor: () => import_RealTimeMonitor.default,
   Tree: () => import_tree.default,
   TreeTransfer: () => import_treeTransfer.default,
   TreeTransferModal: () => import_treeTransferModal.default,
-  WarningRecordCard: () => import_WarningRecordCard.default
+  VideoPlayerCard: () => import_VideoPlayerCard.default,
+  ViewLargerImageModal: () => import_ViewLargerImageModal.default,
+  WarningRecordCard: () => import_WarningRecordCard.default,
+  useViewLargerImageModal: () => import_ViewLargerImageModal.useViewLargerImageModal
 });
 module.exports = __toCommonJS(src_exports);
 var import_BigImageModal = __toESM(require("./BigImageModal"));
@@ -43,12 +47,19 @@ var import_tree = __toESM(require("./tree"));
 var import_treeTransfer = __toESM(require("./treeTransfer"));
 var import_treeTransferModal = __toESM(require("./treeTransferModal"));
 var import_WarningRecordCard = __toESM(require("./WarningRecordCard"));
+var import_ViewLargerImageModal = __toESM(require("./ViewLargerImageModal"));
+var import_VideoPlayerCard = __toESM(require("./VideoPlayerCard"));
+var import_RealTimeMonitor = __toESM(require("./RealTimeMonitor"));
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   BigImageModal,
   BoxSelectTree,
+  RealTimeMonitor,
   Tree,
   TreeTransfer,
   TreeTransferModal,
-  WarningRecordCard
+  VideoPlayerCard,
+  ViewLargerImageModal,
+  WarningRecordCard,
+  useViewLargerImageModal
 });
diff --git a/packages/biz/package.json b/packages/biz/package.json
index a4e27f2..d78ea3e 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.9.6",
+  "version": "0.9.8",
   "description": "业务库",
   "keywords": [
     "business",
diff --git a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
index bf62d74..2699227 100644
--- a/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
+++ b/packages/biz/src/boxSelectTree/components/boxPanel/index.tsx
@@ -164,8 +164,14 @@ const BoxPanel: FC<BoxPanelProps> = (props) => {
                       rules={[
                         {
                           required: true,
+                          max: 20,
                         },
+                        {
+                          pattern: /^[^\s]*$/g,
+                          message: '禁止输入空格'
+                        }
                       ]}
+                      fieldProps={{ showCount: true }}
                       width="md"
                       name="name"
                       label="盒子组名称"
diff --git a/packages/biz/src/boxSelectTree/demo/extraBtns.tsx b/packages/biz/src/boxSelectTree/demo/extraBtns.tsx
index e398407..d889b8b 100644
--- a/packages/biz/src/boxSelectTree/demo/extraBtns.tsx
+++ b/packages/biz/src/boxSelectTree/demo/extraBtns.tsx
@@ -7,7 +7,6 @@ const demo = () => {
   const [activeKey, setActiveKey] = useState('1')
   const [checkedKeys, setCheckedKeys] = useState<string[]>([]);
 
-
   return (
     <div style={{ border: '1px solid #ccc', width: '340px', minHeight: '900px' }}>
       <BoxSelectTree
diff --git a/packages/biz/src/index.tsx b/packages/biz/src/index.tsx
index 88f3a1c..2685d54 100644
--- a/packages/biz/src/index.tsx
+++ b/packages/biz/src/index.tsx
@@ -9,7 +9,6 @@ export type { TreeTransferProps } from './treeTransfer'
 export { default as TreeTransferModal } from './treeTransferModal'
 export type { TreeTransferModalProps } from './treeTransferModal'
 export { default as WarningRecordCard } from './WarningRecordCard'
-export type { WarningRecordCardProps, IRecord } from './WarningRecordCard'
 export type { IRecord, WarningRecordCardProps } from './WarningRecordCard'
 export type { ViewLargerImageModalRef, ViewLargerImageModalProps } from './ViewLargerImageModal'
 export { default as ViewLargerImageModal, useViewLargerImageModal } from './ViewLargerImageModal'
diff --git a/packages/func/CHANGELOG.md b/packages/func/CHANGELOG.md
index 6859c83..dc0e051 100644
--- a/packages/func/CHANGELOG.md
+++ b/packages/func/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @zhst/utils
 
+## 0.7.5
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/request@0.8.4
+
 ## 0.7.4
 
 ### Patch Changes
diff --git a/packages/func/es/math/index.js b/packages/func/es/math/index.js
index d9d6d04..7c645e4 100644
--- a/packages/func/es/math/index.js
+++ b/packages/func/es/math/index.js
@@ -1,358 +1 @@
-var _ALGORITHM_VERSION;
-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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-import { cloneDeep, get, isNull } from 'lodash-es';
-import { dataURLToBlob } from "../file";
-var proto = {
-  Common: {
-    AlgorithmVersion: {
-      VERSION_REID_HEAD_ATTR: '形体',
-      VERSION_FACE: '人脸',
-      VERSION_NON_MOTOR_VEHICLE: '非机动车'
-    }
-  }
-};
-export var ALGORITHM_VERSION = (_ALGORITHM_VERSION = {}, _defineProperty(_ALGORITHM_VERSION, '7', '形体'), _defineProperty(_ALGORITHM_VERSION, '4', '人脸'), _defineProperty(_ALGORITHM_VERSION, '6', '非机动车'), _ALGORITHM_VERSION);
-export var algorithmVersions = _toConsumableArray(Object.keys(ALGORITHM_VERSION));
-export var getBikeExtendRect = function getBikeExtendRect(rect, maxW) {
-  var newRect = _objectSpread({}, rect);
-  //向上扩大一倍
-  var oldY = cloneDeep(rect.y);
-  newRect.y = newRect.y - newRect.h < 0 ? 0 : newRect.y - newRect.h;
-  newRect.h += oldY - newRect.y;
-  var newX = Math.round(newRect.x - newRect.w * 0.15);
-  if (newX < 0) {
-    newX = 0;
-  }
-  var newW = newRect.x - newX + newRect.w + Math.round(newRect.w * 0.15);
-  if (newX + newW > maxW) {
-    newW = maxW - newX;
-  }
-  newRect.x = newX;
-  newRect.w = newW;
-  return newRect;
-};
-export var getOtherExtendRect = function getOtherExtendRect(srcRect, maxW, maxH, type) {
-  var wExtendRadio = 0.25;
-  var upExtendRadio = 0.25;
-  var downExtendRadio = 0.25;
-  var fixPersonExtend = true;
-  var nx = 0;
-  var nw = 0;
-  nx = srcRect.x - Math.round(srcRect.w * wExtendRadio);
-  if (nx < 0) {
-    nx = 0;
-  }
-  nw = srcRect.x - nx + srcRect.w + Math.round(srcRect.w * wExtendRadio);
-  if (nx + nw > maxW) {
-    nw = maxW - nx;
-  }
-  var ny = 0;
-  var nh = 0;
-  ny = srcRect.y - Math.round(upExtendRadio * srcRect.h);
-  if (ny < 0) {
-    ny = 0;
-  }
-  nh = srcRect.y - ny + srcRect.h + Math.round(srcRect.h * downExtendRadio);
-  if (ny + nh > maxH) {
-    nh = maxH - ny;
-  }
-  var newRect = {
-    x: nx,
-    y: ny,
-    w: nw,
-    h: nh
-  };
-  if ((type === proto.Common.AlgorithmVersion.VERSION_REID_HEAD_ATTR || type === proto.Common.AlgorithmVersion.VERSION_FACE) && fixPersonExtend) {
-    var fixW = Math.round(nh * 0.75);
-    if (nw < fixW) {
-      // 应该扩展宽度
-      var newX = nx + Math.round(nw / 2.0 - 0.5 * fixW);
-      if (newX < 0) {
-        newX = 0;
-      }
-      var newW = fixW;
-      if (newW + newX > maxW) {
-        newW = maxW - newX;
-      }
-      newRect = {
-        x: newX,
-        y: ny,
-        w: newW,
-        h: nh
-      };
-    } else if (nw > fixW) {
-      // 应该扩展高度
-      var fixH = Math.round(nw * 1.333);
-      var newY = ny + Math.round(nh / 2.0 - 0.5 * fixH);
-      if (newY < 0) {
-        newY = 0;
-      }
-      var newH = fixH;
-      if (newY + newH > maxH) {
-        newH = maxH - newY;
-      }
-      newRect = {
-        x: nx,
-        y: newY,
-        w: nw,
-        h: newH
-      };
-    }
-  }
-  return newRect;
-};
-export var getNormalization = function getNormalization(srcRect, maxW, maxH) {
-  var newRect = _objectSpread({}, srcRect);
-  newRect.x = srcRect.x / maxW;
-  newRect.y = srcRect.y / maxH;
-  newRect.w = srcRect.w / maxW;
-  newRect.h = srcRect.h / maxH;
-  if (newRect.x + newRect.w > 1) {
-    newRect.w = 1 - newRect.x;
-  }
-  if (newRect.y + newRect.h > 1) {
-    newRect.h = 1 - newRect.y;
-  }
-  return newRect;
-};
-//传入od框 穿出 od扩展框
-export var getExtendRect = function getExtendRect(normalizationRect, imgW, imgH, type) {
-  var rect = {
-    x: normalizationRect.x * imgW,
-    y: normalizationRect.y * imgH,
-    w: normalizationRect.w * imgW,
-    h: normalizationRect.h * imgH
-  };
-  var newRect;
-  if (type === proto.Common.AlgorithmVersion.VERSION_NON_MOTOR_VEHICLE) {
-    newRect = getBikeExtendRect(rect, imgW);
-  } else {
-    newRect = getOtherExtendRect(rect, imgW, imgH, type);
-  }
-  newRect = getNormalization(newRect, imgW, imgH);
-  return newRect;
-};
-export var getTransformRect = function getTransformRect(image, transform, rect) {
-  var canvasRect = {
-    x: rect.x,
-    y: rect.y,
-    x2: rect.x + rect.w,
-    y2: rect.h + rect.y
-  };
-  //1.转成缩放前的坐标
-  var translateX = transform.translateX,
-    translateY = transform.translateY,
-    scale = transform.scale,
-    rotate = transform.rotate;
-  var originAxisRect = {
-    x: (canvasRect.x - translateX) / scale,
-    y: (canvasRect.y - translateY) / scale,
-    x2: (canvasRect.x2 - translateX) / scale,
-    y2: (canvasRect.y2 - translateY) / scale
-  };
-  //2.转成图片坐标
-  //不考虑旋转 图片原点就是坐标原点
-  var imgAxisRect = originAxisRect;
-  //但是旋转90度后图片不在坐标原点 加上这部分diff
-  if (rotate % 180 !== 0) {
-    //90度调整偏移量
-    var offsetX = -(image.height - image.width) / 2;
-    var offsetY = -(image.width - image.height) / 2;
-    imgAxisRect = {
-      x: originAxisRect.x - offsetX,
-      y: originAxisRect.y - offsetY,
-      x2: originAxisRect.x2 - offsetX,
-      y2: originAxisRect.y2 - offsetY
-    };
-  }
-  //3.限制框不要超出图片
-  var imgW = image.width;
-  var imgH = image.height;
-  if (rotate % 180 !== 0) {
-    var _ref = [imgH, imgW];
-    imgW = _ref[0];
-    imgH = _ref[1];
-  }
-  imgAxisRect.x = Math.min(imgW, Math.max(imgAxisRect.x, 0));
-  imgAxisRect.y = Math.min(imgH, Math.max(imgAxisRect.y, 0));
-  imgAxisRect.x2 = Math.min(imgW, Math.max(imgAxisRect.x2, 0));
-  imgAxisRect.y2 = Math.min(imgH, Math.max(imgAxisRect.y2, 0));
-  //获取归一化坐标
-  var endRect = {
-    x: imgAxisRect.x2 > imgAxisRect.x ? imgAxisRect.x : imgAxisRect.x2,
-    y: imgAxisRect.y2 > imgAxisRect.y ? imgAxisRect.y : imgAxisRect.y2,
-    w: Math.abs(imgAxisRect.x2 - imgAxisRect.x),
-    h: Math.abs(imgAxisRect.y2 - imgAxisRect.y)
-  };
-  return getNormalization(endRect, imgW, imgH);
-};
-
-//旋转图片后转成file 对象
-export var getRotateImg = function getRotateImg(image, rotate) {
-  var _commonCanvas$parentN;
-  var imgW = image.width;
-  var imgH = image.height;
-  if (rotate % 180 !== 0) {
-    var _ref2 = [imgH, imgW];
-    imgW = _ref2[0];
-    imgH = _ref2[1];
-  }
-  var commonCanvas = document.createElement('canvas');
-  commonCanvas.width = imgW;
-  commonCanvas.height = imgH;
-  commonCanvas.style.display = 'none';
-  document.body.appendChild(commonCanvas);
-  var commonCtx = commonCanvas.getContext('2d');
-  //移动到图片中心 旋转
-
-  commonCtx === null || commonCtx === void 0 || commonCtx.save();
-  if (rotate % 180 !== 0) {
-    //90度调整偏移量
-    commonCtx === null || commonCtx === void 0 || commonCtx.translate((image.height - image.width) / 2, (image.width - image.height) / 2);
-  }
-  commonCtx === null || commonCtx === void 0 || commonCtx.translate(image.width / 2, image.height / 2);
-  commonCtx === null || commonCtx === void 0 || commonCtx.rotate(rotate / 180 * Math.PI);
-  commonCtx === null || commonCtx === void 0 || commonCtx.translate(-image.width / 2, -image.height / 2);
-  commonCtx === null || commonCtx === void 0 || commonCtx.drawImage(image, 0, 0);
-  commonCtx === null || commonCtx === void 0 || commonCtx.restore();
-  var dataUrl = commonCanvas.toDataURL('image/jpeg');
-  var blobData = dataURLToBlob(dataUrl);
-  var file = new window.File([blobData], "".concat(new Date().getTime()), {
-    type: 'image/jpeg'
-  });
-  (_commonCanvas$parentN = commonCanvas.parentNode) === null || _commonCanvas$parentN === void 0 || _commonCanvas$parentN.removeChild(commonCanvas);
-  return file;
-};
-
-/**
- *  格式化工具
- * @param originData
- * @returns
- */
-export var getOdRect = function getOdRect(originData) {
-  var data = get(originData, 'objects', []).filter(function (v) {
-    return !isNull(get(v, 'infoOnSource.bboxInFrame.bboxRatio'));
-  }).map(function (v, index) {
-    // objectId==0 特征没有提取到过滤1掉
-    var rect = get(v, 'infoOnSource.bboxInFrame.bboxRatio');
-    var extendBox = get(v, 'infoOnSource.bboxInFrame.extendBoxRatio');
-    var frameTimestamp = get(v, 'timestamp'); //时间戳创建档案的时候需要
-    var qualityScore = get(v, 'qualityScore');
-    var algorithmVersion = get(v, 'objectType') === 'OBJECT_TYPE_PEDESTRAIN' ? 'VERSION_REID_HEAD_ATTR' : get(v, 'objectType') === 'OBJECT_TYPE_FACE' ? 'VERSION_FACE' : 'VERSION_REID_HEAD_ATTR';
-    var featureData = get(v, 'feature', []).filter(function (v) {
-      return v.type === 'FEATURE_TYPE_BYTE';
-    });
-    var objectRectIndex = algorithmVersion === 'VERSION_FACE' ? 0 : 1;
-    var objectType = get(v, 'objectType');
-    var objectId = get(v, 'objectIndex.objectId');
-    var sourceObjectId = get(v, 'sourceObjectId');
-    return {
-      x: rect.x,
-      y: rect.y,
-      w: rect.w,
-      h: rect.h,
-      // faceCorrectImage: faceCorrectImage,
-      id: index,
-      qualityScore: qualityScore,
-      algorithmVersion: algorithmVersion,
-      featureData: get(featureData, '0.featureByte'),
-      objectRectIndex: objectRectIndex,
-      objectType: objectType,
-      objectId: objectId,
-      frameTimestamp: frameTimestamp,
-      sourceObjectId: sourceObjectId,
-      extendBox: extendBox
-    };
-  });
-  if (data.length > 0) {
-    data = data.filter(function (v) {
-      return v.objectId !== '0';
-    });
-  } else {
-    throw new Error('empty');
-  }
-  return data;
-};
-
-//档案库od
-export var getOdRectV2 = function getOdRectV2(originData) {
-  var resp = originData.odv2Result[0];
-  var subObjects = []; //形体
-  var data = get(resp, 'objects', []).filter(function (v) {
-    return !isNull(get(v, 'subObjects[0].infoOnSource.bboxInFrame.bboxRatio'));
-  }).map(function (v, index) {
-    var rect = get(v, 'infoOnSource.bboxInFrame.bboxRatio');
-    var qualityScore = get(v, 'qualityScore');
-    var algorithmVersion = get(v, 'objectType');
-    var featrueData = get(v, 'feature', []).filter(function (v) {
-      return v.name === 'feature-body' || v.name === 'feature-face';
-    });
-    var objectRectIndex = algorithmVersion === 'OBJECT_TYPE_FACE' ? 0 : 1;
-    var objectType = get(v, 'objectType');
-    var objectId = get(v, 'objectIndex.objectId');
-    //如果存在subObjects的数组不为null表示形体里面带人脸，人脸的od框也要显示出来
-    if (get(v, 'subObjects', []).length) {
-      get(v, 'subObjects', []).forEach(function (e) {
-        var rect = get(e, 'infoOnSource.bboxInFrame.bboxRatio');
-        var qualityScore = get(e, 'qualityScore');
-        var algorithmVersion = get(e, 'objectType');
-        var featrueData = get(e, 'feature', []).filter(function (v) {
-          return v.name === 'feature-body' || v.name === 'feature-face';
-        });
-        var objectRectIndex = algorithmVersion === 'OBJECT_TYPE_FACE' ? 0 : 1;
-        var objectType = get(e, 'objectType');
-        var objectId = get(e, 'objectIndex.objectId');
-        subObjects.push({
-          x: rect.x,
-          y: rect.y,
-          w: rect.w,
-          h: rect.h,
-          id: index,
-          qualityScore: qualityScore,
-          algorithmVersion: algorithmVersion,
-          featrueData: featrueData.length ? featrueData[0].featureByte : '',
-          objectRectIndex: objectRectIndex,
-          objectType: objectType,
-          objectId: objectId
-        });
-      });
-    }
-    return {
-      x: rect.x,
-      y: rect.y,
-      w: rect.w,
-      h: rect.h,
-      id: index,
-      qualityScore: qualityScore,
-      algorithmVersion: algorithmVersion,
-      featrueData: featrueData[0].featureByte,
-      objectRectIndex: objectRectIndex,
-      objectType: objectType,
-      objectId: objectId
-    };
-  });
-  var brr = data.concat(subObjects).map(function (v, vs) {
-    if (String(v.id)) {
-      v.id = vs;
-    }
-    return v;
-  });
-  if (brr.length > 0) {
-    console.log(brr, 'data111');
-  } else {
-    throw new Error('empty');
-  }
-  console.log(brr);
-  return brr;
-};
\ No newline at end of file
+export default {};
\ No newline at end of file
diff --git a/packages/func/package.json b/packages/func/package.json
index a6a8980..d2ff344 100644
--- a/packages/func/package.json
+++ b/packages/func/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/func",
-  "version": "0.7.4",
+  "version": "0.7.5",
   "description": "函数合集",
   "keywords": [
     "hooks"
diff --git a/packages/func/src/math/index.ts b/packages/func/src/math/index.ts
index 398ecf2..b1c6ea4 100644
--- a/packages/func/src/math/index.ts
+++ b/packages/func/src/math/index.ts
@@ -1,242 +1 @@
-import { cloneDeep, get, isNull } from 'lodash-es';
-import { dataURLToBlob } from '../file';
-import { IOdRectOrigin, Rect } from '@zhst/types';
-
-const proto = {
-  Common: {
-    AlgorithmVersion: {
-      VERSION_REID_HEAD_ATTR: '形体',
-      VERSION_FACE: '人脸',
-      VERSION_NON_MOTOR_VEHICLE: '非机动车',
-    },
-  },
-};
-export const ALGORITHM_VERSION = {
-  ['7']: '形体',
-  ['4']: '人脸',
-  ['6']: '非机动车',
-};
-
-export const algorithmVersions = [...Object.keys(ALGORITHM_VERSION)]
-
-export const getBikeExtendRect = (rect: Rect, maxW: number) => {
-  const newRect = { ...rect };
-  //向上扩大一倍
-  const oldY = cloneDeep(rect.y);
-  newRect.y = newRect.y - newRect.h < 0 ? 0 : newRect.y - newRect.h;
-  newRect.h += oldY - newRect.y;
-
-  let newX = Math.round(newRect.x - newRect.w * 0.15);
-  if (newX < 0) {
-    newX = 0;
-  }
-  let newW = newRect.x - newX + newRect.w + Math.round(newRect.w * 0.15);
-  if (newX + newW > maxW) {
-    newW = maxW - newX;
-  }
-  newRect.x = newX;
-  newRect.w = newW;
-
-  return newRect;
-};
-
-export const getOtherExtendRect = (srcRect: Rect, maxW: number, maxH: number, type: string) => {
-  const wExtendRadio = 0.25;
-  const upExtendRadio = 0.25;
-  const downExtendRadio = 0.25;
-  const fixPersonExtend = true;
-
-  let nx = 0;
-  let nw = 0;
-
-  nx = srcRect.x - Math.round(srcRect.w * wExtendRadio);
-  if (nx < 0) {
-    nx = 0;
-  }
-  nw = srcRect.x - nx + srcRect.w + Math.round(srcRect.w * wExtendRadio);
-  if (nx + nw > maxW) {
-    nw = maxW - nx;
-  }
-
-  let ny = 0;
-  let nh = 0;
-  ny = srcRect.y - Math.round(upExtendRadio * srcRect.h);
-  if (ny < 0) {
-    ny = 0;
-  }
-  nh = srcRect.y - ny + srcRect.h + Math.round(srcRect.h * downExtendRadio);
-  if (ny + nh > maxH) {
-    nh = maxH - ny;
-  }
-
-  let newRect = {
-    x: nx,
-    y: ny,
-    w: nw,
-    h: nh,
-  };
-  if (
-    (type === proto.Common.AlgorithmVersion.VERSION_REID_HEAD_ATTR ||
-      type === proto.Common.AlgorithmVersion.VERSION_FACE) &&
-    fixPersonExtend
-  ) {
-    const fixW = Math.round(nh * 0.75);
-    if (nw < fixW) {
-      // 应该扩展宽度
-      let newX = nx + Math.round(nw / 2.0 - 0.5 * fixW);
-      if (newX < 0) {
-        newX = 0;
-      }
-      let newW = fixW;
-      if (newW + newX > maxW) {
-        newW = maxW - newX;
-      }
-
-      newRect = {
-        x: newX,
-        y: ny,
-        w: newW,
-        h: nh,
-      };
-    } else if (nw > fixW) {
-      // 应该扩展高度
-      const fixH = Math.round(nw * 1.333);
-      let newY = ny + Math.round(nh / 2.0 - 0.5 * fixH);
-      if (newY < 0) {
-        newY = 0;
-      }
-      let newH = fixH;
-      if (newY + newH > maxH) {
-        newH = maxH - newY;
-      }
-      newRect = {
-        x: nx,
-        y: newY,
-        w: nw,
-        h: newH,
-      };
-    }
-  }
-  return newRect;
-};
-
-export const getNormalization = (srcRect: Rect, maxW: number, maxH: number) => {
-  const newRect = {
-    ...srcRect,
-  };
-  newRect.x = srcRect.x / maxW;
-  newRect.y = srcRect.y / maxH;
-  newRect.w = srcRect.w / maxW;
-  newRect.h = srcRect.h / maxH;
-  if (newRect.x + newRect.w > 1) {
-    newRect.w = 1 - newRect.x;
-  }
-  if (newRect.y + newRect.h > 1) {
-    newRect.h = 1 - newRect.y;
-  }
-  return newRect;
-};
-//传入od框 穿出 od扩展框
-export const getExtendRect = (normalizationRect: Rect, imgW: number, imgH: number, type: string) => {
-  const rect = {
-    x: normalizationRect.x * imgW,
-    y: normalizationRect.y * imgH,
-    w: normalizationRect.w * imgW,
-    h: normalizationRect.h * imgH,
-  };
-
-  let newRect;
-  if (type === proto.Common.AlgorithmVersion.VERSION_NON_MOTOR_VEHICLE) {
-    newRect = getBikeExtendRect(rect, imgW);
-  } else {
-    newRect = getOtherExtendRect(rect, imgW, imgH, type);
-  }
-  newRect = getNormalization(newRect, imgW, imgH);
-  return newRect;
-};
-
-export const getTransformRect = (image: { height: number; width: number; }, transform: { translateX: any; translateY: any; scale: any; rotate: any; }, rect: Rect) => {
-  const canvasRect = {
-    x: rect.x,
-    y: rect.y,
-    x2: rect.x + rect.w,
-    y2: rect.h + rect.y,
-  };
-  //1.转成缩放前的坐标
-  const { translateX, translateY, scale, rotate } = transform;
-  const originAxisRect = {
-    x: (canvasRect.x - translateX) / scale,
-    y: (canvasRect.y - translateY) / scale,
-    x2: (canvasRect.x2 - translateX) / scale,
-    y2: (canvasRect.y2 - translateY) / scale,
-  };
-  //2.转成图片坐标
-  //不考虑旋转 图片原点就是坐标原点
-  let imgAxisRect = originAxisRect;
-  //但是旋转90度后图片不在坐标原点 加上这部分diff
-  if (rotate % 180 !== 0) {
-    //90度调整偏移量
-    const offsetX = -(image.height - image.width) / 2;
-    const offsetY = -(image.width - image.height) / 2;
-    imgAxisRect = {
-      x: originAxisRect.x - offsetX,
-      y: originAxisRect.y - offsetY,
-      x2: originAxisRect.x2 - offsetX,
-      y2: originAxisRect.y2 - offsetY,
-    };
-  }
-  //3.限制框不要超出图片
-  let imgW = image.width;
-  let imgH = image.height;
-  if (rotate % 180 !== 0) {
-    [imgW, imgH] = [imgH, imgW];
-  }
-  imgAxisRect.x = Math.min(imgW, Math.max(imgAxisRect.x, 0));
-  imgAxisRect.y = Math.min(imgH, Math.max(imgAxisRect.y, 0));
-  imgAxisRect.x2 = Math.min(imgW, Math.max(imgAxisRect.x2, 0));
-  imgAxisRect.y2 = Math.min(imgH, Math.max(imgAxisRect.y2, 0));
-  //获取归一化坐标
-  const endRect = {
-    x: imgAxisRect.x2 > imgAxisRect.x ? imgAxisRect.x : imgAxisRect.x2,
-    y: imgAxisRect.y2 > imgAxisRect.y ? imgAxisRect.y : imgAxisRect.y2,
-    w: Math.abs(imgAxisRect.x2 - imgAxisRect.x),
-    h: Math.abs(imgAxisRect.y2 - imgAxisRect.y),
-  };
-
-  return getNormalization(endRect, imgW, imgH);
-};
-
-//旋转图片后转成file 对象
-export const getRotateImg = (image: HTMLImageElement, rotate: number) => {
-  let imgW = image.width;
-  let imgH = image.height;
-  if (rotate % 180 !== 0) {
-    [imgW, imgH] = [imgH, imgW];
-  }
-  const commonCanvas = document.createElement('canvas');
-  commonCanvas.width = imgW;
-  commonCanvas.height = imgH;
-  commonCanvas.style.display = 'none';
-  document.body.appendChild(commonCanvas);
-  const commonCtx = commonCanvas.getContext('2d');
-  //移动到图片中心 旋转
-
-  commonCtx?.save();
-  if (rotate % 180 !== 0) {
-    //90度调整偏移量
-    commonCtx?.translate((image.height - image.width) / 2, (image.width - image.height) / 2);
-  }
-  commonCtx?.translate(image.width / 2, image.height / 2);
-  commonCtx?.rotate((rotate / 180) * Math.PI);
-  commonCtx?.translate(-image.width / 2, -image.height / 2);
-  commonCtx?.drawImage(image, 0, 0);
-  commonCtx?.restore();
-
-  const dataUrl = commonCanvas.toDataURL('image/jpeg');
-  const blobData = dataURLToBlob(dataUrl);
-  const file = new window.File([blobData], `${new Date().getTime()}`, {
-    type: 'image/jpeg',
-  });
-  commonCanvas.parentNode?.removeChild(commonCanvas);
-  return file;
-};
+export default {}
diff --git a/packages/hooks/CHANGELOG.md b/packages/hooks/CHANGELOG.md
index 8ef5dbb..88e0890 100644
--- a/packages/hooks/CHANGELOG.md
+++ b/packages/hooks/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @zhst/hooks
 
+## 0.8.4
+
+### Patch Changes
+
+- @zhst/func@0.7.5
+
 ## 0.8.3
 
 ### Patch Changes
diff --git a/packages/hooks/package.json b/packages/hooks/package.json
index e66f7c4..768c890 100644
--- a/packages/hooks/package.json
+++ b/packages/hooks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/hooks",
-  "version": "0.8.3",
+  "version": "0.8.4",
   "description": "hooks合集",
   "keywords": [
     "hooks"
diff --git a/packages/meta/CHANGELOG.md b/packages/meta/CHANGELOG.md
index 4ff7367..6c2e5c8 100644
--- a/packages/meta/CHANGELOG.md
+++ b/packages/meta/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @zhst/utils
 
+## 0.8.5
+
+### Patch Changes
+
+- @zhst/func@0.7.5
+- @zhst/hooks@0.8.4
+- @zhst/meta@0.8.5
+
 ## 0.8.4
 
 ### Patch Changes
diff --git a/packages/meta/package.json b/packages/meta/package.json
index 39b65d7..b495f36 100644
--- a/packages/meta/package.json
+++ b/packages/meta/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/meta",
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "原子组件",
   "keywords": [
     "meta",
diff --git a/packages/meta/src/BigImagePreview/BigImagePreview.tsx b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
index 30cefc8..c04928f 100644
--- a/packages/meta/src/BigImagePreview/BigImagePreview.tsx
+++ b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
@@ -1,15 +1,11 @@
-import React, { useEffect, ReactElement, useState, useCallback, useRef, useImperativeHandle } from 'react';
+import React, { useEffect, ReactElement, useState, useRef, useImperativeHandle } from 'react';
 import classNames from 'classnames';
-import { useLatest } from '@zhst/hooks';
 import {
   get,
   pick,
   isNull,
   generateImg,
   dataURLToBlob,
-  getExtendRect,
-  getTransformRect,
-  getRotateImg,
   getTransforms,
   addEventListenerWrapper,
   getFileByRect
@@ -29,7 +25,12 @@ import {
 import BtnGroup from './components/BtnGroup';
 import './index.less'
 import { defaultAlignOption, CROP_TYPE } from '../utils/constants'
-import { getOdRect, IOdObject } from './bigImagePreviewHelper'
+import {
+  getOdRect,
+  IOdObject,
+  getExtendRect,
+  getTransformRect,
+  getRotateImg, } from './bigImagePreviewHelper'
 
 const componentName = `zhst-image__img-view`;
 
@@ -76,7 +77,17 @@ export interface ImgViewProps extends React.HTMLAttributes<HTMLElement> {
   screenshotButtonAlign?: AlignType;
   screenshotButtonRender?: (screenshotButtonProp: IScreenshotButtonProp) => ReactElement;
   hideLeftTopBtn?: boolean;
-  onRectSelect?: (obj: IOdObject) => void
+  onDraw?: (obj: {
+    rectList: any;
+    extendRectList: {
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    }[];
+    selectIndex: number;
+    imgKey: string;
+  }) => void
   showScore?: boolean // 是否显示相似度
   viewOption?: ViewOption;
 }
@@ -132,8 +143,9 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
     showOpt = false,
     showAttachImgLabel = true,
     screenshotButtonAlign = defaultAlignOption,
-    screenshotButtonRender = () => <div style={{ color: '#fff', width: '80px', top: 0 }}>回调DOM</div>,
+    screenshotButtonRender = () => <div style={{ color: '#fff', width: '80px', top: 0, fontSize: 12 }}>回调DOM</div>,
     hideLeftTopBtn = true,
+    onDraw,
     viewOption = {}
   } = props;
   const {
@@ -294,7 +306,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
         setSelectAlgorithmVersion(null);
         setCropRect(null);
       });
-      handlerCropEndRef.current = addEventListenerWrapper(imgContainerRef.current, EVENT_CROP_END, (event: { detail: any; }) => {
+      handlerCropEndRef.current = addEventListenerWrapper(imgContainerRef.current, EVENT_CROP_END, async (event: { detail: any; }) => {
         const data = event.detail;
         setSelectAlgorithmVersion(null);
         const _rect = {
@@ -304,8 +316,8 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
           h: data.height,
         }
         setCropRect(_rect);
-        const p = getCropInfo({ type: cropType, rect: _rect })
-        console.log('p', p)
+        const _cropData = await getCropInfo({ type: cropType, rect: _rect })
+        onDraw?.(_cropData)
         alignRef?.current?.forceAlign?.();
       });
       cropInsRef.current = new Cropper(imgContainerRef.current, {
diff --git a/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts b/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
index bdc6992..653dec6 100644
--- a/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
+++ b/packages/meta/src/BigImagePreview/bigImagePreviewHelper.ts
@@ -1,6 +1,24 @@
-import { get, isNull } from "@zhst/func";
+import { cloneDeep, dataURLToBlob, get, isNull } from "@zhst/func";
 import { ObjectType, Rect } from "@zhst/types";
 
+const proto = {
+  Common: {
+    AlgorithmVersion: {
+      VERSION_REID_HEAD_ATTR: '形体',
+      VERSION_FACE: '人脸',
+      VERSION_NON_MOTOR_VEHICLE: '非机动车',
+    },
+  },
+};
+export const ALGORITHM_VERSION = {
+  ['7']: '形体',
+  ['4']: '人脸',
+  ['6']: '非机动车',
+};
+
+export const algorithmVersions = [...Object.keys(ALGORITHM_VERSION)]
+
+
 export interface IOdObject {
   objects: {
     bboxRatio: Rect
@@ -56,3 +74,227 @@ export const getOdRect = (originData: IOdObject) => {
     });
   return data;
 };
+
+export const getNormalization = (srcRect: Rect, maxW: number, maxH: number) => {
+  const newRect = {
+    ...srcRect,
+  };
+  newRect.x = srcRect.x / maxW;
+  newRect.y = srcRect.y / maxH;
+  newRect.w = srcRect.w / maxW;
+  newRect.h = srcRect.h / maxH;
+  if (newRect.x + newRect.w > 1) {
+    newRect.w = 1 - newRect.x;
+  }
+  if (newRect.y + newRect.h > 1) {
+    newRect.h = 1 - newRect.y;
+  }
+  return newRect;
+};
+//传入od框 穿出 od扩展框
+export const getExtendRect = (normalizationRect: Rect, imgW: number, imgH: number, type: string) => {
+  const rect = {
+    x: normalizationRect.x * imgW,
+    y: normalizationRect.y * imgH,
+    w: normalizationRect.w * imgW,
+    h: normalizationRect.h * imgH,
+  };
+
+  let newRect;
+  if (type === proto.Common.AlgorithmVersion.VERSION_NON_MOTOR_VEHICLE) {
+    newRect = getBikeExtendRect(rect, imgW);
+  } else {
+    newRect = getOtherExtendRect(rect, imgW, imgH, type);
+  }
+  newRect = getNormalization(newRect, imgW, imgH);
+  return newRect;
+};
+
+
+export const getBikeExtendRect = (rect: Rect, maxW: number) => {
+  const newRect = { ...rect };
+  //向上扩大一倍
+  const oldY = cloneDeep(rect.y);
+  newRect.y = newRect.y - newRect.h < 0 ? 0 : newRect.y - newRect.h;
+  newRect.h += oldY - newRect.y;
+
+  let newX = Math.round(newRect.x - newRect.w * 0.15);
+  if (newX < 0) {
+    newX = 0;
+  }
+  let newW = newRect.x - newX + newRect.w + Math.round(newRect.w * 0.15);
+  if (newX + newW > maxW) {
+    newW = maxW - newX;
+  }
+  newRect.x = newX;
+  newRect.w = newW;
+
+  return newRect;
+};
+
+export const getOtherExtendRect = (srcRect: Rect, maxW: number, maxH: number, type: string) => {
+  const wExtendRadio = 0.25;
+  const upExtendRadio = 0.25;
+  const downExtendRadio = 0.25;
+  const fixPersonExtend = true;
+
+  let nx = 0;
+  let nw = 0;
+
+  nx = srcRect.x - Math.round(srcRect.w * wExtendRadio);
+  if (nx < 0) {
+    nx = 0;
+  }
+  nw = srcRect.x - nx + srcRect.w + Math.round(srcRect.w * wExtendRadio);
+  if (nx + nw > maxW) {
+    nw = maxW - nx;
+  }
+
+  let ny = 0;
+  let nh = 0;
+  ny = srcRect.y - Math.round(upExtendRadio * srcRect.h);
+  if (ny < 0) {
+    ny = 0;
+  }
+  nh = srcRect.y - ny + srcRect.h + Math.round(srcRect.h * downExtendRadio);
+  if (ny + nh > maxH) {
+    nh = maxH - ny;
+  }
+
+  let newRect = {
+    x: nx,
+    y: ny,
+    w: nw,
+    h: nh,
+  };
+  if (
+    (type === proto.Common.AlgorithmVersion.VERSION_REID_HEAD_ATTR ||
+      type === proto.Common.AlgorithmVersion.VERSION_FACE) &&
+    fixPersonExtend
+  ) {
+    const fixW = Math.round(nh * 0.75);
+    if (nw < fixW) {
+      // 应该扩展宽度
+      let newX = nx + Math.round(nw / 2.0 - 0.5 * fixW);
+      if (newX < 0) {
+        newX = 0;
+      }
+      let newW = fixW;
+      if (newW + newX > maxW) {
+        newW = maxW - newX;
+      }
+
+      newRect = {
+        x: newX,
+        y: ny,
+        w: newW,
+        h: nh,
+      };
+    } else if (nw > fixW) {
+      // 应该扩展高度
+      const fixH = Math.round(nw * 1.333);
+      let newY = ny + Math.round(nh / 2.0 - 0.5 * fixH);
+      if (newY < 0) {
+        newY = 0;
+      }
+      let newH = fixH;
+      if (newY + newH > maxH) {
+        newH = maxH - newY;
+      }
+      newRect = {
+        x: nx,
+        y: newY,
+        w: nw,
+        h: newH,
+      };
+    }
+  }
+  return newRect;
+};
+
+
+export const getTransformRect = (image: { height: number; width: number; }, transform: { translateX: any; translateY: any; scale: any; rotate: any; }, rect: Rect) => {
+  const canvasRect = {
+    x: rect.x,
+    y: rect.y,
+    x2: rect.x + rect.w,
+    y2: rect.h + rect.y,
+  };
+  //1.转成缩放前的坐标
+  const { translateX, translateY, scale, rotate } = transform;
+  const originAxisRect = {
+    x: (canvasRect.x - translateX) / scale,
+    y: (canvasRect.y - translateY) / scale,
+    x2: (canvasRect.x2 - translateX) / scale,
+    y2: (canvasRect.y2 - translateY) / scale,
+  };
+  //2.转成图片坐标
+  //不考虑旋转 图片原点就是坐标原点
+  let imgAxisRect = originAxisRect;
+  //但是旋转90度后图片不在坐标原点 加上这部分diff
+  if (rotate % 180 !== 0) {
+    //90度调整偏移量
+    const offsetX = -(image.height - image.width) / 2;
+    const offsetY = -(image.width - image.height) / 2;
+    imgAxisRect = {
+      x: originAxisRect.x - offsetX,
+      y: originAxisRect.y - offsetY,
+      x2: originAxisRect.x2 - offsetX,
+      y2: originAxisRect.y2 - offsetY,
+    };
+  }
+  //3.限制框不要超出图片
+  let imgW = image.width;
+  let imgH = image.height;
+  if (rotate % 180 !== 0) {
+    [imgW, imgH] = [imgH, imgW];
+  }
+  imgAxisRect.x = Math.min(imgW, Math.max(imgAxisRect.x, 0));
+  imgAxisRect.y = Math.min(imgH, Math.max(imgAxisRect.y, 0));
+  imgAxisRect.x2 = Math.min(imgW, Math.max(imgAxisRect.x2, 0));
+  imgAxisRect.y2 = Math.min(imgH, Math.max(imgAxisRect.y2, 0));
+  //获取归一化坐标
+  const endRect = {
+    x: imgAxisRect.x2 > imgAxisRect.x ? imgAxisRect.x : imgAxisRect.x2,
+    y: imgAxisRect.y2 > imgAxisRect.y ? imgAxisRect.y : imgAxisRect.y2,
+    w: Math.abs(imgAxisRect.x2 - imgAxisRect.x),
+    h: Math.abs(imgAxisRect.y2 - imgAxisRect.y),
+  };
+
+  return getNormalization(endRect, imgW, imgH);
+};
+
+//旋转图片后转成file 对象
+export const getRotateImg = (image: HTMLImageElement, rotate: number) => {
+  let imgW = image.width;
+  let imgH = image.height;
+  if (rotate % 180 !== 0) {
+    [imgW, imgH] = [imgH, imgW];
+  }
+  const commonCanvas = document.createElement('canvas');
+  commonCanvas.width = imgW;
+  commonCanvas.height = imgH;
+  commonCanvas.style.display = 'none';
+  document.body.appendChild(commonCanvas);
+  const commonCtx = commonCanvas.getContext('2d');
+  //移动到图片中心 旋转
+
+  commonCtx?.save();
+  if (rotate % 180 !== 0) {
+    //90度调整偏移量
+    commonCtx?.translate((image.height - image.width) / 2, (image.width - image.height) / 2);
+  }
+  commonCtx?.translate(image.width / 2, image.height / 2);
+  commonCtx?.rotate((rotate / 180) * Math.PI);
+  commonCtx?.translate(-image.width / 2, -image.height / 2);
+  commonCtx?.drawImage(image, 0, 0);
+  commonCtx?.restore();
+
+  const dataUrl = commonCanvas.toDataURL('image/jpeg');
+  const blobData = dataURLToBlob(dataUrl);
+  const file = new window.File([blobData], `${new Date().getTime()}`, {
+    type: 'image/jpeg',
+  });
+  commonCanvas.parentNode?.removeChild(commonCanvas);
+  return file;
+};
diff --git a/packages/meta/src/BigImagePreview/demo/noAttach.tsx b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
index b75fb7b..d89a855 100644
--- a/packages/meta/src/BigImagePreview/demo/noAttach.tsx
+++ b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
@@ -13,18 +13,8 @@ const props = {
       },
       cameraPosition: 'string', // 摄像头位置
       time: '2022-01-01', // 摄像头拍摄时间
-      objects: [
-        {
-          "bboxRatio": {
-              "x": 0.5519352,
-              "y": 0.2965385,
-              "w": 0.05185461,
-              "h": 0.24698898
-          },
-        },
-    ]
   },
-  onRectSelect: data => console.log('data', data)
+  onDraw: data => console.log('data', data)
 }
 
 export default () => {
diff --git a/packages/request/CHANGELOG.md b/packages/request/CHANGELOG.md
index 0cf2e9f..cf1e6f1 100644
--- a/packages/request/CHANGELOG.md
+++ b/packages/request/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @zhst/request
 
+## 0.8.4
+
+### Patch Changes
+
+- test
+
 ## 0.8.3
 
 ### Patch Changes
diff --git a/packages/request/package.json b/packages/request/package.json
index 009afad..0c22940 100644
--- a/packages/request/package.json
+++ b/packages/request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/request",
-  "version": "0.8.3",
+  "version": "0.8.4",
   "description": "请求库",
   "keywords": [
     "request",

From 57f54b7164a4012d3b93731051eabe7e761d3f4d Mon Sep 17 00:00:00 2001
From: jiangzhixiong <710328466@qq.com>
Date: Fri, 15 Mar 2024 17:27:42 +0800
Subject: [PATCH 24/24] =?UTF-8?q?fix:=20=E6=B7=BB=E5=8A=A0=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E4=B8=BA=E7=A9=BA=E6=97=B6=E8=87=AA=E5=AE=9A=E4=B9=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .dumirc.ts                                    |  19 +-
 .fatherrc.ts                                  |  10 -
 package.json                                  |   1 -
 packages/biz/CHANGELOG.md                     |  20 +
 packages/biz/package.json                     |   4 +-
 packages/func/es/time/index.js                |   3 -
 packages/hooks/es/useJump/index.js            |   4 +-
 packages/meta/CHANGELOG.md                    |  22 ++
 .../es/BigImagePreview/BigImagePreview.js     | 345 ++++++++++--------
 .../BigImagePreview/bigImagePreviewHelper.js  | 270 ++++++++++++++
 packages/meta/es/BigImagePreview/index.less   |   6 +-
 packages/meta/es/ImageEditor/cropper/event.js |   2 +-
 packages/meta/es/VideoPlayer/VideoPlayer.js   |   4 +-
 packages/meta/es/utils/constants.js           |   2 +-
 packages/meta/package.json                    |   2 +-
 .../src/BigImagePreview/BigImagePreview.tsx   |  30 +-
 .../meta/src/BigImagePreview/demo/base.tsx    |   7 +-
 .../meta/src/BigImagePreview/demo/empty.tsx   |  28 ++
 .../src/BigImagePreview/demo/noAttach.tsx     |  12 +-
 packages/meta/src/BigImagePreview/index.md    |  50 ++-
 .../meta/src/ImageEditor/cropper/event.ts     |   2 +-
 packages/meta/src/utils/constants.ts          |   2 +-
 pnpm-lock.yaml                                |  16 +-
 23 files changed, 641 insertions(+), 220 deletions(-)
 create mode 100644 packages/meta/src/BigImagePreview/demo/empty.tsx

diff --git a/.dumirc.ts b/.dumirc.ts
index 9de9ea5..445c479 100644
--- a/.dumirc.ts
+++ b/.dumirc.ts
@@ -9,6 +9,15 @@ export default defineConfig({
     socialLinks: {
       gitlab: 'http://10.0.0.88/web-project/zhst-Lambo',
     },
+    nav: {
+      mode: 'append',
+      value: [
+        {
+          title: '智能柜物料库→',
+          link: 'http://10.0.0.222:30098',
+        },
+      ],
+    },
   },
   alias: {
     '@zhst/hooks': path.join(__dirname, 'packages/hooks/src'),
@@ -33,14 +42,4 @@ export default defineConfig({
     srcDir: ['packages', 'src'],
     peerDeps: true,
   },
-  extraBabelPlugins: [
-    [
-      'import',
-      {
-        libraryName: 'antd',
-        libraryDirectory: 'es',
-        style: true,
-      },
-    ],
-  ],
 });
diff --git a/.fatherrc.ts b/.fatherrc.ts
index 0e503e9..db700bd 100644
--- a/.fatherrc.ts
+++ b/.fatherrc.ts
@@ -2,14 +2,4 @@ import { defineConfig } from 'father';
 
 export default defineConfig({
   // more father config: https://github.com/umijs/father/blob/master/docs/config.md
-  extraBabelPlugins: [
-    [
-      'import',
-      {
-        libraryName: 'antd',
-        libraryDirectory: 'es',
-        style: true,
-      },
-    ],
-  ],
 });
diff --git a/package.json b/package.json
index 738ca88..a5e95c5 100644
--- a/package.json
+++ b/package.json
@@ -58,7 +58,6 @@
     "@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",
diff --git a/packages/biz/CHANGELOG.md b/packages/biz/CHANGELOG.md
index c999c2d..b14b8d6 100644
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@@ -1,5 +1,23 @@
 # @zhst/biz
 
+## 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
@@ -13,6 +31,8 @@
 ### Patch Changes
 
 - 新增 RealTimeMonitor,VideoPlayerCard,ViewLargerImageModal,WarningRecordCard 组件,优化盒子树创建弹框规则校验
+- Updated dependencies
+  - @zhst/meta@0.8.5
 
 ## 0.9.6
 
diff --git a/packages/biz/package.json b/packages/biz/package.json
index d78ea3e..87a6497 100644
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/biz",
-  "version": "0.9.8",
+  "version": "0.10.1",
   "description": "业务库",
   "keywords": [
     "business",
@@ -35,7 +35,7 @@
     "registry": "http://10.0.0.77:4874"
   },
   "devDependencies": {
-    "@types/zhst": "workspace:^"
+    "@zhst/types": "workspace:^"
   },
   "dependencies": {
     "@ant-design/icons": "^5.2.6",
diff --git a/packages/func/es/time/index.js b/packages/func/es/time/index.js
index b60c8aa..2ea21b7 100644
--- a/packages/func/es/time/index.js
+++ b/packages/func/es/time/index.js
@@ -26,15 +26,12 @@ export var formateDuration = function formateDuration(diff) {
   if (minutes > 0) {
     returnStr = minutes + '分'; //+ returnStr;
   }
-
   if (hours > 0) {
     returnStr = hours + '小时'; // + returnStr;
   }
-
   if (days > 0) {
     returnStr = days + '天'; //+ returnStr;
   }
-
   return returnStr;
 };
 
diff --git a/packages/hooks/es/useJump/index.js b/packages/hooks/es/useJump/index.js
index 251687b..086b027 100644
--- a/packages/hooks/es/useJump/index.js
+++ b/packages/hooks/es/useJump/index.js
@@ -2,8 +2,8 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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 { useLatest } from 'ahooks';
 import events from 'events';
 import { get, isArray } from '@zhst/func';
diff --git a/packages/meta/CHANGELOG.md b/packages/meta/CHANGELOG.md
index 6c2e5c8..e471c8a 100644
--- a/packages/meta/CHANGELOG.md
+++ b/packages/meta/CHANGELOG.md
@@ -1,5 +1,24 @@
 # @zhst/utils
 
+## 0.9.1
+
+### Patch Changes
+
+- 添加数据为空时自定义
+- Updated dependencies
+  - @zhst/meta@0.9.1
+
+## 0.9.0
+
+### Minor Changes
+
+- 修改 metad 大图组建
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/meta@0.9.0
+
 ## 0.8.5
 
 ### Patch Changes
@@ -7,6 +26,9 @@
 - @zhst/func@0.7.5
 - @zhst/hooks@0.8.4
 - @zhst/meta@0.8.5
+- 修改大图组组建的手动绘制截图逻辑
+- Updated dependencies
+  - @zhst/meta@0.8.5
 
 ## 0.8.4
 
diff --git a/packages/meta/es/BigImagePreview/BigImagePreview.js b/packages/meta/es/BigImagePreview/BigImagePreview.js
index 6aad87f..a7b5d37 100644
--- a/packages/meta/es/BigImagePreview/BigImagePreview.js
+++ b/packages/meta/es/BigImagePreview/BigImagePreview.js
@@ -13,10 +13,9 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import React, { useEffect, useState, useCallback, useRef, useImperativeHandle } from 'react';
+import React, { useEffect, useState, useRef, useImperativeHandle } from 'react';
 import classNames from 'classnames';
-import { useLatest } from '@zhst/hooks';
-import { get, pick, isNull, generateImg, dataURLToBlob, getOdRect, getExtendRect, getTransformRect, getRotateImg, getTransforms, addEventListenerWrapper, getFileByRect } from '@zhst/func';
+import { get, pick, isNull, generateImg, dataURLToBlob, getTransforms, addEventListenerWrapper, getFileByRect } from '@zhst/func';
 import Align from 'rc-align';
 import { Button, Empty } from '..';
 import Icon from "../iconfont";
@@ -24,6 +23,7 @@ import { Cropper, Viewer, EVENT_VIEWER_TRANSFORM_CHANGE, EVENT_VIEWER_READY, EVE
 import BtnGroup from "./components/BtnGroup";
 import "./index.less";
 import { defaultAlignOption, CROP_TYPE } from "../utils/constants";
+import { getOdRect, getExtendRect, getTransformRect, getRotateImg } from "./bigImagePreviewHelper";
 var componentName = "zhst-image__img-view";
 var cropBtnDataSource = [{
   key: 'close',
@@ -55,7 +55,7 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
   var width = props.width,
     height = props.height,
     _props$showScore = props.showScore,
-    showScore = _props$showScore === void 0 ? true : _props$showScore,
+    showScore = _props$showScore === void 0 ? false : _props$showScore,
     data = props.data,
     _props$showOpt = props.showOpt,
     showOpt = _props$showOpt === void 0 ? false : _props$showOpt,
@@ -67,14 +67,21 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
     screenshotButtonRender = _props$screenshotButt2 === void 0 ? function () {
       return /*#__PURE__*/React.createElement("div", {
         style: {
-          color: '#fff'
+          color: '#fff',
+          width: '80px',
+          top: 0,
+          fontSize: 12
         }
       }, "\u56DE\u8C03DOM");
     } : _props$screenshotButt2,
     _props$hideLeftTopBtn = props.hideLeftTopBtn,
     hideLeftTopBtn = _props$hideLeftTopBtn === void 0 ? true : _props$hideLeftTopBtn,
+    onDraw = props.onDraw,
     _props$viewOption = props.viewOption,
-    viewOption = _props$viewOption === void 0 ? {} : _props$viewOption;
+    viewOption = _props$viewOption === void 0 ? {} : _props$viewOption,
+    type = props.type,
+    hideTypeBtns = props.hideTypeBtns,
+    customEmpty = props.customEmpty;
   var imageKey = data.imageKey,
     attachImg = data.attachImg,
     odRect = data.odRect,
@@ -82,22 +89,15 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
     _data$objects = data.objects,
     objects = _data$objects === void 0 ? [] : _data$objects;
   var imgContainerRef = React.useRef(null);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isReady = _useState2[0],
-    setIsReady = _useState2[1];
-  var init = useCallback(function ($container) {
-    imgContainerRef.current = $container;
-    setIsReady(true);
-  }, []);
+
   // ============================= viewer  =========================
   var imgInsRef = useRef(null);
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isImgReady = _useState4[0],
-    setIsImgReady = _useState4[1];
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isImgReady = _useState2[0],
+    setIsImgReady = _useState2[1];
   useEffect(function () {
-    if (!isReady || !(imgContainerRef !== null && imgContainerRef !== void 0 && imgContainerRef.current)) return;
+    if (!(imgContainerRef !== null && imgContainerRef !== void 0 && imgContainerRef.current)) return;
     var handleReady = addEventListenerWrapper(imgContainerRef.current, EVENT_VIEWER_READY, function () {
       setIsImgReady(true);
     });
@@ -113,7 +113,7 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
       imgInsRef === null || imgInsRef === void 0 || (_imgInsRef$current = imgInsRef.current) === null || _imgInsRef$current === void 0 || (_imgInsRef$current$de = _imgInsRef$current.destroy) === null || _imgInsRef$current$de === void 0 || _imgInsRef$current$de.call(_imgInsRef$current);
       imgInsRef.current = null;
     };
-  }, [isReady, imageKey]);
+  }, [imageKey]);
 
   // ============================= viewer操作按钮 =========================
   var handleOptClick = function handleOptClick(v) {
@@ -134,42 +134,42 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
   // ============================= cropper  =========================
   // 手动截图相关参数
   var cropInsRef = useRef(null);
-  var _useState5 = useState(showOpt),
+  var _useState3 = useState(showOpt),
+    _useState4 = _slicedToArray(_useState3, 2),
+    showCrop = _useState4[0],
+    setShowCrop = _useState4[1];
+  var _useState5 = useState(type || CROP_TYPE['AUTO']),
     _useState6 = _slicedToArray(_useState5, 2),
-    showCrop = _useState6[0],
-    setShowCrop = _useState6[1];
-  var _useState7 = useState(CROP_TYPE['AUTO']),
-    _useState8 = _slicedToArray(_useState7, 2),
-    cropType = _useState8[0],
-    setCropType = _useState8[1];
+    cropType = _useState6[0],
+    setCropType = _useState6[1];
 
   // 自动截图相关参数
+  var _useState7 = useState([]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    odList = _useState8[0],
+    setOdList = _useState8[1];
   var _useState9 = useState([]),
     _useState10 = _slicedToArray(_useState9, 2),
-    odList = _useState10[0],
-    setOdList = _useState10[1];
-  var _useState11 = useState([]),
+    extendOdList = _useState10[0],
+    setExtendOdList = _useState10[1];
+  var _useState11 = useState(null),
     _useState12 = _slicedToArray(_useState11, 2),
-    extendOdList = _useState12[0],
-    setExtendOdList = _useState12[1];
-  var _useState13 = useState(null),
-    _useState14 = _slicedToArray(_useState13, 2),
-    selectRectId = _useState14[0],
-    setSelectRectId = _useState14[1];
+    selectRectId = _useState12[0],
+    setSelectRectId = _useState12[1];
 
   // 定位按钮相关参数
   var alginContainerRef = useRef(null);
   var alignRef = useRef(null);
-  var _useState15 = useState(null),
-    _useState16 = _slicedToArray(_useState15, 2),
-    cropRect = _useState16[0],
-    setCropRect = _useState16[1];
+  var _useState13 = useState(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    cropRect = _useState14[0],
+    setCropRect = _useState14[1];
 
   // 选中的版本号
-  var _useState17 = useState(null),
-    _useState18 = _slicedToArray(_useState17, 2),
-    selectAlgorithmVersion = _useState18[0],
-    setSelectAlgorithmVersion = _useState18[1];
+  var _useState15 = useState(null),
+    _useState16 = _slicedToArray(_useState15, 2),
+    selectAlgorithmVersion = _useState16[0],
+    setSelectAlgorithmVersion = _useState16[1];
   var handlerCropStartRef = useRef(null);
   var handlerCropEndRef = useRef(null);
   var handleShapeSelectRef = useRef(null);
@@ -185,6 +185,8 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
       cropInsRef.current = null;
     };
   }, [isImgReady, showCrop, cropType, imageKey]);
+
+  // 初始化页面的绘制矩形
   var initData = function initData(_objects) {
     var imgIns = imgInsRef.current;
     var _odRect = odRect;
@@ -210,7 +212,7 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
         var shapeList = odList.map(function (rect) {
           return _objectSpread(_objectSpread({}, rect), {}, {
             selectAble: true,
-            id: rect['id'],
+            id: ['id'],
             algorithmVersion: rect.algorithmVersion
           });
         });
@@ -223,28 +225,49 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
         });
         setExtendOdList(extendRect);
         imgIns.replaceShape(shapeList);
-        handleShapeSelectRef.current = addEventListenerWrapper(imgContainerRef.current, 'shape-select', function (e) {
-          var id = e.detail;
-          setSelectRectId(id);
-          var selectShape = shapeList.find(function (v) {
-            return v['id'] === id;
-          });
-          if (selectShape) {
-            setSelectAlgorithmVersion(selectShape['algorithmVersion']);
-            //换算成屏幕坐标
-            var axisRect = imgIns.imgRectAxisToCanvasAxisRect(selectShape);
-            var _rect = {
-              x: axisRect.x2 > axisRect.x ? axisRect.x : axisRect.x2,
-              y: axisRect.y2 > axisRect.y ? axisRect.y : axisRect.y2,
-              w: Math.abs(axisRect.x2 - axisRect.x),
-              h: Math.abs(axisRect.y2 - axisRect.y)
-            };
-            setCropRect(_rect);
-          } else {
-            // @ts-ignore
-            setCropRect(null);
-          }
-        });
+        // 框选监听事件
+        handleShapeSelectRef.current = addEventListenerWrapper(imgContainerRef.current, 'shape-select', /*#__PURE__*/function () {
+          var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
+            var id, selectShape, axisRect, _rect2;
+            return _regeneratorRuntime().wrap(function _callee$(_context) {
+              while (1) switch (_context.prev = _context.next) {
+                case 0:
+                  id = e.detail;
+                  setSelectRectId(id);
+                  selectShape = shapeList.find(function (v) {
+                    return v['id'] === id;
+                  });
+                  if (selectShape) {
+                    setSelectAlgorithmVersion(selectShape['algorithmVersion']);
+                    //换算成屏幕坐标
+                    axisRect = imgIns.imgRectAxisToCanvasAxisRect(selectShape);
+                    _rect2 = {
+                      x: axisRect.x2 > axisRect.x ? axisRect.x : axisRect.x2,
+                      y: axisRect.y2 > axisRect.y ? axisRect.y : axisRect.y2,
+                      w: Math.abs(axisRect.x2 - axisRect.x),
+                      h: Math.abs(axisRect.y2 - axisRect.y)
+                    };
+                    setCropRect(_rect2);
+                    onDraw === null || onDraw === void 0 || onDraw({
+                      rectList: [_rect2],
+                      extendRectList: [_rect2],
+                      imgKey: imageKey,
+                      selectIndex: id
+                    });
+                  } else {
+                    // @ts-ignore
+                    setCropRect(null);
+                  }
+                case 4:
+                case "end":
+                  return _context.stop();
+              }
+            }, _callee);
+          }));
+          return function (_x) {
+            return _ref.apply(this, arguments);
+          };
+        }());
       };
       // @ts-ignore
       var rect = getOdRect({
@@ -263,18 +286,41 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
         setSelectAlgorithmVersion(null);
         setCropRect(null);
       });
-      handlerCropEndRef.current = addEventListenerWrapper(imgContainerRef.current, EVENT_CROP_END, function (event) {
-        var _alignRef$current, _alignRef$current$for;
-        var data = event.detail;
-        setSelectAlgorithmVersion(null);
-        setCropRect({
-          x: data.left,
-          y: data.top,
-          w: data.width,
-          h: data.height
-        });
-        alignRef === null || alignRef === void 0 || (_alignRef$current = alignRef.current) === null || _alignRef$current === void 0 || (_alignRef$current$for = _alignRef$current.forceAlign) === null || _alignRef$current$for === void 0 || _alignRef$current$for.call(_alignRef$current);
-      });
+      handlerCropEndRef.current = addEventListenerWrapper(imgContainerRef.current, EVENT_CROP_END, /*#__PURE__*/function () {
+        var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(event) {
+          var _alignRef$current, _alignRef$current$for;
+          var data, _rect, _cropData;
+          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+            while (1) switch (_context2.prev = _context2.next) {
+              case 0:
+                data = event.detail;
+                setSelectAlgorithmVersion(null);
+                _rect = {
+                  x: data.left,
+                  y: data.top,
+                  w: data.width,
+                  h: data.height
+                };
+                setCropRect(_rect);
+                _context2.next = 6;
+                return getCropInfo({
+                  type: cropType,
+                  rect: _rect
+                });
+              case 6:
+                _cropData = _context2.sent;
+                onDraw === null || onDraw === void 0 || onDraw(_cropData);
+                alignRef === null || alignRef === void 0 || (_alignRef$current = alignRef.current) === null || _alignRef$current === void 0 || (_alignRef$current$for = _alignRef$current.forceAlign) === null || _alignRef$current$for === void 0 || _alignRef$current$for.call(_alignRef$current);
+              case 9:
+              case "end":
+                return _context2.stop();
+            }
+          }, _callee2);
+        }));
+        return function (_x2) {
+          return _ref2.apply(this, arguments);
+        };
+      }());
       cropInsRef.current = new Cropper(imgContainerRef.current, {
         showMask: true,
         viewer: imgIns
@@ -283,26 +329,25 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
   };
 
   //  获取框选的截图框信息
-  var latestCropType = useLatest(cropType);
-  var latestCropRect = useLatest(cropRect);
   var getCropInfo = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(cb) {
-      var cropType, cropRect, imgIns, transform, newImgKey, rectList, extendRectList, selectIndex, shapes, shapeIds, newRect, _data;
-      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5(opt) {
+      var type, rect, cropType, cropRect, imgIns, transform, newImgKey, rectList, extendRectList, selectIndex, shapes, shapeIds, newRect, _data, data;
+      return _regeneratorRuntime().wrap(function _callee5$(_context5) {
+        while (1) switch (_context5.prev = _context5.next) {
           case 0:
-            cropType = latestCropType.current;
-            cropRect = latestCropRect.current;
+            type = opt.type, rect = opt.rect;
+            cropType = type;
+            cropRect = rect;
             imgIns = imgInsRef.current;
             transform = imgIns.targetTransform;
             newImgKey = imageKey;
             rectList = [];
             extendRectList = [];
             selectIndex = 0;
-            _context3.t0 = cropType;
-            _context3.next = _context3.t0 === CROP_TYPE['AUTO'] ? 11 : 17;
+            _context5.t0 = cropType;
+            _context5.next = _context5.t0 === CROP_TYPE['AUTO'] ? 12 : 18;
             break;
-          case 11:
+          case 12:
             shapes = imgIns.getSelectShape();
             shapeIds = shapes.map(function (v) {
               return v['id'];
@@ -331,8 +376,8 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
             selectIndex = rectList.findIndex(function (v) {
               return v['id'] === selectRectId;
             });
-            return _context3.abrupt("break", 22);
-          case 17:
+            return _context5.abrupt("break", 23);
+          case 18:
             //获取旋转过的坐标
             // @ts-ignore
             newRect = getTransformRect(imgIns.image, transform, cropRect); //判断是不是旋转过
@@ -342,40 +387,40 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
             }
             rectList.push(newRect);
             extendRectList.push(newRect);
-            return _context3.abrupt("break", 22);
-          case 22:
-            _context3.next = 24;
+            return _context5.abrupt("break", 23);
+          case 23:
+            _context5.next = 25;
             return Promise.all(extendRectList.map( /*#__PURE__*/function () {
-              var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(rect, index) {
+              var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(rect, index) {
                 var file, imgKey;
-                return _regeneratorRuntime().wrap(function _callee$(_context) {
-                  while (1) switch (_context.prev = _context.next) {
+                return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+                  while (1) switch (_context3.prev = _context3.next) {
                     case 0:
-                      _context.next = 2;
+                      _context3.next = 2;
                       return getFileByRect(imgIns.image, rect);
                     case 2:
-                      file = _context.sent;
+                      file = _context3.sent;
                       imgKey = file;
                       extendRectList[index] = _objectSpread(_objectSpread({}, rect), {}, {
                         imgKey: imgKey
                       });
                     case 5:
                     case "end":
-                      return _context.stop();
+                      return _context3.stop();
                   }
-                }, _callee);
+                }, _callee3);
               }));
-              return function (_x2, _x3) {
-                return _ref2.apply(this, arguments);
+              return function (_x4, _x5) {
+                return _ref4.apply(this, arguments);
               };
             }()));
-          case 24:
-            _context3.next = 26;
+          case 25:
+            _context5.next = 27;
             return Promise.all(rectList.map( /*#__PURE__*/function () {
-              var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(rect, index) {
+              var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(rect, index) {
                 var faceCorrectImage, faceCorrectImageKey, base64, blobData, file, newRect;
-                return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-                  while (1) switch (_context2.prev = _context2.next) {
+                return _regeneratorRuntime().wrap(function _callee4$(_context4) {
+                  while (1) switch (_context4.prev = _context4.next) {
                     case 0:
                       faceCorrectImage = rect['faceCorrectImage'];
                       if (faceCorrectImage) {
@@ -391,35 +436,30 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
                       rectList[index] = newRect;
                     case 5:
                     case "end":
-                      return _context2.stop();
+                      return _context4.stop();
                   }
-                }, _callee2);
+                }, _callee4);
               }));
-              return function (_x4, _x5) {
-                return _ref3.apply(this, arguments);
+              return function (_x6, _x7) {
+                return _ref5.apply(this, arguments);
               };
             }()));
-          case 26:
-            cb === null || cb === void 0 || cb({
+          case 27:
+            data = {
               rectList: rectList,
               extendRectList: extendRectList,
               selectIndex: selectIndex,
               imgKey: newImgKey
-            });
-            return _context3.abrupt("return", {
-              rectList: rectList,
-              extendRectList: extendRectList,
-              selectIndex: selectIndex,
-              imgKey: newImgKey
-            });
-          case 28:
+            };
+            return _context5.abrupt("return", data);
+          case 29:
           case "end":
-            return _context3.stop();
+            return _context5.stop();
         }
-      }, _callee3);
+      }, _callee5);
     }));
-    return function getCropInfo(_x) {
-      return _ref.apply(this, arguments);
+    return function getCropInfo(_x3) {
+      return _ref3.apply(this, arguments);
     };
   }();
 
@@ -439,23 +479,14 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
   };
 
   // ============================= attact img =========================
-  var _useState19 = useState(0),
+  var _useState17 = useState(0),
+    _useState18 = _slicedToArray(_useState17, 2),
+    selectAttachImgIndex = _useState18[0],
+    setSelectAttachImgIndex = _useState18[1];
+  var _useState19 = useState(false),
     _useState20 = _slicedToArray(_useState19, 2),
-    selectAttachImgIndex = _useState20[0],
-    setSelectAttachImgIndex = _useState20[1];
-  var _useState21 = useState(false),
-    _useState22 = _slicedToArray(_useState21, 2),
-    isZoomin = _useState22[0],
-    setIsZoomin = _useState22[1];
-
-  /**
-   * 修改当前图片预览下标
-   * @param diff 跳转强度 正向后翻、负值向前翻
-   */
-  var handleChangeIndex = function handleChangeIndex(cb) {
-    if (!imageKey) return;
-    cb === null || cb === void 0 || cb();
-  };
+    isZoomin = _useState20[0],
+    setIsZoomin = _useState20[1];
 
   // ============================== Ref ===============================
   useImperativeHandle(ref, function () {
@@ -463,8 +494,7 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
       imgInsRef: imgInsRef,
       setShowCrop: setShowCrop,
       initData: initData,
-      getCropInfo: getCropInfo,
-      handleChangeIndex: handleChangeIndex
+      getCropInfo: getCropInfo
     };
   });
   return /*#__PURE__*/React.createElement("div", {
@@ -475,13 +505,14 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
     }
   }, imageKey ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: classNames("".concat(componentName, "-main"), cropType === CROP_TYPE['AUTO'] && "".concat(componentName, "-main--cursor")),
-    ref: init
+    ref: imgContainerRef
+    // style={{ width: width, height: height }}
   }), !hideLeftTopBtn && /*#__PURE__*/React.createElement(BtnGroup, {
     className: classNames("".concat(componentName, "-opt")),
     dataSource: operateBtnDataSource,
     onClick: handleOptClick,
     placement: "left"
-  }), showCrop && /*#__PURE__*/React.createElement(BtnGroup, {
+  }), !hideTypeBtns && showCrop && /*#__PURE__*/React.createElement(BtnGroup, {
     circle: true,
     className: classNames("".concat(componentName, "-crop-opt")),
     dataSource: cropBtnDataSource,
@@ -515,8 +546,8 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
     className: classNames("".concat(componentName, "-attach"), isZoomin && "".concat(componentName, "-attach--zoomin"), "".concat(componentName, "-attach--fixed"), isZoomin && "".concat(componentName, "-attach--zoomin--fixed"))
   }, /*#__PURE__*/React.createElement("div", {
     className: classNames("".concat(componentName, "-attach__tab"))
-  }, showAttachImgLabel ? attachImg === null || attachImg === void 0 ? void 0 : attachImg.map(function (_ref4, index) {
-    var label = _ref4.label;
+  }, showAttachImgLabel ? attachImg === null || attachImg === void 0 ? void 0 : attachImg.map(function (_ref6, index) {
+    var label = _ref6.label;
     return /*#__PURE__*/React.createElement("div", {
       key: index,
       className: classNames("".concat(componentName, "-attach__tab-item"), selectAttachImgIndex === index && "".concat(componentName, "-attach__tab-item--select")),
@@ -550,15 +581,25 @@ export var BigImagePreview = /*#__PURE__*/React.forwardRef(function (props, ref)
     draggable: "false",
     className: classNames("".concat(componentName, "-attach__img"), "".concat(componentName, "-attach__img--fixed")),
     src: get(attachImg, "".concat(selectAttachImgIndex, ".url"), '')
-  })), showScore && /*#__PURE__*/React.createElement("div", {
+  })), (showScore || score) && /*#__PURE__*/React.createElement("div", {
     style: {
       bottom: 20
     },
     className: classNames("".concat(componentName, "__face-score"))
-  }, "\u4EBA\u8138\u8D28\u91CF\u5206\uFF1A".concat(Number(score).toFixed(2)))) : /*#__PURE__*/React.createElement(Empty, {
+  }, "\u4EBA\u8138\u8D28\u91CF\u5206\uFF1A".concat(Number(score).toFixed(2)))) : /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: '100%',
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center'
+    }
+  }, customEmpty || /*#__PURE__*/React.createElement(Empty, {
+    style: {
+      margin: 0
+    },
     image: Empty.PRESENTED_IMAGE_SIMPLE,
     description: "\u6682\u65E0\u6570\u636E"
-  }));
+  })));
 });
 BigImagePreview.displayName = 'BigImagePreview';
 export default BigImagePreview;
\ No newline at end of file
diff --git a/packages/meta/es/BigImagePreview/bigImagePreviewHelper.js b/packages/meta/es/BigImagePreview/bigImagePreviewHelper.js
index e69de29..05600e3 100644
--- a/packages/meta/es/BigImagePreview/bigImagePreviewHelper.js
+++ b/packages/meta/es/BigImagePreview/bigImagePreviewHelper.js
@@ -0,0 +1,270 @@
+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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _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 { cloneDeep, dataURLToBlob, get, isNull } from "@zhst/func";
+var proto = {
+  Common: {
+    AlgorithmVersion: {
+      VERSION_REID_HEAD_ATTR: '形体',
+      VERSION_FACE: '人脸',
+      VERSION_NON_MOTOR_VEHICLE: '非机动车'
+    }
+  }
+};
+export var ALGORITHM_VERSION = _defineProperty(_defineProperty(_defineProperty({}, '7', '形体'), '4', '人脸'), '6', '非机动车');
+export var algorithmVersions = _toConsumableArray(Object.keys(ALGORITHM_VERSION));
+/**
+ *  格式化工具
+ * @param originData
+ * @returns
+ */
+export var getOdRect = function getOdRect(originData) {
+  var data = get(originData, 'objects', []).filter(function (v) {
+    return !isNull(get(v, 'bboxRatio')) || get(v, 'objectIndex.objectId') !== '0';
+  }).map(function (v, index) {
+    var rect = get(v, 'bboxRatio');
+    var extendBox = get(v, 'extendBoxRatio');
+    var frameTimestamp = get(v, 'timestamp'); //时间戳创建档案的时候需要
+    var qualityScore = get(v, 'qualityScore');
+    var algorithmVersion = get(v, 'objectType') === 'OBJECT_TYPE_PEDESTRAIN' ? 'VERSION_REID_HEAD_ATTR' : get(v, 'objectType') === 'OBJECT_TYPE_FACE' ? 'VERSION_FACE' : 'VERSION_REID_HEAD_ATTR';
+    var objectRectIndex = algorithmVersion === 'VERSION_FACE' ? 0 : 1;
+    var objectType = get(v, 'objectType');
+    var objectId = get(v, 'objectIndex.objectId');
+    var sourceObjectId = get(v, 'sourceObjectId');
+    return {
+      x: rect.x,
+      y: rect.y,
+      w: rect.w,
+      h: rect.h,
+      id: index,
+      qualityScore: qualityScore,
+      algorithmVersion: algorithmVersion,
+      objectRectIndex: objectRectIndex,
+      objectType: objectType,
+      objectId: objectId,
+      frameTimestamp: frameTimestamp,
+      sourceObjectId: sourceObjectId,
+      extendBox: extendBox
+    };
+  });
+  return data;
+};
+export var getNormalization = function getNormalization(srcRect, maxW, maxH) {
+  var newRect = _objectSpread({}, srcRect);
+  newRect.x = srcRect.x / maxW;
+  newRect.y = srcRect.y / maxH;
+  newRect.w = srcRect.w / maxW;
+  newRect.h = srcRect.h / maxH;
+  if (newRect.x + newRect.w > 1) {
+    newRect.w = 1 - newRect.x;
+  }
+  if (newRect.y + newRect.h > 1) {
+    newRect.h = 1 - newRect.y;
+  }
+  return newRect;
+};
+//传入od框 穿出 od扩展框
+export var getExtendRect = function getExtendRect(normalizationRect, imgW, imgH, type) {
+  var rect = {
+    x: normalizationRect.x * imgW,
+    y: normalizationRect.y * imgH,
+    w: normalizationRect.w * imgW,
+    h: normalizationRect.h * imgH
+  };
+  var newRect;
+  if (type === proto.Common.AlgorithmVersion.VERSION_NON_MOTOR_VEHICLE) {
+    newRect = getBikeExtendRect(rect, imgW);
+  } else {
+    newRect = getOtherExtendRect(rect, imgW, imgH, type);
+  }
+  newRect = getNormalization(newRect, imgW, imgH);
+  return newRect;
+};
+export var getBikeExtendRect = function getBikeExtendRect(rect, maxW) {
+  var newRect = _objectSpread({}, rect);
+  //向上扩大一倍
+  var oldY = cloneDeep(rect.y);
+  newRect.y = newRect.y - newRect.h < 0 ? 0 : newRect.y - newRect.h;
+  newRect.h += oldY - newRect.y;
+  var newX = Math.round(newRect.x - newRect.w * 0.15);
+  if (newX < 0) {
+    newX = 0;
+  }
+  var newW = newRect.x - newX + newRect.w + Math.round(newRect.w * 0.15);
+  if (newX + newW > maxW) {
+    newW = maxW - newX;
+  }
+  newRect.x = newX;
+  newRect.w = newW;
+  return newRect;
+};
+export var getOtherExtendRect = function getOtherExtendRect(srcRect, maxW, maxH, type) {
+  var wExtendRadio = 0.25;
+  var upExtendRadio = 0.25;
+  var downExtendRadio = 0.25;
+  var fixPersonExtend = true;
+  var nx = 0;
+  var nw = 0;
+  nx = srcRect.x - Math.round(srcRect.w * wExtendRadio);
+  if (nx < 0) {
+    nx = 0;
+  }
+  nw = srcRect.x - nx + srcRect.w + Math.round(srcRect.w * wExtendRadio);
+  if (nx + nw > maxW) {
+    nw = maxW - nx;
+  }
+  var ny = 0;
+  var nh = 0;
+  ny = srcRect.y - Math.round(upExtendRadio * srcRect.h);
+  if (ny < 0) {
+    ny = 0;
+  }
+  nh = srcRect.y - ny + srcRect.h + Math.round(srcRect.h * downExtendRadio);
+  if (ny + nh > maxH) {
+    nh = maxH - ny;
+  }
+  var newRect = {
+    x: nx,
+    y: ny,
+    w: nw,
+    h: nh
+  };
+  if ((type === proto.Common.AlgorithmVersion.VERSION_REID_HEAD_ATTR || type === proto.Common.AlgorithmVersion.VERSION_FACE) && fixPersonExtend) {
+    var fixW = Math.round(nh * 0.75);
+    if (nw < fixW) {
+      // 应该扩展宽度
+      var newX = nx + Math.round(nw / 2.0 - 0.5 * fixW);
+      if (newX < 0) {
+        newX = 0;
+      }
+      var newW = fixW;
+      if (newW + newX > maxW) {
+        newW = maxW - newX;
+      }
+      newRect = {
+        x: newX,
+        y: ny,
+        w: newW,
+        h: nh
+      };
+    } else if (nw > fixW) {
+      // 应该扩展高度
+      var fixH = Math.round(nw * 1.333);
+      var newY = ny + Math.round(nh / 2.0 - 0.5 * fixH);
+      if (newY < 0) {
+        newY = 0;
+      }
+      var newH = fixH;
+      if (newY + newH > maxH) {
+        newH = maxH - newY;
+      }
+      newRect = {
+        x: nx,
+        y: newY,
+        w: nw,
+        h: newH
+      };
+    }
+  }
+  return newRect;
+};
+export var getTransformRect = function getTransformRect(image, transform, rect) {
+  var canvasRect = {
+    x: rect.x,
+    y: rect.y,
+    x2: rect.x + rect.w,
+    y2: rect.h + rect.y
+  };
+  //1.转成缩放前的坐标
+  var translateX = transform.translateX,
+    translateY = transform.translateY,
+    scale = transform.scale,
+    rotate = transform.rotate;
+  var originAxisRect = {
+    x: (canvasRect.x - translateX) / scale,
+    y: (canvasRect.y - translateY) / scale,
+    x2: (canvasRect.x2 - translateX) / scale,
+    y2: (canvasRect.y2 - translateY) / scale
+  };
+  //2.转成图片坐标
+  //不考虑旋转 图片原点就是坐标原点
+  var imgAxisRect = originAxisRect;
+  //但是旋转90度后图片不在坐标原点 加上这部分diff
+  if (rotate % 180 !== 0) {
+    //90度调整偏移量
+    var offsetX = -(image.height - image.width) / 2;
+    var offsetY = -(image.width - image.height) / 2;
+    imgAxisRect = {
+      x: originAxisRect.x - offsetX,
+      y: originAxisRect.y - offsetY,
+      x2: originAxisRect.x2 - offsetX,
+      y2: originAxisRect.y2 - offsetY
+    };
+  }
+  //3.限制框不要超出图片
+  var imgW = image.width;
+  var imgH = image.height;
+  if (rotate % 180 !== 0) {
+    var _ref = [imgH, imgW];
+    imgW = _ref[0];
+    imgH = _ref[1];
+  }
+  imgAxisRect.x = Math.min(imgW, Math.max(imgAxisRect.x, 0));
+  imgAxisRect.y = Math.min(imgH, Math.max(imgAxisRect.y, 0));
+  imgAxisRect.x2 = Math.min(imgW, Math.max(imgAxisRect.x2, 0));
+  imgAxisRect.y2 = Math.min(imgH, Math.max(imgAxisRect.y2, 0));
+  //获取归一化坐标
+  var endRect = {
+    x: imgAxisRect.x2 > imgAxisRect.x ? imgAxisRect.x : imgAxisRect.x2,
+    y: imgAxisRect.y2 > imgAxisRect.y ? imgAxisRect.y : imgAxisRect.y2,
+    w: Math.abs(imgAxisRect.x2 - imgAxisRect.x),
+    h: Math.abs(imgAxisRect.y2 - imgAxisRect.y)
+  };
+  return getNormalization(endRect, imgW, imgH);
+};
+
+//旋转图片后转成file 对象
+export var getRotateImg = function getRotateImg(image, rotate) {
+  var _commonCanvas$parentN;
+  var imgW = image.width;
+  var imgH = image.height;
+  if (rotate % 180 !== 0) {
+    var _ref2 = [imgH, imgW];
+    imgW = _ref2[0];
+    imgH = _ref2[1];
+  }
+  var commonCanvas = document.createElement('canvas');
+  commonCanvas.width = imgW;
+  commonCanvas.height = imgH;
+  commonCanvas.style.display = 'none';
+  document.body.appendChild(commonCanvas);
+  var commonCtx = commonCanvas.getContext('2d');
+  //移动到图片中心 旋转
+
+  commonCtx === null || commonCtx === void 0 || commonCtx.save();
+  if (rotate % 180 !== 0) {
+    //90度调整偏移量
+    commonCtx === null || commonCtx === void 0 || commonCtx.translate((image.height - image.width) / 2, (image.width - image.height) / 2);
+  }
+  commonCtx === null || commonCtx === void 0 || commonCtx.translate(image.width / 2, image.height / 2);
+  commonCtx === null || commonCtx === void 0 || commonCtx.rotate(rotate / 180 * Math.PI);
+  commonCtx === null || commonCtx === void 0 || commonCtx.translate(-image.width / 2, -image.height / 2);
+  commonCtx === null || commonCtx === void 0 || commonCtx.drawImage(image, 0, 0);
+  commonCtx === null || commonCtx === void 0 || commonCtx.restore();
+  var dataUrl = commonCanvas.toDataURL('image/jpeg');
+  var blobData = dataURLToBlob(dataUrl);
+  var file = new window.File([blobData], "".concat(new Date().getTime()), {
+    type: 'image/jpeg'
+  });
+  (_commonCanvas$parentN = commonCanvas.parentNode) === null || _commonCanvas$parentN === void 0 || _commonCanvas$parentN.removeChild(commonCanvas);
+  return file;
+};
\ No newline at end of file
diff --git a/packages/meta/es/BigImagePreview/index.less b/packages/meta/es/BigImagePreview/index.less
index 829ebe1..7c8f030 100644
--- a/packages/meta/es/BigImagePreview/index.less
+++ b/packages/meta/es/BigImagePreview/index.less
@@ -2,6 +2,7 @@
   position: relative;
   width: calc(100%);
   height: 100%;
+  font-size: 0;
 
   &__face-score {
     position: absolute;
@@ -62,14 +63,9 @@
     height: 202px;
     transition: all 200ms;
 
-    &--fixed {
-    }
 
     &--zoomin {
       height: 100%;
-
-      &--fixed {
-      }
     }
 
     &__tab {
diff --git a/packages/meta/es/ImageEditor/cropper/event.js b/packages/meta/es/ImageEditor/cropper/event.js
index bd8219c..3d3893a 100644
--- a/packages/meta/es/ImageEditor/cropper/event.js
+++ b/packages/meta/es/ImageEditor/cropper/event.js
@@ -34,7 +34,7 @@ export default {
       try {
         handler.remove();
       } catch (error) {
-        warn('CROP:REMOVE_EVENT_FAIL,', error);
+        warn('CROP:REMOVE_EVENT_FAIL: ', error);
       }
     }
   },
diff --git a/packages/meta/es/VideoPlayer/VideoPlayer.js b/packages/meta/es/VideoPlayer/VideoPlayer.js
index cc67c55..efae045 100644
--- a/packages/meta/es/VideoPlayer/VideoPlayer.js
+++ b/packages/meta/es/VideoPlayer/VideoPlayer.js
@@ -46,7 +46,9 @@ var VideoPlayer = /*#__PURE__*/forwardRef(function (props, ref) {
     screenshotButtonRender = _props$screenshotButt2 === void 0 ? function () {
       return /*#__PURE__*/React.createElement("div", {
         style: {
-          color: '#fff'
+          color: '#fff',
+          width: '80px',
+          top: 0
         }
       }, "\u56DE\u8C03DOM");
     } : _props$screenshotButt2,
diff --git a/packages/meta/es/utils/constants.js b/packages/meta/es/utils/constants.js
index e2357aa..af17f9b 100644
--- a/packages/meta/es/utils/constants.js
+++ b/packages/meta/es/utils/constants.js
@@ -1,5 +1,5 @@
 export var CROP_TYPE = {
-  CUSTOM: 'CSUTOM',
+  CUSTOM: 'CUSTOM',
   AUTO: 'AUTO'
 };
 export var defaultAlignOption = {
diff --git a/packages/meta/package.json b/packages/meta/package.json
index b495f36..7d9cae3 100644
--- a/packages/meta/package.json
+++ b/packages/meta/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@zhst/meta",
-  "version": "0.8.5",
+  "version": "0.9.1",
   "description": "原子组件",
   "keywords": [
     "meta",
diff --git a/packages/meta/src/BigImagePreview/BigImagePreview.tsx b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
index c04928f..b531541 100644
--- a/packages/meta/src/BigImagePreview/BigImagePreview.tsx
+++ b/packages/meta/src/BigImagePreview/BigImagePreview.tsx
@@ -90,6 +90,15 @@ export interface ImgViewProps extends React.HTMLAttributes<HTMLElement> {
   }) => void
   showScore?: boolean // 是否显示相似度
   viewOption?: ViewOption;
+  onRectSelect?: (data: {
+    rectList: any[];
+    extendRectList: any[];
+    selectIndex: number;
+    imgKey: string;
+  }) => void
+  type?: 'CUSTOM' | 'AUTO'
+  hideTypeBtns?: boolean
+  customEmpty?: any
 }
 export interface ImgViewRef {
   /* 图片实例 */
@@ -146,7 +155,10 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
     screenshotButtonRender = () => <div style={{ color: '#fff', width: '80px', top: 0, fontSize: 12 }}>回调DOM</div>,
     hideLeftTopBtn = true,
     onDraw,
-    viewOption = {}
+    viewOption = {},
+    type,
+    hideTypeBtns,
+    customEmpty,
   } = props;
   const {
     imageKey,
@@ -204,7 +216,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
   // 手动截图相关参数
   const cropInsRef: any = useRef(null);
   const [showCrop, setShowCrop] = useState(showOpt);
-  const [cropType, setCropType] = useState(CROP_TYPE['AUTO']);
+  const [cropType, setCropType] = useState(type || CROP_TYPE['AUTO']);
 
   // 自动截图相关参数
   const [odList, setOdList] = useState<any>([]);
@@ -259,7 +271,8 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
         const shapeList = odList.map((rect: { [x: string]: any; algorithmVersion: any; }) => ({
           ...rect,
           selectAble: true,
-          id: rect['id'],
+          id:
+            ['id'],
           algorithmVersion: rect.algorithmVersion,
         }));
         imgIns.replaceShape(shapeList);
@@ -271,7 +284,8 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
         });
         setExtendOdList(extendRect);
         imgIns.replaceShape(shapeList);
-        handleShapeSelectRef.current = addEventListenerWrapper(imgContainerRef.current, 'shape-select', (e: { detail: any; }) => {
+        // 框选监听事件
+        handleShapeSelectRef.current = addEventListenerWrapper(imgContainerRef.current, 'shape-select', async (e: { detail: any; }) => {
           const id = e.detail;
           setSelectRectId(id);
           const selectShape = shapeList.find((v: { [x: string]: any; }) => v['id'] === id);
@@ -286,6 +300,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
               h: Math.abs(axisRect.y2 - axisRect.y),
             };
             setCropRect(rect);
+            onDraw?.({ rectList: [rect], extendRectList: [rect], imgKey: imageKey, selectIndex: id })
           } else {
             // @ts-ignore
             setCropRect(null);
@@ -457,6 +472,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
               cropType === CROP_TYPE['AUTO'] && `${componentName}-main--cursor`
             )}
             ref={imgContainerRef}
+            // style={{ width: width, height: height }}
           />
           {/* 图片操作 */}
           {!hideLeftTopBtn && (
@@ -467,7 +483,7 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
               placement="left"
             />
           )}
-          {showCrop && (
+          {!hideTypeBtns && showCrop && (
             <BtnGroup
               circle
               className={classNames(`${componentName}-crop-opt`)}
@@ -577,7 +593,9 @@ export const BigImagePreview = React.forwardRef<ImgViewRef, ImgViewProps>((props
           </div>}
         </>
         :
-        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据" />
+        <div style={{ height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+          {customEmpty || <Empty style={{ margin: 0 }} image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据" />}
+        </div>
       }
     </div>
   );
diff --git a/packages/meta/src/BigImagePreview/demo/base.tsx b/packages/meta/src/BigImagePreview/demo/base.tsx
index 2b1181b..75197ad 100644
--- a/packages/meta/src/BigImagePreview/demo/base.tsx
+++ b/packages/meta/src/BigImagePreview/demo/base.tsx
@@ -1,6 +1,6 @@
 
 import React, { useRef } from 'react';
-import { Button, Space } from '@zhst/meta'
+import { Button, ImgViewRef, Space } from '@zhst/meta'
 import { BigImagePreview } from '@zhst/meta'
 
 
@@ -41,18 +41,17 @@ const props = {
           },
         },
     ]
-  }
+  },
 }
 
 export default () => {
-  const imgRef = useRef(null)
+  const imgRef = useRef<ImgViewRef>(null)
 
   return (
     <Space size={[8, 16]} direction="vertical">
       <BigImagePreview {...props} ref={imgRef} />
       <Space>
         <Button type="primary" onClick={() => imgRef.current?.setShowCrop(true)}>编辑</Button>
-        <Button onClick={() => imgRef.current?.handleChangeIndex(1)}>下一张</Button>
         <Button onClick={() => imgRef.current?.setShowCrop(false)}>取消</Button>
       </Space>
     </Space>
diff --git a/packages/meta/src/BigImagePreview/demo/empty.tsx b/packages/meta/src/BigImagePreview/demo/empty.tsx
new file mode 100644
index 0000000..3f83414
--- /dev/null
+++ b/packages/meta/src/BigImagePreview/demo/empty.tsx
@@ -0,0 +1,28 @@
+
+import React, { useRef } from 'react';
+import { Button, ImgViewRef, Space } from '@zhst/meta'
+import { BigImagePreview } from '@zhst/meta'
+
+
+const props = {
+  height: '320px',
+  width: '640px',
+  data: {
+      imageKey: '',
+  },
+}
+
+// FIXME：需要优化 props
+export default () => {
+  const imgRef = useRef<ImgViewRef>(null)
+
+  return (
+    <Space size={[8, 16]} direction="vertical" style={{ border: '1px solid #ccc' }}>
+      <BigImagePreview {...props} type="CUSTOM" hideTypeBtns ref={imgRef} />
+      <Space>
+        <Button type="primary" onClick={() => imgRef.current?.setShowCrop(true)}>编辑</Button>
+        <Button onClick={() => imgRef.current?.setShowCrop(false)}>取消</Button>
+      </Space>
+    </Space>
+  )
+}
diff --git a/packages/meta/src/BigImagePreview/demo/noAttach.tsx b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
index d89a855..f5f6244 100644
--- a/packages/meta/src/BigImagePreview/demo/noAttach.tsx
+++ b/packages/meta/src/BigImagePreview/demo/noAttach.tsx
@@ -2,10 +2,12 @@
 import React, { useRef } from 'react';
 import { Button, Space } from '@zhst/meta'
 import { BigImagePreview } from '@zhst/meta'
+import type { ImgViewRef } from '@zhst/meta'
 
 
 const props = {
-  heigth: '500px',
+  height: '320px',
+  width: '640px',
   data: {
       imageKey: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
       odRect:{
@@ -14,18 +16,18 @@ const props = {
       cameraPosition: 'string', // 摄像头位置
       time: '2022-01-01', // 摄像头拍摄时间
   },
-  onDraw: data => console.log('data', data)
+  onDraw: (data: any) => console.log('data', data),
+  hideTypeBtns: true,
 }
 
 export default () => {
-  const imgRef = useRef(null)
+  const imgRef = useRef<ImgViewRef>(null)
 
   return (
     <Space size={[8, 16]} direction="vertical">
-      <BigImagePreview {...props} ref={imgRef} />
+      <BigImagePreview {...props} type="CUSTOM" ref={imgRef} />
       <Space>
         <Button type="primary" onClick={() => imgRef.current?.setShowCrop(true)}>编辑</Button>
-        <Button onClick={() => imgRef.current?.handleChangeIndex(1)}>下一张</Button>
         <Button onClick={() => imgRef.current?.setShowCrop(false)}>取消</Button>
       </Space>
     </Space>
diff --git a/packages/meta/src/BigImagePreview/index.md b/packages/meta/src/BigImagePreview/index.md
index 8e07732..9667973 100644
--- a/packages/meta/src/BigImagePreview/index.md
+++ b/packages/meta/src/BigImagePreview/index.md
@@ -9,15 +9,59 @@ title: BigImagePreview 大图预览组件
 
 <code src="./demo/base.tsx">基本</code>
 <code src="./demo/noAttach.tsx">不展示小图</code>
+<code src="./demo/empty.tsx">空数据</code>
 
 ## API
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
+| data | 当前组件数据对象 | IData（必填） | - |  |
 | imageKey | 当前大图链接 | string（必填） | - |  |
-| odRect | 圈选矩形参数 | { x: number; y: number; w: number; h: number } | - |  |
 | height | 高度 | number（选填） | - |  |
 | width | 宽度 | number（选填） | - |  |
+
+### IData
+
+可以通过组件的 props 获取ts 定义：
+
+```js
+import type { ImgViewProps } from '@zhst/meta'
+
+const data: ImgViewProps['data'] = {
+  imageKey: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
+  odRect:{
+    "x":0.553125,"y":0.29722223,"w":0.048958335,"h":0.2462963
+  },
+  attachImg: [
+    {
+      "url": "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png","label": "形体"
+    },{
+      "url": "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
+      "label": "人脸"
+    }
+  ],
+  score: 0.815207,   // 人脸质量分
+  showScore: true,   // 人脸质量分
+  cameraPosition: 'string', // 摄像头位置
+  time: '2022-01-01', // 摄像头拍摄时间
+  objects: [
+    {
+      "bboxRatio": {
+          "x": 0.5519352,
+          "y": 0.2965385,
+          "w": 0.05185461,
+          "h": 0.24698898
+      },
+    }
+  ]
+}
+```
+
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
+| --- | --- | --- | --- | --- |
+| imageKey | 当前大图链接 | string | - |  |
+| odRect | 初始化OD | { x: number; y: number; w: number; h: number } | - |  |
+| attachImg | 缩略图对象 | { url: string; label: string; }[]（选填） | - |  |
+| objects | 多OD状态列表 | IOdRectOrigin[]（选填） | - |  |
+| objects | 多OD状态列表 | IOdRectOrigin[]（选填） | - |  |
 | score | 相似度 | number（选填） | - |  |
-| attachImg | 缩略图 | { url: string; label: string; }[]（选填） | - |  |
-| objects | 编辑状态参数 | IOdRectOrigin[]（选填） | - |  |
diff --git a/packages/meta/src/ImageEditor/cropper/event.ts b/packages/meta/src/ImageEditor/cropper/event.ts
index 09b4cd6..0d75383 100644
--- a/packages/meta/src/ImageEditor/cropper/event.ts
+++ b/packages/meta/src/ImageEditor/cropper/event.ts
@@ -66,7 +66,7 @@ export default {
       try {
         handler.remove();
       } catch (error) {
-        warn('CROP:REMOVE_EVENT_FAIL,', error);
+        warn('CROP:REMOVE_EVENT_FAIL: ', error);
       }
     }
   },
diff --git a/packages/meta/src/utils/constants.ts b/packages/meta/src/utils/constants.ts
index 3e90a79..a10b628 100644
--- a/packages/meta/src/utils/constants.ts
+++ b/packages/meta/src/utils/constants.ts
@@ -1,5 +1,5 @@
 export const CROP_TYPE = {
-    CUSTOM: 'CSUTOM',
+    CUSTOM: 'CUSTOM',
     AUTO: 'AUTO',
 };
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index aaba8b1..19154b9 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -26,9 +26,6 @@ importers:
       '@umijs/lint':
         specifier: ^4.0.0
         version: 4.1.1(eslint@8.56.0)(stylelint@14.16.1)(typescript@5.3.3)
-      babel-plugin-import:
-        specifier: ^1.13.8
-        version: 1.13.8
       dumi:
         specifier: ^2.2.13
         version: 2.2.17(@babel/core@7.23.7)(@types/node@20.5.1)(@types/react@18.2.48)(eslint@8.56.0)(prettier@2.8.8)(react-dom@18.2.0)(react@18.2.0)(stylelint@14.16.1)(typescript@5.3.3)(webpack@5.89.0)
@@ -89,13 +86,16 @@ importers:
       classnames:
         specifier: ^2.5.1
         version: 2.5.1
+      dayjs:
+        specifier: ^1.11.10
+        version: 1.11.10
       rc-util:
         specifier: ^5.38.1
         version: 5.38.1(react-dom@18.2.0)(react@18.2.0)
     devDependencies:
-      '@types/zhst':
+      '@zhst/types':
         specifier: workspace:^
-        version: link:../zhst-types
+        version: link:../types
 
   packages/constants: {}
 
@@ -6715,12 +6715,6 @@ packages:
       object.assign: 4.1.5
     dev: true
 
-  /babel-plugin-import@1.13.8:
-    resolution: {integrity: sha512-36babpjra5m3gca44V6tSTomeBlPA7cHUynrE2WiQIm3rEGD9xy28MKsx5IdO45EbnpJY7Jrgd00C6Dwt/l/2Q==}
-    dependencies:
-      '@babel/helper-module-imports': 7.22.15
-    dev: true
-
   /babel-plugin-istanbul@6.1.1:
     resolution: {integrity: sha512-Y1IQok9821cC9onCx5otgFfRm7Lm+I+wwxOx738M/WLPZ9Q42m4IG5W0FNX8WLL2gYMZo3JkuXIH2DOpWM+qwA==}
     engines: {node: '>=8'}