<template>
  <section
    v-bind:class="[
      componentClass,
      {'c-exp': isExpanded}
    ]"
  >
    <div class="c-gb" :data-caption="caption">
      <!-- <div>{{ this.appWindowIdent }}</div>
      <div>{{ this.dataSetIdent }}</div> -->
      <c-edit
        class="c-search"
        :appWindowIdent="appWindowIdent"
        :dataSetIdent="dataSetIdent"
        dataFieldIdent="searchText"
        sourceKind="where"
        :showRefresh="true"
        oncfTrigger="enter"
        :autofocus="true"
        :showLabel=false
      />
      <div class="c-cont-add">
        <slot name="content-add" v-bind:row="row" v-bind:where="where" ></slot>
      </div>
    </div>

    <div class="c-cont">
      <slot name="content" v-bind:row="row" v-bind:where="where" ></slot>
    </div>
    <button
      :class="[
        this.isExpanded == true ? 'c-btn-filters-collapse' : 'c-btn-filters-expand'
      ]"
      v-on:click="onClickExpandCollapse"
    ></button>

  </section>
</template>


<script>
import base from "./c-base"

export default {
  extends: base,
  data: function () {
    return {
      componentClass: 'c-filter-panel',
      isExpanded: false
    };
  },
  props: {
    caption: {
      type: String,
      default: 'Zawężanie wyników'
    }
    // expanded: {
    //   type: Boolean,
    //   default: true
    // }
  },
  methods: {
    // ...mapActions("csAppWindowsUtils", ["deleteAllSelectedRow"]),
    onClickExpandCollapse: function() {
      this.isExpanded = !this.isExpanded
    }
  }
};
</script>