antd modal 添加全屏操作

Vue.directive('fullview', {
  // bind(el,binding,vnode,oldVnode){
  //   console.log('fullview bind:',el,binding,vnode,oldVnode)
  // },
  defaultStyle:{name:123},
  inserted(el,binding,vnode,oldVnode){  // 1:1
    let content = el.getElementsByClassName('poros-modal-content')[0]
    let close = el.getElementsByClassName('poros-modal-close')[0]
    let qp=document.createElement('a')
    qp.innerText="全屏"
    qp.className = 'fvbtn'
     qp.onclick = function () {
      if(content.classList.length ==1 ){
        content.classList.add('fullView')
        qp.innerText = '窗口化'
      } else {
        content.classList.remove('fullView')
        qp.innerText = '全屏'
      }
    }
    let button = el.getElementsByClassName('fvbtn')
    button&&button.length?'':content.insertBefore(qp,close)

  },
  componentUpdated(el,binding,vnode,oldVnode){
    setTimeout(() => {
      let qp = el.getElementsByClassName('fvbtn')[0]
      let content = el.getElementsByClassName('poros-modal-content')[0]
      if(!content){
        return
      }
      if(!qp){
        qp=document.createElement('acronym')
        qp.innerText="全屏"
        qp.className = 'fvbtn'
        let close = el.getElementsByClassName('poros-modal-close')[0]
        content.insertBefore(qp,close)
      }
      qp.onclick = function () {
        if(content.classList.length ==1 ){
          content.classList.add('fullView')
          qp.innerText = '窗口化'
        } else {
          content.classList.remove('fullView')
          qp.innerText = '全屏'
        }
      }
    }, 1000);
  }
})


.fvbtn {
  position: absolute;
  right: 60px;
  height: 56px;
  line-height: 56px;
}
.fullView {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.fullView .poros-modal-body {
  min-height: calc(100% - 150px);
}