import { FC } from "react";

const CenterTop: FC<{}> = (props) => {
  return (
    <div className="CenterTopBox">
      <div className="CenterTop">
        <div className="centerTopLogo">
          <svg viewBox="0 0 1024 1024">
            <path d="M512 97.52381c228.912762 0 414.47619 185.563429 414.47619 414.47619s-185.563429 414.47619-414.47619 414.47619S97.52381 740.912762 97.52381 512 283.087238 97.52381 512 97.52381z m0 73.142857C323.486476 170.666667 170.666667 323.486476 170.666667 512s152.81981 341.333333 341.333333 341.333333 341.333333-152.81981 341.333333-341.333333S700.513524 170.666667 512 170.666667z m96.060952 120.441904l51.687619 51.687619L563.736381 438.857143h194.857143v73.142857h-146.285714v60.952381h146.285714v73.142857h-146.285714v97.52381h-73.142858v-97.52381h-146.285714v-73.142857h146.285714V512h-146.285714v-73.142857h131.145143l-96.060952-96.060953 51.736381-51.687619L512 387.120762l96.060952-96.060952z"></path>
          </svg>
        </div>
        <div className="content">
          <h1>用户总数</h1>
          <div className="subTitle">User Total Count</div>
          <div className="subTitle1">123123</div>
        </div>
      </div>

      <div className="CenterTop">
        <div className="centerTopLogo">
          <svg viewBox="0 0 1024 1024">
            <path d="M512 64C264.533333 64 64 264.533333 64 512s200.533333 448 448 448 448-200.533333 448-448S759.466667 64 512 64z m0 853.333333C288 917.333333 106.666667 736 106.666667 512S288 106.666667 512 106.666667s405.333333 181.333333 405.333333 405.333333-181.333333 405.333333-405.333333 405.333333z" p-id="4001"></path>
            <path d="M746.666667 341.333333H448c-12.8 0-21.333333 8.533333-21.333333 21.333334s8.533333 21.333333 21.333333 21.333333h298.666667c12.8 0 21.333333-8.533333 21.333333-21.333333s-8.533333-21.333333-21.333333-21.333334z" p-id="4002"></path>
            <path d="M320 362.666667m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z" p-id="4003"></path>
            <path d="M746.666667 490.666667H448c-12.8 0-21.333333 8.533333-21.333333 21.333333s8.533333 21.333333 21.333333 21.333333h298.666667c12.8 0 21.333333-8.533333 21.333333-21.333333s-8.533333-21.333333-21.333333-21.333333z" p-id="4004"></path>
            <path d="M320 512m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z" p-id="4005"></path>
            <path d="M746.666667 640H448c-12.8 0-21.333333 8.533333-21.333333 21.333333s8.533333 21.333333 21.333333 21.333334h298.666667c12.8 0 21.333333-8.533333 21.333333-21.333334s-8.533333-21.333333-21.333333-21.333333z" p-id="4006"></path>
            <path d="M320 661.333333m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z" p-id="4007"></path>
          </svg>
        </div>
        <div className="content">
          <h1>今日订单量</h1>
          <div className="subTitle">User Total Count</div>
          <div className="subTitle1">124142</div>
        </div>
      </div>

      <div className="CenterTop">
        <div className="centerTopLogo">
          <svg viewBox="0 0 1024 1024">
            <path d="M512 57.6c-246.4 0-448 201.6-448 448s201.6 448 448 448 448-201.6 448-448-201.6-448-448-448zM732.8 448l-9.6 230.4c0 6.4-3.2 9.6-6.4 12.8-3.2 0-60.8 38.4-198.4 38.4-137.6 0-198.4-35.2-198.4-38.4-3.2-3.2-6.4-6.4-6.4-12.8L294.4 448c-19.2-9.6-28.8-28.8-28.8-51.2 0-32 25.6-57.6 57.6-57.6s57.6 25.6 57.6 57.6c0 28.8-19.2 51.2-44.8 57.6 19.2 38.4 51.2 83.2 73.6 83.2 12.8 0 41.6-35.2 76.8-131.2-22.4-9.6-38.4-32-38.4-60.8 0-35.2 28.8-64 67.2-64s64 28.8 64 64c0 25.6-16 48-38.4 60.8 32 89.6 64 134.4 80 134.4s48-41.6 70.4-89.6c-25.6-6.4-44.8-28.8-44.8-57.6 0-32 25.6-57.6 57.6-57.6s57.6 25.6 57.6 57.6c0 25.6-12.8 44.8-28.8 54.4z"></path>
          </svg>
        </div>
        <div className="content">
          <h1>今日交易用户数</h1>
          <div className="subTitle">User Total Count</div>
          <div className="subTitle1">43525</div>
        </div>
      </div>

      <div className="CenterTop">
        <div className="centerTopLogo">
          <svg viewBox="0 0 1024 1024" version="1.1">
            <path d="M512 74.666667C270.933333 74.666667 74.666667 270.933333 74.666667 512S270.933333 949.333333 512 949.333333 949.333333 753.066667 949.333333 512 753.066667 74.666667 512 74.666667zM288 810.666667c0-123.733333 100.266667-224 224-224S736 686.933333 736 810.666667c-61.866667 46.933333-140.8 74.666667-224 74.666666s-162.133333-27.733333-224-74.666666z m128-384c0-53.333333 42.666667-96 96-96s96 42.666667 96 96-42.666667 96-96 96-96-42.666667-96-96z m377.6 328.533333c-19.2-96-85.333333-174.933333-174.933333-211.2 32-29.866667 51.2-70.4 51.2-117.333333 0-87.466667-72.533333-160-160-160s-160 72.533333-160 160c0 46.933333 19.2 87.466667 51.2 117.333333-89.6 36.266667-155.733333 115.2-174.933334 211.2-55.466667-66.133333-91.733333-149.333333-91.733333-243.2 0-204.8 168.533333-373.333333 373.333333-373.333333S885.333333 307.2 885.333333 512c0 93.866667-34.133333 177.066667-91.733333 243.2z"></path>
          </svg>
        </div>
        <div className="content">
          <h1>今日新增用户数</h1>
          <div className="subTitle">User Total Count</div>
          <div className="subTitle1">34525</div>
        </div>
      </div>
    </div>
  );
};

export default CenterTop;