|
@@ -6,7 +6,7 @@ import { Key, useEffect, useMemo, useState } from "react";
|
|
|
import { Config } from "@/models/appPageConifg";
|
|
|
import { useAjax } from "@/Hook/useAjax";
|
|
|
import useApi from "@/Hook/useApi";
|
|
|
-import { Empty } from "antd";
|
|
|
+import { Empty, Spin } from "antd";
|
|
|
import usePrevious from "@/Hook/usePrevious";
|
|
|
// 热门书
|
|
|
export function HotCategory(props: {
|
|
@@ -50,56 +50,56 @@ export function HotCategory(props: {
|
|
|
useEffect(() => {
|
|
|
if (configs && configs?.length > 0) {
|
|
|
if (!tag && configs?.[0]?.categoryId) {
|
|
|
- console.log("tag不存在", configs)
|
|
|
setTag(configs?.[0]?.categoryId)
|
|
|
}
|
|
|
let isExist = configs?.find(i => i.categoryId == tag)
|
|
|
if (!isExist) {
|
|
|
- console.log("tag变更")
|
|
|
setTag(configs?.[0]?.categoryId)
|
|
|
}
|
|
|
- if (configs.length === 0) {
|
|
|
- setTag(null)
|
|
|
- setBookData([])
|
|
|
- }
|
|
|
+ }
|
|
|
+ if (configs && configs.length === 0) {
|
|
|
+ setTag(null)
|
|
|
+ setBookData([])
|
|
|
}
|
|
|
}, [tag, configs])
|
|
|
- return <div className={`${styles.hot_category}`}>
|
|
|
- <Header title={componentName || "热门分类"} btnText={"全部分类"} showBtn={showRightButton} />
|
|
|
- <div className={styles.tags}>
|
|
|
- {
|
|
|
- configs?.map((item, index) => {
|
|
|
- return item?.categoryId && <div
|
|
|
- className={`${styles.tag} ${tag === item.categoryId ? styles.tag_ac : ""}`}
|
|
|
- key={item.categoryId || index}
|
|
|
- onClick={() => {
|
|
|
- setTag(item.categoryId || "")
|
|
|
- }}
|
|
|
- >
|
|
|
- {item?.categoryInfo?.name}
|
|
|
- </div>
|
|
|
- })
|
|
|
- }
|
|
|
- </div>
|
|
|
- <div className={styles.list}>
|
|
|
- {
|
|
|
- configs?.find(i => i.categoryId == tag)?.bookIds ? configs?.find(i => i.categoryId == tag)?.bookInfos?.map((item: any, index: any) => {
|
|
|
- return <div key={item.id || index} className={styles.box}>
|
|
|
- <img src={item?.picUrl} onError={(e: any) => {
|
|
|
- e.target.src = localStorage.getItem("nocover")
|
|
|
- }} />
|
|
|
- <span>{item?.bookName}</span>
|
|
|
- </div>
|
|
|
- }) : bookData?.length > 0 ? bookData?.map((item: any, index) => {
|
|
|
- return <div key={item.bookId || index} className={styles.box}>
|
|
|
- <img src={item?.longBookInfo?.picUrl || item?.shortBookInfoVO?.picUrl} onError={(e: any) => {
|
|
|
- e.target.src = localStorage.getItem("nocover")
|
|
|
- }} />
|
|
|
- <span>{item?.longBookInfo?.bookName || item?.shortBookInfoVO?.bookName}</span>
|
|
|
- </div>
|
|
|
- }) : <div style={{ justifyContent: 'center', display: 'flex', width: '100%' }}><Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据请选中后设置" /></div>
|
|
|
- }
|
|
|
+ return <Spin spinning={getList?.loading}>
|
|
|
+ <div className={`${styles.hot_category}`}>
|
|
|
+ <Header title={componentName || "热门分类"} btnText={"全部分类"} showBtn={showRightButton} />
|
|
|
+ <div className={styles.tags}>
|
|
|
+ {
|
|
|
+ configs?.map((item, index) => {
|
|
|
+ return item?.categoryId && <div
|
|
|
+ className={`${styles.tag} ${tag === item.categoryId ? styles.tag_ac : ""}`}
|
|
|
+ key={item.categoryId || index}
|
|
|
+ onClick={() => {
|
|
|
+ setTag(item.categoryId || "")
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {item?.categoryInfo?.name}
|
|
|
+ </div>
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </div>
|
|
|
+ <div className={styles.list}>
|
|
|
+ {
|
|
|
+ configs?.find(i => i.categoryId == tag)?.bookIds ? configs?.find(i => i.categoryId == tag)?.bookInfos?.map((item: any, index: any) => {
|
|
|
+ return <div key={item.id || index} className={styles.box}>
|
|
|
+ <img src={item?.picUrl} onError={(e: any) => {
|
|
|
+ e.target.src = localStorage.getItem("nocover")
|
|
|
+ }} />
|
|
|
+ <span>{item?.bookName}</span>
|
|
|
+ </div>
|
|
|
+ }) : bookData?.length > 0 ? bookData?.map((item: any, index) => {
|
|
|
+ return <div key={item.bookId || index} className={styles.box}>
|
|
|
+ <img src={item?.longBookInfo?.picUrl || item?.shortBookInfoVO?.picUrl} onError={(e: any) => {
|
|
|
+ e.target.src = localStorage.getItem("nocover")
|
|
|
+ }} />
|
|
|
+ <span>{item?.longBookInfo?.bookName || item?.shortBookInfoVO?.bookName}</span>
|
|
|
+ </div>
|
|
|
+ }) : <div style={{ justifyContent: 'center', display: 'flex', width: '100%' }}><Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="暂无数据请选中后设置" /></div>
|
|
|
+ }
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </Spin>
|
|
|
}
|
|
|
|