1
|
|
View Code Duplication |
define(function(require) { |
|
|
|
|
2
|
|
|
'use strict'; |
3
|
|
|
|
4
|
|
|
var AddressView; |
5
|
|
|
var $ = require('jquery'); |
6
|
|
|
var _ = require('underscore'); |
7
|
|
|
var mediator = require('oroui/js/mediator'); |
8
|
|
|
var LoadingMaskView = require('oroui/js/app/views/loading-mask-view'); |
9
|
|
|
var BaseView = require('oroui/js/app/views/base/view'); |
10
|
|
|
|
11
|
|
|
/** |
12
|
|
|
* @export oroorder/js/app/views/address-view |
13
|
|
|
* @extends oroui.app.views.base.View |
14
|
|
|
* @class oroorder.app.views.AddressView |
15
|
|
|
*/ |
16
|
|
|
AddressView = BaseView.extend({ |
17
|
|
|
/** |
18
|
|
|
* @property {Object} |
19
|
|
|
*/ |
20
|
|
|
options: { |
21
|
|
|
enterManuallyValue: '0', |
22
|
|
|
type: '', |
23
|
|
|
selectors: { |
24
|
|
|
address: '', |
25
|
|
|
subtotalsFields: [] |
26
|
|
|
} |
27
|
|
|
}, |
28
|
|
|
|
29
|
|
|
/** |
30
|
|
|
* @property {String} |
31
|
|
|
*/ |
32
|
|
|
ftid: '', |
33
|
|
|
|
34
|
|
|
/** |
35
|
|
|
* @property {jQuery} |
36
|
|
|
*/ |
37
|
|
|
$fields: null, |
38
|
|
|
|
39
|
|
|
/** |
40
|
|
|
* @property {jQuery} |
41
|
|
|
*/ |
42
|
|
|
$address: null, |
43
|
|
|
|
44
|
|
|
/** |
45
|
|
|
* @property {Boolean} |
46
|
|
|
*/ |
47
|
|
|
useDefaultAddress: null, |
48
|
|
|
|
49
|
|
|
/** |
50
|
|
|
* @property {Object} |
51
|
|
|
*/ |
52
|
|
|
fieldsByName: null, |
53
|
|
|
|
54
|
|
|
/** |
55
|
|
|
* @property {LoadingMaskView} |
56
|
|
|
*/ |
57
|
|
|
loadingMaskView: null, |
58
|
|
|
|
59
|
|
|
/** |
60
|
|
|
* @inheritDoc |
61
|
|
|
*/ |
62
|
|
|
constructor: function AddressView() { |
63
|
|
|
AddressView.__super__.constructor.apply(this, arguments); |
64
|
|
|
}, |
65
|
|
|
|
66
|
|
|
/** |
67
|
|
|
* @inheritDoc |
68
|
|
|
*/ |
69
|
|
|
initialize: function(options) { |
70
|
|
|
this.options = $.extend(true, {}, this.options, options || {}); |
71
|
|
|
|
72
|
|
|
this.initLayout().done(_.bind(this.handleLayoutInit, this)); |
73
|
|
|
|
74
|
|
|
this.loadingMaskView = new LoadingMaskView({container: this.$el}); |
75
|
|
|
|
76
|
|
|
mediator.on('order:load:related-data', this.loadingStart, this); |
77
|
|
|
mediator.on('order:loaded:related-data', this.loadedRelatedData, this); |
78
|
|
|
}, |
79
|
|
|
|
80
|
|
|
/** |
81
|
|
|
* Doing something after loading child components |
82
|
|
|
*/ |
83
|
|
|
handleLayoutInit: function() { |
84
|
|
|
var self = this; |
85
|
|
|
|
86
|
|
|
this.ftid = this.$el.find('div[data-ftid]:first').data('ftid'); |
87
|
|
|
|
88
|
|
|
this.useDefaultAddress = true; |
89
|
|
|
this.$fields = this.$el.find(':input[data-ftid]').filter(':not(' + this.options.selectors.address + ')'); |
90
|
|
|
this.fieldsByName = {}; |
91
|
|
|
this.$fields.each(function() { |
92
|
|
|
var $field = $(this); |
93
|
|
|
if ($field.val().length > 0) { |
94
|
|
|
self.useDefaultAddress = false; |
95
|
|
|
} |
96
|
|
|
var name = self.normalizeName($field.data('ftid').replace(self.ftid + '_', '')); |
97
|
|
|
self.fieldsByName[name] = $field; |
98
|
|
|
}); |
99
|
|
|
|
100
|
|
|
if (this.options.selectors.subtotalsFields.length > 0) { |
101
|
|
|
_.each(this.options.selectors.subtotalsFields, function(field) { |
102
|
|
|
$(field).attr('data-entry-point-trigger', true); |
103
|
|
|
}); |
104
|
|
|
|
105
|
|
|
mediator.trigger('entry-point:order:init'); |
106
|
|
|
} |
107
|
|
|
|
108
|
|
|
if (this.options.selectors.address) { |
109
|
|
|
this.setAddress(this.$el.find(this.options.selectors.address)); |
110
|
|
|
|
111
|
|
|
this.customerAddressChange(); |
112
|
|
|
} else { |
113
|
|
|
this._setReadOnlyMode(true); |
114
|
|
|
} |
115
|
|
|
}, |
116
|
|
|
|
117
|
|
|
/** |
118
|
|
|
* Convert name with "_" to name with upper case, example: some_name > someName |
119
|
|
|
* |
120
|
|
|
* @param {String} name |
121
|
|
|
* |
122
|
|
|
* @returns {String} |
123
|
|
|
*/ |
124
|
|
|
normalizeName: function(name) { |
125
|
|
|
name = name.split('_'); |
126
|
|
|
for (var i = 1, iMax = name.length; i < iMax; i++) { |
127
|
|
|
if (name[i]) { |
128
|
|
|
name[i] = name[i][0].toUpperCase() + name[i].substr(1); |
129
|
|
|
} |
130
|
|
|
} |
131
|
|
|
return name.join(''); |
132
|
|
|
}, |
133
|
|
|
|
134
|
|
|
/** |
135
|
|
|
* Set new address element and bind events |
136
|
|
|
* |
137
|
|
|
* @param {jQuery} $address |
138
|
|
|
*/ |
139
|
|
|
setAddress: function($address) { |
140
|
|
|
this.$address = $address; |
141
|
|
|
|
142
|
|
|
var self = this; |
143
|
|
|
this.$address.change(function(e) { |
144
|
|
|
self.useDefaultAddress = false; |
145
|
|
|
self.customerAddressChange(e); |
146
|
|
|
}); |
147
|
|
|
}, |
148
|
|
|
|
149
|
|
|
/** |
150
|
|
|
* Implement customer address change logic |
151
|
|
|
*/ |
152
|
|
|
customerAddressChange: function(e) { |
|
|
|
|
153
|
|
|
if (this.$address.val() !== this.options.enterManuallyValue) { |
154
|
|
|
this._setReadOnlyMode(true); |
155
|
|
|
|
156
|
|
|
var address = this.$address.data('addresses')[this.$address.val()] || null; |
157
|
|
|
if (address) { |
158
|
|
|
var self = this; |
159
|
|
|
|
160
|
|
|
_.each(address, function(value, name) { |
161
|
|
|
if (_.isObject(value)) { |
162
|
|
|
value = _.first(_.values(value)); |
163
|
|
|
} |
164
|
|
|
var $field = self.fieldsByName[self.normalizeName(name)] || null; |
165
|
|
|
if ($field) { |
166
|
|
|
$field.val(value); |
167
|
|
|
if ($field.data('select2')) { |
168
|
|
|
$field.data('selected-data', value).change(); |
169
|
|
|
} |
170
|
|
|
} |
171
|
|
|
}); |
172
|
|
|
} |
173
|
|
|
} else { |
174
|
|
|
this._setReadOnlyMode(false); |
175
|
|
|
} |
176
|
|
|
}, |
177
|
|
|
|
178
|
|
|
_setReadOnlyMode: function(mode) { |
179
|
|
|
this.$fields.each(function() { |
180
|
|
|
$(this).prop('readonly', mode).inputWidget('refresh'); |
181
|
|
|
}); |
182
|
|
|
}, |
183
|
|
|
|
184
|
|
|
/** |
185
|
|
|
* Show loading view |
186
|
|
|
*/ |
187
|
|
|
loadingStart: function() { |
188
|
|
|
this.loadingMaskView.show(); |
189
|
|
|
}, |
190
|
|
|
|
191
|
|
|
/** |
192
|
|
|
* Hide loading view |
193
|
|
|
*/ |
194
|
|
|
loadingEnd: function() { |
195
|
|
|
this.loadingMaskView.hide(); |
196
|
|
|
}, |
197
|
|
|
|
198
|
|
|
/** |
199
|
|
|
* Set customer address choices from order related data |
200
|
|
|
* |
201
|
|
|
* @param {Object} response |
202
|
|
|
*/ |
203
|
|
|
loadedRelatedData: function(response) { |
204
|
|
|
var address = response[this.options.type + 'Address'] || null; |
205
|
|
|
if (!address) { |
206
|
|
|
this.loadingEnd(); |
207
|
|
|
return; |
208
|
|
|
} |
209
|
|
|
|
210
|
|
|
var $oldAddress = this.$address; |
211
|
|
|
this.setAddress($(address)); |
212
|
|
|
|
213
|
|
|
$oldAddress.parent().trigger('content:remove'); |
214
|
|
|
$oldAddress.inputWidget('dispose'); |
215
|
|
|
$oldAddress.replaceWith(this.$address); |
216
|
|
|
|
217
|
|
|
if (this.useDefaultAddress) { |
218
|
|
|
this.$address.val(this.$address.data('default')).change(); |
219
|
|
|
} |
220
|
|
|
|
221
|
|
|
this.initLayout().done(_.bind(this.loadingEnd, this)); |
222
|
|
|
}, |
223
|
|
|
|
224
|
|
|
/** |
225
|
|
|
* @inheritDoc |
226
|
|
|
*/ |
227
|
|
|
dispose: function() { |
228
|
|
|
if (this.disposed) { |
229
|
|
|
return; |
230
|
|
|
} |
231
|
|
|
|
232
|
|
|
mediator.off('order:load:related-data', this.loadingStart, this); |
233
|
|
|
mediator.off('order:loaded:related-data', this.loadedRelatedData, this); |
234
|
|
|
|
235
|
|
|
AddressView.__super__.dispose.call(this); |
236
|
|
|
} |
237
|
|
|
}); |
238
|
|
|
|
239
|
|
|
return AddressView; |
240
|
|
|
}); |
241
|
|
|
|