@model MemberCenter.Web.Models.Profile.ProfileIndexPageViewModel
@{
    ViewData["Title"] = L["Profile"];
    var profile = Model.Profile;
    var displayName = string.Join(" ", new[] { profile.LastName, profile.FirstName }.Where(value => !string.IsNullOrWhiteSpace(value)));
    if (string.IsNullOrWhiteSpace(displayName))
    {
        displayName = profile.NickName ?? profile.Email;
    }
    if (string.IsNullOrWhiteSpace(displayName))
    {
        displayName = L["Member"].Value;
    }

    var defaultAddress = Model.Addresses.FirstOrDefault(address => address.IsDefault) ?? Model.Addresses.FirstOrDefault();
    string DisplayValue(string? value) => string.IsNullOrWhiteSpace(value) ? L["Not set"].Value : value;
}

@if (ViewData["Result"] is not null)
{
  <p class="profile-alert">@L[ViewData["Result"]?.ToString() ?? string.Empty]</p>
}
@if (TempData["Result"] is string result)
{
  <p class="profile-alert">@L[result]</p>
}
@if (TempData["Error"] is string error)
{
  <p class="profile-alert is-error">@L[error]</p>
}

<div class="profile-home-grid">
  <section class="profile-panel profile-summary-panel">
    <div class="profile-summary-header">
      <form
        asp-area=""
        asp-controller="Profile"
        asp-action="UploadAvatar"
        method="post"
        class="profile-avatar-upload-form"
        data-avatar-upload
        data-crop-title="@L["Adjust profile image"]"
        data-crop-zoom="@L["Zoom"]"
        data-crop-save="@L["Save"]"
        data-crop-cancel="@L["Cancel"]"
        data-crop-error="@L["Unable to process this image."]">
        @Html.AntiForgeryToken()
        <input type="hidden" name="avatarDataUrl" data-avatar-data-url />
        <input type="hidden" name="avatarContentType" data-avatar-content-type />
        <input type="hidden" name="avatarWidth" data-avatar-width />
        <input type="hidden" name="avatarHeight" data-avatar-height />
        <label class="profile-avatar-upload-control">
          @if (Model.HasProfileImage)
          {
            <img
              class="profile-avatar"
              src="@Url.Action("Avatar", "Profile", new { area = string.Empty, v = Model.ProfileImageVersion })"
              alt="@L["Profile image"]" />
          }
          else
          {
            <span class="profile-avatar" aria-hidden="true">@displayName[..1].ToUpperInvariant()</span>
          }
          <span class="profile-avatar-edit" aria-hidden="true">
            <img src="~/images/profile-edit-pencil.svg" alt="" />
          </span>
          <span class="sr-only">@L["Upload profile image"]</span>
          <input type="file" accept="image/png,image/jpeg,image/webp" data-avatar-file />
        </label>
      </form>
      <div>
        <h1>@displayName</h1>
        <p>@(profile.NickName ?? L["Member Profile"].Value)</p>
      </div>
      @if (!Model.IsEditing)
      {
        <a class="profile-pill-link" asp-area="" asp-controller="Profile" asp-action="Index" asp-route-edit="true">@L["Edit Profile"]</a>
      }
    </div>

    @if (!Model.IsEditing)
    {
      <dl class="profile-detail-list profile-preview-grid">
        <div class="profile-form-wide">
          <dt>@L["Email"]</dt>
          <dd>
            @profile.Email
            <span class="profile-status @(profile.EmailConfirmed ? "is-ok" : "is-pending")">
              @(profile.EmailConfirmed ? L["Verified"] : L["Pending verification"])
            </span>
          </dd>
        </div>
        <div>
          <dt>@L["Last name"]</dt>
          <dd>@DisplayValue(profile.LastName)</dd>
        </div>
        <div>
          <dt>@L["First name"]</dt>
          <dd>@DisplayValue(profile.FirstName)</dd>
        </div>
        <div>
          <dt>@L["Nickname"]</dt>
          <dd>@DisplayValue(profile.NickName)</dd>
        </div>
        <div>
          <dt>@L["Mobile phone"]</dt>
          <dd>@DisplayValue(profile.MobilePhone)</dd>
        </div>
        <div>
          <dt>@L["Landline phone"]</dt>
          <dd>@DisplayValue(profile.LandlinePhone)</dd>
        </div>
        <div>
          <dt>@L["Date of birth"]</dt>
          <dd>@(profile.DateOfBirth?.ToString("yyyy-MM-dd") ?? L["Not set"].Value)</dd>
        </div>
        <div>
          <dt>@L["Gender"]</dt>
          <dd>@DisplayValue(profile.Gender)</dd>
        </div>
        <div>
          <dt>@L["Company name"]</dt>
          <dd>@DisplayValue(profile.CompanyName)</dd>
        </div>
        <div>
          <dt>@L["Department"]</dt>
          <dd>@DisplayValue(profile.Department)</dd>
        </div>
        <div>
          <dt>@L["Job title"]</dt>
          <dd>@DisplayValue(profile.JobTitle)</dd>
        </div>
        <div>
          <dt>@L["Company phone"]</dt>
          <dd>@DisplayValue(profile.CompanyPhone)</dd>
        </div>
        <div>
          <dt>@L["Tax ID"]</dt>
          <dd>@DisplayValue(profile.TaxId)</dd>
        </div>
        <div>
          <dt>@L["Invoice title"]</dt>
          <dd>@DisplayValue(profile.InvoiceTitle)</dd>
        </div>
        <div class="profile-form-wide">
          <dt>@L["Remark"]</dt>
          <dd>@DisplayValue(profile.Remark)</dd>
        </div>
      </dl>

      <div class="profile-actions-row">
        <a class="profile-pill-link" asp-area="" asp-controller="Account" asp-action="ChangePassword">@L["Change Password"]</a>
      </div>
    }

    @if (!profile.EmailConfirmed)
    {
      <form asp-area="" asp-controller="Account" asp-action="ResendVerification" method="post" class="profile-inline-form">
        @Html.AntiForgeryToken()
        <button type="submit" class="profile-pill-button">@L["Resend verification email"]</button>
      </form>
    }

    @if (Model.IsEditing)
    {
    <div class="profile-edit-panel">
      <form method="post" class="profile-edit-form" asp-area="" asp-controller="Profile" asp-action="Index">
        @Html.AntiForgeryToken()
        <div asp-validation-summary="All"></div>
        <div class="profile-form-grid">
          <div class="form-field">
            <label asp-for="Profile.LastName">@L["Last name"]</label>
            <input asp-for="Profile.LastName" />
            <span asp-validation-for="Profile.LastName"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.FirstName">@L["First name"]</label>
            <input asp-for="Profile.FirstName" />
            <span asp-validation-for="Profile.FirstName"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.NickName">@L["Nickname"]</label>
            <input asp-for="Profile.NickName" />
            <span asp-validation-for="Profile.NickName"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.MobilePhone">@L["Mobile phone"]</label>
            <input asp-for="Profile.MobilePhone" />
            <span asp-validation-for="Profile.MobilePhone"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.LandlinePhone">@L["Landline phone"]</label>
            <input asp-for="Profile.LandlinePhone" />
            <span asp-validation-for="Profile.LandlinePhone"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.DateOfBirth">@L["Date of birth"]</label>
            <input asp-for="Profile.DateOfBirth" />
            <span asp-validation-for="Profile.DateOfBirth"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.Gender">@L["Gender"]</label>
            <select asp-for="Profile.Gender">
              <option value="unspecified">@L["unspecified"]</option>
              <option value="male">@L["male"]</option>
              <option value="female">@L["female"]</option>
              <option value="other">@L["other"]</option>
            </select>
            <span asp-validation-for="Profile.Gender"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.CompanyName">@L["Company name"]</label>
            <input asp-for="Profile.CompanyName" />
            <span asp-validation-for="Profile.CompanyName"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.Department">@L["Department"]</label>
            <input asp-for="Profile.Department" />
            <span asp-validation-for="Profile.Department"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.JobTitle">@L["Job title"]</label>
            <input asp-for="Profile.JobTitle" />
            <span asp-validation-for="Profile.JobTitle"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.CompanyPhone">@L["Company phone"]</label>
            <input asp-for="Profile.CompanyPhone" />
            <span asp-validation-for="Profile.CompanyPhone"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.TaxId">@L["Tax ID"]</label>
            <input asp-for="Profile.TaxId" />
            <span asp-validation-for="Profile.TaxId"></span>
          </div>
          <div class="form-field">
            <label asp-for="Profile.InvoiceTitle">@L["Invoice title"]</label>
            <input asp-for="Profile.InvoiceTitle" />
            <span asp-validation-for="Profile.InvoiceTitle"></span>
          </div>
          <div class="form-field profile-form-wide">
            <label asp-for="Profile.Remark">@L["Remark"]</label>
            <textarea asp-for="Profile.Remark"></textarea>
            <span asp-validation-for="Profile.Remark"></span>
          </div>
        </div>
        <div class="profile-form-actions">
          <a class="profile-pill-link" asp-area="" asp-controller="Profile" asp-action="Index">@L["Cancel"]</a>
          <button type="submit" class="profile-pill-button">@L["Save"]</button>
        </div>
      </form>
    </div>
    }
  </section>

  <aside class="profile-panel profile-address-panel">
    <div class="profile-panel-heading">
      <h2>@L["Address Book"]</h2>
      <a class="profile-pill-link" asp-area="" asp-controller="Profile" asp-action="Addresses">
        @L["Add Address"]
      </a>
    </div>

    @if (!Model.Addresses.Any())
    {
      <p class="profile-empty">@L["No addresses yet."]</p>
    }
    else
    {
      <div class="profile-address-list">
      @foreach (var address in Model.Addresses.OrderByDescending(address => address.IsDefault))
      {
        <article class="profile-address-card">
          <div class="profile-address-card-header">
            <div>
              <div class="profile-address-label">@address.Label</div>
              <div class="profile-address-recipient">@address.RecipientName</div>
            </div>
            @if (address.IsDefault)
            {
              <span class="profile-status is-ok">@L["Default"]</span>
            }
          </div>
          <p>@DisplayValue(address.RecipientPhone)</p>
          <p>
            @string.Join(" ", new[]
            {
                address.PostalCode,
                address.StateRegion,
                address.City,
                address.District,
                address.AddressLine1,
                address.AddressLine2
            }.Where(value => !string.IsNullOrWhiteSpace(value)))
          </p>
          <div class="profile-address-actions">
            @if (!address.IsDefault)
            {
              <form asp-area="" asp-controller="Profile" asp-action="SetDefaultAddress" asp-route-id="@address.Id" method="post">
                @Html.AntiForgeryToken()
                <button type="submit" class="profile-pill-button">@L["Set as default"]</button>
              </form>
            }
            <a class="profile-pill-link" asp-area="" asp-controller="Profile" asp-action="Addresses" asp-route-id="@address.Id">@L["Edit"]</a>
            <form asp-area="" asp-controller="Profile" asp-action="DeleteAddress" asp-route-id="@address.Id" method="post">
              @Html.AntiForgeryToken()
              <button type="submit" class="profile-pill-button">@L["Delete"]</button>
            </form>
          </div>
        </article>
      }
      </div>
    }
  </aside>
</div>
