Question pour menu vue

Bonjour à tous

J’utilise ce code pour un menu avec des pages Design

Je voudrais faire la même chose avec des pages Vue

il y a t’il un équivalant à ce code pour les vue ?

<a href="#" class="menu-item" onclick="jeephp2js.planHeader_id=72; jeeFrontEnd.plan.displayPlan();">

Merci

Bonjour,
Ici core/desktop/js/view.js at alpha · jeedom/core (github.com) Ca doit faire un truc comme jeeFrontEnd.view.printView(_id).

1 « J'aime »

Ok, je vais regarder la Doc, merci

J’avais essayé de remplacer plan par view

<a href="#" class="menu-item" onclick="jeephp2js.viewHeader_id=72; jeeFrontEnd.view.displayView();">

Mais ça génère un erreur java

ca marche, merci

 <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(13);"> <i style="font-size:32px;" class="icon techno-pc"></i> </a></li>

ca marche mais ca ne change pas le titre de la page « vue », ca garde toujours le même.

C’est normal faut changer toi le titre. Jeedom a vraiment pas été prévu pour cette utilisation désolé…

je pensais qu’il prenait le titre de la vue, comme quand tu sélectionnes une vue dans le menu, c’est pas très grave, merci

Non le code est un peu plus compliqué que ça surtout en mobile ou c’est pas le meme

1 « J'aime »

Bonjour Nemeraud
Cela sert à naviguer d’une vue à l’autre ?
Si oui, ultra intéressant !
Tu peux alors détailler comment tu insère ce code dans une vue ? Comment tu en fait un bouton ?

Bonjour, Oui, j’utilise pas le dashboard en web, uniquement les vues

J’utilise simplement le widget HTML display et je crée un équipement Menu que je colle en début de chaque vue.

ca donner ce menu

avec ce code

<nav class="classDjeesignMenu">
    <ul>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(13);"> <i style="font-size:32px;" class="icon techno-pc"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(11);"> <i style="font-size:32px;" class="icon maison-house112"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(19);"> <i style="font-size:32px;" class="icon fas fa-video"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(16);"> <i style="font-size:32px;" class="icon techno-plug2"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(17);"> <i style="font-size:32px;" class="icon jeedom-feu"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(10);"> <i style="font-size:32px;" class="icon jeedomapp-temperature"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(18);"> <i style="font-size:32px;" class="icon nature-plant30"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(21);"> <i style="font-size:32px;" class="icon jeedom2-tirelire7"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(12);"> <i style="font-size:32px;" class="icon divers-svg2"></i> </a></li>
      <li><a href="#" class="menu-item" onclick="jeeFrontEnd.view.printView(20);"> <i style="font-size:32px;" class="icon divers-calendar2"></i> </a></li>
  </ul>
</nav>

<style>
/* Styles du cadre */
.classDjeesignPourtour
{
    width:100%;
    height:100%;    
    position:absolute;
    background-color: rgb(255,255,255);            
    border: 2px solid #133e40;
    border-radius: 8px;
}

.classDjeesignFondTitre
{
    width:100%;                         
    height:40px;
    position:absolute;
    border: 2px solid #133e40;
    border-radius: 8px 8px 0px 0px;
    background-color: #36b0b6;
    background-image: linear-gradient( #36b0b6, #2a8a8f);
}

.classDjeesignTitre
{
    width:100%;                         
    position:absolute;
    margin-top: 8px;
    text-align: center;
    font-family:Arial;
    font-weight:normal;
    font-size:16px;
}

.classDjeesignIcone
{
    width:30px;
    height:30px;
    position:absolute;
    margin-top:3px;
    margin-left:3px;
}

/* Styles du menu */
.classDjeesignMenu 
{
  #position:absolute;
  width: 100%;
  height: 100%;
}

.classDjeesignMenu ul,
.classDjeesignMenu li,
.classDjeesignMenu a {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 1;
}

.classDjeesignMenu ul {
  width: 100%;
  height: 100%;
  background-color: #36b0b6;
  background-image: linear-gradient( #36b0b6, #2a8a8f );
  padding: 5px 5px;
  border-radius: 5px;
  border: 1px solid #133e40;
}

.classDjeesignMenu ul:before {
  content: '';
  display: block;
}

.classDjeesignMenu ul:after {
  content: '';
  display: table;
  clear: both;
}

.classDjeesignMenu li {
  float: left;
  margin: 0 5px 0 0;
  border: 1px solid transparent;
}

.classDjeesignMenu li a {
  border-radius: 5px;
  padding: 8px 8px 8px 8px;
  display: block;
  text-decoration: none;
  color: #ffffff !important;
  border: 1px solid transparent;
  font-size: 16px;
}

.classDjeesignMenu li.active {
  border-radius: 5px;
  border: 1px solid #36b0b6;
}

.classDjeesignMenu li.active a {
  border-radius: 5px;
  display: block;
  background: #1e6468;
  border: 1px solid #133e40;
  box-shadow: inset 0 5px 10px #133e40;
}

.classDjeesignMenu li:hover {
  border-radius: 5px;
  border: 1px solid #36b0b6;
}

.classDjeesignMenu li:hover a {
  border-radius: 5px;
  display: block;
  background: #1e6468;
  border: 1px solid #133e40;
  box-shadow: inset 0 5px 10px #133e40;
}

/* Styles du widget */
.classDjeesignWidget
{
    width:100%;
    height:100%;    
    position:absolute;
    background-color: #36b0b6;
    border: 1px solid #133e40;
    border-radius: 8px;
}

.classDjeesignWidgetFondTitre
{
    width:100%;                         
    height:22px;
    position:absolute;
    border: 1px solid #133e40;
    border-radius: 8px 8px 0px 0px;
    background-color: #36b0b6;
    background-image: linear-gradient( #36b0b6, #2a8a8f);
   }

.classDjeesignWidgetTitre
{
    width:100%;                         
    position:absolute;
    margin-top: 2px;
    text-align: center;
    font-family:Arial;
    font-weight:normal;
    font-size:14px;     
}

.classDjeesignWidgetContenu {
  position: absolute;
  width: 100%;
  top: 27px;
  padding-left: 5px;
  padding-bottom: 20px;
}

.classDjeesignWidgetLigne {
  width: 100%;
  text-align: left;
  font-size: 14px;
}

.classDjeesignWidgetLigne img {
  padding-right: 5px;
  filter: invert(23%) sepia(15%) saturate(459%) hue-rotate(171deg) brightness(105%) contrast(93%);
}

.classDjeesignWidgetLigne img:hover {
  filter: invert(62%) sepia(45%) saturate(4103%) hue-rotate(324deg) brightness(101%) contrast(95%);
}
</style>

Ce sujet a été automatiquement fermé après 24 heures suivant le dernier commentaire. Aucune réponse n’est permise dorénavant.