diff options
| author | 6543 <6543@obermui.de> | 2020-06-25 00:23:05 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-06-24 23:23:05 +0100 |
| commit | c86478ec47366dfb7081cc2eb2790a0af1880eca (patch) | |
| tree | 6301cdfabec3f619cd61e673fa9bef3802a16b82 /web_src | |
| parent | ae20de7771d81d76ff62227e464a699d55c62084 (diff) | |
| download | gitea-c86478ec47366dfb7081cc2eb2790a0af1880eca.tar.gz gitea-c86478ec47366dfb7081cc2eb2790a0af1880eca.zip | |
[UI] Sortable Tables Header By Click (#7980)
* [UI] Sortable Tables Header By Click
* get rid of padding above header
* restart CI
* fix lint
* convert getArrow JS to SortArrow go func
* addopt SortArrow funct
* suggestions from @silverwind - tablesort.js
Co-authored-by: silverwind <me@silverwind.io>
* Update web_src/js/features/tablesort.js
Co-authored-by: silverwind <me@silverwind.io>
* Update web_src/js/features/tablesort.js
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: silverwind <me@silverwind.io>
Diffstat (limited to 'web_src')
| -rw-r--r-- | web_src/js/features/tablesort.js | 20 | ||||
| -rw-r--r-- | web_src/js/index.js | 2 | ||||
| -rw-r--r-- | web_src/less/_admin.less | 2 | ||||
| -rw-r--r-- | web_src/less/_base.less | 11 | ||||
| -rw-r--r-- | web_src/less/themes/theme-arc-green.less | 2 |
5 files changed, 34 insertions, 3 deletions
diff --git a/web_src/js/features/tablesort.js b/web_src/js/features/tablesort.js new file mode 100644 index 0000000000..17da2985a0 --- /dev/null +++ b/web_src/js/features/tablesort.js @@ -0,0 +1,20 @@ +export default function initTableSort() { + for (const header of document.querySelectorAll('th[data-sortt-asc]') || []) { + const {sorttAsc, sorttDesc, sorttDefault} = header.dataset; + header.addEventListener('click', () => { + tableSort(sorttAsc, sorttDesc, sorttDefault); + }); + } +} + +function tableSort(normSort, revSort, isDefault) { + if (!normSort) return false; + if (!revSort) revSort = ''; + + const url = new URL(window.location); + let urlSort = url.searchParams.get('sort'); + if (!urlSort && isDefault) urlSort = normSort; + + url.searchParams.set('sort', urlSort !== normSort ? normSort : revSort); + window.location.replace(url.href); +} diff --git a/web_src/js/index.js b/web_src/js/index.js index 6b435edd0f..37cb2a3988 100644 --- a/web_src/js/index.js +++ b/web_src/js/index.js @@ -15,6 +15,7 @@ import initUserHeatmap from './features/userheatmap.js'; import initServiceWorker from './features/serviceworker.js'; import attachTribute from './features/tribute.js'; import createDropzone from './features/dropzone.js'; +import initTableSort from './features/tablesort.js'; import highlight from './features/highlight.js'; import ActivityTopAuthors from './components/ActivityTopAuthors.vue'; import {initNotificationsTable, initNotificationCount} from './features/notification.js'; @@ -2450,6 +2451,7 @@ $(document).ready(async () => { initRepoStatusChecker(); initTemplateSearch(); initContextPopups(); + initTableSort(); initNotificationsTable(); initNotificationCount(); diff --git a/web_src/less/_admin.less b/web_src/less/_admin.less index 9184ed76ef..5bca054d71 100644 --- a/web_src/less/_admin.less +++ b/web_src/less/_admin.less @@ -6,8 +6,6 @@ font-size: 13px; &:not(.striped) { - padding-top: 5px; - thead { th:last-child { padding-right: 5px !important; diff --git a/web_src/less/_base.less b/web_src/less/_base.less index a4a0cefcd0..0f4f8bcd6d 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -1223,6 +1223,17 @@ i.icon.centerlock { margin-top: 1rem; } +table th[data-sortt-asc], +table th[data-sortt-desc] { + &:hover { + background: rgba(0, 0, 0, .1) !important; + cursor: pointer !important; + } + .svg { + margin-left: .25rem; + } +} + /* limit width of all direct dropdown menu children */ /* https://github.com/go-gitea/gitea/pull/10835 */ .dropdown:not(.selection) > .menu:not(.review-box) > *:not(.header) { diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 529ceeb6e8..885889c3ac 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -479,7 +479,7 @@ a.ui.basic.green.label:hover { .ui.table thead th, .ui.table > thead > tr > th { - background: #404552 !important; + background: #404552; color: #dbdbdb !important; } |