mirror of
https://github.com/optim-enterprises-bv/databunker.git
synced 2025-12-27 18:14:50 +00:00
635 lines
25 KiB
HTML
635 lines
25 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 - admin / view user requests</title>
|
|
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/solid.min.css' rel='stylesheet' type='text/css'>
|
|
<link rel="stylesheet" href="css/bootstrap.min.css">
|
|
<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="css/bootstrap-table.min.css">
|
|
<link rel="stylesheet" href="style.css">
|
|
<script src="conf.js"></script>
|
|
<script src="site.js"></script>
|
|
<script src="js/jquery.min.js"></script>
|
|
<script src="js/bootstrap.bundle.min.js"></script>
|
|
<script src="js/bootstrap-table.min.js"></script>
|
|
|
|
<script>
|
|
var xtoken = window.localStorage.getItem('xtoken');
|
|
var legalBasisList = [];
|
|
var processingActivitiesList = [];
|
|
|
|
$(function () {
|
|
showAdminMenu();
|
|
$('#table2').bootstrapTable({
|
|
url: "/v1/lbasis",
|
|
undefinedText: 'n/a',
|
|
/* url: "data1.json", */
|
|
method: "GET",
|
|
ajaxOptions: {
|
|
headers: { "X-Bunker-Token": xtoken },
|
|
crossDomain: true
|
|
},
|
|
showExtendedPagination: true,
|
|
sidePagination: "server",
|
|
pagination: false,
|
|
search: false,
|
|
classes: "table",
|
|
onLoadSuccess: function(data, status, res) {
|
|
legalBasisList = data.rows;
|
|
},
|
|
onLoadError: function (status, res) {
|
|
if (status > 400 && status < 500) {
|
|
document.location = "/";
|
|
}
|
|
}
|
|
});
|
|
$('#table').bootstrapTable({
|
|
url: "/v1/pactivity",
|
|
undefinedText: 'n/a',
|
|
method: "GET",
|
|
ajaxOptions: {
|
|
headers: { "X-Bunker-Token": xtoken },
|
|
crossDomain: true
|
|
},
|
|
showExtendedPagination: true,
|
|
sidePagination: "server",
|
|
pagination: false,
|
|
search: false,
|
|
classes: "table",
|
|
onLoadSuccess: function(data, status, res) {
|
|
processingActivitiesList = data.rows;
|
|
},
|
|
onLoadError: function (status, res) {
|
|
if (status > 400 && status < 500) {
|
|
document.location = "/";
|
|
}
|
|
}
|
|
});
|
|
//loadLegalBasisList();
|
|
});
|
|
function loadLegalBasisList() {
|
|
var xhr0 = new XMLHttpRequest();
|
|
xhr0.open('GET', '/v1/lbasis', true);
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
var data = JSON.parse(xhr0.responseText);
|
|
legalBasisList = data.rows;
|
|
}
|
|
}
|
|
xhr0.send();
|
|
}
|
|
function getModules() {
|
|
const modules = {};
|
|
for (idx = 0; idx < legalBasisList.length; idx++) {
|
|
const row = legalBasisList[idx];
|
|
modules[row.module] = row.module;
|
|
}
|
|
modules["checkout-page"] = "checkout-page";
|
|
modules["cookie-popup"] = "cookie-popup";
|
|
modules["signup-page"] = "signup-page";
|
|
modules["login-page"] = "login-page";
|
|
modules["other"] = "other";
|
|
return modules;
|
|
}
|
|
function getModulesOptions(current) {
|
|
const modules = getModules();
|
|
var msg = "";
|
|
for (var m in modules) {
|
|
if (current === m) {
|
|
msg = msg + '<option selected>'+m+'</option>';
|
|
} else {
|
|
msg = msg + '<option>'+m+'</option>';
|
|
}
|
|
}
|
|
return msg;
|
|
}
|
|
function linkExisting(activity, briefs_str) {
|
|
var existing = {};
|
|
for (jdx = 0; jdx < processingActivitiesList.length; jdx++) {
|
|
if (processingActivitiesList[jdx].activity == activity) {
|
|
var briefs = processingActivitiesList[jdx].briefs;
|
|
if (briefs) {
|
|
for (idx = 0; idx < briefs.length; idx++) {
|
|
var b = briefs[idx];
|
|
existing[b["brief"]] = b["brief"];
|
|
}
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
var msg = '<form>';
|
|
for (idx = 0; idx < legalBasisList.length; idx++) {
|
|
const row = legalBasisList[idx];
|
|
msg += '<div class="form-check"><input type="checkbox" onclick="linkLegalBasis(this.checked,\''+activity+'\',\''+row.brief+'\');" class="form-check-input" id="cb-'+row.brief+'" ';
|
|
if (existing[row.brief]) {
|
|
msg += 'checked';
|
|
}
|
|
msg += '><label class="form-check-label" for="cb-'+row.brief+'">';
|
|
msg += row['basistype'] + " : " + row["brief"] + "<br/>\n";
|
|
msg += "Module: " + row["module"] + "<br/>\n"; msg += "Status: " + row["status"] + "<br/>\n";
|
|
msg += "Required to enable to continue? " + (row["requiredflag"] ? "yes" : "no") + "<br/>\n";
|
|
msg += "User can change by himself?" + (row["usercontrol"] ? "yes" : "no") + "<br/>\n";
|
|
msg += "Desc: " + row["shortdesc"];
|
|
msg += '</label></div>';
|
|
}
|
|
msg += "</form>";
|
|
showForm('Change '+activity, msg);
|
|
}
|
|
function linkLegalBasis(checked, activity, brief) {
|
|
var url = '/v1/pactivity/'+activity+'/'+brief;
|
|
var xhr0 = new XMLHttpRequest();
|
|
if (checked) {
|
|
xhr0.open('POST', url, true);
|
|
} else {
|
|
xhr0.open('DELETE', url, true);
|
|
}
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
$('#table').bootstrapTable('refresh');
|
|
}
|
|
}
|
|
xhr0.send();
|
|
return true;
|
|
}
|
|
function displayActivity(activity, row, index) {
|
|
return '<i class="fas fa-cogs"></i> '+activity;
|
|
}
|
|
function displayBrief(brief, row, index) {
|
|
return '<i class="fas fa-cog"></i> '+brief;
|
|
}
|
|
function displayDescription(scr, row, index) {
|
|
var msg = "Title: " + row.title + "<br/>\n";
|
|
msg = msg + "Desc: "+row.fulldesc+"</br>\n";
|
|
if (row.script) {
|
|
msg = msg + "JS script attached: yes<br/>\n";
|
|
}
|
|
if (row.applicableto) {
|
|
msg = msg + "Applicable to: "+row.applicableto+"<br/>\n";
|
|
}
|
|
return msg;
|
|
}
|
|
function displayLegalBasisDesc(scr, row, index) {
|
|
//var msg = "Type: " + row.basistype + "<br/>\n";
|
|
var msg = "";
|
|
if (row.status == "deleted") {
|
|
msg = "Status: <strong>"+row.status+"</strong></br>\n";
|
|
}
|
|
if (row.module) {
|
|
msg = msg + "Module: "+row.module+"</br>\n";
|
|
}
|
|
if (row.requireflag) {
|
|
msg = msg + "Required: yes<br/>\n";
|
|
}
|
|
if (row.usercontrol) {
|
|
msg = msg + "User can change: yes<br/>\n";
|
|
}
|
|
msg = msg + "Desc: "+row.fulldesc+"</br>\n";
|
|
return msg;
|
|
}
|
|
function displayLegalBasis(briefs, row, index) {
|
|
var msg = "";
|
|
if (row.briefs) {
|
|
for (idx = 0; idx < briefs.length; idx++) {
|
|
b = briefs[idx];
|
|
msg = msg + b["basistype"]+":"+b["brief"] + "<br/>\n";
|
|
}
|
|
}
|
|
//console.log(row);
|
|
msg = msg + "<i class='fas fa-arrow-right'></i> <a href='javascript:linkExisting(\""+row.activity+"\",\""+row.legalbasis+"\");'>link existing</a><br/>\n";
|
|
msg = msg + "<i class='fas fa-arrow-right'></i> <a href='#'>create new</a><br/>\n";
|
|
return msg;
|
|
}
|
|
function displayProcessingActions(scr, row, index) {
|
|
var links = "";
|
|
links = '<a href=\'javascript:deleteProcessingActivity(\"' + row.activity + '\");\'>delete</a> | ';
|
|
links = links + '<a href=\'javascript:editProcessingActivity(\"' + row.activity + '\");\'>edit</a>';
|
|
return links;
|
|
}
|
|
function displayLegalBasisActions(brief, row, index) {
|
|
var links = "";
|
|
if (row.status !== "deleted") {
|
|
links = '<a href=\'javascript:deleteLegalBasis(\"' + brief + '\");\'>delete</a> | ';
|
|
}
|
|
links = links + '<a href=\'javascript:editLegalBasis(\"' + brief + '\");\'>edit</a>';
|
|
return links;
|
|
}
|
|
function deleteProcessingActivity(activity) {
|
|
var heading = "Confirm processing operation deletion";
|
|
var question = "Are you sure want to delete "+activity+"?";
|
|
var cancelButtonTxt = "Close popup";
|
|
var okButtonTxt = "Remove processing operation";
|
|
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">×</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-warning">' +
|
|
okButtonTxt +
|
|
'</a>' +
|
|
'</div>' +
|
|
'</div></div></div>');
|
|
confirmModal.find('#okButton').click(function (event) {
|
|
//callback();
|
|
deleteProcessingActivityDo(activity);
|
|
confirmModal.modal('hide');
|
|
});
|
|
confirmModal.modal('show');
|
|
}
|
|
function deleteProcessingActivityDo(activity) {
|
|
var xhr0 = new XMLHttpRequest();
|
|
xhr0.open('DELETE', '/v1/pactivity/'+activity, true);
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
$('#table').bootstrapTable('refresh');
|
|
}
|
|
}
|
|
xhr0.send();
|
|
return true;
|
|
}
|
|
function deleteLegalBasis(brief) {
|
|
var heading = "Confirm legal basis deletion";
|
|
var question = "Are you sure want to delete "+brief+"?";
|
|
var cancelButtonTxt = "Close popup";
|
|
var okButtonTxt = "Remove legal basis";
|
|
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">×</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-warning">' +
|
|
okButtonTxt +
|
|
'</a>' +
|
|
'</div>' +
|
|
'</div></div></div>');
|
|
confirmModal.find('#okButton').click(function (event) {
|
|
//callback();
|
|
deleteLegalBasisDo(brief);
|
|
confirmModal.modal('hide');
|
|
});
|
|
confirmModal.modal('show');
|
|
}
|
|
function deleteLegalBasisDo(brief) {
|
|
var xhr0 = new XMLHttpRequest();
|
|
xhr0.open('DELETE', '/v1/lbasis/'+brief, true);
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
$('#table2').bootstrapTable('refresh');
|
|
$('#table').bootstrapTable('refresh');
|
|
}
|
|
}
|
|
xhr0.send();
|
|
return true;
|
|
}
|
|
function editProcessingActivity(activity) {
|
|
var title0 = "Create new Processing Operation";
|
|
if (activity) {
|
|
title0 = "Change Processing Operation";
|
|
}
|
|
var applicableto = "";
|
|
var fulldesc = "";
|
|
var title = "";
|
|
var code = "";
|
|
if (activity) {
|
|
for (jdx = 0; jdx < processingActivitiesList.length; jdx++) {
|
|
if (processingActivitiesList[jdx].activity === activity) {
|
|
applicableto = processingActivitiesList[jdx].applicableto;
|
|
fulldesc = processingActivitiesList[jdx].fulldesc;
|
|
title = processingActivitiesList[jdx].title;
|
|
code = processingActivitiesList[jdx].script;
|
|
break;
|
|
}
|
|
}
|
|
} else {
|
|
activity = "";
|
|
}
|
|
var form = `<form>
|
|
<div class="form-group row">
|
|
<label for="shortdesc" class="col-sm-3 col-form-label">Operation Unique Identifier <strong>*</strong></label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="activity" aria-describedby="activityHelp" placeholder="Enter unique identifier" value="`+activity+`">
|
|
<small id="activityHelp" class="form-text text-muted">Supported: a-z, 0-9, '-' chars. Start with a-z. Max 64 chars.</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="title" class="col-sm-3 col-form-label">Title</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="title" placeholder="Processing operation title" value="`+title+`">
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="applicableto" class="col-sm-3 col-form-label">Applicable to</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="applicableto" placeholder="This activity is relevant for (ex. customers)" value="`+applicableto+`">
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="fulldesc" class="col-sm-3 col-form-label0">Full desciption</label>
|
|
<div class="col-sm-9">
|
|
<textarea class="form-control" id="fulldesc" rows="2">`+fulldesc+`</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="code" class="col-sm-3 col-form-label">JS script</label>
|
|
<div class="col-sm-9">
|
|
<textarea class="form-control" id="code" rows="2">`+code+`</textarea>
|
|
<small id="scriptHelp" class="form-text text-muted">Enter JavaScript code to include on your site in case the user gave his consent. Can be used for example for Google Analytics code, etc...</small>
|
|
</div>
|
|
</div>
|
|
</form>`;
|
|
var btn = `<button type="submit" class="btn btn-primary" id="submitButton">Submit</button>`;
|
|
var modal = showForm(title0, form, btn);
|
|
modal.find('#submitButton').click(function (event) {
|
|
var newActivity = modal.find('#activity').val();
|
|
if (!newActivity){
|
|
alert("Processing Operation Unique Identifier can not be empty");
|
|
return;
|
|
}
|
|
var msg = {};
|
|
msg["applicableto"] = modal.find('#applicableto').val();
|
|
msg["fulldesc"] = modal.find('#fulldesc').val();
|
|
msg["title"] = modal.find('#title').val();
|
|
msg["script"] = modal.find('#code').val();
|
|
if (!activity) {
|
|
activity = newActivity
|
|
} else {
|
|
msg["activity"] = newActivity;
|
|
}
|
|
var xhr0 = new XMLHttpRequest();
|
|
xhr0.open('POST', '/v1/pactivity/'+activity, true);
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
$('#table').bootstrapTable('refresh');
|
|
}
|
|
}
|
|
xhr0.send(JSON.stringify(msg));
|
|
modal.modal('hide');
|
|
});
|
|
}
|
|
function editLegalBasis(brief) {
|
|
var title = "Create new Legal Basis record";
|
|
if (brief) {
|
|
title = "Change Legal Basis record";
|
|
} else {
|
|
brief = "";
|
|
}
|
|
var module = "";
|
|
var fulldesc = "";
|
|
var shortdesc = "";
|
|
var basistype = "";
|
|
var requiredmsg = "";
|
|
var usercontrol = false;
|
|
var requiredflag = false;
|
|
for (idx = 0; idx < legalBasisList.length; idx++) {
|
|
const row = legalBasisList[idx];
|
|
if (row.brief === brief) {
|
|
module = row.module;
|
|
fulldesc = row.fulldesc;
|
|
shortdesc = row.shortdesc;
|
|
basistype = row.basistype;
|
|
requiredmsg = row.requiredmsg;
|
|
usercontrol = row.usercontrol;
|
|
requiredflag = row.requiredflag;
|
|
}
|
|
}
|
|
const options = getModulesOptions(module);
|
|
var form = `<form>
|
|
<div class="form-group row">
|
|
<label for="shortdesc" class="col-sm-3 col-form-label">Brief Unique Identifier</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="brief" aria-describedby="briefHelp" placeholder="Enter unique identifier" value="`+brief+`">
|
|
<small id="briefHelp" class="form-text text-muted">Supported: a-z, 0-9, '-' chars. Start with a-z. Max 64 chars.</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="shortdesc" class="col-sm-3 col-form-label">Short description</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="shortdesc" placeholder="Enter short description" value="`+shortdesc+`">
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="exampleFormControlTextarea1" class="col-sm-3 col-form-label">Full desciption</label>
|
|
<div class="col-sm-9">
|
|
<textarea class="form-control" id="fulldesc" rows="2">`+fulldesc+`</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="exampleFormControlSelect1" class="col-sm-3 col-form-label">Legal ground type</label>
|
|
<div class="col-sm-9">
|
|
<select class="form-control" id="basistype">
|
|
<option>consent</option>
|
|
<option>contract</option>
|
|
<option>legal-requirement</option>
|
|
<option>legitimate-interest</option>
|
|
<option>vital-interest</option>
|
|
<option>public-interest</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="selectModule" class="col-sm-3 col-form-label">Show on Page/Module</label>
|
|
<div class="col-sm-9">
|
|
<select class="form-control" id="selectModule">`+options+`
|
|
</select>
|
|
<input style="display:none;margin-top:10px;" type="text" class="form-control" id="other" placeholder="Enter value">
|
|
</div>
|
|
</div>
|
|
<div class="form-check">
|
|
<input type="checkbox" class="form-check-input" id="usercontrol">
|
|
<label class="form-check-label" for="usercontrol">User can withdraw this consent/contract without Admin/DPO approval.</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input type="checkbox" class="form-check-input" id="requiredflag">
|
|
<label class="form-check-label" for="requiredflag">Required checkbox. Your user needs to approve this consent/contract when asked to get your service or product.</label>
|
|
</div>
|
|
<div class="form-group row" id="requiredForm">
|
|
<label for="requiredmsg" class="col-sm-3 col-form-label">Why it is required?</label>
|
|
<div class="col-sm-9">
|
|
<input type="text" class="form-control" id="requiredmsg" placeholder="Enter custom explanation message why it is required" value="`+requiredmsg+`">
|
|
</div>
|
|
</div>
|
|
</form>`;
|
|
var btn = `<button type="submit" class="btn btn-primary" id="submitButton">Submit</button>`;
|
|
var modal = showForm(title, form, btn);
|
|
// setup current values
|
|
modal.find('#usercontrol').prop( "checked", usercontrol );
|
|
modal.find('#requiredflag').prop( "checked", requiredflag );
|
|
if (requiredflag) {
|
|
modal.find('#requiredForm').show();
|
|
} else {
|
|
modal.find('#requiredForm').hide();
|
|
}
|
|
if (basistype) {
|
|
modal.find('#basistype').val(basistype);
|
|
} else {
|
|
modal.find('#basistype').val("consent");
|
|
}
|
|
// callbacks
|
|
modal.find('#selectModule').change(function (event) {
|
|
const current = $( this ).val();
|
|
if (current === "other") {
|
|
modal.find('#other').show();
|
|
} else {
|
|
modal.find('#other').hide();
|
|
}
|
|
});
|
|
modal.find('#requiredflag').change(function (event) {
|
|
if(this.checked) {
|
|
modal.find('#requiredForm').show();
|
|
} else {
|
|
modal.find('#requiredForm').hide();
|
|
}
|
|
});
|
|
modal.find('#submitButton').click(function (event) {
|
|
var newBrief = modal.find('#brief').val();
|
|
if (!newBrief){
|
|
alert("Brief Unique Identifier can not be empty");
|
|
return;
|
|
}
|
|
const msg = {};
|
|
msg["requiredflag"] = modal.find('#requiredflag').prop("checked");
|
|
if (msg["requiredflag"]) {
|
|
msg["requiredmsg"] = modal.find('#requiredmsg').val();
|
|
}
|
|
msg["usercontrol"] = modal.find('#usercontrol').prop("checked");
|
|
msg["module"] = modal.find('#selectModule').val();
|
|
msg["basistype"] = modal.find('#basistype').val();
|
|
msg["shortdesc"] = modal.find('#shortdesc').val();
|
|
msg["fulldesc"] = modal.find('#fulldesc').val();
|
|
if (msg["module"] === "other") {
|
|
msg["module"] = modal.find('#other').val();
|
|
}
|
|
if (!brief) {
|
|
brief = newBrief
|
|
} else {
|
|
msg["brief"] = newBrief;
|
|
}
|
|
var xhr0 = new XMLHttpRequest();
|
|
xhr0.open('POST', '/v1/lbasis/'+brief, true);
|
|
xhr0.setRequestHeader("X-Bunker-Token", xtoken)
|
|
xhr0.setRequestHeader('Content-type', 'application/json');
|
|
xhr0.onload = function () {
|
|
if (xhr0.status === 200) {
|
|
$('#table2').bootstrapTable('refresh');
|
|
$('#table').bootstrapTable('refresh');
|
|
}
|
|
}
|
|
xhr0.send(JSON.stringify(msg));
|
|
modal.modal('hide');
|
|
});
|
|
}
|
|
</script>
|
|
<style>
|
|
.bootstrap-table .fixed-table-body table.table tbody tr td {
|
|
vertical-align:top;
|
|
}
|
|
h4 {display:inline-block; }
|
|
.bigblock a.btn {margin-top:-4px;}
|
|
</style>
|
|
</head>
|
|
|
|
|
|
<body>
|
|
<div class="container">
|
|
<div class="row col-md-12">
|
|
<div style="width:100%;">
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-secondary">
|
|
<a class="navbar-brand" href="#">Admin</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">
|
|
<ul id="admin-menu" class="navbar-nav">
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
<div class="bigblock">
|
|
<h4>Personal Data Processing Operations</h4>
|
|
<a class="btn btn-secondary" data-toggle="collapse" href="#processingInfo" role="button" aria-expanded="false" aria-controls="collapseExample">What is it?</a>
|
|
<a class="btn btn-primary" href="javascript:editProcessingActivity();" role="button" aria-expanded="false" aria-controls="collapseExample">Create New</a>
|
|
<div class="collapse" id="processingInfo">
|
|
<p><strong>Processing</strong> is GDPR means any operation or set of operations which is performed on personal data or on sets of personal data,
|
|
whether or not by automated means, such as collection, recording, organisation, structuring, storage, adaptation or alteration,
|
|
retrieval, consultation, use, disclosure by transmission, dissemination or otherwise making available, alignment or combination,
|
|
restriction, erasure or destruction.</p>
|
|
<p>Under GDPR, organizations must process personal data <strong>lawfully, fairly, and transparently</strong>. To comply this principle,
|
|
Chapter 6 of the GDPR requires any organization <strong>processing personal data</strong> to have a valid <strong>legal basis</strong> for that personal data
|
|
processing operation. For example <strong>Consent</strong> is one of the six allowed methods.</p>
|
|
</div>
|
|
<table id="table" class="table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col-4" class="w-25" data-field="activity" data-formatter="displayActivity">Processing operation</th>
|
|
<th scope="col-3" class="w-25" data-field="briefs" data-formatter="displayLegalBasis">Legal basis</th>
|
|
<th scope="col-3" class="w-25" data-field="fulldesc" data-formatter="displayDescription">Description</th>
|
|
<th scope="col-2" data-field="rtoken" data-formatter="displayProcessingActions">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
</table>
|
|
<h4>Legal Basis Configuration</h4>
|
|
<a class="btn btn-secondary" data-toggle="collapse" href="#legalbasisInfo" role="button" aria-expanded="false" aria-controls="collapseExample">What is it?</a>
|
|
<a class="btn btn-primary" href="javascript:editLegalBasis();" role="button" aria-expanded="false" aria-controls="collapseExample">Create New</a>
|
|
<div class="collapse" id="legalbasisInfo">
|
|
<p>The <strong>legal basis</strong> is the foundation for data processing under the GDPR. It means that if an organisation wants
|
|
to process personal data, there is a need to identify specific legal grounds for the processing. There are six options:<p>
|
|
<ol>
|
|
<li><strong>Consent</strong> - like in cookie consent. In GDPR Article 4(11) consent is defined as : any freely given, specific,
|
|
informed and unambiguous indication of the data subject's wishes by which he or she, by a statement or by a clear affirmative action,
|
|
signifies agreement to the processing of personal data relating to him or her.</li>
|
|
<li><strong>Contract</strong> - in case you use contract with you customers.</li>
|
|
<li><strong>Legitimate Interest</strong> - for example use of personal data for fraud detection.</li>
|
|
<li><strong>Vital Interest</strong> - for example in emergency medical care situations.</li>
|
|
<li><strong>Legal Requirements</strong> - for example comlianace with money anti-laundering laws, taxes, etc...</li>
|
|
<li><strong>Public Interest</strong> - processing required for public interest.</li>
|
|
</ol>
|
|
</div>
|
|
<table id="table2" class="table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col-4" class="w-25" data-field="brief" data-formatter="displayBrief">Legal Basis Brief</th>
|
|
<th scope="col-3" class="w-25" data-field="basistype">Type</th>
|
|
<th scope="col-3" class="w-25" data-field="fulldesc" data-formatter="displayLegalBasisDesc">Description</th>
|
|
<th scope="col-2" data-field="brief" data-formatter="displayLegalBasisActions">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|