优化
This commit is contained in:
@@ -3,7 +3,7 @@ import '@/styles/adminWorkbench.css'
|
||||
import '@/styles/adminDensity.css'
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import { Plus, RefreshCw } from '@lucide/vue'
|
||||
import { FileUp, Plus, RefreshCw } from '@lucide/vue'
|
||||
import AdminPage from '@/shared/components/AdminPage.vue'
|
||||
import AppDialog from '@/shared/components/AppDialog.vue'
|
||||
import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
|
||||
@@ -24,6 +24,7 @@ const error = ref('')
|
||||
const actionId = ref('')
|
||||
const uploadOpen = ref(false)
|
||||
const uploading = ref(false)
|
||||
const fileInput = ref<HTMLInputElement | null>(null)
|
||||
const form = reactive({ packageType: 'wgt' as PdaPackageType, versionName: '', versionCode: 1,
|
||||
minAppVersionCode: 1, mandatory: false, releaseNotes: '', file: null as File | null })
|
||||
const columns: DataTableColumn[] = [
|
||||
@@ -60,11 +61,13 @@ async function load() {
|
||||
}
|
||||
|
||||
watch(app, () => { rows.value = []; void load() })
|
||||
watch(() => form.packageType, () => { form.file = null })
|
||||
onMounted(() => { void load() })
|
||||
|
||||
function openUpload() {
|
||||
Object.assign(form, { packageType: 'wgt', versionName: '', versionCode: currentApk.value?.versionCode ?? 1,
|
||||
minAppVersionCode: currentApk.value?.versionCode ?? 1, mandatory: false, releaseNotes: '', file: null })
|
||||
if (fileInput.value) fileInput.value.value = ''
|
||||
uploadOpen.value = true
|
||||
}
|
||||
|
||||
@@ -159,19 +162,27 @@ function download(row: PdaRelease) {
|
||||
</DataTable></div>
|
||||
</ListPageLayout>
|
||||
|
||||
<AppDialog v-model="uploadOpen" class="admin-density-dialog admin-workbench is-dialog" title="上传PDA版本" width="min(640px, calc(100vw - 28px))" confirm-text="保存草稿" :confirm-loading="uploading" @confirm="upload">
|
||||
<el-form label-position="top" class="pda-release-form">
|
||||
<el-form-item label="包类型">
|
||||
<el-radio-group v-model="form.packageType"><el-radio-button value="apk">APK 整包</el-radio-button><el-radio-button value="wgt">WGT 热更新</el-radio-button></el-radio-group>
|
||||
</el-form-item>
|
||||
<div class="pda-release-fields">
|
||||
<el-form-item label="版本号"><el-input v-model.trim="form.versionName" placeholder="例如 0.0.4" /></el-form-item>
|
||||
<el-form-item label="APK版本码"><el-input-number v-model="form.versionCode" :min="1" :controls="false" placeholder="请输入APK版本码" /></el-form-item>
|
||||
<el-form-item label="最低兼容APK版本码"><el-input-number v-model="form.minAppVersionCode" :min="1" :controls="false" placeholder="请输入最低兼容APK版本码" /></el-form-item>
|
||||
<AppDialog v-model="uploadOpen" class="admin-density-dialog admin-workbench is-dialog" :title="`上传${app === 'overseas' ? '海外' : '国内'}PDA版本`" width="min(640px, calc(100vw - 28px))" confirm-text="保存草稿" :confirm-loading="uploading" @confirm="upload">
|
||||
<el-form label-position="top" class="pda-release-form density-form density-form--outlined density-form--flush-end" :disabled="uploading">
|
||||
<div class="pda-release-options">
|
||||
<el-form-item label="包类型">
|
||||
<el-radio-group v-model="form.packageType"><el-radio-button value="apk">APK 整包</el-radio-button><el-radio-button value="wgt">WGT 热更新</el-radio-button></el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="强制更新"><el-switch v-model="form.mandatory" /></el-form-item>
|
||||
</div>
|
||||
<div class="pda-release-fields">
|
||||
<el-form-item label="版本号"><el-input v-model.trim="form.versionName" placeholder="例如 0.0.4" /></el-form-item>
|
||||
<el-form-item label="APK版本码"><el-input-number v-model="form.versionCode" :min="1" :controls="false" align="left" placeholder="版本码" /></el-form-item>
|
||||
<el-form-item label="最低兼容APK版本码"><el-input-number v-model="form.minAppVersionCode" :min="1" :controls="false" align="left" placeholder="最低版本码" /></el-form-item>
|
||||
</div>
|
||||
<el-form-item label="更新说明"><el-input v-model="form.releaseNotes" type="textarea" :rows="3" maxlength="1000" show-word-limit placeholder="请输入更新说明" /></el-form-item>
|
||||
<el-form-item :label="`选择 ${form.packageType.toUpperCase()} 文件（最大200MB）`"><input :key="form.packageType" type="file" :accept="`.${form.packageType}`" @change="selectFile" /></el-form-item>
|
||||
<el-form-item label="更新包（最大200MB）">
|
||||
<input :key="form.packageType" ref="fileInput" class="pda-release-file-input" type="file" :accept="`.${form.packageType}`" :aria-label="`选择 ${form.packageType.toUpperCase()} 更新包`" tabindex="-1" :disabled="uploading" @change="selectFile" />
|
||||
<div class="pda-release-file-control">
|
||||
<el-button :icon="FileUp" :disabled="uploading" @click="fileInput?.click()">选择 {{ form.packageType.toUpperCase() }} 文件</el-button>
|
||||
<div class="pda-release-file-meta"><span class="pda-release-file-name">{{ form.file?.name || '未选择文件' }}</span><span v-if="form.file" class="pda-release-file-size">{{ (form.file.size / 1024 / 1024).toFixed(2) }} MB</span></div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</AppDialog>
|
||||
</AdminPage>
|
||||
@@ -187,7 +198,14 @@ function download(row: PdaRelease) {
|
||||
.pda-release-current dd { margin: 0; color: var(--workbench-text); font-size: var(--admin-font-body); font-variant-numeric: tabular-nums; }
|
||||
.pda-release-actions { display: flex; align-items: center; gap: var(--admin-space-2); }
|
||||
.pda-release-actions :deep(.el-button) { display: inline-flex; align-items: center; gap: 5px; }
|
||||
.pda-release-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
|
||||
.pda-release-form :deep(.el-input-number) { width: 100%; }
|
||||
.pda-release-options { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0 var(--admin-space-6); }
|
||||
.pda-release-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--admin-space-6); }
|
||||
.pda-release-options > *, .pda-release-fields > * { min-width: 0; }
|
||||
.pda-release-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
|
||||
.pda-release-file-control { display: flex; width: 100%; min-width: 0; align-items: flex-start; gap: var(--admin-space-5); }
|
||||
.pda-release-file-control > :deep(.el-button) { flex-shrink: 0; }
|
||||
.pda-release-file-meta { flex: 1; min-width: 0; line-height: 1.6; }
|
||||
.pda-release-file-name { display: block; color: var(--cc-text); overflow-wrap: anywhere; }
|
||||
.pda-release-file-size { display: block; color: var(--cc-muted); font-size: var(--admin-font-caption); }
|
||||
@media (max-width: 900px) { .pda-release-context { align-items: flex-start; flex-direction: column; gap: var(--admin-space-3); } }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user