New Admin UI layout

[hiveer]

What this PR does:
Renew admin panel UI layout:

Which issue(s) this PR fixes:

Fixes #

Type of changes
Please delete options that are not relevant.

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation update

Feature/Issue validation/testing:

Please describe the tests that you ran to verify your changes and relevant result summary.

• Test A

• Test B

• Logs

Special notes for your reviewer:

Checklist:

• I have added unit/e2e tests that prove your fix is effective or that this feature works.
• I have commented my code, particularly in hard-to-understand areas.
• I have made corresponding changes to the documentation.
• I have reviewed my own code and ensured that it follows the project's style guidelines.

Release note:

MR Summary:

The summary is added by @codegpt.

This Merge Request introduces a significant update to the Admin UI layout, focusing on enhancing the user experience and functionality. The changes include the addition of new Vue components for the admin interface, updates to existing components, and modifications to the backend to support these changes. Key updates include:

1. Implementation of a new admin layout with Vue components, including AdminLayout, Container, Menu, Navbar, Pagination, and Table.
2. Introduction of a new routing system (/admin_next) to accommodate the updated admin UI.
3. Backend adjustments to serve the new admin UI, including updates to handler and router configurations.
4. Styling enhancements and bug fixes in the frontend, including updates to Tailwind CSS configuration and Vue component styles.
5. Codebase cleanup and organization, including the removal of unused code and consolidation of admin components.

This MR aims to provide a more intuitive and efficient administrative interface, improving navigation, data presentation, and overall usability.

[starship-github]

Linter Issue Report

During the code review, a list issues were found. These issues could affect the code quality, maintainability, and consistency. Below is the detailed Linter issue report:

internal/handlers/render/admin.go

Lint Issue: undefined: renderTemplate

• Location: Line 33
• Code Snippet:

  31:    data := map[string]interface{}{
  32:        "roles": currentUser.Roles(),
  33:    }
  34:    renderTemplate(ctx, "admin_index", data)

• Suggestion: It appears that the function renderTemplate is being called but is not defined within this file or imported from another package. To resolve this issue, ensure that renderTemplate is correctly defined in this package or imported from another package where it is defined. If renderTemplate is intended to be a helper function for rendering templates, you might need to define it like so:

  func renderTemplate(ctx *gin.Context, templateName string, data map[string]interface{}) {
      // Implementation details
  }

  Alternatively, if renderTemplate is part of an external package, make sure to import that package at the top of your file.

---

Please make the suggested changes to improve the code quality.

[starship-github]

MR Evaluation:

This feature is still under test, evaluation are given by AI and might be inaccurate.

After evaluation, the code changes in the Merge Request get score: 70-76.

Analysis for the evaluation score:

• The code change may not include corresponding unit tests.
• The code change may not include corresponding integration testing.
• The code change may not include the corresponding user manual.
• The code change may not include the corresponding development documentation.
• The code change may not include an exception capture mechanism.

Tips

CodeReview Commands (invoked as MR or PR comments)

• @codegpt /review to trigger an code review.
• @codegpt /evaluate to trigger code evaluation process.
• @codegpt /describe to regenerate the summary of the MR.
• @codegpt /secscan to scan security vulnerabilities for the MR or the Repository.
• @codegpt /help to get help.

CodeReview Discussion Chat

There are 2 ways to chat with Starship CodeReview:

• Review comments: Directly reply to a review comment made by StarShip.
  Example:
  • @codegpt How to fix this bug?
• Files and specific lines of code (under the "Files changed" tab):
  Tag @codegpt in a new review comment at the desired location with your query.
  Examples:
  • @codegpt generate unit testing code for this code snippet.

Note: Be mindful of the bot's finite context window.
It's strongly recommended to break down tasks such as reading entire modules into smaller chunks.
For a focused discussion, use review comments to chat about specific files and their changes, instead of using the MR/PR comments.

CodeReview Documentation and Community

• Visit our Documentation
  for detailed information on how to use Starship CodeReview.

About Us:

Visit the OpenCSG StarShip website for the Dashboard and detailed information on CodeReview, CodeGen, and other StarShip modules.

[zhendi]

LGTM

[starship-github]

The StarShip CodeReviewer was triggered but terminated because it encountered an issue: The MR state is not opened.

Tips

CodeReview Commands (invoked as MR or PR comments)

• @codegpt /review to trigger an code review.
• @codegpt /evaluate to trigger code evaluation process.
• @codegpt /describe to regenerate the summary of the MR.
• @codegpt /secscan to scan security vulnerabilities for the MR or the Repository.
• @codegpt /help to get help.

CodeReview Discussion Chat

There are 2 ways to chat with Starship CodeReview:

• Review comments: Directly reply to a review comment made by StarShip.
  Example:
  • @codegpt How to fix this bug?
• Files and specific lines of code (under the "Files changed" tab):
  Tag @codegpt in a new review comment at the desired location with your query.
  Examples:
  • @codegpt generate unit testing code for this code snippet.

Note: Be mindful of the bot's finite context window.
It's strongly recommended to break down tasks such as reading entire modules into smaller chunks.
For a focused discussion, use review comments to chat about specific files and their changes, instead of using the MR/PR comments.

CodeReview Documentation and Community

• Visit our Documentation
  for detailed information on how to use Starship CodeReview.