define("mService/fnabrowser", ["mUtil", "i18n"], function (mUtil, i18n) {

	return {
		mounted: function ($page, cfg) {
			var defCfg = {
				browserId: "",
				selectedIds: "",
				closeCallback: function () {
					mUtil.back();
				},
				success: function () {}
			};

			$.extend(defCfg, cfg);

			var isMulti = defCfg.isMulti;
			$(".page-content", $page).addClass(isMulti ? "multi" : "single");

			var _tree = {
				init: function () {
					var that = this;
					var $rootPage = $(".root-page", $page);

					var $treeData = $rootPage.children("li");

					//从服务端加载
					var $treeLoading = $("<div class='wev-loading'><span>" + i18n.LOADING_DATA + "</span></div>");
					$treeData.append($treeLoading);
					var dataId = "";
					var url = mUtil.jionActionUrl("com.api.mobilemode.web.mobile.browser.SystemBrowserAction", "action=getData&browserId=" + defCfg.browserId);
					mUtil.getJSON(url, function (result) {
						$treeLoading.remove();

						var status = result["status"];
						if (status == "1") {
							var data = result["data"];
							var datas = data["datas"];
							that.fillTreeDatasToPage(datas, $treeData, true);
						} else {
							var errMsg = result["errMsg"];
							mUtil.getLabel(5359, "加载数据时出现错误:", function (msg) {
								alert(msg + errMsg);
							});
						}
					});
				},
				build: function ($wrap) {
					var that = this;
					$(".expend[data-haschild='1']", $wrap).click(function (e) {
						var $expend = $(this), $icon = $expend.find("i.wev-css-icon");
						var $treeData = $(this).parent();
						var expanding = $expend.attr("expanding");
						if (expanding == "1") {
							return;
						}
						$expend.attr("expanding", "1");

						var $treePage = $treeData.siblings(".tree-page");

						if ($expend.hasClass("closed")) {
							$expend.removeClass("closed");
							$expend.addClass("opened");
							$icon.removeClass("wev-plus-icon").addClass("wev-minus-icon");

							if ($treePage.length > 0) {
								$treePage.show();
								$expend.removeAttr("expanding");
							} else {
								//从服务端加载
								var $treeLoading = $("<div class='wev-loading'><span>" + i18n.LOADING_DATA + "</span></div>");
								$treeLoading.insertAfter($treeData);

								var dataId = $treeData.attr("data-id");
								var url = mUtil.jionActionUrl("com.api.mobilemode.web.mobile.browser.SystemBrowserAction", "action=getData&browserId=" + defCfg.browserId + "&id=" + dataId);
								mUtil.getJSON(url, function (result) {
									$treeLoading.remove();

									var status = result["status"];
									if (status == "1") {
										var data = result["data"];
										var datas = data["datas"];
										that.fillTreeDatasToPage(datas, $treeData);
									} else {
										var errMsg = result["errMsg"];
										mUtil.getLabel(5359, "加载数据时出现错误:", function (msg) {
											alert(msg + errMsg);
										});

										$expend.removeClass("opened").addClass("closed");
									}

									$expend.removeAttr("expanding");
								});
							}
						} else if ($expend.hasClass("opened")) {
							$treePage.hide();
							$expend.removeClass("opened").addClass("closed").removeAttr("expanding");
							$icon.addClass("wev-plus-icon").removeClass("wev-minus-icon");
						}
						e.stopPropagation();
					});
				},
				fillTreeDatasToPage: function (datas, $obj, init) {
					var that = this;
					var $treePage = $("<ul class=\"tree-page\"></ul>");
					init && $obj.append($treePage) || $treePage.insertAfter($obj);
					for (var i = 0; i < datas.length; i++) {
						var data = datas[i];
						var id = data["id"]; //id
						var name = data["name"]; //名称
						var hasChild = data["isParent"]; //是否有子节点
						var canClick = data["canClick"]; //是否可选择
						var liClass = "";
						if (canClick) {
							liClass = "data";
						}
						if (defCfg.selectedIds) {
							liClass += defCfg.selectedIds != id ? "" : " selected";
						}
						var $li = $("<li class=\"" + liClass + "\" data-id=\"" + id + "\" data-name=\"" + name + "\"></li>");
						var liHtml = "<div class=\"tree-data\" data-id=\"" + id + "\">";
						if(canClick){
                            liHtml += '<i class="wev-css-icon wev-multi-check"></i>';
                        }
                        if (hasChild) {
							liHtml += "<div class=\"expend closed\" data-haschild=\"1\"><i class=\"wev-css-icon wev-plus-icon\"></i></div>";
						}
						liHtml += name;
						liHtml += "</div>";
						$li.append(liHtml);
						$treePage.append($li);
						if (canClick) {
							$li.click(function (e) {
								_result.onOk($(this).data("id"), $(this).data("name"));
								e.stopPropagation();
							});
						}
					}
					that.build($treePage);
				}
			};

			var $search = $(".wev-search", $page),
				$searchKey = $("input[type='search']", $page),
				$clear = $(".wev-clear-btn", $page);


			$("form[disabledEnterSubmit]", $page).keydown(function (event) {
				if (event.keyCode == 13) {
					return false;
				}
			});

			$searchKey.on("input", function () {
				var v = this.value;
				$search.toggleClass("wev-has-value", v != "");
			}).keyup(function (event) {
				if (event.keyCode == 13) {
					searchKey = this.value;
					_list.toggleTabAndLoad();
					this.blur();
				}
			});

			$clear.click(function () {
				$searchKey.val("").focus().triggerHandler("input");
			});

			var listPageNo = 0,
				pageSize = 20,
				searchKey = "",
				$contentContainer = $(".content-container", $page),
				$list = $(".list-wrap .wev-table-view", $contentContainer),
				$refreshLoading = $(".wev-refresh-loading", $contentContainer),
				$moreLoading = $(".wev-more-loading", $contentContainer),
				$noData = $(".wev-no-data", $contentContainer),
				listDataKey;

			var animateEventName = mUtil.runtime.isWebkit() ? "webkitAnimationEnd" : "animationend";
			$refreshLoading[0].addEventListener(animateEventName, function () {
				if ($(this).hasClass("wev-hide")) {
					$(this).hide();
				}
			});

			var _list = {
				refresh: function (isPageLoad) {
					listPageNo = 0;
					$contentContainer.addClass("wev-refreshing");
					$refreshLoading.show().removeClass("wev-hide").addClass("wev-show");

					var beginstamp = (new Date()).valueOf();

					function hideLoading() {
						var endstamp = (new Date()).valueOf();
						if ((endstamp - beginstamp) >= 300) {
							$refreshLoading.removeClass("wev-show").addClass("wev-hide");
							$contentContainer.removeClass("wev-refreshing");
						} else {
							setTimeout(hideLoading, 100);
						}
					}
					_list.loadData(function ($newList) {
						hideLoading();
					}, isPageLoad);
				},
				loadData: function (callback, isPageLoad) {
					$noData.hide();
					if (isPageLoad || searchKey || !listDataKey) {
						var url = mUtil.jionActionUrl("com.api.mobilemode.web.mobile.browser.SystemBrowserAction", "action=getData&list=1&browserId=" + defCfg.browserId);
						mUtil.getJSON(url, {
							"name": searchKey
						}, function (result) {
							var dataKey = result["data"]["datas"];
							isPageLoad && (listDataKey = dataKey);
							_list.loadDataByDataKey(dataKey, callback);
						});
					} else {
						_list.loadDataByDataKey(listDataKey, callback);
					}
				},
				loadDataByDataKey: function (dataKey, callback) {
					listPageNo++;
					var pageNo = listPageNo;
					url = mUtil.jionActionUrl("com.api.mobilemode.web.mobile.browser.SystemBrowserAction", "action=getListData");

					mUtil.getJSON(url, {
						"current": pageNo,
						"pageSize": pageSize,
						"dataKey": dataKey
					}, function (result) {
						var data = result["data"],
							html = "";
						var totalSize = data.datas.length;
						var templateHtml = [
							'{@each datas as d}',
							'<li class="wev-table-view-cell wev-media {@if d.id == selectedId} selected{@/if}" data-id="${d.id}" data-title="${d.namespan}">',
    							'<a href="javascript:void(0);">',
    							    '<i class="wev-css-icon '+(isMulti ? 'wev-multi-check' : 'wev-single-check') + '"></i>',
        							'<div class="wev-media-body">',
            							'$${d.namespan}',
            							'<div class="wev-ellipsis">',
            							    '$${d.supNamespan}',
            							'</div>',
        							'</div>',
    							'</a>',
							'</li>',
							'{@/each}'
						].join('');

						defCfg.selectedIds && (data.selectedId = defCfg.selectedIds);
						html = mUtil.parseTemplate(templateHtml, data);

						var $newList = $(html);
						if (pageNo == 1) {
							$list.find("*").remove();
						}
						$list.append($newList);

						$newList.click(function () {
							_result.onOk($(this).data("id"), $(this).data("title"));
						});

						if (totalSize <= 0) {
							$noData.show();
						}

						if (mUtil.isFunction(callback)) {
							callback();
						}
					}, function (errMsg) {
						var $wevError = $("<div class='wev-error'></div>");
						$wevError.html(errMsg);
						$contentContainer.hide();
						$contentContainer.parent().append($wevError);
					});
				},
				toggleTabAndLoad: function () {
					$listTab.addClass("active");
					$treeTab.removeClass("active");
					$(".tree-container", $page).css("display", "none");
					$contentContainer.css("display", "");
					var $treeData = $(".root-page", $page).children("li");
					$treeData.html("");
					_list.refresh();
				}
			};

			var _result = {
				onOk: function (id, text) {
					_result.updateBudgetfeeTypeUsed(id); //更新最近信息
					var callback = defCfg.success;
					callback && callback(id, text);
					var closeCallback = defCfg.closeCallback;
					closeCallback && closeCallback();
				},
				updateBudgetfeeTypeUsed: function (id) {
					var url = mUtil.jionActionUrl("com.api.mobilemode.web.mobile.browser.SystemBrowserAction", "action=updateBudgetfeeTypeUsed&subjectId=" + id);
					mUtil.getJSON(url, function (result) {
						var status = result["status"];
						if (status != "1") {
							console.error("updateBudgetfeeTypeUsed error : " + result["errMsg"] || "");
						}
					});
				}
			};

			var $listTab = $(".list-tab", $page);
			var $treeTab = $(".tree-tab", $page);

			$listTab.click(function () {
				var that = $(this);
				searchKey = "";
				if (!that.hasClass("active")) {
					_list.toggleTabAndLoad();
				}
			});

			$treeTab.click(function () {
				var that = $(this);
				if (!that.hasClass("active")) {
					that.addClass("active");
					$listTab.removeClass("active");
					$contentContainer.css("display", "none");
					$(".tree-container", $page).css("display", "");
					_tree.init(true);
				}
			});

			_list.refresh(true);
		}
	};
});