update table swap fingerprint&keycard

src/Pages/Home.js

@@ -256,7 +256,7 @@ class Home extends Component {
 				response.data.queries[1].results[3].values,
 				response.data.queries[1].results[4].values,
 			];
-
+			console.log(response);
 			this.setState({
 				currentFeed,
 				fingerPrintFeed,
@@ -288,7 +288,7 @@ class Home extends Component {
 				table: this.getTable(
 					this.state.allDeviceInfo[this.state.allDevicesId.indexOf(deviceId || this.state.allDevicesId[0])]
 						.name,
-					[peopleFeed, revenueFeed, remoteFeed, currentFeed]
+					[peopleFeed, revenueFeed, remoteFeed, fingerPrintFeed, keycardFeed, currentFeed]
 				),
 			});
 		} catch (error) {
@@ -339,6 +339,7 @@ class Home extends Component {
 	};
 
 	getTable = (site, data) => {
+		console.log(data);
 		let table = [];
 		for (let i = 0, len = data[1].length; i < len; i++) {
 			let v = {
@@ -346,7 +347,9 @@ class Home extends Component {
 				people: data[0][i][1],
 				revenue: data[1][i][1],
 				remote: data[2][i][1],
-				current: data[3][i][1],
+				fingerPrint: data[3][i][1],
+				keycard: data[4][i][1],
+				current: data[5][i][1],
 				timestamp: moment(data[1][i][0]).format('D/M/YY HH:mm'),
 			};
 			table.unshift(v);
@@ -420,16 +423,6 @@ class Home extends Component {
 						/>
 						<DataCard
 							item={Data[4]}
-							feedData={keycardFeed}
-							datavalue={[
-								{ title: 'total', value: this.state.keycardTotal },
-								{ title: 'avg', value: this.state.keycardAvg },
-								{ title: 'max', value: this.state.keycardMax },
-								{ title: 'min', value: this.state.keycardMin },
-							]}
-						/>
-						<DataCard
-							item={Data[5]}
 							feedData={fingerPrintFeed}
 							datavalue={[
 								{ title: 'total', value: this.state.fingerPrintTotal },
@@ -438,6 +431,16 @@ class Home extends Component {
 								{ title: 'min', value: this.state.fingerPrintMin },
 							]}
 						/>
+						<DataCard
+							item={Data[5]}
+							feedData={keycardFeed}
+							datavalue={[
+								{ title: 'total', value: this.state.keycardTotal },
+								{ title: 'avg', value: this.state.keycardAvg },
+								{ title: 'max', value: this.state.keycardMax },
+								{ title: 'min', value: this.state.keycardMin },
+							]}
+						/>
 					</Row>
 					<Row>
 						<DataTable table={this.state.table} />

src/components/DataCard.js

@@ -42,19 +42,19 @@ const DataCard = props => {
 			yAxis: value[1],
 		}));
 	}
-
+	console.log(props.datavalue);
 	return (
 		<Col md={6}>
 			<Card
 				style={{
 					backgroundColor: data.backgroundColor,
 					color: 'white',
-					padding: '1em',
+					padding: '0.9em',
 					margin: '1.2em 0 0 0',
 				}}
 			>
 				<h4 style={{ textAlign: 'center' }}>{data.title}</h4>
-				<div style={{ width: '100%', height: 300, padding: '5px' }}>
+				<div style={{ width: '100%', height: 300 }}>
 					<ResponsiveContainer>
 						<AreaChart
 							data={dataObj}
@@ -116,7 +116,7 @@ const DataCard = props => {
 				)}
 			</Row>
 			<Row style={{ justifyContent: 'flex-end', marginRight: 1 }}>
-				<CSVLink data={data.detail} filename={data.title}>
+				<CSVLink data={props.datavalue} filename={data.title}>
 					<Button variant="outline-dark" style={{ marginTop: '.5em' }}>
 						<FaFileCsv style={{ margin: '0 2px 2px 0' }} />
 						Export to CSV

src/components/DataTable.js

@@ -22,6 +22,7 @@ export default class DataTable extends React.PureComponent {
 			this.setState({
 				data: data1,
 			});
+			console.log(data1);
 		}
 	};
 
@@ -39,6 +40,8 @@ export default class DataTable extends React.PureComponent {
 					<td>{item.people}</td>
 					<td>{item.revenue}</td>
 					<td>{item.remote}</td>
+					<td>{item.fingerPrint}</td>
+					<td>{item.keycard}</td>
 					<td>{item.current}</td>
 					<td>{item.timestamp}</td>
 				</tr>
@@ -62,6 +65,8 @@ export default class DataTable extends React.PureComponent {
 							<th>People</th>
 							<th>Revenue</th>
 							<th>Remote</th>
+							<th>Fingerprint</th>
+							<th>Keycard</th>
 							<th>Current</th>
 							<th>Timestamp</th>
 						</tr>