- added export all in membership
This commit is contained in:
parent
c25fdc88c9
commit
429ed99d01
|
|
@ -15,26 +15,28 @@ import {
|
|||
Tag,
|
||||
Select,
|
||||
Option,
|
||||
Typography,
|
||||
Typography, DatePicker,
|
||||
} from "antd";
|
||||
import { useStore } from "../../utils/useStore";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import {
|
||||
DownloadOutlined,
|
||||
PlusSquareOutlined,
|
||||
FilterOutlined,
|
||||
FilterOutlined, ExportOutlined,
|
||||
} from "@ant-design/icons";
|
||||
import { MembershipModal } from "./MembershipModal";
|
||||
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
|
||||
import { LINKS } from "../../routes/app";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { ModalLoaderContext } from "../../utils/modal";
|
||||
import moment from "moment";
|
||||
|
||||
export const Membership = observer(() => {
|
||||
const history = useHistory();
|
||||
const { Option } = Select;
|
||||
const { Title } = Typography;
|
||||
const [form] = Form.useForm();
|
||||
const [formExport] = Form.useForm();
|
||||
const store = useStore();
|
||||
const [visibleModal, setVisibleModal] = useState(false);
|
||||
const [isVisibleTopUpModal, setIsVisibleTopUpModal] = useState(false);
|
||||
|
|
@ -44,6 +46,9 @@ export const Membership = observer(() => {
|
|||
const modalLoader = useContext(ModalLoaderContext);
|
||||
const [filterMembership, setFilterMembership] = useState([]);
|
||||
const [filterPartner, setFilterPartner] = useState([]);
|
||||
const [filterBuyer, setFilterBuyer] = useState("");
|
||||
const [modalExport, setModalExport] = useState(false);
|
||||
const [filterSupplier, setFilterSupplier] = useState("");
|
||||
|
||||
useEffect(() => {
|
||||
const init = async () => {
|
||||
|
|
@ -52,8 +57,10 @@ export const Membership = observer(() => {
|
|||
const isAdmin = store.authentication.userData.role === "Admin";
|
||||
await getData();
|
||||
await store.membership.getData();
|
||||
await store.membership.getDataFilter();
|
||||
await store.membership.getDataBySuperior();
|
||||
await store.partner.getData();
|
||||
await store.supplier.getData();
|
||||
await store.role.getData(isAdmin);
|
||||
modalLoader.setLoading(false);
|
||||
} catch (e) {
|
||||
|
|
@ -167,6 +174,29 @@ export const Membership = observer(() => {
|
|||
setDestination(null);
|
||||
};
|
||||
|
||||
const handleSubmitExport = async () => {
|
||||
const date = formExport.getFieldsValue();
|
||||
const dataAll ={
|
||||
dateStart: moment(date.start_date).format("YYYY-MM-DD"),
|
||||
dateEnd: moment(date.end_date).format("YYYY-MM-DD"),
|
||||
supplier: filterSupplier,
|
||||
buyer: filterBuyer
|
||||
}
|
||||
modalLoader.setLoading(true);
|
||||
try {
|
||||
await store.transaction.exportTransactionAll(dataAll)
|
||||
// console.log('responseiniyak', response);
|
||||
// message.success("Success export");
|
||||
setModalExport(false);
|
||||
modalLoader.setLoading(false);
|
||||
} catch (e) {
|
||||
setModalExport(false);
|
||||
console.error(e, "apa errornya");
|
||||
message.error(e.response?.body?.message || "Failed to export");
|
||||
modalLoader.setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: "Nama",
|
||||
|
|
@ -344,6 +374,16 @@ export const Membership = observer(() => {
|
|||
Filter
|
||||
</Button>
|
||||
)}
|
||||
{store.authentication.userData.role === "Admin" && (
|
||||
<Button
|
||||
style={{
|
||||
marginLeft: "10px"
|
||||
}}
|
||||
onClick={() => setModalExport(true)}
|
||||
>
|
||||
<ExportOutlined /> Export
|
||||
</Button>
|
||||
)}
|
||||
</Col>
|
||||
<Col span={12} style={{ textAlign: "right" }}>
|
||||
{/* <Search
|
||||
|
|
@ -616,6 +656,78 @@ export const Membership = observer(() => {
|
|||
</Col>
|
||||
</Row>
|
||||
</Modal>
|
||||
|
||||
<Modal
|
||||
visible={modalExport}
|
||||
title={"Export"}
|
||||
onOk={handleSubmitExport}
|
||||
onCancel={() => {
|
||||
setModalExport(false);
|
||||
}}
|
||||
>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
<Form layout="vertical" name="filter" form={formExport}>
|
||||
<Form.Item
|
||||
name="start_date"
|
||||
label="Dari"
|
||||
rules={[{ required: true, message: "Please input Date!" }]}
|
||||
>
|
||||
<DatePicker style={{ width: "100%" }} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="end_date"
|
||||
label="Sampai"
|
||||
rules={[{ required: true, message: "Please input Date!" }]}
|
||||
>
|
||||
<DatePicker style={{ width: "100%" }} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="supplier"
|
||||
label="Supplier"
|
||||
>
|
||||
<Select
|
||||
mode={"single"}
|
||||
placeholder="Choose Supplier"
|
||||
onChange={(val) => {
|
||||
setFilterSupplier(val);
|
||||
}}
|
||||
style={{ width: "100%" }}
|
||||
value={filterSupplier}
|
||||
>
|
||||
<Option value="all">All Supplier</Option>
|
||||
{store.supplier.data.map((item) => (
|
||||
<Option value={item.id} key={item.id}>
|
||||
{item.name}
|
||||
</Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="buyer"
|
||||
label="Buyer"
|
||||
>
|
||||
<Select
|
||||
mode={"single"}
|
||||
placeholder="Choose Buyer"
|
||||
onChange={(val) => {
|
||||
setFilterBuyer(val);
|
||||
}}
|
||||
style={{ width: "100%" }}
|
||||
value={filterBuyer}
|
||||
>
|
||||
<Option value="all">All Buyer</Option>
|
||||
{store.membership.dataFilterMembership.map((item) => (
|
||||
<Option value={item.id} key={item.id}>
|
||||
{item.name} ({item.username})
|
||||
</Option>
|
||||
))}
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Col>
|
||||
</Row>
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ export class Membership {
|
|||
page = 0;
|
||||
pageSize = 10
|
||||
data = [];
|
||||
dataFilterMembership = [];
|
||||
total_data = 0;
|
||||
dataTotal=0;
|
||||
|
||||
|
|
@ -44,6 +45,26 @@ export class Membership {
|
|||
}
|
||||
}
|
||||
|
||||
async getDataFilter() {
|
||||
try {
|
||||
const response = await http.get(`/users?page=${this.page}&pageSize=1000&superior=${this.filterMembership}&type=${this.filterPartner}`);
|
||||
this.dataFilterMembership = response.body.data ?? []
|
||||
this.dataFilterMembership = response.body.data.map((item, idx) => {
|
||||
item.key = idx;
|
||||
item.name = item?.user_detail?.name;
|
||||
item.username = item?.username
|
||||
item.phone_number = item?.user_detail?.phone_number;
|
||||
item.roleId = item?.roles.id;
|
||||
item.roleName = item?.roles.name;
|
||||
return item
|
||||
}) ?? []
|
||||
|
||||
console.log(this.dataTotal)
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
async getDetail(id) {
|
||||
try {
|
||||
const response = await http.get(`/users/`+id);
|
||||
|
|
@ -53,7 +74,7 @@ export class Membership {
|
|||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async getDataBySuperior() {
|
||||
try {
|
||||
const response = await http.get(`/users/find-by-supperior?page=${this.page}&pageSize=${this.pageSize}`);
|
||||
|
|
|
|||
|
|
@ -303,4 +303,27 @@ export class Transaction {
|
|||
console.error(e,':)')
|
||||
}
|
||||
}
|
||||
|
||||
exportTransactionAll(data) {
|
||||
try {
|
||||
axios({
|
||||
url: appConfig.apiUrl + `/excel/history-user/export-all`,
|
||||
headers: {"Authorization" : `Bearer ${TokenUtil.accessToken}`},
|
||||
method: 'POST',
|
||||
data: data,
|
||||
responseType: 'blob'
|
||||
}).then((response) => {
|
||||
var fileDownload = require('react-file-download');
|
||||
message.success("Success export");
|
||||
fileDownload(response.data, `Mutasi Transaksi ${data.dateStart} - ${data.dateEnd}.xlsx`);
|
||||
return fileDownload;
|
||||
}).catch(function (error) {
|
||||
message.error("No data to export");
|
||||
return error;
|
||||
});
|
||||
|
||||
} catch (e) {
|
||||
console.error(e,':)')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user