]>
Commit | Line | Data |
---|---|---|
f257dcec DC |
1 | Ext.define('PVE.dc.MetricServerView', { |
2 | extend: 'Ext.grid.Panel', | |
3 | alias: ['widget.pveMetricServerView'], | |
4 | ||
5 | stateful: true, | |
6 | stateId: 'grid-metricserver', | |
7 | ||
8 | controller: { | |
9 | xclass: 'Ext.app.ViewController', | |
10 | ||
11 | render_type: function(value) { | |
12 | switch (value) { | |
13 | case 'influxdb': return "InfluxDB"; | |
14 | case 'graphite': return "Graphite"; | |
15 | default: return Proxmox.Utils.unknownText; | |
16 | } | |
17 | }, | |
18 | ||
d57f8d94 | 19 | editWindow: function(xtype, id) { |
f257dcec | 20 | let me = this; |
d57f8d94 TL |
21 | Ext.create(`PVE.dc.${xtype}Edit`, { |
22 | serverid: id, | |
f257dcec DC |
23 | autoShow: true, |
24 | listeners: { | |
25 | destroy: () => me.reload(), | |
26 | }, | |
27 | }); | |
28 | }, | |
29 | ||
d57f8d94 TL |
30 | addServer: function(button) { |
31 | this.editWindow(button.text); | |
f257dcec DC |
32 | }, |
33 | ||
34 | editServer: function() { | |
35 | let me = this; | |
36 | let view = me.getView(); | |
37 | let selection = view.getSelection(); | |
38 | if (!selection || selection.length < 1) { | |
39 | return; | |
40 | } | |
41 | ||
d57f8d94 | 42 | let cfg = selection[0].data; |
f257dcec | 43 | |
d57f8d94 TL |
44 | let xtype = me.render_type(cfg.type); |
45 | me.editWindow(xtype, cfg.id); | |
f257dcec DC |
46 | }, |
47 | ||
48 | reload: function() { | |
49 | this.getView().getStore().load(); | |
50 | }, | |
51 | }, | |
52 | ||
53 | store: { | |
54 | autoLoad: true, | |
55 | id: 'metricservers', | |
56 | proxy: { | |
57 | type: 'proxmox', | |
d57f8d94 | 58 | url: '/api2/json/cluster/metrics/server', |
f257dcec DC |
59 | }, |
60 | }, | |
61 | ||
62 | columns: [ | |
63 | { | |
64 | text: gettext('Name'), | |
65 | flex: 2, | |
66 | dataIndex: 'id', | |
67 | }, | |
68 | { | |
69 | text: gettext('Type'), | |
70 | flex: 1, | |
71 | dataIndex: 'type', | |
72 | renderer: 'render_type', | |
73 | }, | |
74 | { | |
75 | text: gettext('Enabled'), | |
76 | dataIndex: 'disable', | |
77 | width: 100, | |
78 | renderer: Proxmox.Utils.format_neg_boolean, | |
79 | }, | |
80 | { | |
81 | text: gettext('Server'), | |
82 | width: 200, | |
83 | dataIndex: 'server', | |
84 | }, | |
85 | { | |
86 | text: gettext('Port'), | |
87 | width: 100, | |
88 | dataIndex: 'port', | |
89 | }, | |
90 | ], | |
91 | ||
92 | tbar: [ | |
93 | { | |
94 | text: gettext('Add'), | |
95 | menu: [ | |
96 | { | |
97 | text: 'Graphite', | |
7ba63836 | 98 | iconCls: 'fa fa-fw fa-bar-chart', |
d57f8d94 | 99 | handler: 'addServer', |
f257dcec DC |
100 | }, |
101 | { | |
102 | text: 'InfluxDB', | |
7ba63836 | 103 | iconCls: 'fa fa-fw fa-bar-chart', |
d57f8d94 | 104 | handler: 'addServer', |
f257dcec DC |
105 | }, |
106 | ], | |
107 | }, | |
108 | { | |
109 | text: gettext('Edit'), | |
110 | xtype: 'proxmoxButton', | |
111 | handler: 'editServer', | |
112 | disabled: true, | |
113 | }, | |
114 | { | |
115 | xtype: 'proxmoxStdRemoveButton', | |
d57f8d94 | 116 | baseurl: `/api2/extjs/cluster/metrics/server`, |
f257dcec DC |
117 | callback: 'reload', |
118 | }, | |
119 | ], | |
120 | ||
121 | listeners: { | |
122 | itemdblclick: 'editServer', | |
123 | }, | |
124 | ||
125 | initComponent: function() { | |
126 | var me = this; | |
127 | ||
128 | me.callParent(); | |
129 | ||
130 | Proxmox.Utils.monStoreErrors(me, me.getStore()); | |
131 | }, | |
132 | }); | |
133 | ||
71f5bf0a | 134 | Ext.define('PVE.dc.MetricServerBaseEdit', { |
f257dcec DC |
135 | extend: 'Proxmox.window.Edit', |
136 | mixins: ['Proxmox.Mixin.CBind'], | |
137 | ||
f257dcec DC |
138 | cbindData: function() { |
139 | let me = this; | |
140 | me.isCreate = !me.serverid; | |
141 | me.serverid = me.serverid || ""; | |
d57f8d94 | 142 | me.url = `/api2/extjs/cluster/metrics/server/${me.serverid}`; |
f257dcec DC |
143 | me.method = me.isCreate ? 'POST' : 'PUT'; |
144 | if (!me.isCreate) { | |
71f5bf0a | 145 | me.subject = `${me.subject}: ${me.serverid}`; |
f257dcec DC |
146 | } |
147 | return {}; | |
148 | }, | |
149 | ||
d57f8d94 TL |
150 | submitUrl: function(url, values) { |
151 | return this.isCreate ? `${url}/${values.id}` : url; | |
152 | }, | |
153 | ||
71f5bf0a TL |
154 | initComponent: function() { |
155 | let me = this; | |
156 | ||
157 | me.callParent(); | |
158 | ||
159 | if (me.serverid) { | |
160 | me.load({ | |
161 | success: function(response, options) { | |
162 | let values = response.result.data; | |
163 | values.enable = !values.disable; | |
164 | me.down('inputpanel').setValues(values); | |
165 | }, | |
166 | }); | |
167 | } | |
168 | }, | |
169 | }); | |
170 | ||
171 | Ext.define('PVE.dc.InfluxDBEdit', { | |
172 | extend: 'PVE.dc.MetricServerBaseEdit', | |
173 | mixins: ['Proxmox.Mixin.CBind'], | |
174 | ||
175 | subject: 'InfluxDB', | |
176 | ||
f257dcec DC |
177 | items: [ |
178 | { | |
179 | xtype: 'inputpanel', | |
180 | ||
181 | onGetValues: function(values) { | |
182 | values.disable = values.enable ? 0 : 1; | |
183 | delete values.enable; | |
184 | return values; | |
185 | }, | |
186 | ||
187 | column1: [ | |
188 | { | |
189 | xtype: 'hidden', | |
190 | name: 'type', | |
191 | value: 'influxdb', | |
192 | cbind: { | |
193 | submitValue: '{isCreate}', | |
194 | }, | |
195 | }, | |
196 | { | |
f257dcec DC |
197 | xtype: 'pmxDisplayEditField', |
198 | name: 'id', | |
eb594f5c | 199 | fieldLabel: gettext('Name'), |
f257dcec DC |
200 | allowBlank: false, |
201 | cbind: { | |
202 | editable: '{isCreate}', | |
203 | value: '{serverid}', | |
204 | }, | |
205 | }, | |
206 | { | |
f257dcec | 207 | xtype: 'checkbox', |
eb594f5c TL |
208 | name: 'enable', |
209 | fieldLabel: gettext('Enabled'), | |
f257dcec DC |
210 | inputValue: 1, |
211 | uncheckedValue: 0, | |
212 | checked: true, | |
f257dcec DC |
213 | }, |
214 | ], | |
215 | ||
216 | column2: [ | |
217 | { | |
f257dcec DC |
218 | xtype: 'proxmoxtextfield', |
219 | name: 'server', | |
eb594f5c | 220 | fieldLabel: gettext('Server'), |
f257dcec DC |
221 | allowBlank: false, |
222 | }, | |
223 | { | |
f257dcec | 224 | xtype: 'proxmoxintegerfield', |
eb594f5c TL |
225 | name: 'port', |
226 | fieldLabel: gettext('Port'), | |
f257dcec DC |
227 | minValue: 1, |
228 | maximum: 65536, | |
f257dcec DC |
229 | allowBlank: false, |
230 | }, | |
231 | ], | |
232 | ||
f257dcec DC |
233 | advancedColumn2: [ |
234 | { | |
f257dcec DC |
235 | xtype: 'proxmoxintegerfield', |
236 | name: 'mtu', | |
eb594f5c | 237 | fieldLabel: 'MTU', |
f257dcec DC |
238 | minValue: 1, |
239 | emptyText: '1500', | |
240 | submitEmpty: false, | |
241 | cbind: { | |
242 | deleteEmpty: '{!isCreate}', | |
243 | }, | |
244 | }, | |
245 | ], | |
246 | }, | |
247 | ], | |
f257dcec DC |
248 | }); |
249 | ||
250 | Ext.define('PVE.dc.GraphiteEdit', { | |
71f5bf0a | 251 | extend: 'PVE.dc.MetricServerBaseEdit', |
f257dcec DC |
252 | mixins: ['Proxmox.Mixin.CBind'], |
253 | ||
254 | subject: 'Graphite', | |
255 | ||
f257dcec DC |
256 | items: [ |
257 | { | |
258 | xtype: 'inputpanel', | |
259 | ||
260 | onGetValues: function(values) { | |
261 | values.disable = values.enable ? 0 : 1; | |
262 | delete values.enable; | |
263 | return values; | |
264 | }, | |
265 | ||
266 | column1: [ | |
267 | { | |
268 | xtype: 'hidden', | |
269 | name: 'type', | |
270 | value: 'graphite', | |
271 | cbind: { | |
272 | submitValue: '{isCreate}', | |
273 | }, | |
274 | }, | |
275 | { | |
f257dcec DC |
276 | xtype: 'pmxDisplayEditField', |
277 | name: 'id', | |
eb594f5c | 278 | fieldLabel: gettext('Name'), |
f257dcec DC |
279 | allowBlank: false, |
280 | cbind: { | |
281 | editable: '{isCreate}', | |
282 | value: '{serverid}', | |
283 | }, | |
284 | }, | |
285 | { | |
f257dcec | 286 | xtype: 'checkbox', |
eb594f5c TL |
287 | name: 'enable', |
288 | fieldLabel: gettext('Enabled'), | |
f257dcec DC |
289 | inputValue: 1, |
290 | uncheckedValue: 0, | |
291 | checked: true, | |
f257dcec DC |
292 | }, |
293 | ], | |
294 | ||
295 | column2: [ | |
296 | { | |
f257dcec DC |
297 | xtype: 'proxmoxtextfield', |
298 | name: 'server', | |
eb594f5c | 299 | fieldLabel: gettext('Server'), |
f257dcec DC |
300 | allowBlank: false, |
301 | }, | |
302 | { | |
f257dcec | 303 | xtype: 'proxmoxintegerfield', |
eb594f5c TL |
304 | name: 'port', |
305 | fieldLabel: gettext('Port'), | |
f257dcec DC |
306 | minimum: 1, |
307 | maximum: 65536, | |
f257dcec DC |
308 | allowBlank: false, |
309 | }, | |
310 | { | |
311 | fieldLabel: gettext('Path'), | |
312 | xtype: 'proxmoxtextfield', | |
313 | emptyText: 'proxmox', | |
314 | name: 'path', | |
315 | cbind: { | |
316 | deleteEmpty: '{!isCreate}', | |
317 | }, | |
318 | }, | |
319 | ], | |
320 | ||
321 | advancedColumn1: [ | |
322 | { | |
f257dcec DC |
323 | xtype: 'proxmoxKVComboBox', |
324 | name: 'proto', | |
eb594f5c | 325 | fieldLabel: gettext('Protocol'), |
f257dcec DC |
326 | value: '__default__', |
327 | cbind: { | |
328 | deleteEmpty: '{!isCreate}', | |
329 | }, | |
330 | comboItems: [ | |
331 | ['__default__', 'UDP'], | |
332 | ['tcp', 'TCP'], | |
333 | ], | |
334 | listeners: { | |
335 | change: function(field, value) { | |
336 | let me = this; | |
337 | me.up('inputpanel').down('field[name=timeout]').setDisabled(value !== 'tcp'); | |
338 | me.up('inputpanel').down('field[name=mtu]').setDisabled(value === 'tcp'); | |
339 | }, | |
340 | }, | |
341 | }, | |
342 | ], | |
343 | ||
344 | advancedColumn2: [ | |
345 | { | |
f257dcec DC |
346 | xtype: 'proxmoxintegerfield', |
347 | name: 'mtu', | |
eb594f5c | 348 | fieldLabel: 'MTU', |
f257dcec DC |
349 | minimum: 1, |
350 | emptyText: '1500', | |
351 | submitEmpty: false, | |
352 | cbind: { | |
353 | deleteEmpty: '{!isCreate}', | |
354 | }, | |
355 | }, | |
356 | { | |
f257dcec DC |
357 | xtype: 'proxmoxintegerfield', |
358 | name: 'timeout', | |
eb594f5c | 359 | fieldLabel: gettext('TCP Timeout'), |
f257dcec DC |
360 | disabled: true, |
361 | cbind: { | |
362 | deleteEmpty: '{!isCreate}', | |
363 | }, | |
364 | minValue: 1, | |
365 | emptyText: 1, | |
366 | }, | |
367 | ], | |
368 | }, | |
369 | ], | |
f257dcec | 370 | }); |