/
main.jsx
107 lines (98 loc) · 3.29 KB
/
main.jsx
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
/*
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
/*
* Copyright (c) 2015, Joyent, Inc.
*/
/** @jsx React.DOM **/
var api = require('../../request');
var React = require('react');
var LinkAggregationForm = require('./form.jsx');
var LinkAggregationsList = require('./list.jsx');
var Component = React.createClass({
propTypes: {
server: React.PropTypes.string.isRequired,
nics: React.PropTypes.array
},
getInitialState: function () {
return {
mode: 'list',
linkAggregations: []
};
},
componentWillMount: function () {
this.refreshAggregations();
},
refreshAggregations: function () {
api.get('/api/linkaggrs').query({belongs_to_uuid: this.props.server}).end(function (res) {
this.setState({linkAggregations: res.body});
}.bind(this));
},
newLinkAggr: function (e) {
e.preventDefault();
this.setState({
mode: 'new',
formValues: {}
});
},
onLinkAggregationFormBack: function () {
this.setState({mode: 'list'});
},
onLinkAggregationSaved: function () {
this.setState({mode: 'list'});
this.refreshAggregations();
},
handleDelete: function (aggr) {
if (window.confirm('Confirm Deleting Aggregation')) {
api.del('/api/linkaggrs/' + aggr.id).end(function () {
this.refreshAggregations();
}.bind(this));
}
},
handleEdit: function (aggr) {
this.setState({
mode: 'edit',
formValues: aggr
});
},
render: function () {
var nodes;
if (this.state.mode === 'new') {
nodes = [
<LinkAggregationForm
onSaved={this.onLinkAggregationSaved}
handleBack={this.onLinkAggregationFormBack}
nics={this.props.nics}
server={this.props.server} />
];
} else if (this.state.mode === 'edit') {
nodes = [
<LinkAggregationForm
onSaved={this.onLinkAggregationSaved}
handleBack={this.onLinkAggregationFormBack}
initialLinkAggr={this.state.formValues}
nics={this.props.nics}
server={this.props.server} />
];
} else if (this.state.mode === 'list') {
nodes = [
<button onClick={this.newLinkAggr} className="btn btn-info new-link-aggr"><i className="fa fa-plus"></i> Link Aggregation</button>,
<LinkAggregationsList
onEdit={this.handleEdit}
onDelete={this.handleDelete}
nics={this.props.nics}
linkAggregations={this.state.linkAggregations} />,
<div className="buttons">
<button className="btn btn-default" data-dismiss="modal">Close</button>
</div>
];
}
return <div className="link-aggr-component">
<h1>Link Aggregations</h1>
{nodes}
</div>;
}
});
module.exports = Component;