@extends('layouts.adminapp')

@section('content')

{{-- Create New Company --}}

<div class="container grid px-6 my-8">
    <h4 class="mb-4 text-lg font-semibold text-gray-600 dark:text-gray-300">
        Create New Institution
    </h4>

    <form method="post" action="{{route('Company.store')}}" enctype="multipart/form-data">
    @csrf
        <div class="grid gap-6 mb-8 md:grid-cols-2">
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Title</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('title') border-red-600 @enderror" name="title" id="txtTitle" required/>
                    @error('title')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Place</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="place" id="txtPlace"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">City</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="city" id="txtCity"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">District</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="district" id="txtDistrict"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">State</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="state" id="txtState"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Contact</span>
                    <input type="number" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('contact') border-red-600 @enderror" name="contact" id="txtContact" required/>
                    @error('contact')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Email</span>
                    <input type="email" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="email" id="txtEmail"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Pin</span>
                    <input type="number" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="pin" id="txtPin"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Post</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="post" id="txtPost"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Under</span>
                    <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="under" id="txtUnder"/>
                </label>
            </div>
            <div class="min-w-0">
                <label class="block text-sm">
                    <span class="text-gray-700 dark:text-gray-400">Logo</span>
                    <input type="file" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input @error('Logo1') border-red-600 @enderror" name="Logo1" id="fileIdproof" 
                    onchange="
                    var input=this;
		                if (input.files && input.files[0]) {
                        var reader = new FileReader();
                        var size=(Math.round(input.files[0].size/1024));
                        if(size>1024)
                            {
                            alert('Please Upload file lesthan 1MB\nControl load time');
                            input.value='';
                            }
                        else{
                            reader.onload = function (e) {
                            }
                            reader.readAsDataURL(input.files[0]);
                            }
				    }"
                    />
                    @error('Logo1')<span class="text-xs text-red-700" id="passwordHelp">{{$message}}</span>@enderror
                </label>
            </div>
        </div>
        <div class="grid gap-6 mb-8 md:grid-cols-1">
            <label class="block text-sm">
                <span class="text-gray-700 dark:text-gray-400">Narration</span>
                <input type="text" class="block w-full mt-1 text-sm dark:border-gray-600 dark:bg-gray-700 focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:text-gray-300 dark:focus:shadow-outline-gray form-input" name="narration" id="txtNarration"/>
            </label>
        </div>
        <div class="flex flex-col items-center justify-end px-6 py-3 -mx-6 -mb-4 space-y-4 sm:space-y-0 sm:space-x-6 sm:flex-row bg-gray-50 dark:bg-gray-800">
            <a href="{{route('Company.index')}}" class="w-full px-5 py-3 text-sm font-medium leading-5 text-gray-700 transition-colors duration-150 border border-gray-300 rounded-lg dark:text-gray-400 sm:px-4 sm:py-2 sm:w-auto active:bg-transparent hover:border-gray-500 focus:border-gray-500 active:text-gray-500 focus:outline-none focus:shadow-outline-gray">
                Back
            </a>
            <button type="submit" class="w-full px-5 py-3 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-lg sm:w-auto sm:px-4 sm:py-2 active:bg-purple-600 hover:bg-purple-700 focus:outline-none focus:shadow-outline-purple">
                Save
            </button>
        </div>
    </form>
</div>

@endsection