Current File : /home/tradevaly/www/resources/views/backend/pages/setting/home/cwp/edit.blade.php

@extends('backend.ayaan.master')
@push('title','Inbox')
@push('style')
@endpush

@section('content')
    <div class="container-fluid">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 col">
                    <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                        <h4 class="mb-sm-0 font-size-18">Inbox</h4>
                        <div class="page-title-right">
                            <ol class="breadcrumb m-0">
                                <li class="breadcrumb-item"><a href="/email-inbox">Email</a></li>
                                <li class="active breadcrumb-item" aria-current="page"><a href="/email-inbox">Inbox</a></li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-12">
                   @include('backend.pages.setting.home.side_bar')
                    <div class="email-rightbar mb-3">
                        <div class="card">
                            <div class="card-header">
                                <h4>Category Add</h4>
                            </div>
                            <div class="card-body">

                                <form action="{{ route('admin.setting.cwp.update',$cwp->id)}}" method="POST"
                                    enctype="multipart/form-data">
                                    @csrf
                                    @method('put')
                                    <div class="row">




                                        <div class="col-sm-12">
                                            <div class="mb-3">
                                                <select class="form-select" aria-label=" example" name="category_id">
                                                    <option selected>Select a Category</option>
                                                    @foreach ($categories as $category)
                                                    <option value="{{ $category->id }}" {{ $cwp->category_id == $category->id ? 'selected':' '}}>{{ $category->name }}</option>
                                                    @endforeach
                                                  </select>
                                            </div>
                                        </div>
                                        <div class="col-sm-12">
                                            <div class="mb-3">
                                                <label for="metadescription">Sorting</label>
                                                <input id="metatitle" name="sorting" type="text" class="form-control"
                                                    value="{{ $cwp->sorting}}" required>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="mb-3">
                                                <label for="metadescription">Photo (450*760)</label>
                                                <div class="fallback">
                                                    <input name="image" type="file"
                                                        oninput="preview_image(this, '.image_preview_container')" />
                                                </div>

                                                <div class="dz-message needsclick">
                                                    <div class="image_preview_container">
                                                        <img
                                                            src="{{ asset('storage/setting/cwp/'.$cwp->photo) }}"
                                                            alt="Image Not Found" class="img-fluid pt-3" height="250">
                                                        </div>
                                                </div>

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

                                    <div class="d-flex flex-wrap gap-2">
                                        <button type="submit" class="btn btn-primary waves-effect waves-light">Save
                                            Update</button>
                                        <button type="submit"
                                            class="btn btn-secondary waves-effect waves-light">Cancel</button>
                                    </div>
                                </form>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @stop

    @push('script')
        <script>
            function preview_image(F, image_container) {
                let my_container = document.querySelector(image_container);

                let new_container = document.createElement('div');
                new_container.className = 'image_preview_container';

                F = F.files;
                F = Array.from(F);

                F.forEach(file => {
                    let my_url = URL.createObjectURL(file);

                    let my_image = getImage(my_url);
                    new_container.append(my_image);
                });

                my_container.replaceWith(new_container);
            }

            function getImage(url) {
                let img = document.createElement('img');
                img.src = url;
                img.alt = "Image Not Found";

                return img;
            }

            $(document).on('change', '[name=parent_id]', function() {
                var child_id = $(this).val();
                get_child(child_id);
            });


            function get_child(child_id) {
                $('[name="sub_id"]').html("");
                $.ajax({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    url: "{{ route('ajax.cat') }}",
                    type: 'POST',
                    data: {
                        sub_id: child_id
                    },
                    success: function(response) {
                        var obj = JSON.parse(response);
                        if (obj != '') {
                            $('[name="sub_id"]').html(obj);
                        }
                    }
                });
            }
        </script>
    @endpush