mirror of
				https://codeberg.org/forgejo/forgejo.git
				synced 2025-11-04 00:11:04 +00:00 
			
		
		
		
	Use custom search for each filter type in dashboard (#2343)
* Do custom search for each filter in repo-search * Fix search url * Simplify code * Remove loader and reset counts when changing filter
This commit is contained in:
		
					parent
					
						
							
								266ebf8200
							
						
					
				
			
			
				commit
				
					
						25acd6c822
					
				
			
		
					 2 changed files with 74 additions and 19 deletions
				
			
		| 
						 | 
				
			
			@ -1671,12 +1671,46 @@ function initVueComponents(){
 | 
			
		|||
                reposTotalCount: 0,
 | 
			
		||||
                reposFilter: 'all',
 | 
			
		||||
                searchQuery: '',
 | 
			
		||||
                isLoading: false
 | 
			
		||||
                isLoading: false,
 | 
			
		||||
                repoTypes: {
 | 
			
		||||
                    'all': {
 | 
			
		||||
                        count: 0,
 | 
			
		||||
                        searchMode: '',
 | 
			
		||||
                    },
 | 
			
		||||
                    'forks': {
 | 
			
		||||
                        count: 0,
 | 
			
		||||
                        searchMode: 'fork',
 | 
			
		||||
                    },
 | 
			
		||||
                    'mirrors': {
 | 
			
		||||
                        count: 0,
 | 
			
		||||
                        searchMode: 'mirror',
 | 
			
		||||
                    },
 | 
			
		||||
                    'sources': {
 | 
			
		||||
                        count: 0,
 | 
			
		||||
                        searchMode: 'source',
 | 
			
		||||
                    },
 | 
			
		||||
                    'collaborative': {
 | 
			
		||||
                        count: 0,
 | 
			
		||||
                        searchMode: 'collaborative',
 | 
			
		||||
                    },
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        },
 | 
			
		||||
 | 
			
		||||
        computed: {
 | 
			
		||||
            showMoreReposLink: function() {
 | 
			
		||||
                return this.repos.length > 0 && this.repos.length < this.repoTypes[this.reposFilter].count;
 | 
			
		||||
            },
 | 
			
		||||
            searchURL: function() {
 | 
			
		||||
                return this.suburl + '/api/v1/repos/search?uid=' + this.uid + '&q=' + this.searchQuery + '&limit=' + this.searchLimit + '&mode=' + this.repoTypes[this.reposFilter].searchMode + (this.reposFilter !== 'all' ? '&exclusive=1' : '');
 | 
			
		||||
            },
 | 
			
		||||
            repoTypeCount: function() {
 | 
			
		||||
                return this.repoTypes[this.reposFilter].count;
 | 
			
		||||
            }
 | 
			
		||||
        },
 | 
			
		||||
 | 
			
		||||
        mounted: function() {
 | 
			
		||||
            this.searchRepos();
 | 
			
		||||
            this.searchRepos(this.reposFilter);
 | 
			
		||||
 | 
			
		||||
            var self = this;
 | 
			
		||||
            Vue.nextTick(function() {
 | 
			
		||||
| 
						 | 
				
			
			@ -1691,6 +1725,9 @@ function initVueComponents(){
 | 
			
		|||
 | 
			
		||||
            changeReposFilter: function(filter) {
 | 
			
		||||
                this.reposFilter = filter;
 | 
			
		||||
                this.repos = [];
 | 
			
		||||
                this.repoTypes[filter].count = 0;
 | 
			
		||||
                this.searchRepos(filter);
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
            showRepo: function(repo, filter) {
 | 
			
		||||
| 
						 | 
				
			
			@ -1708,28 +1745,31 @@ function initVueComponents(){
 | 
			
		|||
                }
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
            searchRepos: function() {
 | 
			
		||||
            searchRepos: function(reposFilter) {
 | 
			
		||||
                var self = this;
 | 
			
		||||
 | 
			
		||||
                this.isLoading = true;
 | 
			
		||||
 | 
			
		||||
                var searchedMode = this.repoTypes[reposFilter].searchMode;
 | 
			
		||||
                var searchedURL = this.searchURL;
 | 
			
		||||
                var searchedQuery = this.searchQuery;
 | 
			
		||||
                $.getJSON(this.searchURL(), function(result, textStatus, request) {
 | 
			
		||||
                    if (searchedQuery == self.searchQuery) {
 | 
			
		||||
 | 
			
		||||
                $.getJSON(searchedURL, function(result, textStatus, request) {
 | 
			
		||||
                    if (searchedURL == self.searchURL) {
 | 
			
		||||
                        self.repos = result.data;
 | 
			
		||||
                        if (searchedQuery == "") {
 | 
			
		||||
                            self.reposTotalCount = request.getResponseHeader('X-Total-Count');
 | 
			
		||||
                        var count = request.getResponseHeader('X-Total-Count');
 | 
			
		||||
                        if (searchedQuery === '' && searchedMode === '') {
 | 
			
		||||
                            self.reposTotalCount = count;
 | 
			
		||||
                        }
 | 
			
		||||
                        self.repoTypes[reposFilter].count = count;
 | 
			
		||||
                    }
 | 
			
		||||
                }).always(function() {
 | 
			
		||||
                    if (searchedQuery == self.searchQuery) {
 | 
			
		||||
                    if (searchedURL == self.searchURL) {
 | 
			
		||||
                        self.isLoading = false;
 | 
			
		||||
                    }
 | 
			
		||||
                });
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
            searchURL: function() {
 | 
			
		||||
                return this.suburl + '/api/v1/repos/search?uid=' + this.uid + '&q=' + this.searchQuery + '&limit=' + this.searchLimit;
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
            repoClass: function(repo) {
 | 
			
		||||
                if (repo.fork) {
 | 
			
		||||
                    return 'octicon octicon-repo-forked';
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -43,15 +43,30 @@
 | 
			
		|||
							</h4>
 | 
			
		||||
							<div class="ui attached secondary segment repos-search">
 | 
			
		||||
								<div class="ui fluid icon input" :class="{loading: isLoading}">
 | 
			
		||||
									<input @input="searchRepos" v-model="searchQuery" ref="search" placeholder="{{.i18n.Tr "home.search_repos"}}">
 | 
			
		||||
									<input @input="searchRepos(reposFilter)" v-model="searchQuery" ref="search" placeholder="{{.i18n.Tr "home.search_repos"}}">
 | 
			
		||||
									<i class="search icon"></i>
 | 
			
		||||
								</div>
 | 
			
		||||
								<div class="ui secondary tiny pointing borderless menu center aligned grid repos-filter">
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">{{.i18n.Tr "all"}}</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'sources'}" @click="changeReposFilter('sources')">{{.i18n.Tr "sources"}}</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'forks'}" @click="changeReposFilter('forks')">{{.i18n.Tr "forks"}}</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'mirrors'}" @click="changeReposFilter('mirrors')">{{.i18n.Tr "mirrors"}}</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'collaborative'}" @click="changeReposFilter('collaborative')">{{.i18n.Tr "collaborative"}}</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">
 | 
			
		||||
										{{.i18n.Tr "all"}}
 | 
			
		||||
										<div v-show="reposFilter === 'all'" class="ui circular mini grey label">${repoTypeCount}</div>
 | 
			
		||||
									</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'sources'}" @click="changeReposFilter('sources')">
 | 
			
		||||
										{{.i18n.Tr "sources"}}
 | 
			
		||||
										<div v-show="reposFilter === 'sources'" class="ui circular mini grey label">${repoTypeCount}</div>
 | 
			
		||||
									</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'forks'}" @click="changeReposFilter('forks')">
 | 
			
		||||
										{{.i18n.Tr "forks"}}
 | 
			
		||||
										<div v-show="reposFilter === 'forks'" class="ui circular mini grey label">${repoTypeCount}</div>
 | 
			
		||||
									</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'mirrors'}" @click="changeReposFilter('mirrors')">
 | 
			
		||||
										{{.i18n.Tr "mirrors"}}
 | 
			
		||||
										<div v-show="reposFilter === 'mirrors'" class="ui circular mini grey label">${repoTypeCount}</div>
 | 
			
		||||
									</a>
 | 
			
		||||
									<a class="item" :class="{active: reposFilter === 'collaborative'}" @click="changeReposFilter('collaborative')">
 | 
			
		||||
										{{.i18n.Tr "collaborative"}}
 | 
			
		||||
										<div v-show="reposFilter === 'collaborative'" class="ui circular mini grey label">${repoTypeCount}</div>
 | 
			
		||||
									</a>
 | 
			
		||||
								</div>
 | 
			
		||||
							</div>
 | 
			
		||||
							<div class="ui attached table segment">
 | 
			
		||||
| 
						 | 
				
			
			@ -65,7 +80,7 @@
 | 
			
		|||
											</span>
 | 
			
		||||
										</a>
 | 
			
		||||
									</li>
 | 
			
		||||
									<li v-if="repos.length < reposTotalCount">
 | 
			
		||||
									<li v-if="showMoreReposLink">
 | 
			
		||||
										<a :href="moreReposLink">{{.i18n.Tr "home.show_more_repos"}}</a>
 | 
			
		||||
									</li>
 | 
			
		||||
								</ul>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue