blogger.js

$(function () {

	var inStoreReportApp = (function () {
		
		var 

			// Handle user's motion on DOM
			controller = {

				// Click specific button to submit form
				onFormSubmit: function ( ) {
					view.$submitButton
					.add( view.$exportButton ).on( 'click', function () {
						// Decide which workflow by button been clicked
						if ( $( this ).hasClass( 'submit' ) ) {
							view.$bExportInput.val( 0 );
						} else {
							view.$bExportInput.val( 1 );
						}
							
						model._dynamic.bExport = view.$bExportInput.val();
						view.$form.submit();
					});
					
					return this;
				},

				// Bind ajaxForm on assign form
				onFormAjaxform: function () {
					view.$form.ajaxForm({
						url: model._const.sSubmitUrl,
						success: function ( res ) {
							if ( (model._dynamic.bExport == 0) ) {
								controller.getSearchResponse( res )
								.countTotalGoodsCost()
								.updateViewTotalCost()
								.onTableSorterPager( view.$resRight.find( 'table' ) );
							} else {
								controller.downloadInstoreXls( res );
							}
						}
					});

					return this;
				},

				// Download the instore xls we search for
				downloadInstoreXls: function ( res ) {
					return window.location = res;
				},

				// Refresh the right part with response from ajaxForm
				getSearchResponse: function ( res ) {
					// Trim space in response
					var res = res.replace( /^\s*|\s*$/g, "" );
					view.$resRight.html( res );
					return controller.onOpenDetailDialog( view.$resRight.find( 'button' ) );					
				},

				// Open detail dialog, the dialog is init at orders.financial.html.twig
				onOpenDetailDialog: function ( e ) {						
					e.on( 'click', function () {
						model._dynamic.nGoodsPassportId = $( this ).data( 'id' );	
						ajaxLoaded();
						$.post( model._const.sOneGoodsDetailUrl , model._dynamic, function ( res ) {
							view.$detailGoodsDialog.html( res );
							view.$detailGoodsDialog.children( 'div' ).tabs(
								{ 
									heightStyle: 'content' 
								}
							);
							view.$detailGoodsDialog.dialog( 'open' );
							$.unblockUI();
						});
					}).button();

					return this;
				},

				// Bind tablesorter and tablepager
				onTableSorterPager: function ( e ) {
					if ( (e.find('tbody>tr').length == 0) ) {
						e.siblings().addBack().remove();
						return this;
					}

					e.tablesorter().tablesorterPager({
						container: e.next().next()
					}).next().next().css({
						'position': 'static'
					});

    				return this;
				},

				// Count the total cost
				countTotalGoodsCost: function () {
					var $goodsCostTd = view.$resRight.find( '.goodsCost' );

					model._dynamic.nTotalCost = 0;
					$goodsCostTd.each( function () {
						model._dynamic.nTotalCost =  parseInt( $( this ).data( 'cost' ) ) + parseInt( model._dynamic.nTotalCost );
					});

					return this;
				},

				// Update the span( or other element ) text ,set it be total cost
				updateViewTotalCost: function () {
					this.countTotalGoodsCost( view.$resRight );
					view.$resRight.find( '.nTotalCost' ).text( model._dynamic.nTotalCost );
					return this;
				}
			},
				
			// DOM init and setup
			view = {

				setup: function ( tab ) {
					// The tabs where we are 
					this.$tab = tab;

					// Search response show here, 
					// and add tabs UI prevent broken when ajax finish later
					this.$resRight = this.$tab.find( '.ajaxResMsgRight' );

					// The div of set condition to search
					this.$panel = this.$tab.find( '.operatePanel' );

					// The form of search condition will submit
					this.$form = this.$panel.find( 'form' );

					// The inputs of form
					this.$input = this.$form.find( 'input' );

					// The bExport input , to decide work flow in controller
					this.$bExportInput = this.$input.filter( '[name="bExport"]' );

					// The div where render select in
					this.$selectDiv = this.$form.find( 'div' );

					// The brand about select, contains Brand, BrandType, BrandSn
					this.$select = this.$selectDiv.find( 'select' );

					// The brand select, and prepend a null option to find all
					this.$brandSelect = $( '[name="base_ajax_brand[]"]' ).prepend( '<option vale="0" selected>不限</option>' );

					// All buttons
					this.$button = this.$form.find( 'button' );

					// Useless button
					this.$deleteButton = this.$button.filter( '.delete_parent_div' ).remove();

					// Button clicked to submit form , search 
					this.$submitButton = this.$button.filter( '.submit' ).button();

					// Button clicked to submit form , export
					this.$exportButton = this.$button.filter( '.export' ).button();

					// Goods detail dialog init at order.financia.html.twig
					this.$detailGoodsDialog = $( '.detail_of_custom_goods' );

					return this;
				}
			},
			
			// Data of business logic
			model = {
				// Constant value
				'_const': {
					'sSubmitUrl': Routing.generate( 'instore_report_search' ),
					'sOneGoodsDetailUrl': Routing.generate( 'goods_one_detail_info' )
				},

				// Value will change with DOM action
				'_dynamic': {
					'nTotalCost': 0,
					'nGoodsPassportId': '',
					'bExport': 0
				}
			};

		return {
	        initialize: function ( tab ) {
	    		view.setup( tab );
	    		controller.onFormAjaxform().onFormSubmit();
	        }
	    };
	});
	
	inStoreReportApp().initialize( $( '#orders-instore' ) );
});