107 lines
2.8 KiB
Vue
107 lines
2.8 KiB
Vue
<template>
|
||
<div class="side-panel">
|
||
<div class="side-panel-header">
|
||
<h6>
|
||
انتخاب ستونها در حالت نمایش فهرستی(جدولی)
|
||
</h6>
|
||
</div>
|
||
|
||
<div class="side-panel-content">
|
||
<form @submit.prevent="saveColumn">
|
||
<div class="row form-group">
|
||
<label for="key" class="col-md-3">کلیدواژه: </label>
|
||
<select
|
||
class="form-control col-md-9"
|
||
placeholder="کلیدواژه"
|
||
type="key"
|
||
id="key"
|
||
name="key"
|
||
v-model="localFormElement.key"
|
||
>
|
||
<option
|
||
v-for="option in selectedForm.flatedItems"
|
||
:value="option.key"
|
||
>{{ option.label }}({{ option.key }})</option
|
||
>
|
||
</select>
|
||
</div>
|
||
<div class="row form-group">
|
||
<label for="title" class="col-md-3">عنوان: </label>
|
||
<input
|
||
class="form-control col-md-9"
|
||
placeholder="عنوان"
|
||
type="title"
|
||
id="title"
|
||
name="title"
|
||
v-model="localFormElement.title"
|
||
/>
|
||
</div>
|
||
<div class="row form-group">
|
||
<label for="width" class="col-md-3">وزن: </label>
|
||
<input
|
||
class="form-control col-md-9"
|
||
placeholder="وزن"
|
||
type="width"
|
||
id="width"
|
||
name="width"
|
||
v-model="localFormElement.width"
|
||
/>
|
||
</div>
|
||
<div class="row form-group">
|
||
<div class="d-flex justify-content-between">
|
||
<button-component
|
||
classes="btn btn-primary d-inline-flex btn-default"
|
||
buttonText="افزودن"
|
||
type="submit"
|
||
>
|
||
</button-component>
|
||
<button-component
|
||
classes="d-inline-flex btn-danger"
|
||
@click="closeFormShow"
|
||
buttonText="بستن"
|
||
>
|
||
<!-- <span class="tavasi tavasi-Component-71--1"></span> -->
|
||
</button-component>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
props: ["selectedItem", "selectedForm"],
|
||
emits: ["close-form-show", "update-column"],
|
||
|
||
data() {
|
||
return {
|
||
displayMode:'table',
|
||
localFormElement: {
|
||
title: null,
|
||
key: null,
|
||
width: 1,
|
||
},
|
||
};
|
||
},
|
||
mounted() {
|
||
this.localFormElement = structuredClone(this.selectedItem);
|
||
},
|
||
watch: {
|
||
selectedItem(newval) {
|
||
this.localFormElement = structuredClone(newval);
|
||
},
|
||
},
|
||
|
||
methods: {
|
||
closeFormShow() {
|
||
this.$emit("close-form-show");
|
||
},
|
||
saveColumn() {
|
||
const clonedLocalFormElement = structuredClone(this.localFormElement);
|
||
this.$emit("update-column", clonedLocalFormElement);
|
||
},
|
||
},
|
||
};
|
||
</script>
|