Scaffold SSR site with CMS/blog/gallery/SEO admin and deploy configs for montech.ir. Co-authored-by: Cursor <cursoragent@cursor.com>
60 lines
1.6 KiB
Vue
60 lines
1.6 KiB
Vue
<template>
|
|
<div>
|
|
<h1>رسانه</h1>
|
|
<form class="card" style="margin-bottom: 1rem" @submit.prevent="upload">
|
|
<input type="file" @change="onFile" />
|
|
<button class="btn" :disabled="!file">آپلود</button>
|
|
<p v-if="msg" class="muted">{{ msg }}</p>
|
|
</form>
|
|
<table class="table">
|
|
<thead>
|
|
<tr><th>فایل</th><th>URL</th><th>حجم</th><th></th></tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="m in items" :key="m.id">
|
|
<td>{{ m.filename }}</td>
|
|
<td class="muted" dir="ltr">{{ m.url }}</td>
|
|
<td>{{ Math.round(m.size / 1024) }} KB</td>
|
|
<td><button class="btn danger" @click="remove(m.id)">حذف</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onMounted, ref } from "vue";
|
|
import { api } from "../lib/api";
|
|
|
|
const items = ref<any[]>([]);
|
|
const file = ref<File | null>(null);
|
|
const msg = ref("");
|
|
|
|
async function load() {
|
|
const { data } = await api.get("/admin/media");
|
|
items.value = data;
|
|
}
|
|
onMounted(load);
|
|
|
|
function onFile(e: Event) {
|
|
const input = e.target as HTMLInputElement;
|
|
file.value = input.files?.[0] || null;
|
|
}
|
|
|
|
async function upload() {
|
|
if (!file.value) return;
|
|
const fd = new FormData();
|
|
fd.append("file", file.value);
|
|
const { data } = await api.post("/admin/media/upload", fd);
|
|
msg.value = `آپلود شد: ${data.url}`;
|
|
file.value = null;
|
|
await load();
|
|
}
|
|
|
|
async function remove(id: string) {
|
|
if (!confirm("حذف شود؟")) return;
|
|
await api.delete(`/admin/media/${id}`);
|
|
await load();
|
|
}
|
|
</script>
|