<template>
|
<div class="app-container">
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button type="primary" plain icon="Upload" @click="openUploadDialog">上传APK</el-button>
|
</el-col>
|
</el-row>
|
|
<el-table v-loading="loading" :data="versionList">
|
<el-table-column label="ID" prop="id" align="center" width="80"/>
|
<el-table-column label="应用名称" prop="name" align="center" min-width="150"/>
|
<el-table-column label="版本号" prop="version" align="center" width="120"/>
|
<el-table-column label="创建时间" prop="createTime" align="center" width="170">
|
<template #default="scope">
|
<span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d} {h}:{i}:{s}") }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="更新时间" prop="updateTime" align="center" width="170">
|
<template #default="scope">
|
<span>{{ parseTime(scope.row.updateTime, "{y}-{m}-{d} {h}:{i}:{s}") }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="创建人" prop="createUser" align="center" width="100"/>
|
<el-table-column label="操作" align="center" width="100" class-name="small-padding fixed-width">
|
<template #default="scope">
|
<el-button link type="primary" @click="downloadAttachment(scope.row)">下载</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
v-model:page="queryParams.current"
|
v-model:limit="queryParams.size"
|
@pagination="getList"
|
/>
|
|
<el-dialog title="上传APK" v-model="uploadOpen" width="560px" append-to-body @close="resetUploadForm">
|
<el-form ref="uploadRef" :model="uploadForm" :rules="uploadRules" label-width="90px">
|
<el-form-item label="应用名称" prop="name">
|
<el-input v-model="uploadForm.name" placeholder="请输入应用名称"/>
|
</el-form-item>
|
<el-form-item label="版本号" prop="version">
|
<el-input v-model="uploadForm.version" placeholder="请输入版本号"/>
|
</el-form-item>
|
<el-form-item label="APK文件" prop="storageBlobDTOList">
|
<FileUpload v-model:file-list="uploadForm.storageBlobDTOList" :limit="1" :file-type="['apk']"
|
:file-size="200"/>
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button type="primary" :loading="uploading" @click="submitUpload">确 定</el-button>
|
<el-button @click="uploadOpen = false">取 消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup name="SystemAppVersion">
|
import {listAppVersion, add} from "@/api/system/appVersion";
|
import FileUpload from "@/components/AttachmentUpload/file/index.vue";
|
|
const {proxy} = getCurrentInstance();
|
|
const loading = ref(false);
|
const versionList = ref([]);
|
const total = ref(0);
|
|
const queryParams = reactive({
|
current: 1,
|
size: 10,
|
});
|
|
const uploadOpen = ref(false);
|
const uploading = ref(false);
|
const uploadForm = reactive({
|
name: "",
|
version: "",
|
storageBlobDTOList: null,
|
});
|
|
const uploadRules = {
|
name: [{required: true, message: "请输入应用名称", trigger: "blur"}],
|
version: [{required: true, message: "请输入版本号", trigger: "blur"}],
|
storageBlobDTOList: [{required: true, message: "请上传APK文件", trigger: "change"}],
|
};
|
|
function normalizeListResp(res) {
|
const data = res?.data || {};
|
const records = data.records || res?.rows || [];
|
const totalNum = Number(data.total ?? res?.total ?? 0);
|
return {
|
records: Array.isArray(records) ? records : [],
|
total: Number.isNaN(totalNum) ? 0 : totalNum,
|
};
|
}
|
|
function getList() {
|
loading.value = true;
|
listAppVersion(queryParams)
|
.then(res => {
|
const result = normalizeListResp(res);
|
versionList.value = result.records;
|
total.value = result.total;
|
})
|
.finally(() => {
|
loading.value = false;
|
});
|
}
|
|
function openUploadDialog() {
|
resetUploadForm();
|
uploadOpen.value = true;
|
}
|
|
function resetUploadForm() {
|
uploadForm.name = "";
|
uploadForm.version = "";
|
uploadForm.storageBlobDTOList = null;
|
proxy.resetForm("uploadRef");
|
}
|
|
|
function downloadAttachment(row) {
|
window.open(row.downloadURL, "_blank");
|
}
|
|
function submitUpload() {
|
proxy.$refs.uploadRef.validate(valid => {
|
if (!valid) return;
|
uploading.value = true;
|
add(uploadForm)
|
.then(() => {
|
proxy.$modal.msgSuccess("上传成功");
|
uploadOpen.value = false;
|
getList();
|
})
|
.finally(() => {
|
uploading.value = false;
|
});
|
});
|
}
|
|
onMounted(() => {
|
getList();
|
});
|
</script>
|
