chore: NodeEditor.vue update
This commit is contained in:
@@ -18,19 +18,29 @@ const jsonText = ref('')
|
||||
const errorMsg = ref('')
|
||||
const saved = ref(false)
|
||||
|
||||
watch(() => props.scene, (s) => {
|
||||
if (!s) { jsonText.value = ''; errorMsg.value = ''; return }
|
||||
jsonText.value = JSON.stringify(s, null, 2)
|
||||
watch(() => [props.scene, store.gameData] as const, () => {
|
||||
errorMsg.value = ''
|
||||
saved.value = false
|
||||
}, { immediate: true })
|
||||
if (props.scene) {
|
||||
jsonText.value = JSON.stringify(props.scene, null, 2)
|
||||
} else if (Object.keys(store.gameData.scenes).length > 0) {
|
||||
const { scenes, ...rest } = store.gameData
|
||||
jsonText.value = JSON.stringify(rest, null, 2)
|
||||
} else {
|
||||
jsonText.value = ''
|
||||
}
|
||||
}, { immediate: true, deep: true })
|
||||
|
||||
function onBlur() {
|
||||
if (!props.scene) return
|
||||
errorMsg.value = ''
|
||||
try {
|
||||
const parsed = JSON.parse(jsonText.value)
|
||||
if (props.scene) {
|
||||
store.updateScene(props.scene.id, parsed)
|
||||
} else {
|
||||
const { scenes } = store.gameData
|
||||
store.gameData = { ...parsed, scenes }
|
||||
}
|
||||
saved.value = true
|
||||
setTimeout(() => { saved.value = false }, 2000)
|
||||
} catch (e: any) {
|
||||
@@ -40,14 +50,14 @@ function onBlur() {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="node-editor" v-if="scene">
|
||||
<div class="node-editor" v-if="scene || jsonText">
|
||||
<div class="editor-header">
|
||||
<h3>{{ scene.id }}</h3>
|
||||
<h3>{{ scene ? scene.id : '全局配置' }}</h3>
|
||||
<div class="header-actions">
|
||||
<span v-if="saved" class="saved-hint">已保存</span>
|
||||
<span v-if="errorMsg" class="error-hint">JSON 错误: {{ errorMsg }}</span>
|
||||
<button class="icon-btn danger" @click="emit('deleteScene', scene.id)" title="删除场景">🗑</button>
|
||||
<button class="icon-btn" @click="emit('close')" title="关闭">✕</button>
|
||||
<button v-if="scene" class="icon-btn danger" @click="emit('deleteScene', scene.id)" title="删除场景">删除场景</button>
|
||||
<button v-if="scene" class="icon-btn" @click="emit('close')" title="关闭">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -61,8 +71,8 @@ function onBlur() {
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="node-editor empty-state" v-else>
|
||||
<p>点击左侧画布中的节点来编辑</p>
|
||||
<div class="node-editor empty-state" v-else-if="Object.keys(store.gameData.scenes).length === 0">
|
||||
<p>加载或新建场景后开始编辑</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user