79 lines
2.0 KiB
Vue
79 lines
2.0 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from "vue";
|
|
const dialog = ref(false);
|
|
const dialog2 = ref(false);
|
|
const dialog3 = ref(false);
|
|
const notifications = ref(false);
|
|
const sound = ref(true);
|
|
const widgets = ref(false);
|
|
const items = ref([
|
|
{
|
|
title: "Click Me",
|
|
},
|
|
{
|
|
title: "Click Me",
|
|
},
|
|
{
|
|
title: "Click Me",
|
|
},
|
|
{
|
|
title: "Click Me 2",
|
|
},
|
|
]);
|
|
const select = ref([
|
|
{ text: "State 1" },
|
|
{ text: "State 2" },
|
|
{ text: "State 3" },
|
|
{ text: "State 4" },
|
|
{ text: "State 5" },
|
|
{ text: "State 6" },
|
|
{ text: "State 7" },
|
|
]);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="text-center">
|
|
<v-btn color="secondary" class=" w-100" @click="dialog = true" flat>
|
|
Open Dialog 1
|
|
</v-btn>
|
|
<v-dialog v-model="dialog" class="dialog-mw">
|
|
<v-card class="pa-6">
|
|
<v-card-title> Dialog 1 </v-card-title>
|
|
<v-card-text>
|
|
<v-btn color="primary" class="" @click="dialog2 = true" flat>
|
|
Open Dialog 2
|
|
</v-btn>
|
|
</v-card-text>
|
|
<v-card-actions>
|
|
<v-btn color="error" variant="tonal" @click="dialog = false" flat> Close </v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
|
|
<v-dialog v-model="dialog2" class="dialog-mw">
|
|
<v-card class="pa-6">
|
|
<v-card-title> Dialog 2 </v-card-title>
|
|
<v-card-text>
|
|
<v-btn color="secondary" @click="dialog3 = !dialog3" flat>
|
|
Open Dialog 3
|
|
</v-btn>
|
|
</v-card-text>
|
|
<v-card-actions>
|
|
<v-btn color="error" variant="tonal" @click="dialog2 = false" flat> Close </v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
|
|
<v-dialog v-model="dialog3" class="dialog-mw">
|
|
<v-card class="pa-6">
|
|
<v-card-title>
|
|
<span>Dialog 3</span>
|
|
</v-card-title>
|
|
<v-card-actions>
|
|
<v-btn color="error" variant="tonal" @click="dialog3 = false" flat> Close </v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
</div>
|
|
</template>
|