You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

166 lines
8.1 KiB

  1. <div id="app" class="six wide column">
  2. <repo-search
  3. :search-limit="searchLimit"
  4. :suburl="suburl"
  5. :uid="uid"
  6. :more-repos-link="'{{.ContextUser.HomeLink}}'"
  7. {{if not .ContextUser.IsOrganization}}
  8. :organizations="[
  9. {{range .ContextUser.Orgs}}
  10. {name: '{{.Name}}', num_repos: '{{.NumRepos}}'},
  11. {{end}}
  12. ]"
  13. :is-organization="false"
  14. :organizations-total-count="{{.ContextUser.GetOrganizationCount}}"
  15. :can-create-organization="{{.SignedUser.CanCreateOrganization}}"
  16. {{end}}
  17. inline-template
  18. v-cloak
  19. >
  20. <div>
  21. <div v-if="!isOrganization" class="ui two item tabable menu">
  22. <a :class="{item: true, active: tab === 'repos'}" @click="changeTab('repos')">{{.i18n.Tr "repository"}}</a>
  23. <a :class="{item: true, active: tab === 'organizations'}" @click="changeTab('organizations')">{{.i18n.Tr "organization"}}</a>
  24. </div>
  25. <div v-show="tab === 'repos'" class="ui tab active list dashboard-repos">
  26. <h4 class="ui top attached header">
  27. {{.i18n.Tr "home.my_repos"}} <span class="ui grey label">${reposTotalCount}</span>
  28. {{if or (not .ContextUser.IsOrganization) .IsOrganizationOwner}}
  29. <div class="ui right">
  30. <a class="poping up" :href="suburl + '/repo/create{{if .ContextUser.IsOrganization}}?org={{.ContextUser.ID}}{{end}}'" data-content="{{.i18n.Tr "new_repo"}}" data-variation="tiny inverted" data-position="left center">
  31. <i class="plus icon"></i>
  32. <span class="sr-only">{{.i18n.Tr "new_repo"}}</span>
  33. </a>
  34. </div>
  35. {{end}}
  36. </h4>
  37. <div class="ui attached secondary segment repos-search">
  38. <div class="ui fluid right action left icon input" :class="{loading: isLoading}">
  39. <input @input="searchRepos(reposFilter)" v-model="searchQuery" ref="search" placeholder="{{.i18n.Tr "home.search_repos"}}">
  40. <i class="search icon"></i>
  41. <div class="ui dropdown button" title="{{.i18n.Tr "home.filter"}}">
  42. <i class="icon filter"></i>
  43. <div class="menu">
  44. <div class="item">
  45. <a @click="toggleArchivedFilter()">
  46. <div class="ui checkbox" id="archivedFilterCheckbox" title="{{.i18n.Tr "home.show_both_archived_unarchived"}}" v-if="archivedFilter === 'both'">
  47. <input type="checkbox">
  48. <label><i class="archive icon archived-icon"></i>{{.i18n.Tr "home.show_archived"}}</label>
  49. </div>
  50. <div class="ui checkbox" id="archivedFilterCheckbox" title="{{.i18n.Tr "home.show_only_unarchived"}}" v-if="archivedFilter === 'unarchived'">
  51. <input type="checkbox">
  52. <label><i class="archive icon archived-icon"></i>{{.i18n.Tr "home.show_archived"}}</label>
  53. </div>
  54. <div class="ui checkbox" id="archivedFilterCheckbox" title="{{.i18n.Tr "home.show_only_archived"}}" v-if="archivedFilter === 'archived'">
  55. <input type="checkbox">
  56. <label><i class="archive icon archived-icon"></i>{{.i18n.Tr "home.show_archived"}}</label>
  57. </div>
  58. </a>
  59. </div>
  60. <div class="item">
  61. <a @click="togglePrivateFilter()">
  62. <div class="ui checkbox" id="privateFilterCheckbox" title="{{.i18n.Tr "home.show_both_private_public"}}" v-if="privateFilter === 'both'">
  63. <input type="checkbox">
  64. <label><svg class="svg octicon-lock" width="16" height="16" aria-hidden="true"><use xlink:href="#octicon-lock" /></svg>{{.i18n.Tr "home.show_private"}}</label>
  65. </div>
  66. <div class="ui checkbox" id="privateFilterCheckbox" title="{{.i18n.Tr "home.show_only_public"}}" v-if="privateFilter === 'public'">
  67. <input type="checkbox">
  68. <label><svg class="svg octicon-lock" width="16" height="16" aria-hidden="true"><use xlink:href="#octicon-lock" /></svg>{{.i18n.Tr "home.show_private"}}</label>
  69. </div>
  70. <div class="ui checkbox" id="privateFilterCheckbox" title="{{.i18n.Tr "home.show_only_private"}}" v-if="privateFilter === 'private'">
  71. <input type="checkbox">
  72. <label><svg class="svg octicon-lock" width="16" height="16" aria-hidden="true"><use xlink:href="#octicon-lock" /></svg>{{.i18n.Tr "home.show_private"}}</label>
  73. </div>
  74. </a>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. <div class="ui secondary tiny pointing borderless menu center aligned grid repos-filter">
  80. <a class="item" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">
  81. {{.i18n.Tr "all"}}
  82. <div v-show="reposFilter === 'all'" class="ui circular mini grey label">${repoTypeCount}</div>
  83. </a>
  84. <a class="item" :class="{active: reposFilter === 'sources'}" @click="changeReposFilter('sources')">
  85. {{.i18n.Tr "sources"}}
  86. <div v-show="reposFilter === 'sources'" class="ui circular mini grey label">${repoTypeCount}</div>
  87. </a>
  88. <a class="item" :class="{active: reposFilter === 'forks'}" @click="changeReposFilter('forks')">
  89. {{.i18n.Tr "forks"}}
  90. <div v-show="reposFilter === 'forks'" class="ui circular mini grey label">${repoTypeCount}</div>
  91. </a>
  92. <a class="item" :class="{active: reposFilter === 'mirrors'}" @click="changeReposFilter('mirrors')">
  93. {{.i18n.Tr "mirrors"}}
  94. <div v-show="reposFilter === 'mirrors'" class="ui circular mini grey label">${repoTypeCount}</div>
  95. </a>
  96. <a class="item" :class="{active: reposFilter === 'collaborative'}" @click="changeReposFilter('collaborative')">
  97. {{.i18n.Tr "collaborative"}}
  98. <div v-show="reposFilter === 'collaborative'" class="ui circular mini grey label">${repoTypeCount}</div>
  99. </a>
  100. </div>
  101. </div>
  102. <div class="ui attached table segment">
  103. <ul class="repo-owner-name-list">
  104. <li v-for="repo in repos" :class="{'private': repo.private}">
  105. <a :href="suburl + '/' + repo.full_name">
  106. <svg :class="'svg ' + repoClass(repo)" width="16" height="16" aria-hidden="true"><use :xlink:href="'#' + repoClass(repo)" /></svg>
  107. <strong class="text truncate item-name">${repo.full_name}</strong>
  108. <i v-if="repo.archived" class="archive icon archived-icon"></i>
  109. <span class="ui right text light grey">
  110. ${repo.stars_count} <span class="rear">{{svg "octicon-star" 16}}</span>
  111. </span>
  112. </a>
  113. </li>
  114. <li v-if="showMoreReposLink">
  115. <div class="center">
  116. <div class="ui borderless pagination menu narrow">
  117. <a class="item navigation" :class="{'disabled': page === 1}"
  118. @click="changePage(1)" title="{{$.i18n.Tr "admin.first_page"}}">
  119. <i class="angle double left icon"></i>
  120. </a>
  121. <a class="item navigation" :class="{'disabled': page === 1}"
  122. @click="changePage(page - 1)" title="{{$.i18n.Tr "repo.issues.previous"}}">
  123. <i class="left arrow icon"></i>
  124. </a>
  125. <a class="active item">${page}</a>
  126. <a class="item navigation" :class="{'disabled': page === finalPage}"
  127. @click="changePage(page + 1)" title="{{$.i18n.Tr "repo.issues.next"}}">
  128. <i class="icon right arrow"></i>
  129. </a>
  130. <a class="item navigation" :class="{'disabled': page === finalPage}"
  131. @click="changePage(finalPage)" title="{{$.i18n.Tr "admin.last_page"}}">
  132. <i class="angle double right icon"></i>
  133. </a>
  134. </div>
  135. </div>
  136. </li>
  137. </ul>
  138. </div>
  139. </div>
  140. <div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list">
  141. <h4 class="ui top attached header">
  142. {{.i18n.Tr "home.my_orgs"}} <span class="ui grey label">${organizationsTotalCount}</span>
  143. <div v-if="canCreateOrganization" class="ui right">
  144. <a class="poping up" :href="suburl + '/org/create'" data-content="{{.i18n.Tr "new_org"}}" data-variation="tiny inverted" data-position="left center">
  145. <i class="plus icon"></i>
  146. <span class="sr-only">{{.i18n.Tr "new_org"}}</span>
  147. </a>
  148. </div>
  149. </h4>
  150. <div class="ui attached table segment">
  151. <ul class="repo-owner-name-list">
  152. <li v-for="org in organizations">
  153. <a :href="suburl + '/' + org.name">
  154. {{svg "octicon-organization" 16}}
  155. <strong class="text truncate item-name">${org.name}</strong>
  156. <span class="ui right text light grey">
  157. ${org.num_repos} <span class="rear">{{svg "octicon-repo" 16}}</span>
  158. </span>
  159. </a>
  160. </li>
  161. </ul>
  162. </div>
  163. </div>
  164. </div>
  165. </repo-search>
  166. </div>