parent
78c7dd7b80
commit
7ade942703
5 changed files with 384 additions and 286 deletions
@ -0,0 +1,345 @@ |
|||||||
|
import React from "react"; |
||||||
|
|
||||||
|
const EditRow = ({ row, columns }) => { |
||||||
|
console.log(columns); |
||||||
|
|
||||||
|
return ( |
||||||
|
<div |
||||||
|
className="w-full flex flex-row items-center border-r-4 border-blue-600 p-2" |
||||||
|
style={{ backgroundColor: "#FAFBFF" }} |
||||||
|
> |
||||||
|
<div className="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" }} |
||||||
|
> |
||||||
|
نام و نام خانوادگی: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.name} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
تاریخ سفارش: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.order_date} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
مبلغ سفارش: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.order_price} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
شماره سفارش: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.order_number} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
شغل کاربر: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.user_job} |
||||||
|
/> |
||||||
|
</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> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
// value={columns[5].Cell({ value: row.order_status })}
|
||||||
|
value={row.order_status} |
||||||
|
/> |
||||||
|
</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> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
// {columns[6].Cell({ value: row.order_level })}
|
||||||
|
value={row.order_level} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
محل تولد: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.birth_place} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
تلفن محل کار: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.office_phone} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
تحصیلات: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.education} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
تاریخ تولد: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.birth_day} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
شغل: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.job} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
دانشگاه: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.uni} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
رشته تحصیلی: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-fit mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.field_study} |
||||||
|
/> |
||||||
|
</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" }} |
||||||
|
> |
||||||
|
اخلاق: |
||||||
|
</p> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-full mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.behaviour} |
||||||
|
/> |
||||||
|
</div> |
||||||
|
{/* 16 */} |
||||||
|
<div className=" 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> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
style={{ backgroundColor: "#F9FBFF", borderColor: "#B5D6FF" }} |
||||||
|
className="w-full mr-1 text-black text-xs rounded-sm border p-1 focus:outline-none focus:border-blue-200 focus:ring focus:ring-blue-200 focus:ring-opacity-20" |
||||||
|
value={row.address} |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
|
|
||||||
|
// {features.map((feature, index) => (
|
||||||
|
|
||||||
|
export default EditRow; |
||||||
|
|
||||||
|
{ |
||||||
|
/* <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" }} |
||||||
|
> |
||||||
|
حذف |
||||||
|
</button> |
||||||
|
<button |
||||||
|
className="border rounded w-8/12 text-xs py-2 bg-white" |
||||||
|
style={{ borderColor: "#65A9FF", color: "#65A9FF" }} |
||||||
|
> |
||||||
|
جزیات بیشتر |
||||||
|
</button> |
||||||
|
</div> */ |
||||||
|
} |
Loading…
Reference in new issue