112 lines
3.8 KiB
Vue
112 lines
3.8 KiB
Vue
<script setup lang="ts">
|
||
import { formatDateTime } from '@/utils/datetime'
|
||
/** 软件版本管理页:客户端版本列表 + 上传新版本。 */
|
||
import { onMounted, ref } from 'vue'
|
||
import { ElMessage } from 'element-plus'
|
||
import { fetchSoftwareVersions, uploadSoftwareVersion } from './version-api.ts'
|
||
import type { SoftwareVersionItem } from './version-dto.ts'
|
||
import { isNonEmptyVersion } from './version-dto.ts'
|
||
|
||
const loading = ref(false)
|
||
const items = ref<SoftwareVersionItem[]>([])
|
||
|
||
const uploadVisible = ref(false)
|
||
const uploading = ref(false)
|
||
const newVersion = ref('')
|
||
const pickedFile = ref<File | null>(null)
|
||
|
||
async function load() {
|
||
loading.value = true
|
||
try {
|
||
items.value = (await fetchSoftwareVersions()).items
|
||
} catch (error) {
|
||
ElMessage.error(error instanceof Error ? error.message : '版本列表加载失败')
|
||
} finally {
|
||
loading.value = false
|
||
}
|
||
}
|
||
|
||
function onFileChange(file: File) {
|
||
pickedFile.value = file
|
||
}
|
||
|
||
async function submitUpload() {
|
||
if (!isNonEmptyVersion(newVersion.value)) {
|
||
ElMessage.warning('版本号不能为空')
|
||
return
|
||
}
|
||
if (!pickedFile.value) {
|
||
ElMessage.warning('请选择程序压缩包')
|
||
return
|
||
}
|
||
uploading.value = true
|
||
try {
|
||
await uploadSoftwareVersion(newVersion.value.trim(), pickedFile.value, pickedFile.value.name)
|
||
ElMessage.success('上传成功')
|
||
uploadVisible.value = false
|
||
newVersion.value = ''
|
||
pickedFile.value = null
|
||
load()
|
||
} catch (error) {
|
||
ElMessage.error(error instanceof Error ? error.message : '上传失败')
|
||
} finally {
|
||
uploading.value = false
|
||
}
|
||
}
|
||
|
||
onMounted(load)
|
||
</script>
|
||
|
||
<template>
|
||
<div class="page-stack">
|
||
<div class="page-heading">
|
||
<div>
|
||
<h2>软件版本管理</h2>
|
||
<p>管理客户端更新包版本(用于 /api/version/latest 下发)。</p>
|
||
</div>
|
||
<div class="actions">
|
||
<el-button type="primary" @click="uploadVisible = true">上传新版本</el-button>
|
||
</div>
|
||
</div>
|
||
|
||
<el-card shadow="never">
|
||
<el-table v-loading="loading" :data="items" stripe border>
|
||
<el-table-column prop="version" label="版本号" min-width="180" />
|
||
<el-table-column label="下载" min-width="260">
|
||
<template #default="{ row }">
|
||
<el-link v-if="(row as SoftwareVersionItem).fileUrl" type="primary" :href="(row as SoftwareVersionItem).fileUrl" target="_blank">{{ (row as SoftwareVersionItem).fileUrl }}</el-link>
|
||
<span v-else class="dim">—</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="createdAt" label="创建时间" min-width="190">
|
||
<template #default="{ row }">{{ formatDateTime(row.createdAt) }}</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</el-card>
|
||
|
||
<el-dialog v-model="uploadVisible" title="上传软件版本" width="520px">
|
||
<el-form label-width="110px">
|
||
<el-form-item label="版本号" required>
|
||
<el-input v-model="newVersion" placeholder="如 1.0.2" />
|
||
</el-form-item>
|
||
<el-form-item label="程序压缩包" required>
|
||
<el-upload :auto-upload="false" :limit="1" accept=".zip,.rar,.7z,.exe" :on-change="(file: any) => onFileChange(file.raw)" :on-remove="() => (pickedFile = null)">
|
||
<el-button>选择文件</el-button>
|
||
</el-upload>
|
||
<div v-if="pickedFile" class="dim">{{ pickedFile.name }}</div>
|
||
</el-form-item>
|
||
</el-form>
|
||
<template #footer>
|
||
<el-button @click="uploadVisible = false">取消</el-button>
|
||
<el-button type="primary" :loading="uploading" @click="submitUpload">上传</el-button>
|
||
</template>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.page-heading { display: flex; justify-content: space-between; align-items: flex-start; }
|
||
.actions { display: flex; align-items: center; gap: 10px; }
|
||
.dim { color: var(--el-text-color-secondary); font-size: 12px; }
|
||
</style>
|