2026-nccu-blockchain/sroi_frontend

How 2026-nccu-blockchain/sroi_frontend works

SROI is a Vue frontend for account access, form creation and response handling, group/project workspaces, profile and campus-ID workflows, and administrative review. The principal flow is browser navigation through the router to a feature page, which uses feature APIs and the shared HTTP client to exchange data with the backend. Authentication state supports guarded routes and authenticated requests. Several page and workspace implementations were not excerpted, so their internal calls are omitted or marked unverified rather than inferred.

Main entry points: index.ts Route dispatch · http.ts HTTP client · forms.api.ts Forms API · main.ts App bootstrap

Components 18

Application shell

App bootstrap src/app/main.ts
Route dispatch src/app/router/index.ts
Route guards src/app/router/guards.ts
Application layouts src/layouts

Identity and profile

Login and registration src/modules/auth/pages
Authentication state src/modules/auth/store/auth.store.ts
Authentication API src/modules/auth/api/auth.api.ts
Profile and ID requests src/modules/profile

Forms

Forms dashboard src/modules/formdashboard/pages/FormDashboardPage.vue
Form builder src/modules/forms/pages/FormBuilderPage.vue
Response management src/modules/forms/pages/FormResponsesPage.vue
Public form src/modules/forms/pages/PublicFormPage.vue
Forms API src/modules/forms/api/forms.api.ts

Workspace and admin

Groups and projects src/modules/workspace
Administrative review src/modules/admin

Shared API

HTTP client src/shared/api/http.ts

Other components

Browser user
Backend API

Connections 25

Browser user → App bootstrap: opens app src/app/main.ts
App bootstrap → Route dispatch: installs router src/app/main.ts
App bootstrap → Authentication state: initializes store src/app/main.ts
App bootstrap → HTTP client: sets unauthorized handler src/app/main.ts
Route dispatch → Route guards: registers guards src/app/router/index.ts
Route dispatch → Application layouts: selects layout src/app/router/index.ts
Route dispatch → Login and registration: routes to src/app/router/index.ts
Route dispatch → Forms dashboard: routes to src/app/router/index.ts
Route dispatch → Form builder: routes to src/app/router/index.ts
Route dispatch → Response management: routes to src/app/router/index.ts
Route dispatch → Public form: routes to src/app/router/index.ts
Route dispatch → Profile and ID requests: routes to src/app/router/index.ts
Route dispatch → Groups and projects: routes to src/app/router/index.ts
Route dispatch → Administrative review: routes to src/app/router/index.ts
Route guards → Authentication state: checks identity src/app/router/guards.ts
Authentication state → Authentication API: requests login and profile src/modules/auth/store/auth.store.ts
Authentication API → HTTP client: sends requests src/modules/auth/api/auth.api.ts
Forms dashboard → Forms API: loads forms src/modules/formdashboard/pages/FormDashboardPage.vue
Form builder → Forms API: uses form operations src/modules/forms/pages/FormBuilderPage.vue
Response management → Forms API: uses form operations
Public form → Forms API: uses form operations
Forms API → HTTP client: sends requests src/modules/forms/api/forms.api.ts
Groups and projects → HTTP client: uses API client
Administrative review → HTTP client: sends admin requests src/modules/admin/api/admin.api.ts
HTTP client → Backend API: fetches API src/shared/api/http.ts

More Vue diagrams: richard0403/fluxpanel · bluerobotics/blueos · ddiu8081/oreooo · mynameisly/hotelmanagement · 0pandadev/qopy

Drawn by GitDiagram on September 30, 2026 from the repository's file tree, README and source files. Read as Markdown ·