scottk/wlan-cloud-ucentralgw-ui
1
0
Fork 0
mirror of https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui.git synced 2025-10-30 02:12:33 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

CSS cleanup, trace waiting now deals with errors

Browse Source
This commit is contained in:
BourqueCharles
2021-08-16 10:15:21 -04:00
parent 4d373fb1c7
commit bb03f0d250
29 changed files with 38 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "ucentral-client",
"version": "2.0.25",
"version": "2.0.26",
"dependencies": {
"@coreui/coreui": "^3.4.0",
"@coreui/icons": "^2.0.1",

1
public/locales/de/translation.json
View File

@@ -302,6 +302,7 @@
"packets": "Pakete",
"title": "Tcpdump",
"trace": "Spur",
"trace_not_successful": "Trace nicht erfolgreich: Gateway hat folgenden Fehler gemeldet: {{error}}",
"wait_for_file": "Möchten Sie warten, bis die Trace-Datei fertig ist?",
"waiting_directions": "Bitte warten Sie auf die Trace-Datendatei. Dies könnte eine Weile dauern. Sie können das Warten beenden und die Ablaufverfolgungsdatei später aus der Befehlstabelle abrufen.",
"waiting_seconds": "Verstrichene Zeit: {{seconds}} Sekunden"

1
public/locales/en/translation.json
View File

@@ -302,6 +302,7 @@
"packets": "Packets",
"title": "Trace",
"trace": "Trace",
"trace_not_successful": "Trace not successful: gateway reported the following error : {{error}}",
"wait_for_file": "Would you like to wait until the trace file is ready?",
"waiting_directions": "Please wait for the trace data file. This may take some time. You can exit the wait and retrieve the trace file from the commands table later.",
"waiting_seconds": "Time Elapsed: {{seconds}} seconds"

1
public/locales/es/translation.json
View File

@@ -302,6 +302,7 @@
"packets": "Paquetes",
"title": "Rastro",
"trace": "Rastro",
"trace_not_successful": "Seguimiento fallido: la puerta de enlace informó el siguiente error: {{error}}",
"wait_for_file": "¿Le gustaría esperar hasta que el archivo de seguimiento esté listo?",
"waiting_directions": "Espere el archivo de datos de seguimiento. Esto puede tomar algo de tiempo. Puede salir de la espera y recuperar el archivo de seguimiento de la tabla de comandos más tarde.",
"waiting_seconds": "Tiempo transcurrido: {{seconds}} segundos"

1
public/locales/fr/translation.json
View File

@@ -302,6 +302,7 @@
"packets": "Paquets",
"title": "Trace",
"trace": "Trace",
"trace_not_successful": "Trace non réussie : la passerelle a signalé l'erreur suivante : {{error}}",
"wait_for_file": "Souhaitez-vous attendre que le fichier de trace soit prêt ?",
"waiting_directions": "Veuillez attendre le fichier de données de trace. Cela peut prendre un certain temps. Vous pouvez quitter l'attente et récupérer le fichier de trace de la table des commandes plus tard.",
"waiting_seconds": "Temps écoulé : {{seconds}} secondes"

1
public/locales/pt/translation.json
View File

@@ -302,6 +302,7 @@
"packets": "Pacotes",
"title": "Vestígio",
"trace": "Vestígio",
"trace_not_successful": "O rastreamento não foi bem-sucedido: o gateway relatou o seguinte erro: {{error}}",
"wait_for_file": "Você gostaria de esperar até que o arquivo de rastreamento esteja pronto?",
"waiting_directions": "Aguarde o arquivo de dados de rastreamento. Isto pode tomar algum tempo. Você pode sair da espera e recuperar o arquivo de rastreamento da tabela de comandos mais tarde.",
"waiting_seconds": "Tempo decorrido: {{seconds}} segundos"

11
src/components/CommandHistory/index.js
View File

@@ -292,12 +292,7 @@ const DeviceCommands = () => {
<CCol className="text-right">
<div>
<CButton onClick={refreshCommands} size="sm">
<CIcon
name="cil-sync"
content={cilSync}
className={styles.whiteIcon}
size="2xl"
/>
<CIcon name="cil-sync" content={cilSync} className="text-white" size="2xl" />
</CButton>
</div>
</CCol>
@@ -318,7 +313,7 @@ const DeviceCommands = () => {
loading={loading}
items={commands ?? []}
fields={columns}
className={styles.whiteIcon}
className="text-white"
sorterValue={{ column: 'created', desc: 'true' }}
scopedSlots={{
completed: (item) => (
@@ -434,7 +429,7 @@ const DeviceCommands = () => {
<CButton show={collapse ? 'true' : 'false'} color="transparent" onClick={toggle} block>
<CIcon
name={collapse ? 'cilChevronTop' : 'cilChevronBottom'}
className={styles.whiteIcon}
className="text-white"
size="lg"
/>
</CButton>

4
src/components/CommandHistory/index.module.scss
View File

@@ -6,10 +6,6 @@
height: 200px;
}
.whiteIcon {
color: white;
}
.customIconHeight {
height: 19px;
}

3
src/components/ConfirmModal/index.js
View File

@@ -11,7 +11,6 @@ import {
CBadge,
} from '@coreui/react';
import PropTypes from 'prop-types';
import styles from './index.module.scss';
const ConfirmModal = ({ show, toggle, action }) => {
const { t } = useTranslation();
@@ -63,7 +62,7 @@ const ConfirmModal = ({ show, toggle, action }) => {
}, [show]);
return (
<CModal className={styles.modal} show={show} onClose={toggle}>
<CModal className="text-dark" show={show} onClose={toggle}>
<CModalHeader closeButton>
<CModalTitle>{t('delete_command.title')}</CModalTitle>
</CModalHeader>

3
src/components/ConfirmModal/index.module.scss
View File

@@ -1,3 +0,0 @@
.modal {
color: #3c4b64;
}

3
src/components/DeleteLogModal/index.js
View File

@@ -7,7 +7,6 @@ import { ConfirmFooter, useAuth, useDevice } from 'ucentral-libs';
import { dateToUnix } from 'utils/helper';
import axiosInstance from 'utils/axiosInstance';
import eventBus from 'utils/eventBus';
import styles from './index.module.scss';
const DeleteLogModal = ({ show, toggle, object }) => {
const { t } = useTranslation();
@@ -54,7 +53,7 @@ const DeleteLogModal = ({ show, toggle, object }) => {
}, [show]);
return (
<CModal className={styles.modal} show={show} onClose={toggle}>
<CModal className="text-dark" show={show} onClose={toggle}>
<CModalHeader closeButton>
<CModalTitle>
{object === 'healthchecks'

3
src/components/DeleteLogModal/index.module.scss
View File

@@ -1,3 +0,0 @@
.modal {
color: #3c4b64;
}

3
src/components/DeviceConfiguration/DeviceConfigurationModal.js
View File

@@ -10,14 +10,13 @@ import {
} from '@coreui/react';
import PropTypes from 'prop-types';
import { Translation } from 'react-i18next';
import styles from './index.module.scss';
const DeviceConfigurationModal = ({ show, toggle, configuration }) => (
<Translation>
{(t) => (
<CModal size="lg" show={show} onClose={toggle}>
<CModalHeader closeButton>
<CModalTitle className={styles.modalTitle}>{t('configuration.title')}</CModalTitle>
<CModalTitle className="text-dark">{t('configuration.title')}</CModalTitle>
</CModalHeader>
<CModalBody>
<pre className="ignore">{JSON.stringify(configuration, null, 4)}</pre>

3
src/components/DeviceConfiguration/index.js
View File

@@ -24,7 +24,6 @@ import {
useDevice,
} from 'ucentral-libs';
import DeviceConfigurationModal from './DeviceConfigurationModal';
import styles from './index.module.scss';
const DeviceConfiguration = () => {
const { t } = useTranslation();
@@ -241,7 +240,7 @@ const DeviceConfiguration = () => {
<CCardFooter>
<CButton show={collapse ? 'true' : 'false'} onClick={toggle} block>
<CIcon
className={styles.blackIcon}
className="text-dark"
name={collapse ? 'cilChevronTop' : 'cilChevronBottom'}
size="lg"
/>

7
src/components/DeviceConfiguration/index.module.scss
View File

@@ -1,7 +0,0 @@
.blackIcon {
color: black;
}
.modalTitle {
color: black;
}

7
src/components/DeviceHealth/index.js
View File

@@ -20,7 +20,6 @@ import axiosInstance from 'utils/axiosInstance';
import eventBus from 'utils/eventBus';
import { LoadingButton, useAuth, useDevice } from 'ucentral-libs';
import DeleteLogModal from 'components/DeleteLogModal';
import styles from './index.module.scss';
const DeviceHealth = () => {
const { t } = useTranslation();
@@ -226,12 +225,12 @@ const DeviceHealth = () => {
</CCol>
</CRow>
<CCard className="p-0">
<div className={[styles.scrollable, 'overflow-auto'].join(' ')}>
<div className="overflow-auto" style={{ height: '250px' }}>
<CDataTable
border
items={healthChecks ?? []}
fields={columns}
className={styles.dataTable}
className="text-white"
loading={loading}
sorterValue={{ column: 'recorded', desc: 'true' }}
scopedSlots={{
@@ -282,7 +281,7 @@ const DeviceHealth = () => {
<CButton show={collapse ? 'true' : 'false'} color="transparent" onClick={toggle} block>
<CIcon
name={collapse ? 'cilChevronTop' : 'cilChevronBottom'}
className={styles.icon}
className="text-white"
size="lg"
/>
</CButton>

11
src/components/DeviceHealth/index.module.scss
View File

@@ -1,11 +0,0 @@
.icon {
color: white;
}
.dataTable {
color: white;
}
.scrollable {
height: 250px;
}

7
src/components/DeviceLogs/index.js
View File

@@ -19,7 +19,6 @@ import axiosInstance from 'utils/axiosInstance';
import eventBus from 'utils/eventBus';
import { LoadingButton, useAuth, useDevice } from 'ucentral-libs';
import DeleteLogModal from 'components/DeleteLogModal';
import styles from './index.module.scss';
const DeviceLogs = () => {
const { t } = useTranslation();
@@ -204,12 +203,12 @@ const DeviceLogs = () => {
</CCol>
</CRow>
<CCard>
<div className={[styles.scrollableCard, 'overflow-auto'].join(' ')}>
<div className="overflow-auto" style={{ height: '250px' }}>
<CDataTable
items={logs ?? []}
fields={columns}
loading={loading}
className={styles.whiteIcon}
className="text-white"
sorterValue={{ column: 'recorded', desc: 'true' }}
scopedSlots={{
recorded: (item) => <td>{prettyDate(item.recorded)}</td>,
@@ -255,7 +254,7 @@ const DeviceLogs = () => {
<CButton show={collapse ? 'true' : 'false'} color="transparent" onClick={toggle} block>
<CIcon
name={collapse ? 'cilChevronTop' : 'cilChevronBottom'}
className={styles.whiteIcon}
className="text-white"
size="lg"
/>
</CButton>

7
src/components/DeviceLogs/index.module.scss
View File

@@ -1,7 +0,0 @@
.whiteIcon {
color: white;
}
.scrollableCard {
height: 250px;
}

3
src/components/InterfaceStatistics/LatestStatisticsModal.js
View File

@@ -11,7 +11,6 @@ import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import axiosInstance from 'utils/axiosInstance';
import { useAuth, useDevice } from 'ucentral-libs';
import styles from './index.module.scss';
const LatestStatisticsModal = ({ show, toggle }) => {
const { t } = useTranslation();
@@ -47,7 +46,7 @@ const LatestStatisticsModal = ({ show, toggle }) => {
return (
<CModal size="lg" show={show} onClose={toggle}>
<CModalHeader closeButton>
<CModalTitle className={styles.modalTitle}>{t('statistics.latest_statistics')}</CModalTitle>
<CModalTitle className="text-dark">{t('statistics.latest_statistics')}</CModalTitle>
</CModalHeader>
<CModalBody>
<pre className="ignore">{JSON.stringify(latestStats, null, 4)}</pre>

3
src/components/InterfaceStatistics/index.module.scss
View File

@@ -1,3 +0,0 @@
.modalTitle {
color: black;
}

18
src/components/TraceModal/WaitingForTraceBody.js
View File

@@ -1,17 +1,16 @@
import React, { useState, useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import PropTypes from 'prop-types';
import { CModalBody, CButton, CSpinner, CModalFooter } from '@coreui/react';
import { CAlert, CModalBody, CButton, CSpinner, CModalFooter } from '@coreui/react';
import { useAuth } from 'ucentral-libs';
import axiosInstance from 'utils/axiosInstance';
import styles from './index.module.scss';
const WaitingForTraceBody = ({ serialNumber, commandUuid, toggle }) => {
const { t } = useTranslation();
const { currentToken, endpoints } = useAuth();
const [secondsElapsed, setSecondsElapsed] = useState(0);
const [waitingForFile, setWaitingForFile] = useState(true);
const [error, setError] = useState(null);
const getTraceResult = () => {
const options = {
@@ -27,6 +26,10 @@ const WaitingForTraceBody = ({ serialNumber, commandUuid, toggle }) => {
if (response.data.waitingForFile === 0) {
setWaitingForFile(false);
}
if (response.data.errorCode !== 0) {
setWaitingForFile(false);
setError(response.data.errorText);
}
})
.catch(() => {});
};
@@ -83,16 +86,19 @@ const WaitingForTraceBody = ({ serialNumber, commandUuid, toggle }) => {
<CModalBody>
<h6>{t('trace.waiting_seconds', { seconds: secondsElapsed })}</h6>
<p>{t('trace.waiting_directions')}</p>
<div className={styles.centerDiv}>
<div className="d-flex align-middle justify-content-center">
<CSpinner hidden={!waitingForFile} />
<CButton
hidden={waitingForFile}
hidden={waitingForFile || error}
onClick={downloadTrace}
disabled={waitingForFile}
disabled={waitingForFile || error}
color="primary"
>
{t('trace.download_trace')}
</CButton>
<CAlert hidden={waitingForFile || !error} className="my-3" color="danger">
{t('trace.trace_not_successful', { error })}
</CAlert>
</div>
</CModalBody>
<CModalFooter>

6
src/components/TraceModal/index.module.scss
View File

@@ -1,6 +0,0 @@
.centerDiv {
display: flex;
justify-content: center;
align-items: center;
height: 20px;
}

3
src/components/WifiScanModal/index.js
View File

@@ -19,7 +19,6 @@ import eventBus from 'utils/eventBus';
import { LoadingButton, useAuth, useDevice } from 'ucentral-libs';
import WifiChannelTable from 'components/WifiScanResultModal/WifiChannelTable';
import 'react-widgets/styles.css';
import styles from './index.module.scss';
const WifiScanModal = ({ show, toggleModal }) => {
const { t } = useTranslation();
@@ -171,7 +170,7 @@ const WifiScanModal = ({ show, toggleModal }) => {
</CCol>
</CRow>
<CRow>
<CCol className={styles.centerDiv}>
<CCol className="d-flex align-middle justify-content-center">
<CSpinner />
</CCol>
</CRow>

6
src/components/WifiScanModal/index.module.scss
View File

@@ -1,6 +0,0 @@
.centerDiv {
display: flex;
justify-content: center;
align-items: center;
height: 20px;
}

7
src/components/WifiScanResultModal/WifiChannelCard.js
View File

@@ -3,7 +3,6 @@ import React from 'react';
import { useTranslation } from 'react-i18next';
import PropTypes from 'prop-types';
import 'react-widgets/styles.css';
import styles from './index.module.scss';
const WifiChannelCard = ({ channel }) => {
const { t } = useTranslation();
@@ -12,13 +11,13 @@ const WifiChannelCard = ({ channel }) => {
return (
<CCard>
<CCardHeader>
<CCardTitle className={styles.cardTitle}>
<CCardTitle className="text-dark">
{t('scan.channel')} #{channel.channel}
</CCardTitle>
</CCardHeader>
<CCardBody>
<div className={[styles.scrollable, 'overflow-auto'].join(' ')}>
<CDataTable items={channel.devices} fields={columns} className={styles.datatable} />
<div className="overflow-auto" style={{ height: '250px' }}>
<CDataTable items={channel.devices} fields={columns} className="text-white" />
</div>
</CCardBody>
</CCard>

3
src/components/WifiScanResultModal/index.js
View File

@@ -12,7 +12,6 @@ import {
import PropTypes from 'prop-types';
import { prettyDate } from 'utils/helper';
import WifiChannelTable from './WifiChannelTable';
import styles from './index.module.scss';
const WifiScanResultModal = ({ show, toggle, scanResults, date }) => {
const { t } = useTranslation();
@@ -50,7 +49,7 @@ const WifiScanResultModal = ({ show, toggle, scanResults, date }) => {
return (
<CModal size="lg" show={show} onClose={toggle}>
<CModalHeader closeButton>
<CModalTitle className={styles.modalTitle}>
<CModalTitle className="text-dark">
{date !== '' ? prettyDate(date) : ''} {t('scan.results')}
</CModalTitle>
</CModalHeader>

15
src/components/WifiScanResultModal/index.module.scss
View File

@@ -1,15 +0,0 @@
.modalTitle {
color: black;
}
.cardTitle {
color: black;
}
.scrollable {
height: 250px;
}
.datatable {
color: white;
}

2
src/layout/index.js
View File

@@ -89,7 +89,7 @@ const TheLayout = () => {
<PageContainer t={t} routes={routes} redirectTo="/devices" />
</ToastProvider>
</div>
<Footer t={t} version="2.0.25" />
<Footer t={t} version="2.0.26" />
</div>
</div>
);