Client - init users list in Admin
This commit is contained in:
parent
828704fa23
commit
c422678880
81
fittrackee_client/src/components/Admin/Users/index.jsx
Normal file
81
fittrackee_client/src/components/Admin/Users/index.jsx
Normal file
@ -0,0 +1,81 @@
|
|||||||
|
import { format } from 'date-fns'
|
||||||
|
import React from 'react'
|
||||||
|
import { connect } from 'react-redux'
|
||||||
|
import { Helmet } from 'react-helmet'
|
||||||
|
|
||||||
|
import Message from '../../Common/Message'
|
||||||
|
import { history } from '../../../index'
|
||||||
|
import { getOrUpdateData } from '../../../actions'
|
||||||
|
|
||||||
|
class AdminUsers extends React.Component {
|
||||||
|
componentDidMount() {
|
||||||
|
this.props.loadUsers()
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { message, t, users } = this.props
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Helmet>
|
||||||
|
<title>FitTrackee - {t('administration:Administration')}</title>
|
||||||
|
</Helmet>
|
||||||
|
{message && <Message message={message} t={t} />}
|
||||||
|
<div className="container">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col card">
|
||||||
|
<div className="card-body">
|
||||||
|
<table className="table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>{t('administration:id')}</th>
|
||||||
|
<th>{t('user:Username')}</th>
|
||||||
|
<th>{t('user:Email')}</th>
|
||||||
|
<th>{t('user:Registration Date')}</th>
|
||||||
|
<th>{t('activities:Activities')}</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{users.map(user => (
|
||||||
|
<tr key={user.id}>
|
||||||
|
<th scope="row">{user.id}</th>
|
||||||
|
<td>{user.username}</td>
|
||||||
|
<td>{user.email}</td>
|
||||||
|
<td>
|
||||||
|
{user.created_at
|
||||||
|
? format(
|
||||||
|
new Date(user.created_at),
|
||||||
|
'dd/MM/yyyy HH:mm'
|
||||||
|
)
|
||||||
|
: ''}
|
||||||
|
</td>
|
||||||
|
<td>{user.nb_activities}</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<input
|
||||||
|
type="submit"
|
||||||
|
className="btn btn-secondary btn-lg btn-block"
|
||||||
|
onClick={() => history.push('/admin/')}
|
||||||
|
value={t('administration:Back')}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(
|
||||||
|
state => ({
|
||||||
|
message: state.message,
|
||||||
|
users: state.users.data,
|
||||||
|
}),
|
||||||
|
dispatch => ({
|
||||||
|
loadUsers: () => {
|
||||||
|
dispatch(getOrUpdateData('getData', 'users'))
|
||||||
|
},
|
||||||
|
})
|
||||||
|
)(AdminUsers)
|
@ -8,6 +8,7 @@ import AdminApplication from './Application'
|
|||||||
import AdminDashboard from './AdminDashboard'
|
import AdminDashboard from './AdminDashboard'
|
||||||
import AdminMenu from './AdminMenu'
|
import AdminMenu from './AdminMenu'
|
||||||
import AdminSports from './Sports'
|
import AdminSports from './Sports'
|
||||||
|
import AdminUsers from './Users'
|
||||||
import NotFound from './../Others/NotFound'
|
import NotFound from './../Others/NotFound'
|
||||||
|
|
||||||
function Admin(props) {
|
function Admin(props) {
|
||||||
@ -53,6 +54,11 @@ function Admin(props) {
|
|||||||
path="/admin/sports"
|
path="/admin/sports"
|
||||||
render={() => <AdminSports t={t} />}
|
render={() => <AdminSports t={t} />}
|
||||||
/>
|
/>
|
||||||
|
<Route
|
||||||
|
exact
|
||||||
|
path="/admin/users"
|
||||||
|
render={() => <AdminUsers t={t} />}
|
||||||
|
/>
|
||||||
<Route component={NotFound} />
|
<Route component={NotFound} />
|
||||||
</Switch>
|
</Switch>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
{
|
{
|
||||||
|
"Activities": "Activities",
|
||||||
"Activity": "Activity",
|
"Activity": "Activity",
|
||||||
"Activity Date": "Activity Date",
|
"Activity Date": "Activity Date",
|
||||||
"Add a workout": "Add a workout",
|
"Add a workout": "Add a workout",
|
||||||
|
@ -24,5 +24,6 @@
|
|||||||
"Registration Date": "Registration Date",
|
"Registration Date": "Registration Date",
|
||||||
"Send": "Send",
|
"Send": "Send",
|
||||||
"Sunday": "Sunday",
|
"Sunday": "Sunday",
|
||||||
"Timezone": "Timezone"
|
"Timezone": "Timezone",
|
||||||
|
"Username": "Username"
|
||||||
}
|
}
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
{
|
{
|
||||||
|
"Activities": "Activités",
|
||||||
"Activity": "Activité",
|
"Activity": "Activité",
|
||||||
"Activity Date": "Date de l'activité",
|
"Activity Date": "Date de l'activité",
|
||||||
"Add a workout": "Ajouter une activité",
|
"Add a workout": "Ajouter une activité",
|
||||||
|
@ -24,5 +24,6 @@
|
|||||||
"Registration Date": "Date d'inscription",
|
"Registration Date": "Date d'inscription",
|
||||||
"Send": "Envoyer",
|
"Send": "Envoyer",
|
||||||
"Sunday": "Dimanche",
|
"Sunday": "Dimanche",
|
||||||
"Timezone": "Fuseau horaire"
|
"Timezone": "Fuseau horaire",
|
||||||
|
"Username": "Nom d'utilisateur"
|
||||||
}
|
}
|
||||||
|
@ -167,6 +167,9 @@ const statistics = (state = initial.statistics, action) => {
|
|||||||
return handleDataAndError(state, 'statistics', action)
|
return handleDataAndError(state, 'statistics', action)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const users = (state = initial.users, action) =>
|
||||||
|
handleDataAndError(state, 'users', action)
|
||||||
|
|
||||||
export default history =>
|
export default history =>
|
||||||
combineReducers({
|
combineReducers({
|
||||||
activities,
|
activities,
|
||||||
@ -183,4 +186,5 @@ export default history =>
|
|||||||
sports,
|
sports,
|
||||||
statistics,
|
statistics,
|
||||||
user,
|
user,
|
||||||
|
users,
|
||||||
})
|
})
|
||||||
|
@ -39,4 +39,7 @@ export default {
|
|||||||
statistics: {
|
statistics: {
|
||||||
data: {},
|
data: {},
|
||||||
},
|
},
|
||||||
|
users: {
|
||||||
|
...emptyData,
|
||||||
|
},
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user