Laptop Store ب Symfony 6 Darija الجزء السادس
منذ 10 أشهر
imadbelasri
Symfony
SY
فهاد الجزء السادس والأخير من Laptop Store ب Symfony 6 Darija غادي نكملوا ل projet ديالنا ونشوفوا كيفاش نديرو ل upload ل les images ب Symfony 6 من بعد غادي نشوفوا كيفاش نزيدو Error 404 page.
نظرة سريعة بالفيديو
1- إضافة Product Index View
منبعد غادي نزيدو fichier ف dossier product سميه index.html.twig لي غادي نعرضوا فيه les produits للأدمن.
الكود ديال الملف هو :
//
{% extends 'base.html.twig' %}
{% block title %}Product List{% endblock %}
{% block body %}
<div class="row my-5">
<div class="col-md-10 mx-auto">
{% for message in app.flashes('success') %}
<div class="alert alert-success">
{{message}}
</div>
{% endfor %}
<div class="card">
<div class="card-header d-flex justify-content-between align-items-center">
<span>List of products</span>
<a href="{{path('product_store')}}" class="btn btn-sm btn-primary">
Add
</a>
</div>
<div class="card-body">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Category</th>
<th>Quantity</th>
<th>Price</th>
<th>Image</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{% for product in products %}
<tr>
<td>{{loop.index}}</td>
<td>{{product.name}}</td>
<td>{{product.category.name}}</td>
<td>{{product.quantity}}</td>
<td>{{product.price}}</td>
<td>
{% if product.image %}
<img src="{{absolute_url('uploads/'~product.image)}}"
width="60" height="60"
alt="{{product.name}}"
class="fluid my-2 rounded">
{% else %}
<img src="{{absolute_url('uploads/flowers.png')}}"
width="60" height="60"
alt="{{product.name}}"
class="fluid my-2 rounded">
{% endif %}
</td>
<td class="d-flex justify-content-around align-items-center">
<a href="{{path('product_show',{id: product.id})}}" class="btn btn-sm btn-dark">
show
</a>
<a href="{{path('product_edit',{id: product.id})}}" class="btn btn-sm btn-warning">
edit
</a>
<form id="{{product.id}}" action="{{path('product_delete',{id: product.id})}}"
method="post"></form>
<button onclick="deleteItem('{{product.id}}')" class="btn btn-sm btn-danger">
delete
</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
{% endblock %}
2- إضافة Order Index View
منبعد غادي نزيدو fichier ف dossier order سميه index.html.twig لي غادي نعرضوا فيه les commandes للأدمن.
الكود ديال الملف هو :
//
{% extends 'base.html.twig' %}
{% block title %}Orders List{% endblock %}
{% block body %}
<div class="row my-5">
<div class="col-md-10 mx-auto">
{% for message in app.flashes('success') %}
<div class="alert alert-success">
{{message}}
</div>
{% endfor %}
<div class="card">
<div class="card-header">
Orders List
</div>
<div class="card-body">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>Username</th>
<th>Product Name</th>
<th>Price</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{% for order in orders %}
<tr>
<td>{{loop.index}}</td>
<td>{{order.user.username}}</td>
<td>{{order.pname}}</td>
<td>{{order.price}}</td>
<td>
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
{{order.status}}
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
<li><a class="dropdown-item"
href="{{path('order_status_update',{order: order.id,status: 'shipped'})}}">Shipped</a></li>
<li><a class="dropdown-item" href="{{path('order_status_update',{order: order.id,status: 'rejected'})}}">Rejected</a></li>
</ul>
</div>
</td>
<td>
<form id="{{order.id}}" action="{{path('order_delete',{order: order.id})}}"
method="post"></form>
<button onclick="deleteItem('{{order.id}}')" class="btn btn-sm btn-danger">
delete
</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
{% endblock %}
3- تعديل الملف services.yaml
من بعد ف dossier config كاين ل fichier services.yaml لي غادي نديرو عليه التعديل باش نديرو ل upload ل les images وزيد dossier uploads ف dossier public لي فيه غادي يكونوا les images ديال les produits.
الكود ديال الملف بعد التعديل :
//
# This file is the entry point to configure your own services.
# Files in the packages/ subdirectory configure your dependencies.
# Put parameters here that don't need to change on each machine where the app is deployed
# https://symfony.com/doc/current/best_practices.html#use-parameters-for-application-configuration
parameters:
image_directory : '%kernel.project_dir%/public/uploads'
services:
# default configuration for services in *this* file
_defaults:
autowire: true # Automatically injects dependencies in your services.
autoconfigure: true # Automatically registers your services as commands, event subscribers, etc.
# makes classes in src/ available to be used as services
# this creates a service per class whose id is the fully-qualified class name
App\:
resource: '../src/'
exclude:
- '../src/DependencyInjection/'
- '../src/Entity/'
- '../src/Kernel.php'
# add more service definitions when explicit configuration is needed
# please note that last definitions always *replace* previous ones
4- إضافة Error 404 Page
باش نزيدو error 404 page غادي نزيدوا مجموعة ديال les dossiers ف dossier templates بهاد الشكل :
- dossier bundles فيه
- dossier TwigBundle فيه
- dossier Exception فيه
- fichier error404.html.twig
لي فيه هاد الكود :
//
{# templates/bundles/TwigBundle/Exception/error404.html.twig #}
{% extends 'base.html.twig' %}
{% block body %}
<h1 class="my-5">Page not found</h1>
<p>
The requested page couldn't be located. Checkout for any URL
misspelling or <a href="{{ path('home') }}">return to the homepage</a>.
</p>
{% endblock %}