CDCC
/
inventarioSustancias
Watch 2
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Proyecto en colaboración con OPASO
37 Commits
1 Branch
Tree: a5b9f19e24
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'a5b9f19e24'
${ noResults }
inventarioSustancias/public_html/laboratory.php

laboratory.php 17KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316 
  1. <!--    Authors         :   Carlos C. Corrada-Bravo

  2.                             David J. Ortiz-Rivera

  3. 

  4.         Organization    :   Centro de Desarrollo y Consultoria Computacional

  5.         Project         :   OPASO Material Registry  

  6.         File            :   laboratory

  7.         Description     :   Display laboratory inventory -->

  8. 

  9. <!-- verify session -->

  10. <?php require_once("header.php");

  11. 

  12.     /* start user session */

  13.     if(!isset($_SESSION)){

  14.         session_start();

  15.     }

  16. 

  17.     /* verify lab id */

  18.     if(!isset($_GET["lab_id"])){

  19.         header("Location: /menu");

  20.         die();

  21.     }

  22. 

  23.     else{

  24.         if(!(array_key_exists($_GET["lab_id"],$_SESSION["authorized"]))){

  25.             header("Location: /menu");

  26.             die();

  27.         }

  28.     }

  29. ?>

  30. 

  31. <!doctype html>

  32. <html lang="en">

  33.     <!-- encoding/imports/styling -->

  34.     <head>

  35.         <meta charset="utf-8">

  36.         <meta name="viewport" content="width=device-width, initial-scale=1.0">

  37.         <title class="title"><?php echo $_SESSION["authorized"][$_GET["lab_id"]]["lab_room"]; ?></title>

  38.         <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

  39.         <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

  40.         <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">

  41.         <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">

  42.         <link rel="stylesheet" href="/style/main.css">

  43.         <link rel="stylesheet" href="/style/laboratory.css">

  44.     </head>

  45.     

  46.     <!-- content -->

  47.     <body>

  48.         <!-- transaction forms -->

  49.         <div class="form-shader close-form">

  50.             <!-- main transactions -->

  51.             <div class="main-form close-form">

  52.                 <div class="form-wrapper">

  53.                     <div class="form-header-wrapper">

  54.                         <h4 class="form-header main-header">Material Use</h4>

  55.                         <div class="close-icon"><i class="material-icons close-form">close</i></div>

  56.                     </div>

  57.                     <div class="form">

  58.                         <div class="form-body">

  59.                             <div class="li-wrapper total">

  60.                                 <label class="label" for="total">Limit</label>

  61.                                 <input class="text-field" id="total" type="text" name="total" disabled>

  62.                             </div>

  63.                             <div class="li-wrapper">

  64.                                 <label class="label transaction-label" for="transaction"></label>

  65.                                 <div class="control-wrapper">

  66.                                     <input class="text-field" id="transaction" type="text" name="transaction">

  67.                 <!--                     <i class="control control-plus fas fa-plus" id="plus"></i><br>

  68.                                     <i class="control control-minus fas fa-minus" id="minus"></i> -->

  69.                                 </div>

  70.                             </div>

  71.                         </div>

  72.                         <div class="form-actions">

  73.                             <button class="btn btn-primary action-btn submit" id="main-submit">Submit</button>

  74.                         </div>

  75.                     </div>

  76.                 </div>

  77.             </div>

  78.             

  79.             <!-- add material -->

  80.             <div class="add-form close-form">

  81.                 <div class="add-form-wrapper">

  82.                     <div class="add-form-header-wrapper">

  83.                         <h4 class="form-header">Add Material</h4>

  84.                         <div class="close-icon"><i class="material-icons close-form">close</i></div>

  85.                     </div>

  86.                     <div class="add-form-body-wrapper">

  87.                         <div class="add-form-body">

  88.                             <div class="details material">

  89.                                 <h5 class="details-header">Material Details</h5>

  90.                                 <div class="add-li-wrapper large-field">

  91.                                     <label for="mat_name">Material</label>

  92.                                     <input class="material-input" type="text" placeholder="Material name" name="mat_name">

  93.                                 </div>

  94.                                 <div class="add-li-wrapper medium-field">

  95.                                     <label for="cas-number">CAS Number</label>

  96.                                     <input class="material-input" type="text" placeholder="CAS Num." name="cas">

  97.                                 </div>

  98.                                 <div class="add-li-wrapper medium-field">

  99.                                     <label for="man_name">Manufacturer</label>

  100.                                     <input class="material-input" type="text" placeholder="Manufacturer name" name="man_name">

  101.                                 </div>

  102.                                 <div class="add-li-wrapper large-field">

  103.                                     <label for="sds-link">SDS Link</label>

  104.                                     <input class="material-input" type="text" placeholder="SDS Link" name="sds">

  105.                                 </div>

  106.                                 <div class="add-li-wrapper extra-small-field">

  107.                                     <label for="state">State</label>

  108.                                     <input class="material-input" type="text" placeholder="State" name="state">

  109.                                 </div>

  110.                             </div>

  111.                             <div class="details hazard">

  112.                                 <h5 class="details-header">Hazard Details</h5>

  113.                                 <div class="add-li-wrapper small-field">

  114.                                     <label for="ghs">GHS</label>

  115.                                     <input class="material-input" type="text" placeholder="GHS" name="ghs">

  116.                                 </div>

  117.                                 <div class="add-li-wrapper medium-field">

  118.                                     <label for="hazard">Hazard</label>

  119.                                     <input class="material-input" type="text" placeholder="Hazard" name="hazard">

  120.                                 </div>

  121.                             </div>

  122.                             <div class="details container-details">

  123.                                 <h5 class="details-header">Container Details</h5>

  124.                                 <div class="add-li-wrapper extra-small-field">

  125.                                     <label for="type">Type</label>

  126.                                     <input class="material-input" type="text" placeholder="Type" name="type">

  127.                                 </div>

  128.                                 <div class="add-li-wrapper small-field">

  129.                                     <label for="capacity">Capacity</label>

  130.                                     <input class="material-input" type="text" name="capacity" placeholder="Capacity" oninput="this.value = this.value.replace(/[^0-9.]/g,'').replace(/(\..*)\./g, '$1');">

  131.                                 </div>

  132.                                 <div class="add-li-wrapper small-field quantity">

  133.                                     <label for="quantity">Quantity</label>

  134.                                     <input class="material-input" type="text" name="quantity" placeholder="Quantity" oninput="this.value = this.value.replace(/[^0-9.]/g,'').replace(/(\..*)\./g, '$1');">

  135.                                 </div>

  136.                                 <div class="add-li-wrapper small-field uom">

  137.                                     <label for="uom">UOM</label>

  138.                                     <input class="material-input" type="text" placeholder="UOM" name="uom">

  139.                                 </div>

  140.                                 <div class="add-li-wrapper medium-field">

  141.                                     <label for="location">Location</label>

  142.                                     <input class="material-input" type="text" placeholder="Location" name="location">

  143.                                 </div> 

  144.                             </div>

  145.                         </div>

  146.                         <div class="add-form-actions">

  147.                             <button class="btn btn-primary action-btn submit" id="add-submit">Submit</button>

  148.                         </div>

  149.                     </div>

  150.                 </div>

  151.             </div> 

  152.         </div>

  153. 

  154.         <!-- alerts -->

  155.         <div class="alerts">

  156.             <div class="alert">

  157.                 <div class="message-icon-wrapper">

  158.                     <i class="message-icon success-icon material-icons">done</i>

  159.                     <i class="message-icon error-icon failed-icon warning-icon material-icons">close</i>

  160.                 </div>

  161.                 <p class="alert-status"></p>

  162.                 <p class="alert-message"></p>

  163.             </div>

  164.         </div>

  165. 

  166.         <!-- confirm alert -->

  167.         <div class="alert-wrapper hide-confirm">

  168.             <div class="confirm-alert">

  169.                 <h5 class="header confirm-header">Confirm</h5>

  170.                 <div class="mi-wrapper">

  171.                     <div class="confirm-message"></div>

  172.                     <div class="query-actions">

  173.                         <button class="btn query-btn" id="yes">Yes</button>

  174.                         <button class="btn query-btn hide-confirm">No</button>

  175.                     </div>                                       

  176.                 </div>

  177.             </div> 

  178.         </div>

  179. 

  180.         <!-- material data -->

  181.         <div class="material-data-shader hide-material-data">

  182.             <div class="material-data-wrapper">

  183.                 <div class="material-data-icon-wrapper">

  184.                     <i class="hide-material-data-icon hide-material-data material-icons">close</i>

  185.                 </div>

  186.                 <div class="material-data">

  187.                     <div class="material-name-wrapper">

  188.                         <h5 class="header material-data-header material-name" value="mat_name"></h6>

  189.                         <a class="material-link" target="_blank" rel="noopener noreferrer" title="material"><i class="fas fa-external-link-alt"></i></a>

  190.                     </div>

  191.                     <div class="material-data-row">

  192.                         <h6 class="header material-data-header">CAS Num.</h6>

  193.                         <span class="material-data-text" value="cas"></span>

  194.                     </div>

  195.                     <div class="material-data-row">

  196.                         <h6 class="header material-data-header">State</h6>

  197.                         <span class="material-data-text" value="state"></span>

  198.                     </div>

  199.                     <div class="material-data-row">

  200.                         <h6 class="header material-data-header">Type</h6>

  201.                         <span class="material-data-text" value="type"></span>

  202.                     </div>

  203.                     <div class="material-data-row">

  204.                         <h6 class="header material-data-header">SDS Link</h6>

  205.                         <span class="material-data-text" value="sds"></span>

  206.                     </div>

  207.                     <div class="material-data-row">

  208.                         <h6 class="header material-data-header">GHS</h6>

  209.                         <span class="material-data-text" value="ghs"></span>

  210.                     </div>

  211.                 </div> 

  212.             </div>

  213.         </div>

  214. 

  215.         <div class="content">

  216.             <!-- navbar -->

  217.             <?php require_once("navbar.php")?>

  218.             <div class="main">

  219.                 <div class="header-wrapper">

  220.                     <h5 class="header lab-header"><?php echo $_SESSION["authorized"][$_GET["lab_id"]]["lab_room"]; ?></h5>

  221.                     

  222.                     <!-- processing -->

  223.                     <div class="processing">

  224.                         <p class="processing-text">Fetching inventory...</p>

  225.                         <div class="loader"></div>

  226.                     </div>

  227.                 </div>

  228. 

  229.                 <div class="main-wrapper">

  230. 

  231.                     <!-- inventory -->

  232.                     <div class="personnel-wrapper">

  233.                         <h6 class="header sub-header">Personnel</h6>

  234.                         <table class="table personnel">

  235.                             <thead class="table-header">

  236.                                 <tr>

  237.                                     <th value="person_name" >Person Name</th>

  238.                                     <th value="access_level">Access level</th>

  239.                                 </tr>

  240.                             </thead>

  241.                             <tbody class="personnel-body"></tbody>

  242.                         </table>

  243.                     </div>

  244. 

  245.                     <div class="float-right">

  246.                         <div class="dropdown download">

  247.                             <button class="btn btn-outline-success download-btn" type="button" title="Download" id="dropdown-menu-button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="material-icons download-icon">archived</i></button>

  248.                             <div class="dropdown-menu" aria-labelledby="dropdown-menu-button">

  249.                                 <span class="download-option" value="lab_report">Lab Report</span>

  250.                             </div>

  251.                         </div>

  252. 

  253.                         <div class="btn btn-light transaction add-material" id="add-material">

  254.                             <i class="fas fa-plus add-material-icon"></i>

  255.                             <p class="add-text">Add</p>

  256.                         </div>

  257. 

  258.                         <div class="search-form-wrapper">

  259.                             <input class="search-form" type="text" placeholder="Search for materials" name="search-form">

  260.                             <button class="clear-btn search-form-submit">

  261.                                 <i class="material-icons clear-icon">close</i>

  262.                             </button>

  263.                         </div>

  264.                     </div>

  265. 

  266.                     <!-- inventory -->

  267.                     <div class="sub-header-wrapper">

  268.                         <h6 class="header sub-header table-sub-header">Inventory</h6>

  269.                         <?php

  270.                             /* start user session */

  271.                             if(!isset($_SESSION)){

  272.                                 session_start();

  273.                             }

  274.                             if($_SESSION["access_level"] == "admin" or $_SESSION["access_level"] == "investigator"){

  275.                                 echo '<a class="edit-link" href="/inventory?lab_id=' . $_GET["lab_id"] . '" title="edit inventory">(Edit)</a>';

  276.                             }

  277.                         ?>

  278.                     </div>

  279. 

  280.                     <div class="table-wrapper content-wrapper inventory">

  281.                         <table class="table">

  282.                             <thead class="table-header">

  283.                                 <tr>

  284.                                     <th class="sort" value="mat_name" >Material

  285.                                         <i class="sort-icon sort-material fas fa-caret-down"></i>

  286.                                     </th>

  287.                                     <th  class="sort" value="man_name">Manufacturer

  288.                                         <i class="sort-alt fas fa-caret-down"></i>

  289.                                     </th>

  290.                                     <th value="capacity">Capacity</th>

  291.                                     <th value="quantity">Quantity</th>

  292.                                     <th value="total">Total</th>

  293.                                     <th value="uom">UOM</th>

  294.                                     <th >Location</th>

  295.                                     <th >Transactions</th>

  296.                                 </tr>

  297.                             </thead>

  298.                             <tbody class="inventory-body"></tbody>

  299.                         </table>

  300.                     </div>

  301.                     <h6 class="header table-total"></h6>

  302.                 </div>

  303.             </div>

  304. 

  305.             <!-- footer -->

  306.             <?php require_once("footer.php")?>

  307.         </div>  

  308. 

  309.         <!-- scripts -->

  310.         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

  311.         <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>

  312.         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

  313.         <script type="text/javascript" src="/scripts/main.js"></script>

  314.         <script type="text/javascript" src="/scripts/laboratory.js"></script>

  315.     </body>

  316. </html>