271 lines
6.8 KiB
Vue
271 lines
6.8 KiB
Vue
<template>
|
|
<view class="content">
|
|
<u-navbar :is-back="false" title="发现" :background="{ background: '#f4f4f5' }" title-color="#404133"
|
|
:title-bold="true" title-size="34" :border-bottom="false" z-index="1001">
|
|
</u-navbar>
|
|
<view style="background-color: #FFFFFF;">
|
|
<view>
|
|
<u-cell-item title="" :title-style="titleStyle" :border-bottom="showBorder(0)" :border-top="false"
|
|
@tap="linkTo(cellList[0])">
|
|
<u-icon class="u-m-r-10" slot="icon" name="/static/image/workbench/01.png" color="inherit" :size="44"></u-icon>
|
|
<view slot="title" class="u-flex u-row-left u-col-center" style="min-width: 200rpx;">
|
|
<view class="u-m-r-20">
|
|
<text>朋友圈</text>
|
|
</view>
|
|
<view class="u-flex u-row-center u-col-center" v-if="vuex_friendCircleUnreadCount>0"
|
|
style="width:36rpx;height:36rpx;background-color:#fa3534;border-radius:18rpx;font-size:28rpx;color: #ffffff;">
|
|
<text>{{vuex_friendCircleUnreadCount}}</text>
|
|
</view>
|
|
</view>
|
|
<view slot="right-icon" v-if="newCircleInfo&&newCircleInfo.userHeadImg.length>0">
|
|
<u-avatar :src="newCircleInfo.userHeadImg" mode="square" :size="70"></u-avatar>
|
|
<u-badge :is-dot="true" type="error" :offset="[20,60]"></u-badge>
|
|
</view>
|
|
</u-cell-item>
|
|
<u-gap :height="16" bg-color="#f4f4f5" v-if="showGap(0)"></u-gap>
|
|
</view>
|
|
|
|
|
|
<view v-for="(item,index) in cellList" :key="index">
|
|
<template v-if="item.hidden==false&&index!=0">
|
|
<u-cell-item :title="item.title" :title-style="titleStyle"
|
|
:border-bottom="showBorder(index)" :border-top="false"
|
|
@tap="linkTo(item)">
|
|
<u-icon :class="item.title=='购物'?'u-m-l-6 u-m-r-10':'u-m-r-10'"
|
|
slot="icon" :name="item.icon" :color="item.color" :size="item.size"></u-icon>
|
|
</u-cell-item>
|
|
<u-gap :height="16" bg-color="#f4f4f5" v-if="showGap(index)"></u-gap>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
cellList: [
|
|
{
|
|
id: 1,
|
|
title: "朋友圈",
|
|
icon: "/static/image/workbench/01.png",
|
|
color: "inherit",
|
|
bind: "/pages/workbench/friend-circle/friend-circle",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "扫一扫",
|
|
//icon: "/static/image/wx/saoyisao.png",
|
|
icon: "/static/image/workbench/04.png",
|
|
color: "#409eff",
|
|
bind: "scan",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 4,
|
|
title: "摇一摇",
|
|
//icon: "/static/image/wx/yaoyiyao.png",
|
|
icon: "/static/image/workbench/05.png",
|
|
color: "#409eff",
|
|
bind: "/pages/tabbar/find/yaoyiyao/yyy-index",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 11,
|
|
title: "看一看",
|
|
icon: "/static/image/workbench/06.png",
|
|
color: "#f29100",
|
|
bind: "",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 13,
|
|
title: "附近",
|
|
icon: "/static/image/workbench/08.png",
|
|
color: "#fab6b6",
|
|
bind: "",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 14,
|
|
title: "购物",
|
|
icon: "/static/image/workbench/09.png",
|
|
color: "#fab6b6",
|
|
bind: "taobao",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 15,
|
|
title: "游戏",
|
|
icon: "/static/image/workbench/10.png",
|
|
color: "#fab6b6",
|
|
bind: "",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 6,
|
|
title: "小程序",
|
|
//icon: "/static/image/wx/xiaochengxu.png",
|
|
icon: "/static/image/workbench/11.png",
|
|
color: "#fab6b6",
|
|
bind: "",
|
|
hidden:false,
|
|
size:44,
|
|
},
|
|
{
|
|
id: 7,
|
|
title: "ChatGpt",
|
|
icon: "/static/image/find/chatgpt.png",
|
|
color: "#ff9900",
|
|
bind: "/pages/tabbar/group/chat/chat-gpt-conversion-wss",
|
|
hidden:true,
|
|
size:64,
|
|
},
|
|
{
|
|
id: 8,
|
|
title: "AI绘画",
|
|
icon: "http://open.yjai.art/assets/logo-9a019aa3.svg",
|
|
color: "#ff9900",
|
|
bind: "/pages/tabbar/find/AI/ai-text-to-create-img/ai-text-to-create-img",
|
|
hidden:true,
|
|
size:64,
|
|
},
|
|
{
|
|
id: 9,
|
|
title: "免费听歌",
|
|
icon: "/static/image/find/MP3.png",
|
|
color: "#19BE6B",
|
|
bind: "/pages/tabbar/find/music/free-music",
|
|
hidden:true,
|
|
size:64,
|
|
}
|
|
],
|
|
titleStyle: {
|
|
marginLeft: "20rpx",
|
|
fontSize: "34rpx",
|
|
color: "#000000"
|
|
},
|
|
newCircleInfo: {
|
|
userHeadImg:""
|
|
},
|
|
};
|
|
},
|
|
onShow: function() {
|
|
this.changeDefaultAvatar(1,10);
|
|
let unreadCount= 1;//this.vuex_friendCircleUnreadCount+"";
|
|
this.localGroupApi.setTabBarBadge(2,unreadCount);
|
|
},
|
|
methods: {
|
|
changeDefaultAvatar:function(min,max){
|
|
let that=this;
|
|
that.$u.api.friendCircle.checkFriendCircleUpdate().then(res => {
|
|
if(res.code==200){
|
|
console.log("查询朋友圈更新情况",res.data);
|
|
if(res.data&&res.data.length>0){
|
|
that.newCircleInfo=res.data[0];
|
|
}else{
|
|
that.newCircleInfo=null;
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
showBorder(index){
|
|
switch (index){
|
|
case 1:
|
|
return true;
|
|
case 3:
|
|
return true;
|
|
case 5:
|
|
return true;
|
|
case 8:
|
|
return true;
|
|
default:
|
|
return false;
|
|
}
|
|
},
|
|
showGap(index){
|
|
switch (index){
|
|
case 0:
|
|
return true;
|
|
case 2:
|
|
return true;
|
|
case 4:
|
|
return true;
|
|
case 6:
|
|
return true;
|
|
case 7:
|
|
return true;
|
|
case 9:
|
|
return true;
|
|
default:
|
|
return false;
|
|
}
|
|
},
|
|
linkTo(item) {
|
|
let that = this;
|
|
let url = item.bind;
|
|
console.log("跳转链接", url);
|
|
if (url != null && url.length > 0) {
|
|
if (url == 'taobao') {
|
|
if (plus.os.name == 'Android') {
|
|
plus.runtime.launchApplication({
|
|
pname: 'com.taobao.taobao'
|
|
},
|
|
function(e) {
|
|
console.log('Open system default browser failed: ' + e.message);
|
|
}
|
|
);
|
|
} else if (plus.os.name == 'iOS') {
|
|
//抖音 snssdk1128://
|
|
plus.runtime.launchApplication({
|
|
action: 'snssdk1128://'
|
|
}, function(e) {
|
|
console.log('Open system default browser failed: ' + e.message);
|
|
});
|
|
}
|
|
} else if (url == "scan") {
|
|
this.globalUtil.scanQRcode(that, {
|
|
complete: function(res) {
|
|
console.log("扫码结果", res);
|
|
if (res.resp_code == 1000) {
|
|
let respData = res.resp_result;
|
|
that.$u.route({
|
|
url: '/pages/chat/qr-info/qr-info',
|
|
params: {
|
|
qrInfo: respData
|
|
},
|
|
animationType: 'slide-in-bottom'
|
|
});
|
|
}
|
|
},
|
|
})
|
|
} else {
|
|
console.log("url", url);
|
|
this.$u.route(url);
|
|
return;
|
|
}
|
|
}
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {}
|
|
</style>
|
|
<style>
|
|
page {
|
|
background-color: #f4f4f5 !important;
|
|
}
|
|
</style>
|