UnivateProperties/src/components/communication/contactUsLog.vue

<template>
  <div v-if="!boolLoaded" id="preloader"></div>
  <main v-else id="main" style="margin-top: -20px; padding-bottom: 50px;">
    <div class="container">
      <div class="form">
        <div class="row">
          <div class="col">
            <div class="section-header">
              <h2>Contact Us Log</h2>
            </div>
          </div>
        </div>
        <div v-if="checkAccess">
          <div class="container">
            <div class="row">
              <div class="col-md-12">
                <ListView
                  :items="contactUsLog"
                  :showColumnChooser="false"
                  :hideSearch="false"
                  :compact="false"
                  :showNew="false"
                  :editable="false"
                  :deleteable="false"
                  :displayColumns="columns"
                />
              </div>
            </div>
          </div>
        </div>
        <div v-else>
          <alert
            :text="'You don\'t have permission to view this page'"
            :type="'ERROR'"
          />
        </div>
      </div>
    </div>
  </main>
</template>

<script>
/* eslint-disable */
import { mapActions, mapState } from 'vuex'
import Log from '../../assets/Log'
import alert from '../shared/alert.vue'
import ListView from '../shared/listView'

export default {
  components: {
    ListView,
    alert,
  },
  data() {
    return {
      boolLoaded: false,
      columns: [
        'id',
        'created',
        'name',
        'email',
        'phone',
        'message',
        'mailSource',
        'error',
      ],
    }
  },
  methods: {
    ...mapActions('template', ['getContactUsLog']),
    async loadData() {
      await this.getContactUsLog()
    },
  },
  mounted() {
    this.loadData().then(() => {
      setTimeout(() => {
        this.boolLoaded = true
      }, 100)
    })
  },
  computed: {
    ...mapState('template', ['contactUsLog']),
    checkAccess() {
      if (Log.getUser().role === 'Super Admin') {
        return true
      } else {
        return false
      }
    },
  },
}
</script>

<style lang="scss" scoped></style>