Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
E
ESYTD
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Analytics
Analytics
CI / CD
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Дияр Амангельды
ESYTD
Commits
1ca4d846
Commit
1ca4d846
authored
Jul 27, 2024
by
Merekeyev Dias
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
added table reset after changing the page
parent
b5ba8c86
Changes
8
Show whitespace changes
Inline
Side-by-side
Showing
8 changed files
with
72 additions
and
31 deletions
+72
-31
src/components/Header/Header.tsx
src/components/Header/Header.tsx
+1
-1
src/features/api/apiSlice.tsx
src/features/api/apiSlice.tsx
+0
-13
src/features/pagination/reqPagination.ts
src/features/pagination/reqPagination.ts
+8
-2
src/pages/HomePage/HomePage.tsx
src/pages/HomePage/HomePage.tsx
+10
-2
src/pages/HomePage/Homepage.css
src/pages/HomePage/Homepage.css
+1
-1
src/pages/RequestPage/Columns.tsx
src/pages/RequestPage/Columns.tsx
+4
-4
src/pages/RequestPage/RequestPage.css
src/pages/RequestPage/RequestPage.css
+1
-1
src/pages/RequestPage/RequestPage.tsx
src/pages/RequestPage/RequestPage.tsx
+47
-7
No files found.
src/components/Header/Header.tsx
View file @
1ca4d846
...
...
@@ -43,7 +43,7 @@ const Header: React.FC = () => {
}
}
placement=
'left'
className=
'custom-drawer'
title=
"ЕСУТД
jh
"
title=
"ЕСУТД"
>
<
Menu
theme=
'dark'
...
...
src/features/api/apiSlice.tsx
View file @
1ca4d846
import
{
createApi
,
fetchBaseQuery
}
from
'
@reduxjs/toolkit/query/react
'
;
import
{
RootState
}
from
'
../../main
'
;
interface
Organization
{
id
:
number
;
bin
:
string
;
code
:
string
;
name
:
string
;
status
:
number
;
created
:
string
;
deleted
:
null
;
login
:
string
;
password
:
string
;
host
:
string
;
}
export
const
apiSlice
=
createApi
({
reducerPath
:
'
api
'
,
baseQuery
:
fetchBaseQuery
({
...
...
src/features/pagination/reqPagination.ts
View file @
1ca4d846
import
{
createSlice
}
from
"
@reduxjs/toolkit
"
;
const
initialState
=
{
interface
InitialState
{
currentPage
:
number
,
totalReqNumber
:
number
,
REQ_NUMBER_PER_PAGE
:
number
,
}
const
initialState
:
InitialState
=
{
currentPage
:
1
,
totalReqNumber
:
0
,
REQ_NUMBER_PER_PAGE
:
1
0
REQ_NUMBER_PER_PAGE
:
1
2
}
const
reqPaginationSlice
=
createSlice
({
...
...
src/pages/HomePage/HomePage.tsx
View file @
1ca4d846
import
React
,
{
useEffect
}
from
'
react
'
;
import
React
,
{
createRef
,
useEffect
}
from
'
react
'
;
import
{
useNavigate
}
from
'
react-router
'
;
import
{
useSelector
,
useDispatch
}
from
'
react-redux
'
;
import
{
Button
,
Pagination
,
Spin
,
Table
}
from
'
antd
'
;
import
{
useGetOrganizationsQuery
}
from
'
../../features/api/organizationApiSlice
'
;
import
{
setCurrentPage
,
setTotalOrgNumber
}
from
'
../../features/pagination/mainPagination
'
;
import
{
DataType
,
columns
}
from
'
./Columns
'
;
import
{
TableRef
}
from
'
antd/es/table
'
;
import
'
./Homepage.css
'
;
const
HomePage
:
React
.
FC
=
()
=>
{
const
navigate
=
useNavigate
();
const
dispatch
=
useDispatch
();
const
tableRef
=
createRef
<
TableRef
>
();
const
totalOrgNumber
=
useSelector
((
state
:
any
)
=>
state
.
mainPagination
.
totalOrgNumber
);
const
currentPage
=
useSelector
((
state
:
any
)
=>
state
.
mainPagination
.
currentPage
);
const
ORG_NUMBER_PER_PAGE
=
useSelector
((
state
:
any
)
=>
state
.
mainPagination
.
ORG_NUMBER_PER_PAGE
);
...
...
@@ -19,6 +21,7 @@ const HomePage: React.FC = () => {
};
const
handlePaginationChange
=
(
page
:
number
)
=>
{
tableRef
.
current
?.
nativeElement
.
scrollIntoView
({
behavior
:
'
smooth
'
});
dispatch
(
setCurrentPage
(
page
));
};
...
...
@@ -41,7 +44,12 @@ const HomePage: React.FC = () => {
if
(
isLoading
)
{
table
=
<
Spin
/>
}
else
if
(
isSuccess
)
{
table
=
<
Table
dataSource=
{
paginatedData
(
orgs
)
}
columns=
{
columns
}
pagination=
{
false
}
rowKey=
"id"
/>
table
=
<
Table
dataSource=
{
paginatedData
(
orgs
)
}
columns=
{
columns
}
pagination=
{
false
}
rowKey=
"id"
ref=
{
tableRef
}
/>
}
else
if
(
isError
)
{
console
.
log
(
error
)
table
=
<
div
>
{
error
.
toString
()
}
</
div
>
...
...
src/pages/HomePage/Homepage.css
View file @
1ca4d846
...
...
@@ -45,7 +45,7 @@
.data
{
flex
:
1
;
overflow-y
:
auto
;
margin-bottom
:
75
px
;
padding-bottom
:
20
px
;
}
.data-table
{
...
...
src/pages/RequestPage/Columns.tsx
View file @
1ca4d846
...
...
@@ -89,7 +89,7 @@ export const columns: TableProps<DataType>['columns'] = [
}
]
export
const
ResendColumn
:
React
.
FC
<
{
data
:
DataType
}
>
=
()
=>
{
export
const
ResendColumn
:
React
.
FC
<
{
data
:
DataType
}
>
=
(
{
data
}
)
=>
{
const
[
open
,
setOpen
]
=
useState
<
boolean
>
(
false
);
const
showResendModal
=
()
=>
{
...
...
@@ -112,10 +112,10 @@ export const ResendColumn: React.FC<{ data: DataType }> = () => {
return
(
<
Space
>
<
Button
onClick=
{
showResendModal
}
>
П
</
Button
>
<
Button
onClick=
{
showResendModal
}
>
П
ереотправить
</
Button
>
<
Modal
open=
{
open
}
title=
{
`Вы уверены, что хотите переотправить?`
}
title=
{
`Вы уверены, что хотите переотправить
запрос с id ${data.id}
?`
}
onCancel=
{
handleResendModalCancel
}
onOk=
{
handleResendModalOk
}
>
...
...
src/pages/RequestPage/RequestPage.css
View file @
1ca4d846
.filter
{
margin
:
1rem
1rem
2
rem
;
margin
:
1rem
1rem
1
rem
;
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
...
...
src/pages/RequestPage/RequestPage.tsx
View file @
1ca4d846
import
React
,
{
useEffect
}
from
'
react
'
;
import
React
,
{
useEffect
,
useState
,
createRef
}
from
'
react
'
;
import
dayjs
from
'
dayjs
'
;
// import isBetween from 'dayjs/plugin/isBetween';
// import customParseFormat from "dayjs/plugin/customParseFormat";
import
{
DatePicker
,
Select
,
Button
,
Pagination
,
Spin
,
Table
}
from
'
antd
'
;
import
{
useDispatch
,
useSelector
}
from
'
react-redux
'
;
import
{
columns
,
DataType
}
from
'
./Columns
'
;
import
{
useGetRequestsQuery
}
from
'
../../features/api/requestApiSlice
'
;
import
{
setCurrentPage
,
setTotalReqNumber
}
from
'
../../features/pagination/reqPagination
'
;
import
'
./RequestPage.css
'
;
import
{
TableRef
}
from
'
antd/es/table
'
;
const
dateFormat
=
'
YYYY/MM/DD
'
;
const
RequestPage
:
React
.
FC
=
()
=>
{
const
dispatch
=
useDispatch
();
const
tableRef
=
createRef
<
TableRef
>
();
const
totalReqNumber
=
useSelector
((
state
:
any
)
=>
state
.
reqPagination
.
totalReqNumber
);
const
currentPage
=
useSelector
((
state
:
any
)
=>
state
.
reqPagination
.
currentPage
);
const
REQ_NUMBER_PER_PAGE
=
useSelector
((
state
:
any
)
=>
state
.
reqPagination
.
REQ_NUMBER_PER_PAGE
);
const
[
startDate
,
setStartDate
]
=
useState
<
Date
>
();
const
[
endDate
,
setEndDate
]
=
useState
<
Date
>
();
const
[
method
,
setMethod
]
=
useState
(
''
);
const
[
filteredData
,
setFilteredData
]
=
useState
<
Request
[]
>
([]);
const
handlePaginationChange
=
(
page
:
number
)
=>
{
tableRef
.
current
?.
nativeElement
.
scrollIntoView
({
behavior
:
'
smooth
'
});
dispatch
(
setCurrentPage
(
page
));
};
...
...
@@ -25,6 +35,26 @@ const RequestPage: React.FC = () => {
return
dataSource
.
slice
(
startIndex
,
endIndex
);
};
const
filterByDate
=
()
=>
{
if
(
!
startDate
||
!
endDate
)
return
;
const
filtered
=
reqs
.
list
.
filter
((
req
)
=>
{
const
sendDate
=
dayjs
(
req
.
sendDate
,
dateFormat
);
});
console
.
log
(
filtered
);
// setFilteredData(filtered);
dispatch
(
setTotalReqNumber
(
filtered
.
length
));
};
const
onSelectStartDate
=
(
dateString
:
any
)
=>
{
setStartDate
(
dateString
);
}
const
onSelectEndDate
=
(
dateString
:
any
)
=>
{
setEndDate
(
dateString
);
}
const
{
data
:
reqs
=
{
list
:
[]
},
isLoading
,
...
...
@@ -33,8 +63,6 @@ const RequestPage: React.FC = () => {
error
}
=
useGetRequestsQuery
();
console
.
log
(
reqs
)
let
table
;
if
(
isLoading
)
{
...
...
@@ -44,6 +72,8 @@ const RequestPage: React.FC = () => {
dataSource=
{
paginatedData
(
reqs
.
list
)
}
columns=
{
columns
}
pagination=
{
false
}
rowKey=
"id"
ref=
{
tableRef
}
/>;
}
else
if
(
isError
)
{
console
.
log
(
error
);
...
...
@@ -61,15 +91,24 @@ const RequestPage: React.FC = () => {
<
div
className=
"filter"
>
<
div
className=
"fields"
>
<
div
className=
"dates"
>
<
DatePicker
defaultValue=
{
dayjs
(
'
2023/09/24
'
,
dateFormat
)
}
format=
{
dateFormat
}
style=
{
{
marginRight
:
14
}
}
/>
<
DatePicker
defaultValue=
{
dayjs
(
'
2023/09/24
'
,
dateFormat
)
}
format=
{
dateFormat
}
/>
<
DatePicker
onChange=
{
onSelectStartDate
}
defaultValue=
{
dayjs
(
'
2024/07/11
'
,
dateFormat
)
}
format=
{
dateFormat
}
style=
{
{
marginRight
:
14
}
}
/>
<
DatePicker
onChange=
{
onSelectEndDate
}
defaultValue=
{
dayjs
(
'
2024/07/11
'
,
dateFormat
)
}
format=
{
dateFormat
}
/>
</
div
>
<
div
className=
"category"
>
<
Select
placeholder=
"Не выбрано"
style=
{
{
width
:
270
}
}
options=
{
[]
}
/>
<
Select
placeholder=
"Не выбрано"
style=
{
{
width
:
270
}
}
options=
{
[
{
value
:
"
contract
"
,
label
:
"
contract
"
},
{
value
:
"
dictionary
"
,
label
:
"
dictionary
"
}
]
}
/>
</
div
>
</
div
>
<
Button
type=
'primary'
>
Применить
</
Button
>
<
Button
onClick=
{
filterByDate
}
type=
'primary'
>
Применить
</
Button
>
</
div
>
<
div
className=
"data"
>
{
table
}
...
...
@@ -81,6 +120,7 @@ const RequestPage: React.FC = () => {
pageSize=
{
REQ_NUMBER_PER_PAGE
}
total=
{
totalReqNumber
}
onChange=
{
handlePaginationChange
}
hideOnSinglePage=
{
true
}
/>
</
div
>
</
div
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment