TourIAm/TIAMSharedUI/Pages/User/CardComponents/ProductCardComponent.razor

@using AyCode.Core.Helpers
@using BlazorAnimation
@using TIAM.Core.Enums
@using TIAM.Entities.Addresses
@using TIAM.Entities.Products
@using TIAM.Entities.Profiles
@using TIAM.Entities.ServiceProviders
@using TIAM.Entities.Transfers
@using TIAM.Entities.Users
@using TIAM.Models.Dtos.Users
@using TIAM.Services
@using TIAMSharedUI.Shared.Components.Cards
@using TIAMWebApp.Shared.Application.Interfaces
@using TIAMWebApp.Shared.Application.Models.ClientSide.UI
@using TIAMWebApp.Shared.Application.Models.PageModels
@using TIAMWebApp.Shared.Application.Services
@inject IServiceProviderDataService ServiceProviderDataService
@inject IUserDataService UserDataService
@inject AdminSignalRClient AdminSignalRClient
@inject IJSRuntime JsRuntime
@inject NavigationManager NavManager

<div class="e-card cw-480">
    <div class="e-main d-flex align-items-center">
        
        <div class="flex-shrink-0">
            <a href="api/pictures/1" download="data:image/png;base64,@ImageSource" target="_top">
                <img class="align-self-center img-fluid" src="data:image/png;base64,@ImageSource" width="128" />
            </a>
            <br />
            <DxButton Context="ButtonContext" CssClass="btn-primary" Click="DownloadImage"><i class="fa-solid fa-download"></i> Download QR</DxButton>
        </div>

        <div class="e-info flex-grow-1 ms-3">
            <div class="e-name">@($"{Context.Name}")</div>
            <p class="e-title"><i class="fa-solid fa-at"></i> @Context.Profile.EmailAddress</p>
            <p class="e-title"><i class="fa-solid fa-location-dot"></i> @Context.Profile.Address.AddressText</p>
        </div>
    </div>

    <hr class="hr" />

    <div class="row">
        <div class="col-12 col-md-3">
            <h4>Information</h4>
            @RenderDetailsItem("fa-solid fa-user", "Contact Name", _productProfile.FullName)
            @RenderDetailsItem("fa-solid fa-circle-info", "Description", Context.Description)
        </div>

        <div class="col-12 col-md-9">
            <h4>Affiliate information</h4>
            @{
                if (Context.ServiceProviderId != null)
                {
                    var _url = $"{Setting.BaseUrl}/public/transfer/{Context.ServiceProvider.AffiliateId}/{Context.Id}";
                    <p>Use this link to send it in an email to the client</p>
                    <a href="@_url" target="_blank">@_url</a>
                    <DxButton Context="ButtonContext" CssClass="btn-primary" Click="() => CopyUrl(_url)"><i class="fa-solid fa-copy"></i></DxButton>
                }
            }
        </div>

        <div class="col-12 col-md-6"></div>

        <div class="col-12">
            <div class="row py-3">
                <div class="col-4">
                    @{
                        if (Context.ProductType == TIAM.Core.Enums.ProductType.Hotel)
                        {
                            string url = $"user/hoteladmin/{Context.Id}";
                            <DxButton class="btn-primary" Click="() => NavManager.NavigateTo(url)">Manage</DxButton>
                        }
                        else if (Context.ProductType == TIAM.Core.Enums.ProductType.Transfer)
                        {
                            string url = $"user/transferadmin/{Context.Id}";
                            <DxButton class="btn btn-primary" Click="() => NavManager.NavigateTo(url)">Manage</DxButton>
                        }
                    }
                </div>
                <div class="col-4">
                    @{
                        if (!_isAddressTransferDestination)
                        {
                            <DxButton Click="() => SaveAsDestination(_productProfile.Address, Context)" Text="Save as destination" RenderStyle="ButtonRenderStyle.Primary" />
                        }
                    }
                </div>
                <div class="col-4"></div>
            </div>
        </div>
        <p>@_msg</p>
    </div>
</div>

<script>
    function copyToClipboard(text) {
        navigator.clipboard.writeText(text).then(function () {
            console.log('Copied to clipboard successfully!');
        }, function (err) {
            alert('Could not copy text: ' + err);
        });
    }

    function downloadImage(base64String, filename) {
        const link = document.createElement('a');
        link.href = base64String;
        link.download = filename;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }
</script>

@code {
    [Parameter] public Product Context { get; set; }

    [Parameter] public EventCallback<string> DataChanged { get; set; }

    public string ImageSource { get; set; } = "";
    AccordionExpandMode ExpandMode { get; set; } = AccordionExpandMode.SingleOrNone;
    AccordionExpandCollapseAction ExpandCollapseAction { get; set; } = AccordionExpandCollapseAction.HeaderClick;

    private Profile _productProfile = new Profile();
    private readonly List<TransferDestination> _destinations = [];
    string _msg;
    private bool _isSaveActive = false;
    private bool _isAddressTransferDestination = false;

    private async Task CopyUrl(string url)
    {
        await JsRuntime.InvokeVoidAsync("copyToClipboard", url);
    }

    private async Task DownloadImage()
    {
        await JsRuntime.InvokeVoidAsync("downloadImage", $"data:image/png;base64,{ImageSource}", "QRCode.jpg");
    }

    protected override async Task OnInitializedAsync()
    {
        var productOwner = await AdminSignalRClient.GetByIdAsync<List<Company>>(SignalRTags.GetCompaniesById, Context.ServiceProviderId);
        var productProfiles = await AdminSignalRClient.GetByIdAsync<List<Profile>>(SignalRTags.GetProfileById, Context.ProfileId);

        if (productOwner != null)
        {
            ImageSource = await ServiceProviderDataService.GetQRCodeByProductIdAndOwnerAffiliateIdAsync([productOwner[0].AffiliateId, Context.Id]);
        }

        if (productProfiles != null)
        {
            _productProfile = productProfiles[0];
            _isAddressTransferDestination = CheckDestinations(_productProfile.AddressId);
        }

        AdminSignalRClient.GetTransferDestinationsAsync(_destinations).Forget();
        await base.OnInitializedAsync();
    }

    protected override async Task OnParametersSetAsync()
    {
        await base.OnParametersSetAsync();
    }

    RenderFragment RenderDetailsItem(string iconCssClass, string caption, string value)
    {
        return @<div class="d-flex m-1 align-items-center">
            <div class="icon-container flex-shrink-0">
                <span class="dxbl-image m-1 @iconCssClass"></span>
            </div>
            <div class="text-container m-1 flex-grow-1 ms-2">
                <label>@caption:</label>
                <div>@value</div>
            </div>
        </div>;
    }

    private bool CheckDestinations(Guid addressId)
    {
        return _destinations.Any(d => d.AddressId == addressId);
    }

    private async Task SaveAsDestination(Address address, Product product)
    {
        var transferDestination = new TransferDestination();
        transferDestination.Id = Guid.NewGuid();
        transferDestination.Name = product.Name;

        if (!string.IsNullOrEmpty(product.Profile.Description))
        {
            transferDestination.Description = product.Profile.Description;
        }
        else
        {
            transferDestination.Description = "No description available";
        }

        transferDestination.AddressId = address.Id;
        transferDestination.AddressString = address.AddressText;

        var result = await AdminSignalRClient.PostDataAsync<TransferDestination>(SignalRTags.CreateTransferDestination, transferDestination);
        await InvokeAsync(StateHasChanged);
    }
}