Skip to content

Commit 8630a34

Browse files
nobodyiamnobodyiam
committed
do lazy load if page contains too many namespaces(>10)
1 parent b3e5798 commit 8630a34

File tree

7 files changed

+66
-31
lines changed

7 files changed

+66
-31
lines changed

‎apollo-portal/src/main/resources/static/config.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -214,7 +214,8 @@ <h4 class="text-center" ng-show="viewMode == 2">
214214
pre-delete-item="preDeleteItem"
215215
show-text="showText"
216216
show-no-modify-permission-dialog="showNoModifyPermissionDialog"
217-
show-body="namespaces.length == 1"
217+
show-body="namespaces.length < 3"
218+
lazy-load="namespaces.length > 10"
218219
pre-create-branch="preCreateBranch"
219220
pre-delete-branch="preDeleteBranch">
220221
</apollonspanel>

‎apollo-portal/src/main/resources/static/scripts/controller/config/ConfigBaseInfoController.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ function ConfigBaseInfoController($rootScope, $scope, $window, $location, toastr
116116
$scope.findMissingNamespaces = function () {
117117
$scope.missingNamespaces = [];
118118
// only check missing private namespaces when app exists in current env
119-
if ($scope.missEnvs.indexOf($rootScope.pageContext.env) === -1) {
119+
if ($rootScope.pageContext.env && $scope.missEnvs.indexOf($rootScope.pageContext.env) === -1) {
120120
AppService.find_missing_namespaces($rootScope.pageContext.appId, $rootScope.pageContext.env,
121121
$rootScope.pageContext.clusterName).then(function (result) {
122122
$scope.missingNamespaces = AppUtil.collectData(result);

‎apollo-portal/src/main/resources/static/scripts/controller/config/ConfigNamespaceController.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -130,6 +130,7 @@ function controller($rootScope, $scope, toastr, AppUtil, EventManager, ConfigSer
130130
if (namespace.baseInfo.namespaceName == result.baseInfo.namespaceName) {
131131
$scope.namespaces[index] = result;
132132
$scope.namespaces[index].showNamespaceBody = true;
133+
$scope.namespaces[index].initialized = true;
133134
}
134135
});
135136

‎apollo-portal/src/main/resources/static/scripts/directive/namespace-panel-directive.js

Lines changed: 28 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
2222
preCreateBranch: '=',
2323
preDeleteBranch: '=',
2424
showMergeAndPublishGrayTips: '=',
25-
showBody: "=?"
25+
showBody: "=?",
26+
lazyLoad: "=?"
2627
},
2728
link: function (scope) {
2829

@@ -43,6 +44,7 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
4344

4445
var operate_branch_storage_key = 'OperateBranch';
4546

47+
scope.init = init;
4648
scope.switchView = switchView;
4749
scope.toggleItemSearchInput = toggleItemSearchInput;
4850
scope.searchItems = searchItems;
@@ -75,18 +77,34 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
7577
subscriberId, scope.namespace.baseInfo.namespaceName);
7678
});
7779

78-
init();
80+
preInit(scope.namespace);
7981

80-
function init() {
82+
if (!scope.lazyLoad || scope.namespace.initialized) {
83+
init(false);
84+
}
85+
86+
function preInit(namespace) {
87+
scope.showNamespaceBody = false;
88+
namespace.isLinkedNamespace =
89+
namespace.isPublic ? namespace.parentAppId != namespace.baseInfo.appId : false;
90+
//namespace view name hide suffix
91+
namespace.viewName = namespace.baseInfo.namespaceName.replace(".xml", "").replace(
92+
".properties", "").replace(".json", "").replace(".yml", "")
93+
.replace(".yaml", "");
94+
}
95+
96+
function init(forceShowBody) {
8197
initNamespace(scope.namespace);
8298
initOther();
99+
scope.namespace.initialized = true;
100+
if (forceShowBody) {
101+
scope.showNamespaceBody = true;
102+
}
83103
}
84104

85105
function initNamespace(namespace, viewType) {
86106
namespace.hasBranch = false;
87107
namespace.isBranch = false;
88-
namespace.isLinkedNamespace =
89-
namespace.isPublic ? namespace.parentAppId != namespace.baseInfo.appId : false;
90108
namespace.displayControl = {
91109
currentOperateBranch: 'master',
92110
showSearchInput: false,
@@ -309,12 +327,6 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
309327
}
310328

311329
function initNamespaceViewName(namespace) {
312-
//namespace view name hide suffix
313-
namespace.viewName =
314-
namespace.baseInfo.namespaceName.replace(".xml", "").replace(
315-
".properties", "").replace(".json", "").replace(".yml", "")
316-
.replace(".yaml", "");
317-
318330
if (!viewType) {
319331
if (namespace.isPropertiesFormat) {
320332
switchView(namespace, namespace_view_type.TABLE);
@@ -350,7 +362,7 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
350362

351363
localStorage.setItem(operate_branch_storage_key, JSON.stringify(operateBranchStorage));
352364

353-
switchBranch(operateBranchStorage[namespaceId]);
365+
switchBranch(operateBranchStorage[namespaceId], false);
354366

355367
}
356368

@@ -380,11 +392,14 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
380392
});
381393
}
382394

383-
function switchBranch(branchName) {
395+
function switchBranch(branchName, forceShowBody) {
384396
if (branchName != 'master') {
385397
initRules(scope.namespace.branch);
398+
}
399+
if (forceShowBody) {
386400
scope.showNamespaceBody = true;
387401
}
402+
388403
scope.namespace.displayControl.currentOperateBranch = branchName;
389404

390405
//save to local storage

‎apollo-portal/src/main/resources/static/views/component/namespace-panel-branch-tab.html

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,11 @@
11
<section class="branch-panel-body"
2-
ng-if="namespace.hasBranch && namespace.displayControl.currentOperateBranch != 'master'">
2+
ng-if="namespace.initialized &&
3+
(namespace.hasBranch && namespace.displayControl.currentOperateBranch != 'master')">
34
<!--main header-->
45
<header class="panel-heading">
56

67
<div class="row">
78
<div class="col-md-6 col-sm-6 header-namespace">
8-
<span class="cursor-pointer"
9-
data-toggle="collapse" data-target="#BODY{{namespace.branch.id}}" aria-expanded="false"
10-
ng-click="namespace.branch.displayControl.show = !namespace.branch.displayControl.show">
11-
</span>
129
<b class="namespace-name" ng-bind="namespace.viewName"></b>
1310
<span class="label label-warning no-radius namespace-label"
1411
ng-show="namespace.branch.itemModifiedCnt > 0">有修改

‎apollo-portal/src/main/resources/static/views/component/namespace-panel-header.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,32 +21,32 @@
2121
</div>
2222
<div class="col-md-6 text-right" style="padding-right:23px;">
2323
<span data-toggle="collapse" data-target="#BODY{{namespace.branch.id}}" aria-expanded="false">
24-
<span
25-
class="label no-radius cursor-pointer"
26-
data-toggle="collapse" data-target="#BODY{{namespace.id}}" aria-expanded="false"
27-
ng-click="showNamespaceBody = !showNamespaceBody">
28-
<a ><small>[展开/收缩]</small></a>
24+
<span class="label no-radius cursor-pointer"
25+
data-toggle="collapse" data-target="#BODY{{namespace.id}}" aria-expanded="false"
26+
ng-click="showNamespaceBody = !showNamespaceBody"
27+
ng-show="namespace.initialized">
28+
<a>[展开/收缩]</a>
2929
</span>
3030
</span>
3131
</div>
3232
</div>
3333
</header>
3434

3535
<!--branch nav-->
36-
<header class="panel-heading second-panel-heading" ng-show="namespace.hasBranch">
36+
<header class="panel-heading second-panel-heading" ng-show="namespace.initialized && namespace.hasBranch">
3737
<div class="row">
3838
<div class="col-md-8 pull-left">
3939
<ul class="nav nav-tabs">
4040
<li role="presentation">
4141
<a ng-class="{'node_active': namespace.displayControl.currentOperateBranch == 'master'}"
42-
ng-click="switchBranch('master')">
42+
ng-click="switchBranch('master', true)">
4343
<img src="img/branch.png">
4444
主版本
4545
</a>
4646
</li>
4747
<li role="presentation">
4848
<a ng-class="{'node_active': namespace.displayControl.currentOperateBranch != 'master'}"
49-
ng-click="switchBranch(namespace.branchName)">
49+
ng-click="switchBranch(namespace.branchName, true)">
5050
<img src="img/branch.png">
5151
灰度版本
5252
</a>

‎apollo-portal/src/main/resources/static/views/component/namespace-panel-master-tab.html

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,29 @@
1+
<!--master panel body when not initialized-->
2+
<section class="master-panel-body" ng-if="!namespace.initialized">
3+
<!--main header-->
4+
<header class="panel-heading">
5+
<div class="row">
6+
<div class="col-md-6 col-sm-6 header-namespace">
7+
<b class="namespace-name" ng-bind="namespace.viewName"></b>
8+
</div>
9+
10+
<div class="col-md-6 col-sm-6 text-right header-buttons">
11+
12+
<button type="button" class="btn btn-default btn-sm"
13+
data-tooltip="tooltip" data-placement="bottom" title="加载Namespace"
14+
ng-click="init(true)">
15+
<img src="img/more.png">
16+
加载Namespace
17+
</button>
18+
</div>
19+
</div>
20+
</header>
21+
22+
</section>
123
<!--master panel body-->
224
<section class="master-panel-body"
3-
ng-if="namespace.hasBranch
4-
&& namespace.displayControl.currentOperateBranch == 'master' ||
5-
!namespace.hasBranch">
25+
ng-if="namespace.initialized &&
26+
(namespace.hasBranch && namespace.displayControl.currentOperateBranch == 'master' || !namespace.hasBranch)">
627
<!--main header-->
728
<header class="panel-heading">
829
<div class="row">

0 commit comments

Comments
 (0)