<?php
require "_header.php";
require "data/combo_employee.php";
?>
<!-- start custom CSS/JS -->
<script type="text/javascript">

	var labelArray;
	labelArray = [
		['Section :<span class="comp">*</span>'],
		['Year :<span class="comp">*</span>'],
		['Month :<span class="comp">*</span>'],
		['Employee:<span class="comp">*</span>'],
		['All']
	];


	Ext.onReady(function () {
		Ext.QuickTips.init();


		var sectionliststore = new Ext.data.ArrayStore({
			fields: ['section_id', 'section_name'],
			data: Ext.employee.section

		});

		var yearstore1 = new Ext.data.ArrayStore({
			fields: ['year_name'],
			data: Ext.employee.year
		});


		Ext.namespace('Ext.month');
		Ext.month.list = [
			[1, 'January'],
			[2, 'February'],
			[3, 'March'],
			[4, 'April'],
			[5, 'May'],
			[6, 'June'],
			[7, 'July'],
			[8, 'August'],
			[9, 'September'],
			[10, 'October'],
			[11, 'November'],
			[12, 'December']
		];


		var monthliststore1 = new Ext.data.SimpleStore({
			fields: [{ name: 'monthid', type: 'int' }, 'monthname'],
			data: Ext.month.list
		});

		var employeestore = new Ext.data.ArrayStore({
			fields: ['section_id', 'employee_id', 'employee_salaryno', 'employee_name', 'employee_basicsalary', 'employee_payscale'],
			data: Ext.employee.salinfo
		});


		var formyearlymonthwise = new Ext.FormPanel({
			labelWidth: 85, // label settings here cascade unless overridden
			url: 'report-form-employee-salary-slip-monthwise-result.php',
			method: 'post',
			frame: true,
			standardSubmit: true,

			bodyStyle: 'padding:6px 6px 0',

			defaultType: 'textfield',
			items: [
				{
					xtype: 'combo',
					labelSeparator: '',
					fieldLabel: labelArray[0],
					name: 'sectionid',
					id: 'section',
					hiddenName: 'sectionid',
					store: sectionliststore,
					displayField: 'section_name',
					valueField: 'section_id',
					width: 180,
					hidden: true,
					typeAhead: true,
					selectOnFocus: true,
					forceSelection: true,
					mode: 'local',
					triggerAction: 'all',
					emptyText: 'Please select section...',
					editable: false,
					allowBlank: true,
					listeners: {
						select: {
							fn: function (combo, value) {
								Ext.getCmp('employee').clearValue();
								Ext.getCmp('employee').store.filter('section_id', combo.getValue());
							}
						}
					}
				}, {
					xtype: 'container',
					autoEl: {},
					border: false,
					layout: 'column',
					anchor: '100%',
					defaultType: 'field',
					items: [{
						xtype: 'container',
						layout: 'form',
						columnWidth: .56,
						anchor: '-50',
						items: [{
							xtype: 'combo',
							labelSeparator: '',
							fieldLabel: labelArray[1],
							name: 'Yearfrom',
							id: 'Yearfrom',
							store: yearstore1,
							displayField: 'year_name',
							valueField: 'year_name',
							width: 87,
							typeAhead: true,
							selectOnFocus: true,
							forceSelection: true,
							triggerAction: 'all',
							emptyText: 'From',
							editable: true,
							allowBlank: false,
							mode: 'local',
							listeners: {
								select: {
									fn: function (combo, value) {
										formyearlymonthwise.getForm().findField('month_namefrom').enable();

									}
								}
							}
						}, {
							xtype: 'combo',
							name: 'month_namefrom',
							id: 'month_namefrom',
							labelSeparator: '',
							fieldLabel: labelArray[2],
							forceSelection: true,
							hiddenName: 'month_idfrom',
							displayField: 'monthname',
							valueField: 'monthid',
							typeAhead: true,
							labelWidth: 70,
							disabled: true,
							width: 87,
							emptyText: 'From',
							allowBlank: false,
							triggerAction: 'all',
							mode: 'local',
							editable: true,
							store: monthliststore1,
							listeners: {
								select: {
									fn: function (combo, value) {

										formyearlymonthwise.getForm().findField('monthname').setValue(combo.getRawValue());
									}
								}
							}

						}]
					}, {
						xtype: 'textfield',
						name: 'monthname',
						id: 'monthname',
						hidden: true
					}]
				}, {

					xtype: 'container',
					autoEl: {},
					border: false,
					layout: 'column',
					anchor: '100%',
					defaultType: 'field',
					items: [{
						xtype: 'container',
						layout: 'form',
						columnWidth: .255,
						anchor: '-50',
						items: [{
							xtype: 'radio',
							hideLabel: true,
							name: 'radiotype',
							checked: true,
							hidden: true,
							inputValue: '1',
							boxLabel: labelArray[3],
							handler: function () {
								if (this.checked) {

								}
							}
						}
							, {

							xtype: 'radio',
							hideLabel: true,
							name: 'radiotype',
							inputValue: '2',
							hidden: true,
							boxLabel: labelArray[4],
							handler: function () {
								if (this.checked) {
									formyearlymonthwise.getForm().findField('employee').disable();
									formyearlymonthwise.getForm().findField('employee').reset();
								}
								else {
									Ext.getCmp('employee').enable();
									Ext.getCmp('employee').clearValue();
									Ext.getCmp('employee').store.filter('section_id', Ext.getCmp('section').getValue());
								}
							}

						}]
					},
					{
						xtype: 'container',
						layout: 'form',
						columnWidth: .9,
						labelWidth: 80,
						items: [{
							xtype: 'combo',
							name: 'employeeid',
							id: 'employee',
							hiddenName: 'ID',
							fieldLabel: 'Employee Name',
							store: employeestore,
							displayField: 'employee_name',
							valueField: 'employee_id',
							editable: true,
							mode: 'local',
							allowBlank: false,
							triggerAction: 'all',
							emptyText: 'Please Select Employee ...',
							width: 180
						}]
					}]


				}


			]
		});

		var monthwiseWindow = new Ext.Window({
			title: 'Salary Slip Monthwise',
			width: 360,
			height: 180,
			border: false,
			modal: true,
			layout: 'fit',
			closeAction: 'close',

			collapsible: true,
			items: formyearlymonthwise,
			buttonAlign: 'center',
			buttons: [
				{
					text: 'View Report',
					handler: function () {
						var Yearfrom = formyearlymonthwise.getForm().findField('Yearfrom').getValue();
						var month_idfrom = formyearlymonthwise.getForm().findField('month_idfrom').getValue();
						var monthname = formyearlymonthwise.getForm().findField('monthname').getValue();
						var ID = formyearlymonthwise.getForm().findField('ID').getValue();
						var redirect = 'report-form-employee-salary-slip-monthwise-result.php?Yearfrom=' + Yearfrom + '&month_idfrom=' + month_idfrom + '&ID=' + ID +'&monthname=' + monthname;
						window.location = redirect;
					}
				},
				{
					text: 'Reset',
					handler: function () {
						formyearlymonthwise.getForm().reset();
						formyearlymonthwise.getForm().findField('section').focus(true, 500);
					}
				},
				{
					text: 'Close',
					handler: function () {
						monthwiseWindow.close();
					}
				}
			]

		});
		var varWidth = (screen.width - monthwiseWindow.width) / 2;
		monthwiseWindow.setPosition(varWidth, ((screen.height / 4) - 110));
		monthwiseWindow.show();

		SetSectionValue('add', sectionliststore, 'section', 'section_id');
	});
</script>
<!-- end custom CSS/JS -->
<div id="main-content" align="center"></div>
<?php require "_footer.php"; ?>