fix: The image in the preview page can be zoomed through the panel an…

[YyumeiZhang]

…d mouse;

The initial size of the image preview is controlled by the image itself and the preview page; Remove unnecessary code

中文模板 / Chinese Template

• I have read and followed Pull Request Guidelines of the contributing guide.

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Test Case
• TypeScript definition update
• Document improve
• CI/CD improve
• Branch sync
• Other, please describe:

PR description

Fixes #

changlog 中提到的两个修改： 缩放作用范围，预览初始大小 源于业务场景的反馈

缩放作用范围： 当前仅鼠标在图片区域内才可以进行缩放，在图片缩小过程中，可能出现鼠标不再位于图片范围内，导致无法继续缩放，不符合直觉。这个问题有两种解决思路，1. 启动图片缩放有效范围仍然为图片区域，但是缩放时缩放中心为鼠标位置，这样就能够保证在缩放过程中鼠标不会出现在图片外的区域。2. 保持缩放中心为预览区域中心位置，启动图片缩放有效范围所有预览区域。两种解决思路在各类型组件库/应用中都有。考虑到代码修改范围以及业务反馈，本次修改采用思路2。

初始预览大小：原来的初始预览大小都是适应页面，如果图片宽高较小，点击预览，图片被放大至适应页面，被放大后的图片如果像素较低，放大至适应页面体验不太好。参考了下其他组件库，基本遵循如果图片小于某个范围，则预览初始大小为图片本身大小，如果图片大于某个范围，则适应页面尺寸进行显示，因此进行了修改。

Changelog

🇨🇳 Chinese

• Fix: Image 支持在预览页面的任何位置通过面板和鼠标滚动进行缩放
• Fix: Image 预览的初始尺寸做了调整。调整前，预览初始尺寸为适应页面的宽高；调整后，如果图片宽高小于适应页面的宽高，则预览初始宽高和图片宽高相同，否则以适应页面宽高进行缩放

---

🇺🇸 English

• Fix: Image supports zooming via panel and mouse scrolling anywhere on the preview page
• Fix: The initial size of the Image preview has been adjusted. Before adjustment, the initial size of the preview is to fit the width and height of the page; after adjustment, if the width and height of the image are smaller than the width and height of the page, the initial width and height of the preview will be the same as the width and height of the image, otherwise the preview will be scaled to fit the width and height of the page.

Checklist

• Test or no need
• Document or no need
• Changelog or no need

Other

• Skip Changelog

Additional information

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit db6b9d6:

Sandbox	Source
pr-story	Configuration
Semi Design: Simple Story	Configuration

[cypress]

Passing run #2115 ↗︎

0	233	10	0	0
⚠️ You've recorded test results over your free plan limit. Upgrade your plan to view test results.

Details:

Merge db6b9d6 into c7982af...
Project: semi-design	Commit: 7ed2ccb716 ℹ️
Status: Passed	Duration: 09:52 💡
Started: Dec 11, 2023 12:45 PM	Ended: Dec 11, 2023 12:55 PM

Review all test suite changes for PR #1890 ↗︎

[codecov-commenter]

Codecov Report

Attention: 10 lines in your changes are missing coverage. Please review.

Comparison is base (8413c01) 88.05% compared to head (81eddfd) 88.18%.
Report is 164 commits behind head on main.

❗ Current head 81eddfd differs from pull request most recent head 728039f. Consider uploading reports for the commit 728039f to get more accurate results

Files	Patch %	Lines
packages/semi-foundation/treeSelect/foundation.ts	90.90%	3 Missing ⚠️
...es/semi-foundation/image/previewImageFoundation.ts	97.56%	1 Missing ⚠️
...es/semi-foundation/image/previewInnerFoundation.ts	97.61%	1 Missing ⚠️
packages/semi-ui/avatar/index.tsx	88.88%	1 Missing ⚠️
packages/semi-ui/popconfirm/index.tsx	66.66%	1 Missing ⚠️
packages/semi-ui/slider/index.tsx	75.00%	1 Missing ⚠️
packages/semi-ui/tree/index.tsx	92.30%	1 Missing ⚠️
packages/semi-ui/typography/base.tsx	75.00%	1 Missing ⚠️

❗ Your organization needs to install the Codecov GitHub app to enable full functionality.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1890      +/-   ##
==========================================
+ Coverage   88.05%   88.18%   +0.12%     
==========================================
  Files         436      436              
  Lines       25501    25588      +87     
  Branches     6440     6469      +29     
==========================================
+ Hits        22455    22564     +109     
+ Misses       3046     3024      -22     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.