Skip to content

C
CmsPetrolPay
Commit 8814a3d1 by tdgiang
Options

update code

parent bb2285ca
Showing with 1044 additions and 697 deletions
src/app/apis/Functions/dropdown.js
...@@ -99,3 +99,8 @@ export const dropdownProvider = async (body) => ...@@ -99,3 +99,8 @@ export const dropdownProvider = async (body) =>
GetData(url.dropdownProvider, body) GetData(url.dropdownProvider, body)
.then((res) => res) .then((res) => res)
.catch((err) => null) .catch((err) => null)
export const dropdownListPayType = async (body) =>
GetData(url.dropdownListPayType, body)
.then((res) => res)
.catch((err) => null)
src/app/apis/Functions/reconciliation.js
...@@ -36,3 +36,18 @@ export const updateSheetReconciliation = async (body) => ...@@ -36,3 +36,18 @@ export const updateSheetReconciliation = async (body) =>
PostData(url.updateSheetReconciliation, body) PostData(url.updateSheetReconciliation, body)
.then((res) => res) .then((res) => res)
.catch((err) => null) .catch((err) => null)
export const deleteTranInReconciliation = async (id, body) =>
PostData(`${url.deleteTranInReconciliation}/${id}`, body)
.then((res) => res)
.catch((err) => null)
export const addTransInReconciliation = async (body) =>
PostData(url.addTransInReconciliation, body)
.then((res) => res)
.catch((err) => null)
export const listTransSelect = async (body) =>
PostData(url.listTransSelect, body)
.then((res) => res)
.catch((err) => null)
src/app/apis/Functions/supplier.js
...@@ -30,3 +30,13 @@ export const changeStatusSupplier = async (body) => ...@@ -30,3 +30,13 @@ export const changeStatusSupplier = async (body) =>
PostData(url.changeStatusSupplier, body) PostData(url.changeStatusSupplier, body)
.then((res) => res) .then((res) => res)
.catch((err) => null) .catch((err) => null)
export const piechartPaymentPartner = async (body) =>
PostData(url.piechartPaymentPartner, body)
.then((res) => res)
.catch((err) => null)
export const linechartPaymentPartner = async (body) =>
PostData(url.linechartPaymentPartner, body)
.then((res) => res)
.catch((err) => null)
src/app/apis/url.js
...@@ -126,6 +126,9 @@ export default { ...@@ -126,6 +126,9 @@ export default {
listProviderSetting: `${root}/provider/paging/setting`, listProviderSetting: `${root}/provider/paging/setting`,
detailProviderSetting: `${root}/reconciliation/setting`, detailProviderSetting: `${root}/reconciliation/setting`,
updateProviderSetting: `${root}/reconciliation/setting/create`, updateProviderSetting: `${root}/reconciliation/setting/create`,
deleteTranInReconciliation: `${root}/reconciliation/delete/trans`,
addTransInReconciliation: `${root}/reconciliation/add/trans`,
listTransSelect: `${root}/reconciliation/list/trans`,
//Log //Log
logAuth: `${root}/logging/listLogin`, logAuth: `${root}/logging/listLogin`,
...@@ -166,6 +169,9 @@ export default { ...@@ -166,6 +169,9 @@ export default {
urlDetailPriceProduct: `${root}/construction`, urlDetailPriceProduct: `${root}/construction`,
changeStatusPriceProduct: `${root}/construction/changeStatus`, changeStatusPriceProduct: `${root}/construction/changeStatus`,
piechartPaymentPartner: `${root}/paymentpartner/piechart`,
linechartPaymentPartner: `${root}/paymentpartner/linegraph`,
//dropdown //dropdown
dropdownFuntions: `${root}/dropdown/function`, dropdownFuntions: `${root}/dropdown/function`,
dropdownPermission: `${root}/function/getFunctionTree`, dropdownPermission: `${root}/function/getFunctionTree`,
...@@ -185,4 +191,5 @@ export default { ...@@ -185,4 +191,5 @@ export default {
dropdownFuncitonPackge: `${root}/dropdown/getlistfunctionpk`, dropdownFuncitonPackge: `${root}/dropdown/getlistfunctionpk`,
dropdownStoreStatus: `${root}/dropdown/getlistStoreStatus`, dropdownStoreStatus: `${root}/dropdown/getlistStoreStatus`,
dropdownProvider: `${root}/dropdown/Provider`, dropdownProvider: `${root}/dropdown/Provider`,
dropdownListPayType: `${root}/dropdown/getListPayType`,
} }
src/app/components/Chart/LineChart.jsx deleted 100644 → 0
import React from 'react'
import ReactEcharts from 'echarts-for-react'
import { useTheme } from '@material-ui/core/styles'
const CustomLineChart = (props) => {
const { data, bg, height } = props
const option = {
title: {
text: 'textLeft',
right: 'auto',
padding: [5, 10],
},
// title: {
// text: textRight,
// textAlign: 'auto',
// },
grid: {
left: '0%',
right: '0%',
bottom: '10%',
containLabel: true,
},
xAxis: {
type: 'category',
axisLine: {
show: false,
},
splitLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
fontSize: 13,
fontFamily: 'roboto',
},
axisPointer: {
snap: true,
},
},
yAxis: {
type: 'value',
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
lineStyle: {
opacity: 0.15,
},
},
axisLabel: {
show: false,
fontSize: 13,
fontFamily: 'roboto',
},
},
series: [
{
data: data,
type: 'line',
areaStyle: {},
},
],
tooltip: {
show: true,
trigger: 'item',
formatter: function (a) {
const { value } = a
return `
<div style="padding: 15px">
<div style="white-space: nowrap;">30/12/111 - 30/12/111</div>
<div style="margin-top: 10px">
<span style="white-space: nowrap">ccc: <strong style="margin-left: 3px">${value}</strong></span>
</div>
<div style="margin-top: 10px">
<span style="white-space: nowrap">hi: <strong style="margin-left: 3px">hu</strong></span>
</div>
</div>
`
},
},
}
return <ReactEcharts style={{ height: height }} option={option} />
}
export default CustomLineChart
src/app/components/Chart/LineChartCustom.jsx 0 → 100644
import React from 'react'
import ReactEcharts from 'echarts-for-react'
import { useTheme } from '@material-ui/core/styles'
import { Typography } from '@material-ui/core'
const CustomLineChart = ({ data, color }) => {
//const { textLeft, textRight, data, bg, height } = item
const option = {
color: color,
tooltip: {
show: true,
},
// legend: {
// top: '50%',
// left: 'center',
// },
series: [
{
name: 'Access From',
type: 'pie',
radius: ['60%', '80%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center',
},
emphasis: {
label: {
show: true,
fontSize: 10,
fontWeight: 'bold',
},
},
labelLine: {
show: false,
},
data: data,
},
],
}
return <ReactEcharts style={{ height: 300 }} option={option} />
}
export default CustomLineChart
src/app/components/Chart/Test.jsx 0 → 100644
import React from 'react'
import ReactEcharts from 'echarts-for-react'
import { useTheme } from '@material-ui/core/styles'
import { Typography } from '@material-ui/core'
const CustomLineChart = ({ data, color }) => {
//const { textLeft, textRight, data, bg, height } = item
const option = {
color: color,
tooltip: {
show: true,
},
// legend: {
// top: '50%',
// left: 'center',
// },
series: [
{
name: 'Access From',
type: 'pie',
radius: ['60%', '80%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center',
},
emphasis: {
label: {
show: true,
fontSize: 10,
fontWeight: 'bold',
},
},
labelLine: {
show: false,
},
data: data,
},
],
}
return <ReactEcharts style={{ height: 300 }} option={option} />
}
export default CustomLineChart
src/app/navigations.js
...@@ -244,7 +244,7 @@ export const navigationsAdmin = [ ...@@ -244,7 +244,7 @@ export const navigationsAdmin = [
{ {
name: 'Đối soát', name: 'Đối soát',
icon: 'wb_iridescent', icon: 'verified',
hide: false, hide: false,
children: [ children: [
{ {
......
src/app/views/PaymentSupplier/LineChartCustom.js 0 → 100644
import React from 'react'
import ReactEcharts from 'echarts-for-react'
import { useTheme } from '@material-ui/core/styles'
import { Typography } from '@material-ui/core'
const CustomLineChart = ({ data, color }) => {
console.log('data linechart', data)
const option = {
color: color,
xAxis: {
type: 'category',
boundaryGap: false,
data: data?.xAxis,
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985',
},
},
},
yAxis: {
type: 'value',
},
series: [
{
data: data?.series,
type: 'line',
smooth: true,
areaStyle: {},
},
],
}
return <ReactEcharts style={{ height: 400 }} option={option} />
}
export default CustomLineChart
src/app/views/PaymentSupplier/ListTrans/Index.js
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import LogAuth from './View' import LogAuth from './View'
import { listTransaction } from 'app/apis/Functions/transaction' import { listTransReconciliation } from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom' import { useHistory, useLocation } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function' import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction' import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import useDebounce from 'app/hooks/useDebounce' import useDebounce from 'app/hooks/useDebounce'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown' import {
dropdownProduct,
dropdownProvider,
dropdownListPayType,
} from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => { const ToolNotificate = (props) => {
const location = useLocation()
const [txtSearch, setTxtSearch] = useState('') const [txtSearch, setTxtSearch] = useState('')
const [applications, setApplications] = useState('') const [applications, setApplications] = useState('')
const [pageIndex, setPageIndex] = useState(0) const [pageIndex, setPageIndex] = useState(0)
...@@ -24,13 +29,22 @@ const ToolNotificate = (props) => { ...@@ -24,13 +29,22 @@ const ToolNotificate = (props) => {
const [data, setData] = useState([]) const [data, setData] = useState([])
const [type, setType] = useState() const [type, setType] = useState()
const [listType, setListType] = useState([]) const [listType, setListType] = useState([])
const [merchant, setMerchant] = useState() const [listProvide, setListProvide] = useState([])
const [listMerchant, setListMerchant] = useState([]) const [provide, setProvide] = useState()
const [store, setStore] = useState() const [listProduct, setListProduct] = useState([])
const [listStore, setListStore] = useState([]) const [product, setProduct] = useState()
const [status, setStatus] = useState()
useEffect(() => { useEffect(() => {
getDataMerchant() getData(false)
}, [pageIndex])
useEffect(() => {
getData(true)
}, [searchDebount, startDate, type, provide, product, status])
useEffect(() => {
getDataDropdown()
}, []) }, [])
const changeDateRange = (start, end) => { const changeDateRange = (start, end) => {
...@@ -38,44 +52,50 @@ const ToolNotificate = (props) => { ...@@ -38,44 +52,50 @@ const ToolNotificate = (props) => {
setEndDate(end) setEndDate(end)
} }
const renderStatusName = (status) => {
if (status == 3) return 'Đã đối soát'
if (status == 2) return 'Đang đối soát'
return 'Chưa đối soát'
}
const getData = async (init) => { const getData = async (init) => {
props.showLoading()
let res let res
if (init) { if (init) {
setPageIndex(0) setPageIndex(0)
res = await listTransaction({ res = await listTransReconciliation({
order_code: searchDebount,
applications,
page_no: 0, page_no: 0,
page_size: pageSize, page_size: pageSize,
from_date: startDate ? convertDate(startDate) : null, date_from: startDate ? convertDate(startDate) : null,
to_date: endDate ? convertDate(endDate) : null, date_to: endDate ? convertDate(endDate) : null,
type_code: type, product_code: product ? product : null,
merchant_id: merchant, payment_gate_code: location.state?.provider_code,
store_id: store, statusReconciliation: status ? status : 0,
type_payment: type ? type : null,
// gasoline_id: '57dd1a73-d847-4d73-9791-08dc0841e7a9',
}) })
} else { } else {
res = await listTransaction({ res = await listTransReconciliation({
order_code: searchDebount,
applications,
page_no: pageIndex + 1, page_no: pageIndex + 1,
page_size: pageSize, page_size: pageSize,
from_date: startDate ? convertDate(startDate) : null, date_from: startDate ? convertDate(startDate) : null,
to_date: endDate ? convertDate(endDate) : null, date_to: endDate ? convertDate(endDate) : null,
type_code: type, product_code: product ? product : null,
merchant_id: merchant, payment_gate_code: location.state?.provider_code,
store_id: store, statusReconciliation: status ? status : 0,
type_payment: type ? type : null,
// gasoline_id: '57dd1a73-d847-4d73-9791-08dc0841e7a9',
}) })
} }
props.hideLoading()
if (res.data.code == 200 && res.data.data) { if (res.data.code == 200 && res.data.data) {
const newList = res.data.data.data.map((e, i) => { const newList = res.data.data?.data?.map((e, i) => {
return { ...e, index: i + 1 + pageIndex * pageSize } return {
...e,
statusReconciliationName: renderStatusName(
e?.statusReconciliation
),
index: i + 1 + pageIndex * pageSize,
}
}) })
setData(newList) setData(newList)
setTotalRecord(res.data.data.total_elements) setTotalRecord(res.data.data.total_elements)
...@@ -90,49 +110,23 @@ const ToolNotificate = (props) => { ...@@ -90,49 +110,23 @@ const ToolNotificate = (props) => {
} }
} }
useEffect(() => { const getDataDropdown = async () => {
getData(false) const resPro = await dropdownProduct({})
}, [pageIndex]) if (resPro.data.code == 200 && resPro.data.data) {
const newList = resPro.data.data.map((e) => {
useEffect(() => { return { ...e, id: e.product_code, name: e?.product_name }
getData(true)
}, [searchDebount, startDate, type, merchant, store])
useEffect(() => {
if (merchant) {
getDropdownStore(merchant)
}
setStore()
}, [merchant])
const getDataMerchant = async () => {
const res = await dropdownMerchant({})
if (res.data.code == 200 && res.data.data) {
const newList = res.data.data.map((e) => {
return { ...e, name: e.merchant_name }
})
setListMerchant(newList)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
}) })
setListProduct(newList)
} }
}
const getDropdownStore = async (id) => { const resType = await dropdownListPayType()
const res = await dropdownStore(id)
if (res.data.code == 200 && res.data.data) { if (resType.data.code == 200 && resType.data.data) {
console.log('res.data.data', res.data.data) const newList = resType.data.data.map((item) => {
const newList = res.data.data.map((e) => { return { ...item }
return { ...e, name: e.store_name }
})
setListStore(newList)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
}) })
setListType(newList)
} }
} }
...@@ -150,12 +144,14 @@ const ToolNotificate = (props) => { ...@@ -150,12 +144,14 @@ const ToolNotificate = (props) => {
type={type} type={type}
setType={setType} setType={setType}
listType={listType} listType={listType}
merchant={merchant} listProvide={listProvide}
setMerchant={setMerchant} listProduct={listProduct}
listMerchant={listMerchant} provide={provide}
store={store} setProvide={setProvide}
setStore={setStore} product={product}
listStore={listStore} setProduct={setProduct}
status={status}
setStatus={setStatus}
/> />
) )
} }
......
src/app/views/PaymentSupplier/ListTrans/Table.js
...@@ -12,13 +12,14 @@ import { ...@@ -12,13 +12,14 @@ import {
MenuItem, MenuItem,
Tooltip, Tooltip,
Icon, Icon,
Typography,
} from '@material-ui/core' } from '@material-ui/core'
import EditIcon from '@material-ui/icons/Edit' import EditIcon from '@material-ui/icons/Edit'
import DeleteIcon from '@material-ui/icons/Delete' import DeleteIcon from '@material-ui/icons/Delete'
import colors from 'app/assets/Color' import colors from 'app/assets/Color'
import useStyles from 'app/styles/Table' import useStyles from 'app/styles/Table'
import { Breadcrumb, SimpleCard } from 'app/components' import { Breadcrumb, SimpleCard } from 'app/components'
import { toPriceVnd } from 'app/config/Function'
const columns = [ const columns = [
{ {
id: 'index', id: 'index',
...@@ -26,38 +27,25 @@ const columns = [ ...@@ -26,38 +27,25 @@ const columns = [
align: 'center', align: 'center',
minWidth: 80, minWidth: 80,
}, },
{ {
id: 'store_name', id: 'created_date',
label: 'Cây xăng', label: 'Thời gian giao dịch',
align: 'left', align: 'left',
minWidth: 160, minWidth: 110,
}, },
// {
// id: 'application',
// label: 'Mã NV',
// align: 'left',
// minWidth: 140,
// },
{ {
id: 'order_code', id: 'order_code',
label: 'Mã hoá đơn', label: 'Mã hoá đơn',
align: 'left', align: 'left',
minWidth: 160, minWidth: 160,
}, },
{ {
id: 'created_date', id: 'store_name',
label: 'Ngày giao dịch', label: 'Cây xăng',
align: 'left', align: 'left',
minWidth: 110, minWidth: 160,
}, },
// {
// id: 'IP',
// label: 'Loại nhiên liệu',
// align: 'left',
// minWidth: 140,
// },
{ {
id: 'product_name', id: 'product_name',
label: 'Sản phẩm', label: 'Sản phẩm',
...@@ -69,28 +57,34 @@ const columns = [ ...@@ -69,28 +57,34 @@ const columns = [
label: 'Đơn giá', label: 'Đơn giá',
align: 'left', align: 'left',
minWidth: 80, minWidth: 80,
isMonney: true,
}, },
{ {
id: 'quantity', id: 'quantity',
label: 'Lượng nhiên liệu', label: 'Lượng nhiên liệu',
align: 'left', align: 'left',
minWidth: 80, minWidth: 80,
isMonney: true,
}, },
{ {
id: 'price', id: 'price',
label: 'Thành tiền', label: 'Thành tiền',
align: 'left', align: 'left',
minWidth: 80, minWidth: 80,
isMonney: true,
}, },
{ {
id: 'type_payment', id: 'commission',
label: 'Phương thức thanh toán', label: 'Hoa hồng',
align: 'left', align: 'left',
minWidth: 100, minWidth: 80,
isMonney: true,
}, },
{ {
id: 'status_text', id: 'type_payment',
label: 'Trạng thái', label: 'Phương thức thanh toán',
align: 'left', align: 'left',
minWidth: 100, minWidth: 100,
}, },
...@@ -117,6 +111,18 @@ function TableList(props) { ...@@ -117,6 +111,18 @@ function TableList(props) {
setPageSize(event.target.value) setPageSize(event.target.value)
} }
const renderStatusBg = (status) => {
if (status == 3) return '#ECFDF3'
if (status == 2) return '#FFDC98'
return '#F2F4F7'
}
const renderStatusColor = (status) => {
if (status == 3) return '#027A48'
if (status == 2) return '#F1AA1F'
return '#344054'
}
return ( return (
<Paper className={classes.root}> <Paper className={classes.root}>
<TableContainer className={classes.container}> <TableContainer className={classes.container}>
...@@ -135,6 +141,14 @@ function TableList(props) { ...@@ -135,6 +141,14 @@ function TableList(props) {
{column.label} {column.label}
</TableCell> </TableCell>
))} ))}
<TableCell
style={{
width: 120,
backgroundColor: colors.headerTable,
}}
>
Trạng thái đối soát
</TableCell>
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody className={classes.columnTable}> <TableBody className={classes.columnTable}>
...@@ -147,28 +161,47 @@ function TableList(props) { ...@@ -147,28 +161,47 @@ function TableList(props) {
key={row.id} key={row.id}
> >
{columns.map((column) => { {columns.map((column) => {
const avatar = row[column.id] const data = row[column.id]
return ( return (
<TableCell <TableCell
key={column.id} key={column.id}
align={column.align} align={column.align}
style={{
textAlign:
column.id === 'index'
? 'center'
: typeof data ==
'string'
? 'left'
: 'right',
}}
> >
{column.format ? ( {column.isMonney
<img ? toPriceVnd(data)
src={column.format( : data}
avatar
)}
className={
classes.image
}
/>
) : (
avatar
)}
</TableCell> </TableCell>
) )
})} })}
<TableCell
style={{
textAlign: 'center',
}}
>
<Typography
style={{
padding: 5,
backgroundColor: renderStatusBg(
row?.statusReconciliation
),
color: renderStatusColor(
row?.statusReconciliation
),
borderRadius: 10,
}}
>
{row?.statusReconciliationName}
</Typography>
</TableCell>
</TableRow> </TableRow>
) )
})} })}
......
src/app/views/PaymentSupplier/ListTrans/View.js
...@@ -42,6 +42,14 @@ function CustomerView(props) { ...@@ -42,6 +42,14 @@ function CustomerView(props) {
store, store,
setStore, setStore,
listStore, listStore,
listProvide,
listProduct,
provide,
setProvide,
product,
setProduct,
status,
setStatus,
} = props } = props
const handleChange = (event) => { const handleChange = (event) => {
...@@ -51,7 +59,8 @@ function CustomerView(props) { ...@@ -51,7 +59,8 @@ function CustomerView(props) {
<Fragment> <Fragment>
<Grid <Grid
style={{ style={{
marginBottom: 20, padding: 10,
marginBottom: 10,
}} }}
//justify={'space-between'} //justify={'space-between'}
alignItems={'center'} alignItems={'center'}
...@@ -70,15 +79,15 @@ function CustomerView(props) { ...@@ -70,15 +79,15 @@ function CustomerView(props) {
/> />
</Grid> </Grid>
<Grid item lg={3} md={3} sm={3} xs={3}> <Grid item lg={2} md={2} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth> <FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple"> <InputLabel htmlFor="outlined-age-native-simple">
Phương thức thanh toán Sản phẩm
</InputLabel> </InputLabel>
<Select <Select
label="Phương thức thanh toán" label="Sản phẩm"
value={type} value={product}
onChange={(e) => setType(e.target.value)} onChange={(e) => setProduct(e.target.value)}
inputProps={{ inputProps={{
name: 'age', name: 'age',
id: 'outlined-age-native-simple', id: 'outlined-age-native-simple',
...@@ -87,34 +96,22 @@ function CustomerView(props) { ...@@ -87,34 +96,22 @@ function CustomerView(props) {
<MenuItem value=""> <MenuItem value="">
<em>Tất cả</em> <em>Tất cả</em>
</MenuItem> </MenuItem>
{[ {listProduct.map((e) => (
{
id: 'QR',
name: 'QR',
},
{
id: 'CASH',
name: 'Tiền mặt',
},
{
id: 'DEBT',
name: 'Công nợ',
},
].map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem> <MenuItem value={e.id}>{e.name}</MenuItem>
))} ))}
</Select> </Select>
</FormControl> </FormControl>
</Grid> </Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<Grid item lg={2} md={2} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth> <FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple"> <InputLabel htmlFor="outlined-age-native-simple">
Pháp nhân PT thanh toán
</InputLabel> </InputLabel>
<Select <Select
label="Pháp nhân" label="PT thanh toán"
value={merchant} value={type}
onChange={(e) => setMerchant(e.target.value)} onChange={(e) => setType(e.target.value)}
inputProps={{ inputProps={{
name: 'age', name: 'age',
id: 'outlined-age-native-simple', id: 'outlined-age-native-simple',
...@@ -123,21 +120,22 @@ function CustomerView(props) { ...@@ -123,21 +120,22 @@ function CustomerView(props) {
<MenuItem value=""> <MenuItem value="">
<em>Tất cả</em> <em>Tất cả</em>
</MenuItem> </MenuItem>
{listMerchant.map((e) => ( {listType.map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem> <MenuItem value={e.id}>{e.name}</MenuItem>
))} ))}
</Select> </Select>
</FormControl> </FormControl>
</Grid> </Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<Grid item lg={2} md={2} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth> <FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple"> <InputLabel htmlFor="outlined-age-native-simple">
Cây xăng Trạng thái
</InputLabel> </InputLabel>
<Select <Select
label="Cây xăng" label="Trạng thái"
value={store} value={status}
onChange={(e) => setStore(e.target.value)} onChange={(e) => setStatus(e.target.value)}
inputProps={{ inputProps={{
name: 'age', name: 'age',
id: 'outlined-age-native-simple', id: 'outlined-age-native-simple',
...@@ -146,13 +144,30 @@ function CustomerView(props) { ...@@ -146,13 +144,30 @@ function CustomerView(props) {
<MenuItem value=""> <MenuItem value="">
<em>Tất cả</em> <em>Tất cả</em>
</MenuItem> </MenuItem>
{listStore.map((e) => ( {[
{
name: 'Chưa đối soát',
value: 1,
id: 1,
},
{
name: 'Đang đối soát',
value: 2,
id: 2,
},
{
name: 'Đã đối soát',
value: 3,
id: 3,
},
].map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem> <MenuItem value={e.id}>{e.name}</MenuItem>
))} ))}
</Select> </Select>
</FormControl> </FormControl>
</Grid> </Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<Grid item lg={2} md={2} sm={3} xs={3}>
<DateRange <DateRange
date={startDate} date={startDate}
changeDateRange={changeDateRange} changeDateRange={changeDateRange}
......
src/app/views/PaymentSupplier/PieChartReport.js
...@@ -20,58 +20,15 @@ import { KeyboardDatePicker } from '@material-ui/pickers' ...@@ -20,58 +20,15 @@ import { KeyboardDatePicker } from '@material-ui/pickers'
//import { reportStorePieChart } from 'app/apis/Functions/dashboard' //import { reportStorePieChart } from 'app/apis/Functions/dashboard'
const ReportQuantity = ({ user }) => { const ReportQuantity = ({ data }) => {
const [state, setState] = useState([]) const [state, setState] = useState([])
const [status, setStatus] = useState(1) const [status, setStatus] = useState(1)
const [startDate, setStartDate] = useState(new Date()) const [startDate, setStartDate] = useState(new Date())
const color = ['#73DDFF', '#45C8F1', '#659FEA', '#124F9F'] const color = ['#73DDFF', '#45C8F1', '#659FEA', '#124F9F']
useEffect(() => {
// getData()
}, [startDate, status])
const handleDateChangeLast = (date) => {
console.log('date', date)
setStartDate(date)
}
// const getData = async () => {
// if (startDate) {
// const res = await reportStorePieChart({
// month: parseInt(convertDate(startDate).substring(3, 5)),
// year: parseInt(convertDate(startDate).substring(6, 10)),
// type_chart: status,
// store_id: user?.store_id,
// })
// if (res.data.code == 200 && res.data.data) {
// const newList = res.data.data.map((e) => {
// return {
// ...e,
// value: e?.total_revenue,
// name: e?.product_name,
// }
// })
// setState(newList)
// } else {
// setState([])
// }
// }
// }
return ( return (
<div className="mb-sm-20"> <div className="mb-sm-20">
<CustomPieChart <CustomPieChart data={data} color={color} />
data={[
{
value: 20,
name: 'hêleo',
},
{
value: 26,
name: 'hêleo12',
},
]}
color={color}
/>
{/* <Grid {/* <Grid
style={{ style={{
......
src/app/views/PaymentSupplier/SheetCheck/Index.js
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import LogAuth from './View' import LogAuth from './View'
import { listTransaction } from 'app/apis/Functions/transaction' import {
import { useHistory } from 'react-router-dom' listSheetReconciliation,
updateSheetReconciliation,
} from 'app/apis/Functions/reconciliation'
import { useHistory, useLocation } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function' import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction' import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import useDebounce from 'app/hooks/useDebounce' import useDebounce from 'app/hooks/useDebounce'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown' import { dropdownMerchant, dropdownProvider } from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => { const ToolNotificate = (props) => {
const location = useLocation()
const [txtSearch, setTxtSearch] = useState('') const [txtSearch, setTxtSearch] = useState('')
const [applications, setApplications] = useState('') const [applications, setApplications] = useState('')
const [pageIndex, setPageIndex] = useState(0) const [pageIndex, setPageIndex] = useState(0)
...@@ -22,15 +26,13 @@ const ToolNotificate = (props) => { ...@@ -22,15 +26,13 @@ const ToolNotificate = (props) => {
const [endDate, setEndDate] = useState() const [endDate, setEndDate] = useState()
const { t } = useTranslation() const { t } = useTranslation()
const [data, setData] = useState([]) const [data, setData] = useState([])
const [type, setType] = useState()
const [listType, setListType] = useState([]) const [status, setStatus] = useState()
const [merchant, setMerchant] = useState() const [listProvide, setListProvide] = useState([])
const [listMerchant, setListMerchant] = useState([]) const [provide, setProvide] = useState()
const [store, setStore] = useState()
const [listStore, setListStore] = useState([])
useEffect(() => { useEffect(() => {
getDataMerchant() getDataDropdown()
}, []) }, [])
const changeDateRange = (start, end) => { const changeDateRange = (start, end) => {
...@@ -39,40 +41,30 @@ const ToolNotificate = (props) => { ...@@ -39,40 +41,30 @@ const ToolNotificate = (props) => {
} }
const getData = async (init) => { const getData = async (init) => {
props.showLoading()
let res let res
if (init) { if (init) {
setPageIndex(0) setPageIndex(0)
res = await listTransaction({ res = await listSheetReconciliation({
order_code: searchDebount, order_code: searchDebount,
applications,
page_no: 0, page_no: 0,
page_size: pageSize, page_size: pageSize,
from_date: startDate ? convertDate(startDate) : null, date_from: startDate ? convertDate(startDate) : null,
to_date: endDate ? convertDate(endDate) : null, date_to: endDate ? convertDate(endDate) : null,
type_code: type, status: status ? status : 0,
merchant_id: merchant, idPaymentPartner: location.state?.provider_code,
store_id: store,
// gasoline_id: '57dd1a73-d847-4d73-9791-08dc0841e7a9',
}) })
} else { } else {
res = await listTransaction({ res = await listSheetReconciliation({
order_code: searchDebount, order_code: searchDebount,
applications,
page_no: pageIndex + 1, page_no: pageIndex + 1,
page_size: pageSize, page_size: pageSize,
from_date: startDate ? convertDate(startDate) : null, from_date: startDate ? convertDate(startDate) : null,
to_date: endDate ? convertDate(endDate) : null, to_date: endDate ? convertDate(endDate) : null,
type_code: type, status: status ? status : 0,
merchant_id: merchant, idPaymentPartner: location.state?.provider_code,
store_id: store,
// gasoline_id: '57dd1a73-d847-4d73-9791-08dc0841e7a9',
}) })
} }
props.hideLoading()
if (res.data.code == 200 && res.data.data) { if (res.data.code == 200 && res.data.data) {
const newList = res.data.data.data.map((e, i) => { const newList = res.data.data.data.map((e, i) => {
return { ...e, index: i + 1 + pageIndex * pageSize } return { ...e, index: i + 1 + pageIndex * pageSize }
...@@ -96,39 +88,34 @@ const ToolNotificate = (props) => { ...@@ -96,39 +88,34 @@ const ToolNotificate = (props) => {
useEffect(() => { useEffect(() => {
getData(true) getData(true)
}, [searchDebount, startDate, type, merchant, store]) }, [searchDebount, startDate, status, provide])
useEffect(() => {
if (merchant) {
getDropdownStore(merchant)
}
setStore()
}, [merchant])
const getDataMerchant = async () => {
const res = await dropdownMerchant({})
const getDataDropdown = async () => {
const res = await dropdownProvider({})
if (res.data.code == 200 && res.data.data) { if (res.data.code == 200 && res.data.data) {
const newList = res.data.data.map((e) => { const newList = res.data.data.map((e) => {
return { ...e, name: e.merchant_name } return { ...e, id: e.code }
})
setListMerchant(newList)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
}) })
setListProvide(newList)
} }
} }
const removeItem = async (id) => {
const getDropdownStore = async (id) => { props.showLoading()
const res = await dropdownStore(id) const res = await updateSheetReconciliation({
id: id,
if (res.data.code == 200 && res.data.data) { status: 3,
console.log('res.data.data', res.data.data) })
const newList = res.data.data.map((e) => { getData(false)
return { ...e, name: e.store_name } props.hideLoading()
}) if (res.data.code == 200) {
setListStore(newList) if (res.data.code == 200) {
toast.success(
'Cập nhật trạng thái phiếu đối soát thành công!',
{
theme: 'colored',
}
)
}
} else { } else {
toast.error(t(res.data.error), { toast.error(t(res.data.error), {
theme: 'colored', theme: 'colored',
...@@ -147,15 +134,12 @@ const ToolNotificate = (props) => { ...@@ -147,15 +134,12 @@ const ToolNotificate = (props) => {
applications={applications} applications={applications}
startDate={startDate} startDate={startDate}
changeDateRange={changeDateRange} changeDateRange={changeDateRange}
type={type} listProvide={listProvide}
setType={setType} provide={provide}
listType={listType} setProvide={setProvide}
merchant={merchant} status={status}
setMerchant={setMerchant} setStatus={setStatus}
listMerchant={listMerchant} removeItem={removeItem}
store={store}
setStore={setStore}
listStore={listStore}
/> />
) )
} }
......
src/app/views/PaymentSupplier/SheetCheck/Table.js
...@@ -12,12 +12,18 @@ import { ...@@ -12,12 +12,18 @@ import {
MenuItem, MenuItem,
Tooltip, Tooltip,
Icon, Icon,
Typography,
} from '@material-ui/core' } from '@material-ui/core'
import EditIcon from '@material-ui/icons/Edit' import EditIcon from '@material-ui/icons/Edit'
import DeleteIcon from '@material-ui/icons/Delete' import DeleteIcon from '@material-ui/icons/Delete'
import colors from 'app/assets/Color' import colors from 'app/assets/Color'
import useStyles from 'app/styles/Table' import useStyles from 'app/styles/Table'
import { Breadcrumb, SimpleCard } from 'app/components' import { Breadcrumb, SimpleCard } from 'app/components'
import { toPriceVnd } from 'app/config/Function'
import { checkRole } from 'app/config/Function'
import useAuth from 'app/hooks/useAuth'
import { useHistory } from 'react-router-dom'
import DialogTransition from 'app/components/dialog/DialogTransition'
const columns = [ const columns = [
{ {
...@@ -26,73 +32,44 @@ const columns = [ ...@@ -26,73 +32,44 @@ const columns = [
align: 'center', align: 'center',
minWidth: 80, minWidth: 80,
}, },
{ {
id: 'store_name', id: 'code',
label: 'Cây xăng', label: 'Mã phiếu đối soát',
align: 'left', align: 'left',
minWidth: 160, minWidth: 160,
}, },
// {
// id: 'application',
// label: 'Mã NV',
// align: 'left',
// minWidth: 140,
// },
{ {
id: 'order_code', id: 'idPaymentPartner',
label: 'Mã hoá đơn', label: 'Đối tác',
align: 'left', align: 'left',
minWidth: 160, minWidth: 80,
},
{
id: 'created_date',
label: 'Ngày giao dịch',
align: 'left',
minWidth: 110,
}, },
// {
// id: 'IP',
// label: 'Loại nhiên liệu',
// align: 'left',
// minWidth: 140,
// },
{ {
id: 'product_name', id: 'create_date',
label: 'Sản phẩm', label: 'Ngày tạo phiếu',
align: 'left', align: 'left',
minWidth: 120, minWidth: 110,
}, },
{ {
id: 'unit_price', id: 'update_date',
label: 'Đơn giá', label: 'Ngày cập nhật',
align: 'left', align: 'left',
minWidth: 80, minWidth: 110,
}, },
{ {
id: 'quantity', id: 'date_reconciliation',
label: 'Lượng nhiên liệu', label: 'Ngày đối soát',
align: 'left', align: 'left',
minWidth: 80, minWidth: 110,
}, },
{ {
id: 'price', id: 'totalCommission',
label: 'Thành tiền', label: 'Hoa hồng',
align: 'left', align: 'left',
minWidth: 80, minWidth: 80,
}, isMonney: true,
{
id: 'type_payment',
label: 'Phương thức thanh toán',
align: 'left',
minWidth: 100,
},
{
id: 'status_text',
label: 'Trạng thái',
align: 'left',
minWidth: 100,
}, },
] ]
...@@ -109,6 +86,14 @@ function TableList(props) { ...@@ -109,6 +86,14 @@ function TableList(props) {
pageIndex, pageIndex,
totalRecords, totalRecords,
} = props } = props
let history = useHistory()
const [open, setOpen] = React.useState(false)
const [selected, setSelected] = useState({
name: '',
id: '',
title: '',
content: '',
})
const handleChangePage = (event, newPage) => { const handleChangePage = (event, newPage) => {
setPageIndex(newPage) setPageIndex(newPage)
...@@ -116,7 +101,22 @@ function TableList(props) { ...@@ -116,7 +101,22 @@ function TableList(props) {
const handleChangeRowsPerPage = (event) => { const handleChangeRowsPerPage = (event) => {
setPageSize(event.target.value) setPageSize(event.target.value)
} }
const renderStatusBg = (status) => {
if (status == 3) return '#ECFDF3'
if (status == 2) return '#FFDC98'
return '#F2F4F7'
}
const renderStatusColor = (status) => {
if (status == 3) return '#027A48'
if (status == 2) return '#F1AA1F'
return '#344054'
}
const handleClose = () => {
setOpen(false)
}
const { user } = useAuth()
return ( return (
<Paper className={classes.root}> <Paper className={classes.root}>
<TableContainer className={classes.container}> <TableContainer className={classes.container}>
...@@ -135,6 +135,14 @@ function TableList(props) { ...@@ -135,6 +135,14 @@ function TableList(props) {
{column.label} {column.label}
</TableCell> </TableCell>
))} ))}
<TableCell
style={{
width: 100,
backgroundColor: colors.headerTable,
}}
>
Trạng thái
</TableCell>
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody className={classes.columnTable}> <TableBody className={classes.columnTable}>
...@@ -147,28 +155,44 @@ function TableList(props) { ...@@ -147,28 +155,44 @@ function TableList(props) {
key={row.id} key={row.id}
> >
{columns.map((column) => { {columns.map((column) => {
const avatar = row[column.id] const data = row[column.id]
return ( return (
<TableCell <TableCell
key={column.id} key={column.id}
align={column.align} align={column.align}
style={{
textAlign:
column.id === 'index'
? 'center'
: typeof data ==
'string'
? 'left'
: 'right',
}}
> >
{column.format ? ( {column.isMonney
<img ? toPriceVnd(data)
src={column.format( : data}
avatar
)}
className={
classes.image
}
/>
) : (
avatar
)}
</TableCell> </TableCell>
) )
})} })}
<TableCell align={'center'}>
<Typography
style={{
padding: 5,
backgroundColor: renderStatusBg(
row?.status
),
color: renderStatusColor(
row?.status
),
borderRadius: 10,
textAlign: 'center',
}}
>
{row?.status_name}
</Typography>
</TableCell>
</TableRow> </TableRow>
) )
})} })}
...@@ -184,6 +208,15 @@ function TableList(props) { ...@@ -184,6 +208,15 @@ function TableList(props) {
onChangePage={handleChangePage} onChangePage={handleChangePage}
onChangeRowsPerPage={handleChangeRowsPerPage} onChangeRowsPerPage={handleChangeRowsPerPage}
/> />
<DialogTransition
data={selected}
open={open}
handleClose={handleClose}
onAgree={() => {
removeItem(selected.id)
handleClose()
}}
/>
</Paper> </Paper>
) )
} }
......
src/app/views/PaymentSupplier/SheetCheck/View.js
...@@ -33,15 +33,13 @@ function CustomerView(props) { ...@@ -33,15 +33,13 @@ function CustomerView(props) {
applications, applications,
startDate, startDate,
changeDateRange, changeDateRange,
type,
setType, status,
listType, setStatus,
listMerchant, provide,
setMerchant, setProvide,
merchant, listProvide,
store, removeItem,
setStore,
listStore,
} = props } = props
const handleChange = (event) => { const handleChange = (event) => {
...@@ -49,140 +47,92 @@ function CustomerView(props) { ...@@ -49,140 +47,92 @@ function CustomerView(props) {
} }
return ( return (
<Fragment> <Fragment>
<div className="m-sm-30"> <Grid
<div className="mb-sm-30"> style={{
<Breadcrumb padding: 10,
routeSegments={[ marginBottom: 20,
{ }}
name: 'Danh sách giao dịch', //justify={'space-between'}
path: '/transations', alignItems={'center'}
}, container
]} spacing={3}
>
<Grid item lg={3} md={3} sm={4} xs={4}>
<TextField
variant="outlined"
className="w-full"
label="Tìm kiếm"
onChange={(e) => {
const text = e.target.value
setTxtSearch(text)
}}
/> />
</div> </Grid>
<Grid <Grid item lg={3} md={3} sm={3} xs={3}>
style={{ <FormControl variant="outlined" fullWidth>
padding: 10, <InputLabel htmlFor="outlined-age-native-simple">
marginBottom: 20, Trạng thái
}} </InputLabel>
//justify={'space-between'} <Select
alignItems={'center'} label="Trạng thái"
container value={status}
spacing={3} onChange={(e) => setStatus(e.target.value)}
> inputProps={{
<Grid item lg={3} md={3} sm={3} xs={3}> name: 'age',
<TextField id: 'outlined-age-native-simple',
variant="outlined"
className="w-full"
label="Tìm kiếm"
onChange={(e) => {
const text = e.target.value
setTxtSearch(text)
}} }}
/> >
</Grid> <MenuItem value="">
<em>Tất cả</em>
</MenuItem>
{[
{
name: 'Nháp',
value: 1,
id: 1,
},
<Grid item lg={3} md={3} sm={3} xs={3}> {
<FormControl variant="outlined" fullWidth> name: 'Chưa đối soát',
<InputLabel htmlFor="outlined-age-native-simple"> value: 2,
Phương thức thanh toán id: 2,
</InputLabel> },
<Select {
label="Phương thức thanh toán" name: 'Đang đối soát',
value={type} value: 3,
onChange={(e) => setType(e.target.value)} id: 3,
inputProps={{ },
name: 'age', {
id: 'outlined-age-native-simple', name: 'Đã đối soát',
}} value: 4,
> id: 4,
<MenuItem value=""> },
<em>Tất cả</em> ].map((e) => (
</MenuItem> <MenuItem value={e.id}>{e.name}</MenuItem>
{[ ))}
{ </Select>
id: 'QR', </FormControl>
name: 'QR', </Grid>
},
{ <Grid item lg={3} md={3} sm={3} xs={3}>
id: 'CASH', <DateRange
name: 'Tiền mặt', date={startDate}
}, changeDateRange={changeDateRange}
{ />
id: 'DEBT',
name: 'Công nợ',
},
].map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem>
))}
</Select>
</FormControl>
</Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple">
Pháp nhân
</InputLabel>
<Select
label="Pháp nhân"
value={merchant}
onChange={(e) => setMerchant(e.target.value)}
inputProps={{
name: 'age',
id: 'outlined-age-native-simple',
}}
>
<MenuItem value="">
<em>Tất cả</em>
</MenuItem>
{listMerchant.map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem>
))}
</Select>
</FormControl>
</Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple">
Cây xăng
</InputLabel>
<Select
label="Cây xăng"
value={store}
onChange={(e) => setStore(e.target.value)}
inputProps={{
name: 'age',
id: 'outlined-age-native-simple',
}}
>
<MenuItem value="">
<em>Tất cả</em>
</MenuItem>
{listStore.map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem>
))}
</Select>
</FormControl>
</Grid>
<Grid item lg={3} md={3} sm={3} xs={3}>
<DateRange
date={startDate}
changeDateRange={changeDateRange}
/>
</Grid>
</Grid> </Grid>
</Grid>
<Table <Table
data={data} data={data}
changeActive={changeActive} changeActive={changeActive}
setChangeActive={setChangeActive} setChangeActive={setChangeActive}
handeChangeActive={handeChangeActive} handeChangeActive={handeChangeActive}
pageIndex={pageIndex} pageIndex={pageIndex}
setPageIndex={setPageIndex} setPageIndex={setPageIndex}
totalRecords={totalRecords} totalRecords={totalRecords}
/> removeItem={removeItem}
</div> />
</Fragment> </Fragment>
) )
} }
......
src/app/views/PaymentSupplier/Table.js
...@@ -251,13 +251,13 @@ function TableList(props) { ...@@ -251,13 +251,13 @@ function TableList(props) {
user, user,
'/payment-supplier/update' '/payment-supplier/update'
) ? ( ) ? (
<Tooltip title="Cập nhật"> <Tooltip title="Chi tiết">
<IconButton <IconButton
onClick={() => { onClick={() => {
history.push({ history.push({
pathname: pathname:
'/payment-supplier/detail', '/payment-supplier/detail',
state: row.id, state: row,
}) })
}} }}
className={classes.button} className={classes.button}
......
src/app/views/PaymentSupplier/detail.js
...@@ -27,10 +27,15 @@ import { ...@@ -27,10 +27,15 @@ import {
} from 'app/config/Function' } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
import PieChartReport from './PieChartReport' import PieChartReport from './PieChartReport'
import CustomLineChart from 'app/components/Chart/LineChart' import LineChartCustom from './LineChartCustom'
import TabTrans from './TabTrans/index' import TabTrans from './TabTrans/index'
import { detailSupplier, updateSupplier } from 'app/apis/Functions/supplier' import {
detailSupplier,
updateSupplier,
piechartPaymentPartner,
linechartPaymentPartner,
} from 'app/apis/Functions/supplier'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import useAuth from 'app/hooks/useAuth' import useAuth from 'app/hooks/useAuth'
const SimpleForm = (props) => { const SimpleForm = (props) => {
...@@ -38,19 +43,30 @@ const SimpleForm = (props) => { ...@@ -38,19 +43,30 @@ const SimpleForm = (props) => {
const location = useLocation() const location = useLocation()
const [image, setImage] = useState() const [image, setImage] = useState()
const { user } = useAuth() const { user } = useAuth()
const [type, setType] = useState(1)
const [day, setDay] = useState(7)
const [dataPieChart, setDataPieChart] = useState()
const [dataLineChart, setDataLineChart] = useState()
const color = ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00']
const [date, setDate] = useState(null) const [date, setDate] = useState(null)
const { t } = useTranslation() const { t } = useTranslation()
useEffect(() => { useEffect(() => {
getDataDefault() getDataDefault()
}, []) }, [])
useEffect(() => {
if (day && type) {
getDataLineChart()
getDataPieChart()
}
}, [day, type])
const history = useHistory() const history = useHistory()
const getDataDefault = async () => { const getDataDefault = async () => {
props.showLoading() props.showLoading()
try { try {
const res = await detailSupplier(location.state, {}) const res = await detailSupplier(location.state?.id, {})
setState({ ...res.data.data }) setState({ ...res.data.data })
} catch (err) { } catch (err) {
toast.error(t(err), { toast.error(t(err), {
...@@ -60,6 +76,67 @@ const SimpleForm = (props) => { ...@@ -60,6 +76,67 @@ const SimpleForm = (props) => {
props.hideLoading() props.hideLoading()
} }
const getDataLineChart = async () => {
props.showLoading()
try {
const res = await linechartPaymentPartner({
id: location.state?.provider_code,
type: type,
dayCount: day,
})
console.log('res', res.data)
if (res.data.code == 200 && res.data.data) {
const xAxis = res.data.data?.map((e) => {
return e?.Day
})
const series = res.data.data?.map((e) => {
return e?.Value
})
setDataLineChart({
xAxis,
series,
})
} else {
setDataLineChart(null)
}
} catch (err) {
toast.error(t(err), {
theme: 'colored',
})
}
props.hideLoading()
}
const getDataPieChart = async () => {
props.showLoading()
try {
const res = await piechartPaymentPartner({
id: location.state?.provider_code,
type: type,
dayCount: day,
})
if (res.data.code == 200 && res.data.data) {
const { Reconciled, NotReconciled } = res.data.data
setDataPieChart([
{
value: Reconciled,
name: 'Đã đối soát',
},
{
value: NotReconciled,
name: 'Khác',
},
])
}
} catch (err) {
toast.error(t(err), {
theme: 'colored',
})
}
props.hideLoading()
}
const handleSubmit = async (event) => { const handleSubmit = async (event) => {
const newValue = trimObject(state) const newValue = trimObject(state)
...@@ -91,6 +168,8 @@ const SimpleForm = (props) => { ...@@ -91,6 +168,8 @@ const SimpleForm = (props) => {
}) })
} }
console.log('dataLineChart', dataLineChart)
const { provider_code, provider_name, phone, email, address } = state const { provider_code, provider_name, phone, email, address } = state
return ( return (
<div className="m-sm-30"> <div className="m-sm-30">
...@@ -225,7 +304,7 @@ const SimpleForm = (props) => { ...@@ -225,7 +304,7 @@ const SimpleForm = (props) => {
</SimpleCard> </SimpleCard>
<div style={{ height: 10 }} /> <div style={{ height: 10 }} />
<SimpleCard> <SimpleCard>
<Grid container spacing={3}> <Grid container spacing={2}>
<Grid <Grid
item item
lg={12} lg={12}
...@@ -237,61 +316,101 @@ const SimpleForm = (props) => { ...@@ -237,61 +316,101 @@ const SimpleForm = (props) => {
spacing={3} spacing={3}
> >
<Grid item lg={2} md={2} sm={4} xs={4}> <Grid item lg={2} md={2} sm={4} xs={4}>
<FormControl variant="outlined" fullWidth> {type && (
<Select <FormControl variant="outlined" fullWidth>
//value={store} <Select
onChange={(e) => { value={type}
//setStore(e.target.value) onChange={(e) => {
}} setType(e.target.value)
inputProps={{ }}
name: 'age', inputProps={{
id: 'outlined-age-native-simple', name: 'age',
}} id: 'outlined-age-native-simple',
> }}
{[].map((e) => ( >
<MenuItem value={e.id}> {[
{e.name} {
</MenuItem> name: 'Theo số hoa hồng',
))} value: 1,
</Select> },
</FormControl> {
name: 'Theo giao dịch',
value: 2,
},
].map((e) => (
<MenuItem value={e.value}>
{e.name}
</MenuItem>
))}
</Select>
</FormControl>
)}
</Grid> </Grid>
<Grid item lg={2} md={2} sm={4} xs={4}> <Grid item lg={2} md={2} sm={4} xs={4}>
<FormControl variant="outlined" fullWidth> <FormControl variant="outlined" fullWidth>
<Select {day && (
//value={store} <Select
onChange={(e) => { value={day}
//setStore(e.target.value) onChange={(e) => {
}} setDay(e.target.value)
inputProps={{ }}
name: 'age', inputProps={{
id: 'outlined-age-native-simple', name: 'age',
}} id: 'outlined-age-native-simple',
> }}
{[].map((e) => ( >
<MenuItem value={e.id}> {[
{e.name} {
</MenuItem> name: '7 ngày',
))} value: 7,
</Select> },
{
name: '14 ngày',
value: 14,
},
{
name: '30 ngày',
value: 30,
},
{
name: '90 ngày',
value: 90,
},
{
name: '180 ngày',
value: 180,
},
{
name: '1 năm',
value: 365,
},
].map((e) => (
<MenuItem value={e.value}>
{e.name}
</MenuItem>
))}
</Select>
)}
</FormControl> </FormControl>
</Grid> </Grid>
</Grid> </Grid>
<Grid xs={4} item> <Grid xs={3} item>
<PieChartReport /> {dataPieChart && (
<PieChartReport data={dataPieChart} />
)}
</Grid> </Grid>
<Grid xs={8} item container>
<CustomLineChart <Grid xs={9} item>
data={{ {dataPieChart && (
legend: [], <LineChartCustom
xAxis: [], color={color}
series: [], data={dataLineChart}
}} />
color={[]} )}
/>
</Grid> </Grid>
</Grid> </Grid>
</SimpleCard> </SimpleCard>
<div style={{ height: 10 }} /> <div style={{ height: 10 }} />
<SimpleCard> <SimpleCard>
<TabTrans /> <TabTrans />
......
src/app/views/Reconciliation/ListTrans/Index.js
...@@ -8,7 +8,11 @@ import { showLoading, hideLoading } from 'app/redux/actions/loadingAction' ...@@ -8,7 +8,11 @@ import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import useDebounce from 'app/hooks/useDebounce' import useDebounce from 'app/hooks/useDebounce'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { dropdownProduct, dropdownProvider } from 'app/apis/Functions/dropdown' import {
dropdownProduct,
dropdownProvider,
dropdownListPayType,
} from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => { const ToolNotificate = (props) => {
const [txtSearch, setTxtSearch] = useState('') const [txtSearch, setTxtSearch] = useState('')
...@@ -29,6 +33,7 @@ const ToolNotificate = (props) => { ...@@ -29,6 +33,7 @@ const ToolNotificate = (props) => {
const [listProduct, setListProduct] = useState([]) const [listProduct, setListProduct] = useState([])
const [product, setProduct] = useState() const [product, setProduct] = useState()
const [status, setStatus] = useState() const [status, setStatus] = useState()
useEffect(() => { useEffect(() => {
getData(false) getData(false)
}, [pageIndex]) }, [pageIndex])
...@@ -122,6 +127,16 @@ const ToolNotificate = (props) => { ...@@ -122,6 +127,16 @@ const ToolNotificate = (props) => {
}) })
setListProduct(newList) setListProduct(newList)
} }
const resType = await dropdownListPayType()
if (resType.data.code == 200 && resType.data.data) {
const newList = resType.data.data.map((item) => {
return { ...item }
})
setListType(newList)
}
} }
return ( return (
......
src/app/views/Reconciliation/ListTrans/Table.js
...@@ -149,7 +149,7 @@ function TableList(props) { ...@@ -149,7 +149,7 @@ function TableList(props) {
))} ))}
<TableCell <TableCell
style={{ style={{
width: 110, width: 120,
backgroundColor: colors.headerTable, backgroundColor: colors.headerTable,
}} }}
> >
......
src/app/views/Reconciliation/ListTrans/View.js
...@@ -154,20 +154,7 @@ function CustomerView(props) { ...@@ -154,20 +154,7 @@ function CustomerView(props) {
<MenuItem value=""> <MenuItem value="">
<em>Tất cả</em> <em>Tất cả</em>
</MenuItem> </MenuItem>
{[ {listType.map((e) => (
{
id: 'QR',
name: 'QR',
},
{
id: 'CASH',
name: 'Tiền mặt',
},
{
id: 'DEBT',
name: 'Công nợ',
},
].map((e) => (
<MenuItem value={e.id}>{e.name}</MenuItem> <MenuItem value={e.id}>{e.name}</MenuItem>
))} ))}
</Select> </Select>
......
src/app/views/Reconciliation/Setting/Update.js
...@@ -236,7 +236,6 @@ const SimpleForm = (props) => { ...@@ -236,7 +236,6 @@ const SimpleForm = (props) => {
reconciliationTime, reconciliationTime,
percent, percent,
} = state } = state
console.log('reconciliationTime', reconciliationTime)
return ( return (
<div className="m-sm-30"> <div className="m-sm-30">
......
src/app/views/Reconciliation/Sheet/Detail.js
...@@ -33,13 +33,21 @@ import { createSupplier } from 'app/apis/Functions/supplier' ...@@ -33,13 +33,21 @@ import { createSupplier } from 'app/apis/Functions/supplier'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import useAuth from 'app/hooks/useAuth' import useAuth from 'app/hooks/useAuth'
import ListTrans from './ListTrans/Index' import ListTrans from './ListTrans/Index'
import {
detailSheetReconciliation,
updateSheetReconciliation,
} from 'app/apis/Functions/reconciliation'
const SimpleForm = (props) => { const SimpleForm = (props) => {
const [state, setState] = useState({}) const [state, setState] = useState({})
const location = useLocation()
const [listDrop, setListDrop] = useState([]) const [listDrop, setListDrop] = useState([])
const [listAction, setListAction] = useState([]) const [listAction, setListAction] = useState([])
useEffect(() => {
getDataDefault()
}, [])
const { user } = useAuth() const { user } = useAuth()
const { t } = useTranslation() const { t } = useTranslation()
...@@ -49,19 +57,21 @@ const SimpleForm = (props) => { ...@@ -49,19 +57,21 @@ const SimpleForm = (props) => {
const handleSubmit = async (event) => { const handleSubmit = async (event) => {
const newValue = trimObject(state) const newValue = trimObject(state)
props.showLoading() props.showLoading()
const res = await createSupplier({ const res = await updateSheetReconciliation({
...newValue, id: location.state?.id,
type: '3', status: 3,
status: 1,
}) })
props.hideLoading() props.hideLoading()
if (res.data.code == 200) { if (res.data.code == 200) {
history.push('/reconciliation/sheet') history.push('/reconciliation/sheet')
if (res.data.code == 200) { if (res.data.code == 200) {
toast.success('Tạo nhà cung cấp thiết bị thành công!', { toast.success(
theme: 'colored', 'Cập nhật trạng thái phiếu đối soát thành công!',
}) {
theme: 'colored',
}
)
} }
} else { } else {
toast.error(t(res.data.error), { toast.error(t(res.data.error), {
...@@ -70,6 +80,21 @@ const SimpleForm = (props) => { ...@@ -70,6 +80,21 @@ const SimpleForm = (props) => {
} }
} }
const getDataDefault = async () => {
props.showLoading()
try {
const res = await detailSheetReconciliation(location.state?.id, {})
if (res.data.data) {
setState({ ...res.data.data })
}
} catch (err) {
toast.error(t(err), {
theme: 'colored',
})
}
props.hideLoading()
}
const handleChange = (event) => { const handleChange = (event) => {
event.persist() event.persist()
setState({ setState({
...@@ -78,7 +103,16 @@ const SimpleForm = (props) => { ...@@ -78,7 +103,16 @@ const SimpleForm = (props) => {
}) })
} }
const { provider_code, provider_name, phone, email, address } = state const {
code,
idPaymentPartner,
create_by,
note,
date_reconciliation,
update_date,
create_date,
status,
} = state
return ( return (
<div className="m-sm-30"> <div className="m-sm-30">
<div className="mb-sm-30"> <div className="mb-sm-30">
...@@ -116,7 +150,7 @@ const SimpleForm = (props) => { ...@@ -116,7 +150,7 @@ const SimpleForm = (props) => {
<Link to="/reconciliation/sheet"> <Link to="/reconciliation/sheet">
<Button <Button
style={{ style={{
marginRight: 20, marginRight: status != 3 ? 20 : 0,
}} }}
color="inherit" color="inherit"
variant="contained" variant="contained"
...@@ -127,13 +161,17 @@ const SimpleForm = (props) => { ...@@ -127,13 +161,17 @@ const SimpleForm = (props) => {
</span> </span>
</Button> </Button>
</Link> </Link>
<Button {status != 3 ? (
color="primary" <Button
variant="contained" color="primary"
type="submit" variant="contained"
> type="submit"
<span className="capitalize">Đối soát</span> >
</Button> <span className="capitalize">
Đối soát
</span>
</Button>
) : null}
</Grid> </Grid>
<Grid <Grid
item item
...@@ -166,7 +204,7 @@ const SimpleForm = (props) => { ...@@ -166,7 +204,7 @@ const SimpleForm = (props) => {
marginBottom: 10, marginBottom: 10,
}} }}
> >
hêhh {code}
</Typography> </Typography>
<Typography <Typography
...@@ -184,7 +222,7 @@ const SimpleForm = (props) => { ...@@ -184,7 +222,7 @@ const SimpleForm = (props) => {
marginBottom: 10, marginBottom: 10,
}} }}
> >
hêhh {idPaymentPartner}
</Typography> </Typography>
<Typography <Typography
...@@ -201,7 +239,7 @@ const SimpleForm = (props) => { ...@@ -201,7 +239,7 @@ const SimpleForm = (props) => {
fontSize: 14, fontSize: 14,
}} }}
> >
hêhh {create_by}
</Typography> </Typography>
</Card> </Card>
</Grid> </Grid>
...@@ -227,7 +265,7 @@ const SimpleForm = (props) => { ...@@ -227,7 +265,7 @@ const SimpleForm = (props) => {
marginBottom: 10, marginBottom: 10,
}} }}
> >
hêhh {create_date}
</Typography> </Typography>
<Typography <Typography
...@@ -245,7 +283,7 @@ const SimpleForm = (props) => { ...@@ -245,7 +283,7 @@ const SimpleForm = (props) => {
marginBottom: 10, marginBottom: 10,
}} }}
> >
hêhh {update_date}
</Typography> </Typography>
<Typography <Typography
...@@ -262,7 +300,7 @@ const SimpleForm = (props) => { ...@@ -262,7 +300,7 @@ const SimpleForm = (props) => {
fontSize: 14, fontSize: 14,
}} }}
> >
hêhh {date_reconciliation}
</Typography> </Typography>
</Card> </Card>
</Grid> </Grid>
...@@ -289,9 +327,7 @@ const SimpleForm = (props) => { ...@@ -289,9 +327,7 @@ const SimpleForm = (props) => {
height: 130, height: 130,
}} }}
> >
Phải có ít nhất một bồn bể!Phải có {note}
ít nhất một bồn bể!Phải có ít nhất
một bồn bể!Phải có ít nhất một bồn
</Typography> </Typography>
</Card> </Card>
</Grid> </Grid>
...@@ -306,7 +342,13 @@ const SimpleForm = (props) => { ...@@ -306,7 +342,13 @@ const SimpleForm = (props) => {
container container
spacing={2} spacing={2}
> >
<ListTrans isDetail={true} /> <ListTrans
isDetail={true}
idReconciliation={location.state?.id}
idPaymentPartner={
location.state?.idPaymentPartner
}
/>
</Grid> </Grid>
</Grid> </Grid>
</ValidatorForm> </ValidatorForm>
......
src/app/views/Reconciliation/Sheet/Dialog/Dialog.js
...@@ -9,6 +9,7 @@ import IconButton from '@material-ui/core/IconButton' ...@@ -9,6 +9,7 @@ import IconButton from '@material-ui/core/IconButton'
import CloseIcon from '@material-ui/icons/Close' import CloseIcon from '@material-ui/icons/Close'
import Typography from '@material-ui/core/Typography' import Typography from '@material-ui/core/Typography'
import CustomerList from './Index' import CustomerList from './Index'
import { stubFalse } from 'lodash'
const styles = (theme) => ({ const styles = (theme) => ({
root: { root: {
...@@ -55,7 +56,8 @@ const DialogActions = withStyles((theme) => ({ ...@@ -55,7 +56,8 @@ const DialogActions = withStyles((theme) => ({
}))(MuiDialogActions) }))(MuiDialogActions)
const CustomizedDialogs = (props) => { const CustomizedDialogs = (props) => {
const { onSelectCustomer, cusomterSelect, idPaymentPartner } = props const { onSelectCustomer, cusomterSelect, idPaymentPartner, onAddTrans } =
props
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
const handleClickOpen = () => { const handleClickOpen = () => {
...@@ -105,6 +107,11 @@ const CustomizedDialogs = (props) => { ...@@ -105,6 +107,11 @@ const CustomizedDialogs = (props) => {
handleClose={handleClose} handleClose={handleClose}
idPaymentPartner={idPaymentPartner} idPaymentPartner={idPaymentPartner}
open={open} open={open}
onAddTrans={(list) => {
console.log('run')
onAddTrans(list)
handleClose()
}}
/> />
</DialogContent> </DialogContent>
</Dialog> </Dialog>
......
src/app/views/Reconciliation/Sheet/Dialog/Index.js
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import LogAuth from './View' import LogAuth from './View'
import { listTransReconciliation } from 'app/apis/Functions/reconciliation' import { listTransSelect } from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom' import { useHistory } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function' import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
...@@ -11,7 +11,7 @@ import { useTranslation } from 'react-i18next' ...@@ -11,7 +11,7 @@ import { useTranslation } from 'react-i18next'
import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown' import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => { const ToolNotificate = (props) => {
const { customSelect, handleClose, idPaymentPartner } = props const { customSelect, handleClose, idPaymentPartner, onAddTrans } = props
const [listSelected, setListSelected] = useState([]) const [listSelected, setListSelected] = useState([])
const [txtSearch, setTxtSearch] = useState('') const [txtSearch, setTxtSearch] = useState('')
const [applications, setApplications] = useState('') const [applications, setApplications] = useState('')
...@@ -39,10 +39,11 @@ const ToolNotificate = (props) => { ...@@ -39,10 +39,11 @@ const ToolNotificate = (props) => {
props.showLoading() props.showLoading()
const res = await listTransReconciliation({ const res = await listTransSelect({
text: searchDebount,
date_from: startDate ? convertDate(startDate) : null, date_from: startDate ? convertDate(startDate) : null,
date_to: endDate ? convertDate(endDate) : null, date_to: endDate ? convertDate(endDate) : null,
statusReconciliation: 1, statusReconciliation: 0,
payment_gate_code: props?.idPaymentPartner, payment_gate_code: props?.idPaymentPartner,
order_code: searchDebount, order_code: searchDebount,
type_payment: type || type, type_payment: type || type,
...@@ -51,16 +52,10 @@ const ToolNotificate = (props) => { ...@@ -51,16 +52,10 @@ const ToolNotificate = (props) => {
console.log('res.data', res.data) console.log('res.data', res.data)
props.hideLoading() props.hideLoading()
if (res.data.code == 200 && res.data.data) { if (res.data.code == 200 && res.data.data) {
console.log('idPaymentPartner', res.data.data) const newList = res.data.data?.map((e, i) => {
const newList = res.data.data?.data?.map((e, i) => {
return { ...e, index: i + 1 + pageIndex * pageSize } return { ...e, index: i + 1 + pageIndex * pageSize }
}) })
setData(newList) setData(newList)
setTotalRecord(res.data.data.total_elements)
} else if (res.data.code == 401) {
setTimeout(() => {
history.push('/')
}, 100)
} else { } else {
toast.error(t(res.data.error), { toast.error(t(res.data.error), {
theme: 'colored', theme: 'colored',
...@@ -70,8 +65,6 @@ const ToolNotificate = (props) => { ...@@ -70,8 +65,6 @@ const ToolNotificate = (props) => {
} }
useEffect(() => { useEffect(() => {
console.log('props?.open', props?.open)
console.log('props?.open', props?.idPaymentPartner)
if (props?.open) { if (props?.open) {
console.log('run') console.log('run')
getData(true) getData(true)
...@@ -79,7 +72,13 @@ const ToolNotificate = (props) => { ...@@ -79,7 +72,13 @@ const ToolNotificate = (props) => {
}, [searchDebount, startDate, type, props]) }, [searchDebount, startDate, type, props])
const onAdd = () => { const onAdd = () => {
console.log('listSelected', listSelected) if (listSelected.length > 0) {
onAddTrans(listSelected)
} else {
toast.warning('Mời bạn chọn giao dịch', {
theme: 'colored',
})
}
} }
return ( return (
......
src/app/views/Reconciliation/Sheet/Dialog/Table.js
...@@ -222,24 +222,6 @@ function TableList(props) { ...@@ -222,24 +222,6 @@ function TableList(props) {
</TableBody> </TableBody>
</Table> </Table>
</TableContainer> </TableContainer>
<TablePagination
component="div"
page={pageIndex}
count={totalRecords}
rowsPerPage={10}
rowsPerPageOptions={[]}
onChangePage={handleChangePage}
onChangeRowsPerPage={handleChangeRowsPerPage}
/>
<DialogTransition
data={selected}
open={open}
handleClose={handleClose}
onAgree={() => {
removeItem(selected.id)
handleClose()
}}
/>
</Paper> </Paper>
) )
} }
......
src/app/views/Reconciliation/Sheet/Index.js
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import LogAuth from './View' import LogAuth from './View'
import { listSheetReconciliation } from 'app/apis/Functions/reconciliation' import {
listSheetReconciliation,
updateSheetReconciliation,
} from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom' import { useHistory } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function' import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
...@@ -97,6 +100,29 @@ const ToolNotificate = (props) => { ...@@ -97,6 +100,29 @@ const ToolNotificate = (props) => {
setListProvide(newList) setListProvide(newList)
} }
} }
const removeItem = async (id) => {
props.showLoading()
const res = await updateSheetReconciliation({
id: id,
status: 3,
})
getData(false)
props.hideLoading()
if (res.data.code == 200) {
if (res.data.code == 200) {
toast.success(
'Cập nhật trạng thái phiếu đối soát thành công!',
{
theme: 'colored',
}
)
}
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
return ( return (
<LogAuth <LogAuth
...@@ -114,6 +140,7 @@ const ToolNotificate = (props) => { ...@@ -114,6 +140,7 @@ const ToolNotificate = (props) => {
setProvide={setProvide} setProvide={setProvide}
status={status} status={status}
setStatus={setStatus} setStatus={setStatus}
removeItem={removeItem}
/> />
) )
} }
......
src/app/views/Reconciliation/Sheet/ListTrans/Index.js
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import LogAuth from './View' import LogAuth from './View'
import { listTransReconciliation } from 'app/apis/Functions/reconciliation' import {
listTransReconciliation,
deleteTranInReconciliation,
addTransInReconciliation,
} from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom' import { useHistory } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function' import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux' import { connect } from 'react-redux'
...@@ -28,6 +32,7 @@ const ToolNotificate = (props) => { ...@@ -28,6 +32,7 @@ const ToolNotificate = (props) => {
const [listMerchant, setListMerchant] = useState([]) const [listMerchant, setListMerchant] = useState([])
const [store, setStore] = useState() const [store, setStore] = useState()
const [listStore, setListStore] = useState([]) const [listStore, setListStore] = useState([])
const [total, setTotal] = useState(0)
useEffect(() => { useEffect(() => {
getDataMerchant() getDataMerchant()
...@@ -38,11 +43,8 @@ const ToolNotificate = (props) => { ...@@ -38,11 +43,8 @@ const ToolNotificate = (props) => {
setEndDate(end) setEndDate(end)
} }
console.log('props?.idReconciliation', props?.idReconciliation)
const getData = async (init) => { const getData = async (init) => {
if (props?.idReconciliation) { if (props?.idReconciliation) {
props.showLoading()
let res let res
if (init) { if (init) {
setPageIndex(0) setPageIndex(0)
...@@ -57,6 +59,7 @@ const ToolNotificate = (props) => { ...@@ -57,6 +59,7 @@ const ToolNotificate = (props) => {
type_payment: null, type_payment: null,
idReconciliation: props?.idReconciliation, idReconciliation: props?.idReconciliation,
is_reconciliation: true, is_reconciliation: true,
text: searchDebount,
}) })
} else { } else {
res = await listTransReconciliation({ res = await listTransReconciliation({
...@@ -70,10 +73,10 @@ const ToolNotificate = (props) => { ...@@ -70,10 +73,10 @@ const ToolNotificate = (props) => {
type_payment: null, type_payment: null,
idReconciliation: props?.idReconciliation, idReconciliation: props?.idReconciliation,
is_reconciliation: true, is_reconciliation: true,
text: searchDebount,
}) })
} }
props.hideLoading()
if (res.data.code == 200 && res.data.data) { if (res.data.code == 200 && res.data.data) {
console.log(' res.data.data', res.data.data) console.log(' res.data.data', res.data.data)
const newList = res.data.data?.data?.map((e, i) => { const newList = res.data.data?.data?.map((e, i) => {
...@@ -81,6 +84,7 @@ const ToolNotificate = (props) => { ...@@ -81,6 +84,7 @@ const ToolNotificate = (props) => {
}) })
setData(newList) setData(newList)
setTotalRecord(res.data.data.total_elements) setTotalRecord(res.data.data.total_elements)
setTotal(res.data.data.total_commision)
} else if (res.data.code == 401) { } else if (res.data.code == 401) {
setTimeout(() => { setTimeout(() => {
history.push('/') history.push('/')
...@@ -139,6 +143,42 @@ const ToolNotificate = (props) => { ...@@ -139,6 +143,42 @@ const ToolNotificate = (props) => {
} }
} }
const removeItem = async (id) => {
props.showLoading()
const res = await deleteTranInReconciliation(id)
props.hideLoading()
if (res.data.code == 200) {
getData(true)
toast.success('Xoá giao dịch trong phiếu đối soát thành công!', {
theme: 'colored',
})
} else {
toast.error('Xoá bản ghi thất bại!', {
theme: 'colored',
})
}
}
const onAddTrans = async (listTrans) => {
if (listTrans.length > 0) {
props.showLoading()
const res = await addTransInReconciliation({
id: props?.idReconciliation,
idTrans: listTrans,
})
props.hideLoading()
if (res.data.code == 200) {
getData(true)
toast.success('Thêm giao dịch vào phiếu đối soát thành công!', {
theme: 'colored',
})
} else {
toast.error('Thêm giao dịch vào phiếu đối soát thất bại!', {
theme: 'colored',
})
}
}
}
return ( return (
<LogAuth <LogAuth
data={data} data={data}
...@@ -161,6 +201,9 @@ const ToolNotificate = (props) => { ...@@ -161,6 +201,9 @@ const ToolNotificate = (props) => {
listStore={listStore} listStore={listStore}
isDetail={props.isDetail} isDetail={props.isDetail}
idPaymentPartner={props?.idPaymentPartner} idPaymentPartner={props?.idPaymentPartner}
removeItem={removeItem}
onAddTrans={onAddTrans}
total={total}
/> />
) )
} }
......
src/app/views/Reconciliation/Sheet/ListTrans/View.js
...@@ -19,6 +19,7 @@ import { Link } from 'react-router-dom' ...@@ -19,6 +19,7 @@ import { Link } from 'react-router-dom'
import { Autocomplete, createFilterOptions } from '@material-ui/lab' import { Autocomplete, createFilterOptions } from '@material-ui/lab'
import DateRange from 'app/components/Input/DateHome' import DateRange from 'app/components/Input/DateHome'
import DialogTrans from '../Dialog/Dialog' import DialogTrans from '../Dialog/Dialog'
import { toPriceVnd } from 'app/config/Function'
function CustomerView(props) { function CustomerView(props) {
const [age, setAge] = React.useState('') const [age, setAge] = React.useState('')
...@@ -46,6 +47,9 @@ function CustomerView(props) { ...@@ -46,6 +47,9 @@ function CustomerView(props) {
listStore, listStore,
isDetail, isDetail,
idPaymentPartner, idPaymentPartner,
removeItem,
onAddTrans,
total,
} = props } = props
const handleChange = (event) => { const handleChange = (event) => {
...@@ -79,7 +83,10 @@ function CustomerView(props) { ...@@ -79,7 +83,10 @@ function CustomerView(props) {
fullWidth fullWidth
name="money" name="money"
variant="outlined" variant="outlined"
onChange={(event) => {}} onChange={(e) => {
const text = e.target.value
setTxtSearch(text)
}}
/> />
{/* {/*
<Button <Button
...@@ -94,7 +101,10 @@ function CustomerView(props) { ...@@ -94,7 +101,10 @@ function CustomerView(props) {
Chọn giao dịch Chọn giao dịch
</Button> */} </Button> */}
<DialogTrans idPaymentPartner={idPaymentPartner} /> <DialogTrans
idPaymentPartner={idPaymentPartner}
onAddTrans={onAddTrans}
/>
</Grid> </Grid>
) : null} ) : null}
...@@ -118,7 +128,8 @@ function CustomerView(props) { ...@@ -118,7 +128,8 @@ function CustomerView(props) {
color: '#027A48', color: '#027A48',
}} }}
> >
Số giao dịch: 20; Số hoa hồng: 5.300.000 VNĐ Số giao dịch: {toPriceVnd(totalRecords)}; Số hoa hồng:{' '}
{toPriceVnd(total)} VNĐ
</Typography> </Typography>
</Grid> </Grid>
</Grid> </Grid>
...@@ -132,6 +143,7 @@ function CustomerView(props) { ...@@ -132,6 +143,7 @@ function CustomerView(props) {
setPageIndex={setPageIndex} setPageIndex={setPageIndex}
totalRecords={totalRecords} totalRecords={totalRecords}
isDetail={isDetail} isDetail={isDetail}
removeItem={removeItem}
/> />
</Fragment> </Fragment>
) )
......
src/app/views/Reconciliation/Sheet/Table.js
...@@ -23,6 +23,8 @@ import { toPriceVnd } from 'app/config/Function' ...@@ -23,6 +23,8 @@ import { toPriceVnd } from 'app/config/Function'
import { checkRole } from 'app/config/Function' import { checkRole } from 'app/config/Function'
import useAuth from 'app/hooks/useAuth' import useAuth from 'app/hooks/useAuth'
import { useHistory } from 'react-router-dom' import { useHistory } from 'react-router-dom'
import DialogTransition from 'app/components/dialog/DialogTransition'
const columns = [ const columns = [
{ {
id: 'index', id: 'index',
...@@ -85,6 +87,14 @@ function TableList(props) { ...@@ -85,6 +87,14 @@ function TableList(props) {
totalRecords, totalRecords,
} = props } = props
let history = useHistory() let history = useHistory()
const [open, setOpen] = React.useState(false)
const [selected, setSelected] = useState({
name: '',
id: '',
title: '',
content: '',
})
const handleChangePage = (event, newPage) => { const handleChangePage = (event, newPage) => {
setPageIndex(newPage) setPageIndex(newPage)
} }
...@@ -102,6 +112,9 @@ function TableList(props) { ...@@ -102,6 +112,9 @@ function TableList(props) {
if (status == 2) return '#F1AA1F' if (status == 2) return '#F1AA1F'
return '#344054' return '#344054'
} }
const handleClose = () => {
setOpen(false)
}
const { user } = useAuth() const { user } = useAuth()
return ( return (
...@@ -124,7 +137,7 @@ function TableList(props) { ...@@ -124,7 +137,7 @@ function TableList(props) {
))} ))}
<TableCell <TableCell
style={{ style={{
width: 110, width: 100,
backgroundColor: colors.headerTable, backgroundColor: colors.headerTable,
}} }}
> >
...@@ -134,7 +147,7 @@ function TableList(props) { ...@@ -134,7 +147,7 @@ function TableList(props) {
style={{ style={{
textAlign: 'center', textAlign: 'center',
backgroundColor: colors.headerTable, backgroundColor: colors.headerTable,
width: 60, width: 160,
}} }}
> >
Hành động Hành động
...@@ -172,11 +185,7 @@ function TableList(props) { ...@@ -172,11 +185,7 @@ function TableList(props) {
</TableCell> </TableCell>
) )
})} })}
<TableCell <TableCell align={'center'}>
style={{
textAlign: 'center',
}}
>
<Typography <Typography
style={{ style={{
padding: 5, padding: 5,
...@@ -187,6 +196,7 @@ function TableList(props) { ...@@ -187,6 +196,7 @@ function TableList(props) {
row?.status row?.status
), ),
borderRadius: 10, borderRadius: 10,
textAlign: 'center',
}} }}
> >
{row?.status_name} {row?.status_name}
...@@ -196,7 +206,7 @@ function TableList(props) { ...@@ -196,7 +206,7 @@ function TableList(props) {
{checkRole( {checkRole(
user, user,
'/reconciliation/sheet' '/reconciliation/sheet'
) ? ( ) && row.status != 3 ? (
<Tooltip title="Cập nhật"> <Tooltip title="Cập nhật">
<IconButton <IconButton
onClick={() => { onClick={() => {
...@@ -215,6 +225,55 @@ function TableList(props) { ...@@ -215,6 +225,55 @@ function TableList(props) {
</IconButton> </IconButton>
</Tooltip> </Tooltip>
) : null} ) : null}
{checkRole(
user,
'/reconciliation/sheet'
) ? (
<Tooltip title="Chi tiết">
<IconButton
onClick={() => {
history.push({
pathname:
'/reconciliation/sheet/detail',
state: { ...row },
})
}}
className={classes.button}
aria-label="edit"
>
<Icon color="primary">
visibility
</Icon>
</IconButton>
</Tooltip>
) : null}
{checkRole(
user,
'/reconciliation/sheet'
) && row.status != 3 ? (
<Tooltip title="Phê duyệt">
<IconButton
onClick={() => {
setSelected({
...row,
title: 'Phê duyệt phiếu đối soát',
content: `Bạn có muốn Phê duyệt phiếu đối soát ${row.code} trong phiếu đối soát hay không?`,
})
setOpen(true)
}}
className={classes.button}
aria-label="Delete"
>
<Icon
style={{
color: '#027A48',
}}
>
check_circle
</Icon>
</IconButton>
</Tooltip>
) : null}
</TableCell> </TableCell>
</TableRow> </TableRow>
) )
...@@ -231,6 +290,15 @@ function TableList(props) { ...@@ -231,6 +290,15 @@ function TableList(props) {
onChangePage={handleChangePage} onChangePage={handleChangePage}
onChangeRowsPerPage={handleChangeRowsPerPage} onChangeRowsPerPage={handleChangeRowsPerPage}
/> />
<DialogTransition
data={selected}
open={open}
handleClose={handleClose}
onAgree={() => {
removeItem(selected.id)
handleClose()
}}
/>
</Paper> </Paper>
) )
} }
......
src/app/views/Reconciliation/Sheet/Update.js
...@@ -74,7 +74,7 @@ const SimpleForm = (props) => { ...@@ -74,7 +74,7 @@ const SimpleForm = (props) => {
props.showLoading() props.showLoading()
const res = await updateSheetReconciliation({ const res = await updateSheetReconciliation({
...newValue, ...newValue,
type: '3',
status: 1, status: 1,
}) })
...@@ -82,7 +82,7 @@ const SimpleForm = (props) => { ...@@ -82,7 +82,7 @@ const SimpleForm = (props) => {
if (res.data.code == 200) { if (res.data.code == 200) {
history.push('/reconciliation/sheet') history.push('/reconciliation/sheet')
if (res.data.code == 200) { if (res.data.code == 200) {
toast.success('Tạo nhà cung cấp thiết bị thành công!', { toast.success('Cập nhật phiếu đối soát thành công!', {
theme: 'colored', theme: 'colored',
}) })
} }
......
src/app/views/Reconciliation/Sheet/View.js
...@@ -39,6 +39,7 @@ function CustomerView(props) { ...@@ -39,6 +39,7 @@ function CustomerView(props) {
provide, provide,
setProvide, setProvide,
listProvide, listProvide,
removeItem,
} = props } = props
const handleChange = (event) => { const handleChange = (event) => {
...@@ -165,6 +166,7 @@ function CustomerView(props) { ...@@ -165,6 +166,7 @@ function CustomerView(props) {
pageIndex={pageIndex} pageIndex={pageIndex}
setPageIndex={setPageIndex} setPageIndex={setPageIndex}
totalRecords={totalRecords} totalRecords={totalRecords}
removeItem={removeItem}
/> />
</div> </div>
</Fragment> </Fragment>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment