禅道bug

ZZJ

2022-07-11 6ef2ac92c0d3f79b59b8698274918df830b58b29

 src/views/index/components/banner.vue

@@ -1,23 +1,17 @@
<template>
  <div class="banner">
    <el-carousel
      trigger="click"
      height="546px"
      :autoplay="false"
      arrow="never"
      ref="banner"
    >
    <el-carousel trigger="click" :autoplay="false" arrow="never" ref="banner">
      <el-carousel-item v-for="(item, index) in bannerList" :key="index">
        <div
          class="banner_content"
          :style="{
            // backgroundImage: 'url(' + baseImg + ')',
            backgroundImage: 'url(' + (item.pic ? item.pic : baseImg) + ')',
            backgroundImage: 'url(' + getUrl(item.pic) + ')',
            backgroundSize: '100% 100%',
            backgroundRepeat: 'no-repeat',
          }"
        >
          <div class="banner_text" v-html="item.name"></div>
          <!-- <div class="banner_text" v-html="item.name"></div> -->
        </div>
        <div class="link"></div>
      </el-carousel-item>
@@ -40,6 +34,21 @@
    toggleBanner(i) {
      this.$refs["banner"].setActiveItem(i);
    },
    getUrl(url) {
      let result = "";

      if (!url) {
        result = this.baseImg;
        return result;
      }
      var reg = /^[0-9]/;
      if (reg.test(url)) {
        result = "/httpImage/" + url;
        return result;
      }

      return url;
    },
  },
};
</script>
@@ -47,17 +56,27 @@
<style lang="scss" scoped>
.banner {
  position: relative;
  height: 546px;
  height: 28.18vw;
  min-height: 369px;
  width: 100%;
  min-width: 1280px;
  z-index: -1;
  top: -62px;

  .el-carousel ::v-deep {
    height: 100%;

    .el-carousel__container {
      height: 100%;
    }
  }

  .banner_content {
    height: 100%;
    padding: 183px 0 0 0;

    overflow: hidden;
    .banner_text {
      margin: 0 auto;
      margin-top: 183px;
      width: 1280px;
      color: #fff;
    }