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

View File

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