@extends('layouts.main')
@section('title', $data['title'])
@section('content')

    <style type="text/css">
        td p {
            max-width: 100%;
            white-space: break-spaces;
            word-break: break-all;
        }


        .page-title-right {
            text-align: left;
            margin-top: 20px;
        }

        .modal-lg {
            max-width: 1100px;
        }

        .target-box {
            margin-left: 15px;
        }

        h5#canvasTargetMasterLable {
            font-size: 1.4rem;
        }

        div.dataTables_wrapper div.dataTables_filter {
            text-align: right !important;
        }

        table.dataTable a {
            color: #3751A1;
        }

        #card_targetview .col-md-3 {
            margin-top: 10px;
        }

        @media (max-width:767px) {
            #card_targetview .col-md-3 {
                width: 50%;
            }

            .page-title-right {
                text-align: right;
                margin-top: 0;
                margin-bottom: 10px;
            }

        }

        @media (max-width:639px) {
            #datatable_wrapper .col-sm-12.col-md-6 {
                padding-left: 0;
                width: 50%;
            }
        }

        .page-content {
            padding: calc(70px + 24px) calc(24px / 2) 60px calc(24px / 2) !important;
        }

        #datatable thead th:first-child,
        .datatable thead th:first-child {
            border-radius: 10px 0 0 0;
            padding-left: 30px;
        }

        #datatable thead th:last-child,
        .datatable thead th:last-child {
            /* border-top-right-radius: 10px;
                                                                                                                                                border-bottom-right-radius: 10px; */
            border-radius: 0px 10px 0 0;
        }

        table td:first-child {
            padding-left: 30px !important;
        }

        #datatable thead th,
        .datatable thead th {
            background: #e8f0fe;
            border-bottom: 1px solid #eee;
            font-size: 14px;
            font-weight: 600;
            min-width: 75px;
            padding: 15px 10px;
            color: #666;
        }

        #datatable tbody td,
        .datatable thead th {
            border-bottom: 1px solid #eee;
            padding: 12.5px 10px;
            text-align: left;
            font-size: 13px;
            font-family: 'Montserrat', sans-serif !important;
            vertical-align: middle;
        }

        #datatable_filter input {
            width: 500px;
            height: 36px;
            font-size: 12px;
        }

        .boarder-radius-10 {
            border-radius: 10px;
        }

        .card-header h5 {
            position: relative;
            display: inline-block;
            /* Ensures it only takes up necessary width */
        }

        .card-header h5::after {
            content: "";
            position: absolute;
            left: -30px;
            /* Aligns it to the left */
            bottom: 8px;
            /* Adjust spacing from text */
            width: 22px;
            /* Adjust width */
            height: 4px;
            background: #3751a1;
            transform: rotateZ(90deg);
        }

        .ck-editor__editable {
            min-height: 200px !important;
            /* Adjust as needed */
            max-height: 400px !important;
            /* Set a max height */
            overflow-y: auto !important;
            /* Enable vertical scrolling */
        }

        .btn-secondary {
            background-color: #f5f5f5 !important;
            border: none;
            border-radius: 10px;
            color: #000 !important;
        }

        .btn-primary {
            background-color: #408dfb !important;
            border: none;
            border-radius: 10px;
        }


        /*new design*/
        .tab-sidebar {
            background: #fff;
            border-radius: 10px;
            box-shadow: 0 1px 2px #0003, 1px -1px 2px #00000012, 0 -1px 2px #0000001a;
            flex: 1;
            margin: 0 auto;
            max-width: 1500px;
            min-width: 650px;
            position: relative;
            padding: 0;
        }

        .tab-sidebar h5.title.bold {
            border-bottom: 1px solid #eee;
            padding: 15px 20px;
            font-size: 20px;
            line-height: 1.3;
            font-weight: 600;
        }

        .tab-sidebar>.dply-felx {
            align-items: flex-start;
            padding: 20px 0;
        }

        .dply-felx {
            display: flex;
            gap: 5px;
            justify-content: space-between;
        }

        .tab-sidebar>.dply-felx>.left-area {
            min-width: 200px;
            padding: 0 20px;
            width: 215px;
        }

        .tab-sidebar>.dply-felx>.left-area li {
            cursor: pointer;
            display: block;
            font-weight: 600;
            margin: 0 0 20px;
            -webkit-user-select: none;
            -moz-user-select: none;
            user-select: none;
        }

        .tab-sidebar>.dply-felx>.left-area li a {
            display: block;
            background: transparent;
            border: none;
            color: #000;
            transition: all .1s ease-in-out;
            font-weight: 600;
            padding: 0;
            padding-left: 10px;
        }

        .tab-sidebar>.dply-felx>.right-area {
            border-left: 1px solid #eee;
            flex-grow: 1;
            padding: 0 20px;
        }

        .dt-length {
            display: none;
        }

        .dt-search {
            display: none;
        }

        .card-body {
            padding: 0 !important;
        }

        #datatable_wrapper .row {
            margin: 0 !important;
        }

        div#datatable_info {
            padding-left: 30px;
        }

        div#datatable_wrapper .d-md-flex {
            padding: 0;
        }

        .dt-paging {
            margin-top: 5px;
        }

        .card {
            border-radius: 10px;
            box-shadow: 0 1px 2px #0003, 1px -1px 2px #00000012, 0 -2px 5px #00000008;
        }

        .tab-sidebar>.dply-felx>.left-area li a.active {
            border-left: 2px solid #4285f4;
            color: #4285f4;
        }

        .purchaseOrderDetail td:first-child {
            padding-left: 0px !important;
        }

        #customSearch,
        .customSearch {
            padding: 0px 30px !important;
            border: none !important;
            border-radius: 50px 0 0 50px !important;
            background: #fff;
        }

        .customSearchBtn {
            background: linear-gradient(180deg, #4285f4, #486fef);
            box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .3);
            color: #fff;
            font-size: 1em;
            font-weight: 700;
            height: 42px;
            line-height: 42px;
            padding: 0 25px;
            text-align: center;
            transition: all .2s;
            margin: 0 !important;
            border: 0;
            border-left: 1px solid #bbb;
            border-radius: 0 50px 50px 0 !important;
        }

        .search-icon {
            font-size: 12px;
        }

        #PaymentTermSearch {
            padding: 0 28px !important;
        }

        #payment-terms-setting .row.mt-2.justify-content-between {
            margin-top: 0 !important;
        }

        .datatable .edit {
            background: #e8f0fe;
            border: 1px solid #e8f0fe;
            color: #4285f4;
        }

        .datatable .delete {
            background: #f7d7db;
            border: 1px solid #f7d7db;
            color: #a12321;
            padding: 0 15px;
        }

        .datatable .btn {
            font-weight: 700;
            width: auto;
            line-height: 35px;
            margin: 2.5px;
            padding: 0 23px;
            text-align: center !important;
        }

        .dt-info {
            margin-left: 27px;
        }

        input#ipSearch {
            padding: 0 28px !important;
        }

        div#DataTables_Table_1_wrapper .row.mt-2.justify-content-between {
            margin-top: 0 !important;
        }

        input#termsConditionSearch {
            padding: 0 28px !important;
        }

        table#DataTables_Table_1 {
            margin-top: 0 !important;
        }

        input#invoiceSearch {
            padding: 0 28px !important;
        }

        div#DataTables_Table_3_wrapper .row.mt-2.justify-content-between {
            margin-top: 0 !important;
        }

        input#emailSearch {
            padding: 0 28px !important;
        }

        #DataTables_Table_4_wrapper .row.mt-2.justify-content-between {
            margin-top: 0 !important;
        }

        div#DataTables_Table_2_wrapper .row.mt-2.justify-content-between {
            margin-top: 0 !important;
        }

        #email-template .btn-primary {
            line-height: 2;
        }

        @media (min-width: 768px) and (max-width: 1023px) {
            .row.setting-responsive-center {
                padding-left: 4rem !important;
            }
        }
    </style>
    <div class="page-content">
        <div class="container-fluid">
            <div class="row setting-responsive-center">
                <div class="tab-sidebar pos-rel mb-5">
                    <h5 class="title bold">Setting</h5>
                    <div class="dply-felx">
                        <ul class="left-area">
                            @if (Auth::user()->type == 0)
                                <li class=""><a href="#email-notification"
                                        class="list-group-item list-group-item-action text-bold">
                                        Email Notification Setting
                                    </a></li>
                                <li class=""><a href="#tag-master"
                                        class="list-group-item list-group-item-action text-bold">
                                        Tag Master
                                    </a></li>
                            @elseif(Auth::user()->type == 1)
                                <li class=""><a href="#company-tab"
                                        class="list-group-item list-group-item-action active text-bold">
                                        Company Setting </a></li>
                                <li class=""><a
                                        href="#unique-prefix-tab"class="list-group-item list-group-item-action text-bold">
                                        Unique Prefix</a></li>
                                <li class=""> <a href="#email-tab"
                                        class="list-group-item list-group-item-action text-bold">
                                        Email Setting
                                    </a></li>
                                <li class=""><a href="#ip-restriction-settings"
                                        class="list-group-item list-group-item-action text-bold">
                                        IP Restriction Setting
                                    </a></li>
                                <li class=""><a href="#user-email-notification"
                                        class="list-group-item list-group-item-action text-bold">
                                        User Email Notification Setting
                                    </a></li>
                                <li class=""><a href="#email-template"
                                        class="list-group-item list-group-item-action text-bold">
                                        Email Template Setting
                                    </a></li>
                                <li class=""><a href="#printer-template"
                                        class="list-group-item list-group-item-action text-bold">
                                        Printer Setting
                                    </a></li>
                                <li class="active"><a href="#payment-terms-setting"
                                        class="list-group-item list-group-item-action text-bold">
                                        Payment Terms
                                    </a></li>
                                <li class=""><a href="#terms-condition-setting"
                                        class="list-group-item list-group-item-action text-bold">
                                        Terms & Condition
                                    </a></li>
                                <li class=""><a href="#invoice-template-setting"
                                        class="list-group-item list-group-item-action text-bold">
                                        Invoice Template
                                    </a></li>

                                <li class=""><a href="#send-email-setting"
                                        class="list-group-item list-group-item-action text-bold">
                                        Send Mail
                                    </a></li>
                                <li class=""><a href="#document_type"
                                        class="list-group-item list-group-item-action text-bold">
                                        Document Type
                                    </a></li>
                                <li class=""><a href="#task-setting"
                                        class="list-group-item list-group-item-action text-bold">
                                        Task Master
                                    </a></li>
                                <li class=""><a href="#purchase_order_gst"
                                        class="list-group-item list-group-item-action text-bold">
                                        Purchase Order GST
                                    </a></li>
                                <li class=""><a href="#sales_order_gst"
                                        class="list-group-item list-group-item-action text-bold">
                                        Sales Order GST
                                    </a></li>

                                <li class=""><a href="#quotation_gst"
                                        class="list-group-item list-group-item-action text-bold">
                                        Quotation GST
                                    </a></li>
                                <li class=""><a href="#job_worker_issue_gst"
                                        class="list-group-item list-group-item-action text-bold">
                                        Job Worker Issue GST
                                    </a></li>
                                <li class=""><a href="#job_worker_return_gst"
                                        class="list-group-item list-group-item-action text-bold">
                                        Job Worker Return GST
                                    </a></li>
                            @endif
                        </ul>
                        <div class="right-area">
                            <div class="col-lg-12 col-md-8 col-sm-12">
                                <div id="CardBodyScrolling">
                                    @if (Auth::user()->type == 0)
                                        <!-- Email Notification Settings -->
                                        <section id="email-notification" class="content-section">
                                            @include('setting.detail_tab.email_notification_tab')
                                        </section>
                                        <!-- Tag Settings -->
                                        <section id="tag-master" class="content-section">
                                            @include('setting.detail_tab.tag_tab')
                                        </section>
                                    @elseif(Auth::user()->type == 1)
                                        <!-- Company Settings -->
                                        <section id="company-tab" class="content-section">
                                            @include('setting.detail_tab.company_tab')
                                        </section>

                                        <!-- Unique Prefix Settings -->
                                        <section id="unique-prefix-tab" class="content-section">
                                            @include('setting.detail_tab.unique_prefix_tab')
                                        </section>

                                        <!-- Email Settings -->
                                        <section id="email-tab" class="content-section">
                                            @include('setting.detail_tab.email_tab')
                                        </section>

                                        <!-- IP Restriction Settings -->
                                        <section id="ip-restriction-settings" class="content-section">
                                            @include('setting.detail_tab.ip_restriction_tab')
                                        </section>

                                        <!-- User Email Notification Settings -->
                                        <section id="user-email-notification" class="content-section">
                                            @include('setting.detail_tab.user_email_notification_tab')
                                        </section>

                                        <!-- Email Template Settings -->
                                        <section id="email-template" class="content-section">
                                            @include('setting.detail_tab.email_template_tab')
                                        </section>
                                        <!-- Printer Settings -->
                                        <section id="printer-template" class="content-section">
                                            @include('setting.detail_tab.printer_template_tab')
                                        </section>
                                        <!-- Payment Terms Settings -->
                                        <section id="payment-terms-setting" class="content-section">
                                            @include('setting.detail_tab.payment_terms_tab')
                                        </section>
                                        <!-- Terms Condition Settings -->
                                        <section id="terms-condition-setting" class="content-section">
                                            @include('setting.detail_tab.terms_condition_tab')
                                        </section>
                                        <!-- Invoice Template Settings -->
                                        <section id="invoice-template-setting" class="content-section">
                                            @include('setting.detail_tab.invoice_template_tab')
                                        </section>
                                        <section id="send-email-setting" class="content-section">
                                            @include('setting.detail_tab.mail_send_tab')
                                        </section>
                                        <!-- Purchase Order GST Settings -->
                                        <section id="task-setting" class="content-section">
                                            @include('setting.detail_tab.task_tab')
                                        </section>
                                        <!-- Purchase Order GST Settings -->
                                        <section id="purchase_order_gst" class="content-section">
                                            @include('setting.detail_tab.purchase_order_gst_tab')
                                        </section>
                                        <!-- Sales Order GST Settings -->
                                        <section id="sales_order_gst" class="content-section">
                                            @include('setting.detail_tab.sales_order_gst_tab')
                                        </section>
                                        <!-- Party Master Document Settings -->
                                        <section id="document_type" class="content-section">
                                            @include('setting.detail_tab.document_type_tab')
                                        </section>

                                        <section id="quotation_gst" class="content-section">
                                            @include('setting.detail_tab.quotation_gst_tab')
                                        </section>
                                        <section id="job_worker_issue_gst" class="content-section">
                                            @include('setting.detail_tab.job_work_issue_gst_tab')
                                        </section>
                                        <section id="job_worker_return_gst" class="content-section">
                                            @include('setting.detail_tab.job_work_return_gst_tab')
                                        </section>
                                    @else
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @csrf
    @include('setting.comman.modal')

@endsection('content')

@section('custom-scripts')

    {{-- <script src="{{ asset('assets/ckeditor5/build/ckeditor.js') }}"></script> --}}
    <script src="{{ asset('assets/libs/parsleyjs/parsley.min.js') }}"></script>
    <script src="{{ asset('assets/js/pages/form-validation.init.js') }}"></script>
    <script src="{{ asset('assets/js/pages/jquery.form.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.bootstrap5.js') }}"></script>
    <script src="{{ asset('assets/js/dataTables.buttons.min.js') }}"></script>
    <script type="text/javascript">
        var RedirectRout = '{{ route('setting.index') }}';

        $(document).ready(function() {
            // Hide all sections except the first one
            $(".content-section").hide();
            $(".content-section:first").show().addClass("active");

            // Set the first menu item as active
            $(".list-group-item:first").addClass("active");

            $(".list-group-item").click(function(e) {
                e.preventDefault();

                // Remove active class from all tabs and add to clicked tab
                $(".list-group-item").removeClass("active");
                $(this).addClass("active");

                // Get the target section ID
                var target = $(this).attr("href");

                // Hide all sections, then fade in the selected one
                $(".content-section").hide().removeClass("active");
                $(target).fadeIn().addClass("active");

                // Smooth scroll inside #CardBodyScrolling
                $("#CardBodyScrolling").animate({
                    scrollTop: $(target).position().top + $("#CardBodyScrolling").scrollTop()
                }, 500); // Set animation duration to 500ms
            });

            // Detect scrolling and update active tab dynamically
            $("#CardBodyScrolling").on("scroll", function() {
                $(".content-section").each(function() {
                    var sectionTop = $(this).position().top;
                    var scrollTop = $("#CardBodyScrolling").scrollTop();

                    if (sectionTop <= scrollTop + 10) { // Adjust threshold if needed
                        var id = $(this).attr("id");

                        // Update active tab based on visible section
                        $(".list-group-item").removeClass("active");
                        $(".list-group-item[href='#" + id + "']").addClass("active");
                    }
                });
            });
        });
        $(document).ready(function() {
            var table = $('#datatable').DataTable();

            $('#customSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#customSearchBtn').click();
                }
            });

            $('#customSearchBtn').on('click', function() {
                var value = $('#customSearch').val();
                table.search(value).draw();
            });

            var payement_terms_table = $('.payment_term_table').DataTable();

            $('#PaymentTermSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#PaymentTermSearchBtn').click();
                }
            });

            $('#PaymentTermSearchBtn').on('click', function() {
                var value = $('#PaymentTermSearch').val();
                payement_terms_table.search(value).draw();
            });

            var terms_condition_table = $('.terms_condition').DataTable();

            $('#termsConditionSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#termsConditionSearchBtn').click();
                }
            });

            $('#termsConditionSearchBtn').on('click', function() {
                var value = $('#termsConditionSearch').val();
                terms_condition_table.search(value).draw();
            });

            var ip_table = $('.ip_dataTable').DataTable();

            $('#ipSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#ipSearchBtn').click();
                }
            });

            $('#ipSearchBtn').on('click', function() {
                var value = $('#ipSearch').val();
                ip_table.search(value).draw();
            });

            var invoice_table = $('.invoice_table').DataTable();

            $('#invoiceSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#invoiceSearchBtn').click();
                }
            });

            $('#invoiceSearchBtn').on('click', function() {
                var value = $('#invoiceSearch').val();
                invoice_table.search(value).draw();
            });

            var tag_table = $('.tag_table').DataTable();

            $('#TagSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#TagSearchBtn').click();
                }
            });

            $('#TagSearchBtn').on('click', function() {
                var value = $('#TagSearch').val();
                tag_table.search(value).draw();
            });

            var task_table = $('.task_table').DataTable();

            $('#TaskSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#TaskSearchBtn').click();
                }
            });

            $('#TaskSearchBtn').on('click', function() {
                var value = $('#TaskSearch').val();
                task_table.search(value).draw();
            });

            var document_table = $('.document_table').DataTable();

            $('#DocumentSearchBtn').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#documentSearch').click();
                }
            });

            $('#DocumentSearchBtn').on('click', function() {
                var value = $('#documentSearch').val();
                document_table.search(value).draw();
            });

            var email_table = $('.email_template_dataTable').DataTable();

            $('#emailSearch').on('keyup', function(e) {
                if (e.keyCode === 13) {
                    $('#emailSearchBtn').click();
                }
            });

            $('#emailSearchBtn').on('click', function() {
                var value = $('#emailSearch').val();
                email_table.search(value).draw();
            });

        });
        $(document).ready(function() {

            var options = {
                beforeSubmit: showRequest, // pre-submit callback
                success: showResponse // post-submit callback
            };

            $('#formCompany').ajaxForm(options);
            $('#formUniquePrefix').ajaxForm(options);
            $('#formEmail').ajaxForm(options);
            $('#formIpRestriction').ajaxForm(options);
            $('#formEmailNotification').ajaxForm(options);
            $('#formUserEmail').ajaxForm(options);
            $('#purchase-form').ajaxForm(options);
            $('#quotation-form').ajaxForm(options);
            $('#salesOrder-form').ajaxForm(options);
            $('#formPaymentTerms').ajaxForm(options);
            $('#formTermsCondition').ajaxForm(options);
            $('#formInvoice').ajaxForm(options);
            $('#formSendEmailDetail').ajaxForm(options);
            $('#formTag').ajaxForm(options);
            $('#purchase_gst').ajaxForm(options);
            $('#sales_order_gst').ajaxForm(options);
            $('#formTask').ajaxForm(options);
            $('#purchase_task').ajaxForm(options);
            $('#sales_task').ajaxForm(options);
            $('#formdocumenttype').ajaxForm(options);
            $('#quotation_task').ajaxForm(options);
            $('#quotation_order_gst').ajaxForm(options);
            $('#job_work_issue_task').ajaxForm(options);
            $('#job_work_issue_gst').ajaxForm(options);
            $('#job_work_return_task').ajaxForm(options);
            $('#job_work_return_gst').ajaxForm(options);

        });

        function showRequest(formData, jqForm, options) {
            var queryString = $.param(formData);

            $(".save-btn").html("Saving...");
            $(".save-btn").prop("disabled", true);

            return true;
        }

        function showResponse(resultData, statusText, xhr, $form) {
            if (resultData['status'] == 1) {
                toastr["success"](resultData['msg']);
                $(".save-btn").html("Save");
                $(".save-btn").prop("disabled", false);

                window.location.href = RedirectRout;

            } else if (resultData['status'] == 0) {

                if (typeof resultData['data'] !== "undefined") {

                    var size = Object.keys(resultData['data']).length;
                    if (size > 0) {

                        for (var [key, value] of Object.entries(resultData['data'])) {

                            toastr["error"](value);
                        }

                    }

                } else {
                    toastr["error"](resultData['msg']);
                }

                $(".save-btn").html("Save");
                $(".save-btn").prop("disabled", false);
            }

        }

        document.getElementById('purchase-color-picker').addEventListener('input', function() {
            const selectedColor = this.value;
            const elements = document.querySelectorAll(
                '.purchase-header, .tblShipAddress th, .tblDeliverAddress th, .table-bordered th');

            elements.forEach(element => {
                element.style.backgroundColor = selectedColor;
            });
        });
        document.getElementById('purchase-text-color-picker').addEventListener('input', function() {
            const selectedColor = this.value;
            const elements = document.querySelectorAll(
                '.purchase-header, .purchase-header h4, .purchase-header h3, .tblShipAddress th, .tblDeliverAddress th, .table-bordered th'
            );

            elements.forEach(element => {
                element.style.color = selectedColor;
            });

        });

        document.getElementById('quotation-color-picker').addEventListener('input', function() {
            const selectedColor = this.value;
            const elements = document.querySelectorAll('.quotation-header, .add-border.quotation-summary thead tr');

            elements.forEach(element => {
                element.style.backgroundColor = selectedColor;
            });
            const borderElements = document.querySelectorAll('table.quotation-summary tr');
            borderElements.forEach(element => {
                element.style.borderColor = selectedColor;
            });
        });

        document.getElementById('sales-order-color-picker').addEventListener('input', function() {
            const selectedColor = this.value;
            const elements = document.querySelectorAll(
                '.sales-order-header, .add-border.sales-order-summary thead tr');

            elements.forEach(element => {
                element.style.backgroundColor = selectedColor;
            });
            const borderElements = document.querySelectorAll('table.sales-order-summary tr');
            borderElements.forEach(element => {
                element.style.borderColor = selectedColor;
            });
        });
        document.getElementById('sales-order-text-color-picker').addEventListener('input', function() {
            const selectedColor = this.value;
            const elements = document.querySelectorAll(
                '.sales-order-header, .sales-order-header h4, .sales-order-header table td p, .sales-order-summary th'
            );

            elements.forEach(element => {
                element.style.color = selectedColor;
            });

        });
        $('#purchaseGstBtn').on('click', function() {
            $('#purchase_gst_card').removeClass('d-none');
            $('#default_task_card').addClass('d-none');
        });

        $('#showTaskBtn').on('click', function() {
            $('#purchase_gst_card').addClass('d-none');
            $('#default_task_card').removeClass('d-none');

        });

        $('#salesGstBtn').on('click', function() {
            $('#sales_gst_card').removeClass('d-none');
            $('#sales_task_card').addClass('d-none');
        });
        $('#showSalesTaskBtn').on('click', function() {
            $('#sales_gst_card').addClass('d-none');
            $('#sales_task_card').removeClass('d-none');
        });

        $('#quotationGstBtn').on('click', function() {
            $('#quotation_gst_card').removeClass('d-none');
            $('#quotation_task_card').addClass('d-none');
        });
        $('#showquotationTaskBtn').on('click', function() {
            $('#quotation_gst_card').addClass('d-none');
            $('#quotation_task_card').removeClass('d-none');
        });

        $('#JobWorkIssueGstBtn').on('click', function() {
            $('#job_work_issue_gst_card').removeClass('d-none');
            $('#job_work_issue_task_card').addClass('d-none');
        });
        $('#showJobWorkIssueTaskBtn').on('click', function() {
            $('#job_work_issue_gst_card').addClass('d-none');
            $('#job_work_issue_task_card').removeClass('d-none');
        });
        $('#JobWorkReturnGstBtn').on('click', function() {
            $('#job_work_return_gst_card').removeClass('d-none');
            $('#job_work_return_task_card').addClass('d-none');
        });
        $('#showJobWorkReturnTaskBtn').on('click', function() {
            $('#job_work_return_gst_card').addClass('d-none');
            $('#job_work_return_task_card').removeClass('d-none');
        });
    </script>

    @include('setting.comman.script')
@endsection