1

admin

2026-01-06 089bf5d2378b3c4a61d795b2a92bede2c193b771

 src/components/layout/AbsModule.vue

New file
@@ -0,0 +1,80 @@
<template>
  <div>
    <div class="abs-module" v-show="isShow">
      <div class="abs-box">
        <i class="el-icon-circle-close" @click="close" />
        <a href="https://www.aliyun.com/minisite/goods?userCode=kqyyppx2" target="_blank">
          <img src="~@/assets/image/aliyun-abs.jpg" width="300" />
        </a>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      isShow: false,
    }
  },
  created() {
    if (this.getNum() <= 2) {
      setTimeout(() => {
        this.isShow = true
      }, 1000 * 60 * 2)
    }
  },
  methods: {
    getNum() {
      return parseInt(sessionStorage.getItem('ABS_BOX')) || 0
    },
    close() {
      sessionStorage.setItem('ABS_BOX', this.getNum() + 1)
      this.isShow = false
    },
  },
}
</script>
<style lang="less" scoped>
.abs-module {
  position: fixed;
  width: 300px;
  height: 163.63px;
  right: 20px;
  top: 20px;
  border-radius: 5px;
  z-index: 9999;
  overflow: hidden;
  transition: all 2s;
  animation: absfade 1000ms infinite;

  .abs-box {
    width: 100%;
    height: 100%;
    position: relative;

    i {
      position: absolute;
      right: 10px;
      top: 10px;
      color: white;
      cursor: pointer;
      font-size: 22px;
    }
  }
}

@keyframes absfade {
  from {
    transform: scale(1);
  }

  50% {
    transform: scale(1.02);
  }

  to {
    transform: scale(1);
  }
}
</style>