feat(modpack): added curseforge import by url

This commit is contained in:
2025-06-19 16:57:17 +03:00
parent ad2e2e80cb
commit 5c3df7a2a4

View File

@@ -14,24 +14,39 @@
</select>
</div>
<div class="form-group">
<label>Метод импорта</label>
<div class="radio-group">
<label><input type="radio" v-model="form.importMethod" value="file" /> Файл</label>
<label
><input type="radio" v-model="form.importMethod" value="url" :disabled="form.importerType !== 'curseforge'" />
URL</label
>
</div>
</div>
<!-- Поля для метаданных -->
<div class="form-group">
<label for="name">Системное имя (латиница, без пробелов)</label>
<input id="name" v-model="form.name" type="text" required pattern="^[a-zA-Z0-9_]+$" />
</div>
<div class="form-group">
<label for="displayName">Отображаемое имя</label>
<input id="displayName" v-model="form.displayName" type="text" required />
</div>
<div class="form-group">
<label for="mcVersion">Версия Minecraft</label>
<input id="mcVersion" v-model="form.mcVersion" type="text" required />
</div>
<div class="form-group">
<!-- Поля для источника -->
<div v-if="form.importMethod === 'file'" class="form-group">
<label for="modpack-file">Файл модпака (.zip)</label>
<input id="modpack-file" type="file" @change="onFileSelected" required accept=".zip" />
<input id="modpack-file" type="file" @change="onFileSelected" :required="form.importMethod === 'file'" accept=".zip" />
</div>
<div v-if="form.importMethod === 'url'" class="form-group">
<label for="sourceUrl">URL страницы модпака на CurseForge</label>
<input id="sourceUrl" v-model="form.sourceUrl" type="url" :required="form.importMethod === 'url'" />
</div>
<div v-if="error" class="error-message">{{ error }}</div>
@@ -46,7 +61,7 @@
</template>
<script setup lang="ts">
import { ref, reactive } from "vue";
import { ref, reactive, watch } from "vue";
import apiClient from "@/api/axios";
const form = reactive({
@@ -54,13 +69,24 @@ const form = reactive({
displayName: "",
mcVersion: "",
file: null as File | null,
importerType: "simple", // Тип импортера по умолчанию
importerType: "simple",
importMethod: "file",
sourceUrl: "",
});
const isLoading = ref(false);
const error = ref<string | null>(null);
const successMessage = ref<string | null>(null);
watch(
() => form.importerType,
(newType) => {
if (newType !== "curseforge" && form.importMethod === "url") {
form.importMethod = "file";
}
},
);
const onFileSelected = (event: Event) => {
const target = event.target as HTMLInputElement;
if (target.files && target.files[0]) {
@@ -69,10 +95,14 @@ const onFileSelected = (event: Event) => {
};
const handleImport = async () => {
if (!form.file) {
if (form.importMethod === "file" && !form.file) {
error.value = "Пожалуйста, выберите файл для импорта.";
return;
}
if (form.importMethod === "url" && !form.sourceUrl) {
error.value = "Пожалуйста, введите URL.";
return;
}
isLoading.value = true;
error.value = null;
@@ -82,9 +112,14 @@ const handleImport = async () => {
formData.append("name", form.name);
formData.append("displayName", form.displayName);
formData.append("mcVersion", form.mcVersion);
formData.append("file", form.file);
formData.append("importerType", form.importerType);
formData.append("importMethod", "file"); // Пока поддерживаем только импорт файла
formData.append("importMethod", form.importMethod);
if (form.importMethod === "file" && form.file) {
formData.append("file", form.file);
} else if (form.importMethod === "url") {
formData.append("sourceUrl", form.sourceUrl);
}
try {
const response = await apiClient.post("/admin/modpacks/import", formData, {
@@ -122,6 +157,10 @@ const handleImport = async () => {
padding: 0.5rem;
box-sizing: border-box;
}
.radio-group label {
display: inline-block;
margin-right: 1rem;
}
.error-message,
.success-message {
margin-top: 1rem;