杨磊
6 小时以前 c6189f35d8744bf9c90bc15fd132ceb2a51d902c
src/views/chronology/yearWindow.vue
@@ -5,14 +5,14 @@
      <div class="leftTxt" v-html="info.eventOverview"></div>
      <div class="rightimg">
        <div class="imgBox" style="text-align: center" v-if="imgLink != ''">
          <div class="arrowBox leftArrowBox">
          <div class="arrowBox leftArrowBox" @click="leftArrow">
            <img class="autoImg" :src="arrow" alt="" />
          </div>
          <div class="imgBox">
            <img class="autoImg" :src="imgLink" alt="" />
          </div>
          <div class="arrowBox">
            <img  class="autoImg" :src="arrow" alt="" />
          <div class="arrowBox" @click="rightArrow">
            <img class="autoImg" :src="arrow" alt="" />
          </div>
        </div>
        <div style="text-align: center; font-size: 18px; color: #999" v-else>
@@ -39,15 +39,47 @@
      title: "",
      imgLink: "",
      arrow,
      currentIndex: 0,
      imgList: [],
    };
  },
  methods: {},
  methods: {
    leftArrow() {
      if (this.currentIndex == 0) {
        this.currentIndex = this.imgList.length - 1;
        this.imgLink = this.imgList[this.currentIndex];
      } else {
        this.currentIndex--;
        this.imgLink = this.imgList[this.currentIndex];
      }
    },
    rightArrow() {
      if (this.currentIndex == this.imgList.length - 1) {
        this.currentIndex = 0;
        this.imgLink = this.imgList[this.currentIndex];
      } else {
        this.currentIndex++;
        this.imgLink = this.imgList[this.currentIndex];
      }
    },
  },
  mounted() {
    console.log(this.info);
    this.title =
      this.info.name.split(",")[0] + " " + this.info.name.split(",")[1];
    this.imgLink = getPublicImage(this.info.eventPictures);
    console.log(this.imgLink);
    console.log(
      Array.isArray(this.info.eventPictures),
      "Array.isArray(this.info.eventPictures)"
    );
    if (Array.isArray(this.info.eventPictures)) {
      console.log(1);
      this.imgList = this.info.eventPictures.map((item) =>
        getPublicImage(item)
      );
      this.imgLink = this.imgList[0];
    } else {
      this.imgLink = getPublicImage(this.info.eventPictures);
    }
  },
};
</script>
@@ -96,16 +128,16 @@
  height: 30px;
  position: relative;
}
.imgBox{
.imgBox {
  display: flex;
  justify-content: center;
  align-items: center;
}
.arrowBox{
.arrowBox {
  margin: 0 5px;
}
.leftArrowBox{
.leftArrowBox {
  transform: rotate(180deg);
}
</style>