dergeorg/SmartShopper
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

noch nicht alles ausgegeben style fehlt teils

Browse Source 
So ziemlich alle routes bis auf item add und noch nicht alle detail ausgaben ....
This commit is contained in:
InesSuess
2018-12-03 21:06:36 +01:00
parent 9e28c0fa32
commit a2bb9f25d3
3 changed files with 241 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
express-server/public/javascripts/ajax.js
View File

@ -1,7 +1,36 @@
$(document).ready(function() {
bekommen();
// loeschen();
eigeneEinkaufslisten();
geteilteEinkaufslisten();
$(".detailcardausgabe").hide();
$(".gruppenadd").click(function(){
// let name = $("#groupname").val();
// let color = $("#groupfarbe").val();
$.ajax({
type: "POST",
url: "/group",
data: {
sl_id: globaleAddZwischenID,
name: $("#groupname").val(),
color: $("#groupfarbe").val()
},
success(res){
console.log("groupadd funktioniert");
$("#mySmallModalLabel").modal("hide");
},
error(err){
console.log("error");
}
});
});
$(".sl_add").click(function(){
$('#EigeneListeAdd').modal('show');
});
$(".add").click(function(){
@ -17,16 +46,7 @@ $(document).ready(function() {
},
success(res){
console.log("add funktioniert");
$("#mySmallModalLabel").modal("hide");
// $(".listen-ausgabe").append(`<div class="col-md-12 karten">
// <div class="card border-light mb-3" style="max-width: 18rem;">
// <div class="card-header"><span>Username...</span><button class="btn trash r"><i class="far fa-trash-alt"></i></button></div>
// <div class="card-body">
// <h5 class="card-title">`+ $("#einkaufslistenname").val() +`</h5>
// <p class="card-text">`+ $("#einkaufslistenbeschreibung").val() +`</p>
// </div>
// </div></div>`
// )
$("#normalAdd").modal("hide");
},
error(err){
console.log("error");
@ -37,33 +57,68 @@ $(document).ready(function() {
});
function bekommen(){
var globaleAddZwischenID = "";
// var globaleGetZwischenID = "";
function eigeneEinkaufslisten(){
$.ajax({
type: "GET",
url: "/myshoppinglists",
success(data){
console.log("get funktioniert");
for(let i = 0; i < data.length; i++){
const el = data[i];
success(res){
$(".listen-ausgabe").append(`<div class="col-md-12 karten">
<div class="card border-light mb-3" style="max-width: 18rem;" id="${el.sl_id}">
<div class="card-header"><span>Username...</span><button class="btn trash r"><i class="far fa-trash-alt"></i></button></div>
<div class="card-body">
<h5 class="card-title">${el.name}</h5>
<p class="card-text">${el.description}</p>
</div>
</div></div>`
)
}
loeschen();
$.ajax({
type: "GET",
url: "/userinfo_json",
success(data){
let userinfo = data.profile.displayName
console.log(userinfo);
for(let i = 0; i < res.length; i++){
const el = res[i];
$(".listen-ausgabe").append(`<div class="col-md-12 karten">
<div class="card border-light mb-3" style="max-width: 18rem;" id="${el.sl_id}">
<div class="card-header">
<span>${userinfo}</span>
<button class="btn edit"><i class="fas fa-angle-down"></i></button>
<button class="btn trash"><i class="far fa-trash-alt"></i></button>
<button class="btn groupadd" data-toggle="modal" data-target=".ListenDetailAdd"><i class="fas fa-ellipsis-v"></i></button>
</div>
<div class="card-body">
<h5 class="card-title">${el.name}</h5>
<p class="card-text">${el.description}</p>
</div>
</div></div>`
)
}
console.log("Eigene Einkaufslisten");
loeschen();
lala();
Detail();
// groupHinzufügen()
}
})
},
error(err){
console.log("error");
}
});
}
};
function geteilteEinkaufslisten(){
$.ajax({
data: "GET",
url: "/sharedshoppinglists",
success(res){
console.log("Geteilte Einkaufslisten");
},
error(err){
console.log("error");
}
});
};
function loeschen(){
$(".trash").click(function(){
@ -80,13 +135,80 @@ function loeschen(){
sl_id: id},
success(res){
console.log("card gelöscht");
// bekommen();
card.remove();
},
error(err){
console.log("error");
}
});
});
};
function lala(){
$(".groupadd").click(function(){
let card = $(this).closest(".card");
let id = card.attr("id");
globaleAddZwischenID = id;
});
}
function Detail(){
$(".edit").click(function(){
$(".cardausgabe").hide();
$(".detailcardausgabe").show();
let card = $(this).closest(".card");
let id = card.attr("id");
$.ajax({
data: "GET",
url: "/shoppinglist_json/" + id,
success(res){
$.ajax({
type: "GET",
url: "/myshoppinglists",
success(result){
$.ajax({
type: "GET",
url: "/userinfo_json",
success(data){
let userinfo = data.profile.displayName
console.log(userinfo);
const neu = result.filter(obj => obj.sl_id === id);
$(".card-header").append(`<h1 class="text-center">${neu[0].name}</h1><button class="btn itemadd"><ion-icon name="more" size="large"></ion-icon></button>
`);
for (let i = 0; i < res.length; i++) {
const el = res[i];
$(".card-text").append(`<div class="card border-dark mb-3 items" id="${el.group_id}" style="max-width: 18rem;">
<div class="card-body text-dark">
<h5 class="card-title text-center">${el.name}</h5>
</div>
</div>`);
}
ItemAdden()
}
})
},
error(err){
console.log("error");
}
});
},
error(err){
console.log("error");
}
});
});
};
function ItemAdden(){
$(".itemadd").click(function(){
alert("aleert");
});
}

27
express-server/public/stylesheets/style.css
View File

@ -22,6 +22,31 @@
.trash{
background: transparent;
position:absolute;
right:5px;
right: 29px;
margin-top:-7px;
}
.edit{
background: transparent;
position: absolute;
right: 60px;
margin-top:-7px;
}
.groupadd{
background: transparent;
position: absolute;
right:5px;
margin-top: -7px;
}
.ueberschrift{
font-size: 25px;
}
.itemadd{
background: transparent;
position: absolute;
right:5px;
margin-top: -50px;
}