feat(material,biz,meta): 修改算法配置物料,树组件业务传参,修复大图组件od变化不重新渲染

2024-07-11 17:42:02 +08:00 · 2024-07-11 17:42:02 +08:00 · 7bde75ea15
commit 7bde75ea15
parent 765f485556
15 changed files with 80 additions and 35 deletions
--- a/packages/biz/CHANGELOG.md
+++ b/packages/biz/CHANGELOG.md
@ -1,5 +1,17 @@
 # @zhst/biz

+## 0.33.2
+
+### Patch Changes
+
+- 修改穿梭框不能修改宽度
+
+## 0.33.1
+
+### Patch Changes
+
+- 修改穿梭框不能修改宽度 bug
+
 ## 0.33.0

 ### Minor Changes
--- a/packages/biz/package.json
+++ b/packages/biz/package.json
@ -1,6 +1,6 @@
 {
  "name": "@zhst/biz",
-  "version": "0.33.0",
+  "version": "0.33.2",
  "description": "业务库",
  "keywords": [
    "business",
--- a/packages/biz/src/treePanel/TreePanel.tsx
+++ b/packages/biz/src/treePanel/TreePanel.tsx
@ -129,7 +129,7 @@ const TreePanel: FC<TreePanelProps> = (props) => {
        open={item.showTooltip}
      >
        {WithDropdown(
-          <Button className={classNames(componentName + '-search-btns-btn')} type={item.type} onClick={item.onClick} icon={item.icon} />,
+          <Button className={classNames(componentName + '-search-btns-btn')} type={item.type} onClick={item.onClick} icon={item.icon} {...item} />,
          item.type === 'dropdown',
          item.dropdownConfig
        )}
@ -148,7 +148,7 @@ const TreePanel: FC<TreePanelProps> = (props) => {
        {/* @ts-ignore */}
        <div key={idx} className={classNames(componentName + '-btns-btn')}>
          {item.icon}
-          <span className={classNames(componentName + '-btns-btn-label', item.className)}>{item.label}</span>
+          <span onClick={item.onClick} className={classNames(componentName + '-btns-btn-label', item.className)}>{item.label}</span>
        </div>
        {idx % 2 !== 0 && (<br/>)}
      </>
--- a/packages/biz/src/treeTransfer/TreeTransfer.tsx
+++ b/packages/biz/src/treeTransfer/TreeTransfer.tsx
@ -156,7 +156,7 @@ const TreeTransfer: React.FC<TreeTransferProps> = (props) => {
    <div className={componentName}>
      <div className={`${componentName}-left`}
        style={{
-          width: parseInt(String(leftPanelWidth)) + 'px',
+          width: typeof leftPanelWidth === 'number' ? leftPanelWidth + 'px' : leftPanelWidth,
          border: bordered ? `1px solid ${token.colorBorder}` : 'unset',
        }}
      >
@ -225,7 +225,7 @@ const TreeTransfer: React.FC<TreeTransferProps> = (props) => {
      </div>
      <div className={`${componentName}-right`}
        style={{
-          width: parseInt(String(rightPanelWidth)) + 'px',
+          width: typeof rightPanelWidth === 'number' ? rightPanelWidth + 'px' : rightPanelWidth,
          border: bordered ? `1px solid ${token.colorBorder}` : 'unset',
        }}
      >
--- a/packages/map/src/demo/basic.tsx
+++ b/packages/map/src/demo/basic.tsx
@ -109,7 +109,7 @@ const demo = () => {
            sources: {
              'osm-tiles': {
                'type': 'raster',
-                tiles: [`http://10.0.0.120:30003/map/api/tilesets/mapfile/{z}/{x}/{y}.png`], //在线地址，先写死120
+                tiles: [`http://10.0.1.231:30003/map/api/tilesets/mapfile/{z}/{x}/{y}.png`], //在线地址，先写死120
              }
            },
          }}
--- a/packages/material/CHANGELOG.md
+++ b/packages/material/CHANGELOG.md
@ -1,5 +1,20 @@
 # @zhst/material

+## 0.22.3
+
+### Patch Changes
+
+- 修改穿梭框不能修改宽度
+- Updated dependencies
+  - @zhst/biz@0.33.2
+
+## 0.22.2
+
+### Patch Changes
+
+- Updated dependencies
+  - @zhst/biz@0.33.1
+
 ## 0.22.1

 ### Patch Changes
--- a/packages/material/package.json
+++ b/packages/material/package.json
@ -1,6 +1,6 @@
 {
  "name": "@zhst/material",
-  "version": "0.22.1",
+  "version": "0.22.3",
  "description": "物料库",
  "keywords": [
    "business",
--- a/packages/material/src/algorithmConfig/algorithmConfig.tsx
+++ b/packages/material/src/algorithmConfig/algorithmConfig.tsx
@ -191,25 +191,21 @@ const AlgorithmConfig = forwardRef<AlgorithmConfigRef, AlgorithmConfigProps>((pr
        }
      </div>
      <div className={classNames(`${componentName}-right`)} >
-        <div>
+        <div className={classNames(`${componentName}-right-top`)}>
          <Title className={classNames(`${componentName}-title`)}>时间模板</Title>
-          <div >
-            <TimeTemplateTable
-              dataSource={timeTemplateDataSource}
-              {...timeTemplateTableProps}
-            />
-          </div>
+          <TimeTemplateTable
+            dataSource={timeTemplateDataSource}
+            {...timeTemplateTableProps}
+          />
        </div>
-        <div>
+        <div className={classNames(`${componentName}-right-bottom`)}>
          <Title className={classNames(`${componentName}-title`)}>算法应用</Title>
-          <div >
-            <AlgorithmTable
-              dataSource={algorithmTableDataSource}
-              timeTemplateData={timeTemplateDataSource}
-              tableType={type}
-              {...algorithmTableProps}
-            />
-          </div>
+          <AlgorithmTable
+            dataSource={algorithmTableDataSource}
+            timeTemplateData={timeTemplateDataSource}
+            tableType={type}
+            {...algorithmTableProps}
+          />
        </div>
      </div>
    </Flex>
--- a/packages/material/src/algorithmConfig/components/algorithmTable/AlgorithmTable.tsx
+++ b/packages/material/src/algorithmConfig/components/algorithmTable/AlgorithmTable.tsx
@ -94,8 +94,6 @@ const AlgorithmTable= <DataSource extends AnyObject = AnyObject>(
    },
  ];

-  console.log('123', 123)
-
  return (
    <div className={componentName}>
      <Space className={classNames(`${componentName}-top`)} size={16}>
--- a/packages/material/src/algorithmConfig/components/timeTemplateTable/TimeTemplateTable.tsx
+++ b/packages/material/src/algorithmConfig/components/timeTemplateTable/TimeTemplateTable.tsx
@ -6,6 +6,7 @@ import {
 } from '@ant-design/pro-components';
 import { AnyObject } from 'antd/es/_util/type';
 import './index.less'
+import { Tooltip } from '@zhst/meta';
 export interface TimeTemplateTableProps<DataSource, Params extends ParamsType = ParamsType, ValueType = "text"> extends ProTableProps<DataSource, Params, ValueType> {
  onItemBlur?: (value?: number | string, id?: any, record?: any) => void,
 }
@ -26,6 +27,19 @@ const TimeTemplateTable = <DataSource extends AnyObject = AnyObject>(
    {
      title: '布控星期',
      dataIndex: 'arrangeDay',
+      render(_, entity) {
+        return (
+          <Tooltip
+            title={entity?.arrangeDay?.join?.(',') || '-'}
+          >
+            <span>{entity?.arrangeDay?.length || 0}</span>
+          </Tooltip>
+        )
+      },
+    },
+    {
+      title: '路数/总路数',
+      dataIndex: 'roadNum',
    },
  ];

@ -38,7 +52,7 @@ const TimeTemplateTable = <DataSource extends AnyObject = AnyObject>(
          padding: 0
        }
      }}
-      scroll={{ y: 95 }}
+      scroll={{ y: 200 }}
      toolbar={undefined}
      rowKey="id"
      search={false}
--- a/packages/material/src/algorithmConfig/demo/basic.tsx
+++ b/packages/material/src/algorithmConfig/demo/basic.tsx
@ -96,9 +96,6 @@ const demo = () => {
              "h": 0.2664015
            }
          ])
-          // setTimeTemplateData([])
-          // setTableList([])
-          // setBoxList([])
        }}
        videoUrl={videoUrl}
        videoProps={{
@ -112,6 +109,7 @@ const demo = () => {
        type={tableType}
        // 算法模块
        algorithmTableProps={{
+          onReuse: () => console.log('配置复用'),
          onItemSwitch: (status, id) => {
            setAlgorithmTableList((pre: any[]) => {
              let arr = pre.map(o => {
--- a/packages/material/src/algorithmConfig/index.less
+++ b/packages/material/src/algorithmConfig/index.less
@ -23,6 +23,9 @@
    flex: 0 0 1040px;
    margin: 0 24px;
    height: auto;
+    .zhst-image__video-view {
+      height: 100%!important;
+    }

    &-cont {
      align-items: center;
@ -34,5 +37,8 @@
  }
  &-right {
    height: auto;
+    &-top {
+      height: 40%;
+    }
  }
 }
--- a/packages/meta/src/VideoPlayer/VideoPlayer.tsx
+++ b/packages/meta/src/VideoPlayer/VideoPlayer.tsx
@ -65,6 +65,7 @@ export interface VideoViewRef {
  cropAble: boolean;
  setShowCrop: Dispatch<SetStateAction<boolean>>;
  downloadVideoFrame: (opt?: DownloadFrameOptionProps) => void;    // 视频截帧
+  getCropInfo: (data?: any) => void
  pause: () => void;
  play: () => void;
  reload: () => void; // 重新加载
@ -252,7 +253,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
      checkIsErr();
      console.error('videoInsRef 错误', type, errDetail, info, video.currentTime);
    });
-    let playPromise = videoInsRef?.current.play();
+    let playPromise = videoInsRef?.current.play?.();
    //先ready 遮挡会导致播放失败
    setIsReady(true);
    playPromise
@ -301,7 +302,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
        setPlaySeq((pre) => pre + 1);
        return;
      }
-      videoInsRef.current.play();
+      videoInsRef.current.play?.();
    }

    setPlayTime(0);
@ -426,7 +427,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
      videoInsRef?.current?.pause()
    } else {
      const _element = videoInsRef.current._mediaElement || {}
-      videoInsRef?.current?.play()
+      videoInsRef?.current?.play?.()
      // 挂载图片选择
      cropInsRef.current = new Viewer(corpContainerRef.current!!, {
        scaleAble: false,
@ -551,6 +552,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
      setShowCrop?.(dispatch);
    },
    downloadVideoFrame,
+    getCropInfo,
    pause: () => {
      videoInsRef.current?.pause?.();
    },
@ -645,7 +647,7 @@ const VideoPlayer = forwardRef<VideoViewRef, VideoViewProps>((props, ref) => {
                onIconClick={() => {
                  if (!isPlay) {
                    //播放中暂停
-                    videoInsRef?.current?.play();
+                    videoInsRef?.current?.play?.();
                    setShowCrop(false);
                  } else {
                    videoInsRef?.current?.pause();
--- a/packages/meta/src/VideoPlayer/demo/basic.tsx
+++ b/packages/meta/src/VideoPlayer/demo/basic.tsx
@ -6,6 +6,8 @@ export default () => {
  const videoRef = useRef<VideoViewRef>(null)
  const [url] = useState(VIDEO_URL)

+  console.log('videoRef', )
+
  return (
    <Space direction='vertical'>
      <Space>
@ -13,7 +15,9 @@ export default () => {
        <Button onClick={() => videoRef.current?.pause()}>暂停</Button>
        <Button onClick={() => videoRef.current?.setShowCrop(true)}>截图</Button>
        <Button onClick={() => videoRef.current?.setShowCrop(false)}>退出截图</Button>
-        <Button onClick={() => videoRef.current?.downloadVideoFrame()}>下载截图</Button>
+        <Button onClick={async () => {
+          videoRef.current?.downloadVideoFrame()
+        }}>下载截图</Button>
      </Space>
      <div style={{ width: '800px' }}>
        <VideoPlayer
--- a/packages/meta/src/cropperImage/CropperImage.tsx
+++ b/packages/meta/src/cropperImage/CropperImage.tsx
@ -216,7 +216,7 @@ const CropperImage = forwardRef<CropperImageRefProps, CropperImageProps>((props,
      currentFabricRef.current?.dispose?.()
    }
  // TODO: 监听odList 需要优化
-  },[type, editAble, isImgReady])
+  },[type, editAble, isImgReady, odList])

  // 监听矩形拖动，防抖
  const { run: handleRectChange } = useDebounceFn(