forms listing complete
This commit is contained in:
@ -1,10 +1,12 @@
|
||||
define([
|
||||
'react',
|
||||
'react-dom',
|
||||
'jquery',
|
||||
'select2'
|
||||
],
|
||||
function(
|
||||
React,
|
||||
ReactDOM,
|
||||
jQuery
|
||||
) {
|
||||
var Selection = React.createClass({
|
||||
@ -21,12 +23,12 @@ function(
|
||||
this.setupSelect2();
|
||||
},
|
||||
setupSelect2: function() {
|
||||
if(this.state.initialized === true) {
|
||||
if(!this.props.field.multiple || this.state.initialized === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
if(this.props.field.select2 && Object.keys(this.props.item).length > 0) {
|
||||
var select2 = jQuery('#'+this.props.field.id).select2({
|
||||
if(Object.keys(this.props.item).length > 0) {
|
||||
var select2 = jQuery('#'+this.refs.select.id).select2({
|
||||
width: (this.props.width || ''),
|
||||
templateResult: function(item) {
|
||||
if (item.element && item.element.selected) {
|
||||
@ -37,8 +39,7 @@ function(
|
||||
}
|
||||
});
|
||||
|
||||
select2.on('change', this.handleChange)
|
||||
|
||||
select2.on('change', this.handleChange);
|
||||
select2.select2(
|
||||
'val',
|
||||
this.props.item[this.props.field.name]
|
||||
@ -55,11 +56,16 @@ function(
|
||||
});
|
||||
}
|
||||
},
|
||||
handleChange: function() {
|
||||
handleChange: function(e) {
|
||||
if(this.props.onValueChange !== undefined) {
|
||||
if(this.props.field.multiple) {
|
||||
value = jQuery('#'+this.refs.select.id).select2('val');
|
||||
} else {
|
||||
value = e.target.value;
|
||||
}
|
||||
this.props.onValueChange({
|
||||
target: {
|
||||
value: jQuery('#'+this.props.field.id).select2('val'),
|
||||
value: value,
|
||||
name: this.props.field.name
|
||||
}
|
||||
});
|
||||
@ -89,7 +95,8 @@ function(
|
||||
|
||||
return (
|
||||
<select
|
||||
id={ this.props.field.id }
|
||||
id={ this.props.field.id || this.props.field.name }
|
||||
ref="select"
|
||||
placeholder={ this.props.field.placeholder }
|
||||
multiple={ this.props.field.multiple }
|
||||
onChange={ this.handleChange }
|
||||
|
@ -14,7 +14,8 @@ const fields = [
|
||||
name: 'segments',
|
||||
label: 'Lists',
|
||||
type: 'selection',
|
||||
endpoint: 'segments'
|
||||
endpoint: 'segments',
|
||||
multiple: true
|
||||
}
|
||||
]
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import { Router, Link, History } from 'react-router'
|
||||
import { Router, Link } from 'react-router'
|
||||
import Listing from 'listing/listing.jsx'
|
||||
import classNames from 'classnames'
|
||||
import MailPoet from 'mailpoet'
|
||||
@ -11,6 +11,11 @@ const columns = [
|
||||
label: 'Name',
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
name: 'segments',
|
||||
label: 'Lists',
|
||||
sortable: false
|
||||
},
|
||||
{
|
||||
name: 'created_at',
|
||||
label: 'Created on',
|
||||
@ -20,57 +25,57 @@ const columns = [
|
||||
|
||||
const messages = {
|
||||
onTrash: function(response) {
|
||||
let count = ~~response.forms;
|
||||
let message = null;
|
||||
if(response) {
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 form was moved to the trash.'
|
||||
);
|
||||
} else if(~~response > 1) {
|
||||
message = (
|
||||
'%$1d forms were moved to the trash.'
|
||||
).replace('%$1d', ~~response);
|
||||
}
|
||||
|
||||
if(count === 1 || response === true) {
|
||||
message = (
|
||||
'1 form was moved to the trash.'
|
||||
);
|
||||
} else if(count > 1) {
|
||||
message = (
|
||||
'%$1d forms were moved to the trash.'
|
||||
).replace('%$1d', count);
|
||||
}
|
||||
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
}
|
||||
}
|
||||
},
|
||||
onDelete: function(response) {
|
||||
let count = ~~response.forms;
|
||||
let message = null;
|
||||
if(response) {
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 form was permanently deleted.'
|
||||
);
|
||||
} else if(~~response > 1) {
|
||||
message = (
|
||||
'%$1d forms were permanently deleted.'
|
||||
).replace('%$1d', ~~response);
|
||||
}
|
||||
|
||||
if(count === 1 || response === true) {
|
||||
message = (
|
||||
'1 form was permanently deleted.'
|
||||
);
|
||||
} else if(count > 1) {
|
||||
message = (
|
||||
'%$1d forms were permanently deleted.'
|
||||
).replace('%$1d', count);
|
||||
}
|
||||
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
}
|
||||
}
|
||||
},
|
||||
onRestore: function(response) {
|
||||
let count = ~~response.forms;
|
||||
let message = null;
|
||||
if(response) {
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 form has been restored from the trash.'
|
||||
);
|
||||
} else if(~~response > 1) {
|
||||
message = (
|
||||
'%$1d forms have been restored from the trash.'
|
||||
).replace('%$1d', ~~response);
|
||||
}
|
||||
|
||||
if(count === 1 || response === true) {
|
||||
message = (
|
||||
'1 form has been restored from the trash.'
|
||||
);
|
||||
} else if(count > 1) {
|
||||
message = (
|
||||
'%$1d forms have been restored from the trash.'
|
||||
).replace('%$1d', count);
|
||||
}
|
||||
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
if(message !== null) {
|
||||
MailPoet.Notice.success(message);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -78,6 +83,7 @@ const messages = {
|
||||
const item_actions = [
|
||||
{
|
||||
name: 'edit',
|
||||
label: 'Edit',
|
||||
link: function(item) {
|
||||
return (
|
||||
<Link to={ `/edit/${item.id}` }>Edit</Link>
|
||||
@ -86,24 +92,17 @@ const item_actions = [
|
||||
},
|
||||
{
|
||||
name: 'duplicate_form',
|
||||
refresh: true,
|
||||
link: function(item) {
|
||||
return (
|
||||
<a
|
||||
href="javascript:;"
|
||||
onClick={ this.onDuplicate.bind(null, item) }
|
||||
>Duplicate</a>
|
||||
);
|
||||
},
|
||||
onDuplicate: function(item) {
|
||||
MailPoet.Ajax.post({
|
||||
label: 'Duplicate',
|
||||
onClick: function(item, refresh) {
|
||||
return MailPoet.Ajax.post({
|
||||
endpoint: 'forms',
|
||||
action: 'duplicate',
|
||||
data: item.id
|
||||
}).done(function() {
|
||||
}).done(function(response) {
|
||||
MailPoet.Notice.success(
|
||||
('List "%$1s" has been duplicated.').replace('%$1s', item.name)
|
||||
('Form "%$1s" has been duplicated.').replace('%$1s', response.name)
|
||||
);
|
||||
refresh();
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -113,12 +112,7 @@ const bulk_actions = [
|
||||
{
|
||||
name: 'trash',
|
||||
label: 'Trash',
|
||||
getData: function() {
|
||||
return {
|
||||
confirm: false
|
||||
}
|
||||
},
|
||||
onSuccess: messages.onDelete
|
||||
onSuccess: messages.onTrash
|
||||
}
|
||||
];
|
||||
|
||||
@ -161,6 +155,8 @@ const FormList = React.createClass({
|
||||
</h2>
|
||||
|
||||
<Listing
|
||||
location={ this.props.location }
|
||||
params={ this.props.params }
|
||||
messages={ messages }
|
||||
search={ false }
|
||||
limit={ 1000 }
|
||||
|
@ -34,11 +34,9 @@ define(
|
||||
};
|
||||
},
|
||||
handleSelectItem: function(e) {
|
||||
var is_checked = jQuery(e.target).is(':checked');
|
||||
|
||||
this.props.onSelectItem(
|
||||
parseInt(e.target.value, 10),
|
||||
is_checked
|
||||
e.target.checked
|
||||
);
|
||||
|
||||
return !e.target.checked;
|
||||
@ -61,11 +59,12 @@ define(
|
||||
if(this.props.is_selectable === true) {
|
||||
checkbox = (
|
||||
<th className="check-column" scope="row">
|
||||
<label className="screen-reader-text">
|
||||
{ 'Select ' + this.props.item.email }</label>
|
||||
<label className="screen-reader-text">{
|
||||
'Select ' + this.props.item[this.props.columns[0].name]
|
||||
}</label>
|
||||
<input
|
||||
type="checkbox"
|
||||
defaultValue={ this.props.item.id }
|
||||
value={ this.props.item.id }
|
||||
checked={
|
||||
this.props.item.selected || this.props.selection === 'all'
|
||||
}
|
||||
@ -267,7 +266,7 @@ define(
|
||||
is_selectable={ this.props.is_selectable }
|
||||
item_actions={ this.props.item_actions }
|
||||
group={ this.props.group }
|
||||
key={ 'item-' + index }
|
||||
key={ `item-${item.id}-${index}` }
|
||||
item={ item } />
|
||||
);
|
||||
}.bind(this))}
|
||||
|
@ -34,8 +34,7 @@ define(
|
||||
placeholder: "Select a list",
|
||||
id: "mailpoet_segments",
|
||||
endpoint: "segments",
|
||||
multiple: true,
|
||||
select2: true
|
||||
multiple: true
|
||||
},
|
||||
{
|
||||
name: 'sender',
|
||||
|
@ -1,5 +1,5 @@
|
||||
import React from 'react'
|
||||
import { Router, Route, Link } from 'react-router'
|
||||
import { Router, Link } from 'react-router'
|
||||
|
||||
import jQuery from 'jquery'
|
||||
import MailPoet from 'mailpoet'
|
||||
@ -40,10 +40,10 @@ var columns = [
|
||||
}
|
||||
];
|
||||
|
||||
var messages = {
|
||||
const messages = {
|
||||
onTrash: function(response) {
|
||||
if(response) {
|
||||
var message = null;
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 segment was moved to the trash.'
|
||||
@ -61,7 +61,7 @@ var messages = {
|
||||
},
|
||||
onDelete: function(response) {
|
||||
if(response) {
|
||||
var message = null;
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 segment was permanently deleted.'
|
||||
@ -79,7 +79,7 @@ var messages = {
|
||||
},
|
||||
onRestore: function(response) {
|
||||
if(response) {
|
||||
var message = null;
|
||||
let message = null;
|
||||
if(~~response === 1) {
|
||||
message = (
|
||||
'1 segment has been restored from the trash.'
|
||||
@ -97,7 +97,7 @@ var messages = {
|
||||
}
|
||||
};
|
||||
|
||||
var item_actions = [
|
||||
const item_actions = [
|
||||
{
|
||||
name: 'edit',
|
||||
label: 'Edit',
|
||||
@ -133,7 +133,7 @@ var item_actions = [
|
||||
}
|
||||
];
|
||||
|
||||
var bulk_actions = [
|
||||
const bulk_actions = [
|
||||
{
|
||||
name: 'trash',
|
||||
label: 'Trash',
|
||||
@ -141,7 +141,7 @@ var bulk_actions = [
|
||||
}
|
||||
];
|
||||
|
||||
var SegmentList = React.createClass({
|
||||
const SegmentList = React.createClass({
|
||||
renderItem: function(segment, actions) {
|
||||
var rowClasses = classNames(
|
||||
'manage-column',
|
||||
|
Reference in New Issue
Block a user