]>
Commit | Line | Data |
---|---|---|
b1de1f9e | 1 | <template> |
b4a2db6e BW |
2 | <Generic :item="item"> |
3 | <template #indicator> | |
4 | <div class="notifs"> | |
5 | <strong | |
6 | v-if="config !== null && config.system.news.unread > 0" | |
7 | class="notif news" | |
8 | title="News" | |
9 | >{{ config.system.news.unread }}</strong | |
10 | > | |
11 | <strong | |
12 | v-if="config !== null && config.main.logs.numWarnings > 0" | |
13 | class="notif warnings" | |
14 | title="Warning" | |
15 | >{{ config.main.logs.numWarnings }}</strong | |
16 | > | |
17 | <strong | |
18 | v-if="config !== null && config.main.logs.numErrors > 0" | |
19 | class="notif errors" | |
20 | title="Error" | |
21 | >{{ config.main.logs.numErrors }}</strong | |
22 | > | |
23 | <strong | |
24 | v-if="serverError" | |
25 | class="notif errors" | |
26 | title="Connection error to Medusa API, check url and apikey in config.yml" | |
27 | >?</strong | |
28 | > | |
29 | </div> | |
30 | </template> | |
31 | </Generic> | |
b1de1f9e | 32 | </template> |
33 | ||
34 | <script> | |
b4a2db6e BW |
35 | import service from "@/mixins/service.js"; |
36 | import Generic from "./Generic.vue"; | |
37 | ||
b1de1f9e | 38 | export default { |
39 | name: "Medusa", | |
b4a2db6e | 40 | mixins: [service], |
b1de1f9e | 41 | props: { |
42 | item: Object, | |
43 | }, | |
b4a2db6e BW |
44 | components: { |
45 | Generic, | |
46 | }, | |
b1de1f9e | 47 | data: () => { |
48 | return { | |
49 | config: null, | |
50 | serverError: false, | |
51 | }; | |
52 | }, | |
53 | created: function () { | |
54 | this.fetchConfig(); | |
55 | }, | |
56 | methods: { | |
57 | fetchConfig: function () { | |
b4a2db6e BW |
58 | this.fetch("/api/v2/config", { |
59 | headers: { "X-Api-Key": this.item.apikey }, | |
b1de1f9e | 60 | }) |
b1de1f9e | 61 | .then((conf) => { |
62 | this.config = conf; | |
63 | }) | |
64 | .catch((e) => { | |
65 | console.log(e); | |
66 | this.serverError = true; | |
67 | }); | |
68 | }, | |
69 | }, | |
70 | }; | |
71 | </script> | |
72 | ||
73 | <style scoped lang="scss"> | |
b1de1f9e | 74 | .notifs { |
75 | position: absolute; | |
76 | color: white; | |
77 | font-family: sans-serif; | |
78 | top: 0.3em; | |
79 | right: 0.5em; | |
b4a2db6e BW |
80 | .notif { |
81 | padding-right: 0.35em; | |
82 | padding-left: 0.35em; | |
83 | padding-top: 0.2em; | |
84 | padding-bottom: 0.2em; | |
85 | border-radius: 0.25em; | |
86 | position: relative; | |
87 | margin-left: 0.3em; | |
88 | font-size: 0.8em; | |
89 | &.news { | |
90 | background-color: #777777; | |
91 | } | |
b1de1f9e | 92 | |
b4a2db6e BW |
93 | &.warnings { |
94 | background-color: #d08d2e; | |
95 | } | |
b1de1f9e | 96 | |
b4a2db6e BW |
97 | &.errors { |
98 | background-color: #e51111; | |
99 | } | |
100 | } | |
b1de1f9e | 101 | } |
102 | </style> |