daxi20/AdGuardHome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

+ client: add table to show static leases

Browse Source
This commit is contained in:
Ildar Kamalov
2019-05-20 11:55:04 +03:00
committed by Simon Zolin
parent 49b91b4fc9
commit a8384c004e
4 changed files with 75 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
client/src/components/Settings/Dhcp/StaticLeases.js Normal file
View File

@@ -0,0 +1,49 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ReactTable from 'react-table';
import { Trans, withNamespaces } from 'react-i18next';
class StaticLeases extends Component {
cellWrap = ({ value }) => (
<div className="logs__row logs__row--overflow">
<span className="logs__text" title={value}>
{value}
</span>
</div>
);
render() {
const { staticLeases, t } = this.props;
return (
<ReactTable
data={staticLeases || []}
columns={[
{
Header: 'MAC',
accessor: 'mac',
Cell: this.cellWrap,
}, {
Header: 'IP',
accessor: 'ip',
Cell: this.cellWrap,
}, {
Header: <Trans>dhcp_table_hostname</Trans>,
accessor: 'hostname',
Cell: this.cellWrap,
},
]}
showPagination={false}
noDataText={t('dhcp_leases_not_found')}
minRows={6}
className="-striped -highlight card-table-overflow"
/>
);
}
}
StaticLeases.propTypes = {
staticLeases: PropTypes.array,
t: PropTypes.func,
};
export default withNamespaces()(StaticLeases);

22
client/src/components/Settings/Dhcp/index.js
View File

@@ -6,6 +6,7 @@ import { Trans, withNamespaces } from 'react-i18next';
import { DHCP_STATUS_RESPONSE } from '../../../helpers/constants';
import Form from './Form';
import Leases from './Leases';
import StaticLeases from './StaticLeases';
import Interface from './Interface';
import Card from '../../ui/Card';
import Accordion from '../../ui/Accordion';
@@ -211,13 +212,22 @@ class Dhcp extends Component {
</div>
</Card>
{!dhcp.processing && dhcp.config.enabled &&
<Card title={ t('dhcp_leases') } bodyType="card-body box-body--settings">
<div className="row">
<div className="col">
<Leases leases={dhcp.leases} />
<Fragment>
<Card title={ t('dhcp_leases') } bodyType="card-body box-body--settings">
<div className="row">
<div className="col">
<Leases leases={dhcp.leases} />
</div>
</div>
</div>
</Card>
</Card>
<Card title={ t('dhcp_static_leases') } bodyType="card-body box-body--settings">
<div className="row">
<div className="col">
<StaticLeases staticLeases={dhcp.staticLeases} />
</div>
</div>
</Card>
</Fragment>
}
</Fragment>
);