feat:换货详情页面

src/pages/afterService/exchangeGoods/orderPreview/components/historyLog/index.tsx

+import React from 'react'
+import { Card } from 'antd'
+import styles from '../index.less'
+
+interface HistoryLogPropsType {
+
+}
+
+const HistoryLog: React.FC<HistoryLogPropsType> = (props) => {
+  const { } = props
+
+  return (
+    <Card className={styles.card_wrap}>
+      <div className={styles.card_title}>历史流转记录</div>
+
+    </Card>
+  )
+}
+
+export default HistoryLog

src/pages/afterService/exchangeGoods/orderPreview/components/index.less

 .card_wrap {
   position: relative;
 
+  &:not(:last-child) {
+    margin-bottom: 24px;
+  }
+
   .card_title {
     font-size: 16px;
     font-weight: bold;
@@ -40,6 +44,10 @@
       padding-top: 8px;
     }
 
+    .ant-tabs-tab {
+      color: #909399;
+    }
+
     .ant-tabs-top>.ant-tabs-nav::before,
     .ant-tabs-top>div>.ant-tabs-nav::before {
       border-bottom: none;

src/pages/afterService/exchangeGoods/orderPreview/components/replaceDetail/index.tsx

+import React from 'react'
+import { Card, Tabs } from 'antd'
+import styles from '../index.less'
+
+interface taskItemType {
+  step: number,
+  taskName: string,
+  roleName: string,
+  isExecute: number
+}
+
+interface ReplaceDetailPropsType {
+
+}
+
+const { TabPane } = Tabs
+
+const ReplaceDetail: React.FC<ReplaceDetailPropsType> = (props) => {
+  const { } = props
+
+  return (
+    <Card className={styles.card_wrap}>
+      <Tabs defaultActiveKey="1" >
+        <TabPane tab="换货收货统计" key="1">
+          换货收货统计
+        </TabPane>
+        <TabPane tab="换货收货明细" key="2">
+          换货收货明细
+        </TabPane>
+      </Tabs>
+
+    </Card>
+  )
+}
+
+export default ReplaceDetail

src/pages/afterService/exchangeGoods/orderPreview/components/replaceGoods/index.tsx

+import React from 'react'
+import { Card } from 'antd'
+import styles from '../index.less'
+
+interface taskItemType {
+  step: number,
+  taskName: string,
+  roleName: string,
+  isExecute: number
+}
+
+interface ReplaceGoodsPropsType {
+
+}
+
+const ReplaceGoods: React.FC<ReplaceGoodsPropsType> = (props) => {
+  const { } = props
+
+  return (
+    <Card className={styles.card_wrap}>
+      <div className={styles.card_title}>换货商品</div>
+
+    </Card>
+  )
+}
+
+export default ReplaceGoods

src/pages/afterService/exchangeGoods/orderPreview/components/returnGoods/index.tsx

+import React from 'react'
+import { Card, Tabs } from 'antd'
+import styles from '../index.less'
+
+interface taskItemType {
+  step: number,
+  taskName: string,
+  roleName: string,
+  isExecute: number
+}
+
+interface ReturnGoodsPropsType {
+
+}
+
+const { TabPane } = Tabs
+
+const ReturnGoods: React.FC<ReturnGoodsPropsType> = (props) => {
+  const { } = props
+
+  return (
+    <Card className={styles.card_wrap}>
+      <Tabs defaultActiveKey="1" >
+        <TabPane tab="退货发货统计" key="1">
+          退货发货统计
+        </TabPane>
+        <TabPane tab="退货发货明细" key="2">
+          退货发货明细
+        </TabPane>
+      </Tabs>
+
+    </Card>
+  )
+}
+
+export default ReturnGoods

src/pages/afterService/exchangeGoods/orderPreview/index.tsx

 import React, { useState, useEffect } from 'react'
-import { Spin } from 'antd'
+import { Spin, Row, Col } from 'antd'
 import OrderDetailHeader from '../../components/OrderDetailHeader'
 import OrderDetailWrapper from '../../components/OrderDetailWrapper'
 import OrderProcess from './components/orderProcess'
+import ReplaceGoods from './components/replaceGoods'
+import ReturnGoods from './components/returnGoods'
+import ReplaceDetail from './components/replaceDetail'
+import HistoryLog from './components/HistoryLog'
 
 interface OrderPreviewPropsType { }
 
@@ -153,6 +157,16 @@ const OrderPreview: React.FC<OrderPreviewPropsType> = (props) => {
           innerTaskList={innerTaskList}
           showTabs={false}
         />
+        <ReplaceGoods />
+        <ReturnGoods />
+        <ReplaceDetail />
+        <Row gutter={[24, 24]}>
+          <Col xxl={6} xl={12} lg={12} ><HistoryLog /></Col>
+          <Col xxl={6} xl={12} lg={12} ><HistoryLog /></Col>
+          <Col xxl={6} xl={12} lg={12} ><HistoryLog /></Col>
+          <Col xxl={6} xl={12} lg={12} ><HistoryLog /></Col>
+        </Row>
+        <HistoryLog />
       </OrderDetailWrapper>
     </Spin>
   )