enrecipes/app/components/modal/ConfirmDialog.vue

60 lines
1.2 KiB
Vue
Raw Normal View History

2020-10-21 17:54:45 +00:00
<template>
2021-04-14 09:27:40 +00:00
<Page
@loaded="transparentPage"
backgroundColor="transparent"
:class="appTheme"
>
2021-04-01 10:55:35 +00:00
<GridLayout rows="auto, auto, auto" class="modal">
<Label class="title" :text="title | L" />
2021-02-28 15:10:26 +00:00
<Label
2021-04-01 10:55:35 +00:00
row="1"
2021-02-28 15:10:26 +00:00
v-if="description"
2021-04-01 10:55:35 +00:00
class="description tw"
2021-02-28 15:10:26 +00:00
:text="description"
/>
2021-04-14 09:27:40 +00:00
<GridLayout row="2" columns="*, auto, auto" class="actions">
2021-04-01 10:55:35 +00:00
<Button
2021-02-28 15:10:26 +00:00
v-if="cancelButtonText"
2021-04-14 09:27:40 +00:00
col="1"
2021-04-01 10:55:35 +00:00
class="text sm"
:text="cancelButtonText | L"
2021-02-28 15:10:26 +00:00
@tap="$modal.close(false)"
/>
2021-04-01 10:55:35 +00:00
<Button
2021-04-14 09:27:40 +00:00
col="2"
2021-04-01 10:55:35 +00:00
class="text sm"
:text="okButtonText | L"
2021-02-28 15:10:26 +00:00
@tap="$modal.close(true)"
/>
</GridLayout>
2021-04-01 10:55:35 +00:00
</GridLayout>
2021-02-28 15:10:26 +00:00
</Page>
2020-10-21 17:54:45 +00:00
</template>
2021-04-14 13:38:22 +00:00
<script lang="ts">
2021-02-28 15:10:26 +00:00
import { mapState } from "vuex";
2020-10-21 17:54:45 +00:00
export default {
2021-04-14 13:38:22 +00:00
props: {
title: {
type: String,
required: true,
},
description: {
type: String,
required: true,
},
cancelButtonText: {
type: String,
required: true,
},
okButtonText: {
type: String,
required: true,
},
},
computed: {
2021-04-01 10:55:35 +00:00
...mapState(["icon", "appTheme"]),
2020-10-22 18:36:50 +00:00
},
2021-02-28 15:10:26 +00:00
};
2020-10-21 17:54:45 +00:00
</script>