// Import all the objects we want to use from ReactBootstrap
var ListGroup = ReactBootstrap.ListGroup;
var ListGroupItem = ReactBootstrap.ListGroupItem;
var Grid = ReactBootstrap.Grid;
var Row = ReactBootstrap.Row;
var Col = ReactBootstrap.Col;
var Button = ReactBootstrap.Button;
var ButtonGroup = ReactBootstrap.ButtonGroup;
var Glyphicon = ReactBootstrap.Glyphicon;
var Modal = ReactBootstrap.Modal;
var CollapsibleMixin = ReactBootstrap.CollapsibleMixin;
var Combobox = ReactWidgets.Combobox;
const recursiveAccountDisplayInfo = function(account, prefix) {
var name = prefix + account.Name;
var accounts = [{AccountId: account.AccountId, Name: name}];
for (var i = 0; i < account.Children.length; i++)
accounts = accounts.concat(recursiveAccountDisplayInfo(account.Children[i], name + "/"));
return accounts
};
const getAccountDisplayList = function(account_list, includeRoot, rootName) {
var accounts = []
if (includeRoot)
accounts.push({AccountId: -1, Name: rootName});
for (var i = 0; i < account_list.length; i++) {
if (account_list[i].isRootAccount())
accounts = accounts.concat(recursiveAccountDisplayInfo(account_list[i], ""));
}
return accounts;
};
const AccountCombobox = React.createClass({
getDefaultProps: function() {
return {
includeRoot: true,
rootName: "New Top-level Account"
};
},
handleAccountChange: function(account) {
if (this.props.onSelect != null &&
account.hasOwnProperty('AccountId') &&
(this.props.account_map.hasOwnProperty([account.AccountId]) ||
account.AccountId == -1)) {
this.props.onSelect(account)
}
},
render: function() {
var accounts = getAccountDisplayList(this.props.accounts, this.props.includeRoot, this.props.rootName);
return (
);
}
});
const AddEditAccountModal = React.createClass({
getInitialState: function() {
var s = {
accountid: -1,
security: 1,
parentaccountid: -1,
type: 1,
name: ""
};
if (this.props.editAccount != null) {
s.accountid = this.props.editAccount.AccountId;
s.name = this.props.editAccount.Name;
s.security = this.props.editAccount.SecurityId;
s.parentaccountid = this.props.editAccount.ParentAccountId;
s.type = this.props.editAccount.Type;
} else if (this.props.initialParentAccount != null) {
s.security = this.props.initialParentAccount.SecurityId;
s.parentaccountid = this.props.initialParentAccount.AccountId;
s.type = this.props.initialParentAccount.Type;
}
return s;
},
handleCancel: function() {
if (this.props.onCancel != null)
this.props.onCancel();
},
handleChange: function() {
this.setState({
name: this.refs.name.getValue(),
});
},
handleSecurityChange: function(security) {
if (security.hasOwnProperty('SecurityId'))
this.setState({
security: security.SecurityId
});
},
handleTypeChange: function(type) {
if (type.hasOwnProperty('TypeId'))
this.setState({
type: type.TypeId
});
},
handleParentChange: function(parentAccount) {
this.setState({parentaccountid: parentAccount.AccountId});
},
handleSubmit: function() {
var a = new Account();
if (this.props.editAccount != null)
a.AccountId = this.state.accountid;
a.Name = this.state.name;
a.ParentAccountId = this.state.parentaccountid;
a.SecurityId = this.state.security;
a.Type = this.state.type;
if (this.props.onSubmit != null)
this.props.onSubmit(a);
},
componentWillReceiveProps: function(nextProps) {
if (nextProps.show && !this.props.show) {
this.setState(this.getInitialState());
}
},
render: function() {
var headerText = (this.props.editAccount != null) ? "Edit" : "Create New";
var buttonText = (this.props.editAccount != null) ? "Save Changes" : "Create Account";
var rootName = (this.props.editAccount != null) ? "Top-level Account" : "New Top-level Account";
return (
{headerText} Account
);
}
});
const DeleteAccountModal = React.createClass({
getInitialState: function() {
if (this.props.initialAccount != null)
var accountid = this.props.initialAccount.AccountId;
else if (this.props.accounts.length > 0)
var accountid = this.props.accounts[0].AccountId;
else
var accountid = -1;
return {error: "",
accountid: accountid,
checked: false,
show: false};
},
handleCancel: function() {
if (this.props.onCancel != null)
this.props.onCancel();
},
handleChange: function(account) {
this.setState({accountid: account.AccountId});
},
handleCheckboxClick: function() {
this.setState({checked: !this.state.checked});
},
handleSubmit: function() {
if (this.props.account_map.hasOwnProperty(this.state.accountid)) {
if (this.state.checked) {
if (this.props.onSubmit != null)
this.props.onSubmit(this.props.account_map[this.state.accountid]);
} else {
this.setState({error: "You must confirm you wish to delete this account."});
}
} else {
this.setState({error: "You must select an account."});
}
},
componentWillReceiveProps: function(nextProps) {
if (nextProps.show && !this.props.show) {
this.setState(this.getInitialState());
}
},
render: function() {
var checkbox = [];
if (this.props.account_map.hasOwnProperty(this.state.accountid)) {
var parentAccountId = this.props.account_map[this.state.accountid].ParentAccountId;
var parentAccount = "will be deleted and any child accounts will become top-level accounts.";
if (parentAccountId != -1)
parentAccount = "and any child accounts will be re-parented to: " + this.props.account_map[parentAccountId].Name;
var warningString = "I understand that deleting this account cannot be undone and that all transactions " + parentAccount;
checkbox = ();
}
var warning = [];
if (this.state.error.length != "") {
warning = (
Error: {this.state.error}
);
}
return (
Delete Account
{warning}
);
}
});
const AccountTreeNode = React.createClass({
mixins: [CollapsibleMixin],
getCollapsibleDOMNode: function() {
return React.findDOMNode(this.refs.children);
},
getCollapsibleDimensionValue: function() {
return React.findDOMNode(this.refs.children).scrollHeight;
},
handleToggle: function(e) {
e.preventDefault();
this.setState({expanded:!this.state.expanded});
},
handleChildSelect: function(account) {
if (this.props.onSelect != null)
this.props.onSelect(account);
},
handleSelect: function() {
if (this.props.onSelect != null)
this.props.onSelect(this.props.account);
},
render: function() {
var styles = this.getCollapsibleClassSet();
var glyph = this.isExpanded() ? 'minus' : 'plus';
var active = (this.props.selectedAccount != null &&
this.props.account.AccountId == this.props.selectedAccount.AccountId);
var buttonStyle = active ? "info" : "link";
var self = this;
var children = this.props.account.Children.map(function(account) {
return (
);
});
var accounttreeClasses = "accounttree"
var expandButton = [];
if (children.length > 0)
expandButton.push((
));
else
accounttreeClasses += "-nochildren";
return (
{expandButton}
{children}
);
}
});
const AccountTree = React.createClass({
getInitialState: function() {
return {selectedAccount: null,
height: 0};
},
handleSelect: function(account) {
this.setState({selectedAccount: account});
if (this.props.onSelect != null) {
this.props.onSelect(account);
}
},
resize: function() {
var div = React.findDOMNode(this);
this.setState({height: div.parentElement.clientHeight - 73});
},
componentDidMount: function() {
this.resize();
var self = this;
$(window).resize(function() {self.resize();});
},
render: function() {
var accounts = this.props.accounts;
var children = [];
for (var i = 0; i < accounts.length; i++) {
if (accounts[i].isRootAccount())
children.push(());
}
var style = {height: this.state.height + "px"};
return (
{children}
);
}
});
const AccountsTab = React.createClass({
getInitialState: function() {
return {
selectedAccount: null,
creatingNewAccount: false,
editingAccount: false,
deletingAccount: false
};
},
handleNewAccount: function() {
this.setState({creatingNewAccount: true});
},
handleEditAccount: function() {
this.setState({editingAccount: true});
},
handleDeleteAccount: function() {
this.setState({deletingAccount: true});
},
handleCreationCancel: function() {
this.setState({creatingNewAccount: false});
},
handleEditingCancel: function() {
this.setState({editingAccount: false});
},
handleDeletionCancel: function() {
this.setState({deletingAccount: false});
},
handleCreateAccount: function(account) {
if (this.props.onCreateAccount != null)
this.props.onCreateAccount(account);
this.setState({creatingNewAccount: false});
},
handleUpdateAccount: function(account) {
if (this.props.onUpdateAccount != null)
this.props.onUpdateAccount(account);
this.setState({editingAccount: false});
},
handleRemoveAccount: function(account) {
if (this.props.onDeleteAccount != null)
this.props.onDeleteAccount(account);
this.setState({deletingAccount: false,
selectedAccount: null});
},
handleAccountSelected: function(account) {
this.setState({selectedAccount: account});
},
render: function() {
var accounts = this.props.accounts;
var account_map = this.props.account_map;
var disabled = (this.state.selectedAccount == null) ? "disabled" : "";
return (
blah
);
}
});