test/ant-design-blazor
1
0
Fork 0
mirror of https://gitee.com/ant-design-blazor/ant-design-blazor.git synced 2024-12-15 01:11:52 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity
f856f3230d
ant-design-blazor/components/image/ImagePreview.razor

33 lines
2.0 KiB
C#
Raw Normal View History

feat(module: image): add image component (#1038) * feat(module: image): add image * add image preview * add locale
2021-01-25 02:05:18 +08:00
@namespace AntDesign
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
<Dialog Config="@GetDialogOptions()" Visible="@_visible">
<ul class="ant-image-preview-operations">
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<li class="ant-image-preview-operations-operation" @onclick="HandleClose" @onclick:stopPropagation>
<Icon Type="close" Class="ant-image-preview-operations-icon" />
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
</li>
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<li class="ant-image-preview-operations-operation" @onclick="HandleZoomIn" @onclick:stopPropagation>
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
<Icon Type="zoom-in" Class="ant-image-preview-operations-icon" />
</li>
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<li class="ant-image-preview-operations-operation @(_zoomOutTimes==1?"ant-image-preview-operations-operation-disabled":"")" @onclick="HandleZoomOut" @onclick:stopPropagation>
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
<Icon Type="zoom-out" Class="ant-image-preview-operations-icon" />
</li>
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<li class="ant-image-preview-operations-operation" @onclick="HandleRotateRight" @onclick:stopPropagation>
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
<Icon Type="rotate-right" Class="ant-image-preview-operations-icon" />
</li>
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<li class="ant-image-preview-operations-operation" @onclick="HandleRotateLeft" @onclick:stopPropagation>
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
<Icon Type="rotate-left" Class="ant-image-preview-operations-icon" />
</li>
</ul>
<div class="ant-image-preview-img-wrapper" style="transform: translate3d(0px, 0px, 0px);">
feat(module: image): add preview group (#1059)
2021-01-30 22:39:56 +08:00
<img class="ant-image-preview-img" src="@ImageRef.ImageSrc" style="transform: scale3d(@_zoomOutTimes, @_zoomOutTimes, 1) rotate(@(90*_rotateTimes)deg);">
</div>
fix(module: image): disables previewing error images and hides buttons when there is only one image (#1060)
2021-01-30 23:39:40 +08:00
@if (ImageRef.ImageCount > 1)
{
<div class="ant-image-preview-switch-left @(ImageRef.CurrentIndex==0?"ant-image-preview-switch-left-disabled":"")" @onclick="()=>ImageRef.SwitchTo(ImageRef.CurrentIndex-1)" @onclick:stopPropagation>
<Icon Type="left" />
</div>
<div class="ant-image-preview-switch-right @(ImageRef.CurrentIndex==ImageRef.ImageCount-1?"ant-image-preview-switch-right-disabled":"")" @onclick="()=>ImageRef.SwitchTo(ImageRef.CurrentIndex+1)" @onclick:stopPropagation>
<Icon Type="right" />
</div>
}
feat(module: image): add animation for image preview (#1042) * feat(module image): add animation for image preview * feat(module image): add mask closeable * fix(module dialog): cannot close dialog by clicking mask if content is clicked, mask click cannot close dialog
2021-01-27 13:23:15 +08:00
</Dialog>
Reference in New Issue Copy Permalink