some refactoring and enabling payment (final)
This commit is contained in:
@@ -21,7 +21,12 @@ function Transition(props) {
|
||||
return <Slide direction="down" {...props} />;
|
||||
}
|
||||
|
||||
let token = "";
|
||||
class NotificationModal extends React.Component {
|
||||
componentDidMount() {
|
||||
console.log("load sandbox");
|
||||
window.TCO.loadPubKey("sandbox");
|
||||
}
|
||||
handleOpen = () => {
|
||||
this.props.onModalOpen();
|
||||
};
|
||||
@@ -34,7 +39,7 @@ class NotificationModal extends React.Component {
|
||||
email
|
||||
);
|
||||
|
||||
handleInput = e => {
|
||||
handleEmail = e => {
|
||||
this.props.onUserDataChange({ info: "email", value: e.target.value });
|
||||
this.props.onUserDataChange({
|
||||
info: "validEmail",
|
||||
@@ -42,6 +47,10 @@ class NotificationModal extends React.Component {
|
||||
});
|
||||
};
|
||||
|
||||
handleInput = (e, infoName) => {
|
||||
this.props.onUserDataChange({ info: infoName, value: e.target.value });
|
||||
};
|
||||
|
||||
isChecked = optionName => Boolean(this.props.userdata[optionName]);
|
||||
|
||||
optionChange = optionName => {
|
||||
@@ -52,20 +61,62 @@ class NotificationModal extends React.Component {
|
||||
});
|
||||
};
|
||||
|
||||
handleSaveMarketAlert = () => {
|
||||
successCallback = data => {
|
||||
token = data.response.token.token;
|
||||
const {
|
||||
userdata: { email, last_date, olx_url }
|
||||
} = this.props;
|
||||
|
||||
axios
|
||||
.post("/marketalerts", {
|
||||
email,
|
||||
last_date,
|
||||
olx_url
|
||||
})
|
||||
.then(response => console.log(response.data))
|
||||
.then(response =>
|
||||
axios
|
||||
.post("/payforalert", {
|
||||
email,
|
||||
token
|
||||
})
|
||||
.then(response => {
|
||||
this.handleClose();
|
||||
alert("Market Alert Created");
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
)
|
||||
.catch(error => console.log(error));
|
||||
};
|
||||
|
||||
errorCallback = data => {
|
||||
if (data.errorCode === 200) {
|
||||
this.tokenRequest();
|
||||
} else {
|
||||
alert(data.errorMsg);
|
||||
}
|
||||
};
|
||||
|
||||
tokenRequest = () => {
|
||||
const {
|
||||
userdata: { ccNo, expYear, expMonth, cvv }
|
||||
} = this.props;
|
||||
const sellerId = "901402692";
|
||||
const publishableKey = "93546B8D-B726-4376-A6DF-F698FD8893CA";
|
||||
var args = {
|
||||
sellerId,
|
||||
publishableKey,
|
||||
ccNo,
|
||||
cvv,
|
||||
expMonth,
|
||||
expYear
|
||||
};
|
||||
window.TCO.requestToken(this.successCallback, this.errorCallback, args);
|
||||
};
|
||||
|
||||
handleSaveMarketAlert = () => {
|
||||
this.tokenRequest();
|
||||
};
|
||||
|
||||
render() {
|
||||
const {
|
||||
modal,
|
||||
@@ -125,15 +176,66 @@ class NotificationModal extends React.Component {
|
||||
/>
|
||||
|
||||
{this.isChecked("emailChecked") ? (
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="Email"
|
||||
inputProps={{
|
||||
"aria-label": "Min"
|
||||
}}
|
||||
type="email"
|
||||
onChange={this.handleInput}
|
||||
/>
|
||||
<div>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="Email"
|
||||
inputProps={{
|
||||
"aria-label": "Email"
|
||||
}}
|
||||
type="email"
|
||||
onChange={this.handleEmail}
|
||||
/>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
type="hidden"
|
||||
value={token}
|
||||
/>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="Card Number"
|
||||
inputProps={{
|
||||
"aria-label": "Card Number"
|
||||
}}
|
||||
required
|
||||
autoComplete="off"
|
||||
type="number"
|
||||
onChange={e => this.handleInput(e, "ccNo")}
|
||||
/>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="Expiration Year"
|
||||
inputProps={{
|
||||
"aria-label": "Expiration Year"
|
||||
}}
|
||||
required
|
||||
autoComplete="off"
|
||||
type="number"
|
||||
onChange={e => this.handleInput(e, "expYear")}
|
||||
/>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="Expiration Month"
|
||||
inputProps={{
|
||||
"aria-label": "Expiration Month"
|
||||
}}
|
||||
required
|
||||
autoComplete="off"
|
||||
type="number"
|
||||
onChange={e => this.handleInput(e, "expMonth")}
|
||||
/>
|
||||
<Input
|
||||
className={classes.inputStyle}
|
||||
placeholder="CVV"
|
||||
inputProps={{
|
||||
"aria-label": "CVV"
|
||||
}}
|
||||
required
|
||||
autoComplete="off"
|
||||
type="number"
|
||||
onChange={e => this.handleInput(e, "cvv")}
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
</DialogContent>
|
||||
<DialogActions className={classes.modalFooter}>
|
||||
|
||||
@@ -1,3 +1,92 @@
|
||||
// Kanton/Regija
|
||||
export const lokacijaOptions = {
|
||||
choices: [
|
||||
{ value: "9", label: "Sarajevo" },
|
||||
{ value: "2", label: "Posavski" }
|
||||
],
|
||||
value: "kanton",
|
||||
optionName: "kanton"
|
||||
};
|
||||
|
||||
// Grad
|
||||
export const gradoviOptions = {
|
||||
parentOptionName: "kanton",
|
||||
checkboxOptions: {
|
||||
"9": {
|
||||
elements: [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Ilidza",
|
||||
optionName: "grad-ilidza",
|
||||
value: "3879"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Centar",
|
||||
optionName: "grad-centar",
|
||||
value: "3812"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Hadzici",
|
||||
optionName: "grad-hadzici",
|
||||
value: "3817"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Ilijas",
|
||||
optionName: "grad-ilijas",
|
||||
value: "3892"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Novi Grad",
|
||||
optionName: "grad-novigrad",
|
||||
value: "3969"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Novo Sarajevo",
|
||||
optionName: "grad-novosarajevo",
|
||||
value: "5896"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Cijena
|
||||
export const cijenaRangeOptions = {
|
||||
min: 0,
|
||||
max: 100000,
|
||||
defaultValues: [0, 100000],
|
||||
step: 100,
|
||||
optionNames: ["od", "do"]
|
||||
};
|
||||
|
||||
// Stanje
|
||||
export const stanjeElements = [
|
||||
{
|
||||
type: "radio",
|
||||
value: 0,
|
||||
name: "Sve",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 1,
|
||||
name: "Novo",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 2,
|
||||
name: "Koristeno",
|
||||
optionName: "stanje"
|
||||
}
|
||||
];
|
||||
|
||||
// Vrsta Artikla
|
||||
export const vrstaElements = [
|
||||
{
|
||||
value: "",
|
||||
@@ -25,23 +114,7 @@ export const vrstaElements = [
|
||||
}
|
||||
];
|
||||
|
||||
export const lokacijaOptions = {
|
||||
choices: [
|
||||
{ value: "9", label: "Sarajevo" },
|
||||
{ value: "2", label: "Posavski" }
|
||||
],
|
||||
value: "kanton",
|
||||
optionName: "kanton"
|
||||
};
|
||||
|
||||
export const cijenaRangeOptions = {
|
||||
min: 0,
|
||||
max: 100000,
|
||||
defaultValues: [0, 100000],
|
||||
step: 100,
|
||||
optionNames: ["od", "do"]
|
||||
};
|
||||
|
||||
// Kvadrata
|
||||
export const velicinaRangeOptions = {
|
||||
min: 0,
|
||||
max: 1000,
|
||||
@@ -50,24 +123,112 @@ export const velicinaRangeOptions = {
|
||||
optionNames: ["kvadrata_min", "kvadrata_max"]
|
||||
};
|
||||
|
||||
export const gradoviOptions = {
|
||||
parentOptionName: "kanton",
|
||||
checkboxOptions: {
|
||||
"9": {
|
||||
elements: [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Ilidza",
|
||||
optionName: "grad-ilidza",
|
||||
value: "3879"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Centar",
|
||||
optionName: "grad-centar",
|
||||
value: "3812"
|
||||
}
|
||||
]
|
||||
}
|
||||
// Dodatno za kucu
|
||||
export const kucaElements = [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Uknjizeno",
|
||||
optionName: "uknjizeno-zk_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Namjesteno",
|
||||
optionName: "namjestena_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Nedavno adaptirano",
|
||||
optionName: "nedavno-adaptirana_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Garaza",
|
||||
optionName: "gara-a_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Balkon",
|
||||
optionName: "balkon_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Voda",
|
||||
optionName: "voda_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Plin",
|
||||
optionName: "plin_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Bazen",
|
||||
optionName: "bazen_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
};
|
||||
];
|
||||
|
||||
// Dodatno za stan
|
||||
export const stanElements = [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Novogradnja",
|
||||
optionName: "novogradnja_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Namjesten",
|
||||
optionName: "namjesten_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Nedavno adaptiran",
|
||||
optionName: "nedavno-adaptiran_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Uknjizeno",
|
||||
optionName: "uknjizeno-zk_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Lift",
|
||||
optionName: "lift_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Balkon",
|
||||
optionName: "balkon_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Parking",
|
||||
optionName: "parking_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Plin",
|
||||
optionName: "plin_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "kablovska",
|
||||
optionName: "kablovska-tv_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
];
|
||||
|
||||
@@ -1,67 +0,0 @@
|
||||
import React from "react";
|
||||
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
|
||||
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
|
||||
|
||||
const elements = [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Uknjizeno",
|
||||
optionName: "uknjizeno-zk_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Namjesteno",
|
||||
optionName: "namjestena_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Nedavno adaptirano",
|
||||
optionName: "nedavno-adaptirana_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Garaza",
|
||||
optionName: "gara-a_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Balkon",
|
||||
optionName: "balkon_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Voda",
|
||||
optionName: "voda_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Plin",
|
||||
optionName: "plin_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Bazen",
|
||||
optionName: "bazen_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
];
|
||||
class KuceFilter extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<CollapseWrapperStyled componentName="Dodatno za kuce">
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="dodatno-za-kuce"
|
||||
elements={elements}
|
||||
/>
|
||||
</CollapseWrapperStyled>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default KuceFilter;
|
||||
@@ -1,74 +0,0 @@
|
||||
import React from "react";
|
||||
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
|
||||
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
|
||||
|
||||
const elements = [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Novogradnja",
|
||||
optionName: "novogradnja_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Namjesten",
|
||||
optionName: "namjesten_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Nedavno adaptiran",
|
||||
optionName: "nedavno-adaptiran_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Uknjizeno",
|
||||
optionName: "uknjizeno-zk_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Lift",
|
||||
optionName: "lift_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Balkon",
|
||||
optionName: "balkon_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Parking",
|
||||
optionName: "parking_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Plin",
|
||||
optionName: "plin_checkbox",
|
||||
value: "on"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "kablovska",
|
||||
optionName: "kablovska-tv_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
];
|
||||
|
||||
class StanoviFilter extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<CollapseWrapperStyled componentName="Dodatno za stan">
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="dodatno-za-stan"
|
||||
elements={elements}
|
||||
/>
|
||||
</CollapseWrapperStyled>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default StanoviFilter;
|
||||
@@ -2,51 +2,71 @@ import React from "react";
|
||||
import * as Filters from "./AllFiltersDefined";
|
||||
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
|
||||
import SelectDisplayCheckboxWrapper from "components/widgets/SelectDisplayCheckboxWrapper";
|
||||
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
|
||||
import RangeWrapper from "components/widgets/RangeWrapper";
|
||||
import DropDownWrapper from "components/widgets/DropDownWrapper";
|
||||
|
||||
class NekretnineFilter extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
{[
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Vrsta"
|
||||
elements={Filters.vrstaElements}
|
||||
/>,
|
||||
const Kanton = (
|
||||
<DropDownWrapper componentName="Lokacija" {...Filters.lokacijaOptions} />
|
||||
);
|
||||
|
||||
<DropDownWrapper
|
||||
componentName="Lokacija"
|
||||
{...Filters.lokacijaOptions}
|
||||
/>,
|
||||
const Grad = (
|
||||
<SelectDisplayCheckboxWrapper
|
||||
componentName="Grad"
|
||||
{...Filters.gradoviOptions}
|
||||
/>
|
||||
);
|
||||
|
||||
<SelectDisplayCheckboxWrapper
|
||||
componentName="Grad"
|
||||
{...Filters.gradoviOptions}
|
||||
/>,
|
||||
const Cijena = (
|
||||
<RangeWrapper
|
||||
componentName="Cijena"
|
||||
{...Filters.cijenaRangeOptions}
|
||||
optionName="cijena"
|
||||
/>
|
||||
);
|
||||
|
||||
<RangeWrapper
|
||||
componentName="Cijena"
|
||||
{...Filters.cijenaRangeOptions}
|
||||
optionName="cijena"
|
||||
/>,
|
||||
const Stanje = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Stanje"
|
||||
elements={Filters.stanjeElements}
|
||||
/>
|
||||
);
|
||||
|
||||
<RangeWrapper
|
||||
componentName="Velicina"
|
||||
{...Filters.velicinaRangeOptions}
|
||||
optionName="velicina"
|
||||
/>
|
||||
].map(comp => (
|
||||
<CollapseWrapperStyled
|
||||
key={comp.props.componentName}
|
||||
componentName={comp.props.componentName}
|
||||
>
|
||||
{comp}
|
||||
</CollapseWrapperStyled>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default NekretnineFilter;
|
||||
const Vrsta = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Vrsta"
|
||||
elements={Filters.vrstaElements}
|
||||
/>
|
||||
);
|
||||
|
||||
const Kvadratura = (
|
||||
<RangeWrapper
|
||||
componentName="Velicina"
|
||||
{...Filters.velicinaRangeOptions}
|
||||
optionName="velicina"
|
||||
/>
|
||||
);
|
||||
|
||||
const DodatnoZaStan = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="dodatno-za-stan"
|
||||
elements={Filters.stanElements}
|
||||
/>
|
||||
);
|
||||
|
||||
const DodatnoZaKucu = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="dodatno-za-kucu"
|
||||
elements={Filters.kucaElements}
|
||||
/>
|
||||
);
|
||||
|
||||
export {
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Kvadratura,
|
||||
DodatnoZaStan,
|
||||
DodatnoZaKucu
|
||||
};
|
||||
|
||||
@@ -1,3 +1,68 @@
|
||||
// Proizvodac
|
||||
export const proizvodacOptions = {
|
||||
choices: [{ value: "1900", label: "Audi" }, { value: "9000", label: "Ford" }],
|
||||
value: "v_b",
|
||||
optionName: "v_b"
|
||||
};
|
||||
|
||||
// Kanton/Regija
|
||||
export const lokacijaOptions = {
|
||||
choices: [
|
||||
{ value: "9", label: "Sarajevo" },
|
||||
{ value: "2", label: "Posavski" }
|
||||
],
|
||||
value: "kanton",
|
||||
optionName: "kanton"
|
||||
};
|
||||
|
||||
// Grad
|
||||
export const gradoviOptions = {
|
||||
parentOptionName: "kanton",
|
||||
checkboxOptions: {
|
||||
"9": {
|
||||
elements: [
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Ilidza",
|
||||
optionName: "grad-ilidza",
|
||||
value: "3879"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Centar",
|
||||
optionName: "grad-centar",
|
||||
value: "3812"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Hadzici",
|
||||
optionName: "grad-hadzici",
|
||||
value: "3817"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Ilijas",
|
||||
optionName: "grad-ilijas",
|
||||
value: "3892"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Novi Grad",
|
||||
optionName: "grad-novigrad",
|
||||
value: "3969"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Sarajevo-Novo Sarajevo",
|
||||
optionName: "grad-novosarajevo",
|
||||
value: "5896"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Cijena
|
||||
export const cijenaRangeOptions = {
|
||||
min: 0,
|
||||
max: 100000,
|
||||
@@ -6,6 +71,63 @@ export const cijenaRangeOptions = {
|
||||
optionNames: ["od", "do"]
|
||||
};
|
||||
|
||||
// Stanje
|
||||
export const stanjeElements = [
|
||||
{
|
||||
type: "radio",
|
||||
value: "",
|
||||
name: "Nova i polovna vozila",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 1,
|
||||
name: "Nova",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 2,
|
||||
name: "Polovna vozila",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Udarena vozila",
|
||||
optionName: "udaren_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
];
|
||||
|
||||
// Vrsta Artikla
|
||||
export const vrstaElements = [
|
||||
{
|
||||
value: "",
|
||||
name: "Sve",
|
||||
type: "radio",
|
||||
optionName: "vrsta"
|
||||
},
|
||||
{
|
||||
value: "samoprodaja",
|
||||
name: "Prodaja",
|
||||
type: "radio",
|
||||
optionName: "vrsta"
|
||||
},
|
||||
{
|
||||
value: "samoizdavanje",
|
||||
name: "Iznajmljivanje",
|
||||
type: "radio",
|
||||
optionName: "vrsta"
|
||||
},
|
||||
{
|
||||
value: "samopotraznja",
|
||||
name: "Potražnja",
|
||||
type: "radio",
|
||||
optionName: "vrsta"
|
||||
}
|
||||
];
|
||||
|
||||
// Godiste
|
||||
export const godisteRangeOptions = {
|
||||
min: 1960,
|
||||
max: new Date().getFullYear(),
|
||||
@@ -14,6 +136,24 @@ export const godisteRangeOptions = {
|
||||
optionNames: ["godiste_min", "godiste_max"]
|
||||
};
|
||||
|
||||
// Kilometraza
|
||||
export const kilometrazaOptions = {
|
||||
kilometraMin: {
|
||||
choices: [{ value: 5000, label: "5000" }, { value: 10000, label: "10000" }],
|
||||
value: "kilometra-a_min",
|
||||
optionName: "kilometra-a_min"
|
||||
},
|
||||
kilometraMax: {
|
||||
choices: [
|
||||
{ value: 15000, label: "15000" },
|
||||
{ value: 200000, label: "200000" }
|
||||
],
|
||||
value: "kilometra-a_max",
|
||||
optionName: "kilometra-a_max"
|
||||
}
|
||||
};
|
||||
|
||||
// Gorivo
|
||||
export const gorivoElements = [
|
||||
{
|
||||
name: "Dizel",
|
||||
@@ -46,59 +186,3 @@ export const gorivoElements = [
|
||||
value: "Elektro"
|
||||
}
|
||||
];
|
||||
|
||||
export const kilometrazaOptions = {
|
||||
kilometraMin: {
|
||||
choices: [{ value: 5000, label: "5000" }, { value: 10000, label: "10000" }],
|
||||
value: "kilometra-a_min",
|
||||
optionName: "kilometra-a_min"
|
||||
},
|
||||
kilometraMax: {
|
||||
choices: [
|
||||
{ value: 15000, label: "15000" },
|
||||
{ value: 200000, label: "200000" }
|
||||
],
|
||||
value: "kilometra-a_max",
|
||||
optionName: "kilometra-a_max"
|
||||
}
|
||||
};
|
||||
|
||||
export const lokacijaOptions = {
|
||||
choices: [
|
||||
{ value: "9", label: "Sarajevo" },
|
||||
{ value: "2", label: "Posavski" }
|
||||
],
|
||||
value: "kanton",
|
||||
optionName: "kanton"
|
||||
};
|
||||
export const proizvodacOptions = {
|
||||
choices: [{ value: "1900", label: "Audi" }, { value: "9000", label: "Ford" }],
|
||||
value: "v_b",
|
||||
optionName: "v_b"
|
||||
};
|
||||
export const stanjeElements = [
|
||||
{
|
||||
type: "radio",
|
||||
value: "",
|
||||
name: "Nova i polovna vozila",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 1,
|
||||
name: "Nova",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "radio",
|
||||
value: 2,
|
||||
name: "Polovna vozila",
|
||||
optionName: "stanje"
|
||||
},
|
||||
{
|
||||
type: "checkbox",
|
||||
name: "Udarena vozila",
|
||||
optionName: "udaren_checkbox",
|
||||
value: "on"
|
||||
}
|
||||
];
|
||||
|
||||
@@ -1,57 +1,81 @@
|
||||
import React from "react";
|
||||
import * as Filters from "./AllFiltersDefined";
|
||||
import CheckboxAndRadioWrapper from "components/widgets/CheckboxAndRadioWrapper";
|
||||
import SelectDisplayCheckboxWrapper from "components/widgets/SelectDisplayCheckboxWrapper";
|
||||
import RangeWrapper from "components/widgets/RangeWrapper";
|
||||
import CollapseWrapperStyled from "components/widgets/CollapseWrapperStyled";
|
||||
import DropDownWrapper from "components/widgets/DropDownWrapper";
|
||||
|
||||
class VozilaFilter extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
{[
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Stanje"
|
||||
elements={Filters.stanjeElements}
|
||||
/>,
|
||||
<DropDownWrapper
|
||||
componentName="Proizvodac"
|
||||
{...Filters.proizvodacOptions}
|
||||
/>,
|
||||
<RangeWrapper
|
||||
componentName="Cijena"
|
||||
{...Filters.cijenaRangeOptions}
|
||||
/>,
|
||||
<DropDownWrapper
|
||||
componentName="Lokacija"
|
||||
{...Filters.lokacijaOptions}
|
||||
/>,
|
||||
<RangeWrapper
|
||||
componentName="Godiste"
|
||||
{...Filters.godisteRangeOptions}
|
||||
/>,
|
||||
<DropDownWrapper
|
||||
componentName="Min kilometraza"
|
||||
{...Filters.kilometrazaOptions.kilometraMin}
|
||||
/>,
|
||||
<DropDownWrapper
|
||||
componentName="Max kilometraza"
|
||||
{...Filters.kilometrazaOptions.kilometraMax}
|
||||
/>,
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Gorivo"
|
||||
elements={Filters.gorivoElements}
|
||||
/>
|
||||
].map(comp => (
|
||||
<CollapseWrapperStyled
|
||||
key={comp.props.componentName}
|
||||
componentName={comp.props.componentName}
|
||||
>
|
||||
{comp}
|
||||
</CollapseWrapperStyled>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default VozilaFilter;
|
||||
const Proizvodac = (
|
||||
<DropDownWrapper componentName="Proizvodac" {...Filters.proizvodacOptions} />
|
||||
);
|
||||
|
||||
const Kanton = (
|
||||
<DropDownWrapper componentName="Lokacija" {...Filters.lokacijaOptions} />
|
||||
);
|
||||
|
||||
const Grad = (
|
||||
<SelectDisplayCheckboxWrapper
|
||||
componentName="Grad"
|
||||
{...Filters.gradoviOptions}
|
||||
/>
|
||||
);
|
||||
|
||||
const Cijena = (
|
||||
<RangeWrapper
|
||||
componentName="Cijena"
|
||||
{...Filters.cijenaRangeOptions}
|
||||
optionName="cijena"
|
||||
/>
|
||||
);
|
||||
|
||||
const Stanje = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Stanje"
|
||||
elements={Filters.stanjeElements}
|
||||
/>
|
||||
);
|
||||
|
||||
const Vrsta = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Vrsta"
|
||||
elements={Filters.vrstaElements}
|
||||
/>
|
||||
);
|
||||
|
||||
const Godiste = (
|
||||
<RangeWrapper componentName="Godiste" {...Filters.godisteRangeOptions} />
|
||||
);
|
||||
|
||||
const KilometraMin = (
|
||||
<DropDownWrapper
|
||||
componentName="Min kilometraza"
|
||||
{...Filters.kilometrazaOptions.kilometraMin}
|
||||
/>
|
||||
);
|
||||
|
||||
const KilometraMax = (
|
||||
<DropDownWrapper
|
||||
componentName="Max kilometraza"
|
||||
{...Filters.kilometrazaOptions.kilometraMax}
|
||||
/>
|
||||
);
|
||||
|
||||
const Gorivo = (
|
||||
<CheckboxAndRadioWrapper
|
||||
componentName="Gorivo"
|
||||
elements={Filters.gorivoElements}
|
||||
/>
|
||||
);
|
||||
|
||||
export {
|
||||
Proizvodac,
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Godiste,
|
||||
KilometraMin,
|
||||
KilometraMax,
|
||||
Gorivo
|
||||
};
|
||||
|
||||
@@ -1,14 +1,23 @@
|
||||
import React from "react";
|
||||
import NekretnineFilter from "components/filters/NekretnineFilter/index";
|
||||
import KuceFilter from "components/filters/NekretnineFilter/KuceFilter/index";
|
||||
class Kuce extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<NekretnineFilter />
|
||||
<KuceFilter />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
import { WrapAll } from "components/widgets/CollapseWrapperAll";
|
||||
import {
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Kvadratura,
|
||||
DodatnoZaKucu
|
||||
} from "components/filters/NekretnineFilter/index";
|
||||
|
||||
const KuceFilters = [
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Kvadratura,
|
||||
DodatnoZaKucu
|
||||
];
|
||||
const Kuce = () => WrapAll(KuceFilters);
|
||||
|
||||
export default Kuce;
|
||||
|
||||
@@ -1,15 +1,23 @@
|
||||
import React from "react";
|
||||
import NekretnineFilter from "components/filters/NekretnineFilter/index";
|
||||
import StanoviFilter from "components/filters/NekretnineFilter/StanoviFilter/index";
|
||||
import { WrapAll } from "components/widgets/CollapseWrapperAll";
|
||||
import {
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Kvadratura,
|
||||
DodatnoZaStan
|
||||
} from "components/filters/NekretnineFilter/index";
|
||||
|
||||
const StanFilters = [
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Kvadratura,
|
||||
DodatnoZaStan
|
||||
];
|
||||
const Stanovi = () => WrapAll(StanFilters);
|
||||
|
||||
class Stanovi extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<NekretnineFilter />
|
||||
<StanoviFilter />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Stanovi;
|
||||
|
||||
@@ -1,13 +1,29 @@
|
||||
import React from "react";
|
||||
import VozilaFilter from "components/filters/VozilaFilter/index";
|
||||
import { WrapAll } from "components/widgets/CollapseWrapperAll";
|
||||
import {
|
||||
Proizvodac,
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Godiste,
|
||||
KilometraMin,
|
||||
KilometraMax,
|
||||
Gorivo
|
||||
} from "components/filters/VozilaFilter/index";
|
||||
|
||||
const AutomobiliFilters = [
|
||||
Proizvodac,
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Godiste,
|
||||
KilometraMin,
|
||||
KilometraMax,
|
||||
Gorivo
|
||||
];
|
||||
const Automobili = () => WrapAll(AutomobiliFilters);
|
||||
|
||||
class Automobili extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<VozilaFilter />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Automobili;
|
||||
|
||||
@@ -1,13 +1,27 @@
|
||||
import React from "react";
|
||||
import VozilaFilter from "components/filters/VozilaFilter/index";
|
||||
import { WrapAll } from "components/widgets/CollapseWrapperAll";
|
||||
import {
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Godiste,
|
||||
KilometraMin,
|
||||
KilometraMax,
|
||||
Gorivo
|
||||
} from "components/filters/VozilaFilter/index";
|
||||
|
||||
const MotocikliFilters = [
|
||||
Kanton,
|
||||
Grad,
|
||||
Cijena,
|
||||
Stanje,
|
||||
Vrsta,
|
||||
Godiste,
|
||||
KilometraMin,
|
||||
KilometraMax,
|
||||
Gorivo
|
||||
];
|
||||
const Motocikli = () => WrapAll(MotocikliFilters);
|
||||
|
||||
class Motocikli extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<VozilaFilter />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Motocikli;
|
||||
|
||||
13
frontend-react/src/components/widgets/CollapseWrapperAll.js
Normal file
13
frontend-react/src/components/widgets/CollapseWrapperAll.js
Normal file
@@ -0,0 +1,13 @@
|
||||
import React from "react";
|
||||
import CollapseWrapperStyled from "./CollapseWrapperStyled";
|
||||
|
||||
export const WrapAll = components => {
|
||||
return components.map(comp => (
|
||||
<CollapseWrapperStyled
|
||||
key={comp.props.componentName}
|
||||
componentName={comp.props.componentName}
|
||||
>
|
||||
{comp}
|
||||
</CollapseWrapperStyled>
|
||||
));
|
||||
};
|
||||
Reference in New Issue
Block a user