import { Card, List } from "flowbite-react";
import { FC } from "react";
import { TSmacResellerSchema } from "../forms/schema/mac-reseller";

type props = {
  macReseller: TSmacResellerSchema;
};

const MacResellerBasicView: FC<props> = ({ macReseller }) => {
  return (
    <>
      <div className="p-">
        <Card className="rounded-none">
          <div className="grid grid-cols-1 gap-0 p-2 relative md:grid-cols-2 lg:grid-cols-2 mb-5">
            <div>
              <List className="list-none">
                <List.Item>
                  <h2 className="font-bold text-xl text-gray-800">
                    Basic Information
                  </h2>
                  <List ordered nested className="list-none p-0">
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Reseller Id
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.reseller_id}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Name
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.name}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Phone Number
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.phone}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Email
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.email}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Zone
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.zone?.name}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Network
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.network?.name}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Father Name
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.father_name}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Mother Name
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.mother_name}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Gender
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.gender}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Marital Status
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>
                        {macReseller?.marital_status === 1
                          ? "Marred"
                          : "Unmarred"}
                      </span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        NID
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.nid}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Social media account
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.social_media_account}</span>
                    </List.Item>
                    <List.Item>
                      <div className="flex">
                        <div>
                          <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                            Curren Address
                          </span>
                          <span className="font-bold text-gray-900 mr-2">
                            :
                          </span>
                        </div>
                        <div>
                          <span>{macReseller?.present_address}</span>
                        </div>
                      </div>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Permanent Address
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.permanent_address}</span>
                    </List.Item>
                  </List>
                </List.Item>
              </List>
            </div>
            <div>
              <List className="list-none">
                <List.Item>
                  <h2 className="font-bold text-xl text-gray-800">&nbsp;</h2>
                  <List ordered nested className="list-none p-0">
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Username
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.username}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Password
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.password}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Thana/Upazila
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>
                        {macReseller?.upazilas?.map(
                          (items: any) => items?.name
                        )}
                      </span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Over due amount
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.over_due_amount}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Billing Type
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller.billing_type}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Auto Recharge
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>
                        {macReseller.auto_recharge === 1 ? "Yes" : "No"}
                      </span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Terminate Hour
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller.terminate_hour}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Terminate Minute
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller.terminate_minute}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Serial Start From
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.serial_start_from}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Prefix
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.prefix}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Blood Group
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.blood_group}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Date Of Birth
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.date_of_birth}</span>
                    </List.Item>
                    <List.Item>
                      <span className="label text-md font-medium text-gray-800 w-36 inline-block">
                        Join date
                      </span>
                      <span className="font-bold text-gray-900 mr-2">:</span>
                      <span>{macReseller?.join_date}</span>
                    </List.Item>
                  </List>
                </List.Item>
              </List>
            </div>
          </div>
        </Card>
      </div>
    </>
  );
};

export default MacResellerBasicView;
