<template>
    <lightning-card title="My Contact Record" icon-name="standard:contact">
        <template if:true={contact.data}>
            <div class="slds-m-around_medium">
                <div style=" border-radius: 50%;"><img src={img__c} width="100" height="100"/></div>
                <p>{name}</p>
                <p>{title}</p>
                <p><lightning-formatted-phone value={phone}></lightning-formatted-phone></p>
                <p><lightning-formatted-email value={email}></lightning-formatted-email></p>
            </div>
        </template>
        
    </lightning-card>
</template>

import { LightningElement, api, wire } from 'lwc';
import { getRecord } from 'lightning/uiRecordApi';

const FIELDS = [
    'Contact.Name',
    'Contact.Title',
    'Contact.Phone',
    'Contact.Email',
    'Contact.img__c'
];

export default class EmployeeCard extends LightningElement {
    @api recordId;

    @wire(getRecord, { recordId: '$recordId', fields: FIELDS })
    contact;

    get name() {
        return this.contact.data.fields.Name.value;
    }

    get title() {
        return this.contact.data.fields.Title.value;
    }

    get phone() {
        return this.contact.data.fields.Phone.value;
    }

    get email() {
        return this.contact.data.fields.Email.value;
    }
    get email() {
        return this.contact.data.fields.img__c.value;
    }
}