88 lines
3.0 KiB
Vue
88 lines
3.0 KiB
Vue
<template>
|
|
<v-container max-width="1400">
|
|
<v-tabs v-model="panel" class="mb-2">
|
|
<v-tab value="game">
|
|
<v-icon icon="mdi-pencil"></v-icon> {{ id == 'add' ? l.createGame : l.editGame }}
|
|
</v-tab>
|
|
<v-tab value="gameDesigner" v-if="this.id != 'add'">
|
|
<v-icon icon="mdi-movie-open-outline"></v-icon> {{ l.gameDesigner }}
|
|
</v-tab>
|
|
</v-tabs>
|
|
<v-tabs-window v-model="panel">
|
|
<v-tabs-window-item value="game">
|
|
<v-form class="pa-4" v-model="valid">
|
|
<v-text-field :label="l.name" v-model="object.name" :rules="[rules.required]"></v-text-field>
|
|
<v-textarea :label="l.description" v-model="object.description"></v-textarea>
|
|
<v-text-field :label="l.group" v-model="object.group"></v-text-field>
|
|
<v-number-input density="compact" :label="l.order" v-model="object.order"></v-number-input>
|
|
<v-select :label="l.scenario" :items="scenarios" :disabled="this.id != 'add'" v-model="object.scenario" item-title="name" item-value="id"></v-select>
|
|
</v-form>
|
|
</v-tabs-window-item>
|
|
<v-tabs-window-item value="gameDesigner">
|
|
<GameDesigner v-model="object" ref="gameDesigner" ></GameDesigner>
|
|
</v-tabs-window-item>
|
|
</v-tabs-window>
|
|
<v-btn @click="save" :loading="loading" prepend-icon="mdi-content-save" color="primary">{{ l.save }}</v-btn>
|
|
</v-container>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
object: {},
|
|
valid: false,
|
|
rules: {
|
|
required: v => v ? true : this.l.fieldRequired,
|
|
requiredFile: v => (v?.length || this.id != 'add') ? true : this.l.fieldRequired
|
|
},
|
|
loading: false,
|
|
panel: [],
|
|
scenarios: []
|
|
}
|
|
},
|
|
async mounted(){
|
|
if (this.id && this.id != 'add') {
|
|
this.object = (await this.$api.game.load(this.id)).data;
|
|
}
|
|
this.scenarios = (await this.$api.scenario.search()).data.data;
|
|
},
|
|
watch:{
|
|
'object.scenario'(v){
|
|
if (v){
|
|
this.object.thumb = this.scenarios?.find(s=>s.id == v)?.sceneThumb?.[0];
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
id() {
|
|
return this.$route.params?.id;
|
|
}
|
|
},
|
|
methods:{
|
|
async save(params) {
|
|
this.loading = true;
|
|
try {
|
|
//this.debug('saving', this.object)
|
|
let result = await this.$api.game.save(this.object);
|
|
this.object.id = result.data.object.id;
|
|
if (this.id == 'add') {
|
|
this.$router.replace({ params: { id: this.object.id } });
|
|
}
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
this.loading = false
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<route>
|
|
{
|
|
meta: {
|
|
layout: "console"
|
|
}
|
|
}
|
|
</route> |