diff --git a/contact.sql b/contact.sql new file mode 100644 index 0000000..7d6f877 --- /dev/null +++ b/contact.sql @@ -0,0 +1,70 @@ +-- phpMyAdmin SQL Dump +-- version 4.8.3 +-- https://www.phpmyadmin.net/ +-- +-- Hôte : 127.0.0.1:3306 +-- Généré le : mar. 27 nov. 2018 à 10:58 +-- Version du serveur : 5.7.23 +-- Version de PHP : 7.0.32 + +SET SQL_MODE = "no_auto_value_on_zero"; +SET AUTOCOMMIT = 0; +START TRANSACTION; +SET time_zone = "+00:00"; + + +/*!40101 SET @`old_character_set_client` = @@`character_set_client` */; +/*!40101 SET @`old_character_set_results` = @@`character_set_results` */; +/*!40101 SET @`old_collation_connection` = @@`collation_connection` */; +/*!40101 SET NAMES utf8mb4 */; + +-- +-- Base de données : `contact` +-- + +-- -------------------------------------------------------- + +-- +-- Structure de la table `contact` +-- + +DROP TABLE IF EXISTS `contact`; +CREATE TABLE IF NOT EXISTS `contact` +( + `id` INT(10) UNSIGNED NOT NULL AUTO_INCREMENT, + `first_name` VARCHAR(255) COLLATE `utf8_unicode_ci` NOT NULL, + `last_name` VARCHAR(255) COLLATE `utf8_unicode_ci` NOT NULL, + `surname` VARCHAR(255) COLLATE `utf8_unicode_ci` DEFAULT NULL, + `email` VARCHAR(255) COLLATE `utf8_unicode_ci` DEFAULT NULL, + `address` VARCHAR(255) COLLATE `utf8_unicode_ci` DEFAULT NULL, + `phone_number` VARCHAR(255) COLLATE `utf8_unicode_ci` DEFAULT NULL, + `birthday` DATE DEFAULT NULL, + PRIMARY KEY (`id`) +) ENGINE = InnoDB + DEFAULT CHARSET = `utf8` + COLLATE = `utf8_unicode_ci`; + +-- -------------------------------------------------------- + +-- +-- Structure de la table `logs` +-- + +DROP TABLE IF EXISTS `logs`; +CREATE TABLE IF NOT EXISTS `logs` +( + `id` INT(10) NOT NULL AUTO_INCREMENT, + `level` SMALLINT(5) NOT NULL, + `message` VARCHAR(2000) COLLATE `utf8_unicode_ci` NOT NULL, + `file` VARCHAR(255) COLLATE `utf8_unicode_ci` NOT NULL, + `line` VARCHAR(6) COLLATE `utf8_unicode_ci` NOT NULL, + `date` DATETIME NOT NULL, + PRIMARY KEY (`id`) +) ENGINE = InnoDB + DEFAULT CHARSET = `utf8` + COLLATE = `utf8_unicode_ci`; +COMMIT; + +/*!40101 SET CHARACTER_SET_CLIENT = @`old_character_set_client` */; +/*!40101 SET CHARACTER_SET_RESULTS = @`old_character_set_results` */; +/*!40101 SET COLLATION_CONNECTION = @`old_collation_connection` */; diff --git a/src/View/Site/tpl/footer.php b/src/View/Site/tpl/footer.php index 6732fe2..b99eda0 100644 --- a/src/View/Site/tpl/footer.php +++ b/src/View/Site/tpl/footer.php @@ -4,7 +4,7 @@ <div id="modal" class="md-modal"> <div class="md-content"> - <h3 class="md-header">Add contact</h3> + <h3 class="md-header md-title">Add contact</h3> <div class="md-container row"> <form class="col s12"> diff --git a/static/js/javascript.js b/static/js/javascript.js index f620ae0..a764383 100644 --- a/static/js/javascript.js +++ b/static/js/javascript.js @@ -23,9 +23,6 @@ let displayContacts = (contacts) => { $(document).ready(() => { - let modal = $('.modal'); - - modal.modal(); let search = (query) => { if (query.length >= 2) { @@ -81,7 +78,43 @@ $(document).ready(() => { }); $(document).on("click", ".add-contacts", () => { - $("#modal").addClass("md-show"); + let modal = $("#modal"); + + modal.find("input").each((i, e) => { + let $e = $(e); + + $e.val(""); + $e.removeClass("valid"); + $e.removeClass("invalid"); + $e.parent().find("label").removeClass("active"); + }); + + modal.find(".md-title").text("Add Contact"); + modal.removeAttr("data-id"); + modal.addClass("md-show"); + }); + + $(document).on("click", ".modify", function () { + let modal = $("#modal"); + let $contact = $(this).closest("tr"); + let id = parseInt($contact.attr("data-id"), 10); + let inputs = modal.find("input"); + let td = $contact.find("td"); + + modal.find(".md-title").text("Modify Contact"); + modal.attr("data-id", id); + modal.addClass("md-show"); + + for (let i = 0; i < 7; i++) { + let input = $(inputs[i]); + let value = $(td[i]).text(); + + input.val(value); + if (value !== "") { + input.addClass("valid"); + input.parent().find("label").addClass("active"); + } + } }); $(document).on("click", "#md-cancel", () => { @@ -89,6 +122,7 @@ $(document).ready(() => { }); $(document).on("click", "#md-validate", () => { + let modal = $("#modal"); let firstName = $("#first_name").val(); let lastName = $("#last_name").val(); let surname = $("#surname").val(); @@ -97,6 +131,10 @@ $(document).ready(() => { let phoneNumber = $("#phone_number").val(); let birthday = $("#birthday").val(); + let id = modal.attr("data-id"); + + console.log(modal, id); + if (firstName !== "" && lastName !== "") { let data = { firstName, @@ -108,21 +146,44 @@ $(document).ready(() => { birthday: (birthday !== "" ? birthday : null), }; - $.ajax({ - url: "/api/contact/insert", - method: "POST", - data, - success: function (result) { - result = JSON.parse(result); - data["id"] = parseInt(result.data["id"], 10); - contacts.push(data); + if (id && parseInt(id, 10) > 0) { + id = parseInt(id, 10); + data["id"] = id; + $.ajax({ + url: "/api/contact/update", + method: "POST", + data, + success: function (result) { + result = JSON.parse(result); - $("table tbody").empty(); - displayContacts(contacts); - $("#modal").removeClass("md-show"); - }, error: function () { - } - }); + for (let i = 0; i < contacts.length; i++) { + if (contacts[i].id === id) { + contacts[i] = result; + } + } + + $("table tbody").empty(); + displayContacts(contacts); + $("#modal").removeClass("md-show"); + } + }) + } else { + $.ajax({ + url: "/api/contact/insert", + method: "POST", + data, + success: function (result) { + result = JSON.parse(result); + data["id"] = parseInt(result.data["id"], 10); + contacts.push(data); + + $("table tbody").empty(); + displayContacts(contacts); + $("#modal").removeClass("md-show"); + }, error: function () { + } + }); + } } }); @@ -143,4 +204,17 @@ $(document).ready(() => { }) }); + setInterval(() => { + $.ajax({ + url: "/api/contact/get-contacts", + method: "GET", + success: function (data) { + contacts = JSON.parse(data).contacts; + + $("table tbody").empty(); + displayContacts(contacts); + } + }) + }, 10000); + });