pricing page

This commit is contained in:
2023-02-19 17:54:44 -05:00
parent 174d903d6e
commit bd854714d0
5 changed files with 93 additions and 101 deletions
@@ -2,22 +2,30 @@ import React, { useState } from "react";
import SellAnalysChart from "../Charts/SellAnalysChart";
import SelectBox from "../Helpers/SelectBox";
export default function PricingListTable() {
export default function PricingListTable(props) {
// debugger;
return (
<div className="sell-analise w-full md:p-8 p-4 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow mb-11">
<div className="flex flex-col justify-between h-full">
<div className="content flex justify-between items-center mb-5">
<ul>
{
props.priceDetail.features.map((item,index)=>(
<div>
<h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">
Sell Analize
</h1>
</div>
<li className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">
{item}
</li>
</div>
))
}
</ul>
</div>
<div>
uuuuu
</div>
</div>
</div>
+56 -81
View File
@@ -1,4 +1,5 @@
import React from "react";
import React, { useEffect, useState } from "react";
import country1 from "../../assets/images/country-1.png";
import country2 from "../../assets/images/country-2.png";
import country3 from "../../assets/images/country-3.png";
@@ -10,8 +11,32 @@ import Layout from "../Partials/Layout";
import SellProductHistoryTable from "./SellProductHistoryTable";
import SubScriptionTop from "./SubScriptionTop";
import SiteService from "../../services/SiteService";
import PricingListTable from "./PricingListTable";
export default function Subscriptions() {
const site_api = new SiteService();
const [pricingData, setPricingData] = useState([]);
const getPricingData = async () => {
try {
const res = await site_api.priceData();
if (res.status == 200) {
//debugger;
console.log("PPPP",res.data.pricing);
setPricingData([{ data: res.data.pricing
}]);
return;
}
} catch (error) {
// setIsLoading(false)
}
};
useEffect(() => {
getPricingData();
}, []);
// debugger;
console.log("FFFFF",pricingData);
console.log("AAAAA- ",pricingData[0]);
return (
<>
<Layout>
@@ -21,88 +46,38 @@ export default function Subscriptions() {
<div className="current_balance-bit-sell-widget w-full lg:h-[436px] mb-11">
<div className="w-full h-full lg:flex lg:space-x-7">
{/* style={{ width: "calc(50% - 15px)" }} */}
{
pricingData &&
pricingData[0]?.data?.length > 0 && pricingData[0].data.map((price,index)=>(
<>
<div className="lg:w-1/3 h-full mb-10 lg:mb-0">
<div className="sell-month-analytic-card w-full h-full rounded-xl overflow-hidden relative">
{/* heading */}
<div className="w-full h-16 bg-gold flex pl-7 items-center">
<h1 className="text-xl font-medium tracking-wide text-white">
{price.title}
</h1>
</div>
<div className="w-full h-full flex flex-col justify-between bg-white dark:bg-dark-white ">
<div className="w-full px-5 pt-5">
<p className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
{price.price}
</p>
</div>
<div className="month-statics w-full lg:h-[205px] h-full lg:absolute bottom-0 left-0 transform scale-[1.08]">
<PricingListTable
priceDetail={price}
setRGBColor="rgba(242, 153, 74)" />
</div>
</div>
</div>
</div>
</>
))
}
<div className="lg:w-1/3 h-full mb-10 lg:mb-0">
<div className="sell-month-analytic-card w-full h-full rounded-xl overflow-hidden relative">
{/* heading */}
<div className="w-full h-16 bg-gold flex pl-7 items-center">
<h1 className="text-xl font-medium tracking-wide text-white">
Bits this Month
</h1>
</div>
<div className="w-full h-full flex flex-col justify-between bg-white dark:bg-dark-white ">
<div className="w-full px-5 pt-5">
<p className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
769.44 ETH
</p>
<p className="text-thin-light-gray text-18 flex items-center">
<span>($949374.94)</span>
<span className="ml-2 text-sm text-light-red">
-224.75 (11.5%)
</span>
</p>
</div>
<div className="month-statics w-full lg:h-[205px] h-full lg:absolute bottom-0 left-0 transform scale-[1.08]">
<PricingListTable setRGBColor="rgba(242, 153, 74)" />
</div>
</div>
</div>
</div>
<div className="lg:w-1/3 h-full mb-10 lg:mb-0">
<div className="sell-month-analytic-card w-full h-full rounded-xl overflow-hidden relative">
{/* heading */}
<div className="w-full h-16 bg-gold flex pl-7 items-center">
<h1 className="text-xl font-medium tracking-wide text-white">
Bits this Month
</h1>
</div>
<div className="w-full h-full flex flex-col justify-between bg-white dark:bg-dark-white ">
<div className="w-full px-5 pt-5">
<p className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
769.44 ETH
</p>
<p className="text-thin-light-gray text-18 flex items-center">
<span>($949374.94)</span>
<span className="ml-2 text-sm text-light-red">
-224.75 (11.5%)
</span>
</p>
</div>
<div className="month-statics w-full lg:h-[205px] h-full lg:absolute bottom-0 left-0 transform scale-[1.08]">
<PricingListTable setRGBColor="rgba(242, 153, 74)" />
</div>
</div>
</div>
</div>
<div className="lg:w-1/3 h-full mb-10 lg:mb-0">
<div className="sell-month-analytic-card w-full h-full rounded-xl overflow-hidden relative">
{/* heading */}
<div className="w-full h-16 bg-pink flex pl-7 items-center">
<h1 className="text-xl font-medium tracking-wide text-white">
Sell Earing this Month
</h1>
</div>
<div className="w-full h-full flex flex-col justify-between bg-white dark:bg-dark-white ">
<div className="w-full px-5 pt-5">
<p className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
769.44 ETH
</p>
<p className="text-thin-light-gray text-18 flex items-center">
<span>($949374.94)</span>
<span className="ml-2 text-sm text-light-green">
224.75 (11.5%)
</span>
</p>
</div>
<div className="month-statics w-full lg:h-[205px] h-full lg:absolute bottom-0 left-0 transform scale-[1.08]">
<PricingListTable setRGBColor="rgba(245, 57, 248, 1)" />
</div>
</div>
</div>
</div>
</div>
</div>