diff --git a/src/App.vue b/src/App.vue index 39dfc34..4e954fd 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,5 +1,8 @@ @@ -100,6 +105,7 @@ dismissSecs: 5, dismissCountDown: 0, autoRenewSession: true, + main_style: {} }; }, methods: { @@ -181,7 +187,30 @@ font-family: 'Avenir', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; - color: #2c3e50; + color: #385875; + } + + #bg { + z-index: -100; + position: fixed; + top: -50%; + left: -50%; + width: 200%; + height: 200%; + } + #bg img { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + min-width: 50%; + min-height: 50%; + } + + h1 { + color: #275d37; } #nav { @@ -223,4 +252,5 @@ height: 100%; background-color: rgba(0, 0, 0, 0.2); } + diff --git a/src/api/stateRepository.ts b/src/api/stateRepository.ts new file mode 100644 index 0000000..3294dfb --- /dev/null +++ b/src/api/stateRepository.ts @@ -0,0 +1,17 @@ +// groupRepository.ts + +// @ts-ignore +import Repository from './Repository'; + +const recorderStateResource = '/state/recorder'; + + +export default { + getRecordersStates() { + return Repository.get(`${recorderStateResource}`); + }, + + getRecorderState(recorderId: number) { + return Repository.get(`${recorderStateResource}/${recorderId}`); + }, +}; diff --git a/src/api/virtualCommandRepository.ts b/src/api/virtualCommandRepository.ts new file mode 100644 index 0000000..45f202e --- /dev/null +++ b/src/api/virtualCommandRepository.ts @@ -0,0 +1,32 @@ +// groupRepository.ts + +// @ts-ignore +import Repository from './Repository'; + +const virtualCommandResource = '/virtual_command'; + +import {dictEmptyValToNull} from '@/utils'; + +export default { + + getVirtualCommands() { + return Repository.get(`${virtualCommandResource}`); + }, + + getVirtualCommand(virtualCommandId: number) { + return Repository.get(`${virtualCommandResource}/${virtualCommandId}`); + }, + + deleteVirtualCommand(virtualCommandId: number) { + return Repository.delete(`${virtualCommandResource}/${virtualCommandId}`); + }, + + createVirtualCommand(virtualCommandData: any) { + return Repository.post(`${virtualCommandResource}`, dictEmptyValToNull(virtualCommandData)); + }, + + updateVirtualCommand(virtualCommandId: number, virtualCommandData: any) { + return Repository.put(`${virtualCommandResource}/${virtualCommandId}`, + dictEmptyValToNull(virtualCommandData)); + }, +}; diff --git a/src/assets/background.jpg b/src/assets/background.jpg new file mode 100644 index 0000000..27e2394 Binary files /dev/null and b/src/assets/background.jpg differ diff --git a/src/assets/cube-background.jpg b/src/assets/cube-background.jpg new file mode 100644 index 0000000..f40431c Binary files /dev/null and b/src/assets/cube-background.jpg differ diff --git a/src/assets/hexagon.jpg b/src/assets/hexagon.jpg new file mode 100644 index 0000000..d441ce2 Binary files /dev/null and b/src/assets/hexagon.jpg differ diff --git a/src/assets/lens.jpg b/src/assets/lens.jpg new file mode 100644 index 0000000..9bda2a9 Binary files /dev/null and b/src/assets/lens.jpg differ diff --git a/src/components/Commands.vue b/src/components/Commands.vue index ee2cc86..369208f 100644 --- a/src/components/Commands.vue +++ b/src/components/Commands.vue @@ -180,11 +180,11 @@
+
  • {{ k }}: {{ item }}
    • @@ -198,6 +198,7 @@ {{recorders}} + --> diff --git a/src/components/ErroneousRecorders.vue b/src/components/ErroneousRecorders.vue index fbebf8a..efaaf91 100644 --- a/src/components/ErroneousRecorders.vue +++ b/src/components/ErroneousRecorders.vue @@ -1,6 +1,27 @@ @@ -40,7 +68,4 @@ margin: 0 10px; } - a { - color: #42b983; - } diff --git a/src/components/Recorder.vue b/src/components/Recorder.vue index 244dcaf..80f61f7 100644 --- a/src/components/Recorder.vue +++ b/src/components/Recorder.vue @@ -6,10 +6,11 @@

    - + - + v-model="new_recorder_id" @blur="manually_set_recorder_id()" + @input="manually_set_recorder_id()"> +

    @@ -18,7 +19,8 @@

    - +  {{recorder.name}}

    @@ -34,7 +36,7 @@  {{recorder.additional_camera_connected ? $t("yes") : $t("no")}}
    -  {{recorder.serial_number ? recorder.serial_number : $t("undefined")}}
    +  {{recorder.serial_number ? recorder.serial_number : $t("undefined")}}
      {{recorder.room ? recorder.room.name : $t("undefined")}} @@ -45,14 +47,29 @@ {{$t('created_at')}}: {{recorder.created_at}}
    {{$t('last_time_modified')}}: {{recorder.last_time_modified}}
    -
    -

      - {{recorder.offline ? 'The recorder is in offline / maintenance mode' : ''}}

    -
    + State:  + + + +  {{state.msg}} (Last update: {{state.time_stamp}}) + + {{$t('State is unknown')}}! +
    + + +
    +

    +   + {{recorder.offline ? 'The recorder is in offline / maintenance mode' : ''}} +

    +
    + +

    +   + {{recorder.lock_message}} +

    +
    -

      - {{recorder.lock_message}}

    -
    @@ -84,15 +101,20 @@ - Model / Recorder Adapter Info + Model / + Recorder Adapter Info + {{$t('name')}}: {{recorderModel.name}}
    {{$t('created_at')}}: {{recorderModel.created_at}}
    - {{$t('last_time_modified')}}: {{recorderModel.last_time_modified ? recorderModel.last_time_modified : 'never'}}
    - {{$t('requires_username')}}: {{recorderModel.requires_username ? 'Yes' : 'No'}}
    - {{$t('requires_password')}}: {{recorderModel.requires_password ? 'Yes' : 'No'}}
    + {{$t('last_time_modified')}}: {{recorderModel.last_time_modified + ? recorderModel.last_time_modified : 'never'}}
    + {{$t('requires_username')}}: {{recorderModel.requires_username + ? 'Yes' : 'No'}}
    + {{$t('requires_password')}}: {{recorderModel.requires_password + ? 'Yes' : 'No'}}
    {{$t('notes')}}: {{recorderModel.notes}}
         @@ -109,7 +131,8 @@ {{cmd_params}} - +
    {{command.name}}
    @@ -117,18 +140,24 @@ - + :type="a_type==='int'?'number':'text'" + style="margin-right: 10px;"> {{arg}}: {{a_type}} - +

    - + -  {{cmd_res[command.id].time | moment("HH:mm:ss")}}  - Output: +  {{cmd_res[command.id].time | moment("HH:mm:ss")}} +  - Output: {{cmd_res[command.id].output}} {{cmd_res[command.id].error}} @@ -171,18 +200,18 @@ } this.$set(this.cmd_params[command_id], argument, null) }, - set_param(command_id, argument, val){ + set_param(command_id, argument, val) { this.$set(this.cmd_params[command_id], argument, val) }, manually_set_recorder_id() { - if (this.new_recorder_id == null || this.new_recorder_id === ''){ + if (this.new_recorder_id == null || this.new_recorder_id === '') { this.new_recorder_id = this.current_recorder_id; return; } - if (this.recorderIds.includes(parseInt(this.new_recorder_id))){ + if (this.recorderIds.includes(parseInt(this.new_recorder_id))) { this.current_recorder_id = parseInt(this.new_recorder_id); } - this.new_recorder_id = this.current_recorder_id; + this.new_recorder_id = this.current_recorder_id; }, lock() { this.recorder.locked = true; @@ -191,8 +220,9 @@ this.recorder.locked = false; }, calculate_current_recorder_index() { - this.current_recorder_index = this.recorderIds.findIndex( (id) => - { return id === this.current_recorder_id}); + this.current_recorder_index = this.recorderIds.findIndex((id) => { + return id === this.current_recorder_id + }); }, previousRecorder() { if (null == this.current_recorder_index) { @@ -213,11 +243,11 @@ this.new_recorder_id = this.current_recorder_id; }, execute_command(command_id) { - console.log("recorder: "+ this.current_recorder_id + "; "+ command_id); + console.log("recorder: " + this.current_recorder_id + "; " + command_id); console.log(this.cmd_params); console.log(this.cmd_params[command_id]); this.$parent.$data.isLoading = true; - controlRepository.runRecorderCommand(this.current_recorder_id, command_id, this.cmd_params[command_id]).then((out)=>{ + controlRepository.runRecorderCommand(this.current_recorder_id, command_id, this.cmd_params[command_id]).then((out) => { this.$parent.$data.isLoading = false; console.log(out.data); this.$set(this.cmd_res, command_id, out.data); @@ -227,6 +257,7 @@ mounted() { this.$store.dispatch('loadRecorders'); this.$store.dispatch('loadRecorderModels'); + this.$store.dispatch('loadRecorderState', this.current_recorder_id); }, beforeDestroy() { EventBus.$off('failedLoadingProfile'); @@ -237,7 +268,7 @@ }, recorderIds() { let ids = []; - this.recorders.forEach((elem)=>{ + this.recorders.forEach((elem) => { ids.push(parseInt(elem.id)); }); return ids; @@ -246,18 +277,18 @@ const recorder = this.$store.state.recorders.filter((item) => { return parseInt(item.id) === this.current_recorder_id; }); - if(recorder.length < 1){ + if (recorder.length < 1) { this.$router.replace({name: 'notFound'}); return {}; } return recorder.shift(); }, recorderModel() { - if(!this.recorder || !this.recorder.recorder_model) return null; + if (!this.recorder || !this.recorder.recorder_model) return null; const model = this.recorderModels.filter((item) => { return parseInt(item.id) === this.recorder.recorder_model.id; }); - if(model.length < 1){ + if (model.length < 1) { return null; } return model.shift(); @@ -268,6 +299,11 @@ access_token() { return this.$store.state.access_token; }, + state() { + return this.$store.state.recorderStates.filter((s) => { + return parseInt(s.id) === this.current_recorder_id + }).pop(); + } }, }; @@ -277,6 +313,7 @@ color: red; font-weight: bold; } + .lang-btn { padding: 15px; border: 2px solid green; diff --git a/src/components/Recorders.vue b/src/components/Recorders.vue index 57b9286..2f65f87 100644 --- a/src/components/Recorders.vue +++ b/src/components/Recorders.vue @@ -614,11 +614,12 @@

    + +
  • {{ k }}: {{ item }}
    • @@ -627,11 +628,13 @@
    +
    {{recorders}}
    + -->
    diff --git a/src/main.ts b/src/main.ts index 5498749..0bbf142 100644 --- a/src/main.ts +++ b/src/main.ts @@ -49,7 +49,10 @@ import { faPlay, faFrown, faSmile, - faUserTag, faExternalLinkAlt, + faUserTag, + faExternalLinkAlt, + faThumbsUp, + faThumbsDown, } from '@fortawesome/free-solid-svg-icons'; import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'; @@ -64,7 +67,7 @@ const isProduction = process.env.NODE_ENV === 'production'; library.add(faCoffee, faTrash, faPencilAlt, faScroll, faCheck, faCircle, faList, faPlus, faDoorOpen, faCogs, faAt, faUser, faEnvelope, faUserTag, faExternalLinkAlt, faSync, faHome, faCode, faBarcode, faTag, faTags, faVideo, faLock, - faLockOpen, faArrowCircleLeft, faArrowCircleRight, faWrench, faPlay, faFrown, faSmile); + faLockOpen, faArrowCircleLeft, faArrowCircleRight, faWrench, faPlay, faFrown, faSmile, faThumbsUp, faThumbsDown); Vue.component('font-awesome-icon', FontAwesomeIcon); diff --git a/src/store.ts b/src/store.ts index 6323d0e..0d8a2b3 100644 --- a/src/store.ts +++ b/src/store.ts @@ -4,6 +4,8 @@ import createPersistedState from 'vuex-persistedstate'; import getRepository from '@/api/RepositoryFactory'; import RoomRepository from '@/api/roomRepository'; import RecordRepository from '@/api/recorderRepository'; +import VirtualCommandRepository from '@/api/virtualCommandRepository'; +import StateRepository from '@/api/stateRepository'; // imports of AJAX functions will go here import { @@ -27,6 +29,8 @@ const state = { recorders: [], recorderModels: [], recorderCommands: [], + recorderStates: [], + virtualCommands: [], loginProviders: [], currentSurvey: {}, profile: {}, @@ -68,6 +72,32 @@ const actions = { EventBus.$emit('failedLoadingRecorders', error); }); }, + loadRecorderStates(context: any) { + return StateRepository.getRecordersStates() + .then((response: any) => { + Vue.$log.debug(response); + Vue.$log.debug(response.data); + context.commit('setRecorderStates', {recorderStates: response.data}); + EventBus.$emit('recorderStatesLoaded', response.data); + }) + .catch((error: any) => { + Vue.$log.warn('Error loading recorders states!', error); + EventBus.$emit('failedLoadingRecorderStates', error); + }); + }, + loadRecorderState(context: any, recorder_id: number) { + return StateRepository.getRecorderState(recorder_id) + .then((response: any) => { + Vue.$log.debug(response); + Vue.$log.debug(response.data); + context.commit('setRecorderState', {recorderState: response.data}); + EventBus.$emit('recorderStateLoaded', response.data); + }) + .catch((error: any) => { + Vue.$log.warn('Error loading recorders states!', error); + EventBus.$emit('failedLoadingRecorderStates', error); + }); + }, loadRecorderModels(context: any) { return RecordRepository.getRecorderModels() .then((response: any) => { @@ -84,28 +114,28 @@ const actions = { }, loadRecorderCommands(context: any) { return RecordRepository.getRecorderCommands() - .then((response: any) => { - Vue.$log.debug(response); - Vue.$log.debug(response.data); - context.commit('setRecorderCommands', {recorderCommands: response.data}); - EventBus.$emit('recorderCommandsLoaded', response.data); - }) - .catch((error: any) => { - Vue.$log.warn('Error loading recorder commands!', error); - EventBus.$emit('failedLoadingRecorderCommands', error); - }); + .then((response: any) => { + Vue.$log.debug(response); + Vue.$log.debug(response.data); + context.commit('setRecorderCommands', {recorderCommands: response.data}); + EventBus.$emit('recorderCommandsLoaded', response.data); + }) + .catch((error: any) => { + Vue.$log.warn('Error loading recorder commands!', error); + EventBus.$emit('failedLoadingRecorderCommands', error); + }); }, loadVirtualCommands(context: any) { - return RecordRepository.getRecorderCommands() + return VirtualCommandRepository.getVirtualCommands() .then((response: any) => { Vue.$log.debug(response); Vue.$log.debug(response.data); - context.commit('setRecorderCommands', {recorderCommands: response.data}); - EventBus.$emit('recorderCommandsLoaded', response.data); + context.commit('setVirtualCommands', {virtualCommands: response.data}); + EventBus.$emit('virtualCommandsLoaded', response.data); }) .catch((error: any) => { - Vue.$log.warn('Error loading recorder commands!', error); - EventBus.$emit('failedLoadingRecorderCommands', error); + Vue.$log.warn('Error loading virtual commands!', error); + EventBus.$emit('failedLoadingVirtualCommands', error); }); }, loadCommands(context: any) { @@ -266,6 +296,27 @@ const mutations = { setRecorderCommands(sState: any, payload: any) { sState.recorderCommands = payload.recorderCommands; }, + setRecorderStates(sState: any, payload: any) { + sState.recorderStates = payload.recorderStates; + }, + setRecorderState(sState: any, payload: any) { + const n_rec_states = sState.recorderStates.length; + const rec_id = payload.recorderState.id; + let found = false; + for (let i = 0; i < n_rec_states; i++) { + if (sState.recorderStates[i].id === rec_id) { + sState.recorderStates[i] = payload.recorderState; + found = true; + break; + } + } + if(!found){ + sState.recorderStates.push(payload.recorderState); + } + }, + setVirtualCommands(sState: any, payload: any) { + sState.virtualCommands = payload.virtualCommands; + }, setUsers(sState: any, payload: any) { sState.users = payload.users; }, diff --git a/src/views/Home.vue b/src/views/Home.vue index 1c7b0ae..7d5b040 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -2,20 +2,19 @@
    - +
    -

    Welcome back {{$store.getters.getUserName}}! (Last seen: {{profile.last_seen | moment("dddd, MMMM Do YYYY")}}) +

    Welcome back {{$store.getters.getUserName}}!

    - +

    Last login: {{profile.last_seen | moment("dddd, MMMM Do YYYY")}}

    +
    +

    {{$t('Favorite recorders:')}}

    {{$t('Add favorite recorder:')}}

    - +
    -
    -

    {{$t('Favorite recorders:')}}

    @@ -81,5 +80,14 @@ diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue index 9434001..8d89dd0 100644 --- a/src/views/NotFound.vue +++ b/src/views/NotFound.vue @@ -7,7 +7,7 @@