1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
|
import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import Modal from 'nfvo-components/modal/Modal.jsx';
import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
import EntitlementPoolsEditor from './EntitlementPoolsEditor.js';
import InputOptions, {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
import {optionsInputValues} from './EntitlementPoolsConstants';
import EntitlementPoolsConfirmationModal from './EntitlementPoolsConfirmationModal.jsx';
class EntitlementPoolsListEditorView extends React.Component {
static propTypes = {
vendorName: React.PropTypes.string,
licenseModelId: React.PropTypes.string.isRequired,
entitlementPoolsList: React.PropTypes.array,
isReadOnlyMode: React.PropTypes.bool.isRequired,
isDisplayModal: React.PropTypes.bool,
isModalInEditMode: React.PropTypes.bool,
onAddEntitlementPoolClick: React.PropTypes.func,
onEditEntitlementPoolClick: React.PropTypes.func,
onDeleteEntitlementPool: React.PropTypes.func,
};
static defaultProps = {
entitlementPoolsList: []
};
state = {
localFilter: ''
};
render() {
let {licenseModelId, vendorName, isReadOnlyMode, isDisplayModal, isModalInEditMode} = this.props;
let {onAddEntitlementPoolClick} = this.props;
const {localFilter} = this.state;
return (
<div className='entitlement-pools-list-editor'>
<ListEditorView
title={i18n('Entitlement Pools for {vendorName} License Model', {vendorName})}
plusButtonTitle={i18n('Add Entitlement Pool')}
onAdd={onAddEntitlementPoolClick}
filterValue={localFilter}
onFilter={filter => this.setState({localFilter: filter})}
isReadOnlyMode={isReadOnlyMode}>
{this.filterList().map(entitlementPool => this.renderEntitlementPoolListItem(entitlementPool, isReadOnlyMode))}
</ListEditorView>
<Modal show={isDisplayModal} bsSize='large' animation={true} className='entitlement-pools-modal'>
<Modal.Header>
<Modal.Title>{`${isModalInEditMode ? i18n('Edit Entitlement Pool') : i18n('Create New Entitlement Pool')}`}</Modal.Title>
</Modal.Header>
<Modal.Body>
{
isDisplayModal && (
<EntitlementPoolsEditor licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>
)
}
</Modal.Body>
</Modal>
<EntitlementPoolsConfirmationModal licenseModelId={licenseModelId}/>
</div>
);
}
filterList() {
let {entitlementPoolsList} = this.props;
let {localFilter} = this.state;
if(localFilter.trim()) {
const filter = new RegExp(escape(localFilter), 'i');
return entitlementPoolsList.filter(({name = '', description = ''}) => {
return escape(name).match(filter) || escape(description).match(filter);
});
}
else {
return entitlementPoolsList;
}
}
renderEntitlementPoolListItem(entitlementPool, isReadOnlyMode) {
let {id, name, description, thresholdValue, thresholdUnits, entitlementMetric, aggregationFunction,
manufacturerReferenceNumber, time} = entitlementPool;
let {onEditEntitlementPoolClick, onDeleteEntitlementPool} = this.props;
return (
<ListEditorItemView
key={id}
onSelect={() => onEditEntitlementPoolClick(entitlementPool)}
onDelete={() => onDeleteEntitlementPool(entitlementPool)}
className='list-editor-item-view'
isReadOnlyMode={isReadOnlyMode}>
<div className='list-editor-item-view-field'>
<div className='title'>{i18n('Name')}</div>
<div className='text name'>{name}</div>
</div>
<div className='list-editor-item-view-field'>
<div className='title'>{i18n('Entitlement')}</div>
<div className='entitlement-parameters'>{`${this.extractValue(aggregationFunction)} ${this.extractValue(entitlementMetric)} per ${this.extractValue(time)}`}</div>
<div className='entitlement-pools-count'>{`${thresholdValue ? thresholdValue : ''} ${this.extractUnits(thresholdUnits)}`}</div>
</div>
<div className='list-editor-item-view-field'>
<div className='title'>{i18n('Manufacturer Reference Number')}</div>
<div className='text contract-number'>{manufacturerReferenceNumber}</div>
</div>
<div className='list-editor-item-view-field'>
<div className='title'>{i18n('Description')}</div>
<div className='text description'>{description}</div>
</div>
</ListEditorItemView>
);
}
extractUnits(units) {
if (units === undefined) {return '';} //TODO fix it later
return units === 'Absolute' ? '' : '%';
}
extractValue(item) {
if (item === undefined) {return '';} //TODO fix it later
return item ? item.choice === optionInputOther.OTHER ? item.other : InputOptions.getTitleByName(optionsInputValues, item.choice) : '';
}
}
export default EntitlementPoolsListEditorView;
|
