This commit is contained in:
xiaozhiyong
2023-03-27 16:59:37 +08:00
parent 6a9e006874
commit 21a3701c47
5 changed files with 325 additions and 129 deletions

View File

@@ -1,6 +1,6 @@
<template>
<view class="home_page_container">
<view :style="{paddingTop:styles.top+styles.height + 'px'}" class="home_page_header">
<!-- <view :style="{paddingTop:styles.top+styles.height + 'px'}" class="home_page_header">
<view class="home_page_header_title">
{{user.name?`Hi ,${user.name}` : user.userPhone?user.userPhone:'暂未设置'}}
<uni-icons @tap.stop='close()' class="iconclass" color="#ffffff" custom-prefix="iconfont"
@@ -8,9 +8,9 @@
</uni-icons>
</view>
<view class="home_page_header_identity">{{user.roles[0].roleName}}</view>
</view>
</view> -->
<view :style="{transform:`rotate(${180}deg)`}" class="home_page_menu">
<!-- <view :style="{transform:`rotate(${180}deg)`}" class="home_page_menu">
<view class="home_page_menu_name">
{{menuList[menuIndex].name?menuList[menuIndex].name:''}}
</view>
@@ -25,8 +25,8 @@
size="25"></uni-icons>
</view>
</view>
</view>
<view :style="{transform:`translateY(${Submenu?0:-433}rpx)`}" class="Submenu">
</view> -->
<!-- <view :style="{transform:`translateY(${Submenu?0:-433}rpx)`}" class="Submenu">
<view @tap.stop="jump(item)" v-if="user.authList.includes(item.lable)"
v-for="(item,index) in menuList[menuIndex].submenu" class="Submenu_item">
<view @tap.stop="collectionFn(item)" class="label">
@@ -35,28 +35,59 @@
</view>
<view class="Submenu_item_name">{{item.name}}</view>
</view>
</view> -->
<view class="header">
<view class="info-frame">
<image src="../../static/tx.png"></image>
<view>{{user.userPhone || '暂未设置'}}</view>
<view>{{user.name ||'暂未设置'}}</view>
<view>{{user.roles[0].roleName}}</view>
<uni-icons @tap.stop='close()' class="iconclass" color="#bbb" custom-prefix="iconfont"
type="iconkaiguan" size="35">
</uni-icons>
</view>
</view>
<view class="collection">
<view @tap.stop="jump(item)" v-for="(item,index) in collection" class="collection_item">
<view @tap.stop="remove(item)" class="tip">
<uni-icons custom-prefix="iconfont" color="#ffffff" type="iconchiping" size="20"></uni-icons>
</view>
<view class="collection_item_name">
<uni-icons custom-prefix="iconfont" color="#2866FF" :type="item.icon" size="30"></uni-icons>
<view class="collection_item_text">{{item.name}}</view>
<view class="domain">
<view class="item" v-for="item,index in menuList" :key="index">
<view class="title">{{item.name}}</view>
<view class="options-frame" >
<view class="option" v-for="optionItme,optionIndex in item.submenu" :key="optionIndex" @tap.stop="jump(optionItme)">
<view class="star" @tap.stop="collectionFn(optionItme)">
<uni-icons :color="iconFn(optionItme)" custom-prefix="iconfont" type="iconshoucang-yishoucang" size="18"></uni-icons>
</view>
<view class="wall">
<view class="name">{{optionItme.name}}</view>
<uni-icons color="#fff" custom-prefix="iconfont" :type="optionItme.icon" size="50"></uni-icons>
</view>
</view>
</view>
</view>
<view class="collectionbg">
<view v-for="(item,index) in 3" class="collection_itembg">
<view>
<text>点击</text>
<uni-icons style="margin-left: 10rpx;" color="#bbbbbb" custom-prefix="iconfont"
type="iconshoucang-yishoucang" size="12"></uni-icons>
</view>
<view class="collection">
<view class="collect-frame">
<template v-for="(item,index) in collection">
<view v-if="item" @tap.stop="jump(item)" class="collection_item">
<view @tap.stop="remove(item)" class="tip">
<uni-icons custom-prefix="iconfont" color="#fff" type="iconchiping" size="20"></uni-icons>
</view>
<view class="collection_item_name">
<uni-icons custom-prefix="iconfont" color="#2866FF" :type="item.icon" size="30"></uni-icons>
<view class="collection_item_text">{{item.name}}</view>
</view>
</view>
<view>收藏</view>
<!--
<view>Here</view> -->
</view>
<view v-else class="collection-empty">
<view>
<text>点击</text>
<uni-icons style="margin-left: 10rpx;" color="#bbbbbb" custom-prefix="iconfont"
type="iconshoucang-yishoucang" size="12"></uni-icons>
</view>
<view>收藏</view>
</view>
</template>
</view>
</view>
</view>
@@ -99,7 +130,6 @@
watch: {
menuIndex: (n, o) => {
console.log(n, 'menuIndex')
},
collection: function(n, o) {
uni.setStorageSync('collection', n);
@@ -117,20 +147,20 @@
url: '../login/login?type=1'
})
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
jump(e) {
console.log(e.router)
uni.navigateTo({
url: e.router,
})
return
if (this.user.authList.includes(e.lable)) {
uni.navigateTo({
url: e.router,
fail(e) {
console.log('失败')
},
})
} else {
uni.showToast({
@@ -139,47 +169,44 @@
})
}
},
remove(e) {
let indexk;
this.collection.forEach((item, index) => {
if (e.name == item.name) {
indexk = index
}
})
this.collection.splice(indexk, 1);
remove(item) {
let index = this.collection.findIndex(i => i.name === item.name)
this.$set(this.collection,index,'')
},
iconFn(e) {
return this.collection.filter((item) => e.name == item.name).length == 0 ? '#bbbbbb' : '#FFB730';
},
initFn() {
this.menuList = JSON.parse(JSON.stringify(menus))
this.menuList.forEach((item, index) => {
item = Object.assign(item, this.circularPositioning(index));
})
this.trackingPosition.x = this.menuList[0].x;
this.trackingPosition.y = this.menuList[0].y;
this.collection = uni.getStorageSync('collection') || [];
// this.menuList.forEach((item, index) => {
// item = Object.assign(item, this.circularPositioning(index));
// })
// this.trackingPosition.x = this.menuList[0].x;
// this.trackingPosition.y = this.menuList[0].y;
this.collection = uni.getStorageSync('collection') || ['','',''];
this.user = uni.getStorageSync('user');
},
collectionFn(e) {
console.log(this.collection)
if (this.collection.length == 0) {
this.collection.unshift(e)
} else {
let repeatTest = this.collection.filter((item) => e.name == item.name).length == 0 ? true : false;
if (repeatTest) {
if (this.collection.length >= 3) {
this.collection.splice(this.collection.length - 1, 1)
}
this.collection.unshift(e)
} else {
this.remove(e)
// uni.showToast({
// title:'无需重复添加',
// icon:'none'
// })
}
collectionFn(item) {
let isHave = this.collection.find(i => i.name === item.name)
// 是否已收藏
if(isHave) {
this.remove(item)
return
}
let isHaveEmptyIndex = this.collection.findIndex(i => i === '')
// 是否有空余的收藏位置
if(isHaveEmptyIndex !== -1) {
this.$set(this.collection,isHaveEmptyIndex,item)
return
}
if(this.collection.length === 3) {
//如果收藏满了 栈底推出
this.collection.pop()
}
//栈顶推入
this.collection.unshift(item)
},
gestureAnalysis(e) {},
indexDis(e) {
@@ -203,46 +230,10 @@
}, 500);
},
menuClick(index) {
// let newList = []
// // let arrayList = this.menuList.length
// let arrayList = 8
// let alient = 0
// if (arrayList % 2 == 0){
// alient = Math.floor(arrayList/2)
// }else{
// alient = Math.floor(arrayList/2)+1
// }
// let bbb = 7;
// index =6;
// console.log("index:{}alient:{},menuIndex{}arrayList{}",index,alient,bbb,arrayList);
// // // 计算当前坐标点和目标左边点差值0
// for(let i = 0; i <= arrayList-1; i++){
// let aaa = bbb;
// if(i<=alient){
// aaa = bbb-(alient-i);
// if(aaa < 0){
// aaa = arrayList-aaa
// console.log("1inde:{},aaa:{}",i,aaa)
// }else{
// console.log("2inde:{},aaa:{}",i,aaa)
// }
// }else{
// aaa = bbb+(i-alient);
// if(aaa >= arrayList){
// aaa = aaa-arrayList
// console.log("3inde:{},aaa:{}",i,aaa)
// }else{
// console.log("4inde:{},aaa:{}",i,aaa)
// }
// }
// }
// // NO=8
this.Submenu = false
let average = 360 / this.menuList.length;
this.trackingPosition.angle = index * average;
this.trackingPosition.fangle = -this.trackingPosition.angle;
// this.menuIndex = null
if (this.menuList[this.menuIndex].colorOpen) {
this.menuList[this.menuIndex].colorOpen = false
}