Fix lists not showing on the subscriber form
This commit is contained in:
Kailash Nadh
parent
64043f0d62
commit
348e65f1ec
|
|
@ -1,4 +1,4 @@
|
|||
import React from "react"
|
||||
import React from "react";
|
||||
import {
|
||||
Row,
|
||||
Col,
|
||||
|
|
@ -10,72 +10,72 @@ import {
|
|||
Spin,
|
||||
Popconfirm,
|
||||
notification
|
||||
} from "antd"
|
||||
} from "antd";
|
||||
|
||||
import * as cs from "./constants"
|
||||
import * as cs from "./constants";
|
||||
|
||||
const tagColors = {
|
||||
enabled: "green",
|
||||
blacklisted: "red"
|
||||
}
|
||||
};
|
||||
const formItemLayoutModal = {
|
||||
labelCol: { xs: { span: 24 }, sm: { span: 4 } },
|
||||
wrapperCol: { xs: { span: 24 }, sm: { span: 18 } }
|
||||
}
|
||||
};
|
||||
const formItemLayout = {
|
||||
labelCol: { xs: { span: 16 }, sm: { span: 4 } },
|
||||
wrapperCol: { xs: { span: 16 }, sm: { span: 10 } }
|
||||
}
|
||||
};
|
||||
const formItemTailLayout = {
|
||||
wrapperCol: { xs: { span: 24, offset: 0 }, sm: { span: 10, offset: 4 } }
|
||||
}
|
||||
};
|
||||
|
||||
class CreateFormDef extends React.PureComponent {
|
||||
state = {
|
||||
confirmDirty: false,
|
||||
loading: false
|
||||
}
|
||||
};
|
||||
|
||||
// Handle create / edit form submission.
|
||||
handleSubmit = (e, cb) => {
|
||||
e.preventDefault()
|
||||
e.preventDefault();
|
||||
if (!cb) {
|
||||
// Set a fake callback.
|
||||
cb = () => {}
|
||||
cb = () => {};
|
||||
}
|
||||
|
||||
var err = null,
|
||||
values = {}
|
||||
values = {};
|
||||
this.props.form.validateFields((e, v) => {
|
||||
err = e
|
||||
values = v
|
||||
})
|
||||
err = e;
|
||||
values = v;
|
||||
});
|
||||
if (err) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
let a = values["attribs"]
|
||||
values["attribs"] = {}
|
||||
let a = values["attribs"];
|
||||
values["attribs"] = {};
|
||||
if (a && a.length > 0) {
|
||||
try {
|
||||
values["attribs"] = JSON.parse(a)
|
||||
values["attribs"] = JSON.parse(a);
|
||||
if (values["attribs"] instanceof Array) {
|
||||
notification["error"]({
|
||||
message: "Invalid JSON type",
|
||||
description: "Attributes should be a map {} and not an array []"
|
||||
})
|
||||
return
|
||||
});
|
||||
return;
|
||||
}
|
||||
} catch (e) {
|
||||
notification["error"]({
|
||||
message: "Invalid JSON in attributes",
|
||||
description: e.toString()
|
||||
})
|
||||
return
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
this.setState({ loading: true })
|
||||
this.setState({ loading: true });
|
||||
if (this.props.formType === cs.FormCreate) {
|
||||
// Add a subscriber.
|
||||
this.props
|
||||
|
|
@ -89,22 +89,22 @@ class CreateFormDef extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber added",
|
||||
description: `${values["email"]} added`
|
||||
})
|
||||
});
|
||||
if (!this.props.isModal) {
|
||||
this.props.fetchRecord(this.props.record.id)
|
||||
this.props.fetchRecord(this.props.record.id);
|
||||
}
|
||||
cb(true)
|
||||
this.setState({ loading: false })
|
||||
cb(true);
|
||||
this.setState({ loading: false });
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
cb(false)
|
||||
this.setState({ loading: false })
|
||||
})
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
cb(false);
|
||||
this.setState({ loading: false });
|
||||
});
|
||||
} else {
|
||||
// Edit a subscriber.
|
||||
delete values["keys"]
|
||||
delete values["vals"]
|
||||
delete values["keys"];
|
||||
delete values["vals"];
|
||||
this.props
|
||||
.modelRequest(
|
||||
cs.ModelSubscribers,
|
||||
|
|
@ -116,20 +116,20 @@ class CreateFormDef extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber modified",
|
||||
description: `${values["email"]} modified`
|
||||
})
|
||||
});
|
||||
if (!this.props.isModal) {
|
||||
this.props.fetchRecord(this.props.record.id)
|
||||
this.props.fetchRecord(this.props.record.id);
|
||||
}
|
||||
cb(true)
|
||||
this.setState({ loading: false })
|
||||
cb(true);
|
||||
this.setState({ loading: false });
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
cb(false)
|
||||
this.setState({ loading: false })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
cb(false);
|
||||
this.setState({ loading: false });
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
handleDeleteRecord = record => {
|
||||
this.props
|
||||
|
|
@ -143,40 +143,40 @@ class CreateFormDef extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber deleted",
|
||||
description: `${record.email} deleted`
|
||||
})
|
||||
});
|
||||
|
||||
this.props.route.history.push({
|
||||
pathname: cs.Routes.ViewSubscribers
|
||||
})
|
||||
});
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { formType, record } = this.props
|
||||
const { getFieldDecorator } = this.props.form
|
||||
const { formType, record } = this.props;
|
||||
const { getFieldDecorator } = this.props.form;
|
||||
|
||||
if (formType === null) {
|
||||
return null
|
||||
return null;
|
||||
}
|
||||
|
||||
let subListIDs = []
|
||||
let subStatuses = {}
|
||||
let subListIDs = [];
|
||||
let subStatuses = {};
|
||||
if (this.props.record && this.props.record.lists) {
|
||||
subListIDs = this.props.record.lists.map(v => {
|
||||
return v["id"]
|
||||
})
|
||||
return v["id"];
|
||||
});
|
||||
subStatuses = this.props.record.lists.reduce(
|
||||
(o, item) => ({ ...o, [item.id]: item.subscription_status }),
|
||||
{}
|
||||
)
|
||||
);
|
||||
} else if (this.props.list) {
|
||||
subListIDs = [this.props.list.id]
|
||||
subListIDs = [this.props.list.id];
|
||||
}
|
||||
|
||||
const layout = this.props.isModal ? formItemLayoutModal : formItemLayout
|
||||
const layout = this.props.isModal ? formItemLayoutModal : formItemLayout;
|
||||
return (
|
||||
<Spin spinning={this.state.loading}>
|
||||
<Form onSubmit={this.handleSubmit}>
|
||||
|
|
@ -273,7 +273,7 @@ class CreateFormDef extends React.PureComponent {
|
|||
<Popconfirm
|
||||
title="Are you sure?"
|
||||
onConfirm={() => {
|
||||
this.handleDeleteRecord(record)
|
||||
this.handleDeleteRecord(record);
|
||||
}}
|
||||
>
|
||||
<Button icon="delete">Delete</Button>
|
||||
|
|
@ -283,11 +283,11 @@ class CreateFormDef extends React.PureComponent {
|
|||
)}
|
||||
</Form>
|
||||
</Spin>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const CreateForm = Form.create()(CreateFormDef)
|
||||
const CreateForm = Form.create()(CreateFormDef);
|
||||
|
||||
class Subscriber extends React.PureComponent {
|
||||
state = {
|
||||
|
|
@ -297,19 +297,19 @@ class Subscriber extends React.PureComponent {
|
|||
subID: this.props.route.match.params
|
||||
? parseInt(this.props.route.match.params.subID, 10)
|
||||
: 0
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
// When this component is invoked within a modal from the subscribers list page,
|
||||
// the necessary context is supplied and there's no need to fetch anything.
|
||||
if (!this.props.isModal) {
|
||||
// Fetch lists.
|
||||
this.props.modelRequest(cs.ModelLists, cs.Routes.GetLists, cs.MethodGet)
|
||||
this.props.modelRequest(cs.ModelLists, cs.Routes.GetLists, cs.MethodGet);
|
||||
|
||||
// Fetch subscriber.
|
||||
this.fetchRecord(this.state.subID)
|
||||
this.fetchRecord(this.state.subID);
|
||||
} else {
|
||||
this.setState({ record: this.props.record, loading: false })
|
||||
this.setState({ record: this.props.record, loading: false });
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -317,26 +317,26 @@ class Subscriber extends React.PureComponent {
|
|||
this.props
|
||||
.request(cs.Routes.GetSubscriber, cs.MethodGet, { id: id })
|
||||
.then(r => {
|
||||
this.setState({ record: r.data.data, loading: false })
|
||||
this.setState({ record: r.data.data, loading: false });
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({
|
||||
placement: cs.MsgPosition,
|
||||
message: "Error",
|
||||
description: e.message
|
||||
})
|
||||
})
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
setFormRef = r => {
|
||||
this.setState({ formRef: r })
|
||||
}
|
||||
this.setState({ formRef: r });
|
||||
};
|
||||
|
||||
submitForm = (e, cb) => {
|
||||
if (this.state.formRef) {
|
||||
this.state.formRef.handleSubmit(e, cb)
|
||||
}
|
||||
this.state.formRef.handleSubmit(e, cb);
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
|
|
@ -375,23 +375,23 @@ class Subscriber extends React.PureComponent {
|
|||
formType={this.props.formType ? this.props.formType : cs.FormEdit}
|
||||
record={this.state.record}
|
||||
fetchRecord={this.fetchRecord}
|
||||
lists={this.props.data[cs.ModelLists]}
|
||||
lists={this.props.data[cs.ModelLists].results}
|
||||
wrappedComponentRef={r => {
|
||||
if (!r) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
// Save the form's reference so that when this component
|
||||
// is used as a modal, the invoker of the model can submit
|
||||
// it via submitForm()
|
||||
this.setState({ formRef: r })
|
||||
this.setState({ formRef: r });
|
||||
}}
|
||||
/>
|
||||
</Spin>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Subscriber
|
||||
export default Subscriber;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React from "react"
|
||||
import { Link } from "react-router-dom"
|
||||
import React from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import {
|
||||
Row,
|
||||
Col,
|
||||
|
|
@ -15,44 +15,44 @@ import {
|
|||
Popconfirm,
|
||||
notification,
|
||||
Radio
|
||||
} from "antd"
|
||||
} from "antd";
|
||||
|
||||
import Utils from "./utils"
|
||||
import Subscriber from "./Subscriber"
|
||||
import * as cs from "./constants"
|
||||
import Utils from "./utils";
|
||||
import Subscriber from "./Subscriber";
|
||||
import * as cs from "./constants";
|
||||
|
||||
const tagColors = {
|
||||
enabled: "green",
|
||||
blacklisted: "red"
|
||||
}
|
||||
};
|
||||
|
||||
class ListsFormDef extends React.PureComponent {
|
||||
state = {
|
||||
modalWaiting: false
|
||||
}
|
||||
};
|
||||
|
||||
// Handle create / edit form submission.
|
||||
handleSubmit = e => {
|
||||
e.preventDefault()
|
||||
e.preventDefault();
|
||||
|
||||
var err = null,
|
||||
values = {}
|
||||
values = {};
|
||||
this.props.form.validateFields((e, v) => {
|
||||
err = e
|
||||
values = v
|
||||
})
|
||||
err = e;
|
||||
values = v;
|
||||
});
|
||||
if (err) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.props.allRowsSelected) {
|
||||
values["list_ids"] = this.props.listIDs
|
||||
values["query"] = this.props.query
|
||||
values["list_ids"] = this.props.listIDs;
|
||||
values["query"] = this.props.query;
|
||||
} else {
|
||||
values["ids"] = this.props.selectedRows.map(r => r.id)
|
||||
values["ids"] = this.props.selectedRows.map(r => r.id);
|
||||
}
|
||||
|
||||
this.setState({ modalWaiting: true })
|
||||
this.setState({ modalWaiting: true });
|
||||
this.props
|
||||
.request(
|
||||
!this.props.allRowsSelected
|
||||
|
|
@ -65,24 +65,24 @@ class ListsFormDef extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Lists changed",
|
||||
description: `Lists changed for selected subscribers`
|
||||
})
|
||||
this.props.clearSelectedRows()
|
||||
this.props.fetchRecords()
|
||||
this.setState({ modalWaiting: false })
|
||||
this.props.onClose()
|
||||
});
|
||||
this.props.clearSelectedRows();
|
||||
this.props.fetchRecords();
|
||||
this.setState({ modalWaiting: false });
|
||||
this.props.onClose();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
this.setState({ modalWaiting: false })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
this.setState({ modalWaiting: false });
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { getFieldDecorator } = this.props.form
|
||||
const { getFieldDecorator } = this.props.form;
|
||||
const formItemLayout = {
|
||||
labelCol: { xs: { span: 16 }, sm: { span: 4 } },
|
||||
wrapperCol: { xs: { span: 16 }, sm: { span: 18 } }
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
|
|
@ -123,14 +123,14 @@ class ListsFormDef extends React.PureComponent {
|
|||
</Form.Item>
|
||||
</Form>
|
||||
</Modal>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const ListsForm = Form.create()(ListsFormDef)
|
||||
const ListsForm = Form.create()(ListsFormDef);
|
||||
|
||||
class Subscribers extends React.PureComponent {
|
||||
defaultPerPage = 20
|
||||
defaultPerPage = 20;
|
||||
|
||||
state = {
|
||||
formType: null,
|
||||
|
|
@ -151,7 +151,7 @@ class Subscribers extends React.PureComponent {
|
|||
listModalVisible: false,
|
||||
allRowsSelected: false,
|
||||
selectedRows: []
|
||||
}
|
||||
};
|
||||
|
||||
// Pagination config.
|
||||
paginationOptions = {
|
||||
|
|
@ -163,15 +163,15 @@ class Subscribers extends React.PureComponent {
|
|||
position: "both",
|
||||
showTotal: (total, range) => `${range[0]} to ${range[1]} of ${total}`,
|
||||
onChange: (page, perPage) => {
|
||||
this.fetchRecords({ page: page, per_page: perPage })
|
||||
this.fetchRecords({ page: page, per_page: perPage });
|
||||
},
|
||||
onShowSizeChange: (page, perPage) => {
|
||||
this.fetchRecords({ page: page, per_page: perPage })
|
||||
}
|
||||
this.fetchRecords({ page: page, per_page: perPage });
|
||||
}
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props)
|
||||
super(props);
|
||||
|
||||
// Table layout.
|
||||
this.columns = [
|
||||
|
|
@ -181,7 +181,7 @@ class Subscribers extends React.PureComponent {
|
|||
sorter: true,
|
||||
width: "25%",
|
||||
render: (text, record) => {
|
||||
const out = []
|
||||
const out = [];
|
||||
out.push(
|
||||
<div key={`sub-email-${record.id}`} className="sub-name">
|
||||
<Link
|
||||
|
|
@ -190,15 +190,15 @@ class Subscribers extends React.PureComponent {
|
|||
// Open the individual subscriber page on ctrl+click
|
||||
// and the modal otherwise.
|
||||
if (!e.ctrlKey) {
|
||||
this.handleShowEditForm(record)
|
||||
e.preventDefault()
|
||||
this.handleShowEditForm(record);
|
||||
e.preventDefault();
|
||||
}
|
||||
}}
|
||||
>
|
||||
{text}
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
|
||||
if (record.lists.length > 0) {
|
||||
for (let i = 0; i < record.lists.length; i++) {
|
||||
|
|
@ -220,11 +220,11 @@ class Subscribers extends React.PureComponent {
|
|||
{record.lists[i].subscription_status}
|
||||
</sup>
|
||||
</Tag>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
return out
|
||||
return out;
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -240,14 +240,14 @@ class Subscribers extends React.PureComponent {
|
|||
// Open the individual subscriber page on ctrl+click
|
||||
// and the modal otherwise.
|
||||
if (!e.ctrlKey) {
|
||||
this.handleShowEditForm(record)
|
||||
e.preventDefault()
|
||||
this.handleShowEditForm(record);
|
||||
e.preventDefault();
|
||||
}
|
||||
}}
|
||||
>
|
||||
{text}
|
||||
</Link>
|
||||
)
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -261,7 +261,7 @@ class Subscribers extends React.PureComponent {
|
|||
>
|
||||
{status}
|
||||
</Tag>
|
||||
)
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -282,7 +282,7 @@ class Subscribers extends React.PureComponent {
|
|||
0
|
||||
)}
|
||||
</span>
|
||||
)
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -290,7 +290,7 @@ class Subscribers extends React.PureComponent {
|
|||
width: "10%",
|
||||
dataIndex: "created_at",
|
||||
render: (date, _) => {
|
||||
return Utils.DateString(date)
|
||||
return Utils.DateString(date);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -298,7 +298,7 @@ class Subscribers extends React.PureComponent {
|
|||
width: "10%",
|
||||
dataIndex: "updated_at",
|
||||
render: (date, _) => {
|
||||
return Utils.DateString(date)
|
||||
return Utils.DateString(date);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -328,10 +328,10 @@ class Subscribers extends React.PureComponent {
|
|||
</Tooltip>
|
||||
</Popconfirm>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
]
|
||||
];
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
|
@ -341,18 +341,18 @@ class Subscribers extends React.PureComponent {
|
|||
.then(() => {
|
||||
// If this is an individual list's view, pick up that list.
|
||||
if (this.state.queryParams.listID) {
|
||||
this.props.data[cs.ModelLists].forEach(l => {
|
||||
this.props.data[cs.ModelLists].results.forEach(l => {
|
||||
if (l.id === this.state.queryParams.listID) {
|
||||
this.setState({
|
||||
queryParams: { ...this.state.queryParams, list: l }
|
||||
})
|
||||
return false
|
||||
});
|
||||
return false;
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
}
|
||||
|
||||
fetchRecords = params => {
|
||||
|
|
@ -361,15 +361,15 @@ class Subscribers extends React.PureComponent {
|
|||
per_page: this.state.queryParams.per_page,
|
||||
list_id: this.state.queryParams.listID,
|
||||
query: this.state.queryParams.query
|
||||
}
|
||||
};
|
||||
|
||||
// The records are for a specific list.
|
||||
if (this.state.queryParams.listID) {
|
||||
qParams.list_id = this.state.queryParams.listID
|
||||
qParams.list_id = this.state.queryParams.listID;
|
||||
}
|
||||
|
||||
if (params) {
|
||||
qParams = { ...qParams, ...params }
|
||||
qParams = { ...qParams, ...params };
|
||||
}
|
||||
|
||||
this.props
|
||||
|
|
@ -388,9 +388,9 @@ class Subscribers extends React.PureComponent {
|
|||
page: this.props.data[cs.ModelSubscribers].page,
|
||||
query: this.props.data[cs.ModelSubscribers].query
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
handleDeleteRecord = record => {
|
||||
this.props
|
||||
|
|
@ -404,15 +404,15 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber deleted",
|
||||
description: `${record.email} deleted`
|
||||
})
|
||||
});
|
||||
|
||||
// Reload the table.
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
handleDeleteRecords = records => {
|
||||
this.props
|
||||
|
|
@ -426,15 +426,15 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber(s) deleted",
|
||||
description: "Selected subscribers deleted"
|
||||
})
|
||||
});
|
||||
|
||||
// Reload the table.
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
handleBlacklistSubscribers = records => {
|
||||
this.props
|
||||
|
|
@ -445,15 +445,15 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber(s) blacklisted",
|
||||
description: "Selected subscribers blacklisted"
|
||||
})
|
||||
});
|
||||
|
||||
// Reload the table.
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
// Arbitrary query based calls.
|
||||
handleDeleteRecordsByQuery = (listIDs, query) => {
|
||||
|
|
@ -468,15 +468,15 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber(s) deleted",
|
||||
description: "Selected subscribers have been deleted"
|
||||
})
|
||||
});
|
||||
|
||||
// Reload the table.
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
handleBlacklistSubscribersByQuery = (listIDs, query) => {
|
||||
this.props
|
||||
|
|
@ -488,22 +488,22 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber(s) blacklisted",
|
||||
description: "Selected subscribers have been blacklisted"
|
||||
})
|
||||
});
|
||||
|
||||
// Reload the table.
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
handleQuerySubscribersIntoLists = (query, sourceList, targetLists) => {
|
||||
let params = {
|
||||
query: query,
|
||||
source_list: sourceList,
|
||||
target_lists: targetLists
|
||||
}
|
||||
};
|
||||
|
||||
this.props
|
||||
.request(cs.Routes.QuerySubscribersIntoLists, cs.MethodPost, params)
|
||||
|
|
@ -511,75 +511,75 @@ class Subscribers extends React.PureComponent {
|
|||
notification["success"]({
|
||||
message: "Subscriber(s) added",
|
||||
description: `${res.data.data.count} added`
|
||||
})
|
||||
this.handleToggleListModal()
|
||||
});
|
||||
this.handleToggleListModal();
|
||||
})
|
||||
.catch(e => {
|
||||
notification["error"]({ message: "Error", description: e.message })
|
||||
})
|
||||
}
|
||||
notification["error"]({ message: "Error", description: e.message });
|
||||
});
|
||||
};
|
||||
|
||||
handleHideForm = () => {
|
||||
this.setState({ formType: null })
|
||||
}
|
||||
this.setState({ formType: null });
|
||||
};
|
||||
|
||||
handleShowCreateForm = () => {
|
||||
this.setState({ formType: cs.FormCreate, attribs: [], record: {} })
|
||||
}
|
||||
this.setState({ formType: cs.FormCreate, attribs: [], record: {} });
|
||||
};
|
||||
|
||||
handleShowEditForm = record => {
|
||||
this.setState({ formType: cs.FormEdit, record: record })
|
||||
}
|
||||
this.setState({ formType: cs.FormEdit, record: record });
|
||||
};
|
||||
|
||||
handleToggleListsForm = () => {
|
||||
this.setState({ listsFormVisible: !this.state.listsFormVisible })
|
||||
}
|
||||
this.setState({ listsFormVisible: !this.state.listsFormVisible });
|
||||
};
|
||||
|
||||
handleSearch = q => {
|
||||
q = q.trim().toLowerCase()
|
||||
q = q.trim().toLowerCase();
|
||||
if (q === "") {
|
||||
this.fetchRecords({ query: null })
|
||||
return
|
||||
this.fetchRecords({ query: null });
|
||||
return;
|
||||
}
|
||||
|
||||
q = q.replace(/'/g, "''")
|
||||
const query = `(name ~* '${q}' OR email ~* '${q}')`
|
||||
this.fetchRecords({ query: query })
|
||||
}
|
||||
q = q.replace(/'/g, "''");
|
||||
const query = `(name ~* '${q}' OR email ~* '${q}')`;
|
||||
this.fetchRecords({ query: query });
|
||||
};
|
||||
|
||||
handleSelectRow = (_, records) => {
|
||||
this.setState({ allRowsSelected: false, selectedRows: records })
|
||||
}
|
||||
this.setState({ allRowsSelected: false, selectedRows: records });
|
||||
};
|
||||
|
||||
handleSelectAllRows = () => {
|
||||
this.setState({
|
||||
allRowsSelected: true,
|
||||
selectedRows: this.props.data[cs.ModelSubscribers].results
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
clearSelectedRows = (_, records) => {
|
||||
this.setState({ allRowsSelected: false, selectedRows: [] })
|
||||
}
|
||||
this.setState({ allRowsSelected: false, selectedRows: [] });
|
||||
};
|
||||
|
||||
handleToggleQueryForm = () => {
|
||||
this.setState({ queryFormVisible: !this.state.queryFormVisible })
|
||||
}
|
||||
this.setState({ queryFormVisible: !this.state.queryFormVisible });
|
||||
};
|
||||
|
||||
handleToggleListModal = () => {
|
||||
this.setState({ listModalVisible: !this.state.listModalVisible })
|
||||
}
|
||||
this.setState({ listModalVisible: !this.state.listModalVisible });
|
||||
};
|
||||
|
||||
render() {
|
||||
const pagination = {
|
||||
...this.paginationOptions,
|
||||
...this.state.queryParams
|
||||
}
|
||||
};
|
||||
|
||||
if (this.state.queryParams.list) {
|
||||
this.props.pageTitle(this.state.queryParams.list.name + " / Subscribers")
|
||||
this.props.pageTitle(this.state.queryParams.list.name + " / Subscribers");
|
||||
} else {
|
||||
this.props.pageTitle("Subscribers")
|
||||
this.props.pageTitle("Subscribers");
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
@ -644,7 +644,7 @@ class Subscribers extends React.PureComponent {
|
|||
...this.state.queryParams,
|
||||
query: e.target.value
|
||||
}
|
||||
})
|
||||
});
|
||||
}}
|
||||
value={this.state.queryParams.query}
|
||||
autosize={{ minRows: 2, maxRows: 10 }}
|
||||
|
|
@ -661,7 +661,7 @@ class Subscribers extends React.PureComponent {
|
|||
type="primary"
|
||||
icon="search"
|
||||
onClick={() => {
|
||||
this.fetchRecords()
|
||||
this.fetchRecords();
|
||||
}}
|
||||
>
|
||||
Query
|
||||
|
|
@ -670,7 +670,7 @@ class Subscribers extends React.PureComponent {
|
|||
disabled={this.state.queryParams.query === ""}
|
||||
icon="refresh"
|
||||
onClick={() => {
|
||||
this.fetchRecords({ query: null })
|
||||
this.fetchRecords({ query: null });
|
||||
}}
|
||||
>
|
||||
Reset
|
||||
|
|
@ -717,11 +717,11 @@ class Subscribers extends React.PureComponent {
|
|||
? [this.state.queryParams.listID]
|
||||
: [],
|
||||
this.state.queryParams.query
|
||||
)
|
||||
this.clearSelectedRows()
|
||||
);
|
||||
this.clearSelectedRows();
|
||||
} else {
|
||||
this.handleDeleteRecords(this.state.selectedRows)
|
||||
this.clearSelectedRows()
|
||||
this.handleDeleteRecords(this.state.selectedRows);
|
||||
this.clearSelectedRows();
|
||||
}
|
||||
}}
|
||||
>
|
||||
|
|
@ -738,13 +738,13 @@ class Subscribers extends React.PureComponent {
|
|||
? [this.state.queryParams.listID]
|
||||
: [],
|
||||
this.state.queryParams.query
|
||||
)
|
||||
this.clearSelectedRows()
|
||||
);
|
||||
this.clearSelectedRows();
|
||||
} else {
|
||||
this.handleBlacklistSubscribers(
|
||||
this.state.selectedRows
|
||||
)
|
||||
this.clearSelectedRows()
|
||||
);
|
||||
this.clearSelectedRows();
|
||||
}
|
||||
}}
|
||||
>
|
||||
|
|
@ -767,9 +767,9 @@ class Subscribers extends React.PureComponent {
|
|||
!this.props.data[cs.ModelSubscribers] ||
|
||||
!this.props.data[cs.ModelSubscribers].hasOwnProperty("results")
|
||||
) {
|
||||
return []
|
||||
return [];
|
||||
}
|
||||
return this.props.data[cs.ModelSubscribers].results
|
||||
return this.props.data[cs.ModelSubscribers].results;
|
||||
})()}
|
||||
loading={this.props.reqStates[cs.ModelSubscribers] !== cs.StateDone}
|
||||
pagination={pagination}
|
||||
|
|
@ -789,16 +789,16 @@ class Subscribers extends React.PureComponent {
|
|||
confirmLoading={this.state.modalWaiting}
|
||||
onOk={e => {
|
||||
if (!this.state.modalForm) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
// This submits the form embedded in the Subscriber component.
|
||||
this.state.modalForm.submitForm(e, ok => {
|
||||
if (ok) {
|
||||
this.handleHideForm()
|
||||
this.fetchRecords()
|
||||
this.handleHideForm();
|
||||
this.fetchRecords();
|
||||
}
|
||||
})
|
||||
});
|
||||
}}
|
||||
onCancel={this.handleHideForm}
|
||||
okButtonProps={{
|
||||
|
|
@ -813,10 +813,10 @@ class Subscribers extends React.PureComponent {
|
|||
record={this.state.record}
|
||||
ref={r => {
|
||||
if (!r) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
|
||||
this.setState({ modalForm: r })
|
||||
this.setState({ modalForm: r });
|
||||
}}
|
||||
/>
|
||||
</Modal>
|
||||
|
|
@ -825,7 +825,7 @@ class Subscribers extends React.PureComponent {
|
|||
{this.state.listsFormVisible && (
|
||||
<ListsForm
|
||||
{...this.props}
|
||||
lists={this.props.data[cs.ModelLists]}
|
||||
lists={this.props.data[cs.ModelLists].results}
|
||||
allRowsSelected={this.state.allRowsSelected}
|
||||
selectedRows={this.state.selectedRows}
|
||||
selectedLists={
|
||||
|
|
@ -840,8 +840,8 @@ class Subscribers extends React.PureComponent {
|
|||
/>
|
||||
)}
|
||||
</section>
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Subscribers
|
||||
export default Subscribers;
|
||||
|
|
|
|||
Loading…
Reference in New Issue