import React from "react";
import { Tabs } from "antd";
import type { TabsProps } from "antd";
import "../../../asstes/css/header.css";

import LabsCard from "./labsCard";

import AppCenter_iot_thingspeak from "../../../asstes/img/AppCenter_iot_thingspeak.jpg";
import AppCenter_iot_ifttt from "../../../asstes/img/AppCenter_iot_ifttt.jpg";

interface IotProps {
    handleChildValue: (value: string) => void;
}
const Iot: React.FC<IotProps> = (props) => {

    const handleCardClick = (title: string) => {
        // console.log("子组件传递的值:", title);
        props.handleChildValue(title);
    };

    return (
        <div>
            <h2>物联网</h2>
            <div className="labs-card-list">
                <div className="labs-card-list-item">
                    <LabsCard title={"ThingSpeak"} imgSrc={AppCenter_iot_thingspeak} onClick={() => handleCardClick("ThingSpeak")} />
                    
                </div>
                <div className="labs-card-list-item">
                    <LabsCard title={"IFTTT"} imgSrc={AppCenter_iot_ifttt} onClick={() => handleCardClick("IFTTT")} />
                </div>
            </div>
        </div>

    )
}


export default Iot;