1 | import React, { Component } from 'react'
|
---|
2 | import { Link } from 'react-router-dom'
|
---|
3 | import './PhoneOfferComponent.css'
|
---|
4 | import StarBorderIcon from '@mui/icons-material/StarBorder';
|
---|
5 | import StarIcon from '@mui/icons-material/Star';
|
---|
6 | import Tippy from '@tippyjs/react';
|
---|
7 | import axios from 'axios';
|
---|
8 | import UserContext from '../../context/UserContext';
|
---|
9 | import VisibilityIcon from '@mui/icons-material/Visibility';
|
---|
10 | import CheckIcon from '@mui/icons-material/Check';
|
---|
11 |
|
---|
12 | export class PhoneOfferComponent extends Component {
|
---|
13 |
|
---|
14 | constructor(props) {
|
---|
15 | super(props)
|
---|
16 |
|
---|
17 | this.state = {
|
---|
18 |
|
---|
19 | }
|
---|
20 | }
|
---|
21 |
|
---|
22 | addToFavourite = () => {
|
---|
23 | var config = {
|
---|
24 | method: 'put',
|
---|
25 | url: '/user/'+this.context.userId+'/addoffer/'+this.props.id,
|
---|
26 | headers: {
|
---|
27 | 'Authorization': 'Bearer '+localStorage.getItem('token')
|
---|
28 | }
|
---|
29 | };
|
---|
30 |
|
---|
31 | axios(config)
|
---|
32 | .then(response => {
|
---|
33 | this.props.getFavouriteOffersForLoggedUser()
|
---|
34 | })
|
---|
35 | .catch(error => {
|
---|
36 | console.log(error)
|
---|
37 | })
|
---|
38 | }
|
---|
39 |
|
---|
40 | removeFromFavourite = () => {
|
---|
41 | var config = {
|
---|
42 | method: 'put',
|
---|
43 | url: '/user/'+this.context.userId+'/removeoffer/'+this.props.id,
|
---|
44 | headers: {
|
---|
45 | 'Authorization': 'Bearer '+localStorage.getItem('token')
|
---|
46 | }
|
---|
47 | };
|
---|
48 |
|
---|
49 | axios(config)
|
---|
50 | .then(response => {
|
---|
51 | this.props.getFavouriteOffersForLoggedUser()
|
---|
52 | })
|
---|
53 | .catch(error => {
|
---|
54 | console.log(error);
|
---|
55 | });
|
---|
56 | }
|
---|
57 |
|
---|
58 |
|
---|
59 | getCheaperOffers = () =>{
|
---|
60 | var config = {
|
---|
61 | method: 'get',
|
---|
62 | url: '/phoneoffer/'+this.props.id+'/cheaperoffers',
|
---|
63 | headers: { }
|
---|
64 | };
|
---|
65 |
|
---|
66 | axios(config)
|
---|
67 | .then(response => {
|
---|
68 | this.props.handleOpen(response.data,this.props.price)
|
---|
69 | })
|
---|
70 | .catch(error => {
|
---|
71 | console.log(error);
|
---|
72 | });
|
---|
73 | }
|
---|
74 |
|
---|
75 |
|
---|
76 | render() {
|
---|
77 | return (
|
---|
78 | <tr className='phone-with-offers-table-row'>
|
---|
79 | <td>{this.props.offer_shop}</td>
|
---|
80 | <td><a style={{ textDecoration: 'none' }} href={this.props.offer_url}>{this.props.offer_name}</a></td>
|
---|
81 | <td>{this.props.price} ден.</td>
|
---|
82 | <td>
|
---|
83 | {
|
---|
84 | window.location.href.split('/')[5] == 'favouriteoffers' ?
|
---|
85 | <Tippy placement='bottom' content='Прикажи поевтини понуди'>
|
---|
86 | <VisibilityIcon onClick={this.getCheaperOffers} className='phone-offer-cheaperoffers-icon' style={{fontSize: '40px', marginRight: '10px' }}/>
|
---|
87 | </Tippy> : <></>
|
---|
88 | }
|
---|
89 | {
|
---|
90 | localStorage.getItem('token') && this.props.loggedUserFavouriteOffers.filter(offer => offer.id == this.props.id).length == 0?
|
---|
91 | <Tippy placement='bottom' content='Додади во омилени понуди'>
|
---|
92 | <StarBorderIcon onClick={this.addToFavourite} className='phone-offer-favouriteoffer-icon' style={{fontSize: '40px', marginRight: '10px' }}/>
|
---|
93 | </Tippy>
|
---|
94 | : <></>
|
---|
95 | }
|
---|
96 |
|
---|
97 | {
|
---|
98 | localStorage.getItem('token') && this.props.loggedUserFavouriteOffers.filter(offer => offer.id == this.props.id).length != 0?
|
---|
99 | <Tippy placement='bottom' content='Избриши од омилени понуди'>
|
---|
100 | <StarIcon onClick={this.removeFromFavourite} className='phone-offer-favouriteoffer-icon' style={{fontSize: '40px', marginRight: '10px' }}/>
|
---|
101 | </Tippy>
|
---|
102 | : <></>
|
---|
103 | }
|
---|
104 |
|
---|
105 |
|
---|
106 | <Link style={{ textDecoration: 'none' }} to={"/phoneoffer/"+this.props.id}>
|
---|
107 | <button className='phone-offer-specifications-button'>Спецификации</button>
|
---|
108 | </Link>
|
---|
109 | </td>
|
---|
110 | </tr>
|
---|
111 | )
|
---|
112 | }
|
---|
113 | }
|
---|
114 |
|
---|
115 | PhoneOfferComponent.contextType = UserContext
|
---|
116 | export default PhoneOfferComponent
|
---|
117 |
|
---|