{"version":3,"sources":["webpack:///../../../src/components/VGrid/VSpacer.ts","webpack:///./src/components/Admin/Devices.vue","webpack:///src/components/Admin/Devices.vue","webpack:///./src/components/Admin/Devices.vue?28c7","webpack:///./src/components/Admin/Devices.vue?f533"],"names":["createSimpleFunctional","_vm","scopedSlots","key","fn","_c","item","active","staticClass","_s","onRefreshClick","attrs","staticRenderFns","render","name","components","Busy","created","console","log","$options","busyMessage","errorMessage","refresh","beforeDestroy","methods","format","parseISO","prettyDT","getPin","$store","getters","loggedIn","axios","get","then","res","data","timeStarting","Date","now","secsRemaining","seconds","secsStarting","timerID","setInterval","onTick","pinCode","code","catch","error","toString","clearInterval","showError","secs","pctRemaining","Math","floor","onGetPinClick","items","headers","text","align","value","component"],"mappings":"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","file":"js/chunk-08e34a42.63a6f76c.js","sourcesContent":["import './_grid.sass'\nimport { createSimpleFunctional } from '../../util/helpers'\n\nexport default createSimpleFunctional('spacer', 'div', 'v-spacer')\n","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('v-toolbar',{attrs:{\"color\":\"white\",\"flat\":\"\"}},[_c('v-toolbar-title',[_vm._v(\"Tablets and Devices\")]),_c('v-divider',{staticClass:\"mx-2\",attrs:{\"inset\":\"\",\"vertical\":\"\"}}),_c('v-spacer')],1),_c('v-data-table',{attrs:{\"headers\":_vm.headers,\"items\":_vm.items,\"dense\":\"\",\"disable-pagination\":\"\",\"hide-default-footer\":\"\"},scopedSlots:_vm._u([{key:\"body\",fn:function({ items }){return [_c('tbody',[_vm._l((items),function(item){return _c('tr',{key:item.id},[_c('td',{staticClass:\"text-left\"},[_vm._v(\" \"+_vm._s(item.name)+\" \")]),_c('td',{staticClass:\"text-left\"},[_vm._v(\" \"+_vm._s(item.ident)+\" \"+_vm._s(item.serial)+\" \")]),_c('td',{staticClass:\"justify-center layout\"},[(item.active)?_c('v-icon',{staticClass:\"mr-2\",attrs:{\"small\":\"\"}},[_vm._v(\" mdi-check-bold \")]):_vm._e()],1),_c('td',{staticClass:\"text-center\"},[_vm._v(_vm._s(_vm.prettyDT(item.seen)))]),_c('td',{staticClass:\"text-center\"},[_vm._v(\" \"+_vm._s(item.timezone)+\" \")])])}),_c('tr',[_c('td',{staticClass:\"font-weight-bold\"},[_vm._v(\"Total Devices: \"+_vm._s(items.length))]),_c('td'),_c('td'),_c('td')])],2)]}}])}),_c('v-divider',{staticClass:\"d-print-none\"}),_c('v-row',[_c('v-col',[_c('v-btn',{staticClass:\"white--text mx-6\",attrs:{\"color\":\"primary\"},on:{\"click\":_vm.onRefreshClick}},[_c('v-icon',{attrs:{\"dark\":\"\",\"left\":\"\"}},[_vm._v(\"mdi-refresh\")]),_vm._v(\" Refresh \")],1)],1)],1),_c('v-divider'),_c('v-row',[_c('v-col',[_vm._v(\" To register a new device, click the button below to request a pin code. Then enter the pin code in the tablet. \")])],1),_c('v-row',[_c('v-col',[_c('v-btn',{staticClass:\"white--text mx-6\",attrs:{\"color\":\"primary\"},on:{\"click\":_vm.onGetPinClick}},[_c('v-icon',{attrs:{\"dark\":\"\",\"left\":\"\"}},[_vm._v(\"mdi-refresh\")]),_vm._v(\" Get Pin Code \")],1)],1),(_vm.pinCode)?_c('v-col',[_c('v-row',[_c('div',{staticClass:\"display-3 font-weight-regular\"},[_vm._v(\" \"+_vm._s(_vm.pinCode.slice(0,3))+\"   \"+_vm._s(_vm.pinCode.slice(3))+\" \")])]),_c('v-row',[_vm._v(\" This pin code expires in: \"+_vm._s(_vm.secsRemaining)+\" seconds \")])],1):_vm._e(),(_vm.pinCode)?_c('v-col',[_c('v-progress-circular',{attrs:{\"rotate\":-90,\"size\":80,\"value\":_vm.pctRemaining,\"width\":40,\"color\":\"primary\"}})],1):_vm._e()],1),_c('v-row',[_c('v-col',[_c('v-alert',{attrs:{\"value\":(_vm.errorMessage!=''),\"outlined\":\"\",\"type\":\"error\"}},[_vm._v(\" \"+_vm._s(_vm.errorMessage)+\" \")])],1)],1),_c('busy',{attrs:{\"message\":_vm.busyMessage}})],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <v-toolbar color=\"white\" flat>\n      <v-toolbar-title>Tablets and Devices</v-toolbar-title>\n      <v-divider\n              class=\"mx-2\"\n              inset\n              vertical\n      ></v-divider>\n      <v-spacer></v-spacer>\n    </v-toolbar>\n\n    <v-data-table\n            :headers=\"headers\"\n            :items=\"items\"\n            dense\n            disable-pagination\n            hide-default-footer\n    >\n\n      <template v-slot:body=\"{ items }\">\n        <tbody>\n        <tr :key=\"item.id\" v-for=\"item in items\">\n          <td class=\"text-left\">\n            {{ item.name }}\n          </td>\n          <td class=\"text-left\">\n            {{ item.ident }}&nbsp;{{ item.serial }}\n          </td>\n          <td class=\"justify-center layout\">\n            <v-icon class=\"mr-2\" small v-if=\"item.active\">\n              mdi-check-bold\n            </v-icon>\n          </td>\n          <td class=\"text-center\">{{ prettyDT(item.seen) }}</td>\n          <td class=\"text-center\">\n            {{ item.timezone }}\n          </td>\n        </tr>\n        <tr>\n          <td class=\"font-weight-bold\">Total Devices: {{ items.length }}</td>\n          <td></td>\n          <td></td>\n          <td></td>\n        </tr>\n        </tbody>\n      </template>\n\n    </v-data-table>\n    <v-divider class=\"d-print-none\"></v-divider>\n\n    <v-row>\n      <v-col>\n        <v-btn @click=\"onRefreshClick\" class=\"white--text mx-6\" color=\"primary\">\n          <v-icon dark left>mdi-refresh</v-icon>\n          Refresh\n        </v-btn>\n      </v-col>\n    </v-row>\n\n    <v-divider></v-divider>\n    <v-row>\n      <v-col>\n        To register a new device, click the button below to request a pin code.\n        Then enter the pin code in the tablet.\n      </v-col>\n    </v-row>\n    <v-row>\n      <v-col>\n        <v-btn @click=\"onGetPinClick\" class=\"white--text mx-6\" color=\"primary\">\n          <v-icon dark left>mdi-refresh</v-icon>\n          Get Pin Code\n        </v-btn>\n      </v-col>\n\n      <v-col v-if=\"pinCode\">\n        <v-row>\n          <div class=\"display-3 font-weight-regular\">\n            {{ pinCode.slice(0,3) }} &nbsp; {{ pinCode.slice(3) }}\n          </div>\n        </v-row>\n        <v-row>\n          This pin code expires in: {{ secsRemaining }} seconds\n        </v-row>\n      </v-col>\n      <v-col v-if=\"pinCode\">\n        <v-progress-circular\n                :rotate=\"-90\"\n                :size=\"80\"\n                :value=\"pctRemaining\"\n                :width=\"40\"\n                color=\"primary\"\n        >\n        </v-progress-circular>\n      </v-col>\n    </v-row>\n\n    <v-row>\n      <v-col>\n        <v-alert :value=\"(errorMessage!='')\" outlined type=\"error\">\n          {{ errorMessage }}\n        </v-alert>\n      </v-col>\n    </v-row>\n\n    <busy :message=\"busyMessage\"></busy>\n  </div>\n</template>\n\n<script>\n  import Busy from './Busy'\n  import axios from 'axios'\n  import { format, parseISO } from 'date-fns'\n  import { prettyDT } from './utils'\n\n  export default {\n    name: \"Devices\",\n    components: {\n      Busy\n    },\n\n    created () {\n      console.log('Created:', this.$options.name)\n      this.busyMessage = ''\n      this.errorMessage = ''\n      this.refresh()\n    },\n    beforeDestroy () {\n      this.busyMessage = ''\n      this.errorMessage = ''\n      console.log('BeforeDestroy:', this.$options.name)\n    },\n\n    methods: {\n      format,\n      parseISO,\n      prettyDT,\n\n      getPin () {\n        console.log('GET Pin Code')\n        if (!this.$store.getters.loggedIn) {\n          return\n        }\n        this.busyMessage = 'Loading...'\n\n        axios.get('/device/pin')\n            .then(res => {\n              this.busyMessage = ''\n              console.log('Pin:', res.data)\n              this.timeStarting = Date.now()\n              this.secsRemaining = res.data.seconds\n              this.secsStarting = this.secsRemaining // save for % calcs\n              // start timer\n              this.timerID = setInterval(this.onTick, 250)\n              this.onTick()\n              this.pinCode = res.data.code // causes countdown to become visible\n            })\n            .catch(error => {\n              console.log(error.toString())\n              this.pinCode = ''\n              this.busyMessage = ''\n              clearInterval(this.timerID)\n              this.showError('Error unable to get pin code: ' + error.toString())\n            })\n      },\n      onTick () {\n        let secs = this.secsStarting - (Date.now() - this.timeStarting) / 1000\n        this.pctRemaining = 100 * secs / this.secsStarting // float value, smooth\n        this.secsRemaining = Math.floor(secs) // int value, changes by the whole sec\n        if (this.secsRemaining <= 0) {\n          clearInterval(this.timerID)\n          console.log(\"Pin expired:\", this.pinCode)\n          this.pinCode = ''\n        }\n      },\n      onGetPinClick () {\n        console.log(\"On get pin click\")\n        this.getPin()\n      },\n      onRefreshClick () {\n        console.log(\"On refresh click\")\n        this.refresh()\n      },\n      refresh () {\n        console.log('GET Devices')\n        if (!this.$store.getters.loggedIn) {\n          return\n        }\n        this.busyMessage = 'Loading...'\n\n        axios.get('/device/list')\n            .then(res => {\n              this.busyMessage = ''\n              console.log('Devices:', res.data)\n              this.items = res.data\n            })\n            .catch(error => {\n              console.log(error.toString())\n              this.busyMessage = ''\n              this.items = []\n              this.showError('Error unable to get devices: ' + error.toString())\n            })\n      }\n    },\n\n    data () {\n      return {\n        busyMessage: '',\n        errorMessage: '',\n\n        // related to the pin code and expiration\n        pinCode: '',\n        pctRemaining: 0,\n        secsRemaining: 0,\n        secsStarting: 45, // avoid divide by zero\n        timeStarting: null,\n        timerID: null,\n\n        // table for list of devices/tablets\n        items: [],\n        headers: [\n          { text: 'Name', align: 'left', value: 'name' },\n          { text: 'Ident', align: 'left', value: 'name' },\n          { text: 'Active', align: 'center', value: 'active' },\n          { text: 'Last seen', align: 'center', value: 'seen' },\n          { text: 'Timezone', align: 'center', value: 'timezone' }\n        ]\n      }\n    }\n  }\n</script>\n\n<style scoped>\n\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Devices.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Devices.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Devices.vue?vue&type=template&id=f6bf5d34&scoped=true\"\nimport script from \"./Devices.vue?vue&type=script&lang=js\"\nexport * from \"./Devices.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"f6bf5d34\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}