Skip to content

Commit

Permalink
Fix adding of Room entities, fix updating, add deletion
Browse files Browse the repository at this point in the history
  • Loading branch information
@RedMickey
RedMickey committed Mar 21, 2020
1 parent 8dcffbc commit ca8ce2f
Show file tree
Hide file tree
Showing 8 changed files with 2,021 additions and 15,335 deletions.
13,507 changes: 0 additions & 13,507 deletions react-frontend/things-manager-frontend/package-lock.json
View file

This file was deleted.

4 changes: 2 additions & 2 deletions react-frontend/things-manager-frontend/package.json
View file
Expand Up @@ -9,8 +9,8 @@
"moment": "^2.24.0",
"open-iconic": "^1.1.1",
"react": "^16.12.0",
"react-bootstrap": "^1.0.0-beta.16",
"react-bootstrap-typeahead": "^3.4.7",
"react-bootstrap": "^1.0.0-beta.17",
"react-bootstrap-typeahead": "4.1.0",
"react-dom": "^16.12.0",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
Expand Down
Empty file added ...-manager-frontend/src/components/page-components/building_typeahead/BuildingTypeahead.css
View file
Empty file.
40 changes: 40 additions & 0 deletions ...s-manager-frontend/src/components/page-components/building_typeahead/BuildingTypeahead.js
View file
@@ -0,0 +1,40 @@
import React, { Component } from 'react'
import { Typeahead, AsyncTypeahead } from 'react-bootstrap-typeahead';
import 'react-bootstrap-typeahead/css/Typeahead.css';
import 'react-bootstrap-typeahead/css/Typeahead-bs4.css';

export class BuildingTypeahead extends Component {

onSelectedBuildingUpdated(newValue, reason) {
if (reason === "inp") {
this.props.setFieldValue("building", newValue);
} else {
if (!newValue.name) return;
this.props.setFieldValue("building", newValue);
}
}

render() {
return (
<Typeahead
labelKey="name"
id="typeahead"
options={this.props.options}
placeholder="Выберите строение"
onChange={(selected) => {
const building = selected.length > 0 ? selected[0] : {id: undefined, name: undefined};
this.onSelectedBuildingUpdated(building, "sel");
}}
onInputChange={(text, event) => {
const building = {id: undefined, name: text};
this.onSelectedBuildingUpdated(building, "inp");
}}
ref={this.props.getReference}
selected={this.props.selected}
defaultInputValue={this.props.defaultInputValue}
/>
)
}
}

export default BuildingTypeahead
10 changes: 6 additions & 4 deletions ...tend/things-manager-frontend/src/components/pages/building-page-component/BuildingPage.js
View file
Expand Up @@ -129,11 +129,13 @@ export class BuildingPage extends Component {
return (
<div>
<Breadcrumb className="mt-3 mb-2">
<Breadcrumb.Item href="#"><span class="oi oi-home"></span></Breadcrumb.Item>
<Breadcrumb.Item as={Link} to="/">
{this.props.users[0].username}
<Breadcrumb.Item>
<Link to="/"><span class="oi oi-home"></span></Link>
</Breadcrumb.Item>
<Breadcrumb.Item as={Link} to="/thingsList">Строения</Breadcrumb.Item>
<Breadcrumb.Item>
<Link to="/">{this.props.users[0].username}</Link>
</Breadcrumb.Item>
<Breadcrumb.Item><Link to="/buildings">Строения</Link></Breadcrumb.Item>
<Breadcrumb.Item active>{this.state.buildingName}</Breadcrumb.Item>
</Breadcrumb>
<Row>
Expand Down
69 changes: 45 additions & 24 deletions react-frontend/things-manager-frontend/src/components/pages/room-page-component/RoomPage.js
View file
Expand Up @@ -29,6 +29,7 @@ import { getUsers } from '../../../selectors/userSelector';
import { DeletionErrorModal } from '../../page-components/deletion_error_modal/DeletionErrorModal';
import { getRoomDataById, savePlace, deletePlaceById, getPlacesByPlaceType } from '../../../api/placeService';
import * as Moment from 'moment';
import BuildingTypeahead from '../../page-components/building_typeahead/BuildingTypeahead';

const mapStateToProps = state => ({
users: getUsers(state),
Expand All @@ -43,7 +44,7 @@ export class RoomPage extends Component {
isExtended: false,
spaceCount: undefined,
thingCount: undefined,
selectedBuilding: {},
selectedBuilding: undefined,
roomName: "",
room: undefined,
creationTimestamp: undefined,
Expand All @@ -55,14 +56,16 @@ export class RoomPage extends Component {
options: [],
};

this.typeaheadBuilding = undefined;

this.roomSchema = Yup.object().shape({
buildingName: Yup.string(),
building: Yup.string(),
roomName: Yup.string()
.required('Заполните это поле'),
description: Yup.string(),
});

this.onTypeaheadValueChange = this.onTypeaheadValueChange.bind(this);
this.onDeleteBuilding = this.onDeleteBuilding.bind(this);
}

componentDidMount() {
Expand Down Expand Up @@ -94,18 +97,11 @@ export class RoomPage extends Component {
});
}

onTypeaheadValueChange(selectedOptions) {
this.setState({
selectedBuilding: selectedOptions[0]
});
console.log(selectedOptions);
}

onRoomUpdate(values) {
console.log(values);

let updatedPlace = Object.assign(this.state.building);
updatedPlace.outerPlace = {idPlace: this.state.selectedBuilding.id};
let updatedPlace = Object.assign(this.state.room);
updatedPlace.outerPlace = {idPlace: values.building.id};
updatedPlace.placeName = values.roomName;
updatedPlace.description = values.description;

Expand All @@ -119,9 +115,11 @@ export class RoomPage extends Component {
updatedSuccessfully: true,
room: savedRoom,
roomName: savedRoom.placeName,
buildingName: savedRoom.outerPlace.placeName,
creationTimestamp: savedRoom.creationTimestamp,
updateTimestamp: savedRoom.updateTimestamp,
status: savedRoom.itemStatus.statusName,
selectedBuilding: {id: savedRoom.outerPlace.idPlace, name: savedRoom.outerPlace.placeName},
});
})
.catch(err => {
Expand All @@ -130,20 +128,41 @@ export class RoomPage extends Component {
});
}

onDeleteBuilding() {
console.log(this);
if (this.state.spaceCount > 0 || this.state.thingCount > 0) {
const errorMessage = `Невозможно удалить строение т.к. в нем находится ` +
`${this.state.spaceCount} мест хранения и ${this.state.thingCount} вещей.`
this.setState({
isShownDeletionErrorModal: true,
deletionErrorMessage: errorMessage,
});
return;
}
deletePlaceById(this.state.room.idPlace, this.props.users[0].token)
.then(() => {
this.props.history.push("/rooms");
});
}

render() {
return (
<div>
<Breadcrumb className="mt-3 mb-2">
<Breadcrumb.Item href="#"><span class="oi oi-home"></span></Breadcrumb.Item>
<Breadcrumb.Item as={Link} to="/">
{this.props.users[0].username}
<Breadcrumb.Item>
<Link to="/"><span class="oi oi-home"></span></Link>
</Breadcrumb.Item>
<Breadcrumb.Item>
<Link to="/">{this.props.users[0].username}</Link>
</Breadcrumb.Item>
<Breadcrumb.Item>
<Link to="/rooms">Помещения</Link>
</Breadcrumb.Item>
<Breadcrumb.Item as={Link} to="/thingsList">Помещения</Breadcrumb.Item>
<Breadcrumb.Item active>{this.state.roomName}</Breadcrumb.Item>
</Breadcrumb>
<Row>
<Col>
<h1 className="px-3 theme-header">{this.state.thingName}</h1>
<h1 className="px-3 theme-header">{this.state.roomName}</h1>
</Col>
</Row>

Expand Down Expand Up @@ -195,7 +214,7 @@ export class RoomPage extends Component {
<Card bg="light" className="mt-3 mt-md-0">
<Card.Body>
Помещение «{this.state.roomName}» находится в
строении <Link to={`/building/${this.state.selectedBuilding.id}`}>{this.state.selectedBuilding.name}</Link>
строении {this.state.selectedBuilding && <Link to={`/building/${this.state.selectedBuilding.id}`}>{this.state.selectedBuilding.name}</Link>}
</Card.Body>
</Card>
</Col>
Expand All @@ -214,7 +233,7 @@ export class RoomPage extends Component {
<Button variant="secondary" className="mb-2">Отсутствует</Button>
</Col>
<Col xs={4} className="text-right">
<Button variant="danger" className="mb-2">
<Button variant="danger" className="mb-2" onClick={this.onDeleteBuilding}>
<span class="oi oi-trash"></span> Удалить
</Button>
</Col>
Expand All @@ -233,6 +252,9 @@ export class RoomPage extends Component {
enableReinitialize={true}
validationSchema={this.roomSchema}
onSubmit={(values, actions) => {
if (!values.building) {
values.building = this.state.selectedBuilding;
}
this.onRoomUpdate(values);
}}
initialValues={{
Expand All @@ -249,19 +271,18 @@ export class RoomPage extends Component {
isValid,
errors,
resetForm,
setFieldValue,
}) => (
<Form noValidate onSubmit={handleSubmit}>
<Form.Group as={Row} controlId="formPlaintextEmail">
<Form.Label column sm="4" className="text-right">
Строение
</Form.Label>
<Col sm="8">
{/*<Form.Control defaultValue="Строение" />*/}
<Typeahead
labelKey="name"
<BuildingTypeahead
options={this.state.options}
placeholder="Выберите строение"
onChange={this.onTypeaheadValueChange}
setFieldValue={setFieldValue}
getReference={(typeahead) => this.typeaheadBuilding = typeahead}
/>
</Col>
</Form.Group>
Expand Down
48 changes: 25 additions & 23 deletions ...d/things-manager-frontend/src/components/pages/rooms-list-page-component/RoomsListPage.js
View file
Expand Up @@ -17,10 +17,6 @@ import {
Alert
} from 'react-bootstrap';

import { Typeahead, AsyncTypeahead } from 'react-bootstrap-typeahead';
import 'react-bootstrap-typeahead/css/Typeahead.css';
import 'react-bootstrap-typeahead/css/Typeahead-bs4.css';

import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import { Formik } from 'formik';
Expand All @@ -29,6 +25,7 @@ import './RoomsListPage.css';
import { getUsers } from '../../../selectors/userSelector';
import { savePlace, getRoomStatistics, getPlacesByPlaceType } from '../../../api/placeService';
import * as Moment from 'moment';
import BuildingTypeahead from '../../page-components/building_typeahead/BuildingTypeahead';

const mapStateToProps = state => ({
users: getUsers(state),
Expand All @@ -46,17 +43,17 @@ export class RoomsListPage extends Component {
addedSuccessfully: false,
addingError: false,
options: [],
selectedBuilding: undefined,
};

this.typeaheadBuilding = undefined;

this.roomSchema = Yup.object().shape({
buildingName: Yup.string(),
building: Yup.string(),
roomName: Yup.string()
.required('Заполните это поле'),
description: Yup.string(),
});

this.onTypeaheadValueChange = this.onTypeaheadValueChange.bind(this);
this.onRoomAdd = this.onRoomAdd.bind(this);
}

Expand All @@ -81,11 +78,16 @@ export class RoomsListPage extends Component {

onRoomAdd(values) {
console.log(values);
if (!values.building.id) {
const selectedBuilding = this.state.options.find(building => building.name === values.building.name);
values.building.id = selectedBuilding && selectedBuilding.id;
}

savePlace({
placeName: values.roomName,
description: values.description,
idPlaceType: 2,
outerPlace: {idPlace: this.state.selectedBuilding.id},
outerPlace: {idPlace: values.building.id},
idUser: this.props.users[0].userId,
},
this.props.users[0].token
Expand All @@ -101,20 +103,15 @@ export class RoomsListPage extends Component {
});
}

onTypeaheadValueChange(selectedOptions) {
this.setState({
selectedBuilding: selectedOptions[0]
});
console.log(selectedOptions);
}

render() {
return (
<div>
<Breadcrumb className="mt-3 mb-2">
<Breadcrumb.Item href="#"><span class="oi oi-home"></span></Breadcrumb.Item>
<Breadcrumb.Item as={Link} to="/">
{this.props.users[0].username}
<Breadcrumb.Item>
<Link to="/"><span class="oi oi-home"></span></Link>
</Breadcrumb.Item>
<Breadcrumb.Item>
<Link to="/">{this.props.users[0].username}</Link>
</Breadcrumb.Item>
<Breadcrumb.Item active>Помещения</Breadcrumb.Item>
</Breadcrumb>
Expand Down Expand Up @@ -176,10 +173,16 @@ export class RoomsListPage extends Component {
Помещение успешно добавлено
</Alert>
}
{this.state.addingError &&
<Alert variant="danger" onClose={() => this.setState({addingError: false})} dismissible>
Ошибка при добавлении помещения
</Alert>
}
<Formik
validationSchema={this.roomSchema}
onSubmit={(values, actions) => {
this.onRoomAdd(values);
this.typeaheadBuilding.getInstance().clear();
actions.resetForm();
}}
initialValues={{
Expand All @@ -196,19 +199,18 @@ export class RoomsListPage extends Component {
isValid,
errors,
resetForm,
setFieldValue,
}) => (
<Form noValidate onSubmit={handleSubmit}>
<Form.Group as={Row} controlId="formPlaintextEmail">
<Form.Label column sm="4" className="text-right">
Строение
</Form.Label>
<Col sm="8">
{/*<Form.Control defaultValue="Строение" />*/}
<Typeahead
labelKey="name"
<BuildingTypeahead
options={this.state.options}
placeholder="Выберите строение"
onChange={this.onTypeaheadValueChange}
setFieldValue={setFieldValue}
getReference={(typeahead) => this.typeaheadBuilding = typeahead}
/>
</Col>
</Form.Group>
Expand Down

0 comments on commit ca8ce2f

Please sign in to comment.