版权声明:111 https://blog.csdn.net/qq_42897782/article/details/87795837
(jiajiaode)
小程序前端
<!--index.wxml-->
<!-- <view class="container">
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</view> -->
<view>
<!-- 搜索 -->
<navigator url='/pages/search/search?type=goods' hover-class='none'>
<view class='bg_white p_tb10 p_lr10 pf search flex'>
<view class='searchView'>
<input type='search' disabled='disabled' class='font14' placeholder='输入商品名称'></input>
</view>
<view style='padding: 10rpx 0rpx 10rpx 20rpx' class='tr'><icon type="search" size="18" color="rgba(0,0,0,.2)" confirm-type='search' style='margin:6rpx 0 0'/></view>
</view>
</navigator>
<!-- <view style='height:102rpx;'></view> -->
<!-- 轮播图 -->
<swiper class='swiperimage bg_white' style='padding-top:10rpx;margin-top:102rpx;' indicator-dots="true" autoplay="true" interval="3000" duration="1000" circular="true">
<block wx:for="{{imgUrls}}">
<swiper-item class='p_lr10'>
<image src="{{urlhttp + item.picture}}" class="slide-image" />
</swiper-item>
</block>
</swiper>
<!-- 分类 -->
<view class='bg_white' style='padding-top:20rpx;'>
<view class='fl homeMenus tc m_t10' wx:for="{{navList}}">
<navigator url='/pages/goodsList/goodsList?sortid={{item.cateid}}&title={{item.name}}' hover-class='none'>
<image src='{{urlhttp + item.picture}}'></image>
<text class='block tc gray3 font14'>{{item.name}}</text>
</navigator>
</view>
<view class='fl homeMenus tc m_t10'>
<navigator url='/pages/sort/sort?from=index' hover-class='none'>
<image src='/images/icon/nav10.png'></image>
<text class='block tc gray3 font14'>其它</text>
</navigator>
</view>
<view class='cl m_b10'></view>
<view class='m_t15 p_lr15'>
<view class='fl tr font16 gray3' style='border-radius:40rpx;width:48%'>
<navigator class='' url='/pages/designerList/designerList' hover-class='none'>
<!-- <image src='/images/icon/new-icon_29.png' style='width:120rpx;height:120rpx;'></image>
<text class='inline_block tr' style='margin:auto 0 auto;width:50%'>设计师</text> -->
<image src='/images/icon/sjs.jpg' mode='widthFix' style='width:100%;border-radius:40rpx;'></image>
</navigator>
</view>
<view class='fr tr font16 gray3' style='border-radius:40rpx;width:48%'>
<navigator class='' url='' hover-class='none'>
<!-- <image src='/images/icon/new-icon_32.png' style='width:120rpx;height:120rpx;'></image>
<text class='inline_block tr' style='margin:auto 0 auto;width:50%'>使用简介</text> -->
<image src='/images/icon/syjj.jpg' mode='widthFix' style='width:100%;border-radius:40rpx;'></image>
</navigator>
</view>
</view>
<view class='cl m_b10'></view>
</view><!--更多分类跳转/pages/sort/sort?from=index-->
<!-- 完工案例 -->
<!-- <view class='p_b10 m_t5 bg_white'>
<view class='title font16 gray2 p_all10 p_tb15'>
<image class='fl' style='margin-top:6rpx;' src='/images/icon/wangong-icon.png'></image>
<text class='fl'>完工案例</text>
<text class='fr gray6 font14'>more ></text>
<view class='cl'></view>
</view>
<swiper class='swipercase' duration="1000" circular="true" previous-margin="80rpx" bindchange='current' next-margin="80rpx">
<block wx:for="{{caseList}}">
<swiper-item class='p_all10 caseitem {{currentswiper == index ? "active" : ""}}' index="{{index}}">
<view class='innerbox'>
<image src="{{item.thumb}}" class="case-image" />
<view class='caseyuan bg_white font13'><text class='block tc bg_theme white'>{{item.title}}</text></view>
<view class='tc font16 gray2 fontw'><text class='ellipsis' style='width:80%;'>{{item.describe}}</text></view>
<view class='tc tags m_t5'>
<text class='c_theme font12' wx:for="{{item.tag}}">{{item}}</text>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view> -->
<!-- 家装预算 -->
<!-- <view class='pr ggimg bg_white'>
<navigator url='/pages/index/forecast' hover-class='none'>
<image src='/images/banner-gg.jpg' mode='widthFix'></image>
<view class='ggmaskbox pa'>
<view class='ggmask tc gray3 font14'>
<text class='block'>您对家装的预算有多少呢?</text>
<view class='ggbtn white m_t10'>快来测测吧</view>
</view>
</view>
</navigator>
</view> -->
<!-- 活动入口图 -->
<form bindsubmit="formid" report-submit='true' bindreset="formReset">
<view class='bg_white' style='width:100%;height:300rpx;padding-top:10rpx;'>
<button class='form_button' bindtap='activityDay' name="formid" formType="submit">
<image src='/images/sctentry.jpg'style='width:100%;height:300rpx;'></image>
</button>
</view>
</form>
<!-- 列表菜单 -->
<view class='bg_white p_tb15'>
<!-- 分类 -->
<view class='bg_white flex {{menusfloat == false ? "" : "floatpf"}}'>
<view class='listmenus tc font16 gray2 fontw {{listmenusCurrent == 0 ? "fontw7 font18" : ""}}' id='0' bindtap='whichmenusTap'>
<text class='block tc {{listmenusCurrent == 0 ? "m_t5" : "m_t10"}}' style='margin-bottom:-10rpx;'>业主说</text>
<text class='line bg_theme' wx:if='{{listmenusCurrent == 0}}'></text>
</view>
<view class='listmenus tc font16 gray2 fontw {{listmenusCurrent == 3 ? "fontw7 font18" : ""}}' id='3' bindtap='whichmenusTap'>
<text class='block tc {{listmenusCurrent == 3 ? "m_t5" : "m_t10"}}' style='margin-bottom:-10rpx;'>设计圈</text>
<text class='line bg_theme' wx:if='{{listmenusCurrent == 3}}'></text>
</view>
<view class='listmenus tc font16 gray2 fontw {{listmenusCurrent == 1 ? "fontw7 font18" : ""}}' id='1' bindtap='whichmenusTap'>
<text class='block tc {{listmenusCurrent == 1 ? "m_t5" : "m_t10"}}' style='margin-bottom:-10rpx;'>特惠品</text>
<text class='line bg_theme' wx:if='{{listmenusCurrent == 1}}'></text>
</view>
<view class='listmenus tc font16 gray2 fontw {{listmenusCurrent == 2 ? "fontw7 font18" : ""}}' id='2' bindtap='whichmenusTap'>
<text class='block tc {{listmenusCurrent == 2 ? "m_t5" : "m_t10"}}' style='margin-bottom:-10rpx;'>活动商户</text>
<text class='line bg_theme' wx:if='{{listmenusCurrent == 2}}'></text>
</view>
</view>
<!-- 列表 -->
<view>
<!-- 业主说 -->
<view class='p_tb10' hidden='{{listmenusCurrent == 0 ? "" : "true"}}'>
<view class='p_all10 p_lr15 m_b10 bd_b' wx:for="{{articlelist}}" id='{{item.id}}' wx:if="{{item.isrecommend == 1}}">
<navigator url='/pages/forum/articleDetail/articleDetail?articleid={{item.id}}' hover-class="none">
<view class='listhead'>
<image class='fl m_r5' src='{{item.avatar}}'></image>
<text class='font16 gray2 fl m_lr10' style='margin-top:18rpx;'>{{item.nickname}}</text>
<text class='v_icon white font10' wx:if="{{item.isvip == 1}}">VIP</text>
<text class='v_icon white font10' wx:if="{{item.isdesigner == 1}}">资深设计师</text>
<text class='font12 gray9 fr' style='margin-top:22rpx;'>{{item.create_time}}</text>
<view class='cl'></view>
</view>
<view class='m_t10'>
<text class='font18 gray2 fontw7 block ellipsis'>{{item.title}}</text>
<text class='goodname gray6 font15 m_t5' wx:for="{{item.content.content}}" wx:if="{{item.name == 'text' && index == 0}}">{{item.contents}}</text>
<view class='imgs'>
<view class='images tc' wx:for="{{item.thumb}}">
<image src='{{item}}' mode='widthFix' style='width:100%;min-height:212rpx;'></image>
</view>
</view>
<view class='listfoot m_tb5'>
<image src='/images/icon/comment.png' class='fl'></image>
<text class='font13 gary9 fl'>{{item.c_num}}</text>
<text class='listtag font12 c_theme fr'>{{item.type}}</text>
<view class='cl'></view>
</view>
</view>
</navigator>
</view>
</view>
<!-- 设计圈 -->
<!-- <view class='p_all10' hidden='{{listmenusCurrent == 3 ? "" : "true"}}'>
<view class='p_tb10' wx:for="{{designerlist}}" id='{{item.id}}'>
<navigator url='' hover-class='none'>
<view class='designerinfo flex'>
<image src='{{urlhttp + item.thumb}}' class='touxiang'></image>
<view style='width:83%;'>
<view class='m_b10'>
<text class='gray2 font16 fontw7 m_r10'>{{item.name}}</text>
<text class='tag font10 c_theme m_l10'>{{item.honour}}</text>
<text class='font16 c_theme fontw fr inline_block m_t5'>¥{{item.attr_3}}</text>
<view class='cl'></view>
</view>
<view class='font12 gray6 m_t10'>
<text class='m_r10'>作品:{{item.attr_2}}</text>
<text class='m_l10'>擅长:{{item.attr_1}}</text>
</view>
</view>
</view>
<view class='imgs tc'>
<view class='images' wx:for="{{item.pics}}" wx:if="{{index <= 2}}">
<image src='{{urlhttp + item}}' mode='widthFix' style='width:100%;min-height:212rpx;'></image>
</view>
</view>
</navigator>
</view>
</view> -->
<view class='p_tb10' hidden='{{listmenusCurrent == 3 ? "" : "true"}}'>
<view class='p_all10 p_lr15 m_b10 bd_b' wx:for="{{designerList}}" id='{{item.id}}'>
<navigator url='/pages/forum/articleDetail/articleDetail?articleid={{item.id}}' hover-class="none">
<view class='listhead'>
<image class='fl m_r5' src='{{item.avatar}}'></image>
<text class='font16 gray2 fl m_lr10' style='margin-top:18rpx;'>{{item.nickname}}</text>
<text class='v_icon white font10'>资深设计师</text>
<text class='font12 gray9 fr' style='margin-top:22rpx;'>{{item.create_time}}</text>
<view class='cl'></view>
</view>
<view class='m_t10'>
<text class='font18 gray2 fontw7 block ellipsis'>{{item.title}}</text>
<text class='goodname gray6 font15 m_t5' wx:for="{{item.content.content}}" wx:if="{{item.name == 'text' && index == 0}}">{{item.contents}}</text>
<view class='imgs'>
<view class='images' wx:for="{{item.thumb}}">
<image src='{{item}}' mode='widthFix' style='width:100%;min-height:212rpx;'></image>
</view>
</view>
<view class='listfoot m_tb5'>
<image src='/images/icon/comment.png' class='fl'></image>
<text class='font13 gary9 fl'>{{item.c_num}}</text>
<text class='listtag font12 c_theme fr'>{{item.type}}</text>
<view class='cl'></view>
</view>
</view>
</navigator>
</view>
</view>
<!-- 特惠品 -->
<view class='p_all10 p_lr15 menusOne' hidden='{{listmenusCurrent == 1 ? "" : "true"}}'>
<view class='listtehui p_tb10 m_b10' wx:for="{{tehuiList}}" id='{{item.goodsid}}'>
<navigator url='/pages/shop/goodsDetail/goodsDetail?goodsid={{item.goodsid}}' hover-class="none">
<view class='image' style='height:350rpx;overflow:hidden;'>
<image src='{{urlhttp + item.picture}}' mode='widthFix'></image>
</view>
<text class='block fontw7 font16 ellipsis m_t10'>{{item.name}}</text>
<view class='m_t5'>
<text class='fl gray9 font13 m_t5'>{{item.desc}}</text>
<text class='fr font18 c_theme'>¥ {{item.price}}</text>
<view class='cl'></view>
</view>
</navigator>
</view>
</view>
<!-- 活动商户 -->
<view class='p_all10 p_lr15' hidden='{{listmenusCurrent == 2 ? "" : "true"}}'>
<view class='p_tb10 m_t5' wx:for="{{storelist}}" id='{{item.id}}'>
<navigator url='/pages/shop/storeHome/storeHome?shopid={{item.id}}' hover-class="none">
<view class='imageView flex'>
<image class='imageleft' src='{{urlhttp + item.pics[0]}}'></image>
<view class='imageright'>
<image src='{{urlhttp + item.pics[1]}}'></image>
<view class='pr'>
<image src='{{urlhttp + item.pics[2]}}'></image>
<view class='pa moreimg white fontw7 font24'>
<text class='font24'>{{item.pics.length > 3 ? "+"+(item.pics.length - 3) : ""}}</text>
</view>
</view>
</view>
</view>
<text class='block fontw7 font16 ellipsis m_t10'>{{item.desc}}</text>
<view class='m_t5'>
<text class='fl bg_theme font10 white m_r10 m_t5' style='padding:6rpx 18rpx;' wx:if="{{item.tag != ''}}">{{item.tag}}</text>
<text class='fl gray9 font13 m_t5'>{{item.name}}</text>
<!-- <text class='fr font18 c_theme'>¥ {{item.price}}</text> -->
<view class='cl'></view>
</view>
</navigator>
</view>
</view>
</view>
<view class='font12 gray9 tc p_tb15'>{{loadtxt}}</view>
</view>
<view><!-- wx:if="{{kongHidden}}"-->
<!--kong -->
<import src="/pages/public/copy/copy.wxml"/>
<template is="copy"/>
</view>
</view>
<!-- 授权窗口 -->
<view hidden="{{modalHidden}}">
<view class="isMask"></view>
<view class="isLogin">
<view class="loginTitle">微信授权</view>
<view class="loginshopImg">
<view>小程序将获取以下权限:</view>
<view>(如未授权,可能无法正常使用该小程序)</view>
</view>
<view class="isAgary">
<text>•</text>
<view wx:if="{{userInfo == ''}}">获取你的公开信息(昵称、头像等)</view>
<view wx:elif="{{PhoneNumber ==''}}">请允许微信授权登录</view>
</view>
<view class="isLoginBtn">
<button wx:if="{{userInfo == ''}}" bindgetuserinfo="getUserInfo" openType="getUserInfo">授权</button>
<button wx:elif="{{PhoneNumber ==''}}" open-type="getPhoneNumber" bindgetphonenumber='getPhoneNumber'>允许</button>
</view>
</view>
</view>
<!-- 图片广告弹窗 -->
<form bindsubmit="formid" report-submit='true'><!---收集formid--->
<view class='pr' style='z-index:999;' hidden="{{item.opentype == 1 ? true : false}}" wx:for="{{advertsList}}" id="{{item.id}}">
<view class="tip-content-dialog" style='z-index:999;'>
<view class="tip-dialog-view">
<button class='form_button' name="formid" formType="submit" >
<view bindtap='bindAdvertsTap' data-type='{{item.datatype}}' id="{{item.id}}"><!--{{item.page_path}}-->
<image class='pr' src='{{urlhttp + item.picture}}' mode='widthFix' style='width:100%;'></image>
</view>
<view class='dialogClose font28 gray6 bg_graye' style='border-radius:50%;' id="{{item.id}}" bindtap='dialogClose'>×</view>
</button>
</view>
</view>
</view>
</form>
js
//index.js
//获取应用实例
const app = getApp()
Page({
data: {
// userInfo: '',
// PhoneNumber:'',
// hasUserInfo: false,
canIUse1: wx.canIUse('button.open-type.getUserInfo'),
canIUse2: wx.canIUse('button.open-type.getPhoneNumber'),
modalHidden:true,//授权窗口
modalMsg: "获取你的公开信息(昵称、头像等)",//请允许微信授权登录
imgUrls:[],//轮播图
navList:[],//分类菜单
caseList:[],//完工案例
currentswiper:0,//当前案例的下标
listmenusCurrent: 0,
menusfloat: false,//菜单浮动顶部
tehuiList:[],//特惠品列表
storelist:[],//活動商戶列表
designerList: [],//设计师列表
articlelist: [],//文章列表
advertsList:[],//弹窗广告
urlhttp: app.d.hostImg,//图片路径参数
isVip:0,//是否是会员,1是会员,0不是会员
page0: 0,//特惠品页码
page1: 0,//业主说页码
page2: 0,//活动商户页码
load: true,
loading: false,//加载动画的显示
loadtxt:"上拉加载更多↑",
shareid:'',
ggHidden: '',
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function (options) {
var that = this;
// 分享者的openid
if (options.shareid) {
that.setData({
shareid: options.shareid,
})
console.log("分享者id" + that.data.shareid)
}
var userInfo = wx.getStorageSync('userInfo');
var PhoneNumber = wx.getStorageSync('PhoneNumber');
that.setData({
userInfo: wx.getStorageSync('userInfo'),
PhoneNumber: wx.getStorageSync('PhoneNumber'),
})
if (this.data.canIUse1){
console.log(PhoneNumber)
//是否已获取用户信息
if (that.data.userInfo == "" || that.data.PhoneNumber == "") {
if (that.data.userInfo == "") {
that.setData({
modalHidden: false,
// modalMsg: '获取你的公开信息(昵称、头像等)',
})
console.log("用户" + that.data.modalHidden)
console.log("用户" + that.data.userInfo)
}
else if (that.data.PhoneNumber == "") {
console.log("授权电话")
that.setData({
modalHidden: false,
// modalMsg: '请允许微信授权登录',
})
console.log("电话" + that.data.modalHidden)
}
}
else {
that.setData({
modalHidden: true,
})
console.log(that.data.modalHidden)
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
//幻灯片、分类、特惠商品数据
wx.request({
url: app.d.hostUrl + 'home.index',
data: {
"openid": wx.getStorageSync('openid')
},
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res)
var data = res.data;
var adv = [];
console.log(wx.getStorageSync("advlist"));
if (wx.getStorageSync("advlist") && data.hour <= 30) {
console.log("距上次访问时间未超过30分钟")
var advlist = wx.getStorageSync("advlist");
for (var i in data.items[3].children) {
if (data.items[3].children[i].opentype !== advlist[i].opentype) {
adv = advlist;
console.log(adv)
break;
}
}
}
else {
console.log("超过30分钟")
adv = data.items[3].children;
console.log(adv)
}
that.setData({
imgUrls: data.items[0].children,//轮播图数据
navList: data.items[1].children,//分类列表数据
// caseList: caseList,
tehuiList: data.items[2].children,//特惠品商品数据
storelist: data.shop,//活动商户
advertsList: adv,//弹窗广告
// designerlist: data.designer,//设计师
})
}
})
//业主说数据
wx.request({
url: app.d.hostUrl + 'home.getArticle',
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res)
var data = res.data;
var designerList = [];
for (var i in data.dataset) {
if (data.dataset[i].isdesigner == 1){
designerList.push(data.dataset[i]);
}
}
that.setData({
articlelist: data.dataset,
designerList: designerList,
})
}
})
},
getUserInfo: function(e) {
var that = this;
console.log(e)
app.globalData.userInfo = e.detail.userInfo
wx.setStorageSync("userInfo", e.detail.userInfo);//用户信息
that.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true,
// modalMsg:'请允许微信授权登录',
})
wx.request({
url: app.d.ceshiUrl + 'member.AutoLogin',
data: {
"openid": wx.getStorageSync('openid'),
"avatarUrl": e.detail.userInfo.avatarUrl,
"nickName": e.detail.userInfo.nickName,
"city": e.detail.userInfo.city,
"province": e.detail.userInfo.province,
"gender": e.detail.userInfo.gender,
"agentcode": that.data.shareid,//分享者id
},
success: function (res) {
console.log(res)
wx.setStorageSync("userInfo", e.detail.userInfo);//用户信息
wx.setStorageSync("is_designer", res.data.is_designer);//是否是设计师
wx.setStorageSync("is_vip", res.data.is_vip);//是否是会员
wx.setStorageSync("card_num", res.data.card_num);//会员卡号
that.setData({
isVip: res.data.is_vip,
})
}
})
if (wx.getStorageSync("PhoneNumber") != "") {
that.setData({
modalHidden: true,
})
}
},
getPhoneNumber: function (e) {
var that = this;
console.log(e)
var detail = e.detail;
wx.request({
url: app.d.ceshiUrl + 'member.getPhone', //解密手机号码接口
data: {
"encryptedData": detail.encryptedData,
"iv": detail.iv,
"appid": app.d.appId,
"sessionKey":wx.getStorageSync('sessionKey')
},
success: function (res) {
console.log(res)//返回手机号码
if (res.data.phoneNumber) {
wx.setStorageSync("PhoneNumber", res.data.phoneNumber);//用户电话
that.setData({
modalHidden: true,
})
}
else {
that.setData({
modalHidden: false,
})
}
}
})
that.setData({
modalHidden: true,
})
},
formid: function (e) {//获取formid传给服务器,用于发送服务通知
console.log(e)
console.log(wx.getStorageSync("openid"))
var that = this;
var formid = e.detail.formId;
wx.request({
url: app.d.hostUrl + "home.collectFormID",
data: {
"formid": formid,
"openid": wx.getStorageSync("openid")
},
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res.data)
wx.setStorageSync("formid", formid);//formid存入缓存
}
})
},
//弹窗广告点击领取处理
bindAdvertsTap: function (e) {
var that = this;
console.log(e.currentTarget.id)
var id = e.currentTarget.id;
var datatype = e.currentTarget.dataset.type;
var advertsList = that.data.advertsList;
for (var i in advertsList) {
if (advertsList[i].id == id) {
if (datatype == 'coupon') {//优惠券广告
//向服务器发送领取状态
wx.request({//领取券,改变广告显示状态
url: app.d.ceshiUrl + 'home.clickLog',
data: {
"openid": wx.getStorageSync('openid')
},
success: function (res) {
console.log(res)
advertsList[i].opentype = 1;//本地更改弹窗状态,下次进入不在打开广告
}
})
}
else if (datatype == 'adv') {
if (advertsList[i].weburl != "") {
advertsList[i].opentype = 1;//本地更改弹窗状态,下次进入不在打开广告
wx.navigateTo({
url: advertsList[i].weburl,
})
}
else {
return false;
// advertsList[i].opentype = 1; //本地更改弹窗状态,下次进入不在打开广告
}
}
}
}
wx.setStorageSync("advlist", advertsList);//本地更改过状态的广告存入缓存,便于短时间内不再弹出
that.setData({
advertsList: advertsList,
})
},
dialogClose: function (e) {//关闭广告弹窗
var that = this;
console.log(e);
var id = e.currentTarget.id;
var advertsList = that.data.advertsList;
for (var j in advertsList) {
if (advertsList[j].id == id) {
advertsList[j].opentype = 1;
that.setData({
advertsList: advertsList,
})
}
}
wx.setStorageSync("advlist", advertsList);//本地更改过状态的广告存入缓存,便于短时间内不再弹出
},
//完工案例的当前选中的下标
current: function (e) {
var that = this;
console.log(e)
that.setData({
currentswiper: e.detail.current,
})
},
//列表分类菜单切换
whichmenusTap: function (e) {
var that = this;
console.log(e)
that.setData({
listmenusCurrent: e.currentTarget.id,
loadtxt:"上拉加载更多↑"
})
},
//上滑时固定菜单到顶部
onPageScroll: function (e) {
var that = this;
console.log(e)
if (e.scrollTop >= 275) {
that.setData({
menusfloat: true,
})
}
if (e.scrollTop < 275) {
that.setData({
menusfloat: false,
})
}
},
onPullDownRefresh() {
// 下拉刷新
console.log(this)
var that = this;
if (!this.loading) {
this.fetchArticleList();
wx.stopPullDownRefresh()
}
},
fetchArticleList: function () {
var that = this;
console.log("下拉刷新")
that.loading = true;
//幻灯片、分类、特惠商品数据
wx.request({
url: app.d.hostUrl + 'goods.hotGoods',
data:{
"page": that.data.page0 == 0 ? 1 : that.data.page0,
"refresh": 1,//1刷新,0加载更多
},
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res)
var data = res.data;
that.setData({
tehuiList: data,//特惠品商品数据
})
}
})
//活动商户数据
wx.request({
url: app.d.hostUrl + 'shops.shoplist',
data: {
"page": that.data.page2 == 0 ? 1 : that.data.page2,
"refresh": 1,//1刷新,0加载更多
},
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res)
var data = res.data;
that.setData({
storelist: data.dataset,//活动商户数据
})
}
})
//业主说数据
wx.request({
url: app.d.hostUrl + 'home.getArticle',
data: {
"page": that.data.page1 == 0 ? 1 : that.data.page1,
"refresh": 1,//1刷新,0加载更多
},
method: 'GET',
header: {
'Accept': 'application/json'
},
success: function (res) {
console.log(res)
var data = res.data;
var designerList = [];
for (var i in data.dataset) {
if (data.dataset[i].isdesigner == 1) {
designerList.push(data.dataset[i]);
}
}
that.setData({
articlelist: data.dataset,
designerList: designerList,
})
}
})
},
onReachBottom: function () {
var that = this;
if (that.data.load) {//全局标志位,方式请求未响应是多次触发
if (that.data.listmenusCurrent == 0) {//业主说
var page = that.data.page1 + 1;
that.getmore(page, 'home.getArticle', 1);
that.setData({
page1: page
})
}
else if (that.data.listmenusCurrent == 1) {
var page = that.data.page0 + 1;
that.getmore(page, 'goods.hotGoods', 0);
that.setData({
page0: page
})
}
else if (that.data.listmenusCurrent == 2) {
var page = that.data.page2 + 1;
that.getmore(page, 'goods.hotGoods', 2);
that.setData({
page2: page
})
}
else if (that.data.listmenusCurrent == 3) {
var page = that.data.page1 + 1;
that.getmore(page, 'home.getArticle', 3);
that.setData({
page1: page
})
}
console.log(that.data.page1)
}
},
//加载更多
getmore: function (page, url, pro) {
var that = this;
that.setData({
load: false,
loading: true,//加载动画的显示
loadtxt:"加载中…"
})
console.log(page)
wx.request({
url: app.d.hostUrl + url,
data: {
"page": page,
"refresh": 0,//1刷新,0加载更多
},
success: function (res) {
console.log(res)
var data = res.data;
if (data.length == 0 || data.dataset.length == 0) {
that.setData({
loadtxt: "没有更多了"
})
}
else {
if (pro == 0) {//特惠商品
var content = that.data.tehuiList.concat(data)//将返回结果放入content
console.log(content)
that.setData({
tehuiList: content,
})
} else if (pro == 1) {//业主说
var content = that.data.articlelist.concat(data.dataset)//将返回结果放入content
console.log(content)
that.setData({
articlelist: content,
})
} else if (pro == 2) {
var content = that.data.storelist.concat(data)//将返回结果放入content
console.log(content)
that.setData({
storelist: content,
})
} else if (pro == 3) {
var designerList = [];
for (var i in data.dataset) {
if (data.dataset[i].isdesigner == 1) {
designerList.push(data.dataset[i]);
}
}
var content = that.data.designerList.concat(designerList)//将返回结果放入content
console.log(content)
that.setData({
designerList: content,
})
}
that.setData({
loadtxt: "上拉加载更多↑"
})
}
console.log(page)
that.setData({
load: true,
loading: false,
})
},
fail: function (res) {
that.setData({
loading: false,
load: true,
})
wx.showToast({
title: '数据异常',
icon: 'none',
duration: 2000,
})
},
complete: function (res) { },
})
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function (res) {
if (res.from === "button") {
console.log("来自页面内转发按钮");
console.log(res.target);
} else {
console.log("来自右上角转发菜单")
}
return {
title: '嘿,装修',
path: '/pages/index/index?shareid=' + wx.getStorageSync("openid"),
success: (res) => {
console.log("转发成功", res);
},
fail: (res) => {
console.log("转发失败", res);
}
}
},
//活动入口 根据活动日期判断活动进行的阶段 并给相应的跳转路径
activityDay:function(){
//console.log('时间段');
console.log(wx.getStorageSync('openid'));
wx.request({
url: app.d.hostUrl + 'activity.activityConf', //接口地址 判断活动时间(当前进行状态)
success: function (res) {
console.log(res.data);
if(res.data.sts == 1){
//第一阶段 报名阶段
wx.navigateTo({
url: '/pages/activity/home/home',
//url: '/pages/activity/checkedList/checkedList',//测试第二阶段
//url: '/pages/activity/finishList/finishList', //测试第三阶段
//url: '/pages/activity/contrastList/contrastList', //测试第四阶段
})
} else if (res.data.sts == 2){
//第二阶段 入选公示
wx.navigateTo({
url: '/pages/activity/checkedList/checkedList',
})
} else if (res.data.sts == 3) {
//第三阶段 装修追踪
wx.navigateTo({
url: '/pages/activity/finishList/finishList',
})
} else if (res.data.sts == 4){
//第四阶段 对比专栏
wx.navigateTo({
url: '/pages/activity/contrastList/contrastList',
})
}
}
})
},
// 活动服务通知
formid: function (e) {
//console.log('111');
//console.log(e.detail.formId); //非真机运行时 formId 应该为 the formId is a mock one
//console.log(wx.getStorageSync("openid"));
var formid = e.detail.formId;
wx.request({
url: app.d.hostUrl + 'home.collectFormID', //服务通知接口
data: {
"formid": formid,
"openid": wx.getStorageSync("openid")
},
success: function (res) {
console.log('sucess');
},
});
},
})
样式:
/**index.wxss**/
page{
font-family: "微软雅黑";
background: #f5f5f5;
}
.search{
top: 0;
left: 0;
right: 0;
z-index: 99;
}
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}
.v_icon{
display: inline-block;
padding: 4rpx 20rpx;
border-radius: 40rpx;
background: #ffd200;
margin-top: 22rpx;
}
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}
.userinfo-nickname {
color: #aaa;
}
.usermotto {
margin-top: 200px;
}
.searchView{
border: #eee 1px solid;
padding: 10rpx 20rpx;
border-radius: 10rpx;
width: 92%;
}
.searchView input{
width: 100%;
display: block;
}
swiper.swiperimage{
height: 300rpx;
}
swiper image{
border-radius: 40rpx;
width: 100%;
height: 100%;
}
swiper.swipercase{
height: 510rpx;
}
.swipercase swiper-item{
height: 90%!important;
}
.innerbox{
width:100%;
height:100%;
box-shadow: 0px 1px 10px #bbb;
border-radius: 40rpx;
overflow: hidden;
}
.case-image{
width: 100%;
height: 70%;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
swiper-item.active{
/* transition: all 400ms ease;
transform: scaleY(2)!important; */
height: 240px!important;
top: -4%;
}
.caseyuan{
width: 70rpx;
height: 70rpx;
border-radius: 70rpx;
overflow: hidden;
margin: -50rpx 0 -30rpx 40rpx;
position: relative;
padding: 15rpx;
z-index: 9;
}
.caseyuan text{
width: 100%;
height: 100%;
border-radius:100%;
line-height: 65rpx;
}
.tags text{
display: inline-block;
padding: 6rpx 24rpx;
background: #ffede2;
margin: 10rpx 10rpx;
}
.ggimg image{
width: 100%;
margin: 0;
}
.ggmaskbox{
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 9;
vertical-align: middle;
display: flex;
}
.ggmask{
display: inline-block;
margin: auto 0 auto 40rpx;
background: rgba(255, 255, 255, .8);
padding: 10rpx 50rpx;
}
.ggbtn{
display: inline-block;
padding: 10rpx 60rpx;
border-radius: 40rpx;
background: #8f7255;
}
.listmenus{
width: 25%;
}
.line{
display: inline-block;
height: 8rpx;
width: 40rpx;
}
.floatpf{
position: fixed;
top: 100rpx;
left: 0;
right: 0;
z-index: 99;
padding-bottom: 20rpx;
/* box-shadow: #aaa 0px 1px 5px; */
}
.menusOne .image{
border-radius: 40rpx;
}
.listtehui{
width: 100%;
}
.listtehui image{
width: 100%;
}
/* 活动商户图片组合 */
.imageView{
width: 100%;
}
.imageView .imageleft{
width: 68%;
height: 400rpx;
border-radius: 40rpx;
margin-right: 2%;
}
.imageright{
width: 30%;
}
.imageright image{
width: 100%;
height: 196rpx;
border-radius: 40rpx;
}
.moreimg{
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 9;
vertical-align: middle;
display: flex;
}
.moreimg text{
font-size: 75rpx;
margin: auto;
padding-bottom: 20rpx;
}
/* 设计师 */
.designerinfo{
vertical-align: middle;
}
.touxiang{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 30rpx;
margin-top: 15rpx;
}
.designerinfo .tag{
background: #ffd3b0;
padding: 6rpx 20rpx;
}
.imgurl{
width: 100%;
padding-left: 4rpx;
}
.imgurl image{
width: 31%;
margin: 30rpx 1%;
border-radius: 40rpx;
}
.imgs{
margin: 20rpx 0;
}
.imgs .images{
display: inline-block;
margin: 0rpx 9rpx;
width: 212rpx;
height: 212rpx;
border-radius: 40rpx;
overflow: hidden;
}
/* 业主说 */
.goodname{/*多行文本溢出*/
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.listhead image{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
}
.listhead text{
display: inline-block;
}
.imgs .images{
display: inline-block;
margin: 20rpx 10rpx;
width: 212rpx;
height: 212rpx;
border-radius: 40rpx;
overflow: hidden;
}
.listfoot image{
width: 34rpx;
height: 30rpx;
margin: 7rpx 10rpx 0 0;
}
.listfoot .listtag{
padding: 4rpx 20rpx;
background: #fff0e9;
}
app.js
/* @import 'common.wxss'; */
/**app.wxss**/
.container {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 200rpx 0;
box-sizing: border-box;
}
/*padding & margin */
.p_all10,.p_all15,.p_all20,.p_all30,.p_lr10,.p_lr15,.p_lr20,.p_tb10,.p_tb20,.p_tb5,.p_lr30,.p_tb15,.p_lr5{
box-sizing: border-box;
}
.p_all10{
padding: 20rpx;
}
.p_all15{
padding: 30rpx;
}
.p_all20{
padding: 40rpx;
}
.p_all30{
padding: 60rpx;
}
.p_lr10{
padding-left: 20rpx;
padding-right: 20rpx;
}
.p_tb10{
padding-top: 20rpx;
padding-bottom: 20rpx;
}
.p_tb5{
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.p_tb15{
padding-top: 30rpx;
padding-bottom: 30rpx;
}
.p_tb20{
padding-top: 40rpx;
padding-bottom: 40rpx;
}
.p_lr5{
padding-left: 10rpx;
padding-right: 10rpx;
}
.p_lr15{
padding-left: 30rpx;
padding-right: 30rpx;
}
.p_lr20{
padding-left: 40rpx;
padding-right: 40rpx;
}
.p_lr30{
padding-left: 60rpx;
padding-right: 60rpx;
}
.p_b10{padding-bottom: 20rpx;}
.p_b20{padding-bottom: 40rpx;}
.p_b50{padding-bottom: 100rpx;}
.m_t5{margin-top: 10rpx;}
.m_t10{margin-top: 20rpx;}
.m_t15{margin-top: 30rpx;}
.m_t20{margin-top: 40rpx;}
.m_t30{margin-top: 60rpx;}
.m_r5{margin-right: 10rpx;}
.m_r10{margin-right: 20rpx;}
.m_r15{margin-right: 30rpx;}
.m_r20{margin-right: 40rpx;}
.m_b10{margin-bottom: 20rpx;}
.m_b20{margin-bottom: 40rpx;}
.m_tb5{margin-top: 10rpx;margin-bottom: 10rpx;}
.m_tb10{margin-top: 20rpx;margin-bottom: 20rpx;}
.m_tb20{margin-top: 40rpx;margin-bottom: 40rpx;}
.m_lr10{margin-left:20rpx;margin-right: 20rpx;}
.m_lr20{margin-left:40rpx;margin-right: 40rpx;}
/*background & color */
.bg_white{background-color: white;}
.bg_grayf{background-color: #f5f5f5;}
.bg_graye{background-color: #eee;}
.bg_theme{background-color: #ff6000;}
.bg_lan{background-color: #343265;}
.bg_org{background-color: #ff9f00;}
.bg_black{background-color: #201e1f;}
.bg_gray9{background-color: #f9f9f9;}
.bg_grayc{background-color: #ccc;}
.bg_gray3{background-color: #333333;}
.bg_blue{background-color: #5b95ff;}
.bg_gray6{background-color: #666;}
.white{color: white;}
.blue{color: #00cafd;}
.black{color: black;}
.gray2{color: #222;}
.gray5{color: #555;}
.gray6{color: #666;}
.gray9{color: #999;}
.grayc{color: #ccc;}
.c_theme{color: #ff6000;}
.orange{color: orange;}
.yellow{color: yellow;}
.green{color: green;}
.red{color: red;}
.priceC{color: #f17f2b;}
/*font */
.font10{font-size: 20rpx;}
.font12{font-size: 24rpx;}
.font13{font-size: 26rpx;}
.font14{font-size: 28rpx;}
.font15{font-size: 30rpx;}
.font16{font-size: 32rpx;}
.font18{font-size: 36rpx;}
.font20{font-size: 40rpx;}
.font22{font-size: 44rpx;}
.font24{font-size: 48rpx;}
.font26{font-size: 52rpx;}
.font28{font-size: 56rpx;}
.fontw{font-weight: 680;}
.fontw7{font-weight: 700!important;}
/*border */
.bd_t{border-top: 1px solid #eee;}
.bd_b{border-bottom: 1px solid #eee;}
.bd_all{border: 1px solid #eee;}
.bd_tb{border-top: 1px solid #eee;border-bottom: 1px solid #eee;}
.bd_r{border-right: 1px solid #eee;}
.bd_colorC{border-color: #ccc;}
.shadowC{box-shadow: #ccc 0px 0px 15px;}
.radius5{border-radius: 10rpx;}
.radius10{border-radius: 20rpx;}
/*伪类 */
.down_ico,
.left_ico,
.right_ico{position: relative;height: 100rpx;line-height: 100rpx;}
.right_ico::after{
content: ">";
position: absolute;
height: 100rpx;
line-height: 100rpx;
top: 0;
right: 0;
color: #ccc;
font-size: 24rpx;
}
.left_ico{position: fixed;top: 0;left: 0;right: 0;z-index: 99;}
.left_ico::before{
content: "<";
position: absolute;
height: 100rpx;
line-height: 100rpx;
top: 0;
left: 10rpx;
color: #fff;
font-size: 40rpx;
/* font-weight: 600; */
}
.flex{display: flex;}
.block{display: block;}
.inline_block{display: inline-block;}
.fr{float: right;}
.fl{float:left;}
.tc{text-align: center;}
.tl{text-align: left;}
.tr{text-align: right;}
.tj{text-align: justify;}
.ti{text-indent: 40rpx;}
.lineH_s text{line-height: 30rpx;}
.lineH_m text{line-height: 50rpx;}
.lineH_l text{line-height: 80rpx;}
.lineH_xl text{line-height: 100rpx;}
.pr{position: relative;}
.pa{position: absolute;}
.pf{position: fixed;}
/*头像 */
.imglogo{width: 150rpx;height: 150rpx;border-radius: 50%;overflow: hidden;}
.imglogo-s{width: 100rpx;height: 100rpx;border-radius: 50%;overflow: hidden;}
.cl{clear: both;}
/*溢出省略 */
.ellipsis{
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
/*button */
.btn_m{
display: inline-block;
width: 80%;
padding: 30rpx 0;
text-align: center;
font-size: 32rpx;
margin: 10rpx 0;
border: solid 1px #eee;
}
/* 常用 */
.mask{
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 99;
background:rgba(0, 0, 0, .5);
}
.tip-content-dialog{
position: fixed;
display: flex;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,.5);
z-index: 99999;
}
.tip-content-dialog .tip-dialog-view{
width: 80%;
margin: auto;
border-radius: 25rpx;
vertical-align: middle;
animation: tanchu 400ms ease-in;
/* overflow: hidden; */
padding: 20rpx;
}
.tip-content-dialog .btn{
background: #f2f7fa;
}
@keyframes tanchu{
from{
transform: scale(0,0);
-webkit-transform: scale(0,0);
}
to{
transform: scale(1,1);
-webkit-transform: scale(1,1);
}
}
.tip-content-dialog .dialogClose{
position: absolute;
right:20rpx;
top: 10rpx;
width: 60rpx;
height: 60rpx;
line-height: 60rpx;
text-align: center;
}
.navigator-hover{
background-color:inherit;
color: inherit;
opacity: 1;
}
/* 评价列表 */
.commentList{
position: relative;
padding: 20rpx 20rpx 20rpx 120rpx;
background: white;
border-bottom: #eee 1px solid;
}
.commentList .userImg{/*头像*/
position: absolute;
width: 80rpx;
height: 80rpx;
border-radius: 50%;
z-index: 99;
top: 20rpx;
left: 20rpx;
}
.commentList .userName{
font-size: 28rpx;
color: #555;
/* font-weight: 600; */
}
.commentList .stars image{
width: 25rpx;
height: 25rpx;
margin-right: 6rpx;
}
.commentList .commentTxt{
line-height: 40rpx;
padding-right: 20rpx;
}
.commentList .imglist image{
width: 90rpx;
height: 90rpx;
margin: 10rpx 10rpx 0px 0px;
}
.commentList .commentreply{
background-color: #eee;
line-height: 40rpx;
}
.dialogbtn{
border: white solid 1px;
border-radius: 40rpx;
display: inline-block;
margin: 10rpx auto;
}
/* 配送进度条 */
.sliderbar{
width: 100%;
height: 12rpx;
border-radius: 12rpx;
background: white;
margin: 90rpx auto -30rpx;
}
.sliderbar .barInner{
height: 100%;
border-radius: 15rpx;
}
.sliderbar .barInner .innertar{
height: 100%;
background: orange;
border-radius: 15rpx;
animation: jindu 1s ease;
}
@keyframes jindu {
from{
width: 0rpx;
}
to{
width: 100%;
}
}
.sliderIcon{
position: absolute;
width: 90rpx;
height: 90rpx;
z-index: 9;
top: -80rpx;
}
/* 覆盖button样式 */
button.form_button{
background-color:transparent;
padding:0;
margin:0;
display:inline;
position:static;
border:0;
padding-left:0;
padding-right:0;
border-radius:0;
/* font-size:0rpx; */
color:transparent;
}
button.form_button::after{
content:'';
width:0;
height:0;
-webkit-transform:scale(1);
transform:scale(1);
display:none;
background-color:transparent;
}
/* 订单小按钮 */
.orderbtn{
display: inline-block;
border-radius:40rpx;
padding: 8rpx 30rpx;
}
.orderbtn.defult{
border: #999 1px solid;
color: #666;
}
.orderbtn.on{
border: #ff6000 1px solid;
color: #ff6000;/*themeColor*/
}
/* public footer */
.footer{
z-index: 9;
left: 0;
right: 0;
bottom: 0;
height: 100rpx;
}
/* 授权窗口 */
.isMask {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 1000;
background: #000;
opacity: 0.5;
}
.isLogin {
position: fixed;
padding: 50rpx 50rpx;
width: 480rpx;
height: 320rpx;
background: #fff;
top: 50%;
left: 50%;
margin-left: -280rpx;
margin-top: -185rpx;
z-index: 1001;
}
.isLoginBtn {
display: flex;
justify-content: space-around;
}
.isLoginBtn button {
background: #fff;
width: 100%;
height: 68repx;
padding-left: 0rpx;
padding-right: 0rpx;
margin-right: 0rpx;
margin-left: 0rpx;
font-size: 28rpx;
margin-top: 50rpx;
color: #4bad37;
}
.loginTitle {
font-size: 34rpx;
}
.loginshopImg {
height: 80rpx;
font-size: 26rpx;
padding: 20rpx 0rpx;
border-bottom: 1rpx solid #ececec;
}
.loginshopImg>image {
width: 68rpx;
height: 68rpx;
border-radius: 50%;
margin-right: 20rpx;
}
.isAgary {
display: flex;
align-items: center;
font-size: 24rpx;
color: #666;
margin-top: 30rpx;
}
.isAgary>text {
margin-right: 20rpx;
}
/* menus */
.homeMenus{
display: inline-block;
width:20% ;
}
.homeMenus image{
width: 80rpx;
height: 80rpx;
}
/* modeltitle */
.title image{
width: 40rpx;
height: 37rpx;
margin-right: 20rpx;
}