mahdi
/
danovinTasks
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update 12 files

Browse Source
master
mahdi 3 years ago
parent dcd94e355c
commit 909efc7154
12 changed files with 113 additions and 303 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 30
      src/components/Tabels/ReactTable4/EditRow.js
  2. 3
      src/components/Tabels/ReactTable4/GlobalFilter.js
  3. 29
      src/components/Tabels/ReactTable4/History.js
  4. 4
      src/components/Tabels/ReactTable4/Location.js
  5. 78
      src/components/Tabels/ReactTable4/OrderLevel.js
  6. 25
      src/components/Tabels/ReactTable4/OrderStatus.js
  7. 187
      src/components/Tabels/ReactTable4/RenderRowSubComponent.js
  8. 12
      src/components/Tabels/ReactTable4/SelectColumnFilter.js
  9. 12
      src/components/Tabels/ReactTable4/SelectColumnFilter2.js
  10. 18
      src/components/Tabels/ReactTable4/SendForm.js
  11. 6
      src/components/Tabels/ReactTable4/Settings.js
  12. 12
      src/components/Tabels/ReactTable4/ShowMoreRows.js

30
src/components/Tabels/ReactTable4/EditRow.js
Unescape View File

@ -6,38 +6,21 @@ import History from "./History";
const EditRow = ({ row, columns }) => {
// console.log(columns);
return (
<section
className=" border-r-4 border-blue-600 p-2"
style={{ backgroundColor: "#F1F5FE" }}
>
<section className=" border-r-4 border-blue-600 bg-[#F1F5FE] p-2">
<div className="flex flex-row items-center mr-2 mt-2 mb-4">
<div
className="w-1 h-4 ml-1 rounded"
style={{ backgroundColor: "#65A9FF" }}
></div>
<p className="text-sm font-sansbold" style={{ color: "#00253A" }}>
اطلاعات هویتی
</p>
<div className="w-1 h-4 ml-1 rounded bg-[#65A9FF]"></div>
<p className="text-sm font-sansbold text-[#00253A]">اطلاعات هویتی</p>
</div>
{/* table data */}
<div className="flex flex-wrap">
{/* 1 */}
<div className="flex flex-col my-2 mx-2">
<p
className="text-xs text-blue-400 mb-2"
style={{ borderColor: "#65A9FF" }}
>
<p className="text-xs text-blue-400 mb-2 border-[#65A9FF]">
نام و نام خانوادگی:
</p>
<span
role="textbox"
style={{
backgroundColor: "#F8FBFF",
borderColor: "#C8DEF9",
color: "#00253A",
minWidth: "96px",
}}
className="text-xs rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
className="min-w-[96px] text-xs text-[#00253A] border-[#C8DEF9] bg-[#F8FBFF] rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
>
{row.name}
</span>
@ -45,8 +28,7 @@ const EditRow = ({ row, columns }) => {
{/* 2 */}
<div className="flex flex-col my-2 mx-2">
<p
className="text-xs text-blue-400 mb-2"
style={{ borderColor: "#65A9FF" }}
className="text-xs text-blue-400 mb-2 border-[#65A9FF]"
>
تاریخ سفارش:
</p>

3
src/components/Tabels/ReactTable4/GlobalFilter.js
Unescape View File

@ -31,8 +31,7 @@ export const GlobalFilter = ({ filter, setFilter }) => {
onFocus={() => setActiveSearchBox(true)}
// onBlur={() => setActiveSearchBox(false)}
type="text"
className={`text-xs 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" }}
className={`text-xs text-blue-400 bg-[#F9FBFF] border-[#B5D6FF] rounded focus:outline-none border focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20`}
/>
</div>
);

29
src/components/Tabels/ReactTable4/History.js
Unescape View File

@ -4,46 +4,29 @@ const History = ({ sentForms }) => {
return (
<div className="flex flex-col relative mx-2">
{/* title */}
<span className="text-sm mb-4" style={{ color: "#65A9FF" }}>
توضیحات قبلی:
</span>
<span className="text-sm mb-4 text-[#65A9FF]">توضیحات قبلی:</span>
{/* content */}
<div
style={{
backgroundColor: "#F8FBFF",
borderColor: "#C8DEF9",
}}
className="rounded-md border cursor-pointer h-44 no-scrollbar overflow-y-scroll "
>
<div className="rounded-md border cursor-pointer h-44 no-scrollbar overflow-y-scroll bg-[#F8FBFF] border-[#C8DEF9]">
{/* {sentForms.slice(0, 4).map((sentForm, index) => ( */}
{sentForms.map((sentForm, index) => (
<div>
{/* content */}
<div className="p-2">
<p className="text-xs" style={{ color: "#00253A" }}>
{sentForm.title}
</p>
<p
className="text-xs text-left mt-2"
style={{ color: "#6397B5" }}
>
<p className="text-xs text-[#00253A]">{sentForm.title}</p>
<p className="text-xs text-left mt-2 text-[#6397B5]">
<span>تاریخ:</span>
{" "}
{sentForm.date}
</p>
</div>
{/* border */}
{Number(index) !== sentForms.length - 1 && (
<div className="border" style={{ borderColor: "#C8DEF9" }}></div>
<div className="border border-[#C8DEF9]"></div>
)}
</div>
))}
</div>
{/* left border */}
<div
style={{ bottom: "33%", backgroundColor: "#C8DEF9" }}
className="absolute left-0.5 transform -translate-x-1/2 -translate-y-1/2 w-1 h-14 rounded"
></div>
<div className="absolute bottom-[33%] bg-[#C8DEF9] left-0.5 transform -translate-x-1/2 -translate-y-1/2 w-1 h-14 rounded"></div>
</div>
);
};

4
src/components/Tabels/ReactTable4/Location.js
Unescape View File

@ -3,9 +3,7 @@ import React from "react";
const Location = () => {
return (
<div className="mx-2">
<span className="text-xs mr-2" style={{ color: "#65A9FF" }}>
لوکیشن مد نظر:
</span>
<span className="text-xs mr-2 text-[#65A9FF]">لوکیشن مد نظر:</span>
<img
className="mt-1 mr-2 border border-blue-300 rounded"
src="images/ReactTable4map.svg"

78
src/components/Tabels/ReactTable4/OrderLevel.js
Unescape View File

@ -1,35 +1,45 @@
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>
);
}
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 bg-[#65FFAD]"></span>
<span className="text-[#00253A]">وضعیت عادی</span>
</div>
);
case 2:
return (
<div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2 bg-[#FF6565]"></span>
<span className="text-[#00253A]">اعلان سطح هشدار</span>
</div>
);
case 3:
return (
<div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2 bg-[#65DAFF]"></span>
<span className="text-[#00253A]">بررسی و پیگیری</span>
</div>
);
case 4:
return (
<div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2 bg-[#FFEA65]"></span>
<span className="text-[#00253A]">وضعیت بحرانی</span>
</div>
);
default:
return (
<div className="flex flex-row items-center justify-center ">
<span className="w-2 h-2 rounded-full ml-2 bg-[#CCFF65]"></span>
<span className="text-[#00253A]">وضعیت پایدار</span>
</div>
);
}
})()}
</div>
);
}

25
src/components/Tabels/ReactTable4/OrderStatus.js
Unescape View File

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

187
src/components/Tabels/ReactTable4/RenderRowSubComponent.js
Unescape View File

@ -2,258 +2,145 @@ import React from "react";
const RenderRowSubComponent = ({ columns, addTab, row }) => {
return (
<div
className="w-full flex flex-row items-center border-r-4 border-blue-600 p-2 "
style={{ backgroundColor: "#FBFCFE" }}
>
<div className="w-full flex flex-row items-center border-r-4 border-blue-600 p-2 bg-[#FBFCFE]">
{/* right */}
<div
className="flex flex-row flex-wrap items-center "
style={{ width: "90%" }}
>
<div className="w-[90%] flex flex-row flex-wrap items-center ">
{/* 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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
نام و نام خانوادگی:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
تاریخ سفارش:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
مبلغ سفارش:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
شماره سفارش:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
شغل کاربر:
<span className="mr-1 text-black">{row.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" }}
>
وضعیت سفارش:
</p>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">وضعیت سفارش:</p>
<span className="mr-1 text-black text-xs">
{columns[5].Cell({ value: row.order_status })}
</span>
</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" }}
>
سطح اهمیت:
</p>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">سطح اهمیت:</p>
<span className="mr-1 text-xs text-black">
{columns[6].Cell({ value: row.order_level })}
</span>
</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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
محل تولد:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
تلفن محل کار:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
تحصیلات:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
تاریخ تولد:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
شغل:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
دانشگاه:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
رشته تحصیلی:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
اخلاق:
<span className="mr-1 text-black">{row.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" }}
>
<div className="w-1 h-4 ml-1 rounded bg-[#EDF2FB]"></div>
<p className="text-xs text-blue-400 border-[#65A9FF]">
نشانی:
<span className="mr-1 text-black">{row.address}</span>
</p>
</div>
</div>
{/* left */}
<div
className="flex flex-col items-end justify-end"
style={{ width: "10%" }}
>
<button
className="border rounded w-8/12 text-xs py-2 mb-2 bg-white"
style={{ borderColor: "#D53921", color: "#D53921" }}
>
<div className="w-[10%] flex flex-col items-end justify-end">
<button className="border border-[#D53921] text-[#D53921] rounded w-8/12 text-xs py-2 mb-2 bg-white">
حذف
</button>
<button
className="border rounded w-8/12 text-xs py-2 bg-white"
style={{ borderColor: "#65A9FF", color: "#65A9FF" }}
className="border border-[#65A9FF] text-[#65A9FF] rounded w-8/12 text-xs py-2 bg-white"
onClick={() => {
console.log(row.name);
addTab({ name: row.name, id: row.id });

12
src/components/Tabels/ReactTable4/SelectColumnFilter.js
Unescape View File

@ -14,8 +14,7 @@ export const SelectColumnFilter = ({
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" }}
className="text-xs flex bg-[#F9FBFF] border-[#B5D6FF] 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"
name={id}
id={id}
value={filterValue}
@ -23,19 +22,14 @@ export const SelectColumnFilter = ({
setFilter(e.target.value || undefined);
}}
>
<option
className="text-white"
value=""
style={{ backgroundColor: "#65A9FF" }}
>
<option className="text-white bg-[#65A9FF]" value="">
همه
</option>
{options.map((option, i) => (
<option
key={i}
value={option}
className="text-right text-white px-2"
style={{ backgroundColor: "#65A9FF" }}
className="text-right text-white px-2 bg-[#65A9FF]"
>
{(() => {
if (option === 1) {

12
src/components/Tabels/ReactTable4/SelectColumnFilter2.js
Unescape View File

@ -13,8 +13,7 @@ export const SelectColumnFilter2 = ({
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" }}
className="text-xs bg-[#F9FBFF] border-[#B5D6FF] 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"
name={id}
id={id}
value={filterValue}
@ -22,19 +21,14 @@ export const SelectColumnFilter2 = ({
setFilter(e.target.value || undefined);
}}
>
<option
className="text-white"
value=""
style={{ backgroundColor: "#65A9FF" }}
>
<option className="text-white bg-[#65A9FF]" value="">
همه
</option>
{options.map((option, i) => (
<option
key={i}
value={option}
className="text-right text-white px-2"
style={{ backgroundColor: "#65A9FF" }}
className="text-right text-white px-2 bg-[#65A9FF]"
>
{(() => {
if (option === 1) {

18
src/components/Tabels/ReactTable4/SendForm.js
Unescape View File

@ -3,27 +3,15 @@ import React from "react";
const SendForm = () => {
return (
<div className="flex flex-col flex-1 mx-2">
<span className="text-sm mb-4" style={{ color: "#65A9FF" }}>
توضیحات:
</span>
<span className="text-sm mb-4 text-[#65A9FF]">توضیحات:</span>
<form className="flex flex-col ">
<input
placeholder="موضوع"
className="text-xs mb-2 placeholder-blue-300 rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
style={{
backgroundColor: "#F8FBFF",
borderColor: "#C8DEF9",
color: "#00253A",
}}
className="text-xs border-[#C8DEF9] bg-[#F8FBFF] text-[#00253A] mb-2 placeholder-blue-300 rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
/>
<textarea
placeholder="متن"
className="resize-none w-full h-32 placeholder-blue-300 text-xs rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
style={{
backgroundColor: "#F8FBFF",
borderColor: "#C8DEF9",
color: "#00253A",
}}
className="resize-none border-[#C8DEF9] bg-[#F8FBFF] text-[#00253A] w-full h-32 placeholder-blue-300 text-xs rounded-sm border p-2 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20"
></textarea>
</form>
</div>

6
src/components/Tabels/ReactTable4/Settings.js
Unescape View File

@ -10,8 +10,7 @@ export const Settings = ({ allColumns, getToggleHideAllColumnsProps }) => {
<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"
className="mr-2 flex flex-col items-center justify-center p-1 bg-[#F9FBFF] rounded"
>
<img
src="images/ReactTable4settings.svg"
@ -26,8 +25,7 @@ export const Settings = ({ allColumns, getToggleHideAllColumnsProps }) => {
onClick={() => setOpenModal(false)}
>
<div
className="absolute bg-white w-6/12 p-4 rounded"
style={{ top: "10%" }}
className="absolute top-[10%] bg-white w-6/12 p-4 rounded"
onClick={(e) => e.stopPropagation()}
>
<ToggleColumns

12
src/components/Tabels/ReactTable4/ShowMoreRows.js
Unescape View File

@ -3,11 +3,7 @@ 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",
}}
className="text-white text-sm rounded cursor-pointer mr-2 bg-[#65A9FF] bg-[#65A9FF]"
value={pageSize}
onChange={(e) => setPageSize(Number(e.target.value))}
>
@ -15,11 +11,7 @@ const ShowMoreRows = ({ pageSize, setPageSize }) => {
<option
key={pageSize}
value={pageSize}
className=" text-xs"
style={{
direction: "ltr",
textAlign: "right",
}}
className=" text-xs text-right ltr"
>
نمایش {pageSize}
</option>

Write Preview
Loading…
Cancel
Save