vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Confirm* demo updates

pull/5507/head
tugcekucukoglu 2024-03-27 18:45:43 +03:00
parent d31a423153
commit fff0c59e27
6 changed files with 189 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
doc/confirmdialog/BasicDoc.vue
View File

@ -38,9 +38,14 @@ export default {
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
header: 'Confirmation', header: 'Confirmation',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined', rejectProps: {
rejectLabel: 'Cancel', label: 'Cancel',
acceptLabel: 'Save', severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -54,10 +59,15 @@ export default {
message: 'Do you want to delete this record?', message: 'Do you want to delete this record?',
header: 'Danger Zone', header: 'Danger Zone',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectLabel: 'Cancel', rejectProps: {
acceptLabel: 'Delete', label: 'Cancel',
rejectClass: 'p-button-secondary p-button-outlined', severity: 'secondary',
acceptClass: 'p-button-danger', outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },
@ -92,9 +102,14 @@ const confirm1 = () => {
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
header: 'Confirmation', header: 'Confirmation',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined', rejectProps: {
rejectLabel: 'Cancel', label: 'Cancel',
acceptLabel: 'Save', severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -110,9 +125,15 @@ const confirm2 = () => {
header: 'Danger Zone', header: 'Danger Zone',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectLabel: 'Cancel', rejectLabel: 'Cancel',
acceptLabel: 'Delete', rejectProps: {
rejectClass: 'p-button-secondary p-button-outlined', label: 'Cancel',
acceptClass: 'p-button-danger', severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },
@ -132,9 +153,14 @@ const confirm2 = () => {
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
header: 'Confirmation', header: 'Confirmation',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined', rejectProps: {
rejectLabel: 'Cancel', label: 'Cancel',
acceptLabel: 'Save', severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -148,10 +174,15 @@ const confirm2 = () => {
message: 'Do you want to delete this record?', message: 'Do you want to delete this record?',
header: 'Danger Zone', header: 'Danger Zone',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectLabel: 'Cancel', rejectProps: {
acceptLabel: 'Delete', label: 'Cancel',
rejectClass: 'p-button-secondary p-button-outlined', severity: 'secondary',
acceptClass: 'p-button-danger', outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },

38
doc/confirmdialog/PositionDoc.vue
View File

@ -77,9 +77,15 @@ export default {
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
position: position, position: position,
rejectClass: 'p-button-secondary p-button-text', rejectClass: 'p-button-secondary p-button-text',
acceptClass: 'p-button-text', rejectProps: {
rejectLabel: 'Cancel', label: 'Cancel',
acceptLabel: 'Save', severity: 'secondary',
text: true
},
acceptProps: {
label: 'Save',
text: true
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 });
}, },
@ -128,10 +134,15 @@ const confirmPosition = (position) => {
header: 'Confirmation', header: 'Confirmation',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
position: position, position: position,
rejectClass: 'p-button-secondary p-button-text', rejectProps: {
acceptClass: 'p-button-text', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Save', text: true
},
acceptProps: {
label: 'Save',
text: true
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 });
}, },
@ -153,10 +164,15 @@ const confirmPosition = (position) => {
header: 'Confirmation', header: 'Confirmation',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
position: position, position: position,
rejectClass: 'p-button-secondary p-button-text', rejectProps: {
acceptClass: 'p-button-text', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Save', text: true
},
acceptProps: {
label: 'Save',
text: true
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Request submitted', life: 3000 });
}, },

51
doc/confirmdialog/TemplateDoc.vue
View File

@ -57,12 +57,17 @@ export default {
header: 'Confirmation', header: 'Confirmation',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', label: 'Cancel',
rejectClass: 'p-button-outlined p-button-sm', icon: 'pi pi-times',
acceptClass: 'p-button-sm', outlined: true,
rejectLabel: 'Cancel', size: 'small'
acceptLabel: 'Save', },
acceptProps: {
label: 'Save',
icon: 'pi pi-check',
size: 'small'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -104,12 +109,17 @@ const showTemplate = () => {
header: 'Confirmation', header: 'Confirmation',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', label: 'Cancel',
rejectClass: 'p-button-outlined p-button-sm', icon: 'pi pi-times',
acceptClass: 'p-button-sm', outlined: true,
rejectLabel: 'Cancel', size: 'small'
acceptLabel: 'Save', },
acceptProps: {
label: 'Save',
icon: 'pi pi-check',
size: 'small'
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -130,12 +140,17 @@ const showTemplate = () => {
header: 'Confirmation', header: 'Confirmation',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', label: 'Cancel',
rejectClass: 'p-button-outlined p-button-sm', icon: 'pi pi-times',
acceptClass: 'p-button-sm', outlined: true,
rejectLabel: 'Cancel', size: 'small'
acceptLabel: 'Save', },
acceptProps: {
label: 'Save',
icon: 'pi pi-check',
size: 'small'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },

75
doc/confirmpopup/BasicDoc.vue
View File

@ -38,10 +38,14 @@ export default {
target: event.currentTarget, target: event.currentTarget,
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Save', outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -55,10 +59,15 @@ export default {
target: event.currentTarget, target: event.currentTarget,
message: 'Do you want to delete this record?', message: 'Do you want to delete this record?',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-danger p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Delete', outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },
@ -93,10 +102,14 @@ const confirm1 = (event) => {
target: event.currentTarget, target: event.currentTarget,
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Save', outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -111,10 +124,15 @@ const confirm2 = (event) => {
target: event.currentTarget, target: event.currentTarget,
message: 'Do you want to delete this record?', message: 'Do you want to delete this record?',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-danger p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Delete', outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },
@ -134,10 +152,14 @@ const confirm2 = (event) => {
target: event.currentTarget, target: event.currentTarget,
message: 'Are you sure you want to proceed?', message: 'Are you sure you want to proceed?',
icon: 'pi pi-exclamation-triangle', icon: 'pi pi-exclamation-triangle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Save', outlined: true
},
acceptProps: {
label: 'Save'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -151,10 +173,15 @@ const confirm2 = (event) => {
target: event.currentTarget, target: event.currentTarget,
message: 'Do you want to delete this record?', message: 'Do you want to delete this record?',
icon: 'pi pi-info-circle', icon: 'pi pi-info-circle',
rejectClass: 'p-button-secondary p-button-outlined p-button-sm', rejectProps: {
acceptClass: 'p-button-danger p-button-sm', label: 'Cancel',
rejectLabel: 'Cancel', severity: 'secondary',
acceptLabel: 'Delete', outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'Record deleted', life: 3000 });
}, },

45
doc/confirmpopup/TemplateDoc.vue
View File

@ -57,12 +57,15 @@ export default {
group: 'templating', group: 'templating',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', icon: 'pi pi-times',
acceptLabel: 'Confirm', label: 'Cancel',
rejectLabel: 'Cancel', outlined: true
rejectClass: 'p-button-outlined p-button-sm', },
acceptClass: 'p-button-sm', acceptProps: {
icon: 'pi pi-check',
label: 'Confirm'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },
@ -104,12 +107,15 @@ const showTemplate = (event) => {
group: 'templating', group: 'templating',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', icon: 'pi pi-times',
acceptLabel: 'Confirm', label: 'Cancel',
rejectLabel: 'Cancel', outlined: true
rejectClass: 'p-button-outlined p-button-sm', },
acceptClass: 'p-button-sm', acceptProps: {
icon: 'pi pi-check',
label: 'Confirm'
},
accept: () => { accept: () => {
toast.add({severity:'info', summary:'Confirmed', detail:'You have accepted', life: 3000}); toast.add({severity:'info', summary:'Confirmed', detail:'You have accepted', life: 3000});
}, },
@ -130,12 +136,15 @@ const showTemplate = (event) => {
group: 'templating', group: 'templating',
message: 'Please confirm to proceed moving forward.', message: 'Please confirm to proceed moving forward.',
icon: 'pi pi-exclamation-circle', icon: 'pi pi-exclamation-circle',
acceptIcon: 'pi pi-check', rejectProps: {
rejectIcon: 'pi pi-times', icon: 'pi pi-times',
acceptLabel: 'Confirm', label: 'Cancel',
rejectLabel: 'Cancel', outlined: true
rejectClass: 'p-button-outlined p-button-sm', },
acceptClass: 'p-button-sm', acceptProps: {
icon: 'pi pi-check',
label: 'Confirm'
},
accept: () => { accept: () => {
this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 }); this.$toast.add({ severity: 'info', summary: 'Confirmed', detail: 'You have accepted', life: 3000 });
}, },

1
doc/steps/TemplateDoc.vue
View File

@ -124,7 +124,6 @@ const items = ref([
}; };
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>