1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00

jury invitation, revoke, resend

MIGRATE!
This commit is contained in:
diminator 2015-08-07 11:27:44 +02:00
parent d343acaac5
commit 67f70357a5
9 changed files with 242 additions and 41 deletions

View File

@ -48,20 +48,23 @@ let ActionPanel = React.createClass({
render() {
return (
<div
className={'ascribe-panel-wrapper ' + this.getClassName()}
onClick={this.handleFocus}
onFocus={this.handleFocus}>
<div className='ascribe-panel-title'>
{this.props.title}
</div>
<div className='ascribe-panel-content-wrapper'>
<span className="ascribe-panel-content pull-left">
{this.props.content}
</span>
<span className='ascribe-panel-buttons pull-right'>
{this.props.buttons}
</span>
<div className={'ascribe-panel-wrapper ' + this.getClassName()}>
<div className='row'>
<div className='col-xs-7 col-md-8'>
<div className='ascribe-panel-content-wrapper'>
<div className='ascribe-panel-title'>
{this.props.title}
</div>
<div className="ascribe-panel-content">
{this.props.content}
</div>
</div>
</div>
<div className='col-xs-5 col-md-4'>
<div className='ascribe-panel-buttons'>
{this.props.buttons}
</div>
</div>
</div>
</div>
);

View File

@ -8,7 +8,9 @@ import PrizeJuryFetcher from '../fetchers/prize_jury_fetcher';
class PrizeJuryActions {
constructor() {
this.generateActions(
'updatePrizeJury'
'updatePrizeJury',
'removePrizeJury',
'activatePrizeJury'
);
}
@ -26,6 +28,49 @@ class PrizeJuryActions {
});
});
}
activateJury(email) {
return Q.Promise((resolve, reject) => {
PrizeJuryFetcher
.activate(email)
.then((res) => {
resolve(res);
})
.catch((err) => {
console.logGlobal(err);
reject(err);
});
});
}
revokeJury(email) {
return Q.Promise((resolve, reject) => {
PrizeJuryFetcher
.delete(email)
.then((res) => {
this.actions.removePrizeJury(email);
resolve(res);
})
.catch((err) => {
console.logGlobal(err);
reject(err);
});
});
}
resendJuryInvitation(email) {
return Q.Promise((resolve, reject) => {
PrizeJuryFetcher
.resend(email)
.then((res) => {
resolve(res);
})
.catch((err) => {
console.logGlobal(err);
reject(err);
});
});
}
}
export default alt.createActions(PrizeJuryActions);

View File

@ -144,36 +144,138 @@ let PrizeJurySettings = React.createClass({
this.refs.form.refs.email.refs.input.getDOMNode().value = null;
},
render() {
handleActivate(event) {
let email = event.target.getAttribute('data-id');
PrizeJuryActions.activateJury(email).then((response) => {
PrizeJuryActions.fetchJury();
let notification = new GlobalNotificationModel(response.notification, 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
});
},
handleRevoke(event) {
let email = event.target.getAttribute('data-id');
PrizeJuryActions.revokeJury(email).then((response) => {
let notification = new GlobalNotificationModel(response.notification, 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
});
},
handleResend(event) {
let email = event.target.getAttribute('data-id');
PrizeJuryActions.resendJuryInvitation(email).then((response) => {
let notification = new GlobalNotificationModel(response.notification, 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification);
});
},
getMembersPending() {
return this.state.membersPending.map(function(member, i) {
return (
<ActionPanel
name={member.email}
key={i}
title={member.email}
content={member.status}
buttons={
<div className="pull-right">
<button
className="btn btn-default btn-sm margin-left-2px"
onClick={this.handleResend}
data-id={member.email}>
{getLangText('RESEND')}
</button>
<button
className="btn btn-default btn-sm ascribe-btn-gray margin-left-2px"
onClick={this.handleRevoke}
data-id={member.email}>
{getLangText('REVOKE')}
</button>
</div>
}/>
);
}, this);
},
getMembersActive() {
return this.state.membersActive.map(function(member, i) {
return (
<ActionPanel
name={member.email}
key={i}
title={member.email}
content={member.status}
buttons={
<div className="pull-right">
<button
className="btn btn-default btn-sm ascribe-btn-gray"
onClick={this.handleRevoke}
data-id={member.email}>
{getLangText('REVOKE')}
</button>
</div>
}/>
);
}, this);
},
getMembersInactive() {
return this.state.membersInactive.map(function(member, i) {
return (
<ActionPanel
name={member.email}
key={i}
title={member.email}
content={member.status}
buttons={
<div className="pull-right">
<button
className="btn btn-default btn-sm"
onClick={this.handleActivate}
data-id={member.email}>
{getLangText('ACTIVATE')}
</button>
</div>
}/>
);
}, this);
},
getMembers() {
let content = (
<div style={{textAlign: 'center'}}>
<img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />
</div>);
if (this.state.members.length > -1) {
content = this.state.members.map(function(member, i) {
return (
<ActionPanel
name={member.email}
key={i}
title={member.email}
content={member.status}
buttons={<button
className="pull-right btn btn-default btn-sm"
data-id={member.name}>
{getLangText('RESEND INVITATION')}
</button>}
/>);
}, this);
content = (
<div>
{content}
<div style={{padding: '1em'}}>
<CollapsibleParagraph
title={'Active Jury Members'}
show={true}
defaultExpanded={true}>
{this.getMembersActive()}
</CollapsibleParagraph>
<CollapsibleParagraph
title={'Pending Jury Invitations'}
show={true}
defaultExpanded={true}>
{this.getMembersPending()}
</CollapsibleParagraph>
<CollapsibleParagraph
title={'Deactivated Jury Members'}
show={true}
defaultExpanded={false}>
{this.getMembersInactive()}
</CollapsibleParagraph>
</div>);
}
return content;
},
render() {
return (
<div>
<Form
url={apiUrls.jury}
url={apiUrls.jurys}
handleSuccess={this.handleCreateSuccess}
ref='form'
buttonSubmitText='INVITE'>
@ -190,7 +292,7 @@ let PrizeJurySettings = React.createClass({
</Property>
<hr />
</Form>
{content}
{this.getMembers()}
</div>
);
}

View File

@ -11,7 +11,10 @@ function getApiUrls(subdomain) {
'piece_submit_to_prize': AppPrizeConstants.prizeApiEndpoint + subdomain + '/pieces/${piece_id}/submit/',
'piece': AppPrizeConstants.prizeApiEndpoint + subdomain + '/pieces/${piece_id}/',
'prize': AppPrizeConstants.prizeApiEndpoint + subdomain + '/',
'jury': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/'
'jurys': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/',
'jury': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/',
'jury_activate': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/activate/',
'jury_resend': AppPrizeConstants.prizeApiEndpoint + subdomain + '/jury/${email}/resend/'
};
}

View File

@ -5,7 +5,19 @@ import requests from '../../../../utils/requests';
let PrizeJuryFetcher = {
fetch() {
return requests.get('jury');
return requests.get('jurys');
},
activate(email) {
return requests.post('jury_activate', {'email': email});
},
delete(email) {
return requests.delete('jury', {'email': email});
},
resend(email) {
return requests.post('jury_resend', {'email': email});
}
};

View File

@ -7,11 +7,28 @@ import PrizeJuryActions from '../actions/prize_jury_actions';
class PrizeJuryStore {
constructor() {
this.members = [];
this.membersActive = [];
this.membersPending = [];
this.membersInactive = [];
this.bindActions(PrizeJuryActions);
}
onUpdatePrizeJury( members ) {
this.members = members;
this.splitJuryMembers();
}
onRemovePrizeJury( email ) {
let memberInactive = this.members.filter((item)=> item.email === email );
this.membersActive = this.membersActive.filter((item)=> item.email !== email );
this.membersPending = this.membersPending.filter((item)=> item.email !== email );
this.membersInactive = this.membersInactive.concat(memberInactive);
}
splitJuryMembers(){
this.membersActive = this.members.filter((item)=> item.status === 'Invitation accepted' );
this.membersPending = this.members.filter((item)=> item.status === 'Invitation pending' );
this.membersInactive = this.members.filter((item)=> item.status === 'Deactivated' );
}
}

9
sass/ascribe_button.scss Normal file
View File

@ -0,0 +1,9 @@
.ascribe-btn-gray {
border-color: #CCCCCC;
background-color: #CCCCCC;
&:hover{
border-color: #AAAAAA;
background-color: #AAAAAA;
}
}

View File

@ -1,13 +1,18 @@
.ascribe-panel-wrapper {
border: 1px solid #F5F5F5;
border: 1px solid #DDD;
padding: 1.4em;
margin: 1em 0 1em 0;
}
.ascribe-panel-title {
padding: 1em 0 1em 1.5em;
margin-bottom: 0.5em;
}
.ascribe-panel-content {
padding: .75em 0 .75em 1em;
font-size: 1em;
color: #616161;
font-size: 0.9em;
color: rgba(0,0,0,0.5);
}
.ascribe-panel-buttons {
margin-top: 0.5em;
}

View File

@ -28,6 +28,7 @@ $BASE_URL: '<%= BASE_URL %>';
@import 'ascribe_slides_container';
@import 'ascribe_form';
@import 'ascribe_panel';
@import 'ascribe_button';
@import 'whitelabel/index';
@ -325,6 +326,10 @@ hr {
margin-top: 1px;
}
.margin-left-2px{
margin-left: 2px;
}
.spin {
display:inline-block;
-webkit-animation: spin 1s infinite linear;