MyFit/www-myfit
4
0
Fork 0
Code Issues Pull Requests Releases Activity

modified latest blog on blog-single

Browse Source
This commit is contained in:
DESKTOP-QHP1O2H\MIKE
2023-01-19 10:43:59 -05:00
parent 80e8141a11
commit 745cd01429
3 changed files with 69 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/Blog/BlogSingle/Main.js
+65 -21
View File
@@ -5,15 +5,46 @@ import BGImg from "../../../assets/images/bread_crumb_bg.png"
import BGImg1 from "../../../assets/images/bread_crumb_bg_one.png"
import BGImg2 from "../../../assets/images/bread_crumb_bg_two.png"
import { useParams } from "react-router-dom";
import SiteService from "../../../vendors/service/siteService";
const Main = ({brdcum}) => {
const { id } = useParams();
const location = useLocation();
const data = location.state?.data;
console.log("location", location, data);
const [blogData, setBlogData] = useState([]);
const [newAllData, setNewAllData] = useState([]);
useEffect(() => {
getBlogData();
getLatestBlog();
}, [location.state?.data]);
const api = new SiteService();
const data = location.state?.data;
const allData = location.state?.allData;
const getLatestBlog = () =>{
const arrData = [ ...allData ];
const itemIndex = arrData.findIndex(x => x.id === data.id)
arrData.splice(itemIndex, 1);
const newAllData = arrData.splice(0, 3);
setNewAllData(newAllData);
console.log('All data ', arrData, newAllData);
}
const getBlogData = async () => {
try {
const res = await api.blogData();
setBlogData(res.data);
} catch (error) {
console.log("Error from blog data ", error);
}
};
return (
<>
@@ -238,21 +269,34 @@ const Main = ({brdcum}) => {
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy.</p>
</div>
<div className="row">
<div className="col-md-4">
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
<div className="story_img">
<img src="assets/images/story01.png" alt="image" />
<span>45 min ago</span>
</div>
<div className="story_text">
<h3>Cool features added!</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting
industry lorem Ipsum has.</p>
<Link to="#">READ MORE</Link>
</div>
</div>
</div>
<div className="col-md-4">
{newAllData.map((data) => {
return (
<div className="col-md-4">
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
<div className="story_img">
<img src={data.meta_value} alt="image" />
<span>45 min ago</span>
</div>
<div className="story_text">
<h3>{data.post_title}</h3>
<div dangerouslySetInnerHTML={{__html: data.post_content.substring(0,300)+' . . .'}}></div>
<Link to={`/blog-single/${data.id}`} state={{data}}>
READ MORE
</Link>
</div>
</div>
</div>
)})}
{/* <div className="col-md-4">
<div className="story_box" data-aos="fade-up" data-aos-duration="1500">
<div className="story_img">
<img src="assets/images/story02.png" alt="image" />
@@ -277,7 +321,7 @@ const Main = ({brdcum}) => {
<Link to="#">READ MORE</Link>
</div>
</div>
</div>
</div> */}
</div>
</div>
</section>