Implement Popup Window for Edit Found Items

This commit is contained in:
Katharina 2019-02-22 15:30:43 +01:00 committed by /jedi/
parent 6c17a76393
commit 33ec4480d6
4 changed files with 406 additions and 103 deletions

View file

@ -7,6 +7,7 @@
*/
include "backend.php";
include "functions.php";
function hasval($var){
return isset($var) && !empty($var);
@ -102,10 +103,10 @@ switch($_GET["action"]) {
}
break;
case "edit_found_item":
if(hasval($_POST["id"]) && hasval($_POST["was"]) && hasval($_POST["wann"])) {
if(hasval($_POST["id"]) && hasval($_POST["was"])) {
/* Prepared statement, stage 1: prepare */
$was=$_POST["was"];
if (!($stmt = $mysqli->prepare("UPDATE found_items SET was=?, wo=?, `date`=? WHERE id = ?"))) {
if (!($stmt = $mysqli->prepare("UPDATE found_items SET was=?, wo=?, wann=? WHERE id = ?"))) {
$errormsg = "Prepare failed: (" . $mysqli->errno . ") " . $mysqli->error;
}
if (!$stmt->bind_param("sssi", $_POST["was"] , $_POST["wo"], $_POST["wann"], $_POST["id"])) {
@ -115,7 +116,9 @@ switch($_GET["action"]) {
$errormsg = "Execute failed: (" . $stmt->errno . ") " . $stmt->error;
}
if(isset($_FILES["image"])){
$successmsg = "one item edited";
if(isset($_FILES["image"])&& hasval($_FILES["image"]["tmp_name"])){
if(!file_exists ( "upload/")){
mkdir("upload/");
}
@ -132,11 +135,11 @@ switch($_GET["action"]) {
$errormsg = "Execute failed: (" . $stmt->errno . ") " . $stmt->error;
}
$successmsg = "one item edited";
}else{
$errormsg = "upload failed";
}
}else{
$errormsg = "upload failed";
}
@ -179,12 +182,73 @@ switch($_GET["action"]) {
$errormsg = "upload failed";
}
}else{
$errormsg = "upload failed";
}
}else{
$errormsg = "all values have to be set";
}
break;
case "get_found_table":
?>
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
<thead>
<tr>
<th>ID</th>
<th>was</th>
<th>wann</th>
<th>wo</th>
<th>foto</th>
<th></th>
</tr>
</thead>
<tfoot>
<tr>
<th>ID</th>
<th>was</th>
<th>wann</th>
<th>wo</th>
<th>foto</th>
<th></th>
</tr>
</tfoot>
<tbody>
<?php
foreach( get_founditems(true) as $item){
?>
<tr>
<td><?php echo $item["id"]; ?> </td>
<td><?php echo $item["was"]; ?></td>
<td><?php echo $item["wann"]; ?></td>
<td><?php echo $item["wo"]; ?></td>
<td><img style="height: 48px;" src="/upload/<?php echo $item["hash"]; ?>"></td>
<td>
<div class="btn-group" role="group">
<button type="button" class="btn btn-outline-secondary"><i class="fas fa-fw fa-check-circle"></i></button>
<!--<a href="/found_item_edit/<?php echo $item["id"]; ?>/" type="button" class="btn btn-outline-secondary"><i class="fas fa-fw fa-edit"></i></a>-->
<button type="button" class="btn btn-outline-secondary" data-toggle="modal" data-target="#exampleModal" onclick="fill_edit_form(<?php echo $item["id"]; ?>,'<?php echo $item["was"]; ?>','<?php echo $item["wann"]; ?>','<?php echo $item["wo"]; ?>','<?php echo $item["hash"]; ?>')">
<i class="fas fa-fw fa-edit"></i>
</button>
<button type="button" class="btn btn-outline-danger" onclick="delete_item(<?php echo $item["id"]; ?>)"><i class="fas fa-fw fa-trash-alt"></i></button>
</div>
</td>
<!--td>
<?php
foreach(explode(",",$item["tags"]) as $tag){
?>
<span class="label label-default"><?php echo $tag; ?></span>
<?php
}
?>
</td>
<td><?php echo $item["id"]; ?></td-->
</tr>
<?php
}
?>
</tbody>
</table>
<?php
exit;
break;
default:
$errormsg = "action unknown";
break;

93
functions.php Normal file
View file

@ -0,0 +1,93 @@
<?php
function auth(){
if(!isset($_SERVER['PHP_AUTH_USER']))
return false;
if(!isset($_SERVER['PHP_AUTH_PW']))
return false;
if($_SERVER['PHP_AUTH_USER']!="c3cloc")
return false;
if($_SERVER['PHP_AUTH_PW']!="findetalles")
return false;
return true;
}
function get_founditems($onlyUnmatched = false){
global $mysqli;
if ($onlyUnmatched) {
$res = $mysqli->query("SELECT distinct found_items.*, files.hash FROM (SELECT files.* from files ORDER BY files.id DESC LIMIT 100000) as files, found_items LEFT JOIN matches ON found_items.id = matches.f_id WHERE found_items.del = 0 AND files.item_id = found_items.id AND matches.f_id IS NULL GROUP BY files.item_id ORDER BY found_items.id DESC");
} else {
$res = $mysqli->query("SELECT found_items.*, files.hash FROM (SELECT files.* from files ORDER BY files.id DESC LIMIT 100000) as files, found_items WHERE files.item_id = found_items.id AND found_items.del = 0 GROUP BY files.item_id ORDER BY found_items.id ASC");
}
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_lostitems($onlyUnmatched = false){
global $mysqli;
if ($onlyUnmatched) {
$res = $mysqli->query("SELECT lost_items.* FROM lost_items LEFT JOIN matches ON lost_items.id = matches.l_id WHERE lost_items.del = 0 AND matches.l_id IS NULL ORDER BY lost_items.id DESC");
} else {
$res = $mysqli->query("SELECT * FROM lost_items WHERE lost_items.del = 0 ORDER BY id ASC");
}
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_founditem($id){
global $mysqli;
$res = $mysqli->query("SELECT * FROM found_items, files WHERE found_items.id = $id AND found_items.id = files.item_id ORDER BY files.id DESC");
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_matches(){
global $mysqli;
$res = $mysqli->query("SELECT matches.id AS id, matches.f_id as f_id, matches.l_id as l_id, lost.was as l_desc, items.was as f_desc "
."FROM lost, items, matches WHERE lost.id = matches.l_id and items.id = matches.f_id ORDER BY matches.id ASC;");
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_stats(){
global $mysqli;
$ret = array();
$ret["lost"]=0;
$ret["found"]=0;
$res = $mysqli->query("select hour(date) as h, day(date) as d, count(date) as c from items group by h, d order by d, h");
$ret["graph"] = array();
while ($row = $res->fetch_assoc()) {
$ret["graph"][] = $row;
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM lost_items WHERE lost_items.del = 0 ORDER BY id ASC");
if ($row = $res->fetch_assoc()) {
$ret["lost"] = $row["c"];
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM found_items WHERE found_items.del = 0 ORDER BY id ASC");
if ($row = $res->fetch_assoc()) {
$ret["found"] = $row["c"];
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM matches ORDER BY id ASC");
if ($row = $res->fetch_assoc()) {
$ret["match"] = $row["c"];
}
$ret["unmatched"] = $ret["found"] + $ret["lost"] - 2 * $ret["match"];
return $ret;
}
?>

View file

@ -7,98 +7,8 @@
*/
include "backend.php";
include "functions.php";
function auth(){
if(!isset($_SERVER['PHP_AUTH_USER']))
return false;
if(!isset($_SERVER['PHP_AUTH_PW']))
return false;
if($_SERVER['PHP_AUTH_USER']!="c3cloc")
return false;
if($_SERVER['PHP_AUTH_PW']!="findetalles")
return false;
return true;
}
function get_founditems($onlyUnmatched = false){
global $mysqli;
if ($onlyUnmatched) {
$res = $mysqli->query("SELECT distinct found_items.*, files.hash FROM (SELECT files.* from files ORDER BY files.id DESC LIMIT 100000) as files, found_items LEFT JOIN matches ON found_items.id = matches.f_id WHERE found_items.del = 0 AND files.item_id = found_items.id AND matches.f_id IS NULL GROUP BY files.item_id ORDER BY found_items.id DESC");
} else {
$res = $mysqli->query("SELECT found_items.*, files.hash FROM (SELECT files.* from files ORDER BY files.id DESC LIMIT 100000) as files, found_items WHERE files.item_id = found_items.id AND found_items.del = 0 GROUP BY files.item_id ORDER BY found_items.id ASC");
}
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_lostitems($onlyUnmatched = false){
global $mysqli;
if ($onlyUnmatched) {
$res = $mysqli->query("SELECT lost_items.* FROM lost_items LEFT JOIN matches ON lost_items.id = matches.l_id WHERE lost_items.del = 0 AND matches.l_id IS NULL ORDER BY lost_items.id DESC");
} else {
$res = $mysqli->query("SELECT * FROM lost_items WHERE lost_items.del = 0 ORDER BY id ASC");
}
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_founditem($id){
global $mysqli;
$res = $mysqli->query("SELECT * FROM found_items, files WHERE found_items.id = $id AND found_items.id = files.item_id ORDER BY files.id DESC");
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_matches(){
global $mysqli;
$res = $mysqli->query("SELECT matches.id AS id, matches.f_id as f_id, matches.l_id as l_id, lost.was as l_desc, items.was as f_desc "
."FROM lost, items, matches WHERE lost.id = matches.l_id and items.id = matches.f_id ORDER BY matches.id ASC;");
$ret = array();
while ($row = $res->fetch_assoc()) {
$ret[] = $row;
}
return $ret;
}
function get_stats(){
global $mysqli;
$ret = array();
$ret["lost"]=0;
$ret["found"]=0;
$res = $mysqli->query("select hour(date) as h, day(date) as d, count(date) as c from found_items group by h, d order by d, h");
$ret["graph"] = array();
while ($res && $row = $res->fetch_assoc()) {
$ret["graph"][] = $row;
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM lost_items WHERE lost_items.del = 0 ORDER BY id ASC");
if ($res && $row = $res->fetch_assoc()) {
$ret["lost"] = $row["c"];
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM found_items WHERE found_items.del = 0 ORDER BY id ASC");
if ($res && $row = $res->fetch_assoc()) {
$ret["found"] = $row["c"];
}
$res = $mysqli->query("SELECT COUNT(*) AS c FROM matches ORDER BY id ASC");
if ($res && $row = $res->fetch_assoc()) {
$ret["match"] = $row["c"];
}
$ret["unmatched"] = $ret["found"] + $ret["lost"] - 2 * $ret["match"];
return $ret;
}
if(file_exists("currentgithash"))
$hash = file_get_contents("currentgithash");

View file

@ -6,7 +6,11 @@
* Time: 4:48 AM
*/
?>
<style>
#img-upload{
width: 100%;
}
</style>
<div class="container-fluid">
@ -27,13 +31,86 @@
A simple success alert—check it out!
</div>
<!-- Modal Edit Found Item -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="card mb-3">
<div class="card-header">
<i class="fas fa-edit"></i>
Edit Item
</div>
<div class="card-body">
<form method="POST" action="/action.php?action=edit_found" id="found_form">
<p><input type="text" readonly="true" class="form-control" placeholder="ID" name="id" id="id" value=""></p>
<p><input type="text" class="form-control" placeholder="WAS" name="was" id="was" value=""></p>
<p><input type="text" class="form-control" placeholder="WANN" name="wann" id="wann" value=""></p>
<p><input type="text" class="form-control" placeholder="WO" name="wo" id="wo" value=""></p>
<div class="form-group">
<div class="input-group">
<div class="custom-file btn-file">
<input type="file" class="custom-file-input" id="inputGroupImage" name="image" accept="image/*" capture="environment">
<label class="custom-file-label" for="inputGroupImage">Choose Image</label>
</div>
</div>
<img id='img-upload' src="/upload/"/>
</div>
<div class="form-group">
<button type="submit" data-dismiss="modal" class="btn btn-primary form-control" onclick="edit_found_item(); return false;">Save</button>
</div>
<div class="form-group">
<button type="button" class="btn btn-secondary form-control" data-dismiss="modal">Close</button>
</div>
</form>
</div>
<div class="card-footer small text-muted">Updated yesterday at 11:59 PM</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal Picture Zoom -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<img id='img-upload' src="/upload/"/>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<!-- DataTables Example -->
<div class="card mb-3">
<div class="card-header">
<i class="fas fa-table"></i>
Data Table Example</div>
<div class="card-body">
<div class="table-responsive">
<div class="table-responsive" id="found_table">
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
<thead>
<tr>
@ -60,15 +137,19 @@
foreach( get_founditems(true) as $item){
?>
<tr>
<td><?php echo $item["id"]; ?></td>
<td><?php echo $item["id"]; ?> </td>
<td><?php echo $item["was"]; ?></td>
<td><?php echo $item["wann"]; ?></td>
<td><?php echo $item["wo"]; ?></td>
<td><img style="height: 48px;" src="/upload/<?php echo $item["hash"]; ?>"></td>
<td><button style="background: url(/upload/<?php echo $item["hash"]; ?>)" ... /></td>
<!--<td><img style="height: 48px;" src="/upload/<?php echo $item["hash"]; ?>"></td>-->
<td>
<div class="btn-group" role="group">
<button type="button" class="btn btn-outline-secondary"><i class="fas fa-fw fa-check-circle"></i></button>
<a href="/found_item_edit/<?php echo $item["id"]; ?>/" type="button" class="btn btn-outline-secondary"><i class="fas fa-fw fa-edit"></i></a>
<!--<a href="/found_item_edit/<?php echo $item["id"]; ?>/" type="button" class="btn btn-outline-secondary"><i class="fas fa-fw fa-edit"></i></a>-->
<button type="button" class="btn btn-outline-secondary" data-toggle="modal" data-target="#exampleModal" onclick="fill_edit_form(<?php echo $item["id"]; ?>,'<?php echo $item["was"]; ?>','<?php echo $item["wann"]; ?>','<?php echo $item["wo"]; ?>','<?php echo $item["hash"]; ?>')">
<i class="fas fa-fw fa-edit"></i>
</button>
<button type="button" class="btn btn-outline-danger" onclick="delete_item(<?php echo $item["id"]; ?>)"><i class="fas fa-fw fa-trash-alt"></i></button>
</div>
</td>
@ -100,11 +181,30 @@
<script>
function fill_edit_form(id, was, wann, wo, hash) {
document.getElementById('id').value = id;
document.getElementById('was').value = was;
document.getElementById('wann').value = wann;
document.getElementById('wo').value = wo;
document.getElementById('img-upload').src = "/upload/"+hash;
/*document.charset = "UTF-8";
document.open("text/html");
document.write("<html>");
document.write("<head><meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"><\/head>");
document.write("<body>");
document.write(PaketL + PaketB + PaketH + Raum);
document.write("<\/body><\/html>");
document.close();*/
}
function delete_item(id){
$.post( "/ajax.php?action=delete_found_item", {id: id} ).done(function( data ) {;
$.post( "/ajax.php?action=delete_found_item", {id: id} ).done(function( data ) {
reply = JSON.parse(data);
if(reply.status == "ok"){
//TODO tabelle aktualisieren
update_found_table();
$("#alertmessage").collapse('hide');
$("#successmessage").html(reply.message).collapse('show');
}else{
@ -118,6 +218,142 @@
}
function update_found_table() {
$.get( "/ajax.php?action=get_found_table" ).done(function( data ) {
$("#found_table").html(data);
}).fail(function() {
$("#successmessage").collapse('hide');
$("#alertmessage").html("error").collapse('show');
});
}
function edit_found_item() {
var fileInput = document.querySelector('#inputGroupImage');
var xhr = new XMLHttpRequest();
xhr.open('POST', '/ajax.php?action=edit_found_item');
xhr.upload.onprogress = function (e) {
/*
* values that indicate the progression
* e.loaded
* e.total
*/
$("#alertmessage").collapse('hide');
$("#successmessage").html((100 * e.loaded / e.total) + "%").collapse('show');
console.log("progress");
console.log(e);
};
xhr.upload.onabort = function (e) {
console.log("abort");
console.log(e);
};
xhr.upload.onload = function (e) {
console.log("load");
console.log(e);
};
xhr.upload.ontimeout = function (e) {
console.log("timeout");
console.log(e);
};
xhr.upload.onerror = function (e) {
console.log("error");
console.log(e);
$("#successmessage").collapse('hide');
$("#alertmessage").html("error").collapse('show');
};
xhr.onload = function (e) {
console.log("foo load");
console.log(e);
reply = JSON.parse(xhr.responseText);
console.log(reply);
if (reply.status == "ok") {
$("#lost_form").trigger("reset");
$('#img-upload').attr('src', "");
$("#alertmessage").collapse('hide');
$("#successmessage").html(reply.message).collapse('show');
update_found_table();
} else {
$("#successmessage").collapse('hide');
$("#alertmessage").html(reply.message).collapse('show');
}
};
// upload success
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status != 200) {
reply = JSON.parse(xhr.responseText);
console.log(reply);
$("#successmessage").collapse('hide');
$("#alertmessage").html(reply.message).collapse('show');
}
} else {
console.log(xhr.readyState);
}
}
var form = new FormData(document.querySelector("#found_form"));
if(fileInput.files.length >0) {
form.append('title', fileInput.files[0].name);
form.append('image', fileInput.files[0]);
}
xhr.send(form);
}
</script>
<script>
$(document).ready( function() {
$(document).on('change', '.btn-file :file', function() {
var input = $(this),
label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
input.trigger('fileselect', [label]);
});
$('.btn-file :file').on('fileselect', function(event, label) {
var input = $(this).parents('.input-group').find(':text'),
log = label;
if( input.length ) {
input.val(log);
} else {
if( log ) alert(log);
}
});
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#img-upload').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$("#inputGroupImage").change(function(){
readURL(this);
});
});
</script>
</div>