<template>
  <div class="position-relative">
    <form>
    <div class="form-row text__14">
      <label for="">مساله </label>
      <span>{{ data.entity.title }}</span>
    </div>
    <div class="form-row">
      <label for="">وضعیت </label>
      <select v-model="value" name="" id="" class="form-control">
        <option
          :selected="index == 0"
          v-for="(option, index) in all_statuses"
          :value="option.id"
          :key="option.id"
          >{{ option.label }}</option
        >
      </select>
      <!-- <vue-select
        dir="rtl"
        v-model="value"
        :options="all_statuses"
      ></vue-select> -->
    </div>

    <div class="popUp-tab__buttons">
      <button
        title="لغو"
        @click.prevent="$emit('close-modal')"
        class="popUp-tab__clear btn"
        type="button"
        ref="closeStatusModal"
      >
        لغو
      </button>
      <button
        type="button"
        class="popUp-tab__submit btn"
        @click.prevent="saveProperty(value.id)"
      >
        ثبت
      </button>
    </div>

    <!-- <div class="popUp-tab__buttons">
      <a
        href="###"
        class="popUp-tab__clear"
        data-dismiss="modal"
        ref="closeStatusModal"
        >لغو</a
      >
      <a
        href="###"
        class="popUp-tab__submit"
        data-dismiss="modal"
        @click="saveProperty(value.id)"
        >ثبت</a
      >
    </div> -->
  </form>
  </div>
</template>

<script>
import { propertyMixin } from "~/entity/mixins/propertyMixin";
import { commonMixin } from "~/entity/mixins/commonMixin";

export default {
  mixins: [propertyMixin, commonMixin],
  props: {
    data: { type: Object, default: () => ({}) },
  },
  data() {
    return {
      // property: {
      //   entity_value: {
      //     title: ''
      //   },
      //   entity_id: this.data.answerId,
      // },
      value: 0,
    };
  },

  computed: {
    // propertyObj(){
    //   if(this.data.property){
    //     return this.data.property;
    //   } else {
    //     return this.property;
    //   }
    // }
  },

  methods: {
    // ...mapActions("jahat",['SAVE_STATUS']),

    // saveProperty(){
    //   let self = this;
    //   let property = this.propertyObj;
    //   let index = 0;

    //   this.SAVE_STATUS({property,vm:this}).then(response => {
    //     self.$emit('change', {item: response.data, type: 'statuses', index: index});
    //     self.closeModal();
    //   });
    // },

    // getAllStatuses(){
    //   let self = this;
    //   ApiService.get(
    //       null,
    //       "entity/statuses",
    //       function(response) {
    //           response.data.forEach(item => {
    //             let data = {
    //               id: item.id,
    //               label: item.title
    //             }
    //             self.all_statuses.push(data);
    //           });
    //       },
    //       function() {
    //         // context.commit(PURGE_AUTH);
    //       }
    //   );
    // },

    closeModal() {
      // this.propertyObj.entity_value = {title: ''};
      this.$refs.closeStatusModal.click();
    },
  },

  mounted() {
    // this.getAllStatuses();
    this.value = this.getPropertyValue(
      this.data.entity,
      this.data.keyName,
      this.data.index
    );
  },
};
</script>
