组件属性用分立参数

dashboard/src/components/corpus/PaliChapterCard.tsx

@@ -1,5 +1,6 @@
 import { Row, Col } from "antd";
 import { Typography } from "antd";
+import { API_HOST } from "../../request";
 
 import TocPath from "./TocPath";
 
@@ -8,23 +9,24 @@ const { Title, Link } = Typography;
 export interface IPaliChapterData {
   Title: string;
   PaliTitle: string;
+  level: number;
   Path: string;
   Book: number;
   Paragraph: number;
 }
 
-interface IWidgetPaliChapterCard {
+interface IWidget {
   data: IPaliChapterData;
   onTitleClick?: Function;
 }
 
-const Widget = (prop: IWidgetPaliChapterCard) => {
-  const path = JSON.parse(prop.data.Path);
+const Widget = ({ data, onTitleClick }: IWidget) => {
+  const path = JSON.parse(data.Path);
 
   return (
     <>
       <Row>
-        <Col span={3}>封面</Col>
+        <Col span={3}></Col>
         <Col span={21}>
           <Row>
             <Col span={16}>
@@ -33,17 +35,17 @@ const Widget = (prop: IWidgetPaliChapterCard) => {
                   <Title
                     level={5}
                     onClick={(e) => {
-                      if (typeof prop.onTitleClick !== "undefined") {
-                        prop.onTitleClick(e);
+                      if (typeof onTitleClick !== "undefined") {
+                        onTitleClick(e);
                       }
                     }}
                   >
-                    <Link>{prop.data.Title}</Link>
+                    <Link>{data.Title}</Link>
                   </Title>
                 </Col>
               </Row>
               <Row>
-                <Col>{prop.data.PaliTitle}</Col>
+                <Col>{data.PaliTitle}</Col>
               </Row>
               <Row>
                 <Col>
@@ -51,7 +53,13 @@ const Widget = (prop: IWidgetPaliChapterCard) => {
                 </Col>
               </Row>
             </Col>
-            <Col span={8}>进度条</Col>
+            <Col span={8}>
+              <img
+                src={`${API_HOST}/storage/images/chapter_dynamic/${data.Book}/${data.Paragraph}/globle.svg`}
+                width={200}
+                alt="章节动态"
+              />
+            </Col>
           </Row>
           <Row>
             <Col></Col>