checkin

.eslintcache

-[{"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\index.js":"1","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\reportWebVitals.js":"2","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\App.js":"3","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\RootView.js":"4","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Login\\LoginScreen.js":"5","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\HomeContainer.js":"6","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\HomeView.js":"7","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\ButtonCheckIn.js":"8"},{"size":517,"mtime":1610422519446,"results":"9","hashOfConfig":"10"},{"size":375,"mtime":1610422519447,"results":"11","hashOfConfig":"10"},{"size":172,"mtime":1610423707928,"results":"12","hashOfConfig":"10"},{"size":493,"mtime":1610422519445,"results":"13","hashOfConfig":"10"},{"size":3468,"mtime":1610422814066,"results":"14","hashOfConfig":"10"},{"size":135,"mtime":1610423599300,"results":"15","hashOfConfig":"10"},{"size":1931,"mtime":1610520976695,"results":"16","hashOfConfig":"10"},{"size":543,"mtime":1610513346777,"results":"17","hashOfConfig":"10"},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"20"},"2tm0q9",{"filePath":"21","messages":"22","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"20"},{"filePath":"23","messages":"24","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"25","usedDeprecatedRules":"20"},{"filePath":"26","messages":"27","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":"28","usedDeprecatedRules":"20"},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"20"},{"filePath":"31","messages":"32","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"20"},{"filePath":"33","messages":"34","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"35","messages":"36","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"37","usedDeprecatedRules":"20"},"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\index.js",[],["38","39"],"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\reportWebVitals.js",[],"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\App.js",["40"],"import RootView from \"./View/RootView\";\r\nimport HomeContainer from \"./View/Home/HomeContainer\";\r\n\r\nfunction App() {\r\n  return <HomeContainer />;\r\n}\r\n\r\nexport default App;\r\n","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\RootView.js",["41","42","43","44","45"],"import { BrowserRouter, Switch, Route, Link } from \"react-router-dom\";\r\nimport { useHistory, Redirect } from \"react-router-dom\";\r\nimport React, { useEffect, useState } from \"react\";\r\nimport LoginScreen from \"./Login/LoginScreen\";\r\n\r\nconst RootView = () => {\r\n  let history = useHistory();\r\n  return (\r\n    <BrowserRouter>\r\n      <Switch>\r\n        <Route exact path=\"/\">\r\n          <LoginScreen />\r\n        </Route>\r\n      </Switch>\r\n    </BrowserRouter>\r\n  );\r\n};\r\n\r\nexport default RootView;\r\n","C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Login\\LoginScreen.js",[],"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\HomeContainer.js",[],"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\HomeView.js",["46","47"],"C:\\Users\\MAY-4\\Desktop\\CheckInWeb\\checkin_hrm\\src\\View\\Home\\ButtonCheckIn.js",["48","49"],"import React from \"react\";\r\nimport { bounce, fadeIn, bounceIn } from \"react-animations\";\r\nimport Radium, { StyleRoot } from \"radium\";\r\n\r\nconst styles = {\r\n  bounce: {\r\n    animation: \"x 1s\",\r\n    animationName: Radium.keyframes(bounceIn, \"bounceIn\"),\r\n    animationDuration: \"10s\",\r\n  },\r\n};\r\n\r\nclass ButtonCheckIn extends React.Component {\r\n  render() {\r\n    return (\r\n      <StyleRoot>\r\n        <div className=\"test\" style={styles.bounce}>\r\n          aaa\r\n        </div>\r\n      </StyleRoot>\r\n    );\r\n  }\r\n}\r\n\r\nexport default ButtonCheckIn;\r\n",{"ruleId":"50","replacedBy":"51"},{"ruleId":"52","replacedBy":"53"},{"ruleId":"54","severity":1,"message":"55","line":1,"column":8,"nodeType":"56","messageId":"57","endLine":1,"endColumn":16},{"ruleId":"54","severity":1,"message":"58","line":1,"column":40,"nodeType":"56","messageId":"57","endLine":1,"endColumn":44},{"ruleId":"54","severity":1,"message":"59","line":2,"column":22,"nodeType":"56","messageId":"57","endLine":2,"endColumn":30},{"ruleId":"54","severity":1,"message":"60","line":3,"column":17,"nodeType":"56","messageId":"57","endLine":3,"endColumn":26},{"ruleId":"54","severity":1,"message":"61","line":3,"column":28,"nodeType":"56","messageId":"57","endLine":3,"endColumn":36},{"ruleId":"54","severity":1,"message":"62","line":7,"column":7,"nodeType":"56","messageId":"57","endLine":7,"endColumn":14},{"ruleId":"54","severity":1,"message":"63","line":2,"column":10,"nodeType":"56","messageId":"57","endLine":2,"endColumn":20},{"ruleId":"54","severity":1,"message":"64","line":5,"column":8,"nodeType":"56","messageId":"57","endLine":5,"endColumn":21},{"ruleId":"54","severity":1,"message":"65","line":2,"column":10,"nodeType":"56","messageId":"57","endLine":2,"endColumn":16},{"ruleId":"54","severity":1,"message":"66","line":2,"column":18,"nodeType":"56","messageId":"57","endLine":2,"endColumn":24},"no-native-reassign",["67"],"no-negated-in-lhs",["68"],"no-unused-vars","'RootView' is defined but never used.","Identifier","unusedVar","'Link' is defined but never used.","'Redirect' is defined but never used.","'useEffect' is defined but never used.","'useState' is defined but never used.","'history' is assigned a value but never used.","'makeStyles' is defined but never used.","'ButtonCheckIn' is defined but never used.","'bounce' is defined but never used.","'fadeIn' is defined but never used.","no-global-assign","no-unsafe-negation"]
+[{"D:\\checkin_hrm\\src\\index.js":"1","D:\\checkin_hrm\\src\\reportWebVitals.js":"2","D:\\checkin_hrm\\src\\App.js":"3","D:\\checkin_hrm\\src\\View\\RootView.js":"4","D:\\checkin_hrm\\src\\View\\Home\\HomeContainer.js":"5","D:\\checkin_hrm\\src\\View\\Home\\HomeView.js":"6","D:\\checkin_hrm\\src\\View\\Login\\LoginScreen.js":"7","D:\\checkin_hrm\\src\\View\\Home\\ButtonCheckIn.js":"8"},{"size":500,"mtime":1607323871389,"results":"9","hashOfConfig":"10"},{"size":362,"mtime":1607323871389,"results":"11","hashOfConfig":"10"},{"size":167,"mtime":1610544010654,"results":"12","hashOfConfig":"10"},{"size":615,"mtime":1610551066775,"results":"13","hashOfConfig":"10"},{"size":135,"mtime":1610543552792,"results":"14","hashOfConfig":"10"},{"size":1446,"mtime":1610557883581,"results":"15","hashOfConfig":"10"},{"size":3468,"mtime":1610543552803,"results":"16","hashOfConfig":"10"},{"size":543,"mtime":1610543552786,"results":"17","hashOfConfig":"10"},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1t40iya",{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"22","messages":"23","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"24","messages":"25","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"26","messages":"27","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"28","messages":"29","errorCount":0,"warningCount":10,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"30","messages":"31","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"32","messages":"33","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"D:\\checkin_hrm\\src\\index.js",[],"D:\\checkin_hrm\\src\\reportWebVitals.js",[],"D:\\checkin_hrm\\src\\App.js",["34"],"D:\\checkin_hrm\\src\\View\\RootView.js",["35","36","37","38","39"],"D:\\checkin_hrm\\src\\View\\Home\\HomeContainer.js",[],"D:\\checkin_hrm\\src\\View\\Home\\HomeView.js",["40","41","42","43","44","45","46","47","48","49"],"D:\\checkin_hrm\\src\\View\\Login\\LoginScreen.js",[],"D:\\checkin_hrm\\src\\View\\Home\\ButtonCheckIn.js",["50","51"],{"ruleId":"52","severity":1,"message":"53","line":2,"column":8,"nodeType":"54","messageId":"55","endLine":2,"endColumn":21},{"ruleId":"52","severity":1,"message":"56","line":1,"column":40,"nodeType":"54","messageId":"55","endLine":1,"endColumn":44},{"ruleId":"52","severity":1,"message":"57","line":2,"column":22,"nodeType":"54","messageId":"55","endLine":2,"endColumn":30},{"ruleId":"52","severity":1,"message":"58","line":3,"column":17,"nodeType":"54","messageId":"55","endLine":3,"endColumn":26},{"ruleId":"52","severity":1,"message":"59","line":3,"column":28,"nodeType":"54","messageId":"55","endLine":3,"endColumn":36},{"ruleId":"52","severity":1,"message":"60","line":8,"column":7,"nodeType":"54","messageId":"55","endLine":8,"endColumn":14},{"ruleId":"52","severity":1,"message":"61","line":2,"column":10,"nodeType":"54","messageId":"55","endLine":2,"endColumn":20},{"ruleId":"52","severity":1,"message":"62","line":6,"column":3,"nodeType":"54","messageId":"55","endLine":6,"endColumn":8},{"ruleId":"52","severity":1,"message":"63","line":7,"column":3,"nodeType":"54","messageId":"55","endLine":7,"endColumn":7},{"ruleId":"52","severity":1,"message":"64","line":8,"column":3,"nodeType":"54","messageId":"55","endLine":8,"endColumn":13},{"ruleId":"52","severity":1,"message":"65","line":12,"column":8,"nodeType":"54","messageId":"55","endLine":12,"endColumn":21},{"ruleId":"52","severity":1,"message":"66","line":15,"column":10,"nodeType":"54","messageId":"55","endLine":15,"endColumn":15},{"ruleId":"52","severity":1,"message":"67","line":15,"column":17,"nodeType":"54","messageId":"55","endLine":15,"endColumn":25},{"ruleId":"68","severity":1,"message":"69","line":25,"column":16,"nodeType":"70","messageId":"71","endLine":25,"endColumn":18},{"ruleId":"72","severity":1,"message":"73","line":33,"column":6,"nodeType":"74","endLine":33,"endColumn":8,"suggestions":"75"},{"ruleId":"68","severity":1,"message":"69","line":49,"column":21,"nodeType":"70","messageId":"71","endLine":49,"endColumn":23},{"ruleId":"52","severity":1,"message":"76","line":2,"column":10,"nodeType":"54","messageId":"55","endLine":2,"endColumn":16},{"ruleId":"52","severity":1,"message":"77","line":2,"column":18,"nodeType":"54","messageId":"55","endLine":2,"endColumn":24},"no-unused-vars","'HomeContainer' is defined but never used.","Identifier","unusedVar","'Link' is defined but never used.","'Redirect' is defined but never used.","'useEffect' is defined but never used.","'useState' is defined but never used.","'history' is assigned a value but never used.","'makeStyles' is defined but never used.","'Paper' is defined but never used.","'Card' is defined but never used.","'Typography' is defined but never used.","'ButtonCheckIn' is defined but never used.","'state' is assigned a value but never used.","'setState' is assigned a value but never used.","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'getPosition'. Either include it or remove the dependency array.","ArrayExpression",["78"],"'bounce' is defined but never used.","'fadeIn' is defined but never used.",{"desc":"79","fix":"80"},"Update the dependencies array to be: [getPosition]",{"range":"81","text":"82"},[762,764],"[getPosition]"]
\ No newline at end of file

package-lock.json

@@ -3820,6 +3820,11 @@
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
+    "bowser": {
+      "version": "1.9.4",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz",
+      "integrity": "sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ=="
+    },
     "brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -4825,6 +4830,15 @@
         }
       }
     },
+    "css-in-js-utils": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
+      "integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
+      "requires": {
+        "hyphenate-style-name": "^1.0.2",
+        "isobject": "^3.0.1"
+      }
+    },
     "css-line-break": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-1.0.1.tgz",
@@ -6524,6 +6538,11 @@
         "strip-eof": "^1.0.0"
       }
     },
+    "exenv": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+    },
     "exit": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz",
@@ -8082,6 +8101,15 @@
       "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
       "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew=="
     },
+    "inline-style-prefixer": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-4.0.2.tgz",
+      "integrity": "sha512-N8nVhwfYga9MiV9jWlwfdj1UDIaZlBFu4cJSJkIr7tZX7sHpHhGR5su1qdpW+7KPL8ISTvCIkcaFi/JdBknvPg==",
+      "requires": {
+        "bowser": "^1.7.3",
+        "css-in-js-utils": "^2.0.0"
+      }
+    },
     "internal-ip": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-4.3.0.tgz",
@@ -12490,6 +12518,27 @@
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
       "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ=="
     },
+    "radium": {
+      "version": "0.26.1",
+      "resolved": "https://registry.npmjs.org/radium/-/radium-0.26.1.tgz",
+      "integrity": "sha512-v2DvtBmy5w01hKrCAZmIkEHOMHmj6AeKI9115W2GOCExosP6+7PXV9LHPjZaiOkw3LP4FGvqhNaAWJhcQzoU4g==",
+      "requires": {
+        "exenv": "^1.2.1",
+        "hoist-non-react-statics": "3.3.0",
+        "inline-style-prefixer": "^4.0.0",
+        "prop-types": "^15.5.8"
+      },
+      "dependencies": {
+        "hoist-non-react-statics": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz",
+          "integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==",
+          "requires": {
+            "react-is": "^16.7.0"
+          }
+        }
+      }
+    },
     "raf": {
       "version": "3.4.1",
       "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
@@ -12547,6 +12596,11 @@
         "object-assign": "^4.1.1"
       }
     },
+    "react-animations": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/react-animations/-/react-animations-1.0.0.tgz",
+      "integrity": "sha512-ePPpVgdKnNEXm+LP1ww5s3n0JzebBw9QdRfxRqogzeg1PDIn6kf0pmvgeTeVZQXXpGmHImkIeTiaQR1O6xjntA=="
+    },
     "react-app-polyfill": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-2.0.0.tgz",

src/App.js

@@ -2,7 +2,7 @@ import RootView from "./View/RootView";
 import HomeContainer from "./View/Home/HomeContainer";
 
 function App() {
-  return <HomeContainer />;
+  return <RootView />;
 }
 
 export default App;

src/View/Home/HomeView.js

-import React from "react";
+import React, { useState, useEffect } from "react";
 import { makeStyles } from "@material-ui/core/styles";
-import { Container, Grid, Paper, Card, Typography } from "@material-ui/core";
+import {
+  Container,
+  Grid,
+  Paper,
+  Card,
+  Typography,
+  Fab,
+} from "@material-ui/core";
 
 import ButtonCheckIn from "./ButtonCheckIn";
 
 const HomeView = (props) => {
+  const [state, setState] = useState({
+    latitude: null,
+    longitude: null,
+  });
+  const [status, setStatus] = useState(0);
+  const getPosition = () => {
+    navigator.geolocation.getCurrentPosition((position) => {
+      console.log(position.coords.longitude);
+      console.log(position.coords.latitude);
+    });
+    if (status == 0) {
+      setStatus(1);
+    } else {
+      setStatus(0);
+    }
+  };
+  useEffect(() => {
+    getPosition();
+  }, []);
   return (
-    <Container fixed>
+    <Container fixed style={{ height: "100vh" }}>
       <div style={{ marginTop: 50 }} />
-      <Grid xs={12} spacing={3} container direction="row">
-        <Grid item xs={4}>
-          <Paper>
-            <Grid justify="center" container alignItems="center">
-              <Grid
-                style={{
-                  width: 100,
-                  height: 100,
-                  borderRadius: 50,
-                  backgroundColor: "red",
-                  justifyContent: "center",
-                  alignItems: "center",
-                }}
-              >
-                <Typography style={{ textAlign: "center" }}>CHECKIN</Typography>
-              </Grid>
-            </Grid>
-          </Paper>
-        </Grid>
-        <Grid item xs={8}>
-          <Paper>RIght</Paper>
-        </Grid>
-      </Grid>
-
-      <Grid
-        xs={12}
-        spacing={3}
-        justify="space-between"
-        container
-        direction="row"
-        alignItems="center"
-      >
-        <Grid item xs={6}>
-          Báo cáo
-        </Grid>
-        <Grid item xs={6}>
-          RIght
-        </Grid>
-      </Grid>
-      <Grid
-        xs={12}
-        spacing={3}
-        justify="space-between"
-        container
-        direction="row"
-        alignItems="center"
-      >
-        <Grid item xs={3}>
-          <Card> Hợp lệ</Card>
-        </Grid>
-        <Grid item xs={3}>
-          <Card>Đi muộn</Card>
-        </Grid>
-        <Grid item xs={3}>
-          <Card>Chờ xử lý</Card>
-        </Grid>
-        <Grid item xs={3}>
-          <Card>Nghỉ</Card>
-        </Grid>
+      <div style={{ textAlign: "center", fontSize: "35px" }}>
+        Tên: Lê Trọng Trí
+      </div>
+      <br />
+      <Grid container style={{ height: "100vh", justifyContent: "center" }}>
+        <Fab
+          color="secondary"
+          aria-label="edit"
+          style={{ width: "20vw", height: "20vw" }}
+          onClick={getPosition}
+        >
+          <span style={{ fontSize: "3vw" }}>
+            {status == 0 ? "Checkin" : "Checkout"}
+          </span>
+        </Fab>
       </Grid>
     </Container>
   );

src/View/RootView.js

@@ -2,6 +2,7 @@ import { BrowserRouter, Switch, Route, Link } from "react-router-dom";
 import { useHistory, Redirect } from "react-router-dom";
 import React, { useEffect, useState } from "react";
 import LoginScreen from "./Login/LoginScreen";
+import HomeScreen from "./Home/HomeContainer";
 
 const RootView = () => {
   let history = useHistory();
@@ -11,6 +12,9 @@ const RootView = () => {
         <Route exact path="/">
           <LoginScreen />
         </Route>
+        <Route path="/home">
+          <HomeScreen />
+        </Route>
       </Switch>
     </BrowserRouter>
   );