replyTicket.blade.php 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. @extends('admin.layouts')
  2. @section('css')
  3. <link href="/assets/examples/css/structure/chat.css" type="text/css" rel="stylesheet">
  4. @endsection
  5. @section('content')
  6. <div class="page-content">
  7. <div class="panel panel-bordered">
  8. <div class="panel-heading">
  9. <h1 class="panel-title cyan-600"><i class="icon wb-help-circle"></i> {{$ticket->title}} </h1>
  10. @if($ticket->status != 2)
  11. <div class="panel-actions">
  12. <a href="/ticket/ticketList" class="btn btn-danger">返 回</a>
  13. <button class="btn btn-danger" onclick="closeTicket()"> {{trans('home.ticket_close')}} </button>
  14. </div>
  15. @endif
  16. </div>
  17. <div class="panel-body">
  18. <div class="chat-box">
  19. <div class="chats">
  20. <div class="chat chat-left">
  21. <div class="chat-avatar">
  22. <p class="avatar" data-toggle="tooltip" data-placement="right" title="{{trans('home.ticket_reply_me')}}">
  23. <img src="/assets/images/astronaut.svg" alt="{{trans('home.ticket_reply_me')}}"/>
  24. </p>
  25. </div>
  26. <div class="chat-body">
  27. <div class="chat-content">
  28. <p>
  29. {!! $ticket->content !!}
  30. </p>
  31. <time class="chat-time">{{$ticket->created_at}}</time>
  32. </div>
  33. </div>
  34. </div>
  35. @foreach ($replyList as $reply)
  36. <div class="chat @if (!$reply->user->is_admin) chat-left @endif">
  37. <div class="chat-avatar">
  38. @if ($reply->user->is_admin)
  39. <p class="avatar" data-toggle="tooltip" data-placement="left" title="{{trans('home.ticket_reply_master')}}">
  40. <img src="/assets/images/logo64.png" alt="{{trans('home.ticket_reply_master')}}"/>
  41. </p>
  42. @else
  43. <p class="avatar" data-toggle="tooltip" data-placement="left" title="{{trans('home.ticket_reply_me')}}">
  44. <img src="/assets/images/astronaut.svg" alt="{{trans('home.ticket_reply_me')}}"/>
  45. </p>
  46. @endif
  47. </div>
  48. <div class="chat-body">
  49. <div class="chat-content">
  50. <p>
  51. {!! $reply->content!!}
  52. </p>
  53. <time class="chat-time">{{$reply->created_at}}</time>
  54. </div>
  55. </div>
  56. </div>
  57. @endforeach
  58. </div>
  59. </div>
  60. </div>
  61. @if($ticket->status != 2)
  62. <div class="panel-footer pb-30">
  63. <form>
  64. <div class="input-group">
  65. <input id="editor" type="text" class="form-control" placeholder="{{trans('home.ticket_reply_placeholder')}}"/>
  66. <span class="input-group-btn">
  67. <button type="button" class="btn btn-primary" onclick="replyTicket()"> {{trans('home.ticket_reply')}}</button>
  68. </span>
  69. </div>
  70. </form>
  71. </div>
  72. @endif
  73. </div>
  74. </div>
  75. @endsection
  76. @section('script')
  77. <script type="text/javascript">
  78. //回车检测
  79. $(document).on("keypress", "input", function (e) {
  80. if (e.which === 13) {
  81. replyTicket();
  82. return false;
  83. }
  84. });
  85. // 关闭工单
  86. function closeTicket() {
  87. swal.fire({
  88. title: '确定关闭工单?',
  89. type: 'question',
  90. allowEnterKey: false,
  91. showCancelButton: true,
  92. cancelButtonText: '{{trans('home.ticket_close')}}',
  93. confirmButtonText: '{{trans('home.ticket_confirm')}}',
  94. }).then((result) => {
  95. if (result.value) {
  96. $.ajax({
  97. type: "POST",
  98. url: "/ticket/closeTicket",
  99. async: true,
  100. data: {_token: '{{csrf_token()}}', id: '{{$ticket->id}}'},
  101. dataType: 'json',
  102. success: function (ret) {
  103. swal.fire({
  104. title: ret.message,
  105. type: 'success',
  106. timer: 1000,
  107. showConfirmButton: false
  108. }).then(() => window.location.href = '/ticket/ticketList')
  109. },
  110. error: function () {
  111. swal.fire("未知错误!请通知客服!")
  112. }
  113. })
  114. }
  115. })
  116. }
  117. // 回复工单
  118. function replyTicket() {
  119. const content = document.getElementById('editor').value;
  120. if (content.trim() === '') {
  121. swal.fire({title: '您未填写工单内容!', type: 'warning', timer: 1500});
  122. return false;
  123. }
  124. swal.fire({
  125. title: '确定回复工单?',
  126. type: 'question',
  127. showCancelButton: true,
  128. cancelButtonText: '{{trans('home.ticket_close')}}',
  129. confirmButtonText: '{{trans('home.ticket_confirm')}}',
  130. }).then((result) => {
  131. if (result.value) {
  132. $.post("/ticket/replyTicket", {
  133. _token: '{{csrf_token()}}',
  134. id: '{{$ticket->id}}',
  135. content: content
  136. }, function (ret) {
  137. if (ret.status === 'success') {
  138. swal.fire({
  139. title: ret.message,
  140. type: 'success',
  141. timer: 1000,
  142. showConfirmButton: false
  143. })
  144. .then(() => window.location.reload())
  145. } else {
  146. swal.fire({title: ret.message, type: "error"}).then(() => window.location.reload())
  147. }
  148. });
  149. }
  150. })
  151. }
  152. </script>
  153. @endsection