base_ui/components/forms/FormShow.vue
2025-02-26 11:23:07 +03:30

87 lines
2.1 KiB
Vue

<template>
<div class="side-panel">
<div class="side-panel-header">
<h6 class="text-center">
مشخصات کامل مورد جاری
</h6>
</div>
<div class="border redios-castom px-3 py-2 ">
<div class="side-panel-content">
<form-builder
:previewMode="true"
:formElements="clonedFormElements"
:formData="selectedItem"
></form-builder>
</div>
<div class="d-flex justify-content-between">
<button-component
classes="d-inline-flex btn-default"
@click="closeFormShow"
buttonText=""
>
<span class="tavasi tavasi-Component-71--1"></span>
</button-component>
<button-component
classes="d-inline-flex btn-default"
@click="editItem"
buttonText=""
>
<i class="tavasi tavasi-Component-242--1"></i>
</button-component>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["selectedItem"],
emits: ["close-form-show", "edit-item"],
data() {
return {
clonedFormElements: {
items: [
{
key: "title",
label: "عنوان",
type: "label",
placeholder: "عنوان مختصری وارد کنید",
required: "0",
validation_regex: "",
validation_error: "",
multi_select: "0",
options: [],
value: null,
},
{
key: "comment",
label: "توضیح",
type: "label",
placeholder: "توضیح مختصری وارد کنید",
required: "0",
validation_regex: "",
validation_error: "",
multi_select: "0",
options: [],
value: null,
},
],
title: "فرم جزییات",
},
};
},
methods: {
closeFormShow() {
this.$emit("close-form-show");
},
editItem() {
this.$emit("edit-item", this.selectedItem);
},
},
};
</script>