86 lines
2.1 KiB
Vue
86 lines
2.1 KiB
Vue
<template>
|
|
<div class="side-panel">
|
|
<form @submit.prevent="saveNewTab()" class="text__14">
|
|
<form-builder
|
|
ref="newTabBuilder"
|
|
:formElements="formElement"
|
|
:formData="formData"
|
|
></form-builder>
|
|
|
|
<div class="mb-3">
|
|
<button-component
|
|
type="submit"
|
|
classes="btn-outline-primary mx-3"
|
|
buttonText="افزودن"
|
|
:buttonLoading="buttonLoading"
|
|
></button-component>
|
|
|
|
<button-component
|
|
classes="btn-danger"
|
|
buttonText="انصراف"
|
|
:buttonLoading="buttonLoading"
|
|
@click="closeNewFormItem"
|
|
></button-component>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
emits: ["close-new-form-item", "add-item-content"],
|
|
|
|
data() {
|
|
return {
|
|
buttonLoading: false,
|
|
formData: {
|
|
title: null,
|
|
comment: null,
|
|
type: 1,
|
|
meta: null,
|
|
table_columns: null,
|
|
},
|
|
formElement: {
|
|
title: "بخش جدید",
|
|
items: [
|
|
{
|
|
key: "title",
|
|
label: "عنوان",
|
|
type: "string",
|
|
placeholder: "عنوان را وارد کنید",
|
|
required: "1",
|
|
validation_regex: "{3-100}",
|
|
validation_error: "عبارت باید حداقل 3 و حداکثر 100 حرف باشد",
|
|
multi_select: "0",
|
|
options: [],
|
|
},
|
|
{
|
|
key: "comment",
|
|
label: "توضیحات",
|
|
type: "textarea",
|
|
placeholder: "توضیحات را وارد کنید",
|
|
required: "1",
|
|
validation_regex: "{3-100}",
|
|
validation_error: "عبارت باید حداقل 3 و حداکثر 100 حرف باشد",
|
|
multi_select: "0",
|
|
options: [],
|
|
},
|
|
],
|
|
},
|
|
};
|
|
},
|
|
methods: {
|
|
closeNewFormItem() {
|
|
this.$emit("close-new-form-item");
|
|
},
|
|
saveNewTab() {
|
|
const formData = this.$refs.newTabBuilder.localFormData;
|
|
this.$emit("add-item-content", formData);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss"></style>
|