|
1
2
3
|
/**
* 菜单处理
*/
|
|
4
|
$(function () {
|
|
5
6
7
8
|
// MetsiMenu
$('#side-menu').metisMenu();
//固定菜单栏
|
|
9
|
$(function () {
|
|
10
11
12
13
14
15
16
17
|
$('.sidebar-collapse').slimScroll({
height: '100%',
railOpacity: 0.9,
alwaysVisible: false
});
});
// 菜单切换
|
|
18
|
$('.navbar-minimalize').click(function () {
|
|
19
20
21
22
|
$("body").toggleClass("mini-navbar");
SmoothlyMenu();
});
|
|
23
|
$('#side-menu>li').click(function () {
|
|
24
25
26
27
|
if ($('body').hasClass('mini-navbar')) {
NavToggle();
}
});
|
|
28
|
$('#side-menu>li li a').click(function () {
|
|
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
if ($(window).width() < 769) {
NavToggle();
}
});
$('.nav-close').click(NavToggle);
//ios浏览器兼容性处理
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
$('#content-main').css('overflow-y', 'auto');
}
});
$(window).bind("load resize",
|
|
44
45
46
47
48
49
|
function () {
if ($(this).width() < 769) {
$('body').addClass('mini-navbar');
$('.navbar-static-side').fadeIn();
}
});
|
|
50
51
52
53
54
55
56
57
|
function NavToggle() {
$('.navbar-minimalize').trigger('click');
}
function SmoothlyMenu() {
if (!$('body').hasClass('mini-navbar')) {
$('#side-menu').hide();
|
|
58
59
60
61
|
setTimeout(function () {
$('#side-menu').fadeIn(500);
},
100);
|
|
62
63
|
} else if ($('body').hasClass('fixed-sidebar')) {
$('#side-menu').hide();
|
|
64
65
66
67
|
setTimeout(function () {
$('#side-menu').fadeIn(500);
},
300);
|
|
68
69
70
71
72
73
74
75
|
} else {
$('#side-menu').removeAttr('style');
}
}
/**
* iframe处理
*/
|
|
76
|
$(function () {
|
|
77
78
79
|
//计算元素集合的总宽度
function calSumWidth(elements) {
var width = 0;
|
|
80
|
$(elements).each(function () {
|
|
81
82
83
84
85
86
87
88
|
width += $(this).outerWidth(true);
});
return width;
}
//滚动到指定选项卡
function scrollToTab(element) {
var marginLeftVal = calSumWidth($(element).prevAll()),
|
|
89
|
marginRightVal = calSumWidth($(element).nextAll());
|
|
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
|
// 可视区域非tab宽度
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
//可视区域tab宽度
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
//实际滚动宽度
var scrollVal = 0;
if ($(".page-tabs-content").outerWidth() < visibleWidth) {
scrollVal = 0;
} else if (marginRightVal <= (visibleWidth - $(element).outerWidth(true) - $(element).next().outerWidth(true))) {
if ((visibleWidth - $(element).next().outerWidth(true)) > marginRightVal) {
scrollVal = marginLeftVal;
var tabElement = element;
while ((scrollVal - $(tabElement).outerWidth()) > ($(".page-tabs-content").outerWidth() - visibleWidth)) {
scrollVal -= $(tabElement).prev().outerWidth();
tabElement = $(tabElement).prev();
}
}
} else if (marginLeftVal > (visibleWidth - $(element).outerWidth(true) - $(element).prev().outerWidth(true))) {
scrollVal = marginLeftVal - $(element).prev().outerWidth(true);
}
$('.page-tabs-content').animate({
|
|
111
112
113
|
marginLeft: 0 - scrollVal + 'px'
},
"fast");
|
|
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
|
}
//查看左侧隐藏的选项卡
function scrollTabLeft() {
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')));
// 可视区域非tab宽度
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
//可视区域tab宽度
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
//实际滚动宽度
var scrollVal = 0;
if ($(".page-tabs-content").width() < visibleWidth) {
return false;
} else {
var tabElement = $(".menuTab:first");
var offsetVal = 0;
while ((offsetVal + $(tabElement).outerWidth(true)) <= marginLeftVal) { //找到离当前tab最近的元素
offsetVal += $(tabElement).outerWidth(true);
tabElement = $(tabElement).next();
}
offsetVal = 0;
if (calSumWidth($(tabElement).prevAll()) > visibleWidth) {
while ((offsetVal + $(tabElement).outerWidth(true)) < (visibleWidth) && tabElement.length > 0) {
offsetVal += $(tabElement).outerWidth(true);
tabElement = $(tabElement).prev();
}
scrollVal = calSumWidth($(tabElement).prevAll());
}
}
$('.page-tabs-content').animate({
|
|
144
145
146
|
marginLeft: 0 - scrollVal + 'px'
},
"fast");
|
|
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
|
}
//查看右侧隐藏的选项卡
function scrollTabRight() {
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')));
// 可视区域非tab宽度
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
//可视区域tab宽度
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
//实际滚动宽度
var scrollVal = 0;
if ($(".page-tabs-content").width() < visibleWidth) {
return false;
} else {
var tabElement = $(".menuTab:first");
var offsetVal = 0;
while ((offsetVal + $(tabElement).outerWidth(true)) <= marginLeftVal) { //找到离当前tab最近的元素
offsetVal += $(tabElement).outerWidth(true);
tabElement = $(tabElement).next();
}
offsetVal = 0;
while ((offsetVal + $(tabElement).outerWidth(true)) < (visibleWidth) && tabElement.length > 0) {
offsetVal += $(tabElement).outerWidth(true);
tabElement = $(tabElement).next();
}
scrollVal = calSumWidth($(tabElement).prevAll());
if (scrollVal > 0) {
$('.page-tabs-content').animate({
|
|
175
176
177
|
marginLeft: 0 - scrollVal + 'px'
},
"fast");
|
|
178
179
180
181
182
|
}
}
}
//通过遍历给菜单项加上data-index属性
|
|
183
|
$(".menuItem").each(function (index) {
|
|
184
185
186
187
188
189
190
191
|
if (!$(this).attr('data-index')) {
$(this).attr('data-index', index);
}
});
function menuItem() {
// 获取标识数据
var dataUrl = $(this).attr('href'),
|
|
192
193
194
|
dataIndex = $(this).data('index'),
menuName = $.trim($(this).text()),
flag = true;
|
|
195
196
197
|
if (dataUrl == undefined || $.trim(dataUrl).length == 0) return false;
// 选项卡菜单已存在
|
|
198
|
$('.menuTab').each(function () {
|
|
199
200
201
202
203
|
if ($(this).data('id') == dataUrl) {
if (!$(this).hasClass('active')) {
$(this).addClass('active').siblings('.menuTab').removeClass('active');
scrollToTab(this);
// 显示tab对应的内容区
|
|
204
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
|
if ($(this).data('id') == dataUrl) {
$(this).show().siblings('.huaheng_iframe').hide();
return false;
}
});
}
flag = false;
return false;
}
});
// 选项卡菜单不存在
if (flag) {
var str = '<a href="javascript:;" class="active menuTab" data-id="' + dataUrl + '">' + menuName + ' <i class="fa fa-times-circle"></i></a>';
$('.menuTab').removeClass('active');
// 添加选项卡对应的iframe
var str1 = '<iframe class="huaheng_iframe" name="iframe' + dataIndex + '" width="100%" height="100%" src="' + dataUrl + '" frameborder="0" data-id="' + dataUrl + '" seamless></iframe>';
$('.mainContent').find('iframe.huaheng_iframe').hide().parents('.mainContent').append(str1);
|
|
223
|
|
|
224
|
$.modal.loading("数据加载中,请稍后...");
|
|
225
|
|
|
226
|
$('.mainContent iframe:visible').load(function () {
|
|
227
|
$.modal.closeLoading();
|
|
228
|
});
|
|
229
|
|
|
230
231
232
233
|
// 添加选项卡
$('.menuTabs .page-tabs-content').append(str);
scrollToTab($('.menuTab.active'));
}
|
|
234
235
236
|
else {
refreshTab();
}
|
|
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
|
return false;
}
$('.menuItem').on('click', menuItem);
// 关闭选项卡菜单
function closeTab() {
var closeTabId = $(this).parents('.menuTab').data('id');
var currentWidth = $(this).parents('.menuTab').width();
// 当前元素处于活动状态
if ($(this).parents('.menuTab').hasClass('active')) {
// 当前元素后面有同辈元素,使后面的一个元素处于活动状态
if ($(this).parents('.menuTab').next('.menuTab').size()) {
var activeId = $(this).parents('.menuTab').next('.menuTab:eq(0)').data('id');
$(this).parents('.menuTab').next('.menuTab:eq(0)').addClass('active');
|
|
256
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
257
258
259
260
261
262
263
264
265
|
if ($(this).data('id') == activeId) {
$(this).show().siblings('.huaheng_iframe').hide();
return false;
}
});
var marginLeftVal = parseInt($('.page-tabs-content').css('margin-left'));
if (marginLeftVal < 0) {
$('.page-tabs-content').animate({
|
|
266
267
268
|
marginLeft: (marginLeftVal + currentWidth) + 'px'
},
"fast");
|
|
269
270
271
272
273
274
|
}
// 移除当前选项卡
$(this).parents('.menuTab').remove();
// 移除tab对应的内容区
|
|
275
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
276
277
278
279
280
281
282
283
284
285
286
|
if ($(this).data('id') == closeTabId) {
$(this).remove();
return false;
}
});
}
// 当前元素后面没有同辈元素,使当前元素的上一个元素处于活动状态
if ($(this).parents('.menuTab').prev('.menuTab').size()) {
var activeId = $(this).parents('.menuTab').prev('.menuTab:last').data('id');
$(this).parents('.menuTab').prev('.menuTab:last').addClass('active');
|
|
287
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
288
289
290
291
292
293
294
295
296
297
|
if ($(this).data('id') == activeId) {
$(this).show().siblings('.huaheng_iframe').hide();
return false;
}
});
// 移除当前选项卡
$(this).parents('.menuTab').remove();
// 移除tab对应的内容区
|
|
298
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
299
300
301
302
303
304
305
306
307
308
309
310
311
|
if ($(this).data('id') == closeTabId) {
$(this).remove();
return false;
}
});
}
}
// 当前元素不处于活动状态
else {
// 移除当前选项卡
$(this).parents('.menuTab').remove();
// 移除相应tab对应的内容区
|
|
312
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
313
314
315
316
317
318
319
320
321
322
|
if ($(this).data('id') == closeTabId) {
$(this).remove();
return false;
}
});
scrollToTab($('.menuTab.active'));
}
return false;
}
|
|
323
|
$('.menuTabs').on('click', '.menuTab i', closeTab);
|
|
324
325
326
|
//关闭其他选项卡
function closeOtherTabs() {
|
|
327
|
$('.page-tabs-content').children("[data-id]").not(":first").not(".active").each(function () {
|
|
328
329
330
331
332
|
$('.huaheng_iframe[data-id="' + $(this).data('id') + '"]').remove();
$(this).remove();
});
$('.page-tabs-content').css("margin-left", "0");
}
|
|
333
|
|
|
334
335
336
337
338
339
|
$('.tabCloseOther').on('click', closeOtherTabs);
//滚动到已激活的选项卡
function showActiveTab() {
scrollToTab($('.menuTab.active'));
}
|
|
340
|
|
|
341
342
343
344
345
346
347
|
$('.tabShowActive').on('click', showActiveTab);
// 点击选项卡菜单
function activeTab() {
if (!$(this).hasClass('active')) {
var currentId = $(this).data('id');
// 显示tab对应的内容区
|
|
348
|
$('.mainContent .huaheng_iframe').each(function () {
|
|
349
350
351
352
353
354
355
356
357
358
359
360
361
|
if ($(this).data('id') == currentId) {
$(this).show().siblings('.huaheng_iframe').hide();
return false;
}
});
$(this).addClass('active').siblings('.menuTab').removeClass('active');
scrollToTab(this);
}
}
// 点击选项卡菜单
$('.menuTabs').on('click', '.menuTab', activeTab);
|
|
362
363
364
|
// 点击选项卡菜单
$('.menuTabs').on('click', '.menuTab', refreshTab);
|
|
365
366
|
//刷新iframe
function refreshTab() {
|
|
367
368
|
var currentId = $('.page-tabs-content').find('.active').attr('data-id');
var target = $('.huaheng_iframe[data-id="' + currentId + '"]');
|
|
369
370
371
|
var url = target.attr('src');
target.attr('src', url).ready();
}
|
|
372
|
|
|
373
374
|
// 全屏显示
$('#fullScreen').on('click', function () {
|
|
375
|
$('#wrapper').fullScreen();
|
|
376
|
});
|
|
377
|
|
|
378
379
380
381
382
383
384
385
386
387
|
// 刷新按钮
$('.tabReload').on('click', refreshTab);
$('.menuTabs').on('dblclick', '.menuTab', refreshTab);
// 左移按扭
$('.tabLeft').on('click', scrollTabLeft);
// 右移按扭
$('.tabRight').on('click', scrollTabRight);
|
|
388
|
|
|
389
390
391
392
393
394
|
// 关闭当前
$('.tabCloseCurrent').on('click', function () {
$('.page-tabs-content').find('.active i').trigger("click");
});
// 关闭全部
|
|
395
396
|
$('.tabCloseAll').on('click', function () {
$('.page-tabs-content').children("[data-id]").not(":first").each(function () {
|
|
397
398
399
|
$('.huaheng_iframe[data-id="' + $(this).data('id') + '"]').remove();
$(this).remove();
});
|
|
400
|
$('.page-tabs-content').children("[data-id]:first").each(function () {
|
|
401
402
403
404
405
406
|
$('.huaheng_iframe[data-id="' + $(this).data('id') + '"]').show();
$(this).addClass("active");
});
$('.page-tabs-content').css("margin-left", "0");
});
});
|