mirror of
https://github.com/OpenNebula/one.git
synced 2025-03-16 22:50:10 +03:00
parent
bedf1ab6f3
commit
377aa9afa4
@ -0,0 +1,83 @@
|
||||
/* ------------------------------------------------------------------------- *
|
||||
* Copyright 2002-2021, OpenNebula Project, OpenNebula Systems *
|
||||
* *
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may *
|
||||
* not use this file except in compliance with the License. You may obtain *
|
||||
* a copy of the License at *
|
||||
* *
|
||||
* http://www.apache.org/licenses/LICENSE-2.0 *
|
||||
* *
|
||||
* Unless required by applicable law or agreed to in writing, software *
|
||||
* distributed under the License is distributed on an "AS IS" BASIS, *
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. *
|
||||
* See the License for the specific language governing permissions and *
|
||||
* limitations under the License. *
|
||||
* ------------------------------------------------------------------------- */
|
||||
import { memo } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
|
||||
import { FormControl, FormControlLabel, Switch } from '@material-ui/core'
|
||||
import { Controller } from 'react-hook-form'
|
||||
|
||||
import { ErrorHelper, Tooltip } from 'client/components/FormControl'
|
||||
import { Tr } from 'client/components/HOC'
|
||||
|
||||
const SwitchController = memo(
|
||||
({ control, cy, name, label, tooltip, error, fieldProps }) => (
|
||||
<Controller
|
||||
render={({ onChange, value = false }) => (
|
||||
<FormControl error={Boolean(error)} margin='dense'>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
onChange={e => onChange(e.target.checked)}
|
||||
name={name}
|
||||
checked={Boolean(value)}
|
||||
color='secondary'
|
||||
inputProps={{ 'data-cy': cy }}
|
||||
{...fieldProps}
|
||||
/>
|
||||
}
|
||||
label={
|
||||
<span style={{ display: 'flex', alignItems: 'center', gap: '0.5em' }}>
|
||||
{Tr(label)}
|
||||
{tooltip && <Tooltip title={tooltip} />}
|
||||
</span>
|
||||
}
|
||||
labelPlacement='end'
|
||||
/>
|
||||
{Boolean(error) && <ErrorHelper label={error?.message} />}
|
||||
</FormControl>
|
||||
)}
|
||||
name={name}
|
||||
control={control}
|
||||
/>
|
||||
),
|
||||
(prevProps, nextProps) => prevProps.error === nextProps.error
|
||||
)
|
||||
|
||||
SwitchController.propTypes = {
|
||||
control: PropTypes.object,
|
||||
cy: PropTypes.string,
|
||||
name: PropTypes.string.isRequired,
|
||||
label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
|
||||
tooltip: PropTypes.string,
|
||||
error: PropTypes.oneOfType([
|
||||
PropTypes.bool,
|
||||
PropTypes.objectOf(PropTypes.any)
|
||||
]),
|
||||
fieldProps: PropTypes.object
|
||||
}
|
||||
|
||||
SwitchController.defaultProps = {
|
||||
control: {},
|
||||
cy: 'cy',
|
||||
name: '',
|
||||
label: '',
|
||||
values: [],
|
||||
error: false
|
||||
}
|
||||
|
||||
SwitchController.displayName = 'SwitchController'
|
||||
|
||||
export default SwitchController
|
@ -19,6 +19,7 @@ import FileController from 'client/components/FormControl/FileController'
|
||||
import PasswordController from 'client/components/FormControl/PasswordController'
|
||||
import SelectController from 'client/components/FormControl/SelectController'
|
||||
import SliderController from 'client/components/FormControl/SliderController'
|
||||
import SwitchController from 'client/components/FormControl/SwitchController'
|
||||
import TextController from 'client/components/FormControl/TextController'
|
||||
import TimeController from 'client/components/FormControl/TimeController'
|
||||
|
||||
@ -34,6 +35,7 @@ export {
|
||||
PasswordController,
|
||||
SelectController,
|
||||
SliderController,
|
||||
SwitchController,
|
||||
TextController,
|
||||
TimeController,
|
||||
|
||||
|
@ -40,6 +40,7 @@ const INPUT_CONTROLLER = {
|
||||
[INPUT_TYPES.PASSWORD]: FC.PasswordController,
|
||||
[INPUT_TYPES.SELECT]: FC.SelectController,
|
||||
[INPUT_TYPES.SLIDER]: FC.SliderController,
|
||||
[INPUT_TYPES.SWITCH]: FC.SwitchController,
|
||||
[INPUT_TYPES.CHECKBOX]: FC.CheckboxController,
|
||||
[INPUT_TYPES.AUTOCOMPLETE]: FC.AutocompleteController,
|
||||
[INPUT_TYPES.FILE]: FC.FileController,
|
||||
|
@ -22,7 +22,22 @@ import { INPUT_TYPES } from 'client/constants'
|
||||
const RDP_FIELD = {
|
||||
name: 'RDP',
|
||||
label: 'RDP connection',
|
||||
type: INPUT_TYPES.CHECKBOX,
|
||||
type: INPUT_TYPES.SWITCH,
|
||||
validation: yup
|
||||
.boolean()
|
||||
.transform(value => {
|
||||
if (typeof value === 'boolean') return value
|
||||
|
||||
return String(value).toUpperCase() === 'YES'
|
||||
})
|
||||
.default(false),
|
||||
grid: { md: 12 }
|
||||
}
|
||||
|
||||
const SSH_FIELD = {
|
||||
name: 'SSH',
|
||||
label: 'SSH connection',
|
||||
type: INPUT_TYPES.SWITCH,
|
||||
validation: yup
|
||||
.boolean()
|
||||
.transform(value => {
|
||||
@ -65,7 +80,7 @@ const ALIAS_FIELD = ({ nics = [] } = {}) => ({
|
||||
const EXTERNAL_FIELD = {
|
||||
name: 'EXTERNAL',
|
||||
label: 'External',
|
||||
type: INPUT_TYPES.CHECKBOX,
|
||||
type: INPUT_TYPES.SWITCH,
|
||||
tooltip: 'The NIC will be attached as an external alias of the VM',
|
||||
dependOf: ALIAS_FIELD().name,
|
||||
htmlType: type => !type?.length ? INPUT_TYPES.HIDDEN : undefined,
|
||||
@ -81,6 +96,7 @@ const EXTERNAL_FIELD = {
|
||||
|
||||
export const FIELDS = props => [
|
||||
RDP_FIELD,
|
||||
SSH_FIELD,
|
||||
ALIAS_FIELD(props),
|
||||
EXTERNAL_FIELD
|
||||
]
|
||||
|
@ -45,7 +45,7 @@ const INSTANCES = {
|
||||
const HOLD = {
|
||||
name: 'hold',
|
||||
label: 'Start VM on hold state',
|
||||
type: INPUT_TYPES.CHECKBOX,
|
||||
type: INPUT_TYPES.SWITCH,
|
||||
tooltip: `
|
||||
Sets the new VM to hold state, instead of pending.
|
||||
The scheduler will not deploy VMs in this state.
|
||||
@ -57,7 +57,7 @@ const HOLD = {
|
||||
const PERSISTENT = {
|
||||
name: 'persistent',
|
||||
label: 'Instantiate as persistent',
|
||||
type: INPUT_TYPES.CHECKBOX,
|
||||
type: INPUT_TYPES.SWITCH,
|
||||
tooltip: `
|
||||
Creates a private persistent copy of the template
|
||||
plus any image defined in DISK, and instantiates that copy.`,
|
||||
|
@ -60,6 +60,7 @@ export const FILTER_POOL = {
|
||||
export const INPUT_TYPES = {
|
||||
AUTOCOMPLETE: 'autocomplete',
|
||||
CHECKBOX: 'checkbox',
|
||||
SWITCH: 'switch',
|
||||
FILE: 'file',
|
||||
TIME: 'time',
|
||||
HIDDEN: 'hidden',
|
||||
|
Loading…
x
Reference in New Issue
Block a user