diff --git a/src/_services/device.service.js b/src/_services/device.service.js index 5d89a70..c270c5b 100644 --- a/src/_services/device.service.js +++ b/src/_services/device.service.js @@ -8,6 +8,7 @@ import { util } from '../_helpers'; export const deviceService = { getDevicesByUserId, getAllDevicesByUserId, + getAllDeviceTypesByUserId, getDeviceQRcodeById, getDeviceVPNconfById, addDeviceByUserId, @@ -22,6 +23,10 @@ function getAllDevicesByUserId(userId, messages, errors) { return fetch(`${config.apiUrl}/users/${userId}/devices?all`, util.getWithAuth()).then(util.handleCrudResponse(messages, errors)); } +function getAllDeviceTypesByUserId(userId, messages, errors) { + return fetch(`${config.apiUrl}/users/${userId}/deviceTypes`, util.getWithAuth()).then(util.handleCrudResponse(messages, errors)); +} + function getDeviceQRcodeById(userId, deviceId, messages, errors) { return fetch(`${config.apiUrl}/users/${userId}/devices/${deviceId}/vpn/QR.png.base64`, util.getWithAuth()).then(util.handlePlaintextResponse(messages, errors)); } diff --git a/src/_store/devices.module.js b/src/_store/devices.module.js index 6daad34..2091dfa 100644 --- a/src/_store/devices.module.js +++ b/src/_store/devices.module.js @@ -8,11 +8,12 @@ import { util } from '../_helpers'; const state = { loading: { devices: false, addDevice: false, removeDevice: false, - qrCode: false, vpnConf: false + qrCode: false, vpnConf: false, deviceTypes: false }, error: null, devices: [], device: null, + deviceTypes: null, qrCodeImageBase64: null, vpnConfBase64: null }; @@ -36,6 +37,15 @@ const actions = { ); }, + getAllDeviceTypesByUserId({ commit }, {userId, messages, errors}) { + commit('getAllDeviceTypesByUserIdRequest'); + deviceService.getAllDeviceTypesByUserId(userId, messages, errors) + .then( + devices => commit('getAllDeviceTypesByUserIdSuccess', devices), + error => commit('getAllDeviceTypesByUserIdFailure', error) + ); + }, + getDeviceQRcodeById({ commit }, {userId, deviceId, messages, errors}) { commit('getDeviceQRcodeByIdRequest'); deviceService.getDeviceQRcodeById(userId, deviceId, messages, errors) @@ -86,6 +96,18 @@ const mutations = { state.error = error; }, + getAllDeviceTypesByUserIdRequest(state) { + state.loading.deviceTypes = true; + }, + getAllDeviceTypesByUserIdSuccess(state, deviceTypes) { + state.loading.deviceTypes = false; + state.deviceTypes = deviceTypes; + }, + getAllDeviceTypesByUserIdFailure(state, error) { + state.loading.deviceTypes = false; + state.error = error; + }, + getDeviceQRcodeByIdRequest(state) { state.loading.qrCode = true; state.qrCodeImageBase64 = null; diff --git a/src/account/DevicesPage.vue b/src/account/DevicesPage.vue index a76651e..bee7fe7 100644 --- a/src/account/DevicesPage.vue +++ b/src/account/DevicesPage.vue @@ -8,8 +8,10 @@ {{messages.label_field_device_name}} + {{messages.label_field_device_type}} {{messages.label_field_device_vpn_config}} + {{messages.label_field_device_certificate}} {{messages.label_field_device_ctime}} @@ -17,8 +19,8 @@ {{device.name}} + {{messages['device_type_'+device.deviceType]}} - {{messages.label_device_ctime_format.parseDateMessage(device.ctime, messages)}}

{{device.name}}

@@ -41,6 +43,8 @@
+ {{messages['device_type_'+device.deviceType]}} + {{messages.label_device_ctime_format.parseDateMessage(device.ctime, messages)}} {{messages.button_label_remove_device}} @@ -62,9 +66,16 @@
{{ errors.first('deviceName') }}
+
+ + +
+
- +
@@ -73,6 +84,7 @@

{{messages.message_download_ca_cert}}

+ {{messages.message_os_macosx}} | {{messages.message_os_ios}} | {{messages.message_os_windows}} | @@ -105,6 +117,7 @@ userId: util.currentUser().uuid, submitted: false, deviceName: null, + deviceType: null, displayVpnConfig: {}, config: config, mitmLoading: true @@ -112,9 +125,12 @@ }, computed: { ...mapState('apps', ['mitmEnabled']), - ...mapState('devices', ['devices', 'device', 'qrCodeImageBase64', 'vpnConfBase64']), + ...mapState('devices', ['deviceTypes', 'devices', 'device', 'qrCodeImageBase64', 'vpnConfBase64']), ...mapState('system', ['messages']), - ...mapGetters('devices', ['loading']) + ...mapGetters('devices', ['loading']), + addDeviceReady: function () { + return this.deviceName !== null && this.deviceName !== '' && this.deviceType !== null && this.deviceType !== ''; + } }, created () { this.getMitmStatus({ @@ -127,11 +143,16 @@ messages: this.messages, errors: this.errors }); + this.getAllDeviceTypesByUserId({ + userId: this.userId, + messages: this.messages, + errors: this.errors + }) }, methods: { ...mapActions('apps', ['getMitmStatus', 'enableMitm', 'disableMitm']), ...mapActions('devices', [ - 'getDevicesByUserId', 'addDeviceByUserId', 'removeDeviceByUserId', + 'getAllDeviceTypesByUserId', 'getDevicesByUserId', 'addDeviceByUserId', 'removeDeviceByUserId', 'getDeviceQRcodeById', 'getDeviceVPNconfById' ]), addDevice () { @@ -140,7 +161,8 @@ this.addDeviceByUserId({ userId: this.userId, device: { - name: this.deviceName + name: this.deviceName, + deviceType: this.deviceType }, messages: this.messages, errors: this.errors @@ -206,8 +228,9 @@ watch: { device(dev) { if (dev) { - // after device added, clear device name field + // after device added, clear device fields this.deviceName = null; + this.deviceType = null; } }, mitmEnabled (m) {