More refactoring for the Vue3 and related componments

[wxiaoguang]

At the moment, when viewing Gitea page, a warning will be printed in browser console:

Feature flags __VUE_OPTIONS_API__, __VUE_PROD_DEVTOOLS__ are not explicitly defined.
You are running the esm-bundler build of Vue, which expects these compile-time feature flags
to be globally injected via the bundler config in order to get better tree-shaking in the production bundle.

For more details, see https://link.vuejs.org/feature-flags.

The key problem is that Gitea uses dynamic Vue templates and needs Vue compiler for production build, for example:

• https://github.com/go-gitea/gitea/blob/main/templates/user/dashboard/repolist.tmpl
• https://github.com/go-gitea/gitea/blob/main/templates/repo/branch_dropdown.tmpl

IMO, something could be done:

• In the near future, fix the warning by setting proper options, still use the dynamic compiler.
• In the far future, rewrite the Vue components to pure SFC.

[silverwind]

Yes, we need to eliminate the compiler and ship the runtime only. This will also increase security as it eliminates eval used in the vue compiler code. See #19851 and linked issues.

[delvh]

The key problem is that Gitea uses dynamic Vue templates and needs Vue compiler for production build, for example:

We can also look at how other applications handle setting this type of data.
I can think of two approaches at the top of my mind we could use:

1. Request the specific data dynamically - probably not the best option for performance / amount of possible errors
2. Set the data always via pageData. However, I don't exactly know how we could interact with Vue (i.e. creating a component dynamically) from JS code…

[wxiaoguang]

This issue is highly related to #19851. As long as #19851 is resolved, there will be no problem for this issue. So close this one.