vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-10 09:22:34 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactored ConfirmDialog demos

Browse source
This commit is contained in:
Cagatay Civici 2023-10-28 16:59:59 +03:00
parent 916a9dfbc9
commit b9c0574c5a
8 changed files with 239 additions and 69 deletions
Download patch file Download diff file Expand all files Collapse all files

19
doc/confirmdialog/BasicDoc.vue
View file

@ -1,11 +1,11 @@
<template>
<DocSectionText v-bind="$attrs">
<p>ConfirmDialog is displayed by calling the <i>require</i> method of the <i>$confirm</i> instance by passing the options to customize the Dialog. <i>target</i> attribute is mandatory to align the popup to its caller.</p>
<p>ConfirmDialog is displayed by calling the <i>require</i> method of the <i>$confirm</i> instance by passing the options to customize the Dialog. The <i>target</i> attribute is mandatory to align the popup to its referrer.</p>
</DocSectionText>
<ConfirmDialog></ConfirmDialog>
<div class="card flex flex-wrap gap-2 justify-content-center">
<Button @click="confirm1()" icon="pi pi-check" label="Confirm"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete" severity="danger"></Button>
</div>
<DocSectionCode :code="code" />
</template>
@ -18,7 +18,7 @@ export default {
basic: `
<ConfirmDialog></ConfirmDialog>
<Button @click="confirm1()" icon="pi pi-check" label="Confirm"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete" severity="danger"></Button>
`,
options: `
<template>
@ -26,7 +26,7 @@ export default {
<ConfirmDialog></ConfirmDialog>
<div class="card flex flex-wrap gap-2 justify-content-center">
<Button @click="confirm1()" icon="pi pi-check" label="Confirm"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete" severity="danger"></Button>
</div>
</template>
@ -51,7 +51,8 @@ export default {
message: 'Do you want to delete this record?',
header: 'Delete Confirmation',
icon: 'pi pi-info-circle',
acceptClass: 'p-button-danger',
rejectClass: 'p-button-text p-button-text',
acceptClass: 'p-button-danger p-button-text',
accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
},
@ -70,7 +71,7 @@ export default {
<ConfirmDialog></ConfirmDialog>
<div class="card flex flex-wrap gap-2 justify-content-center">
<Button @click="confirm1()" icon="pi pi-check" label="Confirm"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete"></Button>
<Button @click="confirm2()" icon="pi pi-times" label="Delete" severity="danger"></Button>
</div>
</template>
@ -100,7 +101,8 @@ const confirm2 = () => {
message: 'Do you want to delete this record?',
header: 'Delete Confirmation',
icon: 'pi pi-info-circle',
acceptClass: 'p-button-danger',
rejectClass: 'p-button-text p-button-text',
acceptClass: 'p-button-danger p-button-text',
accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
},
@ -133,7 +135,8 @@ const confirm2 = () => {
message: 'Do you want to delete this record?',
header: 'Delete Confirmation',
icon: 'pi pi-info-circle',
acceptClass: 'p-button-danger',
rejectClass: 'p-button-text p-button-text',
acceptClass: 'p-button-danger p-button-text',
accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
},