Files
databunker/ui/site/user-data-processing.html
2020-01-04 21:05:24 +02:00

186 lines
8.8 KiB
HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Data Bunker - List of data processing requests</title>
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"></script>
<script src="site.js"></script>
</head>
<body>
<div class="container">
<div class="row col-md-12">
<div style="width:100%;">
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Menu</a>
<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="user-profile.html">Profile <span
class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="user-apps.html">Data</a>
<a class="nav-item nav-link active" href="user-data-processing.html">My Consents</a>
<a class="nav-item nav-link" href="user-audit.html">History</a>
<a class="nav-item nav-link" href="javascript:bunker_logout();">Logout</a>
</div>
</div>
</nav>
</div>
<div class="bigblock">
<h4>Consent Management</h4>
<p id="msg">Manage all your consents here. You can easily give or withdraw consent.</p>
<div id="data"></div>
</div>
</div>
</div>
<script>
var xtoken = window.localStorage.getItem('xtoken');
var token = window.localStorage.getItem('token');
var xhr = new XMLHttpRequest();
xhr.open('GET', "/v1/consent/token/" + token);
xhr.setRequestHeader("X-Bunker-Token", xtoken)
xhr.setRequestHeader('Content-type', 'application/json');
xhr.onload = function () {
if (xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
if (data.status == "ok") {
//$('#msg').text("Access xtoken value: " + xtoken + " user: " + token)
console.log(data)
var index;
for (index = 0; index < data.rows.length; ++index) {
var row = data.rows[index];
//console.log("row", row)
$('#data').append(prepareRow(row));
//fetchApp(token, xtoken, app);
}
}
} else if (xhr.status > 400 && xhr.status < 500) {
document.location = "/";
}
}
xhr.send();
function confirmWithdrawal(brief) {
var heading = "Confirm Consent Withdrawal";
var question = "Are you sure?";
var cancelButtonTxt = "Close popup";
var okButtonTxt = "Withdraw";
var confirmModal =
$('<div class="modal fade" role="dialog"><div class="modal-dialog" role="document"><div class="modal-content">' +
'<div class="modal-header">' +
'<h5 class="modal-title">' + heading + '</h5>' +
'<button type="button" class="close" data-dismiss="modal" aria-label="Close">' +
'<span aria-hidden="true">&times;</span></button>' +
'</div>' +
'<div class="modal-body">' +
'<p>' + question + '</p>' +
'</div>' +
'<div class="modal-footer">' +
'<a href="#" class="btn" data-dismiss="modal">' +
cancelButtonTxt +
'</a>' +
'<a href="#" id="okButton" class="btn btn-primary">' +
okButtonTxt +
'</a>' +
'</div>' +
'</div></div></div>');
confirmModal.find('#okButton').click(function (event) {
//callback();
cancelConsent(brief);
confirmModal.modal('hide');
});
confirmModal.modal('show');
}
function cancelConsent(brief) {
var xhr = new XMLHttpRequest();
xhr.open('DELETE', "/v1/consent/token/" + token + "/" + brief);
xhr.setRequestHeader("X-Bunker-Token", xtoken)
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function () {
if (xhr.status === 200) {
document.location.reload();
} else if (xhr.status > 400 && xhr.status < 500) {
document.location = "/";
}
}
xhr.send();
}
function acceptConsent(brief) {
var xhr = new XMLHttpRequest();
xhr.open('POST', "/v1/consent/token/" + token + "/" + brief);
xhr.setRequestHeader("X-Bunker-Token", xtoken)
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onload = function () {
if (xhr.status === 200) {
document.location.reload();
} else if (xhr.status > 400 && xhr.status < 500) {
document.location = "/";
}
}
xhr.send();
}
function prepareRow(row) {
var msg = row.brief;
if (!row.message) {
msg = row.brief;
}
var start = '<div class="row mb-3">';
var now = Math.floor(Date.now() / 1000);
var d = '<div class="col-3">Created: ' + dateFormat(row.creationtime) + '<br/>';
if (row.when != row.creationtime) {
d = d + 'Last updated: ' + dateFormat(row.when) + '<br/>';
}
if (row.starttime > now) {
d = d + 'Will start at: ' + dateFormat(row.starttime) + '</br/>';
}
if (row.endtime > now) {
d = d + 'Will expire at: ' + dateFormat(row.endtime) + '</br/>';
} else if (row.endtime > 0) {
d = d + 'Expired at: ' + dateFormat(row.endtime) + '</br/>';
}
d = d + '</div>';
var info = '<div class="col-6"><strong>Consent: ' + msg + '</strong><br/>';
info = info + '<small>Last identity: ' + row.who + ' (' + row.mode + ')</small><br/>';
info = info + '<small>Lawful basis: ' + row.lawfulbasis + ' (' + row.consentmethod + ')</small><br/>';
if (row.referencecode) {
info = info + '<small>Reference method: ' + row.referencecode + '</small><br/>';
}
if (row.freetext) {
info = info + '<small>Additional info: ' + row.freetext + '</small><br/>';
}
info = info + '</div>'
var withdraw = "<a href=\"javascript:confirmWithdrawal('" + row.brief + "');\">Withdraw</a>";
var accept = "<a href=\"javascript:acceptConsent('" + row.brief + "');\">Give</a>";
var op = withdraw;
if (row.status != 'yes') {
op = accept;
}
var status = '<div class="col-3"><center>Consent Given: ' + row.status + '</br>' + op + '</center></div>'
return start + d + info + status + '</div>';
}
</script>
</body>
</html>