|
|
@@ -1,100 +1,115 @@
|
|
|
<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>
|
|
|
+ <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
|
|
|
- }
|
|
|
+ name: "slideshow",
|
|
|
+ props: {
|
|
|
+ autoplay: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true,
|
|
|
},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- width: 375,
|
|
|
- height: 500,
|
|
|
- list: [],
|
|
|
- }
|
|
|
+ interval: {
|
|
|
+ type: [Number, String],
|
|
|
+ default: 5000,
|
|
|
},
|
|
|
- methods: {
|
|
|
- getBanners(locations, systemclient = 'marketingtool') {
|
|
|
- return new Promise((resolve, reject) => {
|
|
|
- this.$Http.basic({
|
|
|
- "id": "20240426154302",
|
|
|
- "content": {
|
|
|
- systemclient,
|
|
|
- locations,
|
|
|
- date: Date.now()
|
|
|
- }
|
|
|
- }).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)
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
+ 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,
|
|
|
+ date: Date.now(),
|
|
|
+ },
|
|
|
+ })
|
|
|
+ .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>
|
