Device configuration translation done

This commit is contained in:
bourquecharles
2021-06-14 17:29:08 -04:00
parent db2a7ee135
commit d81087e200
3 changed files with 53 additions and 28 deletions

View File

@@ -1,4 +1,5 @@
import React, { useState, useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import {
CCard,
CCardHeader,
@@ -23,6 +24,7 @@ import { getToken } from 'utils/authHelper';
import DeviceConfigurationModal from './DeviceConfigurationModal';
const DeviceConfiguration = ({ selectedDeviceId }) => {
const { t } = useTranslation();
const [collapse, setCollapse] = useState(false);
const [showModal, setShowModal] = useState(false);
const [device, setDevice] = useState(null);
@@ -62,10 +64,10 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
<CCard>
<CCardHeader>
<CRow>
<CCol>Device Details</CCol>
<CCol>{t("configuration.details")}</CCol>
<CCol>
<div style={{ float: 'right' }}>
<CPopover content="View raw JSON">
<CPopover content={t("configuration.view_json")}>
<CButton color="secondary" onClick={toggleModal} size="sm">
<CIcon content={cilWindowMaximize} />
</CButton>
@@ -83,7 +85,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
>
<CFormGroup row>
<CCol md="3">
<CLabel>UUID : </CLabel>
<CLabel>{t("common.uuid")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{device.UUID}
@@ -91,7 +93,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Serial Number : </CLabel>
<CLabel>{t("common.serial_number")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{device.serialNumber}
@@ -99,7 +101,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Device Type : </CLabel>
<CLabel>{t("configuration.type")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{device.deviceType}
@@ -107,7 +109,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Last Configuration Change : </CLabel>
<CLabel>{t("configuration.last_configuration_change")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{prettyDate(device.lastConfigurationChange)}
@@ -115,7 +117,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>MAC address :</CLabel>
<CLabel>{t("common.mac")} :</CLabel>
</CCol>
<CCol xs="12" md="9">
{device.macAddress}
@@ -123,7 +125,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Created : </CLabel>
<CLabel>{t("configuration.created")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{prettyDate(device.createdTimestamp)}
@@ -131,7 +133,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Last Configuration Download : </CLabel>
<CLabel>{t("configuration.last_configuration_download")} : </CLabel>
</CCol>
<CCol xs="12" md="9">
{prettyDate(device.lastConfigurationDownload)}
@@ -140,7 +142,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
<CCollapse show={collapse}>
<CFormGroup row>
<CCol md="3">
<CLabel>Manufacturer :</CLabel>
<CLabel>{t("common.manufacturer")} :</CLabel>
</CCol>
<CCol xs="12" md="9">
{device.manufacturer}
@@ -148,7 +150,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel htmlFor="text-input">Notes :</CLabel>
<CLabel htmlFor="text-input">{t("configuration.notes")} :</CLabel>
</CCol>
<CCol xs="12" md="9">
<CInput id="text-input" name="text-input" placeholder={device.notes} />
@@ -156,7 +158,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Owner :</CLabel>
<CLabel>{t("configuration.owner")} :</CLabel>
</CCol>
<CCol xs="12" md="9">
{device.owner}
@@ -164,7 +166,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Location :</CLabel>
<CLabel>{t("configuration.location")} :</CLabel>
</CCol>
<CCol xs="12" md="9">
{device.location}
@@ -190,7 +192,7 @@ const DeviceConfiguration = ({ selectedDeviceId }) => {
return (
<CCard>
<CCardHeader>Device Configuration</CCardHeader>
<CCardHeader>{t("configuration.details")}</CCardHeader>
<CCardBody />
</CCard>
);