[SDC-29] Amdocs OnBoard 1707 initial commit.
Change-Id: Ie4d12a3f574008b792899b368a0902a8b46b5370
Signed-off-by: AviZi <avi.ziv@amdocs.com>
diff --git a/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx b/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx
new file mode 100644
index 0000000..06cb98b
--- /dev/null
+++ b/openecomp-ui/src/nfvo-components/table/SelectActionTable.jsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import i18n from 'nfvo-utils/i18n/i18n.js';
+import SVGIcon from 'nfvo-components/icon/SVGIcon.jsx';
+import uuid from 'uuid-js';
+
+export default class SelectActionTable extends React.Component {
+
+ render() {
+ let {columns, onAdd, isReadOnlyMode, children, onAddItem} = this.props;
+ return (
+ <div className={`select-action-table-view ${isReadOnlyMode ? 'disabled' : ''}`}>
+ <div className='select-action-table-controllers'>
+ {onAdd && onAddItem && <div data-test-id='select-action-table-add' onClick={onAdd}>{onAddItem}</div>}
+ <SVGIcon name='trash-o' className='dummy-icon' />
+ </div>
+ <div className='select-action-table'>
+ <div className='select-action-table-headers'>
+ {columns.map(column => <div key={uuid.create()} className='select-action-table-header'>{i18n(column)}</div>)}
+ <SVGIcon name='trash-o' className='dummy-icon' />
+ <SVGIcon name='trash-o' className='dummy-icon' />
+ </div>
+ <div className='select-action-table-body'>
+ {children}
+ </div>
+ </div>
+ </div>
+ );
+ }
+}
diff --git a/openecomp-ui/src/nfvo-components/table/SelectActionTableCell.jsx b/openecomp-ui/src/nfvo-components/table/SelectActionTableCell.jsx
new file mode 100644
index 0000000..2664c8e
--- /dev/null
+++ b/openecomp-ui/src/nfvo-components/table/SelectActionTableCell.jsx
@@ -0,0 +1,20 @@
+import React from 'react';
+import SelectInput from 'nfvo-components/input/SelectInput.jsx';
+
+const SelectActionTableCell = ({options, selected, disabled, onChange, clearable = true, placeholder}) => {
+ return (
+ <div className='select-action-table-cell'>
+ <SelectInput
+ placeholder={placeholder}
+ type='select'
+ value={selected}
+ data-test-id='select-action-table-dropdown'
+ disabled={disabled}
+ onChange={option => onChange(option ? option.value : null)}
+ clearable={clearable}
+ options={options} />
+ </div>
+ );
+};
+
+export default SelectActionTableCell;
diff --git a/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx b/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx
new file mode 100644
index 0000000..17d8a17
--- /dev/null
+++ b/openecomp-ui/src/nfvo-components/table/SelectActionTableRow.jsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import SVGIcon from '../icon/SVGIcon.jsx';
+import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
+import Tooltip from 'react-bootstrap/lib/Tooltip.js';
+
+function tooltip (msg) {
+ return (
+ <Tooltip className='select-action-table-error-tooltip' id='error-tooltip'>{msg}</Tooltip>
+ );
+};
+
+const IconWithOverlay = ({overlayMsg}) => (
+ <OverlayTrigger placement='bottom' overlay={tooltip(overlayMsg)}>
+ <SVGIcon name='error-circle'/>
+ </OverlayTrigger>
+);
+
+const SelectActionTableRow = ({children, onDelete, hasError, overlayMsg}) => (
+ <div className='select-action-table-row-wrapper'>
+ <div className={`select-action-table-row ${hasError ? 'has-error' : ''}`}>
+ {children}
+ </div>
+ {onDelete ? <SVGIcon name='trash-o' data-test-id='select-action-table-delete' onClick={onDelete} /> : <SVGIcon name='angle-left' className='dummy-icon' />}
+ {hasError ? overlayMsg ? <IconWithOverlay overlayMsg={overlayMsg}/> : <SVGIcon name='error-circle'/>
+ : hasError === undefined ? <SVGIcon name='angle-left' className='dummy-icon'/> : <SVGIcon name='check-circle'/>}
+
+ </div>
+);
+
+export default SelectActionTableRow;