1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
import _ from'lodash'
import React, { Component, PropTypes } from 'react'
import Select2 from 'react-select2'
// get JSON full path
var origin = window.location.origin
var path = window.location.pathname.split('/', 3).join('/')
export default class BSelect3 extends Component {
constructor(props, context) {
super(props, context)
}
onChange(e) {
this.props.onChange(this.props.index, {
text: e.currentTarget.textContent,
stoparea_id: e.currentTarget.value,
user_objectid: e.params.data.user_objectid,
longitude: e.params.data.longitude,
latitude: e.params.data.latitude,
name: e.params.data.name,
short_name: e.params.data.short_name,
city_name: e.params.data.city_name,
area_type: e.params.data.area_type,
zip_code: e.params.data.zip_code,
comment: e.params.data.comment
})
}
parsedText(data) {
let a = data.replace('</em></small>', '')
let b = a.split('<small><em>')
if (b.length > 1) {
return (
<span>
{b[0]}
<small><em>{b[1]}</em></small>
</span>
)
} else {
return (
<span>{data}</span>
)
}
}
render() {
if(this.props.value.edit)
return (
<div className='select2-bootstrap-append'>
<BSelect2 {...this.props} onSelect={ this.onChange.bind(this) }/>
</div>
)
else
if(!this.props.value.stoparea_id)
return (
<div>
<BSelect2 {...this.props} onSelect={ this.onChange.bind(this) }/>
</div>
)
else
return (
<a
className='navlink'
href={origin + path + '/stop_areas/' + this.props.value.stoparea_id}
title="Voir l'arrêt"
>
{this.parsedText(this.props.value.text)}
</a>
)
}
}
class BSelect2 extends Component{
componentDidMount() {
this.refs.newSelect.el.select2('open')
}
render() {
return (
<Select2
value={ this.props.value.stoparea_id }
onSelect={ this.props.onSelect }
ref='newSelect'
options={{
placeholder: this.context.I18n.routes.edit.select2.placeholder,
allowClear: true,
language: 'fr', /* Doesn't seem to work... :( */
theme: 'bootstrap',
width: '100%',
ajax: {
url: origin + path + '/autocomplete_stop_areas.json',
dataType: 'json',
delay: '500',
data: function(params) {
return {
q: params.term,
target_type: 'zdep'
};
},
processResults: function(data, params) {
return {
results: data.map(
item => _.assign(
{},
item,
{ text: item.name + ", " + item.zip_code + " " + item.short_city_name + " <small><em>(" + item.user_objectid + ")</em></small>" }
)
)
};
},
cache: true
},
escapeMarkup: function (markup) { return markup; },
minimumInputLength: 3
}}
/>
)
}
}
BSelect2.contextTypes = {
I18n: PropTypes.object
}
|