You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
396 lines
11 KiB
396 lines
11 KiB
<template>
|
|
<!-- 积分商城 -->
|
|
<view >
|
|
<loadlogo v-if="!loadlogo" />
|
|
<view class="container" v-if="loadlogo">
|
|
<far-bottom></far-bottom>
|
|
|
|
<view class="header b-f" :style="{'background-image':'url('+imageRoot+'inte_bg_1.png)'}">
|
|
<view class="seach">
|
|
<input type="text" v-model="searchInput" @confirm="openSearch" class="input" value="" placeholder="请输入商品名称" />
|
|
</view>
|
|
<view class="header-title dis-flex flex-y-center flex-x-between">
|
|
<view class="header-title-left" style="padding: 20upx 0;">
|
|
<view class="dis-flex flex-y-center">
|
|
<view class="col-f f-24">我的{{textList.credittext}}</view>
|
|
<view class="dis-flex flex-y-center">
|
|
<image class="inte-logo" :src="imgfixUrls + 'integral/integral_logo.png'" mode=""></image>
|
|
<view class="f-50 col-f">{{homeInfoData.integral}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<swiper :autoplay="true" :interval="3000" :duration="1000" class="swiperView">
|
|
<swiper-item class="swiperItem" v-for="(item,index) in homeInfoData.adv" :key="index" @click="navgateTolink(item.link)">
|
|
<view class="inte-bg" :style="{'background-image':'url('+item.thumb+')'}"></view>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<!-- 社群 -->
|
|
<view v-if="!!homeInfoData.community" class="padding-box-all b-f">
|
|
<view class="diyPages-community dis-flex flex-x-between flex-y-center">
|
|
<view class="community-user dis-flex flex-y-center flex-box ">
|
|
<image :src="homeInfoData.community.imgUrl" class="community-user-img"></image>
|
|
<view class="community-user-info flex-box">
|
|
<view class="community-user-name col-0 f-28">{{ homeInfoData.community.name }}</view>
|
|
<view class="community-user-des f-24 col-9 onelist-hidden">{{homeInfoData.community.introduce}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="community-btn" v-if="!!homeInfoData.community">
|
|
<button class="community-add community-add-bgcolor f-24 col-f" @click="showCommunity = true" v-if="!!homeInfoData.community">添加</button>
|
|
</view>
|
|
</view>
|
|
<!-- 社群弹窗 -->
|
|
<pop-view :show="showCommunity" type="center" @clickmask="showCommunity = false">
|
|
<view class="community-detail b-f t-c">
|
|
<view class="community-header f-w f-36 p-r col-f"><text class="community-header-text p-r">{{homeInfoData.community.name}}</text></view>
|
|
<!-- #ifdef H5 -->
|
|
<view class="community-body">
|
|
<image :src="homeInfoData.community.qrcodeUrl" class="community-qrcodeimg"></image>
|
|
<view class="community-toreply f-26 col-3">长按识别二维码</view>
|
|
</view>
|
|
<!-- #endif -->
|
|
<!-- #ifndef H5 -->
|
|
<view class="community-body f-26 col-3">
|
|
有任何疑问，点击“<text class="col-m">去回复</text>”发送“<text class="col-m">{{homeInfoData.community.community_id}}</text>”,即可添加{{homeInfoData.community.name}}
|
|
</view>
|
|
<!-- #endif -->
|
|
<view class="community-phone dis-flex flex-y-center flex-x-between" v-if="!!homeInfoData.community.phone">
|
|
<view class="community-number dis-flex flex-y-center">
|
|
<image :src="imgfixUrls + 'goods/community.png'" class="community-number-icon"></image>
|
|
<view class="f-24 col-3">{{homeInfoData.community.phone}}</view>
|
|
</view>
|
|
<view class="community-bdial f-24" @click="callPhone(item.params.phone)">拨号</view>
|
|
</view>
|
|
<button class="community-reply f-24 col-f" open-type="contact" v-if="clienType==='3'">去回复</button>
|
|
</view>
|
|
</pop-view>
|
|
</view>
|
|
<filtertab :requestType="'3'" @pageScrollHeight="pageScrollHeight" :isPageScroll="'1'" @getOrderId="homelistInit"
|
|
@selectClassid="getClassid" @selectOrders="getOrders"></filtertab>
|
|
<block v-if="!!goodsListData && goodsListData.length>0">
|
|
<view class="goods-list dis-flex flex-x-between flex-warp">
|
|
<view class="goods-item b-f bor-radius-10upx" v-for="(goodsItem,index) in goodsListData" @click="skipGoods(goodsItem.id,'integral')">
|
|
<view class="goods-image" :style="{'background-image':'url('+goodsItem.thumb+')'}"></view>
|
|
<view class="goods-title onelist-hidden f-28 col-3">{{goodsItem.title}}</view>
|
|
<view class="goods-exchange dis-flex flex-y-center">
|
|
<view class="goods-inte dis-flex flex-y-center">
|
|
<image class="inte-price-logo" :src="imgfixUrls + 'integral/integral_logo.png'" mode=""></image>
|
|
<view class="inteStyle">{{goodsItem.use_credit1}} <text class="f-24">{{subText.credittext}}</text> <text class="plus" v-if="goodsItem.use_credit2>0">+</text> <text class="goods-price" v-if="goodsItem.use_credit2>0" c>{{goodsItem.use_credit2}}</text><text class="f-24" v-if="goodsItem.use_credit2>0">元</text></view>
|
|
</view>
|
|
<!-- <block v-if="goodsItem.use_credit2>0">
|
|
<view class="plus">+</view>
|
|
<view class="goods-price">{{goodsItem.use_credit2}}<text>元</text></view>
|
|
</block> -->
|
|
</view>
|
|
<view class="oldPirce dis-flex flex-x-between flex-y-center">
|
|
<view class="goods-oldPrice col-9 f-24" style="text-decoration:line-through;">市场价<text>¥{{goodsItem.old_price}}</text></view>
|
|
<view class="goods-inteBtn t-c f-24">兑换</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<load-more :isMore="loadingMore"></load-more>
|
|
</block>
|
|
<block v-else>
|
|
<none-mores></none-mores>
|
|
</block>
|
|
<view class="page-footer">
|
|
<TabBars :tabBarAct="0" :pageType="'10'" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import App from '@/common/js/app.js'
|
|
import popView from '@/components/template/PopManager.vue'
|
|
import Loadlogo from '@/components/template/loadlogo'
|
|
import loadMore from '@/components/template/loadmore.vue'
|
|
import TabBars from '@/components/template/tabBar.vue'
|
|
import filtertab from "@/components/template/filtertab.vue"
|
|
import noneMores from '@/components/template/nonemores.vue'
|
|
export default {
|
|
data() {
|
|
return {
|
|
showTabbar: false,
|
|
homeInfoData: {},
|
|
goodsListData: [],
|
|
total: null,
|
|
loadlogo: false, //页面是否加载完成,
|
|
loadingMore: true, //列表加载更多
|
|
current_page: 1,
|
|
textList: '',
|
|
sort_id: null,
|
|
class_id: null,
|
|
showCommunity: false,
|
|
searchInput:''
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.textList = uni.getStorageSync('TextSubstitution')
|
|
},
|
|
onShow() {
|
|
uni.setNavigationBarTitle({
|
|
title:this.textList.credittext
|
|
})
|
|
},
|
|
components: {
|
|
popView,
|
|
Loadlogo,
|
|
loadMore,
|
|
TabBars,
|
|
filtertab,
|
|
noneMores
|
|
},
|
|
computed: {
|
|
clienType() {
|
|
return App.getClientType()
|
|
},
|
|
subText() {
|
|
return uni.getStorageSync('TextSubstitution');
|
|
}
|
|
},
|
|
methods: {
|
|
openSearch(){
|
|
// rh
|
|
this.homelist("", "", 1);
|
|
},
|
|
homelistInit(sort) {
|
|
let _this = this;
|
|
_this.setData({
|
|
sort_id: sort
|
|
});
|
|
_this.homelist("", sort, 1);
|
|
},
|
|
homeInfo() {
|
|
let _this = this;
|
|
App._post_form('&p=consumption&do=homeInfo', {}, res => {
|
|
if (res.errno === 0) {
|
|
_this.setData({
|
|
homeInfoData: res.data
|
|
})
|
|
_this.homelistInit()
|
|
}
|
|
}, (err) => {
|
|
if (err.data.errno === 1) {
|
|
App.navigationTo({
|
|
url: err.data.data.url,
|
|
navType: 'rediRect'
|
|
})
|
|
}
|
|
}, () => {
|
|
_this.loadlogo = true;
|
|
})
|
|
},
|
|
homelist(cate_id = "", sort = "", page = 1, isPage = false) {
|
|
let _this = this,
|
|
requestData = {
|
|
page,
|
|
sort,
|
|
cate_id,
|
|
search:_this.searchInput
|
|
};
|
|
App._post_form('&p=consumption&do=homeList', requestData, res => {
|
|
if (res.errno === 0) {
|
|
let goodsData = res.data;
|
|
if (isPage) {
|
|
if (goodsData.list.length > 0) {
|
|
_this["goodsListData"].push(...goodsData.list);
|
|
} else {
|
|
_this.loadingMore = true;
|
|
}
|
|
} else {
|
|
_this.setData({
|
|
goodsListData: goodsData.list,
|
|
total: res.data.total,
|
|
loadingMore: goodsData.list.length === 0 || _this.current_page === res.data.total
|
|
})
|
|
}
|
|
}
|
|
}, false, () => {})
|
|
},
|
|
/**
|
|
* 社群显示
|
|
*/
|
|
communityShow() {
|
|
this.showCommunity = !this.showCommunity;
|
|
},
|
|
getClassid(classItem) {
|
|
let _this = this,
|
|
{
|
|
sort_id
|
|
} = _this;
|
|
_this.setData({
|
|
current_page: 1,
|
|
class_id: classItem.id
|
|
})
|
|
_this.homelist(classItem.id, sort_id, 1)
|
|
},
|
|
getOrders(sortItem) {
|
|
let _this = this,
|
|
{
|
|
class_id
|
|
} = _this;
|
|
_this.setData({
|
|
current_page: 1,
|
|
sort_id: sortItem.val
|
|
})
|
|
_this.homelist(class_id, sortItem.val, 1)
|
|
},
|
|
pageScrollHeight(isshowTabbar) {
|
|
if (isshowTabbar === '1') {
|
|
uni.pageScrollTo({
|
|
scrollTop: 190
|
|
})
|
|
} else {
|
|
uni.pageScrollTo({
|
|
scrollTop: 0
|
|
})
|
|
}
|
|
},
|
|
skipGoods(goods_id, goods_type) {
|
|
let _this = this;
|
|
App.navigationTo({
|
|
url: 'pages/subPages/goods/index?goods_id=' + goods_id + '&goodsType=' + goods_type
|
|
})
|
|
},
|
|
navgateTolink(url) {
|
|
App.navigationTo({
|
|
url
|
|
})
|
|
},
|
|
//加载更多
|
|
ReachBottom(e) {
|
|
let _this = this,
|
|
currentType = _this.currentType;
|
|
if (_this.current_page >= _this.total) {
|
|
_this.loadingMore = true;
|
|
return false;
|
|
}
|
|
_this.homelist(_this.class_id, _this.sort_id, ++_this.current_page, true)
|
|
}
|
|
},
|
|
mounted() {
|
|
this.homeInfo()
|
|
},
|
|
onReachBottom() {
|
|
this.ReachBottom()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import "../../../../pages/subPages/goods/index.css";
|
|
|
|
page {
|
|
background-color: #F8F8F8;
|
|
}
|
|
|
|
.header {
|
|
height: 440upx;
|
|
background-size: 100% 314upx;
|
|
background-repeat: no-repeat;
|
|
padding: 30upx;
|
|
|
|
.header-title {
|
|
padding: 0 6upx;
|
|
}
|
|
|
|
.inte-logo {
|
|
width: 50upx;
|
|
height: 50upx;
|
|
margin: 0 16upx;
|
|
}
|
|
|
|
.inte-bg {
|
|
height: 280upx;
|
|
background-size: 100% 280upx;
|
|
background-repeat: no-repeat;
|
|
border-radius: 10upx;
|
|
}
|
|
}
|
|
|
|
.container {
|
|
.seach{
|
|
padding: 0upx 30upx;
|
|
background-color: #FFFFFF;
|
|
border-radius: 60upx;
|
|
.input{
|
|
height: 70upx;
|
|
line-height: 70upx;
|
|
border-radius: 60upx;
|
|
background-color: #FFFFFF;
|
|
padding: 0 30upx;
|
|
font-size: 28upx;
|
|
}
|
|
}
|
|
.goods-list {
|
|
padding: 24upx 30upx;
|
|
|
|
.goods-item {
|
|
width: 290upx;
|
|
padding: 20upx;
|
|
margin-bottom: 20upx;
|
|
|
|
.goods-image {
|
|
width: 100%;
|
|
height: 290upx;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: 100% 290upx;
|
|
}
|
|
|
|
.goods-exchange {
|
|
.goods-inte {
|
|
.inteStyle {
|
|
color: #FF4444;
|
|
font-size: 32upx;
|
|
}
|
|
|
|
.inte-price-logo {
|
|
display: block;
|
|
width: 30upx;
|
|
height: 30upx;
|
|
margin-right: 10upx;
|
|
flex-shrink: 0;
|
|
}
|
|
}
|
|
|
|
.plus {
|
|
color: #FF4444;
|
|
}
|
|
|
|
.goods-price {
|
|
color: #FF4444;
|
|
font-size: 32upx;
|
|
|
|
&>text {
|
|
font-size: 24upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.oldPirce {
|
|
.goods-oldPrice {
|
|
&>text {
|
|
text-decoration: line-through;
|
|
}
|
|
}
|
|
|
|
.goods-inteBtn {
|
|
width: 87upx;
|
|
height: 40upx;
|
|
line-height: 40upx;
|
|
border: 1px solid rgba(255, 68, 68, 1);
|
|
border-radius: 20upx;
|
|
color: #FF4444;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.page-footer {
|
|
padding: 70upx 0;
|
|
}
|
|
</style>
|
|
|