diff --git a/nkebao/src/pages/home/index.module.scss b/nkebao/src/pages/home/index.module.scss index 0d92815b..9aa1cc1a 100644 --- a/nkebao/src/pages/home/index.module.scss +++ b/nkebao/src/pages/home/index.module.scss @@ -1,7 +1,6 @@ .home-page { padding: 12px; background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); - min-height: 100vh; } // 导航栏样式 diff --git a/nkebao/src/pages/home/index.tsx b/nkebao/src/pages/home/index.tsx index ce27e61f..fd95fce7 100644 --- a/nkebao/src/pages/home/index.tsx +++ b/nkebao/src/pages/home/index.tsx @@ -1,61 +1,75 @@ import React, { useEffect, useState } from "react"; -import { Card, NavBar, TabBar, Grid } from "antd-mobile"; +import { NavBar } from "antd-mobile"; import { AppOutline, UserOutline, - PieOutline, - ShopbagOutline, - FileOutline, - StarOutline, - StopOutline, - TeamOutline, + LoopOutline, + TravelOutline, + ClockCircleOutline, } from "antd-mobile-icons"; import MeauMobile from "@/components/MeauMobile/MeauMoible"; import Layout from "@/components/Layout/Layout"; import style from "./index.module.scss"; import LineChart from "@/components/LineChart"; -import { getPlanStats } from "./api"; - -const todayStats = [ - { - label: "朋友圈", - value: 12, - icon: , - color: "#ff6b35", - }, - { - label: "群发", - value: 8, - icon: , - color: "#ffd700", - }, - { - label: "转化率", - value: "85%", - icon: , - color: "#4caf50", - }, - { - label: "活跃度", - value: "98%", - icon: , - color: "#2196f3", - }, -]; +import { + getPlanStats, + getSevenDayStats, + getTodayStats, + getDashboard, +} from "./api"; const Home: React.FC = () => { const [sceneStats, setSceneStats] = useState([]); + const [todayStats, setTodayStats] = useState([]); + const [dashboard, setDashboard] = useState({}); + const [sevenDayStats, setSevenDayStats] = useState({}); useEffect(() => { + getDashboard().then((res: any) => { + setDashboard(res); + }); getPlanStats({ num: 4 }).then((res: any) => { - // console.log(res); setSceneStats(res); }); + getSevenDayStats().then((res: any) => { + setSevenDayStats(res); + }); + getTodayStats().then((res: any) => { + const todayStatsData = [ + { + label: "朋友圈", + value: res.momentsNum, + icon: , + color: "#ff6b35", + }, + { + label: "群发", + value: res.groupPushNum, + icon: , + color: "#ffd700", + }, + { + label: "转化率", + value: res.passRate, + icon: , + color: "#4caf50", + }, + { + label: "活跃度", + value: res.sysActive, + icon: ( + + ), + color: "#2196f3", + }, + ]; + setTodayStats(todayStatsData); + }); }, []); return ( + 存客宝 @@ -73,8 +87,9 @@ const Home: React.FC = () => { /> - 0 设备数量 + + {dashboard.deviceNum} @@ -84,19 +99,21 @@ const Home: React.FC = () => { /> - 0 微信号 + {dashboard.wechatNum} - - 0 在线 + + {dashboard.aliveWechatNum} + @@ -151,8 +168,8 @@ const Home: React.FC = () => {