admin components.
このコミットが含まれているのは:
dragon1211
コミット
58bd099ca2
|
|
@ -35,7 +35,7 @@ class ChildFactory extends Factory
|
|||
'password' => Hash::make('password'),
|
||||
'last_name' => $this->faker->lastName,
|
||||
'first_name' => $this->faker->firstName,
|
||||
'image' => $this->faker->imageUrl,
|
||||
'image' => "/assets/img/avatar/avatar-sample02@2x.png",
|
||||
'company' => $this->faker->company,
|
||||
'created_at' => $this->faker->dateTime,
|
||||
'updated_at' => $this->faker->dateTime,
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ class MeetingImageFactory extends Factory
|
|||
{
|
||||
return [
|
||||
'meeting_id' => 1,
|
||||
'image' => $this->faker->url,
|
||||
'image' => "/assets/img/avatar/avatar-sample02@2x.png",
|
||||
'created_at' => $this->faker->dateTime,
|
||||
'updated_at' => $this->faker->dateTime,
|
||||
];
|
||||
|
|
|
|||
ファイル差分が大きすぎるため省略します
差分を読み込み
|
|
@ -7,6 +7,8 @@ import { LoadingButton } from '@material-ui/lab';
|
|||
|
||||
import { CircularProgress } from '@material-ui/core';
|
||||
import Alert from '../../component/alert';
|
||||
import ModalPdf from '../../component/admin/pdf_modal_admin';
|
||||
import ModalMemo from '../../component/admin/modal_memo';
|
||||
|
||||
import Button from '@mui/material/Button';
|
||||
import Dialog from '@mui/material/Dialog';
|
||||
|
|
@ -16,6 +18,8 @@ import DialogContentText from '@mui/material/DialogContentText';
|
|||
import DialogTitle from '@mui/material/DialogTitle';
|
||||
import Slide from '@mui/material/Slide';
|
||||
|
||||
|
||||
|
||||
const Transition = React.forwardRef(function Transition(props, ref) {
|
||||
return <Slide direction="up" ref={ref} {...props} />;
|
||||
});
|
||||
|
|
@ -32,6 +36,11 @@ const MeetingDetail = (props) => {
|
|||
|
||||
const [_400error, set400Error] = useState('');
|
||||
const [_success, setSuccess] = useState('');
|
||||
|
||||
const [showPdf, setShowPdf] = useState(false);
|
||||
const [showMemo, setShowMemo] = useState(false);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
setLoaded(false);
|
||||
|
|
@ -42,7 +51,18 @@ const MeetingDetail = (props) => {
|
|||
setLoaded(true);
|
||||
if(response.data.status_code==200){
|
||||
console.log(response.data.params);
|
||||
setMeeting(response.data.params[0]);
|
||||
|
||||
var list = response.data.params[0];
|
||||
var total=0, num=0;
|
||||
if(list.approval){
|
||||
for(var i in list.approval)
|
||||
{
|
||||
if(list.approval[i].approval_at) num ++;
|
||||
total ++;
|
||||
}
|
||||
}
|
||||
setMeeting({...list, denominator:total, numerator:num});
|
||||
|
||||
} else if(response.data.status_code==400){
|
||||
//TODO
|
||||
}
|
||||
|
|
@ -88,7 +108,6 @@ const MeetingDetail = (props) => {
|
|||
<div className="l-content-wrap">
|
||||
<div className="p-article">
|
||||
<div className="p-article-wrap position-relative" style={{ minHeight:'500px'}}>
|
||||
|
||||
{
|
||||
!loaded &&
|
||||
<CircularProgress color="secondary" style={{top:'150px', left:'calc(50% - 22px)', color:'green', position:'absolute'}}/>
|
||||
|
|
@ -97,101 +116,105 @@ const MeetingDetail = (props) => {
|
|||
loaded &&
|
||||
(
|
||||
meeting ?
|
||||
<article className="p-article__body">
|
||||
<div className="p-article__content">
|
||||
<div className="meeting-member">
|
||||
<div className="meeting-member-wrap">
|
||||
<div data-url="login.html" className="meeting-member-link">
|
||||
<ul className="meeting-member-count">
|
||||
<li className="numerator">3</li>
|
||||
<li className="denominator">4</li>
|
||||
</ul>
|
||||
|
||||
<ul className="meeting-member-list" role="list">
|
||||
<li className="meeting-member__item" role="listitem">
|
||||
<div className="avatar">
|
||||
<img alt="name" className="avatar-img" src="/assets/img/avatar/avatar-sample01@2x.png" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="meeting-member__item" role="listitem">
|
||||
<div className="avatar">
|
||||
<img alt="name" className="avatar-img" src="/assets/img/avatar/avatar-sample02@2x.png" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="meeting-member__item" role="listitem">
|
||||
<div className="avatar">
|
||||
<img alt="name" className="avatar-img" src="/assets/img/avatar/avatar-sample03@2x.png" />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<article className="p-article__body">
|
||||
<div className="p-article__content">
|
||||
<div className="meeting-member">
|
||||
<div className="meeting-member-wrap">
|
||||
<div data-url="login.html" className="meeting-member-link">
|
||||
<ul className="meeting-member-count">
|
||||
<li className="numerator">{meeting.numerator}</li>
|
||||
<li className="denominator">{meeting.denominator}</li>
|
||||
</ul>
|
||||
|
||||
<ul className="meeting-member-list" role="list">
|
||||
{
|
||||
meeting.approval?.map((x, k)=>
|
||||
<li className="meeting-member__item" role="listitem" key={k}>
|
||||
<div className="avatar">
|
||||
<img alt="name" className="avatar-img" src={x.child.image} />
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
}
|
||||
</ul>
|
||||
|
||||
<div className="meeting-member__read">
|
||||
<p>3人既読</p>
|
||||
<div className="meeting-member__read">
|
||||
<p>{`${meeting.numerator}人既読`}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h3 className="meeting-ttl">{ meeting.title }</h3>
|
||||
<time dateTime="2021-07-30" className="meeting-time">
|
||||
<span className="meeting-date">{ moment(meeting.updated_at).format('YYYY/MM/DD') || '' }</span>
|
||||
</time>
|
||||
<ul className="p-article-btn-list">
|
||||
<li className="p-article__pdf__btn">
|
||||
<a
|
||||
onClick={e => {
|
||||
e.preventDefault();
|
||||
history.push({
|
||||
pathname: `/admin/meeting/edit/${props.match.params?.meeting_id}`,
|
||||
state: {}
|
||||
});
|
||||
}}
|
||||
className="btn-default btn-yellow btn-pdf btn-r8 btn-h48">
|
||||
編集
|
||||
</a>
|
||||
</li>
|
||||
<li className="p-article__pdf__btn mr-0">
|
||||
<a onClick={openModal} className="btn-default btn-yellow btn-pdf btn-r8 btn-h48">削除</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="p-article__context">
|
||||
|
||||
<div className="p-file-list">
|
||||
<div className="p-file-for">
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
</div>
|
||||
<div className="p-file-nav">
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="p-article__pdf">
|
||||
<div className="p-article__pdf__btn">
|
||||
<a data-v-ade1d018="" className="btn-default btn-yellow btn-pdf btn-r8 btn-h52">
|
||||
<span>PDFを確認する</span>
|
||||
<h3 className="meeting-ttl">{ meeting.title }</h3>
|
||||
<time dateTime="2021-07-30" className="meeting-time">
|
||||
<span className="meeting-date">{ moment(meeting.updated_at).format('YYYY/MM/DD') || '' }</span>
|
||||
</time>
|
||||
<ul className="p-article-btn-list">
|
||||
<li className="p-article__pdf__btn">
|
||||
<a
|
||||
onClick={e => {
|
||||
e.preventDefault();
|
||||
history.push({
|
||||
pathname: `/admin/meeting/edit/${props.match.params?.meeting_id}`,
|
||||
state: {}
|
||||
});
|
||||
}}
|
||||
className="btn-default btn-yellow btn-pdf btn-r8 btn-h48">
|
||||
編集
|
||||
</a>
|
||||
</li>
|
||||
<li className="p-article__pdf__btn mr-0">
|
||||
<a onClick={openModal} className="btn-default btn-yellow btn-pdf btn-r8 btn-h48">削除</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="p-article__context">
|
||||
|
||||
<div className="p-file-list">
|
||||
<div className="p-file-for">
|
||||
{
|
||||
meeting.meeting_image[0] &&
|
||||
<figure><img src={meeting.meeting_image[0].image} alt={meeting.meeting_image[0].image} /></figure>
|
||||
}
|
||||
</div>
|
||||
<div className="p-file-nav">
|
||||
{
|
||||
meeting.meeting_image?.map((x, k)=>
|
||||
<figure key={k}><img src={x.image} alt={x.image} /></figure>
|
||||
)
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" aria-label="お気に入り" data-tooltip="お気に入り" aria-pressed="false" className="icon a-icon text-icon icon-text icon-star-wrap a-icon-size_medium" style={{border:'1px solid #f0de00'}}>
|
||||
</button>
|
||||
|
||||
<div className="p-article__pdf">
|
||||
<div className="p-article__pdf__btn">
|
||||
<a data-v-ade1d018="" className="btn-default btn-yellow btn-pdf btn-r8 btn-h52" onClick={e=>setShowPdf(true)}>
|
||||
<span>PDFを確認する</span>
|
||||
</a>
|
||||
</div>
|
||||
<button type="button"
|
||||
aria-label="お気に入り" data-tooltip="お気に入り"
|
||||
aria-pressed="false"
|
||||
className="icon a-icon text-icon icon-text icon-star-wrap a-icon-size_medium"
|
||||
style={{border:'1px solid #f0de00'}}
|
||||
onClick = {()=>setShowMemo(true)} />
|
||||
</div>
|
||||
|
||||
<p className="p-article__txt">{ meeting.text }</p>
|
||||
</div>
|
||||
|
||||
<p className="p-article__txt">{ meeting.text }</p>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
: <p className="text-center pt-5">データが存在していません。</p>
|
||||
<ModalMemo
|
||||
show={showMemo}
|
||||
title={"メモ"}
|
||||
content={meeting?.memo}
|
||||
handleClose={()=>setShowMemo(false)}
|
||||
/>
|
||||
<ModalPdf
|
||||
show={showPdf}
|
||||
pdfPath={meeting.pdf ?? '/pdf/test.pdf'}
|
||||
handleClose={()=>setShowPdf(false)}
|
||||
/>
|
||||
</article>
|
||||
: <p className="text-center pt-5">データが存在していません。</p>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -199,12 +222,6 @@ const MeetingDetail = (props) => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <ModalConfirm
|
||||
show={show}
|
||||
message={"本当に削除しても\nよろしいでしょうか？"}
|
||||
handleClose={handleClose}
|
||||
handleAccept={handleAccept}
|
||||
/> */}
|
||||
<Dialog
|
||||
open={open}
|
||||
TransitionComponent={Transition}
|
||||
|
|
@ -212,7 +229,7 @@ const MeetingDetail = (props) => {
|
|||
aria-describedby="alert-dialog-slide-description"
|
||||
>
|
||||
<DialogContent style={{width:'290px', padding:'25px 10px 10px 10px'}}>
|
||||
<DialogContentText id="alert-dialog-slide-description" style={{fontSize:'16px', textAlign:'center'}}>
|
||||
<DialogContentText id="alert-dialog-slide-description" style={{fontSize:'20px', textAlign:'center'}}>
|
||||
本当に削除しても<br/>よろしいでしょうか？
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
|
|
@ -220,14 +237,14 @@ const MeetingDetail = (props) => {
|
|||
<Button
|
||||
onClick={closeModal}
|
||||
size="large"
|
||||
style={{fontSize:'16px'}}>いいえ</Button>
|
||||
style={{fontSize:'20px'}}>いいえ</Button>
|
||||
|
||||
<LoadingButton
|
||||
variant="text"
|
||||
onClick={handleAccept}
|
||||
loading={submit}
|
||||
size="large"
|
||||
style={{fontSize:'16px'}}>はい</LoadingButton>
|
||||
style={{fontSize:'20px'}}>はい</LoadingButton>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{
|
||||
|
|
|
|||
|
|
@ -1,24 +1,33 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import axios from 'axios';
|
||||
|
||||
import { CircularProgress } from '@material-ui/core';
|
||||
|
||||
|
||||
const MeetingEdit = (props) => {
|
||||
const [meeting, setMeeting] = useState(null);
|
||||
const [title, setTitle] = useState(null);
|
||||
const [memo, setMemo] = useState(null);
|
||||
const [text, setText] = useState(null);
|
||||
const fatherId = document.getElementById('father_id').value;
|
||||
const [title, setTitle] = useState('');
|
||||
const [memo, setMemo] = useState('');
|
||||
const [text, setText] = useState('');
|
||||
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
axios.get(`/api/admin/meetings/detail/${props.match.params?.id}`, {params: { father_id: 1 }}).then((response) => {
|
||||
if(response.data.status_code==200){
|
||||
console.log(response.data.params[0]);
|
||||
setMeeting(response.data.params[0]);
|
||||
setTitle(response.data.params[0]?.title);
|
||||
setMemo(response.data.params[0]?.memo);
|
||||
setText(response.data.params[0]?.text);
|
||||
} else if(response.data.status_code==400){
|
||||
//TODO
|
||||
}
|
||||
|
||||
setLoaded(false);
|
||||
|
||||
axios.get(`/api/admin/meetings/detail/${props.match.params?.meeting_id}`, {params: { father_id: 1 }})
|
||||
.then((response) => {
|
||||
setLoaded(true);
|
||||
if(response.data.status_code==200){
|
||||
console.log(response.data.params[0]);
|
||||
setMeeting(response.data.params[0]);
|
||||
setTitle(response.data.params[0]?.title);
|
||||
setMemo(response.data.params[0]?.memo);
|
||||
setText(response.data.params[0]?.text);
|
||||
} else if(response.data.status_code==400){
|
||||
//TODO
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
|
||||
|
|
@ -56,114 +65,116 @@ const MeetingEdit = (props) => {
|
|||
console.log('error', error);
|
||||
}
|
||||
}
|
||||
if (!meeting) return null;
|
||||
|
||||
|
||||
return (
|
||||
<div className="l-content">
|
||||
<div className="l-content__ttl">
|
||||
<div className="l-content__ttl__left">
|
||||
<h2>ミーティング作成</h2>
|
||||
</div>
|
||||
<div className="p-notification">
|
||||
<div className="p-notification-icon">
|
||||
<div className="p-notification-icon-wrap">
|
||||
<div className="count">1</div>
|
||||
<div className="p-notification-icon-bg"></div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22.742 19.855" className="icon svg-icon svg-fill svg-y50" ><g fill="none" stroke="#080808" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" data-name="Icon feather-alert-triangle" transform="translate(0.777 0.75)"><path d="M11.188,5.322,2.6,19.659A2.028,2.028,0,0,0,4.334,22.7H21.51a2.028,2.028,0,0,0,1.734-3.042L14.656,5.322a2.028,2.028,0,0,0-3.468,0Z" data-name="パス 3" transform="translate(-2.328 -4.346)"/><path d="M18,13.5v6.91" data-name="パス 4" transform="translate(-7.406 -8.547)"/><path d="M18,25.5h0" data-name="パス 5" transform="translate(-7.406 -11.2)"/></g></svg>
|
||||
<div className="l-content-w560">
|
||||
<div className="l-content__ttl">
|
||||
<div className="l-content__ttl__left">
|
||||
<h2>ミーティング編集</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="l-content-wrap">
|
||||
<div className="p-article">
|
||||
<div className="p-article-wrap">
|
||||
<article className="p-article__body">
|
||||
<div className="p-article__content">
|
||||
<div className="p-article__context">
|
||||
<form action="" className="edit-form">
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="title">タイトル</label>
|
||||
<input type="text" name="title" value={ title } onChange={e=>setTitle(e.target.value)} className="input-default input-title input-h60 input-w480" id="title" />
|
||||
|
||||
<div className="l-content-wrap">
|
||||
<div className="p-article">
|
||||
<div className="p-article-wrap position-relative" style={{ minHeight:'500px'}}>
|
||||
{
|
||||
!loaded &&
|
||||
<CircularProgress color="secondary" style={{top:'150px', left:'calc(50% - 22px)', color:'green', position:'absolute'}}/>
|
||||
}
|
||||
{
|
||||
loaded &&
|
||||
<article className="p-article__body">
|
||||
<div className="p-article__content">
|
||||
<div className="p-article__context">
|
||||
<form action="" className="edit-form">
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="title">タイトル</label>
|
||||
<input type="text" name="title" value={ title } onChange={e=>setTitle(e.target.value)} className="input-default input-title input-h60 input-w480" id="title" />
|
||||
</div>
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="meeting_textarea">本文</label>
|
||||
<textarea value={ text } onChange={e=>setText(e.target.value)} rows="8" className="textarea-default" id="meeting_textarea" />
|
||||
</div>
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="meeting_textarea">メモ</label>
|
||||
<textarea value={ memo } onChange={e=>setMemo(e.target.value)} rows="8" className="textarea-default" id="meeting_textarea" />
|
||||
</div>
|
||||
<div className="edit-set edit-set-mt15">
|
||||
<label className="edit-set-file-label" htmlFor="file_pdf">
|
||||
PDFアップロード
|
||||
<input type="file" name="file_pdf" accept=".pdf" id="file_pdf" />
|
||||
</label>
|
||||
</div>
|
||||
<div className="edit-set edit-set-mt15">
|
||||
<label className="edit-set-file-label" htmlFor="file_image">
|
||||
画像アップロード
|
||||
<input type="file" name="file_image" accept=".png, .jpg, .jpeg" id="file_image" />
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="p-file-image">
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
</div>
|
||||
|
||||
<div className="edit-set edit-set-send">
|
||||
<label htmlFor="allmember_send">
|
||||
<input className="boolean optional" type="checkbox" name="allmember_send" id="allmember_send" />全員に送信</label>
|
||||
</div>
|
||||
|
||||
<div className="edit-set-mt5 edit-set-send">
|
||||
<label htmlFor="pickup_send">
|
||||
<input className="boolean optional" type="checkbox" name="pickup_send" id="pickup_send" />選んで送信</label>
|
||||
</div>
|
||||
|
||||
<div className="checkbox-wrap edit-bg">
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name01">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name01" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name02">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name02" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name03">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name03" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name04">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name04" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name05">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name05" />田中 達也</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={e => {
|
||||
e.preventDefault();
|
||||
handleClick();
|
||||
}}
|
||||
className="btn-edit btn-default btn-h70 btn-r14 btn-yellow">ミーティングを更新</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="meeting_textarea">本文</label>
|
||||
<textarea value={ text } onChange={e=>setText(e.target.value)} rows="8" className="textarea-default" id="meeting_textarea" />
|
||||
</div>
|
||||
<div className="edit-set">
|
||||
<label className="control-label" htmlFor="meeting_textarea">メモ</label>
|
||||
<textarea value={ memo } onChange={e=>setMemo(e.target.value)} rows="8" className="textarea-default" id="meeting_textarea" />
|
||||
</div>
|
||||
<div className="edit-set edit-set-mt15">
|
||||
<label className="edit-set-file-label" htmlFor="file_pdf">
|
||||
PDFアップロード
|
||||
<input type="file" name="file_pdf" accept=".pdf" id="file_pdf" />
|
||||
</label>
|
||||
</div>
|
||||
<div className="edit-set edit-set-mt15">
|
||||
<label className="edit-set-file-label" htmlFor="file_image">
|
||||
画像アップロード
|
||||
<input type="file" name="file_image" accept=".png, .jpg, .jpeg" id="file_image" />
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="p-file-image">
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy01.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy02.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy03.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy04.jpg" alt="" /></figure>
|
||||
<figure className="image-upload"><img src="../../../assets/img/dummy/post-dummy05.jpg" alt="" /></figure>
|
||||
</div>
|
||||
|
||||
<div className="edit-set edit-set-send">
|
||||
<label htmlFor="allmember_send">
|
||||
<input className="boolean optional" type="checkbox" name="allmember_send" id="allmember_send" />全員に送信</label>
|
||||
</div>
|
||||
|
||||
<div className="edit-set-mt5 edit-set-send">
|
||||
<label htmlFor="pickup_send">
|
||||
<input className="boolean optional" type="checkbox" name="pickup_send" id="pickup_send" />選んで送信</label>
|
||||
</div>
|
||||
|
||||
<div className="checkbox-wrap edit-bg">
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name01">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name01" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name02">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name02" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name03">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name03" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name04">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name04" />田中 達也</label>
|
||||
</div>
|
||||
<div className="checkbox">
|
||||
<label htmlFor="user_name05">
|
||||
<input className="boolean optional" type="checkbox" name="chk[]" id="user_name05" />田中 達也</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={e => {
|
||||
e.preventDefault();
|
||||
handleClick();
|
||||
}}
|
||||
className="btn-edit btn-default btn-h70 btn-r14 btn-yellow">ミーティングを更新</button>
|
||||
</form>
|
||||
</div>
|
||||
</article>
|
||||
}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -126,7 +126,7 @@ const Meeting = () => {
|
|||
<div className={ `meeting-content-wrap ${!finish ? "is-active" : ""}` } id="item01">
|
||||
{
|
||||
!loaded &&
|
||||
<CircularProgress color="secondary" style={{ left:'calc(50% - 22px)', color:'green', position:'absolute'}}/>
|
||||
<CircularProgress color="secondary" style={{top:'20px', left:'calc(50% - 22px)', color:'green', position:'absolute'}}/>
|
||||
}
|
||||
{
|
||||
loaded &&
|
||||
|
|
|
|||
|
|
@ -0,0 +1,39 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import PDFViewer from "./pdf_page_admin";
|
||||
import { makeStyles } from '@material-ui/styles';
|
||||
|
||||
import Button from '@mui/material/Button';
|
||||
import Dialog from '@mui/material/Dialog';
|
||||
import DialogActions from '@mui/material/DialogActions';
|
||||
import DialogContent from '@mui/material/DialogContent';
|
||||
import DialogContentText from '@mui/material/DialogContentText';
|
||||
import DialogTitle from '@mui/material/DialogTitle';
|
||||
import Slide from '@mui/material/Slide';
|
||||
|
||||
const Transition = React.forwardRef(function Transition(props, ref) {
|
||||
return <Slide direction="up" ref={ref} {...props} />;
|
||||
});
|
||||
|
||||
|
||||
export default function ModalMemo({ show, content, handleClose }){
|
||||
return (
|
||||
<Dialog
|
||||
open={show}
|
||||
TransitionComponent={Transition}
|
||||
keepMounted
|
||||
aria-describedby="alert-dialog-slide-description"
|
||||
onClose={handleClose}
|
||||
>
|
||||
<DialogTitle style={{fontSize:'22px', textAlign:'center', padding:'20px 10px', borderBottom:'1px solid #e0e0e0'}}>{"メモ"}</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText id="alert-dialog-slide-description" style={{fontSize:'20px', minHeight:'200px', padding:'20px'}}>
|
||||
{content}
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} style={{fontSize:'18px', color:'black'}}>閉じる</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import PDFViewer from "./pdf_page_admin";
|
||||
import { makeStyles } from '@material-ui/styles';
|
||||
|
||||
import Button from '@mui/material/Button';
|
||||
import Dialog from '@mui/material/Dialog';
|
||||
import DialogActions from '@mui/material/DialogActions';
|
||||
import DialogContent from '@mui/material/DialogContent';
|
||||
import DialogContentText from '@mui/material/DialogContentText';
|
||||
import DialogTitle from '@mui/material/DialogTitle';
|
||||
import Slide from '@mui/material/Slide';
|
||||
|
||||
const Transition = React.forwardRef(function Transition(props, ref) {
|
||||
return <Slide direction="up" ref={ref} {...props} />;
|
||||
});
|
||||
|
||||
|
||||
export default function ModalPdf({ show, pdfPath, handleClose }){
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={show}
|
||||
TransitionComponent={Transition}
|
||||
keepMounted
|
||||
aria-describedby="alert-dialog-slide-description"
|
||||
onClose={handleClose}
|
||||
>
|
||||
<DialogContent>
|
||||
<DialogContentText id="alert-dialog-slide-description" style={{fontSize:'20px', minHeight:'200px', padding:'20px'}}>
|
||||
{show && <PDFViewer pdf={pdfPath} /> }
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button onClick={handleClose} style={{fontSize:'18px', color:'black'}}>閉じる</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
import React, { useState } from "react";
|
||||
import { Document, Page, pdfjs } from "react-pdf";
|
||||
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
|
||||
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
|
||||
import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
|
||||
import Container from '@mui/material/Container';
|
||||
|
||||
export default function PDFViewer(props) {
|
||||
const [numPages, setNumPages] = useState(null);
|
||||
const [pageNumber, setPageNumber] = useState(1); //default fisrt page
|
||||
|
||||
function onDocumentLoadSuccess({ numPages }) {
|
||||
setNumPages(numPages);
|
||||
setPageNumber(1);
|
||||
}
|
||||
|
||||
function changePage(offset) {
|
||||
setPageNumber(prevPageNumber => prevPageNumber + offset);
|
||||
}
|
||||
|
||||
function previousPage() {
|
||||
changePage(-1);
|
||||
}
|
||||
|
||||
function nextPage() {
|
||||
changePage(1);
|
||||
}
|
||||
|
||||
const { pdf } = props;
|
||||
|
||||
return (
|
||||
<Container>
|
||||
<Document
|
||||
file={pdf}
|
||||
onLoadSuccess={onDocumentLoadSuccess}
|
||||
>
|
||||
<Page pageNumber={pageNumber} />
|
||||
</Document>
|
||||
<Container className="d-flex justify-content-center">
|
||||
<IconButton
|
||||
type="button"
|
||||
disabled={pageNumber <= 1}
|
||||
onClick={previousPage}
|
||||
variant="contained"
|
||||
>
|
||||
<ArrowBackIosIcon/>
|
||||
</IconButton>
|
||||
{pageNumber || (numPages ? 1 : "--")} of {numPages || "--"}
|
||||
<IconButton
|
||||
type="button"
|
||||
disabled={pageNumber >= numPages}
|
||||
onClick={nextPage}
|
||||
>
|
||||
<ArrowForwardIosIcon/>
|
||||
</IconButton>
|
||||
</Container>
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
|
@ -162,4 +162,4 @@
|
|||
|
||||
input:-internal-autofill-selected {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
新しいイシューから参照