1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798 |
- <template>
- <view>
- <view v-if="list.length">
- <swiper :style="{
- width: tovw(width),
- height: tovw(height),
- }" :autoplay="autoplay" :interval="interval" circular>
- <swiper-item class="swiper-item" v-for="(item, index) in list" :key="item.list">
- <u--image @click="onClick(index)" :src="item.cover" :width="tovw(width)" :height="tovw(height)"
- mode="aspectFill" :lazy-load="true">
- <template v-slot:loading>
- <u-loading-icon color="red"></u-loading-icon>
- </template>
- </u--image>
- </swiper-item>
- </swiper>
- </view>
- <view style="height: 10px;" v-else-if="empty" />
- </view>
- </template>
- <script>
- import { viewImage } from "../utils/settleFiles";
- export default {
- name: 'slideshow',
- props: {
- autoplay: {
- type: Boolean,
- default: true
- },
- interval: {
- type: [Number, String],
- default: 5000
- },
- empty: {
- type: Boolean,
- default: false
- }
- },
- data() {
- return {
- width: 375,
- height: 500,
- list: [],
- }
- },
- methods: {
- getBanners(locations, systemclient = 'marketingtool') {
- return new Promise((resolve, reject) => {
- this.$Http.basic({
- "id": "20240426154302",
- "content": {
- systemclient,
- locations
- }
- }).then(res => {
- console.log("获取广告位" + locations, res)
- resolve(res.msg)
- if (this.cutoff(res.msg)) return;
- try {
- let list = res.data[locations[0]];
- if (list.length) {
- if (list[0].dimensional) {
- let dimensional = list[0].dimensional.split("*")
- this.width = dimensional[0] - 0;
- this.height = dimensional[1] - 0;
- };
- this.list = list.map(v => {
- v.cover = this.getSpecifiedImage(v.attinfos[0], 'compressed')
- return v
- })
- }
- } catch (error) {
- }
- })
- })
- },
- onClick(index) {
- let item = this.list[index];
- console.log("点击广告图", index, item)
- if (item.hyperlink) {
- uni.navigateTo({
- url: item.hyperlink,
- fail: (fail) => {
- console.log("跳转失败原因", fail)
- viewImage(item.attinfos[0].url)
- },
- })
- } else {
- viewImage(item.attinfos[0].url)
- }
- }
- },
- }
- </script>
- <style lang="scss" scoped></style>
|