31 isModal: true, |
31 isModal: true, |
32 modalOpacity: 0.4, |
32 modalOpacity: 0.4, |
33 okButton: $('#delOk'), |
33 okButton: $('#delOk'), |
34 cancelButton: $('#delCancel'), |
34 cancelButton: $('#delCancel'), |
35 initContent: function () { |
35 initContent: function () { |
36 $('#delOk').jqxButton({ width: '65px', theme: theme }); |
36 $('#delOk').jqxButton({ template: "danger", width: '65px', theme: theme }); |
37 $('#delCancel').jqxButton({ width: '65px', theme: theme }); |
37 $('#delCancel').jqxButton({ template: "success", width: '65px', theme: theme }); |
38 $('#delCancel').focus(); |
38 $('#delCancel').focus(); |
39 } |
39 } |
40 }); |
40 }); |
41 $('#eventWindow').jqxWindow('hide'); |
41 $('#eventWindow').jqxWindow('hide'); |
42 } |
42 } |
43 |
43 |
44 |
44 |
45 $(document).ready(function () { |
45 $(document).ready(function () { |
|
46 |
|
47 var dataRecord = {}; |
|
48 |
|
49 function calcTotal(cost, inventory) { |
|
50 |
|
51 $('#totval').val(cost * (inventory / 1000)); |
|
52 } |
|
53 |
46 var url = "includes/db_inventory_yeasts.php"; |
54 var url = "includes/db_inventory_yeasts.php"; |
47 // prepare the data |
55 // prepare the data |
48 var source = { |
56 var source = { |
49 datatype: "json", |
57 datatype: "json", |
50 cache: false, |
58 cache: false, |
51 datafields: [ |
59 datafields: [ |
52 { name: 'record', type: 'number' }, |
60 { name: 'record', type: 'number' }, |
53 { name: 'name', type: 'string' }, |
61 { name: 'name', type: 'string' }, |
54 { name: 'type', type: 'string' }, |
62 { name: 'type', type: 'int' }, |
55 { name: 'form', type: 'string' }, |
63 { name: 'form', type: 'int' }, |
56 { name: 'laboratory', type: 'string' }, |
64 { name: 'laboratory', type: 'string' }, |
57 { name: 'product_id', type: 'string' }, |
65 { name: 'product_id', type: 'string' }, |
58 { name: 'min_temperature', type: 'number' }, |
66 { name: 'min_temperature', type: 'float' }, |
59 { name: 'max_temperature', type: 'number' }, |
67 { name: 'max_temperature', type: 'float' }, |
60 { name: 'flocculation', type: 'string' }, |
68 { name: 'flocculation', type: 'int' }, |
61 { name: 'attenuation', type: 'float' }, |
69 { name: 'attenuation', type: 'float' }, |
62 { name: 'notes', type: 'string' }, |
70 { name: 'notes', type: 'string' }, |
63 { name: 'best_for', type: 'string' }, |
71 { name: 'best_for', type: 'string' }, |
64 { name: 'max_reuse', type: 'number' }, |
72 { name: 'max_reuse', type: 'int' }, |
65 { name: 'inventory', type: 'float' }, |
73 { name: 'inventory', type: 'float' }, |
66 { name: 'cost', type: 'float' }, |
74 { name: 'cost', type: 'float' }, |
67 { name: 'production_date', type: 'string' }, |
75 { name: 'production_date', type: 'string' }, |
68 { name: 'tht_date', type: 'string' } |
76 { name: 'tht_date', type: 'string' } |
69 ], |
77 ], |
106 $.ajax({ |
116 $.ajax({ |
107 dataType: 'json', |
117 dataType: 'json', |
108 url: url, |
118 url: url, |
109 cache: false, |
119 cache: false, |
110 data: data, |
120 data: data, |
|
121 type: "POST", |
111 success: function (data, status, xhr) { |
122 success: function (data, status, xhr) { |
112 // update command is executed. |
123 // update command is executed. |
113 commit(true); |
124 commit(true); |
114 }, |
125 }, |
115 error: function(jqXHR, textStatus, errorThrown) { |
126 error: function(jqXHR, textStatus, errorThrown) { |
116 commit(false); |
127 commit(false); |
117 } |
128 } |
118 }); |
129 }); |
119 } |
130 } |
120 }; |
131 }; |
121 var srcType = [ "Ale", "Lager", "Wheat", "Wine", "Champagne" ]; |
|
122 var srcForm = [ "Liquid", "Dry", "Slant", "Culture", "Bottle", "Frozen" ]; |
|
123 var srcFlocculation = [ "Low", "Medium", "High", "Very High" ]; |
|
124 // initialize the input fields. |
132 // initialize the input fields. |
125 $("#name").jqxInput({ theme: theme, width: 250, height: 23 }); |
133 $("#name").jqxInput({ theme: theme, width: 640, height: 23 }); |
126 $("#laboratory").jqxInput({ theme: theme, width: 150, height: 23 }); |
134 $("#laboratory").jqxInput({ theme: theme, width: 320, height: 23 }); |
127 $("#product_id").jqxInput({ theme: theme, width: 120, height: 23 }); |
135 $("#product_id").jqxInput({ theme: theme, width: 320, height: 23 }); |
128 $("#type").jqxDropDownList({ theme: theme, source: srcType, width: 90, height: 23, dropDownHeight: 170 }); |
136 $("#type").jqxDropDownList({ |
129 $("#form").jqxDropDownList({ theme: theme, source: srcForm, selectedIndex: 0, width: 90, height: 23, dropDownHeight: 195 }); |
137 theme: theme, |
130 $("#notes").jqxInput({ theme: theme, width: 640, height: 120 }); |
138 source: YeastTypeAdapter, |
131 $("#best_for").jqxInput({ theme: theme, width: 640, height: 23 }); |
139 valueMember: 'id', |
132 $("#inventory").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 1, spinButtons: true }); |
140 displayMember: 'nl', |
133 $("#production_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); |
141 width: 180, |
134 |
142 height: 23, |
135 $("#min_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); |
143 autoDropDownHeight: true |
136 $("#max_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); |
144 }); |
137 $("#flocculation").jqxDropDownList({ theme: theme, source: srcFlocculation, width: 90, height: 23, dropDownHeight: 130 }); |
145 $("#form").jqxDropDownList({ |
138 $("#attenuation").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 50, max: 100, decimalDigits: 1, spinButtons: true }); |
146 theme: theme, |
139 |
147 source: YeastFormAdapter, |
140 $("#max_reuse").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 10, decimalDigits: 0, spinButtons: true }); |
148 valueMember: 'id', |
141 $("#cost").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 2, spinButtons: true }); |
149 displayMember: 'nl', |
142 $("#tht_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); |
150 selectedIndex: 0, |
|
151 width: 180, |
|
152 height: 23, |
|
153 autoDropDownHeight: true |
|
154 }); |
|
155 $("#notes").jqxInput({ theme: theme, width: 800, height: 120 }); |
|
156 $("#best_for").jqxInput({ theme: theme, width: 320, height: 50 }); |
|
157 $("#inventory").jqxNumberInput( Spin1dec1 ); |
|
158 $("#production_date").jqxDateTimeInput( Dateopts ); |
|
159 $("#min_temperature").jqxNumberInput( YeastT ); |
|
160 $("#max_temperature").jqxNumberInput( YeastT ); |
|
161 $("#flocculation").jqxDropDownList({ |
|
162 theme: theme, |
|
163 source: FlocculationAdapter, |
|
164 valueMember: 'id', |
|
165 displayMember: 'nl', |
|
166 width: 180, |
|
167 height: 23, |
|
168 autoDropDownHeight: true |
|
169 }); |
|
170 $("#attenuation").jqxNumberInput( Perc1dec1 ); |
|
171 $("#max_reuse").jqxNumberInput( PosInt ); |
|
172 $("#max_reuse").jqxNumberInput({ max: 10 }); |
|
173 $("#cost").jqxNumberInput( Spin2dec1 ); |
|
174 $("#tht_date").jqxDateTimeInput( Dateopts ); |
|
175 $("#totval").jqxNumberInput( Spin2dec1 ); |
|
176 $("#totval").jqxNumberInput({ width: 90, readOnly: true, spinButtons: false }); |
143 |
177 |
144 var dataAdapter = new $.jqx.dataAdapter(source); |
178 var dataAdapter = new $.jqx.dataAdapter(source); |
145 var editrow = -1; |
179 var editrow = -1; |
146 // initialize jqxGrid |
180 // initialize jqxGrid |
147 $("#jqxgrid").jqxGrid({ |
181 $("#jqxgrid").jqxGrid({ |
154 renderstatusbar: function (statusbar) { |
188 renderstatusbar: function (statusbar) { |
155 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); |
189 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); |
156 var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Nieuw</span></div>"); |
190 var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Nieuw</span></div>"); |
157 container.append(addButton); |
191 container.append(addButton); |
158 statusbar.append(container); |
192 statusbar.append(container); |
159 addButton.jqxButton({ theme: theme, width: 120, height: 20 }); |
193 addButton.jqxButton({ theme: theme, width: 90, height: 20 }); |
160 // add new row. |
194 // add new row. |
161 addButton.click(function (event) { |
195 addButton.click(function (event) { |
162 editrow = -1; |
196 editrow = -1; |
163 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
197 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } }); |
164 $("#name").val(''); |
198 $("#name").val(''); |
165 $("#laboratory").val(''); |
199 $("#laboratory").val(''); |
166 $("#product_id").val(''); |
200 $("#product_id").val(''); |
167 $("#type").val('Ale'); |
201 $("#type").val(0); |
168 $("#form").val('Liquid'); |
202 $("#form").val(0); |
169 $("#min_temperature").val(''); |
203 $("#min_temperature").val(18); |
170 $("#max_temperature").val(''); |
204 $("#max_temperature").val(22); |
171 $("#flocculation").val('Low'); |
205 $("#flocculation").val(0); |
172 $("#attenuation").val('75.0'); |
206 $("#attenuation").val(77); |
173 $("#notes").val(''); |
207 $("#notes").val(''); |
174 $("#best_for").val(''); |
208 $("#best_for").val(''); |
175 $("#max_reuse").val(''); |
209 $("#max_reuse").val(10); |
176 $("#inventory").val(''); |
210 $("#inventory").val(0); |
177 $("#cost").val(''); |
211 $("#cost").val(0); |
178 $("#production_date").val(''); |
212 $("#production_date").val(''); |
179 $("#tht_date").val(''); |
213 $("#tht_date").val(''); |
180 $("#popupWindow").jqxWindow('open'); |
214 $("#popupWindow").jqxWindow('open'); |
181 }); |
215 }); |
182 }, |
216 }, |
184 filtermode: 'excel', |
218 filtermode: 'excel', |
185 columns: [ |
219 columns: [ |
186 { text: 'Laboratorium', datafield: 'laboratory', width: 150 }, |
220 { text: 'Laboratorium', datafield: 'laboratory', width: 150 }, |
187 { text: 'Product ID', datafield: 'product_id', width: 120 }, |
221 { text: 'Product ID', datafield: 'product_id', width: 120 }, |
188 { text: 'Gist naam', datafield: 'name' }, |
222 { text: 'Gist naam', datafield: 'name' }, |
189 { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90 }, |
223 { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90, |
190 { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90 }, |
224 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) { |
|
225 return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastTypeData[value].nl + "</div>"; |
|
226 } |
|
227 }, |
|
228 { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90, |
|
229 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) { |
|
230 return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastFormData[value].nl + "</div>"; |
|
231 } |
|
232 }, |
191 { text: 'Vergistingsgraad', datafield: 'attenuation', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'p0' }, |
233 { text: 'Vergistingsgraad', datafield: 'attenuation', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'p0' }, |
192 { text: 'Voor. gr/ml', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, |
234 { text: 'Voor. gr/ml', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, |
193 { text: 'Prijs kg/l', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, |
235 { text: 'Prijs kg/l', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, |
194 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 120, align: 'center', cellsrenderer: function () { |
236 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 100, align: 'center', cellsrenderer: function () { |
195 return "Wijzig"; |
237 return "Wijzig"; |
196 }, buttonclick: function (row) { |
238 }, buttonclick: function (row) { |
197 // open the popup window when the user clicks a button. |
239 // open the popup window when the user clicks a button. |
198 editrow = row; |
240 editrow = row; |
199 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); |
241 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } }); |
200 // get the clicked row's data and initialize the input fields. |
242 // get the clicked row's data and initialize the input fields. |
201 var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); |
243 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); |
202 $("#name").val(dataRecord.name); |
244 $("#name").val(dataRecord.name); |
203 $("#laboratory").val(dataRecord.laboratory); |
245 $("#laboratory").val(dataRecord.laboratory); |
204 $("#product_id").val(dataRecord.product_id); |
246 $("#product_id").val(dataRecord.product_id); |
205 $("#type").val(dataRecord.type); |
247 $("#type").val(dataRecord.type); |
206 $("#form").val(dataRecord.form); |
248 $("#form").val(dataRecord.form); |
213 $("#max_reuse").val(dataRecord.max_reuse); |
255 $("#max_reuse").val(dataRecord.max_reuse); |
214 $("#inventory").val(dataRecord.inventory); |
256 $("#inventory").val(dataRecord.inventory); |
215 $("#cost").val(dataRecord.cost); |
257 $("#cost").val(dataRecord.cost); |
216 $("#production_date").val(dataRecord.production_date); |
258 $("#production_date").val(dataRecord.production_date); |
217 $("#tht_date").val(dataRecord.tht_date); |
259 $("#tht_date").val(dataRecord.tht_date); |
|
260 calcTotal(dataRecord.cost, dataRecord.inventory); |
218 // show the popup window. |
261 // show the popup window. |
219 $("#popupWindow").jqxWindow('open'); |
262 $("#popupWindow").jqxWindow('open'); |
220 } |
263 } |
221 } |
264 } |
222 ] |
265 ] |
223 }); |
266 }); |
|
267 |
|
268 $("#cost").on('change', function (event) { |
|
269 dataRecord.cost = parseFloat(event.args.value); |
|
270 calcTotal(dataRecord.cost, dataRecord.inventory); |
|
271 }); |
|
272 $("#inventory").on('change', function (event) { |
|
273 dataRecord.inventory = parseFloat(event.args.value); |
|
274 calcTotal(dataRecord.cost, dataRecord.inventory); |
|
275 }); |
|
276 |
224 // initialize the popup window and buttons. |
277 // initialize the popup window and buttons. |
225 $("#popupWindow").jqxWindow({ |
278 $("#popupWindow").jqxWindow({ |
226 width: 860, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.40 |
279 width: 1050, |
|
280 height: 550, |
|
281 resizable: false, |
|
282 theme: theme, |
|
283 isModal: true, |
|
284 autoOpen: false, |
|
285 cancelButton: $("#Cancel"), |
|
286 modalOpacity: 0.40 |
227 }); |
287 }); |
228 $("#popupWindow").on('open', function () { |
288 $("#popupWindow").on('open', function () { |
229 $("#name").jqxInput('selectAll'); |
289 $("#name").jqxInput('selectAll'); |
230 }); |
290 }); |
231 $("#Delete").jqxButton({ theme: theme }); |
291 $("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme }); |
232 $("#Delete").click(function () { |
292 $("#Delete").click(function () { |
233 if (editrow >= 0) { |
293 if (editrow >= 0) { |
234 // Open a popup to confirm this action. |
294 // Open a popup to confirm this action. |
235 $('#eventWindow').jqxWindow('open'); |
295 $('#eventWindow').jqxWindow('open'); |
236 $("#delOk").click(function () { |
296 $("#delOk").click(function () { |
238 $("#jqxgrid").jqxGrid('deleterow', rowID); |
298 $("#jqxgrid").jqxGrid('deleterow', rowID); |
239 }); |
299 }); |
240 } |
300 } |
241 $("#popupWindow").jqxWindow('hide'); |
301 $("#popupWindow").jqxWindow('hide'); |
242 }); |
302 }); |
243 $("#Cancel").jqxButton({ theme: theme }); |
303 $("#Cancel").jqxButton({ template: "primary", width: '90px', theme: theme }); |
244 $("#Save").jqxButton({ theme: theme }); |
304 $("#Save").jqxButton({ template: "success", width: '90px', theme: theme }); |
245 // update the edited row when the user clicks the 'Save' button. |
305 // update the edited row when the user clicks the 'Save' button. |
246 $("#Save").click(function () { |
306 $("#Save").click(function () { |
|
307 var rowID = -1; |
247 if (editrow >= 0) { |
308 if (editrow >= 0) { |
248 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); |
309 rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); |
249 var row = { |
310 } |
250 record: rowID, |
311 var row = { |
251 name: $("#name").val(), |
312 record: rowID, |
252 type: $("#type").val(), |
313 name: $("#name").val(), |
253 form: $("#form").val(), |
314 type: $("#type").val(), |
254 laboratory: $("#laboratory").val(), |
315 form: $("#form").val(), |
255 product_id: $("#product_id").val(), |
316 laboratory: $("#laboratory").val(), |
256 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), |
317 product_id: $("#product_id").val(), |
257 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), |
318 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), |
258 flocculation: $("#flocculation").val(), |
319 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), |
259 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), |
320 flocculation: $("#flocculation").val(), |
260 notes: $("#notes").val(), |
321 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), |
261 best_for: $("#best_for").val(), |
322 notes: $("#notes").val(), |
262 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), |
323 best_for: $("#best_for").val(), |
263 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), |
324 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), |
264 cost: parseFloat($("#cost").jqxNumberInput('decimal')), |
325 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), |
265 production_date: $("#production_date").val(), |
326 cost: parseFloat($("#cost").jqxNumberInput('decimal')), |
266 tht_date: $("#tht_date").val() |
327 production_date: $("#production_date").val(), |
267 }; |
328 tht_date: $("#tht_date").val() |
|
329 }; |
|
330 if (editrow >= 0) { |
268 $('#jqxgrid').jqxGrid('updaterow', rowID, row); |
331 $('#jqxgrid').jqxGrid('updaterow', rowID, row); |
269 $("#popupWindow").jqxWindow('hide'); |
|
270 } else { |
332 } else { |
271 // Insert a record |
333 $('#jqxgrid').jqxGrid('addrow', null, row); |
272 var newrow = { |
334 } |
273 record: -1, |
335 $("#popupWindow").jqxWindow('hide'); |
274 name: $("#name").val(), |
336 location.reload( true ); // reload ourself. |
275 type: $("#type").val(), |
|
276 form: $("#form").val(), |
|
277 laboratory: $("#laboratory").val(), |
|
278 product_id: $("#product_id").val(), |
|
279 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), |
|
280 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), |
|
281 flocculation: $("#flocculation").val(), |
|
282 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), |
|
283 notes: $("#notes").val(), |
|
284 best_for: $("#best_for").val(), |
|
285 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), |
|
286 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), |
|
287 cost: parseFloat($("#cost").jqxNumberInput('decimal')), |
|
288 production_date: $("#production_date").val(), |
|
289 tht_date: $("#tht_date").val() |
|
290 }; |
|
291 $('#jqxgrid').jqxGrid('addrow', null, newrow); |
|
292 $("#popupWindow").jqxWindow('hide'); |
|
293 } |
|
294 }); |
337 }); |
295 createDelElements(); |
338 createDelElements(); |
296 }); |
339 }); |
297 |
340 |