vue-treeselect icon indicating copy to clipboard operation
vue-treeselect copied to clipboard

How to combine ALL_WITH_INDETERMINATE and BRANCH_PRIORITY of 'value-consists-of' property

Open sergx opened this issue 6 years ago • 2 comments
trafficstars

In my project i got treeselect, wich has several root nodes, and lots of sub-, and sub-sub- nodes. And i need to collect all of selected IDs. The only way to receive all IDs (as i know) is to set value-consists-of to ALL_WITH_INDETERMINATE, but field looks ugly in this case:

2019-10-19_20-22-00

For me would be perfect if i could get all selected IDs, like i have with ALL_WITH_INDETERMINATE, and field display like i have with BRANCH_PRIORITY.

But the way i solve this task it makes me sad: In source code dist/vue-treeselect.cjs.js i found what i need - forest.selectedNodeIds, and added watch param:

watch: {
  'forest.selectedNodeIds': function(newValue){
    this.$emit('changed-value', newValue);
  },

And now i can collect all selected IDs:

<treeselect
  v-model="materials.customValue"
  :multiple="true"
  :options="materials.options"
  value-consists-of="BRANCH_PRIORITY"
  @changed-value="(v) => {materials.value = v}"
  />

Is where a better way to solve this task without editing the source?

sergx avatar Oct 19 '19 17:10 sergx

So i had to made my own function at backend (PHP). It is ugly, i think, but maybe it will help you:

  public function materialsFromTreeselect($ids = array()){
    if(empty($ids)){
      $this->set_result_error('Не указаны IDs для materialsFromTreeselect');
    }
    $this->cache['materialsFromTreeselect_all_ids'] = $ids;
    $this->cache['materialsFromTreeselect_input_ids'] = $ids;
    
    foreach($this->set_to_cache('materials_tree') as $node){
      $this->materialsFromTreeselect_rec($node, array($node['id']));
    }

    $this->cache['materialsFromTreeselect_all_ids'] = array_unique($this->cache['materialsFromTreeselect_all_ids'], SORT_NUMERIC);
    return $this->cache['materialsFromTreeselect_all_ids'];
  }

  public function materialsFromTreeselect_rec($node, $deep_parents = array(), $deep_check = false){
    if($deep_check || (empty($node['children']) && in_array($node['id'], $this->cache['materialsFromTreeselect_input_ids']))){
      $this->cache['materialsFromTreeselect_all_ids'][] = $node['id'];
      foreach($deep_parents as $parent_id){
        $this->cache['materialsFromTreeselect_all_ids'][] = $parent_id;
      }
    }
    if(!empty($node['children'])){
      $deep_parents[] = $node['id'];
      if(in_array($node['id'], $this->cache['materialsFromTreeselect_input_ids'])){
        $deep_check = true;
      }
      foreach($node['children'] as $subNode){
        $this->materialsFromTreeselect_rec($subNode, $deep_parents, $deep_check);
      }
    } 
  }

  public function materialsToTreeselect($all_ids = array()){
    if(empty($all_ids)){
      $this->set_result_error('Не указаны IDs..');
    }
    if(empty($this->cache['materials_tree'])){
      $this->set_to_cache('materials_tree');
    }
    $this->cache['materialsToTreeselect_all_ids'] = $all_ids;
    $this->cache['materialsToTreeselect_ids'] = array();
    foreach($this->cache['materials_tree'] as $node){
      $res = $this->materialsToTreeselect_rec($node, 0);
      if(is_array($res)){
        $this->cache['materialsToTreeselect_ids'] = array_merge($this->cache['materialsToTreeselect_ids'], $res);
      }
    }
    return $this->cache['materialsToTreeselect_ids'];
  }

  public function materialsToTreeselect_rec($node, $levelToRoot = 0){
    if(in_array($node['id'], $this->cache['materialsToTreeselect_all_ids'])){

      if(!empty($node['children'])){
        $checked = array();
        $control = true;

        foreach($node['children'] as $subNode){
          if(empty($subNode['children'])){
            if(in_array($subNode['id'], $this->cache['materialsToTreeselect_all_ids'])){
              $checked[] = $subNode['id'];
            }else{
              $control = false;
            }
          }
          elseif(!empty($subNode['children'])){
            $result_from_next_level = $this->materialsToTreeselect_rec($subNode, $levelToRoot+1);
            if(is_array($result_from_next_level)){
              $checked = array_merge($checked, $result_from_next_level);
              $control = false;
            }elseif($result_from_next_level === true){
              $checked[] = $subNode['id'];
            }
          }
        }
      }
      if($control){
        $checked = true;
      }
      if($levelToRoot === 0 && $checked === true){
        return array($node['id']);
      }
      return $checked;
    }else{
      return false;
    }
  }

  public function materialsFromTreeselect_test($input_ids){
    sort($input_ids);
    $this->result['materialsFromTreeselect'] = array();
    $this->materialsFromTreeselect($input_ids);
    sort($this->cache['materialsFromTreeselect_all_ids']);
    $this->result['mts'] = $this->cache['materialsFromTreeselect_all_ids'];
    print_r(array('cache->materialsFromTreeselect_all_ids' => $this->cache['materialsFromTreeselect_all_ids']));
    $this->materialsToTreeselect($this->cache['materialsFromTreeselect_all_ids']);
    sort($this->cache['materialsToTreeselect_ids']);
    print_r(array('materialsToTreeselect_ids' => $this->cache['materialsToTreeselect_ids']));
  }

Part of input array (i get this from $this->set_to_cache('materials_tree')):

Array
(
    [0] => Array
        (
            [id] => 18527
            [parent_id] => 18166
            [menuindex] => 0
            [label] => Металлы, стали и сплавы
            [children] => Array
                (
                    [0] => Array
                        (
                            [id] => 18528
                            [parent_id] => 18527
                            [menuindex] => 0
                            [label] => Углеродистые стали и чугун
                            [children] => Array
                                (
                                    [0] => Array
                                        (
                                            [id] => 18529
                                            [parent_id] => 18528
                                            [menuindex] => 0
                                            [label] => Углеродистая сталь 3А
                                        )

sergx avatar Oct 22 '19 15:10 sergx

This feature will be amazing ! Any update ?

SwithFr avatar Jun 01 '21 08:06 SwithFr