parent
4de8f441c9
commit
51258aa00b
15 changed files with 791 additions and 18 deletions
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 925 B |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 584 B |
After Width: | Height: | Size: 961 B |
@ -0,0 +1,54 @@ |
|||||||
|
import React from "react"; |
||||||
|
import { connect } from "react-redux"; |
||||||
|
import { Link } from "react-router-dom"; |
||||||
|
|
||||||
|
const Trophy = ({}) => { |
||||||
|
const [dropdown, setDropdown] = React.useState(true); |
||||||
|
return ( |
||||||
|
<div |
||||||
|
className={`w-full flex py-5 px-3 justify-between items-center flex-row bg-yellow4 bg-opacity-40`} |
||||||
|
> |
||||||
|
<div className={`flex flex-row items-center`}> |
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width={23.862} height={23.862}> |
||||||
|
<g fill="none" stroke="#d6d020" data-name="vuesax/linear/cup"> |
||||||
|
<path |
||||||
|
d="M12.08 16.405v2.088" |
||||||
|
strokeLinecap="round" |
||||||
|
strokeLinejoin="round" |
||||||
|
strokeWidth="1.5" |
||||||
|
/> |
||||||
|
<path |
||||||
|
data-name="Vector" |
||||||
|
strokeWidth="1.5" |
||||||
|
d="M7.109 21.874h9.942v-.995a1.994 1.994 0 0 0-1.988-1.988H9.097a1.994 1.994 0 0 0-1.988 1.988v.994Z" |
||||||
|
/> |
||||||
|
<path |
||||||
|
data-name="Vector" |
||||||
|
d="M6.115 21.873h11.931M11.931 15.907a6.955 6.955 0 0 1-6.96-6.959V5.965a3.976 3.976 0 0 1 3.977-3.977h5.965a3.976 3.976 0 0 1 3.977 3.977v2.983a6.955 6.955 0 0 1-6.959 6.959Z" |
||||||
|
strokeLinecap="round" |
||||||
|
strokeLinejoin="round" |
||||||
|
strokeWidth="1.5" |
||||||
|
/> |
||||||
|
<path |
||||||
|
data-name="Vector" |
||||||
|
d="M5.438 11.583a4.831 4.831 0 0 1-1.919-1.193 5.3 5.3 0 0 1-1.491-3.579 2.461 2.461 0 0 1 2.486-2.486h.646a3.734 3.734 0 0 0-.3 1.491v2.983a7.007 7.007 0 0 0 .578 2.784ZM18.423 11.583a4.831 4.831 0 0 0 1.919-1.193 5.3 5.3 0 0 0 1.491-3.579 2.461 2.461 0 0 0-2.485-2.486h-.647a3.734 3.734 0 0 1 .3 1.491v2.983a7.007 7.007 0 0 1-.578 2.784Z" |
||||||
|
strokeLinecap="round" |
||||||
|
strokeLinejoin="round" |
||||||
|
strokeWidth="1.5" |
||||||
|
/> |
||||||
|
</g> |
||||||
|
</svg> |
||||||
|
<strong className="text-sm mr-2.5 text-green4F"> |
||||||
|
{"امتیاز شما" + " " + 14560} |
||||||
|
</strong> |
||||||
|
</div> |
||||||
|
<Link to="#" className="text-sm text-green4F"> |
||||||
|
مشاهده جوایز |
||||||
|
</Link> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
|
|
||||||
|
const mapStateToProps = (state) => ({}); |
||||||
|
|
||||||
|
export default connect(mapStateToProps)(Trophy); |
@ -0,0 +1,72 @@ |
|||||||
|
import React from "react"; |
||||||
|
import { connect } from "react-redux"; |
||||||
|
|
||||||
|
const User = ({ user, mobile }) => { |
||||||
|
const [dropdown, setDropdown] = React.useState(true); |
||||||
|
return ( |
||||||
|
<div className={`w-full`}> |
||||||
|
<button |
||||||
|
className={`w-full mt-2 mb-2 flex flex-row justify-between items-center border-none`} |
||||||
|
onClick={() => setDropdown(!dropdown)} |
||||||
|
> |
||||||
|
<div className={`flex items-center flex-row`}> |
||||||
|
{user?.picFileIds ? ( |
||||||
|
<img |
||||||
|
src={"https://dnvn.ir/api/v1/" + user.picFileIds} |
||||||
|
className={`rounded-full`} |
||||||
|
style={{ width: 70, height: 70 }} |
||||||
|
/> |
||||||
|
) : ( |
||||||
|
<div |
||||||
|
className={"rounded-full"} |
||||||
|
style={{ |
||||||
|
width: 70, |
||||||
|
height: 70, |
||||||
|
backgroundColor: "#ddd", |
||||||
|
}} |
||||||
|
></div> |
||||||
|
)} |
||||||
|
<div className={`flex flex-col mr-1`}> |
||||||
|
<strong className={`text-base font-semibold text-gray1`}> |
||||||
|
{user?.firstName + " " + user?.lastName} |
||||||
|
</strong> |
||||||
|
<span className="mt-2 text-sm text-gray1">{user?.cellphone}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<svg |
||||||
|
xmlns="http://www.w3.org/2000/svg" |
||||||
|
width={24} |
||||||
|
height={24} |
||||||
|
className={`transform ${dropdown ? "rotate-0" : "rotate-180"}`} |
||||||
|
> |
||||||
|
<path |
||||||
|
d="M6.08 15.82h11.84a1.077 1.077 0 0 0 .76-1.84L13.499 8.8a2.131 2.131 0 0 0-3.01 0l-1.97 1.97-3.21 3.21a1.082 1.082 0 0 0 .771 1.84Z" |
||||||
|
fill="#c6c6c6" |
||||||
|
data-name="vuesax/bold/arrow-down" |
||||||
|
/> |
||||||
|
</svg> |
||||||
|
</button> |
||||||
|
<div |
||||||
|
className={`flex w-full pr-16 transition-all overflow-hidden ${ |
||||||
|
dropdown ? "max-h-40" : "max-h-0" |
||||||
|
}`}
|
||||||
|
> |
||||||
|
<div |
||||||
|
className={`flex items-center w-full pb-3 mb-3 flex-row border-b border-solid border-gray-100`} |
||||||
|
> |
||||||
|
<strong className="text-sm text-gray1"> |
||||||
|
افزودن حساب کاربری جدید |
||||||
|
</strong> |
||||||
|
<span className="mr-1 mt-1 text-xl text-gray1">+</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
|
|
||||||
|
const mapStateToProps = (state) => ({ |
||||||
|
user: state.user.status, |
||||||
|
mobile: state.publicApi.mobile, |
||||||
|
}); |
||||||
|
|
||||||
|
export default connect(mapStateToProps)(User); |
@ -1,14 +1,27 @@ |
|||||||
import React from 'react' |
import React, { useState, useEffect } from "react"; |
||||||
import { connect } from 'react-redux' |
|
||||||
|
import { connect } from "react-redux"; |
||||||
|
|
||||||
|
//components
|
||||||
|
import User from "./components/User"; |
||||||
|
import Trophy from "./components/Trophy"; |
||||||
|
import List from "./components/List"; |
||||||
|
|
||||||
|
function Profile({}) { |
||||||
|
|
||||||
|
useEffect(() => {}, []); |
||||||
|
|
||||||
export const Profile = ({}) => { |
|
||||||
return ( |
return ( |
||||||
<div>Profile</div> |
<div> |
||||||
) |
<User /> |
||||||
|
<Trophy /> |
||||||
|
<List /> |
||||||
|
</div> |
||||||
|
); |
||||||
} |
} |
||||||
|
|
||||||
const mapStateToProps = (state) => ({}) |
const mapStateToProps = (state) => ({}); |
||||||
|
|
||||||
const mapDispatchToProps = {} |
const mapDispatchToProps = {}; |
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(Profile) |
export default connect(mapStateToProps, mapDispatchToProps)(Profile); |
Loading…
Reference in new issue