parent
1315307be2
commit
1bcaa5b6a7
38 changed files with 50 additions and 1187 deletions
@ -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> |
||||
); |
||||
}; |
||||
@ -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; |
||||
|
Before Width: | Height: | Size: 489 B |
|
Before Width: | Height: | Size: 470 B |
|
Before Width: | Height: | Size: 472 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 725 B |
|
Before Width: | Height: | Size: 570 B |
|
Before Width: | Height: | Size: 9.4 KiB |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 66 KiB |
|
Before Width: | Height: | Size: 180 KiB |
|
Before Width: | Height: | Size: 162 KiB |
|
Before Width: | Height: | Size: 179 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 622 B |
|
Before Width: | Height: | Size: 749 B |
|
Before Width: | Height: | Size: 543 B |
|
Before Width: | Height: | Size: 552 B |
|
Before Width: | Height: | Size: 7.7 KiB |
Loading…
Reference in new issue