chat_ui/mixins/messageMixin.js

import chatApi from "~/apis/chatApi";
// import repoApi from "~/apis/repoApi";


export default {
  beforeMount() {
    this.httpService = useNuxtApp()["$http"];
  },
  methods: {
    async getMessages(
      fill_limit = false,
      by_first_message = false,
      seen_date = undefined,
      page = undefined,
      message_id = undefined
    ) {
      // if (this.fetchingData) return;
      // this.fetchingData = true;

      let group_id = undefined;
      let contact_id = undefined;
      let filter_users = this.selectedGroupMember ?? [];
      let filter_labels = this.selectedMessageLabel ?? [];

      group_id = this.listGetter.group_id ?? this.listGetter.id;

      if (this.isRedirectedFromOtherSystems && this.groupId)
        group_id = this.listGetter.group_id ?? this.groupId;
      else if (this.$route.name == "privates") {
        group_id = undefined;
        contact_id = this.listGetter?.user;
      } else if (this.$route.name == "unReads") {
        if (this.listGetter.icon_type == 1)
          contact_id = this.listGetter.user_seen;
        else group_id = this.listGetter.id;
      }

      if (seen_date == undefined) seen_date = this.pagination.seen_date;

      //پیام منطبق با تاریخ درخواستی نیاید
      if (!by_first_message && seen_date > 0) seen_date++;
      if (page == undefined) page = this.pagination.page;

      let payload = {
        group_id: group_id,
        contact_id: contact_id,
        offset: 0,
        limit: this.limit,
        filter_users: filter_users,
        filter_labels: filter_labels,
        seen_date: seen_date,
        page: page,
        message_id: message_id,
      };

      if (this.$route.query["invite-id"])
        payload["invite_id"] = this.$route.query["invite-id"];
      if (fill_limit) payload.fill_limit = 1;
      if (message_id != undefined) payload.seen_date = 0;

      return await this.httpService
        .postRequest("message/" + chatApi.messages.virtualList, payload)
        .then((response) => {
          if (response.data.length) {
            response.data.forEach((item, index) => {
              if (this.isRedirectedFromOtherSystems && this.messageId) {
                item.active = item.id == this.messageId;
                this.prevSelectedItemIndex = index;
              }
              if (this.isRedirectedFromOtherSystems && this.userId) {
                item.active = item.id == this.userId;
                this.prevSelectedItemIndex = index;
              }
              item.user = response.users.find(
                (user) => user.user_id == item.user
              );
              if (item.replys)
                item.replys.users = this.allReplayers(item, response.users);
            });
          }

          this.pagination.total = response.pagination.total;

          // this.showList = true;
          // this.busy = false;

          return response;
        })
        .finally(() => {
          // this.fetchingData = false;
        });
    },
    save(ev, textAreaName, container) {
      // disable scroll when saving data.
      this.busy = true;

      if (this.savingComment) return;
      this.savingComment = true;

      // اگر پیام هدایت شده باشد و کاربر پیامی نوشته نباشد.
      if (
        this.isForward &&
        (this.userMessage == null || this.userMessage == "")
      ) {
        this.saveForward()
          .then((res) => {
            this.pagination.offset = 0;
            this.seenDate = -1;
            this.onSendMessage(res.data);

            // this.localComments.push(res.data);
            // this.setVirtualListToBottom();
            // this.toLastItem();
          })
          .catch((err) => {
            if (
              response.status == 403 &&
              response.data?.meta &&
              response.data?.meta[0]?.is_guest
            ) {
              this.openAuthModal();
            }
          })
          .finally(() => {
            this.mainCommentor = undefined;
            this.userMessage = null;
            this.savingComment = false;
            this.replyComment = false;
            this.isMainEditMode = false;
            this.isForward = false;
            this.SET_FORWARD_ITEM();
          });
        // اگر پیام هدایت شده باشد و کاربر پیامی نوشته باشد.
      } else if (
        this.isForward &&
        (this.userMessage != null || this.userMessage != "")
      ) {
        this.saveForward().then(() => {
          let payload = {
            text: this.userMessage,
            group_id: this.listGetter.id,
            id: this.mainCommentor?.id ?? undefined,
            contact_id: undefined,
            replyto: this.replayTo?.id ?? undefined,
          };

          // private route condition
          if (this.$route.name == "privates") {
            payload = {
              text: this.userMessage,
              contact_id: this.listGetter.user,
            };
          }

          // if user pressed save from right form(main), empty the replayto field.
          if (container === "messages") {
            payload.replyto = undefined;
          }

          let url = "message/" + chatApi.messages.create;

          payload.text = this.replaceTextWithLink(payload.text);

          this.httpService
            .formDataRequest(url, payload)
            .then((res) => {
              // this.mySwalToast({
              //   html: res?.message ?? "",
              // });

              // if (this.isMainEditMode) {
              // this.mainCommentor = undefined;
              // }

              // this.userMessage = null;

              this.pagination.offset = 0;
              this.seenDate = -1;
              this.onSendMessage(res.data);
            })

            .catch((err) => {
              if (
                response.status == 403 &&
                response.data?.meta &&
                response.data?.meta[0]?.is_guest
              ) {
                this.openAuthModal();
              }
            })
            .finally(() => {
              this.mainCommentor = undefined;
              this.userMessage = null;
              this.savingComment = false;
              this.replyComment = false;
              this.isMainEditMode = false;
              this.isForward = false;
              this.SET_FORWARD_ITEM();
            });
        });
        // حالت معمولی(هدایت نشده باشد.)
      } else {
        let payload = {
          text: this.userMessage,
          group_id: this.listGetter.id,
          id: this.mainCommentor?.id ?? undefined,
          contact_id: undefined,
          replyto: this.replayTo?.id ?? undefined,
        };

        // private route condition
        if (this.$route.name == "privates") {
          payload = {
            text: this.userMessage,
            id: this.mainCommentor?.id ?? undefined,
            contact_id: this.listGetter.user,
          };
        }

        // if user pressed save from right form(main), empty the replayto field.
        if (container === "messages") {
          payload.replyto = {};
        }

        let url = "message/" + chatApi.messages.create;

        payload.text = this.replaceTextWithLink(payload.text);

        this.httpService
          .formDataRequest(url, payload)
          .then((res) => {
            // this.mySwalToast({
            //   html: res?.message ?? "",
            // });

            if (this.isMainEditMode) {
              this.mainCommentor = undefined;
            }

            // this.$root.emit('update-group-list')

            this.userMessage = null;

            this.toLastItem();
          })

          .catch(({ response }) => {
            if (
              response.status == 403 &&
              response.data?.meta &&
              response.data?.meta[0]?.is_guest
            ) {
              this.openAuthModal();
            }
          })
          .finally(() => {
            this.savingComment = false;
            this.replyComment = false;
            this.isMainEditMode = false;
            this.SET_FORWARD_ITEM();
          });
      }

      this.closeReplays();
    },
    deleteItem(comment, index, editFrom, replayFrom) {
      if (this.buttonLoading) return;
      this.buttonLoading = true;

      let html = `آیا مطمئن هستید که می‌خواهید این پیام را حذف کنید؟`;

      if (comment?.replys?.count > 0)
        html = `آیا مطمئن هستید که می‌خواهید این پیام را حذف کنید؟<br/>
        با حذف این پیام، رشته‌ٔ پاسخ آن (شامل ${comment.replys.count} پاسخ) نیز حذف خواهد شد.
        `;

      this.mySwalConfirm({
        title: "هشدار!!!",
        html,
      }).then((result) => {
        if (result.isConfirmed) {
          let payload = {
            group_id: this.listGetter.id,
            contact_id: undefined,
            messages_id: [comment.id],
          };

          if (this.$route.name == "privates") {
            payload = {
              group_id: undefined,
              contact_id: this.listGetter.user,
              messages_id: [comment.id],
            };
          }

          let url = "message/" + chatApi.privates.delete;

          this.httpService
            .postRequest(url, payload)
            .then((res) => {
              // this.mySwalToast({
              //   title: "",
              //   html: res.message,
              // });

              // this.updateMessageCount();
              if (replayFrom == "replays") this.replays.splice(index, 1);
              else {
                this.localComments.splice(index, 1);
                this.closeReplays();
              }

              // this.getMessages();
            })
            .catch((err) => {})
            .finally(() => {
              this.buttonLoading = false;
              // this.showList = !this.showList;
            });
        } else this.buttonLoading = false;
      });
    },
    deleteMany() {
      if (this.buttonLoading) return;
      this.buttonLoading = true;

      this.mySwalConfirm({
        title: "هشدار!!!",
        html: "آیا مطمئن هستید که می‌خواهید این پیام را حذف کنید؟",
      }).then((result) => {
        if (result.isConfirmed) {
          let payload = {
            group_id: this.listGetter.id,
            contact_id: undefined,
            messages_id: this.selectedCommentsId,
          };

          if (this.$route.name == "privates") {
            payload = {
              group_id: undefined,
              contact_id: this.listGetter.user,
              messages_id: this.selectedCommentsId,
            };
          }

          let url = "message/" + chatApi.privates.delete;

          this.httpService
            .postRequest(url, payload)
            .then((res) => {
              this.mySwalToast({
                title: "",
                html: res.message,
              });

              this.selectedCommentsId.forEach((id) => {
                this.localComments = this.localComments.filter(
                  (fi) => fi.id != id
                );
              });

              this.selectedCommentsId = [];
              this.showSelectionActionBar = false;

              // this.pagination.offset = 0;

              // this.pagination.seenDate = -1;
              // this.pagination.page = -1;
              // this.pagination.pageBottom = 0;
              // this.pagination.pageTop = -1;

              // this.toLastItem();
            })
            .catch((err) => {})
            .finally(() => {
              this.buttonLoading = false;
              // this.showList = !this.showList;
            });
        }
      });
    },
    onSendMessage(message) {
      this.localComments.push(message);
      this.$nextTick(() => {
        this.setVirtualListToBottom();
      });
    },
    editComment(comment, listRefName, editModeName) {
      try {
        this.$refs[listRefName].style.removeProperty("height");
      } catch (err) {
        this.$refs[listRefName].style.height = null;
      }

      if (editModeName == "isMainEditMode") {
        this.mainCommentor = comment;

        this.isMainEditMode = true;
        this.userMessage = this.parseText(comment.text);
      } else {
        this.replayCommentor = comment;

        this.isReplayEditMode = true;
        this.replayText = this.parseText(comment.text);
      }
    },
    replyComments(comment, listRefName) {
      try {
        this.$refs[listRefName].style.removeProperty("height");
      } catch (err) {
        this.$refs[listRefName].style.height = null;
      }

      this.replayText = null;
      this.replayCommentor = comment;
      this.isReplayEditMode = true;
      // this.commentor = comment;
    },
    openReplays(comment, index) {
      this.replayFirstLoad = true;
      // this.replayPagination.seen_date =-1;

      // this.SET_SELECTED_ITEM(comment);
      this.replayTo = comment;
      this.markActive(this.localComments, index);

      // fill_limit = false,
      // by_first_message = false,
      // seen_date = undefined,
      // page = undefined,
      // message_id = undefined

      this.getReplays(false, false, comment.created_at, 0).then((response) => {
        this.replays = response?.data ?? [];
        this.replayPagination.seen_date = response?.pagination.new_seen_date;

        this.showReplays = true;
      });
    },
    closeComments(isEditModeName) {
      this.isForward = false;
      this.replyComment = false;
      this[isEditModeName] = false;
      this.userMessage = null;

      // try {
      //   this.$refs.messages.style.removeProperty("height");
      //   this.$refs.mainTextAreaInput.style.removeProperty("height");
      // } catch (err) {
      //   this.$refs.messages.style.height = null;
      //   this.$refs.mainTextAreaInput.style.height = null;
      // }
    },
    markActive(comments, index) {
      if (this.prevSelectedItemIndex != index) {
        this.$set(comments[this.prevSelectedItemIndex], "active", false);
      }

      this.prevSelectedItemIndex = index;
      this.$set(comments[index], "active", true);
    },
  },
};