Current File : //home/tradevaly/public_html/resources/views/user/pages/message/message.blade.php
@extends('user.ayaan.master')
@push('title','Message')

@push('style')
    <style>
        .container{max-width:1170px; margin:auto;}
img{ max-width:100%;}
.inbox_people {
  background: #f8f8f8 none repeat scroll 0 0;
  float: left;
  overflow: hidden;
  width: 40%; border-right:1px solid #c4c4c4;
}
.inbox_msg {
  border: 1px solid #c4c4c4;
  clear: both;
  overflow: hidden;
}
.top_spac{ margin: 20px 0 0;}


.recent_heading {float: left; width:40%;}
.srch_bar {
  display: inline-block;
  text-align: right;
  width: 60%;
}
.headind_srch{ padding:10px 29px 10px 20px; overflow:hidden; border-bottom:1px solid #c4c4c4;}

.recent_heading h4 {
  color: #05728f;
  font-size: 21px;
  margin: auto;
}
.srch_bar input{ border:1px solid #cdcdcd; border-width:0 0 1px 0; width:80%; padding:2px 0 4px 6px; background:none;}
.srch_bar .input-group-addon button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  padding: 0;
  color: #707070;
  font-size: 18px;
}
.srch_bar .input-group-addon { margin: 0 0 0 -27px;}

.chat_ib h5{ font-size:15px; color:#464646; margin:0 0 8px 0;}
.chat_ib h5 span{ font-size:13px; float:right;}
.chat_ib p{ font-size:14px; color:#989898; margin:auto}
.chat_img {
  float: left;
  width: 11%;
}
.chat_ib {
  float: left;
  padding: 0 0 0 15px;
  width: 88%;
}

.chat_people{ overflow:hidden; clear:both;}
.chat_list {
  border-bottom: 1px solid #c4c4c4;
  margin: 0;
  padding: 18px 16px 10px;
}
.inbox_chat { height: 550px; overflow-y: scroll;}

.active_chat{ background:#ebebeb;}

.incoming_msg_img {
  display: inline-block;
  width: 6%;
}
.received_msg {
  display: inline-block;
  padding: 0 0 0 10px;
  vertical-align: top;
  width: 92%;
 }
 .received_withd_msg p {
  background: #ebebeb none repeat scroll 0 0;
  border-radius: 3px;
  color: #646464;
  font-size: 14px;
  margin: 0;
  padding: 5px 10px 5px 12px;
  width: 100%;
}
.time_date {
  color: #747474;
  display: block;
  font-size: 12px;
  margin: 8px 0 0;
}
.received_withd_msg { width: 57%;}
.mesgs {
  float: left;
  padding: 30px 15px 0 25px;
  width: 100%;
}

 .sent_msg p {
  background: #05728f none repeat scroll 0 0;
  border-radius: 3px;
  font-size: 14px;
  margin: 0; color:#fff;
  padding: 5px 10px 5px 12px;
  width:100%;
}
.outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
.sent_msg {
  float: right;
  width: 46%;
}
.input_msg_write input {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  color: #4c4c4c;
  font-size: 15px;
  min-height: 48px;
  width: 100%;
}

.type_msg {border-top: 1px solid #c4c4c4;position: relative;}
.msg_send_btn {
  background: #05728f none repeat scroll 0 0;
  border: medium none;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  font-size: 17px;
  height: 33px;
  position: absolute;
  right: 0;
  top: 11px;
  width: 33px;
}
.messaging { padding: 0 0 50px 0;}
.msg_history {
  max-height: 516px;
  overflow-y: auto;
}
    </style>
@endpush

@section('content')
<div class="main-content">
<div class="container-fluid">
    <div class="page-content">
        <div class="container-fluid">

            <!-- start page title -->
            <div class="row">
                <div class="col-12">
                    <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                        <h4 class="mb-sm-0 font-size-18">Inbox</h4>

                        <div class="page-title-right">
                            <ol class="breadcrumb m-0">
                                <li class="breadcrumb-item"><a href="javascript: void(0);">Email</a></li>
                                <li class="breadcrumb-item active">Inbox</li>
                            </ol>
                        </div>

                    </div>
                </div>
            </div>
            <!-- end page title -->

            <div class="row">
                <div class="col-12">
                    <!-- Left sidebar -->
                    <div class="email-leftbar card">

                        <h5 class="mt-4">Chat List</h5>
                        @foreach($messageLists as $messageList)
                        
                        @if($messageList->person_one == auth()->id())
                            @if(isset($messageList->personTwo->name))
                            <div class="mt-2 un-read">
                                <a href="{{route('user.message.view',$messageList->chat_id)}}" class="d-flex">
                                <div class="flex-shrink-0 me-3">
                                    <img class="rounded-circle" src="https://ptetutorials.com/images/user-profile.png" alt="Generic placeholder image" height="36">
                                </div>
                                <div class="d-flex justify-content-between w-100">
                                    <div class="flex-grow-1 chat-user-box">
                                        <p class="user-title m-0">{{$messageList->personTwo->name}}</p>
                                        <p class="text-muted">
                                            @if($messageList->last_message !== null)
                                                @php
                                                    $firstTenLetters = substr($messageList->last_message, 0, 15); 
                                                @endphp
                                                {{$firstTenLetters}}...
                                            @else
                                                Start message...
                                            @endif
                                        </p>
                                    </div>
                                    <div>
                                        <strong>{{$messageList->updated_at->format('M y');}}</strong>
                                    </div>
                                </div>
                            </a>
                            </div>
                            @else
                            <div class="mt-2">
                            <a href="javascript:void(0)" class="d-flex">
                                <div class="flex-shrink-0 me-3">
                                    <img class="rounded-circle" src="https://ptetutorials.com/images/user-profile.png" alt="Generic placeholder image" height="36">
                                </div>
                                <div class="flex-grow-1 chat-user-box">
                                    <p class="user-title m-0">Acount Deleted</p>
                                </div>
                            </a>
                        </div>
                            @endif
                        @else
                            @if(isset($messageList->personOne->name))
                            <div class="mt-2 ">
                                <a href="{{route('user.message.view',$messageList->chat_id)}}" class="d-flex">
                                <div class="flex-shrink-0 me-3">
                                    <img class="rounded-circle" src="https://ptetutorials.com/images/user-profile.png" alt="Generic placeholder image" height="36">
                                </div>
                                <div class="d-flex justify-content-between w-100">
                                    <div class="flex-grow-1 chat-user-box">
                                        <p class="user-title m-0">{{$messageList->personOne->name}}</p>
                                        <p class="text-muted">
                                            @if($messageList->last_message !== null)
                                                @php
                                                    $firstTenLetters = substr($messageList->last_message, 0, 15); 
                                                @endphp
                                                {{$firstTenLetters}}...
                                            @else
                                                Start message...
                                            @endif
                                        </p>
                                    </div>
                                    <div>
                                        <strong>{{$messageList->updated_at->format('M y');}}</strong>
                                    </div>
                                </div>
                            </a>
                            </div>
                            @else
                            <div class="mt-2">
                            <a href="javascript:void(0)" class="d-flex">
                                <div class="flex-shrink-0 me-3">
                                    <img class="rounded-circle" src="https://ptetutorials.com/images/user-profile.png" alt="Generic placeholder image" height="36">
                                </div>
                                <div class="flex-grow-1 chat-user-box">
                                    <p class="user-title m-0">Acount Deleted</p>
                                </div>
                            </a>
                        </div>
                            @endif
                        @endif
                        @endforeach
                    </div>
                    <!-- End Left sidebar -->


                    <!-- Right Sidebar -->
                    <div class="email-rightbar mb-3">
                        
                        <div class="card">
                            <div class="card-header d-flex align-items-center ">
                                <div class="incoming_msg_img"> <img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"> </div>
                                <div class="mx-4">
                                    <strong>
                                        @if($sender->person_one == auth()->id())
                                            @if(isset($sender->personTwo->name))
                                                {{$sender->personTwo->name}}
                                            @else
                                                <span class="text-warning">Acount Deleted</span>
                                            @endif
                                        @else
                                            @if(isset($sender->personOne->name))
                                                {{$sender->personOne->name}}
                                            @else
                                                <span class="text-warning">Acount Deleted</span>
                                            @endif
                                        @endif
                                    </strong>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="message-list">
                                    <div class="mesgs">
                                      <div class="msg_history daViewerContainer">
                                        @foreach($messages as $message)
                                            @if($message->type == "inquire")
                                            @php 
                                                $buyoffer = \App\Models\BuyOffer::where('id',$message->inquire_id)->first()->seller_id;
                                            @endphp
                                                <div class="alert alert-danger my-3 text-center" role="alert">
                                                  Chat Start for <a target="_blank" href="{{route('user.recommand.offer.foryou.details',$message->inquire_id)}}" class="alert-link text-info">{{$message->message}}</a>
                                                </div>
                                            @else
                                                @if($message->parent_id == auth()->id())
                                                <div class="outgoing_msg">
                                                  <div class="sent_msg">
                                                    <p>{{$message->message}}</p>
                                                     <span class="time_date"> {{$message->created_at->format('h.i A')}}    |   {{$message->created_at->format('M jS')}}</span></div>
                                                </div>
                                                @else
                                                <div class="incoming_msg">
                                                  <div class="incoming_msg_img"> <img src="https://ptetutorials.com/images/user-profile.png" alt="sunil"> </div>
                                                  <div class="received_msg">
                                                    <div class="received_withd_msg">
                                                      <p>{{$message->message}}</p>
                                                      <span class="time_date"> {{$message->created_at->format('h.i A')}}    |   {{$message->created_at->format('M jS')}}</span></div>
                                                  </div>
                                                </div>
                                                @endif
                                            @endif
                                        @endforeach
                                      </div>
                                      
                                    </div>
                                </div>
                            </div>
                            <div class="card-footer">
                                @if($sender->person_one == auth()->id())
                                    @if(isset($sender->personTwo->name))
                                        <div class="type_msg">
                                            <div class="input_msg_write">
                                                <form action="{{route('user.message.store',$sender->chat_id)}}" method="post">
                                                    @csrf
                                                  <input type="text" name="message"class="write_msg form-control" placeholder="Type a message" />
                                                  <button class="msg_send_btn" type="submit"><i class="fa fa-paper-plane" aria-hidden="true"></i></button>
                                                  </form>
                                            </div>
                                        </div>
                                    @else
                                        <span class="text-danger">You cant sent massege in delete acount</span>
                                    @endif
                                @else
                                    @if(isset($sender->personOne->name))
                                        <div class="type_msg">
                                            <div class="input_msg_write">
                                                <form action="{{route('user.message.store',$sender->chat_id)}}" method="post">
                                                    @csrf
                                                  <input type="text" name="message"class="write_msg form-control" placeholder="Type a message" />
                                                  <button class="msg_send_btn" type="submit"><i class="fa fa-paper-plane" aria-hidden="true"></i></button>
                                                  </form>
                                            </div>
                                        </div>
                                    @else
                                        <span class="text-danger">You cant sent massege in delete acount</span>
                                    @endif
                                @endif
                                
                            </div>

                        </div><!-- card -->


                    </div> <!-- end Col-9 -->

                </div>

            </div><!-- End row -->

        </div> <!-- container-fluid -->
    </div>
</div>
</div>

@push('script')
    <script>
    </script>
@endpush