@extends("cms.layouts.app")

@section("title")
{{ __('cms.object_details', ['object' => __('cms.user.display_name')]) }}
@endsection

{{-- @push("lib_css")
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
@endpush --}}

@php
    $isActive = $member->status == User::Active;
@endphp

@push("js")
{{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js" integrity="sha256-4iQZ6BVL4qNKlQ27TExEhBN1HFPvAvAMbFavKKosSWQ=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> --}}
<script type="text/javascript">
  $(function () {
    $('.btn-item-toggle').on('click', function(e) {
            var id = '{{$member->id}}';
            var name = '{{$member->name}}';
            var status = '{{$member->status}}';

            var isActive = status == {{ User::Active }};
            var msg = '{{ __('cms.form.activate_message', ['action' => $member->status == User::Active ? __('cms.form.inactivate') : __('cms.form.activate') , 'object' => $member->name]) }}';
          if (confirm(msg)) {
            var form = $("#form-inactivate-item");
            var route = isActive? '{{ route('cms.users.inactivate', '__id__') }}' : '{{ route('cms.users.activate', '__id__') }}'
            var form_action = route.replace('__id__', id);
            form.attr('action', form_action);
            form.submit();
          } else {
              //set it back to previous state
              $(this).attr('aria-pressed', function(_, attr){ return !attr});
              $(this).toggleClass('active');
          }
    });

    $('.btn-item-edit').on('click', function(e) {
        var url = '{{ route('cms.users.edit', '__id__') }}'.replace('__id__', {{ $member->id }});
        window.location.href = url;
    });
  })
</script>
@endpush

@section("content")
{{ Form::open(['method' => 'POST', 'id' => "form-inactivate-item"]) }} {{ Form::close() }}

<div class="card">
	<div class="card-header d-flex p-0">
		<h3 class="card-title p-3">
			{{ $member->name }}
        </h3>
        @hasanyrole('super_admin')
            <div class="ml-auto px-3 py-2">
                <button type="button" class="btn btn-default btn-item-edit" title="Edit"><i class="fas fa-edit"></i></button>
            </div>
        @endhasanyrole
	</div>

	<div class="card-body">
        <strong>{{__('cms.status')}}</strong>
        <p>
        <button type="button" class="btn btn-sm btn-toggle btn-item-toggle {{ $isActive? 'active': '' }} mx-0 mt-2" data-toggle="button" aria-pressed="{{ $isActive? 'true': 'false' }}" autocomplete="off"><div class="handle"></div></button>
        </p>
        <hr>

        <strong>{{__('cms.user.display_id')}}</strong>
		<p class="text-muted">{{ $member->display_id }}</p>
		<hr>

        <strong>{{ __('cms.user.email_verified') }}</strong>
		<p class="text-muted">{{ $member->hasVerifiedEmail() ? __('cms.yes') : __('cms.no') }}</p>
		<hr>

		<strong>{{__('cms.user.first_name')}}</strong>
		<p class="text-muted">{{ $member->first_name }}</p>
		<hr>

		<strong>{{__('cms.user.last_name')}}</strong>
		<p class="text-muted">{{ $member->last_name }}</p>
		<hr>

		<strong>{{__('cms.email')}}</strong>
		<p class="text-muted">{{ $member->email }}</p>
		<hr>

		<div class="row">
			<div class="col-sm-6">
				<strong>{{__('cms.updated_by')}}</strong>
                <p class="text-muted">{{ $member->cms_updated_by ? $member->updated_by_cms_user->name : __('cms.na') }}</p>
			</div>
			<div class="col-sm-6">
				<strong>{{__('cms.updated_at')}}</strong>
                <p class="text-muted">{{ $member->cms_updated_at ? $member->cms_updated_at : __('cms.na') }}</p>
			</div>
		</div>

	</div>
	<!-- /.card-body -->
</div>
@endsection