MieuxVoter
/
mvfront-react
mirror of https://github.com/MieuxVoter/mvfront-react
4
1
Fork 0
Code Issues Releases Wiki Polls Activity

debug:

Browse Source
pull/84/head
jimmys-box 2 years ago
parent 61e327c729
commit 88329fb886
1 changed files with 140 additions and 134 deletions
Show Stats Download Patch File Download Diff File

274
components/form/ConfirmModal.jsx
Unescape View File

@ -1,5 +1,6 @@
import { useTranslation } from "next-i18next"; import { useTranslation } from "next-i18next";
import { useState } from "react"; import { useState } from "react";
import Footer from "@components/layouts/Footer";
import TrashButton from "./TrashButton"; import TrashButton from "./TrashButton";
import { import {
faExclamationTriangle, faExclamationTriangle,
@ -49,7 +50,8 @@ const ConfirmModal = ({ CreateElection, handleRestrictResultCheck, handleIsTimeL
{i}h00 {i}h00
</option> </option>
)); ));
console.log(isTimeLimited);
return ( return (
<div className="input-group-append"> <div className="input-group-append">
<Button onClick={toggle} <Button onClick={toggle}
@ -101,7 +103,7 @@ console.log(isTimeLimited);
</Row> </Row>
<Row> <Row>
<div className="p-2 pl-3 pr-3 mb-3 recap-vote-question">{title}</div> <div className="p-2 pl-3 pr-3 mb-3 recap-vote-question">{title}</div>
</Row> </Row>
</Col> </Col>
<hr className="confirmation-divider" /> <hr className="confirmation-divider" />
@ -149,7 +151,7 @@ console.log(isTimeLimited);
name="restrict_result" name="restrict_result"
id="restrict_result_false" id="restrict_result_false"
onClick={handleRestrictResultCheck} onClick={handleRestrictResultCheck}
value="0" value="0"
/> />
<label htmlFor="restrict_result_false" /> <label htmlFor="restrict_result_false" />
@ -185,117 +187,119 @@ console.log(isTimeLimited);
</div> </div>
</div> */} </div> */}
<hr className="confirmation-divider-mobile" /> <hr className="confirmation-divider-mobile" />
<Row className="row-label px-3 py-2 m-0">
<Col xs="10" className="p-0 m-0"> <Row className="row-label px-3 py-2 m-0">
<Label htmlFor="title" className="m-0">{t("Voting time")}</Label>
<Col xs="10" className="p-0 m-0">
<Label htmlFor="title" className="m-0">{t("Voting time")}</Label>
</Col>
<Col l xs="2">
<div className="radio-group">
<input
className="radio"
type="radio"
name="time_limited"
id="is_time_limited_false"
onClick={handleIsTimeLimited}
value="0"
/>
<label htmlFor="is_time_limited_false" />
<input
className="radio"
type="radio"
name="time_limited"
id="is_time_limited_true"
onClick={handleIsTimeLimited}
checked={isTimeLimited}
value="1"
/>
<label htmlFor="is_time_limited_true" />
<div className="radio-switch"></div>
</div>
</Col>
</Row>
<div
className={
(isTimeLimited ? "d-block " : "d-none")
}
>
<Row className="displayNone date">
<Col xs="12" md="5" lg="5">
<span className="label">- {t("Starting date")}</span>
</Col> </Col>
<Col l xs="2"> <Col xs="12" md="12" lg="6">
<div className="radio-group"> <input
<input className="form-control"
className="radio" type="date"
type="radio" value={dateToISO(start)}
name="time_limited" onChange={(e) => {
id="is_time_limited_false" setStart(
onClick={handleIsTimeLimited} new Date(
value="0" timeMinusDate(start) +
/> new Date(e.target.valueAsNumber).getTime()
<label htmlFor="is_time_limited_false" /> )
<input );
className="radio" }}
type="radio" />
name="time_limited"
id="is_time_limited_true"
onClick={handleIsTimeLimited}
checked={isTimeLimited}
value="1"
/>
<label htmlFor="is_time_limited_true" />
<div className="radio-switch"></div>
</div>
</Col> </Col>
<Col xs="12" md="12" lg="6">
</Row> <select
<div className="form-control"
className={ value={getOnlyValidDate(start).getHours()}
(isTimeLimited ? "d-block " : "d-none") onChange={(e) =>
} setStart(
> new Date(
<Row className="displayNone date"> dateMinusTime(start).getTime() +
<Col xs="12" md="5" lg="5"> e.target.value * 3600000
<span className="label">- {t("Starting date")}</span>
</Col>
<Col xs="12" md="12" lg="6">
<input
className="form-control"
type="date"
value={dateToISO(start)}
onChange={(e) => {
setStart(
new Date(
timeMinusDate(start) +
new Date(e.target.valueAsNumber).getTime()
)
);
}}
/>
</Col>
<Col xs="12" md="12" lg="6">
<select
className="form-control"
value={getOnlyValidDate(start).getHours()}
onChange={(e) =>
setStart(
new Date(
dateMinusTime(start).getTime() +
e.target.value * 3600000
)
) )
} )
> }
{displayClockOptions()} >
</select> {displayClockOptions()}
</Col> </select>
</Row> </Col>
</Row>
<Row className="mt-2"> <Row className="">
<Col xs="12" md="12" lg="6" className="time-container"> <Col xs="12" md="12" lg="6" className="time-container">
<input <input
className="form-control" className="form-control"
type="date" type="date"
value={dateToISO(finish)} value={dateToISO(finish)}
min={dateToISO(start)} min={dateToISO(start)}
onChange={(e) => { dateFormat="MMMM d, yyyy h:mm aa"
setFinish( onChange={(e) => {
new Date( setFinish(
timeMinusDate(finish) + new Date(
new Date(e.target.valueAsNumber).getTime() timeMinusDate(finish) +
) new Date(e.target.valueAsNumber).getTime()
);
}}
/>
</Col>
<Col xs="12" md="12" lg="6" className="displayNone">
<select
className="form-control"
value={finish}
onChange={(e) =>
setFinish(
new Date(
dateMinusTime(finish).getTime() +
e.target.value * 3600000
)
) )
} );
> }}
{displayClockOptions()} />
</select> </Col>
</Col> <Col xs="12" md="12" lg="6" className="displayNone">
</Row> <select
</div> className="form-control"
value={finish}
onChange={(e) =>
setFinish(
new Date(
dateMinusTime(finish).getTime() +
e.target.value * 3600000
)
)
}
>
{displayClockOptions()}
</select>
</Col>
</Row>
</div>
<hr className="confirmation-divider-mobile" /> <hr className="confirmation-divider-mobile" />
@ -343,36 +347,37 @@ console.log(isTimeLimited);
)} )}
</div> </div>
<hr className="confirmation-divider" /> <hr className="confirmation-divider" />
{/* {restrictResult ? ( {restrictResult ? (
<div> <div>
<div className="small recap-vote-label p-3 mt-2"> <div className="small recap-vote-label p-3 mt-2 ">
<h6 className="m-0 p-0 recap-vote-content"> <h6 className="m-0 p-0 recap-vote-content">
<FontAwesomeIcon {t("Results available at any time")}
icon={faExclamationTriangle} </h6>
className="mr-2" </div>
/>
<u>{t("Results available at the close of the vote")}</u>
</h6>
<p className="m-2 p-0 ">
<span>
{t(
"The results page will not be accessible until the end date is reached."
)}{" "}
({finish.toLocaleDateString()} {t("at")}{" "}
{finish.toLocaleTimeString()})
</span>
</p>
</div> </div>
</div>
) : ( ) : (
<div> <div>
<div className="small recap-vote-label p-3 mt-2 "> <div className="small recap-vote-label p-3 mt-2">
<h6 className="m-0 p-0 recap-vote-content"> <h6 className="m-0 p-0 recap-vote-content">
{t("Results available at any time")} <FontAwesomeIcon
</h6> icon={faExclamationTriangle}
className="mr-2"
/>
<u>{t("Results available at the close of the vote")}</u>
</h6>
<p className="m-2 p-0 ">
<span>
{t(
"The results page will not be accessible until the end date is reached."
)}{" "}
({finish.toLocaleDateString()} {t("at")}{" "}
{finish.toLocaleTimeString()})
</span>
</p>
</div>
</div> </div>
</div> )}</Col>
)} */}</Col>
</div> </div>
</Col> </Col>
@ -382,6 +387,7 @@ console.log(isTimeLimited);
<Button onClick={() => { confirmCallback(); }} className="cursorPointer btn-transparent btn-validation mb-5 ml-auto mr-auto" >{t("Start the election")}<img src="/arrow-white.svg" /></Button> <Button onClick={() => { confirmCallback(); }} className="cursorPointer btn-transparent btn-validation mb-5 ml-auto mr-auto" >{t("Start the election")}<img src="/arrow-white.svg" /></Button>
</ModalFooter> </ModalFooter>
<Footer />
</Modal> </Modal>
</div > </div >
) )

Write Preview
Loading…
Cancel
Save