@extends('layouts.frontend-member')

@section('title', __('message.withdraw'))

@section('content')
    <div class="container-fluid" style="padding:0px;width:100vw;">
        <div class="no_header" style="position: fixed;z-index: 9999;padding:0px 10px;top:0px;">
            <div class="fl allhg txtl" style="line-height:50px;width:10%;">
                <i class="bi bi-arrow-left fcc fw pointer" onclick="goback()" style="font-size: 24px;"></i>
            </div>

            <div class="fl allhg" id="centerbox" style="width:80%;text-align:center;line-height:50px;">
                <span class="fcc fzmmm">เปลี่ยนรหัสผ่าน</span>
            </div>

            <div class="fr allhg txtr" style="line-height:50px;width:10%;">
            </div>
        </div>
        <form action="{{ route('member.withdraw.changepass.update') }}" method="post" enctype="multipart/form-data">
            {{ csrf_field() }}

            <div class="no_content" style="width:90%;margin:60px auto;">

                <div class="no_title" id="h1title" style="line-height: 24px;margin-bottom:20px;">
                    <span style="color:red;">*หากคุณลืมรหัสผ่านเก่าและไม่สามารถเปลี่ยนรหัสผ่านการถอนเหรียญนได้
                        โปรดติดจุดต่ำสุดอฝ่ายบริการลูกค้าออนไลน์เป็นครั้งแรกเพื่อยืนยันตัวตนของคุณ จากนั้นทำการแก้ไข。</span>
                </div>

                <div class="no_inbox">

                    <div class="inputbox boxh">
                        <div class="input_title txtl">
                            <span class="fzmm fcc">รหัสผ่านใหม่</span>
                        </div>
                        <div class="input_div">
                            <input type="password" class="cinput" name="withdrawal_code" id="amount" style="color:red;"
                                placeholder="กรุณาใส่รหัสผ่านใหม่" required>
                        </div>
                    </div>

                    <div class="inputbox boxh">
                        <div class="input_title txtl">
                            <span class="fzmm fcc">ยืนยันรหัสผ่าน</span>
                        </div>
                        <div class="input_div">
                            <input type="password" class="cinput" name="confirm_withdrawal_code" id="renewpwd"
                                style="color:red;" placeholder="กรุณากรอกรหัสผ่านยืนยัน" required>
                        </div>
                    </div>


                    <div class="inputbox boxh">
                        <button type="submit" class="allbtn" id="mo_submit_n" style="border: none;" disabled>
                            <span class="fzmm">ส่ง</span>
                        </button>
                    </div>
                </div>
            </div>
        </form>
    </div>


@endsection

@push('styles')
    <link rel="stylesheet" href="{{ asset('fronts/assets/layer.css') }}" id="layui_layer_skinlayercss">
    <style>
        .van-tabbar-item {
            background: rgb(69 18 114) !important;
        }

        .van-notice-bar {
            background: rgb(69 18 114) !important;
        }

        .van-nav-bar {
            background: rgb(69 18 114) !important;
        }

        ::-webkit-input-placeholder {
            /* WebKit browsers */
            color: #b5b5b5;
            font-size: 18px;
        }

        ::-moz-placeholder {
            /* Mozilla Firefox 19+ */
            color: #b5b5b5;
            font-size: 18px;
        }

        a:hover,
        a:link,
        a:visited,
        a:active {
            color: #FCD535;
            text-decoration: none;
        }

        .bmbtn {
            width: 100%;
            position: fixed;
            bottom: 0px;
            padding: 10px;
        }

        .bmbtn_l {
            width: 45%;
            height: 40px;
            float: left;
            background: #ebecf0;
            border-radius: 5px;
            line-height: 40px;
            text-align: center;
        }

        .bmbtn_r {
            width: 45%;
            height: 40px;
            float: right;
            background: #0052fe;
            color: #fff;
            border-radius: 5px;
            line-height: 40px;
            text-align: center;
        }

        .badge-light {
            background-color: #FCD535;
            position: relative;
            left: 15px;
            top: -35px;
        }

        .badge {
            line-height: 0.4;
            border-radius: .5rem;
        }

        .no_inbox {
            width: 100%;
            height: 300px;
            margin-top: 50px;
            background: #121420;
            min-height: 650px;
        }

        input::placeholder {
            font-size: 12px;
        }

        .cinput {
            background: #1b1d2a !important;
        }

        .cinput:focus {
            border-color: none;
            border: none;
        }

        .allbtn {
            background: #00b897 !important;
            cursor: pointer;
        }
    </style>
@endpush
@push('scripts')
    <script type="text/javascript">
        $('input[name="withdrawal_code"],input[name="confirm_withdrawal_code"]').on("keyup", function() {
            var withdrawal_code = $('input[name="withdrawal_code"]').val();
            var confirm_withdrawal_code = $('input[name="confirm_withdrawal_code"]').val();
            if (withdrawal_code != '') {
                if (withdrawal_code == confirm_withdrawal_code) {
                    $('#mo_submit_n').removeAttr('disabled')
                } else {
                    $('#mo_submit_n').attr('disabled', true)

                }
            } else {
                $('#mo_submit_n').removeAttr('disabled')
            }
            // alert(confirm_withdrawal_code+":"+ withdrawal_code)
        });

        function goback() {
            window.history.go(-1);
        }
    </script>

    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="{{ asset('fronts/assets/layer.js') }}"></script>
    <script type="text/javascript" src="{{ asset('fronts/assets/layui.js') }}"></script>

    <script type="text/javascript">
        $('#framefav').click(function() {
            $('#formFilefav').click();
        });

        function previewfav() {
            framefav.src = URL.createObjectURL(event.target.files[0]);
        }
    </script>
@endpush