276 lines
6.7 KiB
Vue
276 lines
6.7 KiB
Vue
<template>
|
||
<view class="bottoms">
|
||
<view class="box" :class="{active: aindex == 1}" @click="getgogo(1)">
|
||
<view class="imgs">
|
||
<image mode="aspectFit" src="@/static/icons/tabbar/home.png" v-show="aindex != 1"></image>
|
||
<image mode="aspectFit" src="@/static/icons/tabbar/home-checked.png" v-show="aindex == 1"></image>
|
||
</view>
|
||
<view class="">首页</view>
|
||
</view>
|
||
<view class="box" :class="{active: aindex == 2}" @click="getgogo(2)">
|
||
<view class="imgs">
|
||
<image mode="aspectFit" src="@/static/icons/tabbar/order.png" v-show="aindex != 2"></image>
|
||
<image mode="aspectFit" src="@/static/icons/tabbar/order-checked.png" v-show="aindex == 2"></image>
|
||
</view>
|
||
<view class="">{{ title }}</view>
|
||
</view>
|
||
<!-- <view class="box" :class="{active: aindex == 3}" @click="getgogo(3)">-->
|
||
<!-- <view class="imgs">-->
|
||
<!-- <image mode="aspectFit" src="@/static/icons/tabbar/my.png" v-show="aindex != 3"></image>-->
|
||
<!-- <image mode="aspectFit" src="@/static/icons/tabbar/my-checked.png" v-show="aindex == 3"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="">我的</view>-->
|
||
<!-- </view>-->
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import request from '../../utils/request';
|
||
import {
|
||
getToken,getUserInfo
|
||
} from '@/utils/auth'
|
||
let innerAudioContext ='';
|
||
// #ifdef APP || H5
|
||
const jyJPush = uni.requireNativePlugin('JY-JPush');
|
||
// #endif
|
||
export default {
|
||
data() {
|
||
return {
|
||
msgSocket: this.$msgSocket,
|
||
// 是否正在播放
|
||
ifPlay:false,
|
||
aindex: 1,
|
||
msgNum: null,
|
||
identity: 'user',
|
||
nowPageInterval: null,
|
||
userInfo:{},
|
||
arr: [{
|
||
text: '首页'
|
||
},
|
||
{
|
||
text: '消息'
|
||
},
|
||
{
|
||
text: '运力'
|
||
}
|
||
]
|
||
}
|
||
},
|
||
props: {
|
||
msg: {
|
||
type: String|Number,
|
||
default: ''
|
||
},
|
||
title: {
|
||
type: String,
|
||
default: '工单'
|
||
},
|
||
},
|
||
onLoad() {
|
||
this.userInfo = getUserInfo();
|
||
console.log('tabbag', uni.getStorageSync('identity'));
|
||
},
|
||
onUnload() {
|
||
if (this.nowPageInterval) {
|
||
clearTimeout(this.nowPageInterval);
|
||
}
|
||
},
|
||
mounted() {
|
||
// #ifdef APP || H5
|
||
this.identity = uni.getStorageSync('identity');
|
||
// #endif
|
||
if (!this.nowPageInterval) {
|
||
this.nowPageInterval = setInterval(() => {
|
||
// console.log('this.$msgSocket: ',this.$msgSocket);
|
||
this.msgSocket = this.$msgSocket
|
||
}, 3000);
|
||
}
|
||
console.log(this.aindex);
|
||
setTimeout(() => {
|
||
this.msgInfo()
|
||
}, 2000);
|
||
this.aindex = this.msg
|
||
|
||
},
|
||
watch: {
|
||
msgSocket(newVal, oldVal) {
|
||
console.log('msgSocket值发生变化', newVal, oldVal)
|
||
this.msgInfo()
|
||
},
|
||
deep: true,
|
||
},
|
||
methods: {
|
||
dianyidain() {
|
||
if(!this.ifPlay){
|
||
console.log('执行了，dianyidain');
|
||
if(innerAudioContext!=""){
|
||
try {
|
||
console.log('调用前先销毁');
|
||
innerAudioContext.stop();
|
||
innerAudioContext.destroy();
|
||
innerAudioContext="";
|
||
}catch (e){
|
||
console.log('销毁出错');
|
||
}
|
||
}
|
||
innerAudioContext = uni.createInnerAudioContext();
|
||
this.ifPlay=true
|
||
// #ifdef APP-PLUS
|
||
innerAudioContext.src = '../../static/msgV.mp3';
|
||
// #endif
|
||
// #ifndef APP-PLUS
|
||
innerAudioContext.src = 'https://www.nuoyunr.com/lananRsc/rescue/msgV.mp3';
|
||
// #endif
|
||
// 设置播放次数和计数器
|
||
const playCount = 3;
|
||
let currentCount = 0;
|
||
// 初次播放
|
||
innerAudioContext.play();
|
||
innerAudioContext.onError((err) => {
|
||
console.error('播放错误', err);
|
||
this.ifPlay=false
|
||
innerAudioContext.stop();
|
||
innerAudioContext.destroy(); // 播放错误后释放实例
|
||
});
|
||
// 监听音频播放结束事件
|
||
innerAudioContext.onEnded(() => {
|
||
// 播放计数加一
|
||
currentCount++;
|
||
// 判断是否达到播放次数上限
|
||
if (currentCount < playCount) {
|
||
// 继续播放
|
||
innerAudioContext.play();
|
||
} else {
|
||
// 播放完成，可以在这里添加额外的逻辑
|
||
console.log('播放完成');
|
||
this.ifPlay=false
|
||
//及时释放资源
|
||
innerAudioContext.stop();
|
||
innerAudioContext.destroy();
|
||
}
|
||
});
|
||
}else{
|
||
console.log('正在播放音频，拒绝播放请求');
|
||
}
|
||
},
|
||
msgInfo() {
|
||
console.log(this.msgSocket, 'msgSocket')
|
||
if (this.msgSocket) {
|
||
console.log('消息回调启动成功')
|
||
this.msgSocket.onMessage(res => {
|
||
console.log("发出提示音", res);
|
||
// this.getbottom();
|
||
this.dianyidain()
|
||
this.$emit('socketSuccess')
|
||
})
|
||
}
|
||
|
||
},
|
||
async getbottom() {
|
||
if (!getToken()) {
|
||
return
|
||
}
|
||
let res = await request({
|
||
url: '/announcement/announcement/getOwnNoRead',
|
||
method: 'get',
|
||
|
||
})
|
||
console.log('jitiao', res);
|
||
if (res.code == 200) {
|
||
this.msgNum = res.data
|
||
}
|
||
},
|
||
getgogo(index) {
|
||
const userInfo = getUserInfo()
|
||
if (index == 1) {
|
||
this.aindex = index
|
||
if (userInfo.roleCodes.includes("repair_warehouse")){
|
||
//跳转首页
|
||
uni.navigateTo({
|
||
url: '/pages-warehouse/home/home'
|
||
})
|
||
} else {
|
||
uni.reLaunch({
|
||
url: '/pages-home/home/home'
|
||
})
|
||
}
|
||
}
|
||
if (index == 2) {
|
||
this.aindex = index
|
||
uni.reLaunch({
|
||
url: '/pages-order/orderList/orderList'
|
||
})
|
||
}
|
||
if (index == 3) {
|
||
this.aindex = index
|
||
uni.reLaunch({
|
||
url: '/pages/my/my'
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.bottoms {
|
||
width: 100%;
|
||
// position: fixed;
|
||
// bottom: 0px;
|
||
background: #fff;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
padding: 12rpx 40rpx;
|
||
box-sizing: border-box;
|
||
box-shadow: 4rpx 2rpx 12rpx 0 #c3c3c3;
|
||
position: relative;
|
||
z-index: 99;
|
||
}
|
||
|
||
.box {
|
||
flex: 1;
|
||
width: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 12px;
|
||
color: #929292;
|
||
|
||
&.active {
|
||
color: #327DFB;
|
||
}
|
||
}
|
||
|
||
.imgs {
|
||
margin: 0 auto;
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.hongdian {
|
||
width: 12px;
|
||
height: 12px;
|
||
background-color: crimson;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
position: absolute;
|
||
top: -5px;
|
||
right: -8px;
|
||
z-index: 9999;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
font-size: 2px;
|
||
}
|
||
</style>
|