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

Refresh status button

Browse Source
This commit is contained in:
Ildar Kamalov
2018-12-28 19:48:02 +03:00
parent 8b4a1ca713
commit 4aea91a70c
7 changed files with 172 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
client/src/components/Settings/Dhcp/Form.js
View File

@@ -49,16 +49,19 @@ const renderInterfaces = (interfaces => (
Object.keys(interfaces).map((item) => {
const option = interfaces[item];
const { name } = option;
const onlyIPv6 = option.ip_addresses.every(ip => ip.includes(':'));
let interfaceIP = option.ip_addresses[0];
option.ip_addresses.forEach((ip) => {
if (!ip.includes(':')) {
interfaceIP = ip;
}
});
if (!onlyIPv6) {
option.ip_addresses.forEach((ip) => {
if (!ip.includes(':')) {
interfaceIP = ip;
}
});
}
return (
<option value={name} key={name}>
<option value={name} key={name} disabled={onlyIPv6}>
{name} - {interfaceIP}
</option>
);
@@ -91,7 +94,6 @@ let Form = (props) => {
handleSubmit,
pristine,
submitting,
enabled,
interfaces,
processing,
interfaceValue,
@@ -106,7 +108,11 @@ let Form = (props) => {
<div className="col-sm-12 col-md-6">
<div className="form__group form__group--dhcp">
<label>{t('dhcp_interface_select')}</label>
<Field name="interface_name" component="select" className="form-control custom-select">
<Field
name="interface_name"
component="select"
className="form-control custom-select"
>
<option value="">{t('dhcp_interface_select')}</option>
{renderInterfaces(interfaces)}
</Field>
@@ -131,7 +137,6 @@ let Form = (props) => {
className="form-control"
placeholder={t('dhcp_form_gateway_input')}
validate={[ipv4, required]}
disabled={!enabled}
/>
</div>
<div className="form__group form__group--dhcp">
@@ -143,7 +148,6 @@ let Form = (props) => {
className="form-control"
placeholder={t('dhcp_form_subnet_input')}
validate={[ipv4, required]}
disabled={!enabled}
/>
</div>
</div>
@@ -161,7 +165,6 @@ let Form = (props) => {
className="form-control"
placeholder={t('dhcp_form_range_start')}
validate={[ipv4, required]}
disabled={!enabled}
/>
</div>
<div className="col">
@@ -172,7 +175,6 @@ let Form = (props) => {
className="form-control"
placeholder={t('dhcp_form_range_end')}
validate={[ipv4, required]}
disabled={!enabled}
/>
</div>
</div>
@@ -186,7 +188,6 @@ let Form = (props) => {
className="form-control"
placeholder={t('dhcp_form_lease_input')}
validate={[required, isPositive]}
disabled={!enabled}
normalize={toNumber}
/>
</div>
@@ -196,7 +197,7 @@ let Form = (props) => {
<button
type="submit"
className="btn btn-success btn-standart"
disabled={pristine || submitting || !enabled}
disabled={pristine || submitting}
>
{t('save_config')}
</button>
@@ -208,10 +209,10 @@ Form.propTypes = {
handleSubmit: PropTypes.func,
pristine: PropTypes.bool,
submitting: PropTypes.bool,
enabled: PropTypes.bool,
interfaces: PropTypes.object,
processing: PropTypes.bool,
interfaceValue: PropTypes.string,
initialValues: PropTypes.object,
t: PropTypes.func,
};

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

@@ -22,7 +22,12 @@ class Dhcp extends Component {
const buttonClass = config.enabled ? 'btn-gray' : 'btn-success';
return (
<button type="button" className={`btn btn-standart mr-2 ${buttonClass}`} onClick={() => this.props.toggleDhcp(config)}>
<button
type="button"
className={`btn btn-standart mr-2 ${buttonClass}`}
onClick={() => this.props.toggleDhcp(config)}
disabled={!config.interface_name}
>
<Trans>{buttonText}</Trans>
</button>
);
@@ -41,22 +46,6 @@ class Dhcp extends Component {
<Card title={ t('dhcp_title') } subtitle={ t('dhcp_description') } bodyType="card-body box-body--settings">
<div className="row">
<div className="col">
<div className="card-actions mt-0 mb-3">
{this.getToggleDhcpButton()}
<button
className={statusButtonClass}
type="button"
onClick={this.handleRefresh}
>
<Trans>refresh_status</Trans>
</button>
</div>
{dhcp.active && !dhcp.active.found &&
<div className="text-secondary">
<Trans>dhcp_not_found</Trans>
</div>
}
<hr/>
<Form
onSubmit={this.handleFormSubmit}
initialValues={dhcp.config}
@@ -64,6 +53,29 @@ class Dhcp extends Component {
interfaces={dhcp.interfaces}
processing={dhcp.processingInterfaces}
/>
<hr/>
<div className="card-actions mb-3">
{this.getToggleDhcpButton()}
<button
className={statusButtonClass}
type="button"
onClick={this.handleRefresh}
disabled={!dhcp.config.interface_name}
>
<Trans>refresh_status</Trans>
</button>
</div>
{dhcp.active &&
<div className="text-secondary">
{dhcp.active.found ? (
<span className="text-danger">
<Trans>dhcp_found</Trans>
</span>
) : (
<Trans>dhcp_not_found</Trans>
)}
</div>
}
</div>
</div>
</Card>