make filters work (almost)
This commit is contained in:
parent
395cfa0e3b
commit
c91eba0a62
|
@ -59,17 +59,24 @@ class ApartmentFilter(viewsets.ViewSet):
|
|||
|
||||
def list(self, req: Request):
|
||||
filters = dict(req.data);
|
||||
unfiltered = ApartamentDetailSerializer(Apartament.objects.all()[:100], many=True).data;
|
||||
unfiltered = Apartament.objects.all();
|
||||
filtered = [];
|
||||
|
||||
# TODO: Some better converting practice?
|
||||
filters['price_range']['from'] = int(filters['price_range']['from']);
|
||||
filters['price_range']['to'] = int(filters['price_range']['to']);
|
||||
filters['area_range']['from'] = int(filters['area_range']['from']);
|
||||
filters['area_range']['to'] = int(filters['area_range']['to']);
|
||||
filters['rooms'] = int(filters['rooms'])
|
||||
|
||||
for entry in unfiltered:
|
||||
if (filters['price_range']['from'] >= entry['price'] and (filters['price_range']['to'] != -1 and filters['price_range']['to'] <= entry['price'])):
|
||||
if (filters['price_range']['from'] >= entry.price and (filters['price_range']['to'] != -1 and filters['price_range']['to'] <= entry.price)):
|
||||
continue;
|
||||
if (filters['area_range']['from'] >= entry['perimetrs'] and (filters['area_range']['to'] != -1 and filters['area_range']['to'] <= entry['perimetrs'])):
|
||||
if (filters['area_range']['from'] >= entry.perimetrs and (filters['area_range']['to'] != -1 and filters['area_range']['to'] <= entry.perimetrs)):
|
||||
continue;
|
||||
if (filters['rooms'] != -1 and entry['rooms'] != filters['rooms']):
|
||||
if (filters['rooms'] != -1 and entry.rooms != filters['rooms']):
|
||||
continue;
|
||||
|
||||
filtered.append(entry);
|
||||
|
||||
return Response(filtered);
|
||||
return Response(ApartamentListSerializer(filtered, many=True).data);
|
|
@ -25,7 +25,7 @@ SECRET_KEY = 'django-insecure-=(7b+4ka=5jak-mokuh4#-6_14f58#^0kjwqsz7wyon$4i@sel
|
|||
# SECURITY WARNING: don't run with debug turned on in production!
|
||||
DEBUG = True
|
||||
|
||||
ALLOWED_HOSTS = []
|
||||
ALLOWED_HOSTS = ['*']
|
||||
|
||||
|
||||
# Application definition
|
||||
|
|
|
@ -0,0 +1,34 @@
|
|||
class Range {
|
||||
/** @type {number} */
|
||||
from;
|
||||
|
||||
/** @type {number} */
|
||||
to;
|
||||
}
|
||||
|
||||
class Filters {
|
||||
/** @type { Range } */
|
||||
price_range;
|
||||
|
||||
/** @type { Range } */
|
||||
area_range;
|
||||
|
||||
/** @type { string[] } */
|
||||
lease_period;
|
||||
|
||||
/** @type { string } */
|
||||
address;
|
||||
|
||||
/** @type { number } */
|
||||
rooms;
|
||||
|
||||
constructor() {
|
||||
this.price_range = new Range();
|
||||
this.area_range = new Range();
|
||||
this.lease_period = [];
|
||||
this.address = '';
|
||||
this.rooms = 0;
|
||||
}
|
||||
}
|
||||
|
||||
export { Filters, Range }
|
|
@ -4,6 +4,7 @@ import { Scrollbar, Navigation } from 'swiper/core';
|
|||
import ISVGIcon from '../../components/UI/Icon/SVGIcon';
|
||||
import Select from 'react-select';
|
||||
import ApartmentsList from "../../components/ApartmentsList";
|
||||
import { Filters } from "../../API/Filters";
|
||||
|
||||
import styled from 'styled-components';
|
||||
import 'swiper/css';
|
||||
|
@ -15,6 +16,9 @@ import './swiper.css';
|
|||
import ApartamentService from "../../API/ApartamentService";
|
||||
import { HashLoader } from 'react-spinners';
|
||||
|
||||
import constants from "../../constants";
|
||||
|
||||
const API_ROOT = constants.API_ROOT;
|
||||
|
||||
const SVGIcon = styled(ISVGIcon)`
|
||||
margin-left:0;
|
||||
|
@ -37,7 +41,7 @@ const SwiperImage = styled.div`
|
|||
height: 100%;
|
||||
`;
|
||||
|
||||
const Filters = styled.div`
|
||||
const FiltersEl = styled.div`
|
||||
background: url(/images/filter.png);
|
||||
height: 300px;
|
||||
width: 1150px;
|
||||
|
@ -163,7 +167,7 @@ const Splash = styled.h3`
|
|||
text-align: center;
|
||||
`;
|
||||
|
||||
const FiltersForm = () => {
|
||||
const FiltersForm = (props) => {
|
||||
|
||||
const apart_sizes = [
|
||||
{ value: 0, label: "Гостинка" },
|
||||
|
@ -175,7 +179,7 @@ const FiltersForm = () => {
|
|||
|
||||
const def_form = {
|
||||
per_day: false,
|
||||
per_month: false,
|
||||
per_month: true,
|
||||
|
||||
area_from: '',
|
||||
area_to: '',
|
||||
|
@ -185,7 +189,9 @@ const FiltersForm = () => {
|
|||
|
||||
address: '',
|
||||
|
||||
rooms: 0,
|
||||
rooms: { value: -1, label: 'Выберите' },
|
||||
|
||||
form_err: false
|
||||
};
|
||||
|
||||
|
||||
|
@ -195,8 +201,28 @@ const FiltersForm = () => {
|
|||
return setState_({...state, ...new_state});
|
||||
}
|
||||
|
||||
const onSumbit = () => {
|
||||
let transformed = new Filters();
|
||||
|
||||
transformed.address = state.address;
|
||||
transformed.area_range = {
|
||||
from: state.area_from,
|
||||
to: state.area_to
|
||||
};
|
||||
transformed.price_range = {
|
||||
from: state.price_from,
|
||||
to: state.price_to
|
||||
};
|
||||
|
||||
if (state.per_day) transformed.lease_period.push('day');
|
||||
if (state.per_month) transformed.lease_period.push('month');
|
||||
if (state.rooms.value != -1) transformed.rooms = state.rooms.value;
|
||||
|
||||
if (props.onSubmit) props.onSubmit(transformed);
|
||||
}
|
||||
|
||||
return (
|
||||
<Filters>
|
||||
<FiltersEl>
|
||||
<FilterText>Фильтры</FilterText>
|
||||
|
||||
<PeriodFilter>
|
||||
|
@ -280,11 +306,11 @@ const FiltersForm = () => {
|
|||
</SearchBarText>
|
||||
</SearchBarFilter>
|
||||
|
||||
<SubmitBtn onClick={() => console.log(state)}>
|
||||
<SubmitBtn onClick={onSumbit}>
|
||||
<SVGIcon src='/images/icons/search.svg' width='14' height='14' />
|
||||
Показать варианты
|
||||
</SubmitBtn>
|
||||
</Filters>
|
||||
</FiltersEl>
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -295,6 +321,7 @@ export default class IndexPage extends React.Component {
|
|||
|
||||
this.state = {
|
||||
apartments: [],
|
||||
unfiltered: [],
|
||||
pageSize: 10,
|
||||
page: 0,
|
||||
data_loaded: false,
|
||||
|
@ -302,10 +329,32 @@ export default class IndexPage extends React.Component {
|
|||
};
|
||||
|
||||
ApartamentService.getAll(100).then(data => {
|
||||
this.setState({apartments: data.data.results, data_loaded: true});
|
||||
this.setState({apartments: data.data.results, unfiltered: data.data.results, data_loaded: true});
|
||||
}).catch(err => {
|
||||
this.setState({data_loaded: true, apartments: [], load_err: err.message});
|
||||
this.setState({data_loaded: true, apartments: [], unfiltered: data.data.results, load_err: err.message});
|
||||
});
|
||||
|
||||
this.filterData = this.filterData.bind(this);
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {Filters} filters
|
||||
*/
|
||||
async filterData(filters) {
|
||||
|
||||
const filtered_raw = await fetch(API_ROOT + '/api/apartaments/filters/', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(filters),
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).catch(err => console.error(err));
|
||||
|
||||
const filtered = await filtered_raw.json();
|
||||
|
||||
this.setState({apartments: filtered, data_loaded: true, load_err: false});
|
||||
;
|
||||
}
|
||||
|
||||
render() {
|
||||
|
@ -340,7 +389,7 @@ export default class IndexPage extends React.Component {
|
|||
<span style={{color: '#0066ff'}}> Владивостоке</span>
|
||||
</Title>
|
||||
|
||||
<FiltersForm />
|
||||
<FiltersForm onSubmit={this.filterData} />
|
||||
|
||||
<ApartmentsList list={current_data} />
|
||||
{
|
||||
|
|
Loading…
Reference in New Issue