vue中实现左右，上下拖拽(全,可复制)

左右拖拽效果图:

直接上代码:

html:

<div id="box">
  <div id="left"></div>
  <div id="resize"></div>
  <div id="right"></div>
</div>

CSS:

body,html{
   
  margin:0;
  padding:0;
  height:100%;
}
#box{
   
  width:600px;
  height:500px;
  overflow:hidden;
}
#left{
   
  width:calc(30% - 5px);
  height:100%;  
  background:skyblue;
  float:left;
}

#resize{
   
  width:5px;
  height:100%;
  cursor: w-resize;
  float:left;
}

#right{
   
  float:right;
  width:70%;
  height:100%;  
  background:tomato;
}

js:

window.onload = function(){
   
  var resize