@using EgwCoreLib.Razor
@if(mode == ModeView.View)
{
    <div class="col-sm-6 my-2">
        <div class="d-flex justify-content-between align-items-center">
            <h6 class="fw-bold">Sash @(CurrSashGroup.SashList.Count == 1 ? "" : (IndexSash + 1))</h6>
            <div class="dropdown">
                <button class="btn btn-outline-secondary dropdown-toggle btn-sm" type="button" @onclick="ToggleDropdown">
                    Copy content
                </button>
                <ul class="dropdown-menu @(isOpen ? "show" : "")" style="min-width:5rem; max-width:10rem">
                    @for (int k = 0; k <= CurrSashGroup.SashList.Count - 1; k++)
                    {
                        @if (k != IndexSash)
                        {
                            int IndexCopy = k;
                            int IndexModify = IndexSash;
                            <li>
                                <button class="dropdown-item" @onclick="() => RaiseCopyContentSash(IndexCopy, IndexModify)">
                                Sash @(k + 1)
                                </button>
                            </li>
                        }
                    }
                </ul>
            </div>  
            <button class="btn btn-primary btn-sm" type="button" @onclick="() => doEdit(IndexSash)">Edit</button>
        </div>
        <div class="input-group mb-2 mt-2">
            <label class="input-group-text">Tipology</label>
            <select class="form-select" @bind="@CurrSashDim.SelOpeningTypeIndex">
                @foreach (var openingType in CurrSashDim.OpeningTypeList)
                {
                    <option value=@(openingType.Id)>@(openingType.Name)</option>
                }
            </select>
        </div>
        <div class="input-group mb-2">
            <span class="input-group-text">Dimension</span>
            <InputDouble CssClass="form-control form-control text-end" Decimals="@CssDecimals()" @bind-Value="@CurrSashDim.dDimension"></InputDouble>
            @* <input type="number" class="form-control" @bind="@CurrSashDim.dDimension"> *@
            <select class="form-select" style="max-width:6rem; background-color:#e9ecef" @bind="@CurrSashDim.SelMeasureTypeIndex">
                @foreach (var mType in CurrSashDim.MeasureTypeList)
                {
                    <option value=@(mType.Id)>
                        @switch (mType.Name)
                        {
                            case "Absolut":
                                {
                                    <span class="input-group-text">mm</span>
                                    break;
                                }
                            case "Proportional":
                                {
                                    <span class="input-group-text">*</span>
                                    break;
                                }
                            case "Percentage":
                                {
                                    <span class="input-group-text">%</span>
                                    break;
                                }
                        }
                    </option>
                }
            </select>
        </div>
        <div class="d-flex justify-content-start fs-5 mb-2">
            <div class="px-1">
                <input class="form-check-input ml-auto" type="checkbox" name="Handle" checked="@CurrSashDim.bHasHandle" @onclick="() => RaiseChangeHandle(CurrSashDim, CurrSashGroup)">
            </div>
            <div class="px-2">
                <label class="form-check-label fs-6 text-dark">Handle</label>
            </div>
        </div>
        @*
         <div class="col">
            <div class="row justify-content-between align-items-center">
                <div class="col d-flex justify-content-start align-items-center">
                    <h6 class="fw-bold">Joints</h6>
                </div>
                <div class="col d-flex justify-content-md-end align-items-center">
                    <button class="btn btn-primary" type="button" @onclick="() => changeCollapsed()">@((MarkupString)jointCollapsedIcon)</button>
                </div>
            </div>
            
            @if (!JointCollapsed)
            {
                <div class="row justify-content-between align-items-center mt-2">
                    <div class="col d-flex">
                        <div class="input-group mb-2 justify-content-center">
                            <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.ANGLED)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.ANGLED)">Angled</button>
                        </div>
                    </div>
                    <div class="col d-flex">
                        <div class="input-group mb-2 justify-content-center">
                            <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_H)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_H)">Horizontal</button>
                        </div>
                    </div>
                    <div class="col d-flex">
                        <div class="input-group mb-2 justify-content-center">
                            <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_V)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_V)">Vertical</button>
                        </div>
                    </div>
                </div>
            }
            @if (!JointCollapsed)
            {
                @foreach (Joint joint in CurrSashDim.JointList)
                {
                    <EditJoint CurrRec="joint" EC_Update="UpdateJoint"></EditJoint>
                }
            }
        </div>
        
        @if (!(CurrAnta.AreaList[0] is Split))
        {
            <div class="row">
                <div class="col-md-12 col-lg-6">
                    <div class="input-group mb-2 justify-content-center">
                        <button class="btn btn-outline-secondary btn-sm" @onclick="() => CurrAnta.AddSplit()">Add split</button>
                    </div>
                </div>
                <div class="col-md-12 col-lg-6">
                    <div class="input-group mb-2 justify-content-center">
                        <button class="btn btn-outline-secondary btn-sm">Add inglesina</button>
                    </div>
                </div>
            </div>
        }
        <div class="row d-flex justify-content-center align-items-center">
            @for (int k = 0; k <= CurrSashGroup.SashList.Count - 1; k++)
            {
                @if (k != IndexSash)
                {
                    int IndexCopy = k;
                    int IndexModify = IndexSash;
                    <div class="col-md-12 col-lg-6 my-1">
                        <div class="input-group justify-content-center">
                            <button class="btn btn-outline-secondary btn-sm" @onclick="() => RaiseCopyContentSash(CurrSashGroup, IndexCopy, IndexModify)">Copy sash @(k + 1)</button>
                        </div>
                    </div>
                }
            }
        </div>*@
    </div>
}
else
{
    <div class="border rounded py-2 px-3">
        <div class="d-flex justify-content-between align-items-center mb-2">
            <h6 class="fw-bold text-nowrap">Sash @(CurrSashGroup.SashList.Count == 1 ? "" : (IndexSash + 1))</h6>
            @if (!(CurrAnta.AreaList[0] is Split))
            {
                <div class="input-group mb-2 justify-content-center">
                    <button class="btn btn-outline-secondary btn-sm" @onclick="() => CurrAnta.AddSplit()">Add split</button>
                </div>
                <div class="input-group mb-2 justify-content-center">
                    <button class="btn btn-outline-secondary btn-sm">Add inglesina</button>
                </div>
            }
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @onclick="() => ClosePopup(IndexSash)"></button>
        </div>
        <div class="row">
                <div class="col-sm-6 my-2">
                    <div class="input-group mb-2">
                        <label class="input-group-text">Tipology</label>
                        <select class="form-select" @bind="@CurrSashDim.SelOpeningTypeIndex">
                            @foreach (var openingType in CurrSashDim.OpeningTypeList)
                            {
                                <option value=@(openingType.Id)>@(openingType.Name)</option>
                            }
                        </select>
                    </div>
                    <div class="input-group mb-2">
                        <span class="input-group-text">Dimension</span>
                        <InputDouble CssClass="form-control form-control text-end" Decimals="@CssDecimals()" @bind-Value="@CurrSashDim.dDimension"></InputDouble>
                        <select class="form-select" style="max-width:6rem; background-color:#e9ecef" @bind="@CurrSashDim.SelMeasureTypeIndex">
                            @foreach (var mType in CurrSashDim.MeasureTypeList)
                            {
                                <option value=@(mType.Id)>
                                    @switch (mType.Name)
                                    {
                                        case "Absolut":
                                            {
                                                <span class="input-group-text">mm</span>
                                                break;
                                            }
                                        case "Proportional":
                                            {
                                                <span class="input-group-text">*</span>
                                                break;
                                            }
                                        case "Percentage":
                                            {
                                                <span class="input-group-text">%</span>
                                                break;
                                            }
                                    }
                                </option>
                            }
                        </select>
                    </div>
                    <div class="d-flex justify-content-start fs-5 mb-2">
                        <div class="px-1">
                            <input class="form-check-input ml-auto" type="checkbox" name="Handle" checked="@CurrSashDim.bHasHandle" @onclick="() => RaiseChangeHandle(CurrSashDim, CurrSashGroup)">
                        </div>
                        <div class="px-2">
                            <label class="form-check-label fs-6 text-dark">Handle</label>
                        </div>
                    </div>
                    @* <div class="row d-flex justify-content-center align-items-center">
                        @for (int k = 0; k <= CurrSashGroup.SashList.Count - 1; k++)
                        {
                            @if (k != IndexSash)
                            {
                                int IndexCopy = k;
                                int IndexModify = IndexSash;
                                <div class="col-md-12 col-lg-6 my-1">
                                    <div class="input-group justify-content-center">
                                        <button class="btn btn-outline-secondary btn-sm" @onclick="() => RaiseCopyContentSash(IndexCopy, IndexModify)">Copy sash @(k + 1)</button>
                                    </div>
                                </div>
                            }
                        }
                    </div> *@
                </div>
                <div class="col-sm-6">
                    <div class="row justify-content-between align-items-center">
                        <div class="col d-flex justify-content-start align-items-center">
                            <h6>Joints</h6>
                        </div>
                        <div class="col d-flex">
                            <div class="input-group mb-2 justify-content-center">
                                <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.ANGLED)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.ANGLED)">Angled</button>
                            </div>
                        </div>
                        <div class="col d-flex">
                            <div class="input-group mb-2 justify-content-center">
                                <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_H)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_H)">Horizontal</button>
                            </div>
                        </div>
                        <div class="col d-flex">
                            <div class="input-group mb-2 justify-content-center">
                                <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_V)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_V)">Vertical</button>
                            </div>
                        </div>
                    </div>
                    @foreach (Joint joint in CurrSashDim.JointList)
                    {
                        <EditJoint CurrRec="joint" EC_Update="UpdateJoint"></EditJoint>
                    }
                </div>
            </div>
    </div>
}


@* <div class="modal" tabindex="-1" style="display:block; background-color: rgba(10,10,10,.6);" role="dialog">
    <div class="modal-dialog modal-dialog-centered modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <div class="col-3 text-start fs-3">
                    Sash @(CurrSashGroup.SashList.Count == 1 ? "" : (IndexSash + 1))
                </div>
                @if (!(CurrAnta.AreaList[0] is Split))
                {
                    <div class="col-3 fs-4">
                        <div class="input-group mb-2 justify-content-center">
                            <button class="btn btn-outline-secondary btn-sm" @onclick="() => CurrAnta.AddSplit()">Add split</button>
                        </div>
                    </div>
                    <div class="col-3 fs-4">
                        <div class="input-group mb-2 justify-content-center">
                            <button class="btn btn-outline-secondary btn-sm">Add inglesina</button>
                        </div>
                    </div>
                }
                <div class="col-3 text-end fs-4">
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @onclick="ClosePopup">
                    </button>
                </div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-sm-6 my-2">
                        <div class="input-group mb-2">
                            <label class="input-group-text">Tipology</label>
                            <select class="form-select" @bind="@CurrSashDim.SelOpeningTypeIndex">
                                @foreach (var openingType in CurrSashDim.OpeningTypeList)
                                {
                                    <option value=@(openingType.Id)>@(openingType.Name)</option>
                                }
                            </select>
                        </div>
                        <div class="input-group mb-2">
                            <span class="input-group-text">Dimension</span>
                            <InputDouble CssClass="form-control form-control text-end" Decimals="@CssDecimals()" @bind-Value="@CurrSashDim.dDimension"></InputDouble>
                            <select class="form-select" style="max-width:6rem; background-color:#e9ecef" @bind="@CurrSashDim.SelMeasureTypeIndex">
                                @foreach (var mType in CurrSashDim.MeasureTypeList)
                                {
                                    <option value=@(mType.Id)>
                                        @switch (mType.Name)
                                        {
                                            case "Absolut":
                                                {
                                                    <span class="input-group-text">mm</span>
                                                    break;
                                                }
                                            case "Proportional":
                                                {
                                                    <span class="input-group-text">*</span>
                                                    break;
                                                }
                                            case "Percentage":
                                                {
                                                    <span class="input-group-text">%</span>
                                                    break;
                                                }
                                        }
                                    </option>
                                }
                            </select>
                        </div>
                        <div class="d-flex justify-content-start fs-5 mb-2">
                            <div class="px-1">
                                <input class="form-check-input ml-auto" type="checkbox" name="Handle" checked="@CurrSashDim.bHasHandle" @onclick="() => RaiseChangeHandle(CurrSashDim, CurrSashGroup)">
                            </div>
                            <div class="px-2">
                                <label class="form-check-label fs-6 text-dark">Handle</label>
                            </div>
                        </div>
                        <div class="row d-flex justify-content-center align-items-center">
                            @for (int k = 0; k <= CurrSashGroup.SashList.Count - 1; k++)
                            {
                                @if (k != IndexSash)
                                {
                                    int IndexCopy = k;
                                    int IndexModify = IndexSash;
                                    <div class="col-md-12 col-lg-6 my-1">
                                        <div class="input-group justify-content-center">
                                            <button class="btn btn-outline-secondary btn-sm" @onclick="() => RaiseCopyContentSash(IndexCopy, IndexModify)">Copy sash @(k + 1)</button>
                                        </div>
                                    </div>
                                }
                            }
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="row justify-content-between align-items-center">
                            <div class="col d-flex justify-content-start align-items-center">
                                <h6 class="fw-bold">Joints</h6>
                            </div>
                            <div class="col d-flex">
                                <div class="input-group mb-2 justify-content-center">
                                    <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.ANGLED)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.ANGLED)">Angled</button>
                                </div>
                            </div>
                            <div class="col d-flex">
                                <div class="input-group mb-2 justify-content-center">
                                    <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_H)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_H)">Horizontal</button>
                                </div>
                            </div>
                            <div class="col d-flex">
                                <div class="input-group mb-2 justify-content-center">
                                    <button class="@ButtonJointCss(WebWindowComplex.Json.WindowConst.Joints.FULL_V)" @onclick="() => ChangeAllJoints(WebWindowComplex.Json.WindowConst.Joints.FULL_V)">Vertical</button>
                                </div>
                            </div>
                        </div>
                        @foreach (Joint joint in CurrSashDim.JointList)
                        {
                            <EditJoint CurrRec="joint" EC_Update="UpdateJoint"></EditJoint>
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>
</div> *@