修复了一些问题

assets/admin/src/components/form/AksField.vue

@@ -215,6 +215,14 @@
       @update:model-value="emit('update:modelValue', $event)"
     />
 
+    <!-- WordPress image gallery (attachment ID array) -->
+    <AksGalleryField
+      v-else-if="schema.type === 'gallery'"
+      :model-value="Array.isArray(modelValue) ? modelValue : []"
+      :title="schema.label || '选择图片'"
+      @update:model-value="emit('update:modelValue', $event)"
+    />
+
     <!-- Slider -->
     <n-slider
       v-else-if="schema.type === 'slider'"
@@ -603,12 +611,13 @@
  * AksField — renders a single form field based on its schema definition.
  *
  * Supported types: switch, input/text, textarea, number, select, radio,
- * checkbox, color, icon, media, slider, code, alert, fieldset, repeater (inline|list-modal), custom (slot).
+ * checkbox, color, icon, media, gallery, slider, code, alert, fieldset, repeater (inline|list-modal), custom (slot).
  */
 import { computed, ref, onMounted, watch } from 'vue'
 import FaIcon from './FaIcon.vue'
 import FaIconPicker from './FaIconPicker.vue'
 import AksMediaField from './AksMediaField.vue'
+import AksGalleryField from './AksGalleryField.vue'
 import AksCodeEditor from './AksCodeEditor.vue'
 import api from '@/api'
 

assets/admin/src/components/form/AksGalleryField.vue

@@ -0,0 +1,234 @@
+<template>
+  <div class="aksrt-gallery-field">
+    <div v-if="attachmentIds.length" class="aksrt-gallery-field__grid">
+      <article
+        v-for="(attachmentId, index) in attachmentIds"
+        :key="attachmentId"
+        class="aksrt-gallery-field__item"
+      >
+        <img
+          v-if="previews[attachmentId]?.url"
+          :src="previews[attachmentId].url"
+          :alt="previews[attachmentId].alt || `附件 ${attachmentId}`"
+          class="aksrt-gallery-field__image"
+        />
+        <div v-else class="aksrt-gallery-field__placeholder">
+          <FaIcon icon="fa fas fa-image" :size="22" />
+          <span>#{{ attachmentId }}</span>
+        </div>
+
+        <div class="aksrt-gallery-field__actions">
+          <n-button
+            size="tiny"
+            quaternary
+            :disabled="index === 0"
+            aria-label="向前移动"
+            @click="move(index, -1)"
+          >
+            <FaIcon icon="fa fas fa-arrow-left" />
+          </n-button>
+          <n-button
+            size="tiny"
+            quaternary
+            :disabled="index === attachmentIds.length - 1"
+            aria-label="向后移动"
+            @click="move(index, 1)"
+          >
+            <FaIcon icon="fa fas fa-arrow-right" />
+          </n-button>
+          <n-button
+            size="tiny"
+            quaternary
+            type="error"
+            aria-label="移除图片"
+            @click="remove(attachmentId)"
+          >
+            <FaIcon icon="fa fas fa-trash-alt" />
+          </n-button>
+        </div>
+      </article>
+    </div>
+
+    <div v-else class="aksrt-gallery-field__empty">
+      <FaIcon icon="fa fas fa-images" :size="28" />
+      <span>尚未选择图片</span>
+    </div>
+
+    <div class="aksrt-gallery-field__buttons">
+      <n-button type="primary" secondary @click="openMediaLibrary">
+        <FaIcon icon="fa fas fa-plus" />
+        {{ attachmentIds.length ? '编辑图片' : '选择图片' }}
+      </n-button>
+      <n-button v-if="attachmentIds.length" type="error" quaternary @click="clear">
+        清空图片
+      </n-button>
+    </div>
+
+    <p v-if="mediaError" class="aksrt-gallery-field__error">{{ mediaError }}</p>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref, watch } from 'vue'
+import FaIcon from './FaIcon.vue'
+
+const props = defineProps({
+  modelValue: { type: Array, default: () => [] },
+  title: { type: String, default: '选择图片' },
+})
+
+const emit = defineEmits(['update:modelValue'])
+const previews = ref({})
+const mediaError = ref('')
+let previewRequest = 0
+
+const attachmentIds = computed(() => {
+  const seen = new Set()
+  return props.modelValue
+    .map(value => Number.parseInt(value, 10))
+    .filter(value => value > 0 && !seen.has(value) && seen.add(value))
+})
+
+function update(ids) {
+  emit('update:modelValue', [...ids])
+}
+
+function move(index, direction) {
+  const ids = [...attachmentIds.value]
+  const target = index + direction
+  if (target < 0 || target >= ids.length) return
+  ;[ids[index], ids[target]] = [ids[target], ids[index]]
+  update(ids)
+}
+
+function remove(attachmentId) {
+  update(attachmentIds.value.filter(id => id !== attachmentId))
+}
+
+function clear() {
+  update([])
+}
+
+async function hydratePreviews() {
+  const request = ++previewRequest
+  const media = window.wp?.media
+  if (!media) return
+
+  const entries = await Promise.all(attachmentIds.value.map(async attachmentId => {
+    const attachment = media.attachment(attachmentId)
+    try {
+      if (!attachment.get('url')) await attachment.fetch()
+    } catch (error) {
+      return [attachmentId, null]
+    }
+
+    const sizes = attachment.get('sizes') || {}
+    return [attachmentId, {
+      url: sizes.thumbnail?.url || sizes.medium?.url || attachment.get('url') || '',
+      alt: attachment.get('alt') || attachment.get('title') || '',
+    }]
+  }))
+
+  if (request === previewRequest) {
+    previews.value = Object.fromEntries(entries.filter(([, preview]) => preview))
+  }
+}
+
+function openMediaLibrary() {
+  const media = window.wp?.media
+  if (!media) {
+    mediaError.value = '当前后台未加载 WordPress 媒体库。'
+    return
+  }
+
+  mediaError.value = ''
+  const frame = media({
+    title: props.title,
+    button: { text: '使用所选图片' },
+    library: { type: 'image' },
+    multiple: true,
+  })
+
+  frame.on('open', () => {
+    const selection = frame.state().get('selection')
+    attachmentIds.value.forEach(attachmentId => {
+      const attachment = media.attachment(attachmentId)
+      attachment.fetch()
+      selection.add(attachment)
+    })
+  })
+
+  frame.on('select', () => {
+    const ids = frame.state().get('selection').toJSON()
+      .map(attachment => Number.parseInt(attachment.id, 10))
+      .filter(attachmentId => attachmentId > 0)
+    update([...new Set(ids)])
+  })
+
+  frame.open()
+}
+
+watch(attachmentIds, hydratePreviews, { immediate: true })
+</script>
+
+<style scoped>
+.aksrt-gallery-field__grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
+  gap: 10px;
+}
+
+.aksrt-gallery-field__item {
+  overflow: hidden;
+  border: 1px solid var(--aksrt-color-border);
+  border-radius: 8px;
+  background: var(--aksrt-color-canvas);
+}
+
+.aksrt-gallery-field__image,
+.aksrt-gallery-field__placeholder {
+  display: flex;
+  width: 100%;
+  aspect-ratio: 4 / 3;
+  align-items: center;
+  justify-content: center;
+  object-fit: cover;
+}
+
+.aksrt-gallery-field__placeholder {
+  flex-direction: column;
+  gap: 4px;
+  color: var(--aksrt-color-muted);
+}
+
+.aksrt-gallery-field__actions {
+  display: flex;
+  justify-content: center;
+  padding: 4px;
+  border-top: 1px solid var(--aksrt-color-border);
+}
+
+.aksrt-gallery-field__empty {
+  display: flex;
+  min-height: 116px;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  gap: 8px;
+  border: 1px dashed var(--aksrt-color-border-strong);
+  border-radius: 8px;
+  color: var(--aksrt-color-muted);
+}
+
+.aksrt-gallery-field__buttons {
+  display: flex;
+  gap: 8px;
+  margin-top: 10px;
+}
+
+.aksrt-gallery-field__error {
+  margin: 8px 0 0;
+  color: #d03050;
+  font-size: 12px;
+}
+</style>

assets/css/routes/sign.css

@@ -89,7 +89,8 @@
 #u_sign.has-sign-img .modal-dialog { width: 800px; }
 #u_sign .modal-content { position: relative; min-height: 300px; max-height: calc(100vh - 36px); overflow-x: hidden; overflow-y: auto; border: 0; border-radius: 8px; background: var(--main-bg-color, #fff); box-shadow: 0 12px 50px rgba(0, 0, 0, .22); }
 .auth-modal-close { position: absolute; top: 13px; right: 15px; z-index: 4; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .04); color: var(--muted-color, #777); cursor: pointer; }
-.sign-img { position: absolute; inset: 0 55% 0 0; background-position: center; background-size: cover; }
+.sign-img { position: absolute; inset: 0 55% 0 0; overflow: hidden; }
+.sign-img img { display: block; width: 100%; height: 100%; border-radius: 8px 0 0 8px; object-fit: cover; }
 .sign-img + .sign { max-width: unset; margin-left: 55%; padding: 34px 44px; }
 
 .page-template-user-sign { min-height: 100vh; background: var(--body-bg-color, #f5f6f7); }

src/Admin/ControllerBase.php

@@ -92,6 +92,10 @@ abstract class ControllerBase {
                 case 'array':
                     $out[$key] = is_array($val) ? $val : [];
                     break;
+				case 'attachment_ids':
+					$ids = is_array($val) ? array_filter(array_map('absint', $val)) : [];
+					$out[$key] = array_values(array_unique($ids));
+					break;
                 default:
                     $out[$key] = sanitize_text_field($val);
             }

src/Admin/SchemaProvider.php

@@ -443,6 +443,12 @@ class SchemaProvider {
 
     private function sanitize_value($value, string $type) {
         switch ($type) {
+			case 'attachment_ids':
+				if (!is_array($value)) {
+					return [];
+				}
+				$ids = array_values(array_filter(array_map('absint', $value)));
+				return array_values(array_unique($ids));
             case 'html':
                 return wp_kses_post((string) $value);
             case 'textarea':
@@ -488,6 +494,10 @@ class SchemaProvider {
 			return $this->sanitize_value($value, $sanitize_type);
 		}
 
+		if ($type === 'gallery') {
+			return $this->sanitize_value($value, 'attachment_ids');
+		}
+
 		if (in_array($type, ['fieldset', 'accordion'], true)) {
 			return $this->sanitize_object_fields($value, (array) ($field['fields'] ?? []));
 		}
@@ -658,6 +668,7 @@ class SchemaProvider {
             'icon'     => 'string',
             'media'    => 'url',
 			'upload'   => 'url',
+			'gallery'  => 'attachment_ids',
             'code'     => 'code',
         ];
 

src/Settings/AuthReader.php

@@ -86,7 +86,7 @@ trait AuthReader {
             $theme_mode = 'no';
         }
         return [
-            'background'   => self::get_value('sign_page_background', []),
+            'background'   => self::auth_gallery_ids('sign_page_background'),
             'theme_mode'   => $theme_mode,
             'show_header'  => (bool) self::get_value('sign_show_header', true),
             'card_position' => in_array((string) self::get_value('sign_card_position', 'right'), ['left', 'center', 'right'], true)
@@ -99,16 +99,27 @@ trait AuthReader {
     /** 弹窗 UI 配置数组 */
     public static function modal_ui(): array {
         return [
-            'background' => self::get_value('sign_modal_background', []),
+            'background' => self::auth_gallery_ids('sign_modal_background'),
             'show_logo'  => (bool) self::get_value('sign_modal_show_logo', false),
         ];
     }
 
+	/** 认证图片库的唯一存储格式：正整数附件 ID 数组。 */
+	private static function auth_gallery_ids(string $key): array {
+		$value = self::get_value($key, []);
+		if (!is_array($value)) {
+			return [];
+		}
+
+		$ids = array_values(array_filter(array_map('absint', $value)));
+		return array_values(array_unique($ids));
+	}
+
     /** 登录框日间 LOGO URL（空时回退全局 logo_url） */
     public static function user_logo_url(): string {
-        $ids = self::get_value('user_logo', []);
+        $ids = self::auth_gallery_ids('user_logo');
-        if (is_array($ids) && !empty($ids)) {
+        if ($ids) {
-            $url = wp_get_attachment_url((int) $ids[0]);
+            $url = wp_get_attachment_image_url($ids[0], 'full');
             if ($url) return $url;
         }
         return self::logo_url();
@@ -116,9 +127,9 @@ trait AuthReader {
 
     /** 登录框夜间 LOGO URL（空时回退全局 logo_dark_url） */
     public static function user_logo_dark_url(): string {
-        $ids = self::get_value('user_logo_dark', []);
+        $ids = self::auth_gallery_ids('user_logo_dark');
-        if (is_array($ids) && !empty($ids)) {
+        if ($ids) {
-            $url = wp_get_attachment_url((int) $ids[0]);
+            $url = wp_get_attachment_image_url($ids[0], 'full');
             if ($url) return $url;
         }
         return self::logo_dark_url();

templates/pages/page-sign.php

@@ -34,10 +34,8 @@ remove_action('wp_footer', 'aksrt_render_footer_tabbar', 20);
 remove_action('wp_footer', 'aksrt_render_float_buttons', 30);
 $ui = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::sign_page_ui() : [];
 $images = $ui['background'] ?? [];
-if (is_string($images)) {
+$background_id = $images ? (int) $images[array_rand($images)] : 0;
-	$images = array_filter(array_map('absint', explode(',', $images)));
+$background_url = $background_id > 0 ? (string) wp_get_attachment_image_url($background_id, 'full') : '';
-}
-$background_url = is_array($images) && $images ? (string) wp_get_attachment_url((int) $images[array_rand($images)]) : '';
 $theme_mode = (string) ($ui['theme_mode'] ?? 'no');
 $position = (string) ($ui['card_position'] ?? 'right');
 $aksrt_auth_context = [
@@ -59,7 +57,7 @@ $aksrt_auth_context = [
 </head>
 <body <?php body_class('page-template-user-sign ' . ($theme_mode !== 'no' ? $theme_mode : '')); ?>>
 	<?php wp_body_open(); ?>
-	<div class="sign-page-background"<?php echo $background_url !== '' ? ' style="background-image:url(\'' . esc_url($background_url) . '\')"' : ''; ?>></div>
+	<?php if ($background_url !== '') : ?><div class="sign-page-background" style="background-image:url('<?php echo esc_url($background_url); ?>')"></div><?php endif; ?>
 	<?php if (!empty($ui['show_header']) && !$interim) : ?><header class="sign-topbar"><a href="<?php echo esc_url(home_url('/')); ?>"><?php echo esc_html(get_bloginfo('name')); ?></a><a href="<?php echo esc_url(home_url('/')); ?>"><?php esc_html_e('返回首页', 'aksrt'); ?></a></header><?php endif; ?>
 	<main class="sign-page sign-card-position-<?php echo esc_attr($position); ?>">
 		<div class="sign-page-card">

templates/parts/modal-auth.php

@@ -13,13 +13,13 @@ if (is_user_logged_in() || (class_exists('\AKSRT\Settings\Settings') && \AKSRT\S
 
 $modal_ui = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::modal_ui() : [];
 $images = $modal_ui['background'] ?? [];
-if (is_string($images)) {
+$image_id = $images ? (int) $images[array_rand($images)] : 0;
-	$images = array_filter(array_map('absint', explode(',', $images)));
+$image_html = $image_id > 0 ? wp_get_attachment_image($image_id, 'full', false, [
-}
+	'class'    => 'fit-cover radius8',
-$image_url = '';
+	'alt'      => get_bloginfo('name'),
-if (is_array($images) && $images) {
+	'loading'  => 'lazy',
-	$image_url = (string) wp_get_attachment_url((int) $images[array_rand($images)]);
+	'decoding' => 'async',
-}
+]) : '';
 $auto = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::sign_modal_auto() : ['enabled' => false, 'waiting' => 5, 'expires' => 1];
 $wechat = class_exists('\AKSRT\Settings\Settings') ? \AKSRT\Settings\Settings::get_weixingzh_settings() : [];
 $initial_tab = !empty($wechat['priority']) && class_exists('\AKSRT\Auth\WeixinGzh') && \AKSRT\Auth\WeixinGzh::is_enabled() ? 'oauth' : 'signin';
@@ -30,12 +30,12 @@ $aksrt_auth_context = [
 	'redirect_to' => home_url('/'),
 ];
 ?>
-<div id="u_sign" class="aksrt-auth-modal<?php echo $image_url !== '' ? ' has-sign-img' : ''; ?>" aria-hidden="true" role="dialog" aria-modal="true" data-auth-modal data-auto="<?php echo !empty($auto['enabled']) ? '1' : '0'; ?>" data-auto-wait="<?php echo esc_attr((string) $auto['waiting']); ?>" data-auto-expires="<?php echo esc_attr((string) $auto['expires']); ?>">
+<div id="u_sign" class="aksrt-auth-modal<?php echo $image_html !== '' ? ' has-sign-img' : ''; ?>" aria-hidden="true" role="dialog" aria-modal="true" data-auth-modal data-auto="<?php echo !empty($auto['enabled']) ? '1' : '0'; ?>" data-auto-wait="<?php echo esc_attr((string) $auto['waiting']); ?>" data-auto-expires="<?php echo esc_attr((string) $auto['expires']); ?>">
 	<div class="auth-modal-backdrop" data-auth-close></div>
 	<div class="modal-dialog">
 		<div class="modal-content">
 			<button type="button" class="auth-modal-close" data-auth-close aria-label="<?php esc_attr_e('关闭', 'aksrt'); ?>"><i class="fa fas fa-times"></i></button>
-			<?php if ($image_url !== '') : ?><div class="sign-img" style="background-image:url('<?php echo esc_url($image_url); ?>')"></div><?php endif; ?>
+			<?php if ($image_html !== '') : ?><div class="sign-img"><?php echo $image_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></div><?php endif; ?>
 			<?php require get_template_directory() . '/templates/parts/auth-content.php'; ?>
 		</div>
 	</div>

tests/widget-system/auth-source-contract.test.cjs

@@ -52,6 +52,30 @@ test('authentication settings use reference defaults and canonical keys', () =>
   assert.doesNotMatch(all, /user_close_login|user_close_signup|nopas_first|password_first|nopas_only|referral_registration_enabled|referral_register_field/);
 });
 
+test('authentication galleries save attachment IDs and are consumed by both surfaces', () => {
+  const field = read('assets/admin/src/components/form/AksField.vue');
+  const gallery = read('assets/admin/src/components/form/AksGalleryField.vue');
+  const provider = read('src/Admin/SchemaProvider.php');
+  const reader = read('src/Settings/AuthReader.php');
+  const modal = read('templates/parts/modal-auth.php');
+  const page = read('templates/pages/page-sign.php');
+  const css = read('assets/css/routes/sign.css');
+
+  assert.match(field, /<AksGalleryField[\s\S]*?schema\.type === 'gallery'/);
+  assert.match(gallery, /multiple:\s*true/);
+  assert.match(gallery, /Number\.parseInt\(attachment\.id/);
+  assert.match(provider, /'gallery'\s*=>\s*'attachment_ids'/);
+  assert.match(provider, /case 'attachment_ids':[\s\S]*?array_map\('absint'/);
+  assert.match(reader, /auth_gallery_ids\('sign_modal_background'\)/);
+  assert.match(reader, /auth_gallery_ids\('sign_page_background'\)/);
+  assert.match(modal, /wp_get_attachment_image\(\$image_id, 'full'/);
+  assert.match(modal, /<div class="sign-img"><\?php echo \$image_html/);
+  assert.match(page, /wp_get_attachment_image_url\(\$background_id, 'full'\)/);
+  assert.match(page, /<div class="sign-page-background" style="background-image:url/);
+  assert.match(css, /\.sign-img img\s*\{[\s\S]*?object-fit:\s*cover/);
+  assert.doesNotMatch(modal + page, /is_string\(\$images\)|explode\(',', \$images\)/);
+});
+
 test('only the shared authentication REST routes and /sign/ renderer are registered', () => {
   const controller = read('src/Admin/UserController.php');
   const router = read('src/Auth/Router.php');