--

src/views/Editor/Playground.vue

@@ -12,26 +12,46 @@
 import Pane from '../../components/Pane';
 import DrawPanel from './components/drawPanel';
 import DrawCanvasPanel from './components/drawCanvasPanel';
+import events from "@/global-events.js"
+
 export default {
   name: 'Playground',
   components: { Pane, DrawPanel,DrawCanvasPanel},
+  props: {
+    zoom:0.5
+  },
   data:{
-	  zoom:0.5
+	  
   },
   methods: {
-    
+    mouseWheel(e){
+		console.log(e)
+		if(e.deltaY>0){
+			this.zoom-=0.1
+		}else if(e.deltaY<0){
+			this.zoom+=0.1
+		}
+		console.log(this.zoom)
+		 events.$emit('setPlaygroundZoom', {zoom:this.zoom});
+	}
   },
   computed: {
 	playgroundStyle(){
-		alert()
+		//this.zoom=0.5;
 		let style={
 			zoom:`${this.zoom}`
 		}
+		console.log(1213,style)
 		return style
 	},
   },
   created(){
-	   events.$emit('setPlaygroundZoom', {zoom:this.zoom});
+	  //alert()
+	  this.zoom=0.5;
+	   document.body.addEventListener('mousewheel',(e)=>{
+		   this.mouseWheel(e)
+	   },false)
+	  
   }
 };
 </script>