Hino_Thamrin/components/others/Sales/Sales.js

import React from 'react';
import Link from 'next/link';
import * as Icon from 'react-feather';

const Sales = function ({ company, sales, ...props }) {

    const DataSales = sales.map((data) => {
        return (
            <div className="col-lg-3 col-md-6">
                <div className="single-team">
                    <img src={(data.DP.data)?`/api/util?img=${encodeURIComponent(data.DP.data.attributes.url)}`:`/images/default_sales_DP/${company}.png`} alt="image" />

                    <div className="team-content">
                        <div className="team-info">
                            <span>{(data.Name)?(data.Name.length>20)?data.Name.substring(0,20):data.Name:''}</span><br/>
                            <span>Sales Consultant</span>
                        </div>
                        <ul>
                            <li>
                            <h6>{data.Telp}</h6>
                            </li>
                        </ul>
                        <ul>
                            <li>
                            <a href={`tel:${data.Telp}`}><Icon.Phone /> </a>
                            </li>
                            <li>
                            <a href={`https://wa.me/${data.Telp}`}> <Icon.MessageCircle /></a>
                           
                            </li>
                        </ul>
                        {/* <ul>
                            <li>
                                <Link href='/#'>
                                    <a target="_blank"><Icon.Facebook /></a>
                                </Link>
                            </li>
                            <li>
                                <Link href='/#'>
                                    <a target="_blank"><Icon.Twitter /></a>
                                </Link>
                            </li>
                            <li>
                                <Link href='/#'>
                                    <a target="_blank"><Icon.Linkedin /></a>
                                </Link>
                            </li>
                            <li>
                                <Link href='/#'>
                                    <a target="_blank"><Icon.Gitlab /></a>
                                </Link>
                            </li>
                        </ul> */}
                        <br /><br />
                        <Link href={"/sales?s="+data.id}>
                            <a className="btn btn-primary">Details</a>
                        </Link>
                    </div>
                </div>
            </div>
        )
    })
    return (
        <div className="team-area repair-team-area pt-80 pb-50 bg-f9f6f6">
            <div className="container">
                <div className="section-title">
                    <h2>Mercedes Benz Sales</h2>
                    <div className="bar"></div>
                </div>

                <div className="row justify-content-center">
                    {DataSales}
                </div>
            </div>
        </div>
    )
}

export default Sales;