Skip to content

C
CmsPetrolPay
Commit 4e54ba3a by tdgiang
Options

update code

parent 1be034e5
Showing with 1810 additions and 0 deletions
src/app/views/Reconciliation/Sheet/Detail.js 0 → 100644
import React, { useState, useEffect } from 'react'
import {
ValidatorForm,
TextValidator,
SelectValidator,
} from 'react-material-ui-form-validator'
import {
Button,
Grid,
MenuItem,
FormControlLabel,
Checkbox,
Typography,
TextField,
Icon,
Card,
} from '@material-ui/core'
import { createFunction } from 'app/apis/Functions/function'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify'
import { Breadcrumb, SimpleCard } from 'app/components'
import { Link, useHistory, useLocation } from 'react-router-dom'
import { trimObject, encryString, convertDate } from 'app/config/Function'
import { connect } from 'react-redux'
import { KeyboardDatePicker } from '@material-ui/pickers'
import {
dropdownDepartment,
dropdownUserGroup,
dropdownStore,
} from 'app/apis/Functions/dropdown'
import PickerImage from 'app/components/Input/PickerImage'
import { createSupplier } from 'app/apis/Functions/supplier'
import { useTranslation } from 'react-i18next'
import useAuth from 'app/hooks/useAuth'
import ListTrans from './ListTrans/Index'
const SimpleForm = (props) => {
const [state, setState] = useState({})
const [listDrop, setListDrop] = useState([])
const [listAction, setListAction] = useState([])
const { user } = useAuth()
const { t } = useTranslation()
const history = useHistory()
const handleSubmit = async (event) => {
const newValue = trimObject(state)
props.showLoading()
const res = await createSupplier({
...newValue,
type: '3',
status: 1,
})
props.hideLoading()
if (res.data.code == 200) {
history.push('/reconciliation/sheet')
if (res.data.code == 200) {
toast.success('Tạo nhà cung cấp thiết bị thành công!', {
theme: 'colored',
})
}
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
const handleChange = (event) => {
event.persist()
setState({
...state,
[event.target.name]: event.target.value,
})
}
const { provider_code, provider_name, phone, email, address } = state
return (
<div className="m-sm-30">
<div className="mb-sm-30">
<div className="mb-sm-30">
<Breadcrumb
routeSegments={[
{
name: 'Cấu hình đối soát',
path: '/reconciliation/sheet',
},
{ name: 'Chi tiết' },
]}
/>
</div>
<SimpleCard>
<ValidatorForm onSubmit={handleSubmit} onError={() => null}>
<Grid container spacing={3} alignItems="center">
<Grid item lg={6} md={6} sm={12} xs={12}>
<Typography variant="h6">
Xem phiếu đối soát
</Typography>
</Grid>
<Grid
item
lg={6}
md={6}
sm={12}
xs={12}
container
justify={'flex-end'}
style={{
paddingRight: 30,
}}
>
<Link to="/reconciliation/sheet">
<Button
style={{
marginRight: 20,
}}
color="inherit"
variant="contained"
onClick={() => {}}
>
<span className="capitalize">
Quay lại
</span>
</Button>
</Link>
<Button
color="primary"
variant="contained"
type="submit"
>
<span className="capitalize">Đối soát</span>
</Button>
</Grid>
<Grid
item
lg={12}
md={12}
sm={12}
xs={12}
container
spacing={2}
>
<Grid item lg={4} md={4} sm={6} xs={6}>
<Card
style={{
padding: 10,
}}
elevation={6}
>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Mã phiếu đối soát
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 16,
marginBottom: 10,
}}
>
hêhh
</Typography>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Đối tác
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 16,
marginBottom: 10,
}}
>
hêhh
</Typography>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Người tạo
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 14,
}}
>
hêhh
</Typography>
</Card>
</Grid>
<Grid item lg={4} md={4} sm={6} xs={6}>
<Card
style={{
padding: 10,
}}
elevation={6}
>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Ngày tạo
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 16,
marginBottom: 10,
}}
>
hêhh
</Typography>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Ngày cập nhật
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 16,
marginBottom: 10,
}}
>
hêhh
</Typography>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Ngày đối soát
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 14,
}}
>
hêhh
</Typography>
</Card>
</Grid>
<Grid item lg={4} md={4} sm={6} xs={6}>
<Card
style={{
padding: 10,
}}
elevation={6}
>
<Typography
style={{
color: '#344054',
fontSize: 14,
}}
>
Ghi chú
</Typography>
<Typography
style={{
color: '#000000',
fontSize: 16,
height: 130,
}}
>
Phải có í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 bể!Phải có ít nhất một bồn
</Typography>
</Card>
</Grid>
</Grid>
<Grid
item
lg={12}
md={12}
sm={12}
xs={12}
container
spacing={2}
>
<ListTrans isDetail={true} />
</Grid>
</Grid>
</ValidatorForm>
</SimpleCard>
</div>
</div>
)
}
const mapStateToProps = (state) => {
return {}
}
export default connect(mapStateToProps, { showLoading, hideLoading })(
SimpleForm
)
src/app/views/Reconciliation/Sheet/Dialog/Dialog.js 0 → 100644
import React, { useState, useEffect } from 'react'
import { withStyles } from '@material-ui/core/styles'
import { Button, Tooltip } from '@material-ui/core'
import Dialog from '@material-ui/core/Dialog'
import MuiDialogTitle from '@material-ui/core/DialogTitle'
import MuiDialogContent from '@material-ui/core/DialogContent'
import MuiDialogActions from '@material-ui/core/DialogActions'
import IconButton from '@material-ui/core/IconButton'
import CloseIcon from '@material-ui/icons/Close'
import Typography from '@material-ui/core/Typography'
import CustomerList from './Index'
const styles = (theme) => ({
root: {
margin: 0,
padding: theme.spacing(2),
},
closeButton: {
position: 'absolute',
right: theme.spacing(1),
top: theme.spacing(1),
color: theme.palette.grey[500],
},
})
const DialogTitle = withStyles(styles)((props) => {
const { children, classes, onClose } = props
return (
<MuiDialogTitle disableTypography className={classes.root}>
<Typography variant="h6">{children}</Typography>
{onClose ? (
<IconButton
aria-label="Close"
className={classes.closeButton}
onClick={onClose}
>
<CloseIcon />
</IconButton>
) : null}
</MuiDialogTitle>
)
})
const DialogContent = withStyles((theme) => ({
root: {
padding: theme.spacing(2),
},
}))(MuiDialogContent)
const DialogActions = withStyles((theme) => ({
root: {
margin: 0,
padding: theme.spacing(1),
},
}))(MuiDialogActions)
const CustomizedDialogs = (props) => {
const { onSelectCustomer, cusomterSelect } = props
const [open, setOpen] = useState(false)
const handleClickOpen = () => {
setOpen(true)
}
const handleClose = () => {
setOpen(false)
// onSelectCustomer(null)
}
const customSelect = (item) => {
onSelectCustomer(item)
setOpen(false)
}
return (
<div style={{ marginRight: 10 }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<Button
onClick={handleClickOpen}
style={{
padding: 7,
width: 160,
marginLeft: 20,
}}
color="primary"
variant="contained"
>
Chọn giao dịch
</Button>
</div>
<Dialog
fullWidth
maxWidth="xl"
onClose={handleClose}
aria-labelledby="customized-dialog-title"
open={open}
>
<DialogTitle onClose={handleClose}>
Chọn giao dịch đối soát
</DialogTitle>
<DialogContent dividers>
<CustomerList
customSelect={customSelect}
handleClose={handleClose}
/>
</DialogContent>
</Dialog>
</div>
)
}
export default CustomizedDialogs
src/app/views/Reconciliation/Sheet/Dialog/Index.js 0 → 100644
import React, { useState, useEffect } from 'react'
import LogAuth from './View'
import { listTransReconciliation } from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify'
import useDebounce from 'app/hooks/useDebounce'
import { useTranslation } from 'react-i18next'
import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => {
const { customSelect, handleClose } = props
const [listSelected, setListSelected] = useState([])
const [txtSearch, setTxtSearch] = useState('')
const [applications, setApplications] = useState('')
const [pageIndex, setPageIndex] = useState(0)
const [pageSize] = useState(10)
const [totalRecords, setTotalRecord] = useState(0)
const history = useHistory()
const searchDebount = useDebounce(txtSearch, 1000)
const [startDate, setStartDate] = useState()
const [endDate, setEndDate] = useState()
const { t } = useTranslation()
const [data, setData] = useState([])
const [type, setType] = useState()
const [listType, setListType] = useState([])
const [merchant, setMerchant] = useState()
const [listMerchant, setListMerchant] = useState([])
const [store, setStore] = useState()
const [listStore, setListStore] = useState([])
useEffect(() => {
getDataMerchant()
}, [])
const changeDateRange = (start, end) => {
setStartDate(start)
setEndDate(end)
}
const getData = async (init) => {
props.showLoading()
let res
if (init) {
setPageIndex(0)
res = await listTransReconciliation({
page_no: 0,
page_size: pageSize,
date_from: startDate ? convertDate(startDate) : null,
date_to: endDate ? convertDate(endDate) : null,
product_code: null,
payment_gate_code: null,
statusReconciliation: 0,
type_payment: null,
})
} else {
res = await listTransReconciliation({
page_no: pageIndex + 1,
page_size: pageSize,
date_from: startDate ? convertDate(startDate) : null,
date_to: endDate ? convertDate(endDate) : null,
product_code: null,
payment_gate_code: null,
statusReconciliation: 0,
type_payment: null,
})
}
props.hideLoading()
if (res.data.code == 200 && res.data.data) {
console.log(' res.data.data', res.data.data)
const newList = res.data.data?.data?.map((e, i) => {
return { ...e, index: i + 1 + pageIndex * pageSize }
})
setData(newList)
setTotalRecord(res.data.data.total_elements)
} else if (res.data.code == 401) {
setTimeout(() => {
history.push('/')
}, 100)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
useEffect(() => {
getData(false)
}, [pageIndex])
useEffect(() => {
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',
})
}
}
const getDropdownStore = async (id) => {
const res = await dropdownStore(id)
if (res.data.code == 200 && res.data.data) {
console.log('res.data.data', res.data.data)
const newList = res.data.data.map((e) => {
return { ...e, name: e.store_name }
})
setListStore(newList)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
const onAdd = () => {
console.log('listSelected', listSelected)
}
return (
<LogAuth
data={data}
setTxtSearch={setTxtSearch}
pageIndex={pageIndex}
setPageIndex={setPageIndex}
totalRecords={totalRecords}
setApplications={setApplications}
applications={applications}
startDate={startDate}
changeDateRange={changeDateRange}
type={type}
setType={setType}
listType={listType}
merchant={merchant}
setMerchant={setMerchant}
listMerchant={listMerchant}
store={store}
setStore={setStore}
listStore={listStore}
customSelect={customSelect}
handleClose={handleClose}
listSelected={listSelected}
setListSelected={setListSelected}
onAdd={onAdd}
/>
)
}
const mapStateToProps = (state) => {
return {}
}
export default connect(mapStateToProps, { showLoading, hideLoading })(
ToolNotificate
)
src/app/views/Reconciliation/Sheet/Dialog/Table.js 0 → 100644
import React, { useState } from 'react'
import {
Paper,
Table,
TableBody,
TableCell,
TableHead,
TableContainer,
TablePagination,
TableRow,
IconButton,
MenuItem,
Tooltip,
Icon,
Checkbox,
} from '@material-ui/core'
import EditIcon from '@material-ui/icons/Edit'
import DeleteIcon from '@material-ui/icons/Delete'
import colors from 'app/assets/Color'
import useStyles from 'app/styles/Table'
import { Breadcrumb, SimpleCard } from 'app/components'
import DialogTransition from 'app/components/dialog/DialogTransition'
import { toPriceVnd } from 'app/config/Function'
const columns = [
{
id: 'index',
label: 'STT',
align: 'center',
minWidth: 80,
},
{
id: 'created_date',
label: 'Thời gian',
align: 'left',
minWidth: 90,
},
{
id: 'order_code',
label: 'Mã hoá đơn',
align: 'left',
minWidth: 170,
},
{
id: 'store_name',
label: 'Cây xăng',
align: 'left',
minWidth: 160,
},
{
id: 'type_payment',
label: 'Phương thức thanh toán',
align: 'left',
minWidth: 105,
},
{
id: 'price',
label: 'Số tiền',
align: 'left',
minWidth: 80,
isMonney: true,
},
{
id: 'commission',
label: 'Hoa hồng',
align: 'left',
minWidth: 80,
isMonney: true,
},
]
function TableList(props) {
const classes = useStyles()
const {
data,
handeChangeActive,
removeItem,
changeActive,
setChangeActive,
setPageIndex,
setPageSize,
pageIndex,
totalRecords,
customSelect,
listSelected,
setListSelected,
} = props
const [open, setOpen] = React.useState(false)
const [selected, setSelected] = useState({
name: '',
id: '',
title: '',
content: '',
})
const handleChangePage = (event, newPage) => {
setPageIndex(newPage)
}
const handleChangeRowsPerPage = (event) => {
setPageSize(event.target.value)
}
const handleClose = () => {
setOpen(false)
}
const onSelectAll = (event) => {
let newSelectedItemId
if (event.target.checked) {
newSelectedItemId = data.map((row) => row.id)
} else {
newSelectedItemId = []
}
setListSelected(newSelectedItemId)
}
const selectedOne = (value, id) => {
let newList
if (!value) {
newList = listSelected.filter((e) => e != id)
} else {
newList = listSelected.concat(id)
}
setListSelected(newList)
}
return (
<Paper className={classes.root}>
<TableContainer className={classes.container}>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
<TableCell
style={{
width: 40,
backgroundColor: colors.headerTable,
color: 'white',
}}
>
<Checkbox
onChange={onSelectAll}
checked={
listSelected.length === data.length
}
className={classes.checkbox}
disabled={
listSelected.length > 0 &&
listSelected.length < data.length
}
indeterminate={
listSelected.length > 0 &&
listSelected.length < data.length
}
color={'primary'}
/>
</TableCell>
{columns.map((column) => (
<TableCell
key={column.id}
align={'center'}
style={{
width: column.minWidth,
backgroundColor: colors.headerTable,
}}
>
{column.label}
</TableCell>
))}
</TableRow>
</TableHead>
<TableBody className={classes.columnTable}>
{data.map((row) => {
return (
<TableRow
hover
role="checkbox"
tabIndex={-1}
key={row.id}
>
<TableCell className={classes.border}>
<Checkbox
checked={listSelected.includes(
row.id
)}
onChange={(event) =>
selectedOne(
event.target.checked,
row.id
)
}
color={'primary'}
className={classes.checkbox}
/>
</TableCell>
{columns.map((column) => {
const data = row[column.id]
return (
<TableCell
key={column.id}
align={column.align}
style={{
textAlign:
column.id === 'index'
? 'center'
: typeof data ==
'string'
? 'left'
: 'right',
}}
>
{column.isMonney
? toPriceVnd(data)
: data}
</TableCell>
)
})}
</TableRow>
)
})}
</TableBody>
</Table>
</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>
)
}
export default TableList
src/app/views/Reconciliation/Sheet/Dialog/View.js 0 → 100644
import React, { Fragment, useState, useEffect } from 'react'
import {
TextField,
Icon,
Button,
StepLabel,
Step,
Stepper,
Grid,
FormControl,
InputLabel,
Select,
MenuItem,
Typography,
} from '@material-ui/core'
import Table from './Table'
import { Breadcrumb } from 'app/components'
import { Link } from 'react-router-dom'
import { Autocomplete, createFilterOptions } from '@material-ui/lab'
import DateRange from 'app/components/Input/DateHome'
function CustomerView(props) {
const [age, setAge] = React.useState('')
const {
data,
setTxtSearch,
changeActive,
setChangeActive,
handeChangeActive,
setPageIndex,
pageIndex,
totalRecords,
setApplications,
applications,
startDate,
changeDateRange,
type,
setType,
listType,
listMerchant,
setMerchant,
merchant,
store,
setStore,
listStore,
customSelect,
handleClose,
listSelected,
setListSelected,
onAdd,
} = props
const handleChange = (event) => {
setAge(event.target.value)
}
return (
<Fragment>
<Grid
style={{
padding: 10,
marginBottom: 20,
}}
//justify={'space-between'}
alignItems={'center'}
container
spacing={3}
>
<Grid item lg={2} md={2} sm={3} xs={3}>
<TextField
variant="outlined"
className="w-full"
label="Tìm kiếm"
onChange={(e) => {
const text = e.target.value
setTxtSearch(text)
}}
/>
</Grid>
<Grid item lg={2} md={2} sm={3} xs={3}>
<FormControl variant="outlined" fullWidth>
<InputLabel htmlFor="outlined-age-native-simple">
Phương thức thanh toán
</InputLabel>
<Select
label="Phương thức thanh toán"
value={type}
onChange={(e) => setType(e.target.value)}
inputProps={{
name: 'age',
id: 'outlined-age-native-simple',
}}
>
<MenuItem value="">
<em>Tất cả</em>
</MenuItem>
{[
{
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>
))}
</Select>
</FormControl>
</Grid>
<Grid item lg={2} md={2} 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={2} md={2} 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={2} md={2} sm={3} xs={3}>
<DateRange
date={startDate}
changeDateRange={changeDateRange}
/>
</Grid>
</Grid>
<Table
data={data}
changeActive={changeActive}
setChangeActive={setChangeActive}
handeChangeActive={handeChangeActive}
pageIndex={pageIndex}
setPageIndex={setPageIndex}
totalRecords={totalRecords}
customSelect={customSelect}
listSelected={listSelected}
setListSelected={setListSelected}
/>
<Grid
item
lg={12}
md={12}
sm={12}
xs={12}
container
justify={'flex-end'}
style={{
marginTop: 20,
}}
>
<Button
style={{
marginRight: 20,
width: 100,
}}
color="inherit"
variant="contained"
onClick={() => {
handleClose()
}}
>
<span className="capitalize">Huỷ</span>
</Button>
<Button
style={{
width: 100,
}}
color="primary"
variant="contained"
onClick={() => {
onAdd()
}}
>
<span className="capitalize">Lưu</span>
</Button>
</Grid>
</Fragment>
)
}
export default CustomerView
src/app/views/Reconciliation/Sheet/ListTrans/Index.js 0 → 100644
import React, { useState, useEffect } from 'react'
import LogAuth from './View'
import { listTransReconciliation } from 'app/apis/Functions/reconciliation'
import { useHistory } from 'react-router-dom'
import { toPriceVnd, convertDate } from 'app/config/Function'
import { connect } from 'react-redux'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify'
import useDebounce from 'app/hooks/useDebounce'
import { useTranslation } from 'react-i18next'
import { dropdownMerchant, dropdownStore } from 'app/apis/Functions/dropdown'
const ToolNotificate = (props) => {
const [txtSearch, setTxtSearch] = useState('')
const [applications, setApplications] = useState('')
const [pageIndex, setPageIndex] = useState(0)
const [pageSize] = useState(10)
const [totalRecords, setTotalRecord] = useState(0)
const history = useHistory()
const searchDebount = useDebounce(txtSearch, 1000)
const [startDate, setStartDate] = useState()
const [endDate, setEndDate] = useState()
const { t } = useTranslation()
const [data, setData] = useState([])
const [type, setType] = useState()
const [listType, setListType] = useState([])
const [merchant, setMerchant] = useState()
const [listMerchant, setListMerchant] = useState([])
const [store, setStore] = useState()
const [listStore, setListStore] = useState([])
useEffect(() => {
getDataMerchant()
}, [])
const changeDateRange = (start, end) => {
setStartDate(start)
setEndDate(end)
}
const getData = async (init) => {
props.showLoading()
let res
if (init) {
setPageIndex(0)
res = await listTransReconciliation({
page_no: 0,
page_size: pageSize,
date_from: startDate ? convertDate(startDate) : null,
date_to: endDate ? convertDate(endDate) : null,
product_code: null,
payment_gate_code: null,
statusReconciliation: 0,
type_payment: null,
})
} else {
res = await listTransReconciliation({
page_no: pageIndex + 1,
page_size: pageSize,
date_from: startDate ? convertDate(startDate) : null,
date_to: endDate ? convertDate(endDate) : null,
product_code: null,
payment_gate_code: null,
statusReconciliation: 0,
type_payment: null,
})
}
props.hideLoading()
if (res.data.code == 200 && res.data.data) {
console.log(' res.data.data', res.data.data)
const newList = res.data.data?.data?.map((e, i) => {
return { ...e, index: i + 1 + pageIndex * pageSize }
})
setData(newList)
setTotalRecord(res.data.data.total_elements)
} else if (res.data.code == 401) {
setTimeout(() => {
history.push('/')
}, 100)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
useEffect(() => {
getData(false)
}, [pageIndex])
useEffect(() => {
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',
})
}
}
const getDropdownStore = async (id) => {
const res = await dropdownStore(id)
if (res.data.code == 200 && res.data.data) {
console.log('res.data.data', res.data.data)
const newList = res.data.data.map((e) => {
return { ...e, name: e.store_name }
})
setListStore(newList)
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
return (
<LogAuth
data={data}
setTxtSearch={setTxtSearch}
pageIndex={pageIndex}
setPageIndex={setPageIndex}
totalRecords={totalRecords}
setApplications={setApplications}
applications={applications}
startDate={startDate}
changeDateRange={changeDateRange}
type={type}
setType={setType}
listType={listType}
merchant={merchant}
setMerchant={setMerchant}
listMerchant={listMerchant}
store={store}
setStore={setStore}
listStore={listStore}
isDetail={props.isDetail}
/>
)
}
const mapStateToProps = (state) => {
return {}
}
export default connect(mapStateToProps, { showLoading, hideLoading })(
ToolNotificate
)
src/app/views/Reconciliation/Sheet/ListTrans/Table.js 0 → 100644
import React, { useState } from 'react'
import {
Paper,
Table,
TableBody,
TableCell,
TableHead,
TableContainer,
TablePagination,
TableRow,
IconButton,
MenuItem,
Tooltip,
Icon,
} from '@material-ui/core'
import EditIcon from '@material-ui/icons/Edit'
import DeleteIcon from '@material-ui/icons/Delete'
import colors from 'app/assets/Color'
import useStyles from 'app/styles/Table'
import { Breadcrumb, SimpleCard } from 'app/components'
import DialogTransition from 'app/components/dialog/DialogTransition'
import { toPriceVnd } from 'app/config/Function'
const columns = [
{
id: 'index',
label: 'STT',
align: 'center',
minWidth: 80,
},
{
id: 'created_date',
label: 'Thời gian',
align: 'left',
minWidth: 90,
},
{
id: 'order_code',
label: 'Mã hoá đơn',
align: 'left',
minWidth: 170,
},
{
id: 'store_name',
label: 'Cây xăng',
align: 'left',
minWidth: 160,
},
{
id: 'type_payment',
label: 'Phương thức thanh toán',
align: 'left',
minWidth: 105,
},
{
id: 'price',
label: 'Số tiền',
align: 'left',
minWidth: 80,
isMonney: true,
},
{
id: 'commission',
label: 'Hoa hồng',
align: 'left',
minWidth: 80,
isMonney: true,
},
]
function TableList(props) {
const classes = useStyles()
const {
data,
handeChangeActive,
removeItem,
changeActive,
setChangeActive,
setPageIndex,
setPageSize,
pageIndex,
totalRecords,
isDetail,
} = props
const [open, setOpen] = React.useState(false)
const [selected, setSelected] = useState({
name: '',
id: '',
title: '',
content: '',
})
const handleChangePage = (event, newPage) => {
setPageIndex(newPage)
}
const handleChangeRowsPerPage = (event) => {
setPageSize(event.target.value)
}
const handleClose = () => {
setOpen(false)
}
return (
<Paper className={classes.root}>
<TableContainer className={classes.container}>
<Table stickyHeader aria-label="sticky table">
<TableHead>
<TableRow>
{columns.map((column) => (
<TableCell
key={column.id}
align={'center'}
style={{
width: column.minWidth,
backgroundColor: colors.headerTable,
}}
>
{column.label}
</TableCell>
))}
{!isDetail ? (
<TableCell
style={{
textAlign: 'center',
backgroundColor: colors.headerTable,
width: 60,
}}
></TableCell>
) : null}
</TableRow>
</TableHead>
<TableBody className={classes.columnTable}>
{data.map((row) => {
return (
<TableRow
hover
role="checkbox"
tabIndex={-1}
key={row.id}
>
{columns.map((column) => {
const data = row[column.id]
return (
<TableCell
key={column.id}
align={column.align}
style={{
textAlign:
column.id === 'index'
? 'center'
: typeof data ==
'string'
? 'left'
: 'right',
}}
>
{column.isMonney
? toPriceVnd(data)
: data}
</TableCell>
)
})}
{!isDetail ? (
<TableCell>
<Tooltip title="Xoá">
<IconButton
onClick={() => {
setSelected({
...row,
title: 'Xóa giao dịch trong phiếu đối soát',
content: `Bạn có muốn xóa giao dịch ${row.order_code} trong phiếu đối soát hay không?`,
})
setOpen(true)
}}
className={classes.button}
aria-label="Delete"
>
<Icon color="error">
cancel
</Icon>
</IconButton>
</Tooltip>
</TableCell>
) : null}
</TableRow>
)
})}
</TableBody>
</Table>
</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>
)
}
export default TableList
src/app/views/Reconciliation/Sheet/ListTrans/View.js 0 → 100644
import React, { Fragment, useState, useEffect } from 'react'
import {
TextField,
Icon,
Button,
StepLabel,
Step,
Stepper,
Grid,
FormControl,
InputLabel,
Select,
MenuItem,
Typography,
} from '@material-ui/core'
import Table from './Table'
import { Breadcrumb } from 'app/components'
import { Link } from 'react-router-dom'
import { Autocomplete, createFilterOptions } from '@material-ui/lab'
import DateRange from 'app/components/Input/DateHome'
import DialogTrans from '../Dialog/Dialog'
function CustomerView(props) {
const [age, setAge] = React.useState('')
const {
data,
setTxtSearch,
changeActive,
setChangeActive,
handeChangeActive,
setPageIndex,
pageIndex,
totalRecords,
setApplications,
applications,
startDate,
changeDateRange,
type,
setType,
listType,
listMerchant,
setMerchant,
merchant,
store,
setStore,
listStore,
isDetail,
} = props
const handleChange = (event) => {
setAge(event.target.value)
}
return (
<Fragment>
<Grid
style={{
padding: 10,
marginBottom: 10,
}}
//justify={'space-between'}
alignItems={'center'}
container
spacing={3}
>
{!isDetail ? (
<Grid
item
lg={6}
md={6}
sm={12}
xs={12}
style={{
display: 'flex',
}}
>
<TextField
label="Tìm mã giao dịch"
fullWidth
name="money"
variant="outlined"
onChange={(event) => {}}
/>
{/*
<Button
// onClick={onAdd}
variant="contained"
color="default"
style={{
marginLeft: 20,
width: 200,
}}
>
Chọn giao dịch
</Button> */}
<DialogTrans />
</Grid>
) : null}
<Grid
item
lg={6}
md={6}
sm={12}
xs={12}
style={{
justifyContent: !isDetail ? 'center' : 'start',
alignItems: 'center',
display: 'flex',
}}
>
<Typography
style={{
textAlign: 'center',
fontSize: 20,
fontWeight: 'bold',
color: '#027A48',
}}
>
Số giao dịch: 20; Số hoa hồng: 5.300.000 VNĐ
</Typography>
</Grid>
</Grid>
<Table
data={data}
changeActive={changeActive}
setChangeActive={setChangeActive}
handeChangeActive={handeChangeActive}
pageIndex={pageIndex}
setPageIndex={setPageIndex}
totalRecords={totalRecords}
isDetail={isDetail}
/>
</Fragment>
)
}
export default CustomerView
src/app/views/Reconciliation/Sheet/Update.js 0 → 100644
import React, { useState, useEffect } from 'react'
import {
ValidatorForm,
TextValidator,
SelectValidator,
} from 'react-material-ui-form-validator'
import {
Button,
Grid,
MenuItem,
FormControlLabel,
Checkbox,
Typography,
TextField,
Icon,
} from '@material-ui/core'
import { createFunction } from 'app/apis/Functions/function'
import { showLoading, hideLoading } from 'app/redux/actions/loadingAction'
import { toast } from 'react-toastify'
import { Breadcrumb, SimpleCard } from 'app/components'
import { Link, useHistory, useLocation } from 'react-router-dom'
import { trimObject, encryString, convertDate } from 'app/config/Function'
import { connect } from 'react-redux'
import { KeyboardDatePicker } from '@material-ui/pickers'
import {
dropdownDepartment,
dropdownUserGroup,
dropdownStore,
} from 'app/apis/Functions/dropdown'
import PickerImage from 'app/components/Input/PickerImage'
import { createSupplier } from 'app/apis/Functions/supplier'
import { useTranslation } from 'react-i18next'
import useAuth from 'app/hooks/useAuth'
import ListTrans from './ListTrans/Index'
const SimpleForm = (props) => {
const [state, setState] = useState({})
const [listDrop, setListDrop] = useState([])
const [listAction, setListAction] = useState([])
const { user } = useAuth()
const { t } = useTranslation()
const history = useHistory()
const handleSubmit = async (event) => {
const newValue = trimObject(state)
props.showLoading()
const res = await createSupplier({
...newValue,
type: '3',
status: 1,
})
props.hideLoading()
if (res.data.code == 200) {
history.push('/reconciliation/sheet')
if (res.data.code == 200) {
toast.success('Tạo nhà cung cấp thiết bị thành công!', {
theme: 'colored',
})
}
} else {
toast.error(t(res.data.error), {
theme: 'colored',
})
}
}
const handleChange = (event) => {
event.persist()
setState({
...state,
[event.target.name]: event.target.value,
})
}
const { provider_code, provider_name, phone, email, address } = state
return (
<div className="m-sm-30">
<div className="mb-sm-30">
<div className="mb-sm-30">
<Breadcrumb
routeSegments={[
{
name: 'Cấu hình đối soát',
path: '/reconciliation/sheet',
},
{ name: 'Cập nhật' },
]}
/>
</div>
<SimpleCard>
<ValidatorForm onSubmit={handleSubmit} onError={() => null}>
<Grid container spacing={3} alignItems="center">
<Grid item lg={6} md={6} sm={12} xs={12}>
<Typography variant="h6">
Sửa phiếu đối soát
</Typography>
</Grid>
<Grid
item
lg={6}
md={6}
sm={12}
xs={12}
container
justify={'flex-end'}
>
<Link to="/reconciliation/sheet">
<Button
style={{
marginRight: 20,
}}
color="inherit"
variant="contained"
onClick={() => {}}
>
<span className="capitalize">
Quay lại
</span>
</Button>
</Link>
<Button
color="primary"
variant="contained"
type="submit"
>
<span className="capitalize">Cập nhật</span>
</Button>
</Grid>
<Grid item lg={6} md={6} sm={12} xs={12}>
<TextValidator
variant="outlined"
className="mb-4 w-full"
label="Mã phiếu đối soát *"
onChange={handleChange}
disabled={true}
type="text"
name="provider_code"
value={provider_code || ''}
validators={['required']}
errorMessages={[
'Không được để trống trường này',
]}
/>
</Grid>
<Grid item lg={6} md={6} sm={12} xs={12}>
<TextValidator
variant="outlined"
className="mb-4 w-full"
label="Đối tác *"
disabled={true}
onChange={handleChange}
type="text"
name="provider_code"
value={provider_code || ''}
validators={['required']}
errorMessages={[
'Không được để trống trường này',
]}
/>
</Grid>
<Grid item lg={12} md={12} sm={12} xs={12}>
<TextValidator
variant="outlined"
className="mb-4 w-full"
label="Ghi chú"
onChange={handleChange}
type="text"
name="address"
value={address || ''}
/>
</Grid>
<Grid
item
lg={12}
md={12}
sm={12}
xs={12}
container
spacing={2}
>
<ListTrans isDetail={false} />
</Grid>
</Grid>
</ValidatorForm>
</SimpleCard>
</div>
</div>
)
}
const mapStateToProps = (state) => {
return {}
}
export default connect(mapStateToProps, { showLoading, hideLoading })(
SimpleForm
)
src/app/views/Reconciliation/router.js
...@@ -18,6 +18,14 @@ const ReconciliationRouters = [ ...@@ -18,6 +18,14 @@ const ReconciliationRouters = [
component: React.lazy(() => import('./Setting/Index')), component: React.lazy(() => import('./Setting/Index')),
}, },
{ {
path: '/reconciliation/sheet/update',
component: React.lazy(() => import('./Sheet/Update')),
},
{
path: '/reconciliation/sheet/detail',
component: React.lazy(() => import('./Sheet/Detail')),
},
{
path: '/reconciliation/sheet', path: '/reconciliation/sheet',
component: React.lazy(() => import('./Sheet/Index')), component: React.lazy(() => import('./Sheet/Index')),
}, },
......
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