etalon_frontend/src/pages/MeasuringRegister.js

157 lines
4.1 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// // IMPORT MODULES
import React from "react";
import { withTranslation } from 'react-i18next';
// IMPORT COMPONENTS
import Breadcrumb from "../components/Global/Breadcrumb";
// const MeasuringRegister = () => {
// useEffect(() => {
// window.scrollTo(0, 0);
// }, []);
class MeasuringRegister extends React.Component {
constructor(props) {
super(props);
this.state = {
items: [],
DataisLoaded: false,
error: null
};
}
componentDidMount() {
this._mounted = true
this.makeRemoteRequest();
}
componentWillUnmount() {
this._mounted = false
}
makeRemoteRequest = () => {
const url = `http://217.174.238.204:8888/api/v1/reestr`
if (this._mounted) {
this.setState({ DataisLoaded: true });
}
setTimeout(() => {
fetch(url, {
method: 'GET',
})
.then(res => res.json())
.then(res => {
if (this._mounted) {
this.setState({
items: res.data['data'],
error: res.message || null,
DataisLoaded: true,
})
console.log(this.state.items)
}
})
.catch(error => {
if (this._mounted) {
this.setState({ error, DataisLoaded: false});
}
});
}, 1500);
};
render() {
const { t } = this.props;
var {DataisLoaded, items} = this.state;
if(!DataisLoaded){
return <div>Loading ....</div>
}else{
return (
<section className="measuring-register">
<Breadcrumb
path_1={t('Государственный реестр средств измерений')}
currentUrl="/measuring_register"
/>
<div className="container">
<div className="measuring-register-inner">
<div className="tab-header">
<h4 className="tab-header-text" id="tab-header-text">
{t('Утвержденные типы средств измерений, внесенные в Госреестр СИ Туркменистана на 31/12/2021')}
</h4>
<div className="tab-header-line"></div>
</div>
</div>
<div className="mr-content">
<div className="mr-table">
<table className="structure-table">
<tbody>
<tr className="table-head">
<th>
<span> серт.</span>
</th>
<th>
<span> Рос-реестра</span>
</th>
<th>
<span>Наименования и тип СИ</span>
</th>
<th>
<span>Изготовитель</span>
</th>
<th>
<span>Срок действия</span>
</th>
</tr>
{items.map(item=>(
<tr key={item.id}>
<td>
<span>{ item.id }</span>
</td>
<td>
<span>{ item.certificate_no }</span>
</td>
<td>
<span>{ item.reestr_no }</span>
</td>
<td>
<span>{ item.reestr_name }</span>
</td>
<td>
<span>{ item.manufacture }</span>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</div>
</section>
);
}
}
};
// export default MeasuringRegister;
export default withTranslation()(MeasuringRegister);