From e14682584efca8336d02f532a16ea83b72d6d807 Mon Sep 17 00:00:00 2001 From: yp05327 <576951401@qq.com> Date: Wed, 8 Feb 2023 14:25:02 +0900 Subject: [PATCH 1/3] fix filter checkbox in dashboard --- templates/user/dashboard/repolist.tmpl | 20 ++++---- web_src/js/components/DashboardRepoList.js | 56 ++++++++++++++-------- 2 files changed, 46 insertions(+), 30 deletions(-) diff --git a/templates/user/dashboard/repolist.tmpl b/templates/user/dashboard/repolist.tmpl index 8fb5763f3a5ed..010b7698dde9f 100644 --- a/templates/user/dashboard/repolist.tmpl +++ b/templates/user/dashboard/repolist.tmpl @@ -48,22 +48,22 @@
-
- +
+
- +
-
- +
+
-
- +
+
- +
-
- +
+
{{svg "octicon-filter" 16}}
-
- -
- - -
-
- - -
-
- - -
- -
-
- -
- - -
-
- - -
-
- - -
- -
+ +
+ + + +
+ + +
+ + +
+
diff --git a/web_src/js/components/DashboardRepoList.js b/web_src/js/components/DashboardRepoList.js index edcf470904c52..2328cc83a90c0 100644 --- a/web_src/js/components/DashboardRepoList.js +++ b/web_src/js/components/DashboardRepoList.js @@ -87,6 +87,7 @@ function initVueComponents(app) { } return { + hasMounted: false, // accessing $refs in computed() need to wait for mounted tab, repos: [], reposTotalCount: 0, @@ -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() { @@ -147,6 +160,8 @@ function initVueComponents(app) { nextTick(() => { this.$refs.search.focus(); }); + + this.hasMounted = true; }, methods: { @@ -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 = []; @@ -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 = []; @@ -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 = [];