Call Center responsive design update

Fix the display running out of the content area for different screen sizes.
This commit is contained in:
FusionPBX 2024-12-07 13:34:22 -07:00 committed by GitHub
parent 492b188d0d
commit c36455e28f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 219 additions and 163 deletions

View File

@ -468,8 +468,8 @@ $text['label-domain']['zh-cn'] = "领域";
$text['label-domain']['ja-jp'] = "ドメイン";
$text['label-domain']['ko-kr'] = "도메인";
$text['label-destination']['en-us'] = "Dest";
$text['label-destination']['en-gb'] = "Dest";
$text['label-destination']['en-us'] = "Destination";
$text['label-destination']['en-gb'] = "Destination";
$text['label-destination']['ar-eg'] = "الوجهة";
$text['label-destination']['de-at'] = "Ziel";
$text['label-destination']['de-ch'] = "Ziel";
@ -546,8 +546,8 @@ $text['label-codec']['zh-cn'] = "读/写编解码器";
$text['label-codec']['ja-jp'] = "読み取り/書き込みコーデック";
$text['label-codec']['ko-kr'] = "읽기/쓰기 코덱";
$text['label-cid-number']['en-us'] = "CID Number";
$text['label-cid-number']['en-gb'] = "CID Number";
$text['label-cid-number']['en-us'] = "Caller Number";
$text['label-cid-number']['en-gb'] = "Caller Number";
$text['label-cid-number']['ar-eg'] = "رقم CID";
$text['label-cid-number']['de-at'] = "Anrufer Nummer";
$text['label-cid-number']['de-ch'] = "Anrufer Nummer";
@ -572,8 +572,8 @@ $text['label-cid-number']['zh-cn'] = "来电号码";
$text['label-cid-number']['ja-jp'] = "CID番号";
$text['label-cid-number']['ko-kr'] = "CID 번호";
$text['label-cid-name']['en-us'] = "CID Name";
$text['label-cid-name']['en-gb'] = "CID Name";
$text['label-cid-name']['en-us'] = "Caller Name";
$text['label-cid-name']['en-gb'] = "Caller Name";
$text['label-cid-name']['ar-eg'] = "اسم CID";
$text['label-cid-name']['de-at'] = "Anrufer Name";
$text['label-cid-name']['de-ch'] = "Anrufer Name";
@ -650,6 +650,33 @@ $text['label-eavesdrop']['zh-cn'] = "窃听";
$text['label-eavesdrop']['ja-jp'] = "盗聴";
$text['label-eavesdrop']['ko-kr'] = "엿듣다";
$text['label-duration']['en-us'] = "Duration";
$text['label-duration']['en-gb'] = "Duration";
$text['label-duration']['ar-eg'] = "المدة";
$text['label-duration']['de-at'] = "Dauer";
$text['label-duration']['de-ch'] = "Dauer";
$text['label-duration']['de-de'] = "Dauer";
$text['label-duration']['el-gr'] = "Διάρκεια";
$text['label-duration']['es-cl'] = "Duración";
$text['label-duration']['es-mx'] = "Duración";
$text['label-duration']['fr-ca'] = "Durée";
$text['label-duration']['fr-fr'] = "Durée";
$text['label-duration']['he-il'] = "משך השיחה";
$text['label-duration']['it-it'] = "Durata";
$text['label-duration']['ka-ge'] = "ხანგრძლივობა";
$text['label-duration']['nl-nl'] = "Duur";
$text['label-duration']['pl-pl'] = "Czas trwania";
$text['label-duration']['pt-br'] = "Duração";
$text['label-duration']['pt-pt'] = "Duração";
$text['label-duration']['ro-ro'] = "Durată";
$text['label-duration']['ru-ru'] = "Продолжительность";
$text['label-duration']['sv-se'] = "Samtalstid";
$text['label-duration']['uk-ua'] = "Тривалість";
$text['label-duration']['tr-tr'] = "Süre";
$text['label-duration']['zh-cn'] = "期间";
$text['label-duration']['ja-jp'] = "間隔";
$text['label-duration']['ko-kr'] = "지속";
$text['description-2']['en-us'] = "Use this to view all extensions and monitor and interact with active calls.";
$text['description-2']['en-gb'] = "Use this to view all extensions and monitor and interact with active calls.";
$text['description-2']['ar-eg'] = "استخدم هذا لعرض جميع الملحقات ومراقبة المكالمات النشطة والتفاعل معها.";

View File

@ -88,10 +88,8 @@
}
$num_rows = @sizeof($rows);
//if the connnection is available then run it and return the results
if (!$event_socket) {
$msg = "<div align='center'>".$text['confirm-socket']."<br /></div>";
echo "<div align='center'>\n";
echo "<table width='40%'>\n";
@ -103,15 +101,32 @@
echo "</tr>\n";
echo "</table>\n";
echo "</div>\n";
return;
}
else {
//create token
//create token
$object = new token;
$token = $object->create('/app/calls_active/calls_active_inc.php');
//show content
//add the style
echo "<style>\n";
echo " /* Small screens: Hide columns with class 'hide-small' */\n";
echo " @media (max-width: 600px) {\n";
echo " .hide-small {\n";
echo " display: none;\n";
echo " }\n";
echo " }\n";
echo "\n";
echo " /* Medium screens: Hide columns with class 'hide-medium' */\n";
echo "@media (max-width: 1023px) and (min-width: 601px) {\n";
echo " .hide-medium {\n";
echo " display: none;\n";
echo " }\n";
echo " }\n";
echo "\n";
echo "</style>\n";
//show the content
echo "<div class='action_bar' id='action_bar'>\n";
echo " <div class='heading'><b>".$text['title']."</b><div class='count'>".number_format($num_rows)."</div></div>\n";
echo " <div class='actions'>\n";
@ -154,36 +169,37 @@
echo $text['description']."\n";
echo "<br /><br />\n";
//show the results
//show the results
echo "<div id='cmd_reponse'></div>\n";
echo "<form id='form_list' method='post' action='calls_exec.php'>\n";
echo "<input type='hidden' id='action' name='action' value=''>\n";
echo "<div class='card'>\n";
echo "<table class='list'>\n";
echo "<tr class='list-header'>\n";
echo " <table class='list'>\n";
echo " <tr class='list-header'>\n";
if (permission_exists('call_active_hangup')) {
echo " <th class='checkbox'>\n";
echo " <input type='checkbox' id='checkbox_all' name='checkbox_all' onclick='if (this.checked) { refresh_stop(); } else { refresh_start(); } list_all_toggle();' ".(empty($rows) ? "style='visibility: hidden;'" : null).">\n";
echo " </th>\n";
}
echo " <th>".$text['label-profile']."</th>\n";
echo " <th>".$text['label-created']."</th>\n";
echo " <th class='hide-small'>".$text['label-profile']."</th>\n";
//echo" <th>".$text['label-created']."</th>\n";
echo " <th>".$text['label-duration']."</th>\n";
if ($show == 'all') {
echo " <th>".$text['label-domain']."</th>\n";
}
echo " <th>".$text['label-number']."</th>\n";
echo " <th>".$text['label-cid-name']."</th>\n";
//echo " <th>".$text['label-number']."</th>\n";
echo " <th class='hide-small'>".$text['label-cid-name']."</th>\n";
echo " <th>".$text['label-cid-number']."</th>\n";
echo " <th>".$text['label-destination']."</th>\n";
echo " <th>".$text['label-app']."</th>\n";
echo " <th>".$text['label-codec']."</th>\n";
echo " <th>".$text['label-secure']."</th>\n";
echo " <th class='hide-small hide-medium'>".$text['label-app']."</th>\n";
echo " <th class='hide-small hide-medium'>".$text['label-codec']."</th>\n";
echo " <th class='hide-small hide-medium'>".$text['label-secure']."</th>\n";
if (permission_exists('call_active_eavesdrop') || permission_exists('call_active_hangup')) {
echo " <th>&nbsp;</th>\n";
}
echo "</tr>\n";
echo " </tr>\n";
if (is_array($rows)) {
$x = 0;
@ -200,9 +216,9 @@
$sip_uri = $name_array[2];
//get the number
$temp_array = explode("@", $sip_uri);
$tmp_number = $temp_array[0];
$tmp_number = str_replace("sip:", "", $tmp_number);
//$temp_array = explode("@", $sip_uri);
//$tmp_number = $temp_array[0];
//$tmp_number = str_replace("sip:", "", $tmp_number);
//remove the '+' because it breaks the call recording
$cid_num = str_replace("+", "", $cid_num);
@ -214,31 +230,49 @@
}
}
// reduce too long app data
if(strlen($application_data) > 512) {
$application_data = substr($application_data, 0, 512) . '...';
//convert $created to a UNIX timestamp
$created_timestamp = strtotime($created);
//get the current timestamp
$now = time();
//calculate elapsed seconds
$elapsed_seconds = $now - $created_timestamp;
//convert seconds to hours, minutes, and seconds
$hours = floor($elapsed_seconds / 3600);
$minutes = floor(($elapsed_seconds % 3600) / 60);
$seconds = $elapsed_seconds % 60;
//format the elapsed time as HH:MM:SS
$elapsed_time = sprintf('%02d:%02d:%02d', $hours, $minutes, $seconds);
//reduce too long app data
if(strlen($application_data) > 80) {
$application_data = substr($application_data, 0, 80) . '...';
}
//send the html
echo "<tr class='list-row'>\n";
echo " <tr class='list-row'>\n";
if (permission_exists('call_active_hangup')) {
echo " <td class='checkbox'>\n";
echo " <input type='checkbox' name='calls[$x][checked]' id='checkbox_".$x."' value='true' onclick=\"if (this.checked) { refresh_stop(); } else { document.getElementById('checkbox_all').checked = false; }\">\n";
echo " <input type='hidden' name='calls[$x][uuid]' value='".escape($uuid)."' />\n";
echo " </td>\n";
}
echo " <td>".escape($sip_profile)."&nbsp;</td>\n";
echo " <td>".escape($created)."&nbsp;</td>\n";
echo " <td class='hide-small'>".escape($sip_profile)."&nbsp;</td>\n";
//echo " <td>".escape($created)."&nbsp;</td>\n";
echo " <td>".escape($elapsed_time)."</td>\n";
if ($show == 'all') {
echo " <td>".escape($domain_name)."&nbsp;</td>\n";
}
echo " <td>".escape($tmp_number)."&nbsp;</td>\n";
echo " <td>".escape($cid_name)."&nbsp;</td>\n";
//echo " <td>".escape($tmp_number)."&nbsp;</td>\n";
echo " <td class='hide-small'>".escape($cid_name)."&nbsp;</td>\n";
echo " <td>".escape($cid_num)."&nbsp;</td>\n";
echo " <td>".escape($dest)."&nbsp;</td>\n";
echo " <td>".(!empty($application) ? escape($application).":".escape($application_data) : null)."&nbsp;</td>\n";
echo " <td>".escape($read_codec).":".escape($read_rate)." / ".escape($write_codec).":".escape($write_rate)."&nbsp;</td>\n";
echo " <td>".escape($secure)."&nbsp;</td>\n";
echo " <td class='hide-small hide-medium' style='max-width: 200px; word-wrap: break-word;'>".(!empty($application) ? escape($application).":".escape($application_data) : null)."&nbsp;</td>\n";
echo " <td class='hide-small hide-medium'>".escape($read_codec).":".escape($read_rate)." / ".escape($write_codec).":".escape($write_rate)."&nbsp;</td>\n";
echo " <td class='hide-small hide-medium'>".escape($secure)."&nbsp;</td>\n";
if (permission_exists('call_active_eavesdrop') || permission_exists('call_active_hangup')) {
echo " <td class='button right' style='padding-right: 0;'>\n";
//eavesdrop
@ -249,9 +283,9 @@
if (permission_exists('call_active_hangup')) {
echo button::create(['type'=>'button','label'=>$text['label-hangup'],'icon'=>'phone-slash','collapse'=>'hide-lg-dn','onclick'=>"if (confirm('".$text['confirm-hangup']."')) { list_self_check('checkbox_".$x."'); list_action_set('hangup'); list_form_submit('form_list'); } else { this.blur(); return false; }",'onmouseover'=>'refresh_stop()','onmouseout'=>'refresh_start()']);
}
echo "</td>\n";
echo " </td>\n";
}
echo "</tr>\n";
echo " </tr>\n";
//unset the domain name
unset($domain_name);
@ -259,16 +293,11 @@
//increment counter
$x++;
}
unset($rows);
}
echo "</table>\n";
echo " </table>\n";
echo "</div>\n";
echo "<input type='hidden' name='".$token['name']."' value='".$token['hash']."'>\n";
echo "</form>\n";
}
?>