[d66b8eb] | 1 | import { CollectionsOutlined } from '@mui/icons-material'
|
---|
[7e88e46] | 2 | import axios from 'axios'
|
---|
| 3 | import React, { Component } from 'react'
|
---|
[d66b8eb] | 4 | import UserContext from '../../context/UserContext'
|
---|
[7e88e46] | 5 | import HeaderComponent from '../HeaderComponent/HeaderComponent'
|
---|
| 6 | import './EditOfferComponent.css'
|
---|
| 7 |
|
---|
| 8 | export class EditOfferComponent extends Component {
|
---|
| 9 |
|
---|
| 10 | constructor(props) {
|
---|
| 11 | super(props)
|
---|
| 12 | this.state = {
|
---|
| 13 | offerId: window.location.href.split('/')[5],
|
---|
| 14 | offer: {}
|
---|
| 15 | }
|
---|
| 16 | }
|
---|
| 17 |
|
---|
| 18 | componentDidMount(){
|
---|
| 19 | var config = {
|
---|
| 20 | method: 'get',
|
---|
| 21 | url: '/phoneoffer/'+this.state.offerId,
|
---|
| 22 | headers: { }
|
---|
| 23 | };
|
---|
| 24 |
|
---|
| 25 | axios(config)
|
---|
| 26 | .then(response => {
|
---|
| 27 | this.setState({
|
---|
| 28 | offer: response.data
|
---|
| 29 | })
|
---|
| 30 | })
|
---|
| 31 | .catch(error => {
|
---|
| 32 | console.log(error);
|
---|
| 33 | });
|
---|
| 34 |
|
---|
| 35 | }
|
---|
[d66b8eb] | 36 |
|
---|
| 37 | setInputValue = (e) => {
|
---|
| 38 | let editedOffer = Object.assign(this.state.offer,{[e.target.name]: e.target.value})
|
---|
| 39 | this.setState({
|
---|
| 40 | offer: editedOffer
|
---|
| 41 | })
|
---|
| 42 | }
|
---|
| 43 |
|
---|
| 44 | handleSubmit = () =>{
|
---|
| 45 | var dataToSend = JSON.stringify(this.state.offer)
|
---|
| 46 | var config = {
|
---|
| 47 | method: 'put',
|
---|
| 48 | url: '/admin/editoffer/'+this.state.offerId,
|
---|
| 49 | headers: {
|
---|
| 50 | 'Authorization': 'Bearer '+localStorage.getItem('token'),
|
---|
| 51 | 'Content-Type': 'application/json'
|
---|
| 52 | },
|
---|
| 53 | data: {
|
---|
| 54 | "id" : this.state.offer.id,
|
---|
| 55 | "offer_shop" : this.state.offer.offer_shop,
|
---|
| 56 | "offer_name" : this.state.offer.offer_name,
|
---|
| 57 | "price" : this.state.offer.price,
|
---|
| 58 | "ram_memory" : this.state.offer.ram_memory,
|
---|
| 59 | "rom_memory" : this.state.offer.rom_memory,
|
---|
| 60 | "color" : this.state.offer.color,
|
---|
| 61 | "front_camera" : this.state.offer.front_camera,
|
---|
| 62 | "back_camera" : this.state.offer.back_camera,
|
---|
| 63 | "chipset" : this.state.offer.chipset,
|
---|
| 64 | "battery" : this.state.offer.battery,
|
---|
| 65 | "operating_system" : this.state.offer.operating_system,
|
---|
| 66 | "cpu" : this.state.offer.cpu,
|
---|
| 67 | "image_url" : this.state.offer.image_url,
|
---|
| 68 | "offer_url" : this.state.offer.offer_url,
|
---|
| 69 | "last_updated" : this.state.offer.last_updated,
|
---|
| 70 | "is_validated" : this.state.offer.is_validated,
|
---|
| 71 | "offer_description" : this.state.offer.offer_description,
|
---|
| 72 | "offer_shop_code" : this.state.offer.offer_shop_code
|
---|
| 73 | }
|
---|
| 74 | };
|
---|
| 75 |
|
---|
| 76 | axios(config)
|
---|
| 77 | .then(response => {
|
---|
| 78 | window.location.href="/phoneoffer/"+this.state.offerId
|
---|
| 79 | })
|
---|
| 80 | .catch(error => {
|
---|
| 81 | console.log(error);
|
---|
| 82 | });
|
---|
| 83 |
|
---|
| 84 |
|
---|
| 85 |
|
---|
| 86 | }
|
---|
[7e88e46] | 87 |
|
---|
| 88 | render() {
|
---|
[d66b8eb] | 89 | console.log(this.state)
|
---|
[7e88e46] | 90 | return (
|
---|
| 91 | <div className='edit-offer-component-main'>
|
---|
| 92 | <HeaderComponent/>
|
---|
| 93 | <div className='edit-offer-table-wrapper'>
|
---|
[d66b8eb] | 94 |
|
---|
[7e88e46] | 95 | <table className='edit-offer-table'>
|
---|
| 96 | <thead>
|
---|
[d66b8eb] | 97 | <tr><th colSpan={2}>Понуда</th></tr>
|
---|
[7e88e46] | 98 | </thead>
|
---|
[d66b8eb] | 99 |
|
---|
[7e88e46] | 100 | <tbody>
|
---|
| 101 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 102 | <td><b>Име на понуда</b></td>
|
---|
[7e88e46] | 103 | <td><a href={this.state.offer == null || this.state.offer.offer_url == null ?
|
---|
[d66b8eb] | 104 | '#' : this.state.offer.offer_url}>{this.state.offer == null || this.state.offer.offer_name == null ?
|
---|
| 105 | '/' : this.state.offer.offer_name}</a>
|
---|
| 106 | </td>
|
---|
[7e88e46] | 107 | </tr>
|
---|
[d66b8eb] | 108 |
|
---|
[7e88e46] | 109 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 110 | <td><b>Продавница</b></td>
|
---|
[7e88e46] | 111 | <td>{this.state.offer == null ||
|
---|
[d66b8eb] | 112 | this.state.offer.offer_shop == null ? '/' : this.state.offer.offer_shop}
|
---|
| 113 | </td>
|
---|
[7e88e46] | 114 | </tr>
|
---|
[d66b8eb] | 115 |
|
---|
| 116 |
|
---|
[7e88e46] | 117 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 118 | <td><b>Опис за понудата</b></td>
|
---|
| 119 | <td>{this.state.offer == null ||
|
---|
| 120 | this.state.offer.offer_description == null ? '/' : this.state.offer.offer_description}
|
---|
| 121 | </td>
|
---|
| 122 | </tr>
|
---|
| 123 | </tbody>
|
---|
| 124 |
|
---|
| 125 | <thead>
|
---|
| 126 | <tr><th colSpan={2}>Спецификации за понудата</th></tr>
|
---|
| 127 | </thead>
|
---|
| 128 |
|
---|
| 129 | <tbody>
|
---|
| 130 |
|
---|
| 131 | <tr className='edit-offer-table-row'>
|
---|
| 132 | <td><b>Цена</b></td>
|
---|
[7e88e46] | 133 | <td><input value={this.state.offer == null ||
|
---|
[d66b8eb] | 134 | this.state.offer.price == null ? '/' : this.state.offer.price}
|
---|
| 135 | className='edit-offer-price-input' name='price'
|
---|
| 136 | onChange={(e) => this.setInputValue(e)}/><span className='edit-offer-price-span'>ден.</span></td>
|
---|
[7e88e46] | 137 | </tr>
|
---|
[d66b8eb] | 138 |
|
---|
[7e88e46] | 139 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 140 | <td><b>Предна камера</b></td>
|
---|
| 141 | <td><textarea className='edit-offer-table-textarea' name='front_camera' value={this.state.offer == null ||
|
---|
| 142 | this.state.offer.front_camera == null ? '/' : this.state.offer.front_camera}
|
---|
| 143 | onChange={(e) => this.setInputValue(e)}></textarea></td>
|
---|
[7e88e46] | 144 | </tr>
|
---|
[d66b8eb] | 145 |
|
---|
[7e88e46] | 146 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 147 | <td><b>Задна камера</b></td>
|
---|
| 148 | <td><textarea className='edit-offer-table-textarea' value={this.state.offer == null ||
|
---|
| 149 | this.state.offer.back_camera == null ? '/' : this.state.offer.back_camera}
|
---|
| 150 | onChange={(e) => this.setInputValue(e)} name='back_camera'></textarea></td>
|
---|
[7e88e46] | 151 | </tr>
|
---|
| 152 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 153 | <td><b>РОМ меморија</b></td>
|
---|
| 154 | <td><textarea className='edit-offer-table-textarea' onChange={(e) => this.setInputValue(e)}
|
---|
| 155 | name='rom_memory' value={this.state.offer == null ||
|
---|
| 156 | this.state.offer.rom_memory == null ? '/' : this.state.offer.rom_memory}></textarea></td>
|
---|
[7e88e46] | 157 | </tr>
|
---|
[d66b8eb] | 158 |
|
---|
[7e88e46] | 159 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 160 | <td><b>РАМ меморија</b></td>
|
---|
| 161 | <td><textarea className='edit-offer-table-textarea' onChange={(e) => this.setInputValue(e)}
|
---|
| 162 | name='ram_memory' value={this.state.offer == null ||
|
---|
| 163 | this.state.offer.ram_memory == null ? '/' : this.state.offer.ram_memory}></textarea></td>
|
---|
[7e88e46] | 164 | </tr>
|
---|
[d66b8eb] | 165 |
|
---|
[7e88e46] | 166 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 167 | <td><b>Оперативен систем</b></td>
|
---|
| 168 | <td><textarea className='edit-offer-table-textarea' value={this.state.offer == null ||
|
---|
| 169 | this.state.offer.operating_system == null ? '/' : this.state.offer.operating_system} name='operating_system'
|
---|
| 170 | onChange={(e) => this.setInputValue(e)}></textarea>
|
---|
| 171 | </td>
|
---|
[7e88e46] | 172 | </tr>
|
---|
[d66b8eb] | 173 |
|
---|
[7e88e46] | 174 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 175 | <td><b>Чипсет</b></td>
|
---|
| 176 | <td><textarea className='edit-offer-table-textarea' value={this.state.offer == null ||
|
---|
| 177 | this.state.offer.chipset == null ? '/' : this.state.offer.chipset} name='chipset'
|
---|
| 178 | onChange={(e) => this.setInputValue(e)}></textarea>
|
---|
| 179 | </td>
|
---|
[7e88e46] | 180 | </tr>
|
---|
[d66b8eb] | 181 |
|
---|
[7e88e46] | 182 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 183 | <td><b>Процесор</b></td>
|
---|
| 184 | <td><textarea className='edit-offer-table-textarea' value={this.state.offer == null ||
|
---|
| 185 | this.state.offer.cpu == null ? '/' : this.state.offer.cpu} name='cpu'
|
---|
| 186 | onChange={(e) => this.setInputValue(e)}></textarea>
|
---|
| 187 | </td>
|
---|
[7e88e46] | 188 | </tr>
|
---|
[d66b8eb] | 189 |
|
---|
[7e88e46] | 190 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 191 | <td><b>Батерија</b></td>
|
---|
| 192 | <td><textarea className='edit-offer-table-textarea' value={this.state.offer == null ||
|
---|
| 193 | this.state.offer.battery == null ? '/' : this.state.offer.battery} name='battery'
|
---|
| 194 | onChange={(e) => this.setInputValue(e)}></textarea></td>
|
---|
[7e88e46] | 195 | </tr>
|
---|
[d66b8eb] | 196 |
|
---|
[7e88e46] | 197 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 198 | <td><b>Боја</b></td>
|
---|
| 199 | <td><textarea className='edit-offer-table-textarea' name='color' value={this.state.offer == null ||
|
---|
| 200 | this.state.offer.color == null ? '/' : this.state.offer.color}
|
---|
| 201 | onChange={(e) => this.setInputValue(e)}></textarea></td>
|
---|
[7e88e46] | 202 | </tr>
|
---|
[d66b8eb] | 203 |
|
---|
[7e88e46] | 204 | <tr className='edit-offer-table-row'>
|
---|
[d66b8eb] | 205 | <td><b>Линк од слика на мобилниот телефон од понудата</b></td>
|
---|
| 206 | <td>
|
---|
| 207 | <div className='edit-offer-offerimage-wrapper'>
|
---|
| 208 | <img className='edit-offer-offerimage' src={this.state.offer == null ||
|
---|
| 209 | this.state.offer.image_url == null ? '#' : this.state.offer.image_url}/>
|
---|
| 210 | </div>
|
---|
| 211 | <input value={this.state.offer == null ||
|
---|
| 212 | this.state.offer.image_url == null ? '/' : this.state.offer.image_url}
|
---|
| 213 | className='edit-offer-imageurl-input' name='image_url'
|
---|
| 214 | onChange={(e) => this.setInputValue(e)}/>
|
---|
| 215 | </td>
|
---|
[7e88e46] | 216 | </tr>
|
---|
| 217 | </tbody>
|
---|
| 218 | </table>
|
---|
| 219 | </div>
|
---|
[d66b8eb] | 220 | <div className='edit-offer-button-wrapper'>
|
---|
| 221 | <button className='edit-offer-submit-button' onClick={this.handleSubmit}><b>Измени</b></button>
|
---|
| 222 | </div>
|
---|
[7e88e46] | 223 | </div>
|
---|
| 224 |
|
---|
| 225 | )
|
---|
| 226 | }
|
---|
| 227 | }
|
---|
| 228 |
|
---|
[d66b8eb] | 229 | EditOfferComponent.contextType = UserContext
|
---|
| 230 |
|
---|
[7e88e46] | 231 | export default EditOfferComponent
|
---|