@extends($activeTemplate.'layouts.users')

@push('style')
<style>
.typeitem {float: left;width: 50%;height: auto;overflow: hidden;margin-left: 0px;}
.over {border-bottom: 1px solid #000;}.successful{color:#28c76f !important;font-weight:800;}
</style>
@endpush

@section('content')
    <uni-app class="uni-app--showtabbar uni-app--maxwidth">
        <uni-page data-page="pages/index/my">
            <uni-page-wrapper class="inVust">
                <uni-page-body>
                    <uni-view data-v-0189cbc8="" class="content" style="overflow: visible;padding-top:0px;height:100vh;">

						<div style="background: none; height: auto; overflow: hidden; ">
							<div class="top" style="background: none;">
								<div data-href="{{ route('user.home') }}" class="returnBank" style="float:left; line-height:46px;width:50%; height:46px;cursor:pointer;" id="btnClose">
									<img src="{{ asset($activeTemplateTrue.'img/back.png') }}" style="margin-left:12px;width:28px;" />
								</div>
							</div>
							<div style="padding-top:30px;">
								<div style="float: left; width: 100%; text-align: center; color: #fff;">
									<div style="height: 100px; line-height: 100px; margin:25px auto; width:100px; border-radius: 100px; background:#fff;">
										<img src="{{ getImage(imagePath()['logoIcon']['path'] .'/favicon.png') }}{{ $catch}}" style="height: 90px; border-radius:100px;">
									</div>
									<div style="padding:5px; padding-top:10px;color:#fff; font-weight:bold; font-size:20px; margin-top:10px;" id="uid">System Reward</div>
									<div style="padding:5px; padding-top:5px;color:#fff; font-size:12px;">Have a gift code, use it to claim rewards and discounts</div>
								</div>
							</div>
						</div>


						<div class="layui-form layui-tab-content" style="padding:5px 10px; margin:20px 0 80px 0;">
							<div class="layui-form layui-tab-content" style="padding: 10px 0;">
								<div class="layui-form">
									<div class="layui-form layui-form-pane">
										<div class="layui-form-item layui-form-text">
											<div class="layui-input-block" style="">
												<form action="{{ route('user.gift.redeem') }}" method="post" style="margin: 10px; line-height:20px; color:#808080;margin-top:0px;">
													@csrf  <br/>
													
													<uni-view data-v-43007dac="" class="info" style="margin-top:10px">
														<uni-input data-v-64270b22="" class="inView" style="background-color: #f5f5f5;height:auto;margin-top:8px;border-radius: 8px; padding: 4px;border-bottom: 1px #eee solid;">
															<span data-v-64270b22="" class="" style="margin-left:9px;width: 94%;display: flex;justify-content: space-between;">
																<span data-v-0a75b799="" style="margin-top:7px"><img src="{{ asset($activeTemplateTrue.'img/coupon.png') }}" style="width:24px" /></span>
																<input name="code" id="code" style="width:78%;padding:10px 2px;background:transparent;" placeholder="Enter gift code" name="code" enterkeyhint="done" autocomplete="off" type="text" class="uni-input-input">
																<span data-v-0a75b799="" class="eyeView" style="margin-top:9px"><img src="{{ asset($activeTemplateTrue.'img/money.png') }}" style="width:24px" /></span>
															</span>
														</uni-input>
													</uni-view>

													<div class="layui-form layui-form-pane">
														<div class="layui-form-item" style="height:48px;margin-top:30px;">
															<input class="layui-btn" id="confirm" value="REDEEM" style="width: 100%; border: 0px; color: #fff; background: #000; height:45px; line-height:45px; border-radius: 25px; " type="button" />
														</div>
													</div><br/>
												</form>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>


					</uni-view>
                </uni-page-body>
            </uni-page-wrapper>
        </uni-page>
		@include($activeTemplate.'layouts.menu',['activeLink'=>'profile'])
	</uni-app>

@endsection
@push('script')
<script>
    function copyText(textToCopy,msg = 'Copied!') {
		var $temp = $("<input>");
		$("body").append($temp);
		$temp.val(textToCopy).select();
		document.execCommand("copy");
		$temp.remove();
		modalMessage(msg);
    }
</script>

<script>
    $('#confirm').on('click', function() {
        
        // Data
        var code = $('#code').val();
        var token = document.querySelector('input[name="_token"]').value;

		if (!code) {
			Toast("Gift code is required");
			return false;
			is_status = false;
		}

        $.ajax({
            url: "{{ route('user.gift.redeem') }}",
            type: 'POST',
            data: {
                'code': code,
                'package': 15,
                'amount': 20000,
                _token: token
            },
             beforeSend: function() {
				loading.showLoading({type: 2,tip: "Wait.."});
            },
            success: function(data) {
                loading.hideLoading();
                if(data.link) {
					Toast(data.message,'RESPONSE MESSAGE',false,'SUCCESS',data.link);
                    return true;
                }
                Toast(data.message);
            },
            error: function(xhr, status, error) {
                var data = JSON.parse(xhr.responseText);
                var responseMessage = data.message
                loading.hideLoading();

                // Validator message
                if (data.errors) {
                    var errorMessages = [];
                    for (var key in data.errors) {
                        if (data.errors.hasOwnProperty(key)) {
                            errorMessages.push(data.errors[key][0]);
                        }
                    }
                    responseMessage = errorMessages.join(", ")
                }

                // Redirect
                if(data.link) {
					Toast(responseMessage,'RESPONSE MESSAGE',false,'ERROR MSG',data.link);
                    return true;
                }

                Toast(responseMessage);
            }
        });
    })
</script>
@endpush