2020-01-30 04:37:25 +09:00
|
|
|
<template>
|
2020-07-11 10:13:11 +09:00
|
|
|
<mk-container :style="`height: ${props.height}px;`" :show-header="props.showHeader" :scrollable="true">
|
|
|
|
<template #header><fa :icon="faBell"/>{{ $t('notifications') }}</template>
|
2020-01-30 04:37:25 +09:00
|
|
|
|
2020-07-11 10:13:11 +09:00
|
|
|
<div>
|
|
|
|
<x-notifications/>
|
|
|
|
</div>
|
|
|
|
</mk-container>
|
2020-01-30 04:37:25 +09:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts">
|
|
|
|
import { faBell } from '@fortawesome/free-solid-svg-icons';
|
|
|
|
import MkContainer from '../components/ui/container.vue';
|
|
|
|
import XNotifications from '../components/notifications.vue';
|
|
|
|
import define from './define';
|
|
|
|
|
|
|
|
export default define({
|
|
|
|
name: 'notifications',
|
|
|
|
props: () => ({
|
2020-07-11 10:13:11 +09:00
|
|
|
showHeader: {
|
|
|
|
type: 'boolean',
|
|
|
|
default: true,
|
|
|
|
},
|
|
|
|
height: {
|
|
|
|
type: 'number',
|
|
|
|
default: 300,
|
|
|
|
},
|
2020-01-30 04:37:25 +09:00
|
|
|
})
|
|
|
|
}).extend({
|
|
|
|
components: {
|
|
|
|
MkContainer,
|
|
|
|
XNotifications,
|
|
|
|
},
|
|
|
|
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
faBell
|
|
|
|
};
|
|
|
|
},
|
|
|
|
});
|
|
|
|
</script>
|