Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

tarang19's avatar

filter not get update

I want to filter date and show to user on hover but i am not getting updated filter on each hover

code this is in method but i am getting each id on hover

// ------------------------------------------
      // - on hover display relations in circle
      // ------------------------------------------
      //Wife,husband,
      let relations = [ 'wife', 'husband', 'son', 'daughter' , 'sister', 'brother', 'father', 'mother' ];
     
      let schemaWrapper = `<div class='wrapper-relation-circle'></div>`;
      let schemaRelation = `<a class='relation-circle' href="javascript:;"></a>`;

      let prevStackIndex, higherStackIndex = 110;

      // stop event propagation for external tree links
      $( '.descendant a.external-tree, .ancestor a.external-tree' ).hover(
        function(evt) {
          evt.stopPropagation();
          return false;
        },
        function(evt) {
          evt.stopPropagation();
          return false;
        }
      );

      let self = this;
      $('.action-edit').mouseover(function (e){
      })
      $( '.descendant, .ancestor' ).not('.blank').hover (

        function() {
          window.hoverId = event.currentTarget.getAttribute('data-id');
        
          let filteredList, isMale, isFemale,isFather,isMother;

        
          self.$axios.$get( `http://localhost:3001/userRelationValidator/${window.hoverId}/609e122f00c656001adbc48b`, {timeout: 120000 })
            .then(resp => {
              //let c = [];

              // console.log(resp)
              isMale = resp.gender === "male" ? true : false;
              isFemale = resp.gender === "female" ? true : false;
              isFather = resp.father === 1 ? true : false;
              isMother = resp.mother === 1 ? true : false;

              let r = new Promise( (resolve, reject) => {
                relations = relations.filter(item =>{
                  if (item === 'husband'){
                    return isFemale
                  }
                  if (item === 'wife'){
                    return isMale
                  }
                  if (item === 'father'){
                    return !isFather
                  }
                  if (item === 'mother'){
                    return !isMother
                  }
                  return true
                })
                console.log(relations)
                return relations
                setTimeout(() => resolve("done!"), 0);
              })

              r.then( result => {})


            


            })



          prevStackIndex = $( this ).css( 'z-index' );

          // update stack / zindex
          $( this ).css( 'z-index', higherStackIndex );

          // add wrapper
          let relationWrapper = $( schemaWrapper );
          $( this ).append( relationWrapper );

          // get the dimesions of wrapper
          let relationWrapperDimesions = {};
          relationWrapperDimesions.width = relationWrapper.width();
          relationWrapperDimesions.height = relationWrapper.height();

          // circular position calculator
          let radius = relationWrapperDimesions.width / 2.5;
          let cenX = ( relationWrapperDimesions.width / 2.5 ) - 15;
          let cenY = ( relationWrapperDimesions.height / 2 ) - 43;
          let angle = 0;
          let steps = Math.PI * 2 / relations.length;
          let left, top;

          // add relations

          _.forEach( relations, ( relation, relationIndex ) => {
            //console.log('relationIndex',relationIndex)
            //console.log('hover',self);
            angle = relationIndex * steps;

            left = cenX + Math.cos(angle) * radius;
            top = cenY + Math.sin(angle) * radius;

            let relationCurrent = $( schemaRelation );
            let htmlImg = `<img src="/relations/${relation}-icon.png">`;
            relationCurrent.html( htmlImg );

            // on click event
            relationCurrent.on( 'click', event => {
              // let desc id
              let descId = $( this ).attr( 'data-id' );
              console.log(descId)
              //console.table(self.sendData())
              window.activenode = descId;

              //promise to send active id to
              // store familyTree/userInfo

              let emitPromise = new Promise( (resolve, reject) => {
                //console.log(this)
                const relationData = {
                  id: window.activenode,
                  relation: `${relation}`
                };
                //console.log(relationData)
                self.sendData(relationData);
                setTimeout(() => resolve("done!"), 0);
              })

              emitPromise.then( result => {
                window.relation = `${relation}`
                console.log('`${relation}`',`${relation}`)
                //$nuxt.$emit('createData', `${relation}`)
                //self.$emit("openDialogForm",`${relation}`)
                $nuxt.$emit('open-dialog-form')
                //alert( `Adding ${relation} for user id : ${descId}` );
              })


            });

            relationWrapper.append( relationCurrent );

            relationCurrent.animate({
              top: top,
              left:left,
              opacity: 1,
            }, (75 * relationIndex) );

          });

        },

can any one tell where i am doing mistake

0 likes
0 replies

Please or to participate in this conversation.