yos_web/src/views/mediaStatistics/modules/drawerDetail.vue

<template>
  <div>
    <el-button size="small" type="text" @click="onShow" :disabled="disabled">{{$t(btn_title)}}</el-button>
    <el-drawer
        :visible.sync="drawer"
        size="85%"
        style="padding-top: 0px !important;"
        append-to-body
        >
      <projectDetail  ref="detailRef" :pageDisabled="true"></projectDetail>
    </el-drawer>
<!--    <projectDetail ref="detailRef" v-if="drawer"></projectDetail>-->
  </div>
</template>

<script>
import projectDetail from '@/HDrpManagement/projectChange/modules/detail'
export default {
  name: "drawerDetail",
  props:['data','detailPath','idName','disabled','overview','listqueryid','total','btn_title'],
  components:{
    projectDetail
  },
  computed:{
  },
  data () {
    return {
      drawer:false
    }
  },
  methods:{
    onShow () {
      this.drawer = true
      console.log(this.data,'输出data销售漏斗')
      console.log(this.data[this.idName],'输出id33333')
      let  query = {id:this.data[this.idName],rowindex:this.data.rowindex,listqueryid:this.listqueryid}

      console.log(query,'query数据222')

      this.$router.push({path:this.detailPath.path,query:Object.assign({},query,this.detailPath.param)})


      // this.$router.push({path:'/funnelProjectDetail',query:{id:this.data[key],rowindex:this.data.rowindex}})

    }
  },
}
</script>

<style scoped>
.detail__panel{
  background:#f1f2f3;
  overflow-y: scroll;
  font-size: 14px;
  color:#666;
  height:100vh;
}
.stage__panel{
  padding: 0px 10px 0px 10px ;
  height: 32px;
  line-height: 32px;
  min-width:85px;
  border-radius: 2px;
  transform: skewX(-20deg);
  margin-left:15px;
  margin-bottom: 10px;
  text-align: center;
  cursor: pointer;
  background: #EEEEEE;
}
.stage__panel > div {
  transform: skewX(45deg);
}
/deep/ .el-drawer {
  background-color: #e8e9e9;
}
/deep/ .el-drawer__header {
  padding: 0px !important;
  margin-bottom: 0 !important;
  font-size: 16px !important;
  font-family: PingFang SC-Bold, PingFang SC;
  font-weight: bold !important;
  color: #333333 !important;
}
/deep/ header{
  height: 0 !important;
}
</style>