Hey could you helo me to create a profile component for dealer: base on below list of json file:
{
dealer: {
dealership_type: "authorized",
dealership_name: "City Auto Wheels",
registered_address: "123 MG Road, Sector 44",
city: "Gurgaon",
state: "Haryana",
pincode: "122003",
gps_location: "28.4595,77.0266",
operations_contact_name: "Rajeev Kumar",
operations_contact_phone: "9876543210",
operations_contact_alt: "9876500000",
email: "contact@cityauto.com",
owner_name: "Suresh Mehta",
owner_contact: "9812345678",
owner_email: "suresh@cityauto.com",
escalation_name: "Priya Sharma",
escalation_contact: "9911223344",
escalation_email: "priya@cityauto.com",
pan_number: "ABCDE1234F",
gst_number: "29ABCDE1234F1Z5",
annual_revenue: "₹5 Cr",
support_contact: "1800123456"
created_by : "vinay"
},
documents: {
gst_certificate: "image url path",
pan_card_file: "image url path",
address_proof:"image url path",
incorporation_certificate:"image urk path",
},
finance_info: {
bank_name: "HDFC Bank",
account_number: "50100234567891",
ifsc_code: "HDFC0001234",
finance_contact_name: "Megha Verma",
finance_contact_email: "megha@cityauto.com",
finance_contact_phone: "9988776655",
cancelled_cheque_file: "https://qcvfigvoximnqdakvsok.supabase.co/storage/v1/object/public/dealers//Moshi_Moshi_cancelled-cheque"
},
oems: [
{
oem_name: "Maruti Suzuki",
vehicle_segment: "four_wheeler"
},
{
oem_name: "Hero MotoCorp",
vehicle_segment: "two_wheeler"
}
],
sub_dealerships: [
{
name: "City Auto - Sector 56",
location: "Sector 56, Gurgaon",
contact: "9988771122",
oem: "Maruti Suzuki",
gstin: "29XYZ1234F1Z5",
gst_copy: File, // image/jpeg/png
address: "Plot 15, Sector 56"
},
{
name: "City Auto - Sohna",
location: "Sohna Road",
contact: "8877665544",
oem: "Hero MotoCorp",
gstin: "29XYZ1234F1Z6",
gst_copy:"image url path",
address: "Sohna Road, Gurgaon"
}
],
employees: [
{
name: "Ankit Chauhan",
role: "Sales Manager",
contact_number: "9990001122",
email: "ankit@cityauto.com"
},
{
name: "Nisha Rawat",
role: "Service Head",
contact_number: "9911223344",
email: "nisha@cityauto.com"
}
]
}
I'll create a comprehensive dealer profile component that displays all the information from your JSON data in a well-organized, professional layout.
I've created a comprehensive dealer profile with the following features:
Overview Tab:
Documents Tab:
Finance Tab:
Locations Tab:
Team Tab:
The component uses a tabbed interface to organize the large amount of information in a user-friendly way. Each section is contained in cards with appropriate headers and descriptions.