{"ast":null,"code":"export default {\n  props: {\n    images: {\n      type: Array,\n      required: true\n    },\n    pageSize: {\n      type: Number,\n      required: true\n    },\n    currentPage: {\n      type: Number,\n      required: true\n    },\n    currentBench: {\n      type: Number | String\n    }\n  },\n  computed: {\n    paginatedImages() {\n      const startIndex = (this.currentPage - 1) * this.pageSize;\n      const endIndex = startIndex + this.pageSize;\n      return this.images.slice(startIndex, endIndex);\n    }\n  },\n  methods: {\n    handleImageClick(index) {\n      this.$emit(\"handleImageClick\", index);\n    },\n    prevPage() {\n      this.$emit(\"prev-page\");\n    },\n    nextPage() {\n      this.$emit(\"next-page\");\n    }\n  }\n};","map":{"version":3,"names":["props","images","type","Array","required","pageSize","Number","currentPage","currentBench","String","computed","paginatedImages","startIndex","endIndex","slice","methods","handleImageClick","index","$emit","prevPage","nextPage"],"sources":["src/views/ordinaryPage/components/ImageList/index.vue"],"sourcesContent":["<template>\n  <div class=\"image-box\">\n    <button @click=\"prevPage\" class=\"slide-right\"><div class=\"triangle\"></div></button>\n    <transition-group name=\"slide\" mode=\"out-in\" class=\"image-list\">\n      <div v-for=\"(image, index) in paginatedImages\" :key=\"index\" v-if=\"image.alt != currentBench\" class=\"image-item\" @click=\"handleImageClick(index)\">\n        <img :src=\"image.url\" :alt=\"image.alt\">\n      </div>\n    </transition-group>\n    <!-- <span>{{ currentPage }}</span> -->\n    <button @click=\"nextPage\" class=\"slide-left\"><div style=\"transform: rotate(180deg)\" class=\"triangle\"></div></button>\n  </div>\n</template>\n\n<script>\nexport default {\n  props: {\n    images: {\n      type: Array,\n      required: true\n    },\n    pageSize: {\n      type: Number,\n      required: true\n    },\n    currentPage: {\n      type: Number,\n      required: true\n    },\n    currentBench: {\n      type: Number | String,\n    }\n  },\n  computed: {\n    paginatedImages() {\n      const startIndex = (this.currentPage - 1) * this.pageSize;\n      const endIndex = startIndex + this.pageSize;\n      return this.images.slice(startIndex, endIndex);\n    }\n  },\n  methods: {\n    handleImageClick(index) {\n      this.$emit(\"handleImageClick\", index);\n    },\n    prevPage() {\n      this.$emit(\"prev-page\");\n    },\n    nextPage() {\n      this.$emit(\"next-page\");\n    }\n  }\n};\n</script>\n\n<style>\n.image-box{\n  display: flex;\n}\n.slide-right,.slide-left{\n  width: 3.95vw;\n  height: 100%;\n\n\n\n}\n.triangle {\n  position: relative;\n  width: 0;\n  height: 0;\n  border-top: 15px solid transparent;\n  border-bottom: 15px solid transparent;\n  border-right: 15px solid #CCCCCC;\n  background: linear-gradient(to left, #FFFFFF, #CCCCCC);\n}\n\n.triangle::before {\n  content: \"\";\n  position: absolute;\n  top: -15px;\n  left: 15px;\n  width: 0;\n  height: 0;\n  border-top: 15px solid transparent;\n  border-bottom: 15px solid transparent;\n  border-right: 15px solid #FFFFFF;\n  transform: translateX(-100%);\n}\n.image-list {\n  height: 100%;\n  flex: 1;\n  display: flex;\n  justify-content: center;\n}\n\n.image-item {\n  margin-right: 1.04vw;\n  cursor: pointer;\n  width: 9.79vw;\n  height: 100%;\n  border-radius: 0.78vw;\n}\n\n.image-item img {\n  max-width: 100%;\n  height: auto;\n}\n\n.slide-enter-active,\n.slide-leave-active {\n  transition: transform 0.3s;\n}\n\n.slide-enter {\n  transform: translateX(100%);\n}\n\n.slide-leave-to {\n  transform: translateX(-100%);\n}\n\n.slide-right-enter-active,\n.slide-right-leave-active {\n  transition: transform 0.3s;\n}\n\n.slide-right-enter {\n  transform: translateX(-100%);\n}\n\n.slide-right-leave-to {\n  transform: translateX(100%);\n}\n\n.slide-left-enter-active,\n.slide-left-leave-active {\n  transition: transform 0.3s;\n}\n\n.slide-left-enter {\n  transform: translateX(100%);\n}\n\n.slide-left-leave-to {\n  transform: translateX(-100%);\n}\n</style>"],"mappings":"AAcA;EACAA,KAAA;IACAC,MAAA;MACAC,IAAA,EAAAC,KAAA;MACAC,QAAA;IACA;IACAC,QAAA;MACAH,IAAA,EAAAI,MAAA;MACAF,QAAA;IACA;IACAG,WAAA;MACAL,IAAA,EAAAI,MAAA;MACAF,QAAA;IACA;IACAI,YAAA;MACAN,IAAA,EAAAI,MAAA,GAAAG;IACA;EACA;EACAC,QAAA;IACAC,gBAAA;MACA,MAAAC,UAAA,SAAAL,WAAA,aAAAF,QAAA;MACA,MAAAQ,QAAA,GAAAD,UAAA,QAAAP,QAAA;MACA,YAAAJ,MAAA,CAAAa,KAAA,CAAAF,UAAA,EAAAC,QAAA;IACA;EACA;EACAE,OAAA;IACAC,iBAAAC,KAAA;MACA,KAAAC,KAAA,qBAAAD,KAAA;IACA;IACAE,SAAA;MACA,KAAAD,KAAA;IACA;IACAE,SAAA;MACA,KAAAF,KAAA;IACA;EACA;AACA"},"metadata":{},"sourceType":"module","externalDependencies":[]}