Updated Communication and added logs

src/components/admin/property/propertyList.vue

             </thead>
             <tbody>
               <tr v-for="(item, i) in DisplayItems" :key="i">
+                <td>#{{ item.id }}</td>
                 <td>{{ item.owner }}</td>
                 <td>{{ item.reference }}</td>
                 <td>{{ item.property }}</td>
 </template>
 
 <script>
+/* eslint-disable */
 import { mapState, mapActions } from "vuex";
 import Log from "../../../assets/Log";
 import BasePagination from "../../shared/basePagination";
       reverse: true,
       sortKey: "id",
       displayColumns: [
+        "ID",
         "Owner",
         "Reference",
         "Property",
         "Publish"
       ],
       columns: [
+        "id",
         "owner",
         "reference",
         "property",

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="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>
+  </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", "heardFrom", "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>

src/components/communication/enquireNowLog.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="row">
+        <div class="col">
+          <div class="section-header">
+            <h2>Enquire Now Log</h2>
+          </div>
+        </div>
+      </div>
+      <div v-if="checkAccess">
+        <div class="container">
+          <div class="row">
+            <div class="col-md-12">
+              <ListView
+                :items="enquireNowLog"
+                :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>
+  </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",
+        "property",
+        "created",
+        "name",
+        "email",
+        "phone",
+        "message",
+        "heardFrom",
+        "error"
+      ]
+    };
+  },
+  methods: {
+    ...mapActions("template", ["getEnquireNowLog"]),
+    async loadData() {
+      await this.getEnquireNowLog();
+    }
+  },
+  mounted() {
+    this.loadData().then(() => {
+      setTimeout(() => {
+        this.boolLoaded = true;
+      }, 100);
+    });
+  },
+  computed: {
+    ...mapState("template", ["enquireNowLog"]),
+    checkAccess() {
+      if (Log.getUser().role === "Super Admin") {
+        return true;
+      } else {
+        return false;
+      }
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/property/commercial/singleView/contentSection.vue

             class="panel-left p-5"
             :class="propertyImages.length > 0 ? 'galleryImages' : 'noGalleryImages'"
           >
-            <h2>Property Detial</h2>
+            <h2>Property Detail</h2>
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
             <p>{{ property.city }}, {{ property.suburb }}</p>
             <div v-if="property.displayData.length > 0">

src/components/property/enquireNow/contentSection.vue

             <div class="validation"></div>
           </div>
           <div class="form-group col-md-12">
+            <float-label fixed label="How did you hear about this property?">
+              <select v-model="heardFrom" name="heardFrom" id="" class="form-control uniSelect">
+                <option value="Referred by someone">Referred by someone</option>
+                <option value="Website Search">Website Search</option>
+                <option value="Google Search">Google Search</option>
+                <option value="Social Media">Social Media</option>
+              </select>
+            </float-label>
+          </div>
+          <div class="form-group col-md-12 mt-3">
             <float-label>
               <textarea
                 type="textArea"
       contactNumber: null,
       property: null,
       message: null,
-      boolSent: false
+      boolSent: false,
+      heardFrom: ""
     };
   },
   mounted() {
         email: this.indiv.emailAddress,
         phone: this.indiv.cellNumber,
         property: this.property.id.toString(),
-        message: this.message
+        message: this.message,
+        heardFrom: this.heardFrom
       };
 
       const response = await axios.post("/api/mail/1", mailObj);

src/components/property/residential/singleView/contentSection.vue

             <gallery :images="Images" :index="index" @close="index = null"></gallery>
           </div>
           <div class="panel-left p-5" style="margin-top:130px">
-            <h2>Property Detial</h2>
+            <h2>Property Detail</h2>
 
             <!-- TODO: Make it dynamic -->
 

src/components/shared/navBar.vue

                           style="margin-top:-10px;text-align:left;width:250px"
                           :class="submenu1Class"
                         >
+                          <li>
+                            <router-link to="/contactUsLog">Contact Us Log</router-link>
+                          </li>
                           <li>
                             <router-link to="/termsConditions">Edit Terms & Conditions</router-link>
                           </li>
                           <li>
                             <router-link to="/emailRecipient">Email Recipients</router-link>
                           </li>
+                          <li>
+                            <router-link to="/enquireNowLog">Enquire Now Log</router-link>
+                          </li>
                           <li>
                             <router-link to="/fees">Fees</router-link>
                           </li>

src/router/index.js

 import WebsiteDisclaimer from "../components/misc/Disclaimer/WebsiteDisclaimer.vue";
 import TermsConditions from "../components/admin/misc/termsConditions.vue";
 import TermsConditionsView from "../components/misc/TermsConditions/termsConditions.vue";
+import ContactUsLog from '../components/communication/contactUsLog.vue'
+import EnquireNowLog from '../components/communication/enquireNowLog.vue'
 
 import MakeOffer from "../components/processFlow/makeOffer.vue";
 import Offer from "../components/processFlow/offers.vue";
       name: "emailRecipientEdit",
       component: EmailRecipientEdit,
     },
+    {
+      path: "/enquireNowLog",
+      name: "enquireNowLog",
+      component: EnquireNowLog,
+    },
+    {
+      path: "/contactUsLog",
+      name: "contactUsLog",
+      component: ContactUsLog,
+    },
     {
       path: "/status/new",
       name: "statusNew",

src/store/modules/communication/template.js

     item: {},
     message: undefined,
     recipients: [],
-    recipient: {}
+    recipient: {},
+    contactUsLog: [],
+    enquireNowLog: []
   },
   mutations: {
     setList(state, list) {
     deleteTemplate(state, id){
       var index = state.list.findIndex((template) => template.id == id)
       state.list.splice(index, 1)
-    }
+    },
+    setContactUsLog(state, log){
+      state.contactUsLog = log
+    },
+    setEnquireNowLog(state, log){
+      console.log(log);
+      state.enquireNowLog = log
+    },
   },
   getters: {
   },
       .catch((e) => {
         console.log(e.response);
       })
+    },
+    async getContactUsLog({commit}){
+      await axios.get('/api/mail/getContactLog/')
+      .then((result) => {
+        commit("setContactUsLog", result.data)
+      })
+      .catch((response) => {
+        console.log(response.response);
+      })
+    },
+    async getEnquireNowLog({commit}){
+      await axios.get('/api/mail/getEnquireLog/')
+      .then((result) => {
+        commit("setEnquireNowLog", result.data)
+      })
+      .catch((response) => {
+        console.log(response.response);
+      })
     }
   },
 };