Lenaisten/advent22
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

DoorMapEditor layout improvements

Browse source
This commit is contained in:
Jörn-Michael Miehe 2023-09-09 22:43:11 +00:00
parent 63f05c1fb9
commit f75f5689de
2 changed files with 35 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
ui/src/components/BulmaButton.vue
View file

@ -3,7 +3,7 @@
<span v-if="icon !== undefined" class="icon"> <span v-if="icon !== undefined" class="icon">
<font-awesome-icon :icon="icon" /> <font-awesome-icon :icon="icon" />
</span> </span>
<span><slot name="default" /></span> <span v-if="text != ''">{{ text }}</span>
</button> </button>
</template> </template>
@ -16,9 +16,15 @@ import { Options, Vue } from "vue-class-component";
type: String, type: String,
required: false, required: false,
}, },
text: {
type: String,
required: false,
default: "",
},
}, },
}) })
export default class extends Vue { export default class extends Vue {
public icon?: string; public icon?: string;
public text?: string;
} }
</script> </script>

64
ui/src/components/DoorMapEditor.vue
View file

@ -3,49 +3,20 @@
<template v-slot:heading>Türchen bearbeiten</template> <template v-slot:heading>Türchen bearbeiten</template>
<template v-slot:default> <template v-slot:default>
<div class="panel-tabs"> <div class="panel-tabs is-justify-content-space-between">
<BulmaBreadcrumbs :steps="steps" v-model="current_step" class="mb-0" />
</div>
<div class="panel-block is-flex is-justify-content-space-between">
<BulmaButton <BulmaButton
:disabled="current_step === 0" :disabled="current_step === 0"
class="is-success" class="is-success"
icon="fa-solid fa-backward"
@click="current_step--" @click="current_step--"
> icon="fa-solid fa-backward"
Zurück />
</BulmaButton> <BulmaBreadcrumbs :steps="steps" v-model="current_step" class="mb-0" />
<BulmaButton <BulmaButton
class="is-danger" :disabled="current_step === 2"
icon="fa-solid fa-trash"
@click="on_discard"
>
Löschen
</BulmaButton>
<BulmaButton
class="is-danger"
icon="fa-solid fa-cloud-arrow-down"
@click="on_download"
>
Laden
</BulmaButton>
<BulmaButton
v-if="current_step !== 2"
class="is-success" class="is-success"
icon="fa-solid fa-forward"
@click="current_step++" @click="current_step++"
> icon="fa-solid fa-forward"
Weiter />
</BulmaButton>
<BulmaButton
v-else
class="is-success"
icon="fa-solid fa-cloud-arrow-up"
@click="on_upload"
>
Speichern
</BulmaButton>
</div> </div>
<div class="panel-block"> <div class="panel-block">
@ -53,6 +24,27 @@
<DoorChooser v-if="current_step === 1" v-model:doors="doors" /> <DoorChooser v-if="current_step === 1" v-model:doors="doors" />
<Calendar v-if="current_step === 2" :doors="doors" /> <Calendar v-if="current_step === 2" :doors="doors" />
</div> </div>
<div class="panel-block is-flex is-justify-content-space-between">
<BulmaButton
class="is-danger"
@click="on_download"
icon="fa-solid fa-cloud-arrow-down"
text="Laden"
/>
<BulmaButton
class="is-warning"
@click="on_discard"
icon="fa-solid fa-trash"
text="Löschen"
/>
<BulmaButton
class="is-success"
@click="on_upload"
icon="fa-solid fa-cloud-arrow-up"
text="Speichern"
/>
</div>
</template> </template>
</BulmaDrawer> </BulmaDrawer>
</template> </template>