Skip to content

Commit

Permalink
adicionei o texto de informações embaixo do mapa e o popover de 'saib…
Browse files Browse the repository at this point in the history 
…a mais'
  • Loading branch information
@Spirou1
Spirou1 committed Aug 12, 2024
1 parent 5d77076 commit fbed49f
Show file tree
Hide file tree
Showing 2 changed files with 141 additions and 72 deletions.
81 changes: 57 additions & 24 deletions src/modules/Entities/components/entity-location/template.php
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
<?php

/**
* @var MapasCulturais\App $app
* @var MapasCulturais\Themes\BaseV2\Theme $this
Expand All @@ -7,40 +8,39 @@
use MapasCulturais\i;

$this->import('
entity-field
entity-map
entity-field
entity-map
');
?>

<?php $this->applyTemplateHook('entity-location','before'); ?>
<?php $this->applyTemplateHook('entity-location', 'before'); ?>
<div :class="classes" class="entity-location grid-12">
<?php $this->applyTemplateHook('entity-location','begin'); ?>
<?php $this->applyTemplateHook('entity-location', 'begin'); ?>
<div v-if="!hideLabel" class="entity-location__title col-12">
<label v-if="verifiedAdress()"><?= i::__('Dados de endereço')?></label>
<label v-if="verifiedAdress()"><?= i::__('Dados de endereço') ?></label>
</div>
<div class="col-12" v-if="editable">
<div class="grid-12">
<entity-field @change="address(); pesquisacep(entity.En_CEP);" classes="col-4 sm:col-12" :entity="entity" prop="En_CEP"></entity-field>
<entity-field @change="address()" classes="col-8 sm:col-12" :entity="entity" prop="En_Nome_Logradouro"></entity-field>
<entity-field @change="address()" classes="col-2 sm:col-12" :entity="entity" prop="En_Num"></entity-field>
<entity-field @change="address()" classes="col-4 sm:col-12" :entity="entity" prop="En_Bairro"></entity-field>
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Complemento" label="<?php i::_e('Complemento ou ponto de referência')?>"></entity-field>
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Complemento" label="<?php i::_e('Complemento ou ponto de referência') ?>"></entity-field>
<entity-field v-if="statesAndCitiesCountryCode != 'BR'" @change="address()" classes="col-12" :entity="entity" prop="En_Pais" label="<?php i::_e('País') ?>"></entity-field>
</div>
</div>

<div class="col-12" v-if="editable && !statesAndCitiesEnable">
<div class="grid-12" v-if="!entity.En_Pais || entity.En_Pais == statesAndCitiesCountryCode">
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Estado" label="<?php i::_e('Estado')?>"></entity-field>
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Municipio" label="<?php i::_e('Município')?>"></entity-field>
</div>
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Estado" label="<?php i::_e('Estado') ?>"></entity-field>
<entity-field @change="address()" classes="col-6 sm:col-12" :entity="entity" prop="En_Municipio" label="<?php i::_e('Município') ?>"></entity-field>
</div>
</div>

<div class="col-12" v-if="editable && statesAndCitiesEnable">
<div class="grid-12" v-if="!entity.En_Pais || entity.En_Pais == statesAndCitiesCountryCode">
<div class="field col-6 sm:col-12">
<label class="field__title">
<?php i::_e('Estado')?>
<?php i::_e('Estado') ?>
<span v-if="isRequired('En_Estado')" class="required">*<?php i::_e('obrigatório') ?></span>
</label>
<select @change="citiesList(); address()" v-model="entity.En_Estado">
Expand All @@ -49,7 +49,7 @@
</div>
<div class="field col-6 sm:col-12">
<label class="field__title">
<?php i::_e('Município')?>
<?php i::_e('Município') ?>
<span v-if="isRequired('En_Municipio')" class="required">*<?php i::_e('obrigatório') ?></span>
</label>
<select @change="address()" v-model="entity.En_Municipio">
Expand All @@ -60,43 +60,76 @@
</div>

<div class="col-12">
<?php i::_e('Localização')?>
<?php i::_e('Localização') ?>
<div class="grid-12" v-if="entity.En_Pais && entity.En_Pais != statesAndCitiesCountryCode">
teste3
<div class="field col-6">
teste4
<label class="field__title">
<?php i::_e('Estado')?>
<label class="field__title">
<?php i::_e('Estado') ?>
<span v-if="isRequired('En_Estado')" class="required">*<?php i::_e('obrigatório') ?></span>
</label>
<input :id="propId('En_Estado')" v-model="entity.En_Estado" type="text" @change="address()" autocomplete="off">
</div>

<div class="field col-6">
<label class="field__title">
<?php i::_e('Município')?>
<?php i::_e('Município') ?>
<span v-if="isRequired('En_Municipio')" class="required">*<?php i::_e('obrigatório') ?></span>
</label>
<input v-model="entity.En_Municipio" :id="propId('En_Municipio')" type="text" @change="address()" autocomplete="off">
<input v-model="entity.En_Municipio" :id="propId('En_Municipio')" type="text" @change="address()" autocomplete="off">
</div>
</div>
</div>


<div v-if="verifiedAdress()" class="col-12">
<p class="entity-location__address">
<span v-if="entity.endereco">{{entity.endereco}}</span>
<span v-if="!entity.endereco"><?= i::_e("Sem Endereço"); ?></span>
</p>
<entity-map :entity="entity" :editable="editable"></entity-map>
<entity-map :entity="entity" :editable="editable"></entity-map>
<p class="info-text">
Ao selecionar a opção "Mostrar no perfil" abaixo, sua geolocalização será disponibilizada no seu perfil, no mapa público e na API.
<mc-popover ref="infoPopover" openside="down-right" classes="popover info-popover">
<template #default="popover">
<div class="popover__content">
<h2 class="popover__title">
<?= i::_e('Exibição de geolocalização') ?>
</h2>
<p class="popover__intro">
<?= i::_e('Ao selecionar uma geolocalização (ou manter a geolocalização apresentada quando preenche um endereço) e clicar na opção "Mostrar no perfil", a sua geolocalização será apresentada em:') ?>
</p>
<div class="popover__text">
<div class="popover__section">
<h3 class="popover__section-title"><?php i::_e('Seu perfil:') ?></h3>
<p><?php i::_e('Todas as pessoas que acessarem o seu perfil na plataforma Mapas terão acesso à geolocalização indicada.') ?></p>
</div>
<div class="popover__section">
<h3 class="popover__section-title"><?php i::_e('Mapa público:') ?></h3>
<p><?php i::_e('Todas as pessoas que acessarem o mapa público da plataforma Mapas poderão ver sua geolocalização e identificá-lo como agente cultural de determinada região.') ?></p>
</div>
<div class="popover__section">
<h3 class="popover__section-title"><?php i::_e('API:') ?></h3>
<p><?php i::_e('Todos os usos das informações da plataforma Mapas poderão ter acesso à sua geolocalização.') ?></p>
</div>
</div>
<div class="popover__footer">
<button @click="popover.close()" class="popover__close-btn">Fechar</button>
</div>
</div>
</template>
<template #button="popover">
<a @click="popover.toggle()" class="info-link"><?= i::_e('Saiba mais') ?></a>
</template>
</mc-popover>

</p>
</div>

<?php $this->applyTemplateHook('entity-location','end'); ?>
<?php $this->applyTemplateHook('entity-location', 'end'); ?>
<div class="col-12" v-if="editable && hasPublicLocation">
<div class="col-6 sm:col-12 public-location">
<entity-field @change="address()" type="checkbox" classes="public-location__field col-6" :entity="entity" prop="publicLocation" label="<?php i::esc_attr_e('Mostrar no perfil')?>"></entity-field>
<!-- <label class="public-location__label col-12"><?php i::_e('Marque o campo acima para tornar o endereço público ou deixe desmarcado para manter o endereço privado.')?></label> -->
<entity-field @change="address()" type="checkbox" classes="public-location__field col-6" :entity="entity" prop="publicLocation" label="<?php i::esc_attr_e('Mostrar no perfil') ?>"></entity-field>
</div>
</div>
</div>
<?php $this->applyTemplateHook('entity-location','after'); ?>
<?php $this->applyTemplateHook('entity-location', 'after'); ?>
132 changes: 84 additions & 48 deletions src/themes/BaseV2/assets-src/sass/2.components/_popover.scss
View file
Original file line number Diff line number Diff line change
@@ -1,42 +1,88 @@
@use '../0.settings/mixins'as *;

.popover {

&__content {
position: relative;
padding: size(16) size(16);

.field,
form {
&:first-child {
margin-top: 0;
}

.input {
border: 1px solid var(--mc-gray-100);
border-radius: var(--mc-border-radius-xs);
color: var(--mc-low);
font-size: size(16);
outline: 0;
padding: size(14);
width: 100%;
min-width: size(213);
}
}

.actions {
display: flex;
gap: size(10);
}
.popover__title {
font-size: 1.5rem !important;
font-weight: bold;
color: #333;
margin-bottom: 10px;
}
.popover__intro {
font-size: 1rem !important;
color: #333;
margin-bottom: 10px;
}
.popover__text {
font-size: 1rem !important;
color: #333;
text-align: left;
width: 100%;
margin-bottom: 20px;
}
.popover__section {
margin-bottom: 10px;
}
.popover__section-title {
font-size: 1rem !important;
font-weight: bold;
color: #333;
margin-bottom: 5px;
}
.popover__footer {
display: flex;
justify-content: center;
padding: 5px;
}
.popover__close-btn {
background-color: white;
color: #117c83;
padding: 10px 90px;
border-radius: 10px;
cursor: pointer;
font-size: 16px;
font-weight: bold;
transition: background-color 0.3s;
text-align: center;
margin-top: auto;
border-color: #117c83;
border-width: 2px;
}
.popover__close-btn:hover {
background-color: #87cefa;
}
.popover {
position: relative;
padding: 5px;
max-width: 550px;
max-height: 490px;
background: #fff;
overflow-y: auto;
display: flex;
flex-direction: column;
justify-content: center;
}
.info-text {
display: flex;
align-items: center;
}

.info-link {
align-self: center;
font-size: 1rem;
color: #117c83;
cursor: pointer;
margin-left: 5px;
}

.info-link:hover {
color: #87cefa;
text-decoration: underline;
}
}

.flex-container {
display: flex;
gap: size(5);
flex-direction: row;
align-items: flex-start;
margin-top: 0px;

.entity-terms{
.v-popper--theme-dropdown{
Expand All @@ -61,26 +107,26 @@
margin-top: 0rem;
}

// tooltip unique popover name
//unique popover name
div:nth-child(4).col-12.popover__area > div.flex-container.question > div:nth-child(1) > div{
position: absolute;
left: 120px;
top: 5px;
}

// tooltip unique popover area
// unique popover area
div:nth-child(5).col-12.popover__area > div.flex-container.question > div:nth-child(2) > div{
position: absolute;
left: 145px;
}

// tooltip unique popover funcao
// unique popover funcao
div:nth-child(6).col-12.popover__area > div.flex-container.question > div:nth-child(2) > div{
position: absolute;
left: 173px;
}

// tooltip unique popover tag
//unique popover tag
div:nth-child(7).col-12.popover__area > div.flex-container.question > div:nth-child(2) > div{
position: absolute;
left: 49px;
Expand All @@ -89,27 +135,17 @@ div:nth-child(7).col-12.popover__area > div.flex-container.question > div:nth-ch
//unique local de endereço
div > div:nth-child(1) > div.flex-container.endereco > div > div{
position: relative;
// left: 171px;
// top: 46px;
left: 171px;
top: 46px;
}

//unique agente itinerante
div > div:nth-child(1) > div.flex-container.col-12.itinerante > div > div{
position: relative;
left: 139px;
top: 28px;
left: 140px;
top: 43px;
}

.popover__area{
position: relative;
}

// tooltip Dados de endereço
div:nth-child(1) > div.flex-container.endereco.col-12 > div:nth-child(1) > div{
position: relative;
top: 32px;
left: 171px;
padding-top: 0px;
margin-top: 0px;
z-index: 9999;
}

0 comments on commit fbed49f

Please sign in to comment.