hopfma/om
4
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

adding/ loading of bookmarks implemented (only for fixed User)

Browse Source
This commit is contained in:
mandutzse68104
2019-07-22 23:01:01 +02:00
parent 9eaf71ec3d
commit a6dd34cf81
5 changed files with 302 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/routes/auth.js
+2
View File
@@ -5,6 +5,8 @@ function clearAuthState() {
auth.mail = ''; // Full mail address
auth.roles = {}; // Role authorizations e.g. {user: true}
auth.gender = ''; // Gender (e.g. Frau)
auth.bookmarks = []; // Ids of bookmarks
auth.abos = []; // Abos
}
clearAuthState();
public/routes/bookmark.js
+49 -101
View File
@@ -1,120 +1,68 @@
const BookmarkRouter = {
template: `
<div class="content">
<div class="is-hidden-desktop">
<div class="bookmark-headline"><h4>Gepeicherte Beiträge</h4></div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 1
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 2
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 3
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
<div id="om-msg-cards" class="is-hidden-desktop">
<MsgCard
v-for="id in msgDisplay"
:key="id"
:msg="messages[id] || {}"
></MsgCard>
</div>
<div class="column is-three-quarters is-pulled-right is-hidden-touch content-desktop">
<div class="bookmark-headline"><h4>Gepeicherte Beiträge</h4></div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 1
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 2
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
<div class="om-card card">
<h6 class="msg-head">
<b>Betreff</b>
<img src="favicon.ico" width=20px height=20px>
</h6>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. <br><br>
<a href="#">#beispiel #tag</a>
<div class="om-card-footer">
<div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von User 3
</div>
<i class="material-icons" @click="myFilter" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter" v-else="isActive">bookmark</i>
</div>
</div>
</div>
</div>`,
data: function () {
return {
messagelist: _messagelist,
messages: _messages,
isActive: false,
isActive: true,
messageId: '',
}
},
computed:{
msgDisplay: function(){
return (this.messagelist.slice().reverse());
}
},
methods: {
myFilter () {
myFilter: function() {
this.isActive = !this.isActive;
},
getMessageId: function(){
},
getMessages: function(){
var _usrid = "5d360f06b8f3ce67d12ccc92";
$.ajax({
url: "api/usr/id/" + _usrid,
method: "GET"
})
.done(have_result).fail(have_error);
function have_result(res) {
var str = JSON.stringify(res[0].bookmarks).split(",");
_messagelist.splice(0, _messagelist.length);
for (var e in str) {
if (!_messages[str[e]]) {
str[e] =str[e].replace(/\[/g, '').replace(/\"/g, '').replace(/\]/g, '')
get_insert_message(str[e]);
}
}
_messagelist.push.apply(_messagelist, str);
//console.log("bookmark str: "+str);
}
function have_error(err) {
console.log("error: " + err.responseText);
console.log(err);
}
}
},
mounted: function (){
this.getMessages();
}
};
public/routes/msgCard.js
+29 -3
View File
@@ -2,6 +2,7 @@ Vue.component('MsgCard', {
template: `<div class="om-card card">
<h6 class="msg-head">
<b>{{ msg.subject }}</b>
<div id="msgid">{{msg._id}}</div>
<img src="favicon.ico" width=20px height=20px>
</h6>
{{ msg.message }}<br>
@@ -11,8 +12,8 @@ Vue.component('MsgCard', {
<div class="om-card-footer"> <div class="om-user-line">
<i class="material-icons">account_circle</i>
Erstellt von {{ msg.user }}</div>
<i class="material-icons" @click="myFilter()" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter()" v-else="isActive">bookmark</i>
<i class="material-icons" @click="myFilter(msg._id)" v-if="!isActive">bookmark_border</i>
<i class="material-icons" @click="myFilter(msg._id)" v-else="isActive">bookmark</i>
</div></div>`,
props: ['msg'],
@@ -23,8 +24,33 @@ Vue.component('MsgCard', {
},
methods: {
myFilter: function() {
myFilter: function(_messageid) {
//var _messageid = $("#msgid").text();
var _bookmark = auth.bookmarks;
_bookmark.push(_messageid);
console.log("msgid"+_bookmark);
var _userid = "5d360f06b8f3ce67d12ccc92";
this.isActive = !this.isActive;
if(this.isActive){
$.ajax({
url: "api/usr",
data: {
userid: _userid,
bookmark: _bookmark
},
method: "PUT"
}).done(have_result).fail(have_error);
function have_result(res) {
console.log(res);
}
function have_error(err) {
console.log("error: " + err.responseText);
console.log(err);
}
}
},
filterForTag: function(tag) {
console.log("link: " +tag);