@extends('layout.main')
@section('body_class','pp-studio-home pp-studio-app')
@section('workspace_studio','1')
@push('css')<link rel="manifest" href="{{ route('mobile-employee.manifest') }}"><meta name="theme-color" content="#086b9a"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-title" content="PeoplePro"><link rel="apple-touch-icon" href="{{ asset('css/peoplepro-app-192.png') }}"><link rel="stylesheet" href="{{ asset('css/employee-app.css') }}?v={{ filemtime(public_path('css/employee-app.css')) }}">@endpush
@section('content')
<div class="pp-employee-app" data-studio-workspace data-employee-app data-status-url="{{ route('mobile-employee.state') }}" data-worker-url="{{ asset('peoplepro-worker.js') }}" data-worker-scope="{{ rtrim(url('/my'),'/').'/' }}" data-clock-in="{{ __('Clock in') }}" data-clock-out="{{ __('Clock out') }}" data-in-label="{{ __('You are clocked in') }}" data-out-label="{{ __('You are clocked out') }}" data-offline="{{ __('You are offline. Reconnect to refresh your clock or submit a request.') }}" data-connected="{{ __('Connected. Clock status refreshes while this workspace is open.') }}" data-unavailable="{{ __('Your session or access changed. Reload the workspace before continuing.') }}" data-configuration="{{ __('Clock-in and clock-out is not enabled for this workspace.') }}" data-network="{{ __('Please use your office network to clock in or out.') }}" data-no-shift="{{ __('No shift is configured for this work date.') }}" data-elapsed="{{ $state['elapsed_seconds'] }}" data-running="{{ $state['clocked_in']&&!$state['waiting_for_shift']?'1':'0' }}">
<header class="pp-app-intro"><div><p>{{ $employee->company?->company_name }}</p><h1>{{ __('My work, at a glance.') }}</h1><p>{{ $employee->full_name }}@if($employee->designation) · {{ $employee->designation->designation_name }}@endif</p></div><a class="btn btn-outline-primary" href="{{ route('workspace.today') }}">{{ __('Full workspace') }}</a></header>@include('workspace.messages')
<section class="pp-app-clock" id="my-clock" aria-labelledby="app-clock-heading"><h2 id="app-clock-heading">{{ __('Your workday clock') }}</h2><p class="pp-app-status" data-clock-label aria-live="polite">{{ $state['clocked_in']?__('You are clocked in'):__('You are clocked out') }}</p><div class="pp-app-elapsed" data-clock-elapsed>{{ \App\Services\ProjectTimesheetService::duration((int)floor($state['elapsed_seconds']/60)) }}</div><dl><dt>{{ __('Work date') }}</dt><dd data-clock-date>{{ $state['work_date']??'—' }}</dd><dt>{{ __('Scheduled shift') }} · {{ $state['timezone'] }}</dt><dd data-clock-shift>{{ $state['shift']['label']??__('No shift is configured for this work date.') }}</dd></dl><p class="pp-app-clock-help" data-clock-help @if($state['enabled']&&$state['network_allowed']&&!$state['error']) hidden @endif>{{ $state['error']?:(!$state['enabled']?__('Clock-in and clock-out is not enabled for this workspace.'):(!$state['network_allowed']?__('Please use your office network to clock in or out.'):'')) }}</p><form method="post" action="{{ route('mobile-employee.clock') }}" data-app-clock-form>@csrf<input type="hidden" name="clock_revision" value="{{ $state['revision'] }}"><button class="btn" type="submit" data-app-clock-button @disabled(!$state['can_clock'])>{{ $state['clocked_in']?__('Clock out'):__('Clock in') }}</button></form></section><p class="pp-app-online" role="status" data-connection-state>{{ __('Connected. Clock status refreshes while this workspace is open.') }}</p>
@foreach(['requests'=>'Requests and balances','documents'=>'Documents and essentials','development'=>'Learning and conversations','work'=>'Projects and pay'] as $key=>$heading)@if(count($groups[$key]))<section class="pp-app-section" id="my-{{ $key }}"><h2>{{ __($heading) }}</h2><div class="pp-app-links">@foreach($groups[$key] as $action)<a class="pp-app-link" href="{{ $action['route'] }}"><span><strong>{{ __($action['title']) }}</strong><small>{{ __($action['help']) }}</small></span>@if($action['count'])<span class="pp-app-count" aria-label="{{ __($action['countLabel']) }}">{{ $action['count'] }}</span>@else<i class="fa fa-arrow-right" aria-hidden="true"></i>@endif</a>@endforeach</div></section>@endif @endforeach
<aside class="pp-app-install"><h2 class="h5">{{ __('Keep your workday close') }}</h2><p>{{ __('In a supported browser, add this workspace to your home screen for quick access. An internet connection is required to read current records and save changes.') }}</p><button type="button" class="btn btn-outline-primary" data-install-app hidden>{{ __('Add PeoplePro to my device') }}</button><p class="small mb-0">{{ __('If the install button is unavailable, use your browser menu and choose Add to Home Screen when supported. Installation requires HTTPS on your hosted site.') }}</p></aside>
<nav class="pp-app-bottom" aria-label="{{ __('Employee quick navigation') }}"><a href="#my-clock">{{ __('My clock') }}</a>@foreach(['requests'=>'Requests','documents'=>'Documents','development'=>'Learn'] as $key=>$label)@if(count($groups[$key]))<a href="#my-{{ $key }}">{{ __($label) }}</a>@endif @endforeach<a href="{{ route('profile') }}">{{ __('Profile') }}</a></nav></div>
@endsection
@push('scripts')<script defer src="{{ asset('js/workspace-studio.js') }}?v={{ filemtime(public_path('js/workspace-studio.js')) }}"></script><script defer src="{{ asset('js/employee-app.js') }}?v={{ filemtime(public_path('js/employee-app.js')) }}"></script>@endpush