<!--主界面 -->
|
<template>
|
<view class="u-demo">
|
<view class="u-demo-wrap">
|
<view class="u-demo-title">
|
<!-- <image src="/static/image/logo.png" style="height: 70rpx; width: 80%;"></image> -->
|
</view><!-- 欢迎使用AISIN-PDA -->
|
<view class="u-demo-area">
|
<swiper class="swiper" @change="change">
|
<swiper-item v-for="(item,index) in pages">
|
<u-grid :col="3" v-if="index==0" :border="border">
|
<u-grid-item v-for="(temp,d) in item.pages" @click="itemClick(temp.url,temp.menu)">
|
<image :src="temp.image" class="thisImage"></image>
|
<view class="grid-text">{{temp.name}}</view>
|
</u-grid-item>
|
</u-grid>
|
<u-grid :col="2" v-else :border="border">
|
<u-grid-item v-for="(temp,d) in item.pages" @click="itemClick(temp.url,temp.menu)">
|
<image :src="temp.image" class="thisImage"></image>
|
<view class="grid-text">{{temp.name}}</view>
|
</u-grid-item>
|
</u-grid>
|
</swiper-item>
|
|
</swiper>
|
</view>
|
</view>
|
</view>
|
|
</view>
|
</template>
|
|
<script>
|
var _this;
|
export default {
|
data() {
|
return {
|
list: ['integral', 'kefu-ermai', 'coupon', 'gift', 'scan', 'pause-circle', 'wifi', 'email', 'list'],
|
isSwiper: true, //是否可滑动
|
current: 0, //当前下标
|
border: true, //显示虚线
|
pages: [],
|
};
|
},
|
methods: {
|
click(index) {},
|
change(e) {
|
this.current = e.detail.current;
|
},
|
//针对单个grid-item的事件
|
itemClick(reqUrl, menu) {
|
// uni.navigateTo({
|
// url: reqUrl
|
// });
|
this.$u.route({
|
url: reqUrl + "?Menu=" + JSON.stringify(menu)
|
})
|
}
|
},
|
mounted() {
|
_this = this;
|
this.pages = [];
|
this.$AjaxRequest.Params('post', 'menu/getTreeMenu', {
|
|
}, this.$UserTool.UserInfo.token);
|
this.$AjaxRequest.Request().then(function(result) {
|
let data = result.data;
|
//console.log(data);
|
|
if (null != data && data.length > 0) {
|
let currentTreeMenu = data.filter(r => r.parentId === 1179);
|
// console.log(JSON.stringify(currentTreeMenu));
|
if (null != currentTreeMenu && currentTreeMenu.length > 0) {
|
// currentTreeMenu.sort(function(a, b) {
|
// return a.id - b.id
|
// });
|
let obj = {}; //导航对象
|
let page = 0; //页数
|
for (var i = 0; i < currentTreeMenu.length; i++) {
|
if (i < 9)
|
page = 0;
|
else if (i >= 9 && i < 15)
|
page = 1;
|
else
|
page = 2;
|
obj = _this.pages.find(r => r.index == page);
|
if (null == obj)
|
_this.pages.push({
|
index: page,
|
pages: [{
|
name: currentTreeMenu[i].name,
|
url: currentTreeMenu[i].url,
|
image: currentTreeMenu[i].icon,
|
menu: currentTreeMenu[i].permission
|
}]
|
});
|
else
|
obj.pages.push({
|
name: currentTreeMenu[i].name,
|
url: currentTreeMenu[i].url,
|
image: currentTreeMenu[i].icon,
|
menu: currentTreeMenu[i].permission
|
});
|
}
|
}
|
}
|
|
}).catch(function(err) {
|
uni.showToast({
|
icon: 'none',
|
title: "请求后台异常,错误信息." + err.errMsg,
|
duration: 2000
|
});
|
});
|
}
|
};
|
</script>
|
|
<style scoped lang="scss">
|
.grid-text {
|
font-size: 28rpx;
|
margin-top: 4rpx;
|
color: $u-type-info;
|
}
|
|
.badge-icon {
|
position: absolute;
|
width: 40rpx;
|
height: 40rpx;
|
}
|
|
.swiper {
|
height: 710rpx;
|
}
|
|
.indicator-dots {
|
margin-top: 40rpx;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.indicator-dots-item {
|
background-color: $u-tips-color;
|
height: 6px;
|
width: 6px;
|
border-radius: 10px;
|
margin: 0 3px;
|
}
|
|
.indicator-dots-active {
|
background-color: $u-type-primary;
|
}
|
|
.thisImage {
|
width: 150rpx;
|
height: 150rpx;
|
}
|
</style>
|
