summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js126
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js98
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js6
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js114
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx468
5 files changed, 486 insertions, 326 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
index 569b33f999..41584d94e2 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js
@@ -13,64 +13,96 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
import SoftwareProductCreationActionHelper from './SoftwareProductCreationActionHelper.js';
import SoftwareProductCreationView from './SoftwareProductCreationView.jsx';
import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
-import SoftwareProductActionHelper from '../SoftwareProductActionHelper.js';
+import SoftwareProductActionHelper from '../SoftwareProductActionHelper.js';
import VersionsPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
-import {itemTypes as versionItemTypes} from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
+import { itemTypes as versionItemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
-import {enums, screenTypes} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
import PermissionsActionHelper from 'sdc-app/onboarding/permissions/PermissionsActionHelper.js';
-export const mapStateToProps = ({finalizedLicenseModelList, users: {usersList}, archivedSoftwareProductList,
- softwareProductList, finalizedSoftwareProductList, softwareProduct: {softwareProductCreation, softwareProductCategories} }) => {
- let {genericFieldInfo} = softwareProductCreation;
- let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
+export const mapStateToProps = ({
+ finalizedLicenseModelList,
+ users: { usersList },
+ archivedSoftwareProductList,
+ softwareProductList,
+ finalizedSoftwareProductList,
+ softwareProduct: { softwareProductCreation, softwareProductCategories }
+}) => {
+ let { genericFieldInfo } = softwareProductCreation;
+ let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
- let VSPNames = {};
- const allVspList = [...softwareProductList, ...finalizedSoftwareProductList, ...archivedSoftwareProductList];
- allVspList.map(item => {
- VSPNames[item.name.toLowerCase()] = item.id;
- });
-
+ let VSPNames = {};
+ const allVspList = [
+ ...softwareProductList,
+ ...finalizedSoftwareProductList,
+ ...archivedSoftwareProductList
+ ];
+ allVspList.map(item => {
+ VSPNames[item.name.toLowerCase()] = item.id;
+ });
- return {
- data: softwareProductCreation.data,
- selectedVendorId: softwareProductCreation.selectedVendorId,
- disableVendor: softwareProductCreation.disableVendor,
- softwareProductCategories,
- finalizedLicenseModelList,
- isFormValid,
- formReady: softwareProductCreation.formReady,
- genericFieldInfo,
- VSPNames,
- usersList
- };
+ return {
+ data: softwareProductCreation.data,
+ selectedVendorId: softwareProductCreation.selectedVendorId,
+ disableVendor: softwareProductCreation.disableVendor,
+ softwareProductCategories,
+ finalizedLicenseModelList,
+ isFormValid,
+ formReady: softwareProductCreation.formReady,
+ genericFieldInfo,
+ VSPNames,
+ usersList
+ };
};
-export const mapActionsToProps = (dispatch) => {
- return {
- onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
- onCancel: () => SoftwareProductCreationActionHelper.resetData(dispatch),
- onSubmit: (softwareProduct, usersList) => {
- SoftwareProductCreationActionHelper.resetData(dispatch);
- SoftwareProductCreationActionHelper.createSoftwareProduct(dispatch, {softwareProduct}).then(response => {
- let {itemId, version} = response;
- SoftwareProductActionHelper.fetchSoftwareProductList(dispatch).then(() =>
- PermissionsActionHelper.fetchItemUsers(dispatch, {itemId, allUsers: usersList}).then(() =>
- VersionsPageActionHelper.fetchVersions(dispatch, {itemType: versionItemTypes.SOFTWARE_PRODUCT, itemId}).then(() =>
- ScreensHelper.loadScreen(dispatch, {screen: enums.SCREEN.SOFTWARE_PRODUCT_LANDING_PAGE, screenType: screenTypes.SOFTWARE_PRODUCT,
- props: {softwareProductId: itemId, version}})
- )
- )
- );
- });
- },
- onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
- };
+export const mapActionsToProps = dispatch => {
+ return {
+ onDataChanged: (deltaData, formName, customValidations) =>
+ ValidationHelper.dataChanged(dispatch, {
+ deltaData,
+ formName,
+ customValidations
+ }),
+ onCancel: () => SoftwareProductCreationActionHelper.resetData(dispatch),
+ onSubmit: (softwareProduct, usersList) => {
+ SoftwareProductCreationActionHelper.resetData(dispatch);
+ SoftwareProductCreationActionHelper.createSoftwareProduct(
+ dispatch,
+ { softwareProduct }
+ ).then(response => {
+ let { itemId, version } = response;
+ SoftwareProductActionHelper.fetchSoftwareProductList(
+ dispatch
+ ).then(() =>
+ PermissionsActionHelper.fetchItemUsers(dispatch, {
+ itemId,
+ allUsers: usersList
+ }).then(() =>
+ VersionsPageActionHelper.fetchVersions(dispatch, {
+ itemType: versionItemTypes.SOFTWARE_PRODUCT,
+ itemId
+ }).then(() =>
+ ScreensHelper.loadScreen(dispatch, {
+ screen:
+ enums.SCREEN.SOFTWARE_PRODUCT_LANDING_PAGE,
+ screenType: screenTypes.SOFTWARE_PRODUCT,
+ props: { softwareProductId: itemId, version }
+ })
+ )
+ )
+ );
+ });
+ },
+ onValidateForm: formName =>
+ ValidationHelper.validateForm(dispatch, formName)
+ };
};
-export default connect(mapStateToProps, mapActionsToProps, null, {withRef: true})(SoftwareProductCreationView);
+export default connect(mapStateToProps, mapActionsToProps, null, {
+ withRef: true
+})(SoftwareProductCreationView);
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
index b19e460497..1b1fd71fef 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationActionHelper.js
@@ -17,68 +17,68 @@ import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
import Configuration from 'sdc-app/config/Configuration.js';
import SoftwareProductActionHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js';
-import {actionTypes as modalActionTypes, modalSizes} from 'nfvo-components/modal/GlobalModalConstants.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {actionTypes} from './SoftwareProductCreationConstants.js';
+import {
+ actionTypes as modalActionTypes,
+ modalSizes
+} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { actionTypes } from './SoftwareProductCreationConstants.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
function baseUrl() {
- const restPrefix = Configuration.get('restPrefix');
- return `${restPrefix}/v1.0/vendor-software-products/`;
+ const restPrefix = Configuration.get('restPrefix');
+ return `${restPrefix}/v1.0/vendor-software-products/`;
}
function createSoftwareProduct(softwareProduct) {
- return RestAPIUtil.post(baseUrl(), {
- ...softwareProduct,
- icon: 'icon',
- licensingData: {}
- });
+ return RestAPIUtil.post(baseUrl(), {
+ ...softwareProduct,
+ icon: 'icon',
+ licensingData: {}
+ });
}
const SoftwareProductCreationActionHelper = {
+ open(dispatch, vendorId) {
+ SoftwareProductActionHelper.loadSoftwareProductAssociatedData(dispatch);
+ dispatch({
+ type: actionTypes.OPEN,
+ selectedVendorId: vendorId
+ });
- open(dispatch, vendorId) {
- SoftwareProductActionHelper.loadSoftwareProductAssociatedData(dispatch);
- dispatch({
- type: actionTypes.OPEN,
- selectedVendorId: vendorId
- });
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_SHOW,
+ data: {
+ modalComponentName:
+ modalContentMapper.SOFTWARE_PRODUCT_CREATION,
+ title: i18n('New Software Product'),
+ modalComponentProps: {
+ vendorId,
+ size: modalSizes.LARGE
+ }
+ }
+ });
+ },
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_SHOW,
- data: {
- modalComponentName: modalContentMapper.SOFTWARE_PRODUCT_CREATION,
- title: i18n('New Software Product'),
- modalComponentProps: {
- vendorId,
- size: modalSizes.LARGE
- }
- }
- });
+ resetData(dispatch) {
+ dispatch({
+ type: modalActionTypes.GLOBAL_MODAL_CLOSE
+ });
- },
-
- resetData(dispatch) {
-
- dispatch({
- type: modalActionTypes.GLOBAL_MODAL_CLOSE
- });
-
- dispatch({
- type: actionTypes.RESET_DATA
- });
- },
-
- createSoftwareProduct(dispatch, {softwareProduct}) {
- return createSoftwareProduct(softwareProduct).then(result => {
- dispatch({
- type: actionTypes.SOFTWARE_PRODUCT_CREATED,
- result
- });
- return result;
- });
- }
+ dispatch({
+ type: actionTypes.RESET_DATA
+ });
+ },
+ createSoftwareProduct(dispatch, { softwareProduct }) {
+ return createSoftwareProduct(softwareProduct).then(result => {
+ dispatch({
+ type: actionTypes.SOFTWARE_PRODUCT_CREATED,
+ result
+ });
+ return result;
+ });
+ }
};
export default SoftwareProductCreationActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
index b941c849cb..ad1034602a 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationConstants.js
@@ -16,9 +16,9 @@
import keyMirror from 'nfvo-utils/KeyMirror.js';
export const actionTypes = keyMirror({
- OPEN: null,
- RESET_DATA: null,
- SOFTWARE_PRODUCT_CREATED: null
+ OPEN: null,
+ RESET_DATA: null,
+ SOFTWARE_PRODUCT_CREATED: null
});
export const SP_CREATION_FORM_NAME = 'SPCREATIONFORM';
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
index a7db2b2357..5f70f18f75 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationReducer.js
@@ -13,56 +13,70 @@
* or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/
-import {actionTypes, SP_CREATION_FORM_NAME} from './SoftwareProductCreationConstants.js';
-
+import {
+ actionTypes,
+ SP_CREATION_FORM_NAME
+} from './SoftwareProductCreationConstants.js';
export default (state = {}, action) => {
- switch (action.type) {
- case actionTypes.OPEN:
- return {
- ...state,
- formName: SP_CREATION_FORM_NAME,
- disableVendor: action.selectedVendorId ? true : false,
- data: {
- vendorId: action.selectedVendorId ? action.selectedVendorId : undefined
- },
- genericFieldInfo: {
- 'description' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'freeEnglishText', data: true}, {type: 'maxLength', data: 1000}, {type: 'required', data: true}]
- },
- 'vendorId' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}]
- },
- 'subCategory' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}]
- },
- 'category' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}]
- },
- 'name' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'required', data: true}, {type: 'maxLength', data: 25}, {type: 'validateName', data: true}]
- },
- 'onboardingMethod' : {
- isValid: true,
- errorText: '',
- validations: [{type: 'requiredChooseOption', data: true}]
- }
- },
- showModal: true
- };
- case actionTypes.RESET_DATA:
- return {};
- default:
- return state;
- }
+ switch (action.type) {
+ case actionTypes.OPEN:
+ return {
+ ...state,
+ formName: SP_CREATION_FORM_NAME,
+ disableVendor: action.selectedVendorId ? true : false,
+ data: {
+ vendorId: action.selectedVendorId
+ ? action.selectedVendorId
+ : undefined
+ },
+ genericFieldInfo: {
+ description: {
+ isValid: true,
+ errorText: '',
+ validations: [
+ { type: 'freeEnglishText', data: true },
+ { type: 'maxLength', data: 1000 },
+ { type: 'required', data: true }
+ ]
+ },
+ vendorId: {
+ isValid: true,
+ errorText: '',
+ validations: [{ type: 'required', data: true }]
+ },
+ subCategory: {
+ isValid: true,
+ errorText: '',
+ validations: [{ type: 'required', data: true }]
+ },
+ category: {
+ isValid: true,
+ errorText: '',
+ validations: [{ type: 'required', data: true }]
+ },
+ name: {
+ isValid: true,
+ errorText: '',
+ validations: [
+ { type: 'required', data: true },
+ { type: 'maxLength', data: 25 },
+ { type: 'validateName', data: true }
+ ]
+ },
+ onboardingMethod: {
+ isValid: true,
+ errorText: '',
+ validations: [
+ { type: 'requiredChooseOption', data: true }
+ ]
+ }
+ },
+ showModal: true
+ };
+ case actionTypes.RESET_DATA:
+ return {};
+ default:
+ return state;
+ }
};
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx
index e491491f4d..e94087cc80 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx
@@ -22,194 +22,308 @@ import Form from 'nfvo-components/input/validation/Form.jsx';
import GridSection from 'nfvo-components/grid/GridSection.jsx';
import GridItem from 'nfvo-components/grid/GridItem.jsx';
-import {SP_CREATION_FORM_NAME} from './SoftwareProductCreationConstants.js';
+import { SP_CREATION_FORM_NAME } from './SoftwareProductCreationConstants.js';
import sortByStringProperty from 'nfvo-utils/sortByStringProperty.js';
import SoftwareProductCategoriesHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductCategoriesHelper.js';
-import {onboardingMethod as onboardingMethodConst} from '../SoftwareProductConstants.js';
+import { onboardingMethod as onboardingMethodConst } from '../SoftwareProductConstants.js';
const SoftwareProductPropType = PropTypes.shape({
- id: PropTypes.string,
- name: PropTypes.string,
- description: PropTypes.string,
- category: PropTypes.string,
- subCategory: PropTypes.string,
- vendorId: PropTypes.string
+ id: PropTypes.string,
+ name: PropTypes.string,
+ description: PropTypes.string,
+ category: PropTypes.string,
+ subCategory: PropTypes.string,
+ vendorId: PropTypes.string
});
class SoftwareProductCreationView extends React.Component {
+ static propTypes = {
+ data: SoftwareProductPropType,
+ finalizedLicenseModelList: PropTypes.array,
+ softwareProductCategories: PropTypes.array,
+ VSPNames: PropTypes.object,
+ usersList: PropTypes.array,
+ onDataChanged: PropTypes.func.isRequired,
+ onSubmit: PropTypes.func.isRequired,
+ onCancel: PropTypes.func.isRequired
+ };
- static propTypes = {
- data: SoftwareProductPropType,
- finalizedLicenseModelList: PropTypes.array,
- softwareProductCategories: PropTypes.array,
- VSPNames: PropTypes.object,
- usersList: PropTypes.array,
- onDataChanged: PropTypes.func.isRequired,
- onSubmit: PropTypes.func.isRequired,
- onCancel: PropTypes.func.isRequired
- };
-
- render() {
- let {softwareProductCategories, data = {}, onDataChanged, onCancel, genericFieldInfo, disableVendor} = this.props;
- let {name, description, vendorId, subCategory, onboardingMethod} = data;
-
- const vendorList = this.getVendorList();
- return (
- <div className='software-product-creation-page'>
- { genericFieldInfo && <Form
- ref={(validationForm) => this.validationForm = validationForm}
- hasButtons={true}
- onSubmit={() => this.submit() }
- onReset={() => onCancel() }
- labledButtons={true}
- isValid={this.props.isFormValid}
- submitButtonText={i18n('Create')}
- formReady={this.props.formReady}
- onValidateForm={() => this.validate() }>
- <GridSection hasLastColSet>
- <GridItem colSpan='2'>
- <Input
- value={name}
- label={i18n('Name')}
- isRequired={true}
- onChange={name => onDataChanged({name},SP_CREATION_FORM_NAME, {name: name => this.validateName(name)})}
- isValid={genericFieldInfo.name.isValid}
- errorText={genericFieldInfo.name.errorText}
- type='text'
- className='field-section'
- data-test-id='new-vsp-name' />
- <Input
- label={i18n('Vendor')}
- type='select'
- value={vendorId}
- overlayPos='bottom'
- isRequired={true}
- disabled={disableVendor}
- onChange={e => this.onSelectVendor(e)}
- isValid={genericFieldInfo.vendorId.isValid}
- errorText={genericFieldInfo.vendorId.errorText}
- className='input-options-select'
- groupClassName='bootstrap-input-options'
- data-test-id='new-vsp-vendor' >
- {vendorList.map(vendor =>
- <option key={vendor.title} value={vendor.enum}>{vendor.title}</option>)}
- </Input>
- <Input
- label={i18n('Category')}
- type='select'
- value={subCategory}
- isRequired={true}
- onChange={e => this.onSelectSubCategory(e)}
- isValid={genericFieldInfo.subCategory.isValid}
- errorText={genericFieldInfo.subCategory.errorText}
- className='input-options-select'
- groupClassName='bootstrap-input-options'
- data-test-id='new-vsp-category' >
- <option key='' value=''>{i18n('please select…')}</option>
- {softwareProductCategories.map(category =>
- category.subcategories &&
- <optgroup
- key={category.name}
- label={category.name}>{category.subcategories.map(sub =>
- <option key={sub.uniqueId} value={sub.uniqueId}>{`${sub.name} (${category.name})`}</option>)}
- </optgroup>)
- }
- </Input>
- </GridItem>
- <GridItem colSpan='2' stretch lastColInRow>
- <Input
- value={description}
- label={i18n('Description')}
- isRequired={true}
- overlayPos='bottom'
- onChange={description => onDataChanged({description},SP_CREATION_FORM_NAME)}
- isValid={genericFieldInfo.description.isValid}
- errorText={genericFieldInfo.description.errorText}
- type='textarea'
- className='field-section'
- data-test-id='new-vsp-description'/>
- </GridItem>
- </GridSection>
- <OnboardingProcedure genericFieldInfo={genericFieldInfo} onboardingMethod={onboardingMethod} onDataChanged={onDataChanged} />
- </Form>}
- </div>
- );
- }
-
- getVendorList() {
- let {finalizedLicenseModelList} = this.props;
-
- return [{enum: '', title: i18n('please select...')}].concat(
- sortByStringProperty(finalizedLicenseModelList, 'name').map(vendor => {
- return {
- enum: vendor.id,
- title: vendor.name
- };
- })
- );
- }
-
- onSelectVendor(e) {
- const selectedIndex = e.target.selectedIndex;
- const vendorId = e.target.options[selectedIndex].value;
- this.props.onDataChanged({vendorId},SP_CREATION_FORM_NAME);
- }
-
- onSelectSubCategory(e) {
- const selectedIndex = e.target.selectedIndex;
- const subCategory = e.target.options[selectedIndex].value;
- let {softwareProductCategories, onDataChanged} = this.props;
- let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory(subCategory, softwareProductCategories);
- onDataChanged({category, subCategory},SP_CREATION_FORM_NAME);
- }
-
- submit() {
- let {data:softwareProduct, finalizedLicenseModelList, usersList} = this.props;
- softwareProduct.vendorName = finalizedLicenseModelList.find(vendor => vendor.id === softwareProduct.vendorId).name;
- this.props.onSubmit(softwareProduct, usersList);
- }
-
- validateName(value) {
- const {data: {id}, VSPNames} = this.props;
- const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: VSPNames});
-
- return !isExists ? {isValid: true, errorText: ''} :
- {isValid: false, errorText: i18n('Software product by the name \'' + value + '\' already exists. Software product name must be unique')};
- }
-
- validate() {
- this.props.onValidateForm(SP_CREATION_FORM_NAME);
- }
+ render() {
+ let {
+ softwareProductCategories,
+ data = {},
+ onDataChanged,
+ onCancel,
+ genericFieldInfo,
+ disableVendor
+ } = this.props;
+ let {
+ name,
+ description,
+ vendorId,
+ subCategory,
+ onboardingMethod
+ } = data;
+
+ const vendorList = this.getVendorList();
+ return (
+ <div className="software-product-creation-page">
+ {genericFieldInfo && (
+ <Form
+ ref={validationForm =>
+ (this.validationForm = validationForm)
+ }
+ hasButtons={true}
+ onSubmit={() => this.submit()}
+ onReset={() => onCancel()}
+ labledButtons={true}
+ isValid={this.props.isFormValid}
+ submitButtonText={i18n('Create')}
+ formReady={this.props.formReady}
+ onValidateForm={() => this.validate()}>
+ <GridSection hasLastColSet>
+ <GridItem colSpan="2">
+ <Input
+ value={name}
+ label={i18n('Name')}
+ isRequired={true}
+ onChange={name =>
+ onDataChanged(
+ { name },
+ SP_CREATION_FORM_NAME,
+ {
+ name: name =>
+ this.validateName(name)
+ }
+ )
+ }
+ isValid={genericFieldInfo.name.isValid}
+ errorText={genericFieldInfo.name.errorText}
+ type="text"
+ className="field-section"
+ data-test-id="new-vsp-name"
+ />
+ <Input
+ label={i18n('Vendor')}
+ type="select"
+ value={vendorId}
+ overlayPos="bottom"
+ isRequired={true}
+ disabled={disableVendor}
+ onChange={e => this.onSelectVendor(e)}
+ isValid={genericFieldInfo.vendorId.isValid}
+ errorText={
+ genericFieldInfo.vendorId.errorText
+ }
+ className="input-options-select"
+ groupClassName="bootstrap-input-options"
+ data-test-id="new-vsp-vendor">
+ {vendorList.map(vendor => (
+ <option
+ key={vendor.title}
+ value={vendor.enum}>
+ {vendor.title}
+ </option>
+ ))}
+ </Input>
+ <Input
+ label={i18n('Category')}
+ type="select"
+ value={subCategory}
+ isRequired={true}
+ onChange={e => this.onSelectSubCategory(e)}
+ isValid={
+ genericFieldInfo.subCategory.isValid
+ }
+ errorText={
+ genericFieldInfo.subCategory.errorText
+ }
+ className="input-options-select"
+ groupClassName="bootstrap-input-options"
+ data-test-id="new-vsp-category">
+ <option key="" value="">
+ {i18n('please select…')}
+ </option>
+ {softwareProductCategories.map(
+ category =>
+ category.subcategories && (
+ <optgroup
+ key={category.name}
+ label={category.name}>
+ {category.subcategories.map(
+ sub => (
+ <option
+ key={
+ sub.uniqueId
+ }
+ value={
+ sub.uniqueId
+ }>{`${
+ sub.name
+ } (${
+ category.name
+ })`}</option>
+ )
+ )}
+ </optgroup>
+ )
+ )}
+ </Input>
+ </GridItem>
+ <GridItem colSpan="2" stretch lastColInRow>
+ <Input
+ value={description}
+ label={i18n('Description')}
+ isRequired={true}
+ overlayPos="bottom"
+ onChange={description =>
+ onDataChanged(
+ { description },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ isValid={
+ genericFieldInfo.description.isValid
+ }
+ errorText={
+ genericFieldInfo.description.errorText
+ }
+ type="textarea"
+ className="field-section"
+ data-test-id="new-vsp-description"
+ />
+ </GridItem>
+ </GridSection>
+ <OnboardingProcedure
+ genericFieldInfo={genericFieldInfo}
+ onboardingMethod={onboardingMethod}
+ onDataChanged={onDataChanged}
+ />
+ </Form>
+ )}
+ </div>
+ );
+ }
+
+ getVendorList() {
+ let { finalizedLicenseModelList } = this.props;
+
+ return [{ enum: '', title: i18n('please select...') }].concat(
+ sortByStringProperty(finalizedLicenseModelList, 'name').map(
+ vendor => {
+ return {
+ enum: vendor.id,
+ title: vendor.name
+ };
+ }
+ )
+ );
+ }
+
+ onSelectVendor(e) {
+ const selectedIndex = e.target.selectedIndex;
+ const vendorId = e.target.options[selectedIndex].value;
+ this.props.onDataChanged({ vendorId }, SP_CREATION_FORM_NAME);
+ }
+
+ onSelectSubCategory(e) {
+ const selectedIndex = e.target.selectedIndex;
+ const subCategory = e.target.options[selectedIndex].value;
+ let { softwareProductCategories, onDataChanged } = this.props;
+ let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory(
+ subCategory,
+ softwareProductCategories
+ );
+ onDataChanged({ category, subCategory }, SP_CREATION_FORM_NAME);
+ }
+
+ submit() {
+ let {
+ data: softwareProduct,
+ finalizedLicenseModelList,
+ usersList
+ } = this.props;
+ softwareProduct.vendorName = finalizedLicenseModelList.find(
+ vendor => vendor.id === softwareProduct.vendorId
+ ).name;
+ this.props.onSubmit(softwareProduct, usersList);
+ }
+
+ validateName(value) {
+ const { data: { id }, VSPNames } = this.props;
+ const isExists = Validator.isItemNameAlreadyExistsInList({
+ itemId: id,
+ itemName: value,
+ list: VSPNames
+ });
+
+ return !isExists
+ ? { isValid: true, errorText: '' }
+ : {
+ isValid: false,
+ errorText: i18n(
+ "Software product by the name '" +
+ value +
+ "' already exists. Software product name must be unique"
+ )
+ };
+ }
+
+ validate() {
+ this.props.onValidateForm(SP_CREATION_FORM_NAME);
+ }
}
-const OnboardingProcedure = ({onboardingMethod, onDataChanged, genericFieldInfo}) => {
- return(
- <GridSection title={i18n('Onboarding procedure')}>
- <GridItem colSpan={4}>
- <Input
- label={i18n('Network Package')}
- overlayPos='top'
- isValid={genericFieldInfo.onboardingMethod.isValid}
- checked={onboardingMethod === onboardingMethodConst.NETWORK_PACKAGE}
- errorText={genericFieldInfo.onboardingMethod.errorText}
- onChange={() => onDataChanged({onboardingMethod: onboardingMethodConst.NETWORK_PACKAGE},SP_CREATION_FORM_NAME)}
- type='radio'
- data-test-id='new-vsp-creation-procedure-heat' />
- </GridItem>
- <GridItem colSpan={4}>
- <Input
- label={i18n('Manual')}
- overlayPos='bottom'
- checked={onboardingMethod === onboardingMethodConst.MANUAL}
- isValid={genericFieldInfo.onboardingMethod.isValid}
- errorText={genericFieldInfo.onboardingMethod.errorText}
- onChange={() => onDataChanged({onboardingMethod: onboardingMethodConst.MANUAL},SP_CREATION_FORM_NAME)}
- type='radio'
- data-test-id='new-vsp-creation-procedure-manual' />
- </GridItem>
- </GridSection>
- );
+const OnboardingProcedure = ({
+ onboardingMethod,
+ onDataChanged,
+ genericFieldInfo
+}) => {
+ return (
+ <GridSection title={i18n('Onboarding procedure')}>
+ <GridItem colSpan={4}>
+ <Input
+ label={i18n('Network Package')}
+ overlayPos="top"
+ isValid={genericFieldInfo.onboardingMethod.isValid}
+ checked={
+ onboardingMethod ===
+ onboardingMethodConst.NETWORK_PACKAGE
+ }
+ errorText={genericFieldInfo.onboardingMethod.errorText}
+ onChange={() =>
+ onDataChanged(
+ {
+ onboardingMethod:
+ onboardingMethodConst.NETWORK_PACKAGE
+ },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ type="radio"
+ data-test-id="new-vsp-creation-procedure-heat"
+ />
+ </GridItem>
+ <GridItem colSpan={4}>
+ <Input
+ label={i18n('Manual')}
+ overlayPos="bottom"
+ checked={onboardingMethod === onboardingMethodConst.MANUAL}
+ isValid={genericFieldInfo.onboardingMethod.isValid}
+ errorText={genericFieldInfo.onboardingMethod.errorText}
+ onChange={() =>
+ onDataChanged(
+ { onboardingMethod: onboardingMethodConst.MANUAL },
+ SP_CREATION_FORM_NAME
+ )
+ }
+ type="radio"
+ data-test-id="new-vsp-creation-procedure-manual"
+ />
+ </GridItem>
+ </GridSection>
+ );
};
export default SoftwareProductCreationView;