mirror of
https://github.com/headporter81/specialsource-homepage-frontend.git
synced 2026-08-08 15:21:11 +09:00
This commit is contained in:
@@ -3,29 +3,16 @@ import { computed } from 'vue';
|
|||||||
|
|
||||||
// [Props 정의]
|
// [Props 정의]
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
// 현재 진행 값
|
progress: { type: Number, required: true, default: 0 },
|
||||||
progress: {
|
total: { type: Number, default: 100 },
|
||||||
type: Number,
|
status: { type: String, default: 'Initializing...' },
|
||||||
required: true,
|
barLength: { type: Number, default: 30 },
|
||||||
default: 0
|
|
||||||
},
|
username: {
|
||||||
// 총량
|
|
||||||
total: {
|
|
||||||
type: Number,
|
|
||||||
default: 100
|
|
||||||
},
|
|
||||||
// 하단에 표시할 상태 메시지
|
|
||||||
status: {
|
|
||||||
type: String,
|
type: String,
|
||||||
default: 'Initializing...'
|
default: 'anonymous'
|
||||||
},
|
|
||||||
// 막대의 총 글자 길이
|
|
||||||
barLength: {
|
|
||||||
type: Number,
|
|
||||||
default: 30
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// [핵심 로직: Computed로 실시간 계산]
|
// [핵심 로직: Computed로 실시간 계산]
|
||||||
|
|
||||||
// 1. 퍼센트 계산 (0 ~ 100, 소수점 버림)
|
// 1. 퍼센트 계산 (0 ~ 100, 소수점 버림)
|
||||||
@@ -51,7 +38,7 @@ const barString = computed(() => {
|
|||||||
<template>
|
<template>
|
||||||
<div class="tui-window">
|
<div class="tui-window">
|
||||||
<div class="tui-header">
|
<div class="tui-header">
|
||||||
<span class="tui-prompt">porter@specialsource-nas:~$</span>
|
<span class="tui-prompt">{{ username }}@specialsource-nas:~$</span>
|
||||||
<span class="tui-cmd">deploy-service --watch</span>
|
<span class="tui-cmd">deploy-service --watch</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
+17
-5
@@ -6,7 +6,7 @@
|
|||||||
<span class="brand">SPECIALSOURCE.SYSTEM</span>
|
<span class="brand">SPECIALSOURCE.SYSTEM</span>
|
||||||
|
|
||||||
<select v-model="activeTheme" class="theme-selector">
|
<select v-model="activeTheme" class="theme-selector">
|
||||||
<option value="green">P3_GREEN (기본)</option>
|
<option value="green">P3_GREEN (녹색)</option>
|
||||||
<option value="amber">HERCULES (호박)</option>
|
<option value="amber">HERCULES (호박)</option>
|
||||||
<option value="vga">VGA_GRAY (회색)</option>
|
<option value="vga">VGA_GRAY (회색)</option>
|
||||||
<option value="ega">EGA_CYAN (청록)</option>
|
<option value="ega">EGA_CYAN (청록)</option>
|
||||||
@@ -144,7 +144,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted, computed } from 'vue';
|
import { ref, onMounted, computed, watch } from 'vue'
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import TuiProgressBar from '@/components/TuiProgressBar.vue';
|
import TuiProgressBar from '@/components/TuiProgressBar.vue';
|
||||||
|
|
||||||
@@ -157,7 +157,7 @@ const loginPw = ref('');
|
|||||||
|
|
||||||
const activeMenu = ref('main');
|
const activeMenu = ref('main');
|
||||||
const authToken = ref(localStorage.getItem('token'));
|
const authToken = ref(localStorage.getItem('token'));
|
||||||
const activeTheme = ref('green');
|
const activeTheme = ref(localStorage.getItem('theme') || 'green');
|
||||||
|
|
||||||
const isProcessing = ref(false);
|
const isProcessing = ref(false);
|
||||||
const overlayProgress = ref(0);
|
const overlayProgress = ref(0);
|
||||||
@@ -171,7 +171,7 @@ const menuItems = [
|
|||||||
{ id: 'contact', name: 'CONTACT' }
|
{ id: 'contact', name: 'CONTACT' }
|
||||||
];
|
];
|
||||||
|
|
||||||
const isLoggedIn = computed(() => !!authToken.value);
|
const loggedInUser = ref(localStorage.getItem('username') || 'anonymous');
|
||||||
|
|
||||||
const rawAscii = `
|
const rawAscii = `
|
||||||
███████╗██████╗ ███████╗ ██████╗██╗ █████╗ ██╗
|
███████╗██████╗ ███████╗ ██████╗██╗ █████╗ ██╗
|
||||||
@@ -344,6 +344,12 @@ const handleLoginSubmit = async () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
if (response.data && response.data.token) {
|
if (response.data && response.data.token) {
|
||||||
|
|
||||||
|
localStorage.setItem('token', response.data.token);
|
||||||
|
// 🟢 [NEW] 로컬 스토리지와 변수에 로그인한 ID 세이브
|
||||||
|
localStorage.setItem('username', loginId.value);
|
||||||
|
loggedInUser.value = loginId.value;
|
||||||
|
|
||||||
overlayProgress.value = 85;
|
overlayProgress.value = 85;
|
||||||
overlayStatus.value = 'Access Granted. Generating JWT Session token...';
|
overlayStatus.value = 'Access Granted. Generating JWT Session token...';
|
||||||
|
|
||||||
@@ -352,6 +358,8 @@ const handleLoginSubmit = async () => {
|
|||||||
|
|
||||||
if (termInstance.value) {
|
if (termInstance.value) {
|
||||||
termInstance.value.echo(`[[b;var(--tui-color);][SUCCESS]] ACCESS GRANTED. CREDENTIALS VERIFIED.`);
|
termInstance.value.echo(`[[b;var(--tui-color);][SUCCESS]] ACCESS GRANTED. CREDENTIALS VERIFIED.`);
|
||||||
|
// 🟢 [NEW] 하단 CRT 터미널 프롬프트도 내 아이디로 동적 변경!
|
||||||
|
termInstance.value.set_prompt(`${loginId.value}@specialsource:~$ `);
|
||||||
}
|
}
|
||||||
|
|
||||||
overlayProgress.value = 100;
|
overlayProgress.value = 100;
|
||||||
@@ -389,10 +397,14 @@ onMounted(() => {
|
|||||||
'email': function () { this.echo('specialsource.company@gmail.com'); },
|
'email': function () { this.echo('specialsource.company@gmail.com'); },
|
||||||
}, {
|
}, {
|
||||||
greetings: `[SYSTEM V3.2] INTERFACE ONLINE. TYPE 'help' FOR COMMANDS.`,
|
greetings: `[SYSTEM V3.2] INTERFACE ONLINE. TYPE 'help' FOR COMMANDS.`,
|
||||||
prompt: 'admin@specialsource:~$ '
|
prompt: `${loggedInUser.value}@specialsource:~$ `
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
watch(activeTheme, (newTheme) => {
|
||||||
|
localStorage.setItem('theme', newTheme);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
Reference in New Issue
Block a user