Browse Source

added my order ui

pull/56/head
Galip Tolga Erdem 5 years ago
parent
commit
93539c7a96
  1. 4
      apps/public-web/src/EShopOnAbp.PublicWeb/Components/Basket/BasketWidgetViewComponent.cs
  2. 2
      apps/public-web/src/EShopOnAbp.PublicWeb/Components/Payment/PaymentWidgetViewComponent.cs
  3. 1
      apps/public-web/src/EShopOnAbp.PublicWeb/Components/Purchase/Default.cshtml
  4. 4
      apps/public-web/src/EShopOnAbp.PublicWeb/Components/Toolbar/Cart/CartWidgetViewComponent.cs
  5. 125
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/MyOrders.cshtml
  6. 38
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/Payment.cshtml.cs
  7. 2
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/index.js
  8. 16
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/myOrders.css
  9. 19
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/myOrders.js
  10. 2
      apps/public-web/src/EShopOnAbp.PublicWeb/Pages/payment.js
  11. 9
      apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/DiscountProvider.cs
  12. 2
      apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/UserAddressProvider.cs
  13. 10
      apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/UserBasketProvider.cs
  14. 19
      apps/public-web/src/EShopOnAbp.PublicWeb/wwwroot/components/basket/basket-widget.css

4
apps/public-web/src/EShopOnAbp.PublicWeb/Components/Basket/BasketWidgetViewComponent.cs

@ -1,6 +1,6 @@
using EShopOnAbp.PublicWeb.Basket;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc;
using System.Threading.Tasks;
using EShopOnAbp.PublicWeb.ServiceProviders;
using Volo.Abp.AspNetCore.Mvc;
using Volo.Abp.AspNetCore.Mvc.UI.Widgets;

2
apps/public-web/src/EShopOnAbp.PublicWeb/Components/Payment/PaymentWidgetViewComponent.cs

@ -1,7 +1,7 @@
using System.Collections.Generic;
using System.Threading.Tasks;
using EShopOnAbp.BasketService;
using EShopOnAbp.PublicWeb.Basket;
using EShopOnAbp.PublicWeb.ServiceProviders;
using Microsoft.AspNetCore.Mvc;
using Volo.Abp.AspNetCore.Mvc;
using Volo.Abp.AspNetCore.Mvc.UI.Widgets;

1
apps/public-web/src/EShopOnAbp.PublicWeb/Components/Purchase/Default.cshtml

@ -55,6 +55,7 @@
<div class="row" style="padding: 25px; text-align: center">
<form method="post">
@Html.AntiForgeryToken()
<input type="hidden" name="model.TotalDiscountPercentage" class="total-discount" data-discount-total="@demoDiscountPercentage" value="@demoDiscountPercentage" />
<abp-button type="submit" size="Large" class="basket-purchase-button" text="@L[Model.ButtonDescription]" button-type="Warning"/>
</form>
</div>

4
apps/public-web/src/EShopOnAbp.PublicWeb/Components/Toolbar/Cart/CartWidgetViewComponent.cs

@ -1,6 +1,6 @@
using EShopOnAbp.PublicWeb.Basket;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc;
using System.Threading.Tasks;
using EShopOnAbp.PublicWeb.ServiceProviders;
using Volo.Abp.AspNetCore.Mvc;
using Volo.Abp.AspNetCore.Mvc.UI.Widgets;

125
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/MyOrders.cshtml

@ -1,39 +1,114 @@
@page
@using EShopOnAbp.Localization
@using Microsoft.Extensions.Localization
@using System.Globalization
@model EShopOnAbp.PublicWeb.Pages.MyOrdersModel
@inject IStringLocalizer<EShopOnAbpResource> L
@section scripts {
<abp-script src="/client-proxies/basket-proxy.js"/>
<abp-script src="/Pages/myOrders.js"/>
}
<h3>Hello</h3>
@section styles{
<abp-style src="/Pages/myOrders.css"/>
}
<div>
<strong>@Model.MyOrders.Count sipariş</strong> verildi.
</div>
@foreach (var item in Model.MyOrders)
@foreach (var order in Model.MyOrders)
{
<abp-card>
<abp-card-body>
<h5>@item.OrderDate</h5>
<p>@item.OrderStatus</p>
<p>@item.Buyer.Name</p>
<abp-row>
@foreach (var product in item.Items)
{
<abp-column>
<abp-card>
<abp-card-title>
<img style="width: 200px" src="/product-images/@product.PictureUrl"/>
</abp-card-title>
<abp-card-body>
<p>@product.ProductName x @product.Units</p>
</abp-card-body>
</abp-card>
</abp-column>
}
</abp-row>
</abp-card-body>
</abp-card>
<div class="card order-item">
<div class="card-header">
<div class="row">
<div class="col">
<div>Sipariş Tarihi</div>
<div>@order.OrderDate.ToString("dd MMMM yyyy")</div>
</div>
<div class="col">
<div>TOPLAM</div>
<div>@order.Items.Sum(q => q.UnitPrice)</div>
</div>
<div class="col">
<div>TESLİMAT ADRESİ</div>
<div>@order.Address.Description</div>
</div>
<div class="col">
<div>SİPARİŞ NO @order.OrderNo.ToString("N0", new NumberFormatInfo() {NumberGroupSeparator = " "})</div>
</div>
</div>
</div>
<div class="card-body">
@foreach (var item in order.Items)
{
<abp-card class="order-item m-3">
<abp-card-body>
<div class="row m-3">
<h3>@order.OrderStatus</h3>
</div>
<abp-row>
<abp-column size="_2">
<img class="img-size" src="/product-images/@item.PictureUrl"/>
</abp-column>
<abp-column size-lg="_4">
<div>@item.ProductName</div>
<div>Ürünü iade edebileceğiniz son tarih: @order.OrderDate.AddMonths(1).ToString("dd MMMM yyyy")</div>
<div class="mt-3">
<abp-button icon="fas fa-cart-plus" class="btn btn-warning buy-again" text="Tekrar Satın Alın" data-product-id="@item.ProductId"></abp-button>
</div>
</abp-column>
<abp-column offset="_3" size="_2">
<abp-row class="pb-3"><abp-button class="btn btn-light shadow" disabled="true" abp-tooltip-right="Not available yet">Ürünleri iade et</abp-button></abp-row>
<abp-row><abp-button class="btn btn-light shadow" disabled="true" abp-tooltip-right="Not available yet">Ürün yorumu yazın</abp-button></abp-row>
</abp-column>
</abp-row>
</abp-card-body>
</abp-card>
}
</div>
</div>
<hr/>
}
}
@* @foreach (var item in Model.MyOrders) *@
@* { *@
@* <abp-card> *@
@* <abp-card-body> *@
@* <h5>@item.OrderDate</h5> *@
@* <p>@item.OrderStatus</p> *@
@* <p>@item.Buyer.Name</p> *@
@* <abp-row> *@
@* @foreach (var product in item.Items) *@
@* { *@
@* <abp-column> *@
@* <abp-card> *@
@* <abp-card-title> *@
@* <img style="width: 200px" src="/product-images/@product.PictureUrl"/> *@
@* </abp-card-title> *@
@* <abp-card-body> *@
@* <p>@product.ProductName x @product.Units</p> *@
@* </abp-card-body> *@
@* </abp-card> *@
@* </abp-column> *@
@* } *@
@* </abp-row> *@
@* </abp-card-body> *@
@* </abp-card> *@
@* <hr/> *@
@* } *@

38
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/Payment.cshtml.cs

@ -1,6 +1,6 @@
using EShopOnAbp.BasketService;
using System;
using EShopOnAbp.BasketService;
using EShopOnAbp.PaymentService.PaymentRequests;
using EShopOnAbp.PublicWeb.Basket;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;
@ -9,6 +9,7 @@ using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using EShopOnAbp.OrderingService.Orders;
using EShopOnAbp.PublicWeb.ServiceProviders;
using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
using Volo.Abp.Users;
@ -46,13 +47,21 @@ public class PaymentModel : AbpPageModel
Logger.LogInformation("Payment Proceeded...");
Logger.LogInformation($"AddressId: {model.SelectedAddressId}");
Logger.LogInformation($"PaymentId: {model.SelectedPaymentId}");
Logger.LogInformation($"Total Discount: {model.TotalDiscountPercentage}");
var basket = await _userBasketProvider.GetBasketAsync();
var productItems = ObjectMapper.Map<List<BasketItemDto>, List<OrderItemCreateDto>>(basket.Items);
if (model.TotalDiscountPercentage != 0)
{
ApplyDiscountPercentageToBasketItems(productItems, model.TotalDiscountPercentage);
}
var placedOrder = await _orderAppService.CreateAsync(new OrderCreateDto()
{
PaymentTypeId = 1, // Paypal
Address = GetUserAddress(model.SelectedAddressId),
Products = ObjectMapper.Map<List<BasketItemDto>, List<OrderItemCreateDto>>(basket.Items)
Products = productItems
});
var paymentRequest = await _paymentRequestAppService.CreateAsync(new PaymentRequestCreationDto
@ -74,22 +83,31 @@ public class PaymentModel : AbpPageModel
return Redirect(response.CheckoutLink);
}
public class PaymentPageViewModel
{
public int SelectedAddressId { get; set; }
public int SelectedPaymentId { get; set; }
public decimal TotalDiscountPercentage { get; set; }
}
private void ApplyDiscountPercentageToBasketItems(List<OrderItemCreateDto> productItems, decimal discount)
{
for (int i = 0; i < productItems.Count; i++)
{
productItems[i].Discount = discount;
}
}
private OrderAddressDto GetUserAddress(int selectedAddressId)
{
var address = _userAddressProvider.GetDemoAddresses().First(q => q.Id == selectedAddressId);
return new OrderAddressDto
{
Description = address.Type,
City = address.City,
Country = address.Country,
Description = address.Type,
Street = address.Street,
ZipCode = address.ZipCode
};
}
public class PaymentPageViewModel
{
public int SelectedAddressId { get; set; }
public int SelectedPaymentId { get; set; }
}
}

2
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/index.js

@ -6,7 +6,6 @@
}
$(function () {
$('.product-list-item').click(function () {
var $this = $(this);
var productId = $this.attr('data-product-id');
@ -14,7 +13,6 @@
productId: productId,
anonymousId: anonymousId,
}).then(function () {
$('.abp-widget-wrapper[data-widget-name="CartWidget"]')
.data('abp-widget-manager')
.refresh();

16
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/myOrders.css

@ -0,0 +1,16 @@
.img-size {
width: 80%;
}
.order-item {
width:-webkit-fill-available;
background-color: #fff;
border: 1px solid #eee;
border-radius: 3px;
box-shadow: 0 0 10px rgba(0, 0, 0, .05);
transition: all .2s;
cursor: default;
}
.order-item:hover {
box-shadow: 0 0 20px rgba(0, 0, 0, .1);
}

19
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/myOrders.js

@ -0,0 +1,19 @@
(function () {
const anonymousId = abp.utils.getCookieValue("anonymous_id");
$(function () {
$('.buy-again').click(function () {
const $this = $(this);
const productId = $this.attr('data-product-id');
eShopOnAbp.basketService.basket.addProduct({
productId: productId,
anonymousId: anonymousId,
}).then(function () {
$('.abp-widget-wrapper[data-widget-name="CartWidget"]')
.data('abp-widget-manager')
.refresh();
abp.notify.success("Added product to your basket.", "Successfully added");
});
});
});
})();

2
apps/public-web/src/EShopOnAbp.PublicWeb/Pages/payment.js

@ -12,6 +12,6 @@
paymentInput.setAttribute('name', "model.SelectedPaymentId");
paymentInput.setAttribute('value', document.querySelector(".payment-list .card.is-selected").getAttribute("data-payment-id"));
paymentInput.setAttribute('type', "hidden");
form.appendChild(paymentInput);
form.appendChild(paymentInput);
};
})();

9
apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/DiscountProvider.cs

@ -0,0 +1,9 @@

using Volo.Abp.DependencyInjection;
namespace EShopOnAbp.PublicWeb.ServiceProviders;
public class DiscountProvider : ITransientDependency
{
// TODO: Configure or remove discount logic
}

2
apps/public-web/src/EShopOnAbp.PublicWeb/Basket/UserAddressProvider.cs → apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/UserAddressProvider.cs

@ -1,7 +1,7 @@
using System.Collections.Generic;
using Volo.Abp.DependencyInjection;
namespace EShopOnAbp.PublicWeb.Basket;
namespace EShopOnAbp.PublicWeb.ServiceProviders;
public class UserAddressProvider : ITransientDependency
{

10
apps/public-web/src/EShopOnAbp.PublicWeb/Basket/UserBasketProvider.cs → apps/public-web/src/EShopOnAbp.PublicWeb/ServiceProviders/UserBasketProvider.cs

@ -1,13 +1,13 @@
using EShopOnAbp.BasketService;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.Logging;
using System;
using System;
using System.Threading.Tasks;
using EShopOnAbp.BasketService;
using EShopOnAbp.Shared.Hosting.AspNetCore;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.Logging;
using Volo.Abp.DependencyInjection;
using Volo.Abp.Users;
namespace EShopOnAbp.PublicWeb.Basket
namespace EShopOnAbp.PublicWeb.ServiceProviders
{
public class UserBasketProvider : ITransientDependency
{

19
apps/public-web/src/EShopOnAbp.PublicWeb/wwwroot/components/basket/basket-widget.css

@ -3,7 +3,7 @@
}
.basket-list-item {
width:-webkit-fill-available;
width: -webkit-fill-available;
background-color: #fff;
border: 1px solid #eee;
border-radius: 3px;
@ -87,15 +87,21 @@
line-height: 20px;
vertical-align: top;
}
.description-cargo{
.description-cargo {
color: #189c38;
text-align: center;
font-size: 1rem;
}
.description-cargo> span {
line-height: 20px;
vertical-align: top;
}
.description-cargo > span {
line-height: 20px;
vertical-align: top;
}
.basket-item-remove {
cursor: pointer;
}
.remove-container {
color: #bb2d3b;
@ -124,6 +130,7 @@
.basket-list-item:hover .hide {
opacity: 1.0;
}
.sticky {
position: -webkit-sticky; /* for Safari */
position: sticky;

Loading…
Cancel
Save