Show only the notifications of the user self Laravel - html

I have made a website where you can make a report, you have to submit a form with your account, and then a admin can handle that report, so the user can log in and see the reports and the status of it, but I want that the user can only see his own reports and not others?
Here is my html
#extends('layouts.app')
#section('content')
<div class="container">
<div class="mTop">
<div class="row justify-content-center">
<div class="col-md-8">
#if(session('message'))
<div class="alert alert-success" role="alert">
{{session('message')}}
</div>
#endif
<div class="card">
<div class="card-header">Retourmeldingen</div>
<div class="card-body">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">Firmanaam</th>
<th scope="col"></th>
<th scope="col"></th>
<th scope="col">Status</th>
<th scope="col">Verwerkingstijd</th>
<th scope="col"></th>
</tr>
</thead>
#foreach($retours as $retour)
<tbody>
<tr>
<th scope="row">{{ $retour->firmaname }}</th>
<td><a href="{{ route('return.show', $retour->id) }}">
<button type="button" class="btn btn-secondary btn-sm m-0">Bekijk
</button>
</a></td>
<td>#if( $retour->status === 0)
<a href="{{ route('return.edit', $retour->id) }}">
<button type="button" class="btn btn-secondary btn-sm m-0">Wijzig
</button>
</a>
#else
<a href="{{ route('return.edit', $retour->id) }}">
<button type="button" class="btn btn-secondary btn-sm m-0" disabled>
Wijzig
</button>
</a>
#endif
</td>
<td>#if( $retour->status === 0)
Open
#else
<i style="color: #05af00; font-size: 25px"
class="fa fa-check-circle"></i>
#endif</td>
<td>
#if($retour->status === 0)
Nog niet verwerkt
#elseif($retour->diffInDays === 0)
Zelfde dag verwerkt
#elseif( $retour->diffInDays === 1)
{{ $retour->diffInDays }} dag
#elseif( $retour->diffInDays >= 1)
{{ $retour->diffInDays }} dagen
#endif
</td>
<td>
<form method="post"
action="{{ route('return.destroy', $retour->id) }}">
#csrf
#method('DELETE')
<button type="submit" class="btn btn-danger btn-sm m-0"><i
class="fa fa-trash" aria-hidden="true"></i>
</button>
</form>
</td>
</tr>
</tbody>
#endforeach
</table>
</div>
</div>
<div class="mt-3">{{ $retours->links() }}</div>
</div>
</div>
</div>
</div>
#endsection
So what I want is that the user can see only his own reports based on the firmaname, what I have now is that you can see all the reports

in my opinion you should apply filters at controller level, returning to view only collection of reports owns by the consultant user.
That should be accomplished by user_id field in reports table in case that any report belongs to a unique user, or a pivot table in case that a report can have many owners.
So, if a report only belongs to a unique user, you should filter in your sql query by a WHERE statement such as:
$reports = Reports::where('user_id', $auth->user()->id)->where('other conditions')->get();
And then, in your view yo will have only reports that belongs to current user, which also solves a security issue.

Related

How to show added product details after clicked shopping cart icon in angular 8

I tried to show added product details after i clicked shopping cart icon or if i added any one product same like https://designmodo.com/shopping-cart-ui/. Initially no need to show the" Your Cart Items" added product box.I do not know how to do like that.If any one know please help to find the solutions.
addtocart-dir.ts:
<div class="card text-center">
<div class="card-header">
Your Cart Items
<button type="button" class="btn btn-sm btn-warning float-right">
Total items <span class="badge badge-light">{{cart.cartItemsList.length}}</span>
</button>
<button type="button" class="btn btn-sm btn-danger mr-2 float-right" (click)="emptyCart()" *ngIf="cart.cartItemsList && cart.cartTotal">
Empty Cart
</button>
</div>
<div class="card-body">
<table class="table">
<thead>
<tr>
<th scope="col">Product</th>
<th scope="col">Price</th>
<th scope="col">Qty</th>
<th scope="col">Total</th>
</tr>
</thead>
<tbody>
<tr>
</tr>
<tr *ngFor="let itm of cart.cartItemsList ">
<td class="text-left">{{itm.name}}</td>
<td>{{itm.price/itm.qty}} x</td>
<td class="w30">
<div class="input-group input-group-sm mb-3">
<div class="input-group-prepend">
<button class="btn btn-info" type="button" (click)="changeQty(itm.pid,1,'')">+</button>
</div>
<input type="text" class="form-control text-center" value="{{itm.qty}}" #qtyRef (keyup)="changeQty(itm.pid,qtyRef.value,'replace')" >
<div class="input-group-append">
<button class="btn btn-danger" type="button" (click)="changeQty(itm.pid,-1,'')">-</button>
</div>
</div>
</td>
<td>{{itm.price}}</td>
</tr>
</tbody>
</table>
<a routerLink = "/billing" class="btn btn-sm btn-primary" *ngIf="cart.cartItemsList && cart.cartTotal">Checkout</a>
</div>
<div class="card-footer text-muted font-weight-bold">
Total : Rs. {{cart.cartTotal}}
</div>
</div>
Demo: https://stackblitz.com/edit/angular-selvam-ecommerce-task-btjqde?file=src%2Fapp%2Fdirectives%2Faddtocart.dir.ts
Change in cart.service.ts
public cartItemsList: any = [];
change in products.pages.ts
<div class="row">
<div [ngClass]="cart.cartItemsList.length == 0 ? 'col-md-12' : 'col-md-7'">
<productslist-dir (refresh)="ref($event)" [allProductList]="products.data [searchedText]="searchText" [sortingBy]="sortOption"></productslist-dir>
</div>
<div class="col-md-5" *ngIf="cart.cartItemsList.length > 0">
<cart></cart>
</div>
change in productslist.dir.ts
ngOnInit(){
this.sortByOption = 'product_name';
this.cart.allItems = this.__allprdts;
this.cart.storeItems();
}
addToCart(productId,productQty){
this.cart.addToCart(productId,productQty,'');
this.refresh.emit(true);
}
please check and let me know..

How to get a sign instead of a value in html?

In my user table, there is an active field, instead of true/false I want the checkbox to be highlighted (it does not matter) if true and a minus sign (not important) if false.
And when changing user data, I want to click on one of these checkboxes to set the value.
How can I give a tick instead of a value?
<!-- user.html -->
<div class="container" ng-app="app" ng-controller="DashboardCtrl">
<div class="row table-responsive">
<table class="simple-little-table">
<tr>
<th>id</th>
<th>Name</th>
<th>Lastname</th>
<th>Username</th>
<th>email</th>
<th>Role</th>
<th>Active</th>
</tr>
<tr ng-repeat="user in users | filter:$scope.query">
<td>{{ user.id}}</td>
<td>{{ user.firstName}}</td>
<td>{{ user.lastName}}</td>
<td>{{ user.username}}</td>
<td>{{ user.email}}</td>
<td>{{ user.roles}}</td>
<td>{{user.active}}</td>
<td><div>
<button class="btn btn-primary" ng-click="editUser(user.id)">Редактировать</button>
</div></td>
</tr>
</table>
</div>
</div>
that's edituser.html
<div class="row">
<div class="col-lg-4 col-sm-12" style="margin: 15px">
Активация:
</div>
<div class="col-lg-6 col-sm-10" style="margin: 5px;">
<textarea style="display: inline-block; width: 100%; height:3rem; resize: none;" ng-model="user.active"
ng-if="editActive"/>
<div ng-if="!editActive" style="display: inline-block; width: 100%; overflow-wrap: break-word">
{{user.active}}
</div>
</div>
<div class="col-lg-1 col-sm-1">
<button ng-click="changeActive()"
ng-if="editActive">
<i class="glyphicon glyphicon-ok"
style="size: 20px"/>
</button>
<button ng-click="changeActive()"
ng-if="!editActive">
<i class="glyphicon glyphicon-pencil"
style="size: 20px"/>
</button>
</div>
If I got your point,you want to show checkbox and minus sign depend active field and you also want to check or tick the check box to change the data.
<input type="checkbox" ng-if="user.active"
ng-checked="user.active" ng-click="editUser(user.id)">
display minus when active false.
<span ng-if="!user.active"> <i class="glyphicon glyphicon-minus"/></span>
<div class="row">
<div class="col-lg-4 col-sm-12" style="margin: 15px">
Активация:
</div>
<div class="col-lg-6 col-sm-10" style="margin: 5px;">
<input type="checkbox" ng-if="editActive"
ng-checked="user.active" ng-click="editUser(user.id)">
<input type="checkbox" ng-if="!editActive"
ng-checked="user.active" ng-click="editUser(user.id)">
<!--<input type="checkbox" ng-if="user.active"-->
<!--ng-checked="user.active" ng-click="editUser(user.id)">-->
</div>
<div class="col-lg-1 col-sm-1">
<button ng-click="changeActive()"
ng-if="editActive">
<i class="glyphicon glyphicon-ok"
style="size: 20px"/>
</button>
<button ng-click="changeActive()"
ng-if="!editActive">
<i class="glyphicon glyphicon-pencil"
style="size: 20px"/>
</button>
</div>
after edit, shows ticks but does not change the value

JQUERY, AJAX -- My <tr> isn't removed

I want to and remove a tr when I click a button, but it doesn't disappear (my function to delete it from the DB works fine, it just stays in the screen until I refresh).
It's like it doesn't take the ID properly.
Any hints?
HTML
<tbody>
<?php foreach ($elementos as $elementos): ?>
<tr class="tr_test" data-id="<?php echo $elementos['ELDI_Id']; ?>">
...
AJAX
$.ajax({
url: $("#base_url").attr("valor") + "diccionarios/eliminar_elementos_diccionario",
type: 'POST',
data: { id:id_eldi },
success: function(response){
// THIS WORKS FINE, BUT I'M ASKED TO DO IT THE OTHER WAY
/* $(el).closest('tr').fadeOut(800, function(){
$(this).remove();
}); */
$('tr[data-id="' + id_eldi + '"]').fadeOut(800, function(){
$(this).remove();
});
}
});
Thanks for your time!
EDIT
Populated table's html, as asked in a comment:
<section class="content">
<div class="container-fluid">
<div class="block-header">
<div class="alert alert-info">
<strong>
Elementos del Diccionario 2 </strong>
<!-- <strong>
Elementos del Diccionario </strong> -->
</div>
</div>
<div class="row clearfix">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card">
<div class="body">
<!-- <div>
<a class="nav-link" href="http://localhost/bpg/diccionarios/nuevo_elemento_diccionario">Añadir elemento</a>
</div> -->
<!-- BOTÓN AÑADIR ELEMENTO MODAL -->
<a title="Añadir" style="margin-bottom:20px;" class="btn btn-primary" data-toggle="modal" data-target="#Modal_Add">
<i class="material-icons">add</i>Nuevo elemento
</a>
<div class="table-responsive">
<table id="tabla-elementos" class=" display table table-bordered table-striped table-hover tabla-usuarios">
<thead>
<tr>
<th>Key</th>
<th>Display</th>
<th>Acciones</th>
<!-- <th>Acciones</th> -->
</tr>
</thead>
<tbody>
<tr class="tr_test" data-id="347">
<td>prueba_1</td>
<td>Prueba Uno</td>
<td>
<span class="btn btn-default editar_elemento" id='347' value="347">
<a href="http://localhost/bpg/diccionarios/elemento_diccionario/347" title="Editar">
<i class="material-icons">edit</i>
</a>
</span>
<span class="btn btn-default borrar_elemento" id='347' value="347">
<i class="material-icons">delete_outline</i>
</span>
</td>
</tr>
<tr class="tr_test" data-id="348">
<td>prueba_2</td>
<td>Prueba Dos</td>
<td>
<span class="btn btn-default editar_elemento" id='348' value="348">
<a href="http://localhost/bpg/diccionarios/elemento_diccionario/348" title="Editar">
<i class="material-icons">edit</i>
</a>
</span>
<span class="btn btn-default borrar_elemento" id='348' value="348">
<i class="material-icons">delete_outline</i>
</span>
</td>
</tr>
<tr class="tr_test" data-id="351">
<td>prueba_3</td>
<td>Prueba Tres</td>
<td>
<span class="btn btn-default editar_elemento" id='351' value="351">
<a href="http://localhost/bpg/diccionarios/elemento_diccionario/351" title="Editar">
<i class="material-icons">edit</i>
</a>
</span>
<span class="btn btn-default borrar_elemento" id='351' value="351">
<i class="material-icons">delete_outline</i>
</span>
</td>
</tr>
<tr class="tr_test" data-id="353">
<td>prueba_4</td>
<td>Prueba Cuatro</td>
<td>
<span class="btn btn-default editar_elemento" id='353' value="353">
<a href="http://localhost/bpg/diccionarios/elemento_diccionario/353" title="Editar">
<i class="material-icons">edit</i>
</a>
</span>
<span class="btn btn-default borrar_elemento" id='353' value="353">
<i class="material-icons">delete_outline</i>
</span>
</td>
</tr>
</tbody>
</table>
</div>
Volver a Diccionarios
</div>
</div>
</div>
</div>
</div>
I'm not sure if it's the cause of your problem, but your HTML/PHP is incorrect, it should read:
<tbody>
<?php foreach ($elementos as $elemento): ?>
<tr class="tr_test" data-id="<?php echo $elemento['ELDI_Id']; ?>">
...
try add it's table parent as identifier:
$('button#btn').on('click', function() {
$('table#table tr[data-id="1"]').fadeOut(800, function(){
$(this).remove();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table">
<tbody>
<tr data-id="1">
<td>row</td>
</tr>
</tbody>
</table>
<button type="button" id="btn">
remove
</button>
only using tr[data-id=""] might be too broad for the DOM to find that element.
SOLUTION FOUND
I wasn't assigning data-id to the new appended rows.
JQUERY/AJAX
Fade and remove the tr:
$("tr[data-id-fila="+theID+"]").fadeOut(800, function(){
$(this).remove();
});
New appended row (AJAX gets result from model and controller using insert_id())
var html =
'<tr data-id-fila="' + result.newID +'">'+
..............

how to display a data in a modal using angular 2

I have a table with button. What I need is when I click on the button in the table , a modal diplay with its value.
My problem is how to pass the table's value to the modal. Can any one help me, here is the code
<div style="margin-top: 50px" class="col-md-12">
<div class="card">
<div class="card-block">
<div class="horizontal-scroll">
<table class="table table-condensed">
<thead>
<tr>
<th>Titre</th>
<th>Description</th>
<th>Durée (jours)</th>
<th>Coût (TalanCoin)</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let item of formations">
<td>{{ item[1] }}</td>
<td style="margin-left: 4cm;">
<button type="button" class="btn btn-info btn-icon" (click)="smModal.show()"><i class="ion-information"></i></button>
</td>
<td>{{ item[3] }}</td>
<td>{{ item[4] }}</td>
<td >
<button class="btn btn-success" (click)="clicked(item[4],lgModal)">Participer</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- Small modal -->
<div bsModal #smModal="bs-modal" class="modal fade" tabindex="-1"
role="dialog" aria-labelledby="mySmallModalLabel" aria-
hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button class="close" aria-label="Close"
(click)="smModal.hide()">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Description</h4>
</div>
<div class="modal-body" style="color: black;">
<!--here I want to display the value selected from the table-->
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn"
(click)="smModal.hide()">Save changes</button>
</div>
</div>
You could make a function in your component which opens the modal like this:
...
export class AppComponent {
#ViewChild('smModal') smModal;
currentItem;
...
openModal(item: any) {
this.currentItem = item;
this.smModal.show();
}
}
Then instead of smModal.show() you can call openModal(item). In the modal, you can then access {{ currentItem }} the same way you access item in the table.

Angular2 pass data to modal

i'm new in angular2 + typescript. And i need realize confirmation modal by click on button in table
This is table
<div style="margin-top: 10px">
<table id="recruitersTable" class="table table-striped center" [ngBusy]="data">
<tr>
<th>{{ 'RECRUITER_NAME_AND_SURNANE_COLUMN' | translate }}</th>
<th>{{ 'RECRUITER_CODE_COLUMN' | translate }}</th>
<th>{{ 'RECRUITER_ACTION_DOLUMN' | translate}}</th>
<th></th>
</tr>
<tr *ngFor="let recruiter of recruiters">
<td>{{ recruiter.Name }}</td>
<td>{{ recruiter.Code }}</td>
<td>
<a class="btn btn-xs btn-default" data-target="#confirm" role="button" data-toggle="modal">
<span class="glyphicon glyphicon-ban-circle"></span>
</a>
</td>
<td></td>
</tr>
</table>
</div>
This is confirmation modal
<div id="confirm" class="modal fade in" aria-labelledby="modallabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove"></span></button>
<h3 id="modalLabael">Block recruiter</h3>
</div>
<div class="modal-body">
<h3 id="modalLabael">Are you sure that you want block this recruiter?</h3>
</div>
<div class="modal-footer">
<button class="btn btn-danger" data-dismiss="modal" aria-hidden="true">Cancel</button>
<button class="btn btn-success" (click)="BlockRecruiter(recruiter.code)">Block</button>
</div>
</div>
</div>
And i need implement function by click 'success' on confirm modal, but data in another div. Can someone explain me?
You could either use EventEmitter if your modal component is contained in the parent component - Check here --> https://angular.io/docs/ts/latest/api/core/index/EventEmitter-class.html
Or you could use a service that returns a subject as an observable. The parent component can subscribe to the observable while the modal alerts the service on confirmation. Check how the alert.service has been written and used here --> Angular 2: Displaying icons in navbar on authentication