diff --git a/src/pages/PartnerСategories/PartnerСategories.jsx b/src/pages/PartnerСategories/PartnerСategories.jsx
index 8799a793..a274d008 100644
--- a/src/pages/PartnerСategories/PartnerСategories.jsx
+++ b/src/pages/PartnerСategories/PartnerСategories.jsx
@@ -49,7 +49,7 @@ export const PartnerCategories = () => {
const COLUMNS = [
{
- label: "Аватар",
+ label: "",
renderCell: (item) => (
{
},
{
label: "ФИО",
- renderCell: (item) => item?.employee.fio,
+ renderCell: (item) =>
+
@@ -105,7 +108,7 @@ export const PartnerCategories = () => {
const pagination = usePagination(data, {
state: {
page: 0,
- size: 5
+ size: 10
}
});
@@ -259,6 +262,7 @@ export const PartnerCategories = () => {
id="search"
type="text"
value={search}
+ placeholder="Поиск по сотрудникам"
onChange={handleSearch}
/>
@@ -270,26 +274,52 @@ export const PartnerCategories = () => {
pagination={pagination}
/>
-
- Total Pages: {pagination.state.getTotalPages(data.nodes)}
-
-
+
- Page:{" "}
{pagination.state.getPages(data.nodes).map((_, index) => (
))}
+
>
) : (
diff --git a/src/pages/PartnerСategories/partnerСategories.scss b/src/pages/PartnerСategories/partnerСategories.scss
index e7d2dd26..1568f33d 100644
--- a/src/pages/PartnerСategories/partnerСategories.scss
+++ b/src/pages/PartnerСategories/partnerСategories.scss
@@ -13,10 +13,13 @@
&__items {
display: flex;
- gap: 10px;
flex-wrap: wrap;
justify-content: center;
+ background: white;
+ padding: 20px 0 30px;
+ border-radius: 7px;
}
+
&__empty {
font-size: 18px;
font-weight: 500;
@@ -161,8 +164,18 @@
display: flex;
width: 100%;
gap: 10px;
- font-size: 18px;
align-items: center;
+ padding: 0 18px 35px;
+ margin-bottom: 0;
+ font-size: 16px;
+
+ input {
+ background: #F0F2F5;
+ outline: none;
+ border-radius: 6px;
+ padding: 6px;
+ border: none;
+ }
}
&__avatar {
@@ -175,20 +188,85 @@
color: black;
font-size: 16px;
align-items: center;
+
+ .img__wrapper {
+ width: 22px;
+ height: 22px;
+ border-radius: 50px;
+ background: #D9D7D7;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ img {
+ width: 14px;
+ }
+ }
}
&__pagination {
width: 100%;
display: flex;
- justify-content: space-between;
- font-size: 16px;
+ font-size: 14px;
align-items: center;
+ padding: 39px 34px 0;
+ column-gap: 12px;
+
+ button {
+ font-size: 14px;
+ width: 32px;
+ border-radius: 5px;
+ height: 32px;
+ color: #2E3A59;
+ }
+
+ .switch {
+ border: none;
+ background: #F0F2F5;
+ font-weight: 600;
+ }
+
+ .disable {
+ opacity: 0.7;
+ }
}
&__pages {
display: flex;
- column-gap: 5px;
- align-items: center;
+ column-gap: 4px;
+ color: black;
+ background: white;
+
+ .page {
+ border: 1px solid #E8ECF8;
+ background: none;
+
+ &--active {
+ border: none;
+ background: #9DA65D;
+ color: white;
+ }
+ }
+ }
+ }
+
+ table {
+ th {
+ border-top: 0;
+ border-bottom: 1px solid #EDEDED;
+ color: #1458DD;
+ font-size: 14px;
+ font-weight: 700;
+ }
+
+ td {
+ border-top: 0;
+ border-bottom: 1px solid #EDEDED;
+ color: #2E3A59;
+
+ p {
+ font-weight: 500;
+ }
}
}
}