@extends('layouts.master')
@section('header')
    <link href="{{ asset('css/gijgo.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('css/select2.min.css') }}" rel="stylesheet" />
    <link rel="stylesheet" href="{{ asset('css/select2-bootstrap4.min.css') }}">
@endsection
<style>
    div.sticky {
        position: sticky;
        top: 0;
        background-color: #ffffff;
        padding-top: 8px;
        z-index: 100;
    }

    form.noStyle {
        margin: 0;
    }

    .btn-circle.btn-sm {
        width: 30px;
        height: 30px;
        padding: 6px 0px;
        border-radius: 15px;
        font-size: 8px;
        text-align: center;
    }

    .form-control {
        display: inline-block !important;
    }

    .tab {
        overflow: hidden;
        border: 1px solid #ccc;
        background-color: #f1f1f1;
    }

    /* Style the buttons inside the tab */
    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
        font-size: 17px;
    }

    /* Change background color of buttons on hover */
    .tab button:hover {
        background-color: #ddd;
    }

    /* Create an active/current tablink class */
    .tab button.active {
        background-color: #ccc;
    }

    /* Style the tab content */
    .tabcontent {
        display: none;
        padding: 6px 12px;
        border: 1px solid #ccc;
        border-top: none;
    }
</style>
@section('content')
    <form action="{{ route('item.removeImg') }}" method="POST" style="margin: 0" onkeypress="return event.keyCode != 13;"
        id="removeImgForm">
        @csrf
        <div class="col-1 text-left">
            <input type="hidden" class="form-control" name="F_Pk" id="F_Pk" readonly>
        </div>
    </form>

    <form action="{{ route('item.store') }}" method="POST" id="Form_Submit" enctype="multipart/form-data"
        class="noStyle" onsubmit="event.preventDefault(); return validateForm(this,'update')">
        @csrf

        <div class="card">
            <div class="card-body">
                <div class="sticky">
                    <div class="row ">
                        <div class="col-7  ">
                            <h5 style="display: inline-block" class="mr-2">ฟอร์มแก้ไขข้อมูล Master Item</h5>
                            <select class="form-control col-2" id="XVDsType" name="XVDsType" required disabled
                                style="display: inline-block">
                                <option @if ($hd->XVPdtType == "1") selected @endif value="1">กางเกง</option>
                                <option @if ($hd->XVPdtType == "2") selected @endif value="2">เสื้อ/แจ็คเก็ต
                                </option>
                            </select>
                        </div>
                        <input type="hidden" class="form-control" name="XVDsType" id="hXVDsType"  value="{{$hd->XVPdtType}}" readonly>
                        <div class="col text-right">
                            <a href="{{ route('item.index') }}" class="btn btn-danger"><i
                                    class="fas fa-long-arrow-alt-left fa-lg"></i> <span>กลับ</span></a>

                            <button type="submit" class="btn btn-success">บันทึก</button>
                        </div>
                    </div>
                    <hr>
                </div>
                <div class="row">
                    <div class="col"><h5>ข้อมูลเอกสาร</h5></div>
                    <div class="col text-right">วันที่แก้ไขล่าสุด Master Design : <span>{{ $hd->XTWhenEdit }}</span></div>

                </div>
                <div class="row border">

                    <div class="col border-right ">
                            @php
                                $hd->xvpdtcode = 'Itm####-######';
                            @endphp
                        @component('MasterItem.components.hd', ['oldHD' => $hd])
                        @endcomponent
                    </div>
                    <div class="col border-right ">

                        @component('MasterItem.components.secondHD', ['oldHD' => $hd])
                        @endcomponent
                    </div>

                </div>
                <div class="row">{{$hd->XVPdtType}}
                    <div class="col-6 border-right  ">
                        @if ($hd->XVPdtType == "1")
                        @component('MasterItem.components.comment_detail', ['oldHD' => $hd])
                        @endcomponent
                            @else
                            @component('MasterItem.components.comment_detailshirt', ['oldHD' => $hd])
                        @endcomponent
                        @endif


                    </div>
                    <div class="col">
                        <div class="border-bottom">
                            <div class="form-group row mt-2">
                                <label class="col-sm-3 col-form-label">ชื่อโรงฟอก</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="XVPdtBleachingPlant"
                                        name="XVPdtBleachingPlant" value="{{ $hd->XVPdtBleachingPlant ?? '' }}">
                                </div>
                            </div>
                            <div class="form-group row mt-2">

                                <label class="col-sm-3 col-form-label">ชื่อโรงพิมพ์</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="XVPdtPrinterName" name="XVPdtPrinterName"
                                        value="{{ $hd->XVPdtPrinterName ?? '' }}">
                                </div>
                            </div>
                            <div class="form-group row mt-2">

                                <label class="col-sm-3 col-form-label">ชื่อโรงปัก</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="XVPdtEmbroideryHouseName"
                                        name="XVPdtEmbroideryHouseName" value="{{ $hd->XVPdtEmbroideryHouseName ?? '' }}">
                                </div>
                            </div>
                        </div>
                        @component('MasterItem.components.comment_description', ['oldHD' => $hd])
                        @endcomponent
                        @component('Components.upload', ['oldPicture' => $hd->XVPdtImg, 'hasDelete' => true])
                        @endcomponent
                    </div>
                </div>
                <div class="row" style="display: block">
                    <div class="col border ">
                        @component('MasterItem.components.dt', ['oldDT' => $dt])
                        @endcomponent
                    </div>


                </div>
            </div>
        </div>
        </div>
    </form>
@endsection
<script src="{{ asset('js/helper.js') }}"></script>
<script src="{{ asset('js/jquery-3.5.1.min.js') }}"></script>
<script src="{{ asset('js/gijgo.min.js') }}" defer type="text/javascript"></script>
<script src="{{ asset('js/select2.min.js') }}" defer></script>
<script src="{{ asset('js/sweetalert.min.js') }}"></script>
<script src="{{ asset('js/pages/MasterItem/form.js') }}"></script>
<script src="{{ asset('js/helper.js') }}"></script>

<script>
    async function deleteImages() {
        let resp = swal({
            title: `ยืนยันการลบรูป ?`,
            text: "หากยืนยันแล้วไม่สามารถเปลี่ยนแปลงได้",
            icon: "warning",
            buttons: true,
            dangerMode: true,
        })
        let isOk = await resp
        if (isOk) {
            var PK_xvpdtcode = document.getElementById("PK_xvpdtcode").value;
            document.getElementById("F_Pk").value = PK_xvpdtcode;
            document.getElementById("removeImgForm").submit();
        } else {
            console.log('cancle')
        }
    }

    $(document).ready(function () {



})
function FN_GetOptionDesign(params) {

        var url = "