From ad9e15ea21a8e7ca1e9cc0f378cfa5622eba0f0c Mon Sep 17 00:00:00 2001 From: joseCorte-exe Date: Tue, 28 Jun 2022 09:33:03 -0300 Subject: [PATCH 1/4] fixing errors --- package.json | 1 + .../administrative/industryInfo/index.tsx | 7 +++- src/pages/index.tsx | 2 +- src/pages/pld/index.tsx | 38 ++++++++++++++++++- .../layouts/industryInfo/IndustryInfoView.ts | 17 ++++----- yarn.lock | 25 ++++++++++++ 6 files changed, 77 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index bfc4d50..ee05b14 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ "react-hook-form": "^7.32.2", "react-icons": "^4.3.1", "react-input-mask": "^2.0.4", + "react-pdf-thumbnail": "^0.1.0", "styled-components": "^5.3.5", "tinymce": "^6.0.3", "yup": "^0.32.11" diff --git a/src/pages/administrative/industryInfo/index.tsx b/src/pages/administrative/industryInfo/index.tsx index 5cdf3bb..c5d0f71 100644 --- a/src/pages/administrative/industryInfo/index.tsx +++ b/src/pages/administrative/industryInfo/index.tsx @@ -8,6 +8,7 @@ import PageTitle from '../../../components/pageTitle/PageTitle' import { IndustryInfoView } from '../../../styles/layouts/industryInfo/IndustryInfoView' import InputUploadPdf from '../../../components/inputUploadPdf/inputUpload'; import { api } from '../../../services/api' +import PdfThumbnail from 'react-pdf-thumbnail'; import FormData from 'form-data'; @@ -74,10 +75,12 @@ export default function industryInfo({userName}: any) {
- - + + + {/* */}
+

{pdf}

{/* */} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 09dd6e2..aee288f 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -36,10 +36,10 @@ export default function Home() { const [state, setstate] = useState(false); const [values, setValues] = useState({ - password: null, showPassword: false, }); + const [email, setEmail] = useState("") const [password, setPassword] = useState() diff --git a/src/pages/pld/index.tsx b/src/pages/pld/index.tsx index 1fa7fc8..66219bb 100644 --- a/src/pages/pld/index.tsx +++ b/src/pages/pld/index.tsx @@ -130,6 +130,39 @@ export default function pld({tableData, graphByHourData, graphByMonthData, userN const dateFormated = new Date() + function downloadCSVFile(csv, filename) { + const csv_file = new Blob([csv], {type: "text/csv"}); + + const download_link = document.createElement("a"); + + download_link.download = filename; + + download_link.href = window.URL.createObjectURL(csv_file); + + download_link.style.display = "none"; + + document.body.appendChild(download_link); + + download_link.click(); + } + + function htmlToCSV(html, filename) { + const data = []; + const rows = document.querySelectorAll("table tr"); + + for (let i = 0; i < rows.length; i++) { + const row = [], cols: any = rows[i].querySelectorAll("td, th"); + + for (let j = 0; j < cols.length; j++) { + row.push(cols[j].innerText); + } + + data.push(row.join(",")); + } + + downloadCSVFile(data.join("\n"), filename); + } + useEffect(() => { getDataByHour() getDataByDay() @@ -215,7 +248,10 @@ export default function pld({tableData, graphByHourData, graphByMonthData, userN
- console.log()} title='Download'/> + { + const html = document.querySelector("table").outerHTML; + htmlToCSV(html, "tabela_PLD.csv"); + }} title='Download'/>
diff --git a/src/styles/layouts/industryInfo/IndustryInfoView.ts b/src/styles/layouts/industryInfo/IndustryInfoView.ts index 6244637..89e98b7 100644 --- a/src/styles/layouts/industryInfo/IndustryInfoView.ts +++ b/src/styles/layouts/industryInfo/IndustryInfoView.ts @@ -29,21 +29,20 @@ export const IndustryInfoView = styled.main` .inputTeste{ display: flex; align-items: center; - margin-top:-10px; width: 50%; - margin-bottom: 50px; height: 50px; background: white; - border: 3px solid #254F7F; border-radius:10px; } - input[type="file"] { - display: none; -} -label { - padding: 20px 10px; + display: block; + } + + label { + display: flex; + justify-content: flex-start; + padding: 2px 10px; width: 200px; background-color: #333; color: #FFF; @@ -52,7 +51,7 @@ label { display: block; margin-top: 10px; cursor: pointer; -} + } diff --git a/yarn.lock b/yarn.lock index 664df8a..65ed182 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2245,6 +2245,11 @@ dom-helpers@^5.0.1: "@babel/runtime" "^7.8.7" csstype "^3.0.2" +dommatrix@^1.0.1: + version "1.0.3" + resolved "https://registry.yarnpkg.com/dommatrix/-/dommatrix-1.0.3.tgz#e7c18e8d6f3abdd1fef3dd4aa74c4d2e620a0525" + integrity sha512-l32Xp/TLgWb8ReqbVJAFIvXmY7go4nTxxlWiAFyhoQw9RKEOHBZNnyGvJWqDVSPmq3Y9HlM4npqF/T6VMOXhww== + eastasianwidth@^0.2.0: version "0.2.0" resolved "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz" @@ -4006,6 +4011,14 @@ patternomaly@^1.3.2: version "1.3.2" resolved "https://registry.yarnpkg.com/patternomaly/-/patternomaly-1.3.2.tgz#70b8db17d7318ab1471cc43f94011bb866c54d09" +pdfjs-dist@^2.7.570: + version "2.14.305" + resolved "https://registry.yarnpkg.com/pdfjs-dist/-/pdfjs-dist-2.14.305.tgz#ed2ecb439ff8af5446c90a310ebd30bc1a91df62" + integrity sha512-5f7i25J1dKIBczhgfxEgNxfYNIxXEdxqo6Qb4ehY7Ja+p6AI4uUmk/OcVGXfRGm2ys5iaJJhJUwBFwv6Jl/Qww== + dependencies: + dommatrix "^1.0.1" + web-streams-polyfill "^3.2.1" + picocolors@^1.0.0: version "1.0.0" resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz" @@ -4145,6 +4158,13 @@ react-is@^16.13.1, react-is@^16.7.0: version "17.0.2" resolved "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz" +react-pdf-thumbnail@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/react-pdf-thumbnail/-/react-pdf-thumbnail-0.1.0.tgz#6b8ddf861252acb2b137dfd42007f545fde52ef9" + integrity sha512-VzkGUmgAheqxQsMTcUjOFrATtEdG2C9YRkMb0GFkf9JyfTDdBjkyu1/gVLk9CYVKWkgyNID34/G0TTX60XJuyA== + dependencies: + pdfjs-dist "^2.7.570" + react-transition-group@^4.4.0, react-transition-group@^4.4.2: version "4.4.2" resolved "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz" @@ -4769,6 +4789,11 @@ wcwidth@^1.0.0: dependencies: defaults "^1.0.3" +web-streams-polyfill@^3.2.1: + version "3.2.1" + resolved "https://registry.yarnpkg.com/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz#71c2718c52b45fd49dbeee88634b3a60ceab42a6" + integrity sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q== + which-boxed-primitive@^1.0.2: version "1.0.2" resolved "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz" From 9143dc8bb17de71748796d2ce41a11e5677c62dc Mon Sep 17 00:00:00 2001 From: joseCorte-exe Date: Tue, 28 Jun 2022 09:46:25 -0300 Subject: [PATCH 2/4] fixing errors --- .../administrative/industryInfo/index.tsx | 18 +++-------- .../layouts/industryInfo/IndustryInfoView.ts | 31 +++++++++++++++++-- 2 files changed, 34 insertions(+), 15 deletions(-) diff --git a/src/pages/administrative/industryInfo/index.tsx b/src/pages/administrative/industryInfo/index.tsx index c5d0f71..432fe3d 100644 --- a/src/pages/administrative/industryInfo/index.tsx +++ b/src/pages/administrative/industryInfo/index.tsx @@ -29,6 +29,7 @@ export default function industryInfo({userName}: any) { const [pdf, setPdf] = useState(); function onChange(e) { setPdf(e.target.files[0]) + console.log(pdf) } const [openSnackSuccess, setOpenSnackSuccess] = useState(false); @@ -71,19 +72,10 @@ export default function industryInfo({userName}: any) {
- -
-
-
- - - {/* */} -
-
-

{pdf}

-
- - {/* */} +
+ + +
handleCreateClient()} title='Atualizar'/> diff --git a/src/styles/layouts/industryInfo/IndustryInfoView.ts b/src/styles/layouts/industryInfo/IndustryInfoView.ts index 89e98b7..624cc92 100644 --- a/src/styles/layouts/industryInfo/IndustryInfoView.ts +++ b/src/styles/layouts/industryInfo/IndustryInfoView.ts @@ -26,7 +26,34 @@ export const IndustryInfoView = styled.main` color: #FFFFFF; } - .inputTeste{ + + form { + label { + display: flex; + align-items: center; + justify-content: center; + position: absolute; + width: 150px; + margin-left: 10px; + transform: translateY(20px); + background-color: #254F7F; + color: white; + border-radius: 8px; + } + } + + input[type="file"] { + padding-top: 20px; + padding-left: 41px; + width: 350px; + height: 60px; + border: 1px solid black; + border-radius: 6px; + } + label { + } + + /* .inputTeste{ display: flex; align-items: center; width: 50%; @@ -51,7 +78,7 @@ export const IndustryInfoView = styled.main` display: block; margin-top: 10px; cursor: pointer; - } + } */ From 0ba6332e416e51e2875e35bbcdee47312d47dd69 Mon Sep 17 00:00:00 2001 From: joseCorte-exe Date: Tue, 28 Jun 2022 09:48:13 -0300 Subject: [PATCH 3/4] fixing errors --- src/pages/dashboard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/dashboard.tsx b/src/pages/dashboard.tsx index 7b2052e..c3bdc50 100644 --- a/src/pages/dashboard.tsx +++ b/src/pages/dashboard.tsx @@ -52,7 +52,7 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal - Date: Tue, 28 Jun 2022 10:28:39 -0300 Subject: [PATCH 4/4] add milhar separator graphs --- src/components/graph/Chart.tsx | 11 ++++++++++- src/components/graph/LineBarChart2.tsx | 12 ++++++++++-- src/components/graph/SingleBar.tsx | 2 +- 3 files changed, 21 insertions(+), 4 deletions(-) diff --git a/src/components/graph/Chart.tsx b/src/components/graph/Chart.tsx index 941977c..6d9c8b3 100644 --- a/src/components/graph/Chart.tsx +++ b/src/components/graph/Chart.tsx @@ -49,7 +49,16 @@ export default function Chart({ title, data1, data2, label, subtitle, dataset1, datalabels: { display: true, color: barLabel? 'black' : "rgba(255, 255, 255, 0)", - formatter: Math.round, + formatter: (value, ctx) => { + let sum = 0; + const dataArr = ctx.chart.data.datasets[0].data; + dataArr.map(data => { + sum += data; + }); + const result = `${parseFloat(value).toLocaleString('pt-br')}` + + return value==null? null : result + }, anchor: "end", offset: -20, align: "start", diff --git a/src/components/graph/LineBarChart2.tsx b/src/components/graph/LineBarChart2.tsx index 273fe77..ad9efea 100644 --- a/src/components/graph/LineBarChart2.tsx +++ b/src/components/graph/LineBarChart2.tsx @@ -78,7 +78,6 @@ export function LineBarChart2({ title, subtitle, data1, data2, data3, label, red const currentTime = new Date(); - const labels = label const options: any = { @@ -88,12 +87,21 @@ export function LineBarChart2({ title, subtitle, data1, data2, data3, label, red display: true, color: barLabel? 'black' : "rgba(255, 255, 255, 0)", // backgroundColor: '#255488', - formatter: Math.round, anchor: "end", offset: -20, align: "start", font: { size: 12 + }, + formatter: (value, ctx) => { + let sum = 0; + const dataArr = ctx.chart.data.datasets[0].data; + dataArr.map(data => { + sum += data; + }); + const result = `${parseFloat(value).toLocaleString('pt-br')}` + + return value==null? null : result } }, legend: { diff --git a/src/components/graph/SingleBar.tsx b/src/components/graph/SingleBar.tsx index 2fec803..da7c3f9 100644 --- a/src/components/graph/SingleBar.tsx +++ b/src/components/graph/SingleBar.tsx @@ -46,7 +46,7 @@ export function SingleBar({ title, subtitle, dataProps, label, dataset, barLabel sum += data; }); const percentage = (dataProps[ctx.dataIndex].econ_percentual*100).toFixed(0)+"%"; - const result = `${parseFloat(value).toFixed(0)}\n ${percentage}` + const result = `${parseFloat(value).toLocaleString('pt-br')}\n ${percentage}` return value==null? null : result },