Please find below the programming task. Request you to complete and share the code link [GitHub] Max in 2 days time Let us know if you have any questions. Kindly acknowledge..
Step 1: CRUD operations with validation
-
HTML Conversion - Expected pixel- Perfect output with responsiveness, can use any framework.
-
Add Contacts - On click of the "Add contact" button near the search box, a form can be shown inside the model to collect the required details from the user. Eg: Full name, Email, Phone number etc.
-
List Contacts - All the contacts available must be listed with their Name, Mail Id and Company name.
-
Edit Contact - User can edit the contact details with the help of the edit icon. An edit & chat icon can be placed anywhere suitably in the list table.
-
View Contact - On clicking the contact the user will be able to view the contact details of the person.
-
Need to achieve complete CRUD operations with Validation
Step 2: Client-side Message function.
1.HTML Conversion - Expected pixel-perfect output with responsiveness, can use any framework.
-
The username must be available in the top-right corner. On clicking the username, contact lists must show in the dropdown list. The user can select the desired contact person, now the user will be logged in as the selected person from the dropdown list. Hide that contact person in the bottom list. There is no need for authentication while selecting the contact.
-
Then the selected contact person(one who is logged in) can send a message to another contact person on the list. Ex: Contact A can send a message to Contact B by clicking on the chat icon in the contact list.
-
And also able to see the send and receive message data on the right side, create your own UI.
-
The other contact person(Contact B as in the example) must also be able to send and receive message data. Create your own UI for this process.
Note: If you feel Step 1 will take more time, you can jump directly to the second Step using static contact data.
Attachment : https://dribbble.com/shots/3223546-CRM-Dashboard-Contact-screen