diff options
author | AviZi <avi.ziv@amdocs.com> | 2017-06-09 02:39:56 +0300 |
---|---|---|
committer | AviZi <avi.ziv@amdocs.com> | 2017-06-09 02:39:56 +0300 |
commit | 280f8015d06af1f41a3ef12e8300801c7a5e0d54 (patch) | |
tree | 9c1d3978c04cd28068f02073038c936bb49ca9e0 /openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx | |
parent | fd3821dad11780d33c5373d74c957c442489945e (diff) |
[SDC-29] Amdocs OnBoard 1707 initial commit.
Change-Id: Ie4d12a3f574008b792899b368a0902a8b46b5370
Signed-off-by: AviZi <avi.ziv@amdocs.com>
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx')
-rw-r--r-- | openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx | 98 |
1 files changed, 98 insertions, 0 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx new file mode 100644 index 0000000000..b1f002d2fb --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx @@ -0,0 +1,98 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * 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 React from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import classnames from 'classnames'; +import DetailsCatalogView from 'sdc-app/onboarding/onboard/DetailsCatalogView.jsx'; +import VendorCatalogView from './VendorCatalogView.jsx'; +import { tabsMapping} from './OnboardingCatalogConstants.js'; + +const CatalogHeaderTabs = ({onTabPress, activeTab}) => ( + <div className='catalog-header-tabs'> + <div + className={classnames('catalog-header-tab', {'active': activeTab === tabsMapping.ALL })} + onClick={() => onTabPress(tabsMapping.ALL)} + data-test-id='catalog-all-tab'> + {i18n('ALL')} + </div> + <div className='tab-separator'/> + <div + className={classnames('catalog-header-tab', {'active': activeTab === tabsMapping.BY_VENDOR })} + onClick={() => onTabPress(tabsMapping.BY_VENDOR)} + data-test-id='catalog-by-vendor-tab'> + {i18n('BY VENDOR')} + </div> + </div> +); + +const CatalogHeader = ({activeTab, onTabPress}) => ( + <div className='catalog-header'> + <CatalogHeaderTabs activeTab={activeTab} onTabPress={onTabPress} /> + </div> +); + +class OnboardingCatalogView extends React.Component { + renderViewByTab(activeTab){ + const {finalizedLicenseModelList: licenseModelList, vspOverlay, finalizedSoftwareProductList: softwareProductList, onSelectLicenseModel, onSelectSoftwareProduct, + onAddLicenseModelClick, onAddSoftwareProductClick, onVspOverlayChange, onVendorSelect, selectedVendor, searchValue, onMigrate} = this.props; + switch (activeTab){ + case tabsMapping.ALL: + return ( + <DetailsCatalogView + VLMList={licenseModelList} + VSPList={softwareProductList} + onAddVLM={onAddLicenseModelClick} + onAddVSP={onAddSoftwareProductClick} + onSelectVLM={onSelectLicenseModel} + onSelectVSP={onSelectSoftwareProduct} + filter={searchValue} + onMigrate={onMigrate}/> + ); + case tabsMapping.BY_VENDOR: + default: + return ( + <VendorCatalogView + licenseModelList={licenseModelList} + onAddVSP={onAddSoftwareProductClick} + onAddVLM={onAddLicenseModelClick} + onSelectVSP={onSelectSoftwareProduct} + onSelectVLM={onSelectLicenseModel} + vspOverlay={vspOverlay} + onVendorSelect={onVendorSelect} + selectedVendor={selectedVendor} + onVspOverlayChange={onVspOverlayChange} + onMigrate={onMigrate} + filter={searchValue}/> + ); + } + } + + render() { + const {selectedVendor, catalogActiveTab: activeTab, onCatalogTabClick, onSearch, searchValue} = this.props; + return ( + <div className='catalog-wrapper'> + {!selectedVendor && <CatalogHeader + onSearch={event => onSearch(event.target.value)} + activeTab={activeTab} + onTabPress={tab => onCatalogTabClick(tab)} + searchValue={searchValue}/>} + {this.renderViewByTab(activeTab)} + </div> + ); + } +} + +export default OnboardingCatalogView; |