Skip to content

Instantly share code, notes, and snippets.

@Iheanacho-ai
Created April 14, 2022 17:59

Revisions

  1. Iheanacho-ai revised this gist Apr 14, 2022. 1 changed file with 0 additions and 7 deletions.
    7 changes: 0 additions & 7 deletions food-notification-notification.vue
    Original file line number Diff line number Diff line change
    @@ -8,8 +8,6 @@
    </template>
    <script>
    import { sdk } from "../../utils";
    import { createToast } from 'mosha-vue-toastify';
    import 'mosha-vue-toastify/dist/style.css'
    export default {
    name: 'Notification',
    @@ -18,11 +16,6 @@
    orderStatus: ""
    }
    },
    watch: {
    orderStatus: function(){
    createToast(this.orderStatus)
    }
    },
    mounted(){
    if(sdk.account.get !== null){
    try {
  2. Iheanacho-ai created this gist Apr 14, 2022.
    54 changes: 54 additions & 0 deletions food-notification-notification.vue
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,54 @@
    <template>
    <div class="notifications rounded overflow-hidden shadow-lg">
    <div class="order-container">
    <h2>{{orderStatus}}</h2>
    </div>
    </div>

    </template>
    <script>
    import { sdk } from "../../utils";
    import { createToast } from 'mosha-vue-toastify';
    import 'mosha-vue-toastify/dist/style.css'
    export default {
    name: 'Notification',
    data(){
    return{
    orderStatus: ""
    }
    },
    watch: {
    orderStatus: function(){
    createToast(this.orderStatus)
    }
    },
    mounted(){
    if(sdk.account.get !== null){
    try {
    sdk.subscribe('collections.62532d2523f63b230a93.documents', response => {
    console.log(response.payload.orderStatus, 'order status payload' )
    this.orderStatus = response.payload.orderStatus
    });
    } catch (error) {
    console.log(error, 'error')
    }
    }
    }
    }
    </script>
    <style scoped>
    .notifications{
    width: 350px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    }
    </style>