-
Notifications
You must be signed in to change notification settings - Fork 416
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
1e5cacc
commit f5e8605
Showing
39 changed files
with
669 additions
and
94 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
export type BrandVm = { | ||
id: number; | ||
name: string; | ||
slug: string; | ||
isPublish: boolean; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
export type CategoryGetVm = { | ||
id: number; | ||
name: string; | ||
slug: string; | ||
parentId: number; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
export type ProductVm = { | ||
id: number; | ||
name: string; | ||
slug: string; | ||
isAllowedToOrder: boolean; | ||
isPublished: boolean; | ||
isFeatured: boolean; | ||
isVisibleIndividually: boolean; | ||
createdOn: Date; | ||
taxClassId: number; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
import { BrandVm } from './Brand'; | ||
import { CategoryGetVm } from './Category'; | ||
import { ProductVm } from './Product'; | ||
|
||
export type PromotionDetail = { | ||
id: number; | ||
name: string; | ||
slug: string; | ||
description: string; | ||
couponCode: string; | ||
usageLimit: number; | ||
usageCount: number; | ||
discountType: string; | ||
applyTo: string; | ||
usageType: string; | ||
discountPercentage: number; | ||
discountAmount: number; | ||
isActive: boolean; | ||
startDate: Date; | ||
endDate: Date; | ||
brands: BrandVm[]; | ||
categories: CategoryGetVm[]; | ||
products: ProductVm[]; | ||
}; | ||
|
||
export type PromotionPage = { | ||
promotionDetailVmList: PromotionDetail[]; | ||
pageNo: number; | ||
pageSize: number; | ||
totalPage: number; | ||
totalElements: number; | ||
}; | ||
|
||
export type PromotionListRequest = { | ||
promotionName: string; | ||
couponCode: string; | ||
pageNo: number; | ||
pageSize: number; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import apiClientService from '@commonServices/ApiClientService'; | ||
import { PromotionListRequest } from '../models/Promotion'; | ||
|
||
const baseUrl = '/api/promotion/backoffice/promotions'; | ||
|
||
export async function getPromotions(request: PromotionListRequest) { | ||
const url = `${baseUrl}?${createRequestFromObject(request)}`; | ||
return (await apiClientService.get(url)).json(); | ||
} | ||
|
||
function createRequestFromObject(request: any): string { | ||
return Object.keys(request) | ||
.map(function (key) { | ||
return key + '=' + request[key]; | ||
}) | ||
.join('&'); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,149 @@ | ||
import { DEFAULT_PAGE_NUMBER, DEFAULT_PAGE_SIZE } from '@constants/Common'; | ||
import { PromotionListRequest, PromotionPage } from 'modules/promotion/models/Promotion'; | ||
import { getPromotions } from 'modules/promotion/services/PromotionService'; | ||
import { NextPage } from 'next'; | ||
import Link from 'next/link'; | ||
import { useEffect, useState } from 'react'; | ||
import { Button, Table } from 'react-bootstrap'; | ||
import ReactPaginate from 'react-paginate'; | ||
|
||
const PromotionList: NextPage = () => { | ||
const [isLoading, setLoading] = useState(false); | ||
const [promotionPage, setPromotionPage] = useState<PromotionPage>(); | ||
const [couponCode, setCouponCode] = useState<string>(''); | ||
const [promotionName, setPromotionName] = useState<string>(''); | ||
const [pageNo, setPageNo] = useState<number>(DEFAULT_PAGE_NUMBER); | ||
const [totalPage, setTotalPage] = useState<number>(1); | ||
|
||
useEffect(() => { | ||
setLoading(true); | ||
getPromotionList(); | ||
// eslint-disable-next-line react-hooks/exhaustive-deps | ||
}, [pageNo]); | ||
|
||
const getPromotionList = () => { | ||
getPromotions(createRequestParams()).then((data) => { | ||
setLoading(false); | ||
setTotalPage(data.totalPage); | ||
setPromotionPage(data); | ||
}); | ||
}; | ||
|
||
const createRequestParams = (): PromotionListRequest => { | ||
return { | ||
couponCode: couponCode, | ||
pageNo: pageNo, | ||
pageSize: DEFAULT_PAGE_SIZE, | ||
promotionName: promotionName, | ||
}; | ||
}; | ||
|
||
const changePage = ({ selected }: any) => { | ||
setPageNo(selected); | ||
}; | ||
|
||
const convertToStringDate = (date: Date) => { | ||
if (typeof date === 'string') { | ||
date = new Date(date); | ||
} | ||
const month = date.getMonth() + 1; | ||
return `${date.getFullYear()}-${month > 9 ? month : `0${month}`}-${date.getDate()}`; | ||
}; | ||
|
||
return ( | ||
<> | ||
<div className="row mt-5"> | ||
<div className="col-md-8"> | ||
<h2 className="text-danger font-weight-bold mb-3">Promotions</h2> | ||
</div> | ||
<div className="col-md-4 text-right"> | ||
<Link href="/catalog/brands/create"> | ||
<Button>Add new Promotion</Button> | ||
</Link> | ||
</div> | ||
</div> | ||
<div className="row mt-5"> | ||
<div className="col-md-4"> | ||
<input | ||
type="text" | ||
className="form-control" | ||
placeholder="Coupon Code" | ||
value={couponCode} | ||
onChange={(e) => setCouponCode(e.target.value)} | ||
/> | ||
</div> | ||
<div className="col-md-4"> | ||
<input | ||
type="text" | ||
className="form-control" | ||
placeholder="Promotion Name" | ||
value={promotionName} | ||
onChange={(e) => setPromotionName(e.target.value)} | ||
/> | ||
</div> | ||
<div className="col-md-4"> | ||
<Button onClick={getPromotionList}>Search</Button> | ||
</div> | ||
</div> | ||
{!isLoading && ( | ||
<Table striped bordered hover> | ||
<thead> | ||
<tr> | ||
<th>Name</th> | ||
<th>Coupon code</th> | ||
<th>Slug</th> | ||
<th>Description</th> | ||
<th>Is active</th> | ||
<th>Discount Type</th> | ||
<th>Usage count</th> | ||
<th>Usage limit</th> | ||
<th>Apply To</th> | ||
<th>Start date</th> | ||
<th>End date</th> | ||
<th>Action</th> | ||
</tr> | ||
</thead> | ||
<tbody> | ||
{promotionPage?.promotionDetailVmList?.map((promotion) => ( | ||
<tr key={promotion.id}> | ||
<td>{promotion.name}</td> | ||
<td>{promotion.couponCode}</td> | ||
<td>{promotion.slug}</td> | ||
<td>{promotion.description}</td> | ||
<td>{promotion.isActive}</td> | ||
<td>{promotion.discountType}</td> | ||
<td>{promotion.usageCount}</td> | ||
<td>{promotion.usageLimit}</td> | ||
<td>{promotion.applyTo}</td> | ||
<td>{convertToStringDate(promotion.startDate)}</td> | ||
<td>{convertToStringDate(promotion.endDate)}</td> | ||
<td> | ||
<Link href={`/promotion/manager-promotion/${promotion.id}`}> | ||
<button className="btn btn-outline-primary btn-sm" type="button"> | ||
Edit | ||
</button> | ||
</Link> | ||
</td> | ||
</tr> | ||
))} | ||
</tbody> | ||
</Table> | ||
)} | ||
{totalPage > 1 && ( | ||
<ReactPaginate | ||
forcePage={pageNo} | ||
previousLabel={'Previous'} | ||
nextLabel={'Next'} | ||
pageCount={totalPage} | ||
onPageChange={changePage} | ||
containerClassName={'pagination-container'} | ||
previousClassName={'previous-btn'} | ||
nextClassName={'next-btn'} | ||
disabledClassName={'pagination-disabled'} | ||
activeClassName={'pagination-active'} | ||
/> | ||
)} | ||
</> | ||
); | ||
}; | ||
export default PromotionList; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.