Merge pull request 'feat : ajout download backup' (#2) from feat/387-affichage-download-backup into develop
Reviewed-on: #2
This commit was merged in pull request #2.
This commit is contained in:
BIN
assets/LOGO_CARRE_BLANC.png
Normal file
BIN
assets/LOGO_CARRE_BLANC.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
87
components/BackupButtonSee.vue
Normal file
87
components/BackupButtonSee.vue
Normal file
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="bg-m-secondary w-[250px] h-[259px] rounded-md mx-4 shadow-md/50 shadow-black">
|
||||
<p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
|
||||
Backup
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="select('bitwarden')"
|
||||
>
|
||||
<p class="font-bold uppercase text-xl ml-[24px]">
|
||||
bitwarden
|
||||
</p>
|
||||
<IconifyIcon
|
||||
icon="mdi:eye"
|
||||
class="text-black text-2xl mr-[24px]"
|
||||
/>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="select('inventory')"
|
||||
>
|
||||
<p class="font-bold uppercase text-xl ml-[24px]">
|
||||
inventory
|
||||
</p>
|
||||
<IconifyIcon
|
||||
icon="mdi:eye"
|
||||
class="text-black text-2xl mr-[24px]"
|
||||
/>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="select('sirh')"
|
||||
>
|
||||
<p class="font-bold uppercase text-xl ml-[24px]">
|
||||
sirh
|
||||
</p>
|
||||
<IconifyIcon
|
||||
icon="mdi:eye"
|
||||
class="text-black text-2xl mr-[24px]"
|
||||
/>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="select('ferme')"
|
||||
>
|
||||
<p class="font-bold uppercase text-xl ml-[24px]">
|
||||
ferme
|
||||
</p>
|
||||
<IconifyIcon
|
||||
icon="mdi:eye"
|
||||
class="text-black text-2xl mr-[24px]"
|
||||
/>
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="bg-m-tertiary w-[200px] h-[32px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="select('user')"
|
||||
>
|
||||
<p class="font-bold uppercase text-xl ml-[24px]">
|
||||
user
|
||||
</p>
|
||||
<IconifyIcon
|
||||
icon="mdi:eye"
|
||||
class="text-black text-2xl mr-[24px]"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Icon as IconifyIcon } from "@iconify/vue"
|
||||
|
||||
const emit = defineEmits(["select"])
|
||||
|
||||
const select = (name: string) => {
|
||||
emit("select", name)
|
||||
}
|
||||
</script>
|
||||
|
||||
80
components/BackupList.vue
Normal file
80
components/BackupList.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<div class="bg-m-secondary w-[507px] h-[367px] rounded-md mx-4 shadow-md/50 shadow-black">
|
||||
<p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
|
||||
{{ title }}
|
||||
</p>
|
||||
|
||||
<div v-if="loading">
|
||||
<div
|
||||
v-for="n in 6"
|
||||
:key="`backup-skeleton-${n}`"
|
||||
class="relative w-[483px] h-[39px] mx-3 mb-[10px]"
|
||||
>
|
||||
<ButtonSkeleton custom-class="h-full w-full" />
|
||||
<div class="absolute inset-0 flex items-center justify-between px-3">
|
||||
<TextSkeleton custom-class="h-5 w-[260px]" />
|
||||
<CircleSkeleton custom-class="h-6 w-6 rounded-md" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button
|
||||
v-else
|
||||
v-for="file in backups"
|
||||
:key="file"
|
||||
class="bg-m-tertiary w-[483px] h-[39px] rounded-md shadow-md/50 shadow-m-black mx-3 mb-[10px] flex items-center justify-between cursor-pointer"
|
||||
@click="downloadBackup(file)"
|
||||
>
|
||||
<p class="text-xl ml-3 truncate max-w-[400px]">
|
||||
{{ file }}
|
||||
</p>
|
||||
|
||||
<IconifyIcon
|
||||
icon="mdi:download"
|
||||
class="text-black text-2xl mr-3"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {Icon as IconifyIcon} from "@iconify/vue"
|
||||
import ButtonSkeleton from "~/components/skeleton/ButtonSkeleton.vue"
|
||||
import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
|
||||
import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
|
||||
|
||||
const props = defineProps<{
|
||||
folder: string | null
|
||||
}>()
|
||||
|
||||
const backups = ref<string[]>([])
|
||||
const loading = ref(false)
|
||||
const title = computed(() => {
|
||||
if (!props.folder) return "Backup"
|
||||
return `Liste des backup de ${props.folder.toUpperCase()}`
|
||||
})
|
||||
|
||||
const downloadBackup = (file: string) => {
|
||||
if (!props.folder) return
|
||||
const url = `/api/download?folder=${encodeURIComponent(props.folder)}&file=${encodeURIComponent(file)}`
|
||||
window.location.href = url
|
||||
}
|
||||
|
||||
watch(() => props.folder, async (folder) => {
|
||||
if (!folder) {
|
||||
loading.value = false
|
||||
backups.value = []
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const data = await $fetch<string[]>(`/api/backups?folder=${folder}`)
|
||||
backups.value = data.slice(0, 6)
|
||||
} catch (error) {
|
||||
console.error("Erreur récupération backups:", error)
|
||||
backups.value = []
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@@ -1,33 +1,46 @@
|
||||
<template>
|
||||
<section class="flex flex-col items-center p-4">
|
||||
<p class="text-center text-xl font-semibold uppercase">{{ hostName }}</p>
|
||||
<div class="relative h-[140px] w-[140px]" :class="statusColorClass">
|
||||
<svg class="h-full w-full -rotate-90" viewBox="0 0 120 120" aria-label="Pourcentage restant">
|
||||
<circle
|
||||
class="fill-none stroke-[rgba(255,255,255,0.22)] [stroke-width:10]"
|
||||
cx="60"
|
||||
cy="60"
|
||||
:r="chartRadius"
|
||||
/>
|
||||
<circle
|
||||
class="fill-none stroke-[currentColor] [stroke-linecap:round] [stroke-width:10] transition-[stroke-dashoffset] duration-300"
|
||||
cx="60"
|
||||
cy="60"
|
||||
:r="chartRadius"
|
||||
:style="{ strokeDasharray: `${chartCircumference}`, strokeDashoffset: `${chartOffset}` }"
|
||||
/>
|
||||
</svg>
|
||||
<div class="absolute inset-0 flex flex-col items-center justify-center">
|
||||
<strong class="text-2xl leading-none">{{ remainingPercentText }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="loading">
|
||||
<TextSkeleton custom-class="h-7 w-40" />
|
||||
<CircleSkeleton custom-class="mt-2 h-[140px] w-[140px]" />
|
||||
<BlockSkeleton custom-class="mt-2 h-5 w-36" />
|
||||
</template>
|
||||
|
||||
<p class="mt-1 text-center text-sm font-semibold">{{ usedText }} / {{ totalText }}</p>
|
||||
<template v-else>
|
||||
<p class="text-center text-xl font-semibold uppercase">{{ hostName }}</p>
|
||||
<div class="relative h-[140px] w-[140px]" :class="statusColorClass">
|
||||
<svg class="h-full w-full -rotate-90" viewBox="0 0 120 120" aria-label="Pourcentage restant">
|
||||
<circle
|
||||
class="fill-none stroke-[rgba(255,255,255,0.22)] [stroke-width:10]"
|
||||
cx="60"
|
||||
cy="60"
|
||||
:r="chartRadius"
|
||||
/>
|
||||
<circle
|
||||
class="fill-none stroke-[currentColor] [stroke-linecap:round] [stroke-width:10] transition-[stroke-dashoffset] duration-300"
|
||||
cx="60"
|
||||
cy="60"
|
||||
:r="chartRadius"
|
||||
:style="{ strokeDasharray: `${chartCircumference}`, strokeDashoffset: `${chartOffset}` }"
|
||||
/>
|
||||
</svg>
|
||||
<div class="absolute inset-0 flex flex-col items-center justify-center">
|
||||
<strong class="text-2xl leading-none">{{ remainingPercentText }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="mt-1 text-center text-sm font-semibold">{{ usedText }} / {{ totalText }}</p>
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
|
||||
import BlockSkeleton from "~/components/skeleton/BlockSkeleton.vue"
|
||||
import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
|
||||
|
||||
defineProps<{
|
||||
loading: boolean
|
||||
hostName: string
|
||||
statusColorClass: string
|
||||
chartRadius: number
|
||||
|
||||
19
components/MessageDiscord.vue
Normal file
19
components/MessageDiscord.vue
Normal file
@@ -0,0 +1,19 @@
|
||||
<script setup>
|
||||
const { data: messages } = await useFetch('/api/discord/messages')
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="bg-m-secondary w-auto h-auto mx-4 rounded-md shadow-md/50 shadow-black p-2">
|
||||
<div class="mb-2 flex items-center justify-between">
|
||||
<p class="font-bold text-3xl text-m-tertiary">
|
||||
Speedtest
|
||||
</p>
|
||||
<div v-if="messages">
|
||||
<div v-for="m in messages" :key="m.id">
|
||||
<strong>{{ m.author.username }}</strong>
|
||||
<p>{{ m.content }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="bg-m-secondary w-[509px] h-[184px] mx-4 rounded-md shadow-md/50 shadow-black p-2">
|
||||
<div class="bg-m-secondary w-[507px] h-[184px] mx-4 rounded-md shadow-md/50 shadow-black p-2">
|
||||
<div class="mb-2 flex items-center justify-between">
|
||||
<p class="font-bold text-3xl text-m-tertiary">
|
||||
Speedtest
|
||||
@@ -7,7 +7,7 @@
|
||||
<IconifyIcon
|
||||
icon="mdi:reload"
|
||||
class="bg-m-tertiary text-2xl text-black rounded-md shadow-md/50 mr-1 cursor-pointer"
|
||||
@Click="runTests"
|
||||
@click="runTests"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-3 gap-3">
|
||||
@@ -22,8 +22,11 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="mx-2 flex flex-col items-center justify-center">
|
||||
<span class="text-4xl">
|
||||
{{ download !== null ? `${download}` : "..." }}
|
||||
<template v-if="isTesting">
|
||||
<TextSkeleton custom-class="h-10 w-16 mb-1" />
|
||||
</template>
|
||||
<span v-else class="text-4xl">
|
||||
{{ download !== null ? `${download}` : "--" }}
|
||||
</span>
|
||||
<p class="font-bold text-xl leading-tight">
|
||||
Mbps
|
||||
@@ -41,8 +44,11 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="mx-2 flex flex-col items-center justify-center">
|
||||
<span class="text-4xl">
|
||||
{{ upload !== null ? `${upload}` : "..." }}
|
||||
<template v-if="isTesting">
|
||||
<TextSkeleton custom-class="h-10 w-16 mb-1" />
|
||||
</template>
|
||||
<span v-else class="text-4xl">
|
||||
{{ upload !== null ? `${upload}` : "--" }}
|
||||
</span>
|
||||
<p class="font-bold text-xl leading-tight">
|
||||
Mbps
|
||||
@@ -60,8 +66,11 @@
|
||||
</p>
|
||||
</div>
|
||||
<div class="mx-2 flex flex-col items-center justify-center">
|
||||
<span class="text-4xl">
|
||||
{{ ping !== null ? `${ping}` : "..." }}
|
||||
<template v-if="isTesting">
|
||||
<TextSkeleton custom-class="h-10 w-16 mb-1" />
|
||||
</template>
|
||||
<span v-else class="text-4xl">
|
||||
{{ ping !== null ? `${ping}` : "--" }}
|
||||
</span>
|
||||
<p class="font-bold text-xl leading-tight">
|
||||
Ms
|
||||
@@ -72,12 +81,14 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {onMounted, ref} from "vue";
|
||||
import {ref} from "vue";
|
||||
import {Icon as IconifyIcon} from "@iconify/vue"
|
||||
import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
|
||||
|
||||
const ping = ref<number | null>(null)
|
||||
const download = ref<number | null>(null)
|
||||
const upload = ref<number | null>(null)
|
||||
const isTesting = ref(false)
|
||||
|
||||
async function testDownload() {
|
||||
const start = performance.now()
|
||||
@@ -121,11 +132,17 @@ async function testPing() {
|
||||
}
|
||||
|
||||
async function runTests() {
|
||||
await testDownload()
|
||||
await testUpload()
|
||||
await testPing()
|
||||
isTesting.value = true
|
||||
download.value = null
|
||||
upload.value = null
|
||||
ping.value = null
|
||||
|
||||
try {
|
||||
await testDownload()
|
||||
await testUpload()
|
||||
await testPing()
|
||||
} finally {
|
||||
isTesting.value = false
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
runTests()
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -1,30 +1,51 @@
|
||||
<template>
|
||||
<div class="bg-m-secondary w-[250px] h-auto rounded-md mx-4 shadow-md/50 shadow-black pb-4">
|
||||
<div class="bg-m-secondary w-[250px] h-[292px] rounded-md mx-4 shadow-md/50 shadow-black">
|
||||
<p class="font-bold text-3xl text-m-tertiary my-1 mx-3">
|
||||
Status
|
||||
</p>
|
||||
<div
|
||||
class="bg-m-tertiary w-[200px] h-auto rounded-md shadow-md/50 shadow-m-black mx-[25px] mb-3"
|
||||
<template v-if="loading">
|
||||
<div
|
||||
v-for="n in 3"
|
||||
:key="`skeleton-${n}`"
|
||||
class="relative w-[200px] h-[68px] rounded-md mx-[25px] mb-3"
|
||||
>
|
||||
<ButtonSkeleton custom-class="h-full w-full" />
|
||||
<div class="absolute inset-0 p-2">
|
||||
<TextSkeleton custom-class="h-5 w-24 mb-2" />
|
||||
<div class="flex items-center gap-2">
|
||||
<CircleSkeleton custom-class="h-6 w-6" />
|
||||
<TextSkeleton custom-class="h-5 w-20" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div
|
||||
v-else
|
||||
class="bg-m-tertiary w-[200px] h-[68px] rounded-md shadow-md/50 shadow-m-black mx-[25px] mb-3"
|
||||
v-for="row in rows"
|
||||
:key="`${row.label}-${row.url}`"
|
||||
>
|
||||
<p class="font-bold text-xl text-m-text mt-2 mx-2 mb-1">
|
||||
{{ row.label }}
|
||||
</p>
|
||||
<div class="mx-2 flex items-center">
|
||||
<span
|
||||
class="inline-block h-[24px] w-[24px] rounded-full mr-2"
|
||||
:class="statusClass(row.status)"
|
||||
/>
|
||||
<span class="font-semibold text-lg">
|
||||
{{ statusLabel(row.status) }}
|
||||
</span>
|
||||
>
|
||||
<p class="font-bold text-xl text-m-text mt-2 mx-2 mb-1">
|
||||
{{ row.label }}
|
||||
</p>
|
||||
<div class="mx-2 flex items-center">
|
||||
<span
|
||||
class="inline-block h-[24px] w-[24px] rounded-full mr-2"
|
||||
:class="statusClass(row.status)"
|
||||
/>
|
||||
<span class="font-semibold text-lg">
|
||||
{{ statusLabel(row.status) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import ButtonSkeleton from "~/components/skeleton/ButtonSkeleton.vue"
|
||||
import CircleSkeleton from "~/components/skeleton/CircleSkeleton.vue"
|
||||
import TextSkeleton from "~/components/skeleton/TextSkeleton.vue"
|
||||
import {onBeforeUnmount, onMounted, ref} from "vue"
|
||||
|
||||
interface StatusRow {
|
||||
@@ -52,6 +73,8 @@ const props = withDefaults(
|
||||
)
|
||||
|
||||
const rows = ref<StatusRow[]>([])
|
||||
const loading = ref(true)
|
||||
const initialized = ref(false)
|
||||
let timer: ReturnType<typeof setInterval> | null = null
|
||||
|
||||
const statusClass = (status: number) => {
|
||||
@@ -67,6 +90,9 @@ const statusLabel = (status: number) => {
|
||||
}
|
||||
|
||||
const checkStatus = async () => {
|
||||
if (!initialized.value) {
|
||||
loading.value = true
|
||||
}
|
||||
try {
|
||||
const data = await $fetch<StatusResponse>(props.endpoint)
|
||||
rows.value = data.results
|
||||
@@ -81,6 +107,9 @@ const checkStatus = async () => {
|
||||
error: error instanceof Error ? error.message : String(error)
|
||||
}
|
||||
]
|
||||
} finally {
|
||||
initialized.value = true
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
14
components/skeleton/BlockSkeleton.vue
Normal file
14
components/skeleton/BlockSkeleton.vue
Normal file
@@ -0,0 +1,14 @@
|
||||
<template>
|
||||
<div class="animate-pulse rounded-md bg-m-tertiary/70" :class="customClass" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
customClass?: string
|
||||
}>(),
|
||||
{
|
||||
customClass: "h-4 w-full"
|
||||
}
|
||||
)
|
||||
</script>
|
||||
17
components/skeleton/ButtonSkeleton.vue
Normal file
17
components/skeleton/ButtonSkeleton.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<div
|
||||
class="animate-pulse rounded-md bg-m-tertiary/70 shadow-md/50 shadow-m-black"
|
||||
:class="customClass"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
customClass?: string
|
||||
}>(),
|
||||
{
|
||||
customClass: "h-[39px] w-full"
|
||||
}
|
||||
)
|
||||
</script>
|
||||
14
components/skeleton/CircleSkeleton.vue
Normal file
14
components/skeleton/CircleSkeleton.vue
Normal file
@@ -0,0 +1,14 @@
|
||||
<template>
|
||||
<div class="animate-pulse rounded-full bg-m-tertiary/70" :class="customClass" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
customClass?: string
|
||||
}>(),
|
||||
{
|
||||
customClass: "h-10 w-10"
|
||||
}
|
||||
)
|
||||
</script>
|
||||
14
components/skeleton/TextSkeleton.vue
Normal file
14
components/skeleton/TextSkeleton.vue
Normal file
@@ -0,0 +1,14 @@
|
||||
<template>
|
||||
<div class="animate-pulse rounded bg-m-tertiary/70" :class="customClass" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
customClass?: string
|
||||
}>(),
|
||||
{
|
||||
customClass: "h-5 w-24"
|
||||
}
|
||||
)
|
||||
</script>
|
||||
@@ -1,10 +1,11 @@
|
||||
<template>
|
||||
<NuxtLayout name="default">
|
||||
<template #sidebar>
|
||||
<div class="flex flex-col gap-">
|
||||
<div class="flex flex-col">
|
||||
<DiagramStorage
|
||||
v-for="item in diagramItems"
|
||||
:key="item.key"
|
||||
:loading="loading"
|
||||
:host-name="item.hostName"
|
||||
:status-color-class="item.statusColorClass"
|
||||
:chart-radius="chartRadius"
|
||||
@@ -18,16 +19,23 @@
|
||||
</template>
|
||||
|
||||
<p class="font-bold text-4xl my-6 mx-4">Écran de monitoring</p>
|
||||
|
||||
<div class="flex">
|
||||
<StatusSite/>
|
||||
<Speedtest/>
|
||||
<div class="flex flex-col gap-4">
|
||||
<StatusSite />
|
||||
<BackupButtonSee @select="selectedBackup = $event" />
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-4">
|
||||
<Speedtest />
|
||||
<BackupList :folder="selectedBackup" />
|
||||
<MessageDiscord/>
|
||||
</div>
|
||||
</div>
|
||||
</NuxtLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Speedtest from "~/components/Speedtest.vue";
|
||||
|
||||
definePageMeta({layout: false})
|
||||
import {computed, onMounted, ref} from "vue"
|
||||
|
||||
@@ -38,6 +46,7 @@ type DiskApiResponse = {
|
||||
local?: string | DiskCommandResult
|
||||
}
|
||||
|
||||
const selectedBackup = ref<string | null>(null)
|
||||
const rawResults = ref<Record<SourceKey, string>>({
|
||||
remote: "",
|
||||
local: ""
|
||||
|
||||
156
server/api/backups.get.ts
Normal file
156
server/api/backups.get.ts
Normal file
@@ -0,0 +1,156 @@
|
||||
import { execFile } from "node:child_process"
|
||||
|
||||
const REMOTE_HOST = process.env.BACKUPS_REMOTE_HOST || "malio-b@192.168.0.179"
|
||||
const REMOTE_ROOT = process.env.BACKUPS_REMOTE_ROOT || "/home/malio-b/backups"
|
||||
const MAX_FILES_PER_FOLDER = Number(process.env.BACKUPS_MAX_FILES || "200")
|
||||
const isSafeFolder = (value: string) => /^[a-zA-Z0-9._-]+$/.test(value)
|
||||
const shellQuote = (value: string) => `'${value.replace(/'/g, `'\\''`)}'`
|
||||
const FOLDER_MAP: Record<string, string> = {
|
||||
ferme: "bdd_recette/ferme",
|
||||
inventory: "bdd_recette/inventory",
|
||||
sirh: "bdd_recette/sirh",
|
||||
user: "bdd_recette/user",
|
||||
bitwarden: "bitwarden"
|
||||
}
|
||||
|
||||
function runSsh(command: string): Promise<string> {
|
||||
return new Promise((resolve, reject) => {
|
||||
execFile(
|
||||
"ssh",
|
||||
["-o", "BatchMode=yes", "-o", "ConnectTimeout=5", REMOTE_HOST, command],
|
||||
{ maxBuffer: 10 * 1024 * 1024 },
|
||||
(error, stdout, stderr) => {
|
||||
if (error) {
|
||||
reject(stderr || error.message)
|
||||
return
|
||||
}
|
||||
resolve(stdout)
|
||||
}
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
function isMissingPathError(error: unknown): boolean {
|
||||
const message = String(error || "").toLowerCase()
|
||||
return message.includes("no such file or directory") || message.includes("cannot access")
|
||||
}
|
||||
|
||||
function toServerError(error: unknown) {
|
||||
return createError({
|
||||
statusCode: 500,
|
||||
statusMessage: `Erreur SSH backups: ${String(error)}`
|
||||
})
|
||||
}
|
||||
|
||||
function parseLines(output: string): string[] {
|
||||
return output
|
||||
.split("\n")
|
||||
.map((line) => line.trim())
|
||||
.filter(Boolean)
|
||||
}
|
||||
|
||||
function quoteDir(pathValue: string) {
|
||||
return shellQuote(pathValue)
|
||||
}
|
||||
|
||||
async function listRemoteFiles(remoteDir: string): Promise<string[]> {
|
||||
const output = await runSsh(
|
||||
`cd ${quoteDir(remoteDir)} && ls -1A | sort -r | head -n ${MAX_FILES_PER_FOLDER}`
|
||||
)
|
||||
return parseLines(output)
|
||||
}
|
||||
|
||||
async function listRemoteDirs(remoteRoot: string): Promise<string[]> {
|
||||
const output = await runSsh(
|
||||
`cd ${quoteDir(remoteRoot)} && for d in */; do [ -d "$d" ] && printf '%s\n' "\${d%/}"; done`
|
||||
)
|
||||
return parseLines(output)
|
||||
}
|
||||
|
||||
async function getLatestRemoteFile(remoteDir: string): Promise<string | null> {
|
||||
const output = await runSsh(
|
||||
`cd ${quoteDir(remoteDir)} && ls -1A | sort -r | head -n 1`
|
||||
)
|
||||
const files = parseLines(output)
|
||||
return files[0] || null
|
||||
}
|
||||
|
||||
async function remoteDirExists(remoteDir: string): Promise<boolean> {
|
||||
const output = await runSsh(`[ -d ${quoteDir(remoteDir)} ] && echo yes || echo no`)
|
||||
return output.trim() === "yes"
|
||||
}
|
||||
|
||||
async function resolveFolderRemoteDir(folderName: string): Promise<string | null> {
|
||||
const mapped = FOLDER_MAP[folderName]
|
||||
if (mapped) {
|
||||
return `${REMOTE_ROOT}/${mapped}`
|
||||
}
|
||||
|
||||
const direct = `${REMOTE_ROOT}/${folderName}`
|
||||
if (await remoteDirExists(direct)) {
|
||||
return direct
|
||||
}
|
||||
|
||||
const nested = `${REMOTE_ROOT}/bdd_recette/${folderName}`
|
||||
if (await remoteDirExists(nested)) {
|
||||
return nested
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
export default defineEventHandler(async (event) => {
|
||||
const { folder } = getQuery(event)
|
||||
const folderName = typeof folder === "string" ? folder : null
|
||||
|
||||
// Si un dossier est demandé, on retourne sa liste de fichiers.
|
||||
if (folderName) {
|
||||
if (!isSafeFolder(folderName)) {
|
||||
throw createError({
|
||||
statusCode: 400,
|
||||
statusMessage: "Paramètre folder invalide"
|
||||
})
|
||||
}
|
||||
|
||||
const remoteDir = await resolveFolderRemoteDir(folderName)
|
||||
if (!remoteDir) return []
|
||||
|
||||
try {
|
||||
return await listRemoteFiles(remoteDir)
|
||||
} catch (error) {
|
||||
if (isMissingPathError(error)) return []
|
||||
throw toServerError(error)
|
||||
}
|
||||
}
|
||||
|
||||
// Sinon on récupère le dernier backup de chaque dossier distant.
|
||||
let dirs: string[] = []
|
||||
try {
|
||||
dirs = await listRemoteDirs(REMOTE_ROOT)
|
||||
} catch (error) {
|
||||
throw toServerError(error)
|
||||
}
|
||||
|
||||
const result: Array<{ folder: string; last: string | null }> = []
|
||||
|
||||
for (const dirName of dirs) {
|
||||
const remoteDir = `${REMOTE_ROOT}/${dirName}`
|
||||
try {
|
||||
result.push({
|
||||
folder: dirName,
|
||||
last: await getLatestRemoteFile(remoteDir)
|
||||
})
|
||||
} catch (error) {
|
||||
if (isMissingPathError(error)) {
|
||||
result.push({
|
||||
folder: dirName,
|
||||
last: null
|
||||
})
|
||||
continue
|
||||
}
|
||||
throw toServerError(error)
|
||||
}
|
||||
}
|
||||
|
||||
return result
|
||||
})
|
||||
15
server/api/discord/messages.get.ts
Normal file
15
server/api/discord/messages.get.ts
Normal file
@@ -0,0 +1,15 @@
|
||||
export default defineEventHandler(async () => {
|
||||
const token = process.env.DISCORD_BOT_TOKEN
|
||||
const channel = process.env.DISCORD_CHANNEL_ID
|
||||
|
||||
const messages = await $fetch(
|
||||
`https://discord.com/api/v10/channels/${channel}/messages?limit=20`,
|
||||
{
|
||||
headers: {
|
||||
Authorization: `Bot ${token}`
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
return messages
|
||||
})
|
||||
@@ -1,25 +1,136 @@
|
||||
import { execFile, spawn } from "node:child_process"
|
||||
import { Readable } from "node:stream"
|
||||
|
||||
export default defineEventHandler((event) => {
|
||||
const size = 128 * 1024 * 1024
|
||||
let sent = 0
|
||||
const REMOTE_HOST = process.env.BACKUPS_REMOTE_HOST || "malio-b@192.168.0.179"
|
||||
const REMOTE_ROOT = process.env.BACKUPS_REMOTE_ROOT || "/home/malio-b/backups"
|
||||
const FOLDER_MAP: Record<string, string> = {
|
||||
ferme: "bdd_recette/ferme",
|
||||
inventory: "bdd_recette/inventory",
|
||||
sirh: "bdd_recette/sirh",
|
||||
user: "bdd_recette/user",
|
||||
bitwarden: "bitwarden"
|
||||
}
|
||||
|
||||
const stream = new Readable({
|
||||
read(chunkSize) {
|
||||
if (sent >= size) {
|
||||
this.push(null)
|
||||
return
|
||||
}
|
||||
const isSafeFolder = (value: string) => /^[a-zA-Z0-9._-]+$/.test(value)
|
||||
const isSafeFile = (value: string) => /^[^/\\]+$/.test(value)
|
||||
const shellQuote = (value: string) => `'${value.replace(/'/g, `'\\''`)}'`
|
||||
|
||||
const remaining = size - sent
|
||||
const chunk = Buffer.alloc(Math.min(chunkSize, remaining), "a")
|
||||
sent += chunk.length
|
||||
this.push(chunk)
|
||||
function runSsh(command: string): Promise<string> {
|
||||
return new Promise((resolve, reject) => {
|
||||
execFile(
|
||||
"ssh",
|
||||
["-o", "BatchMode=yes", "-o", "ConnectTimeout=5", REMOTE_HOST, command],
|
||||
{ maxBuffer: 5 * 1024 * 1024 },
|
||||
(error, stdout, stderr) => {
|
||||
if (error) {
|
||||
reject(stderr || error.message)
|
||||
return
|
||||
}
|
||||
})
|
||||
resolve(stdout)
|
||||
}
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
setHeader(event, "Content-Type", "application/octet-stream")
|
||||
setHeader(event, "Content-Length", size)
|
||||
async function remoteDirExists(remoteDir: string): Promise<boolean> {
|
||||
const output = await runSsh(`[ -d ${shellQuote(remoteDir)} ] && echo yes || echo no`)
|
||||
return output.trim() === "yes"
|
||||
}
|
||||
|
||||
return stream
|
||||
})
|
||||
async function resolveFolderRemoteDir(folderName: string): Promise<string | null> {
|
||||
const mapped = FOLDER_MAP[folderName]
|
||||
if (mapped) {
|
||||
return `${REMOTE_ROOT}/${mapped}`
|
||||
}
|
||||
|
||||
const direct = `${REMOTE_ROOT}/${folderName}`
|
||||
if (await remoteDirExists(direct)) {
|
||||
return direct
|
||||
}
|
||||
|
||||
const nested = `${REMOTE_ROOT}/bdd_recette/${folderName}`
|
||||
if (await remoteDirExists(nested)) {
|
||||
return nested
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
function buildContentDisposition(fileName: string) {
|
||||
const asciiName = fileName.replace(/[^\x20-\x7E]/g, "_").replace(/["\\]/g, "_")
|
||||
return `attachment; filename="${asciiName}"; filename*=UTF-8''${encodeURIComponent(fileName)}`
|
||||
}
|
||||
|
||||
function speedtestStream(event: any) {
|
||||
const size = 128 * 1024 * 1024
|
||||
let sent = 0
|
||||
|
||||
const stream = new Readable({
|
||||
read(chunkSize) {
|
||||
if (sent >= size) {
|
||||
this.push(null)
|
||||
return
|
||||
}
|
||||
|
||||
const remaining = size - sent
|
||||
const chunk = Buffer.alloc(Math.min(chunkSize, remaining), "a")
|
||||
sent += chunk.length
|
||||
this.push(chunk)
|
||||
}
|
||||
})
|
||||
|
||||
setHeader(event, "Content-Type", "application/octet-stream")
|
||||
setHeader(event, "Content-Length", size)
|
||||
return stream
|
||||
}
|
||||
|
||||
export default defineEventHandler(async (event) => {
|
||||
const { folder, file } = getQuery(event)
|
||||
const folderName = typeof folder === "string" ? folder : null
|
||||
const fileName = typeof file === "string" ? file : null
|
||||
|
||||
// Compat mode: utilisé par le test de débit.
|
||||
if (!folderName || !fileName) {
|
||||
return speedtestStream(event)
|
||||
}
|
||||
|
||||
if (!isSafeFolder(folderName) || !isSafeFile(fileName)) {
|
||||
throw createError({ statusCode: 400, statusMessage: "Paramètres invalides" })
|
||||
}
|
||||
|
||||
const remoteDir = await resolveFolderRemoteDir(folderName)
|
||||
if (!remoteDir) {
|
||||
throw createError({ statusCode: 404, statusMessage: "Dossier introuvable" })
|
||||
}
|
||||
|
||||
const remotePath = `${remoteDir}/${fileName}`
|
||||
const existsOutput = await runSsh(`[ -f ${shellQuote(remotePath)} ] && echo yes || echo no`)
|
||||
if (existsOutput.trim() !== "yes") {
|
||||
throw createError({ statusCode: 404, statusMessage: "Fichier introuvable" })
|
||||
}
|
||||
|
||||
setHeader(event, "Content-Type", "application/octet-stream")
|
||||
setHeader(event, "Content-Disposition", buildContentDisposition(fileName))
|
||||
|
||||
const child = spawn("ssh", [
|
||||
"-o",
|
||||
"BatchMode=yes",
|
||||
"-o",
|
||||
"ConnectTimeout=5",
|
||||
REMOTE_HOST,
|
||||
`cat ${shellQuote(remotePath)}`
|
||||
])
|
||||
|
||||
let stderr = ""
|
||||
child.stderr.on("data", (chunk) => {
|
||||
stderr += chunk.toString()
|
||||
})
|
||||
|
||||
child.on("close", (code) => {
|
||||
if (code !== 0) {
|
||||
console.error(`Erreur téléchargement SSH (${code}): ${stderr}`)
|
||||
}
|
||||
})
|
||||
|
||||
return sendStream(event, child.stdout)
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user