feat: 创建房间新增观战开关,成功后跳转到房间页
This commit is contained in:
@@ -57,6 +57,12 @@
|
||||
/>
|
||||
<div class="create-room-dialog__hint">设置密码后,其他玩家需输入密码才能加入</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 是否允许观战 -->
|
||||
<el-form-item label="观战">
|
||||
<el-switch v-model="form.allowSpectate" />
|
||||
<div class="create-room-dialog__hint">开启后,其他玩家可旁观对局</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
@@ -68,6 +74,7 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, computed, watch } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import type { FormInstance, FormRules } from 'element-plus'
|
||||
import { useBaseLayoutStore } from '@/stores'
|
||||
import { storeToRefs } from 'pinia'
|
||||
@@ -80,6 +87,7 @@ interface CreateRoomForm {
|
||||
mode: string
|
||||
stakes: number | undefined
|
||||
password: string
|
||||
allowSpectate: boolean
|
||||
}
|
||||
|
||||
const props = defineProps<{
|
||||
@@ -91,6 +99,7 @@ const emit = defineEmits<{
|
||||
(e: 'created'): void
|
||||
}>()
|
||||
|
||||
const router = useRouter()
|
||||
const baseLayoutStore = useBaseLayoutStore()
|
||||
const { activeGameName, activeGameConfig } = storeToRefs(baseLayoutStore)
|
||||
|
||||
@@ -114,7 +123,8 @@ const form = reactive<CreateRoomForm>({
|
||||
name: '',
|
||||
mode: '',
|
||||
stakes: undefined,
|
||||
password: ''
|
||||
password: '',
|
||||
allowSpectate: true
|
||||
})
|
||||
|
||||
/** 初始化默认值:取当前游戏配置的第一个选项 */
|
||||
@@ -125,6 +135,7 @@ function initDefaults() {
|
||||
}
|
||||
form.name = ''
|
||||
form.password = ''
|
||||
form.allowSpectate = true
|
||||
}
|
||||
|
||||
/** 弹窗打开时设置默认值 */
|
||||
@@ -154,16 +165,19 @@ async function handleSubmit() {
|
||||
|
||||
submitting.value = true
|
||||
try {
|
||||
await createRoom({
|
||||
const res = await createRoom({
|
||||
gameId: baseLayoutStore.activeGameId,
|
||||
name: form.name.trim() || undefined,
|
||||
password: form.password || undefined,
|
||||
mode: form.mode,
|
||||
stakes: form.stakes!,
|
||||
maxPlayers: gameConfig.value?.maxPlayers ?? 0
|
||||
maxPlayers: gameConfig.value?.maxPlayers ?? 0,
|
||||
allowSpectate: form.allowSpectate
|
||||
})
|
||||
visible.value = false
|
||||
emit('created')
|
||||
// 跳转到新创建的房间
|
||||
router.push(`/room/${res.data.room.id}`)
|
||||
} finally {
|
||||
submitting.value = false
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user