File "integration02.php"
Full Path: /home/analogde/www/MDPH/Work/integration02.php
File size: 24.8 KB
MIME-type: text/x-php
Charset: utf-8
<?php
// doc
//https://demos.pixinvent.com/robust-html-admin-template/html/ltr/vertical-multi-level-menu-template/form-input-grid.html
session_start();
include('config/config_DB.php');
include('config/checklogin.php');
check_login();
?>
<!DOCTYPE html>
<html lang="en">
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<!--
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
-->
<style>
/* Profile Picture */
.profile-pic{
display: inline-block;
vertical-align: middle;
width: 50px;
height: 50px;
overflow: hidden;
border-radius: 50%;
}
.profile-pic img{
width: 100%;
height: auto;
object-fit: cover;
}
.profile-menu .dropdown-menu {
right: 0;
left: unset;
}
.profile-menu .fa-fw {
margin-right: 10px;
}
.toggle-change::after {
border-top: 0;
border-bottom: 0.3em solid;
.select2-selection__choice{
background-color: var(--bs-gray-200);
border: none !important;
font-size: 12px;
font-size: 0.85rem !important;
}
}
</style>
<!--
<script type="text/javascript" src="//code.jquery.com/jquery-3.6.0.min.js"></script>
-->
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" />
<!--
<script type="text/javascript" src="cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
-->
<!-- include summernote css/js -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>
<?php include("head.php"); ?>
<style>
.dual-list .list-group {
margin-top: 8px;
}
.list-left li, .list-right li {
cursor: pointer;
}
.list-arrows {
padding-top: 100px;
}
.list-arrows button {
margin-bottom: 20px;
}
</style>
<!-- inutile
<link rel="stylesheet" type="text/css" href="https://www.virtuosoft.eu/code/bootstrap-duallistbox/bootstrap-duallistbox/v3.0.2/bootstrap-duallistbox.css">
<script src="dist/jquery.bootstrap-duallistbox.min.js"></script>
<link rel="stylesheet" type="text/css" href="../src/bootstrap-duallistbox.css">
-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" />
<!-- Or for RTL support -->
<!--
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.rtl.min.css" />
-->
<link rel="stylesheet" type="text/css" href="bootstrap-duallistbox.css">
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script>
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/7/tinymce.min.js" referrerpolicy="origin"></script>
<!-- version 7.3 qui peut être utilisée sans license-->
<script src="tinymce.min.js"></script>
<!--
https://codepen.io/tinymce/pen/VPYjXW
-->
<script>
tinymce.init({
selector: 'textarea#editor',
license_key: 'gpl',
plugins: 'table advtable , save',
promotion: false,
branding: 'false',
});
</script>
<body class="hold-transition sidebar-mini layout-fixed layout-navbar-fixed">
<div class="wrapper">
<?php include("navigation02.php"); ?>
<?php include("menu03.php"); ?>
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark">Admin Dashboard</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active">Dashboard</li>
</ol>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.container-fluid -->
</div> <!-- /.content-header -->
<!-- Main content -->
<section class="content">
<div class="container-fluid">
<!-- -->
<div class="row">
<!-- ./ iBank Clients -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box">
<span class="info-box-icon bg-info elevation-1"><i class="fas fa-users"></i></span>
<div class="info-box-content">
<span class="info-box-text">Clients</span>
<span class="info-box-number"><?php echo "123"; ?></span>
</div>
</div>
</div>
</div><!-- ./ iBank Clients -->
<!-- -->
<div class="row">
<div class="col-md-12">
<div class="card card-purple">
<div class="card-header">
<h3 class="card-title">Création d'une catégorie</h3>
</div>
<form method="post" enctype="multipart/form-data" role="form">
<div class="card-body">
<div class="row">
<div class=" col-md-6 form-group">
<label for="exampleInputEmail1">Nom</label>
<input type="text" name="name" required class="form-control" id="exampleInputEmail1">
</div>
</div>
<div class="row">
<div class=" col-md-6 form-group">
<label for="exampleInputEmail1">Staff Phone Number</label>
<input type="text" name="phone" required class="form-control" id="exampleInputEmail1">
</div>
</div>
<div class="row">
<div class=" col-md-6 form-group">
<label for="exampleInputEmail1">Staff Email</label>
<input type="email" name="email" required class="form-control" id="exampleInputEmail1">
</div>
</div>
<!-- -->
<p> </p>
<!--
<div class="row">
<div class="col bg-info">
<label>Available Superheroes</label>
<select multiple class="form-control" id="lstBox1">
<option value="123">Superman</option>
<option value="456">Batman</option>
<option value="789">Spiderman</option>
<option value="654">Captain America</option>
</select>
</div>
<div class="col bg-warning text-center">
<input type='button' id='btnAllRight' value='>>' class="btn btn-default" />
<br />
<input type='button' id='btnRight' value='>' class="btn btn-default" />
<br />
<input type='button' id='btnLeft' value='<' class="btn btn-default" />
<br />
<input type='button' id='btnAllLeft' value='<<' class="btn btn-default" />
</div>
<div class="col bg-success">
<label>Superheroes You Have Selected</label>
<select multiple class="form-control" id="lstBox2">
<option value="765">Nick Fury</option>
<option value="698">The Hulk</option>
<option value="856">Iron Man</option>
</select>
</div>
</div>
-->
<!--
<div class="row style-select">
<div class="col-md-2">
<div class="subject-info-box-1">
<label>Available Superheroes</label>
<select multiple class="form-control" id="lstBox1">
<option value="123">Superman</option>
<option value="456">Batman</option>
<option value="789">Spiderman</option>
<option value="654">Captain America</option>
</select>
</div>
<div class="subject-info-arrows text-center">
<br />
<br />
<input type='button' id='btnAllRight' value='>>' class="btn btn-default" />
<br />
<input type='button' id='btnRight' value='>' class="btn btn-default" />
<br />
<input type='button' id='btnLeft' value='<' class="btn btn-default" />
<br />
<input type='button' id='btnAllLeft' value='<<' class="btn btn-default" />
</div>
<div class="subject-info-box-2">
<label>Superheroes You Have Selected</label>
<select multiple class="form-control" id="lstBox2">
<option value="765">Nick Fury</option>
<option value="698">The Hulk</option>
<option value="856">Iron Man</option>
</select>
</div>
<div class="clearfix"></div>
</div>
</div>
-->
<!-- https://jsfiddle.net/nzdak7aL/ -->
<div class="subject-info-box-1">
<select multiple="multiple" id='lstBox1' class="form-control">
<option value="ajax">Ajax</option>
<option value="jquery">jQuery</option>
<option value="javascript">JavaScript</option>
<option value="mootool">MooTools</option>
<option value="prototype">Prototype</option>
<option value="dojo">Dojo</option>
</select>
</div>
<div class="subject-info-arrows text-center">
<input type='button' id='btnAllRight' value='>>' class="btn btn-default" /><br />
<input type='button' id='btnRight' value='>' class="btn btn-default" /><br />
<input type='button' id='btnLeft' value='<' class="btn btn-default" /><br />
<input type='button' id='btnAllLeft' value='<<' class="btn btn-default" />
</div>
<div class="subject-info-box-2">
<select multiple="multiple" id='lstBox2' class="form-control">
<option value="asp">ASP.NET</option>
<option value="c#">C#</option>
<option value="vb">VB.NET</option>
<option value="java">Java</option>
<option value="php">PHP</option>
<option value="python">Python</option>
</select>
</div>
<div class="clearfix"></div>
<!-- https://desarrollo.educarex.es/redmine/projects/adminies/repository/adminies/revisions/3cdada1c4f7b227d393a43a98dc65c1f84dbbbe4/entry/app/webroot/lib/bootstrap-duallistbox/demo/index.html -->
<!--https://bootsnipp.com/snippets/VP0M8#google_vignette -->
<!--
<div class="row">
<div class="dual-list list-left col-md-5">
<div class="well text-right">
<div class="row">
<div class="col-md-10">
<div class="input-group">
<span class="input-group-addon glyphicon glyphicon-search"></span>
<input type="text" name="SearchDualList" class="form-control" placeholder="search" />
</div>
</div>
<div class="col-md-2">
<div class="btn-group">
<a class="btn btn-default selector" title="select all"><i class="glyphicon glyphicon-unchecked"></i></a>
</div>
</div>
</div>
<ul class="list-group">
<li class="list-group-item">bootstrap-duallist <a href="https://github.com/bbilginn/bootstrap-duallist" target="_blank">github</a></li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<li class="list-group-item">Porta ac consectetur ac</li>
<li class="list-group-item">Vestibulum at eros</li>
</ul>
</div>
</div>
<div class="list-arrows col-md-1 text-center">
<button class="btn btn-default btn-sm move-left">
<span class="glyphicon glyphicon-chevron-left"></span>
</button>
<button class="btn btn-default btn-sm move-right">
<span class="glyphicon glyphicon-chevron-right"></span>
</button>
</div>
<div class="dual-list list-right col-md-5">
<div class="well">
<div class="row">
<div class="col-md-2">
<div class="btn-group">
<a class="btn btn-default selector" title="select all"><i class="glyphicon glyphicon-unchecked"></i></a>
</div>
</div>
<div class="col-md-10">
<div class="input-group">
<input type="text" name="SearchDualList" class="form-control" placeholder="search" />
<span class="input-group-addon glyphicon glyphicon-search"></span>
</div>
</div>
</div>
<ul class="list-group">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<li class="list-group-item">Porta ac consectetur ac</li>
<li class="list-group-item">Vestibulum at eros</li>
</ul>
</div>
</div>
</div>
-->
<br />
<br />
<br />
<h1>Hello, world!</h1>
<textarea id="editor"></textarea>
<br />
<br />
<div class="row text-center p-2 border-bottom">
<h1>bootstrap 5 & select2</h>
</div>
<div class="row pt-4 justify-content-center "> <!-- vh-100 -->
</br></br></br></br>
<div class="col-6">
<select class="form-select" id="multiple-select-field" data-placeholder="Choose anything" multiple>
<option>Christmas Island</option>
<option>South Sudan</option>
<option>Jamaica</option>
<option>Kenya</option>
<option>French Guiana</option>
<option>Mayotta</option>
<option>Liechtenstein</option>
<option>Denmark</option>
<option>Eritrea</option>
<option>Gibraltar</option>
<option>Saint Helena, Ascension and Tristan da Cunha</option>
<option>Haiti</option>
<option>Namibia</option>
<option>South Georgia and the South Sandwich Islands</option>
<option>Vietnam</option>
<option>Yemen</option>
<option>Philippines</option>
<option>Benin</option>
<option>Czech Republic</option>
<option>Russia</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-7">
<select multiple="multiple" size="10" name="duallistbox_demo2" class="demo2" title="duallistbox_demo2">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3" selected="selected">Option 3</option>
<option value="option4">Option 4</option>
<option value="option5">Option 5</option>
<option value="option6" selected="selected">Option 6</option>
<option value="option7">Option 7</option>
<option value="option8">Option 8</option>
<option value="option9">Option 9</option>
<option value="option0">Option 10</option>
<option value="option0">Option 11</option>
<option value="option0">Option 12</option>
<option value="option0">Option 13</option>
<option value="option0">Option 14</option>
<option value="option0">Option 15</option>
<option value="option0">Option 16</option>
<option value="option0">Option 17</option>
<option value="option0">Option 18</option>
<option value="option0">Option 19</option>
<option value="option0">Option 20</option>
</select>
</div>
<!--
<div class="row" style="margin-top: 40px;">
<div class="col">
<button class="btn btn-primary float-right">Add payees</button>
<h2> Pay Bills </h2>
<p><strong>Step 1:</strong> Select from your list of available payees to build a payment list</p>
<hr/>
</div>
</div>
<div class="row" style="margin-bottom: 40px;">
<div class="col">
<form id="demoform">
<select multiple="multiple" size="10" name="duallistbox_demo1[]" title="duallistbox_demo1[]">
<option value="payee1">Aviva Insurance - Business - 987654</option>
<option value="payee2">Bell Mobility - 66853 (John Smith)</option>
<option value="payee3">Bell Mobility - 75432 (Jane Smith)</option>
<option value="payee4">Bell Mobility - 98765 (Jim Smith)</option>
<option value="payee5">Canadian Tire Commercial Mastercard - **** 5525</option>
<option value="payee6">Canadian Tire Mastercard - **** 3158 (President's Card)</option>
<option value="payee7">FedEx Express Canada - 54321</option>
<option value="payee8">Lowes Canada - 12345</option>
<option value="payee9">Mastercard, PC Financial - **** 5535</option>
<option value="payee10">Qtrade Investor - 12345</option>
<option value="payee11" selected="selected">Servus Mastercard - **** 5545</option>
<option value="payee12">Telus - 123456787 (Calagary Office)</option>
<option value="payee13">Telus - 123456788 (Edmonton NW Office)</option>
<option value="payee14">Telus - 123456789 (Edmonton SE Office)</option>
</select>
<br>
<div class="row">
<div class="col-md-6 offset-md-6">
<button type="submit" class="btn btn-primary w-100">Create payment (#)</button>
</div>
</div>
</form>
</div>
</div>
-->
<div class="mt-2">
<label class="control-label" for="textarea">Descrizione breve:</label>
<textarea class="summernote" name="content_abstract">blabla</textarea>
</div>
</div> <!-- /.card-body -->
<div class="card-footer">
<button type="submit" name="ajouter_categorie" class="btn btn-success">Ajouter</button>
</div>
</form>
</div> <!-- /.card -->
</div><!-- /.col -->
<!-- -->
<!-- -->
<!-- -->
</div> <!-- /.row -->
</div><!--/. container-fluid -->
</section> <!-- /.content -->
</div> <!-- /.content-wrapper -->
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Control sidebar content goes here -->
</aside>
<!-- /.control-sidebar -->
<?php include("footer.php"); ?>
</div> <!-- ./wrapper -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<!--
<script src="https://cdn.jsdelivr.net/npm/admin-lte@3.1/dist/js/adminlte.min.js"></script>
-->
<script src="adminlte.js"></script>
<!--
<script src="https://www.virtuosoft.eu/code/bootstrap-duallistbox/bootstrap-duallistbox/v3.0.2/jquery.bootstrap-duallistbox.js"></script>
-->
<script src="jquery.bootstrap-duallistbox.js"></script>
<!-- pas utile ????
<script src="jquery.selectlistactions.js"></script>
-->
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(function ()
{
var demo2 = $('.demo2').bootstrapDualListbox({
//nonSelectedListLabel: 'Non-selected',
//selectedListLabel: 'Selected',
infoText: 0,
preserveSelectionOnMove: 'moved',
moveOnSelect: false,
//nonSelectedFilter: 'ion ([7-9]|[1][0-2])'
});
});
/**/
$(function ()
{
$( '#multiple-select-field' ).select2( {
theme: "bootstrap-5",
width: $( this ).data( 'width' ) ? $( this ).data( 'width' ) : $( this ).hasClass( 'w-100' ) ? '100%' : 'style',
placeholder: $( this ).data( 'placeholder' ),
closeOnSelect: false,
} );
});
/**/
$(function () {
$('body').on('click', '.list-group .list-group-item', function () {
$(this).toggleClass('active');
});
$('.list-arrows button').click(function () {
var $button = $(this), actives = '';
if ($button.hasClass('move-left')) {
actives = $('.list-right ul li.active');
actives.clone().appendTo('.list-left ul');
actives.remove();
} else if ($button.hasClass('move-right')) {
actives = $('.list-left ul li.active');
actives.clone().appendTo('.list-right ul');
actives.remove();
}
});
$('.dual-list .selector').click(function () {
var $checkBox = $(this);
if (!$checkBox.hasClass('selected')) {
$checkBox.addClass('selected').closest('.well').find('ul li:not(.active)').addClass('active');
$checkBox.children('i').removeClass('glyphicon-unchecked').addClass('glyphicon-check');
} else {
$checkBox.removeClass('selected').closest('.well').find('ul li.active').removeClass('active');
$checkBox.children('i').removeClass('glyphicon-check').addClass('glyphicon-unchecked');
}
});
$('[name="SearchDualList"]').keyup(function (e) {
var code = e.keyCode || e.which;
if (code == '9') return;
if (code == '27') $(this).val(null);
var $rows = $(this).closest('.dual-list').find('.list-group li');
var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
$rows.show().filter(function () {
var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
return !~text.indexOf(val);
}).hide();
});
});
/**/
(function () {
$("#btnRight").click(function (e) {
var selectedOpts = $("#lstBox1 option:selected");
if (selectedOpts.length == 0) {
alert("Nothing to move.");
e.preventDefault();
}
$("#lstBox2").append($(selectedOpts).clone());
$(selectedOpts).remove();
e.preventDefault();
});
$("#btnAllRight").click(function (e) {
var selectedOpts = $("#lstBox1 option");
if (selectedOpts.length == 0) {
alert("Nothing to move.");
e.preventDefault();
}
$("#lstBox2").append($(selectedOpts).clone());
$(selectedOpts).remove();
e.preventDefault();
});
$("#btnLeft").click(function (e) {
var selectedOpts = $("#lstBox2 option:selected");
if (selectedOpts.length == 0) {
alert("Nothing to move.");
e.preventDefault();
}
$("#lstBox1").append($(selectedOpts).clone());
$(selectedOpts).remove();
e.preventDefault();
});
$("#btnAllLeft").click(function (e) {
var selectedOpts = $("#lstBox2 option");
if (selectedOpts.length == 0) {
alert("Nothing to move.");
e.preventDefault();
}
$("#lstBox1").append($(selectedOpts).clone());
$(selectedOpts).remove();
e.preventDefault();
});
})(jQuery);
document.querySelectorAll('.dropdown-toggle').forEach(item =>
{
item.addEventListener('click', event =>
{
if(event.target.classList.contains('dropdown-toggle') )
{
event.target.classList.toggle('toggle-change');
}
else if(event.target.parentElement.classList.contains('dropdown-toggle'))
{
event.target.parentElement.classList.toggle('toggle-change');
}
})
});
$(document).ready(function() {
$('.summernote').summernote();
});
</script>
</body>
</html>