Skip to content

A
apollo
Commit 770d2dae authored by Jason Song's avatar Jason Song Committed by GitHub
Browse files
Options

Merge pull request #507 from lepdou/0113 

format json & config.html adapt small screen
parents 3ddf3e6b 8c54b3a7
Hide whitespace changes
Inline Side-by-side
Showing with 311 additions and 202 deletions
apollo-portal/src/main/resources/static/config.html
View file @ 770d2dae
...@@ -16,21 +16,22 @@ ...@@ -16,21 +16,22 @@
<apollonav></apollonav> <apollonav></apollonav>
<div id="config-info" class="container-fluid apollo-container app"> <div id="config-info" class="apollo-container app">
<!--具体配置信息--> <div ng-controller="ConfigBaseInfoController">
<div class="config-info-container row"> <div class="J_appNotFound hidden row text-center app-not-found" ng-show="notFoundApp">
<img src="img/404.png">
<br>
<p>
<span ng-bind="pageContext.appId"></span> 不存在，<a href="/app.html">点击创建</a>
</p>
</div>
<div ng-controller="ConfigBaseInfoController"> <div class="side-bar"
ng-class="{'position-absolute': viewMode == 1, 'position-fixed': viewMode == 2}">
<div class="J_appFound hidden"
ng-show="!notFoundApp && (viewMode == 1 || (viewMode == 2 && showSideBar))">
<div class="J_appNotFound hidden row text-center app-not-found" ng-show="notFoundApp"> <!--env list-->
<img src="img/404.png">
<br>
<p>
<span ng-bind="pageContext.appId"></span> 不存在，<a href="/app.html">点击创建</a>
</p>
</div>
<div class="J_appFound hidden col-md-2 col-xs-2 col-sm-2" ng-show="!notFoundApp">
<section class="panel"> <section class="panel">
<header class="panel-heading"> <header class="panel-heading">
<img src="img/env.png" class="i-20">&nbsp;环境列表 <img src="img/env.png" class="i-20">&nbsp;环境列表
...@@ -98,198 +99,208 @@ ...@@ -98,198 +99,208 @@
</div> </div>
</section> </section>
<a class="list-group-item" ng-show="missEnvs.length > 0" ng-click="createAppInMissEnv()"> <!--operation entrance-->
<div class="row icon-text icon-plus-orange"> <section>
<p class="btn-title ng-binding">补缺环境</p> <a class="list-group-item" ng-show="missEnvs.length > 0" ng-click="createAppInMissEnv()">
</div> <div class="row icon-text icon-plus-orange">
</a> <p class="btn-title ng-binding">补缺环境</p>
</div>
<apolloentrance apollo-title="'添加集群'" apollo-img-src="'plus-orange'" </a>
apollo-href="'cluster.html?#/appid=' + pageContext.appId"
ng-show="hasCreateClusterPermission"></apolloentrance>
<span class="list-group-item cursor-pointer hover" ng-click="showMasterPermissionTips()"
ng-show="!hasCreateClusterPermission">
<div class="row icon-text icon-plus-orange">
<p class="btn-title">添加集群</p>
</div>
</span>
<apolloentrance apollo-title="'添加Namespace'" apollo-img-src="'plus-orange'"
apollo-href="'namespace.html?#/appid=' + pageContext.appId"
ng-show="hasCreateNamespacePermission"></apolloentrance>
<span class="list-group-item cursor-pointer hover" ng-click="showMasterPermissionTips()"
ng-show="!hasCreateNamespacePermission">
<div class="row icon-text icon-plus-orange">
<p class="btn-title">添加Namespace</p>
</div>
</span>
<apolloentrance apollo-title="'项目权限'" apollo-img-src="'user-manage'"
apollo-href="'/app/role.html?#/appid=' + pageContext.appId"
ng-show="hasAssignUserPermission"></apolloentrance>
</section>
</div> <apolloentrance apollo-title="'添加集群'" apollo-img-src="'plus-orange'"
</div> apollo-href="'cluster.html?#/appid=' + pageContext.appId"
ng-show="hasCreateClusterPermission"></apolloentrance>
<div class="list-group-item cursor-pointer hover" ng-click="showMasterPermissionTips()"
ng-show="!hasCreateClusterPermission">
<div class="row icon-text icon-plus-orange">
<p class="btn-title">添加集群</p>
</div>
</div>
<!--namespaces--> <apolloentrance apollo-title="'添加Namespace'" apollo-img-src="'plus-orange'"
<div class="col-md-10 col-xs-10 col-sm-10 config-item-container hide" apollo-href="'namespace.html?#/appid=' + pageContext.appId"
ng-controller="ConfigNamespaceController"> ng-show="hasCreateNamespacePermission"></apolloentrance>
<div class="alert alert-info alert-dismissible" role="alert"
ng-show="(!hideTip || !hideTip[pageContext.appId][pageContext.clusterName]) && envMapClusters[pageContext.env]">
<button class="btn btn-sm btn-default pull-right" style="margin-top: -7px;margin-right:-15px;" <div class="list-group-item cursor-pointer hover" ng-click="showMasterPermissionTips()"
ng-click="closeTip(pageContext.clusterName)">不再提示 ng-show="!hasCreateNamespacePermission">
</button> <div class="row icon-text icon-plus-orange">
<p class="btn-title">添加Namespace</p>
</div>
</div>
<!--default cluster tip --> <apolloentrance apollo-title="'项目权限'" apollo-img-src="'user-manage'"
<div ng-show="pageContext.clusterName == 'default'"> apollo-href="'/app/role.html?#/appid=' + pageContext.appId"
<strong>注意: </strong>所有不属于 ng-show="hasAssignUserPermission"></apolloentrance>
<span ng-bind="envMapClusters[pageContext.env]"></span> </section>
集群的实例会使用default集群（当前页面）的配置，属于
<span ng-bind="envMapClusters[pageContext.env]"></span>
的实例会使用对应集群的配置！
</div>
<!--custom cluster tip--> </div>
<div ng-show="pageContext.clusterName != 'default'"> </div>
<strong>注意:</strong>属于 </div>
<span ng-bind="pageContext.clusterName"></span>
集群的实例只会使用
<span ng-bind="pageContext.clusterName"></span>
集群（当前页面）的配置，只有当对应namespace在当前集群没有发布过配置时，才会使用default集群的配置！
</div>
<!--具体配置信息-->
<!--namespaces-->
<div class="config-item-container hide"
ng-class="{'view-mode-1': viewMode == 1, 'view-mode-2': viewMode == 2}"
ng-controller="ConfigNamespaceController">
<h4 class="text-center" ng-show="viewMode == 2">
当前操作环境:{{pageContext.env}}， 集群:{{pageContext.clusterName}}
</h4>
<div class="alert alert-info alert-dismissible" role="alert"
ng-show="(!hideTip || !hideTip[pageContext.appId][pageContext.clusterName]) && envMapClusters[pageContext.env]">
<button class="btn btn-sm btn-default pull-right" style="margin-top: -7px;margin-right:-15px;"
ng-click="closeTip(pageContext.clusterName)">不再提示
</button>
<!--default cluster tip -->
<div ng-show="pageContext.clusterName == 'default'">
<strong>注意: </strong>所有不属于
<span ng-bind="envMapClusters[pageContext.env]"></span>
集群的实例会使用default集群（当前页面）的配置，属于
<span ng-bind="envMapClusters[pageContext.env]"></span>
的实例会使用对应集群的配置！
</div> </div>
<div class="alert alert-info" <!--custom cluster tip-->
ng-if="hasNotPublishNamespace"> <div ng-show="pageContext.clusterName != 'default'">
<p><b>注意:</b>以下环境/集群有未发布的配置，客户端获取不到未发布的配置，请及时发布。</p> <strong>注意:</strong>属于
<p><mark ng-bind="namespacePublishInfo.join('，')"></mark></p> <span ng-bind="pageContext.clusterName"></span>
集群的实例只会使用
<span ng-bind="pageContext.clusterName"></span>
集群（当前页面）的配置，只有当对应namespace在当前集群没有发布过配置时，才会使用default集群的配置！
</div> </div>
<apollonspanel ng-repeat="namespace in namespaces" </div>
namespace="namespace"
app-id="pageContext.appId" <div class="alert alert-info"
env="pageContext.env" ng-if="hasNotPublishNamespace">
lock-check="lockCheck" <p><b>注意:</b>以下环境/集群有未发布的配置，客户端获取不到未发布的配置，请及时发布。</p>
cluster="pageContext.clusterName" <p>
user="currentUser" <mark ng-bind="namespacePublishInfo.join('，')"></mark>
pre-release-ns="prepareReleaseNamespace" </p>
create-item="createItem" edit-item="editItem" </div>
pre-delete-item="preDeleteItem"
show-text="showText" <apollonspanel ng-repeat="namespace in namespaces"
show-no-modify-permission-dialog="showNoModifyPermissionDialog" namespace="namespace"
pre-create-branch="preCreateBranch"
pre-delete-branch="preDeleteBranch">
</apollonspanel>
<releasemodal app-id="pageContext.appId"
env="pageContext.env"
cluster="pageContext.clusterName">
</releasemodal>
<itemmodal to-operation-namespace="toOperationNamespace"
app-id="pageContext.appId" app-id="pageContext.appId"
env="pageContext.env" env="pageContext.env"
lock-check="lockCheck"
cluster="pageContext.clusterName" cluster="pageContext.clusterName"
item="item"> user="currentUser"
</itemmodal> pre-release-ns="prepareReleaseNamespace"
create-item="createItem" edit-item="editItem"
<showtextmodal text="text"></showtextmodal> pre-delete-item="preDeleteItem"
show-text="showText"
<rollbackmodal app-id="pageContext.appId" show-no-modify-permission-dialog="showNoModifyPermissionDialog"
env="pageContext.env" pre-create-branch="preCreateBranch"
cluster="pageContext.clusterName"> pre-delete-branch="preDeleteBranch">
</rollbackmodal> </apollonspanel>
<releasemodal app-id="pageContext.appId"
env="pageContext.env"
cluster="pageContext.clusterName">
</releasemodal>
<itemmodal to-operation-namespace="toOperationNamespace"
app-id="pageContext.appId"
env="pageContext.env"
cluster="pageContext.clusterName"
item="item">
</itemmodal>
<showtextmodal text="text"></showtextmodal>
<rollbackmodal app-id="pageContext.appId"
env="pageContext.env"
cluster="pageContext.clusterName">
</rollbackmodal>
<rulesmodal app-id="pageContext.appId" <rulesmodal app-id="pageContext.appId"
env="pageContext.env" env="pageContext.env"
cluster="pageContext.clusterName"> cluster="pageContext.clusterName">
</rulesmodal> </rulesmodal>
<mergeandpublishmodal app-id="pageContext.appId" <mergeandpublishmodal app-id="pageContext.appId"
env="pageContext.env" env="pageContext.env"
cluster="pageContext.clusterName"> cluster="pageContext.clusterName">
</mergeandpublishmodal> </mergeandpublishmodal>
<apolloconfirmdialog apollo-dialog-id="'deleteConfirmDialog'" apollo-title="'删除配置'" <apolloconfirmdialog apollo-dialog-id="'deleteConfirmDialog'" apollo-title="'删除配置'"
apollo-detail="'确定要删除配置吗?'" apollo-detail="'确定要删除配置吗?'"
apollo-show-cancel-btn="true" apollo-confirm="deleteItem"></apolloconfirmdialog> apollo-show-cancel-btn="true" apollo-confirm="deleteItem"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'releaseNoPermissionDialog'" apollo-title="'发布'" <apolloconfirmdialog apollo-dialog-id="'releaseNoPermissionDialog'" apollo-title="'发布'"
apollo-detail="'您没有发布权限哦~ 请找项目管理员 ' + masterUsers + ' 分配发布权限'" apollo-detail="'您没有发布权限哦~ 请找项目管理员 ' + masterUsers + ' 分配发布权限'"
apollo-show-cancel-btn="false"></apolloconfirmdialog> apollo-show-cancel-btn="false"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'modifyNoPermissionDialog'" apollo-title="'申请配置权限'" <apolloconfirmdialog apollo-dialog-id="'modifyNoPermissionDialog'" apollo-title="'申请配置权限'"
apollo-detail="'请找项目管理员 ' + masterUsers + ' 分配编辑或发布权限'" apollo-detail="'请找项目管理员 ' + masterUsers + ' 分配编辑或发布权限'"
apollo-show-cancel-btn="false"></apolloconfirmdialog> apollo-show-cancel-btn="false"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'masterNoPermissionDialog'" apollo-title="'申请配置权限'" <apolloconfirmdialog apollo-dialog-id="'masterNoPermissionDialog'" apollo-title="'申请配置权限'"
apollo-detail="'您不是项目管理员， 只有项目管理员才有添加集群、namespace的权限。 apollo-detail="'您不是项目管理员， 只有项目管理员才有添加集群、namespace的权限。
如需管理员权限，请找项目管理员 ' + masterUsers + ' 分配管理员权限'" 如需管理员权限，请找项目管理员 ' + masterUsers + ' 分配管理员权限'"
apollo-show-cancel-btn="false"></apolloconfirmdialog> apollo-show-cancel-btn="false"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'namespaceLockedDialog'" apollo-title="'编辑受限'" <apolloconfirmdialog apollo-dialog-id="'namespaceLockedDialog'" apollo-title="'编辑受限'"
apollo-detail="'当前namespace正在被 ' + lockOwner + ' 编辑，一次发布只能被一个人修改.'" apollo-detail="'当前namespace正在被 ' + lockOwner + ' 编辑，一次发布只能被一个人修改.'"
apollo-show-cancel-btn="false"></apolloconfirmdialog> apollo-show-cancel-btn="false"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'releaseDenyDialog'" apollo-title="'发布受限'" <apolloconfirmdialog apollo-dialog-id="'releaseDenyDialog'" apollo-title="'发布受限'"
apollo-detail="'您不能发布哟~ ' + pageContext.env + '环境配置的编辑和发布必须为不同的人，请找另一个具有当前namespace发布权的人操作发布~'" apollo-detail="'您不能发布哟~ ' + pageContext.env + '环境配置的编辑和发布必须为不同的人，请找另一个具有当前namespace发布权的人操作发布~'"
apollo-show-cancel-btn="false"></apolloconfirmdialog> apollo-show-cancel-btn="false"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'rollbackAlertDialog'" apollo-title="'回滚'" <apolloconfirmdialog apollo-dialog-id="'rollbackAlertDialog'" apollo-title="'回滚'"
apollo-detail="'确定要回滚吗?'" apollo-detail="'确定要回滚吗?'"
apollo-show-cancel-btn="true" apollo-confirm="rollback"></apolloconfirmdialog> apollo-show-cancel-btn="true" apollo-confirm="rollback"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'deleteBranchDialog'" apollo-title="'删除灰度'" <apolloconfirmdialog apollo-dialog-id="'deleteBranchDialog'" apollo-title="'删除灰度'"
apollo-detail="'删除灰度会丢失灰度的配置，确定要删除吗?'" apollo-detail="'删除灰度会丢失灰度的配置，确定要删除吗?'"
apollo-show-cancel-btn="true" apollo-confirm="deleteBranch"></apolloconfirmdialog> apollo-show-cancel-btn="true" apollo-confirm="deleteBranch"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'updateRuleTips'" apollo-title="'更新灰度规则提示'" <apolloconfirmdialog apollo-dialog-id="'updateRuleTips'" apollo-title="'更新灰度规则提示'"
apollo-detail="'灰度规则已生效，但发现灰度版本有未发布的配置，这些配置需要手动灰度发布才会生效'"></apolloconfirmdialog> apollo-detail="'灰度规则已生效，但发现灰度版本有未发布的配置，这些配置需要手动灰度发布才会生效'"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'mergeAndReleaseDenyDialog'" apollo-title="'全量发布'" <apolloconfirmdialog apollo-dialog-id="'mergeAndReleaseDenyDialog'" apollo-title="'全量发布'"
apollo-detail="'namespace主版本有未发布的配置，请先发布主版本配置'"></apolloconfirmdialog> apollo-detail="'namespace主版本有未发布的配置，请先发布主版本配置'"></apolloconfirmdialog>
<apolloconfirmdialog apollo-dialog-id="'grayReleaseWithoutRulesTips'" apollo-title="'缺失灰度规则提示'" <apolloconfirmdialog apollo-dialog-id="'grayReleaseWithoutRulesTips'" apollo-title="'缺失灰度规则提示'"
apollo-detail="'灰度版本还没有配置任何灰度规则，请配置灰度规则'"> apollo-detail="'灰度版本还没有配置任何灰度规则，请配置灰度规则'">
</apolloconfirmdialog> </apolloconfirmdialog>
<div class="modal fade" id="createBranchTips" tabindex="-1" role="dialog"> <div class="modal fade" id="createBranchTips" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header panel-primary"> <div class="modal-header panel-primary">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span></button> aria-hidden="true">&times;</span></button>
<h4 class="modal-title">创建灰度须知</h4> <h4 class="modal-title">创建灰度须知</h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
通过创建灰度版本，您可以对某些配置做灰度测试<br> 通过创建灰度版本，您可以对某些配置做灰度测试<br>
灰度流程为:<br> 灰度流程为:<br>
&nbsp;&nbsp;1.创建灰度版本 <br> &nbsp;&nbsp;1.创建灰度版本 <br>
&nbsp;&nbsp;2.配置灰度配置项<br> &nbsp;&nbsp;2.配置灰度配置项<br>
&nbsp;&nbsp;3.配置灰度规则.如果是私有的namespace可以按照客户端的IP进行灰度，如果是公共的namespace则可以同时按AppId和客户端的IP进行灰度<br> &nbsp;&nbsp;3.配置灰度规则.如果是私有的namespace可以按照客户端的IP进行灰度，如果是公共的namespace则可以同时按AppId和客户端的IP进行灰度<br>
&nbsp;&nbsp;4.灰度发布<br> &nbsp;&nbsp;4.灰度发布<br>
灰度版本最终有两种结果:<b>全量发布和放弃灰度</b><br> 灰度版本最终有两种结果:<b>全量发布和放弃灰度</b><br>
<b>全量发布</b>:灰度的配置合到主版本并发布，所有的客户端都会使用合并后的配置<br> <b>全量发布</b>:灰度的配置合到主版本并发布，所有的客户端都会使用合并后的配置<br>
<b>放弃灰度</b>:删除灰度版本，所有的客户端都会使用回主版本的配置<br> <b>放弃灰度</b>:删除灰度版本，所有的客户端都会使用回主版本的配置<br>
注意事项:<br> 注意事项:<br>
&nbsp;&nbsp;1.如果灰度版本已经有灰度发布过，那么修改灰度规则后，无需再次灰度发布就立即生效<br> &nbsp;&nbsp;1.如果灰度版本已经有灰度发布过，那么修改灰度规则后，无需再次灰度发布就立即生效<br>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button> <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" <button type="button" class="btn btn-primary" data-dismiss="modal"
ng-click="createBranch()"> ng-click="createBranch()">
确定 确定
</button> </button>
</div>
</div> </div>
</div> </div>
</div> </div>
......
apollo-portal/src/main/resources/static/scripts/controller/config/ConfigBaseInfoController.js
View file @ 770d2dae
...@@ -208,6 +208,7 @@ function ConfigBaseInfoController($rootScope, $scope, $location, toastr, EventMa ...@@ -208,6 +208,7 @@ function ConfigBaseInfoController($rootScope, $scope, $location, toastr, EventMa
})); }));
EventManager.emit(EventManager.EventType.REFRESH_NAMESPACE); EventManager.emit(EventManager.EventType.REFRESH_NAMESPACE);
$rootScope.showSideBar = false;
} }
}); });
...@@ -298,5 +299,30 @@ function ConfigBaseInfoController($rootScope, $scope, $location, toastr, EventMa ...@@ -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
View file @ 770d2dae
...@@ -313,6 +313,7 @@ function controller($rootScope, $scope, toastr, AppUtil, EventManager, ConfigSer ...@@ -313,6 +313,7 @@ function controller($rootScope, $scope, toastr, AppUtil, EventManager, ConfigSer
} }
new Clipboard('.clipboard'); new Clipboard('.clipboard');
} }
apollo-portal/src/main/resources/static/scripts/directive/directive.js
View file @ 770d2dae
...@@ -8,6 +8,7 @@ directive_module.directive('apollonav', ...@@ -8,6 +8,7 @@ directive_module.directive('apollonav',
replace: true, replace: true,
link: function (scope, element, attrs) { link: function (scope, element, attrs) {
scope.sourceApps = []; scope.sourceApps = [];
scope.copyedApps = []; scope.copyedApps = [];
......
apollo-portal/src/main/resources/static/scripts/directive/namespace-panel-directive.js
View file @ 770d2dae
...@@ -416,6 +416,8 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na ...@@ -416,6 +416,8 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
namespace.baseInfo.clusterName, namespace.baseInfo.clusterName,
namespace.baseInfo.namespaceName) namespace.baseInfo.namespaceName)
.then(function (result) { .then(function (result) {
namespace.isLatestReleaseLoaded = true;
if (!result) { if (!result) {
namespace.latestReleaseInstances = {}; namespace.latestReleaseInstances = {};
namespace.latestReleaseInstances.total = 0; namespace.latestReleaseInstances.total = 0;
...@@ -430,8 +432,6 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na ...@@ -430,8 +432,6 @@ function directive($window, toastr, AppUtil, EventManager, PermissionService, Na
namespace.latestReleaseInstances = result; namespace.latestReleaseInstances = result;
namespace.latestReleaseInstancesPage++; namespace.latestReleaseInstancesPage++;
}) })
namespace.isLatestReleaseLoaded = true;
}); });
} else { } else {
InstanceService.findInstancesByRelease(scope.env, InstanceService.findInstancesByRelease(scope.env,
......
apollo-portal/src/main/resources/static/scripts/directive/show-text-modal-directive.js
View file @ 770d2dae
...@@ -10,7 +10,23 @@ function showTextModalDirective() { ...@@ -10,7 +10,23 @@ function showTextModalDirective() {
text: '=' text: '='
}, },
link: function (scope) { 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
View file @ 770d2dae
...@@ -207,6 +207,38 @@ table th { ...@@ -207,6 +207,38 @@ table th {
margin-top: 20px; 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 { .node-treeview {
color: #797979; color: #797979;
} }
...@@ -241,7 +273,6 @@ table th { ...@@ -241,7 +273,6 @@ table th {
} }
.panel-heading .header-buttons { .panel-heading .header-buttons {
/*float: right;*/
min-width: 405px; min-width: 405px;
} }
...@@ -744,3 +775,4 @@ table th { ...@@ -744,3 +775,4 @@ table th {
.search-focus { .search-focus {
background: #fff; background: #fff;
} }
apollo-portal/src/main/resources/static/views/common/nav.html
View file @ 770d2dae
<nav class="navbar navbar-default"> <nav class="navbar navbar-default">
<div class="container-fluid"> <div class="container-fluid">
<div class="navbar-header"> <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="/"> <a class="navbar-brand logo" href="/">
<b>Apollo 配置中心</b> <b>Apollo 配置中心</b>
</a> </a>
...@@ -11,14 +22,15 @@ ...@@ -11,14 +22,15 @@
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
<li> <li>
<a href="http://conf.ctripcorp.com/display/FRAM/Apollo" target="_blank"> <a href="http://conf.ctripcorp.com/display/FRAM/Apollo" target="_blank">
<span class="glyphicon glyphicon-question-sign"></span>帮助 <span class="glyphicon glyphicon-question-sign"></span>帮助
</a> </a>
</li> </li>
<li class="dropdown"> <li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" <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"> <ul class="dropdown-menu">
<li><a href="/user/logout">退出</a></li> <li><a href="/user/logout">退出</a></li>
</ul> </ul>
...@@ -27,7 +39,8 @@ ...@@ -27,7 +39,8 @@
<div class="navbar-form navbar-right form-inline" role="search"> <div class="navbar-form navbar-right form-inline" role="search">
<div class="form-group"> <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()"> ng-model="searchKey" ng-change="changeSearchKey()" ng-focus="changeSearchKey()">
<div class="row app-list" ng-show="shouldShowAppList"> <div class="row app-list" ng-show="shouldShowAppList">
......
apollo-portal/src/main/resources/static/views/component/namespace-panel-master-tab.html
View file @ 770d2dae
...@@ -736,31 +736,37 @@ ...@@ -736,31 +736,37 @@
<!--instance view--> <!--instance view-->
<div class="panel panel-default instance-view" ng-show="namespace.viewType == 'instance'"> <div class="panel panel-default instance-view" ng-show="namespace.viewType == 'instance'">
<div class="panel-heading"> <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"> <div class="col-md-5">
<button type="button" class="btn btn-default" <small>实例说明:只展示最近一天访问过Apollo的实例</small>
ng-class="{'btn-primary':namespace.instanceViewType == 'latest_release'}" </div>
ng-click="switchInstanceViewType(namespace, 'latest_release')"> 使用最新配置的实例 <div class="col-md-7 text-right">
<span class="badge" ng-bind="namespace.latestReleaseInstances.total"></span> <div class="btn-group btn-group-sm" role="group">
</button> <button type="button" class="btn btn-default"
<button type="button" class="btn btn-default" ng-class="{'btn-primary':namespace.instanceViewType == 'latest_release'}"
ng-class="{'btn-primary':namespace.instanceViewType == 'not_latest_release'}" ng-click="switchInstanceViewType(namespace, 'latest_release')"> 使用最新配置的实例
ng-click="switchInstanceViewType(namespace, 'not_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" <span class="badge"
ng-bind="namespace.instancesCount - namespace.latestReleaseInstances.total"></span> ng-bind="namespace.instancesCount - namespace.latestReleaseInstances.total"></span>
</button> </button>
<button type="button" class="btn btn-default" <button type="button" class="btn btn-default"
ng-class="{'btn-primary':namespace.instanceViewType == 'all'}" ng-class="{'btn-primary':namespace.instanceViewType == 'all'}"
ng-click="switchInstanceViewType(namespace, 'all')">所有实例 ng-click="switchInstanceViewType(namespace, 'all')">所有实例
<span class="badge" ng-bind="namespace.instancesCount"></span> <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> </button>
</div> </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>
</div> </div>
......
apollo-portal/src/main/resources/static/views/component/show-text-modal.html
View file @ 770d2dae
...@@ -7,8 +7,11 @@ ...@@ -7,8 +7,11 @@
<h4 class="modal-title">查看</h4> <h4 class="modal-title">查看</h4>
</div> </div>
<pre id="watchText" class="modal-body no-radius" style="margin-bottom: 0" <pre class="modal-body no-radius" style="margin-bottom: 0"
ng-bind="text"> 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> </pre>
</div> </div>
</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