Skip to content

A
apollo
Commit 770d2dae by Jason Song Committed by GitHub
Options

Merge pull request #507 from lepdou/0113

format json & config.html adapt small screen
parents 3ddf3e6b 8c54b3a7
Showing with 128 additions and 30 deletions
apollo-portal/src/main/resources/static/scripts/controller/config/ConfigBaseInfoController.js
......@@ -208,6 +208,7 @@ function ConfigBaseInfoController($rootScope, $scope, $location, toastr, EventMa
}));
EventManager.emit(EventManager.EventType.REFRESH_NAMESPACE);
$rootScope.showSideBar = false;
}
});
......@@ -298,5 +299,30 @@ function ConfigBaseInfoController($rootScope, $scope, $location, toastr, EventMa
};
}
var VIEW_MODE_SWITCH_WIDTH = 1156;
if (window.innerWidth <= VIEW_MODE_SWITCH_WIDTH) {
$rootScope.viewMode = 2;
$rootScope.showSideBar = false;
} else {
$rootScope.viewMode = 1;
}
$rootScope.adaptScreenSize = function () {
if (window.innerWidth <= VIEW_MODE_SWITCH_WIDTH) {
$rootScope.viewMode = 2;
} else {
$rootScope.viewMode = 1;
$rootScope.showSideBar = false;
}
};
$(window).resize(function(){
$scope.$apply(function(){
$rootScope.adaptScreenSize();
});
});
}
apollo-portal/src/main/resources/static/scripts/controller/config/ConfigNamespaceController.js
......@@ -313,6 +313,7 @@ function controller($rootScope, $scope, toastr, AppUtil, EventManager, ConfigSer
}
new Clipboard('.clipboard');
}
apollo-portal/src/main/resources/static/scripts/directive/directive.js
......@@ -8,6 +8,7 @@ directive_module.directive('apollonav',
replace: true,
link: function (scope, element, attrs) {
scope.sourceApps = [];
scope.copyedApps = [];
......
apollo-portal/src/main/resources/static/scripts/directive/namespace-panel-directive.js
......@@ -416,6 +416,8 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
namespace.baseInfo.clusterName,
namespace.baseInfo.namespaceName)
.then(function (result) {
namespace.isLatestReleaseLoaded = true;
if (!result) {
namespace.latestReleaseInstances = {};
namespace.latestReleaseInstances.total = 0;
......@@ -430,8 +432,6 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
namespace.latestReleaseInstances = result;
namespace.latestReleaseInstancesPage++;
})
namespace.isLatestReleaseLoaded = true;
});
} else {
InstanceService.findInstancesByRelease(scope.env,
......
apollo-portal/src/main/resources/static/scripts/directive/show-text-modal-directive.js
......@@ -10,7 +10,23 @@ function showTextModalDirective() {
text: '='
},
link: function (scope) {
scope.$watch('text', init);
function init() {
scope.jsonObject = undefined;
if (isJsonText(scope.text)) {
scope.jsonObject = JSON.parse(scope.text);
}
}
function isJsonText(text) {
try {
JSON.parse(text);
} catch (e) {
return false;
}
return true;
}
}
}
}
......
apollo-portal/src/main/resources/static/styles/common-style.css
......@@ -207,6 +207,38 @@ table th {
margin-top: 20px;
}
.side-bar {
position: absolute;
width: 195px;
top: 85px;
left: 15px;
margin-bottom: 25px;
background: #f1f2f7;
z-index: 2;
}
.position-absolute {
position: absolute;
}
.position-fix {
position: fixed;
}
.view-mode-1 {
margin-left: 235px;
padding-right: 15px;
}
.view-mode-2 {
padding: 0 15px;
}
.side-bar-switch {
padding: 10px 10px;
margin-right: 30px;
}
.node-treeview {
color: #797979;
}
......@@ -241,7 +273,6 @@ table th {
}
.panel-heading .header-buttons {
/*float: right;*/
min-width: 405px;
}
......@@ -744,3 +775,4 @@ table th {
.search-focus {
background: #fff;
}
apollo-portal/src/main/resources/static/views/common/nav.html
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<img class="navbar-brand side-bar-switch cursor-pointer" src="../../img/show_sidebar.png"
onMouseOver="this.style.background='#f1f2f7'"
onMouseOut="this.style.background='#fff'"
data-tooltip="tooltip" data-placement="bottom" title="显示导航栏"
ng-show="viewMode == 2 && !showSideBar"
ng-click="showSideBar = !showSideBar">
<img class="navbar-brand side-bar-switch cursor-pointer" src="../../img/hide_sidebar.png"
onMouseOver="this.style.background='#f1f2f7'"
onMouseOut="this.style.background='#fff'"
data-tooltip="tooltip" data-placement="bottom" title="隐藏导航栏"
ng-show="viewMode == 2 && showSideBar"
ng-click="showSideBar = !showSideBar">
<a class="navbar-brand logo" href="/">
<b>Apollo 配置中心</b>
</a>
......@@ -11,14 +22,15 @@
<ul class="nav navbar-nav navbar-right">
<li>
<a href="http://conf.ctripcorp.com/display/FRAM/Apollo" target="_blank">
<span class="glyphicon glyphicon-question-sign"></span>帮助
</a>
<span class="glyphicon glyphicon-question-sign"></span>帮助
</a>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false"><span class="glyphicon glyphicon-user"></span>{{userName}} <span class="caret"></span></a>
aria-expanded="false"><span class="glyphicon glyphicon-user"></span>{{userName}} <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="/user/logout">退出</a></li>
</ul>
......@@ -27,7 +39,8 @@
<div class="navbar-form navbar-right form-inline" role="search">
<div class="form-group">
<input type="text" class="form-control search-input" placeholder="搜索项目(项目ID、项目名)" style="width: 350px"
<input type="text" class="form-control search-input" placeholder="搜索项目(项目ID、项目名)"
style="width: 350px"
ng-model="searchKey" ng-change="changeSearchKey()" ng-focus="changeSearchKey()">
<div class="row app-list" ng-show="shouldShowAppList">
......
apollo-portal/src/main/resources/static/views/component/namespace-panel-master-tab.html
......@@ -736,31 +736,37 @@
<!--instance view-->
<div class="panel panel-default instance-view" ng-show="namespace.viewType == 'instance'">
<div class="panel-heading">
<div class="row text-right" style="padding-right: 15px;">
<div class="row">
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'latest_release'}"
ng-click="switchInstanceViewType(namespace, 'latest_release')"> 使用最新配置的实例
<span class="badge" ng-bind="namespace.latestReleaseInstances.total"></span>
</button>
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'not_latest_release'}"
ng-click="switchInstanceViewType(namespace, 'not_latest_release')">使用非最新配置的实例
<div class="col-md-5">
<small>实例说明:只展示最近一天访问过Apollo的实例</small>
</div>
<div class="col-md-7 text-right">
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'latest_release'}"
ng-click="switchInstanceViewType(namespace, 'latest_release')"> 使用最新配置的实例
<span class="badge" ng-bind="namespace.latestReleaseInstances.total"></span>
</button>
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'not_latest_release'}"
ng-click="switchInstanceViewType(namespace, 'not_latest_release')">使用非最新配置的实例
<span class="badge"
ng-bind="namespace.instancesCount - namespace.latestReleaseInstances.total"></span>
</button>
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'all'}"
ng-click="switchInstanceViewType(namespace, 'all')">所有实例
<span class="badge" ng-bind="namespace.instancesCount"></span>
</button>
<button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'all'}"
ng-click="switchInstanceViewType(namespace, 'all')">所有实例
<span class="badge" ng-bind="namespace.instancesCount"></span>
</button>
</div>
<button class="btn btn-default btn-sm"
data-tooltip="tooltip" data-placement="bottom" title="刷新列表"
ng-click="refreshInstancesInfo(namespace)">
<img src="../../img/refresh.png"/>
</button>
</div>
<button class="btn btn-default btn-sm"
data-tooltip="tooltip" data-placement="bottom" title="刷新列表"
ng-click="refreshInstancesInfo(namespace)">
<img src="../../img/refresh.png"/>
</button>
</div>
</div>
......
apollo-portal/src/main/resources/static/views/component/show-text-modal.html
......@@ -7,8 +7,11 @@
<h4 class="modal-title">查看</h4>
</div>
<pre id="watchText" class="modal-body no-radius" style="margin-bottom: 0"
ng-bind="text">
<pre class="modal-body no-radius" style="margin-bottom: 0"
ng-show="!jsonObject" ng-bind="text">
</pre>
<pre class="modal-body no-radius" style="margin-bottom: 0"
ng-show="jsonObject" ng-bind="jsonObject | json:4">
</pre>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment