增加客服按钮新消息闪动,逻辑如下:

1、加载首页时保存一次客服消息总数,之后每5秒查询一次最新的总数并对数据进行比对,两条数据存储到localStorage中
2、切换到我的盛安页面后新增interval,每2秒调取一次数据进行比对
3、打开客服聊天离开页面时将最新的客服总数替换掉localStorage中数据
This commit is contained in:
1378012178@qq.com 2025-02-11 14:16:34 +08:00
parent 8b04e2471c
commit a3042d40d0
5 changed files with 1754 additions and 899 deletions

View File

@ -2078,7 +2078,8 @@
"pagePath": "pages/my/index",
"iconPath": "static/tabbar/bottom4_1.png",
"selectedIconPath": "static/tabbar/bottom4_2.png",
"text": "我的盛安"
"text": "我的盛安",
"badge": ""
}
]
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -154,7 +154,6 @@
this.pickVal=data.target.value;
this.pickVal2=data.target.value;
this.cityData=this.cityArr[0][this.pickVal2[0]].AreaName+'-'+this.cityArr[1][this.pickVal2[1]].AreaName+'-'+this.cityArr[2][this.pickVal2[2]].AreaName
},
//
pluginclass(e) {

View File

@ -171,19 +171,21 @@
<image style="padding: 3rpx;" src="../../static/my-gong-12.png" mode=""></image>
<span class="my-use-list-text">我是经纪人</span>
</view>
<view class="my-use-list" v-if="blIsYwy=='0'" @click="useToUrl('/pages/my/applySalesperson/index')">
<view class="my-use-list" v-if="blIsYwy=='0'" @click="useToUrl('/pages/my/applySalesperson/index')">
<image style="padding: 3rpx;" src="../../static/my-gong-14.png" mode=""></image>
<span class="my-use-list-text">申请业务员</span>
</view>
<view class="my-use-list" v-if="blIsYwy=='1'" @click="useToUrl('/pages/my/applySalesperson/mySalesperson')">
<view class="my-use-list" v-if="blIsYwy=='1'"
@click="useToUrl('/pages/my/applySalesperson/mySalesperson')">
<image style="padding: 3rpx;" src="../../static/my-gong-13.png" mode=""></image>
<span class="my-use-list-text">我是业务员</span>
</view>
<view class="my-use-list" v-if="blIsFxy=='0'" @click="useToUrl('/pages/my/applyDistributor/index')">
<view class="my-use-list" v-if="blIsFxy=='0'" @click="useToUrl('/pages/my/applyDistributor/index')">
<image style="padding: 3rpx;" src="../../static/my-gong-15.png" mode=""></image>
<span class="my-use-list-text">申请分销员</span>
</view>
<view class="my-use-list" v-if="blIsFxy=='1'" @click="useToUrl('/pages/my/applyDistributor/myDistributor')">
<view class="my-use-list" v-if="blIsFxy=='1'"
@click="useToUrl('/pages/my/applyDistributor/myDistributor')">
<image style="padding: 3rpx;" src="../../static/my-gong-16.png" mode=""></image>
<span class="my-use-list-text">我是分销员</span>
</view>
@ -191,7 +193,8 @@
<image style="padding: 3rpx;" src="../../static/my-gong-11.png" mode=""></image>
<span class="my-use-list-text">申请渠道商</span>
</view>
<view class="my-use-list" v-if="blIsQds=='1'" @click="useToUrl('/pages/my/channelMerchants/myMerchants')">
<view class="my-use-list" v-if="blIsQds=='1'"
@click="useToUrl('/pages/my/channelMerchants/myMerchants')">
<image style="padding: 3rpx;" src="../../static/my-gong-12.png" mode=""></image>
<span class="my-use-list-text">我是渠道商</span>
</view>
@ -203,7 +206,7 @@
<image style="padding: 3rpx;" src="../../static/my-gong-12.png" mode=""></image>
<span class="my-use-list-text">我是代理商</span>
</view> -->
<!-- <view class="my-use-list" @click="useToUrl('/pages/my/myteam')">
<!-- <view class="my-use-list" @click="useToUrl('/pages/my/myteam')">
<image style="padding: 3rpx;" src="../../static/my-gong-9.png" mode=""></image>
<span class="my-use-list-text">我的团队</span>
</view> -->
@ -229,10 +232,12 @@
</span>
<span v-if="item.type=='104'">/
</span>
<span v-if="item.type!='104'" style="font-size: 12px;color: #848484;= -webkit-text-decoration-line: line-through;text-decoration-line: line-through;margin-left: 5px;">
<span v-if="item.type!='104'"
style="font-size: 12px;color: #848484;= -webkit-text-decoration-line: line-through;text-decoration-line: line-through;margin-left: 5px;">
{{item.oldPrice}}
</span>
<span v-if="item.type!='104'&&(item.type=='105'||item.type=='106')" style="font-size: 12px;color: #848484;-webkit-text-decoration-line: line-through;text-decoration-line: line-through;margin-left: 5px;">
<span v-if="item.type!='104'&&(item.type=='105'||item.type=='106')"
style="font-size: 12px;color: #848484;-webkit-text-decoration-line: line-through;text-decoration-line: line-through;margin-left: 5px;">
/{{item.serviceCount?item.serviceCount:''}}
</span>
<span v-if="item.type=='104'">{{item.oldPrice}}/</span>
@ -257,7 +262,7 @@
</view>
<view class="prompt-text">-当你累了 想起盛安到家-</view>
<view class="kefu" @click="goMsg">
<image src="../../static/kefu.png" mode=""></image>
<image :class="{'blinking': haveNewMsg}" src="../../static/kefu.png" mode=""></image>
<!--<span>联系客服</span>-->
</view>
</view>
@ -293,10 +298,12 @@
vipNameType: '',
dataList: [],
tagsData: [],
blIsJjr:'',//1 0
blIsFxy:'',//1 0
blIsYwy:'',//1 0
blIsQds:'',//1 0
blIsJjr: '', //1 0
blIsFxy: '', //1 0
blIsYwy: '', //1 0
blIsQds: '', //1 0
kfInterval: null, //
haveNewMsg: false, //
}
},
onLoad(e) {
@ -329,11 +336,27 @@
this.avatar = '../../static/logo.png'
this.isVip = 0
}
this.haveNewMsg = false
if (this.kfInterval == null) {
this.kfInterval = setInterval(() => {
this.selectMsg()
}, 2000)
}
},
methods: {
danxiang(){
selectMsg() {
let keFuLastMsgCount = this.$queue.getData('keFuLastMsgCount');
let keFuNewMsgCount = this.$queue.getData('keFuNewMsgCount');
if (keFuLastMsgCount == undefined) {
if (keFuNewMsgCount != 0) this.haveNewMsg = true
} else {
if (keFuNewMsgCount != undefined && keFuNewMsgCount > keFuLastMsgCount) this.haveNewMsg = true
}
},
danxiang() {
uni.navigateTo({
url:'/pages/my/fuwuGengduo'
url: '/pages/my/fuwuGengduo'
})
},
getUserInfo() {
@ -346,13 +369,13 @@
this.avatar = res.data.avatar ? res.data.avatar : '../../static/logo.png'
this.isAuthentication = res.data.isAuthentication
this.isAgency = res.data.isAgency ? res.data.isAgency : 0; //广 1 2
this.blIsJjr=res.data.blIsJjr;//
this.blIsFxy=res.data.blIsFxy;//
this.blIsYwy=res.data.blIsYwy;//
this.blIsQds=res.data.blIsQds;//
this.blIsJjr = res.data.blIsJjr; //
this.blIsFxy = res.data.blIsFxy; //
this.blIsYwy = res.data.blIsYwy; //
this.blIsQds = res.data.blIsQds; //
this.money = res.data.money
this.couponnum = res.data.member
// uni.setStorageSync('isAuthentication', res.data.isAuthentication)
this.isShop = res.data.isShop ? res.data.isShop : 0;
uni.setStorageSync('avatar', res.data.avatar)
@ -360,7 +383,7 @@
uni.setStorageSync('invitationCode', res.data.invitationCode)
uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)
if (res.data.isAuthentication == 0 || res.data.isAuthentication == null) {
this.renzheng = 0
uni.setStorageSync("renzheng", this.renzheng)
@ -383,13 +406,13 @@
this.renzheng = 6
uni.setStorageSync("renzheng", this.renzheng)
}
}
});
},
qiye(){
qiye() {
uni.navigateTo({
url:'/pages/shop/qiyeListMy'
url: '/pages/shop/qiyeListMy'
})
},
goMsg() { //
@ -626,7 +649,7 @@
}
});
},
getIsVip() {
this.$Request.get("/app/UserVip/selectUserVip").then(res => {
@ -755,21 +778,25 @@
itemClick(item) {
let limit = 10;
let page = 1;
if(item.type=='104'){
if (item.type == '104') {
uni.navigateTo({
url:'/pages/my/serviceOderDrtail?id='+item.id+'&limit='+limit+'&page='+page+'&name='+'index'+'&isCanCoupon='+item.isCanCoupon
url: '/pages/my/serviceOderDrtail?id=' + item.id + '&limit=' + limit + '&page=' + page +
'&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
})
}else if(item.type=='105'){
} else if (item.type == '105') {
uni.navigateTo({
url:'/pages/my/cikarDrtail?id='+item.id+'&limit='+limit+'&page='+page+'&name='+'index'+'&isCanCoupon='+item.isCanCoupon
url: '/pages/my/cikarDrtail?id=' + item.id + '&limit=' + limit + '&page=' + page +
'&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
})
}else if(item.type=='106'){
} else if (item.type == '106') {
uni.navigateTo({
url:'/pages/my/fuwuliaochengDetail?id='+item.id+'&limit='+limit+'&page='+page+'&name='+'index'+'&isCanCoupon='+item.isCanCoupon
url: '/pages/my/fuwuliaochengDetail?id=' + item.id + '&limit=' + limit + '&page=' + page +
'&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
})
}else{
} else {
uni.navigateTo({
url:'/pages/my/fuwuDateil?id='+item.id+'&limit='+limit+'&page='+page+'&name='+'index'+'&isCanCoupon='+item.isCanCoupon
url: '/pages/my/fuwuDateil?id=' + item.id + '&limit=' + limit + '&page=' + page +
'&name=' + 'index' + '&isCanCoupon=' + item.isCanCoupon
})
}
}
@ -1022,7 +1049,7 @@
}
.my-serve-view {
width:86%;
width: 86%;
margin: 10px auto;
display: flex;
flex-direction: row;
@ -1032,14 +1059,14 @@
.my-use-list {
width: 33%;
margin-top:15px;
margin-top: 15px;
display: flex;
flex-direction: column;
align-items: center;
}
.my-serve-list {
width:22%;
width: 22%;
display: flex;
flex-direction: column;
align-items: center;
@ -1066,9 +1093,11 @@
margin-left: 8px;
margin-top: 5px;
}
.width {
width: 94%;
}
.my-serve {
background: #FFFFFF;
border-radius: 21rpx;
@ -1143,7 +1172,7 @@
.my-head-mian-top-view-chong,
.my-head-mian-top-view-ming {
width:260rpx;
width: 260rpx;
height: 58rpx;
line-height: 58rpx;
text-align: center;
@ -1164,7 +1193,7 @@
.my-head-mian-top-view-qian {
width: 100%;
color: #333;
background-image: linear-gradient(to left, rgba(255, 236, 222, 0.7),rgba(255, 255, 255, 0.8));
background-image: linear-gradient(to left, rgba(255, 236, 222, 0.7), rgba(255, 255, 255, 0.8));
margin: 0 auto;
border-radius: 20rpx 20rpx 0 0;
height: 76rpx;
@ -1340,4 +1369,29 @@
color: #fff;
text-align: center;
}
/* 定义闪烁动画 */
@keyframes blink {
0%,
100% {
opacity: 1;
/* 初始和结束状态透明度为1 */
}
50% {
opacity: 0.2;
/* 中间状态透明度降低 */
}
}
/* 应用动画到图片 */
.blinking {
animation: blink 1s infinite;
/* 'blink' 是动画名, '1s' 是持续时间, 'infinite' 表示无限循环 */
width: 50px;
/* 假设设置了宽度 */
height: auto;
/* 自动调整高度 */
}
</style>