add organization team-single page
This commit is contained in:
		
					parent
					
						
							
								63cc14062a
							
						
					
				
			
			
				commit
				
					
						c127d84777
					
				
			
		
					 5 changed files with 250 additions and 32 deletions
				
			
		|  | @ -201,6 +201,8 @@ func runWeb(*cli.Context) { | |||
| 		r.Post("/:org/teams/new", bindIgnErr(auth.CreateTeamForm{}), org.NewTeamPost) | ||||
| 		r.Get("/:org/teams/:team/edit", org.EditTeam) | ||||
| 
 | ||||
| 		r.Get("/:org/team/:team",org.SingleTeam) | ||||
| 
 | ||||
| 		r.Get("/:org/settings", org.Settings) | ||||
| 		r.Post("/:org/settings", bindIgnErr(auth.OrgSettingForm{}), org.SettingsPost) | ||||
| 		r.Post("/:org/settings/delete", org.DeletePost) | ||||
|  |  | |||
|  | @ -408,28 +408,33 @@ body { | |||
| #repo-hooks-list .remove-hook { | ||||
|     color: #DD4B39; | ||||
| } | ||||
| #repo-collab-form .dropdown-menu { | ||||
| #repo-collab-form .dropdown-menu, | ||||
| #org-team-content .header .dropdown-menu { | ||||
|     margin-left: 15px; | ||||
|     margin-top: 4px; | ||||
|     padding: 0; | ||||
| } | ||||
| #repo-collab-form .dropdown-menu li { | ||||
| #repo-collab-form .dropdown-menu li, | ||||
| #org-team-content .header .dropdown-menu li { | ||||
|     padding: 0 1em; | ||||
|     line-height: 36px; | ||||
|     cursor: pointer; | ||||
|     font-weight: bold; | ||||
| } | ||||
| #repo-collab-form .dropdown-menu li:hover { | ||||
| #repo-collab-form .dropdown-menu li:hover, | ||||
| #org-team-content .header .dropdown-menu li:hover { | ||||
|     background-color: #e8f0ff; | ||||
| } | ||||
| #repo-collab-form .dropdown-menu img { | ||||
| #repo-collab-form .dropdown-menu img, | ||||
| #org-team-content .header .dropdown-menu img { | ||||
|     width: 28px; | ||||
|     height: 28px; | ||||
|     margin-right: 1em; | ||||
|     vertical-align: middle; | ||||
|     margin-top: -3px; | ||||
| } | ||||
| #repo-collab-form .dropdown-menu ul { | ||||
| #repo-collab-form .dropdown-menu ul, | ||||
| #org-team-content .header .dropdown-menu ul { | ||||
|     margin-bottom: 0; | ||||
| } | ||||
| #repo-hooks-list li { | ||||
|  | @ -1446,8 +1451,7 @@ body { | |||
| #footer { | ||||
|     background: #fff; | ||||
|     -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05); | ||||
|     box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05); | ||||
|     ; | ||||
|     box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);; | ||||
|     height: 100px; | ||||
| } | ||||
| #footer .footer-wrap { | ||||
|  | @ -1677,31 +1681,39 @@ body { | |||
| #org-members { | ||||
|     margin-right: 30px; | ||||
| } | ||||
| #org-members .member .avatar img { | ||||
| #org-members .member .avatar img, | ||||
| #org-team-members .member .avatar img { | ||||
|     width: 50px; | ||||
|     height: 50px; | ||||
| } | ||||
| #org-members .member { | ||||
| #org-members .member, | ||||
| #org-team-members .member { | ||||
|     padding-bottom: 20px; | ||||
|     margin-bottom: 20px; | ||||
|     border-bottom: 1px solid #DDD; | ||||
|     height: 70px; | ||||
| } | ||||
| #org-members .member .name { | ||||
| #org-members .member .name, | ||||
| #org-team-members .member .name { | ||||
|     padding-top: 4px; | ||||
| } | ||||
| #org-members .member .nick { | ||||
| #org-members .member .nick, | ||||
| #org-team-members .member .nick { | ||||
|     display: block; | ||||
|     color: #888; | ||||
| } | ||||
| #org-members .member .name a { | ||||
| #org-members .member .name a, | ||||
| #org-team-members .member .name a { | ||||
|     color: #444; | ||||
| } | ||||
| #org-members .member .name strong { | ||||
| #org-members .member .name strong, | ||||
| #org-team-members .member .name strong { | ||||
|     font-size: 1.2em; | ||||
| } | ||||
| #org-members .status, | ||||
| #org-members .role { | ||||
| #org-members .role, | ||||
| #org-team-members .status, | ||||
| #org-team-members .role { | ||||
|     line-height: 48px; | ||||
|     text-align: right; | ||||
| } | ||||
|  | @ -1728,3 +1740,43 @@ body { | |||
| #org-teams .org-team { | ||||
|     border-bottom: none; | ||||
| } | ||||
| #org-team-card { | ||||
|     border: 1px solid #CCC; | ||||
|     background-color: #FFF; | ||||
| } | ||||
| #org-team-card .meta .num { | ||||
|     font-weight: bold; | ||||
|     color: #444; | ||||
|     font-size: 1.2em; | ||||
| } | ||||
| #org-team-card .meta > div { | ||||
|     margin-bottom: 12px; | ||||
| } | ||||
| #org-team-card .meta a:hover { | ||||
|     text-decoration: none; | ||||
|     font-weight: bold; | ||||
| } | ||||
| #org-team-card .action a { | ||||
|     margin-right: 12px; | ||||
| } | ||||
| #org-team-card .action a:hover { | ||||
|     text-decoration: none; | ||||
| } | ||||
| #org-team-content .header { | ||||
|     height: 50px; | ||||
| } | ||||
| #org-team-content .header > form { | ||||
|     padding-right: 0; | ||||
| } | ||||
| #org-team-repos .repo{ | ||||
|     padding-bottom: 20px; | ||||
|     margin-bottom: 20px; | ||||
|     border-bottom: 1px solid #DDD; | ||||
|     padding-left: 15px; | ||||
| } | ||||
| #org-team-repos .repo-name{ | ||||
|     font-size: 1.2em; | ||||
|     color: #444; | ||||
|     font-weight: bold; | ||||
|     line-height: 30px; | ||||
| } | ||||
|  | @ -301,6 +301,26 @@ var Gogits = {}; | |||
|         }).addClass("js-copy-bind"); | ||||
|     } | ||||
| 
 | ||||
|     // api working
 | ||||
|     Gogits.getUsers = function (val, $target) { | ||||
|         $.ajax({ | ||||
|             url: '/api/v1/users/search?q=' + val, | ||||
|             dataType: "json", | ||||
|             success: function (json) { | ||||
|                 if (json.ok && json.data.length) { | ||||
|                     var html = ''; | ||||
|                     $.each(json.data, function (i, item) { | ||||
|                         html += '<li><img src="' + item.avatar + '">' + item.username + '</li>'; | ||||
|                     }); | ||||
|                     $target.toggleShow(); | ||||
|                     $target.find('ul').html(html); | ||||
|                 } else { | ||||
|                     $target.toggleHide(); | ||||
|                 } | ||||
|             } | ||||
|         }); | ||||
|     } | ||||
| 
 | ||||
| })(jQuery); | ||||
| 
 | ||||
| // ajax utils
 | ||||
|  | @ -733,7 +753,8 @@ function initRepoSetting() { | |||
|             $this.next().toggleHide(); | ||||
|             return; | ||||
|         } | ||||
|         $.ajax({ | ||||
|         Gogits.getUsers($this.val(), $this.next()); | ||||
|         /*$.ajax({ | ||||
|          url: '/api/v1/users/search?q=' + $this.val(), | ||||
|          dataType: "json", | ||||
|          success: function (json) { | ||||
|  | @ -748,7 +769,7 @@ function initRepoSetting() { | |||
|          $this.next().toggleHide(); | ||||
|          } | ||||
|          } | ||||
|         }); | ||||
|          });*/ | ||||
|     }).on('focus', function () { | ||||
|         if (!$(this).val()) { | ||||
|             $(this).next().toggleHide(); | ||||
|  | @ -771,14 +792,43 @@ function initRepoCreating() { | |||
|                 $(this).addClass("checked"); | ||||
|             } | ||||
|             // set button group to show clicked owner
 | ||||
|             $('#repo-owner-avatar').attr("src",$(this).find('img').attr("src")); | ||||
|             $('#repo-owner-avatar').attr("src", $(this).find('img').attr("src")); | ||||
|             $('#repo-owner-name').text($(this).text().trim()); | ||||
|             console.log("set repo owner to uid :",uid,$(this).text().trim()); | ||||
|             console.log("set repo owner to uid :", uid, $(this).text().trim()); | ||||
|         }); | ||||
|     }()); | ||||
|     console.log("init repo-creating scripts"); | ||||
| } | ||||
| 
 | ||||
| function initOrganization() { | ||||
|     (function(){ | ||||
|         $('#org-team-add-user').on('keyup', function () { | ||||
|             var $this = $(this); | ||||
|             if (!$this.val()) { | ||||
|                 $this.next().toggleHide(); | ||||
|                 return; | ||||
|             } | ||||
|             Gogits.getUsers($this.val(), $this.next()); | ||||
|         }).on('focus', function () { | ||||
|             if (!$(this).val()) { | ||||
|                 $(this).next().toggleHide(); | ||||
|             } | ||||
|         }).next().on("click", 'li', function () { | ||||
|             $('#org-team-add-user').val($(this).text()); | ||||
|             $('#org-team-add-user-form').submit(); | ||||
|         }).toggleHide(); | ||||
|         console.log("init script : add user to team"); | ||||
|     }()); | ||||
| 
 | ||||
|     (function(){ | ||||
|         $('#org-team-add-repo').next().toggleHide(); | ||||
|         console.log("init script : add repository to team"); | ||||
|     }()); | ||||
| 
 | ||||
| 
 | ||||
|     console.log("init script : organization done"); | ||||
| } | ||||
| 
 | ||||
| (function ($) { | ||||
|     $(function () { | ||||
|         initCore(); | ||||
|  | @ -804,6 +854,9 @@ function initRepoCreating() { | |||
|         if ($('#repo-create').length) { | ||||
|             initRepoCreating(); | ||||
|         } | ||||
|         if ($('#body-nav').hasClass("org-nav")) { | ||||
|             initOrganization(); | ||||
|         } | ||||
|     }); | ||||
| })(jQuery); | ||||
| 
 | ||||
|  |  | |||
|  | @ -129,3 +129,8 @@ func EditTeam(ctx *middleware.Context, params martini.Params) { | |||
| 	ctx.Data["Title"] = "Organization " + params["org"] + " Edit Team" | ||||
| 	ctx.HTML(200, "org/edit_team") | ||||
| } | ||||
| 
 | ||||
| func SingleTeam(ctx *middleware.Context,params martini.Params){ | ||||
| 	ctx.Data["Title"] = "single-team"+params["org"] | ||||
| 	ctx.HTML(200,"org/team") | ||||
| } | ||||
|  |  | |||
							
								
								
									
										106
									
								
								templates/org/team.tmpl
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										106
									
								
								templates/org/team.tmpl
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,106 @@ | |||
| {{template "base/head" .}} | ||||
| {{template "base/navbar" .}} | ||||
| <div id="body-nav" class="org-nav org-nav-auto"> | ||||
|     <div class="container clearfix"> | ||||
|         <div id="org-nav-wrapper"> | ||||
|             <ul class="nav nav-pills pull-right"> | ||||
|                 <li><a href="#"><i class="fa fa-users"></i>Members | ||||
|                     <span class="label label-default">5</span></a> | ||||
|                 </li> | ||||
|                 <li class="active"><a href="#"><i class="fa fa-tags"></i>Teams | ||||
|                     <span class="label label-default">2</span></a> | ||||
|                 </li> | ||||
|             </ul> | ||||
|             <img class="pull-left org-small-logo" src="https://avatars3.githubusercontent.com/u/6656686?s=140" alt="" width="60"/> | ||||
|             <div id="org-nav-info"> | ||||
|                 <h2 class="org-name">Organization Name</h2> | ||||
|             </div> | ||||
|         </div> | ||||
|     </div> | ||||
| </div> | ||||
| <div id="body" class="container"> | ||||
|     <div id="org"> | ||||
|         <div id="org-team"> | ||||
|             <div id="org-team-card" class="col-md-3"> | ||||
|                 <h3 class="title">Team name</h3> | ||||
|                 <p class="desc">team description</p> | ||||
|                 <hr/> | ||||
|                 <div class="meta"> | ||||
|                     <div class="col-md-6"> | ||||
|                         <a href="#"><span class="num"><strong>1</strong></span> | ||||
|                             <br/>Member</a> | ||||
|                     </div> | ||||
|                     <div class="col-md-6"> | ||||
|                         <a href="#"><span class="num"><strong>1</strong></span> | ||||
|                             <br/>Repository</a> | ||||
|                     </div> | ||||
|                 </div> | ||||
|                 <hr style="width: 100%"/> | ||||
|                 <div class="action"> | ||||
|                     <a href="#"> | ||||
|                         <button class="btn btn-danger">Leave</button> | ||||
|                     </a> | ||||
|                     <a href="#"> | ||||
|                         <button class="btn btn-success">Edit</button> | ||||
|                     </a> | ||||
|                     <a href="#"> | ||||
|                         <button class="btn btn-default">Setting</button> | ||||
|                     </a> | ||||
|                 </div> | ||||
|                 <hr/> | ||||
|                 <p>This team grants <strong>Push, Read & Clone</strong> access: members can read from and push to the team's repositories.</p> | ||||
|             </div> | ||||
|             <div id="org-team-content" class="col-md-9"> | ||||
|                 <div class="header"> | ||||
|                     <div class="header-tab col-md-4"> | ||||
|                         <div class="btn-group"> | ||||
|                             <a class="btn btn-primary" href="#">Members</a> | ||||
|                             <a class="btn btn-default" href="#">Repositories</a> | ||||
|                         </div> | ||||
|                     </div> | ||||
|                     <form id="org-team-add-user-form" action="url" class="col-md-4 pull-right open" method="post"> | ||||
|                         <input type="text" class="form-control" name="user" placeholder="add user to teams" id="org-team-add-user"/> | ||||
|                         <div class="dropdown-menu"> | ||||
|                             <ul class="list-unstyled"></ul> | ||||
|                         </div> | ||||
|                         <input type="hidden" name="team" value="team-id"/> | ||||
|                     </form> | ||||
|                 </div> | ||||
|                 <div class="content" id="org-team-members"> | ||||
|                     <div class="member">  | ||||
|                         <div class="avatar col-md-1"> | ||||
|                             <img src="https://avatars3.githubusercontent.com/u/2142787?s=140" alt=""> | ||||
|                         </div> | ||||
|                         <div class="name col-md-4"> | ||||
|                             <a href="#"><strong>fuxiaohei</strong><span class="nick">傅小黑</span></a> | ||||
|                         </div> | ||||
|                         <a class="remove btn btn-danger pull-right" href="#">Remove</a> | ||||
|                     </div> | ||||
|                 </div> | ||||
|                 <!---------------------- for ?member or ?repo ----------> | ||||
|                 <div class="header"> | ||||
|                     <div class="header-tab col-md-4"> | ||||
|                         <div class="btn-group"> | ||||
|                             <a class="btn btn-default" href="#">Members</a> | ||||
|                             <a class="btn btn-primary" href="#">Repositories</a> | ||||
|                         </div> | ||||
|                     </div> | ||||
|                     <form id="org-team-add-repo-form" action="url" class="col-md-4 pull-right open" method="post"> | ||||
|                         <input type="text" class="form-control" name="repo" placeholder="add repository to teams" id="org-team-add-repo"/> | ||||
|                         <div class="dropdown-menu"> | ||||
|                             <ul class="list-unstyled"></ul> | ||||
|                         </div> | ||||
|                         <input type="hidden" name="team" value="team-id"/> | ||||
|                     </form> | ||||
|                 </div> | ||||
|                 <div class="content" id="org-team-repos"> | ||||
|                     <div class="repo"> | ||||
|                         <a href="#" class="repo-name"><i class="fa fa-book"></i> repo-name</a> | ||||
|                         <a class="remove btn btn-danger pull-right" href="#">Remove</a> | ||||
|                     </div> | ||||
|                 </div> | ||||
|             </div> | ||||
|         </div> | ||||
|     </div> | ||||
| </div> | ||||
| {{template "base/footer" .}} | ||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 fuxiaohei
				fuxiaohei