Introduces customer-related view components for table and row display Implements mock data loading and customer list rendering Adds localization support for customer-related text Enhances UI with detailed customer information and interactions
124 lines
7 KiB
Text
124 lines
7 KiB
Text
@model PlanTempus.Application.Features.Services.Components.ServiceDetailPricesViewModel
|
|
|
|
<swp-detail-grid>
|
|
<!-- Column 1 -->
|
|
<swp-card-column>
|
|
<swp-card>
|
|
<swp-card-header>
|
|
<swp-card-title>@Model.LabelEconomy</swp-card-title>
|
|
</swp-card-header>
|
|
<swp-edit-section>
|
|
<swp-edit-row>
|
|
<swp-edit-label>@Model.LabelVatRate</swp-edit-label>
|
|
<swp-select data-value="@Model.VatRate">
|
|
<button type="button" aria-expanded="false">
|
|
<swp-select-value>@(Model.VatRate == "25" ? "25% (standard)" : "0% (momsfri)")</swp-select-value>
|
|
<i class="ph ph-caret-down"></i>
|
|
</button>
|
|
<swp-select-dropdown>
|
|
<swp-select-option data-value="25" class="@(Model.VatRate == "25" ? "selected" : "")">25% (standard)</swp-select-option>
|
|
<swp-select-option data-value="0" class="@(Model.VatRate == "0" ? "selected" : "")">0% (momsfri)</swp-select-option>
|
|
</swp-select-dropdown>
|
|
</swp-select>
|
|
</swp-edit-row>
|
|
<swp-edit-row>
|
|
<swp-edit-label>@Model.LabelProductCost</swp-edit-label>
|
|
<swp-edit-value contenteditable="true">@Model.ProductCost</swp-edit-value>
|
|
</swp-edit-row>
|
|
<swp-edit-row>
|
|
<swp-edit-label>@Model.LabelCommission</swp-edit-label>
|
|
<swp-select data-value="@Model.Commission">
|
|
<button type="button" aria-expanded="false">
|
|
<swp-select-value>@(Model.Commission == "standard" ? "Standard (fra lønsats)" : Model.Commission == "fixed" ? "Fast beløb" : "Procent af pris")</swp-select-value>
|
|
<i class="ph ph-caret-down"></i>
|
|
</button>
|
|
<swp-select-dropdown>
|
|
<swp-select-option data-value="standard" class="@(Model.Commission == "standard" ? "selected" : "")">Standard (fra lønsats)</swp-select-option>
|
|
<swp-select-option data-value="fixed" class="@(Model.Commission == "fixed" ? "selected" : "")">Fast beløb</swp-select-option>
|
|
<swp-select-option data-value="percent" class="@(Model.Commission == "percent" ? "selected" : "")">Procent af pris</swp-select-option>
|
|
</swp-select-dropdown>
|
|
</swp-select>
|
|
</swp-edit-row>
|
|
</swp-edit-section>
|
|
</swp-card>
|
|
</swp-card-column>
|
|
|
|
<!-- Column 2 -->
|
|
<swp-card-column>
|
|
<swp-card>
|
|
<swp-card-header>
|
|
<swp-card-title>@Model.LabelDiscounts</swp-card-title>
|
|
</swp-card-header>
|
|
<swp-toggle-row>
|
|
<swp-toggle-label>@Model.LabelMemberDiscount</swp-toggle-label>
|
|
<swp-toggle-slider data-value="@(Model.MemberDiscount ? "yes" : "no")">
|
|
<swp-toggle-option>@Model.ToggleYes</swp-toggle-option>
|
|
<swp-toggle-option>@Model.ToggleNo</swp-toggle-option>
|
|
</swp-toggle-slider>
|
|
</swp-toggle-row>
|
|
<swp-toggle-row>
|
|
<swp-toggle-label>@Model.LabelGiftCardPayment</swp-toggle-label>
|
|
<swp-toggle-slider data-value="@(Model.GiftCardPayment ? "yes" : "no")">
|
|
<swp-toggle-option>@Model.ToggleYes</swp-toggle-option>
|
|
<swp-toggle-option>@Model.ToggleNo</swp-toggle-option>
|
|
</swp-toggle-slider>
|
|
</swp-toggle-row>
|
|
<swp-toggle-row>
|
|
<swp-toggle-label>@Model.LabelLoyaltyPoints</swp-toggle-label>
|
|
<swp-toggle-slider data-value="@(Model.LoyaltyPoints ? "yes" : "no")">
|
|
<swp-toggle-option>@Model.ToggleYes</swp-toggle-option>
|
|
<swp-toggle-option>@Model.ToggleNo</swp-toggle-option>
|
|
</swp-toggle-slider>
|
|
</swp-toggle-row>
|
|
</swp-card>
|
|
</swp-card-column>
|
|
|
|
<!-- Full-width: Price Structure -->
|
|
<swp-card class="full-width">
|
|
<swp-card-header>
|
|
<swp-card-title>@Model.LabelPriceStructure</swp-card-title>
|
|
</swp-card-header>
|
|
<swp-price-mode>
|
|
<swp-price-mode-btn data-mode="simple" class="@(Model.PriceMode == PlanTempus.Application.Features.Services.Components.PriceMode.Simple ? "active" : "")">@Model.LabelSimplePrice</swp-price-mode-btn>
|
|
<swp-price-mode-btn data-mode="matrix" class="@(Model.PriceMode == PlanTempus.Application.Features.Services.Components.PriceMode.Matrix ? "active" : "")">@Model.LabelMatrixPrice</swp-price-mode-btn>
|
|
</swp-price-mode>
|
|
|
|
<!-- Simple price view -->
|
|
<swp-price-simple style="display: @(Model.PriceMode == PlanTempus.Application.Features.Services.Components.PriceMode.Simple ? "block" : "none");">
|
|
<swp-edit-section>
|
|
<swp-edit-row>
|
|
<swp-edit-label>@Model.LabelPrice</swp-edit-label>
|
|
<swp-edit-value contenteditable="true">@Model.SimplePrice</swp-edit-value>
|
|
</swp-edit-row>
|
|
</swp-edit-section>
|
|
</swp-price-simple>
|
|
|
|
<!-- Matrix price view -->
|
|
<swp-price-matrix style="display: @(Model.PriceMode == PlanTempus.Application.Features.Services.Components.PriceMode.Matrix ? "block" : "none");">
|
|
<swp-data-table class="price-matrix">
|
|
<swp-data-table-header>
|
|
<swp-data-table-cell>@Model.LabelLevel</swp-data-table-cell>
|
|
<swp-data-table-cell>@Model.LabelShortHair</swp-data-table-cell>
|
|
<swp-data-table-cell>@Model.LabelMediumHair</swp-data-table-cell>
|
|
<swp-data-table-cell>@Model.LabelLongHair</swp-data-table-cell>
|
|
<swp-data-table-cell>@Model.LabelExtraLongHair</swp-data-table-cell>
|
|
</swp-data-table-header>
|
|
@foreach (var row in Model.PriceMatrix)
|
|
{
|
|
<swp-data-table-row>
|
|
<swp-data-table-cell>@row.Level</swp-data-table-cell>
|
|
<swp-data-table-cell class="mono"><span contenteditable="true">@row.ShortHair</span> kr</swp-data-table-cell>
|
|
<swp-data-table-cell class="mono"><span contenteditable="true">@row.MediumHair</span> kr</swp-data-table-cell>
|
|
<swp-data-table-cell class="mono"><span contenteditable="true">@row.LongHair</span> kr</swp-data-table-cell>
|
|
<swp-data-table-cell class="mono"><span contenteditable="true">@row.ExtraLongHair</span> kr</swp-data-table-cell>
|
|
</swp-data-table-row>
|
|
}
|
|
</swp-data-table>
|
|
|
|
<swp-add-button>
|
|
<i class="ph ph-plus"></i>
|
|
@Model.LabelAddLevel
|
|
</swp-add-button>
|
|
</swp-price-matrix>
|
|
</swp-card>
|
|
</swp-detail-grid>
|