70 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			70 lines
		
	
	
		
			1.8 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|     <div>
 | |
|         <component v-for="(field, index) in schema"
 | |
|                    :key="index"
 | |
|                    :is="field.fieldType"
 | |
|                    v-bind="field">
 | |
| 
 | |
|         </component>
 | |
|     </div>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
|     import { SlideYUpTransition } from "vue2-transitions";
 | |
| 
 | |
|     export default {
 | |
|         props: {
 | |
|             show: Boolean,
 | |
|             title: {
 | |
|                 type: String,
 | |
|                 default: '',
 | |
|                 description: "Modal header title"
 | |
|             },
 | |
|             message: {
 | |
|                 type: String,
 | |
|                 default: '',
 | |
|                 description: "Modal body message"
 | |
|             },
 | |
|             button_cancel: {
 | |
|                 type: String,
 | |
|                 default: '',
 | |
|                 description: "Modal footer cancel button text"
 | |
|             },
 | |
|             button_delete: {
 | |
|                 type: String,
 | |
|                 default: '',
 | |
|                 description: "Modal footer delete button text"
 | |
|             },
 | |
|             animationDuration: {
 | |
|                 type: Number,
 | |
|                 default: 800,
 | |
|                 description: "Modal transition duration"
 | |
|             }
 | |
|         },
 | |
| 
 | |
|         methods: {
 | |
|             closeModal() {
 | |
|                 this.$emit("update:show", false);
 | |
|                 this.$emit("close");
 | |
|             },
 | |
|             onConfirm() {
 | |
|                 this.$emit("confirm");
 | |
|             },
 | |
|             onCancel() {
 | |
|                 this.$emit("cancel");
 | |
|             }
 | |
|         },
 | |
| 
 | |
|         watch: {
 | |
|             show(val) {
 | |
|                 let documentClasses = document.body.classList;
 | |
|                 if (val) {
 | |
|                     documentClasses.add("modal-open");
 | |
|                 } else {
 | |
|                     documentClasses.remove("modal-open");
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     }
 | |
| </script>
 |