git724/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Refactor dashboard repo list to Vue SFC (#23405)

Browse source 
Similar to #23394

The dashboard repo list mixes jQuery/Fomantic UI/Vue together, it's very
diffcult to maintain and causes unfixable a11y problems.

This PR uses two steps to refactor the repo list:

1. move `data-` attributes to JS object and use Vue data as much as
possible
d3adc0dcac
2. move the code into a Vue SFC
7ebe55df6e

Total: +516 −585

Screenshots:

<details>

![image](https://user-images.githubusercontent.com/2114189/224271457-a23e05be-d7d3-4247-a803-f0ee30c36f44.png)

![image](https://user-images.githubusercontent.com/2114189/224271504-76fbd3da-4d7a-4725-b0d1-fbff83caac63.png)

![image](https://user-images.githubusercontent.com/2114189/224271845-f007cadf-6c49-46bd-a65c-a3fc75bdba3b.png)

</details>

---------

Co-authored-by: John Olheiser <john.olheiser@gmail.com>
This commit is contained in:
wxiaoguang 2023-03-14 12:09:06 +08:00 • committed by GitHub
parent b942838bd4
commit e82f1b15c7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 516 additions and 585 deletions
Download patch file Download diff file Expand all files Collapse all files

9
web_src/js/components/RepoActivityTopAuthors.vue
View file

@ -51,7 +51,7 @@
<script>
import VueBarGraph from 'vue-bar-graph';
import {initVueApp} from './VueComponentLoader.js';
import {createApp} from 'vue';
const sfc = {
components: {VueBarGraph},
@ -102,8 +102,11 @@ const sfc = {
};
export function initRepoActivityTopAuthorsChart() {
initVueApp('#repo-activity-top-authors-chart', sfc);
const el = document.getElementById('repo-activity-top-authors-chart');
if (el) {
createApp(sfc).mount(el);
}
}
export default sfc; // this line is necessary to activate the IDE's Vue plugin
export default sfc; // activate the IDE's Vue plugin
</script>