From d3198cacd4887077ec96711342d73184e8d22986 Mon Sep 17 00:00:00 2001 From: "daivid.alves" Date: Fri, 22 Nov 2024 17:39:44 -0300 Subject: [PATCH] =?UTF-8?q?Atualiza=C3=A7=C3=A3o=2013=20|=20Tornando=20a?= =?UTF-8?q?=20estrutura=20de=20configura=C3=A7=C3=A3o=20para=20ambientes?= =?UTF-8?q?=20din=C3=A2mica,=20al=C3=A9m=20da=20constru=C3=A7=C3=A3o=20de?= =?UTF-8?q?=20um=20POPs=20dedicado=20para=20todos=20os=20formul=C3=A1rios?= =?UTF-8?q?=20e=20outro=20dedicado=20para=20todas=20as=20respostas=20do=20?= =?UTF-8?q?front-end=20ou=20back-end.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Config/Ambientes/AmbientesConfig.css | 5 +- .../Ambientes/Componentes/Ambientes.css | 32 ++- .../Componentes/AmbientesAlertas.css | 81 ++++++ .../Componentes/AmbientesRelatorios.css | 14 + .../Ambientes/Painel/EdicaoAmbientespop.css | 234 ++++++++++++++++ .../Config/Ambientes/Painel/Painelpopup.css | 18 ++ .../Painel/{PopUp.css => Respostapopup.css} | 0 .../Config/Ambientes/estrutura/Sec_Cap_1.css | 28 +- .../Config/Ambientes/estrutura/Sec_Cap_2.css | 84 ------ .../Config/Ambientes/estrutura/Sec_Cap_3.css | 15 -- .../Config/Estrutura/estrutura_config.css | 2 + Css/page/Ambiente/Config/Estrutura/menu.css | 4 +- .../Ambiente/Config/Estrutura/menu_houver.css | 2 +- Css/page/Ambiente/Config/Estrutura/tela.css | 3 + html/Config.html | 6 +- .../Modulo_Construcao/Funcao/Ambientes.js | 249 ++++++++++++++++++ .../Funcao/AmbientesAlertas.js | 43 +++ .../Funcao/AmbientesRelatorio.js | 16 ++ .../Funcao/Ambientes_Root.js | 93 ++++++- .../Modulo_Construcao/Funcao/config.js | 2 +- 20 files changed, 799 insertions(+), 132 deletions(-) create mode 100644 Css/page/Ambiente/Config/Ambientes/Painel/EdicaoAmbientespop.css create mode 100644 Css/page/Ambiente/Config/Ambientes/Painel/Painelpopup.css rename Css/page/Ambiente/Config/Ambientes/Painel/{PopUp.css => Respostapopup.css} (100%) create mode 100644 Css/page/Ambiente/Config/Estrutura/tela.css create mode 100644 js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes.js create mode 100644 js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesAlertas.js create mode 100644 js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesRelatorio.js diff --git a/Css/page/Ambiente/Config/Ambientes/AmbientesConfig.css b/Css/page/Ambiente/Config/Ambientes/AmbientesConfig.css index 613da9a..3c6432d 100644 --- a/Css/page/Ambiente/Config/Ambientes/AmbientesConfig.css +++ b/Css/page/Ambiente/Config/Ambientes/AmbientesConfig.css @@ -9,5 +9,8 @@ @import url(../Ambientes/estrutura/Sec_Cap_2.css); @import url(../Ambientes/estrutura/Sec_Cap_3.css); -@import url(../Ambientes/Painel/PopUp.css); +@import url(../Ambientes/Painel/Respostapopup.css); +@import url(../Ambientes/Painel/Painelpopup.css); +@import url(../Ambientes/Painel/EdicaoAmbientespop.css); + @import url(../Ambientes/Painel/tags.css); \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/Componentes/Ambientes.css b/Css/page/Ambiente/Config/Ambientes/Componentes/Ambientes.css index 1c6cb2b..a6e3d35 100644 --- a/Css/page/Ambiente/Config/Ambientes/Componentes/Ambientes.css +++ b/Css/page/Ambiente/Config/Ambientes/Componentes/Ambientes.css @@ -4,6 +4,7 @@ flex-direction: column; align-items: center; justify-content: start; + gap: 2vh; } @@ -20,8 +21,8 @@ .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .img { - width: 4vw; - height: 8vh; + width: 3.5vw; + height: 7vh; background-color: var(--Cor_Segundaria_2_1); box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2); display: flex; @@ -34,14 +35,14 @@ .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .img img { - width: 3vw; + width: 2.5vw; } .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .corpo { - width: 80%; - height: 8vh; + width: 70%; + height: 7vh; display: flex; flex-direction: row; @@ -53,6 +54,12 @@ } +.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .titulo h2 { + + font-family: var(--font_titulo); + font-size: 0.8vw; + color: var(--Matriz); +} .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .corpo .alinhamentos { width: 50%; @@ -72,9 +79,7 @@ background-color: var(--Cor_Segundaria_5_1); box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2); - width: 40%; - height: 5vh; - + padding: 5%; display: flex; flex-direction: row; justify-content: space-around; @@ -82,19 +87,12 @@ font-family: var(--font_titulo); color: var(--Matriz); - font-size: 1vw; + font-size: 0.7vw; } -.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .titulo h2 { - - font-family: var(--font_titulo); - font-size: 1.4vw; - color: var(--Matriz); -} - .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_2 .painelItem .edicao button { background: none; @@ -105,7 +103,7 @@ box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_2_2); width: 3vw; - height: 8vh; + height: 7vh; display: flex; flex-direction: row; diff --git a/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesAlertas.css b/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesAlertas.css index e69de29..6e7fbe1 100644 --- a/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesAlertas.css +++ b/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesAlertas.css @@ -0,0 +1,81 @@ +.subpainel_Status { + width: 100%; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 1vw; + +} + +.subpainel_Status .bloco_1 { + width: 25%; + height: 6vh; + + display: flex; + justify-content: center; + align-items: center; + + background-color: var(--Cor_Segundaria_2_1); + box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); +} + +.subpainel_Status .bloco_2 { + width: 70%; + height: 6vh; + + display: flex; + justify-content: space-between; + align-items: center; + gap: 1vw; + + background-color: var(--Cor_Segundaria_2_1); + box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); +} + +.subpainel_Status .bloco_1 .titulo { + + + font-family: var(--font_titulo); + color: var(--Matriz); + font-size: 0.5vw; +} + +.subpainel_Status .bloco_2 .Mensagem_ambiente { + + font-family: var(--font_titulo); + margin-left: 1vw; + color: var(--Matriz); + font-size: 1vw; + +} + +.subpainel_Status .bloco_2 .button_rel button { + background: none; + outline: none; + border: none; +} + + +.subpainel_Status .bloco_2 .button_rel img { + width: 1.6vw; + filter: drop-shadow(3px 3px 0px var(--Cor_Segundaria_2_2)); +} + + +.subpainel_Status .bloco_2 .status_ambiente { + font-family: var(--font_titulo); + color: var(--Cor_Segundaria_5_1); + font-size: 0.7vw; + + margin-right: 1vw; + background-color: var(--Matriz); + padding: 0.2vw; + + display: flex; + justify-content: center; + align-items: center; + border-radius: 2vw; + width: 4vw; + height: 3vh; +} \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesRelatorios.css b/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesRelatorios.css index e69de29..9c0fc41 100644 --- a/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesRelatorios.css +++ b/Css/page/Ambiente/Config/Ambientes/Componentes/AmbientesRelatorios.css @@ -0,0 +1,14 @@ +.bloco_ambiente .coluna_2 .opicaoAmbie button { + outline: none; + background: none; + border: none; + + width: 20vw; + height: 6vh; + background-color: var(--Cor_Segundaria_2_1); + box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); + + font-family: var(--font_titulo); + color: var(--Matriz); + font-size: 1.2vw; +} \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/Painel/EdicaoAmbientespop.css b/Css/page/Ambiente/Config/Ambientes/Painel/EdicaoAmbientespop.css new file mode 100644 index 0000000..bac05dc --- /dev/null +++ b/Css/page/Ambiente/Config/Ambientes/Painel/EdicaoAmbientespop.css @@ -0,0 +1,234 @@ +.PopPainel.EdicaoAmbientes .fecharPainel { + width: 100%; + height: 12vh; + display: flex; + justify-content: start; + align-items: center; +} + +.PopPainel.EdicaoAmbientes .fecharPainel button { + background: none; + border: none; + outline: none; + + width: 8vw; + height: 5vh; + background-color: #c6c6c6; + box-shadow: 5px 5px 0px #9a9a9a; + font-size: 1vw; + color: var(--Matriz); + transition: 1s ease; +} + +.PopPainel.EdicaoAmbientes .fecharPainel button:hover { + background-color: var(--Cor_Segundaria_5_1); + box-shadow: -5px 5px 0px var(--Cor_Segundaria_5_2); +} + +.PopPainel.EdicaoAmbientes .CorpoPainel { + + width: 100%; + height: 70vh; + padding-top: 2vh; + overflow-y: auto; + + display: flex; + flex-direction: column; + justify-content: start; + align-items: center; + + gap: 2vh; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs { + + width: 100%; + padding-top: 2vh; + margin-top: 0.8vh solid var(--Matriz); + + display: flex; + flex-direction: column; + justify-content: start; + align-items: center; + + margin-bottom: 2vh; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 { + width: 100%; + + display: flex; + flex-direction: row; + justify-content: space-around; + align-items: center; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .TitutloPopup { + + width: 40%; + height: 8vh; + + display: flex; + flex-direction: row; + justify-content: start; + align-items: center; + + font-family: var(--font_titulo); + color: var(--Matriz); + font-size: 1vw; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup { + + width: 70%; + height: 8vh; + + display: flex; + flex-direction: row; + justify-content: space-around; + align-items: center; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup input { + background: none; + outline: none; + border: none; + + width: 15vw; + height: 4vh; + + background-color: var(--Matriz); + border: 0.4vw solid var(--Cor_Segundaria_5_1); + box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_5_2); + + padding-left: 1vw; + padding-right: 1vw; + + font-size: 0.8vw; + font-family: var(--font_titulo); + color: var(--Cor_Segundaria_5_1); + + + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup button { + background: none; + outline: none; + border: none; + + width: 4vw; + height: 6vh; + + background-color: var(--Cor_Segundaria_5_1); + box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_5_2); + + + + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_1 .PesquisaPopup img { + width: 2vw; +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 { + + width: 100%; + height: 30vh; + margin-top: 2vh; + padding-top: 2vh; + overflow-y: auto; + + display: flex; + flex-direction: column; + justify-content: start; + align-items: center; + align-content: center; + + + + background-color: var(--Matriz); + + gap: 1vw; +} + + +/* Estilo customizado para o scroll (somente no Webkit) */ +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar, +.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar { + width: 0.2vw; + /* Largura da barra de rolagem */ + height: 0.2vw; + /* Para scroll horizontal, se necessário */ +} + +/* Estilo para o polegar da barra de rolagem */ +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar-thumb, +.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar-thumb { + background-color: var(--Cor_Segundaria_5_1); + /* Cor da parte da barra que você arrasta */ + border-radius: 10px; + /* Borda arredondada */ + /* Borda ao redor do polegar */ +} + +/* Aumentando o tamanho do track (fundo da barra de rolagem) */ +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2::-webkit-scrollbar-track, +.PopPainel.EdicaoAmbientes .CorpoPainel::-webkit-scrollbar-track { + background-color: var(--Cor_Segundaria_5_2); + /* Cor do fundo do scroll */ + border-radius: 10px; + /* Borda arredondada */ + /* Usar diretamente a largura ou altura aqui para aumentar o track */ + width: 1vw; + /* Aumentando a largura do track para o scroll vertical */ + height: 1vw; + /* Aumentando a altura do track para o scroll horizontal */ +} + + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem { + + width: 18vw; + height: 8vh; + + display: flex; + align-items: center; + justify-content: space-around; + align-content: center; + + font-family: var(--font_titulo); + color: var(--Matriz); + font-size: 0.6vw; + + + background-color: var(--Cor_Segundaria_5_1); + box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_5_2); +} + + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem button { + background: none; + border: none; + outline: none; + + width: 6vw; + height: 3vh; + background-color: #c6c6c6; + box-shadow: 5px 5px 0px #9a9a9a; + font-size: 1vw; + color: var(--Matriz); + transition: 1s ease; + +} + +.PopPainel.EdicaoAmbientes .CorpoPainel .PainelDasborhs .Coluna_2 .DashbordItem button:hover { + background-color: var(--Cor_Segundaria_2_1); + box-shadow: -5px 5px 0px var(--Cor_Segundaria_2_2); +} \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/Painel/Painelpopup.css b/Css/page/Ambiente/Config/Ambientes/Painel/Painelpopup.css new file mode 100644 index 0000000..614d055 --- /dev/null +++ b/Css/page/Ambiente/Config/Ambientes/Painel/Painelpopup.css @@ -0,0 +1,18 @@ +.PopPainel { + + background-color: var(--Cor_Segundaria_3_1); + box-shadow: 5px 5px 0px 0px var(--Cor_Segundaria_3_2); + width: 40vw; + height: 60vh; + padding: 2vw; + + position: absolute; + top: 10vh; + left: 40vw; + + display: none; + flex-direction: column; + align-items: center; + justify-content: start; + +} \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/Painel/PopUp.css b/Css/page/Ambiente/Config/Ambientes/Painel/Respostapopup.css similarity index 100% rename from Css/page/Ambiente/Config/Ambientes/Painel/PopUp.css rename to Css/page/Ambiente/Config/Ambientes/Painel/Respostapopup.css diff --git a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_1.css b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_1.css index 5f1a3c5..375db01 100644 --- a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_1.css +++ b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_1.css @@ -1,5 +1,5 @@ .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap { - width: 90%; + width: 80%; height: 74vh; padding: 2vw; @@ -22,16 +22,17 @@ } .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .insercao_ambiente button { - width: 14vw; + width: 7vw; height: 6vh; } .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa { - width: 60%; + width: 70%; height: 8vh; display: flex; justify-content: space-between; align-items: center; + } .bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa input { @@ -39,7 +40,7 @@ outline: none; border: none; - width: 15vw; + width: 13vw; height: 4vh; background-color: var(--Matriz); @@ -53,4 +54,23 @@ font-family: var(--font_titulo); color: var(--Cor_Segundaria_2_1); +} + +.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa button { + background: none; + outline: none; + border: none; + + width: 4vw; + height: 6vh; + + background-color: var(--Cor_Segundaria_2_1); + box-shadow: 4px 4px 0px 0px var(--Cor_Segundaria_2_2); + + +} + +.bloco_ambiente .seguimento_1 .capitulo_1 .painel_Cap .coluna_1 .pesquisa img { + width: 2vw; + filter: drop-shadow(2px 2px 0px var(--Cor_Segundaria_2_2)); } \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_2.css b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_2.css index 32c69f1..23c6bf1 100644 --- a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_2.css +++ b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_2.css @@ -43,88 +43,4 @@ /* Aumentando a largura do track para o scroll vertical */ height: 1vw; /* Aumentando a altura do track para o scroll horizontal */ -} - - - -.subpainel_Status { - width: 100%; - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - gap: 1vw; - -} - -.subpainel_Status .bloco_1 { - width: 25%; - height: 6vh; - - display: flex; - justify-content: center; - align-items: center; - - background-color: var(--Cor_Segundaria_2_1); - box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); -} - -.subpainel_Status .bloco_2 { - width: 70%; - height: 6vh; - - display: flex; - justify-content: space-between; - align-items: center; - gap: 1vw; - - background-color: var(--Cor_Segundaria_2_1); - box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); -} - -.subpainel_Status .bloco_1 .titulo { - - - font-family: var(--font_titulo); - color: var(--Matriz); - font-size: 0.6vw; -} - -.subpainel_Status .bloco_2 .Mensagem_ambiente { - - font-family: var(--font_titulo); - margin-left: 1vw; - color: var(--Matriz); - font-size: 1vw; - -} - -.subpainel_Status .bloco_2 .button_rel button { - background: none; - outline: none; - border: none; -} - - -.subpainel_Status .bloco_2 .button_rel img { - width: 1.6vw; - filter: drop-shadow(3px 3px 0px var(--Cor_Segundaria_2_2)); -} - - -.subpainel_Status .bloco_2 .status_ambiente { - font-family: var(--font_titulo); - color: var(--Cor_Segundaria_5_1); - font-size: 0.7vw; - - margin-right: 1vw; - background-color: var(--Matriz); - padding: 0.2vw; - - display: flex; - justify-content: center; - align-items: center; - border-radius: 2vw; - width: 4vw; - height: 3vh; } \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_3.css b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_3.css index de97ff4..027f80c 100644 --- a/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_3.css +++ b/Css/page/Ambiente/Config/Ambientes/estrutura/Sec_Cap_3.css @@ -74,19 +74,4 @@ display: flex; flex-direction: column; align-items: center; -} - -.opicao button { - outline: none; - background: none; - border: none; - - width: 20vw; - height: 6vh; - background-color: var(--Cor_Segundaria_2_1); - box-shadow: 5px 5px 0px var(--Cor_Segundaria_2_2); - - font-family: var(--font_titulo); - color: var(--Matriz); - font-size: 1.2vw; } \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Estrutura/estrutura_config.css b/Css/page/Ambiente/Config/Estrutura/estrutura_config.css index b5cfa5e..3c775f8 100644 --- a/Css/page/Ambiente/Config/Estrutura/estrutura_config.css +++ b/Css/page/Ambiente/Config/Estrutura/estrutura_config.css @@ -1,3 +1,5 @@ @import url(../../../../global/import.css); + @import url(./menu.css); +@import url(./tela.css); @import url(./menu_houver.css); \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Estrutura/menu.css b/Css/page/Ambiente/Config/Estrutura/menu.css index 449cd28..d075577 100644 --- a/Css/page/Ambiente/Config/Estrutura/menu.css +++ b/Css/page/Ambiente/Config/Estrutura/menu.css @@ -62,7 +62,7 @@ body { /* Estilo para o polegar da barra de rolagem */ .menu::-webkit-scrollbar-thumb { - background-color: var(--Matriz); + background-color: var(--Cor_Segundaria_3_1); /* Cor da parte da barra que você arrasta */ border-radius: 10px; /* Borda arredondada */ @@ -71,7 +71,7 @@ body { /* Aumentando o tamanho do track (fundo da barra de rolagem) */ .menu::-webkit-scrollbar-track { - background-color: var(--Cor_Segundaria_5_2); + background-color: var(--Cor_Segundaria_3_2); /* Cor do fundo do scroll */ border-radius: 10px; /* Borda arredondada */ diff --git a/Css/page/Ambiente/Config/Estrutura/menu_houver.css b/Css/page/Ambiente/Config/Estrutura/menu_houver.css index b817dfb..f615eea 100644 --- a/Css/page/Ambiente/Config/Estrutura/menu_houver.css +++ b/Css/page/Ambiente/Config/Estrutura/menu_houver.css @@ -48,7 +48,7 @@ } to { - width: 20vw; + width: 25vw; } } \ No newline at end of file diff --git a/Css/page/Ambiente/Config/Estrutura/tela.css b/Css/page/Ambiente/Config/Estrutura/tela.css new file mode 100644 index 0000000..d7ab550 --- /dev/null +++ b/Css/page/Ambiente/Config/Estrutura/tela.css @@ -0,0 +1,3 @@ +.telaConfig { + width: 75vw; +} \ No newline at end of file diff --git a/html/Config.html b/html/Config.html index 5b50ea8..8e071b9 100644 --- a/html/Config.html +++ b/html/Config.html @@ -12,7 +12,7 @@ -
+
diff --git a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes.js b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes.js new file mode 100644 index 0000000..ea52c19 --- /dev/null +++ b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes.js @@ -0,0 +1,249 @@ + + +const dataAmbientes = { + + itguys: { + nome: 'ItGuys', + }, + enseg: { + nome: 'Enseg', + }, + OestPan: { + nome: 'OestPan', + }, + Prolog: { + nome: 'Prolog', + } + +} + +function AlinhamentoAmbientes() { + + const ListaAmbientes = document.getElementById('apresentarAmbientes'); + ListaAmbientes.innerHTML = ComponenteAmbientes(); + + setTimeout(() => { + for (let ambiente in dataAmbientes) { + const nome = dataAmbientes[ambiente].nome; + FormeEditarAmbiente(nome); // Agora chamamos a função para associar o evento de clique + } + }, 0); + + + + FormeCriarAmbiente(); + +} + + +function ComponenteAmbientes() { + // Inicializa uma variável para armazenar o conteúdo HTML gerado + let htmlContent = ''; + + // Itera sobre as chaves de dataAmbientes (itguys, enseg, etc.) + for (let ambiente in dataAmbientes) { + const nome = dataAmbientes[ambiente].nome; + + // Adiciona um painel para cada ambiente + htmlContent += ` + +
+
+ Logo da Itguys +
+
+
+

${nome}

+
+
+ + +
+
+
+ +
+
+ +` + } + + + // Retorna o HTML completo + return htmlContent; + // Chama a função para adicionar o evento de clique após o HTML ser inserido + +} + + + +function FormeCriarAmbiente() { + const InsercaoAmbiente = document.getElementById('criarAmbiente') + InsercaoAmbiente.addEventListener('click', CriarAmbiente); + + function CriarAmbiente() { + const PainelCriacao = document.getElementById('PopPainel'); + PainelCriacao.style.display = 'flex' + PainelCriacao.classList.add('CriacaoAmbientes'); + PainelCriacao.innerHTML = PainelAmbiente(); + + function PainelAmbiente() { + + return ` +
+ +
+ +
+ +
+ +
+

Informações do Ambiente

+
+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+ +
+ +
+

Informações do Cliente

+
+ +
+ + +
+ +
+ + + +
+ + +
+ +
+ + + +
+ +
+ + `; + + } + + + } + + +} + +function FormeEditarAmbiente(Empresa) { + const ItemAmbiente = document.getElementById(`Painel_${Empresa}`); + ItemAmbiente.addEventListener('click', PaineldeEdicao); + + function PaineldeEdicao() { + const PainelEdicao = document.getElementById('PopPainel'); + + PainelEdicao.style.display = 'flex' + PainelEdicao.classList.add('EdicaoAmbientes'); + PainelEdicao.innerHTML = PainelAmbiente(); + + Extras(); + + function PainelAmbiente() { + return ` +
+ +
+
+
+
+
+

Dashbords ${Empresa}

+
+
+ + +
+
+
+
+

Nome da Dashbord

+ +
+ +
+ +
+ +
+
+
+

Grupos ${Empresa}

+
+
+ + +
+
+
+
+

Nome do Grupo

+ +
+ +
+ +
+ +
+ + `; + } + + function Extras() { + fechar(); + + + function fechar() { + const FecharPainelEdicao = document.getElementById('FecharPainel'); + FecharPainelEdicao.addEventListener('click', EncerrarTarefa); + + function EncerrarTarefa() { + + PainelEdicao.style.display = 'none' + PainelEdicao.classList.remove('EdicaoAmbientes'); + PainelEdicao.innerHTML = ``; + + + } + + + } + + } + } +} diff --git a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesAlertas.js b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesAlertas.js new file mode 100644 index 0000000..7b996bf --- /dev/null +++ b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesAlertas.js @@ -0,0 +1,43 @@ + +function AlinhamentoAmbientesAlertas() { + + const ListaAmbientesAlertas = document.getElementById('ListadeAlertas'); + ListaAmbientesAlertas.innerHTML = ComponenteAmbientesAlertas(); + +} + +function ComponenteAmbientesAlertas() { + + return ` + +
+ +
+
+

Nome da Empresa

+
+
+ +
+ +
+

mensagem de status do ambiente

+
+ +
+ +
+ +
+

OFF

+
+ +
+ +
+ +` + +} diff --git a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesRelatorio.js b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesRelatorio.js new file mode 100644 index 0000000..95e2a88 --- /dev/null +++ b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesRelatorio.js @@ -0,0 +1,16 @@ + +function AlinhamentoAmbientesRelatorios() { + + const ListaAmbientesRelatorios = document.getElementById('ListeRelatorios'); + ListaAmbientesRelatorios.innerHTML = ComponenteAmbientesRelatorios(); + +} + +function ComponenteAmbientesRelatorios() { + + return ` + + + ` + +} diff --git a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes_Root.js b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes_Root.js index 5ef72e7..3f00b7d 100644 --- a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes_Root.js +++ b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes_Root.js @@ -1,6 +1,6 @@ //Variavel botão 1 responsavel por inicar a função -var BotaoAmbienteConfig = document.getElementById('opicao_1'); +var BotaoAmbienteConfig = document.getElementById('StatusAmbiente'); BotaoAmbienteConfig.addEventListener('click', surgirAmbiente); @@ -9,8 +9,13 @@ function surgirAmbiente() { var estilo = document.getElementById('conexao'); var painel = document.getElementById('preenchimento'); - estilo.href = 'ola'; + estilo.href = '../Css/page/Ambiente/Config/Ambientes/AmbientesConfig.css'; painel.innerHTML = EstruturaPrincipal(); + + + AlinhamentoAmbientesAlertas(); + AlinhamentoAmbientesRelatorios(); + AlinhamentoAmbientes(); } @@ -18,10 +23,90 @@ function EstruturaPrincipal() { return ` - +
+ + +
+
+
+

Ambientes

+
+ +
+
+
+ +
+
+ + +
+
+
+
+ +
+
+
+ +
+
+

Status dos Ambientes

+
+ +
+ +
+
+
+

Controle de Ambiente

+
+
+
+ + + +
+
+ +
+ + +
+
+
+ +
+ +
+
+ +
+ `; -} \ No newline at end of file +} + +var AmbientesCriador = document.createElement('script'); +AmbientesCriador.src = '../js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/Ambientes.js'; +AmbientesCriador.type = 'text/javascript'; +AmbientesCriador.id = 'AmbientesCriador_11'; +document.body.appendChild(AmbientesCriador); + + +var AmbientesAlertas = document.createElement('script'); +AmbientesAlertas.src = '../js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesAlertas.js'; +AmbientesAlertas.type = 'text/javascript'; +AmbientesAlertas.id = 'AmbientesAlertas_11'; +document.body.appendChild(AmbientesAlertas); + +var AmbientesRelatorios = document.createElement('script'); +AmbientesRelatorios.src = '../js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/AmbientesRelatorio.js'; +AmbientesRelatorios.type = 'text/javascript'; +AmbientesRelatorios.id = 'AmbientesRelatoriso_11'; +document.body.appendChild(AmbientesRelatorios); diff --git a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/config.js b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/config.js index 5bb2fe1..4278414 100644 --- a/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/config.js +++ b/js/page/Ambiente/Config/Estrutural_config/Modulo_Construcao/Funcao/config.js @@ -1,7 +1,7 @@ //Variavel botão 2 responsavel por inicar a função -var botao_2 = document.getElementById('opicao_2'); +var botao_2 = document.getElementById('opicao_1'); botao_2.addEventListener('click', surgir2); //Variavel botão 3 responsavel por inicar a função