TPS
/
etalon_frontend
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

table sort search

This commit is contained in:
gerchek 2022-01-31 18:03:27 +05:00
parent 04d4d3cd1e
commit ef61d3b61a
8 changed files with 93 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
build/asset-manifest.json
View File

@ -1,8 +1,8 @@
{
"files": {
"main.css": "/static/css/main.017ae058.chunk.css",
"main.js": "/static/js/main.fefe9fc0.chunk.js",
"main.js.map": "/static/js/main.fefe9fc0.chunk.js.map",
"main.js": "/static/js/main.3075f068.chunk.js",
"main.js.map": "/static/js/main.3075f068.chunk.js.map",
"runtime-main.js": "/static/js/runtime-main.d40e0088.js",
"runtime-main.js.map": "/static/js/runtime-main.d40e0088.js.map",
"static/css/2.d555f809.chunk.css": "/static/css/2.d555f809.chunk.css",
@ -50,6 +50,6 @@
"static/css/2.d555f809.chunk.css",
"static/js/2.f45cd794.chunk.js",
"static/css/main.017ae058.chunk.css",
"static/js/main.fefe9fc0.chunk.js"
"static/js/main.3075f068.chunk.js"
]
}

2
build/index.html
View File

@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="icon.jpg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/><link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Etalon</title><link href="/static/css/2.d555f809.chunk.css" rel="stylesheet"><link href="/static/css/main.017ae058.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,a,i=t[0],c=t[1],l=t[2],s=0,p=[];s<i.length;s++)a=i[s],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&p.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(t);p.length;)p.shift()();return u.push.apply(u,l||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,i=1;i<r.length;i++){var c=r[i];0!==o[c]&&(n=!1)}n&&(u.splice(t--,1),e=a(a.s=r[0]))}return e}var n={},o={1:0},u=[];function a(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,a),r.l=!0,r.exports}a.e=function(e){var t=[],r=o[e];if(0!==r)if(r)t.push(r[2]);else{var n=new Promise((function(t,n){r=o[e]=[t,n]}));t.push(r[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+"static/js/"+({}[e]||e)+"."+{3:"dfb2e422"}[e]+".chunk.js"}(e);var c=new Error;u=function(t){i.onerror=i.onload=null,clearTimeout(l);var r=o[e];if(0!==r){if(r){var n=t&&("load"===t.type?"missing":t.type),u=t&&t.target&&t.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,r[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(t)},a.m=e,a.c=n,a.d=function(e,t,r){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(a.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)a.d(r,n,function(t){return e[t]}.bind(null,n));return r},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.p="/",a.oe=function(e){throw console.error(e),e};var i=this["webpackJsonpreact-etalon"]=this["webpackJsonpreact-etalon"]||[],c=i.push.bind(i);i.push=t,i=i.slice();for(var l=0;l<i.length;l++)t(i[l]);var f=c;r()}([])</script><script src="/static/js/2.f45cd794.chunk.js"></script><script src="/static/js/main.fefe9fc0.chunk.js"></script></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="icon.jpg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="preconnect" href="https://fonts.googleapis.com"/><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/><link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Etalon</title><link href="/static/css/2.d555f809.chunk.css" rel="stylesheet"><link href="/static/css/main.017ae058.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,a,i=t[0],c=t[1],l=t[2],s=0,p=[];s<i.length;s++)a=i[s],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&p.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(t);p.length;)p.shift()();return u.push.apply(u,l||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,i=1;i<r.length;i++){var c=r[i];0!==o[c]&&(n=!1)}n&&(u.splice(t--,1),e=a(a.s=r[0]))}return e}var n={},o={1:0},u=[];function a(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,a),r.l=!0,r.exports}a.e=function(e){var t=[],r=o[e];if(0!==r)if(r)t.push(r[2]);else{var n=new Promise((function(t,n){r=o[e]=[t,n]}));t.push(r[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+"static/js/"+({}[e]||e)+"."+{3:"dfb2e422"}[e]+".chunk.js"}(e);var c=new Error;u=function(t){i.onerror=i.onload=null,clearTimeout(l);var r=o[e];if(0!==r){if(r){var n=t&&("load"===t.type?"missing":t.type),u=t&&t.target&&t.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,r[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(t)},a.m=e,a.c=n,a.d=function(e,t,r){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(a.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)a.d(r,n,function(t){return e[t]}.bind(null,n));return r},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.p="/",a.oe=function(e){throw console.error(e),e};var i=this["webpackJsonpreact-etalon"]=this["webpackJsonpreact-etalon"]||[],c=i.push.bind(i);i.push=t,i=i.slice();for(var l=0;l<i.length;l++)t(i[l]);var f=c;r()}([])</script><script src="/static/js/2.f45cd794.chunk.js"></script><script src="/static/js/main.3075f068.chunk.js"></script></body></html>

4
build/static/js/main.fefe9fc0.chunk.js → build/static/js/main.3075f068.chunk.js
View File

File diff suppressed because one or more lines are too long

1
build/static/js/main.3075f068.chunk.js.map Normal file
View File

File diff suppressed because one or more lines are too long

1
build/static/js/main.fefe9fc0.chunk.js.map
View File

File diff suppressed because one or more lines are too long

19
src/helpers/TableSearch.js Normal file
View File

@ -0,0 +1,19 @@
export const tableSearch = (word, tableRef) => {
// Declare variables
let table, tr, td, i, txtValue;
word = word.toUpperCase();
table = document.querySelector('.' + tableRef);
tr = table.getElementsByTagName("tr");
// Loop through all table rows, and hide those who don't match the search query
for (i = 1; i < tr.length; i++) {
if (tr[i]) {
txtValue = tr[i].innerHTML;
if (txtValue.toUpperCase().indexOf(word) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
};

61
src/pages/MeasuringRegister.js
View File

@ -3,6 +3,7 @@ import React from "react";
import { withTranslation } from 'react-i18next';
import Loop from "../svg/loupe.svg";
// IMPORT COMPONENTS
import Breadcrumb from "../components/Global/Breadcrumb";
@ -19,6 +20,10 @@ class MeasuringRegister extends React.Component {
this.state = {
items: [],
DataisLoaded: false,
counter: 0,
order: 'asc',
word: '',
test: false,
error: null,
tablePage: 0
};
@ -35,13 +40,19 @@ class MeasuringRegister extends React.Component {
this._mounted = false
}
makeRemoteRequest = (query) => {
makeRemoteRequest = (query, test) => {
if(query){
this.setState({tablePage: this.state.tablePage + 1})
}
else if(this.state.tablePage > 1){
this.setState({tablePage: this.state.tablePage - 1})
}
if(test){
this.setState({tablePage: 1})
}
this.setState({test: false})
const url = 'https://etalon.gov.tm:8080/api/v1/reestr';
if (this._mounted) {
@ -49,7 +60,7 @@ class MeasuringRegister extends React.Component {
}
setTimeout(() => {
fetch(url + '?page=' + this.state.tablePage, {
fetch(`${url}?sort=${this.state.order}&s=${this.state.word}&page=${this.state.tablePage}`, {
method: 'GET',
})
@ -58,7 +69,7 @@ class MeasuringRegister extends React.Component {
.then(res => {
if (this._mounted) {
this.setState({
items: res.data['data'],
items: res.data,
error: res.message || null,
DataisLoaded: true,
})
@ -100,6 +111,36 @@ class MeasuringRegister extends React.Component {
<div className="tab-header-line"></div>
</div>
</div>
<div className="regulations-head">
<div className="regulations-head-left">
<form className="search-form">
<input type="text" placeholder="Поиск" onChange={(e) => {
const input = e.target.value;
this.setState({word: input});
this.makeRemoteRequest(this.state.tablePage, true);
}} />
<button type="button">
<div>
<img src={Loop} alt="Loop" />
</div>
</button>
</form>
</div>
{/* <div className="regulations-head-right">
<form className="btn-form">
<button type="button" className="button-prev regulations-btn">
<div>
<img src={Prev} alt="Previous" />
</div>
</button>
<button type="button" className="button-right regulations-btn">
<div>
<img src={Next} alt="Next" />
</div>
</button>
</form>
</div> */}
</div>
<div className="mr-content">
<div className="mr-table">
<table className="structure-table">
@ -108,7 +149,19 @@ class MeasuringRegister extends React.Component {
<tr className="table-head">
<th>
<th
onClick={() => {
if(this.state.counter % 2 == 0){
this.setState({order: 'desc'})
this.makeRemoteRequest(this.state.tablePage, true);
this.setState({counter: this.state.counter + 1})
}else{
this.setState({order: 'asc'})
this.makeRemoteRequest(this.state.tablePage, true);
this.setState({counter: this.state.counter + 1})
}
}}
>
<span>{t('№ серт.')}</span>
</th>
<th>

14
src/pages/Regulations.js
View File

@ -4,6 +4,8 @@ import { withTranslation } from 'react-i18next';
import parse from 'html-react-parser';
import i18n from '../i18n';
// SEARCH
import { tableSearch } from '../helpers/TableSearch';
// IMPORT COMPONENTS
@ -24,6 +26,7 @@ class Regulations extends React.Component {
constructor(props) {
super(props);
this.tableRef = React.createRef;
this.state = {
items: [],
@ -98,7 +101,10 @@ class Regulations extends React.Component {
<div className="regulations-head">
<div className="regulations-head-left">
<form className="search-form">
<input type="text" placeholder="Поиск" />
<input type="text" placeholder="Поиск" onChange={(e) => {
const input = e.target.value;
tableSearch(input, 'tbody-search');
}} />
<button type="button">
<div>
<img src={Loop} alt="Loop" />
@ -106,7 +112,7 @@ class Regulations extends React.Component {
</button>
</form>
</div>
<div className="regulations-head-right">
{/* <div className="regulations-head-right">
<form className="btn-form">
<button type="button" className="button-prev regulations-btn">
<div>
@ -119,12 +125,12 @@ class Regulations extends React.Component {
</div>
</button>
</form>
</div>
</div> */}
</div>
<div className="regulations-content">
<div className="structure-employees">
<table className="regulations-table structure-table">
<tbody>
<tbody className="tbody-search">
<tr className="table-head">
<th className="n head">{t('№ серт.')}</th>
<th className="number head">