update for date selection
This commit is contained in:
@ -27,26 +27,23 @@ import {
|
||||
CSwitch,
|
||||
} from '@coreui/react'
|
||||
import CIcon from '@coreui/icons-react'
|
||||
import Downloader from '../downloader';
|
||||
|
||||
|
||||
const FileDownload = require('js-file-download');
|
||||
|
||||
import DatePicker from "react-datepicker";
|
||||
import "react-datepicker/dist/react-datepicker.css";
|
||||
|
||||
function Index() {
|
||||
|
||||
const baseUrl = "https://natnats.mobilous.com/";
|
||||
|
||||
var today = new Date();
|
||||
|
||||
var cdate = (today.getMonth()+1)+'/'+today.getDate()+'/'+today.getFullYear();
|
||||
|
||||
const [data, setData] = useState([]);
|
||||
const [sdate, setSdate] = useState(cdate);
|
||||
const [report, setReport] = useState('');
|
||||
const [selectedcons, setSelectedCons] = useState('');
|
||||
const [graph, setGraph] = useState(false);
|
||||
|
||||
const [startDate, setStartDate] = useState(null);
|
||||
const [validDates, setValidDates] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchData() {
|
||||
// You can await here
|
||||
@ -56,15 +53,35 @@ function Index() {
|
||||
fetchData();
|
||||
}, []);
|
||||
|
||||
function setingSDate(e){
|
||||
setSdate(e.target.value);
|
||||
useEffect(() => {
|
||||
async function fetchData() {
|
||||
// You can await here
|
||||
if(selectedcons !== "" && report !== "") {
|
||||
const result = await axios('https://natnats.mobilous.com/getDateToHaveData?construction_id=' + selectedcons + '&sheetname=' + report);
|
||||
setValidDates(result.data.record);
|
||||
}
|
||||
}
|
||||
fetchData();
|
||||
}, [report, selectedcons]);
|
||||
|
||||
function getDateWithFormat(date) {
|
||||
var thisDate = date;
|
||||
var dd = String(date.getDate()).padStart(2, '0');
|
||||
var mm = String(date.getMonth() + 1).padStart(2, '0'); //January is 0!
|
||||
var yyyy = date.getFullYear();
|
||||
|
||||
thisDate = yyyy + '-' + mm + '-' + dd
|
||||
return thisDate;
|
||||
}
|
||||
|
||||
function setingReport(e){
|
||||
setReport(e.target.value);
|
||||
setStartDate(null);
|
||||
}
|
||||
|
||||
function setingSelectedCons(e) {
|
||||
setSelectedCons(e.target.value);
|
||||
setStartDate(null);
|
||||
}
|
||||
|
||||
function setingGraph(e){
|
||||
@ -78,15 +95,11 @@ function Index() {
|
||||
}
|
||||
var url = "";
|
||||
if(graph){
|
||||
url = baseUrl + "/" + report + "?construction_id=" +selectedcons+ "&construction_date="+sdate+"&graph=true";
|
||||
url = baseUrl + "/generate" + report + "?construction_id=" +selectedcons+ "&construction_date="+getDateWithFormat(startDate)+"&graph=true";
|
||||
}
|
||||
else{
|
||||
url = baseUrl + "/" + report + "?construction_id=" +selectedcons+ "&construction_date="+sdate;
|
||||
url = baseUrl + "/generate" + report + "?construction_id=" +selectedcons+ "&construction_date="+getDateWithFormat(startDate);
|
||||
}
|
||||
console.log(url);
|
||||
//console.log(selectedcons);
|
||||
//console.log(sdate);
|
||||
//console.log(report);
|
||||
downloadReport(url);
|
||||
}
|
||||
|
||||
@ -104,14 +117,18 @@ function Index() {
|
||||
link.click();
|
||||
});
|
||||
|
||||
|
||||
//return <Downloader iframeSrc={url} />
|
||||
// const response = axios(url).then((res) => {
|
||||
// FileDownload(res.data, 'report.xls');
|
||||
// })
|
||||
//console.log(response);
|
||||
}
|
||||
|
||||
const checkAvilable = (date) => {
|
||||
var thisDate = getDateWithFormat(date);
|
||||
if(validDates.includes(thisDate)){
|
||||
return true;
|
||||
}
|
||||
else{
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<CRow>
|
||||
<CCol xs="12" sm="12" md="12">
|
||||
@ -132,18 +149,9 @@ function Index() {
|
||||
}
|
||||
</CSelect>
|
||||
|
||||
|
||||
<CCard>
|
||||
<CCardBody>
|
||||
<CForm action="" method="post" encType="multipart/form-data" className="form-horizontal">
|
||||
<CFormGroup row>
|
||||
<CCol md="3">
|
||||
<CLabel htmlFor="date-input">日付 ({sdate})</CLabel>
|
||||
</CCol>
|
||||
<CCol xs="12" md="9">
|
||||
<CInput type="date" id="date-input" name="date-input" placeholder="日付" value={sdate} onChange={setingSDate}/>
|
||||
</CCol>
|
||||
</CFormGroup>
|
||||
<CFormGroup row>
|
||||
<CCol md="3">
|
||||
<CLabel htmlFor="select">選択</CLabel>
|
||||
@ -151,18 +159,32 @@ function Index() {
|
||||
<CCol xs="12" md="9">
|
||||
<CSelect custom name="select" id="select" onChange={setingReport} value={report}>
|
||||
<option value="">-- 選択 --</option>
|
||||
<option value="generateBoxDisplacement">函体変位表</option>
|
||||
<option value="generateMachineControl">オープンシールドマシン管理日報</option>
|
||||
<option value="generateMachineSheet">オープンシールド機変位表</option>
|
||||
<option value="generateMeasurement">函底高・偏位量測定一覧表</option>
|
||||
<option value="generateCheckSheet">工程内検査表</option>
|
||||
<option value="generateInjection">裏込注入材料受払い簿</option>
|
||||
<option value="BoxDisplacement">函体変位表</option>
|
||||
<option value="MachineControl">オープンシールドマシン管理日報</option>
|
||||
<option value="MachineSheet">オープンシールド機変位表</option>
|
||||
<option value="Measurement">函底高・偏位量測定一覧表</option>
|
||||
<option value="CheckSheet">工程内検査表</option>
|
||||
<option value="Injection">裏込注入材料受払い簿</option>
|
||||
</CSelect>
|
||||
</CCol>
|
||||
</CFormGroup>
|
||||
<CFormGroup row>
|
||||
<CCol md="3">
|
||||
<CLabel htmlFor="select">日にち</CLabel>
|
||||
</CCol>
|
||||
<CCol xs="12" md="9">
|
||||
<DatePicker
|
||||
dateFormat="dd/MM/yyyy"
|
||||
selected={startDate}
|
||||
onChange={(date) => setStartDate(date)}
|
||||
filterDate={checkAvilable}
|
||||
placeholderText='日付を選択'
|
||||
/>
|
||||
</CCol>
|
||||
</CFormGroup>
|
||||
|
||||
|
||||
{report == 'generateMachineControl' ?
|
||||
{report == 'MachineControl' ?
|
||||
<CFormGroup variant="checkbox" className="checkbox">
|
||||
<CInputCheckbox
|
||||
id="checkbox1"
|
||||
@ -179,7 +201,11 @@ function Index() {
|
||||
</CForm>
|
||||
</CCardBody>
|
||||
<CCardFooter>
|
||||
<CButton type="submit" size="sm" color="primary" onClick={doGetReport}><CIcon name="cil-scrubber" /> ダウンロード</CButton>
|
||||
{startDate != null ?
|
||||
<CButton type="submit" size="sm" color="primary" onClick={doGetReport}><CIcon name="cil-scrubber" /> ダウンロード</CButton>
|
||||
:
|
||||
<CButton disabled type="submit" size="sm" color="primary" onClick={doGetReport}><CIcon name="cil-scrubber" /> ダウンロード</CButton>
|
||||
}
|
||||
</CCardFooter>
|
||||
</CCard>
|
||||
</CCardBody>
|
||||
|
||||
@ -16,11 +16,11 @@ import {
|
||||
const Dashboard = () => {
|
||||
return (
|
||||
<div >
|
||||
<CCard class="bg-info">
|
||||
<CCard className="bg-info">
|
||||
<CCardBody >
|
||||
<div class="text-white text-center card bg-info">
|
||||
<div class="card-body">
|
||||
<blockquote class="card-bodyquote">
|
||||
<div className="text-white text-center card bg-info">
|
||||
<div className="card-body">
|
||||
<blockquote className="card-bodyquote">
|
||||
<h1>FBS Web app</h1>
|
||||
</blockquote>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user