-
Notifications
You must be signed in to change notification settings - Fork 356
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Reconfigure form angular to react conversion
- Loading branch information
1 parent
622dd7d
commit 9268a85
Showing
32 changed files
with
44,699 additions
and
1,308 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,4 +1,37 @@ | ||
module VmInfraHelper | ||
include VmHelper | ||
include DataTableHelper | ||
|
||
# rubocop:disable Rails/HelperInstanceVariable | ||
def reconfigure_form_data(vm = @reconfigitems.first) | ||
{ | ||
:recordId => @reconfigitems.collect(&:id), | ||
:requestId => @request_id || 'new', | ||
:roles => { | ||
:allowMemoryChange => role_allows?(:feature => 'vm_reconfigure_memory'), | ||
:allowCpuChange => role_allows?(:feature => 'vm_reconfigure_cpu'), | ||
:allowDiskChange => role_allows?(:feature => 'vm_reconfigure_disks') && item_supports?(:reconfigure_disks), | ||
:allowDiskSizeChange => item_supports?(:reconfigure_disksize), | ||
:allowNetworkChange => item_supports?(:reconfigure_network_adapters) && role_allows?(:feature => 'vm_reconfigure_networks'), | ||
:allowCdromsChange => item_supports?(:reconfigure_cdroms) && role_allows?(:feature => 'vm_reconfigure_drives'), | ||
:isVmwareInfra => vm.vendor == 'vmware' && vm.type.include?('InfraManager'), | ||
:isVmwareCloud => vm.vendor == 'vmware' && vm.type.include?('CloudManager'), | ||
:isRedhat => vm.vendor == 'redhat', | ||
}, | ||
:memory => { | ||
:min => @reconfig_limits[:min__vm_memory], | ||
:max => @reconfig_limits[:max__vm_memory], | ||
:max_cpu => @reconfig_limits[:max__total_vcpus], | ||
}, | ||
:options => { | ||
:controller_types => @reconfigitems.first.try(:scsi_controller_types) || [], | ||
:vlan_options => @vlan_options || [], | ||
:avail_adapter_names => @avail_adapter_names || [], | ||
:host_file_options => @iso_options || [], | ||
:socket_options => @socket_options || [], | ||
:cores_options => @cores_options || [], | ||
} | ||
} | ||
end | ||
# rubocop:enable Rails/HelperInstanceVariable | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
118 changes: 118 additions & 0 deletions
118
app/javascript/components/reconfigure-vm-form/disk-form-fields.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,118 @@ | ||
import { componentTypes, validatorTypes } from '@@ddf'; | ||
import { restructureOptions } from './helper'; | ||
import { TYPES, getCellData, getObjectData } from './helpers/general'; | ||
|
||
const getSwitchData = (row, field) => (getCellData(row, field) === 'Yes'); | ||
|
||
const nameField = (data) => ({ | ||
component: componentTypes.TEXT_FIELD, | ||
id: 'name', | ||
name: 'name', | ||
label: __('Name'), | ||
isReadOnly: true, | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'name') : '', | ||
hideField: data.form.action === 'add', | ||
}); | ||
|
||
const sizeField = (data) => ({ | ||
component: componentTypes.TEXT_FIELD, | ||
id: 'size', | ||
name: 'size', | ||
label: __('Size'), | ||
isRequired: true, | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'size') : '', | ||
validate: [ | ||
{ | ||
type: 'diskMemoryCheck', | ||
size: data.form.action === TYPES.RESIZE ? Number(getObjectData(data.editingRow.id.substring(4), data.dataTable.disks, 'orgHdSize')) + 1 : 1, | ||
unit: data.form.action === TYPES.RESIZE ? getObjectData(data.editingRow.id.substring(4), data.dataTable.disks, 'orgHdUnit') : __('MB'), | ||
}, | ||
], | ||
}); | ||
|
||
const unitField = (data) => ({ | ||
component: componentTypes.SELECT, | ||
id: 'unit', | ||
name: 'unit', | ||
label: __('Unit'), | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'unit') : '', | ||
options: restructureOptions([__('GB'), __('MB')]), | ||
}); | ||
|
||
const typeField = (data) => ({ | ||
component: componentTypes.SELECT, | ||
id: 'type', | ||
name: 'type', | ||
label: __('Type'), | ||
autoFocus: true, | ||
options: restructureOptions(['thin', 'thick']), | ||
validate: [{ type: validatorTypes.REQUIRED }], | ||
isReadOnly: data.form.action !== 'add', | ||
isRequired: true, | ||
placeholder: __('<Choose>'), | ||
includeEmpty: true, | ||
disabled: data.form.action === TYPES.RESIZE, | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'type') : '', | ||
}); | ||
|
||
const modeField = (data, roles) => ({ | ||
component: componentTypes.SELECT, | ||
id: 'mode', | ||
name: 'mode', | ||
label: __('Mode'), | ||
options: restructureOptions(['persistent', 'nonpersistent']), | ||
isReadOnly: data.form.action !== 'add', | ||
hideField: !roles.isVmwareInfra, | ||
isRequired: true, | ||
placeholder: __('<Choose>'), | ||
includeEmpty: true, | ||
disabled: data.form.action === TYPES.RESIZE, | ||
validate: [{ type: 'customRequired', hideField: !roles.isVmwareInfra }], | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'mode') : '', | ||
}); | ||
|
||
const controllerField = (data, roles, options) => ({ | ||
component: componentTypes.SELECT, | ||
id: 'controller', | ||
name: 'controller', | ||
label: __('Controller'), | ||
options: restructureOptions(options), | ||
isReadOnly: data.form.action !== 'add', | ||
hideField: !roles.isVmwareInfra, | ||
disabled: data.form.action === TYPES.RESIZE, | ||
initialValue: data.form.action === TYPES.RESIZE ? getCellData(data.editingRow, 'controller') : '', | ||
}); | ||
|
||
const dependentField = (data, roles) => ({ | ||
component: 'switch', | ||
id: 'dependent', | ||
name: 'dependent', | ||
label: __('Dependent'), | ||
onText: __('Yes'), | ||
offText: __('No'), | ||
hideField: !roles.isVmwareInfra, | ||
disabled: data.form.action === TYPES.RESIZE, | ||
initialValue: data.form.action === TYPES.RESIZE ? getSwitchData(data.editingRow, 'dependent') : '', | ||
}); | ||
|
||
const bootableField = (data, roles) => ({ | ||
component: 'switch', | ||
name: 'bootable', | ||
label: __('Bootable'), | ||
onText: __('Yes'), | ||
offText: __('No'), | ||
isReadOnly: data.form.action !== 'add', | ||
hideField: !roles.isRedhat, | ||
initialValue: data.form.action === TYPES.RESIZE ? getSwitchData(data.editingRow, 'bootable') : '', | ||
}); | ||
|
||
export const diskFormFields = (data, roles, options, memory) => ([ | ||
nameField(data), | ||
typeField(data), | ||
sizeField(data), | ||
unitField(data, memory), | ||
modeField(data, roles), | ||
controllerField(data, roles, options.controller_types), | ||
dependentField(data, roles), | ||
bootableField(data, roles), | ||
]); |
31 changes: 31 additions & 0 deletions
31
app/javascript/components/reconfigure-vm-form/drive-form-fields.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
import { componentTypes, validatorTypes } from '@@ddf'; | ||
import { restructureOptions } from './helper'; | ||
import { getCellData } from './helpers/general'; | ||
|
||
const nameField = (data) => ({ | ||
component: componentTypes.TEXT_FIELD, | ||
id: 'name', | ||
name: 'name', | ||
label: __('Name'), | ||
initialValue: getCellData(data.editingRow, 'name'), | ||
autoFocus: true, | ||
isReadOnly: true, | ||
}); | ||
|
||
const hostField = (data, options) => ({ | ||
component: componentTypes.SELECT, | ||
id: 'host_file', | ||
name: 'host_file', | ||
label: __('Host File'), | ||
options: restructureOptions(options), | ||
validate: [{ type: validatorTypes.REQUIRED }], | ||
isRequired: true, | ||
placeholder: __('<Choose>'), | ||
includeEmpty: true, | ||
initialValue: getCellData(data.editingRow, 'hostFile'), | ||
}); | ||
|
||
export const driveFormFields = (data, options) => ([ | ||
nameField(data), | ||
hostField(data, options.host_file_options), | ||
]); |
178 changes: 178 additions & 0 deletions
178
app/javascript/components/reconfigure-vm-form/helper.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,178 @@ | ||
import { http } from '../../http_api'; | ||
import { | ||
deleteDisk, | ||
cancelDeleteDisk, | ||
cancelResizeDisk, | ||
getDiskTableHeaders, | ||
setDiskFormSubmit, | ||
formatDiskData, | ||
} from './helpers/disk'; | ||
import { | ||
cancelEditNetwork, | ||
deleteNetwork, | ||
cancelDeleteNetwork, | ||
getNetworkTableHeaders, | ||
setNetworkFormSubmit, | ||
} from './helpers/network'; | ||
import { | ||
getDriveTableHeaders, | ||
cancelConnectDrives, | ||
setDriveFormSubmit, | ||
cancelDisconnectDrives, | ||
disconnectDrives, | ||
} from './helpers/drive'; | ||
import { TYPES, formsData, sizeInMB } from './helpers/general'; | ||
|
||
/** Function to check if an item is array. if yes, returns true, else returns false */ | ||
const isArray = (item) => Array.isArray(item); | ||
|
||
/** Function to get the options. | ||
* The data is either array of strings eg: ['aaa','bbb'] or | ||
* array of string arrays eg: [['aaa','bbb], ['ccc','ddd']] */ | ||
export const restructureOptions = (data) => { | ||
if (!data) { return []; } return data.map((item) => ( | ||
isArray(item) | ||
? ({ label: item[0], value: item[1] }) | ||
: ({ label: item.toString(), value: item }))); | ||
}; | ||
|
||
/** Function to set the submit button status based on change counters */ | ||
export const getFormSubmitStatus = (data) => { | ||
if (data.form.type === TYPES.RECONFIGURE && data.changeCounter > 0) { | ||
return true; | ||
} | ||
return false; | ||
}; | ||
|
||
/** Function to execute all button actions */ | ||
export const setButtonActions = (item, data, setData, roles) => { | ||
switch (item.callbackAction) { | ||
case 'deleteDisk': deleteDisk(item, data, setData); break; | ||
case 'cancelDeleteDisk': cancelDeleteDisk(item, data, setData); break; | ||
case 'cancelEditNetwork': cancelEditNetwork(item, data, setData, roles); break; | ||
case 'deleteNetwork': deleteNetwork(item, data, setData, roles); break; | ||
case 'cancelDeleteNetwork': cancelDeleteNetwork(item, data, setData); break; | ||
case 'cancelConnectDrives': cancelConnectDrives(item, data, setData); break; | ||
case 'cancelResizeDisk': cancelResizeDisk(item, data, setData); break; | ||
case 'cancelDisconnectDrives': cancelDisconnectDrives(item, data, setData); break; | ||
case 'disconnectDrives': disconnectDrives(item, data, setData); break; | ||
default: return true; | ||
} | ||
return true; | ||
}; | ||
|
||
/** Function to load the datatable headers values */ | ||
export const dataTableHeaders = (table, roles) => { | ||
switch (table) { | ||
case 'network': | ||
return getNetworkTableHeaders(roles); | ||
case 'drive': | ||
return getDriveTableHeaders(); | ||
default: | ||
return getDiskTableHeaders(roles); | ||
} | ||
}; | ||
|
||
/** validate the memory size field. | ||
* return false when the validation fails | ||
*/ | ||
export const validateMemory = (value, checkValue, unit, limit) => { | ||
if (checkValue) { | ||
const valueInMB = sizeInMB(value, unit); | ||
const remainder = valueInMB % 4; | ||
if (valueInMB < limit.min || valueInMB > limit.max || remainder !== 0) { | ||
return false; | ||
} | ||
} | ||
return true; | ||
}; | ||
|
||
/** validate the memory size field. | ||
* return false when the validation fails | ||
*/ | ||
export const validateCpu = (value, allValues, field, limit) => { | ||
const cpuValue = field === 'socket' ? allValues.cores_per_socket_count : allValues.socket_count; | ||
if ((cpuValue * value) > limit) { | ||
return false; | ||
} | ||
|
||
return true; | ||
}; | ||
|
||
/** Setting up the sub forms submit data when the form submit action gets called */ | ||
export const subFormSubmit = (data, setData, formData, roles) => { | ||
switch (data.form.type) { | ||
case TYPES.DISK: | ||
case TYPES.RESIZE: | ||
setDiskFormSubmit(data, setData, formData, roles, formsData.reconfigure); | ||
break; | ||
case TYPES.NETWORK: | ||
case TYPES.EDITNETWORK: | ||
setNetworkFormSubmit(data, setData, formData, roles, formsData.reconfigure); | ||
break; | ||
case TYPES.DRIVE: | ||
setDriveFormSubmit(data, setData, formData, formsData.reconfigure); | ||
break; | ||
default: | ||
break; | ||
} | ||
}; | ||
|
||
/** Setting up the final reconfigure submit data when the form submit button clicked */ | ||
export const reconfigureSubmitData = (recordId, data, formData) => ({ | ||
objectIds: recordId, | ||
cb_memory: formData.cb_memory, | ||
cb_cpu: formData.processor, | ||
memory: formData.memory, | ||
memory_type: formData.mem_type, | ||
socket_count: formData.socket_count, | ||
cores_per_socket_count: formData.cores_per_socket_count, | ||
vmAddDisks: data.submitParams.disks.add || [], | ||
vmRemoveDisks: data.submitParams.disks.delete || [], | ||
vmResizeDisks: data.submitParams.disks.resize || [], | ||
vmAddNetworkAdapters: data.submitParams.networks.add || [], | ||
vmRemoveNetworkAdapters: data.submitParams.networks.delete || [], | ||
vmEditNetworkAdapters: data.submitParams.networks.edit || [], | ||
vmConnectCDRoms: data.submitParams.drives.connect || [], | ||
vmDisconnectCDRoms: data.submitParams.drives.disconnect || [], | ||
}); | ||
|
||
/** function to save the processor field changes to show total processors */ | ||
export const socketChange = (value, data, setData, field) => { | ||
if (data[field] !== value) { | ||
data[field] = value; | ||
data.initialValues.total_cpus = data.socket * data.cores; | ||
setData({ | ||
...data, | ||
}); | ||
} | ||
}; | ||
|
||
/** Setting up the reconfigure form details when the form loads | ||
* TODO: replace with API endpoints. | ||
*/ | ||
export const setInitialData = (value, requestId, data, setData) => { | ||
http.get(`/vm_infra/reconfigure_form_fields/${requestId},${value}`).then((response) => { | ||
setData({ | ||
...data, | ||
initialValues: { | ||
processor: response.cb_cpu, | ||
cb_memory: response.cb_memory, | ||
cores_per_socket_count: response.cores_per_socket_count, | ||
memory: response.memory, | ||
mem_type: response.memory_type, | ||
socket_count: response.socket_count, | ||
}, | ||
socket: response.socket_count, | ||
cores: response.cores_per_socket_count, | ||
orchestration_stack_id: response.orchestration_stack_id, | ||
isLoading: false, | ||
dataTable: { | ||
...data.dataTable, | ||
disks: formatDiskData(response.disks), | ||
networkAdapters: response.network_adapters, | ||
drives: response.cdroms, | ||
}, | ||
}); | ||
}); | ||
}; |
Oops, something went wrong.