updaaaaaaaaaaaaaaaate

master
mahdi andalib 3 years ago
parent 9970484bce
commit f9460adcf9
  1. 269
      src/components/ReactTable4/BasicTable.js
  2. 281
      src/components/ReactTable4/MOCK_DATA.json
  3. 12
      src/components/ReactTable4/columns.js

@ -91,16 +91,16 @@ const BasicTable = ({ settingsIcon }) => {
}
);
const changeOrder = () => {
setColumnOrder([
"name",
"order-number",
"user-job",
"order-level",
"order-status",
"order-price",
]);
};
// const changeOrder = () => {
// setColumnOrder([
// "name",
// "order-number",
// "user-job",
// "order-level",
// "order-status",
// "order-price",
// ]);
// };
const { globalFilter, pageIndex, pageSize } = state;
// const firstPageRows = rows.slice(0, 10);
@ -334,9 +334,252 @@ function renderRowSubComponent({ rows }) {
publishedYear: "سال انتشار",
};
return (
<div className="flex flex-row items-center bg-indigo-100 border-r-4 border-blue-600 p-2">
مبلغ: {rows.history}
<button className="bg-blue-400">ویرایش</button>
<div className="w-full flex flex-row items-center bg-indigo-100 border-r-4 border-blue-600 p-2">
{/* right */}
<div
className="flex flex-row flex-wrap items-center"
style={{ width: "90%" }}
>
{/* 1 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
نام و نام خانوادگی:
<span className="mr-1 text-black">{rows.name}</span>
</p>
</div>
{/* 2 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
تاریخ سفارش:
<span className="mr-1 text-black">{rows.order_date}</span>
</p>
</div>
{/* 3 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
مبلغ سفارش:
<span className="mr-1 text-black">{rows.order_price}</span>
</p>
</div>
{/* 4 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
شماره سفارش:
<span className="mr-1 text-black">{rows.order_number}</span>
</p>
</div>
{/* 5 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
شغل کاربر:
<span className="mr-1 text-black">{rows.user_job}</span>
</p>
</div>
{/* 6 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
وضعیت سفارش:
<span className="mr-1 text-black">{rows.order_status}</span>
</p>
</div>
{/* 7 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
سطح اهمیت:
<span className="mr-1 text-black">{rows.order_level}</span>
</p>
</div>
{/* 8 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
محل تولد:
<span className="mr-1 text-black">{rows.birth_place}</span>
</p>
</div>
{/* 9 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
تلفن محل کار:
<span className="mr-1 text-black">{rows.office_phone}</span>
</p>
</div>
{/* 10 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
تحصیلات:
<span className="mr-1 text-black">{rows.education}</span>
</p>
</div>
{/* 11 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
تاریخ تولد:
<span className="mr-1 text-black">{rows.birth_day}</span>
</p>
</div>
{/* 12 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
شغل:
<span className="mr-1 text-black">{rows.job}</span>
</p>
</div>
{/* 13 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
دانشگاه:
<span className="mr-1 text-black">{rows.uni}</span>
</p>
</div>
{/* 14 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
رشته تحصیلی:
<span className="mr-1 text-black">{rows.field_study}</span>
</p>
</div>
{/* 15 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
اخلاق:
<span className="mr-1 text-black">{rows.behaviour}</span>
</p>
</div>
{/* 16 */}
<div className="flex flex-row items-center mr-2 my-2">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#EDF2FB" }}
></div>
<p
className="text-xs text-blue-400"
style={{ borderColor: "#65A9FF" }}
>
نشانی:
<span className="mr-1 text-black">{rows.address}</span>
</p>
</div>
</div>
{/* left */}
<div
className="flex flex-col items-end justify-end"
style={{ width: "10%" }}
>
<button
className="border rounded text-red-600 w-8/12 text-xs py-2 mb-2"
style={{ borderColor: "#D53921" }}
>
حذف
</button>
<button className="border rounded text-blue-600 w-8/12 text-xs py-2">
جزیات بیشتر
</button>
</div>
</div>
);
}

@ -1,287 +1,92 @@
[
{
"name": "خسرو سهرابی",
"order-date": "1400/11/09",
"order-price": 1,
"order-number": "09120023100",
"user-job": "مهندس ساختمان",
"order-status": 1,
"order-level": 1,
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"name": "علی علوی",
"order-date": "1330/12/05",
"order-price": 3,
"order-number": "09120403285",
"user-job": "تاجر",
"order-status": 3,
"order-level": 3,
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
},
{
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"name": "علی علوی",
"order-date": "1330/12/05",
"order-price": 3,
"order-number": "09120403285",
"user-job": "تاجر",
"order-status": 3,
"order-level": 3,
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"name": "پارسا ایرانی",
"order-date": "1372/01/08",
"order-price": 4,
"order-number": "09120336508",
"user-job": "حسابدار",
"order-status": 4,
"order-level": 4,
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
},
{
"name": "محمد محمدی",
"order-date": "1389/01/26",
"order-price": 5,
"order-number": "0913698574",
"user-job": "دکتر",
"order-status": 5,
"order-level": 5,
"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": "کارشناسی",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق",
"job": "فروشنده لوازم خانگی",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"field_study": "مدیریت صنعتی",
"birth_day": "1368/09/02",
"Criminal record": "4 سال حبس",
"uni": "تهران"
"uni": "تهران",
"address": "خیابان شریعتی نرسیده به خیابان دولت کوچه عباسی نبش تهیه غذای فارسی پلاک 4 واحد 3",
"behaviour": "بچه پرو و دریده شاخ اما کم آزار اهل رفاقت و مرام خلاق نوآور آشنا به صنایع خلاق"
}
]

@ -20,7 +20,7 @@ export const COLUMNS = [
{
Header: "تاریخ سفارش",
Footer: "تاریخ سفارش",
accessor: "order-date",
accessor: "order_date",
Filter: SliderColumnFilter,
Cell: ({ value }) => {
return format(new Date(value), "dd/MM/yyyy");
@ -29,30 +29,30 @@ export const COLUMNS = [
{
Header: "مبلغ سفارش",
Footer: "مبلغ سفارش",
accessor: "order-price",
accessor: "order_price",
Filter: SliderColumnFilter,
},
{
Header: "شماره سفارش",
Footer: "شماره سفارش",
accessor: "order-number",
accessor: "order_number",
},
{
Header: "شغل کاربر",
Footer: "شغل کاربر",
accessor: "user-job",
accessor: "user_job",
},
{
Header: "وضعیت سفارش",
Footer: "وضعیت سفارش",
accessor: "order-status",
accessor: "order_status",
Cell: OrderStatus,
Filter: SelectColumnFilter2,
},
{
Header: "سطح اهمیت",
Footer: "سطح اهمیت",
accessor: "order-level",
accessor: "order_level",
Cell: OrderLevel,
Filter: SelectColumnFilter,
},

Loading…
Cancel
Save