sebclem/hassio-nextcloud-backup
1
0
Fork 0
mirror of https://github.com/Sebclem/hassio-nextcloud-backup.git synced 2024-11-29 04:14:53 +01:00
Code Issues Projects Releases Wiki Activity

🔨 Add mark all read to message

Browse Source
This commit is contained in:
SebClem 2024-02-19 10:52:37 +01:00
parent 86f4a6faa4
commit 0772d909f7
Signed by: sebclem
GPG Key ID: 5A4308F6A359EA50
4 changed files with 105 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
nextcloud_backup/backend/src/routes/messages.ts
View File

@ -3,11 +3,11 @@ import messageManager from "../tools/messageManager.js";
const messageRouter = express.Router();
messageRouter.get('/', (req, res, next)=>{
res.json(messageManager.get())
messageRouter.get("/", (req, res) => {
res.json(messageManager.get());
});
messageRouter.patch('/:messageId/readed', (req, res, next)=>{
messageRouter.patch("/:messageId/readed", (req, res) => {
if (messageManager.markReaded(req.params.messageId)) {
res.json(messageManager.get());
} else {
@ -15,4 +15,9 @@ messageRouter.patch('/:messageId/readed', (req, res, next)=>{
}
});
messageRouter.post("/allReaded", (req, res) => {
messageManager.markAllReaded();
res.json(messageManager.get());
});
export default messageRouter;

21
nextcloud_backup/backend/src/tools/messageManager.ts
View File

@ -7,14 +7,19 @@ const maxMessageLength = 255;
class MessageManager {
private messages: Message[] = [];
public addMessage(type: MessageType, message: string, detail?: string, isImportant = false) {
this.messages.push({
public addMessage(
type: MessageType,
message: string,
detail?: string,
isImportant = false
) {
this.messages.unshift({
id: randomUUID(),
message: message,
type: type,
time: DateTime.now(),
viewed: !isImportant,
detail: detail
detail: detail,
});
if (this.messages.length > maxMessageLength) {
this.messages.shift();
@ -42,19 +47,23 @@ class MessageManager {
}
public getById(id: string) {
return this.messages.find(value=>value.id == id);
return this.messages.find((value) => value.id == id);
}
public markReaded(id: string) {
const index = this.messages.findIndex(value=>value.id == id);
const index = this.messages.findIndex((value) => value.id == id);
if (index == -1) {
return false;
}
this.messages[index].viewed = true;
return true;
}
public markAllReaded() {
this.messages.forEach((value: Message) => {
value.viewed = true;
});
}
}
const messageManager = new MessageManager();
export default messageManager;

50
nextcloud_backup/frontend/src/components/MessageBar.vue
View File

@ -1,47 +1,51 @@
<template>
<v-menu activator="#message-btn" :close-on-content-click="false">
<v-sheet width="500" border rounded>
<v-toolbar color="surface" density="compact">
<div class="d-flex justify-center w-100">
<h4>Messages</h4>
</div>
<v-toolbar color="surface" density="comfortable" border>
<v-toolbar-title>Messages</v-toolbar-title>
<v-spacer></v-spacer>
<v-btn icon @click="markAllReaded">
<v-icon color="success">mdi-check-all</v-icon>
</v-btn>
</v-toolbar>
<v-divider></v-divider>
<v-responsive max-height="350px" class="overflow-y-auto">
<v-list class="py-0">
<template v-for="(item, index) in messages" :key="item.id">
<v-data-iterator :items="messages" item-value="id" items-per-page="-1">
<template v-slot:default="{ items, isExpanded, toggleExpand}">
<template v-for="(item, index) in items" :key="item.raw.id">
<v-divider v-if="index != 0"></v-divider>
<v-list-item :class="{ 'bg-brown-darken-4': !item.viewed }">
<v-list-item :class="{ 'bg-brown-darken-4': !item.raw.viewed }">
<v-list-item-title>
{{ item.message }}
{{ item.raw.message }}
</v-list-item-title>
<template v-slot:prepend>
<v-icon
:icon="getMessageIcon(item.type)"
:color="getMessageColor(item.type)"
:icon="getMessageIcon(item.raw.type)"
:color="getMessageColor(item.raw.type)"
class="mr-3"
></v-icon>
</template>
<template v-slot:append>
<v-btn
v-if="item.detail"
v-if="item.raw.detail"
variant="text"
icon
color="secondary"
@click="show[index] = show[index] ? false : true"
@click="toggleExpand(item)"
size="small"
>
<v-icon>
{{ show[index] ? "mdi-chevron-up" : "mdi-information" }}
{{ isExpanded(item) ? "mdi-chevron-up" : "mdi-information" }}
</v-icon>
</v-btn>
<v-scroll-x-transition>
<v-btn
color="success"
variant="text"
@click="markReaded(item.id)"
@click="markReaded(item.raw.id)"
icon
v-show="!item.viewed"
v-show="!item.raw.viewed"
size="small"
>
<v-icon>mdi-check</v-icon>
@ -49,21 +53,24 @@
</v-scroll-x-transition>
<div class="text-caption text-disabled ml-1">
{{ getTimeDelta(item.time) }}
{{ getTimeDelta(item.raw.time) }}
</div>
</template>
</v-list-item>
<v-expand-transition v-if="item.detail">
<div v-show="show[index]">
<v-expand-transition v-if="item.raw.detail">
<div v-if="isExpanded(item)">
<v-divider class="mx-3"></v-divider>
<v-card class="mx-3 my-2" variant="outlined" color="secondary">
<v-card-text>
{{ item.detail }}
{{ item.raw.detail }}
</v-card-text>
</v-card>
</div>
</v-expand-transition>
</template>
</template>
</v-data-iterator>
</v-list>
</v-responsive>
</v-sheet>
@ -153,8 +160,13 @@ function markReaded(id: string) {
});
}
function markAllReaded(){
messageService.markAllRead().then((value) => {
messages.value = value;
})
}
onBeforeUnmount(() => {
clearInterval(interval);
});
</script>
@/store/message

4
nextcloud_backup/frontend/src/services/messageService.ts
View File

@ -8,3 +8,7 @@ export function getMessages() {
export function markRead(id: string) {
return kyClient.patch(`messages/${encodeURI(id)}/readed`).json<Message[]>();
}
export function markAllRead(){
return kyClient.post(`messages/allReaded`).json<Message[]>();
}