<script setup lang="ts">
|
import { onMounted, reactive, ref } from 'vue'
|
import { ElMessage } from 'element-plus'
|
import { getPlatformSettings, savePlatformSettings, uploadAdminVideo } from '../api/admin'
|
|
const form = reactive({
|
bookstoreDiscount: '',
|
hotelSubsidy: '',
|
videoName: '',
|
homeVideoUrl: '',
|
miniProgramUrl: '',
|
miniProgramAppId: '',
|
miniProgramPath: '',
|
})
|
|
const saving = ref(false)
|
const videoInput = ref<HTMLInputElement>()
|
function uploadVideo() { videoInput.value?.click() }
|
async function selectVideo(event: Event) {
|
const file = (event.target as HTMLInputElement).files?.[0]
|
if (!file) return
|
if (file.type !== 'video/mp4') { ElMessage.warning('仅支持 MP4 视频'); return }
|
const result = await uploadAdminVideo(file)
|
form.homeVideoUrl = result.url
|
form.videoName = file.name
|
ElMessage.success('视频已上传')
|
}
|
async function saveSettings() {
|
saving.value = true
|
try { await savePlatformSettings({ bookstoreDiscount: form.bookstoreDiscount, hotelSubsidy: form.hotelSubsidy, homeVideoUrl: form.homeVideoUrl, miniProgramUrl: form.miniProgramUrl, miniProgramAppId: form.miniProgramAppId, miniProgramPath: form.miniProgramPath }); ElMessage.success('平台设置已保存') } finally { saving.value = false }
|
}
|
onMounted(async () => { Object.assign(form, await getPlatformSettings()) })
|
</script>
|
|
<template>
|
<div class="platform-settings-page">
|
<el-form class="platform-settings-form" :model="form" label-width="116px" label-position="left">
|
<el-form-item label="书店基本折扣设置">
|
<el-input v-model="form.bookstoreDiscount" placeholder="请输入" />
|
<span class="platform-setting-unit">折</span>
|
</el-form-item>
|
|
<el-form-item label="酒店免费入住补贴">
|
<el-input v-model="form.hotelSubsidy" placeholder="请输入" />
|
<span class="platform-setting-unit">人/晚</span>
|
</el-form-item>
|
|
<el-form-item label="首页视频配置">
|
<el-button type="primary" @click="uploadVideo">上传</el-button>
|
<input ref="videoInput" type="file" accept="video/mp4" hidden @change="selectVideo" />
|
<span v-if="form.videoName || form.homeVideoUrl" class="platform-setting-file">{{ form.videoName || form.homeVideoUrl }}</span>
|
</el-form-item>
|
|
<el-form-item class="platform-mini-program-link" label="首页小程序跳转链接">
|
<el-input v-model="form.miniProgramUrl" placeholder="请输入" />
|
</el-form-item>
|
|
<el-form-item class="platform-mini-program-link" label="目标小程序 AppID">
|
<el-input v-model="form.miniProgramAppId" placeholder="如 wx1234567890abcdef，填写后首页入口直接跳转该小程序" />
|
</el-form-item>
|
|
<el-form-item class="platform-mini-program-link" label="目标小程序路径">
|
<el-input v-model="form.miniProgramPath" placeholder="选填，如 pages/index/index" />
|
</el-form-item>
|
|
|
<el-form-item class="platform-settings-save">
|
<el-button type="primary" :loading="saving" @click="saveSettings">保存</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</template>
|
