From 8c9fe474d3d43265c33653f17bb411336269dfab Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期五, 26 七月 2024 15:34:22 +0800 Subject: [PATCH] fix bug 接口对接和样式调整 --- pages/home/home.vue | 498 +++++++++++++++++++++++++++--------------------------- 1 files changed, 248 insertions(+), 250 deletions(-) diff --git a/pages/home/home.vue b/pages/home/home.vue index 7d94fbe..9fc91ee 100644 --- a/pages/home/home.vue +++ b/pages/home/home.vue @@ -1,282 +1,280 @@ <template> - <view class="main-container user-home"> - <view class="bg-top-green"></view> - <!-- 顶部,可能 --> - <view class="school" :style="{'padding-top':(StatusBar)+'px' + <view class="main-container user-home"> + <view class="bg-top-green"></view> + <!-- 顶部,可能 --> + <view class="school" :style="{'padding-top':(StatusBar)+'px' ,height:CustomBar+'rpx','line-height':CustomBar+'rpx' }"> - <picker @change="PickerChangeSchool" :value="areaIndex" :range="schools" range-key="name"> - <view class="picker flex"> - <uni-icons type="location" class="m-r-5" size="18"></uni-icons> - <view> - {{ areaIndex>=0&&schools[areaIndex].name ? schools[areaIndex].name : '选择位置' }} - </view> - </view> - </picker> - </view> - <view class="search-container m-t-12 flex"> - <view class="flex1 input"> - <u-input placeholder="请输入花名" v-model="search_flow"> - <template slot="suffix"> - <uni-icons color="#20613D" type="search" size="24" @tap="buttonSearchFlow"></uni-icons> - </template> - </u-input> - </view> - </view> + <picker @change="PickerChangeSchool" :value="areaIndex" :range="schools" range-key="name"> + <view class="picker flex"> + <uni-icons type="location" class="m-r-5" size="18"></uni-icons> + <view> + {{ areaIndex >= 0 && schools[areaIndex].name ? schools[areaIndex].name : '选择位置' }} + </view> + </view> + </picker> + </view> + <view class="search-container m-t-12 flex"> + <view class="flex1 input"> + <u-input placeholder="请输入花名" v-model="search_flow"> + <template slot="suffix"> + <uni-icons color="#20613D" type="search" size="24" @tap="buttonSearchFlow"></uni-icons> + </template> + </u-input> + </view> + </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> - </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://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png"> - </image> - </view> - </swiper-item> - </swiper> - </uni-swiper-dot> - <!-- tip --> - <view class="m-t-12" @click="getNoticeMore"> - <uni-notice-bar 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-category></home-category> - <!-- 特别的几个公告图片 --> - <home-banner-imgs></home-banner-imgs> - <!-- 均价情况 --> - <home-price></home-price> - <!-- 几个专区 --> - <home-zones></home-zones> - <!-- 置顶的花列表 --> - <home-top-flow></home-top-flow> + <!-- 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> + </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://hmy-flower.oss-cn-shanghai.aliyuncs.com/62/62ddac6297104e369aba646be704064dbanner@2x.png"> + </image> + </view> + </swiper-item> + </swiper> + </uni-swiper-dot> + <!-- tip --> + <view class="m-t-12" @click="getNoticeMore"> + <uni-notice-bar 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-category></home-category> + <!-- 特别的几个公告图片 --> + <home-banner-imgs></home-banner-imgs> + <!-- 均价情况 --> + <home-price></home-price> + <!-- 几个专区 --> + <home-zones></home-zones> + <!-- 置顶的花列表 --> + <home-top-flow></home-top-flow> - <view style="min-height:200rpx"> - </view> - <common-footer flg="0"></common-footer> + <view style="min-height:200rpx"> + </view> + <common-footer flg="0"></common-footer> - </view> + </view> </template> <script> - import homePrice from './components/home-price.vue' - import homeBannerImgs from './components/home-banner-imgs.vue' - import homeZones from './components/home-zones.vue' - import homeTopFlow from './components/home-top-flow.vue' - import homeCategory from './components/home-category.vue' +import homePrice from './components/home-price.vue' +import homeBannerImgs from './components/home-banner-imgs.vue' +import homeZones from './components/home-zones.vue' +import homeTopFlow from './components/home-top-flow.vue' +import homeCategory from './components/home-category.vue' - export default { - components: { - homeCategory, - homePrice, - homeBannerImgs, - homeZones, - homeTopFlow - }, +export default { + components: { + homeCategory, + homePrice, + homeBannerImgs, + homeZones, + homeTopFlow + }, - data() { - return { - search_flow: '', - CustomBar: uni.getStorageSync('CustomBar'), - StatusBar: uni.getStorageSync('StatusBar'), - // StatusBar:0, - color: '#fff', - schools: [], - areaIndex: -1, - scrollable: false, + data() { + return { + search_flow: '', + CustomBar: uni.getStorageSync('CustomBar'), + StatusBar: uni.getStorageSync('StatusBar'), + // StatusBar:0, + color: '#fff', + schools: [], + areaIndex: -1, + scrollable: false, - 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, - noticeList: [], - currentNoticeIndex: 0, - currentNotice: { + 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, + 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' //你分享的封面 + // }; + // }, - } - }; - }, - // 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', { - onLoad() { - // console.log('home created') - //这里进行一次初始化即可 - // this.$http.request('get', '/api/school/area/list', { + // }).then(res => { + // if (res.code == 0) { + // this.schools = res.data || [] + // } + // }) - // }).then(res => { - // if (res.code == 0) { - // this.schools = res.data || [] - // } - // }) - - // uni.navigateTo({ - // url: '/sub_pages/customer/trade/detail' - // }) + // uni.navigateTo({ + // url: '/sub_pages/customer/trade/detail' + // }) - //获取banner图 - this.$http.request('get', '/api/pub/banner/list', { + //获取banner图 + this.$http.request('get', '/api/pub/banner/list', {}).then(res => { + if (res.code == 0) { + this.banners = res.data.records || [] + } + }) - }).then(res => { - if (res.code == 0) { - this.banners = res.data.records || [] - } - }) + var areaIndex = uni.getStorageSync('areaIndex') + if (!areaIndex && areaIndex !== 0) { - var areaIndex = uni.getStorageSync('areaIndex') - if (!areaIndex && areaIndex !== 0) { - - } else { - this.areaIndex = areaIndex - } + } else { + this.areaIndex = areaIndex + } + //公告 + this.$http.request('get', '/api/announcement/page', { + 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 + } + }) - //公告 - this.$http.request('get', '/api/announcement/page', { - 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) + } - }, 8000) - } - - } - } - }) + } + } + }) - }, - methods: { - buttonSearchFlow() { - console.log('buttonSearchFlow') - }, - pop(status) { - this.hide_footer = !!status - }, - changeBanner(e) { - this.currentBanner = e.detail.current - }, + }, + methods: { + buttonSearchFlow() { + console.log('buttonSearchFlow') + uni.navigateTo({ + url: '/sub_pages/trade/list?name=' + this.search_flow + }) + }, + pop(status) { + this.hide_footer = !!status + }, + changeBanner(e) { + this.currentBanner = e.detail.current + }, - getNoticeMore() { - 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); + getNoticeMore() { + 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.areaIndex = parseInt(e.detail.value) - uni.setStorageSync('areaId', this.schools[parseInt(e.detail.value)].id); - uni.setStorageSync('areaIndex', parseInt(e.detail.value)); + this.areaIndex = parseInt(e.detail.value) + uni.setStorageSync('areaId', this.schools[parseInt(e.detail.value)].id); + uni.setStorageSync('areaIndex', parseInt(e.detail.value)); - }, + }, - } - } + } +} </script> <style lang="scss" scoped> - @import "./home.scss"; +@import "./home.scss"; </style> \ No newline at end of file -- Gitblit v1.9.3