@extends('layouts.engine')
@section('content')

                    <div class="nk-content nk-content-fluid">
                        <div class="container-xl wide-lg">
                            <div class="nk-content-body">
                                <div class="nk-block-head">
                                    <div class="nk-block-head-content">
                                        <div class="nk-block-head-sub"><span>Security Setting</span></div>
                                        <h2 class="nk-block-title fw-normal">Extraction</h2>
                                        <div class="nk-block-des">
                                            <p>
                                                You have full control to manage user's extraction.
                                                <span class="text-primary"><em class="icon ni ni-info" data-bs-toggle="tooltip" data-bs-placement="right" title="Tooltip on right"></em></span>
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="nk-block">
                                    <div class="card card-bordered">
                                        <div class="card-aside-wrap">
                                            <div class="card-inner card-inner-lg">
                                                <div class="nk-block-head nk-block-head-lg">
                                                    <div class="nk-block-between">
                                                        <div class="nk-block-head-content">
                                                            <h4 class="nk-block-title">Extraction Settings</h4>
                                                            <div class="nk-block-des"><p>These settings are helps you control user's extraction.</p></div>
                                                        </div>
                                                        <div class="nk-block-head-content align-self-start d-lg-none">
                                                            <a href="#" class="toggle btn btn-icon btn-trigger mt-n1" data-target="userAside"><em class="icon ni ni-menu-alt-r"></em></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="nk-block" id="stop">
                                                    <div class="card card-bordered">
                                                        <div class="card-inner-group">
                                                            <stop-extraction id="{!! $et->id !!}"></stop-extraction>
                                                            <div class="card-inner">
                                                                <div class="between-center flex-wrap flex-md-nowrap g-3">
                                                                    <div class="nk-block-text">
                                                                        <h6>Non-Spendable</h6>
                                                                        <p>You can save your all activity logs including unusual activity detected.</p>
                                                                    </div>
                                                                    <div class="nk-block-actions">
                                                                        <ul class="align-center gx-3">
                                                                            <li class="order-md-last">
                                                                                <div class="custom-control custom-switch me-n2">
                                                                                    <input type="checkbox" class="custom-control-input" disabled id="activity-log" /><label class="custom-control-label" for="activity-log"></label>
                                                                                </div>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="card-aside card-aside-left user-aside toggle-slide toggle-slide-left toggle-break-lg" data-content="userAside" data-toggle-screen="lg" data-toggle-overlay="true">
                                                <div class="card-inner-group">
                                                    <div class="card-inner">
                                                        <div class="user-card">
                                                            <div class="user-info"><span class="lead-text">{{ $et->user->name }}</span><span class="sub-text">{{ $et->user->email }}</span></div>
                                                        </div>
                                                    </div>
                                                    <div class="card-inner">
                                                        <div class="user-account-info py-0">
                                                            <h6 class="overline-title-alt">Total Extraction</h6>
                                                            <div class="user-balance">{{ $et->amount }} <small class="currency currency-btc">BTC</small></div>
                                                            <div class="user-account-label"><span class="sub-text">Recovered {{ $et->amount_recovered }} BTC</span></div>
                                                        </div>
                                                    </div>
                                                    <div class="card-inner p-0">
                                                        <ul class="link-list-menu">
                                                            <li>
                                                                <a href="{{ url('/admin/extraction/users/'.$et->id) }}"><em class="icon ni ni-user-fill-c"></em><span>Extract Infomation</span></a>
                                                            </li>
                                                            <li>
                                                                <a href="{{ url('/admin/extraction/add-funds/'.$et->id) }}"><em class="icon ni ni-bell-fill"></em><span>Add/Remove Funds</span></a>
                                                            </li>
                                                            <li>
                                                                <a class="active" href="{{ url('/admin/extraction/settings/'.$et->id) }}"><em class="icon ni ni-lock-alt-fill"></em><span>Extract Settings</span></a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
@endsection

@section('scripts')
    <script src="{{ asset('assets/vue/stop.js') }}"></script>
    <script>
        new Vue({ el: '#stop' })
    </script>   
@endsection