Skip to content

Commit

Permalink
fix
Browse files Browse the repository at this point in the history
  • Loading branch information
wxiaoguang committed Feb 25, 2023
1 parent 579a6e1 commit 856089d
Show file tree
Hide file tree
Showing 2 changed files with 60 additions and 129 deletions.
82 changes: 32 additions & 50 deletions templates/user/dashboard/repolist.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -46,56 +46,38 @@
<div class="ui dropdown icon button" title="{{.locale.Tr "home.filter"}}">
<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
<div class="menu">
<div class="item">
<a @click="toggleArchivedFilter()">
<div class="ui checkbox indeterminate" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_both_archived_unarchived"}}" v-if="archivedFilter === 'both'">
<input type="checkbox" v-bind.prop="getArchivedFilterCheckboxState()">
<label>
{{svg "octicon-archive" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_archived"}}
</label>
</div>
<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_unarchived"}}" v-if="archivedFilter === 'unarchived'">
<input type="checkbox" v-bind.prop="getArchivedFilterCheckboxState()">
<label>
{{svg "octicon-archive" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_archived"}}
</label>
</div>
<div class="ui checkbox checked" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_archived"}}" v-if="archivedFilter === 'archived'">
<input type="checkbox" v-bind.prop="getArchivedFilterCheckboxState()">
<label>
{{svg "octicon-archive" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_archived"}}
</label>
</div>
</a>
</div>
<div class="item">
<a @click="togglePrivateFilter()">
<div class="ui checkbox indeterminate" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_both_private_public"}}" v-if="privateFilter === 'both'">
<input type="checkbox" v-bind.prop="getPrivateFilterCheckboxState()">
<label>
{{svg "octicon-lock" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_private"}}
</label>
</div>
<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_public"}}" v-if="privateFilter === 'public'">
<input type="checkbox" v-bind.prop="getPrivateFilterCheckboxState()">
<label>
{{svg "octicon-lock" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_private"}}
</label>
</div>
<div class="ui checkbox checked" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_private"}}" v-if="privateFilter === 'private'">
<input type="checkbox" v-bind.prop="getPrivateFilterCheckboxState()">
<label>
{{svg "octicon-lock" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_private"}}
</label>
</div>
</a>
</div>
<a class="item" @click="toggleArchivedFilter()">
<div class="ui checkbox"
ref="checkboxArchivedFilter"
data-title-both="{{.locale.Tr "home.show_both_archived_unarchived"}}"
data-title-unarchived="{{.locale.Tr "home.show_only_unarchived"}}"
data-title-archived="{{.locale.Tr "home.show_only_archived"}}"
:title="checkboxArchivedFilterTitle"
>
<!--the "hidden" is necessary to make the checkbox work without Fomantic UI js,
otherwise if the "input" handles click event for intermediate status, it breaks the internal state-->
<input type="checkbox" class="hidden" v-bind.prop="checkboxArchivedFilterProps">
<label>
{{svg "octicon-archive" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_archived"}}
</label>
</div>
</a>
<a class="item" @click="togglePrivateFilter()">
<div class="ui checkbox"
ref="checkboxPrivateFilter"
data-title-both="{{.locale.Tr "home.show_both_private_public"}}"
data-title-public="{{.locale.Tr "home.show_only_public"}}"
data-title-private="{{.locale.Tr "home.show_only_private"}}"
:title="checkboxPrivateFilterTitle"
>
<input type="checkbox" class="hidden" v-bind.prop="checkboxPrivateFilterProps">
<label>
{{svg "octicon-lock" 16 "gt-mr-2"}}
{{.locale.Tr "home.show_private"}}
</label>
</div>
</a>
</div>
</div>
</div>
Expand Down
107 changes: 28 additions & 79 deletions web_src/js/components/DashboardRepoList.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@ function initVueComponents(app) {
}

return {
hasMounted: false, // accessing $refs in computed() need to wait for mounted
tab,
repos: [],
reposTotalCount: 0,
Expand Down Expand Up @@ -134,7 +135,19 @@ function initVueComponents(app) {
},
repoTypeCount() {
return this.counts[`${this.reposFilter}:${this.archivedFilter}:${this.privateFilter}`];
}
},
checkboxArchivedFilterTitle() {
return this.hasMounted && this.$refs.checkboxArchivedFilter?.getAttribute(`data-title-${this.archivedFilter}`);
},
checkboxArchivedFilterProps() {
return {checked: this.archivedFilter === 'archived', indeterminate: this.archivedFilter === 'both'};
},
checkboxPrivateFilterTitle() {
return this.hasMounted && this.$refs.checkboxPrivateFilter?.getAttribute(`data-title-${this.privateFilter}`);
},
checkboxPrivateFilterProps() {
return {checked: this.privateFilter === 'private', indeterminate: this.privateFilter === 'both'};
},
},

mounted() {
Expand All @@ -147,6 +160,8 @@ function initVueComponents(app) {
nextTick(() => {
this.$refs.search.focus();
});

this.hasMounted = true;
},

methods: {
Expand All @@ -155,58 +170,6 @@ function initVueComponents(app) {
this.updateHistory();
},

getArchivedFilterCheckboxState() {
switch (this.archivedFilter) {
case 'unarchived':
return {
checked: false,
indeterminate: false
};
case 'archived':
return {
checked: true,
indeterminate: false
};
case 'both':
return {
checked: false,
indeterminate: true
};
default:
this.archivedFilter = 'unarchived';
return {
checked: false,
indeterminate: true
};
}
},

getPrivateFilterCheckboxState() {
switch (this.privateFilter) {
case 'public':
return {
checked: false,
indeterminate: false
};
case 'private':
return {
checked: true,
indeterminate: false
};
case 'both':
return {
checked: false,
indeterminate: true
};
default:
this.privateFilter = 'both';
return {
checked: false,
indeterminate: true
};
}
},

changeReposFilter(filter) {
this.reposFilter = filter;
this.repos = [];
Expand Down Expand Up @@ -263,19 +226,12 @@ function initVueComponents(app) {
},

toggleArchivedFilter() {
switch (this.archivedFilter) {
case 'both':
this.archivedFilter = 'unarchived';
break;
case 'unarchived':
this.archivedFilter = 'archived';
break;
case 'archived':
this.archivedFilter = 'both';
break;
default:
this.archivedFilter = 'unarchived';
break;
if (this.archivedFilter === 'unarchived') {
this.archivedFilter = 'archived';
} else if (this.archivedFilter === 'archived') {
this.archivedFilter = 'both';
} else { // including both
this.archivedFilter = 'unarchived';
}
this.page = 1;
this.repos = [];
Expand All @@ -284,19 +240,12 @@ function initVueComponents(app) {
},

togglePrivateFilter() {
switch (this.privateFilter) {
case 'both':
this.privateFilter = 'public';
break;
case 'public':
this.privateFilter = 'private';
break;
case 'private':
this.privateFilter = 'both';
break;
default:
this.privateFilter = 'both';
break;
if (this.privateFilter === 'both') {
this.privateFilter = 'public';
} else if (this.privateFilter === 'public') {
this.privateFilter = 'private';
} else { // including private
this.privateFilter = 'both';
}
this.page = 1;
this.repos = [];
Expand Down

0 comments on commit 856089d

Please sign in to comment.