53 lines
1.2 KiB
Vue
53 lines
1.2 KiB
Vue
<template>
|
|
<div id="overseer-notifications">
|
|
<div v-on:click="navigateToScan(item)" class="overseer-notification" v-for="item in items" :key="item.id">
|
|
<b>Target: </b> {{ item.target }} <br>
|
|
<b>Status: </b>{{ item.status }} <br>
|
|
<span v-if="'total_progress' in item">
|
|
<b>Progress: </b>{{item.total_progress}} <br>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'OverseerNotifications',
|
|
computed: {
|
|
items() {
|
|
return this.$store.state.notifications
|
|
}
|
|
},
|
|
methods: {
|
|
navigateToScan(item) {
|
|
this.$router.push({ path: `/scan/${item.target}/${item.id}` })
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
#overseer-notifications {
|
|
height: calc(100% - 60px);
|
|
width: 320px;
|
|
position: fixed;
|
|
transition: 0.5s;
|
|
right: 0px;
|
|
top: 0px;
|
|
overflow: scroll;
|
|
margin-top: 60px;
|
|
z-index: 1;
|
|
}
|
|
|
|
.overseer-notification {
|
|
height: 65px;
|
|
transition: 0.5s;
|
|
background-color: #E0E3DE;
|
|
border-radius: 2px;
|
|
text-align: start;
|
|
padding: 10px;
|
|
margin: 10px;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|