more layout
This commit is contained in:
parent
f061fd3b49
commit
7313fbd58d
|
|
@ -3,8 +3,8 @@
|
|||
right: 0;
|
||||
top:0;
|
||||
width: 20rem;
|
||||
height: 100%;
|
||||
background-color: aqua;
|
||||
min-height: 100%;
|
||||
|
||||
}
|
||||
|
||||
#switch{
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
position: relative;
|
||||
top: 0;
|
||||
left: -50%;
|
||||
background-color: aqua;
|
||||
|
||||
}
|
||||
|
||||
#main{
|
||||
|
|
@ -22,5 +22,28 @@
|
|||
position: relative;
|
||||
top: 10rem;
|
||||
left: -50%;
|
||||
background-color: aqua;
|
||||
|
||||
}
|
||||
|
||||
.listIMG{
|
||||
width: 5rem;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.navi{
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
.personalInfo{
|
||||
float: right;
|
||||
width: 9rem;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
.card{
|
||||
margin-top:2rem;
|
||||
}
|
||||
.card-text{
|
||||
padding: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
|
@ -1,137 +1,70 @@
|
|||
var rootKontext = "/od1";
|
||||
//var rootKontext = "";
|
||||
var customeStyle = false;
|
||||
|
||||
function loadOD1(){
|
||||
try{
|
||||
let ksession = $.cookie("KSESSIONID");
|
||||
var xmlHttp = new XMLHttpRequest();
|
||||
xmlHttp.open( "GET", rootKontext, false );
|
||||
xmlHttp.send();
|
||||
document.getElementById("od1").innerHTML = xmlHttp.responseText;
|
||||
|
||||
$('link[title="custom"]').prop('disabled', true);
|
||||
|
||||
loadData();
|
||||
}
|
||||
catch(e){
|
||||
document.getElementById("od1").innerHTML = "Ein Fehler ist beim Laden des Dienstes aufgetreten, bitte versuchen Sie es später erneut.";
|
||||
}
|
||||
}
|
||||
|
||||
function nextTab(){
|
||||
$('#navMenu1 a').removeClass("disabled");
|
||||
$('#navMenu1 a').tab('show');
|
||||
}
|
||||
|
||||
function getJSON (url, callback) {
|
||||
let ksession = $.cookie("KSESSIONID");
|
||||
rootKontext = ""
|
||||
|
||||
function getJSON(url, callback) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', url + "?session_id=" + ksession, true);
|
||||
xhr.open('GET', url, true);
|
||||
xhr.responseType = 'json';
|
||||
xhr.onload = function() {
|
||||
var status = xhr.status;
|
||||
if (status < 400) {
|
||||
callback(null, xhr.response);
|
||||
} else {
|
||||
console.log("failed getting");
|
||||
console.log(status);
|
||||
}
|
||||
xhr.onload = function () {
|
||||
var status = xhr.status;
|
||||
if (status < 400) {
|
||||
callback(null, xhr.response);
|
||||
} else {
|
||||
console.log("failed getting");
|
||||
console.log(status);
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
};
|
||||
|
||||
function putJSON (url, data, callback) {
|
||||
let ksession = $.cookie("KSESSIONID");
|
||||
|
||||
function putJSON(url, data, callback) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('PUT', url + "?session_id=" + ksession, true);
|
||||
xhr.open('PUT', url, true);
|
||||
xhr.responseType = 'json';
|
||||
xhr.setRequestHeader('Content-Type', 'application/json');
|
||||
xhr.onload = function() {
|
||||
var status = xhr.status;
|
||||
if (status < 400) {
|
||||
callback(null, xhr.response);
|
||||
} else {
|
||||
console.log("failed posting");
|
||||
console.log(status);
|
||||
}
|
||||
xhr.onload = function () {
|
||||
var status = xhr.status;
|
||||
if (status < 400) {
|
||||
callback(null, xhr.response);
|
||||
} else {
|
||||
console.log("failed posting");
|
||||
console.log(status);
|
||||
}
|
||||
};
|
||||
xhr.send(data);
|
||||
};
|
||||
|
||||
function sendVorhaben(){
|
||||
let data = document.getElementById("form1");
|
||||
|
||||
data = {};
|
||||
data["name"] = document.getElementById("form1")["name"].value;
|
||||
data["reason"] = document.getElementById("form1")["reason"].value;
|
||||
data["note"] = document.getElementById("form1")["note"].value;
|
||||
data["partial_application_id"] = document.getElementById("form1")["partial_application_id"].value;
|
||||
|
||||
putJSON(rootKontext + "/api/v1/vorhaben/" + data["partial_application_id"], JSON.stringify(data), function(error, data){
|
||||
document.getElementById("status").innerHTML = "Daten erfolgreich erneuert";
|
||||
loadData();
|
||||
nextTab();
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function queryString(string)
|
||||
{
|
||||
let queryString = window.location.search;
|
||||
let varArray = queryString.split("&");
|
||||
for (let i=0;i<varArray.length;i++) {
|
||||
let param = varArray[i].split("=");
|
||||
if(param[0] == string ){
|
||||
return param[1]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadData(){
|
||||
let encodedID = queryString("?partialApplicationId");
|
||||
//encodedID = "d05e6d3a-1774-46a0-abb0-89abfe2ff5a3";
|
||||
getJSON(rootKontext + "/api/v1/vorhaben/" + encodedID,
|
||||
function(error, data){
|
||||
function loadData() {
|
||||
getJSON(rootKontext + "/api/v1/person/",
|
||||
function (error, data) {
|
||||
console.log(data)
|
||||
populateForm(data["data"], "form1")
|
||||
populateForm(data["data"], "form2")
|
||||
data = data["data"]
|
||||
let el = document.getElementById('list');
|
||||
data.forEach(function (item) {
|
||||
string = `
|
||||
<div class="card border-light">
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">${item["fname"]} ${item["lname"]}</h4>
|
||||
<h6 class="card-subtitle mb-2 text-muted">${item["timestamp"]}</h6>
|
||||
|
||||
<p class="card-text container">
|
||||
<img class="listImg" src="${item["face"]}"></img>
|
||||
<div class="personalInfo">
|
||||
${item["gender"]} <br>
|
||||
${item["yob"]} <br>
|
||||
${item["fingerprints"].length} <br>
|
||||
</div>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
el.innerHTML += string;
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
function populateForm(data, formId){
|
||||
console.log(data)
|
||||
inputs = document.forms[formId];
|
||||
|
||||
for(var i = 0; i < 8; i++){
|
||||
if(inputs[i] !== undefined && data[inputs[i].name] !== undefined){
|
||||
inputs[i].value = data[inputs[i].name];
|
||||
}
|
||||
else{
|
||||
console.log(inputs);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadNewStyle(){
|
||||
customeStyle = !customeStyle;
|
||||
|
||||
if(customeStyle){
|
||||
$('link[title="custom"]').prop('disabled', false);
|
||||
$('link[title="default"]').prop('disabled', true);
|
||||
|
||||
console.log("StyleSheet: Custom");
|
||||
alert("StyleSheet: Custom");
|
||||
}
|
||||
else{
|
||||
$('link[title="default"]').prop('disabled', false);
|
||||
$('link[title="custom"]').prop('disabled', true);
|
||||
|
||||
console.log("StyleSheet: Default");
|
||||
alert("StyleSheet: Default");
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -6,6 +6,7 @@
|
|||
<!--Bootstrap-->
|
||||
<!-- Latest compiled and minified CSS -->
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
|
||||
<link href="https://bootswatch.com/4/superhero/bootstrap.css" rel="stylesheet" id="bootstrap-css3">
|
||||
<link rel="stylesheet" title="default" href="/static/main.css">
|
||||
|
||||
<!-- jQuery library -->
|
||||
|
|
@ -16,6 +17,7 @@
|
|||
|
||||
<!-- Latest compiled JavaScript -->
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
|
||||
|
||||
|
|
@ -24,20 +26,32 @@
|
|||
|
||||
<body>
|
||||
|
||||
<div style="position: fixed; left: 50%;">
|
||||
<div class="container" id="switch">
|
||||
hi
|
||||
|
||||
<div style="position: fixed; left: 50%; z-index: 9999;">
|
||||
<div class="navbar navbar-expand-lg navbar-dark bg-dark" id="switch">
|
||||
<div class="btn-group btn-group-toggle" data-toggle="buttons">
|
||||
<label class="btn btn-primary active navi">
|
||||
<input type="radio" name="options" id="option1" autocomplete="off" checked=""> Identify
|
||||
</label>
|
||||
<label class="btn btn-primary navi">
|
||||
<input type="radio" name="options" id="option2" autocomplete="off"> Validate
|
||||
</label>
|
||||
<label class="btn btn-primary navi">
|
||||
<input type="radio" name="options" id="option3" autocomplete="off"> Enrole
|
||||
</label>
|
||||
<label class="btn btn-primary navi">
|
||||
<input type="radio" name="options" id="option4" autocomplete="off"> Change
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: fixed; left: 50%;">
|
||||
<div class="container" id="main">
|
||||
<div class="container bg-dark" id="main">
|
||||
|
||||
hi
|
||||
</div>
|
||||
</div>
|
||||
<div class="container" id="list">
|
||||
hi
|
||||
<div class="container bg-dark" id="list">
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue