左右结构，能收缩；数据有箭头能收起展开；

1，在左右结构中间加个左右箭头的标识，可以向左收起左边的部分，右边的就变全屏展示；向右展开左边的部分，右边的变成原来的模样。

<div :class="shushu2 ? 'shushu2' : 'shushu'" @click="shushu"><i class="iconfont iconjiantou-copy1" :class="shushu2 ? 'xuanzhuan' : ''"></i></div>

.shushu{
    width: 12px;
    height: 40px;
    background: #9FAAE3;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 15%;
    cursor: pointer;
}
.shushu:hover{
    background: #5B71E3;
}
.iconjiantou-copy1{
    color: #FFFFFF;
    display: inline-block;
    position: absolute;
    top: 9px;
    left: -1px;
    font-size: 14px;
}
.shushu2{
    width: 12px;
    height: 40px;
    background: #9FAAE3;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 5px;
    cursor: pointer;
    /* display: none; */
}
.shushu2:hover{
    background: #5B71E3;
}
.xuanzhuan {
  transform: rotate(180deg);
  display: inline-block;
}

shushu(){
   if(this.shushu2){
       document.getElementsByClassName("LevalLfet")[0].style.display = "block";  //显示左边
   }else{
       document.getElementsByClassName("LevalLfet")[0].style.display = "none";  //隐藏左边自己
   }
   this.shushu2 = !this.shushu2;
},

右边的从shushu2 字段来控制

<LevelSet style="height: 100%;float: right;background:#fff;" :class="shushu2 ? 'maxWidth' : 'minWidth'">
</LevelSet>

.minWidth{
    width: 84.4%;
}
.maxWidth{
    width:99.1%;
}

2，左边的数据，可以有上下的箭头能收起展开

<div style="height: 40px;background: #FFFFFF;border-radius: 4px;border: 1px solid #CCCCCC;position: relative;" @click="Department()">
   <i class="iconfont iconshaixuan3" style="color: #6586FC;margin-left: 22px;"></i>
    <span style="font-size: 14px;font-family: PingFang SC;font-weight: 530;color: #333333;margin-left: 5px;line-height: 40px;">
        xxx</span>
    <i :class="{iconfont:true,'icontriangle-right-copy':true,xuanzhuan1:shifoXuanzhuan1}" style="color: #6586FC;cursor: pointer;
    position: absolute;top: 7px;right: 26px;">
    </i>
</div>

icontriangle-right-copy是上箭头，xuanzhuan1是给箭头旋转成下箭头，根据this.shifoXuanzhuan1这个字段来的，为true就旋转；

.xuanzhuan1{
    transform: rotate(180deg);
    display: inline-block;
}

Department(){
   this.shifoXuanzhuan1 = !this.shifoXuanzhuan1;
    if (this.shifoXuanzhuan1){
        document.getElementsByClassName('DepartReset')[0].style.display = "none"; 
    }else{
        document.getElementsByClassName('DepartReset')[0].style.display = "block"; 
    }
},

DepartReset是需要收起展开的div

<div style="text-align: center;padding-top: 12px;padding-bottom: 12px;background: #F5F7FF;" class="DepartReset">

</div>