@extends('app') @section('page-title') @section('content') @if (isset($status))
<div class="pad margin no-print">
    <div class="alert alert-{{$status['code']}} alert-dismissible fade in" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
        <h4><i class="icon fa fa-ban"></i>{{ $status['header'] }}</h4>
        <ul>
            @foreach ($status['messages'] as $m)
            <li>{{$m}}</li>
            @endforeach
        </ul>
    </div>
</div>
@endif

<div class="row">
    <div class="col-xs-12">

        <div class="panel panel-inverse">
            <div class="panel-heading"> @lang('modules.ticket.createTitle')</div>
            <div class="panel-wrapper collapse in" aria-expanded="true">
                <div class="panel-body">
                    {!! Form::model($ticket, ['id'=>'createTicket','class'=>'ajax-form11','files' => 'true','method' => isset($ticket) && $ticket->id ? 'put' : 'post']) !!}
                    <div class="form-body">
						<div class="row">
                            <div class="col-md-12 ">
                                <div class="form-group">
                                    <label>@lang('modules.ticket.ticketfor')</label>
                                    <div class="radio-list">
                                        
										<label class="radio-inline p-0">
											<div class="radio radio-info">
												<input type="radio" name="ticketfor" id="foremp" checked="" value="employee">
												<label for="foremp">Employee</label>
											</div>
										</label>
										
										<label class="radio-inline">
											<div class="radio radio-info">
												<input type="radio" name="ticketfor" id="forworkman" value="workman">
												<label for="forworkman">Workman</label>
										</div>
									</label>

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

                            <!--/span-->
                        </div>
                        <div class="row">
							<div class="col-md-12" id="section4emp">
                                <div class="form-group">
                                    <label>@lang('modules.ticket.chooseEmployee')</label>
                                    <select class="select2 form-control" data-placeholder="@lang('modules.ticket.chooseMember')" id="selectControlEmp" name="emp_id">
										@foreach($employees as $employee)
											<option value="{{ $employee->id }}">{{ ucwords($employee->name) }} ({{ $employee->employee_code }})</option>
										@endforeach
									</select>
                                </div>
                            </div>
							<div class="col-md-12" id="section4workman" style="display:none;">
                                <div class="form-group">
                                    <label>@lang('modules.ticket.chooseWorkman')</label>
                                    <select class="select2 form-control" data-placeholder="@lang('modules.ticket.chooseWorkman')" style="width:100%" id="selectControlWorkman" name="emp_id_1">
										@foreach($workmans as $employee)
											<option value="{{ $employee->id }}">{{ ucwords($employee->name) }} ({{ $employee->employee_code }})</option>
										@endforeach
									</select>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 ">
                                <div class="form-group">
                                    <label class="control-label required">@lang('modules.ticket.severity')
										
									</label>
                               
                                    <select class="form-control select2" id="severity" name="severity">
                                            @foreach($ticketSeverity as $val)
                                                <option value="{{$val}}">{{ucfirst($val)}}</option>
                                            @endforeach
                                        </select> {!! $errors->first('severity', '<label class="control-label" for="severity">:message</label>')!!}
                                </div>
                            </div>
							
							<div class="col-md-6 ">
                                <div class="form-group">
                                
                                    <label class="control-label required">@lang('modules.ticket.department')
										
									</label>
                               
                                    <select class="form-control select2" id="ticket_type" required name="ticket_type">
											<option value="">@lang('modules.ticket.selectdepartment')</option>
                                            @foreach($ticketType as $val)
                                                <option value="{{$val}}">{{ucfirst($val)}}</option>
                                            @endforeach
                                        </select> {!! $errors->first('ticket_type', '<label class="control-label" for="ticket_type">:message</label>')!!}
                                </div>
                            </div>


                        

            </div>
            <!--/row-->

           <div class="row">
                            <div class="col-md-12 ">
                                <div class="form-group">
								
									<label class="control-label required">@lang('modules.ticket.subject')
										
									</label>
									{!! Form::text('subject', 
										isset($department) && $department->subject ? $department->subject : old('subject'), 
										['class' => 'form-control',
										'id' => 'subject', 'Placeholder' => 'Subject' ,'required']) 
									!!}								
									{!! $errors->first('subject', '<label class="control-label"  for="subject">:message</label>')!!}
									
									

                                </div>
                            </div>

                            <!--/span-->
                        </div>
            <!--/span-->

            <div class="row">
                <div class="col-md-12">
                    <label class="required">@lang('modules.ticket.description')</label>
                    <div class="form-group">
                        <textarea name="description"  required id="description" class="form-control" cols="30" rows="5">{!! old('description') !!}</textarea> {!! $errors->first('description', '<label class="control-label" for="description">:message</label>')!!}
                    </div>
                </div>

                

            </div>
			
			
			
			<div class="row">
                <div class="col-md-12">
                    <label>@lang('modules.ticket.attachment') <span style="color:grey">(can attach more than one)</span></label> 
                    <div class="form-group {{{ $errors->has('attachments[]') ? 'has-error' : '' }}}">
                        <div class="row">
                            <div class="col-md-2">
                                <button type="button" id="add_more" class="btn btn-primary" style="line-height:15px;"><i class="fa fa-plus" aria-hidden="true"></i> Add Attachment</button>
                            </div>
                        </div>
                        <i><b>Max size limit: 5MB</b><i><br />
						@foreach ($errors->all() as $error)
							@if (strpos($error, 'attachment'))
								<li>{{ $error }}
							@endif
                        @endforeach
                    </div>
                </div>
            </div>
            
            <input type="hidden" name="deleted_attachemnts" id="deleted_attachemnts" value=[] />

        </div>
        <div class="form-actions">
            <button type="submit" id="save-form-2" class="btn btn-success"><i class="fa fa-check"></i>
                                @lang('app.save')
                            </button>

        </div>
        {!! Form::close() !!}
    </div>

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

<!-- .row -->

@endsection @push('footer-script')

<script src="/assets/plugins/bower_components/bootstrap-select/bootstrap-select.min.js"></script>
<script src="/assets/plugins/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script>
    $('#foremp').change(function () {
        if($(this).is(':checked')){
			$('#selectControlEmp').attr('name', 'emp_id');
			$('#selectControlWorkman').attr('name', 'emp_id_1');
			$('#section4workman').hide();
            $('#section4emp').show();
        }
    });
	$('#forworkman').change(function () {
        if($(this).is(':checked')){
			$('#selectControlWorkman').attr('name', 'emp_id');
			$('#selectControlEmp').attr('name', 'emp_id_1');
            $('#section4emp').hide();
            $('#section4workman').show();
        }
    });

    var imagesPreview = function(input, placeToInsertImagePreview) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(event) {
                var extension = input.files[0].name.split('.').pop().toLowerCase();
                if(extension == "pdf"){
                    $($.parseHTML('<img src="/assets/img/pdf-icon.jpg" style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> <i class="fa fa-times-circle" style="font-size:18px;"></i></a><p class="text-center">'+input.files[0].name+'</p>')).appendTo(placeToInsertImagePreview);
                }
                else if(extension == "docx" || extension=="doc"){
                    $($.parseHTML('<img src="/assets/img/docx-icon.jpg" style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> <i class="fa fa-times-circle" style="font-size:18px;"></i></a><p class="text-center">'+input.files[0].name+'</p>')).appendTo(placeToInsertImagePreview);
                }
                else{
                    $($.parseHTML('<img style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> <i class="fa fa-times-circle" style="font-size:18px;"></i></a><p class="text-center">'+input.files[0].name+'</p>')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
                }
            }
            reader.readAsDataURL(input.files[0]);
        }
    };

    function deleteAttachment(){
        $(this).parent().remove();
    }

    function delAttached(attachment){
        $(this).parent().remove();
        var val = JSON.parse($('#deleted_attachemnts').val());
        val.push(attachment);
        $('#deleted_attachemnts').val(JSON.stringify(val));
    }

    function preview() {
        imagesPreview(this, $(this).closest('div'));
    }

    $('#add_more').click(function(e){
        var temp = $(this).parent().parent().parent().append("<div style='display:inline-block; position:relative; margin: 7px 7px 0 0;'><input type='file' style='display:none;' class='fileinput form-control attachments' name='attachments[]' data-filename-placement='inside' title='Browse' onchange='preview.call(this)' /></div>");
        var result = temp.find('div:last input').trigger('click');
    });
    

</script>
@endpush