<template>
|
<view class="page-container index">
|
<image class="page-bg" src="@/static/imgs/index-top.png" mode="scaleToFill"></image>
|
<view class="content" style="padding-bottom: 200rpx;">
|
<!-- #ifdef APP-PLUS -->
|
<view class="uni-popup" :style="{top:isNativeHead?'':StatusBar}" v-if="contactsFlag">
|
<view class="ani uni-custom uni-popup__wrapper">
|
<view class="uni-popup__wrapper-box">
|
<view class="title">通讯权限</view>
|
<view class="content">便于实现好友推荐、联系人同步等功能</view>
|
<view class="btn-group">
|
<button class="cancel-btn" @click="handleReject">拒绝</button>
|
<button class="allow-btn" @click="handleAuthorize">允许</button>
|
</view>
|
</view>
|
</view>
|
</view>
|
<!-- #endif -->
|
<view class="hLogo">
|
<view class="hLogoView">
|
<view class="hLogo-1">
|
<image class="h-logo" src="/static/imgs/index-logo.png" mode=""></image>
|
</view>
|
<view class="hLogo-2" @tap="$util.goPages('../search/search')">
|
<image class="s-icon" src="/static/imgs/search.png" mode=""></image>
|
<input type="text" placeholder="请搜索您想要的商品" />
|
<view class="s-btn">搜索</view>
|
</view>
|
</view>
|
</view>
|
<!-- nav1 -->
|
<view class="cates" v-if="catesNavData">
|
<view class="cates-v" v-for="(item, index) in catesNavData" :key="item.id" @tap="$util.goPages('/pages/catesList/catesList?catesId=' + item.id + '&title=' + item.title)">
|
<image class="cates-v-icon" :src="item.icon" mode=""></image>
|
<view class="">{{item.title}}</view>
|
</view>
|
<!-- <view class="cates-v" @tap="$util.goSwitch('/pages/cates/cates')">
|
<image class="cates-v-icon" src="/static/imgs/more.png" mode=""></image>
|
<view class="">更多</view>
|
</view> -->
|
</view>
|
<!-- nav2-横向滚动 -->
|
<!-- <view v-if="catesNavData" style="padding: 0 30rpx;background-color: #ffffff;margin-top: 422rpx;">
|
<uv-scroll-list indicatorColor="#fff0f0" indicatorActiveColor="#1735C0">
|
<view class="cates-v-s" v-for="(item, index) in catesNavData" :key="item.id" @tap="$util.goPages('/pages/catesList/catesList?catesId=' + item.id + '&title=' + item.title)">
|
<image class="cates-v-s-icon" :src="item.icon" mode="heightFix"></image>
|
<view class="">{{item.title}}</view>
|
</view>
|
</uv-scroll-list>
|
</view> -->
|
|
<!-- <view class="ad1" @tap="$util.goPages('/pages/catesList/catesList?catesId=11' + '&title=' + '服装鞋包')">
|
<image src="/static/imgs/ad1.png" mode=""></image>
|
</view> -->
|
|
<view class="ad2" @tap="$util.goPages('/pages/catesList/catesList?catesId=3' + '&title=' + '手机数码')">
|
<image src="/static/imgs/ad2.png" mode=""></image>
|
</view>
|
|
<view v-if="catesGoodsData" style="padding: 0 30rpx;background-color: #ffffff;margin-top: 0rpx;">
|
<uv-scroll-list :indicator="false" indicatorColor="#fff0f0" indicatorActiveColor="#1735C0">
|
<view class="cates-v-goods-s" v-for="(item, index) in catesGoodsData" :key="item.id" @click="$util.goPages('/pages/ginfo/ginfo?id=' + item.id)">
|
<image class="cates-v-goods-s-icon" :src="item.icon" mode="heightFix"></image>
|
<view class="cates-v-goods-title">{{item.title}}</view>
|
</view>
|
</uv-scroll-list>
|
</view>
|
|
<view class="d3-wrap">
|
<view class="ad3" @tap="$util.goPages('/pages/catesList/catesList?catesId=3' + '&title=' + '手机数码')">
|
<image src="/static/imgs/ad3.png" mode=""></image>
|
</view>
|
|
<view class="ad4" @tap="$util.goPages('/pages/catesList/catesList?catesId=2' + '&title=' + '家用电器')">
|
<image src="/static/imgs/ad4.png" mode=""></image>
|
</view>
|
<!-- <view class="ad4" @tap="$util.goPages('/pages/catesList/catesList?catesId=4' + '&title=' + '美妆个护')">
|
<image src="/static/imgs/ad4.png" mode=""></image>
|
</view> -->
|
</view>
|
|
<!-- <view class="c-goods" v-if="hotCates" v-for="(item, index) in hotCates">
|
<view class="ca-ad" v-if="index % 2 == 0">
|
<image src="/static/imgs/c1.png" mode=""></image>
|
</view>
|
<view class="ca-ad" v-else>
|
<image src="/static/imgs/c2.png" mode=""></image>
|
</view>
|
<view class="cGoods">
|
<scroll-view class="scroll-view_H" scroll-x="true">
|
<view class="scroll-view-item_H" v-for="(itm, index) in item.goods" @tap="$util.goPages('/pages/ginfo/ginfo?id=' + itm.id)">
|
<image lazy-load class="goods-icon" :src="itm.icon" mode=""></image>
|
<view class="goods-title">{{itm.title}}</view>
|
<view class="goods-price">
|
<view>¥</view>
|
<view class="red">{{itm.price}}</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
</view> -->
|
<!-- <view class="c-goods" v-if="hotGoods">
|
<view class="cGoods">
|
<scroll-view class="scroll-view_H" scroll-x="true">
|
<view class="scroll-view-item_H" v-for="(itm, index) in hotGoods" @tap="$util.goPages('/pages/ginfo/ginfo?id=' + itm.id)">
|
<image lazy-load class="goods-icon" :src="itm.icon" mode=""></image>
|
<view class="goods-title">{{itm.title}}</view>
|
<view class="goods-price">
|
<view>¥</view>
|
<view class="red">{{itm.price}}</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
</view> -->
|
<!-- 分类展示一 -->
|
<!-- <view class="cateNav">
|
<view class="cateNav-item" :class="{active:actIndex===index}" v-for="(item, index) in cateNavList" :key="index" @click="navClick(item,index)">
|
<view class="cateNav-title">{{item.title}}</view>
|
<view class="cateNav-desc">{{item.desc}}</view>
|
</view>
|
</view> -->
|
<!-- 分类展示二 -->
|
<view class="cateNav-t">
|
<view class="cateNav-t-item" :class="{active:actIndex===index}" v-for="(item, index) in cateNavListt" :key="index" @click="navClick(item,index)">
|
<view class="cateNav-t-title">{{item.title}}</view>
|
<!-- <view class="cateNav-t-desc">{{item.desc}}</view> -->
|
<image v-show="actIndex===index" class="cateNav-t-icon" src="/static/imgs/cateNavIcon.png" mode="heightFix"></image>
|
</view>
|
</view>
|
<view class="goods-main">
|
<view class="goods-main-view">
|
<view class="goods-list">
|
<view class="goods-item" v-for="(itm, index) in goodsData" @click="$util.goPages('/pages/ginfo/ginfo?id=' + itm.id)">
|
<image lazy-load class="goods-icon" :src="itm.icon" mode=""></image>
|
<view class="goods-title">{{itm.title}}</view>
|
<view class="goods-price">
|
<view>¥</view>
|
<view class="red">{{itm.price}}</view>
|
<!-- <view class="hyj">
|
<image src="@/static/imgs/hyj.png" mode=""></image>
|
</view> -->
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="login-desc" v-if="!userInfo" @tap="$util.goPages('../login/login')">
|
<image class="login-icon" src="/static/imgs/logo-icon.png" mode=""></image>
|
<view class="login-font">登录鹿不选，打开美好生活</view>
|
<view class="login-btn">立即登录</view>
|
</view>
|
</view>
|
|
<uni-popup ref="popup2" type="center" :is-mask-click="false">
|
<view class="popup-content">
|
<view class="edu-view edu-view2">
|
<view class="edu-view-desc2">认证领取额度</view>
|
<image class="edu-icon-succ" src="/static/imgs/auths.png" mode=""></image>
|
<view class="edu-view-desc3">
|
请您先认证个人信息，然后立即领取额度
|
</view>
|
<view class="edu-btns" @tap="go_auth">立即领取</view>
|
<!-- <view class="edu-btns" @tap="$util.goPages('/pages/idcard/idcard')">立即领取</view> -->
|
</view>
|
</view>
|
</uni-popup>
|
</view>
|
</template>
|
|
<script>
|
import permision from "@/js_sdk/wa-permission/permission.js"
|
export default {
|
props: {
|
// 开启动画
|
animation: {
|
type: Boolean,
|
default: true
|
},
|
type: {
|
type: String,
|
default: 'top'
|
},
|
//是否是原生头部
|
isNativeHead:{
|
type: Boolean,
|
default: true
|
},
|
},
|
data() {
|
return {
|
indicator: true,
|
contactsFlag: false,
|
staHeight: 0,
|
paddingHeight: 0,
|
indicatorDots: true,
|
indicatorColor: '#1735C0',
|
indicatorActiveColor: '#ffffff',
|
autoplay: true,
|
interval: 3000,
|
duration: 500,
|
bannerData: [],
|
catesNavData: [],
|
catesGoodsData: [],
|
catesHotData: [],
|
userInfo: null,
|
config: null,
|
statusBarHeight: 30,
|
StatusBar: 0,
|
hotGoods: null,
|
newGoods: null,
|
hotCates: null,
|
catesId: 0,
|
is_hot: '',
|
pageIndex: 1,
|
pageSize: 10,
|
goodsData: [],
|
cateNavList: [
|
{
|
title: '人气',
|
desc: '好物精选',
|
skey: '家用电器',
|
catesId: 2,
|
},{
|
title: '精选',
|
desc: '猜你喜欢',
|
skey: '服装鞋包',
|
catesId: 15,
|
},{
|
title: '休闲',
|
desc: '天天低价',
|
skey: '美妆个护',
|
catesId: 4,
|
},{
|
title: '母婴',
|
desc: '热门榜单',
|
skey: '母婴童玩',
|
catesId: 5,
|
},
|
],
|
cateNavListt: [
|
{
|
title: '今日推荐',
|
desc: '好物精选',
|
skey: '家用电器',
|
catesId: 2,
|
},{
|
title: '天天低价',
|
desc: '猜你喜欢',
|
skey: '服装鞋包',
|
catesId: 15,
|
},{
|
title: '好物精选',
|
desc: '天天低价',
|
skey: '美妆个护',
|
catesId: 4,
|
},{
|
title: '热门榜单',
|
desc: '热门榜单',
|
skey: '母婴童玩',
|
catesId: 5,
|
},
|
],
|
actIndex: 0,
|
}
|
},
|
onShow() {
|
this.getData()
|
this.getConfig()
|
this.getUserInfo()
|
// #ifdef APP-PLUS
|
plus.navigator.setStatusBarBackground('transparent');
|
// #endif
|
},
|
created() {
|
this.catesId = this.cateNavList[0]['catesId']
|
this.catesGoods()
|
this.getCatesGoods()
|
},
|
onLoad() {
|
const systemInfo = uni.getSystemInfoSync();
|
this.statusBarHeight = systemInfo.statusBarHeight || 30;
|
},
|
onReady() {
|
// #ifdef APP-PLUS
|
this.getSystemInfo();
|
// #endif
|
},
|
mounted() {
|
},
|
methods: {
|
navClick(data,index) {
|
this.actIndex = index;
|
this.catesId = data.catesId
|
this.catesGoods()
|
},
|
//获取分类商品
|
catesGoods(){
|
this.$util.post('Goods/getCatesGoods', {catesId: this.catesId, is_hot: this.is_hot, pageIndex: this.pageIndex, pageSize: this.pageSize}).then(res => {
|
if(res.code == 1) {
|
this.goodsData = res.data.list
|
}
|
})
|
},
|
//获取某个分类商品：is_hot=是否热门，is_pref=是否优选，is_fenqi=是否分期，sort=排序
|
getCatesGoods(){
|
this.$util.post('Goods/getCatesGoods', {catesId: 3, is_hot: 'true', pageIndex: this.pageIndex, pageSize: this.pageSize}).then(res => {
|
if(res.code == 1) {
|
this.catesGoodsData = res.data.list
|
console.log('啦啦啦',this.catesGoodsData)
|
}
|
})
|
},
|
//获取状态栏高度
|
getSystemInfo() {
|
let _this = this;
|
uni.getSystemInfo({
|
success: function(e) {
|
_this.StatusBar = e.statusBarHeight + 'px'; //用于自定义头部时，给手机状态栏留出位置,可通过isNativeHead这个参数控制
|
}
|
})
|
},
|
getConfig() {
|
let t = this
|
t.$util.post('Index/getConfig').then(res => {
|
if(res.code == 1) {
|
console.log('config', res.data)
|
t.config = res.data
|
}
|
})
|
},
|
getUserInfo () {
|
let t = this
|
t.$util.post('User/getUser').then(res => {
|
console.log(res);
|
if(res.code == 1){
|
this.userInfo = res.data
|
if(res.data.over_auth == 0 && t.config.put_open == 2){
|
setTimeout(() => {
|
//t.$refs.popup2.open()
|
}, 100)
|
}
|
// if(res.data.contacts == 0 && uni.getSystemInfoSync().platform == 'android'){
|
// // t.contactsFlag = !t.contactsFlag
|
// t.requestAndroidPermission('android.permission.READ_CONTACTS')
|
// }
|
}
|
})
|
},
|
handleAuthorize() {
|
this.contactsFlag = false;
|
this.requestAndroidPermission('android.permission.READ_CONTACTS')
|
},
|
// 4. 手动点击“拒绝”按钮
|
handleReject() {
|
this.contactsFlag = false;
|
uni.showToast({ title: '已拒绝通讯录权限', icon: 'none' });
|
// 可根据业务需求处理拒绝后的逻辑（如限制功能使用）
|
},
|
go_auth () {
|
let goUrl = ''
|
if(this.userInfo.idcard_auth == 0){
|
goUrl = '/pages/idcard/idcard'
|
} else if(this.userInfo.face_auth == 0){
|
goUrl = '/pages/face/face'
|
} else if(this.userInfo.job_auth == 0){
|
goUrl = '/pages/job/job'
|
} else if(this.userInfo.bank_auth == 0){
|
goUrl = '/pages/addBank/addBank?backUrl=/pages/edu/edu'
|
}
|
console.log(goUrl);
|
if(goUrl != '') {
|
uni.navigateTo({
|
url: goUrl
|
})
|
}else{
|
this.$refs.popup2.close()
|
uni.showToast({
|
title: '无法认证!',
|
icon: 'error'
|
})
|
}
|
},
|
goLingqu () {
|
if(!this.userInfo){
|
return uni.showToast({
|
title: '请先登录!',
|
icon: 'error'
|
})
|
}
|
if(this.userInfo && this.userInfo.over_auth == 1) {
|
return uni.showToast({
|
title: '您已完成认证!',
|
icon: 'success'
|
})
|
}
|
let goUrl = ''
|
if(this.userInfo.idcard_auth == 0){
|
goUrl = '/pages/idcard/idcard'
|
} else if(this.userInfo.face_auth == 0){
|
goUrl = '/pages/face/face'
|
} else if(this.userInfo.job_auth == 0){
|
goUrl = '/pages/job/job'
|
} else if(this.userInfo.bank_auth == 0){
|
goUrl = '/pages/addBank/addBank?backUrl=/pages/edu/edu'
|
} else {
|
return uni.showToast({
|
title: '您已完成认证!',
|
icon: 'success'
|
})
|
}
|
if(goUrl != '') {
|
uni.navigateTo({
|
url: goUrl
|
})
|
}
|
},
|
async requestAndroidPermission(permisionID) {
|
let t = this
|
let result = await permision.requestAndroidPermission(permisionID)
|
if (result == 1) {
|
t.setContacts()
|
} else if (result == 0) {
|
this.$util.goSetting()
|
} else {
|
this.$util.goSetting()
|
}
|
},
|
getData () {
|
this.$util.post('Goods/getIndexData').then(res => {
|
console.log('getIndexData',res)
|
this.bannerData = res.data.bannerData
|
this.catesNavData = res.data.catesNavData
|
this.catesHotData = res.data.catesHotData
|
this.hotGoods = res.data.hotGoods
|
this.newGoods = res.data.newGoods
|
this.hotCates = res.data.hotCates
|
})
|
},
|
setContacts () {
|
uni.showLoading({
|
title: '授权中...'
|
})
|
let self = this
|
plus.contacts.getAddressBook(plus.contacts.ADDRESSBOOK_PHONE, addressbook => {
|
addressbook.find(["displayName","phoneNumbers"],function(contacts){
|
let ob = []
|
let phone = []
|
for(let i in contacts){
|
let json = {}
|
if(contacts[i].phoneNumbers.length > 0 && contacts[i].displayName){
|
if(phone.indexOf(contacts[i].phoneNumbers[0].value) < 0){
|
json.name = contacts[i].displayName
|
json.phone = contacts[i].phoneNumbers[0].value
|
phone = phone.concat(json.phone)
|
ob = ob.concat(json)
|
}
|
}
|
}
|
|
if(ob.length > 0){
|
self.$util.post('Contacts/setContacts', ob).then(res => {
|
uni.hideLoading()
|
uni.showToast({
|
title: res.msg || '授权成功!',
|
icon: 'success',
|
})
|
})
|
}
|
uni.hideLoading()
|
})
|
},
|
function (e){
|
this.requestAndroidPermission('android.permission.READ_CONTACTS')
|
})
|
},
|
}
|
}
|
</script>
|
|
<style>
|
@import url(@/static/css/index.css);
|
</style>
|
<style lang="scss">
|
// 分类展示一
|
.cateNav {
|
display: flex;
|
justify-content: center;
|
gap: 30rpx;
|
margin-top: 40rpx;
|
margin-bottom: 30rpx;
|
.cateNav-item {
|
width: 20%;
|
text-align: center;
|
.cateNav-title {
|
color: #333333;
|
font-weight: bold;
|
font-size: 32rpx;
|
}
|
.cateNav-desc {
|
color: #666666;
|
font-size: 24rpx;
|
}
|
}
|
.cateNav-item.active {
|
.cateNav-title {
|
color: #1735C0;
|
}
|
.cateNav-desc {
|
color: #ffffff;
|
background-color: #1735C0;
|
border-radius: 50rpx;
|
padding: 12rpx 0;
|
}
|
}
|
}
|
// 分类展示二
|
.cateNav-t {
|
display: flex;
|
justify-content: center;
|
gap: 30rpx;
|
margin-top: 40rpx;
|
margin-bottom: 30rpx;
|
.cateNav-t-item {
|
width: 20%;
|
text-align: center;
|
.cateNav-t-title {
|
color: #333333;
|
font-weight: bold;
|
font-size: 32rpx;
|
}
|
.cateNav-t-icon {
|
width: 62rpx;
|
height: 18rpx;
|
}
|
.cateNav-t-desc {
|
color: #666666;
|
font-size: 24rpx;
|
}
|
}
|
.cateNav-t-item.active {
|
.cateNav-t-title {
|
color: #1735C0;
|
font-size: 34rpx;
|
}
|
.cateNav-t-desc {
|
color: #ffffff;
|
background-color: #1735C0;
|
border-radius: 50rpx;
|
padding: 12rpx 0;
|
}
|
}
|
}
|
.uni-popup {
|
position: fixed;
|
top: 0;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
z-index: 99999;
|
overflow: hidden;
|
&__wrapper {
|
position: absolute;
|
z-index: 9999999;
|
/* #ifndef APP-NVUE */
|
box-sizing: border-box;
|
/* #endif */
|
&.ani {
|
/* #ifndef APP-NVUE */
|
transition: all 0.3s;
|
/* #endif */
|
}
|
&.top {
|
top: 0;
|
width:705rpx;
|
/* #ifdef APP-NVUE */
|
left:22.5rpx;
|
/* #endif */
|
/* #ifndef APP-NVUE */
|
left:0;
|
transform: translateY(-705rpx);
|
/* #endif */
|
}
|
&-box {
|
position: relative;
|
/* #ifndef APP-NVUE */
|
box-sizing: border-box;
|
/* #endif */
|
}
|
&.uni-custom {
|
& .uni-popup__wrapper-box {
|
width: 705rpx;
|
/* #ifndef APP-NVUE */
|
margin: 0 22.5rpx;
|
/* #endif */
|
padding: 30upx;
|
background: #fff;
|
z-index:9999;
|
border: solid 2rpx #ddd;
|
/* #ifndef APP-NVUE */
|
box-sizing: border-box;
|
/* #endif */
|
border-radius: 16rpx;
|
.title{
|
font-size: 32rpx;
|
font-weight: bold;
|
}
|
.content{
|
margin-top: 16rpx;
|
line-height: 1.6;
|
}
|
}
|
&.top{
|
& .uni-popup__wrapper-box {
|
width: 705rpx;
|
}
|
}
|
}
|
&.uni-top{
|
transform: translateY(0);
|
}
|
}
|
}
|
</style>
|
