sync

src/views/report/Index.jsx

@@ -2,7 +2,7 @@ import { NavLink } from "react-router-dom";
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import { toJS } from "mobx";
-import { Row, Col, Space, Button, Table, Input, Typography, Badge, List, DatePicker } from "antd";
+import { Row, Col, Space, Button, Table, Divider, Typography, Badge, List, DatePicker } from "antd";
 import { useStore } from "@/stores/StoreContext.js";
 import * as config from "@/config";
 import * as comm from "@/utils/commons";
@@ -14,9 +14,181 @@ function Index() {
 	const { reportStore, authStore } = useStore();
 	const { search_date_start, search_date_end } = reportStore;
 
-	useEffect(() => {
-		
-	}, []);
+	useEffect(() => {}, []);
+
+	const dataSource = [
+		{
+			key: "1",
+			name: "Groups",
+			age: 32,
+			address: "西湖区湖底公园1号",
+		},
+		{
+			key: "2",
+			name: "胡彦祖",
+			age: 42,
+			address: "西湖区湖底公园1号",
+		},
+	];
+
+	const columns_primary = [
+		{
+			title: "Groups",
+			dataIndex: "Groups",
+			key: "Groups",
+		},
+		{
+			title: "Number of People",
+			dataIndex: "Number of People",
+			key: "Number of People",
+		},
+		{
+			title: "Transaction Amount（USD)",
+			dataIndex: "Transaction Amount（USD)",
+			key: "Transaction Amount（USD)",
+		},
+		{
+			title: "Evaluation Score",
+			dataIndex: "Evaluation Score",
+			key: "Evaluation Score",
+		},
+		{
+			title: "TP Reviews",
+			dataIndex: "TP Reviews",
+			key: "TP Reviews",
+		},
+		{
+			title: "TP Reviews Rate",
+			dataIndex: "TP Reviews Rate",
+			key: "TP Reviews Rate",
+		},
+		{
+			title: "Complaints",
+			dataIndex: "Complaints",
+			key: "Complaints",
+		},
+		{
+			title: "Complaint Rate",
+			dataIndex: "Complaint Rate",
+			key: "Complaint Rate",
+		},
+	];
+
+	const columns_month = [
+		{
+			title: "Date",
+			dataIndex: "Date",
+			key: "Date",
+		},
+		{
+			title: "Groups",
+			dataIndex: "Groups",
+			key: "Groups",
+		},
+		{
+			title: "Number of People",
+			dataIndex: "Number of People",
+			key: "Number of People",
+		},
+		{
+			title: "Transaction Amount（USD)",
+			dataIndex: "Transaction Amount（USD)",
+			key: "Transaction Amount（USD)",
+		},
+		{
+			title: "Evaluation Score",
+			dataIndex: "Evaluation Score",
+			key: "Evaluation Score",
+		},
+		{
+			title: "TP Reviews",
+			dataIndex: "TP Reviews",
+			key: "TP Reviews",
+		},
+		{
+			title: "TP Reviews Rate",
+			dataIndex: "TP Reviews Rate",
+			key: "TP Reviews Rate",
+		},
+		{
+			title: "Complaints",
+			dataIndex: "Complaints",
+			key: "Complaints",
+		},
+		{
+			title: "Complaint Rate",
+			dataIndex: "Complaint Rate",
+			key: "Complaint Rate",
+		},
+	];
+
+	const columns_dmc = [
+		{
+			title: "Category",
+			dataIndex: "Category",
+			key: "Category",
+			onCell: (_, index) => {
+				if (index === 0) {
+					return {
+						rowSpan: 2,
+					};
+				}
+			},
+		},
+		{
+			title: "Item",
+			dataIndex: "Item",
+			key: "Item",
+		},
+		{
+			title: "Your Scores",
+			dataIndex: "Your Scores",
+			key: "Your Scores",
+		},
+		{
+			title: "Final Scores",
+			dataIndex: "Final Scores",
+			key: "Final Scores",
+		},
+	];
+
+	const dataSource_dmc = [
+		{
+			key: "1",
+			Category: "Category",
+			Item: "Item",
+			"Your Scores": "Your Scores",
+			"Final Scores": "Final Scores",
+		},
+		{
+			key: "2",
+			Category: "Category",
+			Item: "Item",
+			"Your Scores": "Your Scores",
+			"Final Scores": "Final Scores",
+		},
+		{
+			key: "3",
+			Category: "Category",
+			Item: "Item",
+			"Your Scores": "Your Scores",
+			"Final Scores": "Final Scores",
+		},
+		{
+			key: "4",
+			Category: "Category",
+			Item: "Item",
+			"Your Scores": "Your Scores",
+			"Final Scores": "Final Scores",
+		},
+		{
+			key: "5",
+			Category: "Category",
+			Item: "Item",
+			"Your Scores": "Your Scores",
+			"Final Scores": "Final Scores",
+		},
+	];
 
 	return (
 		<Space direction="vertical" style={{ width: "100%" }}>
@@ -57,7 +229,20 @@ function Index() {
 			</Row>
 			<Title level={3}></Title>
 			<Row>
-				<Col md={24} lg={24} xxl={24}></Col>
+				<Col md={24} lg={24} xxl={24}>
+					<Divider>Primary Data</Divider>
+					<Table dataSource={dataSource} columns={columns_primary} pagination={false} bordered />
+				</Col>
+
+				<Col md={24} lg={24} xxl={24}>
+					<Divider>Monthly Data</Divider>
+					<Table dataSource={dataSource} columns={columns_month} pagination={false} bordered />
+				</Col>
+
+				<Col md={24} lg={24} xxl={24}>
+					<Divider>地接考核分数</Divider>
+					<Table dataSource={dataSource_dmc} columns={columns_dmc} pagination={false} bordered />
+				</Col>
 			</Row>
 		</Space>
 	);