From 8bdb59d86838577a5c1b29fe0bd227e89324346b Mon Sep 17 00:00:00 2001 From: Melania Dello Spedale La Paglia Date: Fri, 27 Mar 2020 18:04:04 +0100 Subject: [PATCH] gestita modifica device #11 --- backend/src/routes/private/deviceRoutes.ts | 11 +- frontend/src/api/deviceApi.tsx | 22 ++- frontend/src/api/tenantApi.tsx | 2 +- .../forms/{DNSForm.tsx => _deviceForm.tsx} | 0 frontend/src/components/forms/deviceForm.tsx | 133 ++++++++++++------ frontend/src/components/pages/homePage.tsx | 4 +- .../src/components/tables/deviceTable.tsx | 27 +++- frontend/src/routes.tsx | 15 +- 8 files changed, 152 insertions(+), 62 deletions(-) rename frontend/src/components/forms/{DNSForm.tsx => _deviceForm.tsx} (100%) diff --git a/backend/src/routes/private/deviceRoutes.ts b/backend/src/routes/private/deviceRoutes.ts index 9eaa36f..eaad9ac 100644 --- a/backend/src/routes/private/deviceRoutes.ts +++ b/backend/src/routes/private/deviceRoutes.ts @@ -14,9 +14,9 @@ router.get( res: express.Response, next: express.NextFunction ) => { - const tenant_id = req.query.id; + const device_id = req.query.id; try { - const deviceResponse = await deviceStore.findById(tenant_id); + const deviceResponse = await deviceStore.findById(device_id); if (deviceResponse && deviceResponse.length == 1) { const device = deviceResponse[0]; const result = factory.generateSuccessResponse(device, null, "Device found"); @@ -52,7 +52,7 @@ router.get( if (devicesRes && devicesRes.length > 0) { const result = factory.generateSuccessResponse( - {devices: devicesRes, options: searchOptions}, + { devices: devicesRes, options: searchOptions }, null, 'Devices found' ); @@ -106,6 +106,9 @@ router.post('/create', async (req, res, next) => { router.put('/update', async (req, res, next) => { const device = req.body.params; try { + console.log("device", device); + console.log("req.body", req.body); + if (!device.id) { const result = factory.generateErrorResponse(null, null, 'Error'); res.status(HttpStatus.BAD_REQUEST).json(result); @@ -114,7 +117,7 @@ router.put('/update', async (req, res, next) => { let message = ''; if (devices.length == 1) { const resUpdate = await deviceStore.update(device); - if (resUpdate && resUpdate.length == 1) { + if (resUpdate) { message = 'Device successfully updated' const result = factory.generateSuccessResponse(null, null, message); res.status(HttpStatus.OK).json(result); diff --git a/frontend/src/api/deviceApi.tsx b/frontend/src/api/deviceApi.tsx index 6cb3f45..32868a9 100644 --- a/frontend/src/api/deviceApi.tsx +++ b/frontend/src/api/deviceApi.tsx @@ -26,7 +26,7 @@ class DevicesApi extends api { const url = '/api/private/device/update'; let params = device; this.getClient(axiosClient => { - axiosClient.put(url, params) + axiosClient.put(url, { params }) .then((data) => { resolve(data); }).catch((error) => { @@ -57,6 +57,22 @@ class DevicesApi extends api { }); } + getById(device_id: number) { + return new BBPromise((resolve, reject) => { + const url = '/api/private/device'; + let params: any = { id: device_id }; + + this.getClient(axiosClient => { + axiosClient.get(url, { params }) + .then((data) => { + resolve(data); + }).catch((error) => { + resolve(error); + }); + }, null, false); + }); + } + async delete(tenant_id: number): BBPromise { return new BBPromise((resolve, reject) => { const url = '/api/private/device/delete'; @@ -73,5 +89,5 @@ class DevicesApi extends api { } } -const treatmentsApi = new DevicesApi(); -export default treatmentsApi; +const devicesApi = new DevicesApi(); +export default devicesApi; diff --git a/frontend/src/api/tenantApi.tsx b/frontend/src/api/tenantApi.tsx index 0af4ee9..c01e9ef 100644 --- a/frontend/src/api/tenantApi.tsx +++ b/frontend/src/api/tenantApi.tsx @@ -26,7 +26,7 @@ class TenantsApi extends api { const url = '/api/private/tenant/update'; let params = tenant; this.getClient(axiosClient => { - axiosClient.put(url, params) + axiosClient.put(url, { params }) .then((data) => { resolve(data); }).catch((error) => { diff --git a/frontend/src/components/forms/DNSForm.tsx b/frontend/src/components/forms/_deviceForm.tsx similarity index 100% rename from frontend/src/components/forms/DNSForm.tsx rename to frontend/src/components/forms/_deviceForm.tsx diff --git a/frontend/src/components/forms/deviceForm.tsx b/frontend/src/components/forms/deviceForm.tsx index bfb5355..de81711 100644 --- a/frontend/src/components/forms/deviceForm.tsx +++ b/frontend/src/components/forms/deviceForm.tsx @@ -11,18 +11,16 @@ import _ from 'lodash'; import { IDevice } from '../../../interfaces/device'; interface CompProps { - device?: IDevice; onBack?: (arg?: any) => any; - } interface CompState { dns_name_auto: string; dns_name_manual: string; is_gw: boolean; - gw_id: number; + gw_id: number | any; mac_address: string; - tenant_id: number; + tenant_id: number | any; } class DeviceForm extends DNSBaseComponent { @@ -32,7 +30,7 @@ class DeviceForm extends DNSBaseComponent { is_gw: false, gw_id: null, mac_address: '', - tenant_id: null, + tenant_id: null }; constructor(props: any) { @@ -43,6 +41,7 @@ class DeviceForm extends DNSBaseComponent { } componentDidMount() { + this.init(); } componentWillReceiveProps(nextProps: any) { @@ -62,28 +61,72 @@ class DeviceForm extends DNSBaseComponent { }); } - async createDevice() { + async init() { + console.log("INITTTTTTTTT", this.props); + if (this.props.match.params.device_id) { + let device: IDevice = { id: this.props.match.params.device_id }; + console.log("device", device); + + if (this.props.location.state && this.props.location.state.device) { + console.log("device", this.props.location.state); + device = this.props.location.state.device; + + } else { + const deviceResponsePromise: any = DeviceApi.getById(this.props.match.params.device_id); + this.registerPromise(deviceResponsePromise); + const deviceResponse = await deviceResponsePromise; + console.log("deviceResponse", deviceResponse); + if (deviceResponse && deviceResponse.data && deviceResponse.data.payload) { + device = deviceResponse.data.payload; + } + + } + if (device && device.id) { + this.setState({ + dns_name_auto: device.dns_name_auto || '', + dns_name_manual: device.dns_name_manual || '', + is_gw: device.is_gw, + gw_id: device.gw_id, + mac_address: device.mac_address || '', + tenant_id: device.tenant_id + }); + } + } + } + + async submit() { try { if (this.state.mac_address && this.state.dns_name_manual) { - const tenant: IDevice = { + const device: IDevice = { mac_address: this.state.mac_address, dns_name_manual: this.state.dns_name_manual }; - const registerPromise = DeviceApi.create(tenant); + let registerPromise: any = null; + if (this.props.match && this.props.match.params && this.props.match.params.device_id) { + device.id = this.props.match.params.device_id; + registerPromise = DeviceApi.update(device); + } else { + registerPromise = DeviceApi.create(device); + } this.registerPromise(registerPromise); const responseCreate: any = await registerPromise; + if (responseCreate && responseCreate.status === 200 && responseCreate.data) { - if (responseCreate.data.message === 'Tenant successfully created') { + if (responseCreate.data.message === 'Device successfully created') { this.props.dispatchNotification('Creation successfully done', 'success', Math.random()); - } else if (responseCreate.data.message === 'Tenant already exists') { + } else if (responseCreate.data.message === 'Device already exists') { this.props.dispatchNotification('Creation successfully done', 'warning', Math.random()); + } if (responseCreate.data.message === 'Device successfully updated') { + this.props.dispatchNotification('the change was successful', 'success', Math.random()); } else { this.props.dispatchNotification(`Error creation.`, 'error', Math.random()); } } + } else { this.props.dispatchNotification(`Missing Data`, 'warning', Math.random()); } + } catch (error) { console.log('error: ', error); this.props.dispatchNotification('Sign Up Error', 'error', Math.random()); @@ -93,50 +136,50 @@ class DeviceForm extends DNSBaseComponent { render() { return ( <> - - + Creazione Device
- - - { - this.handleChange(event); - }} - /> - - - { - this.handleChange(event); + + + { + this.handleChange(event); + }} + /> + + + { + this.handleChange(event); + }} + /> + + + - - -
+ + + ); } diff --git a/frontend/src/components/pages/homePage.tsx b/frontend/src/components/pages/homePage.tsx index 902957c..d9af4d5 100644 --- a/frontend/src/components/pages/homePage.tsx +++ b/frontend/src/components/pages/homePage.tsx @@ -5,7 +5,7 @@ import DNSBaseComponent from '../dnsBaseComponent'; import { history } from '../../main'; import * as NotificationActions from '../../actions/notificationActions'; import authutils from '../../utils/authutils'; -import DNSForm from "../forms/DNSForm"; +import DeviceForm from "../forms/deviceForm"; import CreateUserForm from "../forms/createUserForm"; import TenantTable from "../tables/tenantTable"; @@ -36,8 +36,6 @@ class HomePage extends DNSBaseComponent { render() { return ( - // - // ); } diff --git a/frontend/src/components/tables/deviceTable.tsx b/frontend/src/components/tables/deviceTable.tsx index 3efe5f4..683b6ea 100644 --- a/frontend/src/components/tables/deviceTable.tsx +++ b/frontend/src/components/tables/deviceTable.tsx @@ -119,7 +119,7 @@ class TenantTable extends DNSBaseComponent { this.registerPromise(getDevicesPromise); const devicesResponse: any = await getDevicesPromise; const newSearch = search ? this.state.search : ""; - if (devicesResponse && devicesResponse.data && devicesResponse.data.payload.devices && devicesResponse.data.payload.options) { + if (devicesResponse && devicesResponse.data && devicesResponse.data.payload.devices && devicesResponse.data.payload.options) { _.defer(() => { this.setState({ devices: devicesResponse.data.payload.devices, @@ -145,7 +145,7 @@ class TenantTable extends DNSBaseComponent { }); } - renderTenants() { + renderTenants() { console.log("this.state.devices", this.state.devices); return _.map(this.state.devices, (device: IDevice, idx) => { @@ -160,6 +160,25 @@ class TenantTable extends DNSBaseComponent { className="truncate cellTable" >{device.dns_name_manual} + + + + { + history.push({ + pathname: `/device/edit/${device.id}`, + state: { device } + }) + + }} + > + + ) }) @@ -220,6 +239,8 @@ class TenantTable extends DNSBaseComponent { Mac Address DNS Name Manual + Actions + @@ -227,7 +248,7 @@ class TenantTable extends DNSBaseComponent { - +