This commit is contained in:
DESKTOP-GMUNQ1B\k 2024-04-10 17:04:57 +08:00
parent 53d52b0621
commit 3063a637a2
2 changed files with 138 additions and 125 deletions

View File

@ -8,7 +8,8 @@
<view class="nav" v-if="showTab&&list.length>0">
<view class="nav-item" @click="navTo('/pages/cloud_warehouse/home/home')">
<view class="nav-item-up">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/c72bf202403191713119980.webp" mode=""></image>
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/c72bf202403191713119980.webp" mode="">
</image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">里海云仓</view>
@ -17,7 +18,8 @@
</view>
<view class="nav-item" @click="navTo('/pages/cloud_warehouse/market/market')">
<view class="nav-item-up">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/de539202403191713558109.webp" mode=""></image>
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/de539202403191713558109.webp" mode="">
</image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">供销云市场</view>
@ -26,7 +28,8 @@
</view>
<view class="nav-item" @click="navTo('/pages/cloud_warehouse/specialty/specialty')">
<view class="nav-item-up">
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/81f8a202403191714238972.webp" mode=""></image>
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/81f8a202403191714238972.webp" mode="">
</image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">名优特产</view>
@ -34,30 +37,35 @@
</view>
</view>
</view>
<!-- 资讯 -->
<view v-if="showTab&&list.length>0" @click="navTo('/pages/news_list/index?type=20')" style="display: flex;justify-content: space-between;padding-bottom: 20rpx;font-size: 26rpx;color: #999999;height: 70rpx;align-items: center;">
<view style="font-size: 28rpx;background-color: #40ae36;color: #fff;padding: 4rpx 16rpx 6rpx 16rpx;border-radius: 90rpx;">里海新闻</view>
<view style="display: flex;">更多<u-icon name="arrow-right" size="12" color="#999"></u-icon></view>
</view>
<view class="information" v-if="showTab&&list.length>0">
<scroll-view scroll-x style="height: 230rpx;width: 700rpx;white-space: nowrap;">
<view class="nav-item" style="display: inline-block;margin-right: 16rpx;" @click="navTo(`/pages/news_details/index?id=${item.article_id}`)" v-for="(item, index) in list" :key="item.article_id">
<view class="nav-item-up" style="overflow: hidden;">
<image :src="item.image_input" mode="aspectFill"></image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">{{item.title}}</view>
<view class="nav-item-down-desc">{{item.synopsis}}</view>
</view>
</view>
</scroll-view>
</view>
<!-- 资讯 -->
<view v-if="showTab&&list.length>0" @click="navTo('/pages/news_list/index?type=20')"
style="display: flex;justify-content: space-between;padding-bottom: 20rpx;font-size: 26rpx;color: #999999;height: 70rpx;align-items: center;">
<view
style="font-size: 28rpx;background-color: #40ae36;color: #fff;padding: 4rpx 16rpx 6rpx 16rpx;border-radius: 90rpx;">
里海新闻</view>
<view style="display: flex;">更多<u-icon name="arrow-right" size="12" color="#999"></u-icon></view>
</view>
<view class="information" v-if="showTab&&list.length>0">
<scroll-view scroll-x style="height: 230rpx;width: 700rpx;white-space: nowrap;">
<view class="nav-item" style="display: inline-block;margin-right: 16rpx;"
@click="navTo(`/pages/news_details/index?id=${item.article_id}`)" v-for="(item, index) in list"
:key="item.article_id">
<view class="nav-item-up" style="overflow: hidden;">
<image :src="item.image_input" mode="aspectFill"></image>
</view>
<view class="nav-item-down">
<view class="nav-item-down-title">{{item.title}}</view>
<view class="nav-item-down-desc">{{item.synopsis}}</view>
</view>
</view>
</scroll-view>
</view>
<!-- tab导航 -->
<view class="tabs" v-if="showTab">
<block v-for="(item,indx) in tabsArr" :key="indx">
<view v-if="indx>0" style="width: 3rpx;height: 36rpx;background-color: #ccc;"></view>
<view v-if="indx>0" style="width: 3rpx;height: 36rpx;background-color: #ccc;"></view>
<view :class="{'tabs-item-active':item.val==currTabs}" class="tabs-item" @click="changeTab(item.val)">
<view class="tabs-item-main">{{item.name}}</view>
<view class="tabs-item-sub">{{item.desc}}</view>
@ -66,11 +74,12 @@
</view>
<view class='recommendList' :class="indexP?'on':''">
<WaterfallsFlow v-if="hostProduct.length>0" :wfList='hostProduct' @itemTap="goDetail" :type="0" :sale_type="sale_type"/>
<view class='pictrue' v-if="!loading&&hostProduct.length==0">
<image :src="`${domain}/static/images/noCart.png`"></image>
<view>暂无商品看点别的吧</view>
</view>
<WaterfallsFlow v-if="hostProduct.length>0" :wfList='hostProduct' @itemTap="goDetail" :type="0"
:sale_type="sale_type" />
<view class='pictrue' v-if="!loading&&hostProduct.length==0">
<image :src="`${domain}/static/images/noCart.png`"></image>
<view>暂无商品看点别的吧</view>
</view>
</view>
</view>
</template>
@ -88,14 +97,16 @@
import {
toLogin
} from '@/libs/login.js';
import {
getArticleList
} from "@/api/api.js";
import {
getArticleList
} from "@/api/api.js";
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
import {
HTTP_REQUEST_URL
} from '@/config/app';
import { Toast } from "../../libs/uniApi";
import {
Toast
} from "../../libs/uniApi";
export default {
components: {
WaterfallsFlow
@ -108,10 +119,10 @@
return [];
}
},
showTab: {
type: Boolean,
default: false
},
showTab: {
type: Boolean,
default: false
},
indexP: {
type: Boolean,
default: false
@ -120,11 +131,11 @@
type: Boolean,
default: false
},
sale_type:{
type: [Number, String],
default: 1
},
loading:{
sale_type: {
type: [Number, String],
default: 1
},
loading: {
type: Boolean,
default: false
},
@ -145,38 +156,38 @@
desc: '商户汇聚',
val: 3
}, {
name: '名优特产',
name: '名优特产',
desc: '特色农副',
val: 4
}],
currTabs: 1,
list: []
list: []
};
},
mounted() {
this.getArticleList();
this.getArticleList();
},
methods: {
changeTab(e) {
this.currTabs = e;
this.$emit('changeRecommedTab', e)
this.$emit('changeRecommedTab', e)
},
navTo(url) {
uni.navigateTo({
url: url,
fail: () => {
Toast('暂未开放')
}
})
},
getArticleList() {
getArticleList(20, {
page: 1,
limit: 10
}).then(res => {
this.list = res.data.list;
})
},
navTo(url){
uni.navigateTo({
url: url,
fail: () => {
Toast('暂未开放')
}
})
},
getArticleList(){
getArticleList(20,{
page: 1,
limit: 10
}).then(res=>{
this.list = res.data.list;
})
},
goDetail(item) {
goShopDetail(item, this.uid).then(res => {
if (this.isLogin) {
@ -228,7 +239,7 @@
//
.nav {
display: flex;
justify-content: space-between;
justify-content: space-between;
margin-bottom: 20rpx;
.nav-item {
@ -271,9 +282,9 @@
.tabs {
display: flex;
justify-content: space-between;
align-items: center;
align-items: center;
margin: 0 -20rpx 30rpx;
padding-top: 20rpx;
padding-top: 20rpx;
.tabs-item {
width: 23%;
@ -321,64 +332,66 @@
/deep/.looming-gray {
border-radius: 16rpx 16rpx 0 0;
}
.information{
// display: flex;
// justify-content: space-between;
// margin-bottom: 20rpx;
.nav-item {
width: 227rpx;
overflow: hidden;
border-radius: 20rpx;
position: relative;
.nav-item-up {
width: 100%;
height: 227rpx;
image {
width: 100%;
height: 100%;
}
}
.nav-item-down {
position: absolute;
bottom: 0;
left: 0;
width: 227rpx;
padding: 8rpx 2rpx 8rpx 14rpx;
background: rgba(0, 0, 0, 0.4);
.nav-item-down-title {
font-weight: 500;
font-size: 26rpx;
color: #FFFFFF;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.nav-item-down-desc {
font-size: 20rpx;
color: #FFFFFF;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
}
}
.pictrue{
display: flex;
flex-direction: column;
align-items: center;
color: #999;
image {
width: 414rpx;
height: 305rpx;
}
}
.information {
// display: flex;
// justify-content: space-between;
// margin-bottom: 20rpx;
.nav-item {
width: 227rpx;
overflow: hidden;
border-radius: 20rpx;
position: relative;
.nav-item-up {
width: 100%;
height: 227rpx;
image {
width: 100%;
height: 100%;
}
}
.nav-item-down {
position: absolute;
bottom: 0;
left: 0;
width: 227rpx;
padding: 8rpx 2rpx 8rpx 14rpx;
background: rgba(0, 0, 0, 0.4);
.nav-item-down-title {
font-weight: 500;
font-size: 26rpx;
color: #FFFFFF;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.nav-item-down-desc {
font-size: 20rpx;
color: #FFFFFF;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
}
}
.pictrue {
display: flex;
flex-direction: column;
align-items: center;
color: #999;
image {
width: 414rpx;
height: 305rpx;
}
}
</style>

View File

@ -504,7 +504,7 @@
name: '供销云市场批发',
val: 2
}, {
name: '名优特产批发',
name: '名优特产批发',
val: 3
}],
tabsCurr: 1,