continuous update for repository page

This commit is contained in:
kunw 2016-04-20 01:20:07 +08:00
parent 77d8145be7
commit 6ae156f902
10 changed files with 77 additions and 42 deletions

View File

@ -0,0 +1,34 @@
(function() {
'use strict';
angular
.module('harbor.details')
.constant('mockupProjects', mockupProjects)
.controller('DetailsController', DetailsController);
function mockupProjects() {
var data = [
{ "id": 1, "name" : "myrepo"},
{ "id": 2, "name" : "myproject"},
{ "id": 3, "name" : "harbor_project"},
{ "id": 4, "name" : "legacy"}
];
return data;
}
DetailsController.$inject = ['mockupProjects', '$scope'];
function DetailsController(mockupProjects, $scope) {
var vm = this;
vm.isOpen = false;
vm.projects = mockupProjects();
vm.selectedProject = vm.projects[0];
vm.closeRetrievePane = closeRetrievePane;
function closeRetrievePane() {
$scope.$broadcast('isOpen', false);
}
}
})();

View File

@ -1,4 +1,4 @@
<div class="switch-pane-drop-down" ng-show="vm.visible">
<div class="switch-pane-drop-down" ng-show="vm.isOpen">
<div class="row">
<div class="col-xs-12 col-md-12">
<div class="panel panel-default">

View File

@ -4,32 +4,20 @@
angular
.module('harbor.details')
.constant('mockupProjects', mockupProjects)
.directive('retrieveProjects', retrieveProjects);
function mockupProjects() {
var data = [
{ "id": 1, "name" : "myrepo"},
{ "id": 2, "name" : "myproject"},
{ "id": 3, "name" : "harbor_project"},
{ "id": 4, "name" : "legacy"}
];
return data;
}
RetrieveProjectsController.$inject = ['mockupProjects'];
function RetrieveProjectsController(mockupProjects) {
function RetrieveProjectsController() {
var vm = this;
vm.projects = mockupProjects();
vm.selectItem = selectItem;
vm.filterProjects = filterProjects;
function selectItem(item) {
vm.selectedId = item.id;
vm.selectedProject = item;
}
var totalProjects = mockupProjects();
var totalProjects = vm.projects;
function filterProjects(input) {
@ -56,7 +44,9 @@
restrict: 'E',
templateUrl: '/static/ng/resources/js/components/details/retrieve-projects.directive.html',
scope: {
'visible': '='
'projects': '=',
'isOpen': '=',
'selectedProject': '='
},
replace: true,
controller: RetrieveProjectsController,

View File

@ -1,4 +1,4 @@
<div class="switch-pane-projects" ng-switch="vm.open">
<div class="switch-pane-projects" ng-switch="vm.isOpen">
<a href="javascript:void(0);" ng-click="vm.switchPane()">//vm.projectName//</a>
<span ng-switch-default class="glyphicon glyphicon-triangle-right" style="font-size: 12px;"></span>
<span ng-switch-when="true" class="glyphicon glyphicon-triangle-bottom" style="font-size: 12px;"></span>

View File

@ -6,19 +6,26 @@
.module('harbor.details')
.directive('switchPaneProjects', switchPaneProjects);
function SwitchPaneProjectsController() {
SwitchPaneProjectsController.$inject = ['$scope'];
function SwitchPaneProjectsController($scope) {
var vm = this;
vm.projectName = "myrepo1";
vm.open = false;
$scope.$on('isOpen', function(e, d){
vm.isOpen = d;
console.log('vm.isOpen:' + vm.isOpen);
});
$scope.$watch('vm.selectedProject', function(current, origin) {
vm.projectName = current.name;
});
vm.switchPane = switchPane;
function switchPane() {
if(vm.open) {
vm.open = false;
if(vm.isOpen) {
vm.isOpen = false;
}else{
vm.open = true;
vm.isOpen = true;
}
console.log(vm.open);
}
}
@ -28,8 +35,8 @@
templateUrl: '/static/ng/resources/js/components/details/switch-pane-projects.directive.html',
replace: true,
scope: {
'projectName': '@',
'open': '='
'selectedProject': '=',
'isOpen': '='
},
controller: SwitchPaneProjectsController,
controllerAs: 'vm',

View File

@ -1,4 +1,4 @@
<div class="tab-pane active" id="repositories">
<div class="tab-pane active" id="repositories" >
<div class="col-xs-12 col-md-12 each-tab-pane">
<div class="form-inline">
<div class="input-group">

View File

@ -8,7 +8,7 @@
ListRepositoryController.$inject = ['ListRepositoryService'];
function ListRepositoryController(ListRepositoryService) {
}
function listRepository() {
@ -17,7 +17,7 @@
templateUrl: '/static/ng/resources/js/components/repository/list-repository.directive.html',
replace: true,
scope: {
info: '='
'info': '='
},
controller: ListRepositoryController,
controllerAs: 'vm',

View File

@ -18,7 +18,7 @@
}
function clickTab() {
vm.visible = false;
vm.isOpen = false;
vm.url = $location.url();
}
@ -30,7 +30,7 @@
templateUrl: '/static/ng/resources/js/layout/navigation/navigation-details.directive.html',
link: link,
scope: {
visible: "="
'isOpen': "="
},
replace: true,
controller: NavigationDetailsController,

View File

@ -1,18 +1,18 @@
<div class="container-fluid container-fluid-custom">
<div class="container-fluid container-fluid-custom" ng-controller="DetailsController as vm">
<div class="container container-custom">
<div class="row extend-height">
<div class="col-xs-12 col-md-12 extend-height">
<div class="section">
<h4 class="page-header">My Projects<span class="gutter">|</span><a href="#" class="title-color">Public Projects</a></h4>
<div class="switch-pane">
<switch-pane-projects open="vm.open" project-name="myproject"></switch-pane-projects>
<span>
<navigation-details visible="vm.open"></navigation-details>
<switch-pane-projects is-open="vm.open" selected-project="vm.selectedProject"></switch-pane-projects>
<span>
<navigation-details is-open="vm.open"></navigation-details>
</span>
</div>
<retrieve-projects visible="vm.open"></retrieve-projects>
<retrieve-projects is-open="vm.open" projects="vm.projects" selected-project="vm.selectedProject"></retrieve-projects>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-content" ng-click="vm.closeRetrievePane()">
<ng-view></ng-view>
</div>
</div>

View File

@ -6,13 +6,16 @@
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">-->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">-->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!--<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>-->
<script src="https://cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/static/ng/resources/css/header.css">
<link rel="stylesheet" href="/static/ng/resources/css/footer.css">
@ -59,6 +62,7 @@
<script src="/static/ng/resources/js/components/details/details.module.js"></script>
<script src="/static/ng/resources/js/components/details/details.config.js"></script>
<script src="/static/ng/resources/js/components/details/details.controller.js"></script>
<script src="/static/ng/resources/js/components/details/switch-pane-projects.directive.js"></script>
<script src="/static/ng/resources/js/components/details/retrieve-projects.directive.js"></script>