master
mahdi andalib 3 years ago
parent 1315307be2
commit 1bcaa5b6a7
  1. 14
      src/components/ReactTable5/BasicTable.js
  2. 44
      src/components/ReactTable5/Buttons.js
  3. 13
      src/components/ReactTable5/COLUMNS.js
  4. 16
      src/components/ReactTable5/ColumnSearch.js
  5. 51
      src/components/ReactTable5/DropDown.js
  6. 43
      src/components/ReactTable5/EditButtons.js
  7. 58
      src/components/ReactTable5/FilterFileType.js
  8. 19
      src/components/ReactTable5/GoToPage.js
  9. 325
      src/components/ReactTable5/MOCK_DATA.json
  10. 35
      src/components/ReactTable5/OrderLevel.js
  11. 56
      src/components/ReactTable5/OrderStatus.js
  12. 61
      src/components/ReactTable5/Pagination.js
  13. 57
      src/components/ReactTable5/SelectColumnFilter.js
  14. 56
      src/components/ReactTable5/SelectColumnFilter2.js
  15. 39
      src/components/ReactTable5/Settings.js
  16. 31
      src/components/ReactTable5/ShowMoreRows.js
  17. 40
      src/components/ReactTable5/SliderColumnFilter.js
  18. 66
      src/components/ReactTable5/Tabbar.js
  19. 47
      src/components/ReactTable5/ToggleColumns.js
  20. 34
      src/components/ReactTable5/ViewEdit.js
  21. 6
      src/components/ReactTable5/arrow-icon.svg
  22. 4
      src/components/ReactTable5/black-arrow-left.svg
  23. 4
      src/components/ReactTable5/blue-arrow.svg
  24. 12
      src/components/ReactTable5/double-left-arrow.svg
  25. 6
      src/components/ReactTable5/edit.svg
  26. 3
      src/components/ReactTable5/filter.svg
  27. 8
      src/components/ReactTable5/images/ai.svg
  28. 10
      src/components/ReactTable5/images/folder-open.svg
  29. 8
      src/components/ReactTable5/images/image1.svg
  30. 8
      src/components/ReactTable5/images/image2.svg
  31. 8
      src/components/ReactTable5/images/image3.svg
  32. 8
      src/components/ReactTable5/images/image4.svg
  33. 3
      src/components/ReactTable5/images/xls.svg
  34. 8
      src/components/ReactTable5/left-arrow.svg
  35. 10
      src/components/ReactTable5/more2.svg
  36. 6
      src/components/ReactTable5/plus.svg
  37. 6
      src/components/ReactTable5/right-arrow.svg
  38. 14
      src/components/ReactTable5/settings.svg

@ -204,7 +204,7 @@ const BasicTable = ({ addTab, activeTab }) => {
{/* table LIST */}
{activeTab === 0 ? (
<>
{activeList === true && (
{activeList === false && (
// table
<table
{...getTableProps()}
@ -262,7 +262,6 @@ const BasicTable = ({ addTab, activeTab }) => {
addTab={addTab}
row={row.original}
/>
{/* {console.log(row.original)} */}
</td>
</tr>
) : null}
@ -273,7 +272,7 @@ const BasicTable = ({ addTab, activeTab }) => {
</table>
)}
{/* GRID LIST */}
{activeList === false && (
{activeList === true && (
<div
{...getTableBodyProps()}
className="flex flex-row flex-wrap gap-4 items-center justify-center"
@ -285,13 +284,16 @@ const BasicTable = ({ addTab, activeTab }) => {
{...row.getRowProps()}
className={`flex flex-col items-stretch px-3 py-2 rounded-md w-52 relative ${
chekedItems.includes(row.original.id)
? "bg-blue-200"
: "bg-blue-100"
? "bg-[#ddd]"
: "bg-[#F3F3F3]"
}`}
key={idx}
// onClick={() => toggelChekedItems(row.original.id)}
>
<div onClick={() => toggelChekedItems(row.original.id)}>
<div
className="absolute left-3"
onClick={() => toggelChekedItems(row.original.id)}
>
{columns[0].Cell({ value: row.id })}
</div>
<img

@ -1,44 +0,0 @@
import { useState } from "react";
import arrowIcon from "./arrow-icon.svg";
import more from "./more2.svg";
import edit from "./edit.svg";
import DropDown from "./DropDown";
export const Buttons = ({ row, addTab }) => {
const [activeDetails, setActiveDetails] = useState(null);
return (
<div className="flex flex-row items-center justify-end ">
<div
className=""
onClick={() => {
setActiveDetails(!activeDetails);
}}
>
<button
className="mx-1 flex flex-row items-center justify-around p-2 rounded border border-gray-300"
{...row.getToggleRowExpandedProps()}
>
جزئیات
<img
src={arrowIcon}
alt=""
className={`mx-1 w-3 cursor-pointer mr-2 transition-all duration-500 ${
activeDetails ? "rotate-60" : "rotate-90"
}`}
/>
</button>
</div>
<div
className="mx-1 p-2 rounded border border-gray-300 cursor-pointer"
onClick={() => {
addTab({ name: row.original.name, id: row.original.id });
}}
>
<img src={edit} alt="" className="w-4" />
</div>
{/* <img src={more} alt="" className="w-5 cursor-pointer" /> */}
<DropDown />
</div>
);
};

@ -3,6 +3,8 @@ import { format } from "date-fns";
import { SelectColumnFilter } from "../ReactTable5/BasicTable";
import { Checkbox } from "./Checkbox";
import ViewEdit from "./ViewEdit";
import { FileType } from "./FileType";
export const COLUMNS = ({ toggelChekedItems, refChekedItems }) => [
@ -23,24 +25,25 @@ export const COLUMNS = ({ toggelChekedItems, refChekedItems }) => [
{
Header: "نام فایل",
accessor: "fileName",
// className: "bg-yellow-500",
},
{
Header: "نوع فایل",
accessor: "fileType",
Cell: FileType,
Filter: SelectColumnFilter, // new
// className: "bg-red-500 ",
},
{
Header: "سایز فایل",
accessor: "fileSize",
// className: "bg-blue-500 ",
},
{
Header: "تاریخ فایل",
accessor: "fileDate",
// className: "bg-green-500 ",
},
{
Header: "ویرایش نمایش",
accessor: "edit",
Cell: ViewEdit,
// Cell: ({ row }) => Buttons({ row, addTab }),
},
];

@ -1,16 +0,0 @@
import React, { useState } from "react";
export const ColumnSearch = ({ column }) => {
const { filterValue, setFilter } = column;
return (
<div className="flex flex-row items-center ">
<input
value={filterValue || ""}
onChange={(e) => setFilter(e.target.value)}
className={`w-8/12 text-xs text-blue-400 rounded focus:outline-none border p-1 focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20`}
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }}
/>
</div>
);
};

@ -1,51 +0,0 @@
import React from "react";
import more from "./more2.svg";
export const DropDown = ({}) => {
return (
<div>
<button
className=""
id="dropdownButton"
data-dropdown-toggle="dropdown"
type="button"
>
<img src={more} alt="" className={`cursor-pointer w-5`} />
</button>
<div
style={{ backgroundColor: "#65A9FF" }}
id="dropdown"
className="hidden z-10 text-xs list-none rounded divide-y divide-gray-100 shadow"
>
<ul className="" aria-labelledby="dropdownButton">
<li>
<a
href="#"
className="block p-3 text-xs text-white hover:bg-blue-600 hover:rounded"
>
ایتم شماره1
</a>
</li>
<li>
<a
href="#"
className="block p-3 text-xs text-white hover:bg-blue-600 hover:rounded"
>
ایتم شماره1
</a>
</li>
<li>
<a
href="#"
className="block p-3 text-xs text-white hover:bg-blue-600 hover:rounded"
>
ایتم شماره1
</a>
</li>
</ul>
</div>
</div>
);
};
export default DropDown;

@ -1,43 +0,0 @@
import React, { useState } from "react";
import Table from "./BasicTable";
import DropDown from "./DropDown";
import filter from "./filter.svg";
import plus from "./plus.svg";
export function EditButtons({ setFiltering, filtering, addTab }) {
const [selectedFilterRow, setSelectedFilterRow] = useState(filtering);
return (
<div className="flex flex-row items-center justify-end">
{/* add new row */}
<button
className="mx-1 flex flex-row items-center p-2 text-xs text-white rounded border-b-2 border-blue-600"
style={{ backgroundColor: "#65A9FF" }}
onClick={() => {
console.log("new!!!");
addTab({ id: "new", name: "ردیف جدید" });
}}
>
ثبت جدید
<img src={plus} alt="" className={`cursor-pointer w-2 mr-1 `} />
</button>
{/* filter */}
<img
src={filter}
alt=""
className={`mx-1 p-2 rounded border border-blue-300 cursor-pointer w-8
${selectedFilterRow ? "border" : "border-0"}`}
onClick={() => {
setFiltering(!selectedFilterRow);
setSelectedFilterRow(!selectedFilterRow);
}}
/>
{/* dropDown */}
<DropDown />
</div>
);
}
EditButtons.defaultProps = {};

@ -1,58 +0,0 @@
import React from "react";
export const FilterFileType = ({
column: { filterValue, setFilter, preFilteredRows, id, render },
}) => {
const options = React.useMemo(() => {
const options = new Set();
preFilteredRows.forEach((row) => {
options.add(row.values[id]);
});
return [...options.values()];
}, [id, preFilteredRows]);
return (
<select
className="text-xs flex flex-row items-start justify-start p-1 text-blue-400 rounded focus:outline-none border focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }}
name={id}
id={id}
value={filterValue}
onChange={(e) => {
setFilter(e.target.value || undefined);
}}
>
<option
className="text-white"
value=""
style={{ backgroundColor: "#65A9FF" }}
>
همه
</option>
{options.map((option, i) => (
<option
key={i}
value={option}
className="text-right text-white px-2"
style={{ backgroundColor: "#65A9FF" }}
>
{(() => {
if (option === 1) {
return "JPG";
} else if (option === 2) {
return "PNG";
} else if (option === 3) {
return "PDF";
} else if (option === 4) {
return "CSV";
} else if (option === 5) {
return "PPT";
} else {
return "MP4";
}
})()}{" "}
</option>
))}
</select>
);
};

@ -1,19 +0,0 @@
import React from "react";
export const GoToPage = ({ pageIndex, gotoPage, pageOptions }) => {
return (
<span className="text-xs text-blue-400 mr-1">
صفحه{" "}
<input
className="ml-1 text-xs p-1 rounded border-blue-400 w-9"
type="number"
defaultValue={pageIndex + 1}
onChange={(e) => {
const pageNumber = e.target.value ? Number(e.target.value) - 1 : 0;
gotoPage(pageNumber);
}}
/>
از {pageOptions.length}
</span>
);
};

@ -1,325 +0,0 @@
[
{
"id": 1,
"name": "خسرو سهرابی",
"order_date": "1400/11/09",
"order_price": 1,
"order_number": "09120023100",
"user_job": "مهندس ساختمان",
"order_status": 1,
"order_level": 1,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 2,
"name": "خسرو شکیبایی",
"order_date": "1340/04/13",
"order_price": 2,
"order_number": "09390646589",
"user_job": "بازیگر",
"order_status": 2,
"order_level": 2,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 3,
"name": "علی علوی",
"order_date": "1330/12/05",
"order_price": 3,
"order_number": "09120403285",
"user_job": "تاجر",
"order_status": 3,
"order_level": 3,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 4,
"name": "پارسا ایرانی",
"order_date": "1372/01/08",
"order_price": 4,
"order_number": "09120336508",
"user_job": "حسابدار",
"order_status": 4,
"order_level": 4,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 5,
"name": "محمد محمدی",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 6,
"name": "خسرو سهرابی",
"order_date": "1400/11/09",
"order_price": 1,
"order_number": "09120023100",
"user_job": "مهندس ساختمان",
"order_status": 1,
"order_level": 1,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 7,
"name": "خسرو شکیبایی",
"order_date": "1340/04/13",
"order_price": 2,
"order_number": "09390646589",
"user_job": "بازیگر",
"order_status": 2,
"order_level": 2,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 8,
"name": "علی علوی",
"order_date": "1330/12/05",
"order_price": 3,
"order_number": "09120403285",
"user_job": "تاجر",
"order_status": 3,
"order_level": 3,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 9,
"name": "پارسا ایرانی",
"order_date": "1372/01/08",
"order_price": 4,
"order_number": "09120336508",
"user_job": "حسابدار",
"order_status": 4,
"order_level": 4,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 10,
"name": "محمد محمدی",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 11,
"name": "محمد fds",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 12,
"name": "fffff fds",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 13,
"name": "fffff fds",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 14,
"name": "jjkjhg",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 15,
"name": "fffff jghjhg",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 16,
"name": "fffff jghjhg",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"id": 17,
"name": "fffff jghjhg",
"order_date": "1389/01/26",
"order_price": 5,
"order_number": "0913698574",
"user_job": "دکتر",
"order_status": 5,
"order_level": 5,
"birth_place": "استان تهران شهر تهران",
"office_phone": "02144407010",
"education": "کارشناسی",
"job": "فروشنده لوازم خانگی",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
}
]

@ -1,35 +0,0 @@
export function OrderLevel({ value }) {
return (
<div className="p-2 rounded-3xl border border-gray-300 w-fit">
{(() => {
switch(value) {
case 1:
return <div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2" style={{ backgroundColor: "#65FFAD" }}></span>
<span style={{ color: "#00253A" }} className="">وضعیت عادی</span>
</div>;
case 2:
return <div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2" style={{ backgroundColor: "#FF6565" }}></span>
<span style={{ color: "#00253A" }} className="">اعلان سطح هشدار</span>
</div>;
case 3:
return <div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2" style={{ backgroundColor: "#65DAFF" }}></span>
<span style={{ color: "#00253A" }} className="">بررسی و پیگیری</span>
</div>;
case 4:
return <div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2" style={{ backgroundColor: "#FFEA65" }}></span>
<span style={{ color: "#00253A" }} className="">وضعیت بحرانی</span>
</div>;
default:
return <div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2" style={{ backgroundColor: "#CCFF65" }}></span>
<span style={{ color: "#00253A" }} className="">وضعیت پایدار</span>
</div>;
}
})()}
</div>
);
}

@ -1,56 +0,0 @@
export function OrderStatus({ value }) {
value = +value;
return (
<div className="">
{(() => {
if (value === 1) {
return (
<span
style={{ backgroundColor: "#E2FFE377", color: "#00613D" }}
className="p-2 rounded"
>
ارسال شده
</span>
);
} else if (value === 2) {
return (
<span
style={{ backgroundColor: "#FFF78733", color: "#ECF150" }}
className="p-2 rounded"
>
رسیدگی
</span>
);
} else if (value === 3) {
return (
<span
style={{ backgroundColor: "#FFD8CC33", color: "#611100" }}
className="p-2 rounded"
>
لغو شده
</span>
);
} else if (value === 4) {
return (
<span
style={{ backgroundColor: "#E2FFFD33", color: "#00614A" }}
className="p-2 rounded"
>
پیگیری
</span>
);
} else {
return (
<span
style={{ backgroundColor: "#DBCCFF33", color: "#440061" }}
className="p-2 rounded"
>
خطری
</span>
);
}
})()}{" "}
</div>
);
}

@ -1,61 +0,0 @@
import React from "react";
import dobleLeftArrow from "./double-left-arrow.svg";
import leftArrow from "./left-arrow.svg";
import rightArrow from "./right-arrow.svg";
export const Pagination = ({
gotoPage,
canPreviousPage,
previousPage,
canNextPage,
pageCount,
nextPage,
}) => {
return (
<div className="flex flex-row items-center space-x-1">
<button
className="rounded py-1 px-2 text-xs font-bold"
style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
onClick={() => gotoPage(0)}
disabled={!canPreviousPage}
>
<img src={dobleLeftArrow} className="rotate-180 w-4 h-4" />
</button>
<button
className="rounded py-1 px-2 text-xs font-bold"
style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
onClick={() => previousPage()}
disabled={!canPreviousPage}
>
<img src={rightArrow} className="w-3 h-3" />
</button>
<button
className="rounded py-1 px-2 text-xs font-bold"
style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
onClick={() => nextPage()}
disabled={!canNextPage}
>
<img src={leftArrow} className="w-3 h-3" />
</button>
<button
className="rounded py-1 px-2 text-xs font-bold"
style={{ backgroundColor: "#F5F9FF", color: "#65A9FF" }}
onClick={() => gotoPage(pageCount - 1)}
disabled={!canNextPage}
>
<img src={dobleLeftArrow} className="w-4 h-4" />
</button>
</div>
);
};
export default Pagination;
// Pagination.defaultProps = {
// pagintaionButtons: [
// {
// image: { dobleLeftArrow },
// click: gotoPage(0),
// },
// ],
// };

@ -1,57 +0,0 @@
import React from "react";
// {columns[5].Cell({ value: row.order_status })}
export const SelectColumnFilter = ({
column: { filterValue, setFilter, preFilteredRows, id, render, columns },
}) => {
const options = React.useMemo(() => {
const options = new Set();
preFilteredRows.forEach((row) => {
options.add(row.values[id]);
});
return [...options.values()];
}, [id, preFilteredRows]);
return (
<select
className="text-xs flex flex-row items-start justify-start p-1 text-blue-400 rounded focus:outline-none border focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }}
name={id}
id={id}
value={filterValue}
onChange={(e) => {
setFilter(e.target.value || undefined);
}}
>
<option
className="text-white"
value=""
style={{ backgroundColor: "#65A9FF" }}
>
همه
</option>
{options.map((option, i) => (
<option
key={i}
value={option}
className="text-right text-white px-2"
style={{ backgroundColor: "#65A9FF" }}
>
{(() => {
if (option === 1) {
return "وضعیت عادی";
} else if (option === 2) {
return "اعلان سطح هشدار";
} else if (option === 3) {
return "بررسی و پیگیری";
} else if (option === 4) {
return "وضعیت بحرانی";
} else {
return " وضعیت پایدار";
}
})()}{" "}
</option>
))}
</select>
);
};

@ -1,56 +0,0 @@
import React from "react";
export const SelectColumnFilter2 = ({
column: { filterValue, setFilter, preFilteredRows, id, render },
}) => {
const options = React.useMemo(() => {
const options = new Set();
preFilteredRows.forEach((row) => {
options.add(row.values[id]);
});
return [...options.values()];
}, [id, preFilteredRows]);
return (
<select
className="text-xs flex flex-row items-start justify-start p-1 text-blue-400 rounded focus:outline-none border focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }}
name={id}
id={id}
value={filterValue}
onChange={(e) => {
setFilter(e.target.value || undefined);
}}
>
<option
className="text-white"
value=""
style={{ backgroundColor: "#65A9FF" }}
>
همه
</option>
{options.map((option, i) => (
<option
key={i}
value={option}
className="text-right text-white px-2"
style={{ backgroundColor: "#65A9FF" }}
>
{(() => {
if (option === 1) {
return "ارسال شده";
} else if (option === 2) {
return "رسیدگی";
} else if (option === 3) {
return "لغو شده";
} else if (option === 4) {
return "پیگیری";
} else {
return "خطری";
}
})()}{" "}
</option>
))}
</select>
);
};

@ -1,39 +0,0 @@
import React, { useState } from "react";
import { ToggleColumns } from "./ToggleColumns";
import settings from "./settings.svg";
export const Settings = ({ allColumns, getToggleHideAllColumnsProps }) => {
const [openModal, setOpenModal] = useState(false);
console.log(openModal);
return (
<section>
<div
onClick={() => setOpenModal(true)}
data-modal-toggle="large-modal"
style={{ backgroundColor: "#F9FBFF" }}
className="mr-2 flex flex-col items-center justify-center p-1 rounded"
>
<img src={settings} className="w-6 h-6 cursor-pointer" />
</div>
{/* modal */}
<div
className={`cursor-pointer w-screen h-screen backdrop-filter backdrop-blur-lg bg-opacity-90 bg-gray-600 flex items-center justify-center fixed left-0 top-0
${openModal ? "opacity-80" : "opacity-0 pointer-events-none"}`}
onClick={() => setOpenModal(false)}
>
<div
className="absolute bg-white w-6/12 p-4 rounded"
style={{ top: "10%" }}
onClick={(e) => e.stopPropagation()}
>
<ToggleColumns
allColumns={allColumns}
getToggleHideAllColumnsProps={getToggleHideAllColumnsProps}
/>
</div>
</div>
</section>
);
};

@ -1,31 +0,0 @@
import React from "react";
const ShowMoreRows = ({ pageSize, setPageSize }) => {
return (
<select
className="text-white text-sm rounded cursor-pointer mr-2"
style={{
backgroundColor: "#65A9FF",
borderColor: "#65A9FF",
}}
value={pageSize}
onChange={(e) => setPageSize(Number(e.target.value))}
>
{[7, 10, 25, 50].map((pageSize) => (
<option
key={pageSize}
value={pageSize}
className=" text-xs"
style={{
direction: "ltr",
textAlign: "right",
}}
>
نمایش {pageSize}
</option>
))}
</select>
);
};
export default ShowMoreRows;

@ -1,40 +0,0 @@
import React from "react";
import cancleIcon from "./zarbedar-icon.svg";
export const SliderColumnFilter = ({
column: { filterValue, setFilter, preFilteredRows, id },
}) => {
const [min, max] = React.useMemo(() => {
let min = preFilteredRows.length ? preFilteredRows[0].values[id] : 0;
let max = preFilteredRows.length ? preFilteredRows[0].values[id] : 0;
preFilteredRows.forEach((row) => {
min = Math.min(row.values[id], min);
max = Math.max(row.values[id], max);
});
return [min, max];
}, [id, preFilteredRows]);
return (
<div className="flex flex-row items-center justify-between w-10/12">
<input
className=" w-10/12"
type="range"
min={min}
max={max}
value={filterValue || min}
onChange={(e) => {
setFilter(parseInt(e.target.value, 10));
}}
/>
<div className="p-1 rounded bg-blue-300 bg-opacity-20">
<img
src={cancleIcon}
onClick={() => setFilter(undefined)}
className="cursor-pointer w-2 h-2"
/>
</div>
{/* <button onClick={() => setFilter(undefined)}>ریست</button> */}
</div>
);
};

@ -1,66 +0,0 @@
import React from "react";
import "./index.scss";
import cancleIcon from "./zarbedar-icon.svg";
const Tabbar = ({ tabs, delTab, setActivateTab, activeTab }) => {
return (
<ul
className="tabbar flex no-scrollbar overflow-x-scroll scrolling-touch"
onMouseDown={(e) => {
const slider = window.document.querySelector(".tabbar");
window.isDown = true;
window.startX = e.pageX - slider.offsetLeft;
window.scrollLeft = slider.scrollLeft;
}}
onMouseLeave={(e) => {
window.isDown = false;
}}
onMouseUp={(e) => {
window.isDown = false;
}}
onMouseMove={(e) => {
const slider = window.document.querySelector(".tabbar");
if (!window.isDown) return;
e.preventDefault();
const x = e.pageX - slider.offsetLeft;
const walk = (x - window.startX) * 1;
slider.scrollLeft = window.scrollLeft - walk;
}}
>
{tabs.map((el, index) => (
<li
key={index}
onClick={(e) => {
if (window.isDown) return e.preventDefault();
}}
aria-current="page"
className="flex flex-row items-center text-sm text-center active rounded-sm px-4"
style={{
backgroundColor: activeTab === el.id ? "#92c1fc" : "#F1F6FF",
color: activeTab === el.id ? "#fff" : "#000",
}}
>
<div className="h-full py-2" onClick={(e) => setActivateTab(el.id)}>
{el.name}
</div>
{el.id ? (
<img
src={cancleIcon}
className="w-2 mr-3"
alt=""
onClick={(e) => {
e.preventDefault();
delTab(el.id);
}}
/>
) : null}
</li>
))}
</ul>
);
};
window.isDown = false;
export default Tabbar;

@ -1,47 +0,0 @@
import React from "react";
export const ToggleColumns = ({ allColumns, getToggleHideAllColumnsProps }) => {
// console.log(allColumns);
return (
<div>
<h2 className="text-base">
با زدن بر روی هر یک از چک باکس ها میتوانید نمایش ستون هارو خاموش روشن
کنید{" "}
</h2>
<div className="text-sm mt-5">
<input
className="ml-2"
type="checkbox"
{...getToggleHideAllColumnsProps()}
/>{" "}
تاگل کردن همه
</div>
{allColumns.map((column, index) => (
<div key={index}>
<label className="text-sm">
<input
type="checkbox"
className="ml-2 "
{...column.getToggleHiddenProps()}
/>
{column.Footer}
</label>
</div>
))}
{/* اگر میخواستیم فیلتر بزاریم */}
{/* {allColumns
.filter((column) => column.Header === "string")
.map((column, index) => (
<div key={index}>
<label>
<input type="checkbox" {...column.getToggleHiddenProps()} />
{column.Header}
</label>
</div>
))} */}
</div>
);
};
export default ToggleColumns;

@ -0,0 +1,34 @@
import React from "react";
import ButtonNewDesign from "../ButtonNewDesign";
const ViewEdit = () => {
return (
<div className="flex flex-row justify-end gap-x-2">
<ButtonNewDesign
bgColor={"bg-blue-400"}
bgHoverColor={"hover:bg-blue-600"}
textColor={"text-white"}
border={"border-0"}
borderRadius={"rounded"}
fontSize={"text-xs"}
padding={"p-2"}
icon={null}
text={"ویرایش"}
/>
<ButtonNewDesign
bgColor={"bg-transparent"}
bgHoverColor={null}
textColor={"text-blue-600"}
border={"border"}
borderColor={"border-blue-600"}
borderRadius={"rounded"}
fontSize={"text-xs"}
padding={"p-2"}
icon={null}
text={"نمایش"}
/>
</div>
);
};
export default ViewEdit;

@ -1,6 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15">
<g id="arrow-down" transform="translate(0)">
<path id="Vector" d="M9.9,0,5.825,4.075a1.241,1.241,0,0,1-1.75,0L0,0" transform="translate(2.55 5.594)" fill="none" stroke="rgba(0,37,58,0.32)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0H15V15H0Z" transform="translate(15 15) rotate(180)" fill="none" opacity="0"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 489 B

@ -1,4 +0,0 @@
<svg id="arrow-left" xmlns="http://www.w3.org/2000/svg" width="10.112" height="10.112" viewBox="0 0 10.112 10.112">
<path id="Vector" d="M2.99,6.674.243,3.927a.837.837,0,0,1,0-1.18L2.99,0" transform="translate(3.329 1.719)" fill="none" stroke="#00253a" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
<path id="Vector-2" data-name="Vector" d="M0,0H10.112V10.112H0Z" transform="translate(10.112 10.112) rotate(180)" fill="none" opacity="0"/>
</svg>

Before

Width:  |  Height:  |  Size: 470 B

@ -1,4 +0,0 @@
<svg id="arrow-down" xmlns="http://www.w3.org/2000/svg" width="16.237" height="16.237" viewBox="0 0 16.237 16.237">
<path id="Vector" d="M10.716,0,6.305,4.411a1.343,1.343,0,0,1-1.894,0L0,0" transform="translate(2.76 6.055)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0H16.237V16.237H0Z" transform="translate(16.237 16.237) rotate(180)" fill="none" opacity="0"/>
</svg>

Before

Width:  |  Height:  |  Size: 472 B

@ -1,12 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="15.988" height="11.988" viewBox="0 0 15.988 11.988">
<g id="vuesax_linear_arrow-right" data-name="vuesax/linear/arrow-right" transform="translate(15.988 11.988) rotate(180)">
<g id="arrow-right" transform="translate(4)">
<path id="Vector" d="M0,7.912,3.257,4.655a.992.992,0,0,0,0-1.4L0,0" transform="translate(4.451 2.038)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M0,0H11.988V11.988H0Z" transform="translate(11.988 11.988) rotate(180)" fill="none" opacity="0"/>
</g>
<g id="arrow-right-2" data-name="arrow-right">
<path id="Vector-3" data-name="Vector" d="M0,7.912,3.257,4.655a.992.992,0,0,0,0-1.4L0,0" transform="translate(4.451 2.038)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M0,0H11.988V11.988H0Z" transform="translate(11.988 11.988) rotate(180)" fill="none" opacity="0"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.1 KiB

@ -1,6 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16.715" height="16.703" viewBox="0 0 16.715 16.703">
<g id="edit" transform="translate(-626.295 -252.999)">
<path id="Vector" d="M8.991,1.271l-7.88,7.88a2.712,2.712,0,0,0-.66,1.32l-.43,3.01a1.424,1.424,0,0,0,1.7,1.7l3.01-.43a2.8,2.8,0,0,0,1.32-.66l7.88-7.88c1.36-1.36,2-2.94,0-4.94S10.351-.089,8.991,1.271Z" transform="translate(627.049 253.749)" fill="none" stroke="#00253a" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0A7.144,7.144,0,0,0,4.94,4.94" transform="translate(634.91 256.15)" fill="none" stroke="#00253a" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 725 B

@ -1,3 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="19.631" height="22.407" viewBox="0 0 19.631 22.407">
<path id="Vector" d="M2.105,0h13.92a2.107,2.107,0,0,1,2.105,2.105V4.428A3.933,3.933,0,0,1,17.078,6.86L13.613,9.924l-1.072.947A3.417,3.417,0,0,0,11.488,13.3v4.537a2.367,2.367,0,0,1-.944,1.8l-1.47.926a2.145,2.145,0,0,1-3.267-1.8v-5.59a3.962,3.962,0,0,0-.853-2.214L.944,6.733A3.43,3.43,0,0,1,0,4.628V2.214A2.133,2.133,0,0,1,2.105,0Z" transform="translate(0.75 0.75)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</svg>

Before

Width:  |  Height:  |  Size: 570 B

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 9.4 KiB

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="25.509" height="25.509" viewBox="0 0 25.509 25.509">
<g id="vuesax_linear_folder-open" data-name="vuesax/linear/folder-open" transform="translate(0 0)">
<g id="folder-open" transform="translate(0 0)">
<path id="Vector" d="M18.058,10.109V4.4c0-3.522-.9-4.4-4.517-4.4h-1.35a2.158,2.158,0,0,0-2.168,1.057L8.673,2.818a1.446,1.446,0,0,1-1.446.7H4.517C.9,3.522,0,4.4,0,7.925v2.184" transform="translate(3.731 2.801)" fill="#ffd358" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,25.509H25.509V0H0Z" fill="none" opacity="0"/>
<path id="Vector-3" data-name="Vector" d="M.018,3.507.443,8.822c.159,1.626.287,2.87,3.167,2.87H16.982c2.88,0,3.008-1.244,3.167-2.87l.425-5.314a3.222,3.222,0,0,0-.691-2.328l-.021-.021A3.162,3.162,0,0,0,17.407,0H3.186A3.151,3.151,0,0,0,.752,1.137c-.011.011-.021.021-.021.032A3.109,3.109,0,0,0,.018,3.507Z" transform="translate(2.458 11.692)" fill="#fcefcb" stroke="#fff" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M5.463,0H0" transform="translate(10.023 18.069)" fill="none" stroke="#ffd358" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 66 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 180 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 162 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 179 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 13 KiB

@ -1,8 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="11.988" height="11.988" viewBox="0 0 11.988 11.988">
<g id="vuesax_linear_arrow-right" data-name="vuesax/linear/arrow-right" transform="translate(11.988 11.988) rotate(180)">
<g id="arrow-right">
<path id="Vector" d="M0,7.912,3.257,4.655a.992.992,0,0,0,0-1.4L0,0" transform="translate(4.451 2.038)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M0,0H11.988V11.988H0Z" transform="translate(11.988 11.988) rotate(180)" fill="none" opacity="0"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 622 B

@ -1,10 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g id="vuesax_linear_more" data-name="vuesax/linear/more" transform="translate(-188 580) rotate(-90)">
<g id="more">
<path id="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(559 198)" fill="#6397b5"/>
<path id="Vector-2" data-name="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(573 198)" fill="#6397b5"/>
<path id="Vector-3" data-name="Vector" d="M2,0A2,2,0,1,0,4,2,2.006,2.006,0,0,0,2,0Z" transform="translate(566 198)" fill="#6397b5"/>
<path id="Vector-4" data-name="Vector" d="M0,0H24V24H0Z" transform="translate(556 188)" fill="#6397b5" opacity="0"/>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 749 B

@ -1,6 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="11.72" height="11.72" viewBox="0 0 11.72 11.72">
<g id="Group_1916" data-name="Group 1916" transform="translate(-34.5 -316.547)">
<path id="Vector" d="M0,0H9.72" transform="translate(35.5 322.407)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M0,9.72V0" transform="translate(40.36 317.547)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 543 B

@ -1,6 +0,0 @@
<svg id="vuesax_linear_arrow-right" data-name="vuesax/linear/arrow-right" xmlns="http://www.w3.org/2000/svg" width="11.988" height="11.988" viewBox="0 0 11.988 11.988">
<g id="arrow-right">
<path id="Vector" d="M0,7.912,3.257,4.655a.992.992,0,0,0,0-1.4L0,0" transform="translate(4.451 2.038)" fill="none" stroke="#65a9ff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-2" data-name="Vector" d="M0,0H11.988V11.988H0Z" transform="translate(11.988 11.988) rotate(180)" fill="none" opacity="0"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 552 B

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 7.7 KiB

Loading…
Cancel
Save