@extends('Admin.layout')
<link href="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.snow.css" rel="stylesheet" />
@section('content')

<div
    class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center mb-1 row-gap-4" onclick="window.history.back()" ;>
    <div class="d-flex flex-column justify-content-center">
        <h4> <button type="button" class="btn btn-icon bg-white waves-effect me-2"
                style="box-shadow: 0px 9px 12px -2px #66328E1F;">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
                    fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                    class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left">
                    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                    <path d="M15 6l-6 6l6 6" />
                </svg>
            </button>Quotation</h4>
    </div>

</div>
<div class="card p-5">
    <div class="form-section">
        <h5>Quotation</h5>
        <form id="groupForm">
            <div class="row">
                <div class="col-lg-6 mb-3">
                    <label class="form-label" for="stateName"> Customer Name</label>
                    <input type="text" class="form-control" id="customer_name" value="{{ $quotes->customer_name }}" readonly disabled>
                </div>
                <div class="col-lg-6 mb-3">
                    <label class="form-label" for="stateName"> Phone Number</label>
                    <input type="text" class="form-control" id="customer_number" value="{{ $quotes->customer_number }}" readonly disabled>
                </div>
                <div class="col-lg-6 mb-3">
                    <label class="form-label" for="stateName"> Material</label>
                    <input type="text" class="form-control" id="material_name" value="{{ $quotes->material_name }}" readonly disabled>
                </div>
                <div class="col-lg-6 mb-3">
                    <label class="form-label" for="stateName"> Date</label>
                    <input type="text" class="form-control" id="date" value="{{ $quotes->date}}" readonly disabled>
                </div>
                <div class="col-lg-12 mb-3">
                    <label class="form-label" for="stateName"> Time</label>
                    <input type="text" class="form-control" id="time" value="{{ $quotes->time }}" readonly disabled>
                </div>
            </div>

    </div>

    <div class="text-editor-container mt-1">
        <div class="header mb-3">Description</div>

        <div id="editor" style="pointer-events: none; background-color: #f8f9fa; padding:10px; border:1px solid #ddd;">
            {!! $quotes->description !!}
        </div>
    </div>
    </form>
</div>

</div>
<script src="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.js"></script>

<!-- Initialize Quill editor -->
<script>
    const quill = new Quill('#editor', {
        theme: 'snow'
    });
</script>
@endsection