hangar-tech
/
listmonk
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix subscriber export button

This commit is contained in:
Kailash Nadh 2019-12-01 17:57:13 +05:30
parent 427dd93d3b
commit 0d8abf9435
1 changed files with 84 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

171
frontend/src/Subscriber.js
View File

@ -1,4 +1,4 @@
import React from "react";
import React from "react"
import {
Row,
Col,
@ -12,72 +12,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
@ -91,22 +91,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,
@ -118,20 +118,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
@ -145,40 +145,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 });
});
};
render() {
const { formType, record } = this.props;
const { getFieldDecorator } = this.props.form;
if (formType === null) {
return null;
notification["error"]({ message: "Error", description: e.message })
})
}
let subListIDs = [];
let subStatuses = {};
render() {
const { formType, record } = this.props
const { getFieldDecorator } = this.props.form
if (formType === null) {
return null
}
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}>
@ -282,7 +282,7 @@ class CreateFormDef extends React.PureComponent {
<Popconfirm
title="Are you sure?"
onConfirm={() => {
this.handleDeleteRecord(record);
this.handleDeleteRecord(record)
}}
>
<Button icon="delete">Delete</Button>
@ -292,11 +292,11 @@ class CreateFormDef extends React.PureComponent {
)}
</Form>
</Spin>
);
)
}
}
const CreateForm = Form.create()(CreateFormDef);
const CreateForm = Form.create()(CreateFormDef)
class Subscriber extends React.PureComponent {
state = {
@ -306,19 +306,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 })
}
}
@ -326,38 +326,39 @@ 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 (
<section className="content">
<header className="header">
<Row>
<Col span={22}>
<Col span={20}>
{!this.state.record.id && <h1>Add subscriber</h1>}
{this.state.record.id && (
<div>
<h1>
<Tag className="subscriber-status"
<Tag
className="subscriber-status"
color={
tagColors.hasOwnProperty(this.state.record.status)
? tagColors[this.state.record.status]
@ -376,13 +377,13 @@ class Subscriber extends React.PureComponent {
</div>
)}
</Col>
<Col span={2} className="right subscriber-export">
<Tooltip title="Export data" placement="top">
<Col span={4} className="right subscriber-export">
<Tooltip title="Export subscriber data" placement="top">
<a
role="button"
href={"/api/subscribers/" + this.state.record.id + "/export"}
>
<Icon type="export" style={{ fontSize: "20px" }}/>
Export <Icon type="export" />
</a>
</Tooltip>
</Col>
@ -398,20 +399,20 @@ class Subscriber extends React.PureComponent {
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