Project: NOVA LAB Control Panel

Congratulations, cadet! We've reached the final project of the first module at NOVA LAB station. Time to combine all the skills you've learned into one functional system.

Project Goal

Build a complete NOVA LAB Control Panel - a Vue.js application that combines all concepts from this module:

• Vue.js and Vite - modern reactive framework
• Single File Components - code organization in .vue files
• Application structure - proper component hierarchy
• Vue DevTools - diagnostic tools for debugging

Project Requirements

Your Control Panel should include:

1. Station status section

Display the station name, current status (ONLINE/OFFLINE), and last update date. Use Vue interpolation to display data.

2. Station module list

Create an array with at least 4 station modules (e.g., Laboratory, Reactor, Communications, Navigation). Each module should have a name, status, and energy level.

3. Component styling

Use the `<style scoped>` section to give the application a space panel look - dark background, neon colors, futuristic design.

Tips

• Start with the `<script setup>` section with reactive data
• Use `ref()` for simple values and `reactive()` for objects
• Remember the `<template>` section with proper Vue syntax
• Add `<style scoped>` at the end of the component

Experiment with the code below and expand it with your own ideas!