<template>
  <div>
    <el-button size="small" type="text" @click="onShow(drawer=true)">详情2</el-button>
    <el-drawer
      title="我是标题"
      :visible.sync="drawer"
      :with-header="false"
      direction="rtl"
      size="90%"
      append-to-body>
      <div class="detail__panel">
        <router-view v-if = "drawer"/>
      </div>
    </el-drawer>
  </div>
</template>

<script>
export default {
  props:['data','detailPath','idName'],
  components:{
  },
  computed:{
	},
  data () {
    return {
      drawer:false
    }
  },
  methods:{
    onShow () {
      let query = {id:this.data[this.idName],rowindex:this.data.rowindex}
      this.$router.push({path:this.detailPath.path,query:Object.assign({},query,this.detailPath.param)})
    }
  }
}

</script>
<style>
</style>
<style scoped>
.detail__panel{
  background:#eeeeee;
  overflow-y: scroll;
  font-size: 14px;
  color:#666;
  height:100vh;
}
</style>