@skopon-cool/form-sdk 0.6.0 → 0.6.2

package/src/catalog/skoponResumeSelect.tsx

@@ -1,16 +1,26 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { Avatar, Button, Spin, Tag, Typography } from 'antd'
-import { FileImageOutlined, ReloadOutlined, UserOutlined } from '@ant-design/icons'
+import { CaretRightOutlined, FileImageOutlined, ReloadOutlined, UserOutlined } from '@ant-design/icons'
 import type { ComponentContext } from '@a2ui/web_core/v0_9'
 import { createBinderlessComponentImplementation } from '@a2ui/react/v0_9'
 import { z } from 'zod'
-import type { FormResumeFilter } from '../types/index'
+import type { FormContentFilter, FormResumeFilter } from '../types/index'
+import type { ContentSearchItem } from './contentSearchContext'
+import { useContentSearch } from './contentSearchContext'
+import {
+  advanceCursor,
+  nextPageForWindow,
+  normalizeDisplayCount,
+  pairKey,
+  takeWindow,
+  windowIndexes,
+  type PageCacheSnapshot,
+} from './pairResumeContent'
 import { useFormLiveOptions } from '../runtime/formLiveOptionsContext'
 import { useA2uiPreviewMode } from './a2uiPreviewContext'
 import { asStringArray, clampStringArraySelection, isCardSelectionDisabled, readOptionalSelectCount, toggleStringArraySelection, useSkoponBoundField } from './useSkoponBoundField'
 import {
   type ResumeSearchItem,
-  type ResumeSearchWorkItem,
   useResumeSearch,
 } from './resumeSearchContext'
 
@@ -18,24 +28,29 @@ function readString(value: unknown): string {
   return typeof value === 'string' ? value : ''
 }
 
+function readStringList(raw: unknown): string[] {
+  return Array.isArray(raw) ? raw.map(String).filter(Boolean) : []
+}
+
 function readResumeFilter(raw: unknown): FormResumeFilter {
   if (!raw || typeof raw !== 'object') {
-    return { names: [], agentUniqueIds: [], resumeUniqueIds: [], pageSize: 20 }
+    return { names: [], agentUniqueIds: [], tagUniqueIds: [], resumeUniqueIds: [], pageSize: 20 }
   }
   const rec = raw as Record<string, unknown>
-  const names = Array.isArray(rec.names) ? rec.names.map(String).filter(Boolean) : []
-  const agentUniqueIds = Array.isArray(rec.agentUniqueIds)
-    ? rec.agentUniqueIds.map(String).filter(Boolean)
-    : []
-  const resumeUniqueIds = Array.isArray(rec.resumeUniqueIds)
-    ? rec.resumeUniqueIds.map(String).filter(Boolean)
-    : []
+  const agentKind = typeof rec.agentKind === 'string' ? rec.agentKind.trim() : ''
   const pageSizeRaw = typeof rec.pageSize === 'number' ? rec.pageSize : Number(rec.pageSize)
   const pageSize =
     Number.isFinite(pageSizeRaw) && pageSizeRaw >= 1 && pageSizeRaw <= 100
       ? Math.floor(pageSizeRaw)
       : 20
-  return { names, agentUniqueIds, resumeUniqueIds, pageSize }
+  return {
+    names: readStringList(rec.names),
+    ...(agentKind ? { agentKind } : {}),
+    agentUniqueIds: readStringList(rec.agentUniqueIds),
+    tagUniqueIds: readStringList(rec.tagUniqueIds),
+    resumeUniqueIds: readStringList(rec.resumeUniqueIds),
+    pageSize,
+  }
 }
 
 function filterKey(filter: FormResumeFilter): string {
@@ -51,6 +66,9 @@ const SkoponResumeSelectApi = {
       help: z.any().optional(),
       enableRefresh: z.any().optional(),
       resumeFilter: z.any().optional(),
+      resumeDisplayCount: z.any().optional(),
+      resumeDisplayMode: z.any().optional(),
+      contentFilter: z.any().optional(),
       minCount: z.any().optional(),
       maxCount: z.any().optional(),
       value: z.any().optional(),
@@ -58,112 +76,210 @@ const SkoponResumeSelectApi = {
     .passthrough(),
 }
 
-const MAX_TAG_COUNT = 3
-const MAX_WORK_PREVIEW = 2
+const DEFAULT_CONTENT_FILTER: FormContentFilter = {
+  flowType: 'content-production',
+  tagUniqueIds: [],
+  pageSize: 20,
+}
 
-function renderTagRow(label: string, tags: string[] | undefined) {
-  const items = (tags ?? []).filter(Boolean)
-  const visible = items.slice(0, MAX_TAG_COUNT)
-  const overflow = items.length - visible.length
-  return (
-    <div className="skopon-resume-select-card-tags">
-      <span className="skopon-resume-select-card-tags-label">{label}</span>
-      {items.length > 0 ? (
-        <div className="skopon-resume-select-card-tags-list">
-          {visible.map((tag) => (
-            <Tag key={tag} className="skopon-resume-select-card-tag">
-              {tag}
-            </Tag>
-          ))}
-          {overflow > 0 ? (
-            <Tag className="skopon-resume-select-card-tag">+{overflow}</Tag>
-          ) : null}
-        </div>
-      ) : (
-        <span className="skopon-resume-select-card-tags-empty">暂无</span>
-      )}
-    </div>
-  )
+function readContentFilter(raw: unknown): FormContentFilter {
+  if (!raw || typeof raw !== 'object') return DEFAULT_CONTENT_FILTER
+  const rec = raw as Record<string, unknown>
+  const flowType = typeof rec.flowType === 'string' ? rec.flowType.trim() : ''
+  const category = typeof rec.category === 'string' ? rec.category.trim() : ''
+  const pageSizeRaw = typeof rec.pageSize === 'number' ? rec.pageSize : Number(rec.pageSize)
+  const pageSize =
+    Number.isFinite(pageSizeRaw) && pageSizeRaw >= 1 && pageSizeRaw <= 100
+      ? Math.floor(pageSizeRaw)
+      : 20
+  return {
+    flowType: flowType || 'content-production',
+    ...(category ? { category } : {}),
+    tagUniqueIds: readStringList(rec.tagUniqueIds),
+    tagMatch: rec.tagMatch === 'any' ? 'any' : 'all',
+    pageSize,
+  }
 }
 
-function renderSatisfactionRow(satisfaction: number | undefined) {
-  return (
-    <div className="skopon-resume-select-card-field">
-      <span className="skopon-resume-select-card-tags-label">满意度</span>
-      <span className="skopon-resume-select-card-field-value">
-        {typeof satisfaction === 'number' ? `${satisfaction}%` : '暂无'}
-      </span>
-    </div>
-  )
+interface RingCache<T> {
+  items: T[]
+  total: number
+  fetchedPage: number
+  pageSize: number
+}
+
+interface PageResult<T> {
+  list: T[]
+  total: number
+  page: number
+  pageSize: number
+}
+
+function emptyRing<T>(pageSize: number): RingCache<T> {
+  return { items: [], total: 0, fetchedPage: 0, pageSize }
 }
 
-function ResumeWorkPreview({ work }: { work: ResumeSearchWorkItem }) {
+function snapshotOf<T>(cache: RingCache<T>): PageCacheSnapshot {
+  return {
+    itemCount: cache.items.length,
+    total: cache.total,
+    fetchedPage: cache.fetchedPage,
+    pageSize: cache.pageSize,
+  }
+}
+
+async function loadThroughWindow<T>(
+  cache: RingCache<T>,
+  cursor: number,
+  displayCount: number,
+  fetchPage: (page: number) => Promise<PageResult<T>>,
+): Promise<RingCache<T>> {
+  let next = cache
+  for (let guard = 0; guard < 20; guard += 1) {
+    const page = nextPageForWindow(
+      snapshotOf(next),
+      windowIndexes(cursor, displayCount, next.total),
+    )
+    if (page == null) return next
+    const result = await fetchPage(page)
+    const fetchedPage = result.page || page
+    next = {
+      items: fetchedPage <= 1 ? result.list : next.items.concat(result.list),
+      total: result.total,
+      fetchedPage,
+      pageSize: result.pageSize || next.pageSize,
+    }
+    if (result.list.length === 0) return next
+  }
+  return next
+}
+
+function ContentStage({ content }: { content: ContentSearchItem }) {
+  const [playing, setPlaying] = useState(false)
+  const canPlay = Boolean(content.mediaUrl || content.link || content.coverUrl)
+
+  const play = (event: { stopPropagation: () => void; preventDefault: () => void }) => {
+    event.stopPropagation()
+    event.preventDefault()
+    if (content.mediaKind === 'video' && content.mediaUrl) {
+      setPlaying(true)
+      return
+    }
+    const href = content.link || content.mediaUrl || content.coverUrl
+    if (href) window.open(href, '_blank', 'noopener,noreferrer')
+  }
+
   return (
-    <div className="skopon-resume-select-card-work">
-      <div className="skopon-resume-select-card-work-cover">
-        {work.coverUrl ? (
-          <img src={work.coverUrl} alt="" className="skopon-resume-select-card-work-img" />
-        ) : (
-          <FileImageOutlined className="skopon-resume-select-card-work-placeholder" />
-        )}
-      </div>
-      <div className="skopon-resume-select-card-work-title">{work.title || '未命名作品'}</div>
+    <div className="skopon-resume-select-card-stage">
+      {playing && content.mediaUrl ? (
+        <video
+          className="skopon-resume-select-card-stage-video"
+          src={content.mediaUrl}
+          poster={content.coverUrl ?? undefined}
+          controls
+          autoPlay
+          playsInline
+          onClick={(event) => event.stopPropagation()}
+        />
+      ) : (
+        <button
+          type="button"
+          className="skopon-resume-select-card-stage-button"
+          aria-label="播放内容"
+          disabled={!canPlay}
+          onClick={play}
+        >
+          {content.coverUrl ? (
+            <img src={content.coverUrl} alt="" className="skopon-resume-select-card-cover-img" />
+          ) : (
+            <FileImageOutlined className="skopon-resume-select-card-cover-placeholder" />
+          )}
+          {canPlay ? <CaretRightOutlined className="skopon-resume-select-card-play" /> : null}
+        </button>
+      )}
     </div>
   )
 }
 
 function ResumeCard({
   item,
+  content,
   selected,
   disabled,
   onToggle,
 }: {
-  item: ResumeSearchItem
+  item?: ResumeSearchItem
+  content: ContentSearchItem
   selected: boolean
   disabled: boolean
   onToggle: () => void
 }) {
-  const works = (item.works ?? []).slice(0, MAX_WORK_PREVIEW)
-
+  const specialties = (item?.specialties ?? []).filter(Boolean).slice(0, 3)
   return (
-    <button
-      type="button"
-      className={`skopon-resume-select-card skopon-resume-select-card--profile${selected ? ' skopon-resume-select-card--selected' : ''}`}
-      disabled={disabled}
-      onClick={onToggle}
+    <div
+      role="button"
+      tabIndex={disabled ? -1 : 0}
+      aria-disabled={disabled || undefined}
+      aria-pressed={selected}
+      className={`skopon-resume-select-card skopon-resume-select-card--profile${selected ? ' skopon-resume-select-card--selected' : ''}${disabled ? ' skopon-resume-select-card--disabled' : ''}`}
+      onClick={() => {
+        if (!disabled) onToggle()
+      }}
+      onKeyDown={(event) => {
+        if (disabled) return
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault()
+          onToggle()
+        }
+      }}
     >
-      <Avatar
-        size={48}
-        src={item.avatarUrl || undefined}
-        icon={!item.avatarUrl ? <UserOutlined /> : undefined}
-        className="skopon-resume-select-card-avatar"
-      />
-      <div className="skopon-resume-select-card-name">{item.name || '未命名简历'}</div>
-      <div className="skopon-resume-select-card-body">
-        {renderSatisfactionRow(item.satisfaction)}
-        {renderTagRow('性格', item.personality)}
-        {renderTagRow('专长', item.specialties)}
-        {renderTagRow('擅长领域', item.traits)}
-        <div className="skopon-resume-select-card-works">
-          <span className="skopon-resume-select-card-works-label">过往作品</span>
-          {works.length > 0 ? (
-            <div className="skopon-resume-select-card-works-list">
-              {works.map((work, index) => (
-                <ResumeWorkPreview key={`${work.title}-${index}`} work={work} />
+      {item ? <div className="skopon-resume-select-card-person">
+        <Avatar
+          size={36}
+          src={item.avatarUrl || undefined}
+          icon={!item.avatarUrl ? <UserOutlined /> : undefined}
+          className="skopon-resume-select-card-avatar"
+        />
+        <div className="skopon-resume-select-card-person-text">
+          <div className="skopon-resume-select-card-person-name">
+            {item.name || '未命名简历'}
+          </div>
+          {specialties.length > 0 ? (
+            <div className="skopon-resume-select-card-specialties">
+              {specialties.map((tag) => (
+                <Tag key={tag} className="skopon-resume-select-card-tag">
+                  {tag}
+                </Tag>
               ))}
             </div>
-          ) : (
-            <div className="skopon-resume-select-card-works-empty">暂无作品</div>
-          )}
+          ) : null}
         </div>
       </div>
-    </button>
+      : null}
+      <div className="skopon-resume-select-card-content-title">
+        {content.title || '未命名内容'}
+      </div>
+      {(content.tagLabels ?? []).length > 0 ? (
+        <div className="skopon-resume-select-card-content-tags" aria-label="内容标签">
+          <span className="skopon-resume-select-card-content-tags-label">内容标签</span>
+          <div className="skopon-resume-select-card-content-tags-list">
+            {(content.tagLabels ?? []).map((tag) => (
+              <Tag key={tag} className="skopon-resume-select-card-content-tag">
+                {tag}
+              </Tag>
+            ))}
+          </div>
+        </div>
+      ) : null}
+      <ContentStage content={content} />
+    </div>
   )
 }
 
 function SkoponResumeSelectPreview({ context }: { context: ComponentContext }) {
   const { interactive } = useA2uiPreviewMode()
   const resumeSearch = useResumeSearch()
+  const contentSearch = useContentSearch()
   const { publishLiveOptions } = useFormLiveOptions()
   const { value, setValue, setValueSilent, fieldName } = useSkoponBoundField(context, 'value', {
     component: 'SkoponResumeSelect',
@@ -177,16 +293,25 @@ function SkoponResumeSelectPreview({ context }: { context: ComponentContext }) {
   const enableRefresh = props.enableRefresh !== false
   const minCount = readOptionalSelectCount(props.minCount)
   const maxCount = readOptionalSelectCount(props.maxCount)
+  const contentOnly = props.resumeDisplayMode === 'content-only'
+  const displayCount = normalizeDisplayCount(props.resumeDisplayCount)
   const resumeFilter = useMemo(() => readResumeFilter(props.resumeFilter), [props.resumeFilter])
-  const filterSig = filterKey(resumeFilter)
+  const contentFilter = useMemo(() => readContentFilter(props.contentFilter), [props.contentFilter])
+  const resumeSig = filterKey(resumeFilter)
+  const contentSig = filterKey(contentFilter)
 
-  const [page, setPage] = useState(1)
+  const [resumeCache, setResumeCache] = useState<RingCache<ResumeSearchItem>>(() => emptyRing(20))
+  const [contentCache, setContentCache] = useState<RingCache<ContentSearchItem>>(() => emptyRing(20))
+  const [resumeCursor, setResumeCursor] = useState(0)
+  const [contentCursor, setContentCursor] = useState(0)
   const [loading, setLoading] = useState(false)
   const [error, setError] = useState('')
-  const [items, setItems] = useState<ResumeSearchItem[]>([])
-  const [total, setTotal] = useState(0)
-  const [pageSize, setPageSize] = useState(resumeFilter.pageSize ?? 20)
   const requestSeqRef = useRef(0)
+  const refreshInFlightRef = useRef(false)
+  const resumeCacheRef = useRef(resumeCache)
+  const contentCacheRef = useRef(contentCache)
+  resumeCacheRef.current = resumeCache
+  contentCacheRef.current = contentCache
 
   const selectedIds = asStringArray(value)
 
@@ -195,73 +320,144 @@ function SkoponResumeSelectPreview({ context }: { context: ComponentContext }) {
     if (clamped !== null) setValueSilent(clamped)
   }, [maxCount, selectedIds, setValueSilent])
 
-  const fetchPage = useCallback(
-    async (targetPage: number) => {
-      const filter = readResumeFilter(JSON.parse(filterSig) as FormResumeFilter)
-      const seq = ++requestSeqRef.current
-      if (!resumeSearch) {
-        setItems([])
-        setTotal(0)
-        setError('未配置简历搜索服务')
-        setLoading(false)
-        return
-      }
-      setLoading(true)
-      setError('')
+  const fetchResumePage = useCallback(
+    (page: number) => {
+      const filter = readResumeFilter(JSON.parse(resumeSig) as FormResumeFilter)
+      if (!resumeSearch) return Promise.reject(new Error('未配置简历搜索服务'))
+      return resumeSearch({ filter, page })
+    },
+    [resumeSearch, resumeSig],
+  )
+
+  const fetchContentPage = useCallback(
+    (page: number) => {
+      const filter = readContentFilter(JSON.parse(contentSig) as FormContentFilter)
+      if (!contentSearch) return Promise.reject(new Error('未配置内容搜索服务'))
+      return contentSearch({ filter, page })
+    },
+    [contentSearch, contentSig],
+  )
+
+  useEffect(() => {
+    const seq = ++requestSeqRef.current
+    if ((!contentOnly && !resumeSearch) || !contentSearch) {
+      setResumeCache(emptyRing(resumeFilter.pageSize ?? 20))
+      setContentCache(emptyRing(contentFilter.pageSize ?? 20))
+      setResumeCursor(0)
+      setContentCursor(0)
+      setError(!contentOnly && !resumeSearch ? '未配置简历搜索服务' : '未配置内容搜索服务')
+      setLoading(false)
+      return
+    }
+    setLoading(true)
+    setError('')
+    setResumeCursor(0)
+    setContentCursor(0)
+    void (async () => {
       try {
-        const result = await resumeSearch({ filter, page: targetPage })
+        const [resumeFirst, contentFirst] = await Promise.all([
+          contentOnly ? Promise.resolve({ list: [], total: 0, page: 1, pageSize: 20 }) : fetchResumePage(1),
+          fetchContentPage(1),
+        ])
         if (seq !== requestSeqRef.current) return
-        setItems(result.list)
-        setTotal(result.total)
-        setPage(result.page)
-        setPageSize(result.pageSize)
-        if (fieldName) {
-          publishLiveOptions(
-            fieldName,
-            result.list.map((item) => ({
-              value: item.resumeUniqueId,
-              label: item.name || item.resumeUniqueId,
-            })),
-          )
+        let resumes: RingCache<ResumeSearchItem> = {
+          items: resumeFirst.list,
+          total: resumeFirst.total,
+          fetchedPage: resumeFirst.page || 1,
+          pageSize: resumeFirst.pageSize,
         }
+        let contents: RingCache<ContentSearchItem> = {
+          items: contentFirst.list,
+          total: contentFirst.total,
+          fetchedPage: contentFirst.page || 1,
+          pageSize: contentFirst.pageSize,
+        }
+        if (!contentOnly) resumes = await loadThroughWindow(resumes, 0, displayCount, fetchResumePage)
+        contents = await loadThroughWindow(contents, 0, displayCount, fetchContentPage)
+        if (seq !== requestSeqRef.current) return
+        setResumeCache(resumes)
+        setContentCache(contents)
       } catch (err) {
         if (seq !== requestSeqRef.current) return
-        setItems([])
-        setTotal(0)
-        setError(err instanceof Error ? err.message : '加载简历列表失败')
+        setResumeCache(emptyRing(20))
+        setContentCache(emptyRing(20))
+        setError(err instanceof Error ? err.message : (contentOnly ? '加载内容失败' : '加载简历和内容失败'))
       } finally {
         if (seq === requestSeqRef.current) setLoading(false)
       }
-    },
-    [resumeSearch, filterSig, fieldName, publishLiveOptions],
-  )
+    })()
+  }, [
+    contentOnly,
+    contentFilter.pageSize,
+    contentSearch,
+    displayCount,
+    fetchContentPage,
+    fetchResumePage,
+    resumeFilter.pageSize,
+    resumeSearch,
+  ])
 
+  const resumeWindow = takeWindow(resumeCache.items, resumeCursor, displayCount, resumeCache.total)
+  const contentWindow = takeWindow(contentCache.items, contentCursor, displayCount, contentCache.total)
+  const pairs: { item?: ResumeSearchItem; content: ContentSearchItem; key: string }[] = contentOnly
+    ? contentWindow.map(content => ({ content, key: content.flowUniqueId }))
+    : resumeWindow.flatMap((item, index) => {
+    const content = contentWindow[index]
+    if (!content) return []
+    return [{ item, content, key: pairKey(item.resumeUniqueId, content.flowUniqueId) }]
+  })
+
+  const pairSig = pairs.map((pair) => `${pair.key}\t${pair.item?.name ?? ''}\t${pair.content.title}`).join('\n')
   useEffect(() => {
-    setPage(1)
-    void fetchPage(1)
-  }, [filterSig, fetchPage])
+    if (!fieldName) return
+    publishLiveOptions(
+      fieldName,
+      pairs.map((pair) => ({
+        value: pair.key,
+        label: pair.item ? `${pair.item.name || pair.item.resumeUniqueId} / ${pair.content.title}` : pair.content.title,
+      })),
+    )
+  }, [fieldName, pairSig, publishLiveOptions])
 
-  const toggleSelect = (resumeUniqueId: string) => {
+  const toggleSelect = (key: string) => {
     if (!interactive) return
-    const next = toggleStringArraySelection(
-      selectedIds,
-      resumeUniqueId,
-      minCount,
-      maxCount,
-    )
+    const next = toggleStringArraySelection(selectedIds, key, minCount, maxCount)
     if (next === null) return
     setValue(next)
   }
 
   const handleRefresh = () => {
-    const filter = readResumeFilter(JSON.parse(filterSig) as FormResumeFilter)
-    const effectivePageSize = pageSize || filter.pageSize || 20
-    const totalPages = Math.max(1, Math.ceil(total / effectivePageSize))
-    const nextPage = page >= totalPages ? 1 : page + 1
-    void fetchPage(nextPage)
+    if (refreshInFlightRef.current) return
+    if ((!contentOnly && resumeCache.total <= 0) || contentCache.total <= 0) return
+    refreshInFlightRef.current = true
+    const seq = ++requestSeqRef.current
+    const nextResumeCursor = advanceCursor(resumeCursor, displayCount, resumeCache.total)
+    const nextContentCursor = advanceCursor(contentCursor, displayCount, contentCache.total)
+    setLoading(true)
+    setError('')
+    void (async () => {
+      try {
+        const [resumes, contents] = await Promise.all([
+          contentOnly ? Promise.resolve(resumeCacheRef.current) : loadThroughWindow(resumeCacheRef.current, nextResumeCursor, displayCount, fetchResumePage),
+          loadThroughWindow(contentCacheRef.current, nextContentCursor, displayCount, fetchContentPage),
+        ])
+        if (seq !== requestSeqRef.current) return
+        setResumeCache(resumes)
+        setContentCache(contents)
+        setResumeCursor(nextResumeCursor)
+        setContentCursor(nextContentCursor)
+      } catch (err) {
+        if (seq !== requestSeqRef.current) return
+        setError(err instanceof Error ? err.message : '换一批失败')
+      } finally {
+        refreshInFlightRef.current = false
+        if (seq === requestSeqRef.current) setLoading(false)
+      }
+    })()
   }
 
-  const emptyLabel = placeholder || '暂无匹配的简历'
+  const emptyLabel = placeholder || (contentOnly ? '暂无匹配的内容' : '暂无匹配的简历或内容')
+  const showEmpty = !loading && !error && pairs.length === 0
 
   return (
     <div
@@ -269,9 +465,9 @@ function SkoponResumeSelectPreview({ context }: { context: ComponentContext }) {
       data-skopon-field={fieldName || undefined}
     >
       {label ? <div className="form-block-preview-label">{label}</div> : null}
-      {loading && items.length === 0 ? (
+      {loading && pairs.length === 0 ? (
         <div className="skopon-resume-select-status">
-          <Spin size="small" /> 加载简历…
+          <Spin size="small" /> {contentOnly ? '加载内容…' : '加载简历和内容…'}
         </div>
       ) : null}
       {!loading && error ? (
@@ -279,36 +475,35 @@ function SkoponResumeSelectPreview({ context }: { context: ComponentContext }) {
           {error}
         </Typography.Text>
       ) : null}
-      {!loading && !error && items.length === 0 ? (
-        <div className="skopon-resume-select-empty">{emptyLabel}</div>
-      ) : null}
-      {items.length > 0 ? (
+      {showEmpty ? <div className="skopon-resume-select-empty">{emptyLabel}</div> : null}
+      {pairs.length > 0 ? (
         <div className="skopon-resume-select-list">
-          {items.map((item) => (
+          {pairs.map((pair) => (
             <ResumeCard
-              key={item.resumeUniqueId}
-              item={item}
-              selected={selectedIds.includes(item.resumeUniqueId)}
+              key={pair.key}
+              item={pair.item}
+              content={pair.content}
+              selected={selectedIds.includes(pair.key)}
               disabled={isCardSelectionDisabled(
                 selectedIds,
-                item.resumeUniqueId,
+                pair.key,
                 interactive,
                 minCount,
                 maxCount,
               )}
-              onToggle={() => toggleSelect(item.resumeUniqueId)}
+              onToggle={() => toggleSelect(pair.key)}
             />
           ))}
         </div>
       ) : null}
-      {enableRefresh && resumeSearch ? (
+      {enableRefresh && (contentOnly || resumeSearch) && contentSearch ? (
         <div className="skopon-resume-select-actions">
           <Button
             type="default"
             size="small"
             icon={<ReloadOutlined />}
             loading={loading}
-            disabled={!interactive}
+            disabled={!interactive || (!contentOnly && resumeCache.total <= 0) || contentCache.total <= 0}
             onClick={handleRefresh}
           >
             换一批