Merge branch 'transducer' into 'development'

API Connection - Transducer page

See merge request lappis-unb/projects/SMI/smi-mobile!15

src/components/historyItem.vue

@@ -1,9 +1,9 @@
 <template>
   <q-list>
-    <div v-for="item in items" v-bind:key="item.key">
-      <q-item to="/transducer">
+    <div v-for="item in items" v-bind:key="item.id">
+      <q-item :to="'/transducer/' + item.transductor">
         <q-item-section>
-          <q-item-label>{{item.occurence}}</q-item-label>
+          <q-item-label>{{item.type}}</q-item-label>
           <q-item-label caption>{{item.location}} ({{item.campus}})</q-item-label>
         </q-item-section>
 

src/components/listItem.vue

@@ -1,7 +1,7 @@
 <template>
   <q-list>
     <div v-for="item in items" v-bind:key="item.id">
-      <q-item to="/transducer">
+      <q-item :to="'/transducer/' + item.serial_number">
         <q-item-section>
           <q-item-label>{{item.name}} ({{item.campus_acronym}})</q-item-label>
         </q-item-section>

src/components/occurenceItem.vue

@@ -1,13 +1,13 @@
 <template>
   <q-list>
     <div v-for="item in items" v-bind:key="item.id">
-      <q-item to="/transducer">
+      <q-item :to="'/transducer/' + item.transductor">
         <q-item-section>
           <q-item-label>{{item.location}} ({{item.campus}})</q-item-label>
-          <q-item-label caption>{{getInfo(item)}}</q-item-label>
+          <q-item-label caption>{{showInfo(item)}}</q-item-label>
         </q-item-section>
         <q-item-section side top>
-          <q-item-label caption>{{writenTime(item.start_time)}}</q-item-label>
+          <q-item-label caption>{{showTime(item)}}</q-item-label>
         </q-item-section>
       </q-item>
       <q-separator spaced inset />
@@ -16,6 +16,9 @@
 </template>
 
 <script>
+import getInfo from '../utils/info'
+import timePassed from '../utils/timePassed'
+
 export default {
   name: 'OccurenceItem',
   props: {
@@ -31,80 +34,11 @@ export default {
     }
   },
   methods: {
-    writenTime (time) {
-      let d = new Date(time)
-      let now = new Date()
-      let min = Math.floor((now - d) / (1000 * 60))
-
-      if (min < 60) {
-        return min + ' min'
-      } else {
-        let h = Math.floor(min / 60)
-        let m = min % 60
-        if (m === 0) {
-          return h + ' horas'
-        } else {
-          return h + 'h ' + m + 'min'
-        }
-      }
-    },
-    getInfo (item) {
-      if (this.info === 'conection_fail') {
-        return 'Possível queda de energia'
-      } else if (this.info === 'critical_tension' ||
-                this.info === 'precarious_tension') {
-        return this.getPhaseVoltage(item)
-      } else if (this.info === 'phase_drop') {
-        return this.getPhase(item)
-      }
+    showTime (item) {
+      return timePassed(item.start_time)
     },
-    getPhaseVoltage (item) {
-      let res = ''
-      let isFirst = true
-
-      if (item.data.voltage_a) {
-        res += 'A - ' + Math.round(item.data.voltage_a) + 'V '
-        isFirst = false
-      }
-      if (item.data.voltage_b) {
-        if (!isFirst) {
-          res += ' / '
-        }
-        res += 'B - ' + Math.round(item.data.voltage_b) + 'V '
-        isFirst = false
-      }
-      if (item.data.voltage_c) {
-        if (!isFirst) {
-          res += ' / '
-        }
-        res += 'C - ' + Math.round(item.data.voltage_c) + 'V '
-        isFirst = false
-      }
-      return res
-    },
-    getPhase (item) {
-      let res = ''
-      let isFirst = true
-
-      if (item.data.voltage_a) {
-        res += 'Fase A '
-        isFirst = false
-      }
-      if (item.data.voltage_b) {
-        if (!isFirst) {
-          res += ' / '
-        }
-        res += 'Fase B '
-        isFirst = false
-      }
-      if (item.data.voltage_c) {
-        if (!isFirst) {
-          res += ' / '
-        }
-        res += 'Fase C '
-        isFirst = false
-      }
-      return res
+    showInfo (item) {
+      return getInfo(item, this.info)
     }
   }
 }

src/components/occurences.vue

@@ -64,13 +64,17 @@ export default {
     }
   },
   created () {
-    console.log('fetching data...')
     MASTER.get('occurences/')
       .then((res) => {
         this.transductor_connection_fail = res.data.transductor_connection_fail
         this.critical_tension = res.data.critical_tension
         this.precarious_tension = res.data.precarious_tension
         this.phase_drop = res.data.phase_drop
+        res.data.slave_connection_fail.forEach((elem) => {
+          if (this.transductor_connection_fail.find(x => x.transductor === elem.transductor) === undefined) {
+            this.transductor_connection_fail.push(elem)
+          }
+        })
         this.isLoading = false
       })
       .catch((err) => {

src/components/pageHeader.vue

@@ -68,7 +68,6 @@ export default {
     onItemClick (id) {
       this.selected = this.options.findIndex(x => x.id === id)
       this.$store.commit('change', this.options[this.selected])
-      console.log('--->> ', this.$store.state.campus)
     }
   }
 }

src/components/popup.vue

@@ -28,7 +28,7 @@ export default {
   },
   methods: {
     link () {
-      // The link has to be changed when we published the app on App Store
+      // The link has to be changed when we publish the app on App Store
       openURL('https://apps.apple.com/br/app/instagram/id389801252')
     }
   }

src/components/transducerItem.vue

@@ -1,11 +1,11 @@
 <template>
   <q-list>
     <div v-for="item in items" v-bind:key="item.id">
-      <q-item to="/transducer">
+      <q-item :to="'/transducer/' + item.transductor">
         <q-item-section>
           <q-item-label class="text">{{item.type}}</q-item-label>
           <q-item-label class="text">{{item.info}}</q-item-label>
-          <q-item-label caption>De {{item.startTime}} às {{item.endTime}}</q-item-label>
+          <q-item-label caption>De {{item.writtenStartTime}} às {{item.writtenEndTime}}</q-item-label>
         </q-item-section>
       </q-item>
     </div>

src/pages/LastHours.vue

@@ -18,6 +18,7 @@
 import pageHeader from '../components/pageHeader.vue'
 import simpleList from '../components/simpleList.vue'
 import MASTER from '../services/masterApi/http-common'
+import separateInDays from '../utils/separateInDays'
 
 export default {
   components: {
@@ -32,58 +33,18 @@ export default {
       key: 0
     }
   },
-  created () {
-    MASTER.get('/occurences/?type=period')
-      .then((res) => {
-        console.log(res.data)
-        this.separateInDays(res.data.transductor_connection_fail, 'Falha de comunicação')
-        this.separateInDays(res.data.slave_connection_fail, 'Falha de comunicação')
-        this.separateInDays(res.data.critical_tension, 'Tensão crítica')
-        this.separateInDays(res.data.precarious_tension, 'Tensão precária')
-        this.separateInDays(res.data.phase_drop, 'Queda de fase')
+  async created () {
+    await MASTER.get('/occurences/?type=period')
+      .then(async (res) => {
+        await separateInDays(res.data.transductor_connection_fail, 'transductor_connection_fail', this.today, this.yesterday, this.beforeYesterday)
+        await separateInDays(res.data.slave_connection_fail, 'slave_connection_fail', this.today, this.yesterday, this.beforeYesterday)
+        await separateInDays(res.data.critical_tension, 'critical_tension', this.today, this.yesterday, this.beforeYesterday)
+        await separateInDays(res.data.precarious_tension, 'precarious_tension', this.today, this.yesterday, this.beforeYesterday)
+        await separateInDays(res.data.phase_drop, 'phase_drop', this.today, this.yesterday, this.beforeYesterday)
       })
       .catch((err) => {
         console.log(err)
       })
-  },
-  methods: {
-    separateInDays (arr, type) {
-      let today = new Date()
-      arr.forEach((elem) => {
-        let endTime = elem.end_time !== null ? new Date(elem.end_time) : today
-        let startTime = new Date(elem.start_time)
-
-        let item = {
-          ...elem,
-          occurence: type,
-          writtenStartTime: this.getTime(startTime, endTime, true),
-          writtenEndTime: this.getTime(endTime, today, false),
-          key: this.key
-        }
-        this.key++
-
-        if (today.getDate() === endTime.getDate()) {
-          this.today.push(item)
-        } else if (today.getDate() - 1 === endTime.getDate()) {
-          this.yesterday.push(item)
-        } else if (today.getDate() - 2 === endTime.getDate()) {
-          this.beforeYesterday.push(item)
-        }
-      })
-    },
-    getTime (date, compareDate, isStartTime) {
-      let days = Math.floor((compareDate - date) / (1000 * 60 * 60 * 24))
-      let res = ''
-
-      if (isStartTime && days > 0) {
-        res += days.toString() + ' dia '
-      } else {
-        let h = date.getHours()
-        let min = date.getMinutes()
-        res += h.toString() + 'h' + min.toString().padStart(2, 0)
-      }
-      return res
-    }
   }
 }
 </script>