|
@@ -2,35 +2,56 @@
|
|
|
|
|
|
@section('inner-content')
|
|
|
|
|
|
+
|
|
|
+
|
|
|
<?php
|
|
|
+
|
|
|
+ function adjustBrightness($hex, $steps) {
|
|
|
+ $steps = max(-255, min(255, $steps));
|
|
|
+ $hex = str_replace('#', '', $hex);
|
|
|
+ if (strlen($hex) == 3) {
|
|
|
+ $hex = str_repeat(substr($hex,0,1), 2).str_repeat(substr($hex,1,1), 2).str_repeat(substr($hex,2,1), 2);
|
|
|
+ }
|
|
|
+ $color_parts = str_split($hex, 2);
|
|
|
+ $return = '#';
|
|
|
+ foreach ($color_parts as $color) {
|
|
|
+ $color = hexdec($color); // Convert to decimal
|
|
|
+ $color = max(0,min(255,$color + $steps)); // Adjust color
|
|
|
+ $return .= str_pad(dechex($color), 2, '0', STR_PAD_LEFT); // Make two char hex code
|
|
|
+ }
|
|
|
+ return $return;
|
|
|
+ }
|
|
|
+
|
|
|
$palette = [
|
|
|
- ["bc" => '#522e92', "fc" => "#fff"],
|
|
|
- ["bc" => '#003152', "fc" => "#fff"],
|
|
|
- ["bc" => '#111e6c', "fc" => "#fff"],
|
|
|
- ["bc" => '#1034a6', "fc" => "#fff"],
|
|
|
- ["bc" => '#0f52ba', "fc" => "#fff"],
|
|
|
- ["bc" => '#447684', "fc" => "#fff"],
|
|
|
- ["bc" => '#d86700', "fc" => "#fff"],
|
|
|
- ["bc" => '#643c07', "fc" => "#fff"],
|
|
|
- ["bc" => '#ff3f3f', "fc" => "#fff"],
|
|
|
- ["bc" => '#ffa395', "fc" => "#222"],
|
|
|
- ["bc" => '#6450ff', "fc" => "#fff"],
|
|
|
- ["bc" => '#8ec7f4', "fc" => "#222"],
|
|
|
- ["bc" => '#522e92', "fc" => "#fff"],
|
|
|
- ["bc" => '#111e6c', "fc" => "#fff"],
|
|
|
- ["bc" => '#003152', "fc" => "#fff"],
|
|
|
- ["bc" => '#1034a6', "fc" => "#fff"],
|
|
|
- ["bc" => '#0f52ba', "fc" => "#fff"],
|
|
|
- ["bc" => '#447684', "fc" => "#fff"],
|
|
|
- ["bc" => '#d86700', "fc" => "#fff"],
|
|
|
- ["bc" => '#643c07', "fc" => "#fff"],
|
|
|
- ["bc" => '#ff3f3f', "fc" => "#fff"],
|
|
|
- ["bc" => '#ffa395', "fc" => "#222"],
|
|
|
- ["bc" => '#6450ff', "fc" => "#fff"],
|
|
|
- ["bc" => '#8ec7f4', "fc" => "#222"],
|
|
|
+ ["bc" => '#522e92', "fc" => "#ffffff", "ac" => adjustBrightness('#522e92', 180) . 'cc'],
|
|
|
+ ["bc" => '#003152', "fc" => "#ffffff", "ac" => adjustBrightness('#003152', 180) . 'cc'],
|
|
|
+ ["bc" => '#111e6c', "fc" => "#ffffff", "ac" => adjustBrightness('#111e6c', 180) . 'cc'],
|
|
|
+ ["bc" => '#1034a6', "fc" => "#ffffff", "ac" => adjustBrightness('#1034a6', 180) . 'cc'],
|
|
|
+ ["bc" => '#0f52ba', "fc" => "#ffffff", "ac" => adjustBrightness('#0f52ba', 180) . 'cc'],
|
|
|
+ ["bc" => '#447684', "fc" => "#ffffff", "ac" => adjustBrightness('#447684', 180) . 'cc'],
|
|
|
+ ["bc" => '#d86700', "fc" => "#ffffff", "ac" => adjustBrightness('#d86700', 180) . 'cc'],
|
|
|
+ ["bc" => '#643c07', "fc" => "#ffffff", "ac" => adjustBrightness('#643c07', 180) . 'cc'],
|
|
|
+ ["bc" => '#ff3f3f', "fc" => "#ffffff", "ac" => adjustBrightness('#ff3f3f', 180) . 'cc'],
|
|
|
+ ["bc" => '#ffa395', "fc" => "#222222", "ac" => adjustBrightness('#ffa395', 180) . 'cc'],
|
|
|
+ ["bc" => '#6450ff', "fc" => "#ffffff", "ac" => adjustBrightness('#6450ff', 180) . 'cc'],
|
|
|
+ ["bc" => '#8ec7f4', "fc" => "#222222", "ac" => adjustBrightness('#8ec7f4', 180) . 'cc'],
|
|
|
+ ["bc" => '#522e92', "fc" => "#ffffff", "ac" => adjustBrightness('#522e92', 180) . 'cc'],
|
|
|
+ ["bc" => '#111e6c', "fc" => "#ffffff", "ac" => adjustBrightness('#111e6c', 180) . 'cc'],
|
|
|
+ ["bc" => '#003152', "fc" => "#ffffff", "ac" => adjustBrightness('#003152', 180) . 'cc'],
|
|
|
+ ["bc" => '#1034a6', "fc" => "#ffffff", "ac" => adjustBrightness('#1034a6', 180) . 'cc'],
|
|
|
+ ["bc" => '#0f52ba', "fc" => "#ffffff", "ac" => adjustBrightness('#0f52ba', 180) . 'cc'],
|
|
|
+ ["bc" => '#447684', "fc" => "#ffffff", "ac" => adjustBrightness('#447684', 180) . 'cc'],
|
|
|
+ ["bc" => '#d86700', "fc" => "#ffffff", "ac" => adjustBrightness('#d86700', 180) . 'cc'],
|
|
|
+ ["bc" => '#643c07', "fc" => "#ffffff", "ac" => adjustBrightness('#643c07', 180) . 'cc'],
|
|
|
+ ["bc" => '#ff3f3f', "fc" => "#ffffff", "ac" => adjustBrightness('#ff3f3f', 180) . 'cc'],
|
|
|
+ ["bc" => '#ffa395', "fc" => "#222222", "ac" => adjustBrightness('#ffa395', 180) . 'cc'],
|
|
|
+ ["bc" => '#6450ff', "fc" => "#ffffff", "ac" => adjustBrightness('#6450ff', 180) . 'cc'],
|
|
|
+ ["bc" => '#8ec7f4', "fc" => "#222222", "ac" => adjustBrightness('#8ec7f4', 180) . 'cc'],
|
|
|
];
|
|
|
?>
|
|
|
|
|
|
+
|
|
|
+
|
|
|
<link href="/select2/select2.min.css" rel="stylesheet" />
|
|
|
<script src="/select2/select2.min.js"></script>
|
|
|
<link href='/fullcalendar-5.3.2/lib/main.css' rel='stylesheet' />
|
|
@@ -41,10 +62,21 @@
|
|
|
<h4 class="font-weight-bold m-0 font-size-16">
|
|
|
{{ $patient->displayName() }}'s Calendar
|
|
|
</h4>
|
|
|
- <div class="ml-auto">
|
|
|
+ <div class="ml-auto d-inline-flex align-items-center">
|
|
|
+ <label class="mr-2 my-0 text-secondary">Show</label>
|
|
|
+ <select id="eventTypes"
|
|
|
+ class="form-control form-control-sm w-150"
|
|
|
+ v-model="eventTypes"
|
|
|
+ v-on:change="refreshEvents()">
|
|
|
+ <option value="APPOINTMENTS" selected>Appointments</option>
|
|
|
+ <option value="PRO_AVAILABILITY">Pro Availability</option>
|
|
|
+ <option value="BOTH">Both</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="ml-3 d-inline-flex align-items-center">
|
|
|
<label class="mr-2 my-0 text-secondary">Timezone</label>
|
|
|
<select id="eventTz" name="timeZone"
|
|
|
- class="form-control form-control-sm"
|
|
|
+ class="form-control form-control-sm w-150"
|
|
|
v-model="timezone">
|
|
|
<option value="EASTERN" selected>Eastern</option>
|
|
|
<option value="CENTRAL">Central</option>
|
|
@@ -77,6 +109,7 @@
|
|
|
$proMeta[$iPro->uid] = [
|
|
|
"bc" => $palette[$proIndex]["bc"],
|
|
|
"fc" => $palette[$proIndex]["fc"],
|
|
|
+ "ac" => $palette[$proIndex]["ac"],
|
|
|
"initials" => $iPro->initials()
|
|
|
];
|
|
|
$proIndex++;
|
|
@@ -313,7 +346,7 @@
|
|
|
el: '#calendarApp',
|
|
|
data: {
|
|
|
client: {!! json_encode($patient) !!},
|
|
|
-
|
|
|
+ eventTypes: 'APPOINTMENTS',
|
|
|
calendar: null,
|
|
|
proMeta: {!! json_encode($proMeta) !!},
|
|
|
proIds: ['{{ $pro->id }}'],
|
|
@@ -348,6 +381,9 @@
|
|
|
description: '',
|
|
|
},
|
|
|
|
|
|
+ // availability
|
|
|
+ availability: {},
|
|
|
+
|
|
|
inProgress: false
|
|
|
},
|
|
|
methods: {
|
|
@@ -458,23 +494,39 @@
|
|
|
'&start=' + info.startStr.substr(0, 10) +
|
|
|
'&end=' + info.endStr.substr(0, 10) +
|
|
|
'&timeZone=' + self.timezone, function(_data) {
|
|
|
- // $.get('/api/appointment/getAllAppointmentsForPro?start=1990-01-01&end=2025-01-01&timeZone=CENTRAL', function(_data) {
|
|
|
if(_data && Array.isArray(_data)) {
|
|
|
- let events = _data;
|
|
|
+ let events = _data, displayEvents = [];
|
|
|
for(let e in events) {
|
|
|
if(events.hasOwnProperty(e) && self.proMeta[events[e].proUid]) {
|
|
|
let ev = events[e], meta = self.proMeta[ev.proUid];
|
|
|
- ev.backgroundColor = meta.bc;
|
|
|
- ev.borderColor = meta.bc;
|
|
|
- ev.textColor = meta.fc;
|
|
|
- ev.initials = meta.initials;
|
|
|
- ev.display = 'block';
|
|
|
+ if(ev.type === 'appointment') {
|
|
|
+ if(self.eventTypes === 'APPOINTMENTS' || self.eventTypes === 'BOTH') {
|
|
|
+ ev.backgroundColor = meta.bc;
|
|
|
+ ev.borderColor = meta.bc;
|
|
|
+ ev.textColor = meta.fc;
|
|
|
+ ev.initials = meta.initials;
|
|
|
+ ev.display = 'block';
|
|
|
+ ev.editable = true;
|
|
|
+ displayEvents.push(ev);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ if(self.eventTypes === 'PRO_AVAILABILITY' || self.eventTypes === 'BOTH') {
|
|
|
+ ev.backgroundColor = meta.ac;
|
|
|
+ ev.borderColor = meta.bc;
|
|
|
+ ev.textColor = meta.bc;
|
|
|
+ ev.initials = meta.initials;
|
|
|
+ ev.display = 'block';
|
|
|
+ ev.editable = false;
|
|
|
+ displayEvents.push(ev);
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- successCallback(events);
|
|
|
+ successCallback(displayEvents);
|
|
|
}
|
|
|
else {
|
|
|
- failureCallback(_data);
|
|
|
+ failureCallback('Unable to refresh appointments!');
|
|
|
}
|
|
|
}, 'json');
|
|
|
},
|