@extends('layouts.admin')
@section('page_title')
@parent
نمایش پیام های تیکت
@endsection
@section('head-js')
<script src="{{asset('/assets/plugins/ckeditor1/ckeditor.js')}}"></script>
@endsection
@section('main')
  <div class="header">
    <h2>{{$ticket->subject}}</h2>
    <div class="breadcrumb-wrapper">
      <ol class="breadcrumb">
        <li><a href="/admin/dashboard">پیشخوان</a></li>
        <li><a href="/admin/tickets">تیکت پشتیبانی</a></li>
        <li class="active">نمایش پیام های تیکت</li>
      </ol>
    </div>
    @include('admin.error')
    </div>

@foreach($msgs as $msg)
  @if($msg->isuser == 0)

  <div class="row send">
    <div class="col-sm-1">
        <div class="smessage-avatar">
          <img src="/uploads/general/avatar-aghayedaroo.jpg" width="50px" height="50px" class="smessage-avatar">
        </div>
        <div class="msg-name">
            <h5 class="msg-name">{{$defaultset->webtitle}}</h5>
        </div>
    </div>
    <div class="arrow-right-msg"></div>
    <div class="col-sm-6" style="padding-right: 0;">
      <div class="panel">
       <div class="panel-content">
          <div class="msg-content">
            {!! $msg->content !!}
          </div>
          <div class="attach">
              @if($msg->attach)
                <a class="attach" target="_blank" href="{{asset('uploads/ticket-attach/'.$msg->attach)}}">
                  <i class="icon-paper-clip attach"></i> {{$msg->attach}}
                </a>
              @endif

          </div>
            <small>{{\Morilog\Jalali\Jalalian::forge($msg->created_at)->format('d F Y در H:i')}}</small>
       </div>
      </div>
    </div>
    <div class="col-sm-5"></div>
  </div>


  @else
<div class="row recieve">
  <div class="col-sm-5"></div>
    <div class="col-sm-6" style="padding-right: 0;">
        <div class="arrow-left-msg"></div>
      <div class="panel">
       <div class="panel-content">
          <div class="msg-content">
            {!! $msg->content !!}
          </div>
          <div class="attach">
              @if($msg->attach)
                <a class="attach" target="_blank" href="{{asset('uploads/ticket-attach/'.$msg->attach)}}">
                  <i class="icon-paper-clip attach"></i> {{$msg->attach}}
                </a>
              @endif
          </div>
          <small>{{\Morilog\Jalali\Jalalian::forge($msg->created_at)->format('d F Y در H:i')}}</small>
       </div>
      </div>
    </div>
    <div class="col-sm-1">
        <div class="smessage-avatar">
          <img @if($user->avatar) src="{{asset('/uploads/avatars/'.$user->avatar)}}" @else src="/avatar.png" @endif width="50px" height="50px" class="smessage-avatar">
        </div>
        <div class="msg-name">
            <h5 class="msg-name">{{$user->fname}} {{$user->lname}}</h5>
        </div>
    </div>

  </div>

  @endif
  @endforeach
  @can('answer-ticket')
<div class="row">
  <div class="col-md-9">
  {!! Form::open(['url' => '/admin/tickets/answer/'.$ticket->id, 'method' => 'post' ,'enctype'=>'multipart/form-data']) !!}
      <div class="panel">
        <div class="panel-header bg-green">
          <h3 style="font-weight: bold;"><i class="fa fa-paper-plane" style="padding-top: 6px;" aria-hidden="true"></i> ارسال پیام</h3>
        </div>
         <div class="panel-content bg-green panel-comment">
          <div class="col-sm-12">
            <div class="append-icon" style="margin-top: 10px;">
                <textarea type="text" class="form-control form-white" name="content" rows="4" placeholder="متن پیام ..." required></textarea>
                <i class="fa fa-comment-o"></i>
                <script>CKEDITOR.replace('content',{
                  language: 'fa',
                  removePlugins: 'toolbar'
                } );
                </script>
            </div>
            <div class="form-group">
              <input type="file" class="form-control" name="attach">
            </div>

            <div class="form-group col-sm-12">
              <label><input type="checkbox" name="sendsms" value="1"/> مطلع ساختن کاربر از طریق پیام کوتاه</label>
            </div>
          </div>
        </div>
        <div class="panel-footer bg-green">
          <button class="btn btn-dark" type="submit">ارسال پیام</button>
            <span class="btn btn-danger" data-toggle="modal" data-target="#close"><i class="icon-close"></i> بستن تیکت</span>
        </div>
      </div>
  {!! Form::close() !!}
    </div>
  </div>
  
            <div id="close" class="modal fade" role="dialog">
              <div class="modal-dialog">
                <!-- Modal content-->
                <div class="modal-content">
                  {!! Form::open(['url' => '/admin/tickets/close/'.$ticket->id , 'method' => 'POST']) !!}
                  <div class="modal-header bg-green">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">بستن تیکت </h4>
                  </div>
                  <div class="modal-body">
                    <h5>از بستن تیکت با موضوع <strong> {{$ticket->subject}} </strong> در رابطه با <strong>{{$ticket->users->fname}} {{$ticket->users->lname}}</strong> اطمینان دارید؟ </h5>
                  </div>
                  <div class="modal-footer">
                    <button type="submit"  class="btn btn-danger">تأیید و بسته شود</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">انصراف</button>
                  </div>
                  {!! Form::close() !!}
                </div>
              </div>
            </div>  
  @endcan
</div>
<style type="text/css">

.content {
    padding-top: 30px;
}
.panel-comment{
  padding: 20px 3px 10px 3px !important;
}
.fileinput.fileinput-new.input-group {
    padding: 13px;
}
.fileinput.input-group{
  padding: 13px;
}
.smessage-avatar{
  border-radius: 50%;
  width: 50px;
  height: 50px;
margin-right: 15px;
    margin-top: 3px;
}
.msg-name{

  margin-right: 17px;
  line-height: 11px;
  font-size: 12px;
}

.bg-gray{
  background-color: #eee;
  height: 100px;
  padding: 20px;
}
.arrow-right-msg {
    width: 0;
    height: 0;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 14px solid #fff;
    float: right;
    margin-top: 16px;
    margin-right: 15px;
}
.arrow-left-msg{
  width: 0;
  height: 0;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-right:14px solid #fff;
  float:left;
  margin-left: -14px;
  margin-top: 15px;
}

.attach i {
    font-size: 13px;
    color: #000;
    margin-right: 8px;
}
.attach {
    padding-top: 30px;
}
</style>
@endsection