@extends('admin.layouts.app')

@section('title', 'Services')

@section('content')
<!-- TOPBAR -->
<div class="top_bar page-content" style="min-height:534px">
    <!-- LOADER -->
    <div class="loader">
        <div class="top_status_bar load">
            <div class="progress_bar bar" style="left: 0px;">
            </div>
        </div>
    </div>
    <!-- END LOADER -->
    <!-- BREADCRUMBS -->
    <div class="breadcrumbs">
        <ul>
            <li><a href="{{ route('admin.dashboard') }}">Home</a></li>
            <li><a href="{{ route('admin.settings.index') }}" class="">Settings</a></li>
            <li><a href="#" class="breadcrumb_link" onclick="return false">Services</a></li>
        </ul>
        <button class="btn btn-large pull-right help theme_btn help_btn">?</button>
    </div>
    <!-- END BREADCRUMBS -->
</div>
<!-- END TOPBAR -->
<!-- PAGE CONTENT -->
<div class="page-content">
    <div class="row">
        <div class="col-md-12">
            <!-- Begin: life time stats -->
            <div class="portlet setting_landing">
                <!-- MAIN CAPTION START -->
                <div class="portlet-title">
                    <div class="caption">
                        <h2>
                            Services
                            <span>Setup the Services that business provides</span>
                        </h2>
                    </div>
                </div>
                <!-- MAIN CAPTION END -->
                <hr>
                <!-- MAIN CONTENT START -->
                <div class="portlet-body">
                    <div class="settings">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="col-md-4">
                                    <span class="main_title">Services</span>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="col-md-3">
                                    <span class="sub_heading">What are the Services in your business?</span>
                                    <span class="sub_heading">Setup Services and Service Types for your business in
                                        SaleSoft CRM.</span>
                                </div>
                                <div class="col-md-1"></div>
                                <div class="col-md-7">
                                    <input type="hidden" name="_token" value="">
                                    <!--ADD DEPARTMENT-->
                                    <div class="row">
                                        <div class="col-md-12 pl_pr_0">
                                            <input type="text" name="" class="write_dept form-control"
                                                placeholder="write Services names seperated by comma to add multiple and press enter">
                                            <div class="row dept_tags_wrap">
                                                <div class="col-md-11 tags_all"></div>
                                                <div class="col-md-1">
                                                    <div class="add_btn_general  pull-right" style="display: none;">
                                                        <i class="fa fa-plus add_dept"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!--ADD DEPARTMENT-->
                                    <div class="row each_row">
                                        <div class="portlet-body">
                                            <div class="products box">
                                                <div class="header_tbl">
                                                    <div class="row">
                                                        <div class="col-md-12">
                                                            <div class="col-md-3 row_header">Services *</div>
                                                            <div class="col-md-2 row_header">Service Types</div>
                                                            <div class="col-md-2 row_header">Email Template</div>
                                                            <div class="col-md-2 row_header">&nbsp;Add Service Types *
                                                            </div>
                                                            <div class="col-md-2 row_header">&nbsp;Service Owner *</div>
                                                            <div class="del_header"></div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row_wrap">
                                                    @foreach($data['services_details'] as $service)

                                                    @if($service->serviceTypes->count() > 0)
                                                    <div class="row_inner_wrap">
                                                        <div class="row">
                                                            <div class="col-md-12">
                                                                <div class="col-md-3 inner_row">
                                                                    <input type="text" id="{{$service->service_uuid}}"
                                                                        name="department"
                                                                        value="{{$service->service_title}}"
                                                                        class="department_edit form-control" readonly>
                                                                    <i class="fa fa-check edit_dept"
                                                                        data-uuid="{{$service->service_uuid}}"
                                                                        data-type="department"></i>

                                                                </div>

                                                                <div class="col-md-2 inner_row">
                                                                    <select class="select2 select_designation" name="">
                                                                        <option></option>
                                                                        @foreach ($service->serviceTypes as $servicetype)
                                                                        <option data-file="{{ $servicetype->pdf_file }}"
                                                                            data-owner="{{ $servicetype->service_owner }}"
                                                                            value="{{$servicetype->service_type_uuid}}">
                                                                            {{$servicetype->service_type_title}}
                                                                        </option>
                                                                        @endforeach
                                                                    </select>

                                                                </div>

                                                                <div class="col-md-2 inner_row">
                                                                    <select class="select2 select_email" name="email">
                                                                        <option></option>
                                                                        @foreach ($data['emails'] as $email)
                                                                        <option
                                                                            {{ ($service->email_template_uuid == $email->email_body_uuid) ? 'selected':'' }}
                                                                            value="{{$email->email_body_uuid}}">
                                                                            {{$email->title}}
                                                                        </option>
                                                                        @endforeach
                                                                    </select>

                                                                </div>

                                                                <div class="col-md-2 inner_row">
                                                                    <input type="text" name=""
                                                                        placeholder="Enter service types"
                                                                        class="form-control write_designation edit_servicetype">
                                                                    <div class="add_des_edit">
                                                                        <div class="update_icon">
                                                                            <i class="fa fa-check add_edit_dept edit_service_type"
                                                                                data-uuid=""></i>
                                                                        </div>
                                                                        <div class="del_icon" style="display: none">
                                                                            <i class="fa fa-trash-o del_service_type"
                                                                                aria-hidden="true" data-uuid=""></i>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="col-md-2 inner_row">
                                                                    <select class="select2 select_owner" name="">
                                                                        <option></option>
                                                                        @foreach($data['owner'] as $owner)
                                                                        <option value="{{$owner->admin_uuid}}">
                                                                            {{$owner->full_name}}
                                                                        </option>
                                                                        @endforeach
                                                                    </select>
                                                                </div>


                                                                <div class="del_icon new_icon">
                                                                    <i class="fa fa-trash-o del del_department del_service"
                                                                        aria-hidden="true" style="visibility: visible"
                                                                        data-uuid="{{$service->service_uuid}}"></i>
                                                                </div>
                                                                <div class="upload_new_icon" style="display: none;"
                                                                    data-toggle="modal" data-target="#staticBackdrop">
                                                                    <i class="fa fa-image" data-uuid=""></i>
                                                                </div>
                                                                <div class="upload_exist_icon" style="display: none;"
                                                                    data-toggle="modal" data-target="#staticBackdrop">
                                                                    <i class="fa fa-upload" data-uuid=""></i>
                                                                </div>
                                                                <div class="add_icon" style="display: none;"><i
                                                                        class="fa fa-plus add_row add_single_service_type "
                                                                        data-uuid="{{$service->service_uuid}}"></i>
                                                                </div>
                                                                <div class="edit_icon" style="display: none;">
                                                                    <i class="fa fa-check edit_row edit_service_email"
                                                                        data-uuid="{{$service->service_uuid}}"></i>
                                                                </div>

                                                            </div>
                                                        </div>
                                                    </div>
                                                    @endif
                                                    @endforeach
                                                    <form id="new_service" enctype='multipart/form-data'>
                                                        <div class="row_inner_wrap">
                                                            <div class="row">
                                                                <div class="col-md-12">
                                                                    <div class="col-md-3 inner_row">
                                                                        <select
                                                                            class="select2 select_service select2-hidden-accessible validate"
                                                                            name="services" tabindex="-1"
                                                                            aria-hidden="true">
                                                                            <option value=""></option>
                                                                            @foreach($data['services'] as $service)
                                                                            <option
                                                                                value="{{ $service->service_uuid }}">
                                                                                {{ $service->title }}</option>
                                                                            @endforeach
                                                                        </select>
                                                                    </div>
                                                                    
                                                                    <div class="col-md-2 inner_row">
                                                                        <select
                                                                            class="select2 select_designation select2-hidden-accessible"
                                                                            name="" tabindex="-1" aria-hidden="true">
                                                                            <option value=""></option>
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-md-2 inner_row">
                                                                        <select
                                                                            class="select2 select_new_email select2-hidden-accessible"
                                                                            name="email" tabindex="-1"
                                                                            aria-hidden="true">
                                                                            <option value=""></option>
                                                                            @foreach($data['emails'] as $email)
                                                                            <option
                                                                                value="{{ $email->email_body_uuid }}">
                                                                                {{ $email->title }}</option>
                                                                            @endforeach
                                                                        </select>
                                                                    </div>
                                                                    <div class="col-md-2 inner_row">
                                                                        <input id="test" type="text"
                                                                            name="service_types"
                                                                            placeholder="Enter Service Types"
                                                                            class="form-control validate write_designation">
                                                                    </div>
                                                                    <div class="col-md-2 inner_row">
                                                                        <select
                                                                            class="select2 select_owner validate select2-hidden-accessible"
                                                                            name="owner" tabindex="-1"
                                                                            aria-hidden="true">
                                                                            <option value=""></option>
                                                                            @foreach($data['owner'] as $owner)
                                                                            <option value="{{ $owner->admin_uuid }}">
                                                                                {{ $owner->full_name }}</option>
                                                                            @endforeach
                                                                        </select>
                                                                    </div>
                                                                    <div class="del_icon">
                                                                        <i class="fa fa-trash-o del del_department"
                                                                            aria-hidden="true" style="display: none;"
                                                                            data-uuid=""></i>
                                                                    </div>
                                                                    <div class="upload_icon" style="display: none;"
                                                                        data-toggle="modal"
                                                                        data-target="#staticBackdrop">
                                                                        <i class="fa fa-image" data-uuid=""></i>
                                                                    </div>
                                                                    <div class="add_icon" style="visibility: visible">
                                                                        <i class="fa fa-plus add_row add_row_department"
                                                                            data-uuid=""></i>
                                                                    </div>
                                                                    <div class="edit_icon" style="display: none;">
                                                                        <i class="fa fa-check edit_row edit_row_department"
                                                                            data-uuid=""></i>
                                                                    </div>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                            <!-- END LIST OF PRODUCTS -->
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-12 pl_pr_0">
                                            <a href="{{ route('admin.settings.index') }}"
                                                class="btn theme_btn_round cancel_page float_btn">Cancel</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- MAIN CONTENT END -->

            </div>
            <!-- End: life time stats -->
        </div>
    </div>
</div>
<!-- END PAGE CONTENT -->
<!-- //SWEET_ALERT START// -->
<div id="sweetalert_wrap" class="sweet_alert_wrap">
    <!-- Sweet alert -->
    <div class="sweet-alert showSweetAlert" data-custom-class="" data-has-cancel-button="true"
        data-has-confirm-button="true" data-allow-outside-click="false" data-has-done-function="true"
        data-animation="pop" data-timer="null">
        <div class="sa-icon sa-warning pulseWarning" style="display: block;">
            <span class="sa-body pulseWarningIns"></span>
            <span class="sa-dot pulseWarningIns"></span>
        </div>
        <h2>Are You Sure?</h2>
        <p>it will delete this Service and its Serive Types straight away.</p>
        <div class="sa-button-container">
            <button class="cancel" tabindex="2">Cancel</button>
            <div class="sa-confirm-button-container">
                <button class="confirm" tabindex="1">Confirm</button>
            </div>
        </div>
    </div>
</div>
<div id="sweetalert_service_types" class="sweet_alert_wrap">
    <!-- Sweet alert -->
    <div class="sweet-alert showSweetAlert" data-custom-class="" data-has-cancel-button="true"
        data-has-confirm-button="true" data-allow-outside-click="false" data-has-done-function="true"
        data-animation="pop" data-timer="null">
        <div class="sa-icon sa-warning pulseWarning" style="display: block;">
            <span class="sa-body pulseWarningIns"></span>
            <span class="sa-dot pulseWarningIns"></span>
        </div>
        <h2>Are You Sure?</h2>
        <p>it will delete Serive Types straight away.</p>
        <div class="sa-button-container">
            <button class="cancel" tabindex="2">Cancel</button>
            <div class="sa-confirm-button-container">
                <button class="confirm" tabindex="1">Confirm</button>
            </div>
        </div>
    </div>
</div>
<div id="sweetalert_Serive" class="sweet_alert_wrap">
    <!-- Sweet alert -->
    <div class="sweet-alert showSweetAlert" data-custom-class="" data-has-cancel-button="true"
        data-has-confirm-button="true" data-allow-outside-click="false" data-has-done-function="true"
        data-animation="pop" data-timer="null">
        <div class="sa-icon sa-warning pulseWarning" style="display: block;">
            <span class="sa-body pulseWarningIns"></span>
            <span class="sa-dot pulseWarningIns"></span>
        </div>
        <h2>Departments Already Exist.</h2>

        <div class="sa-button-container">
            <button class="cancel" tabindex="2">Cancel</button>
            <div class="sa-confirm-button-container">
                <button class="confirm" tabindex="1">Confirm</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal -->
<div class="modal fade" id="staticBackdrop" data-backdrop="static" data-keyboard="false" tabindex="-1"
    aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="staticBackdropLabel">PDF Upload</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="col-md-6">
                    <div class="form-group">
                        <label>Service Pdf File</label>
                        <input type="file" id="service_file" name="service_file" value=""
                            class="form-control  input_file_quote" onchange="getoutput()">
                        <span class="upload_file_quote"><span class="green">Select </span>file
                            here</span>
                        <span class="remove_file"><i class="fa fa-trash"></i></span>

                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary upload_pdf">Done</button>
            </div>
        </div>
    </div>
</div>
@stop
@section('styles')
<link rel="stylesheet" type="text/css" href="{{ asset('css/settings.css') }}" />
<style rel="stylesheet">
    .b4_del_header {
        width: 37.33% !important;
    }

    .b4_del_header .del_icon {
        background: no-repeat;
        border: none;
        right: 10px;
    }

    .b4_del_header .edit_dept,
    .b4_del_header .del_icon {
        visibility: hidden;
    }

    .b4_del_header .add_edit_dept {
        visibility: hidden;
    }

    .add_edit_dept {
        position: absolute;
        top: 14px;
        right: 14px;
        color: #63C647;
        cursor: pointer;
        z-index: 2;
        visibility: hidden;
    }

    .upload_icon,
    .upload_new_icon,
    .upload_exist_icon {
        background: #ECEDF1;
        position: absolute;
        top: 7px;
        right: 63px;
        border-radius: 3px;
        cursor: pointer;
        border: 1px solid #CED0D4;
        line-height: 0;
        margin-top: 1px;
    }

    .upload_icon,
    .upload_new_icon,
    .upload_exist_icon i {
        padding: 5px 4px 4px;
    }

</style>
@stop
@section('admin_js')
@include('admin.settings.services.js.services')
@stop