From 83a766a7b07cd0617bcf728acfbe95c8784b36c5 Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期日, 04 八月 2024 16:56:49 +0800
Subject: [PATCH] 1
---
pages/home/components/home-banner-imgs.vue | 110 ++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 85 insertions(+), 25 deletions(-)
diff --git a/pages/home/components/home-banner-imgs.vue b/pages/home/components/home-banner-imgs.vue
index ef00757..11992c2 100644
--- a/pages/home/components/home-banner-imgs.vue
+++ b/pages/home/components/home-banner-imgs.vue
@@ -1,11 +1,32 @@
<template>
- <view class="flex home-banner-imgs">
- <view class="flex1 m-r-5">
- <image class="p1 img100" src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/b1/b1e7dc929b53412bbea72c9ca3f9aa25%E4%BD%8D%E5%9B%BE@2x%20(1).png" ></image>
+ <view class=" home-banner-imgs">
+ <view class="flex" v-if="list&&list.length>=3">
+ <view class="flex1 m-r-5">
+ <image class="p1 img100" :src="list[0].url" mode="scaleToFill" @click="previewImg(list[0].url)">
+ </image>
+ </view>
+ <view class="flex1 m-l-5">
+ <image class="p2 img100" :src="list[1].url" mode="scaleToFill" @click="previewImg(list[1].url)">
+ </image>
+ <image class="p3 img100" :src="list[2].url" mode="scaleToFill" @click="previewImg(list[2].url)">
+ </image>
+ </view>
</view>
- <view class="flex1 m-l-5">
- <image class="p2 img100" src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/86/86605e258843479f828ce6749010d791%E4%BD%8D%E5%9B%BE@2x%20(2).png"></image>
- <image class="p3 img100" src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/76/76532c632d28449a9f93a4228a7b851e%E4%BD%8D%E5%9B%BE@2x%20(3).png"></image>
+ <view class="flex l-2" v-else-if="list&&list.length>=2" mode="scaleToFill">
+ <view class="flex1 m-r-5">
+ <image class="p1 img100" :src="list[0].url" mode="scaleToFill" @click="previewImg(list[0].url)">
+ </image>
+ </view>
+ <view class="flex1 m-l-5">
+ <image class="p1 img100" :src="list[1].url" mode="scaleToFill" @click="previewImg(list[1].url)">
+ </image>
+ </view>
+ </view>
+ <view class="flex l-1" v-else-if="list&&list.length>=1" mode="scaleToFill">
+ <view class="flex1 m-r-5">
+ <image class="p1 img100" :src="list[0].url" mode="scaleToFill" @click="previewImg(list[0].url)">
+ </image>
+ </view>
</view>
</view>
</template>
@@ -14,29 +35,68 @@
export default {
data() {
return {
-
+ list: [],
};
+ },
+ async mounted() {
+ const {
+ data,
+ code
+ } = await this.$http.request('get', '/api/pub/advertisement/list', {
+
+ })
+ if (code === 0) {
+ this.list = data || []
+ for(var item of this.list){
+ item.url = item.cover
+ try{
+ if(item.url){
+ var t = JSON.parse(item.url)
+ if(Array.isArray(t)){
+ item.url = t[0] || ''
+ }else{
+ item.url = t.url || ''
+ }
+ }
+
+ }catch(e){
+ // console.log('error',e)
+ }
+ // item.url = item.cover
+ }
+ console.log(this.list)
+ }
+
}
}
</script>
<style lang="scss">
-.home-banner-imgs{
- .p1{
- // width: 334rpx;
- height: 308rpx;
- width: 100%;
+ .home-banner-imgs {
+ // background-color: #fff;
+ .p1 {
+ // width: 334rpx;
+ height: 308rpx;
+ width: 100%;
+ }
+
+ .p2 {
+ // width: 334rpx;
+ width: 100%;
+ height: 142rpx;
+ }
+
+ .p3 {
+ width: 100%;
+ margin-top: 18rpx;
+ // width: 334rpx;
+ height: 142rpx;
+ }
+ // .l-1{
+ // .p1{
+ // min-height: 308rpx;
+ // height: 308rpx;
+ // }
+ // }
}
- .p2{
- // width: 334rpx;
- width: 100%;
- height: 142rpx;
- }
- .p3{
- width: 100%;
- margin-top: 18rpx;
- // width: 334rpx;
- height: 142rpx;
- }
-}
-</style>
+</style>
\ No newline at end of file
--
Gitblit v1.9.3