fix(user): align badge modals with reference theme
This commit is contained in:
1 parent
8e9d3a7e49
commit
1c501ff713
17 files changed
+931
-313
No files matched your search
+60
-41
@@ -372,7 +372,7 @@ class Badges {
|
||||
$owned_map = $context['owned_map'];
|
||||
$wear = $context['wear'];
|
||||
$show_private = $include_private || $is_self || $is_manager;
|
||||
$show_unearned = $show_private;
|
||||
$show_unearned = $include_private || $is_self;
|
||||
|
||||
$categories = [];
|
||||
foreach ($catalog as $cat) {
|
||||
@@ -380,6 +380,7 @@ class Badges {
|
||||
$rows = is_array($cat['items'] ?? null) ? $cat['items'] : [];
|
||||
$has_rows = [];
|
||||
$no_rows = [];
|
||||
$all_rows = [];
|
||||
foreach ($rows as $row) {
|
||||
if (!is_array($row)) {
|
||||
continue;
|
||||
@@ -402,6 +403,7 @@ class Badges {
|
||||
'time' => $has && $show_private ? (string) $owned_map[$slug] : '',
|
||||
'get_type' => sanitize_key((string) ($row['get_type'] ?? 'manually_add')),
|
||||
];
|
||||
$all_rows[] = $item;
|
||||
// Owned first within each category (legacy is-has / no-has order).
|
||||
if ($has) {
|
||||
$has_rows[] = $item;
|
||||
@@ -409,7 +411,7 @@ class Badges {
|
||||
$no_rows[] = $item;
|
||||
}
|
||||
}
|
||||
$items = array_merge($has_rows, $no_rows);
|
||||
$items = $include_private ? $all_rows : array_merge($has_rows, $no_rows);
|
||||
if (!$items) {
|
||||
continue;
|
||||
}
|
||||
@@ -453,11 +455,12 @@ class Badges {
|
||||
return isset($_REQUEST['slug']) ? sanitize_key(wp_unslash((string) $_REQUEST['slug'])) : '';
|
||||
}
|
||||
|
||||
private static function icon_html(array $item, string $class = 'img-icon medal-icon'): string {
|
||||
private static function icon_html(array $item, string $class = 'img-icon medal-icon', string $title = ''): string {
|
||||
$icon = esc_url((string) ($item['icon_url'] ?? ''));
|
||||
$label = esc_attr((string) ($item['label'] ?? __('徽章', 'aksrt')));
|
||||
if ($icon !== '') {
|
||||
return '<img src="' . $icon . '" class="' . esc_attr($class) . '" alt="' . $label . '" decoding="async">';
|
||||
$tooltip = $title !== '' ? ' data-toggle="tooltip" title="' . esc_attr($title) . '"' : '';
|
||||
return '<img src="' . $icon . '" class="' . esc_attr($class) . '" alt="' . $label . '" decoding="async"' . $tooltip . '>';
|
||||
}
|
||||
return '<span class="medal-icon medal-icon--fa"><i class="fa fas fa-trophy" aria-hidden="true"></i></span>';
|
||||
}
|
||||
@@ -472,20 +475,31 @@ class Badges {
|
||||
}
|
||||
|
||||
private static function modal_header(int $user_id, string $text): string {
|
||||
$avatar = function_exists('aksrt_get_avatar_html') ? aksrt_get_avatar_html($user_id, 42, ['class' => 'medal-modal__avatar']) : get_avatar($user_id, 42);
|
||||
return '<div class="medal-modal__head">' . $avatar . '<div class="medal-modal__title">' . $text . '</div></div>';
|
||||
$avatar = aksrt_get_avatar_box($user_id, 'avatar-img', false, false);
|
||||
return '<div class="modal-colorful-header colorful-bg c-blue">' . self::modal_close()
|
||||
. '<div class="colorful-make"></div><div class="text-center"><div class="em2x">' . $avatar
|
||||
. '</div><div class="mt10 em12 padding-w10">' . $text . '</div></div></div>';
|
||||
}
|
||||
|
||||
private static function modal_close(): string {
|
||||
return '<button type="button" class="close" data-aksrt-modal-close aria-label="' . esc_attr__('关闭', 'aksrt')
|
||||
. '"><svg class="ic-close" aria-hidden="true"><use xlink:href="#icon-close"></use></svg></button>';
|
||||
}
|
||||
|
||||
private static function modal_empty(string $text): string {
|
||||
return aksrt_get_null($text, 30, 'null-2.svg');
|
||||
}
|
||||
|
||||
private static function modal_info_html(int $user_id): string {
|
||||
$user = get_userdata($user_id);
|
||||
if (!$user) return '<div class="medal-modal__empty">' . esc_html__('用户不存在', 'aksrt') . '</div>';
|
||||
if (!self::enabled()) return '<div class="medal-modal__empty">' . esc_html__('徽章系统未启用', 'aksrt') . '</div>';
|
||||
if (!$user) return self::modal_empty(__('用户不存在', 'aksrt'));
|
||||
if (!self::enabled()) return self::modal_empty(__('徽章系统未启用', 'aksrt'));
|
||||
$data = self::list_for_user($user_id);
|
||||
$name = $user_id === get_current_user_id() ? __('我的徽章', 'aksrt') : sprintf(__('%s的徽章', 'aksrt'), $user->display_name);
|
||||
$name = '<span class="em09">' . esc_html($user_id === get_current_user_id() ? __('我的徽章', 'aksrt') : sprintf(__('%s的徽章', 'aksrt'), $user->display_name)) . '</span>';
|
||||
$wear = self::item_by_slug($data, (string) ($data['wear'] ?? ''));
|
||||
if ($wear) $name .= self::icon_html($wear, 'img-icon medal-icon ml3');
|
||||
elseif (!(int) ($data['count'] ?? 0)) $name .= '<span class="badg-sm badg c-red ml6">' . esc_html__('暂无徽章', 'aksrt') . '</span>';
|
||||
$html = '<div class="medal-modal">' . self::modal_header($user_id, '<span class="em09">' . wp_kses_post($name) . '</span>') . '<div class="mini-scrollbar scroll-y max-vh5 medal-modal__scroll">';
|
||||
if ($wear) $name .= self::icon_html($wear, 'img-icon medal-icon ml3', sprintf(__('当前佩戴:%s', 'aksrt'), $wear['label']));
|
||||
else $name .= '<span class="em09 ml6"><span class="badg-sm badg c-red">' . esc_html__('暂无徽章', 'aksrt') . '</span></span>';
|
||||
$html = '<div class="modal-body">' . self::modal_header($user_id, $name) . '<div class="mini-scrollbar scroll-y max-vh5">';
|
||||
$has = false;
|
||||
foreach ((array) ($data['categories'] ?? []) as $category) {
|
||||
$cards = '';
|
||||
@@ -494,41 +508,43 @@ class Badges {
|
||||
$has = true;
|
||||
$card = '<div class="medal-card' . (!empty($item['owned']) ? ' is-has' : ' no-has') . '">' . self::icon_html($item) . '<div class="muted-color px12 mt6">' . esc_html((string) $item['label']) . '</div></div>';
|
||||
$url = add_query_arg(['action' => 'aksrt_single_medal_info_modal', 'name' => $item['slug'], 'user_id' => $user_id], admin_url('admin-ajax.php'));
|
||||
$cards .= '<div class="medal-list"><a class="single-medal-info aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($url) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--single" data-aksrt-modal-mobile-bottom="true" data-aksrt-modal-cache="false" href="' . esc_url($url) . '">' . $card . '</a></div>';
|
||||
$cards .= '<div class="medal-list"><a class="single-medal-info aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($url) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--single" data-aksrt-modal-loading="spinner" data-aksrt-modal-swipe-close="true" data-aksrt-modal-height="201" data-aksrt-modal-new="true" data-aksrt-modal-mobile-bottom="true" data-aksrt-modal-cache="false" href="' . esc_url($url) . '">' . $card . '</a></div>';
|
||||
}
|
||||
if ($cards) $html .= '<div class="medal-cat-box muted-box mb20"><div class="mb20"><b class="medal-cat-name">' . esc_html((string) $category['cat_name']) . '</b></div><div class="medal-list-box">' . $cards . '</div></div>';
|
||||
if ($cards) $html .= '<div class="medal-cat-box muted-box mb20"><div class="mb20"><b class="medal-cat-name">' . esc_html((string) $category['cat_name']) . '</b></div><div class="medal-list-box flex at hh">' . $cards . '</div></div>';
|
||||
}
|
||||
if (!$has) $html .= '<div class="medal-modal__empty">' . esc_html__('暂无徽章', 'aksrt') . '</div>';
|
||||
if (!$has) $html .= self::modal_empty(__('暂无徽章', 'aksrt'));
|
||||
$html .= '</div>';
|
||||
$buttons = '';
|
||||
if ($user_id !== get_current_user_id()) {
|
||||
$mine = add_query_arg(['action' => 'aksrt_user_medal_info_modal', 'id' => get_current_user_id()], admin_url('admin-ajax.php'));
|
||||
$grant = add_query_arg(['action' => 'aksrt_user_medal_manually_add_modal', 'id' => $user_id], admin_url('admin-ajax.php'));
|
||||
$buttons = '';
|
||||
if (get_current_user_id()) $buttons .= '<a class="but aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($mine) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--overview" data-aksrt-modal-cache="false" href="' . esc_url($mine) . '">' . esc_html__('查看我的徽章', 'aksrt') . '</a>';
|
||||
if (self::can_manually_set()) $buttons .= '<a class="but c-blue aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($grant) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--grant" data-aksrt-modal-cache="false" href="' . esc_url($grant) . '">' . esc_html__('授予徽章', 'aksrt') . '</a>';
|
||||
if ($buttons !== '') $html .= '<div class="medal-modal__buts">' . $buttons . '</div>';
|
||||
if (get_current_user_id()) $buttons .= '<a class="but c-blue-2 aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($mine) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--overview" data-aksrt-modal-loading="spinner" data-aksrt-modal-swipe-close="true" data-aksrt-modal-height="240" data-aksrt-modal-mobile-bottom="true" data-aksrt-modal-cache="false" href="' . esc_url($mine) . '"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-medal-color"></use></svg>' . esc_html__('查看我的徽章', 'aksrt') . '</a>';
|
||||
}
|
||||
if (self::can_manually_set()) {
|
||||
$grant = add_query_arg(['action' => 'aksrt_user_medal_manually_add_modal', 'id' => $user_id], admin_url('admin-ajax.php'));
|
||||
$buttons .= '<a class="but c-green aksrt-modal-link" data-aksrt-modal="remote" data-aksrt-modal-url="' . esc_url($grant) . '" data-aksrt-modal-class="aksrt-badge-modal aksrt-badge-modal--grant" data-aksrt-modal-loading="spinner" data-aksrt-modal-swipe-close="true" data-aksrt-modal-height="240" data-aksrt-modal-mobile-bottom="true" data-aksrt-modal-cache="false" href="' . esc_url($grant) . '"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-add-ring"></use></svg>' . esc_html__('授予徽章', 'aksrt') . '</a>';
|
||||
}
|
||||
if ($buttons !== '') $html .= '<div class="modal-buts but-average">' . $buttons . '</div>';
|
||||
$html .= '</div>';
|
||||
return $html;
|
||||
}
|
||||
|
||||
private static function modal_single_html(int $user_id, string $slug): string {
|
||||
if (!$user_id || !get_userdata($user_id)) return '<div class="medal-modal__empty">' . esc_html__('用户不存在', 'aksrt') . '</div>';
|
||||
if (!self::enabled()) return '<div class="medal-modal__empty">' . esc_html__('徽章系统未启用', 'aksrt') . '</div>';
|
||||
if (!$user_id || !get_userdata($user_id)) return self::modal_empty(__('用户不存在', 'aksrt'));
|
||||
if (!self::enabled()) return self::modal_empty(__('徽章系统未启用', 'aksrt'));
|
||||
$data = self::list_for_user($user_id);
|
||||
$item = self::item_by_slug($data, $slug);
|
||||
if (!$item) return '<div class="medal-modal__empty">' . esc_html__('参数传入错误或没有此徽章', 'aksrt') . '</div>';
|
||||
if (!$item) return self::modal_empty(__('参数传入错误或没有此徽章', 'aksrt'));
|
||||
$state = '';
|
||||
if (!empty($item['owned']) && !empty($item['time'])) $state = '<div class="c-blue px12 mt10">' . esc_html(sprintf(__('%s 获得', 'aksrt'), $item['time'])) . '</div>';
|
||||
elseif (empty($item['owned'])) $state = '<div class="c-yellow px12 mt20">' . esc_html__('暂未获得', 'aksrt') . '</div>';
|
||||
$html = '<div class="medal-modal medal-modal--single"><div class="medal-single-card"><div class="medal-single-bg"><img src="' . esc_url(get_theme_file_uri('/assets/img/medal/medal-background.svg')) . '" alt=""></div><div class="relative">' . self::icon_html($item) . '<div class="mt20">' . esc_html($item['label']) . '</div><div class="muted-2-color px12 mt10">' . esc_html($item['desc']) . '</div>' . $state . '</div></div>';
|
||||
if ($user_id === get_current_user_id()) {
|
||||
if (!empty($item['owned']) && !empty($item['time'])) $state = '<div class="c-blue px12 mt10">' . esc_html(sprintf(__('%s 获得', 'aksrt'), $item['time'])) . '</div>';
|
||||
elseif (empty($item['owned'])) $state = '<div class="c-yellow px12 mt20">' . esc_html__('暂未获得', 'aksrt') . '</div>';
|
||||
}
|
||||
$html = '<div class="modal-body">' . self::modal_close() . '<div class="box-body medal-card mb20 mt20 medal-single-card relative"><div class="medal-single-bg"><img class="fit-cover" src="' . esc_url(get_theme_file_uri('/assets/img/medal/medal-background.svg')) . '" alt=""></div><div class="relative">' . self::icon_html($item) . '<div class="mt20">' . esc_html($item['label']) . '</div><div class="muted-2-color px12 mt10">' . esc_html($item['desc']) . '</div>' . $state . '</div></div>';
|
||||
if ($user_id === get_current_user_id() && !empty($item['owned'])) {
|
||||
if (!empty($item['wear'])) $html .= '<div class="box-body"><span class="badg btn-block c-blue">' . esc_html__('当前佩戴此徽章', 'aksrt') . '</span></div>';
|
||||
else $html .= '<div class="box-body"><a href="javascript:;" class="but btn-block radius jb-blue aksrt-badge-action" data-aksrt-badge-action="wear" data-slug="' . esc_attr($slug) . '">' . esc_html__('佩戴此徽章', 'aksrt') . '</a></div>';
|
||||
} elseif ($user_id !== get_current_user_id() && self::can_manually_set() && !empty($item['owned'])) {
|
||||
} elseif ($user_id !== get_current_user_id() && self::can_manually_set() && !empty($item['owned']) && ($item['get_type'] ?? '') === 'manually_add') {
|
||||
$html .= '<div class="box-body"><a href="javascript:;" class="but btn-block radius c-red aksrt-badge-action" data-aksrt-badge-action="revoke" data-user-id="' . (int) $user_id . '" data-slug="' . esc_attr($slug) . '">' . esc_html__('收回此徽章', 'aksrt') . '</a></div>';
|
||||
} elseif ($user_id !== get_current_user_id() && self::can_manually_set() && empty($item['owned']) && (($item['get_type'] ?? '') === 'manually_add')) {
|
||||
$html .= '<div class="box-body"><a href="javascript:;" class="but btn-block radius c-blue aksrt-badge-action" data-aksrt-badge-action="grant" data-user-id="' . (int) $user_id . '" data-slug="' . esc_attr($slug) . '">' . esc_html__('授予此徽章', 'aksrt') . '</a></div>';
|
||||
}
|
||||
return $html . '</div>';
|
||||
}
|
||||
@@ -536,12 +552,16 @@ class Badges {
|
||||
public function ajax_info_modal(): void { echo self::modal_info_html(self::ajax_user_id()); exit; }
|
||||
public function ajax_single_modal(): void { echo self::modal_single_html(absint($_REQUEST['user_id'] ?? 0), sanitize_key(wp_unslash((string) ($_REQUEST['name'] ?? '')))); exit; }
|
||||
public function ajax_grant_modal(): void {
|
||||
$user_id = self::ajax_user_id();
|
||||
if (!$user_id || !get_userdata($user_id)) { echo '<div class="medal-modal__empty">' . esc_html__('用户不存在', 'aksrt') . '</div>'; exit; }
|
||||
if (!self::enabled()) { echo '<div class="medal-modal__empty">' . esc_html__('徽章系统未启用', 'aksrt') . '</div>'; exit; }
|
||||
if (!self::can_manually_set()) { echo '<div class="medal-modal__empty">' . esc_html__('您没有此权限', 'aksrt') . '</div>'; exit; }
|
||||
echo self::modal_grant_html(self::ajax_user_id());
|
||||
exit;
|
||||
}
|
||||
|
||||
private static function modal_grant_html(int $user_id): string {
|
||||
if (!$user_id || !get_userdata($user_id)) return self::modal_empty(__('用户不存在', 'aksrt'));
|
||||
if (!self::enabled()) return self::modal_empty(__('徽章系统未启用', 'aksrt'));
|
||||
if (!self::can_manually_set()) return self::modal_empty(__('您没有此权限', 'aksrt'));
|
||||
$data = self::list_for_user($user_id, true);
|
||||
$html = '<div class="medal-modal">' . self::modal_header($user_id, '<span class="em09">' . sprintf(__('为%s授予新的徽章', 'aksrt'), esc_html(get_the_author_meta('display_name', $user_id))) . '</span>') . '<div class="mini-scrollbar scroll-y max-vh5 medal-modal__scroll">';
|
||||
$html = '<div class="modal-body">' . self::modal_header($user_id, '<span class="em09">' . sprintf(__('为%s授予新的徽章', 'aksrt'), '<span class="focus-color">' . esc_html(get_the_author_meta('display_name', $user_id)) . '</span>') . '</span>') . '<div class="mini-scrollbar scroll-y max-vh5">';
|
||||
$has = false;
|
||||
foreach ((array) ($data['categories'] ?? []) as $category) {
|
||||
$cards = '';
|
||||
@@ -550,13 +570,12 @@ class Badges {
|
||||
$has = true;
|
||||
$action = !empty($item['owned']) ? 'revoke' : 'grant';
|
||||
$label = $action === 'revoke' ? __('收回', 'aksrt') : __('授予', 'aksrt');
|
||||
$cards .= '<div class="medal-grant-item"><div class="medal-card">' . self::icon_html($item) . '<div class="mt6 em09">' . esc_html($item['label']) . '</div><div class="muted-2-color px12 mt6">' . esc_html($item['desc']) . '</div></div><a href="javascript:;" class="but btn-block radius px12 c-' . ($action === 'revoke' ? 'red' : 'blue') . ' mt6 aksrt-badge-action" data-aksrt-badge-action="' . esc_attr($action) . '" data-user-id="' . (int) $user_id . '" data-slug="' . esc_attr($item['slug']) . '">' . esc_html($label) . '</a></div>';
|
||||
$cards .= '<div class="medal-list flex xx jsb"><div class="medal-card">' . self::icon_html($item) . '<div class="mt6 em09">' . esc_html($item['label']) . '</div><div class="muted-2-color px12 mt6">' . esc_html($item['desc']) . '</div></div><a href="javascript:;" class="but btn-block radius px12 c-' . ($action === 'revoke' ? 'red' : 'blue') . ' mt6 aksrt-badge-action" data-aksrt-badge-action="' . esc_attr($action) . '" data-user-id="' . (int) $user_id . '" data-slug="' . esc_attr($item['slug']) . '">' . esc_html($label) . '</a></div>';
|
||||
}
|
||||
if ($cards) $html .= '<div class="medal-cat-box muted-box mb20"><div class="mb20"><b class="medal-cat-name">' . esc_html($category['cat_name']) . '</b></div><div class="medal-list-box medal-list-box--grant">' . $cards . '</div></div>';
|
||||
if ($cards) $html .= '<div class="medal-cat-box muted-box mb20"><div class="mb20"><b class="medal-cat-name">' . esc_html($category['cat_name']) . '</b></div><div class="medal-list-box flex hh">' . $cards . '</div></div>';
|
||||
}
|
||||
if (!$has) $html .= '<div class="medal-modal__empty">' . esc_html__('暂无可授予的徽章', 'aksrt') . '</div>';
|
||||
echo $html . '</div></div>';
|
||||
exit;
|
||||
if (!$has) $html .= self::modal_empty(__('暂无可授予的徽章', 'aksrt'));
|
||||
return $html . '</div></div>';
|
||||
}
|
||||
|
||||
private function ajax_mutation(string $operation): void {
|
||||
@@ -573,8 +592,8 @@ class Badges {
|
||||
if ($operation === 'revoke' && empty($item['owned'])) self::ajax_error(__('用户未获得该徽章', 'aksrt'));
|
||||
$result = $operation === 'wear' ? self::wear($user_id, $slug) : ($operation === 'grant' ? self::grant($user_id, $slug, get_current_user_id()) : self::revoke($user_id, $slug, get_current_user_id()));
|
||||
if (is_wp_error($result)) self::ajax_error($result->get_error_message());
|
||||
$message = ['wear' => __('已佩戴徽章', 'aksrt'), 'grant' => __('已授予徽章', 'aksrt'), 'revoke' => __('已收回徽章', 'aksrt')][$operation];
|
||||
wp_send_json_success(['message' => $message, 'reload' => true]);
|
||||
$message = sprintf(['wear' => __('已佩戴徽章【%s】', 'aksrt'), 'grant' => __('已授予徽章【%s】', 'aksrt'), 'revoke' => __('已收回徽章【%s】', 'aksrt')][$operation], esc_html($item['label']));
|
||||
wp_send_json_success(['message' => $message]);
|
||||
}
|
||||
public function ajax_wear(): void { $this->ajax_mutation('wear'); }
|
||||
public function ajax_grant(): void { $this->ajax_mutation('grant'); }
|
||||
|
||||
Reference in new issue
Block a user