Include Api Token and QR code mockup

This commit is contained in:
Jose Gonzalez 2023-02-16 12:44:11 +01:00
parent d8230dba94
commit 5dc8e19d6d
3 changed files with 84 additions and 37 deletions

View File

@ -1020,48 +1020,49 @@ if (!$new_user) {
$user_id .= '<span>'.$id.'</span>'; $user_id .= '<span>'.$id.'</span>';
$user_id .= html_print_input_hidden('id_user', $id, true); $user_id .= html_print_input_hidden('id_user', $id, true);
$user_id .= '</div>'; $user_id .= '</div>';
$user_id .= '<div class="label_select_simple"><p class="edit_user_labels">'.__('API Token').'</p>';
$user_id .= html_print_anchor( $apiTokenContentElements[] = '<span style="height: 15px;font-size: 14px;">'.__('API Token').'</span>';
[ $apiTokenContentElements[] = html_print_button(
'onClick' => sprintf( __('Renew'),
'renew_api_token',
false,
sprintf(
'javascript:renewAPIToken(\'%s\', \'%s\', \'%s\')', 'javascript:renewAPIToken(\'%s\', \'%s\', \'%s\')',
__('Warning'), __('Warning'),
__('The API token will be renewed. After this action, the last token you were using will not work. Are you sure?'), __('The API token will be renewed. After this action, the last token you were using will not work. Are you sure?'),
'user_profile_form', 'user_profile_form',
), ),
'content' => html_print_image(
'images/icono-refrescar.png',
true,
[ [
'class' => 'renew_api_token_image clickable', 'mode' => 'link',
'title' => __('Renew API Token'), 'style' => 'min-width: initial;',
]
),
'class' => 'renew_api_token_link',
], ],
true true,
); );
$apiTokenContentElements[] = html_print_button(
$user_id .= html_print_anchor( __('Show'),
[ 'show_api_token',
'onClick' => sprintf( false,
sprintf(
'javascript:showAPIToken(\'%s\', \'%s\')', 'javascript:showAPIToken(\'%s\', \'%s\')',
__('API Token'), __('API Token'),
base64_encode(__('Your API Token is:').'&nbsp;<br><span class="font_12pt bolder">'.users_get_API_token($id).'</span><br>&nbsp;'.__('Please, avoid share this string with others.')), base64_encode(__('Your API Token is:').'&nbsp;<br><span class="font_12pt bolder">'.users_get_API_token($id).'</span><br>&nbsp;'.__('Please, avoid share this string with others.')),
), ),
'content' => html_print_image(
'images/eye_show.png',
true,
[ [
'class' => 'renew_api_token_image clickable', 'mode' => 'link',
'title' => __('Show API Token'), 'style' => 'min-width: initial;',
] ],
), true,
'class' => 'renew_api_token_link', );
$apiTokenContent = html_print_div(
[
'class' => 'flex-row-center',
'content' => implode('', $apiTokenContentElements),
], ],
true true
); );
$user_id .= '</div>';
$user_id .= $apiTokenContent;
} else { } else {
$user_id = '<div class="label_select_simple">'.html_print_input_text_extended( $user_id = '<div class="label_select_simple">'.html_print_input_text_extended(
'id_user', 'id_user',

View File

@ -703,6 +703,34 @@ $userManagementTable->data['fields_addSettings'][1] .= html_print_div(
true true
); );
$contentQrCode = [];
$contentQrCode[] = html_print_image(
'images/example_qr.png',
true,
[
'width' => '200px',
'height' => '200px',
]
);
$contentQrCode[] = '<span class="input_sub_placeholder input_sub_placeholder_qrcode">'.__('Generated automatically with the information provided for the user').'</span>';
$qrCode = html_print_div(
[
'style' => 'display: flex;flex-direction: column;align-items: center;',
'content' => implode('', $contentQrCode),
],
true
);
// QR Code and API Token advice.
html_print_div(
[
'id' => 'api_qrcode_display',
'content' => $qrCode.$apiTokenContent,
]
);
html_print_table($userManagementTable); html_print_table($userManagementTable);
// User Profile definition table. (Only where user is not creating). // User Profile definition table. (Only where user is not creating).
if ($new_user === false && ((bool) check_acl($config['id_user'], 0, 'UM') === true)) { if ($new_user === false && ((bool) check_acl($config['id_user'], 0, 'UM') === true)) {

View File

@ -11173,3 +11173,21 @@ form#satellite_conf_edit > fieldset.full-column {
#principal_action_buttons .select2-container { #principal_action_buttons .select2-container {
z-index: 50; z-index: 50;
} }
#api_qrcode_display {
width: 300px;
height: 300px;
position: absolute;
left: 660px;
top: 130px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
}
.input_sub_placeholder.input_sub_placeholder_qrcode {
font-size: 13px;
text-align: center;
width: 70%;
}