<template>
  <f7-page name="notifications">
    <f7-navbar title="Notifications" back-link="Back"></f7-navbar>
    <f7-block-title>
      <h1><b>Recent Notifications</b></h1>
    </f7-block-title>
    <f7-block>
      <f7-list v-for="(notification, i) in user_notifications" :key="i">
        <h2 v-html="notification.title"></h2>
        <p v-html="notification.messageDetails"></p>
        <span
          class="small-time"
          v-html="
            moment(notification.dateCreated).format('MMMM Do YYYY, h:mm a')
          "
        ></span>
      </f7-list>
    </f7-block>
  </f7-page>
</template>
<script>
import moment from "moment";
import firebase from "firebase";
export default {
  data() {
    return {
      posts: [],
      myUrl: "https://247sms.com",
    };
  },
  computed: {
    user_notifications() {
      return this.$store.getters.user_notifications;
    },
    user() {
      return this.$store.getters.user;
    },
  },
  methods: {},
  created() {
    var payload = {};
    payload.email = this.user[0].email;
    payload.domain = this.user[0].domain;
    this.$store.dispatch("getUserNotifications", payload);
    this.$store.dispatch("resetTotalNotify", payload);
  },
};
</script>
<style scoped>
.div {
  margin-top: 0.3px;
}
.small-time {
  font-size: 0.7em;
  margin-top: 0.01px;
}
</style>