Scribd
Upload
19 views19 pages

Código de DataTables

The document is an HTML template for a dashboard interface for supervisors, featuring a sidebar with navigation links to various sections such as Dashboard, Forms, Tables, Maps, and Profile. It includes dynamic elements that check user permissions and display relevant options based on user roles. The layout is designed for a responsive user experience with integrated JavaScript and CSS for styling and functionality.

Uploaded by

Emanuel André
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
19 views19 pages

Código de DataTables

The document is an HTML template for a dashboard interface for supervisors, featuring a sidebar with navigation links to various sections such as Dashboard, Forms, Tables, Maps, and Profile. It includes dynamic elements that check user permissions and display relevant options based on user roles. The layout is designed for a responsive user experience with integrated JavaScript and CSS for styling and functionality.

Uploaded by

Emanuel André
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 19

<!

DOCTYPE html>
<html lang="pt-pt">

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Supervisores | {{ Auth::user()->name }} - Dashboard</title>
<meta content="width=device-width, initial-scale=1.0, shrink-to-fit=no"
name="viewport" />
<!--
- favicon
-->
<link rel="shortcut icon" href="/images/logo/Logo-AgroSense-white.png"
type="image/svg+xml">

<!-- Fonts and icons -->


<script src="/js/plugin/webfont/webfont.min.js"></script>
<script>
WebFont.load({
google: { families: ["Public Sans:300,400,500,600,700"] },
custom: {
families: [
"Font Awesome 5 Solid",
"Font Awesome 5 Regular",
"Font Awesome 5 Brands",
"simple-line-icons",
],
urls: ["/css/fonts.min.css"],
},
active: function () {
sessionStorage.fonts = true;
},
});
</script>

<!-- CSS Files -->


<link rel="stylesheet" href="/css/bootstrap.min.css" />
<link rel="stylesheet" href="/css/plugins.min.css" />
<link rel="stylesheet" href="/css/kaiadmin.min.css" />

<!-- CSS Just for demo purpose, don't include it in your project -->
<link rel="stylesheet" href="/css/demo.css" />

<style>
.side2[data-background-color="dark"] {
background: #433c2f !important;
}
</style>
</head>

<body>
<div class="wrapper">
<!-- Sidebar -->
<div class="sidebar side2" data-background-color="dark">
<div class="sidebar-logo">
<!-- Logo Header -->
<div class="logo-header side2" data-background-color="dark">
<a href="/" class="logo">
<img src="/images/logo/Logo-AgroSense-white.png" alt="navbar brand"
class="navbar-brand" height="30" />
</a>
<div class="nav-toggle">
<button class="btn btn-toggle toggle-sidebar">
<i class="gg-menu-right"></i>
</button>
<button class="btn btn-toggle sidenav-toggler">
<i class="gg-menu-left"></i>
</button>
</div>
<button class="topbar-toggler more">
<i class="gg-more-vertical-alt"></i>
</button>
</div>
<!-- End Logo Header -->
</div>

<div class="sidebar-wrapper scrollbar scrollbar-inner side2">


<div class="sidebar-content">
<ul class="nav nav-secondary">
<li class="nav-item">
<a href="/manager/dashboard" class="collapsed">
<i class="fas fa-home"></i>
<p>Dashboard</p>
</a>

</li>
<li class="nav-section">
<span class="sidebar-mini-icon">
<i class="fa fa-ellipsis-h"></i>
</span>
<h4 class="text-section">Funções</h4>
</li>

<li class="nav-item">
<a data-bs-toggle="collapse" href="#forms">
<i class="fas fa-pen-square"></i>
<p>Formulários</p>
<span class="caret"></span>
</a>
<div class="collapse" id="forms">
<ul class="nav nav-collapse">

@php
$isOrganizationMember = \App\Models\
OrganizationMember::where('user_id', Auth::id())->exists();
@endphp

@if ($isOrganizationMember)

@else
<li>
<a href="/manager/addOrganization">
<span class="sub-item">Cadastrar
organização</span>
</a>
</li>
@endif

<li>
<a href="/manager/addPlace">
<span class="sub-item">Registrar área de
monitoramento</span>
</a>
</li>
</ul>
</div>
</li>
<li class="nav-item active submenu">
<a data-bs-toggle="collapse" href="#tables">
<i class="fas fa-table"></i>
<p>Tabelas</p>
<span class="caret"></span>
</a>
<div class="collapse" id="tables">
<ul class="nav nav-collapse">

@php
$isOrganizationMember = \App\Models\
OrganizationMember::where('user_id', Auth::id())->exists();
@endphp

@if ($isOrganizationMember)
<li class="active">
<a href="/manager/supervisors">
<span class="sub-item">Supervisores</span>
</a>
</li>
@endif

</ul>
</div>
</li>
<li class="nav-item">
<a data-bs-toggle="collapse" href="#maps">
<i class="fas fa-map-marker-alt"></i>
<p>Mapas</p>
<span class="caret"></span>
</a>
<div class="collapse" id="maps">
<ul class="nav nav-collapse">

<li>
<a href="/manager/maps">
<span class="sub-item">Áreas de
monitoramento</span>
</a>
</li>

</ul>
</div>
</li>
<li class="nav-item">
<a href="/manager/charts">
<i class="far fa-chart-bar"></i>
<p>Gráficos</p>
</a>
</li>

@php
$isOrganizationMember = \App\Models\
OrganizationMember::where('user_id', Auth::id())->exists();
@endphp

@if ($isOrganizationMember)
<li class="nav-item">
<a href="/manager/myorganization">
<i class="fas fa-desktop"></i>
<p>Minha Organização</p>
<!--<span class="badge
badge-success">4</span>-->
</a>
</li>
@endif

<li class="nav-item">
<a href="/manager/reports">
<i class="fas fa-file"></i>
<p>Leituras</p>
<span class="badge badge-secondary">{{ $sensores-
>count() }}</span>
</a>
</li>

<li class="nav-item">
<a href="/manager/profile">
<i class="fas fa-user"></i>
<p>Perfil</p>
</a>
</li>

<li class="nav-item">
<a href="/">
<i class="fas fa-home"></i>
<p>Home</p>
</a>
</li>

</ul>
</div>
</div>
</div>
<!-- End Sidebar -->

<div class="main-panel">
<div class="main-header">
<div class="main-header-logo">
<!-- Logo Header -->
<div class="logo-header side2" data-background-color="dark">
<a href="index.html" class="logo">
<img src="/images/logo/Logo-AgroSense-white.png" alt="navbar brand"
class="navbar-brand" height="20" />
</a>
<div class="nav-toggle">
<button class="btn btn-toggle toggle-sidebar">
<i class="gg-menu-right"></i>
</button>
<button class="btn btn-toggle sidenav-toggler">
<i class="gg-menu-left"></i>
</button>
</div>
<button class="topbar-toggler more">
<i class="gg-more-vertical-alt"></i>
</button>
</div>
<!-- End Logo Header -->
</div>
<!-- Navbar Header -->
<nav class="navbar navbar-header navbar-header-transparent navbar-expand-lg
border-bottom">
<div class="container-fluid">
<nav class="navbar navbar-header-left navbar-expand-lg navbar-form nav-
search p-0 d-none d-lg-flex">
<div class="input-group">
<div class="input-group-prepend">
<button type="submit" class="btn btn-search pe-1">
<i class="fa fa-search search-icon"></i>
</button>
</div>
<input type="text" placeholder="Pesquisar..." class="form-
control" />
</div>
</nav>

<ul class="navbar-nav topbar-nav ms-md-auto align-items-center">


<li class="nav-item topbar-icon dropdown hidden-caret d-flex d-lg-
none">
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
href="#" role="button"
aria-expanded="false" aria-haspopup="true">
<i class="fa fa-search"></i>
</a>
<ul class="dropdown-menu dropdown-search animated fadeIn">
<form class="navbar-left navbar-form nav-search">
<div class="input-group">
<input type="text" placeholder="Pesquisar..." class="form-
control" />
</div>
</form>
</ul>
</li>
<li class="nav-item topbar-icon dropdown hidden-caret">
<a class="nav-link dropdown-toggle" href="#" id="messageDropdown"
role="button"
data-bs-toggle="dropdown" aria-haspopup="true" aria-
expanded="false">
<i class="fa fa-envelope" title="Mensagens"></i>
</a>
<ul class="dropdown-menu messages-notif-box animated fadeIn" aria-
labelledby="messageDropdown">
<li>
<div class="dropdown-title d-flex justify-content-between
align-items-center">
Mensagens
<a href="#" class="small">Marcar todas como lidas</a>
</div>
</li>
<li>
<div class="message-notif-scroll scrollbar-outer">
<div class="notif-center">
<a href="#">
<div class="notif-img">
<img src="/images/jm_denis.jpg" alt="Img Profile" />
</div>
<div class="notif-content">
<span class="subject">Ângelo Kamussumbo</span>
<span class="block"> Como estás? </span>
<span class="time">2 minutos atrás</span>
</div>
</a>
<a href="#">
<div class="notif-img">
<img src="/images/chadengle.jpg" alt="Img Profile" />
</div>
<div class="notif-content">
<span class="subject">Sadraque Vence</span>
<span class="block"> Ok, obrigado! </span>
<span class="time">6 minutos atrás</span>
</div>
</a>
<a href="#">
<div class="notif-img">
<img src="/images/mlane.jpg" alt="Img Profile" />
</div>
<div class="notif-content">
<span class="subject">Morgado de Melo</span>
<span class="block">
Terminei o meu CRUD agora...
</span>
<span class="time">12 minutos atrás</span>
</div>
</a>
</div>
</div>
</li>
<li>
<a class="see-all" href="javascript:void(0);">Ver todas as
mensagens<i
class="fa fa-angle-right"></i>
</a>
</li>
</ul>
</li>
<li class="nav-item topbar-icon dropdown hidden-caret">
<a class="nav-link dropdown-toggle" href="#" id="notifDropdown"
role="button" data-bs-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<i class="fa fa-bell" title="Notificações"></i>
<span class="notification">4</span>
</a>
<ul class="dropdown-menu notif-box animated fadeIn" aria-
labelledby="notifDropdown">
<li>
<div class="dropdown-title">
Você tem 4 novas notificações
</div>
</li>
<li>
<div class="notif-scroll scrollbar-outer">
<div class="notif-center">
<a href="#">
<div class="notif-icon notif-primary">
<i class="fa fa-user-plus"></i>
</div>
<div class="notif-content">
<span class="block"> Novo usuário cadastrado </span>
<span class="time">5 minutos atrás</span>
</div>
</a>
<a href="#">
<div class="notif-icon notif-success">
<i class="fa fa-comment"></i>
</div>
<div class="notif-content">
<span class="block">
Benito atualizou uma tabela
</span>
<span class="time">12 minutos atrás</span>
</div>
</a>
<a href="#">
<div class="notif-img">
<img src="/images/profile2.jpg" alt="Img Profile" />
</div>
<div class="notif-content">
<span class="block">
Bruno cadastrou uma nova cultura
</span>
<span class="time">12 minutos atrás</span>
</div>
</a>
<a href="#">
<div class="notif-icon notif-danger">
<i class="fa fa-heart"></i>
</div>
<div class="notif-content">
<span class="block"> Benito gostou da nova cultura
</span>
<span class="time">17 minutos atrás</span>
</div>
</a>
</div>
</div>
</li>
<li>
<a class="see-all" href="javascript:void(0);">Ver todas as
notificações<i
class="fa fa-angle-right"></i>
</a>
</li>
</ul>
</li>
<li class="nav-item topbar-icon dropdown hidden-caret">
<a class="nav-link" data-bs-toggle="dropdown" href="#" aria-
expanded="false">
<i class="fas fa-layer-group" title="Ações rápidas"></i>
</a>
<div class="dropdown-menu quick-actions animated fadeIn">
<div class="quick-actions-header">
<span class="title mb-1">Ações rápidas</span>
<span class="subtitle op-7">Shortcuts</span>
</div>
<div class="quick-actions-scroll scrollbar-outer">
<div class="quick-actions-items">
<div class="row m-0">
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-danger rounded-circle">
<i class="far fa-calendar-alt"></i>
</div>
<span class="text">Calendário</span>
</div>
</a>
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-warning rounded-circle">
<i class="fas fa-map"></i>
</div>
<span class="text">Mapas</span>
</div>
</a>
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-info rounded-circle">
<i class="fas fa-file-excel"></i>
</div>
<span class="text">Relatórios</span>
</div>
</a>
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-success rounded-circle">
<i class="fas fa-envelope"></i>
</div>
<span class="text">E-mails</span>
</div>
</a>
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-primary rounded-circle">
<i class="fas fa-file-invoice-dollar"></i>
</div>
<span class="text">Faturas</span>
</div>
</a>
<a class="col-6 col-md-4 p-0" href="#">
<div class="quick-actions-item">
<div class="avatar-item bg-secondary rounded-circle">
<i class="fas fa-credit-card"></i>
</div>
<span class="text">Pagamentos</span>
</div>
</a>
</div>
</div>
</div>
</div>
</li>

<li class="nav-item topbar-user dropdown hidden-caret">


<a class="dropdown-toggle profile-pic" data-bs-toggle="dropdown"
href="#" aria-expanded="false">
<div class="avatar-sm">
<img src="{{ Auth::user()->profilePicture ?
asset('storage/' . Auth::user()->profilePicture) : '/images/user1.png' }}"
alt="{{ Auth::user()->name }}" class="avatar-img rounded-
circle" />
</div>
<span class="profile-username">
<span class="op-7">Olá,</span>
<span class="fw-bold">{{ Auth::user()->name }}</span>
</span>
</a>
<ul class="dropdown-menu dropdown-user animated fadeIn">
<div class="dropdown-user-scroll scrollbar-outer">
<li>
<div class="user-box">
<div class="avatar-lg">
<img src="{{ Auth::user()->profilePicture ?
asset('storage/' . Auth::user()->profilePicture) : '/images/user1.png' }}"
alt="{{ Auth::user()->name }}" class="avatar-img
rounded" />
</div>
<div class="u-text">
<h4>{{ Auth::user()->name }}</h4>
<p class="text-muted">{{ Auth::user()->email }}</p>
<a href="/manager/profile" class="btn btn-xs btn-
secondary btn-sm">Ver perfil</a>
</div>
</div>
</li>
<li>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="/manager/profile">Meu
Perfil</a>
<a class="dropdown-item" href="#">Meu Balanço</a>
<a class="dropdown-item" href="#">Caixa de mensagens</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Definições</a>
<div class="dropdown-divider"></div>

@auth
<a href="{{ route('logout') }}"
title="Logout"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();"
class="dropdown-item">
Logout
</a>
<form id="logout-form" action="{{ route('logout') }}"
method="POST" style="display: none;">
@csrf
</form>
@endauth

{{--
<a class="dropdown-item" href="#">Logout</a>
--}}
</li>
</div>
</ul>
</li>
</ul>
</div>
</nav>
<!-- End Navbar -->
</div>

<div class="container">
<div class="page-inner">
<div class="page-header">
<h3 class="fw-bold mb-3">Supervisores</h3>
<ul class="breadcrumbs mb-3">
<li class="nav-home">
<a href="/">
<i class="icon-home"></i>
</a>
</li>
<li class="separator">
<i class="icon-arrow-right"></i>
</li>
<li class="nav-item">
<a href="#">Tabelas</a>
</li>
<li class="separator">
<i class="icon-arrow-right"></i>
</li>
<li class="nav-item">
<a href="/manager/supervisors">Supervisores</a>
</li>
</ul>
</div>
<div class="row">

<div class="col-md-12">
<div class="card">
<div class="card-header">
<div class="d-flex align-items-center">
<h4 class="card-title">Adicionar
supervisor</h4>
<button class="btn btn-primary btn-
round ms-auto" data-bs-toggle="modal"
data-bs-target="#addRowModal">
<i class="fa fa-plus"></i>
Adicionar
</button>
</div>
</div>
<div class="card-body">
<!-- Modal Add Supervisor -->
<div class="modal fade" id="addRowModal"
tabindex="-1" role="dialog"
aria-hidden="true">
<div class="modal-dialog"
role="document">
<form
action="{{ route('supervisors.store') }}" method="POST">
@csrf
<div class="modal-content">
<div class="modal-header
border-0">
<h5 class="modal-title">
<span class="fw-
mediumbold"> Novo</span>
<span class="fw-light">
Supervisor </span>
</h5>
<button type="button"
class="btn-close" data-bs-dismiss="modal" aria-label="Fechar"></button>
</div>
<div class="modal-body">
<p class="small">
Crie um novo supervisor
aqui, tenha certeza
de preencher tudo
</p>

<input type="hidden"
name="accountType" value="Supervisor">

<div class="row">
<div class="col-sm-
12">
<div
class="form-group form-group-default">

<label>Nome</label>
<input
id="addName" type="text" class="form-control"

placeholder="Nome completo" name="name" required/>


</div>
</div>
<div class="col-md-
6 pe-0">
<div
class="form-group form-group-default">

<label>Email</label>
<input
id="addPosition" type="email" name="email"

class="form-control"

placeholder="Email do responsável" required/>


</div>
</div>
<div class="col-md-
6">
<div
class="form-group form-group-default">

<label>Senha</label>
<input
id="addPassword" name="password" type="password"

class="form-control"

placeholder="Senha" required/>
</div>
</div>
</div>

</div>
<div class="modal-footer
border-0">
<button type="submit"
id="addRowButton" class="btn btn-primary">
Adicionar
</button>
<button type="button"
class="btn btn-danger" data-bs-dismiss="modal">Fechar</button>
</div>
</div>
</form>
</div>
</div>

<!-- Modal Edit Supervisor -->


<div class="modal fade" id="editRowModal"
tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog"
role="document">
<form id="editForm" action=""
method="POST">
@csrf
@method('PUT')

<input type="hidden"
id="editUserId" name="user_id">

<div class="modal-content">
<div class="modal-header
border-0">
<h5 class="modal-
title">
<span class="fw-
mediumbold"> Editar</span>
<span class="fw-
light"> Supervisor </span>
</h5>
<button type="button"
class="btn-close" data-bs-dismiss="modal" aria-label="Fechar"></button>
</div>
<div class="modal-body">
<p class="small">Editar
informações do supervisor.</p>
<div class="row">
<div class="col-sm-
12">
<div
class="form-group form-group-default">

<label>Editar nome</label>
<input
id="editName" type="text" class="form-control" name="name" required />
</div>
</div>
<div class="col-md-
6 pe-0">
<div
class="form-group form-group-default">

<label>Editar email</label>
<input
id="editEmail" type="email" class="form-control" name="email" required />
</div>
</div>
<div class="col-md-
6">
<div
class="form-group form-group-default">

<label>Editar senha</label>
<input
id="editPassword" name="password" type="password" class="form-control"
placeholder="Nova Senha (opcional)" />
</div>
</div>
</div>
</div>
<div class="modal-footer
border-0">
<button type="submit"
id="editRowButton" class="btn btn-primary">Guardar</button>
<button type="button"
class="btn btn-danger" data-bs-dismiss="modal">Fechar</button>
</div>
</div>
</form>
</div>
</div>

<div class="table-responsive">
<table id="add-row" class="display
table table-striped table-hover">
<thead>
<tr>
<th>Nome</th>
<th>Função</th>
<th>Área de
monitoramento</th>
<th style="width:
10%">Ações</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Nome</th>
<th>Função</th>
<th>Àrea de
monitoramento</th>
<th>Ações</th>
</tr>
</tfoot>
<tbody>
@foreach($users as $user)
<tr>
<td>{{ $user-
>name }}</td>
<td>{{ $user-
>accountType }}</td>
<td>
@php
// Busca a área
cujo user_id corresponde ao ID do usuário atual
$userArea =
$areas->where('user_id', $user->id)->first();
@endphp
{{ $userArea ?
$userArea->name : 'Nenhuma' }}
</td>
<td>
<div class="form-
button-action">

<button
type="button" class="btn btn-link btn-primary btn-lg edit-button"
data-
id="{{ $user->id }}"
data-name="{{
$user->name }}"
data-
email="{{ $user->email }}"

title="Editar"
data-bs-
toggle="modal"
data-bs-
target="#editRowModal">
<i class="fa
fa-edit"></i>
</button>

<button
type="button" class="btn btn-link btn-danger" data-bs-toggle="tooltip"
onclick="confirmRemoval({{ $user->id }})" title="Eliminar">
<i
class="fa fa-times"></i>
</button>

<form
action="{{ route('supervisor.destroy', $user->id) }}" method="POST" id="delete-
form-{{ $user->id }}">
@csrf

@method('DELETE')
</form>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<footer class="footer">
<div class="container-fluid d-flex justify-content-between">
<nav class="pull-left">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="/">
AgroSense
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"> Ajuda </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"> Termos e privacidade </a>
</li>
</ul>
</nav>
<div class="copyright">
2024, made with <i class="fa fa-heart heart text-
danger"></i> by
<a href="/">AgroSense</a>
</div>

<!--
<div>
Distributed by
<a target="_blank"
href="https://themewagon.com/">ThemeWagon</a>.
</div>
-->
</div>
</footer>
</div>

</div>
<!-- Core JS Files -->
<script src="/js/core/jquery-3.7.1.min.js"></script>
<script src="/js/core/popper.min.js"></script>
<script src="/js/core/bootstrap.min.js"></script>
<!-- Chart JS -->
<script src="/js/plugin/chart.js/chart.min.js"></script>
<!-- jQuery Scrollbar -->
<script src="/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>
<!-- Kaiadmin JS -->
<script src="/js/kaiadmin.min.js"></script>
<!-- Kaiadmin DEMO methods, don't include it in your project! -->
<script src="/js/setting-demo2.js"></script>

<!-- jQuery Scrollbar -->


<script src="/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js"></script>
<!-- Datatables -->
<script src="/js/plugin/datatables/datatables.min.js"></script>
<!-- Kaiadmin JS -->
<script src="/js/kaiadmin.min.js"></script>
<!-- Kaiadmin DEMO methods, don't include it in your project! -->
<script src="/js/setting-demo2.js"></script>
<script>
$(document).ready(function () {
$("#basic-datatables").DataTable({});

$("#multi-filter-select").DataTable({
pageLength: 5,
initComplete: function () {
this.api()
.columns()
.every(function () {
var column = this;
var select = $(
'<select class="form-select"><option
value=""></option></select>'
)
.appendTo($(column.footer()).empty())
.on("change", function () {
var val = $.fn.dataTable.util.escapeRegex($
(this).val());

column
.search(val ? "^" + val + "$" : "", true,
false)
.draw();
});

column
.data()
.unique()
.sort()
.each(function (d, j) {
select.append(
'<option value="' + d + '">' + d +
"</option>"
);
});
});
},
});

// Add Row
$("#add-row").DataTable({
pageLength: 5,
});

var action =
'<td> <div class="form-button-action"> <button type="button" data-
bs-toggle="tooltip" title="" class="btn btn-link btn-primary btn-lg" data-original-
title="Edit Task"> <i class="fa fa-edit"></i> </button> <button type="button" data-
bs-toggle="tooltip" title="" class="btn btn-link btn-danger" data-original-
title="Remove"> <i class="fa fa-times"></i> </button> </div> </td>';

$("#addRowButton").click(function () {
$("#add-row")
.dataTable()
.fnAddData([
$("#addName").val(),
$("#addPosition").val(),
$("#addPassword").val(),
action,
]);
$("#addRowModal").modal("hide");
});
});
</script>

<script>
document.addEventListener("DOMContentLoaded", function () {
const editButtons = document.querySelectorAll(".edit-button");

editButtons.forEach(button => {
button.addEventListener("click", function () {
const userId = this.getAttribute("data-id");
const userName = this.getAttribute("data-name");
const userEmail = this.getAttribute("data-email");

document.getElementById("editUserId").value = userId;
document.getElementById("editName").value = userName;
document.getElementById("editEmail").value = userEmail;

// Define a action correta do formulário


document.getElementById("editForm").action =
"/manager/supervisors/" + userId;
});
});
});
</script>

<!--SweetAlert2-->
<script src="{{ asset('swalert/[email protected]') }}"></script>

@if (session('success'))
<script>
Swal.fire({
title: 'Supervisor',
text: '{{ session('success') }}',
icon: 'success',
width: 400,
heightAuto: false,
showConfirmButton: false,
timer: 5000,
});
</script>
@endif

@if (session('updated'))
<script>
Swal.fire({
title: 'Supervisor',
text: '{{ session('updated') }}',
icon: 'success',
width: 400,
heightAuto: false,
showConfirmButton: false,
timer: 5000,
});
</script>
@endif

@if (session('supervisor_deleted'))
<script>
Swal.fire({
title: 'Supervisor',
text: '{{ session('supervisor_deleted') }}',
icon: 'success',
width: 400,
heightAuto: false,
showConfirmButton: false,
timer: 5000,
});
</script>
@endif

@if (session('updated_not'))
<script>
Swal.fire({
title: 'Supervisor',
text: '{{ session('updated_not') }}',
icon: 'error',
width: 400,
heightAuto: false,
showConfirmButton: false,
timer: 5000,
});
</script>
@endif

@if (session('member_not'))
<script>
Swal.fire({
title: 'Organização',
text: '{{ session('member_not') }}',
icon: 'error',
width: 400,
heightAuto: false,
showConfirmButton: false,
timer: 5000,
});
</script>
@endif

<script>
function confirmRemoval(userId) {
Swal.fire({
title: 'Tem certeza?',
text: "Você realmente deseja eliminar este supervisor?",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#d33',
cancelButtonColor: '#3085d6',
confirmButtonText: 'Sim, excluir!',
cancelButtonText: 'Cancelar'
}).then((result) => {
if (result.isConfirmed) {
document.getElementById('delete-form-' + userId).submit();
}
});
}
</script>
</body>

</html>

You might also like