ncrease the tracking area for top-selling products
parent
c61da9b738
commit
8080194041
Binary file not shown.
|
Before Width: | Height: | Size: 216 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 354 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 165 KiB |
|
|
@ -15,6 +15,7 @@ import {
|
|||
} from "antd";
|
||||
import { DownOutlined } from "@ant-design/icons";
|
||||
import logoWhite from "../assets/images/logo-white2.png";
|
||||
import adsItemImage from "../assets/images/f89fdab0.webp";
|
||||
import "../css/home.css";
|
||||
|
||||
const { Header, Content } = Layout;
|
||||
|
|
@ -138,66 +139,17 @@ export default function Home() {
|
|||
</section>
|
||||
|
||||
<section className="home-section">
|
||||
<div className="home-section-inner">
|
||||
<div className="home-section-header">
|
||||
<span className="home-section-number">01</span>
|
||||
<Title level={2}>爆品追踪</Title>
|
||||
<span>爆品追踪</span>
|
||||
</div>
|
||||
<Card className="home-section-card" bordered={false}>
|
||||
<Row gutter={24}>
|
||||
<Col xs={24} lg={6} className="home-section-sidebar">
|
||||
<Text className="home-section-filter-title">筛选</Text>
|
||||
<Space direction="vertical" size={8} className="home-filter-list">
|
||||
<Text className="home-section-filter-item">日期</Text>
|
||||
<Text className="home-section-filter-item">类目</Text>
|
||||
<Text className="home-section-filter-item">价格</Text>
|
||||
</Space>
|
||||
</Col>
|
||||
<Col xs={24} lg={18}>
|
||||
<Row gutter={20}>
|
||||
<Col xs={24} lg={14}>
|
||||
<Table
|
||||
className="home-section-table"
|
||||
columns={tableColumns}
|
||||
dataSource={tableData}
|
||||
pagination={false}
|
||||
size="small"
|
||||
<img
|
||||
className="home-section-header-image"
|
||||
src={adsItemImage}
|
||||
alt="ads item preview"
|
||||
/>
|
||||
</Col>
|
||||
<Col xs={24} lg={10}>
|
||||
<Card
|
||||
className="home-section-preview-card"
|
||||
bordered={false}
|
||||
>
|
||||
<div className="home-section-preview-image" />
|
||||
<Row gutter={[12, 12]}>
|
||||
<Col span={8}>
|
||||
<Statistic value="¥920.18k" title="成交金额" />
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Statistic value="9276" title="销量" />
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Statistic value="¥99.20" title="成交均价" />
|
||||
</Col>
|
||||
</Row>
|
||||
<Divider />
|
||||
<Row gutter={[12, 12]}>
|
||||
<Col span={8}>
|
||||
<Statistic value="¥64.47k" title="直播" />
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Statistic value="¥0.00" title="短视频" />
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Statistic value="¥225.71k" title="商城" />
|
||||
</Col>
|
||||
</Row>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
</Row>
|
||||
</Card>
|
||||
</div>
|
||||
</section>
|
||||
</Content>
|
||||
</Layout>
|
||||
|
|
|
|||
|
|
@ -217,7 +217,15 @@ body {
|
|||
}
|
||||
|
||||
.home-section {
|
||||
background-color: rgb(243, 247, 252);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.home-section-inner {
|
||||
width: 1200px;
|
||||
height: 700px;
|
||||
padding: 32px 48px 64px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.home-section-header {
|
||||
|
|
@ -225,10 +233,25 @@ body {
|
|||
align-items: baseline;
|
||||
gap: 16px;
|
||||
margin-bottom: 20px;
|
||||
height: 100px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36px;
|
||||
font-family: "TencentW7", "PingFang SC", "Segoe UI", sans-serif;
|
||||
}
|
||||
|
||||
.home-section-header-image {
|
||||
width: 1200px;
|
||||
height: 600px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
object-fit: cover;
|
||||
object-position: center -100px;
|
||||
border-radius: 24px;
|
||||
}
|
||||
|
||||
.home-section-number {
|
||||
font-size: 48px;
|
||||
font-size: 100px;
|
||||
color: #e4edf8;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ module.exports = {
|
|||
use: ["style-loader", "css-loader"]
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpe?g|gif|svg)$/i,
|
||||
test: /\.(png|jpe?g|gif|svg|webp)$/i,
|
||||
type: "asset/resource"
|
||||
},
|
||||
{
|
||||
|
|
|
|||
Loading…
Reference in New Issue