2020-04-23 17:13:56 +08:00
|
|
|
|
using System.Collections;
|
|
|
|
|
using System.Globalization;
|
|
|
|
|
using System.Threading.Tasks;
|
2020-05-29 00:33:49 +08:00
|
|
|
|
using AntDesign.JsInterop;
|
2020-04-23 17:13:56 +08:00
|
|
|
|
using Microsoft.AspNetCore.Components;
|
|
|
|
|
using Microsoft.AspNetCore.Components.Web;
|
|
|
|
|
|
2020-05-29 00:33:49 +08:00
|
|
|
|
namespace AntDesign
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
2020-05-29 12:55:15 +08:00
|
|
|
|
public partial class Avatar : AntDomComponentBase
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
2020-05-10 15:42:02 +08:00
|
|
|
|
[Parameter]
|
2020-07-17 13:45:19 +08:00
|
|
|
|
public RenderFragment ChildContent
|
|
|
|
|
{
|
|
|
|
|
get => _childContent;
|
|
|
|
|
set
|
|
|
|
|
{
|
|
|
|
|
_childContent = value;
|
|
|
|
|
_waitingCaclSize = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-05-10 15:42:02 +08:00
|
|
|
|
|
2020-04-23 17:13:56 +08:00
|
|
|
|
[Parameter]
|
|
|
|
|
public string Shape { get; set; } = null;
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string Size { get; set; } = AntSizeLDSType.Default;
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
2020-07-17 13:45:19 +08:00
|
|
|
|
public string Text
|
|
|
|
|
{
|
|
|
|
|
get => _text;
|
|
|
|
|
set
|
|
|
|
|
{
|
|
|
|
|
if (_text != value)
|
|
|
|
|
{
|
|
|
|
|
_text = value;
|
|
|
|
|
_waitingCaclSize = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-04-23 17:13:56 +08:00
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string Src { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string SrcSet { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string Alt { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public string Icon { get; set; }
|
|
|
|
|
|
|
|
|
|
[Parameter]
|
|
|
|
|
public EventCallback<ErrorEventArgs> Error { get; set; }
|
|
|
|
|
|
|
|
|
|
private bool _hasText = false;
|
|
|
|
|
private bool _hasSrc = true;
|
|
|
|
|
private bool _hasIcon = false;
|
|
|
|
|
|
|
|
|
|
private string _textStyles = "";
|
|
|
|
|
|
|
|
|
|
protected ElementReference TextEl { get; set; }
|
|
|
|
|
|
|
|
|
|
private string _prefixCls = "ant-avatar";
|
|
|
|
|
|
|
|
|
|
private readonly Hashtable _sizeMap = new Hashtable() { ["large"] = "lg", ["small"] = "sm" };
|
|
|
|
|
|
2020-07-17 13:45:19 +08:00
|
|
|
|
private string _text;
|
|
|
|
|
private RenderFragment _childContent;
|
|
|
|
|
private bool _waitingCaclSize;
|
|
|
|
|
|
|
|
|
|
protected override void OnInitialized()
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
2020-07-17 13:45:19 +08:00
|
|
|
|
base.OnInitialized();
|
|
|
|
|
|
|
|
|
|
SetClassMap();
|
|
|
|
|
SetSizeStyle();
|
2020-04-23 17:13:56 +08:00
|
|
|
|
}
|
|
|
|
|
|
2020-07-13 23:13:25 +08:00
|
|
|
|
protected override void OnParametersSet()
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
2020-07-17 13:45:19 +08:00
|
|
|
|
this._hasText = string.IsNullOrEmpty(this.Src) && (!string.IsNullOrEmpty(this._text) || _childContent != null);
|
2020-04-23 17:13:56 +08:00
|
|
|
|
this._hasIcon = string.IsNullOrEmpty(this.Src) && !string.IsNullOrEmpty(this.Icon);
|
|
|
|
|
this._hasSrc = !string.IsNullOrEmpty(this.Src);
|
|
|
|
|
|
2020-07-17 13:45:19 +08:00
|
|
|
|
base.OnParametersSet();
|
2020-07-13 23:13:25 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
protected override async Task OnAfterRenderAsync(bool firstRender)
|
|
|
|
|
{
|
2020-07-17 13:45:19 +08:00
|
|
|
|
if (firstRender || _waitingCaclSize)
|
|
|
|
|
{
|
|
|
|
|
_waitingCaclSize = false;
|
|
|
|
|
await CalcStringSize();
|
|
|
|
|
}
|
|
|
|
|
|
2020-07-13 23:13:25 +08:00
|
|
|
|
await base.OnAfterRenderAsync(firstRender);
|
2020-04-23 17:13:56 +08:00
|
|
|
|
}
|
|
|
|
|
|
2020-07-17 13:45:19 +08:00
|
|
|
|
private async Task ImgError(ErrorEventArgs args)
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
|
|
|
|
await Error.InvokeAsync(args);
|
|
|
|
|
this._hasSrc = false;
|
|
|
|
|
this._hasIcon = false;
|
|
|
|
|
this._hasText = false;
|
|
|
|
|
if (!string.IsNullOrEmpty(this.Icon))
|
|
|
|
|
{
|
|
|
|
|
this._hasIcon = true;
|
|
|
|
|
}
|
2020-07-17 13:45:19 +08:00
|
|
|
|
else if (!string.IsNullOrEmpty(this._text))
|
2020-04-23 17:13:56 +08:00
|
|
|
|
{
|
|
|
|
|
this._hasText = true;
|
|
|
|
|
}
|
2020-07-17 13:45:19 +08:00
|
|
|
|
|
|
|
|
|
_waitingCaclSize = true;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private void SetClassMap()
|
|
|
|
|
{
|
|
|
|
|
ClassMapper.Clear()
|
|
|
|
|
.Add(_prefixCls)
|
|
|
|
|
.If($"{_prefixCls}-{this._sizeMap[this.Size]}", () => _sizeMap.ContainsKey(Size))
|
|
|
|
|
.If($"{_prefixCls}-{this.Shape}", () => !string.IsNullOrEmpty(Shape))
|
|
|
|
|
.If($"{_prefixCls}-icon", () => !string.IsNullOrEmpty(Icon))
|
|
|
|
|
.If($"{_prefixCls}-image", () => _hasSrc)
|
|
|
|
|
;
|
2020-04-23 17:13:56 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private void SetSizeStyle()
|
|
|
|
|
{
|
|
|
|
|
if (decimal.TryParse(this.Size, out var pxSize))
|
|
|
|
|
{
|
2020-07-17 13:45:19 +08:00
|
|
|
|
var size = StyleHelper.ToCssPixel(pxSize.ToString(CultureInfo.InvariantCulture));
|
2020-04-23 17:13:56 +08:00
|
|
|
|
Style += $";width:{size};";
|
|
|
|
|
Style += $"height:{size};";
|
|
|
|
|
Style += $"line-height:{size};";
|
|
|
|
|
if (this._hasIcon)
|
|
|
|
|
{
|
|
|
|
|
Style += $"font-size:calc(${size} / 2)";
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
private async Task CalcStringSize()
|
|
|
|
|
{
|
|
|
|
|
if (!this._hasText)
|
|
|
|
|
{
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
2020-09-09 00:52:14 +08:00
|
|
|
|
var childrenWidth = (await this.JsInvokeAsync<Element>(JSInteropConstants.GetDomInfo, this.TextEl)).offsetWidth;
|
|
|
|
|
var avatarWidth = (await this.JsInvokeAsync<DomRect>(JSInteropConstants.GetBoundingClientRect, this.Ref)).width;
|
2020-04-23 17:13:56 +08:00
|
|
|
|
var scale = avatarWidth - 8 < childrenWidth ? (avatarWidth - 8) / childrenWidth : 1;
|
|
|
|
|
this._textStyles = $"transform: scale({scale}) translateX(-50%);";
|
|
|
|
|
if (decimal.TryParse(this.Size, out var pxSize))
|
|
|
|
|
{
|
|
|
|
|
this._textStyles += $"lineHeight:{pxSize}px;";
|
|
|
|
|
}
|
2020-07-17 13:45:19 +08:00
|
|
|
|
|
|
|
|
|
StateHasChanged();
|
2020-04-23 17:13:56 +08:00
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|