Finally using the alerts for sessions!!
This commit is contained in:
Scott Idem
@@ -805,6 +805,11 @@ img.qr_code:focus {
|
|||||||
background-image: repeating-linear-gradient(-45deg, hsla(0, 100%, 50%, .25), hsla(0, 100%, 50%, .25) 10px, transparent 10px, transparent 20px);
|
background-image: repeating-linear-gradient(-45deg, hsla(0, 100%, 50%, .25), hsla(0, 100%, 50%, .25) 10px, transparent 10px, transparent 20px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.alert {
|
||||||
|
/* background-color: hsla(0, 100%, 50%, .1); */
|
||||||
|
outline: dashed thin hsla(0, 100%, 50%, .5);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.sk_header.hide_sm {
|
.sk_header.hide_sm {
|
||||||
|
|||||||
@@ -495,6 +495,11 @@ let events_session_data_struct: key_val = {
|
|||||||
|
|
||||||
show__edit_poc_person: {},
|
show__edit_poc_person: {},
|
||||||
|
|
||||||
|
show__view_alert: {},
|
||||||
|
show__edit_alert_msg: {},
|
||||||
|
|
||||||
|
tmp__alert_msg: {},
|
||||||
|
|
||||||
status_rpt: {
|
status_rpt: {
|
||||||
recent_files: null,
|
recent_files: null,
|
||||||
presenters_agree: null,
|
presenters_agree: null,
|
||||||
|
|||||||
@@ -171,8 +171,247 @@ let trigger_reload_session_id: string = $state('');
|
|||||||
class:dim={session_obj?.hide}
|
class:dim={session_obj?.hide}
|
||||||
class:bg-warning-100={!session_obj?.enable}
|
class:bg-warning-100={!session_obj?.enable}
|
||||||
class:text-warning-900={!session_obj?.enable}
|
class:text-warning-900={!session_obj?.enable}
|
||||||
|
class:alert={session_obj?.alert}
|
||||||
|
class="relative"
|
||||||
>
|
>
|
||||||
<td>
|
<td>
|
||||||
|
{#if session_obj?.alert && $ae_loc.trusted_access}
|
||||||
|
<div
|
||||||
|
class:h-full={!$events_sess?.pres_mgmt?.show__view_alert[session_obj?.event_session_id_random]}
|
||||||
|
class="
|
||||||
|
absolute bottom-0 left-0
|
||||||
|
flex flex-row items-center justify-center
|
||||||
|
text-warning-600
|
||||||
|
z-10
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
title="This session is marked as an alert."
|
||||||
|
>
|
||||||
|
<!-- Toggle show/hide alert status and message -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random] = !$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random];
|
||||||
|
}}
|
||||||
|
class:hidden={$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random]}
|
||||||
|
class="
|
||||||
|
btn btn-lg
|
||||||
|
text-sm
|
||||||
|
px-3 sm:px-2
|
||||||
|
preset-tonal-warning
|
||||||
|
preset-outlined-warning-100-900
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
group
|
||||||
|
"
|
||||||
|
title="Toggle alert message display"
|
||||||
|
>
|
||||||
|
<span class="fas fa-bell text-warning-600 mx-1" title="This session is marked as an alert."></span>
|
||||||
|
<span class="hidden group-hover:inline">View Alert</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Alert Message -->
|
||||||
|
<div
|
||||||
|
class:hidden={!$events_sess?.pres_mgmt?.show__view_alert[session_obj?.event_session_id_random]}
|
||||||
|
class:inline-block={session_obj?.alert_msg && $events_sess?.pres_mgmt?.show__view_alert[session_obj?.event_session_id_random]}
|
||||||
|
class="
|
||||||
|
min-w-xs
|
||||||
|
max-w-xs sm:max-w-sm md:max-w-md lg:max-w-lg xl:max-w-xl
|
||||||
|
p-1 px-2
|
||||||
|
bg-warning-100 text-warning-900
|
||||||
|
border border-warning-300
|
||||||
|
rounded-lg
|
||||||
|
shadow-lg
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<div class="flex flex-row flex-wrap gap-1 items-center justify-between mb-1">
|
||||||
|
<!-- Toggle show/hide alert status and message -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random] = session_obj?.alert_msg;
|
||||||
|
$events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random] = false;
|
||||||
|
|
||||||
|
$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random] = false;
|
||||||
|
}}
|
||||||
|
class:hidden={!$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random]}
|
||||||
|
class="
|
||||||
|
btn btn-sm
|
||||||
|
text-xs
|
||||||
|
px-1
|
||||||
|
preset-tonal-warning hover:preset-tonal-error
|
||||||
|
preset-outlined-warning-100-900 hover:preset-outlined-warning-600-400
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
group
|
||||||
|
|
||||||
|
"
|
||||||
|
title="Cancel editing and close alert message"
|
||||||
|
>
|
||||||
|
<span class="fas fa-times mx-1"></span>
|
||||||
|
<!-- <span class="hidden group-hover:inline">Close</span> -->
|
||||||
|
Close Alert
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Remove alert status (and message?) -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
let new_alert_value = !session_obj?.alert;
|
||||||
|
console.log('New alert value:', new_alert_value);
|
||||||
|
|
||||||
|
ae_promises.api_update__ae_obj = core_func.update_ae_obj_id_crud_v2({
|
||||||
|
api_cfg: $ae_api,
|
||||||
|
object_type: 'event_session',
|
||||||
|
object_id: session_obj?.event_session_id_random,
|
||||||
|
object_reload: true,
|
||||||
|
field_name: 'alert',
|
||||||
|
new_field_value: new_alert_value,
|
||||||
|
log_lvl: 1
|
||||||
|
})
|
||||||
|
.then(function (results) {
|
||||||
|
})
|
||||||
|
.finally(function () {
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
class="
|
||||||
|
btn btn-sm
|
||||||
|
text-xs
|
||||||
|
px-1
|
||||||
|
preset-tonal-secondary hover:preset-filled-secondary-500
|
||||||
|
preset-outlined-secondary-100-900 hover:preset-outlined-secondary-600-400
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
title="Toggle alert status"
|
||||||
|
>
|
||||||
|
<span class="fas fa-exclamation-triangle text-warning-600 mr-1" title="This session is marked as an alert."></span>
|
||||||
|
<span>Remove Alert</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preset-tonal-primary p-1 rounded-lg border border-primary-300 min-h-16">
|
||||||
|
{#if $events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random]}
|
||||||
|
<textarea
|
||||||
|
bind:value={$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random]}
|
||||||
|
rows={3}
|
||||||
|
class="w-full p-1"
|
||||||
|
placeholder="Enter alert message here..."
|
||||||
|
></textarea>
|
||||||
|
{:else}
|
||||||
|
{session_obj?.alert_msg ?? 'No message set.'}
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-row flex-wrap gap-1 items-center justify-between mt-1">
|
||||||
|
{#if $events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random]}
|
||||||
|
|
||||||
|
<!-- Save alert message; only show if changed -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
ae_promises.api_update__ae_obj = core_func.update_ae_obj_id_crud_v2({
|
||||||
|
api_cfg: $ae_api,
|
||||||
|
object_type: 'event_session',
|
||||||
|
object_id: session_obj?.event_session_id_random,
|
||||||
|
object_reload: true,
|
||||||
|
field_name: 'alert_msg',
|
||||||
|
new_field_value: $events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random],
|
||||||
|
log_lvl: 1
|
||||||
|
})
|
||||||
|
.then(function (results) {
|
||||||
|
})
|
||||||
|
.finally(function () {
|
||||||
|
$events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random] = false;
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
class:invisible={$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random] == session_obj?.alert_msg}
|
||||||
|
class:visible={$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random] != session_obj?.alert_msg}
|
||||||
|
class="
|
||||||
|
btn btn-sm
|
||||||
|
text-xs
|
||||||
|
px-1
|
||||||
|
preset-tonal-success hover:preset-filled-success-500
|
||||||
|
preset-outlined-success-100-900 hover:preset-outlined-success-600-400
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
title="Save alert message"
|
||||||
|
>
|
||||||
|
<span class="fas fa-save mx-1"></span>
|
||||||
|
<span>Save</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Cancel edit/save alert message -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random] = session_obj?.alert_msg;
|
||||||
|
$events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random] = false;
|
||||||
|
|
||||||
|
$events_sess.pres_mgmt.show__view_alert[session_obj?.event_session_id_random] = false;
|
||||||
|
|
||||||
|
// Reload the session to get the original alert message back.
|
||||||
|
// events_func.load_ae_obj_id__event_session({
|
||||||
|
// api_cfg: $ae_api,
|
||||||
|
// event_session_id: session_obj?.event_session_id_random,
|
||||||
|
// log_lvl: log_lvl
|
||||||
|
// })
|
||||||
|
// .then(function (load_results) {
|
||||||
|
// console.log(`Loaded session:`, load_results);
|
||||||
|
// });
|
||||||
|
}}
|
||||||
|
class="
|
||||||
|
btn btn-sm
|
||||||
|
text-xs
|
||||||
|
px-1
|
||||||
|
preset-tonal-secondary hover:preset-filled-secondary-500
|
||||||
|
preset-outlined-secondary-100-900 hover:preset-outlined-secondary-600-400
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
|
||||||
|
"
|
||||||
|
title="Reset alert message and cancel editing alert"
|
||||||
|
>
|
||||||
|
<span class="fas fa-times mx-1"></span>
|
||||||
|
<span>Cancel</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{:else}
|
||||||
|
|
||||||
|
<!-- Edit alert message -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
console.log('Edit the alert message for the session.');
|
||||||
|
$events_sess.pres_mgmt.show__edit_alert_msg[session_obj?.event_session_id_random] = true
|
||||||
|
|
||||||
|
$events_sess.pres_mgmt.tmp__alert_msg[session_obj?.event_session_id_random] = session_obj?.alert_msg;
|
||||||
|
}}
|
||||||
|
class="
|
||||||
|
btn btn-sm
|
||||||
|
text-xs
|
||||||
|
px-1
|
||||||
|
preset-tonal-secondary hover:preset-tonal-error
|
||||||
|
preset-outlined-secondary-100-900 hover:preset-outlined-secondary-600-400
|
||||||
|
opacity-80 hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
title="Edit alert message"
|
||||||
|
>
|
||||||
|
<span class="fas fa-edit mx-1"></span>
|
||||||
|
<span>Edit Message</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
<a
|
<a
|
||||||
href="/events/{session_obj?.event_id}/session/{session_obj?.event_session_id}"
|
href="/events/{session_obj?.event_id}/session/{session_obj?.event_session_id}"
|
||||||
class="
|
class="
|
||||||
@@ -648,6 +887,53 @@ let trigger_reload_session_id: string = $state('');
|
|||||||
{/if}
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Toggle alert status -->
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onclick={() => {
|
||||||
|
console.log('Toggle alert status for the session.');
|
||||||
|
|
||||||
|
let new_alert_value = !session_obj?.alert;
|
||||||
|
console.log('New alert value:', new_alert_value);
|
||||||
|
|
||||||
|
ae_promises.api_update__ae_obj = core_func.update_ae_obj_id_crud_v2({
|
||||||
|
api_cfg: $ae_api,
|
||||||
|
object_type: 'event_session',
|
||||||
|
object_id: session_obj?.event_session_id_random,
|
||||||
|
object_reload: true,
|
||||||
|
field_name: 'alert',
|
||||||
|
new_field_value: new_alert_value,
|
||||||
|
log_lvl: 1
|
||||||
|
})
|
||||||
|
.then(function (results) {
|
||||||
|
})
|
||||||
|
.finally(function () {
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
class:opacity-100={session_obj?.alert}
|
||||||
|
class:opacity-50={!session_obj?.alert}
|
||||||
|
class="
|
||||||
|
btn btn-icon
|
||||||
|
text-xs
|
||||||
|
m-0 px-0.5
|
||||||
|
preset-tonal-warning hover:preset-tonal-error
|
||||||
|
preset-outlined-warning-100-900 hover:preset-outlined-warning-600-400
|
||||||
|
hover:opacity-100
|
||||||
|
transition-all
|
||||||
|
"
|
||||||
|
title={session_obj?.alert ? 'Remove alert status' : 'Mark as alert'}
|
||||||
|
>
|
||||||
|
{#if session_obj?.alert}
|
||||||
|
<!-- <span class="fas fa-exclamation-triangle m-0.75 text-warning-600" title="This session is marked as an alert."></span> -->
|
||||||
|
<span class="fas fa-bell-slash m-0.75 text-warning-600" title="This session is marked as an alert."></span>
|
||||||
|
{:else}
|
||||||
|
<span class="fas fa-bell m-0.75 text-gray-400" title="This session is not marked as an alert."></span>
|
||||||
|
{/if}
|
||||||
|
<span class="hidden">Toggle Alert</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
{/each}
|
{/each}
|
||||||
|
|||||||
Reference in New Issue
Block a user