├── src
├── containers
│ ├── adminLogin.js
│ ├── logo.css
│ ├── login.js
│ ├── signup.js
│ ├── dashboard.js
│ ├── viewCrimes.js
│ ├── addReports.js
│ ├── loadMyIncidents.js
│ ├── viewAllCrimes.js
│ ├── requiredBlood.js
│ ├── adminContainer.js
│ └── rootContainer.js
├── index.css
├── components
│ ├── login
│ │ ├── login.css
│ │ └── login.js
│ ├── requiredBlood
│ │ ├── requiredBlood.css
│ │ └── requiredBlood.js
│ ├── signUp
│ │ ├── signup.css
│ │ └── signup.js
│ ├── reports
│ │ ├── logo.css
│ │ ├── loadMyIncidents.js
│ │ ├── addReports.js
│ │ ├── viewCrimes.js
│ │ └── viewAllCrimes.js
│ └── dashboard
│ │ ├── dashboard.js
│ │ └── adminDashboard.js
├── App.test.js
├── store
│ ├── reducers
│ │ ├── rootReducer.js
│ │ └── applicationReducer.js
│ ├── actions
│ │ ├── decrementCounter.js
│ │ ├── loadUserData.js
│ │ ├── loadInitialState.js
│ │ ├── childAddedHandler.js
│ │ ├── logout.js
│ │ ├── addComment.js
│ │ ├── addReportRequest.js
│ │ ├── requiredBlood.js
│ │ ├── updateRequest.js
│ │ ├── login.js
│ │ ├── loadCrimes.js
│ │ ├── viewAllCrimeRequest.js
│ │ ├── donateBlood.js
│ │ ├── signup.js
│ │ ├── loadMyIncidents.js
│ │ └── actionTypes.js
│ └── store.js
├── App.css
├── configs
│ └── dbconfigs.js
├── App.js
├── index.js
└── logo.svg
├── .firebaserc
├── public
├── favicon.ico
└── index.html
├── database.rules.json
├── firebase.json
├── .gitignore
└── package.json
/src/containers/adminLogin.js:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/.firebaserc:
--------------------------------------------------------------------------------
1 | {
2 | "projects": {
3 | "default": "cm-reporting-system"
4 | }
5 | }
6 |
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | padding: 0;
4 | font-family: sans-serif;
5 | }
6 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Abdul-majid-ashrafi/Crime-System/master/public/favicon.ico
--------------------------------------------------------------------------------
/database.rules.json:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | ".read": true,
4 | ".write": "auth != null"
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/src/components/login/login.css:
--------------------------------------------------------------------------------
1 | .main-login-div{
2 | width: 50%;
3 | margin: 10% auto;
4 | }
5 |
6 | .full-width-container{
7 | width: 100% !important;
8 | }
--------------------------------------------------------------------------------
/src/containers/logo.css:
--------------------------------------------------------------------------------
1 | .logoImage{
2 | max-width: 200px;
3 | margin:20px auto;
4 | display: block;
5 | }
6 |
7 | .disbaledImage{
8 | cursor: default !important;
9 | }
10 |
11 | .report-table{
12 | width: 90%;
13 | }
--------------------------------------------------------------------------------
/src/App.test.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 | import App from './App';
4 |
5 | it('renders without crashing', () => {
6 | const div = document.createElement('div');
7 | ReactDOM.render(, div);
8 | });
9 |
--------------------------------------------------------------------------------
/src/store/reducers/rootReducer.js:
--------------------------------------------------------------------------------
1 | import { combineReducers } from 'redux';
2 | import { applicationReducer } from './applicationReducer';
3 |
4 | const rootReducer = combineReducers({
5 | application: applicationReducer
6 | });
7 |
8 | export default rootReducer;
--------------------------------------------------------------------------------
/firebase.json:
--------------------------------------------------------------------------------
1 | {
2 | "database": {
3 | "rules": "database.rules.json"
4 | },
5 | "hosting": {
6 | "public": "build",
7 | "rewrites": [
8 | {
9 | "source": "**",
10 | "destination": "/index.html"
11 | }
12 | ]
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/src/components/requiredBlood/requiredBlood.css:
--------------------------------------------------------------------------------
1 | .table-main{
2 | min-height: 500;
3 | width: 90%;
4 | margin: 20px auto;
5 | text-align: 'center';
6 | display: 'inline-block';
7 | }
8 |
9 | .blood-type{
10 | width:50%;
11 | margin: 0px auto;
12 | }
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 |
6 | # testing
7 | /coverage
8 |
9 | # production
10 | /build
11 |
12 | # misc
13 | .DS_Store
14 | .env
15 | npm-debug.log*
16 | yarn-debug.log*
17 | yarn-error.log*
18 |
19 |
--------------------------------------------------------------------------------
/src/store/actions/decrementCounter.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 |
3 | export function decrementCounter() {
4 | return dispatch => {
5 | dispatch(getDecrementFulfilledAction())
6 | }
7 | }
8 |
9 | function getDecrementFulfilledAction() {
10 | return {
11 | type: ActionTypes.DecrementCounterSuccess
12 | };
13 | }
--------------------------------------------------------------------------------
/src/store/store.js:
--------------------------------------------------------------------------------
1 | import { createStore, applyMiddleware } from 'redux';
2 | import thunk from 'redux-thunk';
3 | import createLogger from "redux-logger";
4 | import rootReducer from './reducers/rootReducer';
5 |
6 | const logger = createLogger();
7 |
8 | const store = createStore(rootReducer,
9 | {},
10 | applyMiddleware(thunk, logger)
11 | );
12 |
13 | export default store;
--------------------------------------------------------------------------------
/src/store/actions/loadUserData.js:
--------------------------------------------------------------------------------
1 | // import ActionTypes from './actionTypes';
2 |
3 | // export function loadUserRequest(loadUserData) {
4 | // console.log("loader chalaaaaaaaaaa",loadUserData)
5 | // return dispatch => {
6 | // dispatch(LoadUserRequest());
7 | // }
8 | // }
9 |
10 | // function LoadUserRequest() {
11 | // return {
12 | // type: ActionTypes.loadUserRequest
13 | // };
14 | // }
--------------------------------------------------------------------------------
/src/App.css:
--------------------------------------------------------------------------------
1 | .App {
2 | text-align: center;
3 | }
4 |
5 | .App-logo {
6 | animation: App-logo-spin infinite 20s linear;
7 | height: 80px;
8 | }
9 |
10 | .App-header {
11 | background-color: #222;
12 | height: 150px;
13 | padding: 20px;
14 | color: white;
15 | }
16 |
17 | .App-intro {
18 | font-size: large;
19 | }
20 |
21 | @keyframes App-logo-spin {
22 | from { transform: rotate(0deg); }
23 | to { transform: rotate(360deg); }
24 | }
25 |
--------------------------------------------------------------------------------
/src/components/signUp/signup.css:
--------------------------------------------------------------------------------
1 | .main-login-div{
2 | width: 50%;
3 | margin: 5% auto;
4 | }
5 |
6 | .full-width-container{
7 | width: 100% !important;
8 | }
9 |
10 | @media only screen and (max-width: 768px) {
11 | .main-login-div{
12 | width: 80%;
13 | margin: 5% auto;
14 | }
15 | }
16 |
17 | @media only screen and (min-width: 769px) {
18 | .main-login-div{
19 | width: 50%;
20 | margin: 5% auto;
21 | }
22 | }
--------------------------------------------------------------------------------
/src/store/actions/loadInitialState.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 |
3 | export function loadInitialState() {
4 | return dispatch => {
5 | dispatch(loadInitialStateAction())
6 | }
7 | }
8 |
9 | function loadInitialStateAction() {
10 | return {
11 | type: ActionTypes.LoadInitialState
12 | };
13 | }
14 |
15 | function LoginRequestSuccess(data) {
16 | return {
17 | type: ActionTypes.LoginRequestSuccess,
18 | data
19 | };
20 | }
--------------------------------------------------------------------------------
/src/configs/dbconfigs.js:
--------------------------------------------------------------------------------
1 | import firebase from 'firebase';
2 |
3 | const config = {
4 | apiKey: "AIzaSyD4OpUrUlD4d3DZ7UmmFnjAjQE2JQ-6204",
5 | authDomain: "react-crimereportapp.firebaseapp.com",
6 | databaseURL: "https://react-crimereportapp.firebaseio.com",
7 | storageBucket: "react-crimereportapp.appspot.com",
8 | messagingSenderId: "761653753246"
9 | };
10 |
11 | firebase.initializeApp(config);
12 | export const database = firebase.database();
13 |
14 | export const storage = firebase.storage();
15 |
16 | export const fbAuth = firebase.auth();
17 |
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import logo from './logo.svg';
3 | import './App.css';
4 |
5 | class App extends Component {
6 | render() {
7 | return (
8 |
9 |
10 |
11 |
Welcome to React
12 |
13 |
14 | To get started, edit src/App.js and save to reload.
15 |
16 |
25 |
26 |
27 | );
28 | }
29 | }
30 |
31 | export default Dashboard;
--------------------------------------------------------------------------------
/src/store/actions/logout.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 | import * as fbConfigs from '../../configs/dbconfigs';
3 |
4 | export function logOutRequest(loginData) {
5 | return dispatch => {
6 | dispatch(LogOutRequest());
7 | return fbConfigs.fbAuth.signOut()
8 | .then((data) => {
9 | dispatch(logOutRequestSuccess());
10 | })
11 | .catch((error) => {
12 | dispatch(logOutRequestFailed());
13 | });
14 | }
15 | }
16 |
17 | function LogOutRequest() {
18 | return {
19 | type: ActionTypes.logOutRequest
20 | };
21 | }
22 |
23 | function logOutRequestSuccess() {
24 | return {
25 | type: ActionTypes.logOutRequestSuccess
26 | };
27 | }
28 |
29 | function logOutRequestFailed() {
30 | return {
31 | type: ActionTypes.logOutRequestFailed
32 | };
33 | }
--------------------------------------------------------------------------------
/src/components/dashboard/adminDashboard.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import * as mat from 'material-ui';
3 | import Moment from 'react-moment';
4 | import {
5 | Link
6 | } from 'react-router';
7 |
8 | class AdminDashboard extends Component {
9 | render() {
10 | const style = {
11 | height: 100,
12 | width: 400,
13 | margin: 20,
14 | textAlign: 'center',
15 | display: 'inline-block',
16 | };
17 | const customAnchor = {
18 | textDecoration: 'none',
19 | color: '#000'
20 | }
21 | return (
22 |
23 |
24 | Review Complains
25 |
26 |
27 | );
28 | }
29 | }
30 |
31 | export default AdminDashboard;
--------------------------------------------------------------------------------
/src/store/actions/addComment.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 | import * as fbConfigs from '../../configs/dbconfigs';
3 |
4 | export function updateReportRequest(reportData) {
5 | return dispatch => {
6 | dispatch(UpdateReportRequest());
7 | return fbConfigs.database.ref('/crimes/'+reportData.objectKey+'/comments').push(reportData.comment).then((data)=>{
8 | alert("Successfully updateed.");
9 | dispatch(updateReportRequestSuccess(data));
10 | })
11 | }
12 | }
13 |
14 | function UpdateReportRequest() {
15 | return {
16 | type: ActionTypes.updateReportRequest
17 | };
18 | }
19 |
20 | function updateReportRequestSuccess(data) {
21 | return {
22 | type: ActionTypes.updateReportRequestSuccess,
23 | data
24 | };
25 | }
26 |
27 | function updateReportRequestFailed() {
28 | return {
29 | type: ActionTypes.updateReportRequestFailed
30 | };
31 | }
--------------------------------------------------------------------------------
/src/store/actions/addReportRequest.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 | import * as fbConfigs from '../../configs/dbconfigs';
3 |
4 | export function addReportRequest(reportData) {
5 | return dispatch => {
6 | dispatch(AddReportRequest());
7 | reportData.isPublic = reportData.inicidentType!=3?true:false;
8 | return fbConfigs.database.ref('/crimes').push(reportData).then((data)=>{
9 | alert("Successfully Added.");
10 | dispatch(addReportRequestSuccess(data));
11 | })
12 | }
13 | }
14 |
15 | function AddReportRequest() {
16 | return {
17 | type: ActionTypes.addReportRequest
18 | };
19 | }
20 |
21 | function addReportRequestSuccess(data) {
22 | return {
23 | type: ActionTypes.addReportRequestSuccess,
24 | data
25 | };
26 | }
27 |
28 | function addReportRequestFailed() {
29 | return {
30 | type: ActionTypes.addReportRequestFailed
31 | };
32 | }
--------------------------------------------------------------------------------
/src/containers/viewCrimes.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux';
2 | import ViewCrimes from '../components/reports/viewCrimes';
3 | import { loadInitialState } from '../store/actions/loadInitialState';
4 | import { loadCrimesRequest } from '../store/actions/loadCrimes';
5 | import { childAddedHandler } from '../store/actions/childAddedHandler';
6 |
7 | function mapStateToProps(state) {
8 | //here we are mapping the redux state to props so we can use it in our components
9 | return {
10 | application: state.application
11 | };
12 | }
13 |
14 | function mapDispatchToProps(dispatch) {
15 | childAddedHandler(dispatch);
16 | //Those will be the actions we will be Triggerening from Components
17 | return {
18 | loadInitialState : () => dispatch(loadInitialState()),
19 | loadCrimesRequest : () => dispatch(loadCrimesRequest())
20 | };
21 | }
22 |
23 | const AddReportContainer = connect(mapStateToProps, mapDispatchToProps)(ViewCrimes);
24 |
25 | export default AddReportContainer;
--------------------------------------------------------------------------------
/src/containers/addReports.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux';
2 | import AddReports from '../components/reports/addReports';
3 | import { loadInitialState } from '../store/actions/loadInitialState';
4 | import { addReportRequest } from '../store/actions/addReportRequest';
5 | import { childAddedHandler } from '../store/actions/childAddedHandler';
6 |
7 | function mapStateToProps(state) {
8 | //here we are mapping the redux state to props so we can use it in our components
9 | return {
10 | application: state.application
11 | };
12 | }
13 |
14 | function mapDispatchToProps(dispatch) {
15 | childAddedHandler(dispatch);
16 | //Those will be the actions we will be Triggerening from Components
17 | return {
18 | loadInitialState : () => dispatch(loadInitialState()),
19 | addNewReports : (reportData) => dispatch(addReportRequest(reportData))
20 | };
21 | }
22 |
23 | const AddReportContainer = connect(mapStateToProps, mapDispatchToProps)(AddReports);
24 |
25 | export default AddReportContainer;
--------------------------------------------------------------------------------
/src/containers/loadMyIncidents.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux';
2 | import LoadMyIncident from '../components/reports/loadMyIncidents';
3 | import { loadInitialState } from '../store/actions/loadInitialState';
4 | import { loadMyIncidentsRequest } from '../store/actions/loadMyIncidents';
5 | import { childAddedHandler } from '../store/actions/childAddedHandler';
6 |
7 | function mapStateToProps(state) {
8 | //here we are mapping the redux state to props so we can use it in our components
9 | return {
10 | application: state.application
11 | };
12 | }
13 |
14 | function mapDispatchToProps(dispatch) {
15 | childAddedHandler(dispatch);
16 | //Those will be the actions we will be Triggerening from Components
17 | return {
18 | loadInitialState : () => dispatch(loadInitialState()),
19 | loadMyIncidentsRequest : (data) => dispatch(loadMyIncidentsRequest(data))
20 | };
21 | }
22 |
23 | const LoadMyIncidentsContainer = connect(mapStateToProps, mapDispatchToProps)(LoadMyIncident);
24 |
25 | export default LoadMyIncidentsContainer;
--------------------------------------------------------------------------------
/src/store/actions/requiredBlood.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 | import * as fbConfigs from '../../configs/dbconfigs';
3 |
4 | export function requiredBloodRequest(requiredBloodData) {
5 | return dispatch => {
6 | dispatch(RequiredBloodRequest());
7 | return fbConfigs.database.ref('/users').orderByChild('isDonor').equalTo(true).once('value', snap => {
8 | const todo = [];
9 | snap.forEach(childSnapshot => {
10 | todo.push(childSnapshot.val());
11 | })
12 | dispatch(requiredBloodRequestSuccess(todo))
13 | });
14 | }
15 | }
16 |
17 | function RequiredBloodRequest() {
18 | return {
19 | type: ActionTypes.requiredBloodRequest
20 | };
21 | }
22 |
23 | function requiredBloodRequestSuccess(data) {
24 | return {
25 | type: ActionTypes.requiredBloodRequestSuccess,
26 | data
27 | };
28 | }
29 |
30 | function requiredBloodRequestFailed() {
31 | return {
32 | type: ActionTypes.requiredBloodRequestFailed
33 | };
34 | }
--------------------------------------------------------------------------------
/src/containers/viewAllCrimes.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux';
2 | import ViewAllCrimes from '../components/reports/viewAllCrimes';
3 | import { loadInitialState } from '../store/actions/loadInitialState';
4 | import { viewAllCrimesRequest } from '../store/actions/viewAllCrimeRequest';
5 | import { updateReportRequest } from '../store/actions/addComment';
6 | import { childAddedHandler } from '../store/actions/childAddedHandler';
7 |
8 |
9 | function mapStateToProps(state) {
10 | //here we are mapping the redux state to props so we can use it in our components
11 | return {
12 | application: state.application
13 | };
14 | }
15 |
16 | function mapDispatchToProps(dispatch) {
17 | childAddedHandler(dispatch);
18 | //Those will be the actions we will be Triggerening from Components
19 | return {
20 | loadInitialState : () => dispatch(loadInitialState()),
21 | loadAllCrimesRequest : () => dispatch(viewAllCrimesRequest()),
22 | updateReport : (data) => dispatch(updateReportRequest(data))
23 | };
24 | }
25 |
26 | const ViewAllCrimesContainer = connect(mapStateToProps, mapDispatchToProps)(ViewAllCrimes);
27 |
28 | export default ViewAllCrimesContainer;
--------------------------------------------------------------------------------
/src/store/actions/updateRequest.js:
--------------------------------------------------------------------------------
1 | import ActionTypes from './actionTypes';
2 | import * as fbConfigs from '../../configs/dbconfigs';
3 |
4 | export function updateBloodRequest(updateBloodData) {
5 | return dispatch => {
6 | dispatch(UpdateBloodRequest());
7 | return fbConfigs.database.ref('/users/' + updateBloodData.uid + '/isDonor').set(false, (data) => {
8 | return fbConfigs.database.ref('/users').orderByChild('isDonor').equalTo(true).once('value', snap => {
9 | const todo = [];
10 | snap.forEach(childSnapshot => {
11 | todo.push(childSnapshot.val());
12 | })
13 | dispatch(updateBloodRequestSuccess(todo))
14 | });
15 | });
16 | }
17 | }
18 |
19 | function UpdateBloodRequest() {
20 | return {
21 | type: ActionTypes.updateBloodRequest
22 | };
23 | }
24 |
25 | function updateBloodRequestSuccess(data) {
26 | return {
27 | type: ActionTypes.updateBloodRequestSuccess,
28 | data
29 | };
30 | }
31 |
32 | function updateBloodRequestFailed() {
33 | return {
34 | type: ActionTypes.updateBloodRequestFailed
35 | };
36 | }
--------------------------------------------------------------------------------
/src/containers/requiredBlood.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux';
2 | import RequiredBlood from '../components/requiredBlood/requiredBlood';
3 | import { loadInitialState } from '../store/actions/loadInitialState';
4 | import { requiredBloodRequest } from '../store/actions/requiredBlood';
5 | import { updateBloodRequest } from '../store/actions/updateRequest';
6 | import { loadUserRequest } from '../store/actions/loadUserData';
7 | import { childAddedHandler } from '../store/actions/childAddedHandler';
8 |
9 | function mapStateToProps(state) {
10 | //here we are mapping the redux state to props so we can use it in our components
11 | return {
12 | application: state.application
13 | };
14 | }
15 |
16 | function mapDispatchToProps(dispatch) {
17 | childAddedHandler(dispatch);
18 | //Those will be the actions we will be Triggerening from Components
19 | return {
20 | loadInitialState: () => dispatch(loadInitialState()),
21 | requiredBloodRequest: () => dispatch(requiredBloodRequest()),
22 | updateBloodRequest: (userData) => dispatch(updateBloodRequest(userData)),
23 | loadUserRequest: () => dispatch(loadUserRequest())
24 | };
25 | }
26 |
27 | const RequiredBloodContainer = connect(mapStateToProps, mapDispatchToProps)(RequiredBlood);
28 |
29 | export default RequiredBloodContainer;
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
16 | React App
17 |
22 |
23 |
24 |
25 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/src/containers/adminContainer.js:
--------------------------------------------------------------------------------
1 | // import { connect } from 'react-redux';
2 | // import AdminDashboard from '../components/dashboard/adminDashboard';
3 | // import { loadInitialState } from '../store/actions/loadInitialState';
4 | // import { donateBloodRequest } from '../store/actions/donateBlood';
5 | // import { childAddedHandler } from '../store/actions/childAddedHandler';
6 |
7 | // function mapStateToProps(state) {
8 | // //here we are mapping the redux state to props so we can use it in our components
9 | // return {
10 | // application: state.application
11 | // };
12 | // }
13 |
14 | // function mapDispatchToProps(dispatch) {
15 | // childAddedHandler(dispatch);
16 | // //Those will be the actions we will be Triggerening from Components
17 | // return {
18 | // loadInitialState : () => dispatch(loadInitialState()),
19 | // donateBloodRequest : (userData) => dispatch(donateBloodRequest(userData)),
20 | // };
21 | // }
22 |
23 | // import React, { Component } from 'react';
24 |
25 | // class adminRoot extends Component {
26 | // render() {
27 | // return (
28 | //
29 | //
30 | // {this.props.children}
31 | //
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
60 |
62 |
63 |
64 |
65 |
66 |
67 | {this.props.children}
68 |
69 | );
70 | }
71 | }
72 |
73 |
74 | function mapStateToProps(state) {
75 | //here we are mapping the redux state to props so we can use it in our components
76 | return {
77 | application: state.application
78 | };
79 | }
80 |
81 | function mapDispatchToProps(dispatch) {
82 | //Those will be the actions we will be Triggerening from Components
83 | return {
84 |
85 | logOutRequest: () => dispatch(logOutRequest()),
86 | };
87 | }
88 |
89 | const rootMainContainer = connect(mapStateToProps, mapDispatchToProps)(rootContainer);
90 |
91 | export default rootMainContainer;
--------------------------------------------------------------------------------
/src/components/login/login.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import './login.css';
3 | import * as mat from 'material-ui';
4 | import { browserHistory, Link } from 'react-router';
5 | // import AppBar from 'material-ui/AppBar';
6 |
7 |
8 | class Login extends Component {
9 |
10 | constructor(props) {
11 | super(props);
12 | this.state = { email: '', password: '' };
13 | this.handleSubmit = this.handleLoginSubmit.bind(this);
14 | this.handleInputChange = this.handleInputChange.bind(this);
15 | }
16 | componentDidMount() {
17 | this.props.loadInitialState();
18 | }
19 | handleLoginSubmit(evt) {
20 | evt.preventDefault();
21 | var email = evt.target.email.value;
22 | var password = evt.target.password.value;
23 | var userObj = { "email": email, "password": password };
24 | this.props.loginRequest(userObj);
25 | }
26 | componentWillReceiveProps() {
27 | setTimeout(() => {
28 | if (this.props.application && this.props.application.user) {
29 | browserHistory.push('/dashboard');
30 | }
31 | }, 100)
32 | }
33 |
34 | handleInputChange(event) {
35 | const target = event.target;
36 | const value = target.type === 'checkbox' ? target.checked : target.value;
37 | const name = target.name;
38 |
39 | this.setState({
40 | [name]: value
41 | });
42 | }
43 |
44 | render() {
45 | const customAnchor = {
46 | textDecoration: 'none',
47 | color: '#fff'
48 | }
49 | const style = {
50 | margin: 12,
51 | };
52 | const { application } = this.props.application;
53 | return (
54 |
55 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
89 |
90 |
91 |
92 | );
93 | }
94 | }
95 |
96 | export default Login;
--------------------------------------------------------------------------------
/src/components/signUp/signup.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import './signup.css';
3 | import * as mat from 'material-ui';
4 | import { browserHistory, Link } from 'react-router';
5 |
6 | class SignUp extends Component {
7 | citiesGroup;
8 | constructor(props) {
9 | super(props);
10 | this.citiesGroup = [
11 | "Huntsville",
12 | "Anchorage",
13 | "Phoenix",
14 | "Little-Rock",
15 | "Sacramento",
16 | "Los-Angeles",
17 | "Beverly-Hills",
18 | "Denver",
19 | "Hartford",
20 | "Washington"
21 | ]
22 | this.state = { email: '', password: '', name: '', gender: 1, cityname: "Washington" };
23 | this.handleSubmit = this.handleLoginSubmit.bind(this);
24 | this.handleInputChange = this.handleInputChange.bind(this);
25 | }
26 |
27 |
28 | componentDidMount() {
29 | this.props.loadInitialState();
30 | }
31 |
32 | componentWillReceiveProps() {
33 | setTimeout(() => {
34 | if (this.props.application && this.props.application.user) {
35 | browserHistory.push('/dashboard');
36 | }
37 | }, 100)
38 | }
39 |
40 | handleCityTypeChange = (event, index, value) => this.setState({ cityname: value });
41 | handleGenderTypeChange = (event, index, value) => this.setState({ gender: value });
42 |
43 | handleLoginSubmit(evt) {
44 | evt.preventDefault();
45 | let userObj = {
46 | email: this.state.email,
47 | password: this.state.password,
48 | name: this.state.name,
49 | gender: this.state.gender,
50 | cityname: this.state.cityname,
51 | cellNumber: this.state.cellNumber,
52 | }
53 | this.props.signUpRequest(userObj);
54 | }
55 |
56 | handleInputChange(event) {
57 | const target = event.target;
58 | const value = target.type === 'checkbox' ? target.checked : target.value;
59 | const name = target.name;
60 |
61 | this.setState({
62 | [name]: value
63 | });
64 | }
65 |
66 | render() {
67 | const style = {
68 | margin: 12,
69 | };
70 | const { application } = this.props.application;
71 | return (
72 |
73 |
76 |
77 |
78 |
79 |
80 |
81 |
82 |
153 |
154 |
155 |
156 | );
157 | }
158 | }
159 |
160 | export default SignUp;
--------------------------------------------------------------------------------
/src/components/reports/loadMyIncidents.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import * as mat from 'material-ui';
3 | import Moment from 'react-moment';
4 | import './logo.css';
5 | import {
6 | browserHistory,
7 | Router,
8 | Route,
9 | IndexRoute,
10 | Link,
11 | IndexLink
12 | } from 'react-router';
13 |
14 | class LoadMyIncident extends Component {
15 |
16 | constructor(props) {
17 | super(props);
18 | this.state = {openDilog:false,singleRequest:{}}
19 | }
20 |
21 | componentDidMount() {
22 | this.props.loadMyIncidentsRequest(this.props.application.user);
23 | }
24 |
25 | componentWillReceiveProps() {
26 | setTimeout(() => {
27 | if (!this.props.application || !this.props.application.user) {
28 | browserHistory.push('/login');
29 | }
30 | }, 5)
31 | }
32 |
33 | handleOpenDilog = () => {
34 | this.setState({openDilog: true});
35 | };
36 |
37 | handleCloseDilog = () => {
38 | this.setState({openDilog: false});
39 | };
40 |
41 | handleRequiredRequest(event) {
42 | this.setState({"singleRequest":event});
43 | this.handleOpenDilog();
44 | }
45 |
46 | render() {
47 | const style = {
48 | minheight: 100,
49 | width: 900,
50 | margin: 20,
51 | textAlign: 'center',
52 | display: 'inline-block',
53 | };
54 | const customAnchor = {
55 | textDecoration: 'none',
56 | color: '#000'
57 | };
58 |
59 | const actions = [
60 | ,
66 | ];
67 | const application = this.props && this.props.application && this.props.application.allCrimes ? this.props.application.allCrimes : [];
68 | return (
69 |
70 |
77 |
80 |
81 |
82 | Affected Person Name
83 | {this.state.singleRequest.affectedName}
84 |
85 |
86 | Affected Person Gender
87 | {this.state.singleRequest.gender}
88 |
89 |
90 | Incident Date and Time
91 | {this.state.singleRequest.incidentTime}
92 |
93 |
94 | Reported By
95 | {this.state.singleRequest.userEmail}
96 |
97 |
98 | Incident Type
99 | {this.state.singleRequest.inicidentType}
100 |
101 |
102 | City
103 | {this.state.singleRequest.cityname}
104 |
105 |
106 | Admin Responses
107 | {this.state.singleRequest.comments && this.state.singleRequest.comments.length>0?this.state.singleRequest.comments.map((data,index)=>{
108 | return {data.key}
109 | })
110 | :"Sorry Admin Has not Replied Yet."}
111 |
112 |
113 |
114 |
115 |
116 | {application && application.length > 0 ?
117 |
120 |
123 |
124 |
125 | Number
126 | Picture
127 | Name
128 | Gender
129 | Incident
130 | Time
131 |
132 |
133 |
134 |
135 | {application.map((todo, index) => {
136 | return (
137 |
138 | {index + 1}
139 |
143 | {todo.affectedName}
144 | {todo.gender}
145 | {todo.inicidentType==1?"Crime":"Incident"}
146 | {todo.incidentTime}
147 | this.handleRequiredRequest(todo)} />
148 |
149 | );
150 | })}
151 |
152 |
153 | : null}
154 |
155 |
106 |
107 |
108 |
109 |
118 | {
119 | this.bloodgroups.map(bloodgroup => {
120 | return
121 | })
122 | }
123 |
124 |
125 | {application && application.length > 0 ?
126 |
129 |
132 |
133 |
134 | Number
135 | Picture
136 | Name
137 | Gender
138 | Blood Type
139 |
140 |
141 |
142 |
143 | {application.map((todo, index) => {
144 | if (that.testBlood(todo.bloodType)) {
145 | return (
146 |
147 | {index + 1}
148 |
152 | {todo.name}
153 | {todo.gender}
154 | {todo.bloodType}
155 | this.handleRequiredRequest(todo)} />
156 |
157 |
158 | );
159 | }
160 | })}
161 |
162 |
163 | : null}
164 |
165 |
166 |
97 |
100 |
101 |
102 |
103 |
185 |
186 |
187 |
188 | );
189 | }
190 | }
191 |
192 | export default AddReports;
--------------------------------------------------------------------------------
/src/components/reports/viewCrimes.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import * as mat from 'material-ui';
3 | import Moment from 'react-moment';
4 | import './logo.css';
5 | import { Link } from 'react-router';
6 |
7 | class ViewCrimes extends Component {
8 | constructor(props) {
9 | super(props);
10 | this.state = { showLogin: true, requiredIncidentType: 5, openDilog: false, singleRequest: {}, requiredCity: "All" };
11 | this.requiredIncidents = [1, 2, 3, 4, 5];
12 |
13 | this.citiesGroup = [
14 | "All",
15 | "Huntsville",
16 | "Anchorage",
17 | "Phoenix",
18 | "Little-Rock",
19 | "Sacramento",
20 | "Los-Angeles",
21 | "Beverly-Hills",
22 | "Denver",
23 | "Hartford",
24 | "Washington"
25 | ]
26 | }
27 |
28 | componentDidMount() {
29 | this.props.loadCrimesRequest();
30 | }
31 |
32 | componentWillReceiveProps() {
33 | setTimeout(() => {
34 | if (this.props.application && this.props.application.user) {
35 | this.setState({ showLogin: false })
36 | }
37 | }, 5)
38 | }
39 |
40 | handleOpenDilog = () => {
41 | this.setState({ openDilog: true });
42 | };
43 |
44 | handleCloseDilog = () => {
45 | this.setState({ openDilog: false });
46 | };
47 |
48 | testtype(currentType, cityName) {
49 | if (this.state.requiredCity == "All") {
50 | if (this.state.requiredIncidentType == 5) {
51 | return true;
52 | } else if (this.state.requiredIncidentType == currentType) {
53 | return true;
54 | } else {
55 | false;
56 | }
57 | } else if (this.state.requiredCity == cityName) {
58 | if (this.state.requiredIncidentType == 5) {
59 | return true;
60 | } else if (this.state.requiredIncidentType == currentType) {
61 | return true;
62 | } else {
63 | false;
64 | }
65 | }
66 | }
67 |
68 | handleRequiredRequest(event) {
69 | this.setState({ "singleRequest": event });
70 | this.handleOpenDilog();
71 | }
72 |
73 |
74 | handleRequiredTypeChange = (event, index, value) => { this.setState({ requiredIncidentType: value }); console.log(value) };
75 | handleRequiredCityChange = (event, index, value) => { this.setState({ requiredCity: value }); console.log(value) };
76 | render() {
77 | const that = this;
78 | const style = {
79 | minheight: 100,
80 | width: 900,
81 | margin: 20,
82 | textAlign: 'center',
83 | display: 'inline-block',
84 | };
85 | const customAnchor = {
86 | textDecoration: 'none',
87 | color: '#000'
88 | }
89 | const actions = [
90 | ,
96 | ];
97 | const application = this.props && this.props.application && this.props.application.allCrimes ? this.props.application.allCrimes : [];
98 | return (
99 | :
107 |
108 |
}
109 | />
110 |
111 |
118 |
121 |
122 |
123 | Person Name
124 | {this.state.singleRequest.affectedName}
125 |
126 |
127 | Person Gender
128 | {this.state.singleRequest.gender}
129 |
130 |
131 | Incident Date and Time
132 | {this.state.singleRequest.incidentTime}
133 |
134 |
135 | Reported By
136 | {this.state.singleRequest.userEmail}
137 |
138 |
139 | Incident Type
140 | {this.state.singleRequest.inicidentType}
141 |
142 |
143 | City
144 | {this.state.singleRequest.cityname}
145 |
146 |
147 | Admin Responses
148 |
149 | {this.state.singleRequest.comments && this.state.singleRequest.comments.length > 0 ?
150 | this.state.singleRequest.comments.map((data, index) => {
151 | return {data.key}
152 | })
153 | : "Sorry Admin Has not Replied Yet."}
154 |
155 |
156 |
157 |
158 |
159 |
160 |
161 |
162 |
163 |
172 | {
173 | this.requiredIncidents.map(requiredIncident => {
174 | return
175 | })
176 | }
177 |
178 |
179 |
180 |
181 |
182 |
183 |
192 | {
193 | this.citiesGroup.map(requiredIncident => {
194 | return
195 | })
196 | }
197 |
198 |
199 |
200 |
201 |
202 |
203 |
204 |
205 | {application && application.length > 0 ?
206 |
209 |
212 |
213 |
214 | Number
215 | Picture
216 | Name
217 | Gender
218 | Incident
219 | City
220 | Time
221 |
222 |
223 |
224 |
225 | {application.map((todo, index) => {
226 | if (that.testtype(todo.inicidentType, todo.cityname)) {
227 | return (
228 |
229 | {index + 1}
230 |
234 | {todo.affectedName}
235 | {todo.gender}
236 | {todo.inicidentType == 1 ? "Crime" : todo.inicidentType == 2 ? "Missing" : todo.inicidentType == 4 ? "Other" : "Complain"}
237 | {todo.cityname}
238 | {todo.incidentTime}
239 | {!this.state.showLogin ? this.handleRequiredRequest(todo)} /> : ""}
240 |
241 | );
242 | }
243 | })}
244 |
245 |
246 | : null}
247 |
248 |
249 | );
250 | }
251 | }
252 |
253 | export default ViewCrimes;
--------------------------------------------------------------------------------
/src/components/reports/viewAllCrimes.js:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import * as mat from 'material-ui';
3 | import Moment from 'react-moment';
4 | import './logo.css';
5 | import {
6 | browserHistory,
7 | Router,
8 | Route,
9 | IndexRoute,
10 | Link,
11 | IndexLink
12 | } from 'react-router';
13 |
14 | class ViewAllCrimes extends Component {
15 | constructor(props){
16 | super(props);
17 | this.state = {showLogin : true,requiredIncidentType: 5,openDilog:false,singleRequest:{},requiredCity:"All"};
18 | this.requiredIncidents = [
19 | 1,
20 | 2,
21 | 3,
22 | 4,
23 | 5
24 | ]
25 | this.handleSubmit = this.handleSubmit.bind(this);
26 | this.citiesGroup = [
27 | "All",
28 | "Huntsville",
29 | "Anchorage",
30 | "Phoenix",
31 | "Little-Rock",
32 | "Sacramento",
33 | "Los-Angeles",
34 | "Beverly-Hills",
35 | "Denver",
36 | "Hartford",
37 | "Washington"
38 | ]
39 | }
40 |
41 | handleOpenDilog = () => {
42 | this.setState({openDilog: true});
43 | };
44 |
45 | handleCloseDilog = () => {
46 | this.setState({openDilog: false});
47 | };
48 |
49 | componentDidMount() {
50 | this.props.loadAllCrimesRequest();
51 | }
52 |
53 | componentWillReceiveProps() {
54 | setTimeout(() => {
55 | if (!this.props.application || !this.props.application.user) {
56 | browserHistory.push('/login');
57 | }else if(this.props.application && this.props.application.user && !this.props.application.user.isAdmin){
58 | alert("You are not Allowed to go to this page.");
59 | browserHistory.push('/dashboard');
60 | }
61 | }, 5)
62 | }
63 |
64 | testtype(currentType,cityName) {
65 | if(this.state.requiredCity=="All"){
66 | if(this.state.requiredIncidentType==5){
67 | return true;
68 | }else if (this.state.requiredIncidentType == currentType) {
69 | return true;
70 | }else{
71 | false;
72 | }
73 | }else if(this.state.requiredCity == cityName){
74 | if(this.state.requiredIncidentType==5){
75 | return true;
76 | }else if (this.state.requiredIncidentType == currentType) {
77 | return true;
78 | }else{
79 | false;
80 | }
81 | }
82 | }
83 |
84 | handleSubmit(evt){
85 | evt.preventDefault();
86 | console.log(evt.target.address.value);
87 | var dataToSave = {"comment":evt.target.address.value,objectKey:this.state.singleRequest.key};
88 | this.props.updateReport(dataToSave);
89 | console.log(this.refs.address.getValue());
90 | }
91 |
92 | handleRequiredRequest(event) {
93 | this.setState({"singleRequest":event});
94 | this.handleOpenDilog();
95 | }
96 |
97 |
98 | handleRequiredTypeChange = (event, index, value) => { this.setState({ requiredIncidentType: value }); console.log(value) };
99 | handleRequiredCityChange = (event, index, value) => { this.setState({ requiredCity: value }); console.log(value) };
100 | render() {
101 | alert()
102 | console.log(this.props)
103 | const that = this;
104 | const style = {
105 | minheight: 100,
106 | width: 900,
107 | margin: 20,
108 | textAlign: 'center',
109 | display: 'inline-block',
110 | };
111 | const customAnchor = {
112 | textDecoration: 'none',
113 | color: '#000'
114 | }
115 | const actions = [
116 | ,
122 | ];
123 | const application = this.props && this.props.application && this.props.application.allCrimes ? this.props.application.allCrimes : [];
124 | return (
125 |
126 |
133 |
136 |
137 |
138 | Affected Person Name
139 | {this.state.singleRequest.affectedName}
140 |
141 |
142 | Affected Person Gender
143 | {this.state.singleRequest.gender}
144 |
145 |
146 | Incident Date and Time
147 | {this.state.singleRequest.incidentTime}
148 |
149 |
150 | Reported By
151 | {this.state.singleRequest.userEmail}
152 |
153 |
154 | Incident Type
155 | {this.state.singleRequest.inicidentType}
156 |
157 |
158 | City
159 | {this.state.singleRequest.cityname}
160 |
161 |
162 | Admin Responses
163 | {this.state.singleRequest.comments && this.state.singleRequest.comments.length>0?this.state.singleRequest.comments.map((data,index)=>{
164 | return {data.key}
165 | })
166 | :"Sorry Admin Has not Replied Yet."}
167 |
168 |
169 |
170 |
185 |
186 |
187 |
188 |
197 | {
198 | this.requiredIncidents.map(requiredIncident => {
199 | return
202 | })
203 | }
204 |
205 |
206 |
215 | {
216 | this.citiesGroup.map(requiredIncident => {
217 | return
218 | })
219 | }
220 |
221 |
222 |
223 | {application && application.length > 0 ?
224 |
227 |
230 |
231 |
232 | Number
233 | Picture
234 | Name
235 | Gender
236 | Incident
237 | City
238 | Time
239 |
240 |
241 |
242 |
243 | {application.map((todo, index) => {
244 | if (that.testtype(todo.inicidentType,todo.cityname)) {
245 | return (
246 |
247 | {index + 1}
248 |
252 | {todo.affectedName}
253 | {todo.gender}
254 | {todo.inicidentType==1?"Crime":todo.inicidentType==2?"Missing":todo.inicidentType==4?"Other":"Complain"}
255 | {todo.cityname}
256 | {todo.incidentTime}
257 | this.handleRequiredRequest(todo)} />
258 |
259 | );
260 | }
261 | })}
262 |
263 |
264 | : null}
265 |
266 |