|
|
@@ -1,11 +1,11 @@
|
|
|
import React, { useEffect, useState } from 'react'
|
|
|
import { fetchSearch } from '../api.js'
|
|
|
|
|
|
-// 渠道分区展示：抖音一组在前、微信公众号一组在后，各自成块，不混排。
|
|
|
+// 渠道分区展示：小红书 → 微信公众号 → 抖音；每区内「创作知识」在前、「非创作知识」单独起一行。
|
|
|
const PLATFORMS = [
|
|
|
- { key: 'douyin', label: '抖音', cls: 'dy' },
|
|
|
- { key: 'weixin', label: '微信公众号', cls: 'wx' },
|
|
|
{ key: 'xiaohongshu', label: '小红书', cls: 'xhs' },
|
|
|
+ { key: 'weixin', label: '微信公众号', cls: 'wx' },
|
|
|
+ { key: 'douyin', label: '抖音', cls: 'dy' },
|
|
|
]
|
|
|
|
|
|
// 单条 query 的真实搜索结果详情：进来即「点进该 query 生成的多个视频里」。
|
|
|
@@ -27,13 +27,28 @@ export default function QueryDetail({ query }) {
|
|
|
PLATFORMS.map((p) => {
|
|
|
const list = hits.filter((r) => r.platform === p.key)
|
|
|
const fail = data.items.find((r) => r.platform === p.key && !r.ok)
|
|
|
+ const creation = list.filter((r) => r.cls?.is_creation === 1)
|
|
|
+ const others = list.filter((r) => r.cls?.is_creation !== 1) // 非创作 + 未分类
|
|
|
return (
|
|
|
<section className="pgroup" key={p.key}>
|
|
|
<div className={`ghead ${p.cls}`}>{p.label}<span className="gn">{list.length}</span></div>
|
|
|
{list.length === 0 ? (
|
|
|
<div className="gnone">未搜到{fail?.extra?.error ? `（${fail.extra.error}）` : ''}</div>
|
|
|
) : (
|
|
|
- <div className="grid">{list.map((r) => <Result key={r.id} r={r} cls={p.cls} />)}</div>
|
|
|
+ <>
|
|
|
+ {creation.length > 0 && (
|
|
|
+ <>
|
|
|
+ <div className="subhd">创作知识 · {creation.length}</div>
|
|
|
+ <div className="grid">{creation.map((r) => <Result key={r.id} r={r} cls={p.cls} />)}</div>
|
|
|
+ </>
|
|
|
+ )}
|
|
|
+ {others.length > 0 && (
|
|
|
+ <>
|
|
|
+ <div className="subhd dim">非创作知识 · {others.length}</div>
|
|
|
+ <div className="grid">{others.map((r) => <Result key={r.id} r={r} cls={p.cls} />)}</div>
|
|
|
+ </>
|
|
|
+ )}
|
|
|
+ </>
|
|
|
)}
|
|
|
</section>
|
|
|
)
|
SamLee