From 98f845e5da6079c26830c2ed33c83c658c80db6b Mon Sep 17 00:00:00 2001 From: Melania Dello Spedale La Paglia Date: Thu, 26 Mar 2020 15:34:08 +0100 Subject: [PATCH] gestita paginazione tenants (BE e FE) --- backend/src/interfaces/interfaces.ts | 8 ++ backend/src/routes/private/tenantRoutes.ts | 19 +++-- backend/src/stores/tenantStore.ts | 18 +++- frontend/interfaces/rest.tsx | 7 +- frontend/src/api/tenantApi.tsx | 2 +- frontend/src/components/forms/tenantForm.tsx | 82 +++++++------------ .../src/components/tables/tenantTable.tsx | 14 ++-- frontend/src/constants.tsx | 2 +- frontend/src/routes.tsx | 10 +++ 9 files changed, 88 insertions(+), 74 deletions(-) diff --git a/backend/src/interfaces/interfaces.ts b/backend/src/interfaces/interfaces.ts index 019bad4..803d63c 100644 --- a/backend/src/interfaces/interfaces.ts +++ b/backend/src/interfaces/interfaces.ts @@ -34,6 +34,14 @@ export interface IRole { name?: string; } +export interface ISearchOpt { + count?: number; + needle?: string; + itemsPerPage?: number; + activePage?: number; + totalPages?: number; + } + export interface ITenant { id?: number; description?: string; diff --git a/backend/src/routes/private/tenantRoutes.ts b/backend/src/routes/private/tenantRoutes.ts index 9a113a0..23c13b7 100644 --- a/backend/src/routes/private/tenantRoutes.ts +++ b/backend/src/routes/private/tenantRoutes.ts @@ -2,7 +2,7 @@ import * as express from 'express'; import * as HttpStatus from 'http-status-codes'; import TenantStore from '../../stores/tenantStore'; -import { ITenant } from '../../interfaces/interfaces'; +import { ITenant, ISearchOpt } from '../../interfaces/interfaces'; const _ = require('lodash'); const factory = require('../../shared/factory'); const router = express.Router(); @@ -41,10 +41,19 @@ router.get( next: express.NextFunction ) => { try { - const tenantsRes = await tenantStore.findAll(); + console.log("req.query", req.query); + const options = req.query.options; + const search = req.query.search; + let searchOptions: ISearchOpt = options ? JSON.parse(options) : {}; + searchOptions.itemsPerPage = searchOptions.itemsPerPage || 25; + searchOptions.activePage = searchOptions.activePage || 1; + searchOptions.needle = search || ""; + const tenantsRes = await tenantStore.getAll(searchOptions); + + if (tenantsRes && tenantsRes.length > 0) { const result = factory.generateSuccessResponse( - tenantsRes, + {tenants: tenantsRes, options: searchOptions}, null, 'Tenants found' ); @@ -75,8 +84,6 @@ router.post('/create', async (req, res, next) => { let message = ''; if (!tenants || tenants.length == 0) { const resCreation = await tenantStore.create(tenant); - console.log("resCreatio", resCreation); - if (resCreation && resCreation.length == 1) { message = 'Tenant successfully created' const result = factory.generateSuccessResponse(null, null, message); @@ -86,7 +93,7 @@ router.post('/create', async (req, res, next) => { res.status(HttpStatus.INTERNAL_SERVER_ERROR).json(result); } } else { - message = 'Tenant already exists.' + message = 'Tenant already exists' const result = factory.generateSuccessResponse(null, null, message); res.status(HttpStatus.OK).json(result); } diff --git a/backend/src/stores/tenantStore.ts b/backend/src/stores/tenantStore.ts index 7daba03..09bb2d2 100644 --- a/backend/src/stores/tenantStore.ts +++ b/backend/src/stores/tenantStore.ts @@ -1,4 +1,4 @@ -import { ITenant } from '../interfaces/interfaces'; +import { ITenant, ISearchOpt } from '../interfaces/interfaces'; const _ = require('lodash'); const moment = require('moment'); const config = require('../../../backend/knexfile'); @@ -32,4 +32,20 @@ export default class TenantStore { findAll() { return knex('tenants').returning('*'); } + + getAll(options: ISearchOpt) { + return knex.raw(`SELECT * + FROM tenants + WHERE description LIKE '%${options.needle}%' + OR edge_interface_name LIKE '%${options.needle}%' + ORDER BY created_at DESC + LIMIT ${options.itemsPerPage} + OFFSET ${(options.itemsPerPage * (options.activePage - 1))}` + ) + .then((data: any) => { + return data; + }).catch((err: any) => { + return err; + }); + } } \ No newline at end of file diff --git a/frontend/interfaces/rest.tsx b/frontend/interfaces/rest.tsx index e7a27a6..a837fb9 100644 --- a/frontend/interfaces/rest.tsx +++ b/frontend/interfaces/rest.tsx @@ -16,11 +16,6 @@ export interface IDataResponse { export interface IPaginationOpts { activePage: number, - boundaryRange?: number, - siblingRange?: number, - showEllipsis?: boolean, - showFirstAndLastNav?: boolean, - showPreviousAndNextNav?: boolean, totalPages: number; - itemPerPage: number; + itemsPerPage: number; } diff --git a/frontend/src/api/tenantApi.tsx b/frontend/src/api/tenantApi.tsx index 7c1cbe4..0af4ee9 100644 --- a/frontend/src/api/tenantApi.tsx +++ b/frontend/src/api/tenantApi.tsx @@ -11,7 +11,7 @@ class TenantsApi extends api { const url = '/api/private/tenant/create'; let params = tenant; this.getClient(axiosClient => { - axiosClient.post(url, params) + axiosClient.post(url, { params }) .then((data) => { resolve(data); }).catch((error) => { diff --git a/frontend/src/components/forms/tenantForm.tsx b/frontend/src/components/forms/tenantForm.tsx index 29fc9fb..d0f20b5 100644 --- a/frontend/src/components/forms/tenantForm.tsx +++ b/frontend/src/components/forms/tenantForm.tsx @@ -3,32 +3,29 @@ import { connect } from 'react-redux'; import authutils from '../../utils/authutils'; import * as NotificationActions from '../../actions/notificationActions'; import * as UserActions from '../../actions/userActions'; -import UserApi from './../../api/userApi'; +import TenantApi from './../../api/tenantApi'; import DNSBaseComponent from '../dnsBaseComponent'; import { Grid, Input, Button, Container, Segment, Card, Image, Form } from 'semantic-ui-react'; import { history } from '../../main'; import _ from 'lodash'; -import { Link } from 'react-router-dom'; -import { IUser } from '../../../interfaces/user'; +import { ITenant } from '../../../interfaces/tenant'; interface CompProps { + tenant?: ITenant; + onBack?: (arg?: any) => any; + } interface CompState { - confirm_password?: string; - email?: string; - username?: string; - password?: string; - isLogin?: boolean; + description?: string; + edge_interface_name?: string; } class TenantForm extends DNSBaseComponent { state = { - confirm_password: '', - email: '', - username: '', - password: '', + description: '', + edge_interface_name: '' }; constructor(props: any) { @@ -58,22 +55,24 @@ class TenantForm extends DNSBaseComponent { }); } - async createUser() { + async createTenant() { try { - if (this.state.email && this.state.username && this.state.password && this.state.confirm_password) { - const user: IUser = { - username: this.state.username, - email: this.state.email, - password: this.state.password + if (this.state.edge_interface_name && this.state.description) { + const tenant: ITenant = { + description: this.state.description, + edge_interface_name: this.state.edge_interface_name }; - const registerPromise = UserApi.createUser(user); + const registerPromise = TenantApi.create(tenant); this.registerPromise(registerPromise); const responseCreate: any = await registerPromise; if (responseCreate && responseCreate.status === 200 && responseCreate.data) { - if (responseCreate.data.message === 'Creation successfully done') + if (responseCreate.data.message === 'Tenant successfully created') { this.props.dispatchNotification('Creation successfully done', 'success', Math.random()); - if (responseCreate.data.message === 'User already exists.') - this.props.dispatchNotification(`User already exists.`, 'warning', Math.random()); + } else if (responseCreate.data.message === 'Tenant already exists') { + this.props.dispatchNotification('Creation successfully done', 'warning', Math.random()); + } else { + this.props.dispatchNotification(`Error creation.`, 'error', Math.random()); + } } } else { this.props.dispatchNotification(`Missing Data`, 'warning', Math.random()); @@ -89,17 +88,17 @@ class TenantForm extends DNSBaseComponent { - Create User + Create Tenant
{ this.handleChange(event); }} @@ -107,42 +106,21 @@ class TenantForm extends DNSBaseComponent { { - this.handleChange(event); - }} - /> - - - { - this.handleChange(event); - }} - /> - - - { this.handleChange(event); }} /> + diff --git a/frontend/src/components/tables/tenantTable.tsx b/frontend/src/components/tables/tenantTable.tsx index b8a347a..b925fbc 100644 --- a/frontend/src/components/tables/tenantTable.tsx +++ b/frontend/src/components/tables/tenantTable.tsx @@ -35,7 +35,7 @@ class TenantTable extends DNSBaseComponent { paginationOpts: { activePage: 1, totalPages: 1, - itemPerPage: Constants.pagination.itemPerPage + itemsPerPage: Constants.pagination.itemsPerPage }, search: '', selectedTenant: {}, @@ -113,16 +113,16 @@ class TenantTable extends DNSBaseComponent { const options = search ? { activePage: 1, totalPages: 1, - itemPerPage: Constants.pagination.itemPerPage + itemsPerPage: Constants.pagination.itemsPerPage } : this.state.paginationOpts; const getTenantsPromise = TenantApi.getAll(options, searchValue); this.registerPromise(getTenantsPromise); const tenantsResponse: any = await getTenantsPromise; const newSearch = search ? this.state.search : ""; - if (tenantsResponse && tenantsResponse.data && tenantsResponse.data.payload) { + if (tenantsResponse && tenantsResponse.data && tenantsResponse.data.payload.tenants && tenantsResponse.data.payload.options) { _.defer(() => { this.setState({ - tenants: tenantsResponse.data.payload, + tenants: tenantsResponse.data.payload.tenants, paginationOpts: tenantsResponse.data.payload.options, search: newSearch, loading: false @@ -135,7 +135,7 @@ class TenantTable extends DNSBaseComponent { paginationOpts: { activePage: 1, totalPages: 1, - itemPerPage: Constants.pagination.itemPerPage + itemsPerPage: Constants.pagination.itemsPerPage }, search: newSearch, loading: false @@ -228,7 +228,7 @@ class TenantTable extends DNSBaseComponent { - {/* { this.handlePaginationChange(event, { activePage }); }} totalPages={this.state.paginationOpts.totalPages} - /> */} + /> diff --git a/frontend/src/constants.tsx b/frontend/src/constants.tsx index f07f490..396005d 100644 --- a/frontend/src/constants.tsx +++ b/frontend/src/constants.tsx @@ -12,6 +12,6 @@ export const jwt = { }; export const pagination = { - itemPerPage: 25 + itemsPerPage: 25 }; diff --git a/frontend/src/routes.tsx b/frontend/src/routes.tsx index 69c3287..c0f1680 100644 --- a/frontend/src/routes.tsx +++ b/frontend/src/routes.tsx @@ -3,6 +3,7 @@ import _ from 'lodash'; import LoginPage from './components/pages/loginPage'; import DNSForm from './components/forms/DNSForm'; import HomePage from './components/pages/homePage'; +import TenantForm from './components/forms/tenantForm'; interface ApplicationRouteGroup { name: string; @@ -41,6 +42,15 @@ export const appRoutes: ApplicationRouteGroup[] = [ menuLabel: 'home', showTopbar: true }, + { + path: '/tenant/new', + name: 'tenant', + restricted: false, + exact: true, + component: TenantForm, + menuLabel: 'Tenant', + showTopbar: true + }, ] }, {