1 | import { Paper } from '@mui/material'
|
---|
2 | import axios from 'axios'
|
---|
3 | import React, { Component } from 'react'
|
---|
4 | import PhoneOfferComponent from '../PhoneOfferComponent/PhoneOfferComponent'
|
---|
5 | import './PhoneWithOffersComponent.css'
|
---|
6 | import phoneImg from '../../images/phone.png'
|
---|
7 |
|
---|
8 | export class PhoneWithOffersComponent extends Component {
|
---|
9 |
|
---|
10 | constructor(props) {
|
---|
11 | super(props)
|
---|
12 |
|
---|
13 | this.state = {
|
---|
14 | phone_offers: []
|
---|
15 | }
|
---|
16 | }
|
---|
17 |
|
---|
18 | componentDidMount(){
|
---|
19 | axios.get('/phones/offers/'+this.props.phoneId)
|
---|
20 | .then(response => {
|
---|
21 | this.setState({
|
---|
22 | phone_offers: response.data
|
---|
23 | })
|
---|
24 | }).catch(error => console.log(error))
|
---|
25 | }
|
---|
26 |
|
---|
27 | render() {
|
---|
28 | return (
|
---|
29 | <div className='phone-with-offers-main'>
|
---|
30 |
|
---|
31 | <div className='phone-with-offers-sub-main'>
|
---|
32 | <div className='phone-with-offers-totaloffers-div'>
|
---|
33 | <h3>Понуди: {this.props.total_offers}</h3>
|
---|
34 | </div>
|
---|
35 |
|
---|
36 | <div className='phone-with-offers-image-wrapper'>
|
---|
37 | <Paper className='phone-with-offers-paper' elevation={5}>
|
---|
38 | <img className='phone-with-offers-image' src={this.props.image_url == null ? phoneImg : this.props.image_url}/>
|
---|
39 | </Paper>
|
---|
40 | </div>
|
---|
41 |
|
---|
42 | <div className='phone-with-offers-model-wrapper'>
|
---|
43 | <h1>{this.props.model}</h1>
|
---|
44 | </div>
|
---|
45 | </div>
|
---|
46 |
|
---|
47 | <div className='phone-with-offers-section'>
|
---|
48 |
|
---|
49 | <table cellPadding={20} className='phone-with-offers-table'>
|
---|
50 | <thead className='phone-with-offers-table-head'>
|
---|
51 | <tr>
|
---|
52 | <th>Продавница</th>
|
---|
53 | <th>Име на понуда</th>
|
---|
54 | <th>Цена</th>
|
---|
55 | <th></th>
|
---|
56 | </tr>
|
---|
57 | </thead>
|
---|
58 | <tbody>
|
---|
59 | {
|
---|
60 | this.state.phone_offers.map((offer) => <PhoneOfferComponent key={offer.offer_id} id={offer.id}
|
---|
61 | is_validated={offer.is_validated} offer_shop={offer.offer_shop} offer_name={offer.offer_name}
|
---|
62 | price={offer.price} offer_url={offer.offer_url}
|
---|
63 | />)
|
---|
64 | }
|
---|
65 | </tbody>
|
---|
66 | </table>
|
---|
67 |
|
---|
68 | </div>
|
---|
69 |
|
---|
70 | </div>
|
---|
71 | )
|
---|
72 | }
|
---|
73 | }
|
---|
74 |
|
---|
75 | export default PhoneWithOffersComponent
|
---|