ruidy/devbook_ts
1
0
Fork 0
mirror of https://github.com/rjNemo/devbook_ts synced 2026-06-12 13:36:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

experience credential table in dashboard

Browse source
This commit is contained in:
Ruidy Nemausat 2020-05-12 19:05:33 +02:00
parent c177d7749d
commit 6534654908
2 changed files with 24 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/pages/Dashboard.tsx
View file

@ -1,9 +1,12 @@
import React, {FC} from 'react'; import React, {FC} from 'react';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import Header from '../components/Header';
import DevFull, {dummyDevFull as dev} from '../models/DevFull';
import {faUserCircle, faGraduationCap} from '@fortawesome/free-solid-svg-icons'; import {faUserCircle, faGraduationCap} from '@fortawesome/free-solid-svg-icons';
import {faBlackTie} from '@fortawesome/free-brands-svg-icons'; import {faBlackTie} from '@fortawesome/free-brands-svg-icons';
import Header from '../components/Header';
import DevFull, {dummyDevFull as dev} from '../models/DevFull';
import Experience from '../models/Experience';
import {getTimePeriod} from '../types/TimePeriod';
const Dashboard: FC<DevFull> = () => { const Dashboard: FC<DevFull> = () => {
return ( return (
@ -20,6 +23,7 @@ const Dashboard: FC<DevFull> = () => {
<FontAwesomeIcon icon={faGraduationCap} /> Add Education <FontAwesomeIcon icon={faGraduationCap} /> Add Education
</a> </a>
</div> </div>
<h2 className="my-2">Experience Credentials</h2> <h2 className="my-2">Experience Credentials</h2>
<table className="table"> <table className="table">
<thead> <thead>
@ -29,26 +33,21 @@ const Dashboard: FC<DevFull> = () => {
<th className="hide-sm">Years</th> <th className="hide-sm">Years</th>
<th></th> <th></th>
</tr> </tr>
<tbody>
<tr>
<td>Microsoft</td>
<td className="hide-sm">Senior Developer</td>
<td className="hide-sm">Oct 2011 - Current</td>
<td>
<button className="btn btn-danger">Delete</button>
</td>
</tr>
<tr>
<td>Sun Microsystems</td>
<td className="hide-sm">System Admin</td>
<td className="hide-sm">Oct 2004 - Nov 2010</td>
<td>
<button className="btn btn-danger">Delete</button>
</td>
</tr>
</tbody>
</thead> </thead>
<tbody>
{dev.experiences.map((exp: Experience, i: number) => (
<tr>
<td>{exp.company}</td>
<td className="hide-sm">{exp.position}</td>
<td className="hide-sm">{getTimePeriod(exp.from, exp.to)}</td>
<td>
<button className="btn btn-danger">Delete</button>
</td>
</tr>
))}
</tbody>
</table> </table>
<h2 className="my-2">Education Credentials</h2> <h2 className="my-2">Education Credentials</h2>
<table className="table"> <table className="table">
<thead> <thead>

5
src/types/TimePeriod.ts
View file

@ -10,6 +10,11 @@ const parseDate = (date: TimePeriod): string => {
return moment(date).format('MMM. YYYY'); return moment(date).format('MMM. YYYY');
}; };
/**
* Formats a time period assignment: experience or education.
* @param from Start of the assignment. Must be a Date
* @param to End of the assignment. Can be "Current"
*/
export const getTimePeriod = (from: TimePeriod, to: TimePeriod): string => export const getTimePeriod = (from: TimePeriod, to: TimePeriod): string =>
`${parseDate(from)} - ${parseDate(to)}`; `${parseDate(from)} - ${parseDate(to)}`;