sp.declare("app.Booking" , {
	xtype: "container",
	requires: [
		"Ext.ux.buffer.Grid",
		"Ext.ux.buffer.view.Form"
	],
	closable: true,
	title: {en:"List DHL Booking",da:"List DHL Booking"},

	onInitialize: function(myPanel) {

		// debugger;

		// The grid view
		// -------------------------------------------------------------
	    var myGrid = Ext.widget("ux.buffer.grid", {
			url: "router/Booking/search",
			region: "center",
			flex: 1,
			columns: [
				{text:'ID',datatype:'int',width:100,flex:1,dataIndex:'id'},
				{text:'Shipment Number',datatype:'char',width:170,flex:1,dataIndex:'shipmentnumber'},
				{text:'Delivery Time',datatype:'timestamp',width:260,flex:1,dataIndex:'timestampdelivered'},
				{text:'On Time',datatype:'int',width:100,flex:1,dataIndex:'ontime'},
				{text:'Region',datatype:'varchar',width:10,flex:1,dataIndex:'qaregion'},
				{text:'Route',datatype:'varchar',width:20,flex:1,dataIndex:'qaroute'},
				{text:'Stop',datatype:'varchar',width:50,flex:1,dataIndex:'qastop'},
				{text:'Kolli',datatype:'int',width:60,flex:1,dataIndex:'packages'},
				{text:'Shipment Volume M3',datatype:'dec',width:90,flex:1,dataIndex:'cmb'},
				{text:'Product Type',datatype:'char',width:80,flex:1,dataIndex:'qaproduct'},
				{text:'Solarordrer',datatype:'int',width:100,flex:1,dataIndex:'solar_orders'},
				{text:'GPS X',datatype:'dec',width:110,flex:1,dataIndex:'gps_x'},
				{text:'GPS Y',datatype:'dec',width:110,flex:1,dataIndex:'gps_y'},
				{text:'Address 1',datatype:'char',width:350,flex:1,dataIndex:'address1'},
				{text:'Address 2',datatype:'char',width:350,flex:1,dataIndex:'address2'},
				{text:'Address 3',datatype:'char',width:350,flex:1,dataIndex:'address3'},
				{text:'Address 4',datatype:'char',width:350,flex:1,dataIndex:'address4'},
				{text:'Address (Phone Number)',datatype:'char',width:200,flex:1,dataIndex:'addressphone'},
				{text:'Dato',datatype:'timestamp',width:260,flex:1,dataIndex:'qadatebooking'},
				{text:'Delivery tour',datatype:'varchar',width:50,flex:1,dataIndex:'deliverytour'},
				{text:'Received by',datatype:'varchar',width:600,flex:1,dataIndex:'receivedby'}
			],
			listeners: {
				itemclick: function(dv, record, item, index, e) {
                    editWindow (record.getData());
				}
			}
		});

		function loadGrid () {
			var fieldsValues  = gridPanel.getForm().getFieldValues();
            myGrid.load(fieldsValues);
		}

		var gridPanel = Ext.create("Ext.form.Panel", {
			layout: "border",
			items : [
				{
					xtype : "panel",
					height : 80,
					bodyPadding : 10,
					border : 0,
					region : "north",
					layout: "absolute",
					defaults : {
						allowBlank: true,  // requires a non-empty value
						listeners: {
							specialkey: function(i_field, i_event){
								if (i_event.getKey() == i_event.ENTER) {
									loadGrid();
								}
							}
						}
					},
					items: [
						{
							x: 10,
							y: 10,
							xtype: "textfield",
							name : "textSearch",
							fieldLabel: "Search text",
							allowBlank: true  // requires a non-empty value
						},
						{
							x: 10,
							y: 40,
							xtype: "button",
							text: "Search",
							handler: function() {
								loadGrid();
							}
						}
					]
				},
                myGrid
			]
		});

		// The edit window:
		// -------------------------------------------------------------
		function editWindow (row) {
			var myForm = Ext.widget("ux.buffer.view.form", {
				bodyPadding: 10,
				layout: "anchor",
				idProperty: "prodkey",
				defaults: { 
					labelWidth: 150,
					anchor: "100%"
				},
				url: {
					get   : "router/Booking/getRow",
					set   : "router/Booking/updateRow",
					delete: "router/Booking/deleteRow"
				},
				buttons: [
					{
						xtype: "button",
						text: "Save",
						handler: function(i_button) {
							var i_form = i_button.up("form");

							if (i_form) {
								i_form.save(function(b_success) {
									if (b_success) {
										var i_window = i_button.up("window");
										i_window.close();
									}
								});
							}
						}
					},
					{
						xtype: "button",
						text: "Cancel",
						handler: function(i_button) {
							var i_window = i_button.up("window");
							i_window.close();

						}
					}
				],
				items: [
					{xtype:'textfield',datatype:'int',fieldLabel:'ID',name:'id'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Shipment Number',name:'shipmentnumber'},
					{xtype:'textfield',datatype:'timestamp',fieldLabel:'Delivery Time',name:'timestampdelivered'},
					{xtype:'textfield',datatype:'int',fieldLabel:'On Time',name:'ontime'},
					{xtype:'textfield',datatype:'varchar',fieldLabel:'Region',name:'qaregion'},
					{xtype:'textfield',datatype:'varchar',fieldLabel:'Route',name:'qaroute'},
					{xtype:'textfield',datatype:'varchar',fieldLabel:'Stop',name:'qastop'},
					{xtype:'textfield',datatype:'int',fieldLabel:'Kolli',name:'packages'},
					{xtype:'textfield',datatype:'dec',fieldLabel:'Shipment Volume M3',name:'cmb'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Product Type',name:'qaproduct'},
					{xtype:'textfield',datatype:'int',fieldLabel:'Solarordrer',name:'solar_orders'},
					{xtype:'textfield',datatype:'dec',fieldLabel:'GPS X',name:'gps_x'},
					{xtype:'textfield',datatype:'dec',fieldLabel:'GPS Y',name:'gps_y'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Address 1',name:'address1'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Address 2',name:'address2'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Address 3',name:'address3'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Address 4',name:'address4'},
					{xtype:'textfield',datatype:'char',fieldLabel:'Address (Phone Number)',name:'addressphone'},
					{xtype:'textfield',datatype:'timestamp',fieldLabel:'Dato',name:'qadatebooking'},
					{xtype:'textfield',datatype:'varchar',fieldLabel:'Delivery tour',name:'deliverytour'},
					{xtype:'textfield',datatype:'varchar',fieldLabel:'Received by',name:'receivedby'}
				]
			});
	
			myForm.load(row);

			Ext.widget("window", {
				title: "Edit DHL Booking",
				width: 800,
				height: 600,
				layout: "fit",
				items: [
					myForm
				]
			}).show();
		}


		return gridPanel;
	},

	onClose: function (myPanel) {
	}
});
