// //////////////////////表格视图//////////////////////////
SmallNumPoolGridView = Class.create();

SmallNumPoolGridView.NAV_ELE_TEMPLATE = new Template("<div class='pageNav #{navClass}'  onclick=\"GridMgr.#{navMethod}('#{gridId}')\"  title='#{title}' ></div>");

SmallNumPoolGridView.prototype = {

	initialize : function(config) {

	},

	// 绑定到一个列表上
	bindToGrid : function(grid) {

		this.viewConfig = {
			width : this.viewConfig.width || '100%',
			height : this.viewConfig.height || 'auto',
			listWidth : this.viewConfig.listWidth || '100%',
			cols : this.viewConfig.cols || 3,
			pagetoolbar : this.viewConfig.pagetoolbar
		};

		this.cks = [];

	},

	_genRowHTML : function() {
		var records = this.grid.records;
		var cols = this.viewConfig.cols;
		var rows = Math.ceil(this.grid.records.length / cols);
		var compliment = this.grid.records.length % cols; // 是否能够刚刚排满,排不满的话则补充之

		var html = [];
		for (var i = 0; i < rows; i++) {
			html
					.push("<table height='35' width='550' cellspacing='0' cellpadding='0' border='0'><tbody><tr>");

			for (var j = 0; j < cols && i * cols + j < this.grid.records.length; j++) {

				var n400 = records[i * cols + j];
				// var n400 = r.num400 + "-" + r.dialnum;

				html
						.push("<td><table width='151' cellspacing='0' cellpadding='0' border='0' background='images/no_35.gif' align='center'><tbody><tr><td class='wenfont14b ba hand' height='26' align='center' ");

				html.push("onclick=\"openRegWindow(\'" + n400 + "\')\"");
				html.push("'>");
				html.push(n400);
				html.push("</td></tr></tbody></table>");
			}

			// 最后一行时，可能需要补充td
			if (i == rows - 1) {
				compliment = compliment == 0 ? 0 : cols - compliment;
				for (var c = 0; c < compliment; c++) {
					html
							.push("<td><table width='151' cellspacing='0' cellpadding='0' border='0'  align='center'><tbody><tr><td class='wenfont14b' height='26' align='center'></td></tr></tbody></table>");
				}
			}

			html.push("</tr></tbody></table>");

		}
		return html.join("");

	},

	genToolBar : function() {

		var toolbar = [];

		toolbar
				.push("<table height='36' width='520' cellspacing='0' cellpadding='0' border='0' align='center'><tbody><tr>");

		toolbar.push(this._genPageNav());
		toolbar.push(this._genJumpTool());
		toolbar.push(this._genStatuTool());

		toolbar.push("</tr></tbody></table>");

		return toolbar.join("");

	},

	// 创建状态栏
	_genStatuTool : function() {
		var statusHTML = ["<td>"];
		statusHTML.push("<nobr>");
		statusHTML.push("共");
		statusHTML.push(this.grid.page.totalRecord);
		statusHTML.push("条记录,");
		statusHTML.push("显示");
		statusHTML.push(this.grid.page.from);
		statusHTML.push("到");
		statusHTML.push(this.grid.page.to);
		statusHTML.push("</nobr></td>");

		return statusHTML.join("");

	},

	// 创建弹窗导航
	_genJumpTool : function() {

		var jumpHTML = ["<td align='center'>"];

		jumpHTML.push("<input size='4'  id='" + this.grid.id
				+ "_pageInput' type='text' class ='jumpPageInput' value='"
				+ this.grid.page.curPage + "'/>");

		jumpHTML.push("</td>");

		jumpHTML.push("<td align='center'>");
		jumpHTML.push("/" + this.grid.page.maxPage);
		jumpHTML.push("页</td>");
		jumpHTML.push("<td>");
		jumpHTML.push("<div  class='jumpPage' onclick=\"GridMgr.go('"
				+ this.grid.id + "')\"/></div>");
		jumpHTML.push("</td>");

		return jumpHTML.join("");

	},

	// 导航页的html
	_genPageNav : function() {

		var firstHTML = SmallNumPoolGridView.NAV_ELE_TEMPLATE.evaluate({
			navClass : this.grid.page.isFirst() ? 'firstPageD' : 'firstPage',
			navMethod : 'first',
			gridId : this.grid.id,
			title : '首页'

		});

		var nextHTML = SmallNumPoolGridView.NAV_ELE_TEMPLATE.evaluate({
			navClass : this.grid.page.isLast() ? 'nextPageD' : 'nextPage',
			navMethod : 'next',
			gridId : this.grid.id,
			title : '下一页'

		});

		var prevHTML = SmallNumPoolGridView.NAV_ELE_TEMPLATE.evaluate({
			navClass : this.grid.page.isFirst() ? 'prevPageD' : 'prevPage',
			navMethod : 'prev',
			gridId : this.grid.id,
			title : '上一页'

		});

		var lastHTML = SmallNumPoolGridView.NAV_ELE_TEMPLATE.evaluate({
			navClass : this.grid.page.isLast() ? 'lastPageD' : 'lastPage',
			navMethod : 'last',
			gridId : this.grid.id,
			title : '尾页'

		});

		var pageHTML = ["<td class='pageNavigationTool' height='30' align='center'>"];

		pageHTML.push(firstHTML);
		pageHTML.push('</td>');

		pageHTML
				.push("<td class='pageNavigationTool' height='30' align='center'>");
		pageHTML.push(prevHTML);
		pageHTML.push("</td>");

		pageHTML
				.push("<td class='pageNavigationTool' height='30' align='center'>");
		pageHTML.push(nextHTML);
		pageHTML.push("</td>");

		pageHTML
				.push("<td class='pageNavigationTool' height='30' align='center'>");
		pageHTML.push(lastHTML);
		pageHTML.push("</td>");

		return pageHTML.join("");

	},

	genGridHTML : function() {

		var html = [];
		html
				.push("<table height='172' width='550' cellspacing='0' cellpadding='0' border='0' align='center'><tbody><tr><td valign='top'><table width='550' cellspacing='0' cellpadding='0' border='0'><tbody>");

		html
				.push("<tr><tr><td><img height='36' width='516' src='images/ck_02.gif'/></td></td><td>"
						+ "<img height='35' width='34' src='images/ck_03.gif' class='hand' title='关闭' onclick='globalMoreNumWindow.close()'/>"
						+ "</td></tr></tbody></table>");

		html
				.push("<table height='166' width='550' cellspacing='0' cellpadding='0' border='0'><tbody><tr><td>");

		html.push(this._genRowHTML());
		html.push("</td></tr></tbody></table>");

		 if (this.viewConfig.pagetoolbar) {
		 html.push(this.genToolBar());
		
		 }
		html.push("</td></tr></tbody></table>");

		return html.join("");

	}

}