Project-Pro/crmPRO
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Update task popup with tab navigation for description, checklist, comments, and attachments

Browse Source
This commit is contained in:
Jacek Pyziak
2026-02-12 13:53:36 +01:00
parent a4a8f6882b
commit dfa83b57a6
2 changed files with 177 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
.vscode/ftp-kr.sync.cache.json vendored
View File

@@ -24,8 +24,8 @@
},
"MailToTaskImporter.php": {
"type": "-",
"size": 37407,
"lmtime": 1770734028354,
"size": 37982,
"lmtime": 1770800891666,
"modified": false
},
"TaskAttachmentRepository.php": {
@@ -177,9 +177,9 @@
"libraries": {},
"logs.txt": {
"type": "-",
"size": 1016,
"size": 3048,
"lmtime": 1770733260000,
"modified": false
"modified": true
},
"REFACTORING_PLAN.md": {
"type": "-",

232
templates/tasks/task_popup.php
View File

@@ -11,8 +11,19 @@
<? endif;?>
#<?= $this -> task['id'];?> <?= $this -> task['name'];?>
</div>
<?
$checklist_count = is_array( $this -> task['actions'] ) ? count( $this -> task['actions'] ) : 0;
$comments_count = is_array( $this -> task['comments'] ) ? count( $this -> task['comments'] ) : 0;
$attachments_count = is_array( $this -> task_attachments ) ? count( $this -> task_attachments ) : 0;
?>
<div class="content">
<div class="left">
<div class="task-tabs-nav" role="tablist" aria-label="Prze&#322;&#261;cz zak&#322;adk&#281; zadania">
<a href="#" class="js-task-tab-btn is-active" data-tab="description" role="tab" aria-selected="true">Opis</a>
<a href="#" class="js-task-tab-btn" data-tab="checklist" role="tab" aria-selected="false">Lista kontrolna (<?= (int)$checklist_count;?>)</a>
<a href="#" class="js-task-tab-btn" data-tab="comments" role="tab" aria-selected="false">Komentarze (<?= (int)$comments_count;?>)</a>
<a href="#" class="js-task-tab-btn" data-tab="attachments" role="tab" aria-selected="false">Za&#322;&#261;czniki (<?= (int)$attachments_count;?>)</a>
</div>
<div class="users box">
<? if ( is_array( $this -> task['users'] ) ): foreach ( $this -> task['users'] as $user_tmp_id ):?>
<? $user_tmp = \factory\Users::user_details( $user_tmp_id );?>
@@ -22,69 +33,81 @@
</div>
<? endforeach; endif;?>
</div>
<? if ( $this -> task['text'] ):?>
<div class="description">
<a href="#" class="fullscreen"><i class="fa fa-expand"></i></a>
<?= htmlspecialchars_decode( $this -> task['text'] );?>
</div>
<? endif;?>
<div class="checklist">
<h3>Lista kontrolna</h3>
<div class="new_element">
<input type="text" class="form-control" placeholder="Dodaj nowy element">
<a href="#" class="add_element" task_id="<?= $this -> task['id'];?>"><i class="fa fa-plus"></i></a>
</div>
<ul>
<? foreach ( $this -> task['actions'] as $action ):?>
<li action_id="<?= $action['id'];?>">
<input type="checkbox" class="g-checkbox" value="<?= $action[ 'id' ];?>" <? if ( $action['status'] ):?>checked="checked"<? endif;?>>
<?= $action['name'];?>
<a href="#" class="point-delete" action_id="<?= $action['id'];?>">
<i class="fa fa-trash"></i>
</a>
</li>
<? endforeach;?>
</ul>
<div class="task-tab-panel is-active" data-tab="description">
<? if ( $this -> task['text'] ):?>
<div class="description">
<a href="#" class="fullscreen"><i class="fa fa-expand"></i></a>
<?= htmlspecialchars_decode( $this -> task['text'] );?>
</div>
<? else:?>
<div class="description description-empty">
Brak opisu zadania.
</div>
<? endif;?>
</div>
<div class="comments">
<h3>Komentarze</h3>
<div class="new_comment">
<textarea class="form-control" placeholder="Dodaj nowy komentarz"></textarea>
<a href="#" class="add_comment" task_id="<?= $this -> task['id'];?>">Dodaj nowy komentarz</a>
</div>
<ul>
<? foreach ( $this -> task['comments'] as $comment ):?>
<li>
<a href="#" class="delete_comment" comment_id="<?= $comment['id'];?>"><i class="fa fa-trash"></i></a>
<div class="author"><?= \factory\Users::user_details( $comment['user_id'] )['name'] . ' ' . \factory\Users::user_details( $comment['user_id'] )['surname'];?></div>
<div class="date"><?= date( 'Y/m/d H:i', strtotime( $comment['date_add'] ) );?></div>
<div class="text"><?= nl2br( $comment['text'] );?></div>
</li>
<? endforeach;?>
</ul>
</div>
<div class="attachments box">
<h3>Za&#322;&#261;czniki</h3>
<div class="attachments_upload">
<input type="file" class="form-control attachment_file_input" name="attachments[]" multiple>
<a href="#" class="attachment-upload-btn btn btn-primary btn-sm" task_id="<?= $this -> task['id'];?>">Dodaj za&#322;&#261;czniki</a>
</div>
<ul class="attachments_list">
<? if ( is_array( $this -> task_attachments ) and count( $this -> task_attachments ) ):?>
<? foreach ( $this -> task_attachments as $attachment ):?>
<li>
<a href="<?= $attachment['url'];?>" target="_blank" rel="noopener noreferrer" class="attachment-link">
<?= htmlspecialchars( $attachment['title_effective'] );?>
<div class="task-tab-panel" data-tab="checklist">
<div class="checklist">
<h3>Lista kontrolna</h3>
<div class="new_element">
<input type="text" class="form-control" placeholder="Dodaj nowy element">
<a href="#" class="add_element" task_id="<?= $this -> task['id'];?>"><i class="fa fa-plus"></i></a>
</div>
<ul>
<? foreach ( $this -> task['actions'] as $action ):?>
<li action_id="<?= $action['id'];?>">
<input type="checkbox" class="g-checkbox" value="<?= $action[ 'id' ];?>" <? if ( $action['status'] ):?>checked="checked"<? endif;?>>
<?= $action['name'];?>
<a href="#" class="point-delete" action_id="<?= $action['id'];?>">
<i class="fa fa-trash"></i>
</a>
<small>(<?= $attachment['size_human'];?>)</small>
<a href="#" class="attachment-rename" attachment_id="<?= $attachment['id'];?>" title_current="<?= htmlspecialchars( $attachment['title_effective'] );?>"><i class="fa fa-pencil"></i></a>
<a href="#" class="attachment-delete" attachment_id="<?= $attachment['id'];?>"><i class="fa fa-trash"></i></a>
</li>
<? endforeach;?>
<? else:?>
<li class="attachments-empty">Brak za&#322;&#261;cznik&#243;w.</li>
<? endif;?>
</ul>
</ul>
</div>
</div>
<div class="task-tab-panel" data-tab="comments">
<div class="comments">
<h3>Komentarze</h3>
<div class="new_comment">
<textarea class="form-control" placeholder="Dodaj nowy komentarz"></textarea>
<a href="#" class="add_comment" task_id="<?= $this -> task['id'];?>">Dodaj nowy komentarz</a>
</div>
<ul>
<? foreach ( $this -> task['comments'] as $comment ):?>
<li>
<a href="#" class="delete_comment" comment_id="<?= $comment['id'];?>"><i class="fa fa-trash"></i></a>
<div class="author"><?= \factory\Users::user_details( $comment['user_id'] )['name'] . ' ' . \factory\Users::user_details( $comment['user_id'] )['surname'];?></div>
<div class="date"><?= date( 'Y/m/d H:i', strtotime( $comment['date_add'] ) );?></div>
<div class="text"><?= nl2br( $comment['text'] );?></div>
</li>
<? endforeach;?>
</ul>
</div>
</div>
<div class="task-tab-panel" data-tab="attachments">
<div class="attachments box">
<h3>Za&#322;&#261;czniki</h3>
<div class="attachments_upload">
<input type="file" class="form-control attachment_file_input" name="attachments[]" multiple>
<a href="#" class="attachment-upload-btn btn btn-primary btn-sm" task_id="<?= $this -> task['id'];?>">Dodaj za&#322;&#261;czniki</a>
</div>
<ul class="attachments_list">
<? if ( is_array( $this -> task_attachments ) and count( $this -> task_attachments ) ):?>
<? foreach ( $this -> task_attachments as $attachment ):?>
<li>
<a href="<?= $attachment['url'];?>" target="_blank" rel="noopener noreferrer" class="attachment-link">
<?= htmlspecialchars( $attachment['title_effective'] );?>
</a>
<small>(<?= $attachment['size_human'];?>)</small>
<a href="#" class="attachment-rename" attachment_id="<?= $attachment['id'];?>" title_current="<?= htmlspecialchars( $attachment['title_effective'] );?>"><i class="fa fa-pencil"></i></a>
<a href="#" class="attachment-delete" attachment_id="<?= $attachment['id'];?>"><i class="fa fa-trash"></i></a>
</li>
<? endforeach;?>
<? else:?>
<li class="attachments-empty">Brak za&#322;&#261;cznik&#243;w.</li>
<? endif;?>
</ul>
</div>
</div>
</div>
<div class="right">
@@ -174,6 +197,66 @@
width: 100% !important;
}
.task_popup .task_details .content .left .task-tabs-nav {
margin: 0 0 10px 0;
display: flex;
flex-wrap: wrap;
border: 1px solid #d8e2f6;
border-radius: 8px;
overflow: hidden;
background: #f4f8ff;
position: sticky;
top: 0;
z-index: 30;
}
.task_popup .task_details .content .left .task-tabs-nav .js-task-tab-btn {
padding: 8px 12px;
color: #355899;
text-decoration: none;
font-size: 13px;
font-weight: 600;
border-right: 1px solid #d8e2f6;
transition: all 0.2s ease;
}
.task_popup .task_details .content .left .task-tabs-nav .js-task-tab-btn:last-child {
border-right: 0;
}
.task_popup .task_details .content .left .task-tabs-nav .js-task-tab-btn:hover {
background: #e7f0ff;
}
.task_popup .task_details .content .left .task-tabs-nav .js-task-tab-btn.is-active {
background: #6690f4;
color: #fff;
}
.task_popup .task_details .content .left .task-tab-panel {
margin-top: 10px;
display: none;
}
.task_popup .task_details .content .left .task-tab-panel.is-active {
display: block;
}
.task_popup .task_details .content .left .task-tab-panel .attachments {
margin-top: 0;
}
.task_popup .task_details .content .left .task-tab-panel .description.description-empty {
color: #6b7280;
font-style: italic;
}
.task_popup .task_details .content .left .task-tab-panel[data-tab="description"] .description:not(.description-empty) {
min-height: 320px;
max-height: calc(90vh - 300px);
overflow-y: auto;
}
.task_popup .task_details .content .right .client .select2-container--bootstrap-5 .select2-selection {
min-height: 35px;
border: 1px solid #cdcdcd;
@@ -208,6 +291,37 @@
if ( !popup.length )
return;
var tab_panels = popup.find( '.task-tab-panel' );
var tab_buttons = popup.find( '.js-task-tab-btn' );
function setActiveTaskTab( tab_name ) {
if ( !tab_panels.length )
return;
var allowed_tabs = [ 'description', 'checklist', 'comments', 'attachments' ];
var selected_tab = allowed_tabs.indexOf( tab_name ) >= 0 ? tab_name : 'description';
tab_panels.each( function() {
var panel = $( this );
panel.toggleClass( 'is-active', panel.attr( 'data-tab' ) === selected_tab );
});
tab_buttons.each( function() {
var button = $( this );
var is_active = button.attr( 'data-tab' ) === selected_tab;
button.toggleClass( 'is-active', is_active ).attr( 'aria-selected', is_active ? 'true' : 'false' );
});
window.crm_task_popup_active_tab = selected_tab;
}
popup.on( 'click', '.js-task-tab-btn', function( e ) {
e.preventDefault();
setActiveTaskTab( $( this ).attr( 'data-tab' ) );
} );
setActiveTaskTab( window.crm_task_popup_active_tab || 'description' );
if ( $.fn.select2 )
{
var client_select = popup.find( '.task_client_select' );