<template>
|
<view class="main-container home">
|
<!-- 顶部，可能 -->
|
<view class="school" :style="{'background-color': color,'padding-top':(StatusBar)+'px'
|
,height:CustomBar+'rpx','line-height':CustomBar+'rpx' }">
|
<view class="home-logo"></view>
|
|
<picker @change="PickerChangeSchool" :value="schoolIndex" :range="schools" range-key="name">
|
<view class="picker flex">
|
<!-- <text class="cuIcon-locationfill"></text> -->
|
<uni-icons type="location" class="m-l-15 m-r-5" size="18"></uni-icons>
|
<view>
|
{{ schoolIndex>=0&&schools[schoolIndex].name ? schools[schoolIndex].name : '选择校区' }}
|
</view>
|
<!-- <text class="cuIcon-unfold margin-left-xs"></text> -->
|
</view>
|
</picker>
|
</view>
|
<!-- <view :style="{'background-color': color,'padding-top':(StatusBar)+'px',height:CustomBar+'px'}"></view> -->
|
|
|
<!-- banner -->
|
<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="info" :current="currentBanner"
|
:mode="'dot'" :dots-styles="dotsStyles[0]" field="content">
|
<swiper class="swiper-box" @change="changeBanner" :interval="10000" :circular="true" :current="0"
|
v-if="banners&&banners.length>0" :autoplay="true">
|
<swiper-item v-for="(item, index) in banners" :key="index">
|
<view class="swiper-item" :class="'swiper-item' + index">
|
<image @click="previewImg(item.imageSmall||item.image)" class="home-banner-image"
|
mode="aspectFit" :src="item.imageSmall||item.image">
|
</image>
|
</view>
|
</swiper-item>
|
<animation-words :words="words" v-if="words&&words.length>0"></animation-words>
|
|
</swiper>
|
<swiper class="swiper-box" @change="changeBanner" :current="0" v-if="!banners||banners.length==0">
|
<swiper-item v-for="(item, index) in 1" :key="index">
|
<view class="swiper-item" :class="'swiper-item' + index">
|
<image class="home-banner-image" mode="scaleToFill"
|
src="https://xy-go.oss-cn-beijing.aliyuncs.com/51/51abd2f29d104a78a5d6dcc27078716a位图@2x (4).png">
|
</image>
|
</view>
|
</swiper-item>
|
<animation-words :words="words" v-if="words&&words.length>0"></animation-words>
|
|
</swiper>
|
</uni-swiper-dot>
|
<!-- tip -->
|
<view class="p10">
|
<uni-notice-bar @click="getNoticeMore" v-if="currentNotice&¤tNotice.id" class="notice-bar"
|
color="#333" background-color="#fff" show-get-more show-icon :scrollable="scrollable"
|
:text="currentNotice.title" :key="currentNotice.id" />
|
<span v-if="!currentNotice||!currentNotice.id"> </span>
|
</view>
|
|
<!-- 各种按钮 -->
|
<home-buttons></home-buttons>
|
<!-- 推荐的成团的 -->
|
<view class="p15" style="padding-top: 0rpx;" v-if="tuangouList&&tuangouList.length>0">
|
<view class="home-shop-top">
|
<!-- <view>即将成团</view> -->
|
<image src="../../static/imgs/home/home-shop-top-txt.png" mode="aspectFit" class="title"></image>
|
<image src="../../static/imgs/home/home-shop-top-icon.png" mode="aspectFit" class="icon"></image>
|
|
<card-list-item type='shop' :dto="tuangouList[0]" @pop="pop"></card-list-item>
|
</view>
|
</view>
|
<!-- 出去玩的 -->
|
<view class="p15" style="padding-top: 0rpx;padding-bottom: 0rpx;" v-if="tripList&&tripList.length>0">
|
<view class="home-travel-top">
|
<!-- <view>粗去玩</view> -->
|
<image src="../../static/imgs/home/home-travel-top-txt.png" mode="aspectFit" class="title"></image>
|
<image src="../../static/imgs/home/home-travel-top-icon.png" mode="aspectFit" class="icon"></image>
|
<card-list-item type='travel' :dto="tripList[0]"></card-list-item>
|
</view>
|
</view>
|
|
<!-- 3个tab选项 -->
|
|
<view class="p15" style="padding-bottom: 10rpx;">
|
<!-- @change="changeTab" -->
|
<top-tabs :tabs="tabs" :flg.sync="tabIndex"></top-tabs>
|
|
|
|
</view>
|
<!-- 根据不同的 -->
|
<view class="" style="padding-left: 30rpx;padding-right: 30rpx;">
|
<view v-show="tabIndex==0" style="min-height: 400rpx;">
|
<!-- 加载推荐位置的？ -->
|
<no-data v-if="!tuangouList||tuangouList.length==0" style="width: 100%;"></no-data>
|
<view class="m-b-24" v-for="item of tuangouList">
|
<card-list-item type='shop' :dto="item" @pop="pop"></card-list-item>
|
</view>
|
</view>
|
<view v-show="tabIndex==1" style="min-height: 400rpx;">
|
<!-- 加载推荐位置的？ -->
|
<no-data v-if="!tripList||tripList.length==0" style="width: 100%;"></no-data>
|
|
<view class="m-b-24" v-for="item of tripList">
|
<card-list-item type='travel' :dto="item" class="m-b-24"></card-list-item>
|
</view>
|
|
</view>
|
</view>
|
<view v-show="tabIndex==2" style="margin-top: -10rpx;">
|
<home-goods ref="homegoods"></home-goods>
|
|
</view>
|
<view style="padding-bottom:200rpx">
|
</view>
|
<supplier-footer flg="0"></supplier-footer>
|
|
</view>
|
</template>
|
|
<script>
|
import homeButtons from './components/home-buttons.vue'
|
import homeGoods from './components/home-goods.vue'
|
import animationWords from '@/components/animation-words'
|
|
export default {
|
components: {
|
homeButtons,
|
homeGoods,
|
animationWords
|
},
|
|
data() {
|
return {
|
CustomBar: uni.getStorageSync('CustomBar'),
|
StatusBar: uni.getStorageSync('StatusBar'),
|
// StatusBar:0,
|
color: '#fff',
|
schools: [],
|
schoolIndex: -1,
|
scrollable: false,
|
tabs: [{
|
name: '团购',
|
id: 'shop'
|
},
|
{
|
name: '粗去玩',
|
id: 'travel'
|
},
|
{
|
name: '挖宝商品',
|
id: 'good'
|
},
|
],
|
tabIndex: 2,
|
info: [{
|
colorClass: 'uni-bg-red',
|
url: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
content: '内容 A'
|
},
|
{
|
colorClass: 'uni-bg-green',
|
url: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
content: '内容 B'
|
},
|
{
|
colorClass: 'uni-bg-blue',
|
url: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
content: '内容 C'
|
}
|
],
|
dotStyle: [{
|
backgroundColor: 'rgba(0, 0, 0, .3)',
|
border: '1px rgba(0, 0, 0, .3) solid',
|
color: '#fff',
|
selectedBackgroundColor: 'rgba(0, 0, 0, .9)',
|
selectedBorder: '1px rgba(0, 0, 0, .9) solid'
|
},
|
{
|
backgroundColor: 'rgba(255, 90, 95,0.3)',
|
border: '1px rgba(255, 90, 95,0.3) solid',
|
color: '#fff',
|
selectedBackgroundColor: 'rgba(255, 90, 95,0.9)',
|
selectedBorder: '1px rgba(255, 90, 95,0.9) solid'
|
},
|
{
|
backgroundColor: 'rgba(83, 200, 249,0.3)',
|
border: '1px rgba(83, 200, 249,0.3) solid',
|
color: '#fff',
|
selectedBackgroundColor: 'rgba(83, 200, 249,0.9)',
|
selectedBorder: '1px rgba(83, 200, 249,0.9) solid'
|
}
|
],
|
currentBanner: 0,
|
banners: [],
|
tripList: [],
|
tuangouList: [],
|
hide_footer: false,
|
words: [], //弹幕
|
noticeList: [],
|
currentNoticeIndex: 0,
|
currentNotice: {
|
|
}
|
};
|
},
|
onShareAppMessage() {
|
// let that = this;
|
// var url =
|
// `/pages/home/home?shareId=${this.currentInfo&&this.currentInfo.id||''}&shareName=${this.currentInfo&&this.currentInfo.nickName||''}`; //你的转发页面路径拼接参数
|
// return {
|
// title: "校购GO小狗狗",
|
// path: url,
|
// }
|
},
|
onShareTimeline() {
|
// let that = this;
|
// var url = "/pages/home/home" //你的分享页面路径
|
// return {
|
// title: '校购GO小狗狗',
|
// path: url,
|
// query: `shareId=${this.currentInfo&&this.currentInfo.id||''}&shareName=${this.currentInfo&&this.currentInfo.nickName||''}`, //你的参数拼接，注意：不需要加?
|
// // imageUrl: 'https://cdn.uviewui.com/uview/swiper/1.jpg' //你分享的封面
|
// };
|
// },
|
|
onLoad() {
|
// console.log('home created')
|
//这里进行一次初始化即可
|
this.$http.request('get', '/api/school/area/list', {
|
|
}).then(res => {
|
if (res.code == 0) {
|
this.schools = res.data || []
|
}
|
})
|
//获取banner图
|
this.$http.request('get', '/api/ua/banner/list', {
|
|
}).then(res => {
|
if (res.code == 0) {
|
this.banners = res.data.records || []
|
}
|
})
|
// uni.setStorageSync('schoolId', this.school[parseInt(e.detail.value)].id);
|
// uni.setStorageSync('schoolIndex', parseInt(e.detail.value));
|
var schoolIndex = uni.getStorageSync('schoolIndex')
|
if (!schoolIndex && schoolIndex !== 0) {
|
|
} else {
|
this.schoolIndex = schoolIndex
|
}
|
this.changeTab(this.tabIndex)
|
this.changeTab(0)
|
this.changeTab(1)
|
|
this.$http.request('get', '/api/brand/wish/list', {
|
params: {
|
size: 10,
|
show: true,
|
status: 'A'
|
}
|
}).then(res => {
|
if (res.code == 0) {
|
this.words = (res.data && res.data.records || []).map(item => {
|
return {
|
...item,
|
randomnum: Math.floor(Math.random() * 10) + Math.floor(Math.random() * 30)
|
}
|
})
|
}
|
})
|
//公告
|
this.$http.request('get', '/api/ua/announcement/list', {
|
params: {
|
size: 5,
|
status: 'A'
|
}
|
}).then(res => {
|
if (res.code == 0) {
|
this.noticeList = (res.data && res.data.records || [])
|
console.log('this.noticeList', this.noticeList)
|
if (this.noticeList.length > 0) {
|
this.currentNotice = this.noticeList[0]
|
if (this.currentNotice.title && this.currentNotice.title.length >= 30) {
|
this.scrollable = true
|
} else {
|
this.scrollable = false
|
}
|
let that = this
|
if (this.noticeList.length >= 1) {
|
setInterval(() => {
|
console.log('interval,1')
|
that.currentNoticeIndex += 1
|
that.currentNoticeIndex %= that.noticeList.length
|
that.currentNotice = that.noticeList[that.currentNoticeIndex]
|
that.scrollable = false
|
that.$nextTick(() => {
|
if (that.currentNotice.title && that.currentNotice.title
|
.length >= 30) {
|
that.scrollable = true
|
} else {
|
that.scrollable = false
|
}
|
})
|
|
}, 8000)
|
}
|
|
}
|
}
|
})
|
|
|
},
|
methods: {
|
|
pop(status) {
|
this.hide_footer = !!status
|
},
|
changeBanner(e) {
|
this.currentBanner = e.detail.current
|
},
|
changeTab(e) {
|
// this.tabIndex
|
if (e == 2) {
|
this.$nextTick(() => {
|
this.$refs.homegoods.updateGoods()
|
})
|
}
|
if (e == 0) {
|
//团购
|
// tripList:[],
|
// :[],
|
//可能没必要重复了先，todo
|
this.$http.request('get', '/api/buy/customer/group/list', {
|
params: {
|
size: 4,
|
status: 'A'
|
}
|
}).then(res => {
|
if (res.code == 0) {
|
this.tuangouList = res.data.records || []
|
}
|
})
|
}
|
if (e == 1) {
|
this.$http.request('get', '/api/trip/customer/list', {
|
params: {
|
size: 3,
|
status: 'J'
|
}
|
}).then(res => {
|
if (res.code == 0) {
|
this.tripList = res.data.records || []
|
}
|
})
|
}
|
// console.log('changeTab',e)
|
// updateGoods
|
//
|
},
|
getNoticeMore() {
|
if (this.currentNotice.id) {
|
// uni.navigateTo({
|
// url: '/pages/notice/notice?id=' + this.currentNotice.id
|
// })
|
}
|
uni.navigateTo({
|
url: '/pages/notice/list?id=' + this.currentNotice.id
|
})
|
},
|
PickerChangeSchool(e) {
|
if (e.detail.value == '-1') {
|
this.$message.showToast('未选择校区')
|
return
|
}
|
console.log(' this.schools', this.schools, parseInt(e.detail.value), e);
|
// this.setData({
|
// index: e.detail.value,
|
// schoolInfo: this.school[parseInt(e.detail.value)],
|
// s_id: this.school[parseInt(e.detail.value)].s_id,
|
// current: 0
|
// });
|
|
this.schoolIndex = parseInt(e.detail.value)
|
uni.setStorageSync('schoolId', this.schools[parseInt(e.detail.value)].id);
|
uni.setStorageSync('schoolIndex', parseInt(e.detail.value));
|
// if (uni.getStorageSync('token')) {
|
// this.userChangeSchool(this.school[parseInt(e.detail.value)].s_id)
|
// }
|
// this.getSchoolInfo(this.school[parseInt(e.detail.value)].s_id);
|
// this.getSysparment(); //全局加载变量设置为真，信息圈的列表需要重新加载
|
// // this.getOrderData();
|
// // this.getHistoryList();
|
// this.getRank();
|
// this.setData({
|
// dataList: []
|
// });
|
},
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import "./home.scss";
|
</style>
|
