You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
52 lines
1.0 KiB
52 lines
1.0 KiB
7 months ago
|
<template>
|
||
|
|
<el-drawer class="drawer" :visible.sync="drawer" :direction="direction" :withHeader="withHeader" @select="handleSelect">
|
||
|
|
<el-menu class="menu" mode="horizontal">
|
||
|
|
<el-menu-item class="menu-item">抛丸</el-menu-item>
|
||
|
|
<el-menu-item class="menu-item">理料</el-menu-item>
|
||
|
|
<el-menu-item class="menu-item">划线</el-menu-item>
|
||
|
|
<el-menu-item class="menu-item">切割</el-menu-item>
|
||
|
|
</el-menu>
|
||
|
|
</el-drawer>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: "Drawer",
|
||
|
|
data(){
|
||
|
|
return{
|
||
|
|
drawer:true,
|
||
|
|
direction:'ltr',
|
||
|
|
withHeader:false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
handleSelect(key,path){
|
||
|
|
console.log(key,path)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.drawer{
|
||
|
|
width: 25%;
|
||
|
|
height: 100vh;
|
||
|
|
|
||
|
|
.menu{
|
||
|
|
width: 100%;
|
||
|
|
height: 100vh;
|
||
|
|
background-color: #002166;
|
||
|
|
|
||
|
|
.menu-item{
|
||
|
|
width: 90%;
|
||
|
|
text-align: center;
|
||
|
|
color: white;
|
||
|
|
margin: 5vh 5px;
|
||
|
|
background: #0d84ff url('../../../assets/kban/cqbg.png') no-repeat;
|
||
|
|
background-size: 100% 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|