@{
    ViewBag.Title = "ثبت سفارش";
}
@using GheyasPlusShop.Utils;
@using GheyasPlusShop.Controllers
@using Utils;
@model GheyasPlusShop.Models.Home.ViewOrderModel

@section styles{
    @if (ViewBag.DesktopSection)
    {
        <style>
        body {
            background-color: #eceff1;
        }

        .header-top, .nav-header {
            display: none !important;
        }

        .menu-box {
            position: absolute;
            top: -24px;
            left: 0;
            right: 0;
            margin: 0 auto;
            width: 230px;
        }

            .menu-box .menu-img {
                width: 38px;
                height: 38px;
                padding: 5px;
                margin: 0 auto 5px;
                border: 2px solid @(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);
                border-radius: 100%;
                background-color: #fff;
            }

            .menu-box .menu-title {
                color:@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);
                font-size: 14px;
            }

        .margin24 {
            margin: 24px 0 14px;
        }

        .margin15 {
            margin: 15px 0;
        }

        .address-item {
            color: #b9b6b6;
            font-size: 14px;
            margin-left: 4px;
        }

        .go-right-left {
            position: absolute;
            cursor: pointer;
            top: 140px;
        }

        .suggested .suggested-img {
            width: 100%;
            height: 200px;
        }

        .suggested .star {
            width: unset;
            height: unset;
            margin-top: 5px;
        }

        .suggested label {
            margin: 12px 0 5px;
            font-weight: 700;
        }

        .suggested > div {
            color: @(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);
        }

            .suggested > div > span {
                margin-left: 6px;
                font-size: 14px;
                font-weight: 700;
            }
        </style>
    }
    else
    {
        <style>
            header, footer {
                display: none;
            }

            #orderReview h3 {
                font-size: 14px;
                font-weight: 600;
                color: #000;
                margin: 30px 10px;
                margin-bottom: 15px;
            }

            .checkout-wrapper {
                background-color: #fff;
                border-radius: 20px;
            }



                .checkout-wrapper .item-label {
                    font-size: 14px;
                    font-weight: 400;
                    color: #464646;
                }

                .checkout-wrapper .item-title {
                    font-size: 14px;
                    font-weight: 500;
                    color: #000;
                }

            .sum .item-title {
                font-size: 16px;
                font-weight: 700;
                color: #A022A1;
            }

            .sum .item-label {
                font-size: 16px;
                font-weight: 700;
                color: #A022A1;
            }

            .menu-box {
                width: 250px;
                position: relative;
                margin: 0 auto;
            }

                .menu-box hr {
                    position: absolute;
                    width: 72%;
                    top: 3px;
                    right: calc(100% - 224px);
                    color: #000;
                    z-index: 0;
                }

            .check-order, .end-order {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                z-index: 1;
            }

            .menu-img {
                background-color: #fff;
                border-radius: 50px;
                width: 40px;
                height: 40px;
                display: flex;
                align-items: center;
                justify-content: center;
                border: 1px solid #444B54;
            }

                .menu-img img {
                    filter: grayscale(1)
                }

            .selected .menu-img {
                border: 1px solid #249099;
            }

                .selected .menu-img img {
                    filter: grayscale(0) !important;
                    fill: #249099;
                }

            .selected .menu-title {
                color: #249099;
            }



            .all-product-in-basket {
                background-color: #fff;
                border-radius: 16px;
                padding: 16px;
                padding-bottom: 95px;
                height: calc(100vh - 90px);
            }

            .product .info-product {
                display: flex;
                justify-content: space-between;
                gap: 10px;
            }

                .product .info-product .avatar {
                    width: 60px;
                }

                    .product .info-product .avatar img {
                        width: 60px;
                        height: 60px;
                        border-radius: 50px;
                    }

                .product .info-product .text {
                    width: 90%;
                    padding: 3px 5px;
                }

                    .product .info-product .text h2 {
                        font-weight: 600;
                        font-size: 14px;
                        line-height: 22px;
                        color: #201A1B;
                        width: 100%;
                        max-height: 45px;
                        overflow: hidden;
                    }

                .product .info-product .delete {
                    width: 10%;
                    text-align: left;
                }

                .product .info-product .text .count-number {
                    font-weight: 500;
                    font-size: 12px;
                    line-height: 16px;
                    color: #4B4548;
                }


            .product:last-child hr {
                display: none;
            }

            .price {
                font-size: 14px;
                font-weight: 700;
                color: #201A1B;
                position: relative;
                display: flex;
                gap: 7px;
                width: max-content;
                padding: 0px 2px;
            }

                .price .currency {
                    color: #655C5E;
                    font-size: 12px;
                    font-weight: 400;
                }

            .continue {
                position: fixed;
                bottom: 0;
                right: 0;
                background-color: #ffffff !important;
                padding: 0 15px;
            }

                .continue .text, .continue .currency {
                    font-weight: 500;
                    font-size: 12px;
                    color: #4B4548;
                }

                .continue .sum-price {
                    font-weight: 700;
                    font-size: 14px;
                    color: #000;
                }

            button, button-accept {
                height: 40px !important;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            a.button-accept {
                text-decoration: none;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-top: 10px;
            }
        </style>
    }
}

@if (ViewBag.DesktopSection)
{

    <div>
        <div class="text-center" style="height:110px;background-color:#fff;">
            <a href="@Html.GetHref("")"><img src="@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteLogo.ToBase64File())" style="height: 48px;max-width: 128px;cursor:pointer;margin-top: 15px;" /></a>
        </div>

        @*بررسی سفارش*@
    <div class="position-relative" id="orderReview" style="padding:70px 40px 20px;">
        <div class="menu-box d-flex align-items-center justify-content-between">
            <div class="">
                <div class="menu-img" style="width:38px;border-radius:100%;background-color:#fff;">
                    <img src="~/App_Images/shoping/orderReview.svg" class="svg" style="fill:@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);" />
                </div>
                <div class="menu-title" style="font-weight:700;">بررسی سفارش</div>
            </div>
            <div class="">
                <div class="menu-img" style="border:1px solid #757575;background-color:#eceff1;">
                    <img src="~/App_Images/shoping/orderFinal.svg" class="svg" />
                </div>
                <div class="menu-title" style="color:#b9b6b6;">اتمام خرید و ارسال</div>
            </div>
        </div>

        
        <div class="container-fluid">
            <div class="row">
                <div class="col-9 no-padding-left">
                    @*آدرس تحویل سفارش*@
                    <div class="no-padding no-margin form-card">
                        <div class="px-2 py-1" style="line-height: 36px; font-weight: 700; background-color: #cfd8dc;">
                            آدرس تحویل سفارش
                        </div>
                        <div class="container-fluid" style="padding:15px;">
                            <div class="row">



                                <div>
                                    <input type="radio" class="radio-control" name="address" checked />
                                    <span style="font-weight:700;">ارسال به آدرس ثبت شده</span>
                                </div>
                                <div style="padding-right: 30px!important;">
                                    <div class="p-1">
                                        <span class="address-item">گیرنده</span>
                                        <span>@Model.WebUser.FullName</span>
                                    </div>
                                    <div class="p-1">
                                        <span class="address-item">شماره تماس</span>
                                        <span>@(Model.WebUser.PassNo.IsNotEmpty() ? Model.WebUser.MobileNo : Model.WebUser.TelNo)</span>
                                    </div>
                                    <div class="p-1" style="display:none;">
                                        <span class="address-item">کد پستی</span>
                                        <span>15612655641561465</span>
                                    </div>
                                    <div class="p-1">
                                        <span class="address-item">آدرس</span>
                                        <span id="spAddress">@Model.WebUser.Address</span>
                                    </div>
                                    <div class="p-1" style="margin-bottom:0;display: none;">
                                        <button class="button-accept" id="btnEditAddress" style="width: 120px;height: 30px;background-color: #fff;color: #00838f;border: 1px solid #00838f;margin-bottom: 20px;">اصلاح این آدرس</button>
                                        <div id="divEditAddress" class="float-left" style="width:calc(100% - 130px);display:none;">
                                            <input type="text" class="text-control" id="newAddress" style="width: calc(100% - 118px);display: inline-block;" value="@Model.WebUser.Address" />
                                            <button class="button-accept" id="btnOkAddress" style="width: 50px;height: 30px;background-color: #fff;color: #00838f;border: 1px solid #00838f;margin-left: 4px;">تایید</button>
                                            <button class="button-default" id="btnCancelAddress" style="width: 50px;height: 30px;border: 1px solid #E0E0E0;">انصراف</button>
                                            <div class="col-12 no-padding text-center" style="color: red;">
                                                <span id="spAddressError"></span>
                                            </div>
                                        </div>
                                    </div>

                                </div>


                                <div class="col-6 no-padding-left" style="border-right:1px solid #ccc;padding-right: 25px;display:none;">
                                    <div class="col-12 no-padding">
                                        <input type="radio" class="radio-control" name="address" />
                                        <span style="font-weight:700;">ارسال به آدرس دیگر</span>
                                    </div>
                                    <div class="col-12 no-padding margin24">
                                        <div class="row">
                                            <div class="col-6 has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>استان</span>
                                            </div>
                                            <div class="col-6 no-padding has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>شهر</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 no-padding has-float-label">
                                        <textarea class="text-control" style="height:60px;"></textarea>
                                        <span>آدرس پستی</span>
                                    </div>
                                    <div class="col-12 no-padding margin24">
                                        <div class="row">
                                            <div class="col-4 has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>پلاک</span>
                                            </div>
                                            <div class="col-4 has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>واحد</span>
                                            </div>
                                            <div class="col-4 no-padding has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>کد پستی</span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-12 no-padding has-float-label">
                                        <input type="text" class="text-control" />
                                        <span>نام و نام خانوادگی تحویل گیرنده</span>
                                    </div>
                                    <div class="col-12 no-padding margin24">
                                        <div class="row">
                                            <div class="col-6 has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>شماره موبایل</span>
                                            </div>
                                            <div class="col-6 no-padding has-float-label">
                                                <input type="text" class="text-control" />
                                                <span>شماره تلفن ثابت</span>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>

                    @*نمایش سفارش*@
                    <div class="no-padding no-margin form-card" style="margin-top:20px!important;">
                        <div class="px-2 py-1" style="line-height:36px;font-weight: 700;background-color:#cfd8dc;">
                            نمایش سفارش
                        </div>
                        <div class="list-items position-relative" style="min-height:140px;">
                            @foreach (var product in Model.AddShopingCart)
                            {
                                <div class="container-fluid row-item" data-id="@product.Id" style="border-bottom:1px solid #ccc;">
                                    <div class="row d-flex align-items-center">
                                        <div class="col-4" style="display:flex;padding:6px;">
                                            <img src="@product.PicThumb" style="width:54px;height:54px;border-radius:50%;border:1px solid #ccc;" />
                                            <div class="d-flex align-items-center justify-content-evenly flex-column" style="width:calc(100% - 77px);margin-right:8px;">
                                                <div style="font-weight: 700;margin:6px 0;">@product.NameKala</div>
                                                <div style="display:none;"><span>کد پارت کالا</span><span id="codePartProperty">@product.CodePartProperty</span></div>
                                                @foreach (var prop in product.Property)
                                                {
                                                    <div class="">
                                                        @if (prop.PropertyColor.IsNotEmpty())
                                                        {
                                                            <div style="width: 14px;height: 14px;background-color:@(prop.PropertyColor);border-radius:2px;border: 1px solid #e4e4e4;margin-left:5px;float: right;"></div>
                                                        }
                                                        <span data-id="propName">@(prop.PropertyName + " : " + prop.PropertyValue)</span>
                                                    </div>
                                                }
                                            </div>
                                        </div>
                                        <div class="col-3" style="padding-top: 12px;font-size: 14px;">
                                            <span style="text-decoration:line-through;font-size:10px;" @(product.DisplayOldPrice == product.DisplayNewPrice ? "hidden=hidden" : "") class="oldPrice">@product.DisplayOldPrice.ToNumber()<span style="margin-right:3px;">ریال</span></span>
                                            <span class="newPrice">@product.DisplayNewPrice.ToNumber()</span><span style="margin-right:3px;">ریال</span>
                                        </div>
                                        <div class="col-2" style="padding-top: 12px;">
                                            <input type="text" style="width: 40px;border: 0;" readonly class="text-left no-border countProduct" value="@product.Count" /><span> عدد</span>
                                        </div>
                                        <div class="col-2" style="padding-top: 12px;">
                                            <span style="font-weight:700;" class="sumPrice">@((product.DisplayNewPrice * product.Count).ToNumber())</span><span style="margin-right:3px;">ریال</span>
                                        </div>
                                        <div class="col-1 text-left" style="padding-top: 12px;">
                                            <img src="~/App_Images/index/deleteProduct.svg" class="deleteShoppingCart" style="cursor:pointer;" title="حذف کالا" />
                                        </div>
                                    </div>
                                </div>
                            }

                            @*درصورت حذف تمام سفارشات، این کادر نمایش داده میشود*@
                            <div id="noShopping" style="position: absolute;left: 0;right: 0;top: 15px;width:254px;height:110px;margin:0 auto;padding:32px 0;text-align:center;border:1px solid #ccc;border-radius: 5px;display:none;">
                                <div style="font-size: 14px;font-weight: 700;margin-bottom:10px;">هیچ سفارشی جهت خرید وجود ندارد</div>
                                <div>
                                    <a href="@Html.GetHref("")">بازگشت به صفحه اول</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-3">
                    <div class="col-12 no-margin form-card" style="height:285px;padding:20px 15px!important;">
                        <div class="col-12 no-padding" style="margin-bottom:15px;">
                            <span>مجموع قیمت کالاها</span>
                            <span style="float:left;"><span id="sumPriceProduct">@Model.AddShopingCart.Sum(x => x.DisplayOldPrice * x.Count).ToNumber()</span> ( ریال ) </span>
                        </div>
                        <div class="col-12 no-padding">
                            <span>تخفیف</span>
                            <span style="float:left;"><span id="sumDiscount">@((Model.AddShopingCart.Sum(x => x.DisplayOldPrice * x.Count) - Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count)).ToNumber())</span> ( ریال ) </span>
                        </div>
                        <div class="col-12 no-padding" style="border-top:1px solid #ccc;padding-top:15px!important;margin:15px 0;">
                            <span>جمع</span>
                            <span style="float:left;"><span id="sumPriceAll">@Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count).ToNumber()</span> ( ریال ) </span>
                        </div>
                        <div class="col-12 no-padding">
                            <span>هزینه ارسال</span>
                            <span style="float:left;"><span id="pricePost">0</span> ( ریال ) </span>
                        </div>
                        <div class="col-12 no-padding" style="border-top:1px solid #ccc;padding-top:15px!important;margin:15px 0;color:@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);">
                            <span>مبلغ قابل پرداخت</span>
                            <span style="float:left;"><span style="font-weight:700;font-size:14px;" class="sumPricePay">@Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count).ToNumber()</span> ( ریال ) </span>
                        </div>
                        <div class="col-12 no-padding">
                            <button type="button" class="button-accept" id="continueOrder" style="width: 100%;height: 40px;background-color: #00838f;margin-top: 12px;">ادامه و ثبت نهایی</button>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>


        @*اتمام خرید و ارسال*@
    <div class="position-relative" id="orderFinal" style="padding:70px 15px 20px!important;display:none;">

        <div class="menu-box d-flex align-items-center justify-content-between">
            <div class="">
                <div class="menu-img" style="border: 1px solid #757575; background-color: #fff;">
                    <img src="~/App_Images/shoping/orderReview.svg" class="svg" />
                </div>
                <div class="menu-title" style="color: #b9b6b6; ">بررسی سفارش</div>
            </div>
            <div class="">
                <div class="menu-img" style=" width: 38px; border-radius: 100%; background-color: #eceff1;">
                    <img src="~/App_Images/shoping/orderFinal.svg" class="svg" style="fill:@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteColor);" />
                </div>
                <div class="menu-title" style="font-weight: 700;">اتمام خرید و ارسال</div>
            </div>
        </div>

        <div class="col-8 offset-2">
            <div class="col-12 no-padding no-margin form-card text-center" style="padding:20px 0!important;font-size:14px;">
                <img src="~/App_Images/shoping/ShoppingProcessFinal.svg" style="width: 62px;" />
                <div style="margin:10px 0;">سفارش <span style="color:#2896a0;font-weight:700;margin:0 5px;" id="spFactorNumber"></span> با موفقیت ثبت گردید.</div>
                <div>لطفا پرداخت وجه را اینترنتی و یا هنگام تحویل سفارش ، با کارت‌خوان سیار انجام دهید.</div>
                <div style="margin:10px 0;color:#b9b6b6;"> سفارش خود را میتوانید در حساب کاربری خود بخش <a style="color:#2896a0;font-weight:700;border-bottom: 1px solid #00838f;cursor:pointer;" href="@Html.GetHref("Home/PersonalProfile#order")">"سفارش‌های من"</a> پیگیری نمایید.</div>
                <div>
                    <a href="@Html.GetHref("")"><button type="button" class="button-accept" style="width:145px;height: 46px;background-color: #00838f;">بازگشت به صفحه اول</button></a>
                </div>
            </div>
            <div class="col-12 no-padding no-margin form-card" style="padding:18px!important;margin:20px 0!important;">
                <div class="col-12">
                    <span class="address-item">گیرنده</span>
                    <span>@Model.WebUser.FullName</span>
                </div>
                <div class="col-12" style="margin:10px 0;">
                    <span class="address-item">شماره تماس</span>
                    <span>@(Model.WebUser.PassNo.IsNotEmpty() ? Model.WebUser.MobileNo : Model.WebUser.TelNo)</span>
                    @*<span class="address-item" style="margin-right:25px;">کد پستی</span>
                    <span>15612655641561465</span>*@
                </div>
                <div class="col-12">
                    <span class="address-item">آدرس</span>
                    <span>@Model.WebUser.Address</span>
                </div>
                <div class="col-12 no-padding" style="border-top:1px dotted #ccc;margin-top:15px;padding-top:15px!important;">
                    <div class="row">
                        <div class="col-4" style="display:none;">
                            <span class="address-item">نوع ارسال</span>
                            <span>پست پیشتاز</span>
                        </div>
                        <div class="col-4" style="display:none;">
                            <span class="address-item">روش پرداخت</span>
                            <span>اینترنتی</span>
                        </div>
                        <div class="col-12 text-center">
                            <span class="address-item">مبلغ کل</span>
                            <span style="margin-left:5px;font-size: 14px;font-weight: 700;" class="sumPricePay">@Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count).ToNumber()</span><span>ریال</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        @*محصولات پیشنهادی برای شما*@
        <div class="col-12 no-padding" style="font-weight:700;display:none;">محصولات پیشنهادی برای شما</div>
        <div class="col-12 form-card" style="border-radius: 6px;padding:36px 90px!important;margin: 8px 0 0!important;display:none;">
            <div class="row">
                <div class="col-3 text-center suggested">
                    <img src="~/App_Images/index/watch-2.png" class="suggested-img" />
                    <label>نام کالای خیلی قشنگ</label>
                    <div><span>20,000,000</span>ریال</div>
                    <div>
                        <img src="~/App_Images/index/star.svg" class="star svg" style="fill:#ccc;" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                    </div>
                </div>
                <div class="col-3 text-center suggested">
                    <img src="~/App_Images/index/watch-2.png" class="suggested-img" />
                    <label>نام کالای خیلی قشنگ</label>
                    <div><span>20,000,000</span>ریال</div>
                    <div>
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                    </div>
                </div>
                <div class="col-3 text-center suggested">
                    <img src="~/App_Images/index/watch-2.png" class="suggested-img" />
                    <label>نام کالای خیلی قشنگ</label>
                    <div><span>20,000,000</span>ریال</div>
                    <div>
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                    </div>
                </div>
                <div class="col-3 text-center suggested">
                    <img src="~/App_Images/index/watch-2.png" class="suggested-img" />
                    <label>نام کالای خیلی قشنگ</label>
                    <div><span>20,000,000</span>ریال</div>
                    <div>
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                        <img src="~/App_Images/index/star.svg" class="star svg" />
                    </div>
                </div>
            </div>
            <img src="~/App_Images/index/goright.svg" class="go-right-left" style="right:0;" />
            <img src="~/App_Images/index/goleft.svg" class="go-right-left" style="left:0;" />
        </div>
    </div>

    </div>
}
else
{
    <div id="MobileSection" class="d-flex align-items-center justify-content-center" style="padding-top: 50px">
        <div class="container-fluid px-4" style=" margin-bottom: 100px; ">
            <div class="logo d-flex justify-content-center mb-2">
                <a href="@Html.GetHref("")"><img src="@(StaticManager.WebsiteSetting[ConfigManager.NickName].WebsiteLogo.ToBase64File())" /></a>
            </div>
            <div>
                @*بررسی سفارش*@
                <div id="orderReview">

                    <div class="menu-box d-flex align-items-center justify-content-between">
                        <div class="check-order selected">
                            <div class="menu-img">
                                <img src="~/App_Images/shoping/orderReview.svg" class="svg" />
                            </div>
                            <div class="menu-title" style="font-weight:700;">بررسی سفارش</div>
                        </div>
                        <div class="end-order">
                            <div class="menu-img">
                                <img src="~/App_Images/shoping/orderFinal.svg" class="svg" />
                            </div>
                            <div class="menu-title" style="color:#b9b6b6;">اتمام خرید و ارسال</div>
                        </div>
                        <hr />
                    </div>



                    @*آدرس تحویل سفارش*@
                    <h3>آدرس ارسال</h3>
                    <div class="checkout-wrapper px-3 py-4">
                        <div class="item-label">نام و نام خانوادگی گیرنده: </div>
                        <div class="item-title pb-2">@Model.WebUser.FullName</div>
                        <div class="item-label">نشانی</div>
                        <div class="item-title pb-2">@Model.WebUser.Address</div>
                        <div class="item-label">کدپستی</div>
                        <div class="item-title pb-2">15612655641561465</div>
                        <div class="item-label">شماره تماس</div>
                        <div class="item-title pb-2">@(Model.WebUser.PassNo.IsNotEmpty() ? Model.WebUser.MobileNo : Model.WebUser.TelNo)</div>
                    </div>

                    @*جزئیات صورت حساب*@
                    <h3>جزئیات صورت حساب</h3>
                    <div class="checkout-wrapper px-3 py-4">
                        <div class="d-flex align-items-center justify-content-between">
                            <div class="item-label">مجموع کالاها</div>
                            <div class="item-title pb-2"><span id="sumPriceAll">@(Model.AddShopingCart.Sum(x => x.DisplayOldPrice * x.Count).ToNumber())</span>(ریال)</div>
                        </div>
                        <div class="d-flex align-items-center justify-content-between">
                            <div class="item-label">تخفیف</div>
                            <div class="item-title pb-2"><span id="sumDiscount">@((Model.AddShopingCart.Sum(x => x.DisplayOldPrice * x.Count) - Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count)).ToNumber())</span>(ریال)</div>
                        </div>
                        <hr />
                        <div class="d-flex align-items-center justify-content-between sum">
                            <div class="item-label">مبلغ قابل پرداخت </div>
                            <div class="item-title pb-2"><span class="sumPricePay">@(Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count).ToNumber())</span>(ریال)</div>
                        </div>
                    </div>


                    @*نمایش سفارش*@
                    <h3>نمایش سفارش</h3>
                    <div class="checkout-wrapper px-3 py-4">
                        @foreach (var product in Model.AddShopingCart)
                        {
                            <div class="product row-item" data-id="@product.Id" data-prop="@product.CodePartProperty">
                                <div class="info-product">
                                    <div class="avatar"><img src="@product.PicThumb" alt="@product.NameKala" /></div>
                                    <div class="w-100">
                                        <div class="d-flex w-100 align-items-baseline justify-content-between">
                                            <div class="text">
                                                <h2>@product.NameKala</h2>
                                            </div>
                                            <div class="delete deleteShoppingCart"><img src="~/App_Images/index/delete-shoping.svg" /></div>
                                        </div>
                                        <div class="d-flex align-items-center justify-content-between">
                                            <div class="d-none sumPrice">@((product.DisplayNewPrice * product.Count).ToNumber())</div>
                                            <div class="d-none oldPrice">@product.DisplayOldPrice.ToNumber()</div>
                                            <div class="count-number" style="padding-right: 3px"><span class="countProduct">@product.Count</span> @product.UnitName</div>
                                            <div class="price">
                                                <span class="newPrice">@((product.DisplayNewPrice * product.Count).ToNumber())</span> <span class="currency" style="">ریال</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <hr />
                            </div>
                        }
                    </div>


                </div>

                @*اتمام خرید و ارسال*@
                <div class="col-12" id="orderFinal" style="display: none;">

                    <div class="menu-box d-flex align-items-center justify-content-between">
                        <div class="check-order">
                            <div class="menu-img">
                                <img src="~/App_Images/shoping/orderReview.svg" class="svg" />
                            </div>
                            <div class="menu-title" style="font-weight:700;">بررسی سفارش</div>
                        </div>
                        <div class="end-order selected">
                            <div class="menu-img">
                                <img src="~/App_Images/shoping/orderFinal.svg" class="svg" />
                            </div>
                            <div class="menu-title" style="font-weight: 700;">اتمام خرید و ارسال</div>
                        </div>
                        <hr style="color: #249099" />
                    </div>


                    <div style="padding:70px 15px 20px!important;">
                        <div class="checkout-wrapper px-3 py-4">
                            <div style=" font-size: 14px; margin-bottom: 5px; font-weight: 400; ">سفارش <span id="spFactorNumber" style=" font-size: 16px; color: #A022A1; font-weight: 700; ">1666666</span> با موفقیت ثبت گردید. </div>
                            <div style=" font-size: 14px; font-weight: 400; margin-bottom: 5px; ">لطفا پرداخت وجه اینترنتی انجام دهید و یا هنگام تحویل سفارش با کارت خوان سیار انجام دهید.</div>
                            <div style=" font-size: 14px; font-weight: 400; margin-bottom: 10px; ">سفارش خود را میتوانید در حساب کاربری خود بخش <span href="@Html.GetHref("Home/PersonalProfile#order")" style=" color: #A022A1; ">"سفارش های من"</span> پیگیری نمایید. </div>
                            <a class="button-accept w-100 rounded-pill" href="/بیوتی/">بازگشت به صفحه اول</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="continue container-fluid">
                <div class="row align-items-center">
                    <div class="col-6">
                        <div class="text">مبلغ قابل پرداخت</div>
                        <div class="sum-price sumPricePay">@Model.AddShopingCart.Sum(x => x.DisplayNewPrice * x.Count).ToNumber()<span class="currency">ریال</span></div>
                    </div>
                    <div class="col-6">
                        <button id="continueOrder" type="button" class="w-100 button-accept rounded-pill my-4 py-2 button-new button-basket">
                            ادامه خرید
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
}

@section scripts{
    @if (ViewBag.DesktopSection)
    {
        <script>
            function calcFinalOperation() {
                var $rows = $(".list-items .row-item");
                var sumPriceAll = 0;
                var sumPriceProduct = 0;
                var discount = 0;
                var sumDiscount = 0;
                for (var i = 0; i < $rows.length; i++) {
                    var sumPrice = numberNonCommas($($rows[i]).find(".sumPrice").text());
                    var oldPrice = numberNonCommas($($rows[i]).find(".oldPrice").text());
                    var count = Number($($rows[i]).find(".countProduct").val());
                    sumPriceProduct += oldPrice * count;
                    sumPriceAll += sumPrice;
                    if ($($rows[i]).find(".oldPrice").length === 1) {
                        discount = numberNonCommas($($rows[i]).find(".oldPrice").text()) - numberNonCommas($($rows[i]).find(".newPrice").text());

                        sumDiscount += (discount * count);
                    }
                }
                sumPriceProduct = numberWithCommas(sumPriceProduct);
                sumDiscount = numberWithCommas(sumDiscount);
                sumPriceAll = numberWithCommas(sumPriceAll);
                $("#sumPriceProduct").text(sumPriceProduct);
                $("#sumDiscount").text(sumDiscount);
                $("#sumPriceAll").text(sumPriceAll);
                $(".sumPricePay").text(sumPriceAll);
            }
            $('#continueOrder').on("click", function () {
                ajax({
                    loading: true,
                    url: "Home/SaveFactor",
                    success: function (result) {
                        $("#spFactorNumber").text(result);
                        $('#orderReview').hide();
                        $('#orderFinal').show();
                        getShoppingCart();
                    }
                });
            })
        </script>
    }
    else
    {
        <script>
            function calcFinalOperation() {
                var $rows = $(".product.row-item");
                var sumPriceAll = 0;
                var sumPriceProduct = 0;
                var discount = 0;
                var sumDiscount = 0;
                for (var i = 0; i < $rows.length; i++) {
                    var sumPrice = numberNonCommas($($rows[i]).find(".sumPrice").text());
                    var oldPrice = numberNonCommas($($rows[i]).find(".oldPrice").text());
                    var count = Number($($rows[i]).find(".countProduct").val());
                    sumPriceProduct += oldPrice * count;
                    sumPriceAll += sumPrice;
                    if ($($rows[i]).find(".oldPrice").length === 1) {
                        discount = numberNonCommas($($rows[i]).find(".oldPrice").text()) - numberNonCommas($($rows[i]).find(".newPrice").text());

                        sumDiscount += (discount * count);
                    }
                }
                sumPriceProduct = numberWithCommas(sumPriceProduct);
                sumDiscount = numberWithCommas(sumDiscount);
                sumPriceAll = numberWithCommas(sumPriceAll);
                $("#sumPriceProduct").text(sumPriceProduct);
                $("#sumDiscount").text(sumDiscount);
                $("#sumPriceAll").text(sumPriceAll);
                $(".sumPricePay").text(sumPriceAll);
            }
            $('#continueOrder').on("click", function () {
                ajax({
                    loading: true,
                    url: "Home/SaveFactor",
                    success: function (result) {
                        $("#spFactorNumber").text(result);
                        $('#orderReview').hide();
                        $('.continue').hide();
                        $('#orderFinal').show();
                        getShoppingCart();
                    }
                });
            })
        </script>
    }
    <script>
        $("#btnEditAddress").on("click", function () {
            $(this).prop('disabled', true);
            $("#divEditAddress").show();
            $("#spAddressError").text("");
            $("#newAddress").val($('#spAddress').text());
        });
        $("#btnCancelAddress").on("click", function () {
            $("#divEditAddress").hide();
            $('#btnEditAddress').prop('disabled', false);
        });
        $("#btnOkAddress").on("click", function () {
            ajax({
                loading: true,
                url: "Home/UpdateAddressUser",
                data: JSON.stringify({ address: $("#newAddress").val() }),
                success: function (result) {
                    $("#divEditAddress").hide();
                    $('#btnEditAddress').prop('disabled', false);
                    $('#spAddress').text($("#newAddress").val());
                },
                error: function (err) {
                    var errorMsg;
                    if (err.responseJSON)
                        errorMsg = err.responseJSON.Message;
                    else
                        errorMsg = err.responseText;
                    $("#spAddressError").text(errorMsg);
                }
            });
        });
        $('.deleteShoppingCart').on("click", function () {
            if (!confirm("آیا برای حذف این کالا مطمئن هستید؟"))
                return;
            var $row = $(this).closest(".row-item");
            var id = $row.attr("data-id");
            var codePartProperty = $("#codePartProperty").text();
            ajax({
                loading: true,
                url: "Home/DeleteShoppingCart",
                data: JSON.stringify({ id: id, codePartProperty: codePartProperty }),
                success: function () {
                    $row.remove();
                    calcFinalOperation();
                    getShoppingCart();
                }
            });
        });
    </script>
}



