Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 073213e

Browse filesBrowse files
committed
Product Page completed
1 parent f1e1421 commit 073213e
Copy full SHA for 073213e

File tree

4 files changed

+94
-155
lines changed
Filter options

4 files changed

+94
-155
lines changed

‎AspnetRunBasics/Pages/Index.cshtml

Copy file name to clipboardExpand all lines: AspnetRunBasics/Pages/Index.cshtml
+14-6Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -46,10 +46,14 @@
4646
</div>
4747
<div class="card-body">
4848
<div class="row">
49+
4950
@foreach (var product in Model.ProductList.Take(4))
5051
{
51-
<partial name="_ProductItemPartial" model="@product" />
52-
}
52+
<div class="col-sm">
53+
<partial name="_ProductItemPartial" model="@product" />
54+
</div>
55+
}
56+
5357
</div>
5458
</div>
5559
</div>
@@ -66,10 +70,14 @@
6670
</div>
6771
<div class="card-body">
6872
<div class="row">
69-
@foreach (var product in Model.ProductList.TakeLast(4))
70-
{
71-
<partial name="_ProductItemPartial" model="@product" />
72-
}
73+
74+
@foreach (var product in Model.ProductList.TakeLast(4))
75+
{
76+
<div class="col-sm">
77+
<partial name="_ProductItemPartial" model="@product" />
78+
</div>
79+
}
80+
7381
</div>
7482
</div>
7583
</div>

‎AspnetRunBasics/Pages/Product.cshtml

Copy file name to clipboardExpand all lines: AspnetRunBasics/Pages/Product.cshtml
+40-135Lines changed: 40 additions & 135 deletions
Original file line numberDiff line numberDiff line change
@@ -4,171 +4,76 @@
44
ViewData["Title"] = "Product";
55
}
66

7-
<section class="jumbotron text-center">
8-
<div class="container">
9-
<h1 class="jumbotron-heading">E-COMMERCE CATEGORY</h1>
10-
<p class="lead text-muted mb-0">Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les années 1500, quand un peintre anonyme assembla ensemble des morceaux de texte pour réaliser un livre spécimen de polices de texte...</p>
11-
</div>
12-
</section>
137
<div class="container">
148
<div class="row">
159
<div class="col">
1610
<nav aria-label="breadcrumb">
1711
<ol class="breadcrumb">
18-
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
19-
<li class="breadcrumb-item"><a href="category.html">Category</a></li>
20-
<li class="breadcrumb-item active" aria-current="page">Sub-category</li>
12+
<li class="breadcrumb-item"><a asp-page="Product">Home</a></li>
13+
<li class="breadcrumb-item"><a asp-page="Product">Category</a></li>
14+
<li class="breadcrumb-item active" aria-current="page">@Model.SelectedCategory</li>
2115
</ol>
2216
</nav>
2317
</div>
2418
</div>
2519
</div>
20+
2621
<div class="container">
2722
<div class="row">
2823
<div class="col-12 col-sm-3">
2924
<div class="card bg-light mb-3">
3025
<div class="card-header bg-primary text-white text-uppercase"><i class="fa fa-list"></i> Categories</div>
3126
<ul class="list-group category_block">
32-
<li class="list-group-item"><a href="category.html">Cras justo odio</a></li>
33-
<li class="list-group-item"><a href="category.html">Dapibus ac facilisis in</a></li>
34-
<li class="list-group-item"><a href="category.html">Morbi leo risus</a></li>
35-
<li class="list-group-item"><a href="category.html">Porta ac consectetur ac</a></li>
36-
<li class="list-group-item"><a href="category.html">Vestibulum at eros</a></li>
27+
28+
@foreach (var category in Model.CategoryList)
29+
{
30+
<li class="list-group-item"><a asp-page="Product" asp-route-categoryId="@category.Id">@category.Name</a></li>
31+
}
32+
3733
</ul>
3834
</div>
35+
3936
<div class="card bg-light mb-3">
4037
<div class="card-header bg-success text-white text-uppercase">Last product</div>
4138
<div class="card-body">
42-
<img class="img-fluid" src="https://dummyimage.com/600x400/55595c/fff" />
43-
<h5 class="card-title">Product title</h5>
44-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
45-
<p class="bloc_left_price">99.00 $</p>
39+
<img asp-append-version="true" class="img-fluid" src="~/images/product/@Model.ProductList.LastOrDefault().ImageFile" />
40+
<h5 class="card-title">@Model.ProductList.LastOrDefault().Name</h5>
41+
<p class="card-text">@Model.ProductList.LastOrDefault().Summary</p>
42+
<p class="bloc_left_price">@Model.ProductList.LastOrDefault().Price $</p>
4643
</div>
4744
</div>
45+
4846
</div>
47+
4948
<div class="col">
5049
<div class="row">
51-
<div class="col-12 col-md-6 col-lg-4">
52-
<div class="card">
53-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
54-
<div class="card-body">
55-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
56-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
57-
<div class="row">
58-
<div class="col">
59-
<p class="btn btn-danger btn-block">99.00 $</p>
60-
</div>
61-
<div class="col">
62-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
63-
</div>
64-
</div>
65-
</div>
66-
</div>
67-
</div>
68-
<div class="col-12 col-md-6 col-lg-4">
69-
<div class="card">
70-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
71-
<div class="card-body">
72-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
73-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
74-
<div class="row">
75-
<div class="col">
76-
<p class="btn btn-danger btn-block">99.00 $</p>
77-
</div>
78-
<div class="col">
79-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
80-
</div>
81-
</div>
82-
</div>
83-
</div>
84-
</div>
85-
<div class="col-12 col-md-6 col-lg-4">
86-
<div class="card">
87-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
88-
<div class="card-body">
89-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
90-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
91-
<div class="row">
92-
<div class="col">
93-
<p class="btn btn-danger btn-block">99.00 $</p>
94-
</div>
95-
<div class="col">
96-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
97-
</div>
98-
</div>
99-
</div>
100-
</div>
101-
</div>
102-
<div class="col-12 col-md-6 col-lg-4">
103-
<div class="card">
104-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
105-
<div class="card-body">
106-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
107-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
108-
<div class="row">
109-
<div class="col">
110-
<p class="btn btn-danger btn-block">99.00 $</p>
111-
</div>
112-
<div class="col">
113-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
114-
</div>
115-
</div>
116-
</div>
117-
</div>
118-
</div>
119-
<div class="col-12 col-md-6 col-lg-4">
120-
<div class="card">
121-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
122-
<div class="card-body">
123-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
124-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
125-
<div class="row">
126-
<div class="col">
127-
<p class="btn btn-danger btn-block">99.00 $</p>
128-
</div>
129-
<div class="col">
130-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
131-
</div>
132-
</div>
133-
</div>
134-
</div>
135-
</div>
136-
<div class="col-12 col-md-6 col-lg-4">
137-
<div class="card">
138-
<img class="card-img-top" src="https://dummyimage.com/600x400/55595c/fff" alt="Card image cap">
139-
<div class="card-body">
140-
<h4 class="card-title"><a href="product.html" title="View Product">Product title</a></h4>
141-
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
142-
<div class="row">
143-
<div class="col">
144-
<p class="btn btn-danger btn-block">99.00 $</p>
145-
</div>
146-
<div class="col">
147-
<a href="#" class="btn btn-success btn-block">Add to cart</a>
148-
</div>
149-
</div>
50+
51+
@foreach (var product in Model.ProductList)
52+
{
53+
<div class="col-12 col-md-6 col-lg-4">
54+
<partial name="_ProductItemPartial" model="@product" />
15055
</div>
56+
}
57+
58+
<div class="col-12">
59+
<nav aria-label="...">
60+
<ul class="pagination">
61+
<li class="page-item disabled">
62+
<a class="page-link" href="#" tabindex="-1">Previous</a>
63+
</li>
64+
<li class="page-item"><a class="page-link" href="#">1</a></li>
65+
<li class="page-item active">
66+
<a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
67+
</li>
68+
<li class="page-item"><a class="page-link" href="#">3</a></li>
69+
<li class="page-item">
70+
<a class="page-link" href="#">Next</a>
71+
</li>
72+
</ul>
73+
</nav>
15174
</div>
15275
</div>
153-
<div class="col-12">
154-
<nav aria-label="...">
155-
<ul class="pagination">
156-
<li class="page-item disabled">
157-
<a class="page-link" href="#" tabindex="-1">Previous</a>
158-
</li>
159-
<li class="page-item"><a class="page-link" href="#">1</a></li>
160-
<li class="page-item active">
161-
<a class="page-link" href="#">2 <span class="sr-only">(current)</span></a>
162-
</li>
163-
<li class="page-item"><a class="page-link" href="#">3</a></li>
164-
<li class="page-item">
165-
<a class="page-link" href="#">Next</a>
166-
</li>
167-
</ul>
168-
</nav>
169-
</div>
17076
</div>
171-
</div>
17277

17378
</div>
17479
</div>

‎AspnetRunBasics/Pages/Product.cshtml.cs

Copy file name to clipboardExpand all lines: AspnetRunBasics/Pages/Product.cshtml.cs
+28-1Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,43 @@
22
using System.Collections.Generic;
33
using System.Linq;
44
using System.Threading.Tasks;
5+
using AspnetRunBasics.Repositories;
56
using Microsoft.AspNetCore.Mvc;
67
using Microsoft.AspNetCore.Mvc.RazorPages;
78

89
namespace AspnetRunBasics
910
{
1011
public class ProductModel : PageModel
1112
{
12-
public void OnGet()
13+
private readonly IProductRepository _productRepository;
14+
15+
public ProductModel(IProductRepository productRepository)
16+
{
17+
_productRepository = productRepository ?? throw new ArgumentNullException(nameof(productRepository));
18+
}
19+
20+
public IEnumerable<Entities.Category> CategoryList { get; set; } = new List<Entities.Category>();
21+
public IEnumerable<Entities.Product> ProductList { get; set; } = new List<Entities.Product>();
22+
23+
24+
[BindProperty(SupportsGet = true)]
25+
public string SelectedCategory { get; set; }
26+
27+
public async Task<IActionResult> OnGetAsync(int? categoryId)
1328
{
29+
CategoryList = await _productRepository.GetCategories();
30+
31+
if (categoryId.HasValue)
32+
{
33+
ProductList = await _productRepository.GetProductByCategoryAsync(categoryId.Value);
34+
SelectedCategory = CategoryList.FirstOrDefault(c => c.Id == categoryId.Value)?.Name;
35+
}
36+
else
37+
{
38+
ProductList = await _productRepository.GetProductListAsync();
39+
}
1440

41+
return Page();
1542
}
1643
}
1744
}
+12-13Lines changed: 12 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
@model Product
22

3-
<div class="col-sm">
4-
<div class="card">
5-
<a asp-page="ProductDetail" asp-route-productId="@Model.Id"><img asp-append-version="true" class="card-img-top" src="~/images/product/@Model.ImageFile" alt=""></a>
6-
<div class="card-body">
7-
<h4 class="card-title"><a asp-page="ProductDetail" asp-route-productId="@Model.Id" class="color-main">@Model.Name</a></h4>
8-
<p class="card-text">@Model.Summary</p>
9-
<div class="row">
10-
<div class="col">
11-
<p class="btn btn-danger btn-block">@Model.Price $</p>
12-
</div>
13-
<div class="col">
14-
<a asp-page="Cart" asp-route-productId="@Model.Id" class="btn btn-success btn-block">Add to Cart</a>
15-
</div>
3+
<div class="card">
4+
<a asp-page="ProductDetail" asp-route-productId="@Model.Id"><img asp-append-version="true" class="card-img-top" src="~/images/product/@Model.ImageFile" alt=""></a>
5+
<div class="card-body">
6+
<h4 class="card-title"><a asp-page="ProductDetail" asp-route-productId="@Model.Id" class="color-main">@Model.Name</a></h4>
7+
<p class="card-text">@Model.Summary</p>
8+
<div class="row">
9+
<div class="col">
10+
<p class="btn btn-danger btn-block">@Model.Price $</p>
11+
</div>
12+
<div class="col">
13+
<a asp-page="Cart" asp-route-productId="@Model.Id" class="btn btn-success btn-block">Add to Cart</a>
1614
</div>
1715
</div>
1816
</div>
1917
</div>
18+

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.