liangxin/xdd-uniapp-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task(千县名品)：产品随机列表展示

Browse Source
This commit is contained in:
linxi
2024-10-28 11:15:37 +08:00
parent f3f47d236f
commit 440b058d33
1 changed files with 98 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pkg_product/views/famousQianxianShop.vue
+98 -24
View File
@@ -505,8 +505,8 @@
v-if="activeIndex === 4"
class="good-list-wrap"
>
<view class="good-list-cont">
<view class="list-cont-left">
<view class="good-list-cont v12-d-grid-columns-2">
<!-- <view class="list-cont-left">
<view
v-for="(item, index) in leftList"
:key="index"
@@ -537,9 +537,42 @@
@view="goGoodsCon(item)"
/>
</view>
</view>
</view> -->
<view v-for="(item, index) in leftList" :key="index">
<view v-if="item.productId" class="v12-white v12-radius-20 v12-pa-2 f-wrap" @click="goGoodsCon(item)">
<view class="focus-img">
<image :src="item.productImage" class="img"></image>
</view>
<view class="more-t v12-pt-2" style="height: 84rpx">{{ item.productName }}</view>
<view class="v12-justify-between v12-algin-center v12-pt-2">
<view>
<text class="v12-font-bold v12-primary-text v12-font-24">￥</text>
<text class="v12-font-bold v12-primary-text v12-font-28">{{ item.productPrice }}</text>
</view>
<view class="btn">
<image
:src="webUrl + '/home/icon-cart.png'"
class="img"
/>
</view>
</view>
</view>
<view v-if="!item.productId" class="v12-white v12-radius-20 v12-pa-2 f-wrap" @click="goStore(item)">
<view class="focus-img">
<image :src="item.cover" class="img" mode="heightFix|widthFix"></image>
<image
:src="webUrl + '/orderIcon/farmer.png'"
class="mark-img"
/>
</view>
<view class="more-t v12-pt-2" style="height: 84rpx">{{ item.name }}</view>
<view class="v12-justify-start v12-align-center v12-pt-2">
<view class="btn v12-mr-2">
<image :src="item.logo" class="img v12-radius-100"></image>
</view>
<view class="one-t v12-font-24 v12-dark1-text" style="width:230rpx">{{ item.ownerName }}/{{ inn.name }}</view>
</view>
</view>
</view>
</view>
<image
@@ -690,6 +723,14 @@ export default {
this.getListReq()
},
methods: {
goStore(item) {
this.$yrouter.push({
path: '/pagesInn/inn/innHome',
query: {
id: item.farmerShopId
}
})
},
load() {
this.$refs.uReadMore.init();
},
@@ -748,28 +789,28 @@ export default {
if (success) {
const products = data.products || []
const farmerShops = data.farmerShops || []
// this.leftList = this.sortProductsAndStores(products, farmerShops)
// console.log(this.leftList);
products.map((item, index) => {
item.isOldBrand = 0
item.isLandmarkGoods = 0
if (index % 2 === 0) {
this.leftList.push(item)
}
if (index % 2 === 1) {
item.isFarmer = 1
this.rightList.push(item)
}
})
this.leftList = this.sortProductsAndStores(products, farmerShops)
console.log(this.leftList);
// products.map((item, index) => {
// item.isOldBrand = 0
// item.isLandmarkGoods = 0
// if (index % 2 === 0) {
// this.leftList.push(item)
// }
// if (index % 2 === 1) {
// item.isFarmer = 1
// this.rightList.push(item)
// }
// })
}
})
},
shuffleArray(array) {
for (let i = array.length - 1; i > 0; i--) {
let j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
let j = Math.floor(Math.random() * (i + 1));
[array[i], array[j]] = [array[j], array[i]];
}
return array;
},
sortProductsAndStores(products, stores) {
const randomMap = []
@@ -1091,7 +1132,35 @@ export default {
</script>
<style scoped lang="less">
@import "@/assets/css/store.less";
.focus-img {
position: relative;
.img {
position: relative;
z-index: 2;
display: block;
width: 310rpx;
height: 310rpx;
border-radius: 20rpx;
}
.mark-img {
position: absolute;
top: 0;
right: 0;
z-index: 3;
display: block;
width: 125rpx;
height: 83rpx;
}
}
.btn {
.img {
display: block;
width: 48rpx;
height: 48rpx;
}
}
.my-inn-page {
padding: 0 0 100rpx 0;
background-color: #f6f6f6;
@@ -1791,9 +1860,11 @@ export default {
.good-list-cont {
position: relative;
z-index: 2;
display: flex;
justify-content: space-between;
padding: 0 21rpx 21rpx 21rpx;
// display: flex;
// justify-content: space-between;
padding: 20rpx;
grid-column-gap: 10px;
grid-row-gap: 10px;
.list-cont-left,
.list-cont-right {
width: calc(50% - 11rpx);
@@ -1812,4 +1883,7 @@ export default {
.no-data-loadend {
width: 100%;
}
.f-wrap{
box-sizing: border-box;
}
</style>