chat_ui/components/chat/modals/ChatCompareModal.vue

<template>
  <div class="container" style="box-sizing: border-box">
    <div v-if="listRelations.length" class="p-4">
      <div>
        <div class="m1">
          <div
            class="search-list__item"
            v-for="(listRelation, key) in listRelations"
            :key="key"
            :id="listRelation._id"
            v-if="!(key == indexAnsver || key == indexAnsver2)"
          >
            <div data-v-1adae240="" class="search-list__content">
              <div data-v-1adae240="" class="search-list__header">
                <span
                  data-v-1adae240=""
                  disabled="disabled"
                  class="label text__14"
                  >پاسخ {{ key + 1 }}
                </span>

                <a
                  href="javascript:void(0)"
                  class="search-list__title text__16"
                  dideo-checked="true"
                  v-if="openClick1"
                  @click.prevent="givAnswerSelected(listRelation, key)"
                  >{{ listRelation._source.summary }}</a
                >
                <a
                  data-v-1adae240=""
                  href="javascript:void(0)"
                  class="search-list__title text__16"
                  dideo-checked="true"
                  v-if="!openClick1"
                  @click.prevent="givAnswerSelected2(listRelation, key)"
                  >{{ listRelation._source.summary }}</a
                >
              </div>
              <!-- <div data-v-1adae240="" class="search-list__meta"></div> -->
              <!-- <div
            data-v-1adae240=""
            class="search-list__content text__14 text__gray"
          >
            {{ listRelation._source.summary }}
          </div> -->
              <!---->
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row  ">
      <div class=" me-auto " style="right: 500px; top: 20px">
        <button
          title="لغو"
          @click.prevent="$emit('close-modal')"
          class="popUp-tab__clear text-13 button"
          type="button"
        >
          لغو
        </button>
      </div>
    </div>
  </div>
</template>

<script>
import repoApi from "~/apis/repoApi";

export default {
  props: ["answersId", "indexAnsver", "indexAnsver2"],

  name: "CompareModal",
  data() {
    return {
      httpService: "",
      entity: {},
      listRelations: [],
      openClick1: true,
      idAnsver: undefined,
    };
  },
  mounted() {
    this.httpService = new HttpService(
      import.meta.env.VITE_REPO_BASE_URL + this.$route.meta.slug
    );
    this.getRelationList();
  },
  watch: {
    indexAnsver2(value) {
      this.getRelationList();
    },
  },
  
  

  methods: {
    mehdi() {},

    // new-mehdi

    getRelationList(relation_type = 1) {
      let id = this.$route.params.id;
      let url = repoApi.entity.relation
        .replace("{{type}}", relation_type)
        .replace("{{id}}", id);

      this.httpService.getRequest(url).then((res) => {
        if (res.hits && res.hits.hits) this.listRelations = res.hits.hits;

        // this.entity = this.listRelations[this.indexAnsver]._source;

        this.fetchingData = false;
      });
    },
    // open(ansver, key){
    //   if(this.indexAnsver){
    //     this.givAnswerSelected(ansver, key);
    //   }
    //   else if(this.indexAnsver2==undefined && this.indexAnsver){
    //     this. givAnswerSelected2(ansver, key);
    //   }
    //   else{
    //     this.givAnswerSelected(ansver, key) ;
    //   }
    // },
    m1() {
      if (!this.indexAnsver2) {
        this.idAnsver = this.indexAnsver2;
      }
    },
    givAnswerSelected(ansver, key) {
      this.$emit("ansverSelected", [ansver, key]);
      this.openClick1 = false;
      this.closeModal();
    },

    givAnswerSelected2(ansver, key) {
      this.$emit("ansverSelected2", [ansver, key]);
      this.openClick1 = true;
      this.closeModal();
    },
    closeModal() {
      $("#jahat-modal").modal("hide");

      setTimeout(() => {
        this.showModal = false;
        this.showSubjectModal = false;
        this.showIssueModal = false;
      }, 500);
    },
    // new-mehdi
  },
};
</script>

<style scoped>
.m1 {
  width: 620px;
  height: 300px;
}
</style>