<template>
  <view >
    <uni-drawer ref="drawer"  :type="type" :width="drawerWidth" mask-background-color="rgba(0,0,0,0.4)">
        <slot name="drawerInfo">

        </slot>

    </uni-drawer>
  </view>
</template>

<script>
export default {
  name: "en-drawer",
  components: {},
  props: {
    showTop:{
      type:Boolean,
      default:true
    },
    type:{
      type:String,
      default: 'left'
    },
    width:{
      type:Number,
      default: 0
    }
  },
  data() {
    return {
      drawerWidth:375
    }
  },
  watch: {},
  mounted() {
    console.log(uni.getSystemInfoSync().windowWidth)
    if(this.width>0){
      this.drawerWidth=this.width
    }else {
      // this.drawerWidth=this.width
    }
  },
  methods: {
    open(){
      this.$refs.drawer.open()
    },
    setTabBar(e){
      // console.log(e)
      // if(e.show){
      //   uni.hideTabBar()
      // }else {
      //   uni.showTabBar()
      // }
    },
    close(){
      this.$refs.drawer.close()
    }
  }
}
</script>

<style scoped lang="scss">
.popup-box{
  background: #FFFFFF;
  border-radius: 20rpx 20rpx 0 0;
  box-shadow: 0px -8px 20px 0px rgba(0,0,0,0.04);
  padding: 28rpx 32rpx 50rpx 32rpx;
  z-index: 100;
  .popup-title{
    .popup-close{
      margin: 0 auto;
      width: 82rpx;
      height: 10rpx;
    }
  }
}

</style>