@inject('carbon', 'Carbon\Carbon')
@extends('layouts.app',['dashBoardTitle'=>'ARTICLE 26: Transfers within a qualifying group'])
    @section('script')
    <link rel="stylesheet" href="{{asset('css/vsk_css_script.css')}}">
    @endsection
@section('buttons')
   
        <div class="d-flex justify-content-end hedr-wdth">
            
</div>
@endsection
@section('content')
<style>input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
    }

    input[type=number] {
        -moz-appearance: textfield;
    }</style>

    
<div class="container" id="main-container">
    <div class="row justify-content-center">
        <div class="col-md-12">
           

<table class="table table-bordered">
<form method="POST" action="{{url('/tax-report/article/add',['id'=>$id])}}">
@csrf
<tr>
    <td colspan="4" class="mrn bold">Tax relief as per Article 26 (1)</td>
</tr>
<tr>
    <td style="width:500px;">Asset / Liability </td>
    <td> 
    <input name="article_type"  class="form-control" type="hidden" value="article26" placeholder="Eg: 10000"  required>
    <input name="form_type"  class="form-control" type="hidden" value="form_one" placeholder="Eg: 10000" required>    
    <input class="form-control string" name="assets_liabilites" type="text" required>
    </td>
</tr>
<tr>
    <td style="width:500px;" class="mrn bold">Property details</td>
    <td> </td>
</tr>
<tr>
    <td style="width:500px;">Transferee company</td>
    <td> <input class="form-control string" name="transferee_company" type="text" required></td>
</tr>
<tr>
    <td style="width:500px;">Date of purchase / Date of Creation</td>
    <td> <input type ="date" id="date" name="date_of_purchase" class="form-control"></td>
</tr>
<tr>
    <td style="width:500px;">Date of transfer</td>
    <td> <input type ="date" id="date" name="date_of_transfer" class="form-control"></td>
</tr>
<tr>
    <td style="width:500px;">Sale price</td>
    <td> <input class="form-control" type="number" name="sale_price" step="0.01" required id="sale_price" onkeyup="checkValue()"></td>
</tr>
<tr>
    <td style="width:500px;">Less : Net book value</td>
    <td><input class="form-control" type="number" name="less_net_book_value" step="0.01" required id="less_net_book_value" onkeyup="checkValue()"></td>
</tr>
<tr>
    <td style="width:500px;">Gain</td>
    <td><input class="form-control"  type="number" name="gain" step="0.01" required readonly="readonly" id="gain" onkeyup="checkValue()"></td>
</tr>
<tr>
    <td style="width:500px;">Less: Tax relief as per Article 26(1)</td>
    <td><input class="form-control" type="number" name="less_tax_as_per_aticle_26" step="0.01" required readonly="readonly" id="less_tax_as_per_aticle_26" onkeyup="checkValue()"></td>
</tr>

<tr>
    <td colspan="2" style="text-align:right">
        <button type="submit" class="btn btn-success">Submit</button>
    </td>
</tr>

</form>
    </table>

<div>
    <h4 class="bold mrn">
    Summary of tax relief as per article 26(1)
    </h4>
    </div>
    <table class="table table-bordered">
    <tr class="bold" > 
        <td>Srno</td>
        <td>Asset /liability </td>
        <td>Transferee company </td>
        <td>Date of purchase/ date of creation</td>
        <td>Date of transfer </td>
        <td>Sale price </td>
        <td>Net book value </td>
        <td>Relief</td>
        <td>Action</td>
    </tr>

    @php
        $total = 0;
    @endphp
    @forelse($article26 as $article)

        @php
            $data = json_decode($article->data);
            $total += $data->gain ? $data->gain : 0;
        @endphp
        <tr> 
            <td>{{@$loop->iteration}}</td>
            <td>{{@$data->assets_liabilites}}</td>
            <td>{{@$data->transferee_company}}</td>
            <td>{{$data->date_of_purchase ? $carbon::parse($data->date_of_purchase)->format('d/m/Y') : "" }} </td>
            <td>{{$data->date_of_transfer ? $carbon::parse($data->date_of_transfer)->format('d/m/Y') : "" }} </td>
            <td>{{@$data->sale_price}}</td>
            <td>{{@$data->less_net_book_value}}</td>
            <td>{{@$data->gain}}</td>
            <td>
            <div class="d-flex" style="gap:5px;">
            <button class="btn btn-success"onclick='openModel(`{
                                                    id:"{{$article->id}}",
                                                    article_type:"article26",
                                                    form_type:"form_one",
                                                    inputs:[
                                                        {
                                                            label:"Asset / liability",
                                                            name:"assets_liabilites",
                                                            placeholder:"Asset / liability",
                                                            value:"{{$data->assets_liabilites}}",
                                                            id:"uapdate_assets_liabilites",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Transferee company",
                                                            name:"transferee_company",
                                                            placeholder:"Company Name",
                                                            value:"{{$data->transferee_company}}",
                                                            id:"uapdate_transferee_company",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Date of purchase/ date of creation",
                                                            name:"date_of_purchase",
                                                            placeholder:"Date",
                                                            value:"{{$data->date_of_purchase}}",
                                                            id:"uapdate_date_of_purchase",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Date of transfer",
                                                            name:"date_of_transfer",
                                                            placeholder:"Date",
                                                            value:"{{$data->date_of_transfer}}",
                                                            id:"uapdate_date_of_transfer",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Sale price",
                                                            name:"sale_price",
                                                            placeholder:"Eg:100",
                                                            value:"{{$data->sale_price}}",
                                                            id:"uapdate_sale_price",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Net book value",
                                                            name:"less_net_book_value",
                                                            placeholder:"Eg:100",
                                                            value:"{{$data->less_net_book_value}}",
                                                            id:"uapdate_less_net_book_value",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        },
                                                        {
                                                            label:"Relief",
                                                            name:"gain",
                                                            placeholder:"Eg:100",
                                                            value:"{{$data->gain}}",
                                                            id:"uapdate_gain",
                                                            isRequired:"1",
                                                            editable:"0"
                                                        }
                      ]}`)'>
                    <i class="fa-sharp fa-regular fa-pen-to-square"></i>
                    </button>
                    <button class="btn btn-success"onclick='deleteModel(`{
                            id:"{{$article->id}}"
                        }`)'>
                    <i class="fa-sharp fa-regular fa-trash"></i>
                    </button>
                
            </td>
        </tr>
    @empty

   @endforelse
    
    <tr class="bold" >
    <td></td>
    <td>Total</td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td>{{$total}}</td>
    <td></td>
    </tr>
    

</table>
</div>
</div>
</div>

<script>
    checkValue();
    function checkValue(){
        var salePrice = document.getElementById('sale_price');
        var lessNetBookValue = document.getElementById('less_net_book_value');
        var lessTaxAsPerAticle26 = document.getElementById('less_tax_as_per_aticle_26');
        var gain = document.getElementById('gain');

        gain.value = parseInt((salePrice.value) ? salePrice.value : 0) - parseInt((lessNetBookValue.value) ? lessNetBookValue.value : 0);
        lessTaxAsPerAticle26.value = (lessTaxAsPerAticle26.value) ?  lessTaxAsPerAticle26.value : 0;
        gain.value = (gain.value) ?  gain.value : 0;

        lessTaxAsPerAticle26.value = gain.value;
    }

    function importfunction(id){
        $("#myModal").toggle();
        // console.log(company_id);
    }

    function importclose(){
        $("#myModal").toggle();
        document.getElementById('model_container').remove();
    }

function deleteModel(data){
        eval('var obj='+data);
        var objData = {...obj};
        console.log(objData);

        var model = `<div class="modal" id="myModal" role="dialog">
            <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header ppup">
                <h4 class="modal-title">Are you sure you want to delete ?</h4>
                <button type="button" class="close import-excel-btn" data-dismiss="modal" onclick="importclose()">&times;</button>
                </div>
                <div class="modal-body">
                
                    <div class="form-group row text-center">
                    <div class="col-6 text-center">
                        <button type="button" class="close import-excel-btn btn btn-secondary" data-dismiss="modal" onclick="importclose()">Cancel</button>
                    </div>

                    <div class="col-6 text-center">
                        <form method="POST" action="{{url('/tax-report/article/delete',['id'=>$id])}}">
                        @csrf
                            <input type="hidden" name="data_id" value="`+objData.id+`"/>
                            <button type="submit" class="close import-excel-btn btn btn-danger" data-dismiss="modal" >Delete</button>
                        </from>
                    </div>
                    </div>
                    
                </div>
                <div class="modal-footer">
                </div>
            </div>
            </div>
        </div>
        </div>`;

        var elem = document.createElement('div');
        elem.setAttribute("id", "model_container");
        elem.innerHTML = model;
        document.getElementById('main-container').appendChild(elem);
        importfunction(1);
    }
    
    function openModel(data){
        eval('var obj='+data);
        var objData = {...obj};
        var inputArray = objData.inputs;
            //console.log(inputArray);
            var model = `<div class="modal" id="myModal" role="dialog">
            <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header ppup">
                <h4 class="modal-title">Update</h4>
                <button type="button" class="close import-excel-btn" data-dismiss="modal" onclick="importclose()">&times;</button>
                </div>
                <div class="modal-body">
                <form method="POST" action="{{url('/tax-report/article/add',['id'=>$id])}}">
                    <div>
                    @csrf
                        <input name="data_id" type="hidden" id="update_data_id" value="`+objData.id+`"/>
                        <input name="article_type"  class="form-control" type="hidden" value="`+objData.article_type+`" placeholder="Eg: 10000"  required>
                        <input name="form_type"  class="form-control" type="hidden" value="`+objData.form_type+`" placeholder="Eg: 10000" required>
                    </div>
                    <div class="row">`;
                    inputArray.forEach((element) => {
                        // console.log(element.isRequired);
                        var isRequired;
                        if(element.isRequired){
                            isRequired = "required";
                        }else{
                            isRequired = "";
                        }
                        
                        var isEnable;
                        if(parseInt(element.editable)){
                            isEnable ="readonly";
                            console.log(isEnable);
                        }else{
                            var isEnable ="";
                        }
                        model +=`<div class="col-6">
                            <label class="form-label">`+element.label+`</label>
                            <input class="form-control" name="`+element.name+`" type="text" placeholder="`+element.placeholder+`"  value="`+element.value+`"  id="`+element.id+`"  `+isEnable+`  `+isRequired+`>
                        </div>`;
                    });
                        model +=`<div style='margin:10px 0;'><button class="export-btn btn btn-success" type="submit" name="submit-excel" >Update</button></div>
                    </from>
                </div>
                <div class="modal-footer">
                </div>
            </div>
            </div>
        </div>
        </div>`;

        var elem = document.createElement('div');
        elem.setAttribute("id", "model_container");
        elem.innerHTML = model;
        document.getElementById('main-container').appendChild(elem);
        importfunction(1);
    }

</script>



@endsection