<template>
   <div class="tanggal">
      {{f_tanggal}}
      <span class="hidden-sm-and-down" style="color:brown; margin-left:20px;font-weight:bold;font-size:16px;">
         {{branch_name}}
      </span>
      <div class="visible-sm-and-down hidden-md-and-up" style="color:brown; font-weight:bold;font-size:10px;">
         Devone <!-- {{branch_name}} -->
      </div>
   </div>
</template>
<style scoped>
  div.tanggal {
    text-decoration: none;
    vertical-align:top;
    color: rgb(255, 255, 255);
    font-size: 14px;
    display:inline-block; 
    margin-left:10px;
  }
</style>
<script>
let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]

module.exports = {
   data() {
      return {
         tanggal: new Date()
         ,timepool : 0
      }
   }
   ,computed: {
      branch_name() {
         let branch = this.$store.state.system.branch 
         if (branch.M_BranchName == undefined) return ''
         return branch.M_BranchName 
      },
      f_tanggal() {
         try {
            let tgl = this.tanggal.getDate()
            let bln = bulan[this.tanggal.getMonth()]
            let day = hari[this.tanggal.getDay()]
            let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear() 
            let hour = this.tanggal.getHours()
            let minute = this.tanggal.getMinutes()
            let second = this.tanggal.getSeconds() 
            let jam = ' '
            if ( hour < 10 ) jam = jam + '0'
            jam = jam + hour.toString() + ':'
            if ( minute < 10 ) jam = jam + '0'
            jam = jam + minute.toString() + ':'
            if ( second< 10 ) jam = jam + + '0'
            jam = jam + second.toString()
         
            result = result + ' ' +  jam
            return result 
         } catch(e) {
            return ''
         }
      }
   }
   , mounted() {
      let self = this
      this.timepool = setInterval(function() {
         self.tanggal = new Date()
      },1000)
   }
   ,beforeDestroy() {
      if (this.timepool > 0 ) clearInterval(this.timepool)

   }
}
</script>
