reza connected blog join

temp
Reza_ashrafi 3 years ago
parent da8d17b68c
commit 02511fa550
  1. 2
      src/redux/actions/blog.js
  2. 34
      src/redux/reducers/blog.js
  3. 4
      src/views/Blogs/layouts/Hashtags.js
  4. 44
      src/views/Blogs/layouts/Join.js

@ -8,6 +8,8 @@ const blog = {
await proxy.get("public/blogInfo", data, { dispatch }),
active: (data) => async (dispatch) =>
await dispatch({ type: "public/active", data }),
letterAdd: (data) => async (dispatch) =>
await proxy.post("news/LetterAdd", data, { dispatch }),
};
export default blog;

@ -5,36 +5,7 @@ const initialState = {
error: null,
list: [],
info: null,
hashtags: [
{
title: "فناوری اطلاعات",
color: "#019BC3",
},
{
title: "سخت افزار",
color: "#7CC301",
},
{
title: "آموزشی",
color: "#C5B90C",
},
{
title: "فرهنگی",
color: "#C2684D",
},
{
title: "معرفی کتاب",
color: "#8B4DC2",
},
{
title: "مهارت آموزی",
color: "#780D6D",
},
{
title: "پیشرفت شخصی",
color: "#E63F15",
},
],
hashtags : [],
active: null,
};
export default function blog(state = initialState, action) {
@ -57,6 +28,9 @@ export default function blog(state = initialState, action) {
};
case "public/blogInfo":
return { ...state, loading: false, error: null, blog: data };
case "news/LetterAdd":
toast.success('.به خبرنامه دانوین خوش آمدید');
return { ...state, loading: false, error: null };
case "blog/loading":
return { ...state, loading: true };
case "blog/error":

@ -10,8 +10,8 @@ export const Hashtags = ({ hashtags }) => {
<img src={arrowIcon} alt="" className="w-7" />
<ul className="list-none flex justify-around items-center lg:flex-1 lg:ml-0 ml-4">
{hashtags.map((hashtag, index) => (
<li className="text-tiny font-semibold cursor-pointer w-32 lg:px-0 flex-1 lg:w-auto">
{"#" + " " + hashtag}
<li className="text-tiny font-semibold cursor-pointer mx-4 lg:px-0 flex-1">
{hashtag}
</li>
))}
</ul>

@ -1,10 +1,17 @@
import React from "react";
import { connect } from "react-redux";
import { blog } from "../../../redux/actions";
//assets
import picImage from "../pic.svg";
export const Join = ({ isMobile }) => {
export const Join = ({ isMobile, join, userId }) => {
const [email, setEmail] = React.useState("");
const submit = (e) => {
e.preventDefault();
userId ? join({ userId, email }) : join({ email });
};
return (
<div className="w-full lg:h-72 border-2 px-3 lg:p-0 py-4 border-solid border-gray-200 dark:border-opacity-30 rounded-md flex lg:flex-row flex-col-reverse mt-7 lg:mt-32">
<img
@ -12,22 +19,29 @@ export const Join = ({ isMobile }) => {
alt=""
style={{
height: isMobile ? "calc(100vw / 2.5)" : "115%",
transform: isMobile ? "translateY(15%) translateX(25%)" : "translateY(-15%)",
transform: isMobile
? "translateY(15%) translateX(25%)"
: "translateY(-15%)",
}}
/>
{isMobile && (
<div className="flex lg:hidden flex-col flex-1 h-full justify-center items-center">
<form className="flex flex-col w-full rounded-md mt-3 overflow-hidden">
<form
className="flex flex-col w-full rounded-md mt-3 overflow-hidden"
onSubmit={(e) => submit(e)}
>
<input
type="text"
className="flex-1 text-center py-3 mb-4 font-normal text-tiny dark:bg-transparent placeholder:text-blue5F dark:text-white border border-gray-300 border-solid outline-none"
placeholder={"آدرس ایمیل شما"}
value={email}
onChange={(e) => setEmail(e.target.value)}
/>
<button
className={
"py-3 w-full text-base bg-yellow4 text-black border-none"
}
// onClick={setOff}
type="submit"
>
عضویت
</button>
@ -35,30 +49,41 @@ export const Join = ({ isMobile }) => {
</div>
)}
<div className="flex flex-col justify-center h-full my-4 lg:my-0 lg:mr-4">
<strong className="text-base lg:text-2xl bold dark:text-gray-200">اینجا خبری از اسپم نیست!</strong>
<strong className="text-base lg:text-2xl bold dark:text-gray-200">
اینجا خبری از اسپم نیست!
</strong>
<strong
className="text-xl lg:text-7xl bold my-4 text-red-600"
style={{ fontSize: "clamp(30px, calc(100vw / 35), 45px)" }}
>
خبرنامه وبلاگ دانوین
</strong>
<p className="text-tiny lg:text-tiny leading-5 lg:leading-7 text-gray70 dark:text-gray-200" style={{ maxWidth: 400 }}>
<p
className="text-tiny lg:text-tiny leading-5 lg:leading-7 text-gray70 dark:text-gray-200"
style={{ maxWidth: 400 }}
>
بهترین و آخرین اخبار علمی و آموزشی را در ایمیل خودتون دریافت کنید. هر
زمان هم که لازم نداشتید می تونید عضویت رو لغو کنید
</p>
</div>
{!isMobile && (
<div className="hidden lg:flex flex-col flex-1 h-full justify-center items-center">
<form className="flex w-full flex-row-reverse rounded-md mt-3 overflow-hidden lg:w-11/12">
<form
className="flex w-full flex-row-reverse rounded-md mt-3 overflow-hidden lg:w-11/12"
onSubmit={(e) => submit(e)}
>
<input
type="text"
className="flex-1 text-left pl-6 font-normal text-tiny dark:bg-gray2077 placeholder:text-blue5F dark:text-white border-t border-b border-l border-gray-300 border-solid outline-none lg:text-base"
placeholder={"آدرس ایمیل شما"}
value={email}
onChange={(e) => setEmail(e.target.value)}
/>
<button
className={
"py-3 w-3/12 lg:py-6 text-lg bg-yellow4 text-black border-none lg:font-semibold"
}
type="submit"
// onClick={setOff}
>
عضویت
@ -72,8 +97,11 @@ export const Join = ({ isMobile }) => {
const mapStateToProps = (state) => ({
isMobile: state.publicApi.isMobile,
userId: state.user.status?.id,
});
const mapDispatchToProps = {};
const mapDispatchToProps = {
join: blog.letterAdd,
};
export default connect(mapStateToProps, mapDispatchToProps)(Join);

Loading…
Cancel
Save