Laravel 8 E-Commerce - User Review & Rating on Product

hi everyone welcome back to the laravel 80 commerce tutorial in this video we are going to learn about user review and rating on product so let's see how can user add review and rating on product so first of all let's create model and migration for review so this to the command prompt and for creating the model just type here the command php artisan make colon model space model name now let's say model name is review and also create a migration so just right here dash m now press enter all right model created now so to the project and let's open the migration so just go inside the database directory in migration and from here just open create reviews table migration okay this one now inside this migration let's add some column so inside this schema after this id just write here the order table arrow data type integer all right column name rating and another column table data type text and add here the column name comment overview and let's add a comment okay and dollar table arrow data type big integer and column name order underscore item order id underscore id all right and also idea the unsigned okay now let's add here the foreign key so right here dollar table arrow foreign and column name this one order underscore item underscore id and here the references references on id references with id and one ordered limit okay order items right here on order underscore items table all right and on delete cascade all right now save this file now just open the review model so let's go inside first of all just copy this table name and go inside the app directory then models and from here just open review dot php file okay and inside this file just add here the table name so right here protected dollar table is equal to reviews all right now save this file now let's add a column inside the order items table so for that let's create a migration for adding a new column inside the order items table so for creating the migration just type here the command hp artisan make column migration and add here the migration name and reviewer status so i'm just going to write here our status underscore to understand order underscore item table okay and now also add here the table name so that stats table is equal to order underscore items all right now press enter okay migration created now says to the project and let's open the migration so from the migration directory just open this one all right and inside this migration just add here the column our status so right here dollar table data type boolean and column name the reviewer status so just write here our status status all right and also add here the default value default file all right now let's copy this and paste inside here okay down method okay all right now save this file now let's migrate these migrations so switch to the command prompt and for migrating the migration just type here the command php artisan migrate all right now press enter now let's run the application so just right here php are these and serve all right now this to the project and just close this migration and also this model all right and now let's open the user order details component view file so just go inside the resources directory resources views livewire and user and from here just open user order details complete.blade.php file all right and inside this file let's create a link inside this you can see here this is the details page if i click here you can see here this is the details page okay so inside this uh this panel orders items panel here let's add a link for right review okay or add review so you can see here this is the forage product names and inside this porridge uh after this let's add here so i'm just going to copy the steve and paste here and now just remove this and here let's add a link anchor tag link anchor tag href as and here let's add a text write review okay and before uh let's add here if uh dollar order because it does okay status is equal to delivered delivered and add more condition one more condition dollar dollar and and dollar item arrow review sorry our status are the status is equal to sorry false if order status is delivered and item our status is equal to false then so this link otherwise hide okay and here just close the if directives right here all right now save this file now let's check this link so let's go to the browser and just replace the page and here you can see the right review link okay if i check another order this time let's check this one this is the cancelled order okay click on details and here you can see there is no any link for write review okay all right now let's create a new new live wire component okay so this is the command prompt and for creating the new library component just type here the command php artisan make colon live wire a space completely name user slash component name on let's say component name is user review component all right now press enter component created our application php artisan server and let's create a route for this newly created component so let's go inside the route strictly routes and from here just open wave dot php file and inside this file just go inside the user middleware route group and after this let's create a route about column column gate all right now add here the component name which is the user review component in column column class and here the route name user dot or review all right now save this file and now let's open the user review component class file so just go inside the directory then http livewire user and from here just open user review company.php file and inside this file now first of all let's add here the layout dot layout name which is base all right now save this file now here let's create a property so right here public dollar order underscore this one copy this parameter and here this page here all right now let's add here the amount lifecycle of method okay public function and mount and inside this just pass here the parameter order underscore item underscore item id now just write here dollar this hello this one this property name is equal to this one all right now inside the render method let's fetch here the order item so create an object here order item is equal to model name order icon all right and now let's uh pass this order item inside the component view so here just add the big bracket then order item arrow dollar order item all right now save this file now let's open the user review component view file so from the resources directory resources we use live user and from here just open user that's reviewed as component dot play dot php file and inside this file let's create a form here for adding the review and rating okay so first of all just add here the container so write your container and also add some padding so write your style adding 30 pixel and 0 all right now let's add in row column column okay now let's add here the form so i'm just going to copy or let's go to the stop link and if i click on any product okay this is the product details page okay and uh inside this tab reviewed you can see here the form okay and this is the rating so i'm just going to copy this this form so let's go to the details page this goes to the project and on the resources directory uh just open the this one details as component.php file and inside this file you can see here this is the review section all right and here is the form now let's copy this form so i'm just going to select this to this one let's copy this and inside the user review component.php file let's add this div just here okay now from here let's remove this name and email all right now save this and let's check this this is to the browser and just to face the page now just go to the details page and uh here let's add a link first so inside the company ordered it is complete.hp file inside this href just right here double curly bracket without and add here the route name which is this one user hot review and also pass here the order item id so here just add here the double quantity bracket order underscore item underscore id and now just pass here okay now save this file process to the browser and just refresh the page okay syntax error unexpected all right inside this link um okay just remove this big bracket and add after this okay after this note here now save this file and let's check again so refresh the page okay now it's working now just click on right review link so just click here and here you can see the form okay okay now it's looking good now here just display the product okay so just go inside the username component.php file uh blade file okay inside this file and here before this form let's add this okay so i'm just going to copy this one so go to the details page and this is the details page and from here [Music] let's copy this and inside the user review component blade file after this wrapper just all right and now for showing the product image just add here the product retrieve and after this forward slash double curly bracket then dollar order item arrow product arrow image okay and just remove this tape also remove this description and here let's show the product name so right here double curly bracket order icon arrow product header name okay and also change here the title and the review for remove this okay now save this file and let's check this sources to the browser and refresh the page okay and you can see here the product name here curly bracket is showing so just remove this extractor bracket and you can see here the product image product name and also remove this text from here just remove this detail all right now it's looking good uh okay now let's uh create a function for adding the review so let's go inside the user review component class file and okay let's create a function for adding the review so right here function and function name let's say function name is add review and inside this first of all let's add here the validation so right here dollar this arrow validate and add here the big bracket and inside this just add here the property name so first of all let's create two property here public dollar rating and another property which is dollar company all right now let's bind this this property with the file so go to the view file and here this is the radio button for rating so finding this just right here is equal to paste here the property name and now let's copy this and paste inside this radio button so here paste here and also paste here okay all right now let's copy this property and inside this text area just add here wire colon model is equal to comment all right now save this now inside this file class file uh just add here the property name rating arrow and here the validation required and now with the validation comment you required okay and after this and just create an object for review review is equal to new model name review dollar review hello [Music] and also set the status review arrow our status okay now call here the save method function review error save now put the value inside the session session has been added successfully all right now let's add here method public function lifecycle method updated and first here the field fields download this arrow validate only and just pass here this one dollar fields bracket and now let's copy this required all right now save this file now let's copy this method name and inside the view file inside this form let's add here just remove this you need that post also remove this and add your wire column submit dot prevent is equal to this function header view all right and also remove this now for showing the validation error message after this just write here delete header and here's the writing then expand class is equal to text as contender and simply print now let's copy this and after this text area just paste here change here the name comment okay now save this file now everything is done now let's check this so switch to the browser and just refresh the page go to the my orders okay now click on details all right now let's add the review for this product so click on write review okay and here i'm just going to give the rating 4 okay and and adding the review of this product nice product okay and now i'm just going to click click on submit one more thing for displaying the session message before this form uh let's add here at then it gives session as message okay then [Music] add this and here a big tag class alert alert success and i'll slide here the room alert and type this just print here the message session get message okay all right now save this file and now just refresh the page okay now let's add the rating so give the rating for and add the other message nice okay and now click on submit okay column not found our status all right okay i am doing here a mistake r status column is not here this is inside the order item table okay so just remove this from here and after this uh let's create an object for order item order item is equal to order item [Music] column column find and inside this just right here dollar this arrow order underscore item underscore id okay now here just write order item arrow our status is equal to okay now call here the same method order item arrow scene all right okay now save this file now let's check again so just to replace the page now let's add here the rating one more time so directing four and add here the review nice all right and now click on submit all right order item id does not list all right one more mistake here um order item id does not have a default value okay just copy this column here add one more dollar review hello order item order underscore item id is equal to just right here dollar this arrow order underscore item underscore id all right okay now save this file and one more time let's check this let's go to the browser and just refresh the page okay now let's add here the rating nice product click on submit and this time you can see here the message your review has been added successfully okay let's check inside the database so open the phpmyadmin and let's open the database laravel at ecommerce tv and let's browse the reviews table you can you can see here the reviews table so click on browse and you can see here the rating comment okay of order item id it is one okay and if i take the order items table you can see here the r status all right okay now let's uh click go to the product details page and if i refresh the page you can see here the review right review link is not showing for this product okay all right so in same way you can write review for this product so i'm just going to click here and let's add a review for this product also this time ready five all right and add the other comment very nice headphone all right click on submit review added and if i refresh the page you can see here the both reviews okay all right so in this way you can create ad review and rating for uh on product so that's all about user review and rating on products so thanks for watching this video and if you still have any kind of question you can ask me in the comment box don't forget to subscribe my channel thanks for watching

Channel: Surfside Media

Views: 6,869

Keywords: How, to, Program, laravel (Software), laravel, laravel v8, laravel 8, laravel project, laravel setting up, laravel v8 setting up, laravel v8.0, v8.0, laravel 8.0, laravel 8 playlist, laravel 8 tutorial, laravel 8 lesson, laravel tutorial, laravel 8.0 tutorial for beginners, laravel for beginners, laravel tutorial for beginners, laravel8, laravel 8 ecommerce tutorial, laravel 8 ecommerce, ecommerce project in laravel 8, laravel 8 ecommerce project, review & rating on product

Id: 1sjBKOBC3dQ

Length: 35min 51sec (2151 seconds)

Published: Sun May 02 2021