<template>
  <div class="banner-W240H400">
    <template v-if="isMobile">
      <div id="adfox_1670489353942786"></div>
      <div id="adfox_163334173071715979"></div><!-- Old dashboard-->
    </template>

    <template v-else>
      <div align="center">
         <div id="adfox_167048927679894492"></div>
        <div id="adfox_163238704807435857"></div><!-- Old dashboard-->
      </div>
    </template>
  </div>
</template>

<script>
export default {
  watch: {
    $route (to, from) {
      // eslint-disable-next-line no-undef
      Ya.adfoxCode.reload('adfox_1670489353942786')
      // eslint-disable-next-line no-undef
      Ya.adfoxCode.reload('adfox_163334173071715979')
      // eslint-disable-next-line no-undef
      Ya.adfoxCode.reload('adfox_167048927679894492')
      // eslint-disable-next-line no-undef
      Ya.adfoxCode.reload('adfox_163238704807435857')
    }
  },
  mounted () {
    if (this.isMobile) {
      window.yaContextCb.push(() => {
        // eslint-disable-next-line no-undef
        Ya.adfoxCode.create({
          ownerId: 720777,
          containerId: 'adfox_1670489353942786',
          params: {
            p1: 'cwoic',
            p2: 'hyrh'
          }
        })
        // eslint-disable-next-line no-undef
        Ya.adfoxCode.create({
          ownerId: 279920,
          containerId: 'adfox_163334173071715979',
          params: {
            pp: 'g',
            ps: 'dbpj',
            p2: 'hjgv'
          }
        })
      })
    } else {
      window.yaContextCb.push(() => {
        // eslint-disable-next-line no-undef
        Ya.adfoxCode.create({
          ownerId: 720777,
          containerId: 'adfox_167048927679894492',
          params: {
            p1: 'cwoib',
            p2: 'hyrh'
          }
        })
        // eslint-disable-next-line no-undef
        Ya.adfoxCode.create({
          ownerId: 279920,
          containerId: 'adfox_163238704807435857',
          params: {
            pp: 'g',
            ps: 'dbpj',
            p2: 'hijw'
          }
        })
      })
    }
  },
  computed: {
    isMainPage () {
      return this.$route.name === 'index'
    },
    isMobile () {
      return this.$nuxt.$device.isMobile
    }
  }
}
</script>

<style lang='less'>
.banner-W240H400 {
  width: 100%;
  max-height: 400px;
  overflow: hidden;
  min-height: auto;
  text-align: center;
  position: relative;
  text-align: center;
  // background-color: blue;
  // &::after {
  //   content: "Небоскреб";
  //   position: absolute;
  // }
  div{
    margin: 0 auto;
    div{
      margin: 0 auto;
    }
  }
}
</style>
