141 行
5.7 KiB
JavaScript
141 行
5.7 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
import IconButton from '@mui/material/IconButton';
|
|
import axios from 'axios';
|
|
|
|
import Notification from '../../component/notification';
|
|
|
|
const Profile = () => {
|
|
|
|
const [image, setImage] = useState('/assets/img/avatar/avatar-sample03@2x.png');
|
|
|
|
|
|
const profile = {
|
|
id: 1,
|
|
name: '田中 達也',
|
|
tel:'08012927104',
|
|
email:'chankan07@gmail.com',
|
|
company:'株式会社ZOTMAN',
|
|
image:'/assets/img/avatar/avatar-sample03@2x.png'
|
|
}
|
|
|
|
useEffect(
|
|
() => {
|
|
const formdata = new FormData();
|
|
let child_id = 1;
|
|
|
|
// axios.get('/api/meetings/listOfNonApprovalOfChild', {child_id: child_id})
|
|
// .then(response => {
|
|
// if(response.data.status_code==200){
|
|
// // window.location.href = '/register/c-account/complete';
|
|
// }
|
|
// else if(response.data.status_code==400){
|
|
// // window.location.href = '/register/c-account/error';
|
|
// }
|
|
// else if(response.data.status_code==500){
|
|
// // window.location.href = '/unknown-error';
|
|
// }
|
|
// })
|
|
// .catch(err=>console.log(err))
|
|
},[]
|
|
);
|
|
|
|
|
|
const handleImageChange = (e) => {
|
|
|
|
e.preventDefault();
|
|
let reader = new FileReader();
|
|
let _file = e.target.files[0];
|
|
|
|
reader.readAsDataURL(_file);
|
|
|
|
reader.onloadend = () => {
|
|
setImage(reader.result);
|
|
};
|
|
};
|
|
|
|
|
|
return (
|
|
<div className="l-content-w560">
|
|
<div className="l-content__ttl">
|
|
<div className="l-content__ttl__left">
|
|
<h2>プロフィール</h2>
|
|
</div>
|
|
<Notification/>
|
|
</div>
|
|
|
|
<div className="l-content-wrap">
|
|
<section className="profile-container">
|
|
<div className="profile-wrap">
|
|
<div className="profile-content">
|
|
|
|
<div>
|
|
<input type="file" id="avatar" name="avatar" className="d-none" accept=".png, .jpg, .jpeg" onChange={(e) => handleImageChange(e)}/>
|
|
<div className="avatar-wrapper">
|
|
<label htmlFor="avatar" className='avatar-label'>
|
|
<IconButton color="primary" aria-label="upload picture" component="span" className="bg-color-2 shadow-sm">
|
|
<img src="/assets/img/icon/camera.svg" width="16" height="16"/>
|
|
</IconButton>
|
|
</label>
|
|
{
|
|
image &&
|
|
<img src={image} alt="" width ="100%" height="100%" style={{borderRadius:'50%'}}/>
|
|
}
|
|
</div>
|
|
</div>
|
|
<p className="profile-name ft-xs-14">{profile.name}</p>
|
|
<div className="profile-info ft-xs-14">
|
|
<div className="profile-info__item">
|
|
<p className="profile-info__icon">
|
|
<img src="/assets/img/icon/mail.svg" alt="メール"/>
|
|
</p>
|
|
<p className="txt">{profile.email}</p>
|
|
</div>
|
|
<div className="profile-info__item">
|
|
<p className="profile-info__icon">
|
|
<img src="/assets/img/icon/phone.svg" alt="電話"/>
|
|
</p>
|
|
<p className="txt">{profile.tel}</p>
|
|
</div>
|
|
<div className="profile-info__item">
|
|
<p className="profile-info__icon">
|
|
<img src="/assets/img/icon/building.svg" alt="会社名"/>
|
|
</p>
|
|
<p className="txt">{profile.company}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="p-profile-btn">
|
|
<a href={`/c-account/profile/edit/${profile.id}`} className="btn-default btn-yellow btn-profile btn-r8 btn-h52 h-xs-45-px">
|
|
<span className="ft-xs-14">プロフィールを変更する</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div className="p-profile-btn">
|
|
<a href={`/c-account/profile/password-edit/${profile.id}`} className="btn-default btn-yellow btn-password btn-r8 btn-h52 h-xs-45-px">
|
|
<span className="ft-xs-14">パスワードを変更する</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div className="p-profile-txtLink">
|
|
<a href="/login/c-account">
|
|
<span className="ft-xs-14">ログアウト</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div className="p-profile-txtLink">
|
|
<a href="/c-account/profile/withdrawal">
|
|
<span className="ft-xs-14">退会する</span>
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
|
|
export default Profile; |